:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#14161b;--panel:#1d2027;--line:#343844;--text:#e6e8ee;--muted:#8b90a0;--ok:#6cc28b;--bad:#e06c6c;--size:min(3.75rem, (100vw - 4rem) / (var(--cols) + .5), (100dvh - 13.5rem) / var(--rows))}*{box-sizing:border-box}html,body{height:100%;margin:0}body{background:var(--bg);min-height:100dvh;color:var(--text);-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;flex-direction:column;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;display:flex}header{padding:.75rem max(1.25rem, env(safe-area-inset-right)) .75rem max(1.25rem, env(safe-area-inset-left));padding-top:max(.75rem, env(safe-area-inset-top));background:var(--panel);border-bottom:1px solid var(--line);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.5rem 1rem;display:flex}h1{white-space:nowrap;margin:0;font-size:1rem}.header-actions{gap:.5rem;display:flex}button{border:1px solid var(--line);color:var(--muted);font:inherit;cursor:pointer;background:0 0;border-radius:.375rem;align-items:center;gap:.375rem;padding:.375rem .75rem;font-size:.8125rem;display:inline-flex}button:hover{border-color:var(--muted);color:var(--text)}button:focus-visible{outline:2px solid var(--ok);outline-offset:2px}.icon{fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;width:1rem;height:1rem}#mute .slash,#mute[data-muted=true] .waves{display:none}#mute[data-muted=true] .slash{display:inline}#mute[data-muted=true]{border-color:var(--bad);color:var(--bad)}button.danger{border-color:var(--bad);background:var(--bad);color:var(--bg);font-weight:600}main{flex-direction:column;flex:1;justify-content:center;align-items:center;gap:1.25rem;padding:1.5rem;display:flex}main p{margin:0}.counters{color:var(--muted);gap:1.5rem;font-size:.9375rem;display:flex}.counters b{color:var(--text);font-variant-numeric:tabular-nums}.hint{color:var(--muted);text-align:center;font-size:.8125rem}.hint-touch{display:none}@media (pointer:coarse){.hint-touch{display:inline}.hint-desktop{display:none}}kbd{border:1px solid var(--line);font:inherit;border-bottom-width:2px;border-radius:.25rem;padding:.0625rem .375rem}dialog{border:1px solid var(--line);background:var(--panel);max-width:min(24rem,100% - 2rem);color:var(--text);border-radius:.625rem;padding:1.25rem}dialog::backdrop{background:#0009}dialog h2{margin:0 0 .5rem;font-size:1.125rem}dialog p{color:var(--muted);margin:0 0 1.25rem;font-size:.875rem}.actions{justify-content:flex-end;gap:.5rem;display:flex}#sheet{cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;background:#aac8e60f;border:1px solid #aac8e61f;border-radius:.625rem;padding:.75rem}.row{display:flex}.row:nth-child(2n){padding-left:calc(var(--size) / 2)}.row:nth-child(odd){padding-right:calc(var(--size) / 2)}.bubble{width:var(--size);height:var(--size);padding:3px}.bubble:before{content:"";background:radial-gradient(circle at 32% 28%,#ffffffd9 0 9%,#0000 16%),radial-gradient(circle,#bed7f02e,#bed7f052 68%,#dcebfa8c 100%);border-radius:50%;width:100%;height:100%;transition:transform 80ms;display:block;box-shadow:inset 0 -3px 6px #00000040,0 2px 4px #0000004d}@media (hover:hover){.bubble:not(.popped):hover:before{transform:scale(1.05)}}.bubble.popped:before{background:linear-gradient(35deg,#0000 45%,#ffffff2e 48%,#0000 52%),linear-gradient(-50deg,#0000 40%,#ffffff1f 44%,#0000 48%),#bed7f012;animation:.12s ease-out pop;transform:scale(.82);box-shadow:inset 0 1px 3px #0006}@keyframes pop{0%{transform:scale(1.15)}to{transform:scale(.82)}}@media (prefers-reduced-motion:reduce){.bubble:before{transition:none}.bubble.popped:before{animation:none}}
