.play-screen { height: 100dvh; overflow: hidden; overscroll-behavior: none; background: var(--bg); -webkit-tap-highlight-color: transparent; user-select: none; -webkit-user-select: none; }
.game-chrome { position: fixed; top: 0; left: 0; right: 0; z-index: 30; height: calc(2.5rem + env(safe-area-inset-top)); display: flex; align-items: center; justify-content: space-between; padding: env(safe-area-inset-top) max(.4rem, env(safe-area-inset-right)) 0 max(.4rem, env(safe-area-inset-left)); border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--surface) 92%, transparent); backdrop-filter: blur(10px); transition: transform .25s ease; }
.game-chrome.is-hidden { transform: translateY(calc(-100% - 1px)); }
.chrome-hotzone { position: fixed; top: 0; left: 0; right: 0; height: max(14px, env(safe-area-inset-top)); z-index: 29; }
.chrome-cluster { display: flex; gap: .2rem; }
.chrome-button { display: grid; place-items: center; width: 2rem; height: 2rem; border: 0; border-radius: 8px; background: transparent; color: var(--muted); font-size: 1rem; text-decoration: none; cursor: pointer; transition: color .2s, background .2s; -webkit-tap-highlight-color: transparent; touch-action: manipulation; }
@media (hover: hover) and (pointer: fine) { .chrome-button:hover { color: var(--ink); background: var(--surface-2); } }
.chrome-button:active { color: var(--ink); background: var(--surface-2); }
.game-viewport { position: relative; height: 100dvh; }
#game-frame { display: block; width: 100%; height: 100%; border: 0; background: var(--bg); }
.game-loading { position: absolute; z-index: 2; inset: 0; display: grid; place-content: center; justify-items: center; gap: 1rem; background: var(--bg); color: var(--muted); font-weight: 700; }
.game-loading[hidden] { display: none; }
.loader { width: 3.4rem; aspect-ratio: 1; border-radius: 50%; background: var(--rainbow); -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 6px), #000 calc(100% - 5px)); mask: radial-gradient(farthest-side, transparent calc(100% - 6px), #000 calc(100% - 5px)); animation: loader-spin 1s linear infinite; }
@keyframes loader-spin { to { transform: rotate(360deg); } }
.game-error { position: fixed; inset: 0; place-content: center; justify-items: center; text-align: center; background: var(--bg); }
.game-error:not([hidden]) { display: grid; }