:root{color-scheme:dark;--safe-top: env(safe-area-inset-top, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px);--top-bar-height: 44px;--bottom-bar-height: 48px;--panel-max-height: min(34dvh, 260px)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{width:100%;height:100%;min-height:100svh;margin:0;background:#060b18;color:#eef2ff;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;overflow:hidden}#app-shell{position:relative;width:var(--app-width, 100vw);height:var(--app-height, 100dvh);min-height:100svh;max-height:100dvh;display:flex;flex-direction:column}#game-container{flex:1;min-height:0;width:100%;background:#0f172a}#game-container canvas{width:100%;height:100%;display:block}#map-vignette{position:absolute;top:0;right:0;bottom:0;left:0;z-index:3;pointer-events:none;background:radial-gradient(circle at center,#0000 42%,#0000004d)}#rotate-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:10;display:none;align-items:center;justify-content:center;padding:24px;text-align:center;background:#020617f0;color:#eff6ff;font-size:clamp(1.2rem,3.2vw,2rem);font-weight:700;line-height:1.3;letter-spacing:.02em}#app-shell.is-portrait #game-container,#app-shell.is-portrait #map-vignette,#app-shell.is-portrait #ui-overlay{visibility:hidden}#app-shell.is-portrait #rotate-overlay{display:flex}#ui-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:5;pointer-events:none}.top-bar{position:absolute;top:0;left:0;right:0;height:calc(var(--top-bar-height) + var(--safe-top));padding:calc(var(--safe-top) + 6px) 10px 6px;display:flex;align-items:center;justify-content:flex-end;gap:8px;background:linear-gradient(to bottom,#030816e6,#0308168c);pointer-events:auto}.top-bar--compact{height:calc(var(--safe-top) + 28px);padding:calc(var(--safe-top) + 3px) 8px 3px;justify-content:flex-end;background:linear-gradient(to bottom,#03081694,#03081633);pointer-events:none}.top-bar--floating{background:transparent}.top-bar--compact .top-bar__status{gap:4px;pointer-events:auto}.top-bar--compact .status-chip{font-size:.66rem;padding:2px 6px;background:#0f172aa6}.top-bar--compact .ui-btn--icon{min-height:30px;min-width:30px;pointer-events:auto}.top-bar--compact .ui-btn{min-height:26px;font-size:.66rem;padding:0 8px;pointer-events:auto}.top-bar__status{display:flex;align-items:center;gap:6px}.status-chip{font-size:.72rem;padding:3px 8px;border:1px solid #334155;border-radius:999px;background:#0f172ad9;white-space:nowrap}.ui-btn,.mode-btn{min-height:36px;border:1px solid #475569;border-radius:10px;color:#eff6ff;background:#0f172aeb;font-size:.86rem;font-weight:600;padding:0 12px}.ui-btn--icon{min-width:36px;padding:0}.ui-btn--primary,.mode-btn.is-active{border-color:#60a5fa;background:#1d4ed8}#map-debug-panel{position:absolute;top:calc(var(--safe-top) + 10px);left:10px;width:min(280px,calc(100% - 20px));border:1px solid rgba(100,116,139,.95);border-radius:7px;background:#020617bd;padding:5px 7px;display:grid;gap:1px;pointer-events:none;z-index:6}#map-debug-panel[hidden]{display:none}.map-debug-panel__line{margin:0;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,Liberation Mono,monospace;font-size:.64rem;line-height:1.15;color:#bfdbfe;text-shadow:0 1px 1px rgba(0,0,0,.5);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.bottom-mode-bar{position:absolute;left:0;right:0;bottom:0;height:calc(var(--bottom-bar-height) + var(--safe-bottom));padding:6px 10px calc(var(--safe-bottom) + 6px);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;background:linear-gradient(to top,#020617f2,#020617b8);pointer-events:auto}.mode-btn{min-height:38px}#context-panel{position:absolute;left:0;right:0;bottom:calc(var(--bottom-bar-height) + var(--safe-bottom));width:min(900px,100%);margin:0 auto;border-top:1px solid #334155;border-radius:16px 16px 0 0;background:#020617f5;transform:translateY(calc(100% + 8px));transition:transform .18s ease;pointer-events:none}#context-panel[data-open=true]{transform:translateY(0);pointer-events:auto}.context-panel__handle{width:52px;height:4px;border-radius:999px;background:#64748b;margin:8px auto}.context-panel__content{padding:0 12px 12px;max-height:var(--panel-max-height);overflow:auto}.context-panel__content h2{margin:0 0 10px;font-size:.95rem}.context-panel__content p{margin:0 0 10px;font-size:.85rem;color:#dbeafe}.castle-build-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px;margin:0 0 10px}.castle-build-list .ui-btn:disabled{opacity:.72;border-color:#334155;background:#0f172ab8}.panel-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}@media (max-width: 700px){.top-bar{padding-left:8px;padding-right:8px}.top-bar--compact{height:calc(var(--safe-top) + 24px);padding:calc(var(--safe-top) + 2px) 6px 2px}.top-bar__status{gap:4px}.status-chip{font-size:.68rem;padding:2px 6px}.ui-btn,.mode-btn{font-size:.82rem}.panel-actions{grid-template-columns:repeat(2,minmax(0,1fr))}}