/* Compact city-builder HUD: charcoal instruments, cyan controls, amber needs. */
:root{color-scheme:dark;--ink:#e6edef;--muted:#a1b0b7;--gold:#83c9d2;--green:#73b6ab;--panel:#26343cf5;--line:#8398a333;--hud:54px;--dock:70px;background:#24323a;color:var(--ink)}
button,a.button{background:#35454e;color:#dfe9ed;border-color:#6c839052;border-radius:5px;min-height:38px}button:hover:not(:disabled),a.button:hover{background:#425860;border-color:#8ab5be}button[aria-pressed=true],.primary{background:#416671;border-color:#86bcc6;color:#effbfc}button:disabled{opacity:.45}button:focus-visible,a:focus-visible,select:focus-visible{outline:2px solid #a3e1e8;outline-offset:2px}small,.small{color:#a7b7be}.game-hud{background:linear-gradient(#34434afa,#233139fa);border-bottom:1px solid #8097a15c;box-shadow:0 3px 15px #1a252c33;padding:0 15px}.game-brand{font-size:17px;margin-right:16px;gap:7px;color:#b9d7df}.game-brand svg{width:27px;height:27px}.hud-metric{padding:0 15px;height:29px}.hud-metric b{font-size:17px}.hud-year b{font-size:20px}.hud-year b small{font-size:12px}.hud-metric svg{width:18px;height:18px;color:#9bb6bf}.hud-metric small{font-size:10px;color:#9caeb6}.hud-population{background:transparent}.hud-controls{gap:3px}.hud-icon{width:34px;min-height:34px;padding:5px;border:0;background:transparent}.hud-icon svg{width:21px;height:21px}.hud-icon:hover:not(:disabled){background:#465a62}.play-control{min-width:62px;min-height:34px;padding:6px 9px;background:#567c83;border-color:#8bbcc3;color:#f0fbfc}.speed-control select{color:#dbe8ec;min-height:34px}.speed-control option{background:#2a3c43}.game-mode-tag{top:calc(var(--hud) + 9px);left:auto;right:15px;color:#bfced2}.game-mode-tag #modeName{background:#27383cc9;border-color:#6f909850;padding:3px 8px}.game-dock{width:440px;max-width:calc(100vw - 130px);height:var(--dock);bottom:12px;padding:5px 8px;border-radius:9px;background:linear-gradient(#3b4e55fa,#283a42fc);border:1px solid #88a5af61;box-shadow:0 6px 20px #101b2c4a}.game-dock>button{border-radius:4px;padding:5px;color:#b8cbd0;gap:3px}.game-dock>button svg{width:25px;height:25px}.game-dock>button span{font-size:11px;color:#cfdee2}.game-dock>button+button{border-left-color:#79939c33}.game-dock>button[aria-pressed=true]{background:#4c727b;color:#b9f0f4}.game-dock>button[aria-pressed=true] span{color:#e2f9fb}.game-dock>button[aria-pressed=true]::after{height:2px;background:#95dce5;bottom:0}.game-dock i{background:#c48a55;color:#fff8e9;right:15%;font-style:normal;font-size:10px;line-height:15px;width:15px;height:15px}
.city-dashboard{position:absolute;left:14px;top:calc(var(--hud) + 12px);z-index:9;width:214px;background:#2b3c44ee;border:1px solid #6f8a9461;border-radius:7px;box-shadow:0 4px 15px #14252c22;color:#d9e8ec;overflow:hidden;backdrop-filter:blur(9px)}.city-dashboard>header{height:28px;display:flex;align-items:center;justify-content:space-between;padding:0 9px;background:#3b5058b3;font-size:10px;color:#b7cbd2;letter-spacing:.5px}.city-dashboard>header button{min-height:23px;width:24px;padding:0;border:0;background:none;color:#bed1d6;font-size:16px}.dashboard-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;padding:5px}.dashboard-grid button{position:relative;min-height:60px;display:grid;grid-template-columns:20px 1fr;grid-template-rows:28px 17px;gap:0 3px;align-items:center;border:0;border-radius:4px;padding:4px 5px;background:transparent;text-align:center}.dashboard-grid button:hover{background:#49616b}.dashboard-grid svg{width:19px;height:19px;grid-row:1;color:#8ec2cc}.dashboard-value{font-size:15px;font-weight:600;grid-row:1;font-variant-numeric:tabular-nums;letter-spacing:-.6px;color:#e8f1f3}.dashboard-grid small{grid-row:2;grid-column:1/3;font-size:10px;color:#a2bbc4}.dashboard-grid button[data-alert=true] i{position:absolute;right:4px;top:4px;width:4px;height:4px;background:#e3ad73;border-radius:50%}.dashboard-grid button[data-alert=true] svg{color:#d9af82}.city-dashboard footer{display:flex;justify-content:space-between;padding:6px 9px;border-top:1px solid #6d8a9433;font-size:10px;color:#a5c1c9}.city-dashboard footer b{font-weight:500;color:#c0e6d8}.city-dashboard.collapsed .dashboard-grid,.city-dashboard.collapsed footer{display:none}
.game-panel,.picked,.placement-panel{background:#2c3c44f5;color:#e0eced;border:1px solid #8ba4ac61;box-shadow:0 6px 22px #101e2c42;border-radius:8px;bottom:95px;max-height:calc(100dvh - var(--hud) - 135px);left:16px;width:310px}.game-panel{width:330px}.panel-heading{background:#384d55b3;border-bottom:1px solid #a0b7bf26;padding:10px 12px}.panel-heading h2{font-size:16px;color:#e2edef}.panel-heading small{font-size:10px;color:#9ab9c3}.panel-heading .icon-button{min-height:26px;padding:2px;width:28px;color:#a2c4cc;background:transparent;border:0}.panel-scroll{padding:11px;scrollbar-color:#6d9099 transparent}.panel-scroll h3,.panel-scroll h2{color:#b9e0e5}.panel-scroll p,.picked p,.placement-panel p{color:#b8c9cf;font-size:12px;line-height:1.7}.picked strong,.placement-panel strong{font-size:14px}.picked>button:first-child,.placement-close{background:transparent;color:#a1b5be;border:0}.picked .source-link,.picked .primary{font-size:12px}.operation-facility-use{background:#3b59634f;color:#b4e1e8;border-radius:5px;padding:8px 10px;margin:9px 0;font-size:13px}.facility-role{display:flex;gap:7px;align-items:center;color:#a4d2dc;font-size:11px;margin:7px 0}.facility-role span{padding:2px 6px;background:#5a8d9d30;border-radius:3px}.facility-role.housing span{background:#68ac8e26;color:#b2d4c0}.facility-role.commerce span{background:#ce9b582b;color:#e2bf90}.source-link{color:#a6d5e0}.settings-block{border-color:#91acb62e}.settings-block button{background:#3c515a}.settings-block button[aria-pressed=true]{background:#527882;color:#ecfbfd;border-color:#8fb8c2}.settings-block select,.placement-panel select,.panel-scroll select,.modal select,.modal input,.modal textarea{background:#233840;color:#dcebee;border-color:#789ca758}.sound-panel input{accent-color:#81c5cf}
.game-shell[data-game-panel=build] .game-panel,.game-shell[data-game-panel=policies] .game-panel{width:620px;max-width:calc(100vw - 40px);left:50%;transform:translateX(-50%);max-height:min(380px,calc(100dvh - var(--hud) - 135px))}.policy-tabs{display:none}.build-groups{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;margin:0 0 10px}.build-groups button{display:flex;align-items:center;justify-content:center;gap:6px;padding:7px;font-size:11px;min-height:34px;background:#334b55}.build-groups button svg{width:17px;height:17px}.build-groups button[aria-pressed=true]{background:#567d86;color:#f1fbfc;border-color:#92bdc7}.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}.action{background:#334852;border-color:#73949d3b;padding:7px;border-radius:5px;min-height:0}.action:hover:not(:disabled){background:#42616b;border-color:#98c5cf}.action:disabled{background:#2b3b43;opacity:.58;filter:none}.action:disabled img{filter:grayscale(.3)}.action figure,.action figure img{height:76px}.action figure{margin:0 0 5px;background:radial-gradient(ellipse at 50% 80%,#728c8a40,transparent 70%)}.action strong{font-size:11px;color:#dce9ec;min-height:25px;line-height:1.5}.action .action-meta{font-size:10px;gap:3px;flex-wrap:wrap;color:#9bb7c1;margin-top:3px}.action .cost{color:#b0d3db}.action .tile-symbol{color:#96c4ce}.action.recommended{outline:2px solid #a0d5db;outline-offset:1px}.build-toolbar{margin:0 0 8px;padding:0}.build-toolbar button{min-height:29px;padding:4px 9px;font-size:10px}.queue,.queue span{color:#b2d4db;font-size:10px}.queue{margin:7px 0}.queue span{background:#557e7c36}.game-shell #turnHint{font-size:10px;margin-bottom:0}
.operation-totals{display:grid;gap:7px;margin-bottom:10px}.operation-totals>div{display:flex;justify-content:space-between;border-bottom:1px solid #91aab62d;padding-bottom:6px}.operation-totals small{font-size:11px}.operation-totals b{font-size:14px;color:#c8e2e7}.operation-metric-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:6px;margin:8px 0}.operation-metric-grid button{display:flex;align-items:center;gap:7px;text-align:left;font-size:11px;padding:8px;min-height:42px}.operation-metric-grid button svg{width:18px;height:18px;color:#95c9d2}.operation-metric-grid button b{margin-left:auto;font-size:13px;font-weight:500}.citizen-profile{display:flex;align-items:center;gap:9px;margin-bottom:7px}.citizen-face{font-size:26px}.citizen-profile strong{display:block;font-size:14px}.citizen-profile small{font-size:10px;color:#9eb9c3}.citizen-need{padding:7px 0;border-top:1px solid #7698a329;color:#c6d6dc;font-size:12px;line-height:1.65}.citizen-actions{display:flex;gap:6px;margin-top:9px;flex-wrap:wrap}.citizen-actions button{font-size:11px;padding:7px 9px;min-height:34px}.citizen-mood{position:absolute;left:0;top:0;width:24px;height:25px;min-height:25px;padding:1px;border:1px solid #e3bd82bf;border-radius:10px 10px 10px 2px;background:#70593de8;color:#ffe1aa;box-shadow:0 2px 5px #14252c35;pointer-events:auto}.citizen-mood svg{width:17px;height:17px}.citizen-mood.severe{background:#84584ce8;border-color:#e2ac9a;color:#ffddc8}.citizen-mood-layer{position:absolute;inset:0;pointer-events:none;z-index:7;overflow:hidden}.citizen-mood[aria-pressed=true]{outline:2px solid #d4eef0;outline-offset:2px}.city-issue-layer{display:none}
.map-navigation{right:12px;bottom:16px;gap:5px}.map-navigation button{background:#2d424bef;border-color:#9bb9c45c;color:#c0e0e8}.zoom-controls button{width:34px;min-height:32px;font-size:21px}.compass{width:36px;height:36px;min-height:36px;color:#bdd4dc}.world-feedback,.toast{background:#2b444cf0;border-color:#8cb4bf66;color:#d4edf0;box-shadow:0 4px 15px #101c253b;font-size:11px}.modal-back{background:#111c2352;backdrop-filter:blur(2px)}.modal{background:#2d4048fa;color:#e0eded;border-color:#8faab766;box-shadow:0 12px 40px #12202970;border-radius:9px}.modal h2,.modal h3{color:#d0e6eb}.modal p,.modal li,.modal small{color:#b8cdd4}.game-shell .task{background:#354c55;border-color:#71949e4d;color:#c4dce3}.game-shell .task select{background:#243d46;color:#d7ecf1;border-color:#688b985c}.modal .notice,.modal .discussion,.operation-review{background:#52727e2b;color:#bfdbe2}.record-menu button{background:#344f5a;color:#cde4ea}.record-menu button span{color:#99b9c7}.learning-card{background:#3d5964;border-color:#7a9fa84d;color:#d1e8ed}.learning-card span{color:#9acbd5}.operation-map-layer{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:2;overflow:hidden}.operation-map-layer path{stroke-linejoin:round}.placing .operation-map-layer{z-index:4}.placing .city-dashboard{opacity:.65}.game-shell:has(.picked:not([hidden])) .city-dashboard{pointer-events:auto}
@media(max-width:900px){.game-brand span{display:none}.game-brand{margin-right:9px}.hud-metric{padding:0 10px}.city-dashboard{width:200px}.dashboard-grid button{min-height:54px}.dashboard-value{font-size:14px}}
@media(max-width:580px){:root{--hud:82px;--dock:64px}.game-hud{height:82px;grid-template-rows:35px 41px;padding:0 9px 4px}.game-brand span{display:inline;font-size:14px}.game-brand svg{width:22px;height:22px}.hud-year b{font-size:21px}.hud-metric b{font-size:16px}.hud-controls .hud-icon{width:29px;min-height:31px}.play-control{width:33px;min-width:33px;min-height:31px}.hud-controls .speed-control select{width:54px}.game-dock{left:10px;width:calc(100vw - 68px);max-width:none;bottom:10px;transform:none;height:64px;padding:4px}.game-dock>button svg{width:23px;height:23px}.game-dock>button span{font-size:10px}.city-dashboard{left:9px;top:92px;width:170px}.city-dashboard>header{height:25px;font-size:9px}.dashboard-grid{padding:3px}.dashboard-grid button{min-height:48px;grid-template-columns:16px 1fr;grid-template-rows:24px 14px;padding:3px;gap:0 2px}.dashboard-grid svg{width:15px;height:15px}.dashboard-value{font-size:12px}.dashboard-grid small{font-size:9px}.city-dashboard footer{font-size:9px;padding:5px 6px}.game-panel,.picked,.placement-panel{left:10px;width:290px;max-width:calc(100vw - 20px);bottom:86px;max-height:min(53dvh,calc(100dvh - 185px))}.game-shell[data-game-panel=build] .game-panel,.game-shell[data-game-panel=policies] .game-panel{left:10px;transform:none;width:calc(100vw - 20px);max-width:none;max-height:53dvh}.cards{grid-template-columns:repeat(3,minmax(0,1fr))}.action figure,.action figure img{height:62px}.action strong{font-size:10px}.build-groups button{font-size:10px;padding:5px;gap:4px}.build-groups button svg{width:15px;height:15px}.game-mode-tag{right:9px;top:92px;font-size:9px}.map-navigation{right:9px;bottom:11px}.citizen-mood{width:26px;height:27px;min-height:27px}}
@media(max-height:530px) and (min-width:581px){:root{--hud:44px;--dock:55px}.game-hud{height:44px}.city-dashboard{top:52px;width:180px}.dashboard-grid button{min-height:43px;grid-template-rows:21px 13px}.dashboard-grid svg{width:15px;height:15px}.dashboard-value{font-size:12px}.dashboard-grid small{font-size:9px}.city-dashboard header{height:22px}.city-dashboard footer{padding:3px 6px;font-size:9px}.game-dock{height:55px;bottom:8px}.game-panel,.picked,.placement-panel{bottom:75px;max-height:calc(100dvh - 130px)}.game-shell[data-game-panel=build] .game-panel,.game-shell[data-game-panel=policies] .game-panel{max-height:calc(100dvh - 130px)}.panel-heading{padding:7px 11px}.game-dock>button svg{width:20px;height:20px}}
@media(max-height:620px){.game-shell:has(.picked:not([hidden])) .city-dashboard,.game-shell:has(.placement-panel:not([hidden])) .city-dashboard{display:none}}

.voice-choice{display:grid;gap:6px;font-size:11px;color:#a7bfca;flex-basis:100%}.voice-choice select{width:100%;max-width:100%;background:#1b3039;color:#e4eff2;border:1px solid #516b77;border-radius:6px;padding:9px;font:inherit}
#cityOperationsList>button{flex-wrap:wrap}#cityOperationsList>button small{flex-basis:100%;display:block;color:#b8cbd1;font-size:11px;line-height:1.65;text-align:left}.operation-units,.operation-finance{font-size:12px;color:#c5dbe0;line-height:1.7;padding:10px;background:#263f48;border-radius:7px}.effect-comparison{line-height:1.9;padding-left:22px}.action[data-unavailable=true]{opacity:.72}.action[data-unavailable=true]:after{content:'효과 보기';font-size:10px;color:#b8dbe5}#placementPreview{line-height:1.8;max-height:160px;overflow:auto}
.operation-metric-grid>.operation-units,.operation-metric-grid>.operation-finance{grid-column:1/-1;margin:0}.dashboard-grid button small{font-size:9px;white-space:nowrap}.dashboard-value{white-space:nowrap}
.action .action-meta{display:flex;justify-content:space-between;width:100%;margin:5px 0 0}.action .action-effect{display:block;width:100%;margin-top:8px;padding-top:8px;border-top:1px solid #8bb0bf35;font-size:11px;line-height:1.7;text-align:left;color:#daebee;white-space:normal}.action .action-upkeep{display:block;width:100%;font-size:10px;line-height:1.6;text-align:left;color:#9bb8c2;margin-top:6px}.action:disabled .action-effect{color:#bacdd4}.action[data-unavailable=true]:after{display:none}
.quick-light{position:absolute;right:16px;top:62px;z-index:90;background:#21343f;border:1px solid #7393a8;border-radius:12px;padding:10px;box-shadow:0 10px 28px #07131f88}.quick-light[hidden]{display:none}.quick-light button{min-height:42px;min-width:65px}.game-hud #worldFullscreen{font-size:24px;color:#e3eef3}.dashboard-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.city-dashboard{width:248px}.dashboard-grid button{min-width:0}.facility-projects{display:flex;gap:6px;flex-wrap:wrap;margin:10px 0}.facility-projects button,.facility-projects select{min-height:40px}.world-tools #qualityToggle,.world-tools #renderToggle{display:none!important}.world-feedback.completion{position:absolute;top:43%;left:50%;right:auto;transform:translate(-50%,-50%);width:min(380px,85vw);z-index:95;padding:18px 22px;background:#203946f2;border:1px solid #8acbd4;border-radius:14px;box-shadow:0 12px 36px #06142166;pointer-events:none;animation:completion-reveal 4.2s both}.completion strong,.completion small{display:block}.completion strong{font-size:18px;margin-bottom:9px}.completion small{font-size:12px;line-height:1.8;color:#c7e6ed}@keyframes completion-reveal{0%{opacity:0;translate:0 12px}8%,84%{opacity:1;translate:0 0}100%{opacity:0;translate:0 -8px}}@media(max-width:600px){.city-dashboard{width:218px}.quick-light{top:56px}.game-hud{gap:5px}.game-brand span{display:none}.dashboard-grid button small{font-size:8px}.dashboard-grid .dashboard-value{font-size:12px}}
.ai-advice{position:absolute;right:15px;top:80px;max-width:255px;padding:10px 14px;border:1px solid #87c0bc;background:#254550e8;border-radius:10px;color:#d9edef;font-size:11px;line-height:1.7;z-index:12}.ai-advice[hidden]{display:none}

.dashboard-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.dashboard-grid button:nth-child(5){border-top:1px solid #627d88}.dashboard-grid button[data-level]{border-left:3px solid #68c39b}.dashboard-grid button[data-level=orange]{border-left-color:#f3af55}.dashboard-grid button[data-level=red]{border-left-color:#ef7777;background:#4c3038}.dashboard-grid button[data-level=green] .dashboard-value{color:#91d7b6}.dashboard-grid button[data-level=orange] .dashboard-value{color:#f3ba70}.dashboard-grid button[data-level=red] .dashboard-value{color:#ff9797}.city-dashboard{width:236px}.city-dashboard.collapsed .dashboard-grid{display:none}

.placing .operation-map-layer{pointer-events:none}.plot-layer{pointer-events:none}.plot-layer .plot-marker{pointer-events:auto}.gap-causes{max-height:180px;overflow:auto;font-size:12px;line-height:1.5}.gap-causes p{margin:8px 0;border-bottom:1px solid #87999230;padding-bottom:6px}

.city-growth-goal{padding:7px 10px;border-top:1px solid #a0bcba30;font-size:11px;color:#d4e5dc;line-height:1.5}.city-dashboard.collapsed .city-growth-goal{display:none}

.construction-grid .selected-cell{fill:#f2ca57aa;stroke:#ffe59b;stroke-width:2;stroke-linejoin:miter}.placing .plot-layer{display:none}.placement-panel #placementPreview{display:block;margin:6px 0 10px}

.action figure .policy-icon{width:36px;height:36px;color:#99d5be}.action[data-action=safety] .policy-icon{color:#e3bd77}.action[data-action=welfare] .policy-icon{color:#e1a6ba}
#cityOperationsList .city-problem-card{display:grid;grid-template-columns:32px 1fr auto;gap:7px;align-items:center;padding:12px;text-align:left;border-left:4px solid var(--severity);--severity:#74c69c;color:#d9e9e9;background:#233d47}#cityOperationsList .city-problem-card[data-level=orange]{--severity:#edb35c}#cityOperationsList .city-problem-card[data-level=red]{--severity:#ee8b85}#cityOperationsList .city-problem-card svg{width:27px;height:27px;color:var(--severity);grid-row:span 2}.city-problem-card .problem-name{font-size:14px}.city-problem-card strong{font-size:21px;color:var(--severity);grid-column:3;grid-row:1/3}.city-problem-card strong small{font-size:10px;margin-left:3px}.city-problem-card .problem-state{grid-column:2;font-size:11px;color:var(--severity)}#cityOperationsList .city-problem-card p{grid-column:1/-1;margin:2px 0 0;font-size:11px;line-height:1.5;color:#b6cfd4}