/* bitcoinheatmap.com — 新闻纸编辑风：白纸黑墨、衬线标题、猩红点缀、细规则线、左侧导航 */
:root{
  --paper:#ffffff; --surface:#fcfcfb; --ink:#0b0b0b; --ink2:#52514e; --muted:#898781;
  --rule:#e1e0d9; --rule2:#c3c2b7; --accent:#c92a2a; --up:#0d366b; --dn:#7a1b1b;
  --neutral:#f0efec; --serif:Georgia,'Times New Roman','Songti SC',serif;
  --sans:system-ui,-apple-system,'Segoe UI',sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{background:var(--paper);color:var(--ink);font:16px/1.65 var(--sans);}
a{color:var(--ink);text-decoration-color:var(--rule2);text-underline-offset:3px}
a:hover{color:var(--accent);text-decoration-color:var(--accent)}
img{max-width:100%}
.skip{position:absolute;left:-999px;top:0;background:var(--ink);color:#fff;padding:8px 14px;z-index:99}
.skip:focus{left:8px}

/* ---- 骨架：左栏 + 内容 ---- */
.shell{display:flex;min-height:100vh;max-width:1460px;margin:0 auto}
.rail{width:228px;flex:0 0 228px;border-right:3px double var(--rule2);padding:28px 20px;position:sticky;top:0;align-self:flex-start;max-height:100vh;overflow-y:auto}
[dir=rtl] .rail{border-right:none;border-left:3px double var(--rule2)}
.content{flex:1;min-width:0;padding:34px 40px 60px}
.topbar{display:none}

.brand{display:flex;align-items:center;gap:10px;font:700 21px/1.1 var(--serif);letter-spacing:.01em;text-decoration:none}
.brand em,.tb-brand em,.foot-brand em{font-style:normal;color:var(--accent)}
.brand-mark{display:grid;grid-template-columns:repeat(3,7px);gap:2px;flex:0 0 auto}
.brand-mark i{width:7px;height:7px;border-radius:2px;display:block}
.brand-mark i:nth-child(1){background:#7a1b1b}.brand-mark i:nth-child(2){background:#b45454}.brand-mark i:nth-child(3){background:#f0efec}
.brand-mark i:nth-child(4){background:#b45454}.brand-mark i:nth-child(5){background:#f0efec}.brand-mark i:nth-child(6){background:#6da7ec}
.brand-mark i:nth-child(7){background:#f0efec}.brand-mark i:nth-child(8){background:#6da7ec}.brand-mark i:nth-child(9){background:#0d366b}

.nav{list-style:none;margin:26px 0;border-top:1px solid var(--rule)}
.nav a{display:block;padding:9px 2px;border-bottom:1px solid var(--rule);text-decoration:none;font-size:14.5px;color:var(--ink2)}
.nav a:hover{color:var(--accent);padding-inline-start:6px;transition:padding .15s}
.nav a.on{color:var(--ink);font-weight:700;border-inline-start:3px solid var(--accent);padding-inline-start:8px}
.langbox{font-size:13.5px;margin-top:14px}
.langbox summary{cursor:pointer;color:var(--ink2);padding:6px 0;list-style:none}
.langbox summary::before{content:'◆ ';color:var(--accent);font-size:10px}
.langs{list-style:none;max-height:300px;overflow:auto;border:1px solid var(--rule);margin-top:6px}
.langs a{display:block;padding:5px 10px;text-decoration:none;font-size:13px}
.langs a.cur{background:var(--ink);color:#fff}
.langs a:not(.cur):hover{background:var(--neutral)}
.rail-note{font-size:12px;color:var(--muted);margin-top:16px}

/* ---- 页眉区 ---- */
.masthead{border-bottom:3px double var(--rule2);padding-bottom:22px;margin-bottom:26px}
.kicker{font:700 12px/1 var(--sans);letter-spacing:.22em;text-transform:uppercase;color:var(--accent);margin-bottom:12px}
h1{font:700 clamp(30px,4.6vw,52px)/1.08 var(--serif);letter-spacing:-.01em;margin-bottom:12px}
.lede{font-size:17.5px;color:var(--ink2);max-width:760px}

/* ---- KPI ---- */
.kpis{display:grid;grid-template-columns:repeat(6,1fr);border-block:1px solid var(--rule2);margin:22px 0 4px}
.kpi{padding:14px 16px;border-inline-end:1px solid var(--rule)}
.kpi:last-child{border-inline-end:none}
.kpi-l{display:block;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.kpi-v{display:block;font-size:21px;font-weight:700;font-variant-numeric:tabular-nums;margin-top:3px;white-space:nowrap}
.kpi-v.up{color:var(--up)}.kpi-v.dn{color:var(--dn)}
.upd{font-size:12.5px;color:var(--muted);margin:8px 0 0}
.upd .dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--accent);margin-inline-end:6px;animation:pulse 2s infinite}
@keyframes pulse{50%{opacity:.35}}

/* ---- Section ---- */
.sec{margin-top:52px}
.sec-head{display:flex;align-items:baseline;gap:14px;border-bottom:1px solid var(--ink);padding-bottom:8px}
.sec-no{font:700 13px/1 var(--sans);color:#fff;background:var(--ink);padding:4px 8px;letter-spacing:.05em}
.sec h2{font:700 clamp(21px,2.6vw,30px)/1.15 var(--serif)}
.sec-sub{color:var(--ink2);font-size:14.5px;max-width:820px;margin:10px 0 18px}

/* ---- 热力图共通 ---- */
.hm-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:4px}
.hm-table{border-collapse:separate;border-spacing:2px;font-variant-numeric:tabular-nums;min-width:820px;width:100%}
.hm-table thead th{font:600 12px/1.2 var(--sans);color:var(--muted);padding:4px 2px;text-align:center}
.hm-table .hm-y{font:700 12.5px/1.2 var(--sans);color:var(--ink2);text-align:start;padding-inline-end:8px;white-space:nowrap}
.hm-c{text-align:center;font-size:12px;font-weight:600;padding:7px 3px;border-radius:3px;min-width:48px;cursor:default}
.hm-c:hover{outline:2px solid var(--ink);outline-offset:-1px}
.hm-empty{background:var(--surface);color:var(--rule2);border:1px dashed var(--rule)}
.hm-zero{background:var(--surface);border:1px dashed var(--rule)}
.hm-tot{border-inline-start:6px solid var(--paper);font-weight:700}
.hm-blank{background:none}
.hm-avg th,.hm-avg td{border-top:6px solid var(--paper)}
.hm-facts{list-style:none;display:flex;flex-wrap:wrap;gap:10px 34px;margin:16px 0 0;font-size:14px}
.hm-facts strong{display:block;font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.hm-facts b.up{color:var(--up)}.hm-facts b.dn{color:var(--dn)}
.nodata{color:var(--muted);padding:30px 0}

/* 图例 */
.legend{display:flex;align-items:center;gap:10px;font-size:12.5px;color:var(--ink2);margin:2px 0 14px}
.lg-bar{display:block;width:150px;height:10px;border-radius:2px;border:1px solid var(--rule)}
.lg-div{background:linear-gradient(to right,#7a1b1b,#c8807f 30%,#f0efec 50%,#86a8d8 70%,#0d366b)}
.lg-seq{background:linear-gradient(to right,#f0efec,#cde2fb 15%,#6da7ec 55%,#0d366b)}
.lg-mid{color:var(--muted)}

/* ---- 每日 GitHub 网格 ---- */
.gh-wrap{--cell:12px;--gap:2px;display:inline-block;min-width:760px}
.gh-months{position:relative;height:16px;margin-inline-start:34px;
  display:grid;grid-template-columns:repeat(var(--wk),calc(var(--cell) + var(--gap)))}
.gh-months span{grid-column:var(--c);grid-row:1;font-size:11px;color:var(--muted);white-space:nowrap}
.gh-body{display:flex;gap:6px}
.gh-wd{display:grid;grid-template-rows:repeat(7,calc(var(--cell) + var(--gap)));width:28px}
.gh-wd span{grid-row:var(--r);font-size:10px;color:var(--muted);line-height:calc(var(--cell) + var(--gap))}
.gh-grid{display:grid;grid-template-rows:repeat(7,calc(var(--cell) + var(--gap)));grid-template-columns:repeat(var(--wk),calc(var(--cell) + var(--gap)))}
.gh-c{grid-column:var(--c);grid-row:var(--r);width:var(--cell);height:var(--cell);border-radius:2px;display:block}
.gh-c:hover{outline:2px solid var(--ink)}
.gh-empty{background:var(--surface);box-shadow:inset 0 0 0 1px var(--rule)}

/* ---- 表格 ---- */
.dtable{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.dtable th{font:600 12px/1.3 var(--sans);text-transform:uppercase;letter-spacing:.06em;color:var(--muted);text-align:end;padding:10px 10px;border-bottom:2px solid var(--ink)}
.dtable th:first-child,.dtable td:first-child{text-align:start}
.dtable th.ta-s,.dtable td.ta-s{text-align:start}
.dtable td{padding:9px 10px;border-bottom:1px solid var(--rule);font-size:14px;text-align:end;white-space:nowrap}
.dtable tr:hover td{background:var(--surface)}
.dtable .c-rank{color:var(--muted);font-size:12.5px;text-align:start}
.dtable .c-coin{text-align:start;font-weight:700;max-width:220px}
.dtable .c-coin a{text-decoration:none;display:inline-flex;align-items:center;gap:8px;max-width:220px;min-width:0;vertical-align:middle}
.dtable .c-coin img{flex:0 0 auto}
.dtable .c-coin .nm{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (max-width:720px){
  .dtable .c-coin{max-width:120px}
  .dtable .c-coin a{max-width:120px}
}
.dtable .num.up{color:var(--up)}.dtable .num.dn{color:var(--dn)}
.tbl-more{margin:16px 0 0;font-size:14.5px}
.tbl-more a{font-weight:700}

/* 占比条（span 必须 display:block） */
.bar{display:block;width:120px;height:9px;background:var(--up);border-radius:2px;overflow:hidden}
.bar-l{display:block;height:100%;background:var(--dn)}

/* ---- 币种/交易所详情 ---- */
.crumbs{font-size:13px;color:var(--muted);margin-bottom:16px}
.crumbs a{color:var(--ink2)}
.statgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));border-block:1px solid var(--rule2);margin:20px 0}
.statgrid .kpi{border-inline-end:1px solid var(--rule)}
.liq-table td.win{font-weight:700;text-align:start}

/* ---- FAQ ---- */
.faq dt{font:700 17px/1.4 var(--serif);margin-top:20px}
.faq dt::before{content:'Q. ';color:var(--accent)}
.faq dd{color:var(--ink2);font-size:15px;margin-top:6px;max-width:860px}

/* ---- 页脚 ---- */
.foot{border-top:3px double var(--rule2);margin-top:70px;background:var(--surface)}
.foot-in{max-width:1460px;margin:0 auto;padding:30px 40px;font-size:13.5px;color:var(--ink2)}
.foot-brand{font:700 19px/1 var(--serif);margin-bottom:8px}
.foot-nav{margin-top:8px}
.foot-disc{margin-top:14px;color:var(--muted)}
.foot-copy{margin-top:4px;color:var(--muted)}

/* ---- tooltip ---- */
.tip{position:fixed;z-index:50;background:var(--ink);color:#fff;font:12.5px/1.4 var(--sans);padding:7px 10px;border-radius:3px;pointer-events:none;max-width:260px;box-shadow:0 2px 10px rgba(0,0,0,.25)}

/* ---- 移动端 ---- */
#navtoggle{display:none}
@media (max-width:960px){
  .topbar{display:flex;align-items:center;gap:14px;position:sticky;top:0;z-index:40;background:var(--paper);border-bottom:2px solid var(--ink);padding:12px 16px}
  .tb-brand{font:700 19px/1 var(--serif);text-decoration:none}
  .burger{display:inline-flex;flex-direction:column;gap:4px;cursor:pointer;padding:4px}
  .burger span{width:20px;height:2px;background:var(--ink);display:block}
  .shell{display:block}
  .rail{display:none;width:auto;max-height:none;position:static;border-right:none;border-bottom:3px double var(--rule2);padding:18px 16px}
  #navtoggle:checked ~ .shell .rail{display:block}
  .content{padding:22px 16px 40px}
  .kpis{grid-template-columns:repeat(2,1fr)}
  .kpi{border-bottom:1px solid var(--rule)}
  .kpi:nth-child(2n){border-inline-end:none}
  .kpi-v{font-size:18px}
  .foot-in{padding:24px 16px}
  h1{font-size:28px}
}
@media (max-width:400px){.kpis{grid-template-columns:1fr 1fr}}