:root{
  --bg:#ffffff;--text:#111827;--muted:#6b7280;--border:#e5e7eb;--card:#ffffff;
  --accent:#f59e0b;--success:#10b981;--danger:#ef4444;--shadow:0 4px 24px rgba(0,0,0,.06);
}
[data-theme="dark"]{
  --bg:#0b0f16;--text:#e5e7eb;--muted:#9ca3af;--border:#1f2937;--card:#0f1520;
  --accent:#fbbf24;--success:#34d399;--danger:#f87171;--shadow:0 6px 28px rgba(0,0,0,.35);
}

*{box-sizing:border-box}
body{
  margin:0;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;
  background:var(--bg);color:var(--text);transition:background .5s ease,color .5s ease;
}
.container{max-width:980px;margin:0 auto;padding:0 16px 80px}

/* HEADER & NAV */
header{
  position:sticky;top:0;z-index:20;background:var(--bg);
  border-bottom:1px solid var(--border);backdrop-filter:saturate(130%) blur(6px);
}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:10px 0}
.brand{display:flex;align-items:center;gap:10px}
.logo{width:28px;height:28px;border-radius:8px;background:var(--accent);color:#1f2937;display:grid;place-items:center;font-weight:900}
.site{font-weight:800;text-decoration:none;color:var(--text)}
.theme-toggle{
  border:1px solid var(--border);border-radius:10px;background:var(--card);
  width:40px;height:40px;font-size:18px;display:grid;place-items:center;cursor:pointer;
  transition:transform .25s ease
}
.theme-toggle:hover{transform:rotate(25deg)}

/* sağ blok */
.header-right{display:flex;align-items:center;gap:10px}

/* profil düğmesi */
.profile-btn{
  width:40px;height:40px;border-radius:50%;
  background:#4f46e5;color:#fff;font-weight:900;font-size:16px;
  display:grid;place-items:center;cursor:pointer;border:none;outline:none;
  box-shadow:0 3px 12px rgba(0,0,0,.25);
  transition:transform .2s ease,box-shadow .2s ease;
  -webkit-tap-highlight-color:transparent;
  background-clip:padding-box;
}
.profile-btn:hover{transform:scale(1.08);box-shadow:0 4px 16px rgba(0,0,0,.35)}
.profile-btn:focus-visible{outline:3px solid var(--accent);outline-offset:2px;border-radius:999px}

/* profil menüsü */
.profile-wrap{position:relative;display:inline-block}
.profile-menu{
  position:absolute;right:0;top:48px;min-width:220px;max-height:80vh;overflow:auto;
  border:1px solid var(--border);background:var(--card);color:var(--text);
  border-radius:12px;box-shadow:var(--shadow);padding:6px;z-index:100;
}
.menu-item{
  display:flex;align-items:center;gap:8px;width:100%;
  border:0;background:transparent;color:inherit;text-decoration:none;
  padding:10px 12px;border-radius:10px;cursor:pointer;font:inherit;text-align:left
}
.menu-item:hover{background:rgba(0,0,0,.06)}
[data-theme="dark"] .menu-item:hover{background:rgba(255,255,255,.06)}
.menu-item.danger{color:var(--danger);font-weight:700}

/* NAV */
.topnav{display:flex;gap:16px;align-items:center;justify-content:center;padding:8px 0 10px}
.topnav a{color:var(--text);text-decoration:none;font-weight:600;padding:6px 10px;border-radius:8px}
.topnav a:hover{background:color-mix(in srgb,var(--accent) 14%,transparent)}

/* ===== BANNER ===== */
.cm-banner{
  position:relative;border-radius:16px;padding:28px 18px 56px;margin:16px 0 20px;overflow:hidden;
  box-shadow:0 6px 28px rgba(0,0,0,.08);
  background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 80%,#fff) 0%,#111827 100%);
  color:#fff;
}
[data-theme="dark"] .cm-banner{
  background:linear-gradient(135deg,#111827 0%,color-mix(in srgb,var(--accent) 75%,#111827) 100%);
}
.cm-banner__body{display:flex;align-items:center;gap:14px;position:relative;z-index:1;}
.cm-banner__logo{width:56px;height:56px;border-radius:14px;background:#fff;color:var(--accent);display:grid;place-items:center;font-weight:900;font-size:28px;box-shadow:0 4px 18px rgba(0,0,0,.25);}
.cm-banner__texts h2{margin:0;font-size:28px;font-weight:800}
.cm-banner__texts p{margin:6px 0 12px;font-size:15px;opacity:.95}
.cm-btn{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:10px;font-weight:700;text-decoration:none;border:1px solid rgba(255,255,255,.25);transition:.12s}
.cm-btn--primary{background:#fff;color:#111827;border-color:#fff}
.cm-btn--ghost{background:transparent;color:#fff}
.cm-btn--ghost:hover{background:rgba(255,255,255,.1)}
.cm-banner__actions{display:flex;gap:10px;flex-wrap:wrap}

/* Kayan ikonlar (DEKORATİF) */
.cm-ticker{
  position:absolute;left:0;right:0;bottom:6px;height:34px;
  mask-image:linear-gradient(to right,transparent,black 10%,black 90%,transparent);
  -webkit-mask-image:linear-gradient(to right,transparent,black 10%,black 90%,transparent);
  pointer-events:none; z-index:1;
}
.cm-ticker__row{
  display:flex;gap:18px;position:absolute;left:0;bottom:0;
  white-space:nowrap;min-width:max-content;
  animation:cm-slide 28s linear infinite;opacity:.95
}
@keyframes cm-slide{from{transform:translateX(0);}to{transform:translateX(-50%);}}

/* ikon görselleri — data-URI SVG */
.ico{width:34px;height:34px;border-radius:50%;display:inline-block;
  box-shadow:inset 0 0 0 2px rgba(255,255,255,.45),0 2px 10px rgba(0,0,0,.18);
  background-size:70% 70%;background-repeat:no-repeat;background-position:center;}
.ico.btc{background-color:#f7931a;background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><text x="50%" y="58%" dominant-baseline="middle" text-anchor="middle" font-family="Arial" font-size="18" fill="white">฿</text></svg>');}
.ico.eth{background-color:#627eea;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><path fill='white' d='M16 3l8 13-8-5-8 5zM16 29l8-12-8 5-8-5z'/></svg>");}
.ico.sol{background-color:#14f195;background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><rect x="6" y="8" width="20" height="4" rx="2" fill="black"/><rect x="6" y="14" width="20" height="4" rx="2" fill="black" opacity=".8"/><rect x="6" y="20" width="20" height="4" rx="2" fill="black" opacity=".6"/></svg>');}
.ico.bnb{background-color:#f3ba2f;background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><path fill="white" d="M16 6l3 3-3 3-3-3 3-3zm7 7l3 3-10 10-10-10 3-3 7 7 7-7z"/></svg>');}
.ico.usdt{background-color:#26a17b;background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><path fill="white" d="M7 9h18v3H17v9h-2v-9H7z"/></svg>');}
.ico.xrp{background-color:#0a0a0a;background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><path fill="white" d="M10 10c2 2 5 2 7 0l5-5h3l-6 6c-3 3-7 3-10 0L3 5h 3l4 5zM22 22c-2-2-5-2-7 0l-5 5H7l6-6c3-3 7-3 10 0l6 6h-3l-4-5z"/></svg>');}

/* CHIPS */
.chips{display:flex;gap:10px;flex-wrap:wrap;margin:6px 0 18px}
.chip{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:8px 12px;display:flex;gap:8px;align-items:center;box-shadow:var(--shadow)}
.chip .k{color:var(--muted);font-weight:700;font-size:12px;text-transform:uppercase}
.chip .v{font-weight:800}

/* 🔎 SEARCHBAR */
.searchbar{position:relative;display:flex;align-items:center;gap:8px;margin:0 0 12px}
.searchbar input{
  width:100%;padding:10px 38px 10px 12px;border-radius:10px;border:1px solid var(--border);
  background:var(--card);color:var(--text);outline:none;
}
.searchbar input:focus{box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 30%, transparent)}
.search-clear{
  position:absolute;right:8px;top:50%;transform:translateY(-50%);
  border:1px solid var(--border);background:var(--card);border-radius:8px;padding:4px 8px;cursor:pointer;
}

/* LİSTE */
.list{border:1px solid var(--border);border-radius:14px;overflow:hidden;background:var(--card);box-shadow:var(--shadow)}
.row{
  display:grid;grid-template-columns:56px minmax(220px,1fr) 140px 140px 180px 140px;
  gap:12px;align-items:center;padding:12px 14px;border-top:1px solid var(--border);
}
.row:first-child{border-top:0}
.row.head{font-weight:700;font-size:14px;color:var(--muted);background:color-mix(in srgb,var(--accent) 6%, transparent)}
.row:hover{background:rgba(245,158,11,.08)}
.coin{display:flex;align-items:center;gap:12px;min-width:0;overflow:hidden}
.coin>div{min-width:0}
.name{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.name a.coin-link{color:inherit;text-decoration:none}
.name a.coin-link:focus-visible{text-decoration:underline;outline:2px solid var(--accent);outline-offset:2px;border-radius:6px}
.symbol{font-size:12px;color:var(--muted)}
.price{text-align:right;font-weight:700;white-space:nowrap}
.chg{text-align:right;font-weight:700}
.pos{color:var(--success)}.neg{color:var(--danger)}
.mcap{text-align:right}
.action-btn{border:1px solid var(--border);border-radius:8px;padding:6px 8px;background:var(--card);cursor:pointer;text-decoration:none;color:inherit}

/* 🔐 AUTH MODAL (yorumlarla uyumlu) */
.auth-overlay{
  position:fixed;inset:0;background:rgba(0,0,0,.35);backdrop-filter:blur(2px);
  display:block;z-index:200;
}
.auth-modal{
  position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);
  width:min(92vw,480px);background:var(--card);color:var(--text);
  border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow);z-index:201;padding:14px
}
.auth-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.auth-head h3{margin:0;font-size:18px;font-weight:800}
.auth-close{
  border:1px solid var(--border);background:var(--card);border-radius:10px;cursor:pointer;
  width:36px;height:36px;display:grid;place-items:center
}
.auth-tabs{display:flex;gap:6px;margin:8px 0 10px;background:var(--card)}
.auth-tab{flex:1;padding:10px 12px;border:1px solid var(--border);background:var(--card);color:var(--text);border-radius:10px;cursor:pointer;font-weight:800;text-align:center}
.auth-tab.active{background:var(--accent);color:#1f2937;border-color:var(--accent)}
.auth-panel[hidden]{display:none !important}
.auth-form{display:grid;gap:10px}
.auth-label{display:grid;gap:6px;font-weight:700}
.auth-label input{border:1px solid var(--border);border-radius:10px;background:var(--bg);color:var(--text);padding:10px;font:inherit}
.auth-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:4px}
.auth-submit{background:var(--accent);color:#1f2937;border:0;padding:10px 14px;border-radius:10px;font-weight:800;cursor:pointer}
.auth-cancel{border:1px solid var(--border);background:var(--card);color:var(--text);padding:10px 14px;border-radius:10px;cursor:pointer}
.hidden{display:none}

/* MOBİL */
@media(max-width:760px){
  .cm-banner{padding:22px 14px 52px;text-align:center}
  .cm-banner__body{flex-direction:column}
  .row{grid-template-columns:40px minmax(0,1fr) minmax(96px,max-content) 92px;column-gap:12px;align-items:center;}
  .hide-sm{display:none}
  .coin{gap:10px}
  .coin img{width:26px;height:26px;flex:0 0 auto}
  .price{justify-self:end;padding-left:8px;font-size:15px;line-height:1}
  .action-btn{padding:6px 8px;font-size:12px}
}
footer{margin:36px 0 0;padding:18px 0;color:var(--muted);font-size:13px;text-align:center;border-top:1px solid var(--border)}

/* ✅ Kritiktir: hidden attribute gerçekten gizlesin (overlay/menü tıklama engelini fixler) */
[hidden]{display:none !important;}