:root{--ink: #1a1a1a;--mustard: #ffd23f;--ketchup: #e4572e;--pink: #ff5d8f;--relish: #7bd389;--blue: #3d8bfd;--cyan: #3dd6d0;--paper: #fff8e7;--shadow: 5px 5px 0 var(--ink);--shadow-sm: 3px 3px 0 var(--ink);--radius: 18px;--display: "Bungee", "Impact", "Arial Black", system-ui, sans-serif;--body: "Rubik", system-ui, -apple-system, "Segoe UI", sans-serif;--wheel-size: min(88vw, 62svh, 560px)}*,*:before,*:after{box-sizing:border-box}html,body{margin:0;min-height:100%}body{font-family:var(--body);font-weight:500;color:var(--ink);background:radial-gradient(circle at 20% 10%,#ff9fbf 0,transparent 40%),radial-gradient(circle at 85% 90%,#7fe7e2 0,transparent 45%),var(--mustard);min-height:100svh;overflow-x:hidden;-webkit-tap-highlight-color:transparent}.bg-pattern{position:fixed;top:-140px;right:-140px;bottom:-140px;left:-140px;background-image:var(--pattern);background-size:140px 140px;animation:drift 40s linear infinite;pointer-events:none;z-index:0}body.is-spinning .bg-pattern{animation-duration:6s}@keyframes drift{to{transform:translate(140px,140px)}}button{font:inherit;color:inherit;cursor:pointer}button:disabled{cursor:not-allowed}:focus-visible{outline:4px dashed var(--blue);outline-offset:3px}.topbar{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:max(12px,env(safe-area-inset-top)) 16px 4px}.brand{display:flex;align-items:center;gap:10px;min-width:0}.brand-logo{width:52px;height:52px;flex:none;animation:wobble 3s ease-in-out infinite}.brand-logo svg{width:100%;height:100%;display:block;filter:drop-shadow(3px 3px 0 var(--ink))}@keyframes wobble{0%,to{transform:rotate(-8deg)}50%{transform:rotate(8deg) scale(1.05)}}.brand-title{margin:0;font-family:var(--display);font-weight:400;font-size:clamp(1.4rem,6vw,2.6rem);line-height:1;color:var(--ketchup);text-shadow:3px 3px 0 var(--ink),-1px -1px 0 var(--ink),1px -1px 0 var(--ink),-1px 1px 0 var(--ink);letter-spacing:.02em;white-space:nowrap}.brand-title span{color:#fff}.topbar-actions{display:flex;gap:10px;flex:none}.icon-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:48px;height:48px;padding:0 12px;border:3px solid var(--ink);border-radius:14px;background:#fff;box-shadow:var(--shadow-sm);font-size:1.3rem;transition:transform .1s,box-shadow .1s}.icon-btn:hover:not(:disabled){transform:translate(-1px,-1px) rotate(-2deg);box-shadow:4px 4px 0 var(--ink)}.icon-btn:active:not(:disabled){transform:translate(3px,3px);box-shadow:0 0 0 var(--ink)}.icon-btn:disabled{opacity:.5}.icon-btn--groups{background:var(--cyan)}.icon-btn-label{font-family:var(--display);font-size:.9rem}.icon-btn--small{min-width:38px;height:38px;padding:0 8px;font-size:1rem;border-radius:10px;box-shadow:2px 2px 0 var(--ink)}.icon-btn--danger:hover:not(:disabled){background:#ffd6d6}.icon-btn.is-armed,.btn.is-armed{background:var(--ketchup);color:#fff;font-family:var(--display);font-size:.75rem;animation:shake .3s}@media(max-width:480px){.topbar{padding-inline:12px}.icon-btn-label{display:none}.icon-btn:not(.icon-btn--small){min-width:42px;height:42px;padding:0 8px}.topbar-actions,.brand{gap:8px}.brand-logo{width:40px;height:40px}.brand-title{font-size:min(5vw,1.6rem)}}.stage{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:14px;padding:8px 16px max(24px,env(safe-area-inset-bottom))}.group-chip{border:3px solid var(--ink);background:#fff;border-radius:999px;padding:6px 16px;font-weight:900;font-size:1rem;box-shadow:var(--shadow-sm);transform:rotate(-2deg);max-width:90vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.group-chip:hover:not(:disabled){transform:rotate(1deg) scale(1.04)}.chip-label{font-family:var(--display);font-weight:400;font-size:.7rem;background:var(--pink);color:#fff;border-radius:999px;padding:2px 8px;margin-right:4px;vertical-align:2px}.wheel-wrap{position:relative;width:var(--wheel-size);aspect-ratio:1;margin-top:26px}.wheel-rim{position:relative;width:100%;height:100%;border-radius:50%;filter:drop-shadow(8px 10px 0 var(--ink))}body.is-spinning .wheel-rim{animation:rumble .12s linear infinite}@keyframes rumble{0%,to{transform:translate(0)}50%{transform:translate(.6px,-.6px)}}.wheel{display:block;width:100%;height:100%;overflow:visible}.wheel-rim-ring{fill:var(--ink)}.slice{stroke:var(--ink);stroke-width:3;stroke-linejoin:round;transition:filter .3s}.slice--empty{fill:#fff}.slice-outline{fill:none;stroke:var(--ink);stroke-width:5}.slice--winner{animation:winner-flash .45s steps(2,jump-none) 6}@keyframes winner-flash{50%{filter:brightness(1.5) saturate(1.4)}}.slice-label{font-family:var(--display);fill:#fff;stroke:var(--ink);stroke-width:4px;paint-order:stroke;stroke-linejoin:round;pointer-events:none;-webkit-user-select:none;user-select:none}.bulb{stroke:var(--ink);stroke-width:1.5;fill:#fff6c2;animation:blink 1.2s steps(1) infinite}.bulb--b{animation-delay:.6s}body.is-spinning .bulb{animation-duration:.25s}body.is-spinning .bulb--b{animation-delay:.125s}@keyframes blink{0%{fill:#fff6c2;filter:drop-shadow(0 0 4px #fff38a)}50%{fill:#7a5c00;filter:none}}.hub{position:absolute;inset:50% auto auto 50%;width:30%;aspect-ratio:1;translate:-50% -50%;border:none;padding:0;background:none;border-radius:50%;transition:transform .15s}.hub svg{width:100%;height:100%;display:block}.hub:hover:not(:disabled){transform:scale(1.06) rotate(-6deg)}.hub:active:not(:disabled){transform:scale(.94)}body.is-spinning .hub{animation:hub-bounce .5s ease-in-out infinite}@keyframes hub-bounce{50%{transform:scale(1.06)}}.pointer{position:absolute;z-index:3;top:-9%;left:50%;width:15%;translate:-50% 0;transform-origin:50% 10%;filter:drop-shadow(3px 3px 0 var(--ink));pointer-events:none}.pointer svg{display:block;width:100%;height:auto}.pointer.is-flicking{animation:flick .14s ease-out}@keyframes flick{30%{transform:rotate(-14deg)}}.spin-btn{margin-top:8px;font-family:var(--display);font-size:clamp(1.3rem,5.5vw,2rem);padding:14px 36px;color:#fff;background:var(--ketchup);border:4px solid var(--ink);border-radius:999px;box-shadow:0 7px 0 var(--ink);text-shadow:2px 2px 0 var(--ink);transition:transform .08s,box-shadow .08s;animation:pulse 1.6s ease-in-out infinite}.spin-btn:hover:not(:disabled){background:var(--pink)}.spin-btn:active:not(:disabled){transform:translateY(6px);box-shadow:0 1px 0 var(--ink)}.spin-btn:disabled{animation:none;background:#b9a37c;opacity:.85}body.is-spinning .spin-btn:disabled{background:var(--blue);opacity:1}@keyframes pulse{50%{transform:scale(1.05) rotate(-1.5deg)}}.hint{margin:0;min-height:1.2em;font-weight:700;text-align:center;max-width:34ch}.stats{width:min(560px,100%)}.stats:empty{display:none}.stats-recap{margin:0 0 10px;text-align:center;font-weight:700}.stat-list{list-style:none;margin:0;padding:10px;display:grid;gap:6px;background:var(--paper);border:3px solid var(--ink);border-radius:var(--radius);box-shadow:var(--shadow)}.stat{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:10px;padding:4px 6px;border-radius:10px}.stat:nth-child(odd){background:#0000000a}.stat-dot{width:16px;height:16px;border-radius:50%;background:var(--dot);border:2px solid var(--ink)}.stat-name{font-weight:700;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.stat-count{font-weight:900}.stat-odds{font-family:var(--display);font-size:.8rem;min-width:3.4em;text-align:right;color:var(--ketchup)}.badge{display:inline-block;font-family:var(--display);font-size:.6rem;padding:1px 6px;border-radius:999px;border:2px solid var(--ink);vertical-align:2px}.badge--last{background:var(--ketchup);color:#fff}.badge--prev{background:var(--mustard)}.winner{position:fixed;top:0;right:0;bottom:0;left:0;z-index:20;display:grid;place-items:center;padding:20px;background:#1a1a1a8c;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);opacity:0;transition:opacity .25s}.winner[hidden]{display:none}.winner.is-open{opacity:1}.winner-card{position:relative;width:min(440px,100%);padding:28px 22px 22px;text-align:center;background:var(--paper);border:4px solid var(--ink);border-radius:26px;box-shadow:10px 10px 0 var(--ink);transform:scale(.3) rotate(-12deg)}.winner.is-open .winner-card{animation:pop-in .6s cubic-bezier(.2,1.6,.4,1) forwards}@keyframes pop-in{to{transform:scale(1) rotate(-1.5deg)}}.winner-sausage{width:70%;margin:-90px auto 4px;animation:wobble 1.2s ease-in-out infinite}.winner-sausage svg{width:100%;display:block;filter:drop-shadow(4px 4px 0 var(--ink))}.winner-kicker{margin:0;font-family:var(--display);font-size:1rem;color:var(--pink);text-shadow:1px 1px 0 var(--ink)}.winner-name{margin:4px 0 8px;font-family:var(--display);font-weight:400;font-size:clamp(2.2rem,11vw,3.8rem);line-height:1.05;color:var(--mustard);text-shadow:4px 4px 0 var(--ink),-2px -2px 0 var(--ink),2px -2px 0 var(--ink),-2px 2px 0 var(--ink);word-break:break-word;animation:name-zoom .8s ease-out .2s both}@keyframes name-zoom{0%{transform:scale(2.5);opacity:0}60%{transform:scale(.9);opacity:1}to{transform:scale(1)}}.winner-sub{margin:0 0 18px;font-weight:700}.winner-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}.btn{font-family:var(--display);font-size:1rem;padding:12px 18px;border:3px solid var(--ink);border-radius:14px;box-shadow:var(--shadow-sm);background:#fff;transition:transform .08s,box-shadow .08s}.btn:hover:not(:disabled){transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--ink)}.btn:active:not(:disabled){transform:translate(3px,3px);box-shadow:0 0 0 var(--ink)}.btn--primary{background:var(--ketchup);color:#fff;text-shadow:1px 1px 0 var(--ink)}.btn--ghost{background:#fff}.btn--small{font-size:.85rem;padding:8px 12px}.btn--wide{width:100%;margin-top:10px}.toast-stack{position:fixed;z-index:40;left:50%;bottom:max(18px,env(safe-area-inset-bottom));translate:-50% 0;display:grid;gap:8px;width:min(92vw,420px);pointer-events:none}.toast{padding:12px 16px;font-weight:900;text-align:center;background:#fff;border:3px solid var(--ink);border-radius:14px;box-shadow:var(--shadow-sm);animation:toast-in .4s cubic-bezier(.2,1.6,.4,1)}.toast--win{background:var(--relish);font-size:1.05rem}.toast--warn{background:#ffd6d6}.toast--out{animation:toast-out .3s ease-in forwards}@keyframes toast-in{0%{transform:translateY(40px) scale(.8);opacity:0}}@keyframes toast-out{to{transform:translateY(30px);opacity:0}}.modal{width:min(520px,94vw);max-height:88svh;padding:0;border:4px solid var(--ink);border-radius:24px;background:var(--paper);color:var(--ink);box-shadow:10px 10px 0 var(--ink);overflow:auto}.modal[open]{animation:modal-in .35s cubic-bezier(.2,1.4,.4,1)}.modal::backdrop{background:#1a1a1a8c;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}@keyframes modal-in{0%{transform:translateY(30px) scale(.92);opacity:0}}.modal-inner{padding:18px}.modal-head{position:sticky;top:-18px;z-index:1;display:flex;align-items:center;justify-content:space-between;margin:-18px -18px 8px;padding:14px 18px;background:var(--pink);border-bottom:4px solid var(--ink)}.modal-head h2{margin:0;font-family:var(--display);font-weight:400;font-size:1.5rem;color:#fff;text-shadow:2px 2px 0 var(--ink)}.modal-section{padding:12px 0;border-bottom:3px dashed rgb(26 26 26 / .25)}.modal-section:last-child{border-bottom:none}.modal-section h3{margin:0 0 10px;font-family:var(--display);font-weight:400;font-size:1rem;color:var(--ketchup)}.group-list,.people-list{list-style:none;margin:0 0 10px;padding:0;display:grid;gap:8px}.group-item,.person-item{display:flex;align-items:center;gap:8px}.group-select{flex:1;min-width:0;display:flex;justify-content:space-between;align-items:center;gap:8px;padding:10px 14px;text-align:left;background:#fff;border:3px solid var(--ink);border-radius:12px;box-shadow:2px 2px 0 var(--ink);font-weight:700}.group-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.group-count{flex:none;font-size:.85rem}.group-item.is-active .group-select{background:var(--mustard);box-shadow:3px 3px 0 var(--ink)}.group-item.is-active .group-name:before{content:"✓ "}.inline-form{display:flex;gap:8px}input{font:inherit;font-size:16px;font-weight:700;color:var(--ink);min-width:0;padding:10px 12px;border:3px solid var(--ink);border-radius:12px;background:#fff}input:focus{outline:none;background:#fffbe0;box-shadow:0 0 0 3px var(--blue)}.inline-form input,.person-item input{flex:1}.field{display:grid;gap:4px;margin-bottom:12px;font-weight:700;font-size:.85rem}.person-count{flex:none;font-weight:900;font-size:.9rem;min-width:3.2em;text-align:right}.empty,.muted{margin:0 0 10px;opacity:.7;font-weight:700}.row{display:flex;flex-wrap:wrap;gap:8px}@media(max-width:520px){.modal{width:100vw;max-width:100vw;max-height:92svh;margin:auto 0 0;border-radius:24px 24px 0 0;border-bottom:none;box-shadow:none}.modal[open]{animation-name:sheet-in}}@keyframes sheet-in{0%{transform:translateY(100%)}}@keyframes shake{25%{transform:translate(-3px)}75%{transform:translate(3px)}}@media(min-width:1000px)and (min-height:640px){:root{--wheel-size: min(46vw, 72svh, 620px)}.stage{display:grid;grid-template-columns:auto minmax(280px,380px);grid-template-areas:"chip chip" "wheel stats" "spin stats" "hint stats";justify-content:center;align-items:start;column-gap:48px}.group-chip{grid-area:chip;justify-self:center}.wheel-wrap{grid-area:wheel}.spin-btn{grid-area:spin;justify-self:center}.hint{grid-area:hint;justify-self:center}.stats{grid-area:stats;align-self:center;margin-top:40px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important}.winner.is-open .winner-card{transform:none}.bg-pattern{animation:none}}
