:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg:#d6d3bd;--ink:#111;--muted:#6f6d5e;--card:#efeee6;--accent:#00f0ff;--radius:22px}*{box-sizing:border-box;margin:0;padding:0}html,body{background:var(--bg);width:100%;min-height:100%;color:var(--ink);font-family:Archivo,Helvetica Neue,Arial,sans-serif}body{overflow-x:hidden}a{color:inherit}#app{flex-direction:column;min-height:100vh;display:flex}.topbar{justify-content:space-between;align-items:center;gap:24px;padding:22px clamp(20px,5vw,64px);display:flex}.topbar__logo{align-items:center;text-decoration:none;display:flex}.topbar__logo img{width:auto;height:46px;display:block}.topbar__links{gap:26px;display:flex}.topbar__links a{font-size:15px;font-weight:600;text-decoration:none}.topbar__links a:hover,.topbar__links a.is-active{text-underline-offset:5px;text-decoration:underline;text-decoration-thickness:2px}.rooms{flex-direction:column;flex:1;width:100%;max-width:760px;margin:0 auto;padding:clamp(20px,5vh,48px) clamp(20px,5vw,32px) 72px;display:flex}.rooms__header{text-align:center;margin-bottom:32px}.rooms__kicker{letter-spacing:2.5px;text-transform:uppercase;color:#0091a6;margin-bottom:8px;font-size:11px;font-weight:700;display:inline-block}.rooms__title{letter-spacing:-1.5px;font-size:clamp(38px,8vw,58px);font-weight:900;line-height:1}.rooms__subtitle{color:var(--muted);margin-top:12px;font-size:15px;font-weight:500}.rooms__stack{flex-direction:column;gap:20px;display:flex}.rooms--wide{max-width:min(1600px,96vw)}.lobby__columns{grid-template-columns:minmax(0,1fr) minmax(260px,320px);align-items:start;gap:24px;display:grid}.lobby__col{flex-direction:column;gap:20px;min-width:0;display:flex;container-type:inline-size}.lobby__columns--solo{grid-template-columns:1fr}@media (width<=820px){.lobby__columns{grid-template-columns:1fr}}.panel{border:2.5px solid var(--ink);border-radius:var(--radius);background:var(--card);padding:24px}.panel__title{letter-spacing:1.5px;text-transform:uppercase;color:var(--ink);margin-bottom:16px;font-size:13px;font-weight:800}.panel__row{align-items:center;gap:10px;display:flex}.panel__label{letter-spacing:1px;text-transform:uppercase;color:var(--muted);margin:18px 0 10px;font-size:12px;font-weight:700}.panel__label:first-of-type{margin-top:0}.input{min-width:0;color:var(--ink);font:inherit;background:#fff;border:2px solid #11111180;border-radius:12px;flex:1;padding:13px 14px;font-weight:600}.input::placeholder{color:#11111159;font-weight:500}.input:focus{border-color:var(--ink);outline:none;box-shadow:0 0 0 3px #00f0ff59}.input--code{text-transform:uppercase;letter-spacing:6px;text-align:center;font-weight:800}.btn{border:2px solid var(--ink);color:var(--ink);font:inherit;letter-spacing:1px;text-transform:uppercase;cursor:pointer;background:0 0;border-radius:999px;padding:13px 20px;font-size:13px;font-weight:700;transition:background .15s,color .15s,transform .12s}.btn:hover:not(:disabled){background:var(--ink);color:var(--card)}.btn:active:not(:disabled){transform:translateY(1px)}.btn:disabled{opacity:.35;cursor:default}.btn--primary{width:100%;color:var(--card);background:var(--ink);border-color:var(--ink);margin-top:20px;padding:16px 20px;font-size:14px;font-weight:800}.btn--primary:hover:not(:disabled){background:var(--accent);color:var(--ink);border-color:var(--ink)}.btn--island{color:#e8e4d8;border-color:var(--ink);background:linear-gradient(#1a1c20 0%,#3a0d0a 100%);width:100%;margin-top:12px;padding:16px 20px;font-size:14px;font-weight:800}.btn--island:hover:not(:disabled){color:#ff3b30;background:linear-gradient(#3a0d0a 0%,#1a1c20 100%)}.choices{flex-wrap:wrap;gap:10px;display:flex}.choice{color:var(--ink);font:inherit;cursor:pointer;background:0 0;border:1.6px dashed #1111118c;border-radius:999px;padding:9px 18px;font-size:13px;font-weight:600;transition:border-color .15s,background .15s,color .15s}.choice:hover{border-style:solid}.choice.is-active{color:var(--card);border:1.6px solid var(--ink);background:var(--ink)}.playlist{grid-template-columns:repeat(auto-fill,minmax(128px,1fr));gap:12px;display:grid}.playlist__item{--game-accent:#00f0ff;color:var(--ink);font:inherit;cursor:pointer;background:#fff;border:2px solid #1113;border-radius:14px;flex-direction:column;gap:7px;padding:7px;transition:border-color .15s,transform .14s,box-shadow .15s;display:flex}.playlist__item:hover{border-color:var(--ink);box-shadow:0 8px 0 -4px var(--ink);transform:translateY(-3px)}.playlist__item.is-picked{border-color:var(--ink);box-shadow:0 0 0 2.5px var(--ink)}.playlist__item.is-disabled{opacity:.4;pointer-events:none}.playlist__cover{aspect-ratio:1;background:radial-gradient(120% 100% at 80% 15%, color-mix(in srgb, var(--game-accent) 75%, #fff), transparent 60%), linear-gradient(150deg, color-mix(in srgb, var(--game-accent) 55%, #111), #111);border-radius:9px;position:relative;overflow:hidden}.playlist__cover img{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.playlist__item.is-picked .playlist__cover:after{content:"";background:#1116;position:absolute;inset:0}.playlist__name{letter-spacing:-.2px;text-align:center;white-space:nowrap;text-overflow:ellipsis;font-size:12.5px;font-weight:700;overflow:hidden}.playlist__order{z-index:2;border:3px solid var(--card);background:var(--ink);min-width:38px;height:38px;color:var(--card);border-radius:999px;justify-content:center;align-items:center;font-size:17px;font-weight:800;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 4px 14px #00000073}.playlist-head{justify-content:space-between;align-items:center;gap:12px;display:flex}.playlist-clear{border:2px solid var(--ink);color:var(--ink);cursor:pointer;background:0 0;border-radius:999px;flex-shrink:0;padding:6px 12px;font-size:12px;font-weight:700}.playlist-clear:hover{background:var(--ink);color:var(--card)}.playlist-search{width:100%;margin-bottom:12px;display:block}.playlist-cats{margin-bottom:14px}@media (width<=480px){.playlist{grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px}}.hint{color:var(--muted);margin-top:12px;font-size:12px;font-weight:500;line-height:1.55}.error{color:#c81d4a;min-height:1em;margin-top:12px;font-size:12.5px;font-weight:600}.lobby__code{letter-spacing:clamp(4px,2.5cqi,10px);white-space:nowrap;text-align:center;color:var(--ink);background:repeating-linear-gradient(-45deg,#00f0ff0f 0 14px,#0000 14px 28px);border:2.5px dashed #1116;border-radius:16px;margin:4px 0 16px;padding:18px 10px;font-size:clamp(26px,12cqi,58px);font-weight:900}.lobby__players{flex-direction:column;gap:8px;list-style:none;display:flex}.lobby__player{background:#fff;border:2px solid #11111124;border-radius:12px;align-items:center;gap:12px;padding:12px 14px;font-size:15px;font-weight:600;display:flex}.lobby__dot{background:#b9b6a3;border-radius:50%;flex-shrink:0;width:10px;height:10px}.lobby__dot.is-online{background:#16c65f;box-shadow:0 0 10px #16c65fb3}.lobby__host-tag{letter-spacing:1.5px;text-transform:uppercase;color:var(--card);background:#d9843f;border-radius:6px;margin-left:auto;padding:4px 8px;font-size:10px;font-weight:800}.lobby__kick{letter-spacing:1px;text-transform:uppercase;color:#c81d4a;cursor:pointer;background:0 0;border:2px solid #c81d4a;border-radius:8px;flex-shrink:0;margin-left:auto;padding:5px 10px;font-family:inherit;font-size:10px;font-weight:800;transition:background .15s,color .15s}.lobby__kick:hover{color:var(--card);background:#c81d4a}.lobby__kick:disabled{opacity:.5;cursor:default}.lobby__settings{color:var(--muted);text-align:center;font-size:13px;font-weight:500;line-height:1.7}.lobby__waiting{text-align:center;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted);margin-top:18px;font-size:12px;font-weight:700}.lobby__leave{width:100%;margin-top:14px}.browse{flex-direction:column;gap:10px;margin:0;padding:0;list-style:none;display:flex}.browse__row{border:2px dashed var(--ink);background:var(--card);border-radius:12px;align-items:center;gap:12px;padding:12px 14px;display:flex}.browse__info{flex-direction:column;gap:3px;min-width:0;display:flex}.browse__host{text-overflow:ellipsis;white-space:nowrap;font-size:15px;font-weight:800;overflow:hidden}.browse__meta{color:var(--muted);font-size:12px;font-weight:600}.browse__join{flex-shrink:0;width:auto;margin-top:0;margin-left:auto;padding:8px 18px;font-size:12px}