:root{
  --bg:#07080C;--panel:#0E1016;--ink:#E8E6E1;--dim:#6F6B64;--metal:#B8C4BC;--live:#E23B2F;--line:rgba(232,230,225,.1);
  --paper:#F4EFE4;--foil:#C4A574;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--bg);color:var(--ink);font:15px/1.45 "PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
a{color:var(--metal);text-decoration:none}
[hidden]{display:none !important}
.num{font-variant-numeric:tabular-nums;font-feature-settings:"tnum"}
.gate{min-height:100vh;display:grid;place-items:center;padding:32px}
.gate-box{width:min(400px,100%)}
.kicker{margin:0 0 12px;font-size:11px;letter-spacing:.28em;color:var(--metal)}
.gate h1{margin:0 0 10px;font-size:28px;font-weight:600}
.lede{margin:0;color:var(--dim);font-size:13px}
.row{display:flex;gap:8px;align-items:center}
.field,.btn{height:44px;border-radius:2px}
.field{flex:1;width:100%;padding:0 12px;border:1px solid var(--line);background:var(--panel)}
.btn{border:1px solid var(--metal);padding:0 16px;background:transparent;color:var(--ink)}
.btn.solid{background:var(--metal);color:#111;border-color:var(--metal)}
.btn[disabled]{opacity:.4}
.err{min-height:18px;margin:8px 0 0;color:var(--live);font-size:12px}
.ok{color:var(--metal);font-size:12px}
.inst{padding:24px 24px 80px;max-width:1440px;margin:0 auto}
.ident{display:flex;justify-content:space-between;align-items:center;min-height:36px;gap:16px}
.ident b{font-size:15px;font-weight:600}
.modes{display:flex;gap:8px}
.modes button,.chip{height:28px;padding:0 12px;border:1px solid var(--line);background:transparent;color:var(--dim);border-radius:2px}
.modes button.on,.chip.on{border-color:var(--metal);color:var(--ink)}
.spine{display:flex;gap:18px;align-items:center;min-height:72px;margin:8px 0 12px;overflow-x:auto;border-bottom:1px solid var(--line)}
.spine span{flex:0 0 auto;font-size:13px;color:var(--dim);position:relative;padding-bottom:10px}
.spine span i{display:block;width:7px;height:7px;border-radius:50%;background:var(--dim);margin:0 auto 6px}
.spine span.now{color:var(--ink)}
.spine span.now i{background:var(--live);box-shadow:0 0 0 4px rgba(226,59,47,.18)}
.spine span.done i{background:var(--metal)}
.main{display:grid;grid-template-columns:minmax(160px,1fr) minmax(280px,2fr) 200px;gap:20px;min-height:280px}
.col h3{margin:0 0 10px;font-size:12px;letter-spacing:.16em;color:var(--dim);font-weight:500}
.hero{text-align:center;padding:24px 8px}
.hero .n{font-size:120px;line-height:1;letter-spacing:-.04em;color:var(--metal)}
.hero .c{margin:8px 0 20px;color:var(--dim);font-size:13px}
.hero .cmd{min-width:220px;height:48px;font-size:18px}
.sig{display:grid;gap:10px}
.sig b{display:block;font-size:28px;color:var(--ink)}
.sig small{color:var(--dim)}
.drawer{margin-top:20px;border-top:1px solid var(--line);padding-top:14px}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}
.list{width:100%;border-collapse:collapse;font-size:13px}
.list th,.list td{padding:8px 6px;border-bottom:1px solid var(--line);text-align:left}
.list th{color:var(--dim);font-weight:500}
.clock{color:var(--live);font-variant-numeric:tabular-nums;font-size:13px}
.board{display:grid;gap:8px}
.card{width:100%;text-align:left;padding:16px 18px;border:1px solid var(--line);background:var(--panel);border-radius:2px}
.card strong{display:block;margin:4px 0}
.card em{font-style:normal;color:var(--dim);font-size:12px}
.doors{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:12px}
.doors a{display:block;padding:12px;border:1px solid var(--line);color:var(--ink);font-size:13px}
.doors a small{display:block;margin-top:4px;color:var(--dim);font-size:11px}
.types{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.type{text-align:left;padding:14px;border:1px solid var(--line);background:var(--panel)}
.type h3{margin:6px 0;font-size:15px}
.type p{margin:0;color:var(--dim);font-size:12px}
.form label,.pane-form label{display:grid;gap:6px;margin:10px 0;font-size:12px;color:var(--dim)}
textarea.field{height:auto;min-height:88px;padding:10px 12px;line-height:1.5;resize:vertical}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.pane-form{max-width:760px}
.msg{min-height:18px;margin:0 0 10px;color:var(--metal);font-size:12px}
.cover{min-height:58vh;display:grid;place-items:end center;padding:28px 20px 20px;background:#0a0b10 center/cover}
.cover h1{margin:0;font-family:"Songti SC","STSong","SimSun",serif;font-size:28px;font-weight:600;text-align:center}
.pass{background:var(--paper);color:#1a1712;padding:22px 20px 28px;border-top:1px solid var(--foil)}
.pass .who{font-family:"Songti SC","STSong","SimSun",serif;font-size:20px;margin:4px 0 12px}
.pass .code{font-size:20px;font-variant-numeric:tabular-nums}
.pass .next{font-size:13px;color:#5c564c;margin-top:12px}
.pass .st{display:flex;justify-content:space-between;align-items:center;margin-top:14px;font-size:12px}
.dot{width:8px;height:8px;border-radius:50%;background:var(--live);display:inline-block;margin-right:6px}
.paper-sec{max-width:560px;margin:0 auto;padding:20px 18px 80px;color:var(--ink)}
/* ---- 仪器升级：玻璃面板、KPI 条、进度、同步脉冲、精细字号 ---- */
.ident{position:relative;padding-bottom:10px}
.ident:after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:linear-gradient(90deg,var(--metal),transparent 60%);opacity:.35}
.hero .n{text-shadow:0 0 40px rgba(184,196,188,.18)}
.kpis{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin:14px 0 4px}
.kpi{padding:10px 12px;border:1px solid var(--line);background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,0));border-radius:2px}
.kpi small{display:block;color:var(--dim);font-size:11px;letter-spacing:.08em}
.kpi b{display:block;font-size:24px;font-weight:500;margin-top:2px;color:var(--ink)}
.glass{padding:14px 16px;border:1px solid var(--line);background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.01));border-radius:2px}
.glass h3,.inst h3{margin:0 0 8px;font-size:12px;letter-spacing:.16em;color:var(--dim);font-weight:500}
.inst h3{margin-top:14px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.rowk{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid var(--line);font-size:13px}
.rowk small{color:var(--dim);font-size:12px}
.rowk b{font-weight:500}
.bar{height:3px;background:var(--line);margin:4px 0 10px;overflow:hidden}
.bar i{display:block;height:100%;background:linear-gradient(90deg,var(--metal),#dfe7e2);transition:width .6s cubic-bezier(.2,.7,.2,1)}
.bar.big{height:6px}
.tag{display:inline-block;min-width:18px;text-align:center;font-size:11px;color:var(--dim)}
.tag.ok{color:var(--metal)}
.btn.sm{height:30px;padding:0 10px;font-size:12px}
.field.sm{height:34px;font-size:13px}
.sync{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--dim)}
.sync i{width:6px;height:6px;border-radius:50%;background:var(--dim)}
.sync.fresh{color:var(--ink)}
.sync.fresh i{background:var(--live);box-shadow:0 0 0 4px rgba(226,59,47,.18);animation:pulse 1.2s ease-out 2}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(226,59,47,.5)}100%{box-shadow:0 0 0 10px rgba(226,59,47,0)}}
.sw{display:flex;flex-wrap:wrap;gap:8px}
.sw label{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 10px;border:1px solid var(--line);border-radius:2px;font-size:12px;color:var(--dim);margin:0;cursor:pointer}
.sw label:has(input:checked){border-color:var(--metal);color:var(--ink)}
.strip{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin:16px 0}
.strip .kpi b{font-size:30px}
.clients{display:grid;gap:8px}
.client-row{display:grid;grid-template-columns:2fr 1fr 1fr 1fr 1fr auto;gap:10px;align-items:center;padding:12px 14px;border:1px solid var(--line);background:var(--panel)}
.client-row small{display:block;color:var(--dim);font-size:11px}
.client-row b{font-weight:500;font-variant-numeric:tabular-nums}
@media(max-width:860px){
  .kpis,.strip{grid-template-columns:repeat(3,1fr)}
  .grid3{grid-template-columns:1fr 1fr}
  .client-row{grid-template-columns:1fr 1fr 1fr}
  .inst{padding:16px 16px 72px}
  .main{grid-template-columns:1fr}
  .hero .n{font-size:72px}
  .hero .cmd{font-size:16px}
  .types,.doors{grid-template-columns:1fr 1fr}
}
@media(max-width:520px){.types{grid-template-columns:1fr}}