@font-face{font-family:Roboto;src:url('assets/Roboto-Regular.ttf') format('truetype');font-weight:100 500;font-display:swap}
@font-face{font-family:Roboto;src:url('assets/Roboto-Bold.ttf') format('truetype');font-weight:600 900;font-display:swap}
@font-face{font-family:Roboto;src:url('assets/Roboto-BlackItalic.ttf') format('truetype');font-weight:800 900;font-style:italic;font-display:swap}
:root{font-family:Roboto,Arial,sans-serif;color:#fff;background:#071421;font-synthesis:none;--blue:#14a0ff;--muted:#8ea8be;--brand:#007acc}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overscroll-behavior:none}body{overflow:hidden}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit}button:focus-visible,a:focus-visible{outline:2px solid #fff;outline-offset:5px}button{touch-action:manipulation}button:disabled{cursor:default}button[hidden],[hidden]{display:none!important}button svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.game-shell{height:100svh;height:100dvh;min-height:320px;width:100%;position:relative;overflow:hidden;isolation:isolate;background:radial-gradient(ellipse at 68% 60%,#0b2a48 0,transparent 49%),linear-gradient(120deg,#071421,#0a1828)}.game-shell:after{content:'';position:absolute;inset:0;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' opacity='.18' filter='url(%23n)' d='M0 0h160v160H0z'/%3E%3C/svg%3E");opacity:.11;z-index:-1}#scene{position:absolute;inset:0;width:100%;height:100%;touch-action:none;outline:none}.topbar{position:absolute;left:0;right:0;top:0;padding:32px 46px;display:flex;align-items:center;justify-content:space-between;z-index:3;gap:24px}.brand{display:block;flex-shrink:0;line-height:0}.brand img{width:132px;height:auto;display:block}.game-name{font-size:10px;letter-spacing:2.3px;font-weight:600;color:#9bb0c6;display:flex;align-items:center;gap:18px}.name-line{width:26px;height:1px;background:#33506d}.tools{display:flex;gap:10px}.icon-button{background:transparent;border:1px solid #31506a80;border-radius:50%;width:42px;height:42px;display:grid;place-items:center;transition:background .18s,border-color .18s;padding:0}.icon-button:hover{background:#14a0ff18;border-color:#14a0ff88}.icon-button span{font-size:20px}.icon-button svg{width:19px;height:19px}.sound-off{display:none}#sound[aria-pressed=false] .sound-waves{display:none}#sound[aria-pressed=false] .sound-off{display:block}.intro{position:absolute;left:max(7.5vw,36px);top:27%;pointer-events:none}.eyebrow{font-size:10px;font-weight:700;letter-spacing:2.5px;color:#73b9ee}.intro h1{font-size:clamp(48px,5.9vw,90px);line-height:.98;letter-spacing:-3px;margin:20px 0 24px;font-weight:900;font-style:italic}.intro h1 span{color:var(--blue)}.intro p{font-size:15px;line-height:1.6;color:#9eb3c8;margin:0}.intro-best{margin-top:34px;display:flex;align-items:center;gap:16px;font-size:9px;letter-spacing:2px;color:#7a95ae}.intro-best strong{font-size:24px;color:#fff;letter-spacing:0;font-weight:500}.action-area{position:absolute;left:max(7.5vw,36px);bottom:max(100px,13%);width:280px;z-index:2}.primary{background:#14a0ff;border:0;border-radius:5px;color:#002f5e;display:flex;align-items:center;justify-content:space-between;padding:0 24px;min-height:60px;width:100%;font-size:13px;letter-spacing:1.5px;font-weight:800;box-shadow:0 8px 32px #007acc22;transition:background .15s,transform .15s}.primary:hover{background:#32adff}.primary:active{transform:translateY(2px);background:#007acc}.primary svg{width:22px;height:22px}.control-hint{font-size:10px;text-align:center;color:#7d96ad;margin:17px 0 0;letter-spacing:.2px}kbd{font:inherit;font-size:8px;border:1px solid #35516b;padding:4px 5px;border-radius:3px;margin-left:5px}.touch-hint{display:none}.scoreboard{position:absolute;left:66%;top:17%;transform:translateX(-50%);text-align:center;pointer-events:none}.score-label{font-size:9px;letter-spacing:3px;color:#8ea8be;display:block}.scoreboard strong{font-size:96px;line-height:1.18;font-weight:800;font-style:italic;letter-spacing:-4px;display:block;font-variant-numeric:tabular-nums}.best-line{font-size:9px;letter-spacing:2px;color:#829bb2}.best-line b{color:#d1e4f5;font-size:12px;margin-left:6px;font-weight:500}.score-pop{animation:score-pop .24s ease-out}@keyframes score-pop{40%{transform:scale(1.13)}}.feedback{position:absolute;left:66%;top:36%;transform:translateX(-50%);text-align:center;font-size:16px;letter-spacing:2px;font-weight:800;white-space:nowrap;pointer-events:none;color:#8ed2ff;opacity:0}.feedback small{display:block;font-size:9px;letter-spacing:1.8px;margin-top:7px;color:#9cb9d0}.feedback.show{animation:feedback .9s ease-out}@keyframes feedback{0%{opacity:0;translate:0 8px}15%,60%{opacity:1;translate:0 0}100%{opacity:0;translate:0 -12px}}.footer{position:absolute;bottom:26px;left:46px;right:46px;display:flex;justify-content:space-between;color:#526c84;font-size:8px;letter-spacing:2px;pointer-events:none}.result-panel{position:absolute;left:max(7.5vw,36px);top:25%;width:310px;z-index:3}.result-panel h2,.pause-overlay h2,dialog h2{font-size:46px;letter-spacing:-1.5px;font-weight:900;font-style:italic;line-height:1.05;margin:17px 0 24px}.result-stats{display:flex;gap:46px}.result-stats>div{display:flex;flex-direction:column}.result-stats strong{font-size:64px;line-height:1.1;font-weight:800;font-style:italic;font-variant-numeric:tabular-nums}.result-stats span{font-size:9px;letter-spacing:1.6px;color:#8ea8be;margin-top:9px}.result-stats>div+div strong{color:#7097bb}.result-panel p{font-size:13px;color:#a8bfd3;line-height:1.6;min-height:42px;margin:24px 0}.text-button{border:0;background:transparent;padding:17px 0;font-size:12px;width:100%;color:#91b2ce}.text-button span{margin-left:8px;color:#14a0ff}.pause-overlay{position:absolute;inset:0;z-index:6;background:#06111ee8;backdrop-filter:blur(10px);display:grid;place-items:center}.pause-overlay section{text-align:center;width:min(290px,80vw)}.pause-overlay .primary{justify-content:center}.pause-overlay h2{font-size:60px;margin-bottom:36px}.toast{position:absolute;left:50%;bottom:30px;transform:translate(-50%,20px);opacity:0;padding:14px 20px;background:#183652;border:1px solid #42627e;border-radius:8px;font-size:13px;z-index:10;pointer-events:none;transition:.2s;white-space:nowrap}.toast.visible{opacity:1;transform:translate(-50%,0)}dialog{color:#fff;background:#0c2034;border:1px solid #2c4b66;border-radius:16px;padding:38px;width:min(440px,calc(100vw - 32px));box-shadow:0 20px 100px #0008}dialog::backdrop{background:#020b14b8;backdrop-filter:blur(6px)}dialog h2{font-size:32px;margin:18px 0 28px}.dialog-close{position:absolute;right:14px;top:14px;font-size:26px;border:0}.dialog-close:hover{background:#234866}dialog ol{list-style:none;padding:0;margin:0 0 28px}dialog li{display:flex;gap:18px;align-items:baseline;margin-bottom:19px}dialog li>span{font-size:11px;letter-spacing:1px;color:#14a0ff}dialog p{margin:0;font-size:14px;line-height:1.55;color:#b1c6d8}dialog .primary{justify-content:center}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
[data-state=playing] .action-area{left:66%;transform:translateX(-50%);bottom:11%;width:270px}[data-state=playing] .drop-button{color:#d1eaff;background:#0c2842a8;border:1px solid #2f6793;box-shadow:none;min-height:52px;font-size:11px}[data-state=playing] .drop-button:hover{background:#164a72}[data-state=playing] .game-name{opacity:.6}
@media (pointer:coarse){.keyboard-hint{display:none}.touch-hint{display:inline}.primary:hover{background:#14a0ff}}
@media(max-width:760px){.game-shell{background:radial-gradient(ellipse at 50% 63%,#0b2e50,transparent 62%),#071421}.topbar{padding:max(22px,env(safe-area-inset-top)) 22px 0;gap:10px}.brand img{width:108px}.game-name{display:none}.tools{gap:8px}.icon-button{width:36px;height:36px}.icon-button svg{width:17px;height:17px}.intro{left:0;right:0;top:15.5%;text-align:center}.eyebrow{font-size:8px;letter-spacing:2.3px}.intro h1{font-size:51px;letter-spacing:-1.8px;line-height:.99;margin:14px 0 15px}.intro p{font-size:12px;line-height:1.6}.intro-best{display:none}.action-area{left:24px;right:24px;bottom:max(68px,calc(env(safe-area-inset-bottom) + 42px));width:auto}.primary{min-height:56px;font-size:12px;padding:0 23px}.control-hint{font-size:10px;margin-top:16px}.keyboard-hint{display:none}.touch-hint{display:inline}.footer{left:24px;right:24px;bottom:max(21px,env(safe-area-inset-bottom));font-size:7px;letter-spacing:1.3px}.scoreboard{left:50%;top:16%}.scoreboard strong{font-size:86px}.feedback{left:50%;top:36%;font-size:15px}[data-state=playing] .action-area{left:24px;right:24px;transform:none;width:auto;bottom:max(68px,calc(env(safe-area-inset-bottom) + 42px))}[data-state=playing] .drop-button{min-height:52px}.result-panel{width:auto;left:24px;right:24px;top:auto;bottom:max(48px,calc(env(safe-area-inset-bottom) + 24px));background:linear-gradient(0deg,#071421 75%,#07142100);padding:36px 8px 0;text-align:center}.result-panel h2{font-size:38px;margin:12px 0 17px}.result-stats{justify-content:center;gap:60px}.result-stats strong{font-size:58px}.result-stats span{font-size:8px}.result-panel p{margin:16px 0 19px;min-height:0;font-size:12px}.result-panel .text-button{padding:16px 0 0}.result-panel .eyebrow{font-size:9px}[data-state=over] .footer{opacity:0}dialog{padding:35px 25px 25px}}
@media(max-width:760px) and (max-height:720px){.intro{top:14%}.intro h1{font-size:43px;margin:10px 0}.intro p{font-size:11px}.intro .eyebrow{font-size:7px}.action-area,[data-state=playing] .action-area{bottom:max(52px,calc(env(safe-area-inset-bottom) + 30px))}.control-hint{margin-top:11px;font-size:9px}.primary{min-height:50px}.scoreboard{top:15%}.scoreboard strong{font-size:68px}.feedback{top:36%}.result-panel h2{font-size:32px}.result-panel{bottom:max(24px,env(safe-area-inset-bottom))}.result-stats strong{font-size:46px}.result-panel p{margin:12px 0}.result-panel .eyebrow{display:none}.result-panel .text-button{padding-top:12px}.footer{bottom:max(17px,env(safe-area-inset-bottom))}}
@media (max-height:540px) and (orientation:landscape){.topbar{padding:15px max(24px,env(safe-area-inset-right)) 0 max(24px,env(safe-area-inset-left))}.brand img{width:105px}.game-name{font-size:8px}.intro{left:6%;top:26%;text-align:left}.intro h1{font-size:43px;margin:12px 0}.intro p{font-size:11px}.intro-best{display:none}.action-area{left:6%;right:auto;bottom:45px;width:230px}.primary{min-height:44px}.control-hint{font-size:9px;margin-top:10px}.scoreboard{left:66%;top:20%}.scoreboard strong{font-size:57px}.feedback{left:66%;top:43%;font-size:13px}[data-state=playing] .action-area{left:6%;right:auto;transform:none;width:230px;bottom:65px}.result-panel{left:6%;right:auto;top:24%;bottom:auto;width:260px;background:transparent;padding:0;text-align:left}.result-panel h2{font-size:30px;margin:10px 0}.result-stats{justify-content:flex-start;gap:40px}.result-stats strong{font-size:43px}.result-panel p{font-size:11px;margin:12px 0}.result-panel .eyebrow{display:none}.text-button{padding:10px 0}.footer{bottom:15px;left:24px;right:24px}dialog{max-height:calc(100dvh - 30px);overflow-y:auto}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.feedback.show{opacity:1}}

@media(max-height:360px) and (orientation:landscape){.intro{top:25%}.intro h1{font-size:34px;margin:9px 0}.intro .eyebrow{font-size:7px}.intro p{font-size:10px}.result-panel{top:22%}.result-panel h2{font-size:25px;margin:8px 0}.result-stats strong{font-size:34px}.result-stats span{font-size:7px;margin-top:5px}.result-panel p{display:none}.result-panel .primary{margin-top:16px;min-height:40px}.result-panel .text-button{padding:10px 0;font-size:10px}.scoreboard strong{font-size:49px}.footer{font-size:6px}}