@font-face{font-family:Fredoka Variable;font-style:normal;font-display:swap;font-weight:300 700;src:url(/assets/fredoka-hebrew-wght-normal-DdnsCkLr.woff2)format("woff2-variations");unicode-range:U+307-308,U+590-5FF,U+200C-2010,U+20AA,U+25CC,U+FB1D-FB4F}@font-face{font-family:Fredoka Variable;font-style:normal;font-display:swap;font-weight:300 700;src:url(/assets/fredoka-latin-ext-wght-normal-CYrqKuxd.woff2)format("woff2-variations");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,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:Fredoka Variable;font-style:normal;font-display:swap;font-weight:300 700;src:url(/assets/fredoka-latin-wght-normal-DM6njrJ3.woff2)format("woff2-variations");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;--bg:#f8f8f3;--surface:#fff;--surface-2:#eceff2;--ink:#14161a;--muted:#4a505a;--line:#14161a;--shadow-c:#14161a;--on-fill:#14161a;--btn:#fff;--hover-tint:#000;--hover-amt:12%;--hover-amt-fill:12%;--btn-line:#14161a;--primary:#6f9bff;--accent:#ff7b6e;--success:#5fdc94;--warn:#ffd93d;--pink:#ff9bcf;--focus:#0b2fff;--disabled-bg:#e3e6ea;--disabled-ink:#5a606a;--cell:#fff;--board:#eceff2;--ttt-x:#d42f21;--ttt-o:#1f4fe0;--ttt-win:#ffd93d;--frame:#c3c9cf;--frame-edge:#8d959e;--tex-grid:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40'%3E%3Cpath d='M40 0H0V40' fill='none' stroke='%23d5dee5' stroke-width='1'/%3E%3C/svg%3E");--tex-smudge:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='720' height='720'%3E%3Cg fill='%23000' opacity='.035'%3E%3Cellipse cx='120' cy='140' rx='90' ry='34' transform='rotate(-18 120 140)'/%3E%3Cellipse cx='520' cy='420' rx='110' ry='30' transform='rotate(12 520 420)'/%3E%3Cellipse cx='300' cy='620' rx='70' ry='26'/%3E%3C/g%3E%3Cg fill='none' stroke-linecap='round' stroke-width='5' opacity='.09'%3E%3Cpath d='M420 90q40-30 80 0t80 0' stroke='%232f6bff'/%3E%3Cpath d='M60 400q30 40 60 0t60 0' stroke='%23e5412f'/%3E%3Cpath d='M560 640l50-40m-50 0l50 40' stroke='%23199a5a'/%3E%3C/g%3E%3C/svg%3E");--radius:1.25rem;--offset:.3rem;--focus-w:3px;--focus-gap:-2px;--font:"Fredoka Variable", "Fredoka", ui-rounded, "SF Pro Rounded", "Nunito", "Segoe UI", system-ui, -apple-system, sans-serif;--frame-w:.7rem;--float-gap:.6rem;--bar-h:3.25rem;--float-edge:calc(var(--frame-w) + var(--float-gap));--float-below:calc(var(--float-edge) + var(--bar-h) + var(--float-gap))}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial;--bg:#1f2b27;--surface:#2b3a35;--surface-2:#364842;--ink:#f3f0e6;--muted:#c3cbc5;--line:#f3f0e6;--shadow-c:#060908;--btn:#cdc9ba;--hover-tint:#fff;--hover-amt:14%;--hover-amt-fill:28%;--btn-line:#060908;--primary:#7aa4ff;--accent:#ff8a7d;--success:#6be3a0;--warn:#ffdf5c;--pink:#ffa6d5;--focus:#ffe14d;--disabled-bg:#34443e;--disabled-ink:#aab4ae;--cell:#2b3a35;--board:#364842;--ttt-x:#ff8a7d;--ttt-o:#8db1ff;--frame:#7b5535;--frame-edge:#4a311c;--tex-grid:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40'%3E%3Cpath d='M40 0H0V40' fill='none' stroke='%23ffffff' stroke-opacity='.07' stroke-width='1'/%3E%3C/svg%3E");--tex-smudge:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='720' height='720'%3E%3Cg fill='%23fff' opacity='.04'%3E%3Cellipse cx='120' cy='140' rx='90' ry='34' transform='rotate(-18 120 140)'/%3E%3Cellipse cx='520' cy='420' rx='110' ry='30' transform='rotate(12 520 420)'/%3E%3Cellipse cx='300' cy='620' rx='70' ry='26'/%3E%3C/g%3E%3Cg fill='none' stroke='%23fff' stroke-linecap='round' stroke-width='5' opacity='.08'%3E%3Cpath d='M420 90q40-30 80 0t80 0'/%3E%3Cpath d='M60 400q30 40 60 0t60 0'/%3E%3Cpath d='M560 640l50-40m-50 0l50 40'/%3E%3C/g%3E%3C/svg%3E")}}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{min-height:100vh;color:var(--ink);font-family:var(--font);background-color:var(--bg);background-image:var(--tex-smudge), var(--tex-grid);background-attachment:fixed;margin:0;font-weight:500;line-height:1.45}body:before{content:"";z-index:20;pointer-events:none;border:var(--frame-w) solid var(--frame);box-shadow:inset 0 0 0 3px var(--frame-edge);position:fixed;inset:0}h1,h2,h3,p{margin:0}h1,h2,h3{font-weight:700}button,input{font:inherit;color:inherit}button,a[href],summary,[role=radio],label.switch{cursor:pointer}button:disabled,label.switch.disabled{cursor:not-allowed}:focus-visible,.input:focus{outline:var(--focus-w) solid var(--focus);outline-offset:var(--focus-gap)}.sr-only{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.muted{color:var(--muted)}.small{font-size:.85rem}.center{text-align:center}.icon{flex:none}.shell{gap:1.25rem;max-width:72rem;margin:0 auto;padding:1.25rem 1.5rem 1.5rem;display:grid}.center-screen{align-content:center;justify-items:center;min-height:100vh}.card{background:var(--surface);border:3px solid var(--line);border-radius:var(--radius);box-shadow:calc(var(--offset) * 1.5) calc(var(--offset) * 1.5) 0 var(--shadow-c);align-content:start;gap:.9rem;min-width:0;padding:1.1rem;display:grid}.card-title{align-items:center;gap:.5rem;font-size:1.25rem;display:flex}.card-subtitle{color:var(--muted);align-items:center;gap:.35rem;margin-top:.25rem;font-size:.9rem;display:flex}.count{background:var(--warn);color:var(--on-fill);border:2px solid var(--btn-line);border-radius:999px;padding:0 .55rem;font-size:.85rem}.btn,.room-item,.game-card,.identity-name,.switch-track{--fill:var(--btn);--hover-fill:color-mix(in srgb, var(--fill), var(--hover-tint) var(--hover-amt));background:var(--fill)}.btn{--hover-fill:color-mix(in srgb, var(--fill), var(--hover-tint) var(--hover-amt-fill));border:3px solid var(--btn-line);min-height:2.6rem;color:var(--on-fill);box-shadow:var(--offset) var(--offset) 0 var(--shadow-c);border-radius:999px;justify-content:center;align-items:center;gap:.45rem;padding:.45rem 1.1rem;font-weight:600;transition:box-shadow .12s,background-color .12s;display:inline-flex}.btn:hover:not(:disabled),.btn:focus-visible:not(:disabled){background:var(--hover-fill);box-shadow:calc(var(--offset) * 1.7) calc(var(--offset) * 1.7) 0 var(--shadow-c)}.btn:active:not(:disabled){box-shadow:.1rem .1rem 0 var(--shadow-c)}.btn:disabled{background:var(--disabled-bg);color:var(--disabled-ink);box-shadow:none;border-style:dashed}.btn-primary{--fill:var(--primary)}.btn-success{--fill:var(--success)}.btn-danger{--fill:var(--accent)}.btn-ghost{--fill:transparent;--hover-fill:color-mix(in srgb, var(--surface-2), var(--hover-tint) var(--hover-amt));color:var(--ink);box-shadow:none;border-color:#0000}.btn-ghost:hover:not(:disabled),.btn-ghost:focus-visible:not(:disabled){border-color:var(--line);box-shadow:var(--offset) var(--offset) 0 var(--shadow-c)}.btn-ghost:active:not(:disabled){box-shadow:.1rem .1rem 0 var(--shadow-c)}.btn-ghost:disabled{background:0 0;border-color:#0000}.btn-icon{flex:none;width:2.6rem;padding:0}.btn-big{min-height:3.4rem;padding:.6rem 1.7rem;font-size:1.2rem}.btn-small{min-height:2.2rem;padding:.2rem .9rem}.btn-tiny{text-transform:lowercase;--offset:.2rem;min-height:1.9rem;padding:.1rem .75rem;font-size:.85rem}.input{border:3px solid var(--line);background:var(--surface);width:100%;min-height:2.6rem;box-shadow:.2rem .2rem 0 var(--shadow-c);border-radius:1rem;padding:.4rem .9rem;transition:box-shadow .12s}.input::placeholder{color:var(--muted);opacity:1}.input:hover{box-shadow:.3rem .3rem 0 var(--shadow-c)}.input:focus{box-shadow:.4rem .4rem 0 var(--shadow-c)}.switch{cursor:pointer;flex-wrap:wrap;align-items:center;gap:.5rem;font-weight:600;display:inline-flex}.switch.disabled{cursor:not-allowed}.switch.disabled .switch-track{border-style:dashed}.switch input{opacity:0;width:1px;height:1px;position:absolute}.switch-track{border:3px solid var(--line);width:3rem;height:1.7rem;box-shadow:.15rem .15rem 0 var(--shadow-c);--fill:var(--surface-2);border-radius:999px;flex:none;transition:background-color .12s,box-shadow .12s;position:relative}.switch:not(.disabled):hover .switch-track{background:var(--hover-fill);box-shadow:.25rem .25rem 0 var(--shadow-c)}.switch-track:after{content:"";background:var(--line);border-radius:50%;width:1rem;height:1rem;transition:transform .15s;position:absolute;top:.15rem;left:.15rem}.switch input:checked+.switch-track{--fill:var(--success)}.switch input:checked+.switch-track:after{background:var(--on-fill);transform:translate(1.3rem)}.switch input:focus-visible+.switch-track{outline:var(--focus-w) solid var(--focus);outline-offset:var(--focus-gap)}.landing{padding-top:clamp(1.5rem,6vw,4rem)}.hero{text-align:center;justify-items:center;gap:.75rem;padding-bottom:1rem;display:grid}.logo{letter-spacing:-.03em;font-size:clamp(3rem,12vw,5.5rem);font-weight:700;line-height:1}.logo span,.brand span{background:var(--warn);color:var(--on-fill);border:3px solid var(--btn-line);box-shadow:.07em .07em 0 var(--shadow-c);border-radius:.45em;margin-left:.08em;padding:0 .15em;display:inline-block;rotate:-3deg}.tagline{color:var(--muted);text-wrap:balance;max-width:24rem;font-size:1.15rem}.landing-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,20rem),1fr));align-items:start;gap:1.5rem;display:grid}@media (width>=44rem){.landing-grid>:first-child{rotate:-.6deg}.landing-grid>:nth-child(2){rotate:.5deg}}.create .btn-big{width:100%}.divider{color:var(--muted);align-items:center;gap:.75rem;font-size:.9rem;display:flex}.divider:before,.divider:after{content:"";border-top:3px dashed var(--line);flex:1;height:0}.join-form{gap:.75rem;display:flex}.code-input{text-transform:uppercase;letter-spacing:.25em;text-align:center;font-weight:700}.room-list{gap:.75rem;margin:0;padding:0;list-style:none;display:grid}.room-item{text-align:left;border:3px solid var(--line);width:100%;box-shadow:.2rem .2rem 0 var(--shadow-c);--fill:var(--surface-2);border-radius:1rem;align-items:center;gap:.75rem;padding:.6rem .9rem;transition:box-shadow .12s,background-color .12s;animation:.3s ease-out slide-in;display:flex}.room-item:hover,.room-item:focus-visible{background:var(--hover-fill);box-shadow:.4rem .4rem 0 var(--shadow-c)}.room-item:active{box-shadow:.1rem .1rem 0 var(--shadow-c)}.room-item-code{letter-spacing:.12em;font-weight:700}.room-item-main{flex:1;min-width:0;display:grid}.room-item-main strong{text-transform:lowercase;text-overflow:ellipsis;white-space:nowrap;font-weight:600;overflow:hidden}.empty-list{padding:.5rem 0}.room-code{background:var(--surface);border:3px dashed var(--line);border-radius:999px;align-items:baseline;gap:.5rem;padding:.25rem .9rem;display:inline-flex}.room-code strong{letter-spacing:.2em;font-size:1.3rem;font-weight:700}.banner{border:3px solid var(--line);background:var(--surface);box-shadow:var(--offset) var(--offset) 0 var(--shadow-c);border-radius:1rem;flex-wrap:wrap;align-items:center;gap:.75rem;padding:.7rem 1rem;font-weight:600;animation:.25s ease-out slide-in;display:flex}.banner-warn{background:var(--warn);color:var(--on-fill);border-color:var(--btn-line)}.spinner{border:3px solid var(--surface-2);border-top-color:var(--ink);border-radius:50%;width:1rem;height:1rem;animation:.8s linear infinite spin}.toasts{z-index:30;pointer-events:none;gap:.75rem;width:min(26rem,100% - 3rem);display:grid;position:fixed;bottom:1.5rem;left:50%;transform:translate(-50%)}.toast{background:var(--ink);color:var(--bg);border:3px solid var(--btn-line);box-shadow:var(--offset) var(--offset) 0 var(--shadow-c);border-radius:1rem;padding:.7rem 1rem;font-weight:600;animation:.3s ease-out pop}.room-grid{grid-template-columns:minmax(0,1fr);align-items:start;gap:1.5rem;display:grid}@media (width>=56rem){.room-grid{grid-template-columns:minmax(0,1fr) 22rem}.room-side{position:sticky;top:1.5rem}}.room-main,.room-side{gap:1.5rem;min-width:0;display:grid}.stage{min-height:20rem}.results{justify-items:center;gap:.4rem;display:grid}.results h3{text-transform:lowercase;font-size:1rem}.results ol{flex-wrap:wrap;justify-content:center;gap:.4rem;margin:0;padding:0;list-style:none;display:flex}.results li{border:3px solid var(--line);background:var(--surface);border-radius:999px;padding:.2rem .8rem}.results li.win{background:var(--success);color:var(--on-fill,#14161a)}.stage-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.5rem;display:flex}.stage .card-title,.game-name{text-transform:lowercase}.game-grid{grid-template-columns:repeat(auto-fill,minmax(11rem,1fr));gap:1rem;display:grid}.game-card{text-align:left;--fill:var(--surface-2);border:3px solid var(--line);box-shadow:.2rem .2rem 0 var(--shadow-c);border-radius:1rem;gap:.15rem;padding:.9rem 1rem;transition:box-shadow .12s,background-color .12s;display:grid;position:relative}.game-card:hover:not(:disabled),.game-card:focus-visible:not(:disabled){background:var(--hover-fill);box-shadow:.4rem .4rem 0 var(--shadow-c)}.game-card:active:not(:disabled){box-shadow:.1rem .1rem 0 var(--shadow-c)}.game-card.on{--fill:var(--primary);color:var(--on-fill);border-color:var(--btn-line);box-shadow:.4rem .4rem 0 var(--shadow-c)}.game-card.on .muted{color:#20242c}.game-card.on:after{content:"✓" / "";font-weight:700;position:absolute;top:.4rem;right:.7rem}.game-card:disabled{cursor:default}.game-name{font-size:1.1rem;font-weight:700}.pill{border:3px solid var(--btn-line);background:var(--btn);color:var(--on-fill);box-shadow:.2rem .2rem 0 var(--shadow-c);border-radius:999px;padding:.2rem .9rem;font-weight:600}.wip-badge{text-transform:lowercase;background:var(--warn);color:var(--on-fill);border:2px solid var(--btn-line);border-radius:999px;justify-self:start;padding:0 .5rem;font-size:.75rem;font-weight:700}.game-card.on .wip-badge{background:var(--surface);color:var(--ink)}.lobby-actions{flex-wrap:wrap;align-items:center;gap:1rem;display:flex}.start-reason{text-transform:lowercase;flex-basis:100%}.waiting{border:3px dashed var(--line);color:var(--ink);text-transform:lowercase;border-radius:1rem;padding:.75rem 1rem;font-weight:600}.identity{background:var(--surface);border:3px solid var(--line);border-radius:var(--radius);box-shadow:calc(var(--offset) * 1.5) calc(var(--offset) * 1.5) 0 var(--shadow-c);align-items:center;gap:.5rem;padding:.5rem .6rem .5rem 1rem;display:flex}.identity-label{color:var(--muted);font-size:.85rem}.identity-name{--fill:transparent;--hover-fill:color-mix(in srgb, var(--surface-2), var(--hover-tint) var(--hover-amt));text-align:left;text-transform:lowercase;border:3px solid #0000;border-radius:.7rem;flex:1;align-items:center;gap:.4rem;min-width:0;padding:.15rem .4rem;font-weight:700;transition:box-shadow .12s,background-color .12s;display:inline-flex;overflow:hidden}.identity-name:hover,.identity-name:focus-visible{background:var(--hover-fill);border-color:var(--line);box-shadow:.2rem .2rem 0 var(--shadow-c)}.identity-input{flex:1;min-height:2.3rem}.players{gap:.4rem;margin:0;padding:0;list-style:none;display:grid}.player{border-radius:.9rem;flex-wrap:wrap;align-items:center;gap:.6rem;padding:.3rem .4rem;transition:opacity .3s;animation:.3s ease-out pop;display:flex}.player.offline .avatar,.player.offline .player-name{opacity:.75}.player-actions{flex-wrap:wrap;flex-basis:100%;gap:.5rem;padding:.1rem 0 .35rem 2.9rem;display:flex}.seat-menu{border:3px dashed var(--line);border-radius:1rem;flex-wrap:wrap;flex-basis:100%;gap:.5rem;padding:.5rem;display:flex}.player.offline .avatar{border-style:dashed}.player-name{text-transform:lowercase;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;font-weight:600;overflow:hidden}.player-tags{align-items:center;gap:.3rem;display:inline-flex}.avatar{border:3px solid var(--btn-line);border-radius:50%;flex:none;place-items:center;width:2.3rem;height:2.3rem;font-weight:700;display:grid}.tag{border:2px solid var(--btn-line);background:var(--surface-2);color:var(--on-fill);border-radius:999px;align-items:center;padding:0 .55rem;font-size:.8rem;font-weight:600;display:inline-flex}.tag-host{background:var(--warn);padding:.1rem .4rem}.tag-bot{background:var(--success)}.tag-you{background:var(--primary)}.tag-off{background:var(--accent)}.chat{grid-template-rows:auto 1fr auto}.chat-log{scroll-behavior:smooth;overscroll-behavior:contain;flex-direction:column;gap:.5rem;height:16rem;padding:.25rem .5rem .4rem .25rem;display:flex;overflow-y:auto}.chat-empty{margin:auto}.msg{background:var(--surface-2);border:3px solid var(--line);overflow-wrap:anywhere;border-radius:.4rem 1rem 1rem;align-self:flex-start;gap:.05rem;max-width:92%;padding:.4rem .75rem;animation:.2s ease-out slide-in;display:grid}.msg.mine{background:var(--primary);color:var(--on-fill);border-color:var(--btn-line);border-radius:1rem .4rem 1rem 1rem;align-self:flex-end}.msg-name{color:var(--muted);text-transform:lowercase;font-size:.8rem;font-weight:600}.msg.mine .msg-name{color:#20242c}.chat-form{gap:.75rem;display:flex}body:has(.shell.is-wide){overflow:hidden}.shell.is-wide{--side-w:21rem;--chrome-tr:calc(var(--bar-h) + var(--float-gap));--chrome-r:0px;max-width:none;padding:0;display:block}.shell.is-wide.side-open{--chrome-r:calc(var(--side-w) + var(--float-gap))}.shell.is-wide .room-grid,.shell.is-wide .room-main{display:contents}.shell.is-wide .stage-fill{inset:var(--frame-w);z-index:0;flex-direction:column;min-height:0;display:flex;position:fixed}.stage-fill>.stage-body{flex-direction:column;flex:auto;min-height:0;display:flex}.stage-fill>.stage-body>*{flex:auto;min-height:0}.stage-fill>.stage-note{margin:auto}.stage-results,.shell.is-wide .room-side .card{background:var(--surface);border:3px solid var(--line);box-shadow:.2rem .2rem 0 var(--shadow-c);border-radius:1rem}.drawer-toggle{--offset:.2rem;z-index:10;top:var(--float-edge);right:var(--float-edge);width:var(--bar-h);height:var(--bar-h);border-radius:50%;position:fixed}.drawer-toggle[aria-expanded=true]{--fill:var(--primary)}.drawer-badge{background:var(--accent);min-width:1.5rem;height:1.5rem;color:var(--on-fill);border:2px solid var(--btn-line);border-radius:999px;place-items:center;padding:0 .3rem;font-size:.8rem;font-weight:700;line-height:1;display:grid;position:absolute;top:-.5rem;right:-.5rem}.shell.is-wide .room-side{--pad:1rem;z-index:10;top:calc(var(--float-below) - var(--pad));right:calc(var(--float-edge) - var(--pad));bottom:calc(var(--float-edge) - var(--pad));width:calc(var(--side-w) + var(--pad) * 2);padding:var(--pad);gap:var(--float-gap);overscroll-behavior:contain;scrollbar-width:thin;pointer-events:none;flex-direction:column;display:flex;position:fixed;overflow-y:auto}.shell.is-wide .room-side>*{pointer-events:auto;flex:none}.shell.is-wide:not(.side-open) .room-side{visibility:hidden}.shell.is-wide .room-side .card{gap:.7rem;padding:.9rem}.shell.is-wide .room-side .chat{flex:1 1 0;grid-template-rows:auto minmax(0,1fr) auto;align-content:stretch;min-height:14rem}.shell.is-wide .room-side .chat-log{height:auto;min-height:0}.shell.is-wide .banner{z-index:10;top:var(--float-below);max-width:calc(100% - var(--float-edge) * 2);position:fixed;left:50%;translate:-50%}body:has(.shell.is-wide) .toasts{top:var(--float-below);bottom:auto}.stage-results{z-index:5;top:calc(var(--float-below) - var(--frame-w));left:calc((100% - var(--chrome-r,0px)) / 2);max-width:min(36rem, calc(100% - var(--chrome-r,0px) - 2rem));justify-items:center;gap:.6rem;padding:.7rem 1rem;display:grid;position:absolute;translate:-50%}@media (width<=39.99rem){.shell.is-wide.side-open{--chrome-r:0px}.shell.is-wide .room-side{left:calc(var(--float-edge) - var(--pad));width:auto}}.empty{text-align:center;justify-items:center;max-width:28rem;padding:2rem;rotate:-.5deg}.empty-art{width:5rem;height:5rem;color:var(--on-fill);background:var(--warn);border:3px solid var(--btn-line);box-shadow:.3rem .3rem 0 var(--shadow-c);border-radius:1.5rem;place-items:center;font-size:3rem;font-weight:700;display:grid;rotate:-6deg}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pop{0%{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}@keyframes slide-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}@media (width<=30rem){:root{--frame-w:.45rem}.shell{padding:1rem 1rem 1.25rem}.chat-log{height:12rem}.join-form{gap:.5rem}.card{padding:.9rem}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}.dialog{max-width:min(36rem,100% - 2rem);max-height:calc(100vh - 3rem);color:var(--ink);background:var(--surface);border:3px solid var(--line);border-radius:var(--radius);box-shadow:calc(var(--offset) * 1.5) calc(var(--offset) * 1.5) 0 var(--shadow-c);padding:0;overflow:auto}.dialog::backdrop{background:#0000008c}.dialog-body{gap:.8rem;padding:1.2rem;display:grid}.kbd{font:inherit;background:var(--surface-2);border:2px solid var(--line);box-shadow:.1rem .1rem 0 var(--shadow-c);border-radius:.5rem;padding:0 .5rem;font-size:.85rem;font-weight:600;display:inline-block}.room-panel{gap:.7rem;display:grid}.room-panel-head{flex-wrap:wrap;align-items:center;gap:.6rem;display:flex}.room-panel-actions{flex-wrap:wrap;align-items:center;gap:.8rem 1rem;display:flex}.room-panel-game{text-transform:lowercase;border-top:2px dotted var(--line);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.6rem;padding-top:.6rem;display:flex}.profile-name{gap:.4rem;display:grid}.profile-name-row{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.profile-name-row .input{flex:10rem}.dialog h4{text-transform:lowercase;margin:0;font-size:1.05rem}.profile-name p{margin:0}.profile-flag{border:0;gap:.5rem;min-width:0;margin:.6rem 0 0;padding:0;display:grid}.profile-flag legend{text-transform:lowercase;padding:0;font-weight:700}.profile-opt{border:2px solid var(--line);cursor:pointer;border-radius:.9rem;align-items:flex-start;gap:.7rem;min-height:2.75rem;padding:.4rem .6rem;display:flex}.profile-opt:has(input:checked){background:var(--surface-2);box-shadow:.15rem .15rem 0 var(--shadow-c)}.profile-opt input{flex:none;width:1.4rem;height:1.4rem;margin:.15rem 0 0}.profile-opt>span{display:grid}.profile-opt-name{font-weight:600}.shell:not(.is-wide) .room-grid{margin-top:calc(var(--bar-h,3.25rem) + .4rem)}.shell:not(.is-wide):not(.side-open) .room-side{display:none}.shell:not(.is-wide):not(.side-open) .room-grid{grid-template-columns:minmax(0,1fr)}.room-panel-head{align-items:center;gap:.5rem;display:flex}.room-name{text-transform:lowercase;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;font-size:1.1rem;overflow:hidden}.room-code{min-height:2.2rem;color:var(--ink);background:var(--surface);border:3px dashed var(--line);border-radius:999px;flex:none;align-items:center;gap:.4rem;padding:.1rem .7rem;display:inline-flex}.room-code strong{letter-spacing:.16em;font-size:1.05rem}.room-code:hover,.room-code:focus-visible{background:var(--surface-2)}.room-game{text-transform:lowercase;flex-wrap:wrap;align-items:center;gap:.5rem;margin:0;display:flex}.chat-head{justify-content:space-between;align-items:center;gap:.5rem;display:flex}.player-name-btn{color:inherit;font:inherit;text-align:left;background:0 0;border:0;padding:0;font-weight:600}.player-name-btn:hover,.player-name-btn:focus-visible{text-decoration:underline}.mini-profile{align-items:center;gap:.8rem;display:flex}.mini-profile h3{text-transform:lowercase;margin:0}.mini-profile p{margin:0}a:focus-visible,.player-name-btn:focus-visible{outline-offset:2px}.latency{z-index:1000;justify-items:end;gap:.4rem;display:grid;position:fixed;top:2px;right:.6rem}.latency-pill{border:2px solid var(--line);background:var(--surface);min-height:1.3rem;color:var(--ink);box-shadow:.12rem .12rem 0 var(--shadow-c);cursor:pointer;border-radius:999px;padding:0 .6rem;font:600 .72rem/1.2rem inherit}.latency-pill:hover,.latency-pill:focus-visible{background:var(--surface-2)}.latency-panel{background:var(--surface);width:min(30rem,100vw - 1.2rem);max-height:70vh;color:var(--ink);border:3px solid var(--line);box-shadow:.3rem .3rem 0 var(--shadow-c);border-radius:1rem;padding:.7rem .9rem;overflow:auto}.latency-panel p{margin:0 0 .5rem}.latency-panel table{border-collapse:collapse;font-variant-numeric:tabular-nums;width:100%;font-size:.8rem}.latency-panel th,.latency-panel td{text-align:right;white-space:nowrap;padding:.2rem .4rem}.latency-panel th[scope=row],.latency-panel th[scope=col]:first-child{text-align:left;white-space:normal;font-weight:600}.latency-panel tbody tr:nth-child(odd){background:var(--surface-2)}.latency-actions{justify-content:flex-end;gap:.5rem;margin-top:.6rem;display:flex}[data-speed=slow]{-webkit-text-decoration:underline dotted;text-decoration:underline dotted}[data-speed=bad]{font-weight:800;-webkit-text-decoration:underline wavy;text-decoration:underline wavy}