:root{--accent:#7c3aed;--gold:#ffd166;--ink:#f7fbff;--muted:rgba(232,240,255,.62);--line:rgba(255,255,255,.13);--card:rgba(10,14,35,.72);--pointer:#ffd166;--wheel-border:#f8d46b}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#060817;color:var(--ink)}body{min-height:100dvh;overflow-x:hidden}button,input{font:inherit}
.scene-bg{position:fixed;inset:0;z-index:0;background:radial-gradient(circle at 18% 8%,rgba(124,58,237,.28),transparent 30%),radial-gradient(circle at 82% 15%,rgba(6,182,212,.2),transparent 31%),radial-gradient(circle at 50% 100%,rgba(236,72,153,.16),transparent 32%),linear-gradient(145deg,#050817,#0a1130 52%,#180c2c);background-size:cover;background-position:center}.scene-bg:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(2,6,23,.02),rgba(2,6,23,.35))}.scene-glow{position:fixed;z-index:0;border-radius:50%;filter:blur(100px);pointer-events:none;opacity:.34;animation:floatGlow 12s ease-in-out infinite alternate}.glow-one{width:380px;height:380px;background:#7c3aed;left:-160px;top:20%}.glow-two{width:420px;height:420px;background:#0891b2;right:-190px;top:10%;animation-delay:-5s}.scene-stars{position:fixed;inset:0;z-index:0;pointer-events:none;background-image:radial-gradient(rgba(255,255,255,.28) 1px,transparent 1px);background-size:44px 44px;mask-image:linear-gradient(to bottom,#000,transparent 86%);opacity:.45}@keyframes floatGlow{to{transform:translate(45px,-28px) scale(1.1)}}
.app-shell{position:relative;z-index:2;width:min(1540px,100%);min-height:100dvh;margin:auto;padding:14px 18px 22px}.game-header{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:76px;padding:11px 14px;border:1px solid var(--line);border-radius:22px;background:rgba(5,9,26,.64);backdrop-filter:blur(22px);box-shadow:0 18px 60px rgba(0,0,0,.2)}.game-brand{display:flex;align-items:center;gap:12px;min-width:0}.logo-wrap{width:52px;height:52px;flex:0 0 52px;border-radius:16px;padding:5px;background:linear-gradient(135deg,#22d3ee,#7c3aed 55%,#ec4899);box-shadow:0 10px 28px rgba(124,58,237,.3)}.logo-wrap img{width:100%;height:100%;display:block;object-fit:contain;border-radius:12px;background:rgba(7,12,30,.38)}.game-brand h1{margin:0;font-size:19px;letter-spacing:.4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.game-brand p{margin:4px 0 0;font-size:10px;color:var(--muted);font-weight:700}.header-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}.ticket-pill,.spin-pill,.status-pill,.ghost-btn{border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.07);border-radius:14px}.ticket-pill{display:flex;align-items:center;gap:8px;padding:7px 11px}.ticket-pill>span{font-size:20px}.ticket-pill small,.spin-pill small{display:block;font-size:7.5px;letter-spacing:1px;color:rgba(255,255,255,.48);font-weight:900}.ticket-pill b{display:block;margin-top:2px;font-size:11px}.spin-pill{padding:7px 12px;text-align:center;background:linear-gradient(135deg,rgba(245,158,11,.16),rgba(236,72,153,.13));border-color:rgba(253,224,71,.18)}.spin-pill b{display:block;font-size:20px;color:#fde68a;line-height:1}.status-pill{padding:9px 12px;color:#67e8f9;font-size:9px;font-weight:950;letter-spacing:.7px}.ghost-btn{padding:9px 12px;color:#fff;text-decoration:none;font-size:9px;font-weight:900}.ghost-btn:hover{background:rgba(255,255,255,.12)}
.game-layout{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:14px;align-items:stretch;padding-top:14px;min-height:calc(100dvh - 112px)}.wheel-stage{position:relative;min-height:700px;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;border:1px solid rgba(255,255,255,.12);border-radius:30px;background:radial-gradient(circle at 50% 48%,rgba(124,58,237,.14),transparent 36%),linear-gradient(145deg,rgba(10,15,39,.58),rgba(12,9,35,.46));backdrop-filter:blur(17px);box-shadow:inset 0 1px rgba(255,255,255,.08),0 26px 75px rgba(0,0,0,.21)}.wheel-stage:before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 25%,rgba(255,255,255,.025) 50%,transparent 70%)}.stage-title{position:absolute;left:22px;top:20px;z-index:10}.stage-title>span,.mini-label{display:inline-flex;align-items:center;padding:5px 8px;border-radius:999px;border:1px solid rgba(34,211,238,.2);background:rgba(6,182,212,.1);color:#67e8f9;font-size:8px;font-weight:950;letter-spacing:1px}.stage-title h2{margin:7px 0 2px;font-size:20px}.stage-title p{margin:0;color:var(--muted);font-size:9px;font-weight:700}.wheel-area{position:relative;width:min(630px,76vw);aspect-ratio:1;display:grid;place-items:center;margin-top:8px}.wheel-aura{position:absolute;inset:-6%;border-radius:50%;background:radial-gradient(circle,rgba(250,204,21,.11),rgba(124,58,237,.1) 44%,transparent 68%);filter:blur(18px);animation:auraPulse 3.5s ease-in-out infinite}@keyframes auraPulse{50%{transform:scale(1.04);opacity:.72}}.wheel-frame{position:absolute;inset:0;border-radius:50%;padding:13px;background:conic-gradient(#fff2a8,#f59e0b,#fff7cf,#fb923c,#fde68a,#eab308,#fff2a8);box-shadow:0 0 0 4px rgba(255,255,255,.24),0 0 52px color-mix(in srgb,var(--wheel-border) 42%,transparent),0 30px 85px rgba(0,0,0,.43)}.wheel-frame:before{content:"";position:absolute;inset:6px;border-radius:50%;border:2px solid rgba(255,255,255,.56);pointer-events:none}.wheel-disc{width:100%;height:100%;overflow:hidden;border-radius:50%;background:#0f172a;will-change:transform;box-shadow:inset 0 0 45px rgba(0,0,0,.3)}.wheel-disc svg{display:block;width:100%;height:100%}.wheel-lights{position:absolute;inset:-5px;z-index:6;border-radius:50%;pointer-events:none;background:repeating-conic-gradient(from 0deg,#fff 0 1deg,transparent 1deg 7.4deg);mask:radial-gradient(circle,transparent 0 93.3%,#000 93.6% 100%);filter:drop-shadow(0 0 5px rgba(255,245,180,.8));animation:lightMove 2.5s linear infinite}@keyframes lightMove{to{transform:rotate(14.8deg)}}.wheel-pointer{position:absolute;z-index:11;top:-9px;left:50%;transform:translateX(-50%);width:66px;height:88px;filter:drop-shadow(0 10px 12px rgba(0,0,0,.42));pointer-events:none}.wheel-pointer:not(.custom):before{content:"";position:absolute;left:50%;top:0;transform:translateX(-50%);width:58px;height:58px;border-radius:17px 17px 25px 25px;background:linear-gradient(145deg,#fff8d2,var(--pointer) 48%,#f59e0b);box-shadow:inset 0 2px rgba(255,255,255,.8),0 0 26px color-mix(in srgb,var(--pointer) 55%,transparent)}.wheel-pointer:not(.custom):after{content:"";position:absolute;left:50%;top:45px;transform:translateX(-50%);border-left:18px solid transparent;border-right:18px solid transparent;border-top:37px solid #f59e0b}.wheel-pointer img{width:100%;height:100%;object-fit:contain}.wheel-hub{position:absolute;z-index:8;width:23%;aspect-ratio:1;border-radius:50%;display:grid;place-items:center;overflow:hidden;padding:12px;background:radial-gradient(circle at 34% 26%,#fffbe5,#f8d36a 34%,#e69d1c 70%,#854d0e);border:6px solid rgba(255,255,255,.78);box-shadow:0 0 0 7px rgba(87,40,8,.45),0 16px 35px rgba(0,0,0,.45),inset 0 5px 9px rgba(255,255,255,.4);color:#4a2400;text-shadow:0 1px rgba(255,255,255,.6);font-weight:1000;font-size:clamp(12px,2vw,23px);letter-spacing:.6px}.wheel-hub img{width:100%;height:100%;object-fit:cover;border-radius:50%}.spin-button{position:relative;z-index:15;display:flex;align-items:center;justify-content:center;gap:10px;min-width:260px;margin-top:16px;padding:14px 22px;border:1px solid rgba(255,255,255,.22);border-radius:16px;color:#fff;background:linear-gradient(105deg,#6d28d9,#db2777 56%,#f59e0b);box-shadow:0 15px 34px rgba(124,58,237,.34),inset 0 1px rgba(255,255,255,.32);font-size:12px;font-weight:1000;letter-spacing:.7px;cursor:pointer;transition:.2s}.spin-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 20px 40px rgba(219,39,119,.36)}.spin-button:disabled{opacity:.5;cursor:not-allowed}.spin-icon{font-size:18px}.spin-button.loading .spin-icon{animation:spinIcon .65s linear infinite}@keyframes spinIcon{to{transform:rotate(360deg)}}.fair-note{margin-top:9px;color:rgba(255,255,255,.42);font-size:8.5px;font-weight:700}
.info-column{display:flex;flex-direction:column;gap:12px;min-width:0}.ticket-gate,.game-card{border:1px solid var(--line);border-radius:24px;background:var(--card);backdrop-filter:blur(20px);box-shadow:0 18px 52px rgba(0,0,0,.2)}.ticket-gate{position:relative;padding:24px 20px;overflow:hidden}.ticket-gate:before{content:"";position:absolute;width:180px;height:180px;right:-80px;top:-90px;border-radius:50%;background:radial-gradient(circle,rgba(34,211,238,.2),transparent 68%)}.gate-icon{width:54px;height:54px;display:grid;place-items:center;margin-bottom:12px;border-radius:17px;background:linear-gradient(135deg,#06b6d4,#2563eb,#7c3aed);font-size:27px;box-shadow:0 12px 28px rgba(37,99,235,.28)}.ticket-gate h2{margin:8px 0 6px;font-size:25px;letter-spacing:-.5px}.ticket-gate>p{margin:0 0 16px;color:var(--muted);font-size:10.5px;line-height:1.55}.ticket-gate label{display:block;margin:0 0 6px;color:rgba(255,255,255,.7);font-size:9px;font-weight:900;letter-spacing:.5px}.ticket-input-wrap{display:flex;align-items:center;min-height:54px;border:1px solid rgba(255,255,255,.16);border-radius:15px;background:rgba(255,255,255,.075);overflow:hidden;transition:.2s}.ticket-input-wrap:focus-within{border-color:#22d3ee;box-shadow:0 0 0 4px rgba(34,211,238,.09)}.ticket-input-wrap>span{padding:0 0 0 14px;color:#67e8f9;font-weight:900}.ticket-input-wrap input{min-width:0;flex:1;border:0;outline:0;background:transparent;color:#fff;padding:14px 12px;font-size:13px;font-weight:900;letter-spacing:.8px;text-transform:uppercase}.ticket-input-wrap input::placeholder{color:rgba(255,255,255,.3);font-size:10px}.enter-button{width:100%;display:flex;align-items:center;justify-content:center;gap:8px;margin-top:10px;border:0;border-radius:14px;padding:14px 15px;color:#fff;background:linear-gradient(105deg,#0891b2,#2563eb 54%,#7c3aed);font-size:10px;font-weight:1000;letter-spacing:.7px;cursor:pointer;box-shadow:0 12px 28px rgba(37,99,235,.2)}.enter-button b{font-size:16px}.gate-help{display:block;margin-top:11px;text-align:center;color:rgba(255,255,255,.38);font-size:8.5px}.notice{margin:12px 0;padding:10px 11px;border-radius:12px;font-size:9px;font-weight:850;line-height:1.4}.notice.error{color:#fecaca;background:rgba(239,68,68,.13);border:1px solid rgba(248,113,113,.24)}.notice.success{color:#a7f3d0;background:rgba(16,185,129,.12);border:1px solid rgba(52,211,153,.22)}.game-card{padding:17px}.card-heading{display:flex;align-items:center;justify-content:space-between}.game-card h3{margin:7px 0 0;font-size:14px}.active-code{margin:9px 0 12px;font-size:17px;font-weight:1000;color:#fff;letter-spacing:.8px}.remaining-box{display:flex;align-items:center;gap:12px;padding:12px;border-radius:17px;background:linear-gradient(135deg,rgba(245,158,11,.13),rgba(124,58,237,.12));border:1px solid rgba(253,224,71,.14)}.remaining-box>strong{font-size:42px;line-height:1;color:#fde68a}.remaining-box b{display:block;font-size:10px}.remaining-box span{display:block;margin-top:3px;color:var(--muted);font-size:8.5px}.winner-feed{display:grid;gap:7px;margin-top:12px;max-height:285px;overflow:auto;padding-right:2px}.winner-row{display:grid;grid-template-columns:38px minmax(0,1fr) auto;gap:8px;align-items:center;padding:8px;border:1px solid rgba(255,255,255,.08);border-radius:13px;background:rgba(255,255,255,.045)}.winner-row img{width:38px;height:38px;object-fit:contain;padding:4px;border-radius:10px;background:rgba(255,255,255,.07)}.winner-row b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:9.5px}.winner-row span{display:block;margin-top:2px;color:rgba(255,255,255,.46);font-size:7.8px}.winner-row time{font-size:7.5px;color:rgba(255,255,255,.32)}.empty-feed{padding:18px;text-align:center;color:rgba(255,255,255,.4);font-size:9px}.claim-card p{margin:9px 0;color:var(--muted);font-size:10px;line-height:1.55}.claim-button{display:flex;align-items:center;justify-content:center;margin-top:10px;padding:11px;border-radius:12px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.11);color:#fff;text-decoration:none;font-size:9px;font-weight:900}
.sound-toggle{position:fixed;right:16px;bottom:14px;z-index:50;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.16);background:rgba(7,12,29,.76);color:#fff;display:grid;place-items:center;cursor:pointer;backdrop-filter:blur(14px);box-shadow:0 10px 30px rgba(0,0,0,.22)}.prize-modal{position:fixed;inset:0;z-index:100;display:none;align-items:center;justify-content:center;padding:18px;background:rgba(2,6,23,.74);backdrop-filter:blur(14px)}.prize-modal.show{display:flex}.prize-card{position:relative;width:min(440px,94vw);padding:27px 24px;text-align:center;overflow:hidden;border:1px solid rgba(255,255,255,.18);border-radius:29px;background:radial-gradient(circle at 50% 0,rgba(251,191,36,.16),transparent 38%),linear-gradient(145deg,#0f172a,#251044);box-shadow:0 40px 110px rgba(0,0,0,.52),0 0 65px rgba(124,58,237,.23)}.modal-rays{position:absolute;inset:-100%;background:repeating-conic-gradient(rgba(255,255,255,.035) 0 8deg,transparent 8deg 16deg);animation:modalRotate 18s linear infinite}@keyframes modalRotate{to{transform:rotate(360deg)}}.prize-card>*:not(.modal-rays){position:relative;z-index:2}.prize-badge{display:inline-flex;padding:6px 10px;border-radius:999px;background:rgba(245,158,11,.15);border:1px solid rgba(251,191,36,.25);color:#fde68a;font-size:8.5px;font-weight:950;letter-spacing:.9px}.prize-img{width:145px;height:145px;object-fit:contain;display:block;margin:14px auto 3px;filter:drop-shadow(0 18px 22px rgba(0,0,0,.4))}.prize-card h2{margin:8px 0 6px;font-size:28px}.prize-card p{margin:0;color:var(--muted);font-size:10px;line-height:1.55}.modal-actions{display:flex;gap:8px;justify-content:center;margin-top:17px}.modal-actions button,.modal-actions a{border:0;border-radius:12px;padding:10px 15px;text-decoration:none;color:#fff;font-size:10px;font-weight:900;cursor:pointer;background:linear-gradient(135deg,#7c3aed,#ec4899)}.modal-actions .soft{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.13)}.confetti{position:fixed;inset:0;z-index:110;pointer-events:none;overflow:hidden}.confetti i{position:absolute;top:-24px;width:8px;height:15px;border-radius:2px;animation:fall var(--d) linear forwards}@keyframes fall{to{transform:translate(var(--x),110vh) rotate(760deg)}}.no-segments{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;color:#fff;background:#111827}.no-segments span{font-size:10px;color:var(--muted)}
@media(max-width:1180px){.game-layout{grid-template-columns:minmax(0,1fr) 300px}.wheel-stage{min-height:640px}.wheel-area{width:min(560px,72vw)}}
@media(max-width:920px){.app-shell{padding:9px}.game-layout{grid-template-columns:1fr;min-height:auto}.wheel-stage{min-height:650px}.wheel-area{width:min(590px,88vw)}.info-column{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}.ticket-gate,.active-ticket-card{grid-column:1/-1}.claim-card{align-self:stretch}}
@media(max-width:620px){.app-shell{padding:6px}.game-header{min-height:62px;padding:8px 9px;border-radius:17px}.logo-wrap{width:42px;height:42px;flex-basis:42px;border-radius:13px}.game-brand h1{font-size:14px}.game-brand p{display:none}.ticket-pill{display:none}.spin-pill{padding:6px 9px}.spin-pill b{font-size:17px}.ghost-btn{padding:8px 9px}.game-layout{padding-top:6px;gap:7px}.wheel-stage{min-height:0;aspect-ratio:1/1.16;border-radius:20px;padding:0 0 7px}.stage-title{display:none}.wheel-area{width:min(94vw,520px);margin:0}.wheel-frame{padding:9px}.wheel-pointer{width:48px;height:65px;top:-5px}.wheel-pointer:not(.custom):before{width:43px;height:43px;border-radius:13px}.wheel-pointer:not(.custom):after{top:34px;border-left-width:14px;border-right-width:14px;border-top-width:28px}.wheel-hub{border-width:4px;box-shadow:0 0 0 4px rgba(87,40,8,.45),0 10px 25px rgba(0,0,0,.42)}.spin-button{min-width:205px;margin-top:6px;padding:11px 17px;font-size:10px}.fair-note{font-size:7.5px}.info-column{display:flex}.ticket-gate,.game-card{border-radius:18px}.ticket-gate{padding:18px 15px}.ticket-gate h2{font-size:22px}.winner-feed{max-height:230px}.sound-toggle{right:10px;bottom:8px}.prize-card{padding:22px 16px}.prize-img{width:118px;height:118px}.prize-card h2{font-size:23px}}
@media(max-width:390px){.wheel-stage{aspect-ratio:1/1.2}.wheel-area{width:96vw}.status-pill{display:none}.spin-button{min-width:185px}.fair-note{max-width:280px;text-align:center}}
/* V3 username + ticket access */
.ticket-gate .field-gap{margin-top:11px}.ticket-input-wrap input.username-input{text-transform:none;letter-spacing:.2px}.active-user{display:flex;align-items:center;gap:9px;margin:10px 0 7px;padding:9px 11px;border-radius:14px;border:1px solid rgba(255,255,255,.09);background:rgba(255,255,255,.045)}.active-user>span{font-size:18px}.active-user small{display:block;color:rgba(255,255,255,.42);font-size:7px;font-weight:900;letter-spacing:.8px}.active-user b{display:block;margin-top:2px;font-size:11px;max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.active-code{font-size:13px;color:#c4b5fd}.player-pill b{max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
