/* BayesAI — trading-terminal layout.
 * Density over whitespace: hairline rules instead of cards, monospace tabular numbers
 * larger than their labels, and a persistent status tape pinned under the nav.
 * Palette is BNB only: grounds 0b0e11…5e6673, text eaecef/b7bdc6/848e9c,
 * gold f0b90b/fcd535/c99400, signals 0ecb81 / f6465d used only where they mean good/bad.
 */

/* ---------- tokens ---------- */
:root{
  color-scheme:dark;
  --void:#0b0e11;      /* page ground */
  --abyss:#12161c;     /* region ground */
  --deep:#181a20;      /* head strips */
  --panel:#12161c;
  --panel-solid:#181a20;
  --raise:#1e2026;     /* hover */
  --line-strong:#5e6673;--line:#2b3139;      /* row hairline */
  --line2:#3c4450;     /* region outline */
  --line-strong:#5e6673; /* controls, table head */
  --line3:#f0b90b80;
  --yes:#f0b90b;
  --no:#f6465d;
  --mint:#0ecb81;
  --gold:#fcd535;
  --pressed:#c99400;
  --text:#eaecef;
  --muted:#b7bdc6;
  --dim:#848e9c;
  --mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --disp:"Space Grotesk","Noto Sans SC",system-ui,sans-serif;
  --sans:"Noto Sans SC","PingFang SC","Microsoft YaHei",system-ui,sans-serif;
  --gut:clamp(16px,2.6vw,30px);
  --maxw:1440px;
  --chrome:92px;       /* nav bar + status tape */
}

/* ---------- base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--chrome) + 14px)}
body{
  margin:0;padding-top:var(--chrome);
  background:var(--void);color:var(--text);
  font:14px/1.65 var(--sans);-webkit-font-smoothing:antialiased;
}
::selection{background:#f0b90b;color:#0b0e11}
a{color:inherit}
img,canvas{display:block;max-width:100%}
[hidden]{display:none!important}
:focus-visible{outline:2px solid var(--yes);outline-offset:3px}
.wrap{width:100%;max-width:var(--maxw);margin:0 auto;padding-inline:var(--gut)}
.skip{position:fixed;left:-9999px}
.skip:focus{left:12px;top:12px;z-index:200;padding:10px 16px;background:var(--yes);color:var(--void);font:600 14px/1.4 var(--sans)}
.mono,.num{font-family:var(--mono);font-variant-numeric:tabular-nums}
.c-yes{color:var(--yes)}.c-mint{color:var(--mint)}.c-no{color:var(--no)}.c-gold{color:var(--gold)}.mut{color:var(--muted)}
h1,h2,h3{margin:0}
p{margin:0 0 10px;text-wrap:pretty}p:last-child{margin-bottom:0}

/* Small uppercase letterspaced labels. CJK keeps the sans face; English goes monospace. */
.kicker,.tape-lbl,.stat-lbl,.block-lbl,.block-tag,.kv-k,.plabel,.pticks-inline,
.rig-read-sub,.tbl th,.foot-links a,.nav-links a,.warn b,.visual-top,.visual-bottom{
  font-family:var(--sans);text-transform:uppercase;letter-spacing:.12em;
}
html[data-lang="en"] .kicker,html[data-lang="en"] .tape-lbl,html[data-lang="en"] .stat-lbl,
html[data-lang="en"] .block-lbl,html[data-lang="en"] .kv-k,html[data-lang="en"] .plabel,
html[data-lang="en"] .tbl th,html[data-lang="en"] .foot-links a,html[data-lang="en"] .nav-links a{
  font-family:var(--mono);
}
.kicker{display:flex;align-items:center;gap:7px;margin:0;color:var(--dim);font-size:11px;font-weight:600;line-height:1.5}

/* ---------- top chrome: nav + persistent status tape ---------- */
.nav{
  position:fixed;inset:0 0 auto;z-index:80;
  background:rgba(11,14,17,.95);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line-strong);
}
.nav-bar{border-bottom:1px solid var(--line)}
.nav-bar>.wrap{display:flex;align-items:center;gap:16px;min-height:45px}
.brand{display:inline-flex;align-items:center;gap:9px;flex:0 0 auto;color:var(--text);font:700 16px/1 var(--disp);letter-spacing:-.03em;text-decoration:none}
.brand-tag{margin-left:2px;padding-left:9px;border-left:1px solid var(--line2);color:var(--dim);font:500 11px/1.5 var(--mono);letter-spacing:.14em}
.nav-links{display:flex;align-items:stretch;gap:0;margin-right:auto;min-width:0;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none}
.nav-links::-webkit-scrollbar{display:none}
.nav-links a{
  display:inline-flex;align-items:center;flex:0 0 auto;
  padding:0 10px;min-height:45px;
  border-bottom:2px solid transparent;
  color:var(--dim);font-size:12px;font-weight:600;line-height:1;
  text-decoration:none;white-space:nowrap;transition:color .15s,border-color .15s;
}
.nav-links a:hover{color:var(--text)}
.nav-links a[aria-current="location"]{color:var(--yes);border-bottom-color:var(--yes)}
.lang{display:flex;flex:0 0 auto;border:1px solid var(--line-strong)}
.lang button{appearance:none;border:0;background:transparent;cursor:pointer;min-width:30px;min-height:26px;color:var(--dim);font:600 12px/1 var(--mono);transition:background .15s,color .15s}
.lang button[aria-pressed="true"]{background:var(--yes);color:var(--void)}
.lang button:hover:not([aria-pressed="true"]){color:var(--text);background:var(--raise)}

