html,body,#root{background:#202830;height:100%;margin:0;overflow:hidden}canvas{display:block}.controls-hint{z-index:1;pointer-events:none;-webkit-user-select:none;user-select:none;color:#e8e2d2;background:#14181cb8;border:1px solid #e8e2d22e;border-radius:4px;padding:6px 12px;font-family:system-ui,sans-serif;font-size:13px;position:fixed;bottom:12px;left:12px}.controls-hint strong{color:#fff;font-weight:600}.debug-toggle{z-index:2;-webkit-user-select:none;user-select:none;cursor:pointer;color:#e8e2d2;background:#14181cb8;border:1px solid #e8e2d22e;border-radius:4px;padding:6px 12px;font-family:system-ui,sans-serif;font-size:13px;font-weight:600;position:fixed;bottom:12px;right:12px}.debug-toggle:hover{background:#242a30d9;border-color:#e8e2d259}.debug-toggle.is-open{color:#fff;background:#2e363ee6;border-color:#e8e2d28c}.hud{z-index:2;-webkit-user-select:none;user-select:none;color:#e8e2d2;flex-direction:column;gap:6px;font-family:system-ui,sans-serif;font-size:13px;display:flex;position:fixed;top:12px;left:12px}.hud-clock{background:#14181cb8;border:1px solid #e8e2d22e;border-radius:4px;padding:6px 12px}.hud-resources{flex-wrap:wrap;gap:6px;max-width:320px;display:flex}.hud-res{background:#14181cb8;border:1px solid #e8e2d22e;border-radius:4px;padding:4px 8px}.hud-speed{gap:4px;display:flex}.hud-speed button{cursor:pointer;color:#e8e2d2;background:#14181cb8;border:1px solid #e8e2d22e;border-radius:4px;padding:4px 12px;font-family:system-ui,sans-serif;font-size:13px;font-weight:600}.hud-speed button.is-active{color:#fff;background:#2e363ee6;border-color:#e8e2d28c}.placement-hint{-webkit-user-select:none;user-select:none;pointer-events:none;border:1px solid #e8e2d22e;border-radius:4px;padding:4px 10px;font-family:system-ui,sans-serif;font-size:13px}.placement-hint.is-valid{color:#7de87d;background:#142814c7;border-color:#5fbf5f59}.placement-hint.is-invalid{color:#f08080;background:#281414c7;border-color:#d0505059}.build-menu{z-index:2;-webkit-user-select:none;user-select:none;background:#14181cb8;border:1px solid #e8e2d22e;border-radius:4px;flex-direction:row;gap:8px;padding:8px 12px;display:flex;position:fixed;bottom:48px;left:50%;transform:translate(-50%)}.build-item{cursor:pointer;color:#e8e2d2;background:0 0;border:1px solid #e8e2d22e;border-radius:4px;flex-direction:column;align-items:center;gap:3px;padding:8px 14px;font-family:system-ui,sans-serif;transition:background .1s,border-color .1s;display:flex}.build-item:hover{background:#242a30d9;border-color:#e8e2d259}.build-item.is-selected{color:#fff;background:#2e363ee6;border-color:#e8e2d28c}.build-item-label{font-size:13px;font-weight:600}.build-item-cost{opacity:.7;font-size:11px}