:root{--ink: #2b1d52;--paper: #fff8ec;--pop: #ff5d8f;--sun: #ffd23f;--mint: #3ddc97;--sky: #4cc9f0;--grape: #7b5cff;--shadow: 0 5px 0 rgba(43, 29, 82, .35);--font: "Trebuchet MS", "Avenir Next Rounded", "Arial Rounded MT Bold", system-ui, sans-serif}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;height:100%;overflow:hidden;background:#2b1d52;font-family:var(--font);color:var(--ink);overscroll-behavior:none;touch-action:none;user-select:none;-webkit-user-select:none}#game{position:fixed;inset:0;width:100%;height:100%;display:block}#ui{position:fixed;inset:0;pointer-events:none;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}:where(#ui>*){pointer-events:auto}.hidden{display:none!important}.title{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;touch-action:pan-y;-webkit-overflow-scrolling:touch;padding-top:max(16px,env(safe-area-inset-top));padding-bottom:max(16px,env(safe-area-inset-bottom));background:radial-gradient(circle at 30% 20%,#ff8fab 0,transparent 40%),radial-gradient(circle at 80% 70%,#4cc9f0 0,transparent 45%),linear-gradient(160deg,#7b5cff,#2b1d52);overflow-y:auto;padding:16px}.title>.card{margin:auto 0;flex-shrink:0}.card{background:var(--paper);border:4px solid var(--ink);border-radius:28px;box-shadow:0 10px 0 var(--ink);padding:22px;width:min(440px,100%)}.logo{font-size:clamp(38px,9vw,60px);font-weight:900;line-height:.9;text-align:center;color:var(--sun);-webkit-text-stroke:3px var(--ink);text-shadow:0 6px 0 var(--ink);letter-spacing:1px;margin:4px 0 6px;transform:rotate(-3deg)}.logo small{display:block;font-size:.42em;color:var(--pop);margin-top:6px}.sub{text-align:center;font-weight:700;opacity:.8;margin-bottom:14px;font-size:14px}label.f{display:block;font-weight:800;font-size:13px;text-transform:uppercase;letter-spacing:1px;margin:12px 0 6px}input.name{width:100%;font:inherit;font-size:20px;font-weight:800;padding:10px 14px;border:3px solid var(--ink);border-radius:14px;background:#fff;color:var(--ink)}.row{display:flex;gap:8px;flex-wrap:wrap}.swatch{width:30px;height:30px;border-radius:50%;border:3px solid var(--ink);cursor:pointer}.swatch.on{outline:4px solid var(--sun);outline-offset:1px}.chip{font:inherit;font-weight:800;font-size:14px;padding:7px 12px;border-radius:999px;border:3px solid var(--ink);background:#fff;color:var(--ink);cursor:pointer}.chip.on{background:var(--sun)}.big{font:inherit;display:block;width:100%;margin-top:18px;font-size:26px;font-weight:900;padding:14px;border-radius:18px;border:4px solid var(--ink);background:var(--mint);color:var(--ink);box-shadow:var(--shadow);cursor:pointer}.big:active{transform:translateY(4px);box-shadow:none}.help{font-size:12px;margin-top:12px;opacity:.75;line-height:1.5;text-align:center}.hud-top{position:absolute;top:calc(10px + env(safe-area-inset-top));left:50%;transform:translate(-50%);display:flex;gap:8px;align-items:center;pointer-events:none;flex-wrap:wrap;justify-content:center;width:max-content;max-width:calc(100% - 120px)}.pill{background:var(--paper);border:3px solid var(--ink);border-radius:999px;padding:6px 14px;font-weight:900;box-shadow:var(--shadow);white-space:nowrap;font-size:16px}.pill.dark{background:var(--ink);color:#fff;border-color:#fff}.pill.warn{background:var(--pop);color:#fff;animation:pulse .8s infinite alternate}.pill b{font-size:1.15em}@keyframes pulse{to{transform:scale(1.07)}}.banner{position:absolute;left:50%;top:calc(var(--hud-bottom, 56px) + 10px);transform:translate(-50%);text-align:center;pointer-events:none;width:min(560px,92vw)}.banner .cat{display:inline-block;background:var(--ink);color:var(--sun);font-weight:900;padding:4px 12px;border-radius:999px;font-size:14px;letter-spacing:2px;text-transform:uppercase}.banner .name{font-size:clamp(40px,10vw,72px);font-weight:900;color:#fff;-webkit-text-stroke:3px var(--ink);text-shadow:0 6px 0 var(--ink);line-height:1;margin:10px 0}.banner .tag{background:var(--paper);border:3px solid var(--ink);border-radius:16px;padding:10px 14px;font-weight:700;box-shadow:var(--shadow);font-size:15px;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}.banner .quota{display:inline-block;margin-top:10px;font-weight:900;color:#fff;background:var(--ink);padding:6px 14px;border-radius:999px}.pop-in{animation:popin-x .45s cubic-bezier(.2,1.6,.4,1) both}@keyframes popin-x{0%{transform:translate(-50%) scale(.3);opacity:0}}@keyframes popin{0%{transform:translate(-50%,-50%) scale(.3);opacity:0}}.count{position:absolute;left:50%;top:42%;transform:translate(-50%,-50%);font-size:clamp(90px,25vw,180px);font-weight:900;color:var(--sun);-webkit-text-stroke:5px var(--ink);text-shadow:0 10px 0 var(--ink);pointer-events:none}.feed{position:absolute;right:calc(10px + env(safe-area-inset-right));top:calc(64px + env(safe-area-inset-top));display:flex;flex-direction:column;gap:5px;align-items:flex-end;pointer-events:none}.feed div{background:#2b1d52cc;color:#fff;font-weight:700;font-size:13px;padding:4px 10px;border-radius:10px;animation:fadeout 4s forwards}@keyframes fadeout{0%,75%{opacity:1}to{opacity:0}}.overlay{position:absolute;inset:0;display:grid;place-items:center;background:#2b1d5259;pointer-events:none}.overlay .card{pointer-events:auto;text-align:center}.overlay h1{margin:0;font-size:clamp(38px,10vw,64px);font-weight:900;color:var(--pop);-webkit-text-stroke:2px var(--ink)}.overlay.win h1{color:var(--sun)}.overlay p{font-weight:700;margin:8px 0}.spec{pointer-events:none;position:absolute;bottom:calc(20px + env(safe-area-inset-bottom));left:50%;transform:translate(-50%);display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:center;width:max-content;max-width:calc(100vw - 24px)}.spec .pill,.spec .btn{pointer-events:auto}.btn{font:inherit;font-weight:900;border:3px solid var(--ink);border-radius:14px;background:var(--paper);color:var(--ink);padding:8px 14px;box-shadow:var(--shadow);cursor:pointer;font-size:15px}.btn.go{background:var(--mint)}.tag3d{position:absolute;left:0;top:0;transform:translate(-50%,-100%);font-weight:800;font-size:12px;color:#fff;text-shadow:0 1px 2px #000,0 0 3px #000;white-space:nowrap;pointer-events:none;will-change:transform}.tag3d.mate{color:var(--sun)}.bubble{position:absolute;left:0;top:0;transform:translate(-50%,-100%);font-size:28px;pointer-events:none;animation:bub 2s forwards}@keyframes bub{0%{opacity:0;margin-top:10px}15%{opacity:1;margin-top:0}80%{opacity:1}to{opacity:0;margin-top:-20px}}#tags{position:absolute;inset:0;pointer-events:none;overflow:hidden}.touch{position:absolute;inset:0;pointer-events:none}.stick{position:absolute;width:120px;height:120px;margin:-60px 0 0 -60px;border-radius:50%;border:4px solid rgba(255,255,255,.6);background:#2b1d5240;pointer-events:none}.stick .knob{position:absolute;left:50%;top:50%;width:54px;height:54px;margin:-27px 0 0 -27px;border-radius:50%;background:#ffffffd9;border:3px solid var(--ink)}.tbtns{position:absolute;right:calc(18px + env(safe-area-inset-right));bottom:calc(22px + env(safe-area-inset-bottom));display:flex;gap:12px;align-items:flex-end;pointer-events:none}.tbtn{width:76px;height:76px;border-radius:50%;border:4px solid var(--ink);background:var(--sun);font-weight:900;font-size:14px;color:var(--ink);box-shadow:var(--shadow);pointer-events:auto;display:grid;place-items:center;touch-action:none}.tbtn.small{width:58px;height:58px;font-size:12px;background:var(--sky)}.tbtn.down{transform:translateY(4px);box-shadow:none}.emotes{position:absolute;left:calc(12px + env(safe-area-inset-left));top:calc(12px + env(safe-area-inset-top));display:flex;gap:6px}.emotes button{font-size:20px;width:40px;height:40px;border-radius:12px;border:3px solid var(--ink);background:var(--paper);box-shadow:var(--shadow);padding:0;cursor:pointer}.toast{z-index:30;position:absolute;left:50%;bottom:20%;transform:translate(-50%);background:var(--pop);color:#fff;font-weight:900;padding:10px 18px;border:3px solid var(--ink);border-radius:14px;box-shadow:var(--shadow);pointer-events:none}.conn{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);pointer-events:none}@media(max-width:640px){.hud-top{top:calc(60px + env(safe-area-inset-top))}.pill{font-size:13px;padding:5px 10px}}.gear{position:absolute;top:calc(12px + env(safe-area-inset-top));right:calc(12px + env(safe-area-inset-right));width:40px;height:40px;border-radius:12px;border:3px solid var(--ink);background:var(--paper);box-shadow:var(--shadow);font-size:22px;line-height:1;padding:0;cursor:pointer;color:var(--ink);z-index:5}.settings{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;overflow-y:auto;background:#2b1d528c;padding:max(16px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));z-index:40;touch-action:pan-y}.settings>.card{margin:auto 0;flex-shrink:0}.settings h2{margin:0 0 6px;font-size:28px}.settings h3{margin:14px 0 4px;font-size:13px;text-transform:uppercase;letter-spacing:1px;opacity:.7}.set-row{display:flex;flex-direction:column;gap:4px;margin:8px 0;font-weight:800}.set-row.toggle{flex-direction:row;justify-content:space-between;align-items:center;gap:12px}.set-row small{display:block;font-weight:600;opacity:.65;font-size:12px}.set-row input[type=range]{width:100%;accent-color:var(--grape)}.set-row input[type=checkbox]{width:24px;height:24px;accent-color:var(--grape);flex-shrink:0}.presets .chip{font-size:13px;padding:6px 10px}.party{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.party.muted{opacity:.6;font-weight:700;font-size:14px}.party.on{flex-direction:column;align-items:stretch;background:#fff;border:3px solid var(--ink);border-radius:14px;padding:8px 10px}.party .pcode{display:flex;gap:6px;align-items:center;flex-wrap:wrap;font-weight:800}.party .pcode b{font-size:20px;letter-spacing:3px;color:var(--grape)}.party .members{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}.party .member{background:var(--paper);border-radius:999px;padding:3px 10px;font-weight:700;font-size:13px;border:2px solid var(--ink)}input.code{font:inherit;font-weight:900;letter-spacing:3px;text-transform:uppercase;width:96px;padding:6px 10px;border:3px solid var(--ink);border-radius:12px;color:var(--ink)}.stats{margin-top:10px;font-weight:700;font-size:14px;text-align:center}.chip small{font-weight:700;opacity:.6}.chip:disabled,.big:disabled{opacity:.55;cursor:default}.status{position:absolute;top:calc(var(--hud-bottom, 56px) + 8px);left:50%;transform:translate(-50%);pointer-events:none;width:min(420px,calc(100vw - 24px))}.status .st{background:var(--paper);border:3px solid var(--ink);border-radius:16px;padding:6px 12px;box-shadow:var(--shadow);text-align:center;font-weight:800}.status .st b{display:block;font-size:17px;letter-spacing:.5px}.status .st span{display:block;font-size:13px;opacity:.75}.status .bar{height:8px;border-radius:99px;background:#2b1d5226;margin-top:5px;overflow:hidden}.status .bar i{display:block;height:100%;border-radius:99px;transition:width .25s}.status .ab{font-size:12px;margin-top:4px;opacity:.7}.status .ab.ready{opacity:1;color:var(--grape)}.callout{position:absolute;left:50%;top:40%;transform:translate(-50%,-50%);font-size:clamp(26px,6vw,44px);font-weight:900;color:#fff;-webkit-text-stroke:2px var(--ink);text-shadow:0 5px 0 var(--ink);pointer-events:none;text-align:center;width:min(640px,92vw);z-index:25}.callout.pop{animation:popin .4s cubic-bezier(.2,1.6,.4,1) both}.tlook{position:absolute;right:calc(24px + env(safe-area-inset-right));bottom:calc(118px + env(safe-area-inset-bottom));width:48px;height:48px;border-radius:50%;border:3px solid var(--ink);background:#fff8ecd9;display:grid;place-items:center;font-size:22px;pointer-events:auto;touch-action:none}.tlook.down{background:var(--sun)}.gear{z-index:45}@media(max-width:640px){.hud-top{max-width:calc(100% - 24px)}}@media(max-height:500px){.pill{font-size:12px;padding:4px 9px}.banner .tag{-webkit-line-clamp:2}.banner .name{font-size:min(48px,11vh);margin:4px 0}.banner .tag{font-size:13px;padding:6px 10px}.count{font-size:min(110px,30vh)}.status{width:min(300px,40vw)}.status .st b{font-size:14px}.feed{max-width:170px}.feed div{font-size:11px}.emotes{flex-direction:column}.hud-top{max-width:calc(100% - 140px)}.overlay h1{font-size:34px}.overlay .card{padding:14px}.callout{font-size:26px;top:34%}.tbtn{width:64px;height:64px}.tbtn.small{width:50px;height:50px}.tlook{bottom:calc(96px + env(safe-area-inset-bottom));width:42px;height:42px}}@media(max-width:640px){.banner .tag{-webkit-line-clamp:3;font-size:14px}}@media(min-width:641px)and (max-width:1000px)and (min-height:501px){.hud-top{top:calc(60px + env(safe-area-inset-top));max-width:calc(100% - 24px)}}.feed{top:max(calc(var(--status-bottom, 56px) + 10px),calc(62px + env(safe-area-inset-top)))}@media(max-height:500px){.feed{top:max(calc(var(--hud-bottom, 50px) + 8px),calc(60px + env(safe-area-inset-top)))}}@media(max-height:500px){.feed div:nth-child(n+4){display:none}}@media(max-height:500px){.banner{width:min(520px,58vw)}}