:root{
  --bg:#020b18; --panel:rgba(3,18,34,.82); --panel2:rgba(7,28,50,.78); --line:rgba(105,180,255,.25);
  --blue:#0794ff; --blue2:#0267e8; --text:#f4fbff; --muted:#abd2ee;
}
*{box-sizing:border-box} body{margin:0;font-family:Inter,Arial,Helvetica,sans-serif;color:var(--text);background:#020b18;overflow:hidden}
.stage{position:relative;width:100vw;height:100vh;min-width:1200px;min-height:720px;display:grid;grid-template-columns:330px 1fr 460px;grid-template-rows:1fr 105px;padding:18px 18px 0;gap:18px;background:linear-gradient(90deg,rgba(2,10,22,.98) 0%,rgba(2,16,35,.96) 32%,rgba(3,23,46,.72) 60%,rgba(1,19,39,.8) 100%),url('assets/reference-design.png');background-size:cover;background-position:center;}
.stage::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 48% 45%,rgba(0,80,160,.10),transparent 34%),linear-gradient(90deg,rgba(0,0,0,.25),transparent 55%,rgba(0,0,0,.02));pointer-events:none}.sidebar,.center-stage,.brand-panel,.footer-bar{position:relative;z-index:1}
.sidebar{grid-row:1/2;display:flex;flex-direction:column;gap:0}.panel{background:linear-gradient(180deg,rgba(5,22,42,.88),rgba(4,16,31,.78));border:1px solid var(--line);box-shadow:0 20px 60px rgba(0,0,0,.35);border-radius:14px;padding:24px}.participants-panel{border-bottom-left-radius:0;border-bottom-right-radius:0}.options-panel{border-top-left-radius:0;border-top-right-radius:0;flex:1;overflow:hidden}h2{font-size:16px;margin:0 0 14px;font-weight:900;letter-spacing:.04em}.divider{height:1px;background:var(--line);margin:14px 0 20px}.big-count{font-size:44px;color:#0b9cff;font-weight:1000;text-align:center;text-shadow:0 0 24px rgba(0,143,255,.55)}p{margin:4px 0 26px;color:var(--muted);text-align:center}.primary-btn,.secondary-btn,.export-btn{width:100%;border:1px solid rgba(100,190,255,.35);border-radius:10px;height:58px;color:#fff;font-weight:900;letter-spacing:.02em;cursor:pointer}.primary-btn{background:linear-gradient(180deg,#11a9ff,#0067e6);box-shadow:0 10px 30px rgba(0,140,255,.28)}.secondary-btn{background:rgba(255,255,255,.05);margin-top:16px}.export-btn{height:48px;background:linear-gradient(180deg,rgba(0,112,200,.8),rgba(0,72,132,.8));margin-top:16px}label{display:block;margin:12px 0;color:#fff;font-size:16px}input[type=checkbox]{width:20px;height:20px;accent-color:#0a9dff;vertical-align:middle;margin-right:10px}select{width:100%;height:48px;border:1px solid var(--line);background:rgba(255,255,255,.06);color:#fff;border-radius:9px;padding:0 14px;font-size:16px}.select-label{font-weight:900;color:#cfe9ff;font-size:14px}.history{padding-left:0;margin:8px 0 0;list-style:none;max-height:190px;overflow:auto}.history li{display:grid;grid-template-columns:24px 1fr auto;gap:10px;padding:10px 0;border-bottom:1px solid rgba(120,180,255,.08);font-size:15px}.history small{display:block;color:#9fc8e7;margin-top:3px}.history .time{color:#9fc8e7;font-size:13px}
.center-stage{display:flex;align-items:center;justify-content:center;flex-direction:column;padding-bottom:25px}.headline{font-size:30px;font-weight:1000;letter-spacing:.04em;margin:12px 0 16px;text-shadow:0 2px 18px rgba(0,0,0,.5)}.sun{display:inline-grid;place-items:center;width:42px;height:42px;border-radius:50%;background:rgba(0,145,255,.15);border:1px solid rgba(0,145,255,.35);color:#16a7ff;margin-right:12px}.wheel-wrap{position:relative;width:min(44vw,760px);height:min(44vw,760px);min-width:620px;min-height:620px}.pointer{position:absolute;top:-8px;left:50%;transform:translateX(-50%);width:54px;height:74px;background:linear-gradient(180deg,#25bcff,#0072e8);clip-path:path('M27 0 C42 0 54 12 54 27 C54 50 27 74 27 74 C27 74 0 50 0 27 C0 12 12 0 27 0 Z');z-index:3;filter:drop-shadow(0 8px 8px rgba(0,0,0,.5))}.wheel-center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:138px;height:138px;border-radius:50%;display:grid;place-items:center;font-size:54px;background:radial-gradient(circle at 35% 25%,#163a62,#061426 70%);border:3px solid rgba(160,210,255,.4);box-shadow:0 0 0 16px rgba(0,0,0,.22),0 18px 30px rgba(0,0,0,.5);z-index:2}canvas#wheel{width:100%;height:100%;filter:drop-shadow(0 22px 28px rgba(0,0,0,.55))}.controls{display:flex;align-items:center;gap:28px;margin-top:16px}.spin-btn{height:88px;width:340px;border:0;border-radius:44px;background:linear-gradient(180deg,#20baff,#005ee8);color:#fff;font-size:42px;font-weight:1000;letter-spacing:.05em;box-shadow:inset 0 2px 0 rgba(255,255,255,.35),0 18px 34px rgba(0,119,255,.24);cursor:pointer}.control-btn{width:150px;height:92px;border-radius:18px;border:1px solid var(--line);background:rgba(4,18,34,.75);color:#fff;font-size:34px;cursor:pointer}.control-btn span{display:block;font-size:15px;margin-top:8px}.brand-panel{display:flex;align-items:flex-start;justify-content:center;padding-top:48px}.brand-logo{text-align:center;text-shadow:0 3px 12px rgba(0,0,0,.6)}.jtext{font-size:38px;font-weight:1000}.together{font-size:86px;line-height:.88;font-weight:1000;letter-spacing:-.08em}.convocation{font-size:18px;font-weight:900;letter-spacing:.24em;margin-top:16px}.line{width:245px;height:2px;background:#18a9ff;margin:12px auto}.tags{font-size:28px;font-weight:1000;letter-spacing:.03em}.footer-bar{grid-column:1/4;grid-row:2/3;display:flex;align-items:center;justify-content:space-around;border:1px solid var(--line);border-bottom:0;border-radius:14px 14px 0 0;background:rgba(2,13,26,.82);backdrop-filter:blur(8px)}.copyright{width:330px}.copyright span{margin-left:10px}.volume, .footer-bar button{height:50px;border-radius:12px;border:1px solid var(--line);background:rgba(255,255,255,.04);color:#fff;padding:0 24px;font-weight:900;display:flex;align-items:center;gap:14px}.volume input{width:160px}.winner-overlay{position:fixed;inset:0;z-index:20;background:rgba(0,0,0,.86);backdrop-filter:blur(8px);display:none;place-items:center}.winner-overlay.show{display:grid;animation:fadeIn .25s ease-out}.winner-card{text-align:center;padding:70px 90px;border-radius:30px;border:1px solid rgba(255,255,255,.2);background:radial-gradient(circle at top,rgba(0,125,255,.25),rgba(0,0,0,.35));box-shadow:0 0 80px rgba(0,136,255,.35);animation:pop .6s cubic-bezier(.2,1.2,.2,1)}.winner-kicker{font-size:40px;font-weight:1000}.winner-label{font-size:30px;letter-spacing:.25em;color:#69c7ff;margin:22px 0}.winner-name{font-size:clamp(68px,8vw,145px);font-weight:1000;text-transform:uppercase;line-height:.95;text-shadow:0 0 34px rgba(0,150,255,.65)}.winner-meta{font-size:36px;color:#d7f0ff;margin-top:24px}#confettiCanvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.modal{position:fixed;inset:0;z-index:30;background:rgba(0,0,0,.7);display:grid;place-items:center}.hidden{display:none}.modal-card{max-width:560px;background:#08182b;border:1px solid var(--line);border-radius:16px;padding:28px;position:relative}.close{position:absolute;right:12px;top:10px;border:0;background:transparent;color:white;font-size:28px;cursor:pointer}@keyframes pop{from{opacity:0;transform:scale(.75)}to{opacity:1;transform:scale(1)}}@keyframes fadeIn{from{opacity:0}to{opacity:1}}@media(max-width:1400px){.stage{grid-template-columns:300px 1fr 360px}.wheel-wrap{min-width:560px;min-height:560px}.together{font-size:70px}.tags{font-size:22px}.spin-btn{width:290px}}