:root{--accent-pink:#ff2d89;--accent-gradient:linear-gradient(90deg, #ff5582 0%, #ff2889 100%);--pink-tint:#fff3f8;--text-primary:#333;--text-secondary:#666;--bg-surface:#fff;--bg-muted:#f7f8fa;--glow:0}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{color:var(--text-primary);background:var(--bg-muted);font-family:Open Sans,Helvetica,Helvetica Neue,Arial,sans-serif;overflow-x:hidden}.screen{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:24px;min-height:100%;padding:24px;display:flex}.screen--message .screen__message{color:var(--text-secondary);font-size:18px}.connecting{flex-direction:column;align-items:center;gap:16px;display:flex}.connecting__dot{background:var(--accent-pink);border-radius:50%;width:16px;height:16px;animation:1.4s infinite live-pulse}.gate{background:var(--bg-surface);border-radius:20px;max-width:360px;padding:32px 24px;box-shadow:0 12px 40px #ff2d891f}.gate__title{color:var(--accent-pink);margin-top:0}.gate__text{color:var(--text-secondary)}.button{cursor:pointer;border:none;border-radius:999px;padding:14px 28px;font-size:16px;font-weight:600}.button--primary{color:#fff;background:var(--accent-gradient)}.start-button{color:#fff;cursor:pointer;background:var(--accent-gradient);border:none;border-radius:50%;width:220px;height:220px;font-size:32px;font-weight:700;animation:1.8s infinite pulse;box-shadow:0 0 #ff2d8980}@keyframes pulse{0%{box-shadow:0 0 #ff2d8973}70%{box-shadow:0 0 0 32px #ff2d8900}to{box-shadow:0 0 #ff2d8900}}.lobby__hint{color:var(--text-secondary)}.screen--live{background:radial-gradient(circle at 50% 30%, rgba(255, 45, 137, calc(.25 * var(--glow))), transparent 60%), var(--bg-muted);justify-content:center;gap:20px}.live-bar{justify-content:space-between;align-items:center;width:100%;max-width:600px;display:flex}.live-badge{letter-spacing:3px;text-transform:uppercase;color:var(--accent-pink);align-items:center;gap:8px;font-size:14px;font-weight:700;display:inline-flex}.live-badge__dot{background:var(--accent-pink);border-radius:50%;width:10px;height:10px;animation:1.4s infinite live-pulse}@keyframes live-pulse{0%{box-shadow:0 0 #ff2d898c}70%{box-shadow:0 0 0 12px #ff2d8900}to{box-shadow:0 0 #ff2d8900}}.live-timer{flex-direction:column;align-items:flex-end;gap:2px;display:flex}.live-timer__label{letter-spacing:1px;text-transform:uppercase;color:var(--text-secondary);font-size:12px}.live-timer .countdown{font-size:34px}.live-stats{gap:12px;width:100%;max-width:600px;margin:0;display:flex}.live-stat{background:var(--bg-surface);border-radius:16px;flex:1;padding:12px 14px;box-shadow:0 6px 20px #ff2d891a}.live-stat dt{letter-spacing:1px;text-transform:uppercase;color:var(--text-secondary);margin-bottom:4px;font-size:12px}.live-stat dd{color:var(--accent-pink);margin:0;font-size:22px;font-weight:700}.countdown{letter-spacing:2px;font-variant-numeric:tabular-nums;font-size:44px;font-weight:700}.countdown--urgent{color:var(--accent-pink);animation:1s steps(2,start) infinite blink}.countdown--ended{color:var(--text-secondary)}@keyframes blink{50%{opacity:.35}}.wave{aspect-ratio:2;background:var(--bg-surface);width:100%;max-width:600px;box-shadow:0 0 calc(40px * var(--glow)) #ff2d8980;touch-action:none;border-radius:20px;display:block}.patterns{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.pattern{background:var(--bg-surface);color:var(--text-primary);cursor:pointer;border:1px solid #ff2d8959;border-radius:999px;padding:10px 18px;transition:background .2s,color .2s,transform .15s}.pattern--active{color:#fff;background:var(--accent-gradient);border-color:#0000;transform:translateY(-1px)}.speed{width:100%;max-width:320px;color:var(--text-secondary);flex-direction:column;gap:8px;display:flex}.speed input[type=range]{width:100%;height:44px;accent-color:var(--accent-pink)}.button,.pattern{min-height:44px}@media (width<=640px){.screen{padding:16px}.screen--live{padding-bottom:max(24px, env(safe-area-inset-bottom));justify-content:flex-end;gap:18px}.start-button{width:min(70vw,260px);height:min(70vw,260px);font-size:30px}.wave{aspect-ratio:auto;max-width:none;height:40vh}.pattern{flex:40%;padding:12px 14px}.countdown{font-size:38px}.live-timer .countdown{font-size:30px}.live-stat{padding:10px}.live-stat dd{font-size:18px}}@media (hover:none){.wave{cursor:grab}}
