:root{color-scheme:dark;--bg:#122031;--panel:#192a3a;--line:#34485a;--text:#ecebdf;--muted:#a2afba;--mint:#b1dbc2;--gold:#eed19e}
*{box-sizing:border-box}[hidden]{display:none!important}
body{margin:0;height:100dvh;overflow:hidden;display:grid;grid-template-rows:auto minmax(0,1fr) auto;background:var(--bg);color:var(--text);font:14px/1.5 system-ui,sans-serif}
button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit;background:#203444;border:1px solid var(--line);border-radius:8px;min-height:44px;padding:9px 13px}button:hover{background:#304455}button:disabled{opacity:.5;cursor:default}button:focus-visible,a:focus-visible,canvas:focus-visible,summary:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:64px;padding:8px max(20px,env(safe-area-inset-right)) 8px max(20px,env(safe-area-inset-left));background:#132235;border-bottom:1px solid #ffffff10;z-index:2}
.brand{display:flex;align-items:center;gap:9px;text-decoration:none;color:var(--text);font-size:16px;letter-spacing:2px;white-space:nowrap}.brand b{color:var(--gold)}.brand small{display:block;font:8px ui-monospace,monospace;letter-spacing:1px;color:var(--muted)}.mark{font-size:32px;color:var(--gold)}
.cash-chip{margin-left:auto;border:0;background:transparent;min-width:100px;text-align:right;padding:3px 0}.cash-chip small{display:block;color:var(--muted);font:8px monospace;letter-spacing:1px}.cash-chip b{color:var(--mint);font:18px ui-monospace,monospace}
.time{display:grid;font:9px ui-monospace,monospace;color:var(--muted);min-width:61px;text-align:right}.time b{font-size:17px;color:var(--text)}
main,.viewport,.scene-stage{min-height:0;min-width:0;height:100%;position:relative}.viewport{overflow:hidden;background:#243846}canvas{display:block;position:absolute;inset:0;width:100%;height:100%;image-rendering:pixelated;touch-action:none}
.main-toolbar{display:grid;grid-template-columns:repeat(4,minmax(0,130px));justify-content:center;gap:8px;padding:8px max(12px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));background:#132235;border-top:1px solid #ffffff10;z-index:2}.main-toolbar button{border:0;background:transparent;display:flex;align-items:center;justify-content:center;gap:8px;color:#c9d5da;font-size:12px;min-height:48px}.main-toolbar button>span{font-size:23px;color:var(--gold);line-height:1}.main-toolbar button:hover,.main-toolbar button.active{background:#2c4350;color:var(--gold)}
.placement-strip{position:absolute;left:50%;transform:translateX(-50%);bottom:14px;display:flex;align-items:center;justify-content:space-between;gap:12px;width:max-content;max-width:calc(100% - 24px);padding:6px 6px 6px 16px;border:1px solid var(--gold);border-radius:12px;background:#142c3ef2;z-index:3;box-shadow:0 8px 20px #07142255}.placement-strip>span{font-size:12px;color:var(--gold)}.placement-strip button{background:var(--gold);border:0;color:#233544}
#toast{position:absolute;z-index:4;bottom:85px;left:50%;transform:translateX(-50%);width:max-content;max-width:calc(100% - 28px);padding:11px 15px;border:1px solid #c5b18388;border-radius:10px;background:#182d3cf2;font-size:12px;opacity:0;pointer-events:none;transition:opacity .2s}#toast.show{opacity:1}
dialog{width:calc(100% - 32px);max-width:600px;max-height:calc(100dvh - 32px);background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:18px;padding:24px;overflow:auto;box-shadow:0 25px 100px #03101c88}dialog::backdrop{background:#07131db8;backdrop-filter:blur(3px)}dialog h2{font-size:23px;line-height:1.25;margin:10px 0 18px}dialog p{font-size:13px;color:#c3cbd0}.panel{max-width:720px;padding:0;overflow:hidden}.panel[open]{display:flex;flex-direction:column}.panel-body{padding:20px;min-height:0;overflow:auto;overscroll-behavior:contain}.panel-intro{margin:0 0 16px;font-size:12px!important;color:var(--muted)}
.sheet-header{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 20px;border-bottom:1px solid var(--line);flex:none;background:#192c3d}.sheet-header h2{margin:3px 0 0;font-size:21px}.sheet-header small,.eyebrow,.section-label{font:9px ui-monospace,monospace;letter-spacing:1.5px;color:var(--muted)}.sheet-header button{background:#2b4352;min-width:64px}.section-label{margin:22px 0 12px}.panel-tabs{display:flex;gap:5px;padding:8px 16px;border-bottom:1px solid var(--line);flex:none}.panel-tabs button{flex:1;border:0;background:transparent;font-size:12px}.panel-tabs .active,.overlay-controls .active,.speed .active{background:var(--gold);color:#243746;border-color:var(--gold)}
#tools{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.tool{display:grid;grid-template-columns:30px minmax(0,1fr);align-content:start;gap:7px 10px;text-align:left;padding:13px;width:100%;min-width:0;min-height:126px;background:#203648}.tool-copy{min-width:0}.tool b{display:block;font-size:13px}.tool small{display:block;font-size:10px;color:var(--muted);margin-top:4px;line-height:1.4}.tool .requirement{font-size:9px;color:#b9c6c7}.tool .icon{display:grid;place-items:center;width:30px;height:34px;background:#2b4758;border-radius:6px;font:22px monospace}.tool .price{grid-column:2;font:12px monospace;color:var(--gold);margin-top:7px}.tool.active{border-color:var(--gold);background:#354b48}.tool.locked{border-style:dashed;background:#182c3b}.tool.locked b{color:#b1bac0}
.build-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.build-actions>button{margin:0;min-height:76px;text-align:left;width:100%;font-size:13px}.build-actions .tool{min-height:76px;align-content:center}.action{display:block;width:100%;padding:12px;text-align:left;margin:10px 0;background:#203444;font-size:13px}.action small{display:block;color:var(--gold);font:11px monospace;margin-top:5px}
.metrics{display:block}.tower-summary{display:flex;gap:10px;align-items:center;flex-wrap:wrap;color:var(--muted);font:10px monospace}#stars{color:var(--gold);margin-left:auto}.money{margin:22px 0}.money small,.stat-grid small,.wellbeing small{font:10px monospace;color:var(--muted);letter-spacing:.7px}.money strong{display:block;font:36px ui-monospace,monospace;margin:5px 0}.money>span{font:12px monospace;color:var(--mint)}.stat-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;padding:18px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.stat-grid b{display:block;font:25px monospace;margin-top:6px}.wellbeing{margin:20px 0}.wellbeing>div:first-child{display:flex;justify-content:space-between}.wellbeing b{color:var(--mint)}.bar{height:5px;background:#304659;margin:12px 0}.bar span{display:block;height:100%;background:var(--mint)}.wellbeing p{font-size:12px}.ledger{font-size:12px}.ledger div{display:flex;justify-content:space-between;gap:10px;margin:12px 0}.ledger span{color:var(--muted)}.ledger b{font-family:monospace;white-space:nowrap}.goal{display:flex;justify-content:space-between;gap:8px;border:1px solid var(--line);padding:10px;margin:8px 0;font-size:12px}.goal.done,.met{color:var(--mint)}.unmet{color:#e9bc99}details{margin-top:18px}summary{cursor:pointer;min-height:44px;padding:10px 0;font-size:13px}#next-unlock{font:11px/1.7 monospace;color:var(--gold)}#journal{font:11px/1.8 monospace;color:var(--muted)}#journal p{border-left:2px solid #a89267;padding-left:12px}
#inspector{margin:0;border:0}#inspector>.section-label:first-child{display:none}#room-name{display:block;color:var(--gold);font-size:19px}#room-info{font-size:13px}#room-margin{font:12px/1.5 monospace;color:var(--mint)}#room-meters{font:12px/1.9 monospace;color:#b0c9cf}#room-needs,#permit-checklist{padding:0;list-style:none;font-size:13px;line-height:1.8}#room-complaints{border-left:2px solid #ba9878;padding-left:12px;font-size:12px}#room-complaints p{margin:8px 0}
.upgrade-card{background:#243e48;border:1px solid #58746e;border-radius:12px;padding:15px;margin:20px 0}.upgrade-card>b{font:10px monospace;color:var(--gold);letter-spacing:1px}.upgrade-card .action{background:var(--gold);color:#203343;font-weight:600}.upgrade-card button:disabled{background:#344950;color:#aab7b9}
.patron-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(145px,1fr));gap:7px;margin:12px 0;max-height:280px;overflow:auto}.patron-list>p{grid-column:1/-1;font-size:11px;margin:0}.patron-card{font-size:12px;text-align:left;background:#243b49;color:#c7e0d7}#patron-thoughts p{padding:12px;border-left:2px solid var(--gold);background:#243b49}#patron-status{font:12px/1.8 monospace;color:var(--mint)}
.staff-panel>.section-label:first-child{margin-top:0}#staff-count{font:11px monospace;color:var(--mint)}.hire-controls{display:flex;gap:10px;margin:14px 0}.hire-controls button{flex:1;text-align:left;font-size:13px}.hire-controls small{display:block;color:var(--gold);font:10px monospace;margin-top:5px}.staff-card{border:1px solid var(--line);border-left:2px solid var(--mint);border-radius:8px;padding:14px;margin:10px 0}.staff-card>b{font-size:13px}.staff-status{display:block;font:11px/1.7 monospace;color:var(--muted);margin:8px 0}.staff-options{display:flex;flex-wrap:wrap;gap:7px}.staff-options select{flex:1;min-width:100px;margin:0;font-size:12px}.staff-options button{font-size:12px}.staff-hint{font-size:11px!important;color:var(--muted)!important}
.overlay-controls{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.overlay-controls button{font-size:12px}#overlay-legend{font:10px/1.6 monospace;color:var(--gold);margin:14px 0 22px}.camera-controls{display:flex;gap:8px;flex-wrap:wrap}.camera-controls button{flex:1;white-space:nowrap}.speed{display:flex;gap:8px}.speed button{flex:1}.sound-settings>div{display:grid;gap:8px}.sound-settings label{display:flex;justify-content:space-between;align-items:center;gap:15px;font-size:13px}.sound-settings input{width:65%;margin:0;accent-color:var(--gold)}.sound-settings small{color:var(--muted);font-size:11px}.save-controls{display:grid;grid-template-columns:1fr 1fr;gap:8px}.save-controls button{font-size:12px}#saved{display:block;font:10px monospace;color:var(--muted);margin-top:12px}
dialog input,dialog select{display:block;width:100%;min-height:44px;padding:10px;margin:8px 0 16px;border:1px solid var(--line);border-radius:6px;background:#12283a;color:var(--text);font:inherit}dialog label{font-size:12px;color:var(--muted)}
@media(max-width:650px){.topbar{gap:12px;min-height:60px;padding:7px max(12px,env(safe-area-inset-right)) 7px max(12px,env(safe-area-inset-left))}.brand{font-size:12px;letter-spacing:1px;gap:6px}.brand small{font-size:6px;letter-spacing:.8px}.mark{font-size:28px}.cash-chip{min-width:75px}.cash-chip b{font-size:16px}.cash-chip small{font-size:7px}.time{min-width:48px;font-size:8px}.time b{font-size:15px}.main-toolbar{grid-template-columns:repeat(4,minmax(0,1fr));gap:3px}.main-toolbar button{flex-direction:column;gap:4px;min-height:50px;font-size:10px}.main-toolbar button>span{font-size:21px}.panel{width:100%;max-width:none;max-height:calc(100dvh - 14px);margin:auto 0 0;border-radius:20px 20px 0 0}.panel-body{padding:16px 14px max(18px,env(safe-area-inset-bottom))}.sheet-header{padding:14px 16px}.sheet-header h2{font-size:20px}.sheet-header small{font-size:8px}.tool{padding:11px 9px;gap:7px;grid-template-columns:24px minmax(0,1fr);min-height:140px}.tool .icon{width:24px;height:28px;font-size:18px}.tool b{font-size:12px}.tool small{font-size:9px}.tool .requirement{font-size:8px}.tool .price{font-size:11px}.build-actions{gap:8px}.build-actions>button{font-size:12px}.build-actions .tool{min-height:76px}.placement-strip{bottom:10px}.placement-strip>span{font-size:11px}.ledger{font-size:11px}}
@media(max-width:350px){.brand{font-size:10px}.brand small{font-size:5px}.mark{display:none}.topbar{gap:8px}.cash-chip{min-width:67px}#tools{grid-template-columns:1fr}.tool{min-height:100px}}
@media(prefers-reduced-motion:reduce){#toast{transition:none}}
