:root{color-scheme:dark;font-family:Inter,"PingFang SC","Microsoft YaHei",sans-serif;color:#f5f5f0;background:#11151c;font-synthesis:none}*{box-sizing:border-box}body{margin:0}main{max-width:1480px;margin:auto;padding:30px 40px}/* 高对比品牌字标置于首屏页头：Bocha 用亮白，Jev 与游戏主色保持一致。
   字标和副标题分开设定字号，避免旧品牌的通用 span 规则覆盖分隔符。 */
header{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-bottom:28px;border-bottom:1px solid #303947}
.brand{display:flex;flex-direction:column;align-items:flex-start;gap:10px;text-decoration:none;min-width:0}
.brand-wordmark{display:flex;align-items:center;gap:15px;color:#f7f9fc;font-size:clamp(2rem,4vw,2.875rem);font-weight:800;line-height:1.15;letter-spacing:-1.5px;white-space:nowrap}
.brand-divider{color:#667183;font-weight:300;font-size:.78em;letter-spacing:0}
.brand-product{color:#f8cd53}
.brand-subtitle{color:#a5afbe;font-size:14px;line-height:1.5;letter-spacing:1px}
.brand-subtitle span{margin:0 5px;color:#667183}
.brand:focus-visible{outline:3px solid #8ed4ff;outline-offset:7px;border-radius:4px}
.brand-meta{display:flex;flex-direction:column;align-items:flex-end;gap:12px;flex-shrink:0}
.chapter{font-size:12px;color:#8998ad;letter-spacing:1.5px}
.tag{border:1px solid #615233;border-radius:5px;padding:9px 12px;background:#f4c94c0a;color:#f1d17c;font-size:13px;line-height:1.4;letter-spacing:1px;white-space:nowrap}
.layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:28px;margin-top:32px}.game-top{display:flex;justify-content:space-between;align-items:center;gap:16px;margin:0 0 22px}.eyebrow{font-size:12px;color:#a5afbe;letter-spacing:2px}h1{font-size:30px;margin:10px 0 0;font-weight:650}h2{font-size:22px;margin:10px 0 22px}.stats{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:16px;color:#a5afbe;font-size:12px;padding:18px 22px;margin-bottom:18px;background:#191f29;border:1px solid #313947;border-radius:10px}.stats b{display:block;font:26px monospace;color:#f5ce58;margin-top:6px;overflow-wrap:anywhere}.distance-stat strong{display:flex;align-items:baseline;gap:4px;font-weight:400}.distance-stat b{white-space:nowrap;overflow-wrap:normal}.distance-stat small{font-size:12px;color:#a5afbe}.round-timer{flex-shrink:0;min-width:104px;text-align:center;border:1px solid #695b37;background:#f4c94c0a;border-radius:10px;padding:10px 14px}.round-timer span{display:block;color:#b7a87d;font-size:11px;letter-spacing:1px}.round-timer b{display:block;font:700 30px monospace;font-variant-numeric:tabular-nums;color:#f8cd53;line-height:1.1;margin-top:5px}.round-timer[data-urgent="true"]{border-color:#c4615d;background:#c4444420}.round-timer[data-urgent="true"] b,.round-timer[data-urgent="true"] span{color:#ffada3}.canvas-wrap{position:relative;overflow:hidden;border:1px solid #495572;border-radius:12px;background:#81c5dd}canvas{width:100%;height:auto;display:block;image-rendering:pixelated}.world-label{position:absolute;left:22px;top:20px;font:12px monospace;letter-spacing:2px;color:#234c65;background:#ffffff90;padding:8px 10px}.banner{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#182c4166;gap:14px;text-align:center;padding:20px}.banner strong{font-size:34px;text-shadow:0 3px #182c41}.banner span{font-size:15px;background:#172231d9;padding:10px 16px;border-radius:5px}.banner[hidden]{display:none}.controls{display:flex;gap:10px;align-items:center;margin-top:22px;flex-wrap:wrap}button{background:#232b37;border:1px solid #3b4655;color:#edf0f5;font:inherit;font-size:14px;padding:12px 16px;border-radius:7px;cursor:pointer}button:hover{filter:brightness(1.13)}button:disabled{opacity:.4;cursor:default}button.primary{background:#f4c94c;color:#22271f;border-color:#f4c94c;font-weight:700;min-width:170px;display:flex;justify-content:space-between;gap:16px}button:focus-visible{outline:3px solid #8ed4ff;outline-offset:3px}#status{margin-left:auto;font-size:13px;color:#abb9cb}.footnote{font-size:12px;color:#8593a5;line-height:1.8;margin-top:18px}aside{border:1px solid #313947;background:#191f29;border-radius:12px;padding:24px}.reading{border-top:1px solid #313947;padding-top:20px}.reading>span,.label,.metrics span{font-size:12px;color:#a2b0c1}.reading p{font-size:14px;line-height:1.9;min-height:75px}.decision{margin-top:24px}.label{display:flex;justify-content:space-between}.label small{color:#eaca69}.choice{margin-top:17px}.choice-text{display:flex;justify-content:space-between;font-size:14px}.bar{height:5px;background:#303946;margin-top:9px;border-radius:4px;overflow:hidden}.bar i{display:block;height:100%;background:#63738a;transition:width .3s}.selected .bar i{background:#f4c94c}.selected .choice-text{color:#f4ce64}.metrics{display:flex;gap:26px;border-block:1px solid #313947;padding:20px 0;margin-top:26px}.metrics b{display:block;font-size:15px;margin-top:9px}@media(max-width:1050px){main{padding:22px}.layout{grid-template-columns:minmax(0,1fr)}aside{display:grid;grid-template-columns:1fr 1fr;gap:0 28px}.panel-title,.footnote{grid-column:1/-1}.reading{border:0;padding:0}.decision{margin:0}.metrics{margin-top:12px}.chapter{display:none}}@media(max-width:560px){main{padding:16px}header{padding-bottom:22px;gap:16px;flex-wrap:wrap}.layout{margin-top:22px}.tag{font-size:12px;padding:8px 10px}.brand-wordmark{font-size:2rem;gap:10px;letter-spacing:-1px}.brand-subtitle{font-size:13px}.brand-meta{align-self:center}h1{font-size:23px}.stats{gap:12px;padding:14px 16px}.stats b{font-size:23px}.round-timer{min-width:86px;padding:9px 11px}.round-timer b{font-size:26px}.round-timer span{font-size:10px}.game-top{align-items:flex-end}h1{font-size:21px}aside{display:block;padding:20px}.banner strong{font-size:25px}.banner span{font-size:12px}.world-label{top:10px;left:10px;font-size:10px}.controls{gap:8px}button{padding:11px 12px}#status{width:100%;margin-top:8px}.decision{margin-top:20px}}

/* 预演与请求参数可折叠，便于核对模型看到的实际场景。 */
details{font-size:13px;margin:14px 0;color:#afbdd0}summary{cursor:pointer;color:#e2c771;padding:6px 0}#forecast p{font-size:12px;line-height:1.7;margin:8px 0}#request-data{max-height:240px;overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere;font-size:12px;background:#111720;padding:10px;border-radius:5px}@media(max-width:1050px){.forecast-panel,.request-panel{grid-column:1/-1}}

/* 回合倒计时放在画面上方，得分浮于画布；路线编号区分重新生成的一局。 */
.score-label{position:absolute;right:20px;top:20px;color:#fff3bc;background:#26384dd9;padding:8px 12px;border-radius:4px;font:12px monospace;letter-spacing:1px;pointer-events:none}.score-label b{margin-left:8px;font-size:16px}.run-strip{display:flex;justify-content:space-between;gap:12px;color:#8593a5;font-size:12px;margin-top:14px}.run-strip>span:first-child{display:flex;align-items:center;gap:8px}.run-strip i{width:6px;height:6px;border-radius:50%;background:#8ec697}.run-strip code{color:#afbdd0;margin-left:6px;font-size:11px}@media(max-width:560px){.score-label{top:10px;right:10px;font-size:10px;padding:8px}.score-label b{font-size:12px}.run-strip{font-size:10px}.run-strip code{font-size:10px}.game-top{flex-wrap:wrap}.banner strong{font-size:clamp(18px,4vw,25px)}}

/* 当前动作方向沿用原面板的强调色。 */
#action-direction{font-style:normal;color:#f4ce64;margin-left:5px}

/* 准备时只展示居中的开始入口；暂停和结算继续使用原遮罩说明。
   显式遵守 hidden，防止通用按钮的 display:flex 让已隐藏入口重新出现。 */
.banner[data-state="ready"] #banner-title,.banner[data-state="ready"] #banner-text,#start[hidden]{display:none}
#start{justify-content:center;font-size:16px;min-width:170px;padding:14px 24px;box-shadow:0 5px 18px #17223140}

main{max-width:1120px;padding:20px 24px}.layout{margin-top:0;grid-template-columns:minmax(0,1fr) 300px;gap:16px}.site-header{padding:0;display:block}.site-header .site-header-inner{width:100%}.site-header .site-logo{flex-direction:row}@media(max-width:800px){main{padding:16px 12px}.layout{grid-template-columns:1fr}}

/* Keep the world, round controls and decision panel inside the desktop viewport. */
@media(min-width:701px) and (min-height:560px){
 body{height:100dvh;display:grid;grid-template-rows:54px minmax(0,1fr)}
 main{width:100%;max-width:1120px;height:100%;min-height:0;margin:0 auto;padding:16px 24px}
 .layout{height:100%;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:16px;margin:0}
 .play{min-height:0;display:grid;grid-template-rows:64px 66px minmax(0,1fr)22px 38px;gap:10px}
 .game-top{margin:0;align-items:center;flex-wrap:nowrap}.game-top h1{font-size:25px;margin:6px 0 0}.eyebrow{font-size:9px;letter-spacing:1.6px}
 .round-timer{min-width:86px;padding:7px 11px;border-radius:8px}.round-timer b{font-size:26px}.round-timer span{font-size:9px}
 .stats{margin:0;padding:9px 15px;gap:12px;font-size:10px;border-radius:8px}.stats b{font-size:23px;margin-top:5px}.distance-stat small{font-size:10px}
 .canvas-wrap{min-height:0;display:grid;place-items:center;background:#81c5dd;border-radius:10px}.canvas-wrap canvas{width:100%;height:100%;min-height:0;object-fit:contain}
 .run-strip{margin:0;align-items:center;font-size:10px}.run-strip code{font-size:10px}.controls{margin:0;gap:8px;flex-wrap:nowrap}.controls button{padding:8px 11px;font-size:12px}.controls #status{width:auto;margin:0 0 0 auto;font-size:11px}
 aside{display:block;min-height:0;padding:16px;overflow:auto;scrollbar-width:thin}.panel-title h2{font-size:19px;margin:6px 0 12px}.reading{padding-top:10px;border-top:1px solid #313947}.reading>span,.label,.metrics span{font-size:10px}.reading p{min-height:0;font-size:11px;line-height:1.6;margin:8px 0}
 details{font-size:11px;margin:9px 0}summary{padding:4px 0}#forecast p{font-size:10px;line-height:1.5;margin:6px 0}#request-data{font-size:10px;max-height:130px}
 .decision{margin-top:12px}.label{gap:8px;flex-wrap:wrap}.label small{font-size:9px}.choice{margin-top:10px}.choice-text{font-size:11px}.bar{height:4px;margin-top:6px}
 .metrics{gap:18px;padding:12px 0;margin-top:15px}.metrics b{font-size:13px;margin-top:6px}.footnote{font-size:10px;line-height:1.6;margin:10px 0 0}
 .banner{padding:14px;gap:10px}.banner strong{font-size:26px}.banner span{font-size:12px;padding:8px 12px}#start{min-width:150px;font-size:14px;padding:12px 18px}
 .world-label{font-size:9px;top:12px;left:12px;padding:6px 8px}.score-label{font-size:10px;top:12px;right:12px;padding:6px 8px}.score-label b{font-size:13px}
}
@media(min-width:701px) and (max-width:800px) and (min-height:560px){body{grid-template-rows:88px minmax(0,1fr)}main{padding:12px}.layout{grid-template-columns:minmax(0,1fr) 250px;gap:12px}.game-top h1{font-size:21px}.round-timer{min-width:76px}.stats{gap:8px;padding:10px}.stats b{font-size:20px}aside{padding:12px}}
@media(min-width:701px) and (max-height:680px){main{padding-top:10px;padding-bottom:10px}.play{grid-template-rows:54px 56px minmax(0,1fr)18px 34px;gap:7px}.game-top h1{font-size:22px}.stats{padding:7px 12px}.stats b{font-size:20px;margin-top:3px}.round-timer b{font-size:23px}.controls button{padding:7px 9px;font-size:11px}.panel-title h2{font-size:17px}.reading p{line-height:1.4}.footnote{margin-top:8px}}
@media(max-width:700px){main{padding:14px 12px}.layout{display:flex;flex-direction:column;gap:14px}.game-top{margin-bottom:12px}.stats{padding:10px 12px;margin-bottom:12px;font-size:10px;gap:10px}.stats b{font-size:21px}.controls{margin-top:12px}.run-strip{margin-top:9px}.canvas-wrap{max-height:calc(100dvh - 320px);min-height:170px}.canvas-wrap canvas{max-height:calc(100dvh - 320px);min-height:170px;object-fit:contain}.banner strong{font-size:21px}.banner span{font-size:11px}aside{padding:15px}.game-top h1{font-size:22px}.round-timer{min-width:78px;padding:7px 9px}.round-timer b{font-size:25px}.world-label{font-size:8px}}
main>.game-top{margin-bottom:14px}.play>.game-top{display:none}
@media(min-width:701px) and (min-height:560px){main{display:grid;grid-template-rows:88px minmax(0,1fr);gap:12px}main>.game-top{margin:0}.play{grid-template-rows:66px minmax(0,1fr)22px 38px}}
@media(min-width:701px) and (max-width:960px) and (min-height:560px){main{grid-template-rows:140px minmax(0,1fr)}}
@media(min-width:701px) and (max-height:680px){.play{grid-template-rows:56px minmax(0,1fr)18px 34px}}
@media(min-width:761px) and (min-height:560px){main{grid-template-rows:110px minmax(0,1fr)}}
@media(min-width:701px) and (max-width:760px) and (min-height:560px){main{grid-template-rows:170px minmax(0,1fr)}}