:root{--bg: #0b0b12;--panel: #16161f;--panel-2: #1f1f2c;--text: #f4f4f8;--muted: #9a9ab0;--accent: #7c6cff;--accent-2: #36d6c3;--danger: #ff6b6b;--ok: #4ade80;--radius: 16px}*{box-sizing:border-box}html,body,#root{margin:0;height:100%}body{background:radial-gradient(1200px 800px at 50% -10%,#1a1830 0%,var(--bg) 60%);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}.app{max-width:520px;margin:0 auto;padding:24px 18px 48px;min-height:100%}.brand{display:flex;align-items:center;gap:10px;font-weight:700;letter-spacing:.5px;margin-bottom:8px}.brand .dot{width:12px;height:12px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent-2));box-shadow:0 0 16px var(--accent)}h1{font-size:30px;line-height:1.15;margin:18px 0 8px}h2{font-size:20px;margin:0 0 12px}p.lead{color:var(--muted);font-size:16px;line-height:1.5}.card{background:var(--panel);border:1px solid #262636;border-radius:var(--radius);padding:18px;margin:14px 0}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:15px 18px;font-size:17px;font-weight:600;color:#fff;background:linear-gradient(135deg,var(--accent),#5a48ff);border:none;border-radius:12px;cursor:pointer;text-decoration:none;transition:transform .05s ease,opacity .2s ease}.btn:active{transform:scale(.98)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn.secondary{background:var(--panel-2);border:1px solid #303045}.btn.ghost{background:transparent;border:1px solid #303045}.shutter{width:96px;height:96px;border-radius:50%;margin:8px auto;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--accent),var(--accent-2));border:5px solid #fff;box-shadow:0 0 40px #7c6cff99;cursor:pointer;font-weight:700;color:#0b0b12}.shutter:disabled{opacity:.5}.row{display:flex;gap:10px;align-items:center}.spread{justify-content:space-between}.muted{color:var(--muted)}.big-code{font-size:40px;font-weight:800;letter-spacing:8px;text-align:center;font-variant-numeric:tabular-nums}.pill{display:inline-block;padding:4px 10px;border-radius:999px;font-size:13px;background:var(--panel-2);border:1px solid #303045;color:var(--muted)}.pill.ok{color:var(--ok);border-color:#1f5132}.pill.warn{color:#fbbf24}input.text{width:100%;padding:14px;font-size:20px;text-align:center;letter-spacing:4px;text-transform:uppercase;background:var(--panel-2);border:1px solid #303045;border-radius:12px;color:var(--text)}.qr{display:flex;justify-content:center;padding:16px;background:#fff;border-radius:12px;width:fit-content;margin:0 auto}video,.media{width:100%;border-radius:12px;background:#000;display:block}.guestlist{display:flex;flex-direction:column;gap:8px}.guest{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;background:var(--panel-2);border-radius:10px;font-size:14px}.countdown{font-size:80px;font-weight:800;text-align:center;color:var(--accent-2)}.filmstrip{display:flex;gap:6px;overflow-x:auto;padding-bottom:6px}.filmstrip .frame{height:80px;border-radius:8px;border:1px solid #303045}.error{color:var(--danger)}.center{text-align:center}.spacer{height:10px}.flash{position:fixed;top:0;right:0;bottom:0;left:0;background:#fff;opacity:0;pointer-events:none;z-index:50}.flash.on{animation:flash .25s ease}@keyframes flash{0%{opacity:.9}to{opacity:0}}.hero-stage{position:relative;width:100%;aspect-ratio:320 / 190;margin:14px 0 4px;border-radius:var(--radius);border:1px solid #262636;overflow:hidden;background:radial-gradient(120% 90% at 50% 0%,#211e3a 0%,var(--panel) 55%,var(--panel-2) 100%)}.hero-svg{display:block;width:100%;height:100%}.hero-caption{position:absolute;left:0;right:0;bottom:9px;text-align:center;font-size:10px;letter-spacing:1.4px;text-transform:uppercase;color:var(--muted);opacity:.85}.hero-svg .arc{stroke:#3a3a52;stroke-width:1.4;stroke-dasharray:3 6;stroke-linecap:round}.hero-svg .cam-dot{fill:#cdc8f0;opacity:.85;transform-box:fill-box;transform-origin:center;animation:camFire var(--ff-loop) ease-in-out infinite}.hero-svg .cam-glow{opacity:0;transform-box:fill-box;transform-origin:center;animation:camTravel var(--ff-loop) linear infinite}.hero-svg .subject{transform-box:view-box;transform-origin:160px 179px;animation:subjectSway var(--ff-loop) ease-in-out infinite}.hero-svg .sweep{transform-box:view-box;transform-origin:160px 150px;animation:sweepSpin var(--ff-loop) linear infinite}.hero-stage .stage-flash{opacity:0;animation:shutterFlash var(--ff-loop) ease-out infinite}.hero-stage{--ff-loop: 7s}@keyframes camTravel{0%{opacity:0;transform:scale(.55)}6%{opacity:1;transform:scale(1.05)}15%{opacity:0;transform:scale(.55)}to{opacity:0;transform:scale(.55)}}@keyframes camFire{0%,to{transform:scale(1);opacity:.85}3%{transform:scale(1.6);opacity:1}9%{transform:scale(1);opacity:.85}}@keyframes shutterFlash{0%{opacity:0}2%{opacity:.5}8%{opacity:0}to{opacity:0}}@keyframes subjectSway{0%{transform:rotate(-1.5deg) translate(-2px) scaleX(.98)}50%{transform:rotate(1.5deg) translate(2px) scaleX(1.02)}to{transform:rotate(-1.5deg) translate(-2px) scaleX(.98)}}@keyframes sweepSpin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion: reduce){.hero-svg .cam-dot,.hero-svg .cam-glow,.hero-svg .subject,.hero-svg .sweep,.hero-stage .stage-flash{animation:none!important}.hero-svg .cam-glow{opacity:.5}.hero-svg .subject{transform:none}.hero-svg .stage-flash{opacity:0}}
