:root{color:#f8f0dc;font-synthesis:none;background:#071520;font-family:ui-monospace,Cascadia Mono,Segoe UI Mono,monospace}*{box-sizing:border-box}html,body,#app-root,#game-root{width:100%;height:100%;margin:0}body{background:#071520;min-height:100dvh;overflow:hidden}button,input{font:inherit}button{touch-action:manipulation}#game-root{padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);justify-content:center;align-items:center;display:none}body[data-view=game] .title-shell{display:none}body[data-view=game] #game-root{display:flex}canvas{image-rendering:pixelated;touch-action:none;display:block}.title-shell{background:#071520;place-items:center;min-height:100dvh;display:grid;overflow:hidden}.visually-hidden{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;padding:0;position:absolute;overflow:hidden}h2,p{margin-top:0}.connection-status{z-index:1;color:#fff0c6;text-align:center;text-shadow:2px 2px #071520;min-height:1.2em;margin:0;font-size:clamp(.65rem,1.8vh,.8rem);position:absolute;bottom:4%;left:12%;right:12%}.title-input-layer{opacity:0;pointer-events:none;border:0;width:1px;height:1px;padding:0;position:fixed;top:0;left:0;overflow:auto}.rotate-overlay{display:none}.offline-overlay{z-index:110;color:#fff0c6;text-align:center;background:#071520f5;place-items:center;padding:28px;display:grid;position:fixed;inset:0}.offline-overlay[hidden]{display:none}.offline-overlay div{gap:12px;display:grid}.offline-overlay small{color:#b8d5d7}.touch-controls{display:none}@media (pointer:coarse) and (orientation:landscape){body[data-view=game] .touch-controls{z-index:12;right:max(18px, env(safe-area-inset-right));bottom:max(18px, env(safe-area-inset-bottom));left:max(18px, env(safe-area-inset-left));pointer-events:none;justify-content:space-between;align-items:end;display:flex;position:fixed}.touch-stick,.touch-buttons button{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);pointer-events:auto;touch-action:none;-webkit-user-select:none;user-select:none;background:#03161fa3;border:2px solid #8fe7e8b3;box-shadow:0 5px 20px #0000004d}.touch-stick{border-radius:50%;width:112px;height:112px;position:relative}.touch-stick-knob{background:#ffd37dcc;border-radius:50%;width:52px;height:52px;margin:-26px;position:absolute;top:50%;left:50%}.touch-buttons{grid-template-columns:repeat(2,58px);align-items:end;gap:10px;display:grid}.touch-buttons button{color:#fff;border-radius:50%;min-width:58px;min-height:52px;font-size:.72rem;font-weight:800}.touch-buttons .touch-interact{color:#241508;background:#ffd37dd6;border-color:#ffd37d;grid-row:span 2;min-width:72px;min-height:72px;font-size:1.25rem}}@media (orientation:portrait) and (pointer:coarse){body[data-view=game] .rotate-overlay{z-index:100;padding:max(28px, env(safe-area-inset-top)) max(28px, env(safe-area-inset-right)) max(28px, env(safe-area-inset-bottom)) max(28px, env(safe-area-inset-left));color:#fff0c6;text-align:center;background:#071520;place-items:center;display:grid;position:fixed;inset:0}.rotate-overlay div{gap:12px;display:grid}.rotate-overlay span{color:#75d9df;font-size:4rem}.rotate-overlay small{color:#b8d5d7}}@media (height<=500px) and (orientation:landscape){.connection-status{display:none}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important}}