/* Gameplay structure. Dialog contents keep their established visual style. */
html body.essential header{top:calc(var(--safe-top,0px) + 2px);left:calc(var(--safe-left,0px) + 4px);right:auto;width:76px;height:40px;display:block}
body.essential header .brand{display:none}
html body.essential #nativeMenu{width:76px;height:40px;min-height:40px;font-size:12px;padding:6px;border:3px solid transparent;border-image:var(--frame-gold) 8 fill / 8px;border-radius:0;background:transparent;color:#332e24;box-shadow:none}
html body.essential .hud,html[data-theme=dark] body.essential .hud{top:calc(var(--safe-top,0px) + 2px);left:calc(var(--safe-left,0px) + 86px);right:calc(var(--safe-right,0px) + 5px);width:auto;height:40px;display:flex;justify-content:space-between;gap:8px;border:0;border-image:none;box-shadow:none;background:none}
html body.essential #hudDetailsButton{display:flex;align-items:center;gap:10px;height:40px;min-width:0;padding:6px 12px;border:1px solid #7b9774;border-image:none;background:#193e35;color:#f4eac2;border-radius:3px;box-shadow:none;text-shadow:none}
html body.essential #compactGoal{font-size:16px;margin:0;letter-spacing:0;color:#fff0b4}
html body.essential #compactObjective{font-size:11px;color:#e4e9d2;white-space:nowrap}
html body.essential .details-label{font:10px Arial;color:#d7d9bc;letter-spacing:0}
html body.essential .hud .compact-clock{display:flex;align-items:center;gap:8px;padding:5px 12px;min-height:0;background:#173a33;border:1px solid #627c64;border-radius:3px;box-shadow:none}
html body.essential .hud .compact-clock:before{content:none}
html body.essential .hud #timer{font-size:20px;margin:0;color:#fff0b4}
html body.essential .clock-label{font-size:10px;color:#d7dfc7}
html body.essential .action-bar{left:calc(var(--safe-left,0px) + 6px);right:calc(var(--safe-right,0px) + 6px);bottom:3px;height:48px;display:flex;align-items:center;padding:0;gap:8px;border:0;border-image:none;background:none;box-shadow:none}
html body.essential .feedback{flex:1;min-width:0;height:44px;padding:3px 5px;border:0;border-image:none;background:none;box-shadow:none;display:flex;flex-direction:column;justify-content:center}
html body.essential #hint{display:none;margin:0!important;font-size:11px!important;background:#193e35;color:#f2e8ca;padding:3px 6px;border-radius:2px;line-height:1.2}
html body.essential.has-feedback #hint{display:block;width:fit-content;max-width:100%}
html body.essential #selectedInfo{display:block;font-size:11px;line-height:1.2;color:#fff0cf;background:#193e35;padding:3px 6px;border-radius:2px;width:fit-content;max-width:100%;max-height:30px;overflow-y:auto;touch-action:pan-y}
html body.essential #selectedInfo[hidden]{display:none}
html body.essential .controls{gap:6px;padding:0;margin:0;flex:none}
html body.essential .controls button{min-height:44px;height:44px;padding:6px 12px;font-size:11px}
body.essential .controls:not(.has-selection) #rotate{visibility:hidden;pointer-events:none}
html body.essential .controls #closeVan{min-width:130px;font-size:11px}
html body.essential .yard-tools{padding:2px 6px;height:44px}
html body.essential .yard-tools label{display:none}
html body.essential .yard-tools select,html body.essential .yard-tools #nativeSort{height:38px;min-height:38px;border:1px solid #829578;border-image:none;background:#234b40;color:#f4eac3;border-radius:3px;box-shadow:none;text-shadow:none}
html body.essential .yard-tools button{min-height:38px;height:38px}
html body.essential #androidNavigation{width:min(680px,96vw)}
body.essential #nativeNav nav,body.essential #nativeNav .settings{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:8px 0;width:100%}
body.essential #nativeNav button{min-height:44px}
html body.essential #nativeNav .route{position:static;width:auto;padding:8px;margin:8px 0;box-shadow:none;background:none;border:0;border-image:none}
html body.essential #nativeNav #levelsButton,html body.essential #nativeNav #cargoZoom{position:static;transform:none;margin:0;display:block}
html body.essential #nativeNav #levelsButton{border:3px solid transparent;border-image:var(--frame-gold) 8 fill / 8px;background:transparent;color:var(--pixel-ink);box-shadow:none}
html body.essential #nativeNav #cargoZoom{width:100%}
html body.essential #nativeNav .settings{grid-template-columns:repeat(3,minmax(0,1fr))}
html body.essential.mode-daily #nativeNav .settings{grid-template-columns:repeat(4,minmax(0,1fr))}
html body.essential #nativeNav button{width:100%;min-width:0;padding:6px;font-size:12px}
html body.essential #androidNavigation .win-card{padding:12px}
html body.essential #androidNavigation h2{font-size:18px;margin:0 0 8px}
html body.essential #nativeNav .route{padding:0;margin:6px 0}
html body.essential #nativeNav .route h1{font-size:16px;margin:3px 0}
html body.essential #nativeNav .route p{margin:3px 0;font-size:11px}
html body.essential #nativeNav .route .eyebrow{font-size:8px;letter-spacing:1px}
@media(max-height:440px) and (orientation:landscape){html body.essential #nativeNav .route p{display:none}}
@media(max-width:500px) and (orientation:portrait){html body.essential #nativeNav .settings,html body.essential.mode-daily #nativeNav .settings{grid-template-columns:repeat(2,minmax(0,1fr))}}
.shop-preview{position:static;inset:auto;display:block;width:100%;height:110px;object-fit:contain;image-rendering:pixelated}
#wildcardChoices{display:flex;gap:6px;flex-wrap:wrap;margin:8px 0}
#wildcardChoices button{width:auto;min-height:44px;flex:1 1 120px}
body.essential .detail-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px;text-align:left;margin:18px 0}
body.essential .detail-stats>div{padding:8px;background:#839d781f;border-radius:3px}
body.essential .detail-stats span{font-size:11px;display:block}body.essential .detail-stats strong{display:block;font-family:CargoPixel;font-size:18px;margin-top:6px}
body.essential.panel-open .stage canvas{filter:blur(24px);visibility:hidden}body.essential.panel-open .stage{background:#183b36}
@media(max-width:700px){html body.essential #compactObjective{font-size:9px}html body.essential #compactGoal{font-size:14px}html body.essential #hudDetailsButton{gap:6px;padding:4px 7px}html body.essential .controls button{padding:5px 7px;min-width:58px}html body.essential .controls #closeVan{min-width:116px}html body.essential #hint{font-size:9px!important}html body.essential #selectedInfo{font-size:9px}html body.essential .clock-label{display:none}}
@media(max-width:500px) and (orientation:portrait){html body.essential #compactObjective{display:none}html body.essential .action-bar{height:86px;display:flex;flex-direction:column;gap:2px}html body.essential .feedback{width:100%;height:38px;flex:none}html body.essential .controls{width:100%;justify-content:flex-end}html body.essential .controls button{flex:1}html body.essential .hud #timer{font-size:17px}}

html body.essential #nativeNav .route h1,html body.essential #nativeNav .route p,html body.essential #nativeNav .route .eyebrow{color:var(--pixel-ink)}
html body.essential #hint{max-height:29px;overflow-y:auto;touch-action:pan-y}