:root {
  --ink-0: #080906;
  --ink-1: #10120d;
  --ink-2: #181b13;
  --paper: #eee9d8;
  --mute: #aaa58f;
  --gold: #f0b90b;
  --gold-hot: #ffd95a;
  --gold-deep: #826309;
  --line: rgba(240, 185, 11, 0.19);
  --ok: #7cd992;
  --font-d: "Big Shoulders Display", Impact, sans-serif;
  --font-b: "Barlow", Arial, sans-serif;
  --font-m: "IBM Plex Mono", Consolas, monospace;
  --r: 3px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--ink-0); }
body { margin: 0; color: var(--paper); background: var(--ink-0); font-family: var(--font-b); line-height: 1.55; overflow-x: hidden; }
button, a { -webkit-tap-highlight-color: transparent; }
button:focus-visible, a:focus-visible { outline: 2px solid var(--gold-hot); outline-offset: 3px; }

.bg { position: fixed; inset: 0; pointer-events: none; z-index: 0; overflow: hidden; }
.bg-rays { position: absolute; inset: -30%; background: conic-gradient(from 210deg at 72% 18%, transparent 0 8deg, rgba(240,185,11,.035) 8deg 13deg, transparent 13deg 34deg); opacity: .8; transform: rotate(-7deg); }
.bg-grain { position: absolute; inset: 0; opacity: .19; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.11'/%3E%3C/svg%3E"); }
.cmdbar, main, .foot { position: relative; z-index: 1; }

.cmdbar { height: 68px; padding: 0 min(4vw, 56px); display: flex; align-items: center; gap: 30px; position: sticky; top: 0; z-index: 10; border-bottom: 1px solid var(--line); background: rgba(8,9,6,.88); backdrop-filter: blur(16px); }
.cmdbrand { display: flex; align-items: center; gap: 10px; color: var(--paper); text-decoration: none; font-family: var(--font-d); font-size: 25px; font-weight: 900; letter-spacing: .05em; }
.cmdbrand b { color: var(--gold); }
.cmdpfp { width: 38px; height: 38px; object-fit: cover; border: 1px solid var(--gold-deep); }
.cmdnav { display: flex; gap: 25px; margin-left: auto; }
.cmdnav a { color: var(--mute); text-decoration: none; font: 700 11px var(--font-m); letter-spacing: .15em; transition: color .15s; }
.cmdnav a:hover { color: var(--gold-hot); }
.cmdstate { display: flex; align-items: center; gap: 10px; }
.langbtn { border: 1px solid var(--line); background: transparent; color: var(--paper); padding: 6px 9px; border-radius: var(--r); cursor: pointer; font: 700 11px var(--font-m); }
.statepill { padding: 6px 11px; border: 1px solid var(--line); border-radius: 999px; font: 700 10px var(--font-m); letter-spacing: .11em; white-space: nowrap; }
.statepill.paper { color: var(--gold); background: rgba(240,185,11,.07); }
.statepill.live { color: var(--ok); border-color: rgba(124,217,146,.35); background: rgba(124,217,146,.07); }

.hero { min-height: calc(100vh - 68px); padding: 74px min(7vw, 96px); display: flex; align-items: center; position: relative; overflow: hidden; }
.hero-art { position: absolute; inset: 0 0 0 39%; overflow: hidden; }
.hero-art img { position: absolute; width: min(60vw, 780px); height: min(60vw, 780px); right: -3%; top: 50%; transform: translateY(-50%); object-fit: cover; filter: contrast(1.08) saturate(.82); opacity: .72; clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%); }
.hero-art::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, var(--ink-0) 0, rgba(8,9,6,.94) 12%, rgba(8,9,6,.38) 54%, rgba(8,9,6,.08)); }
.hero-art-fade { position: absolute; inset: 0; background: linear-gradient(0deg, var(--ink-0), transparent 28%, transparent 72%, rgba(8,9,6,.45)); }
.hero-copy { position: relative; z-index: 2; width: min(700px, 65vw); }
.eyebrow { margin: 0 0 16px; color: var(--gold); font: 700 12px var(--font-m); letter-spacing: .27em; }
.hero h1 { margin: 0; font: 900 clamp(88px, 15vw, 190px)/.73 var(--font-d); letter-spacing: -.025em; text-transform: uppercase; text-shadow: 0 10px 55px #000; }
.hero h1 span { display: block; color: var(--gold); margin-left: clamp(35px, 6vw, 90px); }
.herotag { margin: 34px 0 12px; font: 800 clamp(26px, 4vw, 48px)/1 var(--font-d); letter-spacing: .04em; }
.herotag em { color: var(--gold-hot); font-style: normal; }
.herosub { max-width: 640px; color: var(--mute); font-size: 17px; }
.hero-actions { display: flex; align-items: stretch; gap: 12px; margin-top: 28px; flex-wrap: wrap; }
.btn-enlist { min-height: 54px; display: inline-flex; align-items: center; gap: 11px; padding: 0 22px; color: #171204; background: linear-gradient(180deg, var(--gold-hot), var(--gold) 60%, #c79907); border-radius: var(--r); text-decoration: none; font: 900 17px var(--font-d); letter-spacing: .08em; box-shadow: 0 10px 30px rgba(240,185,11,.13); transition: transform .15s, filter .15s; }
.btn-enlist:hover { transform: translateY(-2px); filter: brightness(1.05); }
.btn-enlist svg { width: 20px; }
.dogtag { min-height: 54px; max-width: 410px; display: grid; grid-template-columns: auto minmax(90px,1fr) auto; align-items: center; gap: 12px; padding: 0 15px; border: 1px solid var(--line); border-radius: var(--r); color: var(--paper); background: rgba(16,18,13,.86); cursor: pointer; }
.dogtag:disabled { cursor: default; opacity: .75; }
.dogtag-k { color: var(--gold); font: 800 14px var(--font-m); }
.dogtag-v { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--mute); font: 500 12px var(--font-m); }
.dogtag-c { color: var(--gold-hot); font: 700 10px var(--font-m); letter-spacing: .1em; }
.hero-proof { display: flex; align-items: center; gap: 22px; margin-top: 36px; }
.hero-proof > div:not(.hp-sep) { display: grid; }
.hero-proof b { color: var(--gold); font: 800 30px/1 var(--font-d); }
.hero-proof i { margin-top: 4px; color: var(--mute); font: normal 10px var(--font-m); letter-spacing: .08em; }
.hp-sep { width: 1px; height: 35px; background: var(--line); }

.reveal { opacity: 0; transform: translateY(14px); animation: rise .7s cubic-bezier(.2,.7,.2,1) forwards; }
.r1 { animation-delay: .05s; } .r2 { animation-delay: .14s; } .r3 { animation-delay: .27s; } .r4 { animation-delay: .39s; } .r5 { animation-delay: .51s; } .r6 { animation-delay: .63s; }
@keyframes rise { to { opacity: 1; transform: none; } }

.wire { display: flex; align-items: stretch; border-block: 1px solid var(--gold-deep); background: rgba(240,185,11,.06); overflow: hidden; }
.wire-tag { flex: 0 0 auto; display: flex; align-items: center; padding: 12px 34px 12px 18px; color: var(--ink-0); background: var(--gold); clip-path: polygon(0 0,100% 0,calc(100% - 15px) 100%,0 100%); font: 900 16px var(--font-d); letter-spacing: .15em; }
.wire-track { display: flex; align-items: center; flex: 1; overflow: hidden; }
.wire-run { display: inline-flex; gap: 70px; min-width: max-content; padding-left: 7vw; color: var(--gold-hot); font: 500 12px var(--font-m); letter-spacing: .1em; animation: patrol 28s linear infinite; }
@keyframes patrol { to { transform: translateX(-50%); } }

section { position: relative; }
.sect { margin: 0 0 18px; font: 900 clamp(46px, 6vw, 76px)/.91 var(--font-d); letter-spacing: .015em; }
.sect > span:first-child { display: block; margin-bottom: 10px; color: var(--gold); font: 700 11px var(--font-m); letter-spacing: .3em; }
.sect-t { display: block; }
.sect-sub { max-width: 600px; margin: -5px 0 28px; color: var(--mute); }

.doctrine { padding: 120px min(7vw,96px) 150px; }
.orders { display: grid; grid-template-columns: repeat(12,1fr); gap: 22px; margin-top: 34px; }
.order { position: relative; overflow: hidden; padding: 27px 27px 32px; border: 1px solid var(--line); border-radius: var(--r); background: linear-gradient(160deg,var(--ink-2),var(--ink-1) 72%); }
.order::after { content: ""; position: absolute; top: 0; right: 0; width: 34px; height: 34px; background: linear-gradient(225deg,var(--gold) 0 8px,transparent 8px); }
.o1 { grid-column: 1/span 5; } .o2 { grid-column: 6/span 5; transform: translateY(45px); } .o3 { grid-column: 4/span 5; transform: translateY(10px); }
.order-no { display: flex; align-items: baseline; gap: 10px; color: var(--mute); font: 500 10px var(--font-m); letter-spacing: .2em; }
.order-no b { color: var(--gold); font: 900 44px var(--font-d); letter-spacing: 0; }
.order h3 { margin: 7px 0 9px; font: 800 28px var(--font-d); letter-spacing: .04em; }
.order p { margin: 0; color: var(--mute); font-size: 15px; }

.launch { display: grid; grid-template-columns: minmax(0,1fr) minmax(350px,500px); align-items: center; gap: 70px; padding: 125px min(7vw,96px); border-block: 1px solid var(--line); background: linear-gradient(180deg,rgba(240,185,11,.025),rgba(240,185,11,.055),rgba(240,185,11,.025)); }
.intelrows { display: grid; gap: 8px; }
.paperbox { display: grid; grid-template-columns: 165px minmax(0,1fr) auto; gap: 14px; align-items: center; padding: 13px 17px; border: 1px solid var(--line); border-radius: var(--r); background: var(--ink-1); font: 12px var(--font-m); }
.paperbox .k { color: var(--gold); font-size: 10px; font-weight: 700; letter-spacing: .15em; }
.paperbox .v { overflow: hidden; color: var(--mute); text-overflow: ellipsis; white-space: nowrap; }
.copybtn, .rowlink { padding: 5px 11px; border: 1px solid var(--line); border-radius: var(--r); color: var(--gold-hot); background: none; text-decoration: none; cursor: pointer; font: 700 10px var(--font-m); letter-spacing: .1em; }
.copybtn:disabled { color: #716c5a; cursor: default; }
.intellinks { display: flex; gap: 10px; margin-top: 18px; }
.intellinks a { padding: 9px 18px; border: 1px solid var(--line); border-radius: var(--r); color: var(--paper); text-decoration: none; font: 800 14px var(--font-d); letter-spacing: .1em; }
.launch-mark { position: relative; min-height: 440px; display: grid; place-items: center; }
.diamond-glow { position: absolute; width: 370px; height: 370px; border-radius: 50%; background: radial-gradient(circle,rgba(240,185,11,.22),transparent 63%); animation: breathe 4.5s ease-in-out infinite; }
@keyframes breathe { 50% { transform: scale(1.12); opacity: .78; } }
.diamond { width: 285px; height: 285px; display: grid; place-items: center; position: relative; transform: rotate(45deg); border: 2px solid var(--gold); border-radius: 9px; background: linear-gradient(135deg,var(--ink-2),var(--ink-1)); box-shadow: 0 0 60px rgba(240,185,11,.16), inset 0 0 45px rgba(240,185,11,.09); }
.diamond::before, .diamond::after { content: ""; position: absolute; inset: -26px; border: 1px solid rgba(240,185,11,.26); border-radius: 11px; }
.diamond::after { inset: -52px; border-color: rgba(240,185,11,.1); }
.diamond-inner { display: grid; gap: 5px; transform: rotate(-45deg); text-align: center; }
.d-label { color: var(--gold); font: 700 10px var(--font-m); letter-spacing: .27em; }
.d-count { font: 900 82px/1 var(--font-d); text-shadow: 0 0 35px rgba(240,185,11,.35); }
.d-sub { color: var(--mute); font: 11px var(--font-m); }

.chart { padding: 120px min(7vw,96px); }
.chart-head { display: flex; align-items: end; justify-content: space-between; gap: 35px; }
.chart-head .sect-sub { max-width: 430px; text-align: right; }
.chart-shell { min-height: 480px; overflow: hidden; border: 1px solid var(--line); border-radius: var(--r); background: radial-gradient(circle at center,rgba(240,185,11,.06),transparent 45%),var(--ink-1); }
.chart-shell iframe { width: 100%; height: 600px; border: 0; display: block; }
.chart-standby { min-height: 480px; display: grid; place-items: center; align-content: center; gap: 13px; color: var(--mute); font: 11px var(--font-m); letter-spacing: .08em; }
.chart-standby b { color: var(--gold); font: 800 25px var(--font-d); letter-spacing: .12em; }
.radar { width: 110px; height: 110px; position: relative; border: 1px solid var(--gold-deep); border-radius: 50%; background: radial-gradient(circle,transparent 32%,var(--line) 33% 34%,transparent 35% 65%,var(--line) 66% 67%,transparent 68%); }
.radar::after { content: ""; position: absolute; inset: 50% 50% 0 50%; width: 1px; background: linear-gradient(var(--gold),transparent); transform-origin: top; animation: scan 3s linear infinite; }
@keyframes scan { to { transform: rotate(360deg); } }
.chart-load { padding: 14px 22px; border: 1px solid var(--gold); border-radius: var(--r); color: #171204; background: var(--gold); cursor: pointer; font: 900 17px var(--font-d); letter-spacing: .1em; }

.foot { padding: 62px min(7vw,96px) 70px; border-top: 1px solid var(--line); text-align: center; background: linear-gradient(180deg,transparent,rgba(240,185,11,.04)); }
.foot-pfp { width: 64px; height: 64px; object-fit: cover; border: 1px solid var(--gold-deep); }
.foot-line { margin: 17px 0 10px; color: var(--gold); font: 900 clamp(21px,3vw,31px) var(--font-d); letter-spacing: .09em; }
.foot-fine { max-width: 720px; margin: 0 auto; color: var(--mute); font: 11px var(--font-m); }
.toast { position: fixed; left: 50%; bottom: 28px; z-index: 20; transform: translateX(-50%); padding: 10px 18px; border: 1px solid var(--gold); border-radius: var(--r); color: var(--ink-0); background: var(--gold); font: 800 11px var(--font-m); letter-spacing: .12em; box-shadow: 0 10px 35px #000; }

body[data-lang="zh"] { --font-d: "Big Shoulders Display","Noto Sans SC",sans-serif; --font-b: "Barlow","Noto Sans SC",sans-serif; --font-m: "IBM Plex Mono","Noto Sans SC",monospace; }
body[data-lang="zh"] .sect, body[data-lang="zh"] .herotag, body[data-lang="zh"] .order h3 { letter-spacing: .03em; }

@media (max-width: 980px) {
  .launch { grid-template-columns: 1fr; gap: 30px; }
  .launch-mark { min-height: 400px; }
  .o1, .o2, .o3 { grid-column: 1/-1; transform: none; }
  .chart-head { display: block; }
  .chart-head .sect-sub { text-align: left; }
}
@media (max-width: 720px) {
  .cmdbar { height: 62px; padding: 0 16px; }
  .cmdnav, .statepill { display: none; }
  .cmdstate { margin-left: auto; }
  .hero { min-height: auto; padding: 62px 20px 72px; }
  .hero-copy { width: 100%; }
  .hero-art { left: 12%; }
  .hero-art img { width: 115vw; height: 115vw; right: -53%; top: 34%; opacity: .4; }
  .hero h1 { font-size: clamp(78px,29vw,128px); }
  .hero h1 span { margin-left: 22px; }
  .herosub { font-size: 15px; }
  .hero-actions { display: grid; }
  .btn-enlist, .dogtag { width: 100%; max-width: none; }
  .hero-proof { gap: 14px; }
  .hero-proof b { font-size: 25px; }
  .wire-tag { padding-right: 27px; }
  .doctrine, .launch, .chart { padding: 85px 20px; }
  .launch { padding-bottom: 95px; }
  .paperbox { grid-template-columns: 1fr auto; }
  .paperbox .k { grid-column: 1/-1; }
  .paperbox .v { white-space: normal; overflow-wrap: anywhere; }
  .launch-mark { min-height: 340px; }
  .diamond { width: 215px; height: 215px; }
  .diamond::after { display: none; }
  .d-count { font-size: 62px; }
  .chart-shell, .chart-standby { min-height: 390px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .reveal { opacity: 1; transform: none; animation: none; }
  .wire-run, .diamond-glow, .radar::after { animation: none; }
  * { transition-duration: .01ms !important; }
}