:root{--bg: #0e0f13;--bg-soft: #16181f;--panel: #1b1e27;--panel-2: #21252f;--line: #2a2f3a;--text: #eef1f6;--muted: #8b93a3;--accent: #ff6a3d;--accent-soft: #ff6a3d22;--green: #3ddc84;--radius: 16px;--mono: "SFMono-Regular", ui-monospace, "JetBrains Mono", Menlo, Consolas, monospace;--sans: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:radial-gradient(1200px 600px at 50% -10%,#1a1d27 0%,var(--bg) 60%);color:var(--text);font-family:var(--sans);min-height:100vh;-webkit-font-smoothing:antialiased}button{font-family:inherit;cursor:pointer}a{color:var(--accent)}.app{max-width:640px;margin:0 auto;padding:clamp(14px,2.4svh,24px) 18px 120px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:4px 0 clamp(12px,2svh,28px)}.topbar .brand{margin:0;justify-content:flex-start}.btn-group{background:var(--panel);border:1px solid var(--line);color:var(--text);border-radius:12px;padding:11px 15px;font-size:14px;font-weight:600;white-space:nowrap;transition:background .2s ease,transform .08s ease}.btn-group:hover:not(:disabled){background:var(--panel-2)}.btn-group:active{transform:translateY(1px)}.btn-group:disabled{opacity:.5;cursor:not-allowed}.btn-group.done{color:var(--green);border-color:var(--green)}.brand{display:flex;align-items:center;gap:10px;justify-content:center;margin:12px 0 4px}.brand .logo{width:34px;height:34px}.brand h1{font-size:26px;margin:0;letter-spacing:-.5px}.brand h1 span{color:var(--accent)}.tagline{text-align:center;color:var(--muted);font-size:clamp(12px,1.6svh,14px);margin:0 auto clamp(10px,1.6svh,20px);max-width:440px;line-height:1.45}.reel{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:clamp(9px,1.3svh,14px);overflow:hidden}.reel-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:clamp(6px,1.05svh,11px) 14px;border-radius:12px;margin:clamp(3px,.55svh,6px) 0;font-family:var(--mono);font-size:clamp(15px,2.3svh,20px);letter-spacing:4px}.reel-row.past{background:var(--bg-soft);color:var(--muted)}.reel-row.past .tag{color:var(--green)}.reel-row.upcoming{background:transparent;color:#5c6474;border:1px dashed var(--line)}.reel-row.current{background:linear-gradient(180deg,var(--accent),#e9531f);color:#1a0d07;font-size:clamp(28px,4.6svh,40px);letter-spacing:10px;font-weight:800;padding:clamp(13px,2.2svh,22px) 14px;box-shadow:0 12px 30px -12px var(--accent);justify-content:center}.reel-row.start{background:var(--panel-2);color:var(--text);font-size:clamp(24px,3.6svh,30px);letter-spacing:8px;font-weight:800;justify-content:center;padding:clamp(13px,2.2svh,22px) 14px;border:1px solid var(--line)}.reel-row .tag{font-family:var(--sans);font-size:11px;letter-spacing:.5px;color:var(--muted);white-space:nowrap}.reel-divider{height:1px;background:var(--line);margin:clamp(4px,.9svh,8px) 4px}.progress{display:flex;align-items:center;justify-content:space-between;margin:clamp(10px,1.6svh,18px) 2px 8px;color:var(--muted);font-size:13px}.progress .bar{flex:1;height:6px;background:var(--panel-2);border-radius:99px;margin:0 12px;overflow:hidden}.progress .bar>i{display:block;height:100%;background:var(--accent);border-radius:99px;transition:width .4s ease}.actions{display:flex;gap:12px;margin-top:clamp(12px,1.8svh,20px);margin-bottom:clamp(14px,2svh,26px)}.btn{border:none;border-radius:14px;padding:clamp(13px,1.9svh,18px) 20px;font-size:18px;font-weight:700;color:#fff;transition:transform .08s ease,filter .2s ease,background .2s ease}.btn:active{transform:translateY(2px) scale(.99)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn.primary{flex:1;background:linear-gradient(180deg,var(--accent),#e9531f);color:#1a0d07;font-size:20px}.next-wrap{position:relative;flex:1;display:flex;overflow:hidden;border-radius:14px}.next-wrap .btn.primary{width:100%}.next-wrap .btn.primary:disabled{opacity:.85}.cooldown-bar{position:absolute;left:0;bottom:0;height:7px;width:0;background:#1a0d07;box-shadow:0 0 8px #0006;border-bottom-left-radius:14px;animation-name:cooldown-fill;animation-timing-function:linear;animation-fill-mode:forwards}@keyframes cooldown-fill{0%{width:0}to{width:100%}}.btn.primary:hover:not(:disabled){filter:brightness(1.06)}.btn.ghost{background:var(--panel);border:1px solid var(--line);color:var(--text);font-size:16px;padding:18px}.btn.ghost:hover{background:var(--panel-2)}.btn.block{width:100%;display:flex;align-items:center;justify-content:center;gap:8px}.btn.wide{flex:1}.subrow{display:flex;gap:12px;margin-top:14px}.subrow .btn.ghost{flex:1;font-size:14px;padding:14px}.groupbar{display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:10px 14px;margin-bottom:clamp(10px,1.6svh,16px);font-size:13px}.groupbar .live{display:inline-flex;align-items:center;gap:7px;color:var(--green);font-weight:600}.dot{width:8px;height:8px;border-radius:99px;background:var(--green);box-shadow:0 0 0 0 var(--green);animation:pulse 1.8s infinite}@keyframes pulse{0%{box-shadow:0 0 #3ddc8480}70%{box-shadow:0 0 0 8px #3ddc8400}to{box-shadow:0 0 #3ddc8400}}.owner-badge{font-size:12px;font-weight:600;color:var(--accent);background:var(--accent-soft);border:1px solid var(--accent);border-radius:8px;padding:4px 9px;white-space:nowrap}.copybtn{background:var(--panel-2);border:1px solid var(--line);color:var(--text);border-radius:10px;padding:8px 12px;font-size:13px;font-weight:600}.copybtn.done{color:var(--green);border-color:var(--green)}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);display:flex;align-items:center;justify-content:center;padding:20px;z-index:40}.modal{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:24px;max-width:380px;width:100%;text-align:center}.modal h3{margin:0 0 8px;font-size:20px}.modal p{color:var(--muted);font-size:14px;line-height:1.5;margin:0 0 20px}.modal .row{display:flex;gap:12px}.modal .btn{flex:1;padding:14px;font-size:15px}.btn.danger{background:#e23b3b;color:#fff}.foot{text-align:center;color:var(--muted);font-size:12px;margin-top:34px;line-height:1.6}.foot a{color:var(--muted);text-decoration:underline}.seo{margin-top:40px;color:var(--muted);font-size:13px;line-height:1.7}.seo h2{color:var(--text);font-size:16px;margin:22px 0 8px}@media(max-width:420px){.app{padding:14px 12px 48px}.reel-row{letter-spacing:3px}.reel-row.current{letter-spacing:7px}.brand h1{font-size:22px}.btn.primary{font-size:18px}.btn-group{padding:9px 11px;font-size:13px}}@media(max-height:745px){.tagline{display:none}.app{padding-top:12px}.brand h1{font-size:22px}.brand .logo{width:28px;height:28px}}@media(max-height:560px){.groupbar{display:none}}
