:root{--ink:#2b1460;--paper:#fff8ff;--accent:#ffde3b;--shadow:#2800508c;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}html,body{overscroll-behavior:none;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;touch-action:none;background:#c52afe;height:100%;margin:0;overflow:hidden}#app{color:var(--paper);font-family:"Press Start 2P",monospace;position:fixed;inset:0}.screen{display:block;position:absolute;top:0;left:0}.ui{pointer-events:none;text-shadow:2px 2px 0 var(--shadow);position:absolute;inset:0}.score{top:max(14px, env(safe-area-inset-top));right:max(16px, env(safe-area-inset-right));letter-spacing:1px;font-size:clamp(12px,2.2vw,20px);position:absolute}.score .hi{opacity:.75;margin-right:1em}.score .flash{visibility:hidden}.panel{text-align:center;flex-direction:column;justify-content:flex-start;align-items:center;gap:1.4em;padding:max(12vh,70px) 16px max(9vh,96px);display:none;position:absolute;inset:0}.panel.visible{display:flex}.panel.over,.panel.paused{justify-content:center;gap:1.2em;padding-bottom:22vh}.title{color:var(--accent);text-shadow:3px 3px 0 #e2462a, 6px 6px 0 var(--shadow);font-size:clamp(22px,6vw,56px)}.panel.over .title{letter-spacing:.35em;color:var(--paper);text-shadow:3px 3px 0 var(--shadow);margin-right:-.35em;font-size:clamp(16px,4.2vw,36px)}.hint{text-shadow:2px 2px #2b1460,-1px -1px #2b1460,1px -1px #2b1460,-1px 1px #2b1460;font-size:clamp(10px,1.9vw,16px);line-height:2;animation:1.1s steps(2,start) infinite blink}.hint small{opacity:.85;margin-top:.6em;font-size:.7em;display:inline-block}@keyframes blink{to{opacity:.35}}.loading{font-size:12px;position:absolute;bottom:18%;left:50%;transform:translate(-50%)}button{font:inherit;color:inherit;pointer-events:auto;cursor:pointer;touch-action:none;border:0}.duck{left:max(18px, env(safe-area-inset-left));bottom:max(18px, env(safe-area-inset-bottom));background:#ffffff38;border:3px solid #ffffffb3;border-radius:50%;width:76px;height:76px;font-size:24px;display:none;position:absolute}.duck:active{background:#ffffff73}@media (pointer:coarse){.duck{display:block}}.mute{top:max(10px, env(safe-area-inset-top));left:max(12px, env(safe-area-inset-left));width:40px;height:40px;filter:drop-shadow(2px 2px 0 var(--shadow));background:0 0;place-items:center;display:grid;position:absolute}.mute.off{opacity:.6}.pixel{top:max(14px, env(safe-area-inset-top));left:calc(max(12px, env(safe-area-inset-left)) + 48px);background:#ffffff2e;border:2px solid #ffffffb3;border-radius:4px;height:32px;padding:0 8px;font-size:10px;position:absolute}.pixel.off{opacity:.6;background:0 0;text-decoration:line-through}.mute:focus-visible,.pixel:focus-visible,.duck:focus-visible{outline:2px dashed var(--accent);outline-offset:3px}.panel .btn,.modal .btn,.topbar .btn{color:var(--paper);text-shadow:none;pointer-events:auto;white-space:nowrap;background:#2b14608c;border:2px solid #ffffffbf;border-radius:4px;padding:.9em 1.1em .8em;font-size:clamp(9px,1.4vw,12px);line-height:1.2;text-decoration:none}.panel .btn:hover:not(:disabled),.modal .btn:hover:not(:disabled),.topbar .btn:hover:not(:disabled){background:#2b1460cc;border-color:#fff}.panel .btn:disabled,.topbar .btn:disabled{opacity:.55;cursor:default}.panel .btn.primary,.modal .btn.primary{background:var(--accent);border-color:var(--accent);color:var(--ink)}.panel .btn.x,.modal .btn.x,.topbar .btn.x{background:#000;border-color:#000;align-items:center;gap:.6em;display:inline-flex}.x-icon{flex:none;width:1.15em;height:1.15em}.btn:focus-visible,.nick-input:focus-visible{outline:2px dashed var(--accent);outline-offset:3px}.topbar{top:max(10px, env(safe-area-inset-top));pointer-events:auto;text-shadow:none;gap:8px;display:flex;position:absolute;left:50%;transform:translate(-50%)}.topbar .btn{padding:.8em .95em .7em;font-size:clamp(8px,1vw,11px)}.share-preview{aspect-ratio:1200/630;width:calc(100% - 32px);image-rendering:pixelated;background:#1a0b3d;border:2px solid #fff9;margin:16px 16px 0;display:block}.share-help{opacity:.9;padding:14px 16px 4px;font-size:9px;line-height:1.8}.share-modal .actions{justify-content:flex-start;padding:12px 16px 16px}.share-modal .modal-box{width:min(640px,100%)}.modal-head .x-icon{vertical-align:-.15em;margin-left:.4em}.result{pointer-events:auto;flex-direction:column;align-items:center;gap:.9em;display:none}.panel.over .result{display:flex}.big-score{text-shadow:4px 4px 0 var(--shadow);font-size:clamp(26px,5.5vw,52px)}.best{color:var(--accent);font-size:clamp(11px,1.8vw,16px)}.new-best{color:#fff;text-shadow:none;background:#e2462a;margin-left:.6em;padding:.35em .5em .25em;animation:.6s steps(2,start) infinite pop;display:inline-block}@keyframes pop{to{transform:scale(1.12)}}.status{opacity:.95;min-height:1.2em;font-size:clamp(9px,1.4vw,12px)}.status.ok{color:#9dff7a}.status.error{color:#ffb3a8}.nick-form{pointer-events:auto;gap:8px;display:flex}.nick-input{font:inherit;width:15em;color:var(--ink);text-transform:none;-webkit-user-select:text;user-select:text;background:#fffffff2;border:2px solid #fff;border-radius:4px;padding:.85em .9em .75em;font-size:clamp(10px,1.5vw,13px)}.actions{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.panel.over .hint{font-size:clamp(9px,1.4vw,12px)}.modal{pointer-events:auto;background:#1406328c;justify-content:center;align-items:center;padding:16px;display:none;position:absolute;inset:0}.modal.open{display:flex}.modal-box{width:min(520px,100%);max-height:min(640px,100%);text-shadow:none;background:#2b1460;border:3px solid #fff;border-radius:6px;flex-direction:column;display:flex;box-shadow:6px 6px #00000059}.modal-head{color:var(--accent);border-bottom:2px solid #ffffff40;justify-content:space-between;align-items:center;padding:14px 16px;font-size:16px;display:flex}.modal .btn.close{padding:.4em .7em .3em;font-size:16px}.board{margin:0;padding:8px 0;font-size:11px;list-style:none;overflow:auto}.board li{grid-template-columns:3.5em 1fr auto;gap:8px;padding:8px 16px 7px;display:grid}.board li:first-child span:first-child{color:#ffde3b}.board li:nth-child(2) span:first-child{color:#d9e2ff}.board li:nth-child(3) span:first-child{color:#ffb36b}.board li span:nth-child(2){text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.board li.me{background:#ffde3b33}.board li.empty{text-align:center;opacity:.8;padding:24px 16px;display:block}.board-me{border-top:2px solid #ffffff40;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;padding:12px 16px 14px;font-size:9px;line-height:1.6;display:flex}.modal .btn.link{padding:.6em .8em .5em;font-size:9px}.boost{top:calc(max(10px, env(safe-area-inset-top)) + 46px);color:var(--accent);align-items:center;gap:10px;font-size:12px;display:none;position:absolute;left:50%;transform:translate(-50%)}.boost.on{display:flex}.boost b{background:#2b146099;border:2px solid #fff;width:min(240px,40vw);height:12px;display:block}.boost i{background:linear-gradient(90deg,#ff3b6b,#ffde3b,#5dff7a,#3bd5ff,#b05cff);height:100%;display:block}.boost.warn{animation:.25s steps(2,start) infinite blink}.flash{opacity:0;pointer-events:none;background:#fff;position:absolute;inset:0}.flash.go{animation:.45s ease-out flash}@keyframes flash{0%{opacity:.85}to{opacity:0}}.popup{color:var(--accent);text-shadow:2px 2px 0 #e2462a, 4px 4px 0 var(--shadow);pointer-events:none;font-size:14px;animation:1.1s ease-out forwards rise;position:absolute;transform:translate(-50%,-50%)}.popup.big{font-size:clamp(18px,3.4vw,30px)}@keyframes rise{to{opacity:0;transform:translate(-50%,-150%)}}.toast{left:50%;bottom:max(24px, env(safe-area-inset-bottom));text-align:center;opacity:0;pointer-events:none;max-width:min(92vw,640px);text-shadow:none;background:#2b1460eb;border:2px solid #fff;border-radius:4px;padding:12px 16px 11px;font-size:10px;line-height:1.7;transition:opacity .2s,transform .2s;position:absolute;transform:translate(-50%,20px)}.toast.show{opacity:1;transform:translate(-50%)}@media (max-width:560px){.actions .btn{flex:40%}.nick-input{width:11em}}@media (max-width:760px){.topbar{top:calc(max(10px, env(safe-area-inset-top)) + 44px)}.boost{top:calc(max(10px, env(safe-area-inset-top)) + 90px)}.panel{padding-top:max(16vh,120px)}}
