:root{--bg-main: #0a0e17;--bg-card: rgba(18, 25, 38, .75);--bg-card-hover: rgba(26, 36, 54, .9);--bg-glass: rgba(13, 19, 31, .65);--border-color: rgba(255, 255, 255, .08);--border-gold: rgba(229, 169, 60, .3);--gold-primary: #e5a93c;--gold-glow: rgba(229, 169, 60, .35);--gold-light: #fcd34d;--emerald-neon: #10b981;--emerald-glow: rgba(16, 185, 129, .35);--ruby-alert: #ef4444;--ruby-glow: rgba(239, 68, 68, .35);--text-main: #f8fafc;--text-muted: #94a3b8;--text-dim: #64748b;--font-heading: "Outfit", -apple-system, BlinkMacSystemFont, sans-serif;--font-body: "Inter", -apple-system, BlinkMacSystemFont, sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-main);background-image:radial-gradient(circle at 15% 15%,rgba(229,169,60,.06) 0%,transparent 40%),radial-gradient(circle at 85% 85%,rgba(16,185,129,.04) 0%,transparent 45%);background-attachment:fixed;color:var(--text-main);font-family:var(--font-body);-webkit-font-smoothing:antialiased;min-height:100vh;overflow-x:hidden}h1,h2,h3,h4,.font-heading{font-family:var(--font-heading);letter-spacing:-.02em}.glass-panel{background:var(--bg-card);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid var(--border-color);border-radius:16px;box-shadow:0 12px 32px #00000059}.gold-border{border:1px solid var(--border-gold);box-shadow:0 0 24px var(--gold-glow)}.navbar{display:flex;align-items:center;justify-content:space-between;padding:1rem 2rem;background:#0a0e17d9;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--border-color);position:sticky;top:0;z-index:100}.brand-container{display:flex;align-items:center;gap:.75rem}.brand-logo-icon{width:36px;height:36px;background:linear-gradient(135deg,var(--gold-primary),#b45309);border-radius:10px;display:flex;align-items:center;justify-content:center;color:#0a0e17;box-shadow:0 0 16px var(--gold-glow)}.brand-title{font-size:1.25rem;font-weight:800;color:var(--text-main)}.brand-badge{font-size:.65rem;text-transform:uppercase;padding:.2rem .5rem;background:#e5a93c26;border:1px solid var(--gold-primary);color:var(--gold-primary);border-radius:6px;letter-spacing:.05em;font-weight:700}.nav-status-pill{display:flex;align-items:center;gap:.5rem;padding:.4rem .9rem;background:#10b9811f;border:1px solid rgba(16,185,129,.3);border-radius:9999px;font-size:.8rem;color:#34d399;font-weight:500}.status-dot{width:8px;height:8px;border-radius:50%;background-color:var(--emerald-neon);box-shadow:0 0 8px var(--emerald-neon);animation:pulse-glow 2s infinite}@keyframes pulse-glow{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.85)}}.exercise-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:1.5rem;margin-top:1.5rem}.exercise-card{padding:1.5rem;cursor:pointer;transition:all .25s cubic-bezier(.16,1,.3,1);position:relative;overflow:hidden}.exercise-card:hover{background:var(--bg-card-hover);border-color:var(--gold-primary);transform:translateY(-4px);box-shadow:0 16px 36px #0006,0 0 20px var(--gold-glow)}.exercise-card.active{border-color:var(--gold-primary);background:#1a2436f2;box-shadow:0 0 24px var(--gold-glow)}.viewport-container{position:relative;width:100%;max-width:960px;margin:0 auto;border-radius:20px;overflow:hidden;background:#000;box-shadow:0 20px 50px #000000b3;aspect-ratio:16 / 9}.camera-video{width:100%;height:100%;object-fit:cover;transform:scaleX(-1)}.camera-canvas{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;transform:scaleX(-1)}.hud-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;justify-content:space-between;padding:1.5rem;pointer-events:none}.hud-top{display:flex;justify-content:space-between;align-items:flex-start}.rep-counter-box{background:#0a0e17d9;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--border-gold);border-radius:16px;padding:.75rem 1.5rem;text-align:center;box-shadow:0 8px 24px #0006}.rep-counter-number{font-family:var(--font-heading);font-size:3.5rem;font-weight:900;line-height:1;color:var(--gold-primary);text-shadow:0 0 16px var(--gold-glow)}.rep-counter-label{font-size:.75rem;text-transform:uppercase;color:var(--text-muted);letter-spacing:.1em;font-weight:700;margin-top:.25rem}.state-badge{padding:.4rem 1rem;border-radius:9999px;font-size:.85rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.state-ready{background:#64748b4d;border:1px solid #64748b;color:#cbd5e1}.state-concentric{background:#e5a93c40;border:1px solid var(--gold-primary);color:var(--gold-light)}.state-peak{background:#10b98140;border:1px solid var(--emerald-neon);color:#6ee7b7}.state-eccentric{background:#3b82f640;border:1px solid #3b82f6;color:#93c5fd}.alert-banner{background:#ef4444e6;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#fff;padding:.75rem 1.25rem;border-radius:12px;font-weight:600;display:flex;align-items:center;gap:.75rem;box-shadow:0 8px 24px var(--ruby-glow);animation:slide-up .3s cubic-bezier(.16,1,.3,1);max-width:80%;margin:0 auto}@keyframes slide-up{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.controls-bar{display:flex;justify-content:center;align-items:center;gap:1rem;pointer-events:auto}.btn{display:inline-flex;align-items:center;gap:.5rem;font-family:var(--font-heading);font-size:.95rem;font-weight:700;padding:.75rem 1.5rem;border-radius:12px;border:none;cursor:pointer;transition:all .2s ease;text-decoration:none}.btn-primary{background:linear-gradient(135deg,var(--gold-primary),#d97706);color:#0a0e17;box-shadow:0 4px 16px var(--gold-glow)}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 24px var(--gold-glow);background:linear-gradient(135deg,#fbbf24,#b45309)}.btn-danger{background:#ef444433;border:1px solid var(--ruby-alert);color:#fca5a5}.btn-danger:hover{background:var(--ruby-alert);color:#fff;box-shadow:0 0 16px var(--ruby-glow)}.btn-secondary{background:#ffffff14;border:1px solid var(--border-color);color:var(--text-main)}.btn-secondary:hover{background:#ffffff26;border-color:#fff3}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#05080ed9;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:1.5rem}.modal-content{max-width:680px;width:100%;max-height:90vh;overflow-y:auto;padding:2rem;position:relative}@media(max-width:768px){.navbar{padding:.75rem 1rem}.rep-counter-number{font-size:2.5rem}.viewport-container{aspect-ratio:4 / 3}}