:root{--lightningcss-light: ;--lightningcss-dark:initial;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--color-bg:#1b1526;--color-bg-glow:#2b2142;--color-bg-deep:#150f20;--color-surface:#ffffff0e;--color-surface-2:#2f2745;--color-surface-3:#3a3154;--color-text:#f6efe6;--color-muted:#f6efe69e;--color-faint:#f6efe652;--color-accent:#ff6b8b;--color-accent-ink:#1b1526;--color-accent-press:#c2405f;--color-accent-2:#ffd166;--color-accent-2-ink:#1b1526;--color-accent-2-press:#c99a3c;--color-danger:#ff6b6b;--color-ok:#8ff0a4;--color-ok-bg:#5ed87a33;--color-bot:#d6c2ff;--color-bot-bg:#b58cff38;--color-tag:#ffffff1a;--color-notice:#ffd1662e;--color-band:#1b1526e0;--color-scrim:#1b15268c;--color-shadow:#00000061;--color-lane-ink:#fff;--speed-up-notice-ms:1.5s;--font-display:"Jua", system-ui, sans-serif;--font-body:"IBM Plex Sans KR", system-ui, -apple-system, sans-serif;--text-xs:12px;--text-sm:14px;--text-md:16px;--text-lg:18px;--text-xl:20px;--text-brand:48px;--text-code:40px;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;--space-6:32px;--space-card:18px;--control-h:52px;--control-h-sm:44px;--radius-sm:12px;--radius:16px;--radius-lg:24px;--radius-pill:999px;--shadow-press:0 4px 0 var(--color-shadow);--shadow-press-accent:0 4px 0 var(--color-accent-press);--shadow-press-accent-2:0 3px 0 var(--color-accent-2-press);--shadow-text:0 4px 0 var(--color-shadow);--grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.7 0'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)'/%3E%3C/svg%3E");--grain-opacity:.07;--loading-mark-sm:28px;--loading-mark-md:44px;--loading-mark-lg:72px;--loading-mark-cycle-ms:.9s;--board-dot:#f6efe638;--board-token:var(--color-accent-2);--board-token-ring:var(--color-bg);--board-halo:#1b1526e6;--board-danger:var(--color-danger);font-family:var(--font-body);color:var(--color-text)}html{overscroll-behavior:none;touch-action:none;height:100dvh;overflow:hidden}#root{height:100dvh;overflow:hidden}body{overscroll-behavior:none;touch-action:none;background-color:var(--color-bg);background-image:radial-gradient(130% 70% at 50% 0%, var(--color-bg-glow) 0%, var(--color-bg) 55%, var(--color-bg-deep) 100%);-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;height:100dvh;margin:0;overflow:hidden}.nickname-input,.code-cells .code-input{-webkit-user-select:text;user-select:text;-webkit-touch-callout:default}body:before{content:"";pointer-events:none;opacity:var(--grain-opacity);background-image:var(--grain);position:fixed;inset:0}.page{box-sizing:border-box;max-width:28rem;height:100dvh;padding:calc(var(--space-5) + env(safe-area-inset-top)) var(--space-4) calc(var(--space-6) + env(safe-area-inset-bottom));gap:var(--space-4);flex-direction:column;margin:0 auto;display:flex;position:relative}h1,h2{font-family:var(--font-display);margin:0;font-weight:400}h2{font-size:var(--text-xl)}.brand{font-size:var(--text-brand);color:var(--color-accent);transform-origin:0 100%;text-shadow:var(--shadow-text);align-self:flex-start;line-height:1;transform:rotate(-3deg)}.doodle{right:var(--space-2);top:calc(var(--space-3) + env(safe-area-inset-top));opacity:.16;pointer-events:none;position:absolute}.doodle-a{stroke:var(--color-accent)}.doodle-b{stroke:var(--color-ok)}.doodle-c{stroke:var(--color-accent-2)}.doodle-token{fill:var(--color-accent-2)}.tagline{font-family:var(--font-display);font-size:var(--text-lg);opacity:.92;white-space:pre-line;margin:0}.card{gap:var(--space-3);padding:var(--space-card);border-radius:var(--radius-lg);background:var(--color-surface);flex-direction:column;display:flex}.field{gap:var(--space-2);font-family:var(--font-display);color:var(--color-muted);flex-direction:column;display:flex}.label{font-family:var(--font-display);color:var(--color-muted)}fieldset{gap:var(--space-2);border:0;flex-direction:column;min-width:0;margin:0;padding:0;display:flex}legend{font-family:var(--font-display);color:var(--color-muted);padding:0}input,textarea{font-family:var(--font-body);font-size:var(--text-md);color:var(--color-text);box-sizing:border-box;width:100%;min-height:var(--control-h);padding:0 var(--space-4);border-radius:var(--radius);background:var(--color-surface-2);border:0;outline:none}textarea{min-height:0;padding:var(--space-3) var(--space-4);font-family:ui-monospace,monospace;font-size:var(--text-sm)}input:focus-visible,textarea:focus-visible{box-shadow:0 0 0 2px var(--color-accent)}input::placeholder,textarea::placeholder{color:var(--color-muted)}.locale-toggle{align-self:flex-start}.locale-toggle .seg{gap:var(--space-2);padding:var(--space-1);border-radius:var(--radius);background:var(--color-surface-2);display:flex}.locale-toggle .seg label{flex:1;position:relative}.locale-toggle .seg input{opacity:0;cursor:pointer;width:100%;min-height:0;margin:0;position:absolute;inset:0}.locale-toggle .seg span{min-height:30px;padding:0 var(--space-3);border-radius:var(--radius-sm);font-family:var(--font-display);font-size:var(--text-sm);color:var(--color-muted);justify-content:center;align-items:center;display:flex}.locale-toggle .seg input:checked+span{background:var(--color-accent-2);color:var(--color-accent-2-ink)}.locale-toggle .seg input:focus-visible+span{box-shadow:0 0 0 2px var(--color-accent)}button{font-family:var(--font-display);font-size:var(--text-lg);min-height:var(--control-h);padding:0 var(--space-5);border-radius:var(--radius-pill);background:var(--color-accent);color:var(--color-accent-ink);box-shadow:var(--shadow-press-accent);cursor:pointer;border:0;transition:transform 80ms,box-shadow 80ms}button:active:not(:disabled){box-shadow:0 1px 0 var(--color-accent-press);transform:translateY(3px)}button:focus-visible{outline:2px solid var(--color-text);outline-offset:2px}button:disabled{opacity:.5;cursor:not-allowed}button.secondary{background:var(--color-surface-3);color:var(--color-text);box-shadow:var(--shadow-press)}button.secondary:active:not(:disabled){box-shadow:0 1px 0 var(--color-shadow)}button.accent-2{background:var(--color-accent-2);color:var(--color-accent-2-ink);box-shadow:var(--shadow-press-accent-2)}button.accent-2:active:not(:disabled){box-shadow:0 1px 0 var(--color-accent-2-press)}button.tertiary{box-shadow:none;color:var(--color-muted);min-height:var(--control-h-sm);background:0 0}button.tertiary:active:not(:disabled){box-shadow:none}.notice,.banner{padding:var(--space-3) var(--space-4);border-radius:var(--radius);background:var(--color-notice)}.connecting-center{justify-content:center;align-items:center;gap:var(--space-4);text-align:center;flex-direction:column;flex:1;display:flex}.connecting-center .brand{transform-origin:bottom;align-self:center}.connecting-message{font-family:var(--font-display);font-size:var(--text-lg);white-space:nowrap;margin:0}.connecting-code{color:var(--color-accent-2);letter-spacing:.08em;font-style:normal}.connecting-actions{left:var(--space-4);right:var(--space-4);bottom:calc(var(--space-6) + env(safe-area-inset-bottom));gap:var(--space-3);text-align:center;flex-direction:column;display:flex;position:absolute}.loading-mark{vertical-align:middle;flex-shrink:0;display:inline-block}.loading-mark[data-size="28"]{width:calc(var(--loading-mark-sm) * 3 / 4);height:var(--loading-mark-sm)}.loading-mark[data-size="44"]{width:calc(var(--loading-mark-md) * 3 / 4);height:var(--loading-mark-md)}.loading-mark[data-size="72"]{width:calc(var(--loading-mark-lg) * 3 / 4);height:var(--loading-mark-lg)}.loading-mark-token{fill:var(--color-accent-2)}.loading-mark-token--animate{animation:loading-mark-move var(--loading-mark-cycle-ms) linear infinite}@keyframes loading-mark-move{0%{offset-distance:0%}90%,to{offset-distance:100%}}.loading-mark[data-stopped] .loading-mark-token{fill:var(--color-danger)}.btn-loading-mark{margin-right:var(--space-2)}.error{color:var(--color-danger);margin:0}.code-cells{gap:var(--space-3);flex-direction:column;display:flex}.code-cells-box{position:relative}.code-cells .code-input{color:#0000;caret-color:#0000;opacity:0;background:0 0;border-radius:0;height:100%;min-height:0;margin:0;padding:0;font-size:16px;position:absolute;inset:0}.code-cells .code-input:focus-visible{box-shadow:none}.code-cells .cells{gap:var(--space-2);justify-content:center;display:flex}.code-cells .cell{box-sizing:border-box;border-radius:var(--radius);background:var(--color-surface-2);width:62px;height:70px;font-family:var(--font-display);border:2px solid #0000;justify-content:center;align-items:center;font-size:36px;line-height:1;display:flex}.code-cells .cell.active{border-color:var(--color-accent)}.code-cells .cell.active:after{content:"";background:var(--color-text);width:2px;height:34px;animation:1s steps(2,start) infinite caret}.code-cells .cell.current{border-color:var(--color-accent)}.code-cells.invalid .cell{border-color:var(--color-danger)}.code-cells.invalid .cells{animation:.3s shake}@keyframes caret{to{visibility:hidden}}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-6px)}75%{transform:translate(6px)}}@media (prefers-reduced-motion:reduce){.code-cells.invalid .cells,.code-cells .cell.active:after,.landing-band{animation:none}.speed-up-band{animation:speed-up-fade var(--speed-up-notice-ms) ease forwards;left:0;right:0}.speed-up-band .multiplier,.speed-up-badge,.loading-mark-token--animate{animation:none}@keyframes speed-up-fade{0%,14%{opacity:0}15%,82%{opacity:1}to{opacity:0}}}.field-error{text-align:center;font-size:var(--text-sm);color:var(--color-danger);margin:0}.room-header{align-items:center;gap:var(--space-3);display:flex}.room-header .code{font-family:var(--font-display);font-size:var(--text-code);letter-spacing:.1em;color:var(--color-accent-2);flex:1;line-height:1}.room-header button{min-height:38px;padding:0 var(--space-3);font-size:var(--text-md)}.players{gap:var(--space-3);touch-action:manipulation;flex-direction:column;flex:1;min-height:0;margin:0;padding:0;list-style:none;display:flex;overflow-y:auto}.players li{align-items:center;gap:var(--space-2);display:flex}.players li .avatar{background:var(--color-surface-2);border-radius:50%;flex:none;justify-content:center;align-items:center;width:36px;height:36px;font-size:19px;line-height:1;display:flex}.players li .name{font-size:var(--text-md)}.players li.offline .name,.players li.offline .avatar{opacity:.4}.tag{font-size:var(--text-xs);border-radius:var(--radius-pill);background:var(--color-tag);color:var(--color-text);white-space:nowrap;padding:4px 9px;line-height:1}.tag.ready{background:var(--color-ok-bg);color:var(--color-ok)}.tag.bot{background:var(--color-bot-bg);color:var(--color-bot)}.tally{font-size:var(--text-xs);font-variant-numeric:tabular-nums;opacity:.7}.sr-only{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.players li button{min-height:30px;padding:0 var(--space-3);font-size:var(--text-sm);margin-left:auto}.ladder{position:relative}.board{touch-action:none;display:block}.countdown{font-family:var(--font-display);color:var(--color-accent-2);pointer-events:none;text-shadow:var(--shadow-text);place-items:center;font-size:6rem;display:grid;position:absolute;inset:0}.hint{font-size:var(--text-sm);color:var(--color-muted);text-align:center;margin:0}.landed{text-align:center;font-size:2rem}.result-center{justify-content:center;align-items:center;gap:var(--space-4);flex-direction:column;flex:1;min-height:0;display:flex}.landed-block{align-items:center;gap:var(--space-1);flex-direction:column;display:flex}.landed-block .avatar{font-size:44px;line-height:1}.landed-text{font-size:var(--text-sm);color:var(--color-muted)}.result .actions{gap:var(--space-4);flex-direction:column;margin-top:auto;display:flex}.tally-row{justify-content:center;gap:var(--space-2);touch-action:manipulation;flex-direction:column;width:100%;min-height:0;display:flex;overflow-y:auto}.tally-row h2{font-family:var(--font-body);font-size:var(--text-sm);color:var(--color-muted);text-align:center;flex:none;margin:0;font-weight:500}.rank-list{flex-direction:column;gap:3px;margin:0;padding:0;list-style:none;display:flex}.rank-list li{border-radius:var(--radius-sm);grid-template-columns:20px 34px 1fr auto;align-items:center;gap:10px;padding:5px 9px;display:grid}.rank-list li.lift{z-index:1;box-shadow:0 6px 18px var(--color-shadow);position:relative}.rank-list .rk{font-family:var(--font-display);font-size:var(--text-sm);color:var(--color-faint);text-align:right;font-variant-numeric:tabular-nums}.av-wrap{width:34px;height:34px}.av-slot{border-radius:var(--radius-pill);justify-content:center;align-items:center;width:34px;height:34px;font-size:19px;line-height:1;display:flex}.rank-list .nm{font-size:var(--text-sm);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.rank-list .nm.self-mark{color:var(--color-lane-ink);border-radius:var(--radius-pill);justify-self:start;max-width:100%;padding:2px 10px;display:inline-block}.rank-list .count{font-variant-numeric:tabular-nums;font-weight:600;font-size:var(--text-md);text-align:right;min-width:22px}.rank-list .count.zero{color:var(--color-faint);font-weight:400}.rank-list li.top .rk{color:var(--color-accent-2);font-size:var(--text-md)}.rank-list li.top .nm{font-size:15px;font-weight:600}.rank-list li.top .count{font-family:var(--font-display);color:var(--color-accent-2);font-size:25px}.page.play{max-width:none;padding:calc(var(--space-2) + env(safe-area-inset-top)) var(--space-2) calc(var(--space-2) + env(safe-area-inset-bottom));gap:var(--space-2)}.play .stage{gap:var(--space-2);aspect-ratio:.55;flex-direction:column;max-width:100%;height:100%;min-height:0;margin:0 auto;display:flex;position:relative}.play .notice,.play .banner{font-size:var(--text-sm);padding-top:.35rem;padding-bottom:.35rem}.play .ladder{flex:1;min-height:0}.play .board{width:100%;height:100%}.play button{min-height:var(--control-h-sm);padding:0 var(--space-4);font-size:var(--text-lg)}.play .stage[data-landed] .ladder:before{content:"";z-index:1;background:var(--color-scrim);position:fixed;inset:0}.landing-band{z-index:2;align-items:center;gap:var(--space-1);padding:var(--space-4) var(--space-3);background:var(--color-band);flex-direction:column;animation:.26s band-in;display:flex;position:fixed;top:50%;left:0;right:0;transform:translateY(-50%)}.landing-band .avatar{font-size:44px;line-height:1}.landing-band .name{font-family:var(--font-display);font-size:2rem;font-weight:400;line-height:1.2}@keyframes band-in{0%{opacity:0;transform:translateY(calc(16px - 50%))}to{opacity:1;transform:translateY(-50%)}}.speed-up-band{padding:var(--space-5) var(--space-3);background:repeating-linear-gradient(-45deg, color-mix(in srgb, var(--color-danger) 35%, transparent) 0 14px, transparent 14px 28px), var(--color-band);border-top:3px solid var(--color-danger);border-bottom:3px solid var(--color-danger);animation:speed-up-cross var(--speed-up-notice-ms) cubic-bezier(.2, .9, .3, 1) forwards;flex-direction:column;align-items:center;gap:0;display:flex;position:absolute;top:50%;transform:translateY(-50%)}@keyframes speed-up-cross{0%{opacity:0;left:-110%;right:110%}14%{opacity:1;left:0;right:0}82%{opacity:1;left:0;right:0}to{opacity:0;left:110%;right:-110%}}.speed-up-band .label{font-family:var(--font-display);letter-spacing:.04em;color:var(--color-accent-2);text-shadow:var(--shadow-text);font-size:40px;line-height:1.05}.speed-up-band .multiplier{font-family:var(--font-display);color:var(--color-accent-2);text-shadow:var(--shadow-text);font-size:72px;line-height:1;animation:.5s ease-in-out speed-up-pulse}@keyframes speed-up-pulse{50%{transform:scale(1.12)}}.speed-up-badge{font-family:var(--font-display);padding:var(--space-2) var(--space-3) 7px;border-radius:var(--radius-pill);background:var(--color-accent-2);color:var(--color-accent-2-ink);box-shadow:var(--shadow-press-accent-2);pointer-events:none;font-size:22px;line-height:1;animation:.26s cubic-bezier(.2,1.6,.4,1) speed-up-badge-in;position:absolute;top:10px;right:10px}@keyframes speed-up-badge-in{0%{opacity:0;transform:scale(.6)}to{opacity:1;transform:scale(1)}}.result-open{right:calc(var(--space-3) + env(safe-area-inset-right));bottom:calc(var(--space-3) + env(safe-area-inset-bottom));z-index:3;align-items:center;gap:var(--space-3);display:flex;position:fixed}@media (width<=480px){.room-header .code{font-size:1.75rem}.landed,.landing-band .name{font-size:1.6rem}}