:root{font-family:system-ui,-apple-system,"Noto Sans TC","Microsoft JhengHei",sans-serif;font-size:14px;color-scheme:dark}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{--bg:#091e1c;--panel:#123a33;--panelHi:#174239;--edge:#2d6255;--text:#eaf5ef;--muted:#acccc0;--primary:#ff8d2f;--primaryText:#1b210f;--field:#13342f;background:var(--bg);color:var(--text);margin:0;line-height:1.45}
body[data-theme="light"]{--bg:#fff8f0;--panel:#fffdf9;--panelHi:#fff0df;--edge:#e4bd94;--text:#342717;--muted:#745440;--primary:#bf5a17;--primaryText:#fff;--field:#fff4e8;color-scheme:light}
a{color:inherit}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #ffdc70;outline-offset:3px}button:hover{filter:brightness(1.12)}
.topbar{min-height:63px;background:linear-gradient(105deg,#0b483e,#174239 72%,#925022);display:flex;justify-content:space-between;align-items:center;gap:16px;padding:8px clamp(14px,2vw,30px);color:white}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none}.brand-mark{background:#ee7923;border-radius:8px;padding:9px 7px;font-weight:900;font-size:13px}.brand strong{display:block;font-size:19px}.brand small{display:block;color:#c5e4da;font-size:11px}.actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.actions a,.actions button{border:1px solid #7ba99e;border-radius:8px;padding:8px 10px;min-height:36px;color:#fff;background:#10382f;text-decoration:none;font-size:13px}.preview-label{color:#ffdaaa;font-size:12px;font-weight:800}
main{max-width:1600px;margin:auto;padding:17px clamp(12px,2vw,27px) 35px}.review-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:0 0 14px}.review-title h1{font-size:clamp(21px,2.6vw,32px);line-height:1.15;margin:4px 0 6px}.review-title p{margin:0;color:var(--muted);font-size:13px;line-height:1.5}.kicker{color:var(--primary);font-weight:800;letter-spacing:.08em;font-size:11px}
.mode-switch{display:flex;gap:5px;flex:0 0 auto;background:var(--panel);border:1px solid var(--edge);border-radius:12px;padding:5px}.mode-switch button{min-width:163px;background:transparent;border:1px solid transparent;color:var(--text);padding:10px 12px;border-radius:9px;font-weight:800;font-size:15px}.mode-switch button small{display:block;font-size:11px;color:var(--muted);font-weight:500;margin-top:1px}.mode-switch button.selected{background:var(--primary);color:var(--primaryText);box-shadow:0 6px 20px #0002}.mode-switch button.selected small{color:inherit;opacity:.8}
.stage-nav{display:flex;border:1px solid var(--edge);border-radius:9px;overflow:auto;background:var(--panel);margin-bottom:10px;scrollbar-width:thin}.stage-nav button{flex:1;min-width:118px;border:0;border-right:1px solid var(--edge);background:none;color:var(--muted);padding:10px 12px;min-height:45px;text-align:center;white-space:nowrap;font-size:13px;font-weight:700}.stage-nav button:last-child{border-right:0}.stage-nav button span{display:inline-block;color:var(--primary);font-weight:900;margin-right:9px}.stage-nav button.selected{color:var(--text);background:var(--panelHi);box-shadow:inset 0 -3px var(--primary)}
.workbench{min-width:0;background:var(--bg);border:1px solid var(--edge);border-radius:12px;padding:9px;box-shadow:0 8px 35px #00000012}
.scoreboard{background:linear-gradient(110deg,#115045,#19493b 65%,#6b4528);border-radius:8px;color:#fff;display:grid;grid-template-columns:minmax(185px,1.7fr) repeat(2,minmax(130px,1fr)) repeat(2,minmax(110px,.8fr));gap:10px;padding:12px 16px;min-height:83px;align-items:center}
.identity{display:flex;flex-direction:column;gap:2px;min-width:0}.identity-main{font-size:18px;font-weight:900}.identity>span:nth-child(2){font-size:12px;color:#e9ede6}.identity .account{font-size:10px;color:#d2e0db;opacity:.9}.time-stat{display:flex;flex-direction:column;gap:2px;min-width:0}.time-stat span{font-size:11px;color:#dbe4d5}.time-stat strong{font-size:clamp(19px,2.65vw,35px);font-variant-numeric:tabular-nums;line-height:1.14;white-space:nowrap}.time-stat em{font-style:normal;color:#ffad57;font-weight:700;font-size:.53em}.main-stat strong{font-size:clamp(26px,3vw,42px)}.secondary strong{font-size:clamp(16px,2.1vw,25px)}
.overview{display:grid;grid-template-columns:1.4fr 1fr;gap:8px;margin-top:9px}.topic-overview,.route-overview{min-width:0;min-height:124px;border:1px solid var(--edge);background:var(--panel);border-radius:10px;padding:10px 13px}.route-overview{border:2px solid var(--primary);padding:8px 12px}.panel-header{display:flex;justify-content:space-between;align-items:center;gap:12px}.panel-header h2{font-size:13px;margin:0}.panel-header>span{font-size:10px;color:var(--muted)}.hint-chip{border:1px solid var(--edge);background:var(--panelHi);border-radius:999px;padding:3px 9px;font-size:10px!important}.overview-lead{font-size:13px;margin:9px 0 9px;line-height:1.45}.facts{display:flex;flex-wrap:wrap;gap:6px}.facts>span{border-radius:100px;border:1px solid var(--edge);background:var(--panelHi);font-size:11px;color:var(--muted);padding:4px 8px}.route-overview img{display:block;width:100%;height:75px;object-fit:contain;margin:4px auto 0}
.track-field{margin-top:9px;border-radius:8px;background:var(--field);border:1px solid var(--edge);padding:6px 8px 8px;position:relative;overflow:hidden}.field-label{display:flex;justify-content:space-between;align-items:center;padding:1px 5px 7px;gap:15px}.field-label h2{font-size:12px;margin:0}.field-label span{color:var(--muted);font-size:11px}.track-field>img{display:block;width:100%;height:auto;max-height:36vh;object-fit:contain;border:1px solid #8c9c8f}.field-overlay{position:absolute;inset:38px 9px 9px;display:grid;place-items:center;text-align:center;background:#06261fc9;padding:22px;color:white}.field-overlay[hidden]{display:none}.field-overlay strong{font-size:21px;display:block}.field-overlay p{max-width:580px;font-size:13px;line-height:1.7}
.control-deck{margin-top:9px;border-radius:9px;border:1px solid var(--edge);background:var(--panel);padding:8px 10px}.deck-main{display:flex;align-items:center;gap:9px;flex-wrap:wrap}.deck-main strong{font-size:12px;white-space:nowrap}.board-chips{display:flex;gap:5px;flex-wrap:wrap}.board-chips span{background:var(--panelHi);border:1px solid var(--edge);border-radius:7px;padding:6px 9px;font-weight:800;font-size:12px;white-space:nowrap}.board-chips .optional{color:var(--muted);font-weight:500}.deck-links{display:flex;gap:12px;margin-left:auto;font-size:12px;color:var(--muted);align-items:center}.deck-controls{display:flex;gap:7px;flex-wrap:wrap;align-items:center;margin-top:8px;padding:8px;border:1px solid var(--edge);border-radius:8px}.pseudo-select,.pseudo-button{min-height:40px;display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;padding:9px 11px;background:var(--panelHi);border:1px solid var(--edge);border-radius:7px;font-size:13px;font-weight:700}.pseudo-select{font-weight:500}.pseudo-button.accent{background:var(--primary);color:var(--primaryText);border-color:var(--primary)}.mode-controls{display:flex;align-items:center;gap:12px;border-left:3px solid var(--primary);border-radius:5px;background:var(--panelHi);padding:8px 12px;margin-top:8px;font-size:12px;min-height:37px}.mode-controls .action-example{margin-left:auto;color:var(--muted)}
.mode-explainer{margin-top:12px;display:flex;align-items:center;justify-content:space-between;gap:22px;background:var(--panel);border:1px solid var(--edge);padding:17px 20px;border-radius:12px}.mode-explainer h2{font-size:18px;margin:4px 0}.mode-explainer p{font-size:13px;color:var(--muted);margin:0;line-height:1.55}.result-mini{display:flex;flex-direction:column;min-width:245px;gap:6px;padding:10px 16px;background:var(--panelHi);border:1px solid var(--edge);border-radius:9px}.result-mini strong{font-size:13px}.result-mini span{color:var(--primary);font-variant-numeric:tabular-nums;font-weight:700}.design-footnote{color:var(--muted);font-size:12px;line-height:1.6;padding:4px 2px}
@media(max-width:1200px){.scoreboard{grid-template-columns:minmax(155px,1.4fr) repeat(2,minmax(110px,1fr)) minmax(96px,.8fr)}.scoreboard .time-stat:last-child{display:none}.review-title p{max-width:510px}.route-overview img{height:66px}.overview-lead{font-size:12px}}
@media(max-width:850px){.review-head{flex-direction:column;align-items:stretch}.mode-switch{width:100%}.mode-switch button{min-width:0;flex:1}.scoreboard{grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.scoreboard .identity{grid-column:1/-1}.scoreboard .time-stat:last-child{display:flex}.overview{grid-template-columns:1fr}.topic-overview,.route-overview{min-height:auto}.route-overview img{height:90px}.track-field>img{max-height:none}.mode-explainer{flex-direction:column;align-items:stretch}.result-mini{min-width:0}.stage-nav button{min-width:103px}.deck-links{margin-left:0}}
@media(max-width:540px){.topbar{padding:8px 12px;align-items:flex-start}.brand strong{font-size:16px}.brand small{display:none}.actions{justify-content:flex-end;gap:5px}.actions a,.actions button{font-size:11px;padding:5px 7px;min-height:31px}.preview-label{width:100%;text-align:right;font-size:10px}main{padding:13px 8px 24px}.review-head{gap:12px}.review-title p{font-size:12px}.mode-switch button{padding:8px 7px;font-size:13px}.mode-switch button small{font-size:10px}.scoreboard{grid-template-columns:repeat(2,minmax(0,1fr));padding:10px}.scoreboard .identity{grid-column:1/-1}.time-stat strong{font-size:24px}.time-stat.main-stat strong{font-size:30px}.stage-nav button{min-width:100px;font-size:12px}.field-label span{display:none}.deck-controls{gap:5px}.pseudo-button,.pseudo-select{font-size:12px;min-height:38px;padding:7px}.mode-controls{flex-wrap:wrap}.mode-controls .action-example{margin:0}.result-mini span{font-size:13px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.result-cases{display:flex;gap:6px;margin-top:6px;flex-wrap:wrap}.result-cases button{min-height:34px;border-radius:6px;border:1px solid var(--edge);background:var(--panel);color:var(--text);font-size:12px;padding:6px 9px}.result-cases button.selected{background:var(--primary);color:var(--primaryText);border-color:var(--primary)}

/* Compact live-workbench framing: the review explanation disappears;
   1280x800 landscape can show timers, entire field, route and actions together. */
.workbench-only .review-head,.workbench-only .stage-nav,
.workbench-only .mode-explainer,.workbench-only .design-footnote{display:none}
.workbench-only main{padding-top:6px;padding-bottom:3px}
.workbench-only .workbench{padding:6px}
.workbench-only .scoreboard{min-height:64px;padding:6px 12px}
.workbench-only .overview{margin-top:6px}
.workbench-only .topic-overview,.workbench-only .route-overview{min-height:97px;padding:6px 10px}
.workbench-only .overview-lead{margin:5px 0;font-size:12px}
.workbench-only .route-overview img{height:60px}
.workbench-only .track-field{margin-top:6px;padding:4px 7px}
.workbench-only .track-field>img{max-height:42vh}
.workbench-only .control-deck{margin-top:6px;padding:6px}
.workbench-only .deck-controls{margin-top:5px;padding:6px}
.workbench-only .pseudo-button,.workbench-only .pseudo-select{min-height:44px}
.workbench-only .mode-controls{margin-top:5px;padding:5px 10px;min-height:30px}
@media(max-width:850px){.workbench-only main{padding:5px 8px 15px}}

/* Five-phase switcher belongs to a collapsed design-only inspector, NOT the game UI. */
.review-flow-tools{margin-top:12px;border:1px dashed var(--edge);border-radius:9px;background:var(--panel);padding:10px 12px}
.review-flow-tools>summary{cursor:pointer;list-style:disclosure-closed;color:var(--muted);font-size:12px;padding:7px 4px}
.review-flow-tools[open]>summary{margin-bottom:10px}
.review-flow-tools .stage-nav{margin-bottom:0}
.workbench-only .review-flow-tools{display:none!important}
