:root{color-scheme:dark;--ink:#101e25;--panel:#192f36;--paper:#fff1d5;--gold:#f9b95e;--mint:#9bdec6;font-family:"Trebuchet MS",system-ui,sans-serif;color:var(--paper);background:var(--ink)}
*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at top,#234049,transparent 70%);min-height:100dvh}header{position:sticky;top:0;z-index:3;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px clamp(12px,4vw,42px);background:#101e25f5;border-bottom:1px solid #ffffff24}a{color:var(--mint)}header a{text-decoration:none;font-size:.85rem}header strong{color:var(--gold)}#timer{font-variant-numeric:tabular-nums;color:var(--gold);min-width:3ch}#timer.urgent{color:#ff9b89}main{width:min(760px,100%);margin:auto;padding:12px clamp(12px,4vw,24px) 28px}#scene{position:relative;overflow:hidden;isolation:isolate;height:clamp(270px,55vw,430px);border:1px solid #ffffff30;border-radius:26px;background:#234049 url('fox-cafe.webp') center 53%/cover}#scene::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(transparent 55%,#0e1b23c7);transition:background .25s}#scene.dark::before{background:#060c19be}#scene.day #window{background:#bddde1;color:#543813}#scene button,#clock{position:absolute;padding:7px 12px;border-radius:99px;background:#152935e8;color:var(--paper);border:1px solid #fff5;min-height:38px}#window{left:12px;top:12px}#window.open{transform:rotate(-12deg)}#lamp{top:12px;left:50%;translate:-50%;color:var(--gold)!important}#clock{right:12px;top:12px;font-variant-numeric:tabular-nums}#seats{position:absolute;inset:auto 8px 12px;display:flex;justify-content:center;flex-wrap:wrap;gap:6px}.seat{background:#fff1d5;color:#35261f;border-radius:20px;padding:5px 10px;font-weight:700;font-size:.82rem;animation:slide .25s ease-out}@keyframes slide{from{transform:translateY(10px);opacity:.3}}
h1,h2,p{margin:0 0 12px}h1{font-size:clamp(2rem,8vw,4rem);line-height:1;color:var(--gold)}h2{font-size:clamp(1.2rem,4vw,1.85rem)}#panel{display:grid;gap:12px}#error:empty{margin:0}#error{color:#ffc1ad;margin:10px 0}.card,form,.answer{background:var(--panel);border:1px solid #ffffff28;border-radius:18px;padding:16px}.card img{display:block;max-width:100%;max-height:320px;object-fit:contain;margin:0 auto 14px;border-radius:12px}.eyebrow{color:var(--mint);font-size:.83rem;font-weight:700}.row{display:flex;gap:8px;flex-wrap:wrap}.row>*{flex:1 1 auto}button,input,textarea,select{font:inherit}button{cursor:pointer;border:1px solid transparent;border-radius:12px;background:var(--gold);color:#271b13;padding:11px 15px;font-weight:800;min-height:44px}button.secondary{background:#172a33;border-color:#a3c9bc80;color:var(--paper)}button:disabled{opacity:.55;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid var(--mint);outline-offset:2px}form{display:grid;gap:8px}input,textarea,select{width:100%;padding:10px;color:var(--paper);background:#101e25;border:1px solid #7ea49e;border-radius:10px}input[type=checkbox]{width:auto}textarea{resize:vertical;min-height:74px;font-size:16px}.answer{text-align:left;color:var(--paper);font-weight:700;width:100%;overflow-wrap:anywhere}.answer.truth{border-color:var(--mint);background:#204a42}.answer small{display:block;margin-top:5px;color:var(--mint)}.qr{width:180px;height:180px;image-rendering:pixelated;border-radius:10px}.tv main{width:min(1100px,100%)}.tv h2{font-size:clamp(1.6rem,5vw,3.4rem)}.tv .answer{font-size:clamp(1.1rem,3vw,2rem)}.tv .card{ text-align:center}.tv .qr{width:230px;height:230px}[hidden]{display:none!important}
@media(prefers-reduced-motion:reduce){*,*::before{animation:none!important;transition:none!important}}
fieldset{border:0;padding:0;margin:5px 0}legend{margin-bottom:8px}.pace{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.pace label{position:relative}.pace input{position:absolute;width:1px;height:1px;opacity:0}.pace span{display:block;border:1px solid #86b6ae66;border-radius:12px;padding:10px 5px;text-align:center;background:#10252c;font-weight:800}.pace small{display:block;margin-top:4px;font-weight:400;color:var(--mint)}.pace input:checked+span{border-color:var(--gold);color:var(--gold);background:#2e3a38}.pace input:focus-visible+span{outline:2px solid var(--mint)}summary{cursor:pointer;font-weight:800}details form{margin-top:12px}.tv button.answer:disabled{opacity:1}
#clock{display:flex;gap:6px;align-items:center}.dial{display:inline-block;position:relative;width:20px;height:20px;border:1px solid var(--gold);border-radius:50%}.dial::before,.dial::after{content:"";position:absolute;left:8px;bottom:8px;width:2px;background:var(--gold);transform-origin:50% 100%}.dial::before{height:5px;transform:rotate(var(--hour))}.dial::after{height:7px;transform:rotate(var(--minute))}#window.open{box-shadow:0 0 30px #96c9f88c}#scene.dark #lamp{background:#0a1420}
:root{--ink:#171719;--panel:#262729;--paper:#eeece7;--gold:#e89553;--mint:#9bcea8;font-family:system-ui,sans-serif}body{background:linear-gradient(#362d25,#171719 300px)}header{background:#252628}header strong{color:var(--paper)}.card,form,.answer{background:#262729;border-color:transparent}.eyebrow{color:#e8a675}button.secondary{background:#261e19;border-color:#e89553;color:#efab77}#scene{height:clamp(340px,80vw,575px);border:0;border-radius:0;background:linear-gradient(to bottom,#382a20 0 70%,transparent 70%),repeating-linear-gradient(90deg,#30231a 0 34px,#291d16 35px 37px);overflow:hidden}#scene::before{z-index:0;pointer-events:none;background:radial-gradient(ellipse at 50% 47%,#ffd57942,transparent 48%)}#scene.dark::before{background:#100d117d;z-index:1}#scene button,#clock,.portrait{z-index:2}#window{left:11%;top:11%;width:17%;height:27%;border:6px solid #261b14;border-radius:60px 60px 8px 8px;background:linear-gradient(90deg,transparent 46%,#392b21 46% 54%,transparent 54%),linear-gradient(transparent 55%,#392b21 55% 61%,transparent 61%),#202742;color:#fff3ce;text-align:left;font-size:clamp(18px,4vw,34px);box-shadow:0 0 0 2px #241a14}#lamp{top:23%;height:7%;width:15%;min-height:0;border-radius:90px 90px 12px 12px;background:#e5bc58;border:0}#lamp::before{content:"";position:absolute;left:50%;bottom:100%;height:130px;border-left:2px solid #201712}#scene.dark #lamp{background:#73633d}#clock{top:8%;left:35%;right:auto;padding:0;border:0;background:none}#clock-text{position:absolute;clip-path:inset(50%)}.dial{width:clamp(35px,7vw,55px);height:clamp(35px,7vw,55px);border:5px solid #624d33;background:#a49979}.dial::before,.dial::after{left:calc(50% - 1px);bottom:50%;background:#362b21}.dial::before{height:29%}.dial::after{height:40%}.portrait{position:absolute;right:12%;top:10%;background:#5d4833;border:4px solid #745a3c;rotate:-8deg;padding:4px;font-size:clamp(18px,4vw,34px)}.table{position:absolute;bottom:12%;left:12%;width:76%;height:25%;border-radius:50%;border-top:5px solid #8a765a;background:repeating-linear-gradient(0deg,#5d4b37 0 17px,#67543f 18px 19px);box-shadow:0 12px #382a20;display:flex;align-items:center;justify-content:space-evenly;font-size:clamp(16px,4vw,28px)}#seats{z-index:2;position:absolute;left:8%;right:8%;top:57%;bottom:4%;display:block}.seat{position:absolute;background:none;padding:0;text-align:center;transform:translateX(-50%);animation:none}.seat i{display:grid;place-items:center;width:clamp(38px,9vw,67px);aspect-ratio:1;border-radius:50%;background:#493d31;font-style:normal;font-size:clamp(22px,5vw,42px)}.seat.empty i{background:radial-gradient(circle at 50% 35%,#766655 0 21%,transparent 22%),radial-gradient(ellipse at 50% 91%,#766655 0 34%,#493d31 35%)}.seat b{display:block;max-width:80px;overflow:hidden;text-overflow:ellipsis;background:#fff1dc;border-radius:5px;color:#423124;padding:1px 4px;white-space:nowrap}.seat:nth-child(1){left:50%;top:0}.seat:nth-child(2){left:24%;top:4%}.seat:nth-child(3){left:76%;top:4%}.seat:nth-child(4){left:8%;top:33%}.seat:nth-child(5){left:92%;top:33%}.seat:nth-child(6){left:25%;bottom:0}.seat:nth-child(7){left:50%;bottom:-5%}.seat:nth-child(8){left:75%;bottom:0}.pace span,input,textarea,select{background:#212123}.pace input:checked+span{background:#332c27}.answer.truth{background:#344235}.card:has(h2){border-left:3px solid #e89553}form textarea{background:repeating-linear-gradient(#262729 0 26px,#303136 27px 28px);min-height:110px}
#scene .seat button{position:absolute;bottom:0;right:-5px;min-height:26px;width:26px;padding:0;border:2px solid #d28c51;background:#261f1a;color:#edaa72}.chalk{position:absolute;right:10%;top:26%;width:17%;min-height:12%;padding:4px 8px;border:4px solid #694931;border-radius:5px;background:#202923;color:#c5c3ac;z-index:1;overflow:hidden}.chalk strong{display:block;font-size:clamp(12px,3vw,23px)}.chalk span{font-size:clamp(9px,2vw,14px);font-style:italic}dialog{width:min(756px,calc(100% - 24px));border:0;border-radius:28px;padding:18px;background:#262729;color:var(--paper)}dialog::backdrop{background:#100c09aa}.invite-heading{display:flex;align-items:center;justify-content:space-between;gap:8px}.invite-heading h2{margin:0}.invite-heading form{padding:0;border:0}.invite-heading button{width:44px;padding:0;border-radius:50%;font-size:24px}.invite-heading button,.invite-options button{background:#1e1e20;color:var(--paper)}.invite-code{text-align:center;margin:14px 0;color:#aaa}.invite-code strong{color:var(--paper);font-size:1.3rem}.invite-options{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.invite-options button{padding:8px 4px;font-size:clamp(.68rem,2vw,.9rem);min-height:70px;border-radius:16px}.invite-options span{display:block;font-size:22px;margin-bottom:3px}#invite-qr{text-align:center;margin-top:14px}#invite-status{margin:10px 0 0;text-align:center;color:var(--mint)}#invite-status:empty{display:none}.chooser{text-align:center;padding:40px 0 16px}.shuffle{position:relative;width:168px;height:115px;margin:0 auto 20px}.shuffle i{position:absolute;top:5px;left:48px;display:grid;place-items:center;width:72px;height:100px;border:3px solid #fff1db;border-radius:15px;background:repeating-linear-gradient(45deg,#e89553 0 9px,#eca86e 9px 18px);font-style:normal;font-size:28px;font-weight:900;transform:translateX(var(--offset)) rotate(var(--tilt));animation:shuffle .75s ease-in-out 2 alternate}.shuffle i:first-child{--offset:-43px;--tilt:-11deg}.shuffle i:nth-child(2){--offset:0px;--tilt:0deg}.shuffle i:last-child{--offset:43px;--tilt:11deg}@keyframes shuffle{50%{transform:translateX(calc(var(--offset) * -.45)) translateY(-14px) rotate(calc(var(--tilt) * -1))}}.choice small{margin:0 0 5px;color:var(--gold)}
.avatar{display:inline-grid;place-items:center;width:2em;aspect-ratio:1;border-radius:50%;background:#3c332c;font-style:normal}.avatar.aura-fire{box-shadow:0 0 15px #f49942}.avatar.aura-ice{box-shadow:0 0 15px #9ee9ff}.avatar.aura-neon{box-shadow:0 0 15px #9fff9a}.chooser>.avatar{font-size:52px;margin-bottom:14px}.choose-title{text-align:center}.choice small,.question .eyebrow{display:flex;justify-content:space-between;background:#39322e;padding:10px;border-radius:8px}.choice em,.question em{color:#b0a8a2;font-style:normal}.question img{width:100%;max-height:min(58vh,540px);object-fit:contain;background:#1d1d20}#window{overflow:hidden}#scene:not(.day) #window::after{content:"";position:absolute;top:16%;left:75%;height:2px;width:34%;background:linear-gradient(90deg,transparent,#fff5c5);rotate:-35deg;animation:shoot 14s linear infinite}@keyframes shoot{0%,85%{opacity:0;transform:translate(0,0)}87%{opacity:1}92%,100%{opacity:0;transform:translate(-150%,65px)}}.interlude{display:grid;align-content:center;justify-items:center;text-align:center;min-height:60vh}.props{position:relative;display:flex;gap:10px;margin-top:55px}.props i{width:66px;height:48px;border-radius:4px;background:linear-gradient(130deg,#d7d0bd 48%,#b7ae9a 49%);animation:papers .75s ease-in-out 3 alternate;animation-delay:calc(var(--n,0)*.14s)}.props i:nth-child(2){--n:1}.props i:nth-child(3){--n:2}.props b{position:absolute;right:-15px;bottom:80%;font-size:45px;animation:prop .8s ease-in-out 3 alternate}.hat .props{flex-direction:row-reverse}.hat .props b{right:32%;bottom:-55%}.scale .props{rotate:-7deg}.search .props b{right:65%}@keyframes papers{to{transform:translateY(-16px) rotate(12deg)}}@keyframes prop{to{transform:translate(-25px,22px) rotate(-12deg)}}.gain,.final-banner{padding:14px 18px;border-radius:17px;background:#414034;display:flex;justify-content:space-between;align-items:center}.gain strong{color:#a5d3b1;font-size:1.25rem}.gain small{display:block;margin-top:4px}.final-banner{justify-content:center;background:#59372c;color:#ff967f;font-weight:800;text-align:center}.reveal-truth small{color:#a5d3b1}.reveal-truth details{border-top:1px solid #ffffff22;padding-top:12px}.reveal-truth details p{margin-top:10px}.answer p{margin:10px 0}.vote-answer{display:flex;align-items:stretch;padding:0;overflow:hidden}.vote-answer>b{display:grid;place-items:center;background:#535355;padding:10px}.vote-answer>span{padding:14px}.notepad{border-radius:15px;background:#262729;overflow:hidden}.notepad textarea{border:0}.submission{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #414553;padding:5px 10px}.submission span span{position:relative;display:inline-block;margin-right:4px}.submission small{position:absolute;right:0;bottom:0;border-radius:100%;background:#9bcea8;color:#203d29}.reactions{display:flex;justify-content:center;gap:8px}.reactions button,#sound{border-radius:50%;padding:0;width:44px;background:#28282a;color:#fff;font-size:20px}#reaction-pop{position:fixed;inset:auto 12px 10px;display:grid;justify-items:center;gap:6px;pointer-events:none;z-index:8}#reaction-pop span{background:#29231d;padding:7px 14px;border-radius:20px;animation:pop .25s ease-out}@keyframes pop{from{transform:scale(.65);opacity:.2}}body.urgent::after{content:"";position:fixed;inset:0;z-index:9;pointer-events:none;border:4px solid #e46551;box-shadow:inset 0 0 35px #ed665ac0;animation:warning 1s ease-in-out infinite alternate}@keyframes warning{from{opacity:.4}to{opacity:1}}#timer.urgent{background:#dc614e;color:#211617;padding:4px 8px;border-radius:15px}.ranking{background:#483a2c;border:5px solid #805f3e;border-radius:16px;padding:14px}.ranking h2{text-align:center}.rank-row{display:grid;grid-template-columns:2ch minmax(45px,1fr) minmax(60px,auto) 6ch;align-items:center;gap:8px;padding:9px 0;animation:pop .4s var(--delay) both}.track{position:relative;height:14px;background:repeating-linear-gradient(90deg,#67543e 0 9%,transparent 9% 10%);margin-right:14px}.track>span{position:absolute;left:var(--after);top:50%;transform:translate(-50%,-50%);animation:track 1s ease-out both}@keyframes track{from{left:var(--before)}}.podium-scene{position:relative;overflow:hidden;text-align:center;padding:50px 8px 20px;border-radius:16px;background:radial-gradient(ellipse at 50% 16%,#705639,#36271d 60%)}.podium{display:flex;align-items:end;justify-content:center;gap:9px;margin-bottom:14px}.place{display:grid;justify-items:center;gap:8px;min-width:26%;animation:pop .7s both}.place-0{animation-delay:.35s}.place .avatar{font-size:clamp(22px,8vw,50px)}.place>b{background:#fbedd9;color:#3c2b1d;border-radius:7px;padding:4px}.place>strong{display:grid;place-items:end center;width:100%;height:48px;background:#9a6546;border-radius:5px;font-size:24px}.place-0>strong{height:82px;background:#515a93}.place-2>strong{height:33px;background:#687d43}.confetti i{position:absolute;left:var(--x);top:-10px;width:5px;height:9px;background:#e6b954;animation:confetti 2.3s var(--delay) ease-in both}@keyframes confetti{to{transform:translate(25px,420px) rotate(450deg);opacity:0}}#diploma-content{text-align:center;color:#483526;background:#f8f0db;border:3px double #ae8b4b;padding:22px 10px;margin:8px 0}#diploma-content h2{color:#9f7837}#diploma-content .avatar{font-size:32px}#leave-confirm{display:grid;place-items:center;background:#e76e56;color:#251813;border-radius:12px;font-weight:800;text-decoration:none}
.avatar{background:#3c332c url(fox-avatars.svg?v=2) var(--avatar-offset) center/600% 100% no-repeat}.online-table{display:flex;width:100%;align-items:center;gap:10px;margin-bottom:6px;text-align:left}.online-table span:last-child{margin-left:auto}#scene #lamp[aria-pressed="true"]{background:#e5bc58;border:0}#scene #window{background-color:#202742}
#welcome{position:relative;overflow:hidden;min-height:220px;text-align:center;padding:12px 12px 125px;color:#dfcdb0;border-bottom:5px solid #9a8264;background:linear-gradient(transparent 53%,#38291e 54%,transparent 55%),radial-gradient(ellipse at 50% 0,#6d5037,transparent 62%),repeating-linear-gradient(90deg,#362820 0 38px,#2d221a 39px 41px)}#welcome h1{font-size:clamp(1.45rem,5vw,2.3rem);margin-bottom:5px}#welcome p{font-size:clamp(.86rem,3vw,1.3rem);font-weight:750}.welcome-window{position:absolute;left:5%;top:38%;width:48px;height:65px;padding:7px;border:5px solid #2c2019;border-radius:35px 35px 6px 6px;background:#212742}.welcome-fox{position:absolute;bottom:7px;left:50%;translate:-50%;width:106px;height:106px;background:url(fox-avatars.svg?v=2) 40% center/600% 100% no-repeat}#welcome-clock{position:absolute;right:5%;top:36%;border:3px solid #7e6345;border-radius:50%;background:#ad9776;color:#35271d;font-weight:800;font-size:.78rem;padding:9px 5px}body:has(#welcome:not([hidden])){background:repeating-linear-gradient(0deg,#514131 0 22px,#5b4938 23px 24px)}.welcome-actions,.welcome-online,.welcome-rules{border-radius:18px}.welcome-actions>p,.welcome-rules h2{text-align:center}.welcome-actions>p{font-weight:800;color:#aaa;font-size:.82rem}.welcome-actions form:not([hidden]){margin-top:10px;padding:0}.welcome-online summary{font-size:1.15rem}.welcome-online summary span{display:block;color:#aaa;font-size:.87rem;font-weight:600;margin-top:5px}.welcome-rules li{margin:.7em 0}@media(max-width:420px){.welcome-actions .row>*{flex-basis:100%}}
.seat.occupied i.avatar{background:#3c332c url(fox-avatars.svg?v=2) var(--avatar-offset,0%) center/600% 100% no-repeat}
