@font-face{font-family:Fraunces;font-style:normal;font-weight:300 900;font-display:swap;src:url(/fonts/fraunces-vietnamese.woff2) format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Fraunces;font-style:normal;font-weight:300 900;font-display:swap;src:url(/fonts/fraunces-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Fraunces;font-style:normal;font-weight:300 900;font-display:swap;src:url(/fonts/fraunces-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Karla;font-style:normal;font-weight:300 700;font-display:swap;src:url(/fonts/karla-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Karla;font-style:normal;font-weight:300 700;font-display:swap;src:url(/fonts/karla-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none}:root{--key-0: #6e2a2b;--key-1: #8b3826;--key-2: #a94d22;--key-3: #c4661f;--key-4: #d8842b;--key-5: #e5a342;--key-6: #efc167;--key-7: #f7dea1;--bg-0: #241512;--bg-1: #3a211a;--surface: #f3e3c6;--surface-hi: #fbf1dc;--edge: #54312260;--ink: #2e1a12;--ink-soft: #7a5a45;--accent: #d8842b;--glow: #ffce7a;--font-display: "Fraunces", "Iowan Old Style", Georgia, serif;--font-ui: "Karla", ui-sans-serif, system-ui, sans-serif;--ease-out: cubic-bezier(.16, 1, .3, 1);--ease-spring: cubic-bezier(.34, 1.56, .64, 1);--ease-in-out: cubic-bezier(.65, 0, .35, 1);--lift-1: 0 1px 2px #1a0d0940, 0 3px 8px -2px #1a0d0930;--lift-2: 0 2px 4px #1a0d0940, 0 10px 24px -6px #1a0d0940;--lift-3: 0 4px 8px #1a0d0930, 0 22px 48px -12px #1a0d0955;--radius-sm: 10px;--radius: 16px;--radius-lg: 24px;--safe-t: 0px;--safe-r: 0px;--safe-b: 0px;--safe-l: 0px}html,body{height:100%;overflow:hidden;background:var(--bg-0)}body{font-family:var(--font-ui);color:var(--ink);font-size:16px;line-height:1.45;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;touch-action:none;overscroll-behavior:none;user-select:none;-webkit-user-select:none;position:fixed;inset:0}input,textarea{font:inherit;color:inherit;user-select:text;-webkit-user-select:text;touch-action:manipulation}button{font:inherit;color:inherit;background:none;border:none;cursor:pointer;touch-action:none}canvas{display:block}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.06ms!important}}.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}#stage{position:fixed;top:0;left:0;transform-origin:0 0;overflow:hidden;background:var(--bg-0);will-change:transform;contain:strict}#stage{width:100dvw;height:100dvh;transform:none}#stage.is-rotated{width:100dvh;height:100dvw;transform:rotate(90deg) translateY(-100%)}#stage:not(.is-rotated){--safe-t: env(safe-area-inset-top, 0px);--safe-r: env(safe-area-inset-right, 0px);--safe-b: env(safe-area-inset-bottom, 0px);--safe-l: env(safe-area-inset-left, 0px)}#stage.is-rotated{--safe-t: env(safe-area-inset-right, 0px);--safe-r: env(safe-area-inset-bottom, 0px);--safe-b: env(safe-area-inset-left, 0px);--safe-l: env(safe-area-inset-top, 0px)}#scene{position:absolute;inset:0;display:flex;flex-direction:column;z-index:2}#screens{position:relative;flex:1;min-height:0;display:flex;flex-direction:column}#fx{position:absolute;inset:0;z-index:3;pointer-events:none}#backdrop{position:absolute;inset:0;z-index:1;pointer-events:none}#refullscreen{position:absolute;top:calc(var(--safe-t) + 8px);right:calc(var(--safe-r) + 10px);z-index:40;display:none;align-items:center;gap:6px;padding:7px 12px;border-radius:999px;background:#ffffff14;backdrop-filter:blur(8px);color:#fffc;font-size:12px;letter-spacing:.04em;transition:opacity .4s var(--ease-out)}#stage.can-refullscreen #refullscreen{display:flex}#enable-sound{position:absolute;bottom:calc(var(--safe-b) + 8px);left:calc(var(--safe-l) + 10px);z-index:40;display:none;align-items:center;gap:6px;padding:7px 13px;border-radius:999px;background:color-mix(in oklab,var(--accent) 88%,#000);color:#2b1508;font-size:12px;font-weight:700;letter-spacing:.02em;box-shadow:var(--lift-2)}#stage.needs-sound #enable-sound{display:flex}.display{font-family:var(--font-display);font-variation-settings:"SOFT" 42,"WONK" 1,"opsz" 96;font-weight:600;letter-spacing:-.015em;line-height:1.02}.title-mark{font-family:var(--font-display);font-variation-settings:"SOFT" 60,"WONK" 1,"opsz" 144;font-weight:700;letter-spacing:.02em}.eyebrow{font-size:11px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-soft)}.eyebrow--onDark{color:#ffffff5c}.card{position:relative;background:linear-gradient(168deg,var(--surface-hi) 0%,var(--surface) 100%);border-radius:var(--radius);box-shadow:var(--lift-2),inset 0 1px #fff9,inset 0 0 0 1px var(--edge);color:var(--ink);padding:16px 18px;overflow:hidden}.card:before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.34;mix-blend-mode:multiply;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='p'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' seed='9'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23p)' opacity='0.16'/%3E%3C/svg%3E")}.card>*{position:relative}.card--quiet{background:#ffffff0f;box-shadow:inset 0 0 0 1px #ffffff1a;color:#ffffffde}.card--quiet:before{opacity:.12}.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 22px;border-radius:999px;font-family:var(--font-ui);font-weight:700;font-size:15px;letter-spacing:.01em;background:linear-gradient(180deg,color-mix(in oklab,var(--accent) 88%,#fff) 0%,var(--accent) 62%,color-mix(in oklab,var(--accent) 84%,#000) 100%);color:#2b1508;box-shadow:var(--lift-2),inset 0 1px #ffffff70,inset 0 -2px 4px #0000002e;transition:transform .12s var(--ease-spring),box-shadow .12s var(--ease-out),filter .12s var(--ease-out);white-space:nowrap}.btn:active{transform:translateY(2px) scale(.985);box-shadow:var(--lift-1),inset 0 1px #ffffff40,inset 0 -1px 3px #00000038;filter:brightness(1.05)}.btn:disabled{opacity:.45;filter:saturate(.4);pointer-events:none}.btn--ghost{background:#ffffff12;color:#fffffff0;box-shadow:inset 0 0 0 1px #ffffff26;font-weight:600}.btn--ghost:active{background:#ffffff1f;box-shadow:inset 0 0 0 1px #fff3}.btn--paper{background:linear-gradient(180deg,var(--surface-hi),var(--surface));color:var(--ink);box-shadow:var(--lift-2),inset 0 1px #fff,inset 0 0 0 1px var(--edge)}.btn--lg{padding:16px 30px;font-size:17px}.btn--sm{padding:9px 15px;font-size:13px}.beads{display:flex;align-items:center;gap:5px;flex-wrap:nowrap}.bead{--size: 18px;width:var(--size);height:var(--size);border-radius:50%;background:radial-gradient(70% 70% at 32% 26%,#ffffff8c 0%,transparent 58%),linear-gradient(165deg,var(--c) 0%,color-mix(in oklab,var(--c) 74%,#000) 100%);box-shadow:0 1px 3px #0006,inset 0 -1px 2px #0000004d;flex:none}.bead--sm{--size: 12px}.bead--lg{--size: 26px}.bead--new{animation:bead-thread .52s var(--ease-spring) backwards}@keyframes bead-thread{0%{transform:scale(0) translateY(-14px);opacity:0}to{transform:scale(1) translateY(0);opacity:1}}.stack{display:flex;flex-direction:column}.row{display:flex;align-items:center}.spacer{flex:1}.dim{color:var(--ink-soft)}.dim-on-dark{color:#ffffff8a}#backdrop{background:radial-gradient(120% 90% at 18% 8%,color-mix(in oklab,var(--bg-1) 88%,var(--accent)) 0%,transparent 58%),linear-gradient(165deg,var(--bg-1) 0%,var(--bg-0) 62%)}#backdrop:before{content:"";position:absolute;inset:-10%;background-size:320px 320px;opacity:.5;mix-blend-mode:overlay;pointer-events:none}#backdrop[data-grain=wood]:before{opacity:.42;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='320' height='320'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.006 0.62' numOctaves='4' seed='11'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='320' height='320' filter='url(%23g)' opacity='0.5'/%3E%3C/svg%3E")}#backdrop[data-grain=paper]:before{opacity:.3;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='320' height='320'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='4' seed='3'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='320' height='320' filter='url(%23g)' opacity='0.55'/%3E%3C/svg%3E")}#backdrop[data-grain=silk]:before{opacity:.26;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='320' height='320'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.03 0.34' numOctaves='3' seed='5'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeGaussianBlur stdDeviation='0.4'/%3E%3C/filter%3E%3Crect width='320' height='320' filter='url(%23g)' opacity='0.5'/%3E%3C/svg%3E")}#backdrop:after{content:"";position:absolute;inset:-30%;background:radial-gradient(38% 46% at 30% 22%,color-mix(in oklab,var(--glow) 26%,transparent) 0%,transparent 70%);animation:drift 68s var(--ease-in-out) infinite alternate;pointer-events:none;will-change:transform}@keyframes drift{0%{transform:translate3d(-6%,-3%,0) scale(1)}to{transform:translate3d(10%,6%,0) scale(1.16)}}.mote{position:absolute;border-radius:50%;background:var(--glow);opacity:.14;filter:blur(1px);pointer-events:none;will-change:transform;animation:mote-float var(--dur) linear infinite;animation-delay:var(--delay)}@keyframes mote-float{0%{transform:translateZ(0)}to{transform:translate3d(var(--dx),var(--dy),0)}}@media(prefers-reduced-motion:reduce){#backdrop:after{animation:none}.mote{display:none}}.screen{position:absolute;inset:0;display:flex;flex-direction:column;transition:opacity .3s var(--ease-out),transform .34s var(--ease-out);will-change:transform,opacity}.is-entering{opacity:0;transform:translate(4%) scale(.985)}.is-entering-back{opacity:0;transform:translate(-4%) scale(.985)}.is-leaving{opacity:0;transform:translate(-3%) scale(.99);pointer-events:none}.is-leaving-back{opacity:0;transform:translate(3%) scale(.99);pointer-events:none}.title{flex-direction:row;align-items:center;justify-content:center;gap:clamp(20px,calc(var(--stage-w) * .05),64px);text-align:left;padding:calc(var(--safe-t) + 16px) calc(var(--safe-r) + 28px) calc(var(--safe-b) + 16px) calc(var(--safe-l) + 28px);cursor:pointer}.title__mark-col{display:flex;flex-direction:column;align-items:center;flex:none}.title__mark{font-size:clamp(46px,calc(var(--stage-h) * .3),92px);color:var(--surface);text-shadow:0 2px 0 #0000002e,0 14px 34px #00000059;animation:settle .9s var(--ease-out) backwards;line-height:1}.title__latin{margin-top:10px;font-size:12px;font-weight:600;letter-spacing:.5em;text-indent:.5em;color:var(--accent);animation:settle .9s 90ms var(--ease-out) backwards}.title__body{display:flex;flex-direction:column;align-items:flex-start;gap:16px;max-width:38ch}.title__tag{font-size:clamp(13px,calc(var(--stage-w) * .016),15px);line-height:1.55;color:#ffffff96;animation:settle .9s .18s var(--ease-out) backwards}.title__start{animation:settle .9s .28s var(--ease-out) backwards}.title__beads{animation:settle .9s .36s var(--ease-out) backwards}@keyframes settle{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}.title__foot{font-size:11px;color:#ffffff42;letter-spacing:.06em}.loading{align-items:center;justify-content:center;gap:18px}.loading__beads{display:flex;gap:7px}.loading__bead{width:15px;height:15px;border-radius:50%;background:#ffffff14;box-shadow:inset 0 0 0 1px #ffffff1f;transition:background .38s var(--ease-spring),transform .38s var(--ease-spring)}.loading__bead.is-on{background:radial-gradient(70% 70% at 32% 26%,#ffffff8c 0%,transparent 58%),linear-gradient(165deg,var(--c) 0%,color-mix(in oklab,var(--c) 74%,#000) 100%);transform:scale(1.14)}.loading__label{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:#ffffff5c}.play{display:flex;flex-direction:column}.hud{display:flex;align-items:center;gap:12px;padding:max(var(--safe-t),6px) max(var(--safe-r),14px) 4px max(var(--safe-l),14px);min-height:42px;color:#ffffffd6}.hud__title{font-family:var(--font-display);font-variation-settings:"SOFT" 40,"WONK" 1,"opsz" 24;font-size:16px;font-weight:600;letter-spacing:.01em}.hud__sub{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#ffffff63}.hud__btn{display:inline-flex;align-items:center;gap:6px;padding:7px 13px;border-radius:999px;background:#ffffff12;box-shadow:inset 0 0 0 1px #ffffff1f;color:#ffffffd6;font-size:12.5px;font-weight:600;transition:background .14s var(--ease-out),transform .12s var(--ease-spring)}.hud__btn:active{transform:scale(.95);background:#ffffff1f}.phrase{display:flex;align-items:center;justify-content:center;gap:6px;min-height:34px;padding-inline:14px;overflow:hidden}.phrase__empty{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:#ffffff3d}.bead--playing{animation:bead-strike .42s var(--ease-out)}@keyframes bead-strike{0%{transform:scale(1);filter:brightness(1)}22%{transform:scale(1.45);filter:brightness(1.7)}to{transform:scale(1);filter:brightness(1)}}.home__head{display:flex;align-items:center;gap:10px;margin-bottom:12px}.home__mark{font-family:var(--font-display);font-variation-settings:"SOFT" 60,"WONK" 1,"opsz" 48;font-size:26px;color:var(--surface);line-height:1}.home__cols{flex:1;min-height:0;display:grid;grid-template-columns:1.5fr 1fr;gap:20px}.home__col{display:flex;flex-direction:column;min-height:0;gap:8px}.home__newmatch{display:flex;gap:8px;align-items:center}.field{flex:1;min-width:0;padding:10px 13px;border-radius:var(--radius-sm);background:#ffffff0f;box-shadow:inset 0 0 0 1px #ffffff1f;color:#fff;font-size:14px;outline:none;transition:box-shadow .16s var(--ease-out),background .16s var(--ease-out)}.field::placeholder{color:#ffffff40}.field:focus{background:#ffffff17;box-shadow:inset 0 0 0 1.5px color-mix(in oklab,var(--accent) 70%,transparent)}.match-row{display:flex;align-items:center;gap:12px;width:100%;padding:11px 14px;margin-bottom:7px;border-radius:var(--radius);background:#ffffff0d;box-shadow:inset 0 0 0 1px #ffffff14;text-align:left;transition:background .15s var(--ease-out),transform .13s var(--ease-spring)}.match-row:active{transform:scale(.985);background:#ffffff17}.match-row.is-yours{background:#ffffff14;box-shadow:inset 0 0 0 1px color-mix(in oklab,var(--accent) 50%,transparent),0 0 22px -8px color-mix(in oklab,var(--accent) 60%,transparent)}.match-row.is-done{opacity:.5}.match-row__main{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}.match-row__name{font-weight:700;font-size:14px;color:#ffffffe6}.match-row__state{font-size:11.5px;color:#ffffff7a}.match-row.is-yours .match-row__state{color:var(--accent)}.match-row__right{display:flex;align-items:center;gap:10px;flex:none}.match-row__beads{opacity:.7}.match-row__hp{font-size:11px;color:#ffffff6b;font-variant-numeric:tabular-nums;min-width:46px;text-align:right}.tile{display:flex;flex-direction:column;gap:2px;padding:13px 15px;border-radius:var(--radius);text-align:left;background:linear-gradient(168deg,var(--surface-hi),var(--surface));box-shadow:var(--lift-2),inset 0 1px #fff,inset 0 0 0 1px var(--edge);color:var(--ink);transition:transform .13s var(--ease-spring),box-shadow .13s var(--ease-out)}.tile:active{transform:translateY(2px) scale(.99);box-shadow:var(--lift-1)}.tile__title{font-family:var(--font-display);font-variation-settings:"SOFT" 40,"WONK" 1;font-size:16px;font-weight:600}.tile__sub{font-size:11.5px;color:var(--ink-soft)}.tile--quiet{background:#ffffff0d;box-shadow:inset 0 0 0 1px #ffffff17;color:#ffffffdb}.tile--quiet .tile__sub{color:#ffffff70}.home__flash{position:absolute;left:50%;bottom:calc(var(--safe-b) + 14px);transform:translate(-50%,12px);padding:9px 16px;border-radius:999px;background:#2b1108e6;color:#ffd9a8;font-size:13px;opacity:0;transition:opacity .26s var(--ease-out),transform .26s var(--ease-out);pointer-events:none}.home__flash.is-showing{opacity:1;transform:translate(-50%)}.match__body{padding-block:8px}.match__sequence{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px}.match__nothing{font-size:13px}.match__health{display:flex;flex-direction:column;gap:4px;min-width:120px}.hp{display:flex;align-items:center;gap:7px}.hp__name{font-size:10.5px;color:#ffffff70;width:42px;text-align:right}.hp__track{flex:1;height:5px;border-radius:999px;background:#ffffff17;overflow:hidden}.hp__fill{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,color-mix(in oklab,var(--accent) 70%,#000),var(--accent));transition:width .7s var(--ease-out)}.hp--you .hp__name{color:var(--accent)}.round-card{display:flex;align-items:center;gap:10px;padding:8px 12px;margin-bottom:5px;border-radius:var(--radius-sm);background:#ffffff0a;font-size:12px;color:#ffffff9c}.round-card__n{width:18px;color:#ffffff4d;font-variant-numeric:tabular-nums}.round-card__verdict{flex:1}.round-card__scores{font-variant-numeric:tabular-nums}.round-card__dmg{color:#ffffff5c;font-variant-numeric:tabular-nums;min-width:40px;text-align:right}.round-card.is-win .round-card__verdict{color:var(--glow)}.match__cta{position:absolute;right:calc(var(--safe-r) + 20px);bottom:calc(var(--safe-b) + 14px);display:flex;align-items:center;gap:12px}.match__waiting{font-size:13px;color:#ffffff7a}.match__verdict{font-family:var(--font-display);font-variation-settings:"SOFT" 50,"WONK" 1;font-size:20px}.match__verdict.is-win{color:var(--glow)}.match__verdict.is-loss{color:#ffffff8a}.match__loading{padding:40px;text-align:center}.auth__card{max-width:44ch;text-align:left}.auth__title{font-size:21px;margin-top:2px}.auth__blurb{font-size:13px;line-height:1.5;margin-top:6px}.field-row{display:flex;align-items:center;gap:10px;margin-top:10px}.field-label{width:46px;font-size:12px;font-weight:700;color:var(--ink-soft)}.field-row .field{background:#ffffff8f;box-shadow:inset 0 0 0 1px var(--edge);color:var(--ink)}.field-row .field::placeholder{color:#00000038}.auth__error{min-height:16px;margin-top:8px;font-size:12.5px;color:#a13b23}.auth__actions{display:flex;gap:10px;margin-top:12px;align-items:center}.auth__note{font-size:11.5px;margin-top:10px}.auth.has-error .auth__card{animation:shake .34s var(--ease-out)}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-5px)}45%{transform:translate(4px)}70%{transform:translate(-2px)}}.packs__list{display:flex;flex-direction:column;gap:9px;padding-block:6px}.pack-card{display:flex;align-items:center;gap:14px;padding:12px 14px;border-radius:var(--radius);background:color-mix(in oklab,var(--pack-surface) 92%,transparent);box-shadow:var(--lift-2),inset 0 1px #ffffffb3;color:var(--pack-ink);text-align:left;transition:transform .15s var(--ease-spring),box-shadow .15s var(--ease-out)}.pack-card:active{transform:scale(.99) translateY(2px)}.pack-card.is-current{box-shadow:var(--lift-3),inset 0 1px #fff,0 0 0 2px var(--pack-accent)}.pack-card.is-loading{opacity:.6}.pack-card__swatches{display:flex;flex:none;border-radius:7px;overflow:hidden;box-shadow:0 1px 4px #0004}.pack-card__swatches span{width:13px;height:42px}.pack-card__text{display:flex;flex-direction:column;gap:1px;min-width:0}.pack-card__name{font-family:var(--font-display);font-variation-settings:"SOFT" 44,"WONK" 1;font-size:17px;font-weight:600}.pack-card__scale{font-size:11px;letter-spacing:.14em;text-transform:uppercase;opacity:.6}.pack-card__blurb{font-size:12.5px;margin-top:3px;opacity:.85}.pack-card__credit{font-size:10.5px;margin-top:4px;opacity:.5;line-height:1.4}.calibrate__inner{max-width:46ch;display:flex;flex-direction:column;align-items:center;gap:10px}.calibrate__title{font-size:22px}.calibrate__blurb{font-size:13px;line-height:1.55;color:#ffffff8f}.calibrate__pulse{width:74px;height:74px;border-radius:50%;background:#ffffff14;box-shadow:inset 0 0 0 1px #ffffff2e;margin-top:4px}.calibrate__pulse.is-beating{animation:cal-beat .38s var(--ease-out)}@keyframes cal-beat{0%{transform:scale(1);background:var(--accent);box-shadow:0 0 34px var(--glow)}to{transform:scale(1);background:#ffffff14;box-shadow:inset 0 0 0 1px #ffffff2e}}.calibrate__reading{font-size:13px;color:#ffffffb8;font-variant-numeric:tabular-nums;min-height:20px}.calibrate__actions{display:flex;gap:10px;margin-top:6px;flex-wrap:wrap;justify-content:center}.toast{position:absolute;left:50%;bottom:calc(var(--safe-b) + 20px);transform:translate(-50%,14px);padding:10px 18px;border-radius:999px;background:#1c0d06f0;color:var(--surface);font-size:13px;opacity:0;transition:opacity .3s var(--ease-out),transform .3s var(--ease-out);z-index:60;pointer-events:none;max-width:80%;text-align:center}.toast.is-showing{opacity:1;transform:translate(-50%)}.howto__body{padding-block:10px}.howto__cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(175px,1fr));gap:12px;align-items:start}.howto__card{font-size:12.5px;line-height:1.55}.howto__h{font-size:17px;margin:2px 0 6px}.howto__card p+p{margin-top:8px}.howto__aside{padding-top:8px;border-top:1px solid var(--edge);color:var(--ink-soft);font-size:11.5px}.howto__demo{display:flex;align-items:center;gap:10px;margin-top:10px;flex-wrap:wrap}.howto__grow{display:flex;flex-direction:column;gap:6px;margin-top:10px}.howto__grow-row{opacity:.9}.perform .phrase{overflow-x:auto;overscroll-behavior:contain;justify-content:flex-start;scrollbar-width:none;padding-block:4px}.perform .phrase::-webkit-scrollbar{display:none}.bead--ghost{opacity:.24;filter:saturate(.4);transition:opacity .2s var(--ease-out),filter .2s var(--ease-out)}.perform__count{font-size:12px;letter-spacing:.08em;color:#ffffff70;font-variant-numeric:tabular-nums}.countin{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-variation-settings:"SOFT" 60,"WONK" 1,"opsz" 144;font-size:76px;color:#ffffff1f;pointer-events:none;z-index:5}.countin.is-beating{animation:count-pulse .42s var(--ease-out)}@keyframes count-pulse{0%{transform:scale(.82);color:#fff0}18%{transform:scale(1.04);color:#ffffff4d}to{transform:scale(1);color:#ffffff14}}.perform.is-recording .keyboard:before{content:"";position:absolute;inset-inline:0;top:0;height:2px;background:linear-gradient(90deg,transparent,var(--accent),transparent);animation:rec-breathe 2.4s var(--ease-in-out) infinite;z-index:4}@keyframes rec-breathe{0%,to{opacity:.35}50%{opacity:1}}.perform.is-armed .hud__sub{color:var(--accent)}.results{display:flex;flex-direction:row;gap:22px;align-items:stretch}.results__head{flex:none;width:clamp(180px,calc(var(--stage-w) * .28),280px);display:flex;flex-direction:column;justify-content:center}.results__score{display:flex;align-items:baseline;gap:8px;margin-top:2px}.results__points{font-family:var(--font-display);font-variation-settings:"SOFT" 50,"WONK" 1,"opsz" 144;font-size:clamp(46px,calc(var(--stage-h) * .22),76px);line-height:1;color:var(--surface);font-variant-numeric:tabular-nums;transition:text-shadow .5s var(--ease-out)}.results__points.is-settled{text-shadow:0 0 30px color-mix(in oklab,var(--glow) 55%,transparent)}.outcome-win .results__points{color:var(--glow)}.outcome-loss .results__points{color:#ffffffb8}.results__max{font-size:13px;color:#ffffff4d}.results__perfect{margin-top:6px;font-family:var(--font-display);font-variation-settings:"SOFT" 60,"WONK" 1;font-size:19px;color:var(--glow);animation:settle .7s .7s var(--ease-spring) backwards}.results__subtitle{margin-top:8px;font-size:13px;line-height:1.5;color:#ffffff9c;max-width:28ch}.results__body{padding-right:6px;display:flex;flex-direction:column;justify-content:center}.results__beads{flex-wrap:wrap;margin-bottom:14px;opacity:.8;align-self:flex-start}.results__actions{position:absolute;right:calc(var(--safe-r) + 20px);bottom:calc(var(--safe-b) + 14px);display:flex;gap:10px}.timing{--centre: 74px;display:flex;flex-direction:column;gap:3px;align-self:flex-start}.timing__scale{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:8px;width:calc(var(--centre) * 2);margin-bottom:4px}.timing__scale-label{font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:#ffffff3d}.timing__scale-label:first-child{text-align:right}.timing__scale-line{width:1px;height:9px;background:#fff3}.timing__rows{display:flex;flex-direction:column;gap:3px}.timing__row{position:relative;display:flex;align-items:center;height:22px;animation:settle .38s var(--ease-out) backwards}.timing__row:before{content:"";position:absolute;left:var(--centre);top:0;bottom:0;width:1px;background:#ffffff1a}.timing__ref{position:absolute;left:var(--centre);width:13px;height:13px;margin-left:-6.5px;border-radius:50%;border:1.5px solid color-mix(in oklab,var(--c, #fff) 70%,#fff);opacity:.55}.timing__mine{position:absolute;left:var(--centre);width:13px;height:13px;margin-left:-6.5px;border-radius:50%;background:radial-gradient(70% 70% at 32% 26%,#ffffff8c 0%,transparent 58%),var(--c, #fff);box-shadow:0 1px 3px #0007;transform:translate(var(--dx, 0));transition:transform .46s var(--ease-spring)}.timing__label{position:absolute;left:calc(var(--centre) + 56px);font-size:11.5px;color:#ffffff70;white-space:nowrap;font-variant-numeric:tabular-nums}.timing__row--missing .timing__mine{display:none}.timing__row--missing .timing__ref{border-style:dashed;opacity:.8}.timing__row--missing .timing__label{color:#ffffff8a}.timing__row--extra .timing__ref{display:none}.timing__row--extra .timing__mine{opacity:.6}.timing__row--anchor .timing__mine{opacity:.4}.timing__row--anchor .timing__label{color:#ffffff45;font-style:italic}.timing__row--wrong-pitch .timing__mine{box-shadow:0 0 0 2px #ffffff4d,0 1px 3px #0007}.timing__legend{margin-top:12px;font-size:12px;line-height:1.5;max-width:46ch}.keyboard{position:relative;display:flex;flex:1;min-height:0;gap:6px;padding-inline:max(var(--safe-l),10px) max(var(--safe-r),10px);padding-bottom:max(var(--safe-b),8px);padding-top:6px}.key{position:relative;flex:1 1 0;min-width:0;border-radius:var(--radius) var(--radius) calc(var(--radius) * .7) calc(var(--radius) * .7);overflow:hidden;isolation:isolate;background:linear-gradient(180deg,#ffffff26,#fff0 22%,#0000 70%,#0000002e),linear-gradient(175deg,var(--c) 0%,color-mix(in oklab,var(--c) 82%,#000) 100%);box-shadow:inset 0 1px #ffffff30,inset 0 -2px 6px #00000038,var(--lift-2);transition:transform .15s var(--ease-out),filter .15s var(--ease-out);touch-action:none;will-change:transform}.key.is-struck{transform:translateY(3px) scaleY(.985);filter:brightness(1.32) saturate(1.06);transition-duration:22ms}.key.is-lit{filter:brightness(1.45) saturate(1.1);transition-duration:30ms}.key.is-lit:after,.key.is-struck:after{opacity:.9}.key:after{content:"";position:absolute;inset:0;background:radial-gradient(120% 55% at 50% 100%,var(--glow) 0%,transparent 70%);opacity:0;transition:opacity .42s var(--ease-out);pointer-events:none;mix-blend-mode:screen}.keyboard.is-idle .key{filter:saturate(.72) brightness(.78)}.keyboard.is-idle .key.is-lit{filter:brightness(1.45) saturate(1.1)}.key__label{position:absolute;inset-inline:0;bottom:10px;text-align:center;font-family:var(--font-ui);font-size:11px;letter-spacing:.14em;color:#ffffff40;pointer-events:none;transition:color .2s var(--ease-out)}.key.is-struck .key__label,.key.is-lit .key__label{color:#ffffff9e}.tine-ripple{position:absolute;inset-inline:8%;bottom:0;height:40%;border-radius:50% 50% 0 0;background:radial-gradient(60% 100% at 50% 100%,var(--glow) 0%,transparent 72%);opacity:.75;pointer-events:none;mix-blend-mode:screen;animation:tine-ripple .56s var(--ease-out) forwards}@keyframes tine-ripple{0%{transform:translateY(12%) scaleY(.5);opacity:.8}to{transform:translateY(-140%) scaleY(1.9);opacity:0}}.tine-mote{position:absolute;width:5px;height:5px;border-radius:50%;background:var(--glow);opacity:.85;pointer-events:none;filter:blur(.4px);animation:tine-mote var(--dur, .9s) var(--ease-out) forwards}@keyframes tine-mote{0%{transform:translate(0) scale(1);opacity:.85}to{transform:translate(var(--dx, 0),var(--dy, -90px)) scale(.2);opacity:0}}@media(prefers-reduced-motion:reduce){.tine-ripple,.tine-mote{display:none}}.screen-pad{padding:calc(var(--safe-t) + 14px) calc(var(--safe-r) + 20px) calc(var(--safe-b) + 14px) calc(var(--safe-l) + 20px)}.center{align-items:center;justify-content:center;text-align:center}.scroller{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:#ffffff2e transparent}.scroller::-webkit-scrollbar{width:5px}.scroller::-webkit-scrollbar-thumb{background:#ffffff2e;border-radius:999px}.notice{max-width:46ch;text-align:left}.notice__title{font-size:21px;margin-top:4px}.notice__detail{margin-top:8px;font-size:13.5px;line-height:1.5;word-break:break-word}.notice__actions{display:flex;gap:10px;margin-top:16px;flex-wrap:wrap}.empty{display:flex;flex-direction:column;align-items:center;gap:12px;padding:30px 20px;text-align:center}.empty__ghost{display:flex;gap:6px;opacity:.26}.empty__ghost .bead{filter:saturate(.25)}.empty__title{font-family:var(--font-display);font-variation-settings:"SOFT" 40,"WONK" 1,"opsz" 28;font-size:18px;color:#ffffffcf}.empty__body{font-size:13px;line-height:1.55;max-width:34ch;color:#ffffff7a}