:root {
  --bg: #06100e;
  --panel: #0b1916;
  --panel-2: #10221e;
  --line: #22463d;
  --line-soft: #18352f;
  --text: #f0f8f5;
  --muted: #9fb7af;
  --green: #47e6ad;
  --green-2: #89f4cf;
  --amber: #ffc66d;
  --red: #ff7c86;
  --blue: #6ec8ff;
  --header-h: 74px;
  --bottom-h: 154px;
  color-scheme: dark;
  font-family: "Microsoft YaHei UI", "PingFang SC", system-ui, sans-serif;
}

* { box-sizing: border-box; }
html, body { margin: 0; min-width: 1180px; height: 100%; background: var(--bg); color: var(--text); }
body { overflow: hidden; font-size: 16px; line-height: 1.62; }
button, input { font: inherit; }
button { color: inherit; }
button:focus-visible, [tabindex]:focus-visible { outline: 2px solid var(--green); outline-offset: 2px; }
.plain-button { border: 0; background: transparent; padding: 0; text-align: left; }
.system-bar {
  height: var(--header-h); display: grid; grid-template-columns: 310px 1fr auto; align-items: center;
  padding: 0 22px; border-bottom: 1px solid var(--line); background: rgba(6,16,14,.96); position: relative; z-index: 20;
}
.brand { display: flex; align-items: center; gap: 13px; cursor: pointer; }
.brand-mark { width: 37px; height: 37px; border: 1px solid #36705f; border-radius: 11px; display: flex; align-items: center; justify-content: center; gap: 3px; box-shadow: inset 0 0 18px rgba(71,230,173,.08); }
.brand-mark i { display: block; width: 6px; background: var(--green); border-radius: 5px; }
.brand-mark i:nth-child(1) { height: 12px; }.brand-mark i:nth-child(2) { height: 22px; }.brand-mark i:nth-child(3) { height: 16px; }
.brand strong { display: block; font-size: 18px; letter-spacing: .02em; }
.brand small { color: var(--muted); display: block; font-size: 14px; }
.system-status { justify-self: center; display: flex; gap: 10px; align-items: center; color: var(--muted); font-size: 15px; }
.system-status b { color: var(--green-2); font-size: 15px; }
.top-actions { display: flex; gap: 9px; align-items: center; }
button { border: 1px solid var(--line); background: #10201c; border-radius: 10px; padding: 10px 16px; cursor: pointer; transition: .16s ease; }
button:hover:not(:disabled) { border-color: var(--green); transform: translateY(-1px); }
button:disabled { opacity: .42; cursor: not-allowed; }
.primary { background: var(--green); color: #03120d; border-color: var(--green); font-weight: 800; }
.secondary { background: #11241f; color: var(--text); }
.compact { padding: 8px 13px; font-size: 15px; }
.status-chip { display: flex; gap: 8px; align-items: center; padding: 8px 12px; font-size: 15px; }
.status-chip i, .status-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--green); box-shadow: 0 0 10px rgba(71,230,173,.7); }

.workbench-shell { height: calc(100vh - var(--header-h) - var(--bottom-h)); display: grid; grid-template-columns: 232px minmax(0, 1fr) 128px; }
.flow-sidebar, .decision-rail { border-right: 1px solid var(--line); background: #081512; overflow: auto; }
.decision-rail { border-right: 0; border-left: 1px solid var(--line); padding: 14px 11px; }
.side-title { padding: 18px 18px 10px; }.side-title span, .eyebrow { color: var(--green); font-size: 14px; font-weight: 800; letter-spacing: .08em; }.side-title b { display: block; font-size: 20px; margin-top: 2px; }
#researchNav { display: grid; gap: 4px; padding: 6px 10px; }
.nav-item { display: grid; grid-template-columns: 30px 1fr; gap: 9px; align-items: center; width: 100%; text-align: left; padding: 9px; border-color: transparent; background: transparent; border-radius: 9px; }
.nav-item span { width: 28px; height: 28px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 8px; color: var(--muted); font-size: 14px; }
.nav-item b { font-size: 15px; }.nav-item small { color: var(--muted); display: block; font-size: 14px; line-height: 1.3; }
.nav-item.active { background: #143129; border-color: #2c6857; }.nav-item.active span { color: #071510; background: var(--green); border-color: var(--green); }
.mode-card { margin: 12px 11px; border: 1px solid var(--line); border-radius: 12px; padding: 12px; background: #0e201b; }
.mode-card span { color: var(--muted); font-size: 14px; }.mode-card b { display: block; font-size: 15px; margin: 3px 0; }.mode-card p { color: var(--muted); font-size: 14px; margin: 5px 0 0; }
.utility-nav { display: grid; gap: 6px; padding: 0 11px 16px; }.utility-nav button { text-align: left; padding: 8px 11px; background: transparent; font-size: 15px; }

main { overflow: auto; padding: 24px clamp(22px, 2.5vw, 42px) 44px; background: radial-gradient(circle at 48% -10%, rgba(30,99,77,.18), transparent 44%), var(--bg); }
.page { width: min(1240px, 100%); margin: 0 auto; animation: enter .22s ease; }
@keyframes enter { from { opacity: 0; transform: translateY(5px); } }
.page-head { display: flex; justify-content: space-between; gap: 22px; align-items: flex-end; margin-bottom: 20px; }
.page-head h1, h1 { font-size: clamp(32px, 3.1vw, 44px); line-height: 1.13; margin: 3px 0 7px; letter-spacing: -.035em; }
.page-head p { margin: 0; color: var(--muted); max-width: 780px; font-size: 17px; }
h2 { font-size: clamp(22px, 2vw, 28px); line-height: 1.25; margin: 0 0 14px; } h3 { font-size: 19px; margin: 0 0 9px; }
p { margin: 7px 0; }.muted { color: var(--muted); }.green { color: var(--green); }.amber { color: var(--amber); }.red { color: var(--red); }
.card { border: 1px solid var(--line); background: linear-gradient(145deg, rgba(17,38,32,.93), rgba(9,24,20,.95)); border-radius: 15px; padding: 18px; box-shadow: 0 15px 40px rgba(0,0,0,.14); }
.card + .card { margin-top: 14px; }.card-head { display: flex; justify-content: space-between; align-items: center; gap: 15px; margin-bottom: 13px; }.card-head h2,.card-head h3 { margin: 0; }
.grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 14px; }.grid-3 { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 14px; }.grid-4 { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 12px; }
.metric { padding: 15px; border: 1px solid var(--line-soft); border-radius: 12px; background: rgba(5,17,14,.6); }.metric span { color: var(--muted); font-size: 14px; }.metric b { display: block; font-size: 26px; line-height: 1.25; margin-top: 3px; }.metric small { color: var(--muted); font-size: 14px; }
.hero { min-height: 260px; display: grid; grid-template-columns: 1.3fr .7fr; gap: 28px; align-items: center; padding: 32px; overflow: hidden; position: relative; }
.hero::after { content:""; position:absolute; right:-80px; top:-100px; width:360px; height:360px; border:1px solid rgba(71,230,173,.22); border-radius:50%; box-shadow: 0 0 0 60px rgba(71,230,173,.025),0 0 0 120px rgba(71,230,173,.018); }
.hero-copy { position: relative; z-index: 1; }.hero-copy p { color: #bed0ca; font-size: 18px; max-width: 720px; }.hero-proof { position: relative; z-index: 1; display: grid; gap: 9px; }.proof-row { display:flex; justify-content:space-between; gap:10px; border-bottom:1px solid var(--line-soft); padding:9px 0; font-size:15px; }.proof-row span{color:var(--muted)}
.mode-entry { min-height: 175px; text-align: left; padding: 20px; position: relative; overflow: hidden; }.mode-entry strong { display:block; font-size:22px; margin:7px 0; }.mode-entry p { color:var(--muted); margin-bottom:18px; }.mode-entry.primary-entry { border-color: #3a9c7e; background:linear-gradient(145deg,#12392d,#0d241e); }.mode-entry .number { color:var(--green); font-weight:900; }
.stat-strip { margin:14px 0; }.truth-banner { border-left: 4px solid var(--amber); padding: 13px 15px; background: rgba(255,198,109,.07); border-radius: 0 10px 10px 0; color:#f5ddbd; }
.step-context { margin-bottom: 14px; display:flex; justify-content:space-between; gap:15px; align-items:center; border-color:#356b5b; }.step-context b{font-size:18px}.step-context p{color:var(--muted);margin:2px 0}.step-code,.mono { font-family: Consolas, "Microsoft YaHei UI", monospace; font-size: 14px; overflow-wrap:anywhere; color:#acd7c9; }
.tag, .status-badge { display:inline-flex; align-items:center; gap:6px; border:1px solid var(--line); border-radius:999px; padding:4px 9px; font-size:15px; color:var(--muted); }.tag.ok,.status-badge.ok{border-color:#34745e;color:var(--green-2);background:rgba(71,230,173,.06)}.tag.warn{border-color:#7b6134;color:var(--amber)}.tag.block{border-color:#6d3940;color:var(--red)}
.anomaly-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }.anomaly { padding:18px; border:1px solid var(--line); border-radius:13px; }.anomaly b{font-size:28px;display:block}.anomaly span{font-size:16px;color:var(--muted)}
.network { width:100%; min-height:310px; border:1px solid var(--line-soft); border-radius:13px; background:#071713; }.network line{stroke:#41645b;stroke-width:2}.network line.high{stroke:#ff7c86;stroke-width:4}.network circle{fill:#143b30;stroke:var(--green);stroke-width:2}.network text{fill:#c2d5cf;font-size:14px}
.hypothesis-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:13px; }.hypothesis { position:relative; cursor:pointer; }.hypothesis.selected{border-color:var(--green);box-shadow:0 0 0 1px rgba(71,230,173,.35)}.hypothesis .h-id{font-size:24px;color:var(--green);font-weight:900}.evidence-list{margin:8px 0;padding-left:19px;color:#bfd0ca}.evidence-list li{margin:5px 0}.evidence-list li::marker{color:var(--green)}
.cause-chain, .consumption-chain { display:grid; grid-template-columns:repeat(4,1fr); align-items:stretch; gap:24px; }.consumption-chain{grid-template-columns:repeat(6,1fr);gap:18px}.chain-node{border:1px solid var(--line);background:#0a1a16;border-radius:12px;padding:13px;position:relative;min-height:82px}.chain-node:not(:last-child)::after{content:"→";position:absolute;right:-20px;top:27px;color:var(--green);font-size:20px}.chain-node span{display:block;color:var(--muted);font-size:14px}.chain-node b{font-size:16px}.review-listing{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.reviewreti{display:flex;justify-content:space-between;gap:10px;border:1px solid var(--line-soft);border-radius:10px;padding:10px 12px}.reviewreti b{font-size:15px}.check{color:var(--green);font-weight:900}
.diff-table,.data-table { width:100%; border-collapse:collapse; font-size:15px; }.diff-table th,.diff-table td,.data-table th,.data-table td{border-bottom:1px solid var(--line-soft);padding:10px 8px;text-align:left;vertical-align:top}.diff-table th,.data-table th{color:var(--muted);font-weight:600}.diff-arrow{color:var(--green);font-weight:900}
.program-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }.program{padding:13px;text-align:left;min-height:92px;background:#091915;border-color:var(--line-soft)}.program b{display:block;font-size:15px}.program small{color:var(--muted);font-size: 14px}.program.completed{border-color:#357b63;background:rgba(71,230,173,.07)}.program.active{border-color:var(--amber);box-shadow:0 0 18px rgba(255,198,109,.12)}.program.failed{border-color:var(--red)}
.monitor { display:grid;grid-template-columns:repeat(5,1fr);gap:9px }.monitor .metric b{font-size:18px}.log-window{max-height:260px;overflow:auto;background:#04100d;border:1px solid var(--line-soft);border-radius:11px;padding:10px}.log-row{display:grid;grid-template-columns:74px 1fr;gap:11px;padding:7px;border-bottom:1px solid #10261f;font-size:14px}.log-row time{color:var(--green)}
.bar-chart { display:grid;gap:13px }.bar-row{display:grid;grid-template-columns:170px 1fr 100px;gap:10px;align-items:center;font-size:15px}.bar-pair{display:grid;gap:4px}.bar{height:9px;border-radius:9px;background:#2a4f45;min-width:3px}.bar.after{background:var(--green)}.bar-value{text-align:right;color:var(--muted);font-size:14px}.donut-wrap{display:grid;grid-template-columns:190px 1fr;align-items:center;gap:20px}.donut{width:170px;height:170px;border-radius:50%;background:conic-gradient(#ff7c86 0 23.5%,#ffc66d 23.5% 48%,#6ec8ff 48% 77.4%,#47e6ad 77.4% 100%);position:relative}.donut::after{content:"102\A异常";white-space:pre;position:absolute;inset:31px;background:#0b1c18;border-radius:50%;display:grid;place-items:center;text-align:center;font-weight:900;font-size:18px}
.role-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:9px}.role-card{padding:12px;border:1px solid var(--line-soft);border-radius:11px}.role-card span{color:var(--muted);font-size:14px}.role-card b{display:block;font-size:15px;margin-top:2px}.decision-split{display:grid;grid-template-columns:1fr 1fr;gap:14px}.decision-card{border-top:3px solid var(--blue)}.decision-card.rule{border-top-color:var(--green)}
.matrix-wrap{overflow:auto}.matrix{min-width:980px}.architecture-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}.architecture-card{cursor:pointer;min-height:185px}.architecture-card .layer-number{color:var(--green);font-weight:900}.cap-column ul{padding-left:20px}.cap-column li{margin:8px 0}.cap-column.verified{border-top:3px solid var(--green)}.cap-column.research{border-top:3px solid var(--amber)}.cap-column.not-built{border-top:3px solid var(--red)}
.rail-head{font-size:14px;color:var(--muted);margin-bottom:10px}.rail-light{display:grid;justify-items:center;gap:4px;border:1px solid var(--line-soft);border-radius:11px;padding:9px 5px;margin-bottom:7px;background:#0a1916;text-align:center}.rail-light i{width:9px;height:9px;border-radius:50%;background:var(--green);box-shadow:0 0 9px rgba(71,230,173,.6)}.rail-light b{font-size:14px}.rail-light small{font-size: 15px;color:var(--muted)}.rail-expand{width:100%;font-size: 14px;padding:7px}.rail-details{margin-top:8px;font-size: 14px;color:var(--muted);overflow-wrap:anywhere}.rail-details b{display:block;color:var(--text);font-size: 14px}
.bottom-console { height:var(--bottom-h);border-top:1px solid var(--line);background:#071411;position:relative;z-index:18;padding:9px 18px;display:grid;grid-template-rows:48px 1fr;gap:8px }.dataflow-track{display:grid;grid-template-columns:repeat(8,1fr);gap:6px}.flow-stage{border:1px solid var(--line-soft);border-radius:8px;padding:5px 8px;font-size: 14px;color:var(--muted);position:relative}.flow-stage b{display:block;font-size: 14px;color:var(--text)}.flow-stage.done{border-color:#306b58;background:rgba(71,230,173,.05)}.flow-stage.active{border-color:var(--amber);background:rgba(255,198,109,.08)}.step-controller{display:grid;grid-template-columns:minmax(320px,1fr) auto;gap:16px;align-items:center;border:1px solid var(--line);background:#0d201b;border-radius:12px;padding:10px 14px}.step-info{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:center}.step-index{width:52px;height:52px;border-radius:12px;background:#14392f;display:grid;place-items:center;color:var(--green);font-size:17px;font-weight:900}.step-info b{display:block;font-size:17px}.step-info small{display:block;color:var(--muted);font-size: 14px}.step-actions{display:flex;gap:7px}.step-actions button{padding:8px 12px;font-size:14px}.step-progress{height:4px;background:#18372f;border-radius:4px;margin-top:5px;overflow:hidden}.step-progress i{display:block;height:100%;background:var(--green);transition:width .2s}
.detail-drawer{position:fixed;right:0;top:0;bottom:0;width:min(580px,48vw);background:#091713;border-left:1px solid var(--line);z-index:60;padding:22px;overflow:auto;transform:translateX(101%);transition:.22s ease}.detail-drawer.open{transform:translateX(0)}.drawer-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:18px}.drawer-head h2{margin:3px 0}.icon-button{width:38px;height:38px;padding:0;font-size:24px;display:grid;place-items:center}.scrim{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:50;opacity:0;pointer-events:none;transition:.2s}.scrim.open{opacity:1;pointer-events:auto}.detail-section{padding:14px 0;border-bottom:1px solid var(--line-soft)}.hash{font-family:Consolas,monospace;font-size:14px;color:#b6d8cd;word-break:break-all}
.modal{width:min(900px,82vw);max-height:82vh;background:#0a1916;color:var(--text);border:1px solid var(--line);border-radius:16px;padding:22px}.modal::backdrop{background:rgba(0,0,0,.66)}.scene-card{display:grid;grid-template-columns:1fr auto;gap:16px;align-items:center;margin:10px 0;padding:14px;border:1px solid var(--line);border-radius:12px}.scene-card.current{border-color:var(--green)}.review-guide label{display:inline-flex;gap:7px;align-items:center}.review-tags{display:flex;gap:7px;flex-wrap:wrap}.review-list{display:grid;gap:12px;padding-left:24px}.review-list li{padding-left:7px}.review-list span{display:block;color:var(--muted)}
.demo-controller{position:fixed;right:24px;bottom:174px;width:410px;background:#10231e;border:1px solid #3b725f;border-radius:15px;padding:16px;z-index:45;box-shadow:0 24px 70px rgba(0,0,0,.5);transform:translateY(calc(100% + 240px));opacity:0;visibility:hidden;transition:.25s;pointer-events:none}.demo-controller.open{transform:translateY(0);opacity:1;visibility:visible;pointer-events:auto}.demo-topline{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.demo-controller strong{font-size:19px}.demo-controller p{color:var(--muted)}.demo-progress{height:5px;background:#1d3d34;border-radius:5px;overflow:hidden;margin:12px 0}.demo-progress i{display:block;height:100%;background:var(--green);transition:width .25s}.demo-actions{display:flex;gap:8px}.text-button{background:transparent;border-color:transparent}
.toast{position:fixed;left:50%;bottom:170px;transform:translate(-50%,20px);opacity:0;z-index:80;background:#142b25;border:1px solid var(--line);padding:10px 16px;border-radius:10px;transition:.18s;pointer-events:none}.toast.open{opacity:1;transform:translate(-50%,0)}
.loading-state{height:100%;display:grid;place-content:center;text-align:center}.loading-orbit{width:52px;height:52px;border:3px solid #234b40;border-top-color:var(--green);border-radius:50%;margin:0 auto 12px;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}

/* 字号验收基线：正文不低于 16px，状态不低于 15px，工程字段不低于 14px。 */
.engineering-field,.technical-detail { font-size: 14px !important; }
.status-text { font-size: 15px !important; }

@media (max-width: 1450px) {
  .workbench-shell{grid-template-columns:210px minmax(0,1fr) 116px}.system-bar{grid-template-columns:285px 1fr auto}.grid-4{grid-template-columns:repeat(2,1fr)}.program-grid{grid-template-columns:repeat(4,1fr)}.monitor{grid-template-columns:repeat(3,1fr)}.consumption-chain{grid-template-columns:repeat(3,1fr)}.consumption-chain .chain-node:nth-child(3)::after{display:none}.role-grid{grid-template-columns:repeat(3,1fr)}
}
@media (max-height: 800px) {
  :root{--header-h:66px;--bottom-h:142px}.system-bar{padding:0 18px}main{padding-top:17px}.page-head{margin-bottom:14px}.card{padding:15px}.hero{min-height:220px;padding:24px}.page-head h1,h1{font-size:32px}.demo-controller{bottom:157px}
}






/* Cloudflare Pages 演示层状态；原 Competition UI 样式保持不变。 */
.cloud-status-strip { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)) 2fr; gap:10px; align-items:center; border:1px solid #2c6857; background:rgba(71,230,173,.055); border-radius:13px; padding:12px 15px; margin-bottom:14px; }
.cloud-status-strip div { border-right:1px solid var(--line-soft); }
.cloud-status-strip span { display:block; color:var(--muted); font-size:14px; }
.cloud-status-strip b { font-size:15px; color:var(--green-2); }
.cloud-status-strip p { margin:0; color:#bed0ca; font-size:14px; }
.cloud-architecture { margin-bottom:14px; }
.cloud-architecture-flow { display:grid; grid-template-columns:1fr auto 1.2fr auto 1.25fr auto 1fr auto 1.2fr; gap:9px; align-items:center; }
.cloud-architecture-flow > div { border:1px solid var(--line-soft); border-radius:10px; padding:11px; min-height:74px; }
.cloud-architecture-flow > div.optional { border-color:#7b6134; }
.cloud-architecture-flow span { color:var(--muted); display:block; font-size:14px; }
.cloud-architecture-flow b { display:block; font-size:14px; margin-top:3px; }
.cloud-architecture-flow i { color:var(--green); font-style:normal; }
@media (max-width:1450px) { .cloud-status-strip{grid-template-columns:repeat(3,1fr)} .cloud-status-strip p{grid-column:1/-1} .cloud-architecture-flow{grid-template-columns:1fr auto 1fr auto 1fr}.cloud-architecture-flow > *:nth-child(n+6){margin-top:8px} }