:root{--bg: #0b0a14;--panel: #161427;--panel2: #1f1c36;--line: #2e2a4d;--gold: #ffc83d;--gold2: #ff9f1c;--txt: #f4f1ff;--muted: #9b95c4;--danger: #ff4d6d;--ok: #2ee59d}*{box-sizing:border-box;margin:0;padding:0}html,body{overflow-x:hidden;overflow-x:clip}body{font-family:Outfit,system-ui,sans-serif;color:var(--txt);min-height:100vh;background:radial-gradient(900px 600px at 15% -10%,#3b1d6e55,transparent 60%),radial-gradient(800px 600px at 110% 110%,#ff9f1c22,transparent 60%),var(--bg);overflow-x:hidden}header{display:flex;align-items:center;gap:12px;padding:20px 28px 6px}.brand-icon{width:clamp(40px,5vw,56px);height:auto;filter:drop-shadow(0 4px 14px #ffc83d55)}.logo{font-family:Bebas Neue,sans-serif;font-size:clamp(36px,5vw,56px);letter-spacing:3px;line-height:1;white-space:nowrap;background:linear-gradient(180deg,#fff3c4,var(--gold) 45%,var(--gold2));-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 4px 18px #ffc83d55);animation:glow 3s ease-in-out infinite}.logo span{color:var(--txt);-webkit-text-fill-color:var(--txt);opacity:.9}@keyframes glow{50%{filter:drop-shadow(0 4px 30px #ffc83d99)}}main{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(300px,.85fr);gap:28px;max-width:1180px;margin:18px auto 40px;padding:0 18px;align-items:start}@media(max-width:900px){main{grid-template-columns:1fr}}.stage{position:relative;display:flex;flex-direction:column;align-items:center}.wheel-wrap{position:relative;width:min(560px,92vw);aspect-ratio:1}.wheel-wrap:before{content:"";position:absolute;top:-14px;right:-14px;bottom:-14px;left:-14px;border-radius:50%;background:conic-gradient(from 0deg,#ffc83d,#ff9f1c,#ff4d6d,#a855f7,#3b82f6,#2ee59d,#ffc83d);filter:blur(22px);opacity:.35;animation:spinGlow 8s linear infinite}.wheel-wrap.spinning:before{opacity:.75;animation-duration:1.2s}@keyframes spinGlow{to{transform:rotate(360deg)}}canvas#wheel{position:relative;width:100%;height:100%;display:block;border-radius:50%}.pointer{position:absolute;top:-18px;left:50%;transform:translate(-50%);z-index:3;width:46px;height:60px;transform-origin:50% 20%;filter:drop-shadow(0 6px 8px #0009)}.pointer.tick{animation:tick .12s ease-out}@keyframes tick{40%{transform:translate(-50%) rotate(-18deg)}to{transform:translate(-50%) rotate(0)}}.hub{position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;width:21%;height:21%;border-radius:50%;z-index:2;border:none;cursor:pointer;background:radial-gradient(circle at 35% 30%,#fff6d0,var(--gold) 40%,var(--gold2) 75%,#b86b00);box-shadow:0 0 0 6px #0b0a14,0 0 0 9px #ffc83d,0 10px 30px #000a,inset 0 -6px 12px #0004;font-family:Bebas Neue;font-size:clamp(18px,3.4vw,30px);color:#3a2300;letter-spacing:2px;transition:transform .15s}.hub:hover:not(:disabled){transform:scale(1.07)}.hub:active:not(:disabled){transform:scale(.95)}.hub:disabled{cursor:not-allowed;filter:grayscale(.4) brightness(.85)}.hub.pulse{animation:pulse 1.6s ease-in-out infinite}@keyframes pulse{50%{box-shadow:0 0 0 6px #0b0a14,0 0 0 9px #ffc83d,0 0 40px 12px #ffc83d88,inset 0 -6px 12px #0004}}.status{margin-top:18px;min-height:28px;color:var(--muted);font-size:15px;text-align:center}.status b{color:var(--gold)}.panel{background:linear-gradient(180deg,var(--panel),#120f22);border:1px solid var(--line);border-radius:20px;padding:20px;box-shadow:0 20px 50px #0006;min-width:0;overflow:hidden}.panel h2{font-size:15px;text-transform:uppercase;letter-spacing:1.5px;color:var(--muted);margin-bottom:12px;display:flex;justify-content:space-between;align-items:center}.count{background:var(--panel2);color:var(--gold);padding:3px 10px;border-radius:99px;font-size:13px}.add{display:flex;gap:8px}textarea{flex:1;resize:vertical;min-height:46px;max-height:180px;background:var(--panel2);border:1px solid var(--line);color:var(--txt);border-radius:12px;padding:12px 14px;font:inherit;font-size:15px;outline:none;transition:border-color .2s,box-shadow .2s}textarea:focus{border-color:var(--gold);box-shadow:0 0 0 3px #ffc83d33}.btn{border:none;border-radius:12px;padding:0 18px;font:600 15px Outfit;cursor:pointer;transition:transform .12s,filter .2s;background:linear-gradient(180deg,var(--gold),var(--gold2));color:#2b1a00}.btn:hover{filter:brightness(1.08)}.btn:active{transform:scale(.96)}.btn.ghost{background:var(--panel2);color:var(--txt);border:1px solid var(--line);padding:9px 14px;font-size:13px}.btn.ghost:hover{border-color:var(--gold)}.hint{font-size:12px;color:var(--muted);margin-top:8px}.msg{font-size:13px;margin-top:8px;min-height:18px;color:var(--danger)}.msg.ok{color:var(--ok)}ul.names{list-style:none;margin-top:10px;max-height:280px;overflow-y:auto;overflow-x:hidden;padding-right:4px}ul.names::-webkit-scrollbar,ol.hist::-webkit-scrollbar{width:6px}ul.names::-webkit-scrollbar-thumb,ol.hist::-webkit-scrollbar-thumb{background:var(--line);border-radius:6px}.names li{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:10px;margin-bottom:6px;background:var(--panel2);animation:slideIn .35s cubic-bezier(.2,1.4,.4,1) both}.names li.out{animation:slideOut .3s ease-in forwards}@keyframes slideIn{0%{opacity:0;transform:translate(30px) scale(.9)}}@keyframes slideOut{to{opacity:0;transform:translate(-30px) scale(.9);height:0;padding:0;margin:0}}.dot{width:12px;height:12px;border-radius:50%;flex:none;box-shadow:0 0 8px currentColor}.names .n{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.names .x{background:none;border:none;color:var(--muted);font-size:18px;cursor:pointer;width:26px;height:26px;border-radius:8px}.names .x:hover{color:var(--danger);background:#ff4d6d1a}.empty{color:var(--muted);font-size:14px;text-align:center;padding:18px 0;justify-content:center;border:none!important;background:none!important}.opts{display:flex;flex-direction:column;gap:10px;margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}.row{display:flex;gap:8px;flex-wrap:wrap}.history{margin-top:18px;min-width:0;overflow:hidden}ol.hist{list-style:none;max-height:200px;overflow-y:auto;overflow-x:hidden}.hist li{display:flex;gap:10px;align-items:center;padding:7px 4px;border-bottom:1px dashed var(--line);font-size:14px;animation:slideIn .4s both}.hist .pos{font-family:Bebas Neue;font-size:20px;color:var(--gold);width:30px;text-align:center;flex:none}.hist .nm{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.hist .t{margin-left:auto;color:var(--muted);font-size:12px;flex:none}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#05040bcc;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;z-index:50;opacity:0;pointer-events:none;transition:opacity .3s}.overlay.show{opacity:1;pointer-events:auto}.card{text-align:center;padding:36px 40px 30px;border-radius:26px;max-width:min(520px,92vw);background:linear-gradient(180deg,#221d40,#130f25);border:2px solid var(--gold);box-shadow:0 0 80px #ffc83d55;transform:scale(.5) rotate(-6deg);transition:transform .55s cubic-bezier(.2,1.6,.4,1)}.overlay.show .card{transform:scale(1) rotate(0)}.card .trophy{font-size:64px;animation:bounce 1s ease-in-out infinite}@keyframes bounce{50%{transform:translateY(-10px) rotate(6deg)}}.card .lbl{color:var(--muted);letter-spacing:3px;text-transform:uppercase;font-size:13px;margin-top:6px}.card .win{font-family:Bebas Neue;font-size:clamp(44px,10vw,76px);line-height:1.05;margin:8px 0 20px;word-break:break-word;background:linear-gradient(180deg,#fff,var(--gold));-webkit-background-clip:text;background-clip:text;color:transparent;animation:pop .6s .2s cubic-bezier(.2,1.8,.4,1) both}@keyframes pop{0%{transform:scale(0);opacity:0}}.card .row{justify-content:center}.card .btn{padding:12px 22px}canvas#confetti{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;pointer-events:none;z-index:60}footer{text-align:center;color:var(--muted);font-size:12px;padding:0 0 26px}
