/* =========================================================
   Kripto kategorisi — piyasa ekranı
   Site değişkenlerini kullanır; kendi paletini yalnızca
   yön renkleri (yükseliş/düşüş) için tanımlar.
   ========================================================= */
.ck{
  --up:#12924b; --dn:#e1121c; --nt:var(--ink-3);
  --up-bg:#e6f5ec; --dn-bg:#fdeced;
  --panel:var(--card); --edge:var(--line);
  --num:ui-monospace,"SF Mono",SFMono-Regular,Menlo,Consolas,monospace;
  padding:18px 0 46px;
}
html[data-theme="dark"] .ck{ --up-bg:#12291d; --dn-bg:#2e1216; }

.ck .num,.ck-table td.num,.ck-card-p,.ck-card-tl{font-family:var(--num);font-variant-numeric:tabular-nums}
.ck .up{color:var(--up)} .ck .dn{color:var(--dn)} .ck .nt{color:var(--nt)}

/* ---------- Başlık ---------- */
.ck-head{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;
  flex-wrap:wrap;margin:6px 0 18px}
.ck-kicker{font-size:11.5px;font-weight:800;letter-spacing:.12em;color:var(--blue);margin-bottom:7px}
.ck-head h1{font-size:31px;line-height:1.15}
.ck-head p{margin:8px 0 0;color:var(--ink-2);font-size:15px;max-width:640px}
.ck-updated{display:flex;align-items:center;gap:7px;background:var(--panel);border:1px solid var(--edge);
  border-radius:999px;padding:7px 14px;font-size:12.5px;color:var(--ink-3);white-space:nowrap}
.ck-updated strong{color:var(--ink);font-family:var(--num)}
.ck-dot{width:7px;height:7px;border-radius:50%;background:var(--up);box-shadow:0 0 0 3px rgba(18,146,75,.16)}
.ck-dot.stale{background:var(--gold);box-shadow:0 0 0 3px rgba(212,160,23,.18)}

.ck-warn{display:flex;align-items:center;gap:10px;background:var(--red-soft);color:var(--red-dark);
  border:1px solid rgba(225,18,28,.25);border-radius:var(--radius-lg);padding:12px 15px;
  font-size:13.5px;margin-bottom:16px}
.ck-warn svg{width:18px;height:18px;flex:none}

/* ---------- Genel özet ---------- */
.ck-global{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1px;background:var(--edge);
  border:1px solid var(--edge);border-radius:var(--radius-lg);overflow:hidden;margin-bottom:16px}
.ck-g{background:var(--panel);padding:13px 16px;min-width:0}
.ck-g span{display:block;font-size:11.5px;color:var(--ink-3);margin-bottom:5px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ck-g strong{font-size:18px;font-weight:800;font-family:var(--num);letter-spacing:-.02em}
.ck-g em{font-style:normal;font-size:12px;font-weight:700;margin-inline-start:6px;font-family:var(--num)}

/* ---------- Öne çıkan kartlar ---------- */
.ck-cards{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;margin-bottom:20px}
.ck-card{background:var(--panel);border:1px solid var(--edge);border-radius:var(--radius-lg);
  padding:14px;min-width:0;box-shadow:var(--shadow);position:relative;overflow:hidden}
.ck-card-t{display:flex;align-items:center;gap:7px;margin-bottom:9px}
.ck-card-t img{width:22px;height:22px;border-radius:50%;flex:none}
.ck-sym{font-size:12.5px;font-weight:800;letter-spacing:.02em;flex:1;min-width:0;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ck-pill{font-size:11px;font-weight:800;padding:2px 7px;border-radius:5px;white-space:nowrap;
  font-family:var(--num)}
.ck-pill.up{background:var(--up-bg);color:var(--up)}
.ck-pill.dn{background:var(--dn-bg);color:var(--dn)}
.ck-pill.nt{background:var(--line-2);color:var(--ink-3)}
.ck-card-p{font-size:19px;font-weight:800;letter-spacing:-.03em;line-height:1.15}
.ck-card-tl{font-size:12px;color:var(--ink-3);margin-top:2px}
.ck-spark{width:100%;height:34px;margin-top:8px;display:block}
.ck-spark.up{color:var(--up)} .ck-spark.dn{color:var(--dn)} .ck-spark.nt{color:var(--ink-3)}
.ck-spark.sm{width:110px;height:30px;margin:0}

/* ---------- Yerleşim ---------- */
.ck-grid{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:var(--gap);align-items:start}
.ck-main{min-width:0}
.ck-side{display:flex;flex-direction:column;gap:var(--gap);position:sticky;top:calc(var(--header-h) + 12px)}

/* ---------- Panel ---------- */
.ck-panel{background:var(--panel);border:1px solid var(--edge);border-radius:var(--radius-lg);
  overflow:hidden;box-shadow:var(--shadow);margin-bottom:var(--gap)}
.ck-side .ck-panel{margin-bottom:0}
.ck-panel-h{display:flex;justify-content:space-between;align-items:baseline;gap:12px;
  padding:15px 18px;border-bottom:1px solid var(--line-2)}
.ck-panel-h h2{font-size:16px}
.ck-panel-h span{font-size:12px;color:var(--ink-3);white-space:nowrap}

/* ---------- Tablo ---------- */
.ck-tw{overflow-x:auto}
.ck-table{width:100%;border-collapse:collapse;min-width:640px}
.ck-table th{text-align:start;font-size:11px;font-weight:700;letter-spacing:.06em;
  text-transform:uppercase;color:var(--ink-3);padding:11px 14px;
  border-bottom:1px solid var(--line-2);white-space:nowrap;background:var(--line-2)}
.ck-table th.r,.ck-table td.r{text-align:end}
.ck-table th.n,.ck-table td.n{text-align:center;width:44px;color:var(--ink-3);font-size:12.5px}
.ck-table td{padding:12px 14px;border-bottom:1px solid var(--line-2);vertical-align:middle;font-size:14px}
.ck-table tbody tr:last-child td{border-bottom:0}
.ck-table tbody tr:hover{background:var(--line-2)}
.ck-table td.num{font-weight:700;white-space:nowrap}
.ck-table td.num i{display:block;font-style:normal;font-size:11.5px;color:var(--ink-3);font-weight:500;margin-top:2px}

.ck-coin{display:flex;align-items:center;gap:10px;min-width:0}
.ck-coin img{width:26px;height:26px;border-radius:50%;flex:none}
.ck-coin strong{display:block;font-size:14px;font-weight:700;line-height:1.3;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:180px}
.ck-coin em{display:block;font-style:normal;font-size:11.5px;color:var(--ink-3);
  font-family:var(--num);margin-top:1px}

.ck-note{padding:12px 18px;border-top:1px solid var(--line-2);font-size:12px;color:var(--ink-3)}
.ck-note strong{color:var(--ink-2)}

/* ---------- Yükselen / düşen ---------- */
.ck-movers{padding:6px 0}
.ck-movers li{display:flex;align-items:center;gap:9px;padding:9px 16px}
.ck-movers li:hover{background:var(--line-2)}
.ck-movers img{width:22px;height:22px;border-radius:50%;flex:none}
.ck-mv-n{flex:1;min-width:0}
.ck-mv-n strong{display:block;font-size:13px;font-weight:700}
.ck-mv-n em{display:block;font-style:normal;font-size:11px;color:var(--ink-3);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ck-mv-p{font-size:12.5px;font-weight:700;white-space:nowrap}

/* ---------- Çevirici ---------- */
.ck-conv-b{padding:15px 16px}
.ck-conv-b label{display:block;margin-bottom:11px}
.ck-conv-b label span{display:block;font-size:12px;color:var(--ink-3);margin-bottom:5px}
.ck-conv-b input,.ck-conv-b select{width:100%;height:40px;border:1px solid var(--edge);
  border-radius:var(--radius);background:var(--bg);padding:0 11px;font-size:14px;
  color:var(--ink);outline:none;font-family:var(--num)}
.ck-conv-b select{font-family:var(--ff)}
.ck-conv-b input:focus,.ck-conv-b select:focus{border-color:var(--blue)}
.ck-conv-out{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--edge);
  border:1px solid var(--edge);border-radius:var(--radius);overflow:hidden;margin-top:4px}
.ck-conv-out div{background:var(--panel);padding:10px 12px}
.ck-conv-out span{display:block;font-size:11px;color:var(--ink-3);margin-bottom:3px}
.ck-conv-out strong{font-size:15px;font-weight:800;font-family:var(--num);
  display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ck-conv-n{margin:10px 0 0;font-size:11.5px;color:var(--ink-3);font-family:var(--num)}

/* ---------- Duyarlı ---------- */
@media(max-width:1080px){
  .ck-grid{grid-template-columns:minmax(0,1fr)}
  .ck-side{position:static;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap)}
  .ck-cards{grid-template-columns:repeat(3,minmax(0,1fr))}
  .ck-global{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:760px){
  .ck-head h1{font-size:25px}
  .ck-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ck-global{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ck-side{grid-template-columns:minmax(0,1fr)}
  .ck-table{min-width:0}
  .ck-table .hide-s{display:none}
  .ck-table th,.ck-table td{padding:10px 10px;font-size:13px}
  .ck-coin strong{max-width:120px}
}
@media(max-width:520px){
  .ck-cards{grid-template-columns:minmax(0,1fr)}
  .ck-global{grid-template-columns:minmax(0,1fr)}
  .ck-table .hide-m{display:none}
}