.dg{--paper:#fdfaf3;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;flex-direction:column;gap:1rem;display:flex}.dg input{-webkit-user-select:text;user-select:text}.dg h2,.dg h3{margin:0}.dg h3{text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin-bottom:.6rem;font-size:.85rem}.dg button{touch-action:manipulation}.dg-phase{flex-direction:column;gap:.9rem;display:flex}.dg-card{border-radius:var(--radius);background:var(--surface);padding:1rem}.dg-hint{text-align:center;color:var(--muted);margin:0}.dg-progress{text-align:center;margin:0;font-size:.9rem}.dg-big{padding:1rem;font-size:1.1rem}.dg-end{align-self:center}.dg .dg-armed{color:#ff8787}.dg-phase-header{justify-content:space-between;align-items:center;gap:.75rem;display:flex}.dg-phase-header h2{font-size:1.3rem}.dg-timer{border-radius:var(--radius);background:var(--surface-2);text-align:center;font-variant-numeric:tabular-nums;flex:none;min-width:3rem;padding:.35rem .6rem;font-size:1.4rem;font-weight:800}.dg-timer.urgent{background:#c92a2a}.dg-canvas{aspect-ratio:1;border-radius:var(--radius);background:var(--paper);touch-action:none;cursor:crosshair;width:100%;display:block}.dg-canvas.locked{cursor:default;opacity:.85}.dg-toolbar{flex-direction:column;gap:.6rem;display:flex}.dg-swatches{grid-template-columns:repeat(7,1fr);gap:.3rem;display:grid}.dg-swatch{aspect-ratio:1;border:3px solid var(--surface-2);border-radius:50%;padding:0}.dg-swatch.on{border-color:var(--accent);transform:scale(1.12)}.dg-tools{gap:.4rem;display:flex}.dg-tools>button{flex:1;padding:.6rem .4rem}.dg-sizes{gap:.3rem;display:flex}.dg-size{border:2px solid #0000;place-items:center;width:2.75rem;height:2.75rem;padding:0;display:grid}.dg-size.on{border-color:var(--accent)}.dg-size span{border-radius:50%;display:block;box-shadow:0 0 0 1px #0006}.dg-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem;display:grid}.dg-art{aspect-ratio:1;border-radius:calc(var(--radius) - 4px);width:100%;display:block}.dg-entry{border-radius:var(--radius);background:var(--surface);text-align:center;border:3px solid #0000;flex-direction:column;gap:.4rem;min-width:0;margin:0;padding:.35rem;font-weight:500;display:flex}button.dg-entry:disabled{opacity:1}.dg-entry.own{opacity:.6}.dg-entry.picked,.dg-entry.winner{border-color:var(--accent)}.dg-entry-label{color:var(--muted);font-size:.85rem}.dg-entry.picked .dg-entry-label{color:var(--accent);font-weight:700}.dg-entry figcaption{flex-direction:column;align-items:center;gap:.2rem;font-size:.85rem;display:flex}.dg-entry figcaption .dg-avatar{font-size:1.1rem}.dg-votes{color:var(--muted)}.dg-scores{flex-direction:column;gap:.45rem;margin:0;padding:0;list-style:none;display:flex}.dg-scores li{align-items:center;gap:.6rem;display:flex}.dg-scores .dg-badge{flex:1}.dg-rank{width:1.4rem;color:var(--muted);text-align:center;font-weight:700}.dg-scores li.lead .dg-rank{color:var(--accent)}.dg-gain{color:#51cf66;font-size:.9rem;font-weight:700}.dg-points{text-align:right;min-width:2rem;font-size:1.2rem;font-weight:800}.dg-final{text-align:center}.dg-trophy{font-size:3.5rem;line-height:1.2}.dg-badge{align-items:center;gap:.45rem;min-width:0;display:inline-flex}.dg-badge.offline{opacity:.45}.dg-avatar{font-size:1.5rem;line-height:1}.dg-name{text-overflow:ellipsis;white-space:nowrap;font-weight:600;overflow:hidden}.dg-players{flex-direction:column;gap:.5rem;margin:0;padding:0;list-style:none;display:flex}.dg-players li{justify-content:space-between;align-items:center;gap:.5rem;display:flex}.dg-join{flex-direction:column;gap:1rem;display:flex}.dg-join h2{text-align:center}.dg-preview{align-self:center;font-size:4rem;line-height:1}.dg-avatars{grid-template-columns:repeat(5,1fr);gap:.4rem;display:grid}.dg-avatar-option{aspect-ratio:1;background:var(--surface);border:2px solid #0000;padding:0;font-size:1.7rem}.dg-avatar-option.taken{opacity:.4}.dg-avatar-option.on{border-color:var(--accent);background:var(--surface-2);opacity:1}.dg-pitch{text-align:center;color:var(--muted);margin:0;line-height:1.5}.dg-settings{flex-direction:column;gap:.9rem;display:flex}.dg-setting{flex-direction:column;gap:.4rem;font-size:.9rem;display:flex}.dg-chips{flex-wrap:wrap;gap:.35rem;display:flex}.dg-chip{border:2px solid #0000;padding:.45rem .75rem;font-size:.95rem}.dg-chip:disabled{opacity:.5}.dg-chip.on{border-color:var(--accent);color:var(--accent);opacity:1}.ft-story{text-align:center;color:var(--muted);margin:0;font-style:italic}.ft-tale{text-align:center;font-size:.85rem;font-weight:600;line-height:1.25;display:block}.ft-tale .dg-avatar{vertical-align:-.1em;margin-right:.3rem;font-size:1.1rem}.ft-by{max-width:100%;color:var(--muted);align-items:center;gap:.3rem;display:inline-flex}.ft-by .dg-avatar{font-size:1rem}:root{--bg:#12131a;--surface:#1c1e28;--surface-2:#262938;--text:#eef0f6;--muted:#8a8fa3;--x:#ff6b6b;--o:#4dabf7;--accent:#ffd43b;--radius:14px;color:var(--text);background:var(--bg);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}body{background:var(--bg);min-height:100dvh;margin:0}button,input{font:inherit;color:inherit}button{cursor:pointer;border-radius:var(--radius);background:var(--surface-2);border:0;padding:.7rem 1.1rem;font-weight:600}button:disabled{cursor:default;opacity:.45}button.primary{background:var(--accent);color:#1a1a1a}button.link{color:var(--muted);background:0 0;padding:.25rem 0;font-weight:500}input{border:2px solid var(--surface-2);border-radius:var(--radius);background:var(--surface);outline:none;width:100%;padding:.7rem .9rem}input:focus{border-color:var(--accent)}.muted{color:var(--muted)}.app{max-width:480px;margin:0 auto;padding:2rem 16px}.volume{z-index:10;flex-direction:column;align-items:flex-end;gap:8px;display:flex;position:fixed;bottom:16px;right:16px}.volume-toggle{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#e8e0d4d9;border-radius:50%;place-items:center;width:64px;height:64px;padding:0;display:grid;box-shadow:0 2px 6px #00000059}.volume-toggle:hover,.volume-toggle:focus-visible{outline:2px solid var(--accent);background:#f2ece2f2}.volume-toggle img{width:42px;height:auto;transition:rotate 80ms ease-out}.volume-toggle img.silent{opacity:.35}.volume-panel{color:#2b1d14;border:.5rem solid #0000;border-image:url(/assets/plain-Bey5zngV.png) 120 fill/1.6rem;flex-direction:column;gap:.6rem;padding:.8rem 1rem;font-size:.9rem;font-weight:600;display:flex}.volume-panel label{grid-template-columns:4.5rem 9rem;align-items:center;gap:.6rem;display:grid}.volume-panel input{appearance:none;cursor:pointer;background:url(/assets/slider-track-BQl0x0o_.png) 50%/100% 100% no-repeat;border:0;border-radius:0;width:9rem;height:27px;padding:0}.volume-panel input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.volume-panel input::-webkit-slider-runnable-track{background:0 0;height:100%}.volume-panel input::-moz-range-track{background:0 0}.volume-panel input::-webkit-slider-thumb{appearance:none;background:url(/assets/slider-thumb-DTZ0TP48.png) 50%/contain no-repeat;border:0;width:17px;height:32px;margin-top:-2.5px}.volume-panel input::-moz-range-thumb{background:url(/assets/slider-thumb-DTZ0TP48.png) 50%/contain no-repeat;border:0;border-radius:0;width:17px;height:32px}.landing{background:#000;position:fixed;inset:0}.landing-stage{opacity:0;width:min(100vw,177.778dvh);height:min(100dvh,56.25vw);margin:auto;transition:opacity .4s;position:absolute;inset:0;container-type:size}.landing-stage.ready{opacity:1}.landing-scene{position:absolute;inset:0}.landing-scene canvas{display:block}.landing-play{isolation:isolate;color:#fff8dc;letter-spacing:.08em;text-shadow:0 0 6px #ffd43be6,0 0 18px #ffa02899;background:0 0;border-radius:999px;padding:.6em 1.8em;font-size:1.6cqw;font-weight:800;animation:.2s ease-out .15s backwards fade-in;position:absolute;translate:-50% -50%}.landing-play:before{content:"";z-index:-1;border-radius:inherit;filter:blur(5px);background:repeating-linear-gradient(#00000038 0 1px,#0000 1px 3px),radial-gradient(#ffd650bf,#e6961e73);transition:opacity .15s;position:absolute;inset:0}.landing-play:hover,.landing-play:focus-visible{color:#fff;outline:none}.landing-play:hover:before,.landing-play:focus-visible:before{background:repeating-linear-gradient(#00000038 0 1px,#0000 1px 3px),radial-gradient(#ffe06ee6,#f0a52899)}.landing-play:active{translate:-50% calc(2px - 50%)}@keyframes fade-in{0%{opacity:0}}.spinner{border:3px solid #fff3;border-top-color:#e8e2d8;border-radius:50%;width:32px;height:32px;margin:-16px 0 0 -16px;animation:.8s linear infinite spin;position:absolute;top:50%;left:50%}@keyframes spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){.spinner{animation:1.6s ease-in-out infinite alternate fade}.landing-play{animation:none}}@keyframes fade{to{opacity:.3}}.visually-hidden{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.lobby,.join-room,.notice{flex-direction:column;gap:1rem;display:flex}.back{color:var(--muted);align-self:flex-start;font-weight:500;text-decoration:none}.title{text-align:center;letter-spacing:-.02em;margin:1rem 0 1.5rem;font-size:clamp(2.4rem,11vw,3.4rem)}.title .x{color:var(--x)}.title .o{color:var(--o)}.field{color:var(--muted);flex-direction:column;gap:.4rem;font-size:.9rem;display:flex}.join{gap:.5rem;display:flex}.join input{text-transform:uppercase;letter-spacing:.3em;text-align:center;font-weight:700}.room{flex-direction:column;gap:1.25rem;display:flex}.room-header{justify-content:space-between;align-items:center;display:flex}.code{letter-spacing:.25em;background:0 0;flex-direction:column;align-items:flex-end;padding:0;font-size:1.6rem;font-weight:800;display:flex}.code small{letter-spacing:normal;color:var(--muted);font-size:.7rem;font-weight:500}.banner{border-radius:var(--radius);color:var(--accent);text-align:center;background:#5c3b00;margin:0;padding:.6rem 1rem}.seats{grid-template-columns:1fr auto 1fr;align-items:stretch;gap:.6rem;display:grid}.seat{border-radius:var(--radius);background:var(--surface);border:2px solid #0000;flex-direction:column;align-items:center;gap:.35rem;min-width:0;padding:.8rem .5rem;transition:border-color .2s;display:flex}.seat.x.turn{border-color:var(--x)}.seat.o.turn{border-color:var(--o)}.seat .mark{font-size:1.6rem;font-weight:800}.seat.x .mark{color:var(--x)}.seat.o .mark{color:var(--o)}.seat .name{text-overflow:ellipsis;white-space:nowrap;align-items:center;gap:.35rem;max-width:100%;display:flex;overflow:hidden}.seat button{padding:.35rem .8rem;font-size:.85rem}.seat .score{font-size:1.4rem;font-weight:700}.dot{background:var(--muted);border-radius:50%;flex:none;width:.5rem;height:.5rem}.dot.online{background:#51cf66}.draws{color:var(--muted);flex-direction:column;justify-content:flex-end;align-items:center;padding-bottom:.8rem;font-size:.75rem;display:flex}.draws span{color:var(--text);font-size:1.1rem;font-weight:700}.status{text-align:center;min-height:1.5em;margin:0;font-size:1.2rem;font-weight:600}.board{aspect-ratio:1;grid-template-columns:repeat(3,1fr);gap:.5rem;display:grid}.cell{aspect-ratio:1;background:var(--surface);padding:0;font-size:clamp(2.5rem,16vw,4.5rem);font-weight:800;transition:background .15s,transform .1s}.cell:not(:disabled):hover{background:var(--surface-2)}.cell:not(:disabled):active{transform:scale(.96)}.cell:disabled{opacity:1}.cell.x{color:var(--x)}.cell.o{color:var(--o)}.cell.win{background:var(--surface-2);box-shadow:inset 0 0 0 3px var(--accent)}.room-footer{text-align:center;flex-direction:column;align-items:center;gap:.25rem;display:flex}.room-footer p{margin:0;font-size:.9rem}.notice{text-align:center;align-items:center;padding:2rem 0}.boom,.boom-phase,.boom-form{flex-direction:column;gap:1rem;display:flex}.boom-center{text-align:center;margin:0}.boom-round{color:var(--muted);justify-content:space-between;align-items:center;font-weight:600;display:flex}.countdown{color:var(--text);font-variant-numeric:tabular-nums;font-size:1.6rem;font-weight:800}.countdown.low{color:var(--x)}.boom-prompt{margin:0;font-size:1.3rem;font-weight:600;line-height:1.4}.boom-prompt .blank{color:var(--accent)}.boom-matchup{gap:.75rem;display:grid}.roast{text-align:left;flex-direction:column;gap:.5rem;padding:1.1rem;font-size:1.1rem;line-height:1.4;display:flex}.roast:disabled{opacity:1}.roast-by{font-size:.9rem}.boom-winner{text-align:center;color:var(--accent);margin:.5rem 0;font-size:clamp(1.8rem,8vw,3rem)}.boom-ranking{flex-direction:column;gap:.4rem;margin:0;padding:0;list-style:none;display:flex}.boom-ranking li{justify-content:space-between;padding:.7rem 1rem;display:flex}.grill{aspect-ratio:2;border-radius:var(--radius);background:radial-gradient(ellipse at 50% 80%, #3a1d12, var(--surface) 70%);width:100%;overflow:hidden}.grill canvas{display:block}.picker{grid-template-columns:repeat(3,1fr);gap:.6rem;display:grid}.picker button{text-transform:capitalize;flex-direction:column;align-items:center;gap:.2rem;padding:.6rem .3rem;font-size:.85rem;display:flex}.boom .picker button.picked,.boom .picker button:hover,.boom .picker button:focus-visible{outline:none}.picker .doodle{object-fit:contain;aspect-ratio:1;width:100%;max-width:6rem}.app:has(.boom.tv){box-sizing:border-box;z-index:0;max-width:1400px;min-height:100dvh;font-size:1.4rem;position:relative}.app:has(.boom){--text:#2b1d14;--muted:#6b5747;--surface:#f7f1e3;--surface-2:#ece0c6;--accent:#c2410c;--x:#b42318;color:var(--text)}.app:has(.boom) button.primary{color:#fff8ec}body:has(.boom){background:url(/assets/background-qyZh1MmL.png) 50%/cover fixed}.boom :is(.tv-join,.tv-timer,.roast,.me-card,.boom-ranking li,.picker button,input,button.primary){box-shadow:none;background:0 0;border:.5rem solid #0000;border-image:url(/assets/plain-Bey5zngV.png) 120 fill/1.6rem;border-radius:0}.boom :is(.tv-join,.roast,.me-card){border-top-width:1.4rem;border-image:url(/assets/taped-fk7CWFse.png) 240 fill/3.2rem}.boom button.primary{border-image-source:url(/assets/primary-B6NBwK3U.png)}.boom :is(.roast.picked,.picker button.picked,.picker button:hover),.boom :is(.picker button:focus-visible,input:focus){border-image-source:url(/assets/picked-BwVmwHun.png)}.boom.tv .grill{z-index:-1;aspect-ratio:auto;background:0 0;border-radius:0;width:auto;height:100%;position:fixed;inset:0}.boom.tv:has(.tv-join) .grill{right:calc(min(22vw,40vh) + 6vw)}.tv-join{text-align:center;flex-direction:column;align-items:center;gap:.4rem;padding:1.2rem 1.4rem;display:flex;position:fixed;top:50%;right:3vw;translate:0 -50%;rotate:1.5deg}.tv-join p{margin:0}.tv-qr{aspect-ratio:1;width:min(22vw,40vh)}.tv-code{letter-spacing:.15em;font-size:2.6rem}.tv-timer{align-items:center;gap:1rem;padding:.6rem 1.2rem;font-weight:600;display:flex;position:fixed;top:3vh;left:3vw}.tv-timer .countdown{font-size:3rem}.boom.tv .boom-matchup{grid-template-columns:1fr 1fr;gap:2rem;margin-top:5.5rem}.boom.tv .roast{font-size:2rem}.boom.tv .roast.side-0{rotate:-1deg}.boom.tv .roast.side-1{rotate:1deg}.boom.tv .roast-by{align-items:center;gap:.5rem;font-size:1.2rem;animation:.4s ease-out both pop-in;display:flex}.roast-by .doodle{object-fit:contain;width:2.5rem;height:2.5rem}.roast-by .points{color:var(--x);border:3px solid;border-radius:8px;margin-left:auto;padding:0 .35em;font-size:1.6em;animation:.3s ease-in .5s both stamp;rotate:-8deg}.boom .roast.won{filter:drop-shadow(4px 8px #2b1d142e);animation:.6s ease-out .3s both sizzle;translate:0 -.6rem}@keyframes stamp{0%{opacity:0;scale:2.2}}@keyframes pop-in{0%{opacity:0;transform:translateY(1rem)scale(.9)}}@keyframes sizzle{30%{transform:scale(1.05)rotate(-1deg)}60%{transform:scale(1.03)rotate(1deg)}}@media (prefers-reduced-motion:reduce){.boom.tv .roast-by,.roast-by .points,.boom .roast.won{animation:none}}.tv-podium{grid-template-columns:auto 1fr minmax(14rem,22rem);gap:1.5rem;min-height:60vh;display:grid}.doneness{border-radius:var(--radius);color:#fff;background:linear-gradient(#e86a6a,#c0603a 40%,#7a3b1c 75%,#1c1210);flex-direction:column;justify-content:space-between;align-items:center;width:3rem;padding:.8rem 0;font-size:.8em;font-weight:700;display:flex}.doneness span{writing-mode:vertical-rl}.doneness-spots{margin:0;padding:0;list-style:none;position:relative}.doneness-spots li{flex-wrap:wrap;gap:1rem;display:flex;position:absolute;left:0;right:0}.doneness-player{align-items:center;gap:.4rem;font-weight:600;display:flex}.doneness-player .doodle{object-fit:contain;width:3.5rem;height:3.5rem}.me-card{flex-direction:column;align-items:center;gap:.4rem;padding:1.2rem;display:flex}.me-card .doodle{object-fit:contain;width:8rem;height:8rem}.phone-big{text-align:center;margin-top:2rem;font-size:1.6rem;font-weight:700}.tv-sound{z-index:2;position:fixed;bottom:3vh;left:3vw}