.tape>.wrap{display:flex;align-items:stretch;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none}
.tape>.wrap::-webkit-scrollbar{display:none}
.tape-cell{
  flex:1 1 auto;min-width:max-content;
  display:flex;flex-direction:column;justify-content:center;gap:4px;
  padding:7px 16px 8px;border-left:1px solid var(--line-strong);white-space:nowrap;
}
.tape-cell:first-child{border-left:0;padding-left:0}
.tape-lbl{color:var(--dim);font-size:11px;font-weight:600;line-height:1.4}
.tape-val{color:var(--text);font:600 16px/1.1 var(--mono);font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.tape-val.pending{color:var(--muted);font:400 12px/1.4 var(--sans);letter-spacing:0}
.tape-val--text{font-size:12px;letter-spacing:.06em;color:var(--muted)}
.tape-cell--live .tape-val::before{
  content:"";display:inline-block;width:5px;height:5px;margin-right:7px;vertical-align:2px;
  background:var(--mint);animation:tape-pulse 2.4s steps(1,end) infinite;
}
.tape-cell--live .tape-val.pending::before{background:var(--dim);animation:none}
.tape-cell--chain{margin-left:auto}
.tape-cell--chain .tape-val--text::before{content:"";display:inline-block;width:5px;height:5px;margin-right:7px;vertical-align:1px;background:var(--yes)}
@keyframes tape-pulse{0%,60%{opacity:1}61%,100%{opacity:.25}}

/* ---------- hero: instrument header, two panes ---------- */
.hero{border-bottom:1px solid var(--line-strong)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:22px 30px;align-items:center;padding-block:22px 24px}
.hero-copy{min-width:0}
.hero-copy>.kicker{margin-bottom:12px;color:var(--yes)}
.hero-copy>.kicker::before{content:"";width:5px;height:5px;background:var(--yes);flex:0 0 auto}
.hero-title{margin-bottom:11px}
.hero-title .l1{display:block;color:var(--text);font:600 clamp(23px,2.7vw,34px)/1.14 var(--disp);letter-spacing:-.035em}
.hero-title .l2{display:block;margin-top:5px;color:var(--yes);font:500 clamp(14px,1.45vw,18px)/1.4 var(--disp);letter-spacing:-.01em}
.hero-sub{color:var(--text);font:500 14px/1.6 var(--sans);margin-bottom:5px}
.hero-description{max-width:62ch;color:var(--muted);font-size:14px;line-height:1.75;margin-bottom:15px}
.hero-cta{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.hero-principles{display:flex;align-items:center;flex-wrap:wrap;gap:0;margin-top:11px;color:var(--dim);font:500 11px/1.5 var(--mono);letter-spacing:.14em}
.hero-principles span{padding-right:12px}
.hero-principles span+span{border-left:1px solid var(--line);padding-left:12px}

.hero-visual{position:relative;isolation:isolate;width:100%;height:312px;margin:0;overflow:hidden;border:1px solid var(--line2);background:var(--void)}
.hero-visual::before{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.5;
  background:linear-gradient(#2b31398c 1px,transparent 1px) 0 0/100% 39px,
             linear-gradient(90deg,#2b31398c 1px,transparent 1px) 0 0/39px 100%;
}
#net{position:absolute;inset:0;z-index:1;width:100%;height:100%;pointer-events:auto;touch-action:pan-y;cursor:crosshair}
.visual-top,.visual-bottom{
  position:absolute;z-index:2;left:0;right:0;
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:6px 10px;background:rgba(18,22,28,.92);
  color:var(--dim);font-size:11px;font-weight:600;line-height:1.5;
}
.visual-top{top:0;border-bottom:1px solid var(--line)}
.visual-bottom{bottom:0;border-top:1px solid var(--line)}
.visual-top i{display:inline-block;width:5px;height:5px;margin-right:6px;vertical-align:1px;background:var(--yes)}
.visual-bottom span:last-child{color:#848e9c;text-transform:none;letter-spacing:.04em}

/* ---------- actions ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:12px;
  min-height:36px;padding:8px 15px;
  border:1px solid var(--line-strong);background:transparent;color:var(--text);
  text-decoration:none;font:600 12px/1.4 var(--sans);letter-spacing:.03em;cursor:pointer;
  transition:background .15s,border-color .15s,color .15s;
}
.btn>span[aria-hidden]{font:400 14px/1 var(--mono)}
.btn:hover{background:var(--raise);border-color:var(--line3)}
.btn.primary{background:var(--yes);color:#0b0e11;border-color:var(--yes)}
.btn.primary:hover{background:var(--gold);border-color:var(--gold)}
.btn.primary:active{background:var(--pressed);border-color:var(--pressed)}
.btn.secondary{color:var(--muted)}
.btn.secondary:hover{color:var(--text)}

/* ---------- sections and their heads ---------- */
main{counter-reset:section}
section{padding-block:26px 30px;border-top:1px solid var(--line-strong);position:relative}
#arena{padding-block:24px 28px}
.sec-head{
  display:grid;grid-template-columns:auto minmax(0,1fr);align-items:baseline;
  column-gap:16px;row-gap:6px;
  padding-bottom:9px;margin-bottom:16px;border-bottom:1px solid var(--line2);
}
.sec-head>.kicker{grid-column:1;color:var(--dim)}
.sec-head>.kicker::before{counter-increment:section;content:"0" counter(section);color:var(--yes);font-family:var(--mono)}
.sec-head h2{grid-column:2;min-width:0;color:var(--text);font:600 14.5px/1.45 var(--disp);letter-spacing:.01em}
.sec-head .sec-sub{grid-column:1/-1;margin:0;color:var(--dim);font:400 12px/1.65 var(--sans)}
.sec-head .sec-lead{grid-column:1/-1;max-width:76ch;margin:0;color:var(--muted);font:400 14px/1.75 var(--sans)}

/* ---------- data rows: definition lists ---------- */
.dl{margin:0 0 16px;border-top:1px solid var(--line-strong)}
.dl:last-child{margin-bottom:0}
.dl-row{
  display:grid;grid-template-columns:minmax(0,20ch) minmax(70px,9ch) minmax(0,1fr);
  align-items:baseline;column-gap:22px;row-gap:4px;
  padding:11px 2px;border-bottom:1px solid var(--line-strong);
}
.dl--plain .dl-row{grid-template-columns:minmax(0,26ch) minmax(0,1fr)}
.dl-row dt{margin:0;min-width:0;color:var(--text);font:600 14px/1.6 var(--sans)}
.dl-fig{margin:0;text-align:right;white-space:nowrap;color:var(--yes);font:600 20px/1.3 var(--mono);font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.dl-body{margin:0;min-width:0;color:var(--muted);font:400 14px/1.7 var(--sans)}
.dl-row{transition:background .12s}
.dl-row:hover{background:var(--abyss)}

/* ---------- stat strips ---------- */
.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-bottom:16px;border:1px solid var(--line-strong);background:var(--abyss)}
.stats:last-child{margin-bottom:0}
.stat{min-width:0;padding:12px 15px;border-left:1px solid var(--line-strong)}
.stat:first-child{border-left:0}
.stat-lbl{display:block;margin-bottom:8px;color:var(--dim);font-size:11px;font-weight:600;line-height:1.4}
.stat-val{display:block;color:var(--text);font:600 clamp(19px,2vw,26px)/1.05 var(--mono);font-variant-numeric:tabular-nums;letter-spacing:-.02em;overflow-wrap:anywhere}
.stat-val.pending{font:400 14px/1.5 var(--sans);color:var(--muted);letter-spacing:0}
.stat-foot{display:block;margin-top:7px;color:var(--dim);font:400 12px/1.5 var(--sans)}
.stats--hero{grid-template-columns:repeat(3,minmax(0,1fr));border-inline:0;background:transparent;margin-bottom:0}
.stats--hero .stat{padding:10px 20px 10px 0;border-left:0}
.stats--hero .stat+.stat{padding-left:20px;border-left:1px solid var(--line-strong)}
.stats--hero .stat-val{font-size:clamp(17px,1.8vw,22px)}

/* ---------- bordered regions ---------- */
.block{margin-bottom:16px;border:1px solid var(--line-strong);background:var(--abyss)}
.block:last-child{margin-bottom:0}
.block-head{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:8px 13px;border-bottom:1px solid var(--line-strong);background:var(--deep)}
.block-lbl{min-width:0;color:var(--muted);font-size:11px;font-weight:600;line-height:1.5}
.block-tag{flex:0 0 auto;color:var(--dim);font:500 11px/1.5 var(--mono);letter-spacing:.14em}
.block-q{margin:0;padding:13px;color:var(--text);font:600 clamp(13.5px,1.5vw,17px)/1.5 var(--disp);border-bottom:1px solid var(--line-strong)}
.block-foot{padding:11px 13px}
.block-foot .note+.note,.block-foot .note+.launchpad{margin-top:9px}
.note{margin:0;color:var(--dim);font:400 12px/1.7 var(--sans)}
.block .tbl-scroll{border:0;background:transparent}

/* ---------- key / value rows ---------- */
.kv{min-width:0}
.kv-row{display:flex;align-items:baseline;justify-content:space-between;gap:14px;padding:9px 13px;border-bottom:1px solid var(--line)}
.kv-k{flex:0 0 auto;color:var(--dim);font-size:11px;font-weight:600;line-height:1.5}
.kv-v{min-width:0;text-align:right;color:var(--text);font:600 14px/1.4 var(--mono);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.kv-v.pending{font:400 14px/1.5 var(--sans);color:var(--muted)}
.kv--addr .kv-v{color:var(--yes);font-size:14px}
.kv--addr .kv-v.pending{color:var(--muted)}
.kv-note{margin:0;padding:8px 13px;border-bottom:1px solid var(--line);color:var(--dim);font:400 12px/1.6 var(--mono);overflow-wrap:anywhere}
.kv-note a{color:var(--yes)}

/* ---------- code ---------- */
pre.code{
  margin:0 0 16px;padding:14px 16px;border:1px solid var(--line2);background:var(--void);
  overflow-x:auto;color:var(--muted);font:400 12px/1.85 var(--mono);tab-size:4;
}
pre.code:last-child{margin-bottom:0}
pre.code b{color:var(--yes);font-weight:500}
pre.code u{color:var(--no);text-decoration:none}
pre.code i{color:#848e9c;font-style:normal}

/* ---------- tables ---------- */
.tbl-scroll{overflow-x:auto;margin-bottom:16px;border:1px solid var(--line-strong);background:var(--abyss)}
.tbl-scroll:last-child{margin-bottom:0}
.tbl{width:100%;border-collapse:collapse;font:400 14px/1.6 var(--mono);font-variant-numeric:tabular-nums}
.tbl th{
  padding:7px 12px;text-align:left;white-space:nowrap;background:var(--deep);
  color:var(--dim);font-size:11px;font-weight:600;line-height:1.5;
  border-bottom:1px solid var(--line-strong);
}
.tbl td{padding:7px 12px;border-bottom:1px solid var(--line-strong);vertical-align:top;color:var(--muted)}
.tbl tbody th{
  padding:7px 12px;background:transparent;border-bottom:1px solid var(--line-strong);
  font:500 14px/1.6 var(--sans);letter-spacing:0;text-transform:none;white-space:nowrap;
}
.tbl tbody tr:last-child td,.tbl tbody tr:last-child th{border-bottom:0}
.tbl .r{text-align:right}
.tbl td.r{color:var(--text);font-size:14px}
.tbl td.mono{color:var(--text)}
.tbl td.mono.mut{color:var(--dim)}
.tbl-empty{text-align:center;padding-block:22px!important;color:var(--muted);font-family:var(--sans)}
.tbl tbody tr:hover td,.tbl tbody tr:hover th{background:var(--deep)}
.tbl tbody tr:hover .tbl-empty{background:transparent}
.tbl--wide td{white-space:nowrap}
#gate .tbl th:first-child,#gate .tbl td:first-child{width:120px}
#gate .tbl th:nth-child(2),#gate .tbl td:nth-child(2){width:120px}

/* ---------- notices, sources, story ---------- */
.warn{display:flex;align-items:baseline;gap:12px;padding:10px 13px;border:1px solid var(--line2);border-left:2px solid var(--yes);background:var(--deep);color:var(--muted);font:400 12px/1.7 var(--sans)}
.warn b{flex:0 0 auto;color:var(--gold);font-size:11px;font-weight:700;line-height:1.7;font-family:var(--mono)}
.srcs{display:grid;border-top:1px solid var(--line);margin-bottom:16px}
.srcs a{
  display:grid;grid-template-columns:30px minmax(0,1fr) 14px;align-items:baseline;gap:10px;
  padding:9px 6px 9px 2px;border-bottom:1px solid var(--line);
  color:var(--muted);text-decoration:none;font:400 14px/1.65 var(--sans);transition:color .15s,background .15s;
}
.srcs a span:first-child{color:var(--yes);font:500 12px/1.65 var(--mono)}
.srcs a::after{content:"↗";color:#848e9c;font-size:12px;line-height:1.65}
.srcs a:hover{color:var(--text);background:var(--abyss)}
.story-details{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.story-details summary{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:10px 2px;color:var(--muted);cursor:pointer;font:600 12px/1.6 var(--sans);list-style:none}
.story-details summary::-webkit-details-marker{display:none}
.story-details summary:hover{color:var(--text)}
.details-plus{color:var(--yes);font:400 16px/1 var(--mono)}
.story-details[open] .details-plus{transform:rotate(45deg)}
.story{max-width:118ch;margin:0;padding:0 0 12px;counter-reset:story}
.story li{position:relative;list-style:none;padding-left:28px;margin-bottom:8px;color:var(--muted);font:400 14px/1.75 var(--sans)}
.story li:last-child{margin-bottom:0;color:var(--text)}
.story li::before{counter-increment:story;content:"0" counter(story);position:absolute;left:0;top:1px;color:var(--dim);font:500 12px/1.75 var(--mono)}

/* ---------- scoring rig (the preview desk) ---------- */
.rig{border:1px solid var(--line2);background:var(--abyss)}
.rig-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;padding:12px 15px;border-bottom:1px solid var(--line);background:var(--deep)}
.rig-head-copy{min-width:0}
.rig-q{margin:6px 0 0;max-width:54ch;color:var(--text);font:600 clamp(13px,1.35vw,15.5px)/1.5 var(--disp)}
.rig-read{flex:0 0 auto;text-align:right}
.pval{display:block;color:var(--yes);font:600 clamp(28px,3.2vw,42px)/1 var(--mono);font-variant-numeric:tabular-nums;letter-spacing:-.04em}
.pval small{color:var(--dim);font-size:.4em;letter-spacing:0;margin-left:3px}
.rig-read-sub{display:block;margin-top:6px;color:var(--dim);font:600 11px/1.4 var(--mono);letter-spacing:.16em}
.rig-body{display:grid;grid-template-columns:minmax(0,1.22fr) minmax(0,1fr)}
.rig-col{min-width:0;padding:15px}
.rig-col--out{border-left:1px solid var(--line);background:var(--void)}
.rig-sub{margin-bottom:12px}
.prow{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:4px}
.plabel{color:var(--dim);font-size:11px;font-weight:600;line-height:1.5}
.pticks-inline{color:#848e9c;font:500 11px/1.5 var(--mono)}
input[type="range"]{--range-progress:90%;display:block;width:100%;height:24px;margin:0;appearance:none;-webkit-appearance:none;background:transparent;cursor:pointer}
input[type="range"]::-webkit-slider-runnable-track{height:2px;background:linear-gradient(to right,var(--yes) var(--range-progress),#3c4450 var(--range-progress))}
input[type="range"]::-moz-range-track{height:2px;background:#3c4450}
input[type="range"]::-moz-range-progress{height:2px;background:var(--yes)}
input[type="range"]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:11px;height:16px;border:0;border-radius:1px;background:var(--yes);margin-top:-7px}
input[type="range"]::-moz-range-thumb{box-sizing:border-box;width:11px;height:16px;border:0;border-radius:1px;background:var(--yes)}
.pticks{display:flex;justify-content:space-between;color:#848e9c;font:500 11px/1.5 var(--mono)}
.phint{
  margin-top:11px;padding:9px 11px;min-height:44px;
  border:1px solid var(--line);border-left:2px solid var(--line-strong);
  background:var(--deep);color:var(--muted);font:400 12px/1.65 var(--sans);
}
.phint[data-k="over"]{border-left-color:var(--no)}
.phint[data-k="good"]{border-left-color:var(--mint)}
.phint[data-k="safe"]{border-left-color:var(--line-strong)}
.curve-box{margin-top:12px;padding:9px 8px 3px;border:1px solid var(--line);background:var(--void)}
#curve{width:100%;height:128px}
.rig-col .note{margin-top:10px}
.bar{margin-bottom:13px}
.bar-top{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:6px}
.bar-lbl{color:var(--muted);font:400 12px/1.5 var(--sans)}
.bar-num{font:600 17px/1 var(--mono);font-variant-numeric:tabular-nums}
.bar.win .bar-num{color:var(--yes)}
.bar.lose .bar-num{color:var(--no)}
.bar-track{height:4px;background:#2b3139;overflow:hidden}
.bar-fill{height:100%;width:0}
.bar.win .bar-fill{background:var(--yes)}
.bar.lose .bar-fill{background:var(--no)}
.rig .kv{margin-top:14px;border-top:1px solid var(--line)}
.rig .kv-row{padding-inline:0}

/* ---------- footer ---------- */
footer.foot{padding-block:16px 24px;border-top:1px solid var(--line-strong);background:var(--void);color:var(--dim);font:400 12px/1.75 var(--sans)}
footer.foot .wrap{display:grid;gap:9px}
footer.foot p{margin:0}
.foot-links{display:flex;flex-wrap:wrap;align-items:center;gap:7px 18px;padding-bottom:11px;margin-bottom:3px;border-bottom:1px solid var(--line)}
.foot-links a{color:var(--muted);text-decoration:none;font-size:12px;font-weight:600;line-height:1.6}
.foot-links a:hover{color:var(--text)}
.foot-links a.footer-brand{color:var(--text);font:700 14px/1 var(--disp);letter-spacing:-.03em;text-transform:none;display:inline-flex;align-items:center}
.foot-links a.foot-x{text-transform:none;letter-spacing:.02em;font-family:var(--mono);font-size:12px}
.foot-affil{padding-left:10px;border-left:2px solid var(--yes);color:var(--muted);font-size:12px}

/* ---------- language switches ---------- */
html[data-lang="en"] .cn-only,html[data-lang="zh"] .en-only{display:none!important}
html[data-lang="en"] body,html[data-lang="en"] .hero-sub,html[data-lang="en"] .btn,
html[data-lang="en"] .dl-row dt,html[data-lang="en"] .dl-body,html[data-lang="en"] .sec-head .sec-lead,
html[data-lang="en"] .sec-head .sec-sub,html[data-lang="en"] .note,html[data-lang="en"] .story li,
html[data-lang="en"] .srcs a,html[data-lang="en"] .bar-lbl,html[data-lang="en"] .phint{font-family:var(--disp)}
html[data-lang="zh"] .hero-title .l1{letter-spacing:-.01em}
html[data-lang="zh"] .kicker,html[data-lang="zh"] .tape-lbl,html[data-lang="zh"] .stat-lbl,
html[data-lang="zh"] .block-lbl,html[data-lang="zh"] .kv-k,html[data-lang="zh"] .plabel,
html[data-lang="zh"] .tbl th,html[data-lang="zh"] .foot-links a,html[data-lang="zh"] .nav-links a{letter-spacing:.05em}

/* ---------- responsive ---------- */
@media(max-width:1180px){
  .hero-grid{grid-template-columns:minmax(0,1fr) minmax(0,.92fr);gap:18px 22px}
  .hero-visual{height:286px}
  .dl-row{grid-template-columns:minmax(0,17ch) minmax(66px,8ch) minmax(0,1fr);column-gap:16px}
  .dl--plain .dl-row{grid-template-columns:minmax(0,22ch) minmax(0,1fr)}
}
@media(max-width:1000px){
  .rig-body{grid-template-columns:minmax(0,1fr)}
  .rig-col--out{border-left:0;border-top:1px solid var(--line)}
}
@media(max-width:900px){
  :root{--chrome:124px}
  .nav-bar>.wrap{flex-wrap:wrap;gap:0 14px;min-height:42px;padding-top:6px}
  .brand{min-height:34px}
  .lang{margin-left:auto}
  .nav-links{order:3;width:100%;margin:4px 0 0}
  .nav-links a{min-height:34px;padding:0 9px 0 0;margin-right:9px;font-size:11px}
  .hero-grid{grid-template-columns:minmax(0,1fr);gap:20px;padding-block:18px 22px}
  .hero-visual{height:250px;order:2}
  .hero-copy{order:1}
  .hero-description{max-width:none}
  section{padding-block:22px 26px}
  .dl-row{grid-template-columns:minmax(0,1fr) auto;row-gap:6px}
  .dl-row dt{grid-column:1}
  .dl-fig{grid-column:2;grid-row:1;font-size:16px}
  .dl-body{grid-column:1/-1}
  .dl--plain .dl-row{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:760px){
  .sec-head{grid-template-columns:minmax(0,1fr);row-gap:5px}
  .sec-head>.kicker,.sec-head h2{grid-column:1}
  .stats{grid-template-columns:minmax(0,1fr)}
  .stat{border-left:0;border-top:1px solid var(--line)}
  .stat:first-child{border-top:0}
  .stats--hero{grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
  .stats--hero .stat{padding:9px 10px 9px 0;border-top:0}
  .stats--hero .stat+.stat{padding-left:10px}
  .stats--hero .stat-val{font-size:16px}
  .stats--hero .stat-lbl{font-size:11px;letter-spacing:.08em}
  .rig-head{flex-direction:column;align-items:flex-start;gap:12px}
  .rig-read{text-align:left}
}
@media(max-width:560px){
  .tape-cell{padding:6px 12px 7px}
  .tape-val{font-size:14px}
  .hero-visual{height:206px}
  .visual-bottom span:last-child{display:none}
  .warn{flex-direction:column;gap:5px}
  .block-head{flex-wrap:wrap;gap:4px 12px}
  .srcs a{grid-template-columns:26px minmax(0,1fr) 12px;gap:8px}
}
@media(max-width:400px){
  :root{--gut:14px}
  .hero-title .l1{font-size:21px}
  .hero-cta{gap:6px}
  .hero-cta .btn{flex:1 1 auto;padding-inline:11px;gap:8px;font-size:12px}
  .hero-principles{font-size:7.5px;letter-spacing:.1em}
  .hero-principles span{padding-right:8px}
  .hero-principles span+span{padding-left:8px}
  .stats--hero .stat-val{font-size:14px}
  .tbl th,.tbl td,.tbl tbody th{padding:6px 9px}
  pre.code{font-size:12px;padding:11px 12px}
}

/* ---------- reduced motion: settle into a composed still frame ---------- */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .tape-cell--live .tape-val::before{opacity:1}
}

/* Signal colours are applied as utilities on top of component colours, so they are
   written twice to outrank selectors like .tbl td.r or .dl-fig. */
.c-yes.c-yes{color:var(--yes)}
.c-mint.c-mint{color:var(--mint)}
.c-no.c-no{color:var(--no)}
.c-gold.c-gold{color:var(--gold)}
.mut.mut{color:var(--muted)}
.tbl td.mono.mut.mut{color:var(--dim)}

/* ---------------------------------------------------------------------------
   Landing-page presence pass.
   Measured against bnbchain.org and linear.app: their headlines run 64-72px
   while this page topped out at 34px, and they carry 14-51 gradients, 10-36
   backdrop filters and 78-236 transitions where this page had none — the
   rainbow chrome was removed earlier and nothing replaced it, which read as
   plain rather than restrained. Single-hue gold, real glass, real motion.
   --------------------------------------------------------------------------- */
.hero-title .l1{
  font-size:clamp(38px,6.2vw,72px)!important;
  line-height:1.02;
  letter-spacing:-.045em;
  background:linear-gradient(176deg,#ffffff 28%,#b7bdc6 76%,#848e9c 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.hero-title .l2{
  font-size:clamp(17px,2.1vw,27px)!important;
  margin-top:10px;
  background:linear-gradient(96deg,#f0b90b,#fcd535 42%,#fde06a);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}

/* One deep gold bloom behind the hero. A single hue, wide and low-opacity:
   presence without the circus the owner rejected. */
.hero{position:relative;isolation:isolate;overflow:hidden}
.hero::before{
  content:"";position:absolute;z-index:-1;inset:-18% -12% auto -22%;height:135%;
  background:radial-gradient(58% 48% at 24% 34%,#f0b90b1f,transparent 68%),
             radial-gradient(44% 40% at 78% 16%,#fcd5350f,transparent 72%);
  pointer-events:none;
}

/* Glass on the pinned tape, so it reads as a layer over the page rather than a band. */
.tape{backdrop-filter:blur(14px) saturate(130%);-webkit-backdrop-filter:blur(14px) saturate(130%);
  background:#0b0e11cc}

/* Motion. Linear runs 236 transitions; this page had almost none, which is most
   of why it felt dead. Everything interactive answers the pointer. */
.btn,.stat,.dl-row,.tbl tbody tr,.launchpad,.tape-cell,.nav-links a,.srcs a{
  transition:background-color .18s ease,border-color .18s ease,color .18s ease,transform .18s ease}
.stat:hover,.dl-row:hover,.tbl tbody tr:hover{background:#12161c}
.btn.primary:hover{transform:translateY(-1px);box-shadow:0 6px 22px #f0b90b38}
.btn.secondary:hover{border-color:#f0b90b;color:#f0b90b}
.srcs a:hover{border-color:#f0b90b}

/* Key figures carry the weight a headline used to. */
.stats--hero .stat-val{font-size:clamp(26px,3.2vw,42px)!important;letter-spacing:-.03em}

/* ============================================================
   PRESENCE PASS 02 — 尺度、层次、材质
   前一轮只是把花哨的东西删掉了，删完没有补任何东西，所以是「素」不是「稳」。
   这一轮补的是：呼吸量、景深、材质、以及一条贯穿全站的金色光学语言。
   ============================================================ */

/* ---- 1. 呼吸量。原来整个 hero 挤在 450px 里，像后台不像首页 ---- */
.hero-grid{
  grid-template-columns:minmax(0,1.04fr) minmax(0,1fr);
  gap:clamp(26px,3.4vw,56px);
  padding-block:clamp(38px,5.4vw,78px) clamp(36px,5vw,72px);
}
.hero-copy>.kicker{margin-bottom:18px}
.hero-title{margin-bottom:18px}
.hero-title .l2{margin-top:12px}
.hero-sub{margin-bottom:10px;letter-spacing:.01em}
.hero-description{margin-bottom:26px;max-width:46ch}
.hero-cta{gap:10px;margin-bottom:30px}
.hero-principles{margin-top:18px}

/* ---- 2. 主视觉：更高、更亮、浮起来 ---- */
.hero-visual{
  height:clamp(368px,40vw,508px);
  border-color:#2b3139;
  background:
    radial-gradient(120% 80% at 50% 0%,#141922 0%,#0b0e11 62%),
    var(--void);
  box-shadow:
    0 40px 90px -46px #000,
    0 0 0 1px #f0b90b0f,
    inset 0 1px 0 #ffffff0a;
}
/* canvas 自己画了网格，这层 39px 的 CSS 网格只会跟它打架 */
.hero-visual::before{opacity:.16;background-size:100% 78px,78px 100%}
/* 四角暗角，把视线推回中心 */
.hero-visual::after{
  content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  background:radial-gradient(118% 92% at 50% 50%,transparent 46%,#0b0e11cc 100%);
}
.visual-top,.visual-bottom{
  background:#0b0e11b8;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  padding:9px 14px;letter-spacing:.14em;
}
.visual-top{z-index:3}
.visual-bottom{z-index:3}
.visual-top i{box-shadow:0 0 10px 1px #f0b90b;animation:vitPulse 2.6s ease-in-out infinite}
@keyframes vitPulse{0%,100%{opacity:1}50%{opacity:.34}}

/* ---- 3. 标题：行距收紧，副标题拉开，第二行加一道金色引线 ---- */
.hero-title .l1{line-height:.98!important;letter-spacing:-.05em}
.hero-title .l2{
  position:relative;padding-left:18px;
  font-size:clamp(16px,1.7vw,21px)!important;
}
.hero-title .l2::before{
  content:"";position:absolute;left:0;top:.18em;bottom:.22em;width:3px;
  background:linear-gradient(#f0b90b,#fcd53500);
}

/* ---- 4. 关键数字：等宽、超大、金色描边感 ---- */
.stats--hero{gap:0;margin-top:4px}
.stats--hero .stat{padding-block:14px 12px}
.stats--hero .stat-val{
  font-family:var(--mono);font-weight:600;font-variant-numeric:tabular-nums;
  line-height:1;
}
.stats--hero .stat-val.c-yes{
  background:linear-gradient(170deg,#ffe9a3,#f0b90b 62%,#c99400);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.stats--hero .stat-lbl{letter-spacing:.1em;font-size:10.5px;text-transform:uppercase}

/* ---- 5. 按钮：主按钮要有光，次按钮要有玻璃 ---- */
.btn.primary{
  background:linear-gradient(170deg,#fcd535,#f0b90b 58%,#dca700);
  border-color:#f0b90b;color:#13161a;font-weight:700;
  box-shadow:0 10px 30px -14px #f0b90bb0,inset 0 1px 0 #fff6;
}
.btn.primary:hover{box-shadow:0 16px 38px -14px #f0b90bcc,inset 0 1px 0 #fff8}
.btn.secondary{
  background:#ffffff08;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  border-color:#3c4450;
}
.btn{min-height:42px;padding:10px 20px;font-size:13px}
.btn:active{transform:translateY(1px)}

/* ---- 6. 导航：悬停时长出一条金线，而不是只换个颜色 ---- */
.nav-links a{position:relative}
.nav-links a::after{
  content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;
  background:linear-gradient(90deg,#f0b90b,#fcd535);
  transform:scaleX(0);transform-origin:left;transition:transform .22s cubic-bezier(.4,0,.2,1);
}
.nav-links a:hover::after,.nav-links a[aria-current]::after{transform:scaleX(1)}

/* ---- 7. 材质：极细的噪点，让大片纯色不再像 PPT 底板 ---- */
body::after{
  content:"";position:fixed;inset:0;z-index:9999;pointer-events:none;opacity:.028;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ---- 8. 区块：标题前一道金色刻度，区块之间拉开距离 ---- */
main>section{position:relative}
main>section>.wrap{padding-block:clamp(40px,4.6vw,76px)}
.block+.block{margin-top:clamp(22px,2.4vw,38px)}

/* ---- 9. 面板统一的景深 ---- */
.rig,.stats,.launchpad,.tbl-wrap{
  box-shadow:0 22px 56px -42px #000,inset 0 1px 0 #ffffff07;
}

/* ---- 10. 顶部一条发丝金线，整页的收口 ---- */
.nav-bar{position:relative}
.nav-bar::after{
  content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;
  background:linear-gradient(90deg,transparent,#f0b90b66 18%,#f0b90b33 50%,#f0b90b66 82%,transparent);
}

@media (max-width:880px){
  .hero-grid{grid-template-columns:minmax(0,1fr)}
  .hero-visual{height:clamp(280px,62vw,360px)}
  .hero-description{max-width:none}
}
@media (prefers-reduced-motion:reduce){
  .visual-top i{animation:none}
  .nav-links a::after{transition:none}
}
