/* Shared material, hierarchy and motion polish. Everything is local. */
:root{--surface-edge:#ffffff1c}button,input,select,summary{font-family:inherit}canvas{image-rendering:auto}.stage,.viewport{background:#0c1822!important}.play-panel,.cabinet,.arena{border-color:var(--surface-edge);box-shadow:0 16px 45px #0004,inset 0 1px #ffffff09}.ready-screen{background:linear-gradient(155deg,#263747f5,#121d2cf7)}.game-symbol{transform:none;box-shadow:inset 0 1px #ffffff20,0 12px 25px #0003}.gesture-demo{border-radius:10px;background:#ffffff07;padding:9px 13px;color:#e5e5d9;line-height:1.5}.heading #subtitle{max-width:460px}.aim-access{border:1px solid #ffffff15;border-radius:12px;margin:9px 12px;padding:8px 13px}.aim-access summary{min-height:36px}.aim-access input[type=range]{accent-color:var(--accent);cursor:pointer;padding:0}.aim-access label{display:flex;align-items:center;gap:16px;margin:8px 0}.aim-access input{min-height:44px}.shot-feedback{border-left:3px solid var(--accent)}.shot-feedback[data-good=true]{background:#a8d9b312}.instruction-card,.mission,.instructions{background:linear-gradient(145deg,#ffffff06,#ffffff02)}.pro-note{padding:10px 14px;border-color:#ffffff16;background:#ffffff04;color:#c9c8ce;font-size:12px}.word-board{padding:13px;border-radius:14px;background:linear-gradient(145deg,#82654d,#3d312c);border:1px solid #b99a6a88;box-shadow:inset 0 3px 8px #0008;gap:9px}.word-board button{color:#453b34;background:linear-gradient(145deg,#ffefcf,#d9c4a0);border:1px solid #f9eccb;border-radius:10px;box-shadow:0 4px #a08b6b,0 5px 7px #0005;position:relative;text-shadow:0 1px #fff8}.word-board button.selected{background:linear-gradient(145deg,#cee9da,#89bca8);color:#163c32;border-color:#d8ffec;box-shadow:0 3px #477b67;transform:translateY(1px)}.word-board button.selected::after{content:attr(data-order);position:absolute;right:5px;top:3px;font-size:9px;color:#245d46}.word-board.resting button{color:transparent;text-shadow:none}.color-board{padding:9px;border-radius:14px;background:#121b29;box-shadow:inset 0 3px 8px #0008;gap:5px}.color-cell{border-radius:7px;box-shadow:inset 0 2px #ffffff55,inset 0 -4px #0002,0 3px 3px #0004}.color-cell.last{animation:claim-cell .35s ease-out}.color-cell.owned-0{border:2px solid #fff;box-shadow:inset 0 0 0 2px #1d214466,inset 0 -4px #0002}.color-cell.owned-1{border:2px dashed #182039;box-shadow:inset 0 0 0 2px #ffffff88,inset 0 -4px #0002}.color-cell.preview{outline:2px solid white;outline-offset:-5px}.color-picks button{box-shadow:inset 0 2px #fff5,inset 0 -3px #0002}.color-picks button:active{transform:translateY(2px)}.color-cell.last::after{bottom:2px}#shuffleCanvas{aspect-ratio:420/500;width:auto;max-width:100%;margin:auto;height:auto;object-fit:contain}#selection{color:#c8ead8;letter-spacing:2px}.control{box-shadow:inset 0 1px #ffffff17,0 3px #070f1b}.controls{gap:9px}.control[data-active=true]{box-shadow:inset 0 1px #ffffff30,0 1px #070f1b;transform:translateY(2px)}.countdown{font-variant-numeric:tabular-nums}.intro-content h2{font-style:normal;font-size:42px;text-transform:none;line-height:1.03;letter-spacing:-1.8px}.headline h1{font-style:normal;letter-spacing:-1.5px}.finish-stamp span{transform:none;letter-spacing:-1px}.game-card{background:linear-gradient(145deg,#28313a,#181d29);box-shadow:inset 0 1px #ffffff09,0 8px 20px #0002}.game-card:hover{transform:translateY(-2px)}
@keyframes claim-cell{from{transform:scale(.9);filter:brightness(1.2)}to{transform:scale(1);filter:brightness(1)}}
@media(max-width:700px){.gesture-demo{font-size:11px}body.playing .aim-access{margin:5px 9px}.word-board{padding:10px;gap:8px}.word-board button{font-size:25px}.pro-note{line-height:1.45}.heading #subtitle{font-size:13px}.ready-screen h2{max-width:300px}.intro-content h2{font-size:34px}body.playing #shuffleCanvas{height:min(calc(100dvh - 330px),calc((100vw - 56px)*500/420));max-height:none;width:auto}.color-cell{min-height:35px}}
@media(prefers-reduced-motion:reduce){.color-cell.last{animation:none}button{transition:none!important}}

@media(max-width:700px){body.playing .topbar,body.playing .mast{display:flex;justify-content:flex-start;padding:0 0 4px;border:0;min-height:44px}body.playing .topbar>.wordmark,body.playing .mast>.logo,body.playing .mast>span{display:none}body.playing .all-games{min-height:44px;padding:6px 10px;font-size:12px}body.playing #court{height:min(calc(100dvh - 280px),calc((100vw - 28px)*500/420))}body.playing #scene{height:min(calc(100dvh - 280px),calc((100vw - 28px)*600/420))}body.playing header:has(.brand){display:flex;margin-bottom:7px}body.playing header .brand{display:none}}
/* Set one dimension; max-width must never squeeze a fixed-height game canvas. */
.stage #court{width:min(100%,calc(67svh * .84));height:auto;max-height:none;aspect-ratio:420/500}.viewport #scene{width:min(100%,calc(67svh * .7));height:auto;max-height:none;aspect-ratio:420/600}#shuffleCanvas{width:min(100%,calc(60dvh * .84));height:auto;max-height:none;aspect-ratio:420/500}
@media(max-width:700px){body.playing #court{width:min(100%,calc((100dvh - 280px) * .84));height:auto;max-height:none;aspect-ratio:420/500}body.playing #scene{width:min(100%,calc((100dvh - 280px) * .7));height:auto;max-height:none;aspect-ratio:420/600}body.playing #shuffleCanvas{width:min(100%,calc((100dvh - 330px) * .84));height:auto;max-height:none;aspect-ratio:420/500}}