:root{color-scheme:dark;--gold:#e3c586;--ivory:#fff1d3;--navy:#111c30}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}body{display:grid;place-items:center;background:radial-gradient(ellipse at 50% 30%,#283953,#0b1220 80%);color:var(--ivory);font-family:Georgia,serif;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}#game-shell{position:relative;width:min(96vw,calc((100dvh - 70px)*4/3));aspect-ratio:4/3;border:1px solid #aa8a52;box-shadow:0 24px 70px #0008}canvas{width:100%;height:100%;display:block}.desktop-tools{position:fixed;right:16px;top:12px;display:flex;gap:8px;z-index:60}button{cursor:pointer;font:700 12px system-ui;color:var(--ivory);border:1px solid #c6a86a;background:#24314a;border-radius:5px;padding:10px 16px;touch-action:none}button:focus-visible,canvas:focus-visible{outline:3px solid #fff;outline-offset:2px}button:active,.is-pressed{background:#68543e!important}#help-button{width:36px;padding:0;border-radius:50%;font-size:23px;opacity:.7}.hud{position:absolute;top:12%;left:5%;right:5%;display:flex;justify-content:space-between;font:10px system-ui;letter-spacing:.1em}.hud b{margin-left:7px;font:700 20px Georgia;color:#fff5d9}.bottom-hud{position:absolute;bottom:5%;left:6%;right:6%;display:flex;justify-content:space-between;font:12px system-ui;letter-spacing:.12em}.bottom-hud b{font-size:17px;margin-left:10px}meter{width:95px;height:12px;margin-left:8px;accent-color:var(--gold)}#callout{position:absolute;bottom:1.6%;width:100%;text-align:center;font:12px system-ui;color:#ebd3a3}.touch-controls{display:none}.control-cluster{pointer-events:none}.control-button{pointer-events:auto;width:90px;min-height:44px;padding:8px;font-size:11px}#slow{height:78px;font-size:15px;background:#604238;border:2px solid #e3c586}.modal{display:none;position:fixed;inset:0;z-index:100;place-items:center;background:#0b1424ed;padding:16px;overflow:auto}.modal.is-visible{display:grid}.modal-card{width:min(610px,100%);max-height:calc(100dvh - 32px);overflow:auto;padding:28px 34px;border:6px double var(--gold);background:linear-gradient(135deg,#293952,#142136);box-shadow:0 20px 70px #0009}.eyebrow{font:700 10px system-ui;letter-spacing:.19em;color:var(--gold)}h1{font-size:58px;letter-spacing:-.035em;margin:15px 0}h1 em{font-style:normal;color:#e6aa91}h2{font-size:38px}.modal-card>p{line-height:1.5}.orders{display:grid;grid-template-columns:1fr 1fr;gap:0 22px;font:13px/1.5 system-ui}.orders b{font-size:11px;color:var(--gold);letter-spacing:.08em}.hint{font:12px/1.5 system-ui}.modal button{width:100%;min-height:46px;margin-top:8px;background:var(--gold);color:var(--navy);font-weight:800}.result{text-align:center}.result p{font:15px/1.6 system-ui}#portrait-note{display:none;position:fixed;inset:0;z-index:80;background:#111c30;place-items:center;padding:30px;text-align:center;font-size:25px;line-height:1.8}#portrait-note small{font:15px system-ui}body.instructions-open .desktop-tools,body.gameover-open .desktop-tools,body.instructions-open .touch-controls,body.gameover-open .touch-controls{visibility:hidden!important}body.gameover-open .vibecade-mobile-options{visibility:hidden!important}body.touch-device .desktop-tools{display:none}body.touch-device .hud{font-size:8px;letter-spacing:0;top:11.5%}body.touch-device .hud b{font:700 13px system-ui;margin-left:3px}body.touch-device .bottom-hud{font-size:9px;bottom:4.8%;letter-spacing:0}body.touch-device .bottom-hud b{font-size:12px;margin-left:4px}body.touch-device meter{width:52px;height:9px;margin-left:2px}body.touch-device #callout{font-size:9px;bottom:1%}@media(max-width:599px) and (orientation:portrait){body:not(.instructions-open) #portrait-note{display:grid}body:not(.instructions-open) #game-shell,body:not(.instructions-open) .touch-controls{visibility:hidden!important}}@media(max-height:440px){.modal-card{padding:12px 20px}h1{font-size:33px;margin:5px 0}.orders{font-size:11px}.orders p{margin:5px 0}.modal-card>p{margin:6px 0;font-size:11px}}

/* Review pass 1: leave breathing room above the frame. */
#callout,body.touch-device #callout{bottom:3%}

/* Review pass 2: make resources legible without relying on meter color. */
#charge{display:inline-block;min-width:35px;margin-left:2px;font:12px system-ui}.urgent{text-decoration:underline;text-underline-offset:3px;color:#ffac99!important}body.touch-device #charge{min-width:24px;font-size:9px}

/* Heist HUD and four-action mobile rail. */
#security-note{position:absolute;top:15.5%;left:5%;right:5%;text-align:center;font:11px system-ui;letter-spacing:.06em;color:#f2c791}
#shed-state{font:10px system-ui;align-self:center;color:#e3c586}button:disabled{opacity:.45;cursor:default}
body.touch-device #security-note{font-size:8px;letter-spacing:0;top:15.3%}body.touch-device #shed-state{font-size:8px}
body.touch-device #slow{height:62px;font-size:13px}body.touch-device .control-cluster{gap:6px!important}#shed{background:#60443f}

body.touch-device .hud{top:10.3%}body.touch-device #security-note{top:15%;line-height:1}
body.touch-device .hud{top:9.7%}
body.touch-device .hud{height:14px;line-height:14px}body.touch-device .hud span{display:flex;align-items:baseline;line-height:14px}body.touch-device .hud b{line-height:14px}
