:root{--bg:#15131f;--surface:#211e30;--surface-2:#2c2840;--text:#f4f1ff;--muted:#a49fbd;--accent:#ffd43b;--accent-ink:#2a2200;--ok:#51cf66;--danger:#ff6b6b;--radius:14px;color:var(--text);background:var(--bg);font-family:Fredoka,system-ui,sans-serif}*{box-sizing:border-box}body{background:radial-gradient(circle at 20% 0%, #2b2347 0, var(--bg) 55%) fixed;min-height:100vh;margin:0}h1,h2,h3{margin:0 0 .5em;line-height:1.15}h3{color:var(--muted);text-transform:uppercase;letter-spacing:.06em;margin-top:1.2em;font-size:1rem}input,select,button{font:inherit;color:inherit}input,select{background:var(--surface-2);border:2px solid #0000;border-radius:10px;outline:none;min-width:0;padding:.6em .8em}input:focus,select:focus{border-color:var(--accent)}.muted{color:var(--muted)}.small{font-size:.85rem}.center{text-align:center}.error{color:var(--danger)}.hint{color:var(--muted);margin:.4em 0 1em;font-size:.8rem}.row{flex-wrap:wrap;align-items:center;gap:.5rem;margin:.6rem 0;display:flex}.field{flex-direction:column;gap:.35em;margin-bottom:.8rem;display:flex}.field span{color:var(--muted);font-size:.85rem}.btn{cursor:pointer;background:var(--surface-2);border:0;border-radius:999px;padding:.6em 1.2em;font-weight:600;transition:transform 80ms,filter .15s}.btn:hover:not(:disabled){filter:brightness(1.15)}.btn:active:not(:disabled){transform:scale(.97)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn--primary{background:var(--accent);color:var(--accent-ink)}.btn--ghost{box-shadow:inset 0 0 0 2px var(--surface-2);background:0 0}.btn--active{background:var(--accent);color:var(--accent-ink)}.btn--ok{background:var(--ok);color:#0d2a12}.btn--danger{background:var(--danger);color:#2a0b0b}.btn--wide{width:100%;padding:.8em;font-size:1.05rem}.btn--small{padding:.35em .9em;font-size:.85rem}.btn--icon{width:2.6rem;height:2.6rem;padding:0;font-size:1.15rem}.btn--off{background:var(--danger)}.link{color:var(--muted);cursor:pointer;background:0 0;border:0;padding:.2em .4em;text-decoration:underline}.center-screen{flex-direction:column;justify-content:center;align-items:center;min-height:100vh;padding:1rem;display:flex}.panel{background:var(--surface);border-radius:var(--radius);width:100%;padding:1.25rem}.panel__head{color:var(--muted);justify-content:space-between;margin-bottom:.75rem;display:flex}.home__hero{text-align:center;margin-bottom:1.5rem}.home__hero h1{font-size:clamp(2rem,6vw,3.2rem)}.home__logo{width:96px;margin:0 auto 1rem;font-size:.9rem;transform:rotate(-6deg)}.home__panel{max-width:380px}.divider{text-align:center;color:var(--muted);margin:1rem 0 .25rem;font-size:.85rem}.code-input{text-transform:uppercase;letter-spacing:.3em;text-align:center;flex:1;font-weight:700}.room{flex-direction:column;min-height:100vh;display:flex}.room__bar{align-items:center;gap:1rem;padding:.6rem 1rem;display:flex}.room__code{text-align:center;letter-spacing:.05em;flex:1}.room__code strong{color:var(--accent);letter-spacing:.2em}.room__controls{gap:.4rem;display:flex}.room__main{flex:1;grid-template-columns:1fr 360px;align-items:start;gap:1rem;padding:0 1rem 1rem;display:grid}.room__side .panel{max-height:calc(100vh - 90px);overflow-y:auto}@media (width<=900px){.room__main{grid-template-columns:1fr}.room__side .panel{max-height:none}}.banner{color:#ffd8de;text-align:left;background:#4a2330;border:0;border-radius:10px;margin:0 1rem .6rem;padding:.5rem .9rem;font-size:.9rem}.banner--info{background:var(--surface);color:var(--muted)}.banner--action{cursor:pointer;background:var(--accent);color:var(--accent-ink);font-weight:600}.toast{background:var(--text);color:var(--bg);z-index:50;border-radius:999px;max-width:calc(100vw - 2rem);padding:.7em 1.2em;font-weight:600;position:fixed;bottom:1.5rem;left:50%;transform:translate(-50%);box-shadow:0 8px 30px #0006}.grid{grid-template-columns:repeat(2,1fr);gap:.75rem;display:grid}.grid--1{grid-template-columns:1fr}.grid--5,.grid--6{grid-template-columns:repeat(3,1fr)}@media (width<=600px){.grid,.grid--5,.grid--6{grid-template-columns:repeat(2,1fr)}.grid--1{grid-template-columns:1fr}}.tile{aspect-ratio:4/3;border-radius:var(--radius);background:var(--surface);transition:box-shadow .2s;position:relative;overflow:hidden;box-shadow:0 0 0 3px #0000}.tile--turn{box-shadow:0 0 0 4px var(--accent), 0 0 30px #ffd43b59}.tile--speaking:not(.tile--turn){box-shadow:0 0 0 3px var(--ok)}.tile--away{opacity:.55}.tile__video{object-fit:cover;width:100%;height:100%;display:block}.tile__video.mirrored{transform:scaleX(-1)}.tile__avatar{justify-content:center;align-items:flex-end;width:100%;height:100%;padding-bottom:12%;display:flex}.tile__avatar span{aspect-ratio:1;background:var(--player-color);width:34%;color:var(--bg);border-radius:50%;justify-content:center;align-items:center;font-size:clamp(1.5rem,5vw,3rem);font-weight:700;display:flex}.tile__tag{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-left:4px solid var(--player-color);background:#0000008c;border-radius:999px;align-items:center;gap:.4rem;padding:.25em .4em .25em .7em;font-size:.85rem;display:flex;position:absolute;bottom:.5rem;left:.5rem}.tile__score{background:var(--player-color);color:var(--bg);text-align:center;border-radius:999px;min-width:1.6em;padding:0 .4em;font-weight:700}.tile__badge{background:#0009;border-radius:999px;padding:.2em .7em;font-size:.8rem;font-weight:600;position:absolute;top:.5rem;left:.5rem}.tile__badge--ok{background:var(--ok);color:#0d2a12}.tile__badge--away{top:auto;bottom:2.6rem}.tile__actions{gap:.3rem;display:flex;position:absolute;bottom:.5rem;right:.5rem}.forehead{pointer-events:none;will-change:transform, width;z-index:2;position:absolute;top:0;left:0}.card{border-radius:.6em;width:100%;overflow:hidden;box-shadow:0 .3em .9em #00000073}.card--text{aspect-ratio:4/3;color:#2b2400;text-align:center;word-break:break-word;background:#fff3a8;border-bottom:.25em solid #f2d94e;justify-content:center;align-items:center;padding:.5em;font-size:1.7em;font-weight:700;line-height:1.1;display:flex}.card--image{background:#fff;padding:.35em .35em 0}.card--image img{aspect-ratio:1;object-fit:cover;border-radius:.35em;width:100%;display:block}.card__caption{color:#1d1a2b;text-align:center;-webkit-line-clamp:2;-webkit-box-orient:vertical;padding:.25em .2em .35em;font-size:1.2em;font-weight:700;line-height:1.1;display:-webkit-box;overflow:hidden}.card--hidden{aspect-ratio:4/3;color:var(--accent);background:#0b0a10;border:.15em solid #3b3655;justify-content:center;align-items:center;font-size:3.4em;font-weight:700;display:flex}.share{background:var(--surface-2);border-radius:10px;align-items:center;gap:.5rem;padding:.4rem .4rem .4rem .8rem;display:flex}.share code{text-overflow:ellipsis;white-space:nowrap;flex:1;font-size:.85rem;overflow:hidden}.players,.order,.scores{margin:.8rem 0;padding:0;list-style:none}.players li,.order li,.scores li{align-items:center;gap:.5rem;padding:.35rem 0;display:flex}.players .link{margin-left:auto;font-size:.8rem}.scores strong{margin-left:auto}.dot{border-radius:50%;flex:none;width:.7em;height:.7em}.order li.current{color:var(--accent);font-weight:700}.order li.done{color:var(--muted);text-decoration:line-through}.rules{color:var(--muted);padding-left:1.2rem;font-size:.9rem}.rules li{margin-bottom:.35em}.settings{grid-template-columns:1fr 1fr;gap:.6rem;margin:1rem 0;display:grid}.settings label{color:var(--muted);flex-direction:column;gap:.3em;font-size:.85rem;display:flex}.turn{background:var(--surface-2);border-radius:10px;padding:.8rem 1rem;font-size:1.05rem}.turn--me{background:var(--accent);color:var(--accent-ink)}.countdown{font-variant-numeric:tabular-nums}.countdown--low{color:var(--danger);font-weight:700}.picker h2 em{color:var(--accent);font-style:normal}.dropzone{border-radius:var(--radius);text-align:center;min-height:170px;color:var(--muted);cursor:pointer;border:2px dashed #4b4566;justify-content:center;align-items:center;padding:1rem;transition:border-color .15s,background .15s;display:flex}.dropzone:hover,.dropzone--over{border-color:var(--accent);background:#ffd43b0d}.picker__preview{width:160px;font-size:18px}.reveal{flex-direction:column;gap:.7rem;display:flex}.reveal__item{align-items:center;gap:.8rem;display:flex}.reveal__card{flex:none;width:84px;font-size:10px}