:root { color-scheme: dark; font-family: system-ui, -apple-system, sans-serif; color: #f4f7ff; background: #090e22; }
* { box-sizing: border-box; }
html, body { margin: 0; width: 100%; height: 100%; overscroll-behavior: none; }
body { display: grid; place-items: center; padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left); }
#game { position: relative; width: 100%; height: 100%; max-width: 540px; overflow: hidden; background: #090e22; }
#unity-canvas { display: block; width: 100%; height: 100%; touch-action: none; outline: none; }
#welcome { position: absolute; inset: 0; display: flex; align-items: center; flex-direction: column; overflow-y: auto; padding: max(24px, 7vh) 24px 24px; background: #090e22; text-align: center; }
#welcome[hidden], [hidden] { display: none !important; }
#welcome > img { border-radius: 22px; margin-bottom: 12px; }
.eyebrow { letter-spacing: .22em; color: #64e6ff; font-size: .875rem; margin: 8px 0; }
h1 { font-size: clamp(2rem, 8vw, 3rem); letter-spacing: .07em; margin: 0; }
p { font-size: 1rem; line-height: 1.65; }
button { min-height: 52px; padding: 12px 28px; border: 0; border-radius: 12px; font: inherit; font-weight: 700; color: #091222; background: #66e5fa; cursor: pointer; }
#start, progress { width: min(100%, 330px); margin-top: 18px; }
button:disabled { opacity: .55; cursor: wait; }
button:focus-visible, summary:focus-visible { outline: 3px solid #ffdb83; outline-offset: 4px; }
#status { color: #c2cde8; min-height: 28px; }
#cache-status { position: absolute; z-index: 2; bottom: 8px; left: 16px; right: 16px; margin: 0; padding: 10px 12px; border-radius: 10px; background: #121b35f2; color: #d5ebff; font-size: .875rem; text-align: center; pointer-events: none; }
details { font-size: .875rem; max-width: 390px; text-align: left; margin-top: auto; padding-top: 18px; color: #b8c7e5; }
summary { cursor: pointer; min-height: 44px; text-align: center; }
details p { font-size: .875rem; }
@supports (height: 100dvh) { body { height: 100dvh; } }
@media (orientation: landscape) { #game { max-width: min(540px, 62vh); } #welcome { padding-top: 16px; } #welcome > img { width: 54px; height: 54px; } }