*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
  :root{
    --bg:#0e0e0e;--card:#201f1f;--surface:#131313;--border:rgba(72,72,71,0.20);
    --accent:#c0fb60;--accent-h:#a8e050;--accent-soft:rgba(192,251,96,.12);
    --text:#F5F5F7;--text2:#adaaaa;--text3:#636363;
    --shadow:0 4px 16px rgba(0,0,0,0.25);--shadow-lg:0 20px 40px rgba(0,0,0,0.4);
    --font-d:'Bebas Neue',sans-serif;--font-b:'Inter',sans-serif;
    --px:32px;--radius:16px;
  }
  body{font-family:var(--font-b);background:var(--bg);color:var(--text);font-size:15px;line-height:1.5;overflow-x:hidden;-webkit-font-smoothing:antialiased;}

  /* ── NAV ── */
  nav{display:flex;align-items:center;justify-content:space-between;padding:16px var(--px);background:rgba(14,14,14,0.85);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);position:sticky;top:0;z-index:100;}
  .logo{font-family:var(--font-d);font-size:22px;letter-spacing:2px;color:var(--accent);cursor:pointer;flex-shrink:0;}
  .logo span{color:rgba(192,251,96,0.55);}
  [data-theme="light"] .logo span{color:rgba(123,176,22,0.55);}
  .nav-links{display:flex;align-items:center;gap:4px;}
  .nav-link{padding:6px 12px;border-radius:8px;font-size:13px;color:var(--text2);cursor:pointer;border:none;background:none;font-family:var(--font-b);transition:all .15s;white-space:nowrap;font-weight:400;}
  .nav-link:hover,.nav-link.active{background:var(--surface);color:var(--text);}
  .nav-btn{padding:7px 16px;border-radius:8px;background:linear-gradient(135deg,#c0fb60,#7bb016);color:#3f5e00;font-size:13px;font-weight:500;cursor:pointer;border:none;font-family:var(--font-b);transition:all .15s;white-space:nowrap;}
  .nav-btn:hover{opacity:.88;}

  /* ── HAMBURGER + MOBILE MENU ── */
  .hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:4px;background:none;border:none;}
  .hamburger span{display:block;width:22px;height:2px;background:var(--text2);border-radius:2px;transition:all .2s;}
  .mobile-menu{display:none;position:fixed;inset:0;background:var(--card);z-index:200;flex-direction:column;padding:24px var(--px);}
  .mobile-menu.open{display:flex;}
  .mobile-menu-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:32px;}
  .mobile-close{background:none;border:none;color:var(--text2);font-size:24px;cursor:pointer;line-height:1;}
  .mobile-nav-links{display:flex;flex-direction:column;gap:4px;}
  .mobile-nav-link{padding:14px 16px;border-radius:10px;font-size:18px;color:var(--text2);cursor:pointer;border:none;background:none;font-family:var(--font-b);transition:all .15s;text-align:left;width:100%;}
  .mobile-nav-link:hover,.mobile-nav-link.active{background:var(--surface);color:var(--text);}
  .mobile-nav-btn{margin-top:16px;padding:14px;border-radius:10px;background:linear-gradient(135deg,#c0fb60,#7bb016);color:#3f5e00;font-size:16px;font-weight:500;cursor:pointer;border:none;font-family:var(--font-b);width:100%;}

  /* ── PAGES ── */
  .page{display:none;}.page.active{display:block;}

  /* ── HERO ── */
  .hero{padding:56px var(--px) 40px;max-width:860px;margin:0 auto;}
  .hero-tag{display:inline-flex;align-items:center;gap:8px;padding:5px 14px;border-radius:999px;border:1px solid rgba(72,72,71,0.20);font-size:11px;color:var(--text2);margin-bottom:24px;letter-spacing:.06em;text-transform:uppercase;background:var(--card);}
  .dot{width:6px;height:6px;border-radius:50%;background:var(--accent);animation:pulse 2s infinite;flex-shrink:0;}
  @keyframes pulse{0%,100%{opacity:1;}50%{opacity:.3;}}
  .hero h1{font-family:var(--font-d);font-size:clamp(52px,12vw,108px);line-height:.92;letter-spacing:2px;margin-bottom:20px;color:var(--text);}
  .hero h1 em{font-style:normal;color:var(--accent);}
  .hero p{font-size:16px;color:var(--text2);max-width:480px;line-height:1.65;margin-bottom:32px;font-weight:300;}
  .hero-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:36px;}
  .btn-primary{padding:13px 24px;border-radius:10px;background:linear-gradient(135deg,#c0fb60,#7bb016);color:#3f5e00;font-size:14px;font-weight:500;cursor:pointer;border:none;font-family:var(--font-b);transition:all .15s;display:inline-flex;align-items:center;gap:8px;}
  .btn-primary:hover{opacity:.88;}
  .btn-ghost{padding:13px 24px;border-radius:10px;background:transparent;color:var(--text);font-size:14px;cursor:pointer;border:1px solid rgba(72,72,71,0.20);font-family:var(--font-b);transition:all .15s;}
  .btn-ghost:hover{border-color:rgba(72,72,71,0.45);color:var(--text);}
  .sports-row{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:52px;}
  .sport-pill{padding:7px 16px;border-radius:999px;background:var(--card);border:none;font-size:12px;color:var(--text2);letter-spacing:.03em;display:inline-flex;align-items:center;gap:6px;}
  .sport-pill.active-sport{border-color:var(--accent);color:var(--accent);background:var(--accent-soft);}
  .cs-tag{font-size:8px;background:var(--surface);border:none;color:var(--text3);padding:2px 5px;border-radius:3px;letter-spacing:.05em;font-weight:500;}

  /* ── PREVIEW CARD ── */
  .preview-section{padding:0 var(--px) 60px;max-width:860px;margin:0 auto;}
  .preview-card{background:var(--card);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-lg);}
  .preview-topbar{display:flex;align-items:center;gap:7px;padding:12px 16px;}
  .tb-dot{width:8px;height:8px;border-radius:50%;background:#484847;}
  .preview-body{display:grid;grid-template-columns:1fr 1fr;min-height:240px;}
  .preview-left{padding:20px;display:flex;flex-direction:column;gap:12px;background:var(--surface);}
  .upload-zone{border:1.5px dashed rgba(72,72,71,0.20);border-radius:10px;padding:24px 12px;text-align:center;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;cursor:pointer;transition:all .2s;background:var(--surface);}
  .upload-zone:hover{border-color:#c0fb60;background:var(--accent-soft);}
  .u-icon{width:34px;height:34px;background:var(--bg);border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:15px;}
  .upload-zone strong{font-size:12px;color:var(--text);font-weight:500;}
  .upload-zone p{font-size:11px;color:var(--text2);}
  .preview-right{padding:20px;}
  .sec-label{font-size:10px;letter-spacing:.1em;color:var(--text3);text-transform:uppercase;margin-bottom:10px;font-weight:500;}
  .clip-list{display:flex;flex-direction:column;gap:6px;}
  .clip-item{display:flex;align-items:center;gap:8px;padding:8px;border-radius:7px;background:var(--surface);cursor:pointer;transition:all .15s;}
  .clip-item:hover{background:var(--surface);filter:brightness(.97);}
  .clip-thumb{width:40px;height:28px;border-radius:4px;background:var(--surface);display:flex;align-items:center;justify-content:center;font-size:11px;flex-shrink:0;position:relative;overflow:hidden;}
  .clip-bar{position:absolute;bottom:0;left:0;right:0;height:2px;background:var(--accent);}
  .clip-meta{flex:1;min-width:0;}
  .clip-name{font-size:11px;font-weight:500;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .clip-time{font-size:10px;color:var(--text2);}
  .clip-badge{font-size:8px;padding:2px 6px;border-radius:3px;background:var(--accent-soft);color:var(--accent-h);font-weight:600;white-space:nowrap;flex-shrink:0;}

  /* ── PRICING ── */
  .pricing-section{padding:40px var(--px) 60px;max-width:860px;margin:0 auto;}
  .sec-title{font-family:var(--font-d);font-size:clamp(36px,6vw,48px);letter-spacing:1px;margin-bottom:8px;color:var(--text);}
  .pricing-note{font-size:12px;color:var(--text3);margin-bottom:24px;display:flex;align-items:center;gap:6px;}
  .pricing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;}
  .price-card{background:var(--card);border-radius:var(--radius);padding:24px 20px;position:relative;box-shadow:var(--shadow);}
  .price-card.featured{border-color:var(--accent);border-top:3px solid var(--accent);}
  .price-badge{position:absolute;top:-10px;left:18px;background:var(--accent);color:#3f5e00;font-size:8px;font-weight:600;padding:3px 8px;border-radius:3px;letter-spacing:.06em;}
  .price-tier{font-size:10px;color:var(--text3);letter-spacing:.1em;text-transform:uppercase;margin-bottom:8px;font-weight:500;}
  .price-amount{font-family:var(--font-d);font-size:32px;letter-spacing:1px;line-height:1;margin-bottom:4px;color:var(--text);transition:opacity .15s;}
  .price-amount.updating{opacity:0;}
  .price-sub{font-size:10px;color:var(--text3);margin-bottom:16px;}
  .price-features{display:flex;flex-direction:column;gap:8px;margin-bottom:16px;}
  .price-feat{display:flex;align-items:center;gap:7px;font-size:11px;color:var(--text2);}
  .feat-check{width:14px;height:14px;border-radius:50%;background:var(--accent-soft);display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:7px;color:var(--accent);}
  .price-btn{width:100%;padding:10px;border-radius:8px;font-size:11px;font-weight:500;cursor:pointer;font-family:var(--font-b);transition:all .15s;border:1px solid rgba(72,72,71,0.20);background:transparent;color:var(--text2);}
  .price-btn:hover{border-color:rgba(72,72,71,0.45);color:var(--text);}
  .price-btn.pl{background:linear-gradient(135deg,#c0fb60,#7bb016);color:#3f5e00;border:none;}
  .price-btn.pl:hover{opacity:.88;}

  /* ── INNER PAGES ── */
  .inner-page{padding:36px var(--px);max-width:860px;margin:0 auto;}
  .pg-heading{font-family:var(--font-d);font-size:clamp(36px,7vw,48px);letter-spacing:1px;margin-bottom:6px;color:var(--text);}
  .pg-sub{font-size:14px;color:var(--text2);margin-bottom:32px;font-weight:300;}
  .how-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:40px;}
  .how-step{background:var(--card);border-radius:var(--radius);padding:22px 20px;box-shadow:var(--shadow);}
  .step-num{font-family:var(--font-d);font-size:36px;color:var(--accent);line-height:1;margin-bottom:10px;}
  .step-title{font-size:13px;font-weight:500;margin-bottom:5px;color:var(--text);}
  .step-desc{font-size:12px;color:var(--text2);line-height:1.6;}

  /* ── EXAMPLE REEL ── */
  .example-reel{background:var(--card);border-radius:var(--radius);overflow:hidden;margin-bottom:28px;box-shadow:var(--shadow-lg);}
  .reel-header{padding:16px 20px;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;background:var(--surface);}
  .reel-title{font-size:13px;font-weight:500;color:var(--text);}
  .reel-meta{font-size:11px;color:var(--text2);}
  .reel-player{background:#1a1a1a;height:180px;display:flex;align-items:center;justify-content:center;position:relative;}
  .play-btn{width:48px;height:48px;border-radius:50%;background:var(--accent);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .15s;}
  .play-btn:hover{background:var(--accent-h);transform:scale(1.05);}
  .play-tri{width:0;height:0;border-top:9px solid transparent;border-bottom:9px solid transparent;border-left:15px solid #fff;margin-left:3px;}
  .reel-duration{position:absolute;bottom:10px;right:12px;font-size:10px;color:#ccc;background:rgba(0,0,0,.6);padding:2px 7px;border-radius:4px;}
  .reel-sport-tag{position:absolute;top:10px;left:12px;font-size:9px;color:var(--accent);background:var(--accent-soft);padding:3px 9px;border-radius:4px;font-weight:500;letter-spacing:.05em;}
  .clips-grid{padding:16px 20px;display:grid;grid-template-columns:repeat(4,1fr);gap:8px;}
  .ex-clip{border-radius:8px;overflow:hidden;border:none;cursor:pointer;transition:all .15s;background:var(--card);}
  .ex-clip:hover{transform:translateY(-2px);box-shadow:var(--shadow);}
  .ex-clip-thumb{height:60px;background:var(--surface);display:flex;align-items:center;justify-content:center;font-size:18px;position:relative;}
  .ex-clip-bar{position:absolute;bottom:0;left:0;right:0;height:2px;background:var(--accent);}
  .ex-clip-info{padding:7px 8px;background:var(--surface);}
  .ex-clip-type{font-size:9px;color:var(--accent);font-weight:600;margin-bottom:2px;}
  .ex-clip-time{font-size:9px;color:var(--text2);}

  /* ── STATS ── */
  .stats-demo{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:24px;}
  .stat-d{background:var(--card);border-radius:12px;padding:18px;box-shadow:var(--shadow);}
  .stat-d-label{font-size:10px;color:var(--text3);text-transform:uppercase;letter-spacing:.08em;margin-bottom:5px;font-weight:500;}
  .stat-d-val{font-family:var(--font-d);font-size:32px;letter-spacing:1px;line-height:1;color:var(--text);}
  .stat-d-unit{font-size:12px;font-family:var(--font-b);font-weight:400;color:var(--text3);margin-left:2px;}

  /* ── CTA BAR ── */
  .cta-bar{background:var(--card);border:2px solid var(--accent);border-radius:var(--radius);padding:24px 20px;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;box-shadow:var(--shadow);}
  .cta-text h3{font-size:17px;font-weight:500;margin-bottom:3px;color:var(--text);}
  .cta-text p{font-size:12px;color:var(--text2);}

  /* ── UPLOAD PAGE ── */
  .upload-big{border:2px dashed rgba(72,72,71,0.20);border-radius:var(--radius);padding:48px var(--px);text-align:center;display:flex;flex-direction:column;align-items:center;gap:12px;cursor:pointer;transition:all .2s;background:var(--card);margin-bottom:24px;box-shadow:var(--shadow);}
  .upload-big:hover,.upload-big.drag{border-color:#c0fb60;background:var(--accent-soft);}
  .ub-icon{width:52px;height:52px;border-radius:14px;background:var(--surface);display:flex;align-items:center;justify-content:center;font-size:22px;}
  .upload-big h3{font-size:16px;font-weight:500;color:var(--text);}
  .upload-big p{font-size:12px;color:var(--text3);}
  .sport-select-label{font-size:10px;color:var(--text3);font-weight:500;letter-spacing:.08em;text-transform:uppercase;margin-bottom:8px;}
  .sport-row{display:flex;gap:7px;margin-bottom:20px;}
  .sport-btn{flex:1;padding:11px 6px;border-radius:9px;background:var(--card);border:none;color:var(--text2);font-size:11px;cursor:pointer;font-family:var(--font-b);transition:all .15s;display:flex;flex-direction:column;align-items:center;gap:4px;position:relative;box-shadow:var(--shadow);}
  .sport-btn.sel{border-color:var(--accent);color:var(--accent);background:var(--accent-soft);}
  .sport-btn.soon{cursor:default;opacity:0.35;pointer-events:none;}
  .sport-btn .sico{font-size:18px;}
  .sport-btn .sname{font-size:9px;font-weight:500;letter-spacing:.05em;}
  .soon-badge{position:absolute;top:-7px;left:50%;transform:translateX(-50%);background:var(--surface);border:none;color:var(--text3);font-size:7px;padding:2px 5px;border-radius:2px;letter-spacing:.05em;white-space:nowrap;}
  .proc-btn{width:100%;padding:15px;border-radius:12px;background:linear-gradient(135deg,#c0fb60,#7bb016);color:#3f5e00;font-size:15px;font-weight:500;cursor:pointer;border:none;font-family:var(--font-b);transition:all .15s;display:flex;align-items:center;justify-content:center;gap:8px;}
  .proc-btn:hover{opacity:.88;}
  .proc-btn.loading{background:var(--surface);color:var(--text2);cursor:wait;}

  /* ── PROGRESS BOX ── */
  .prog-box{background:var(--card);border-radius:var(--radius);padding:20px;margin-top:16px;display:none;box-shadow:var(--shadow);}
  .prog-box.show{display:block;}
  .prog-bar-wrap{height:3px;background:var(--surface);border-radius:2px;margin:12px 0;overflow:hidden;}
  .prog-bar-fill{height:100%;background:var(--accent);border-radius:2px;transition:width .5s ease;}
  .prog-step{display:flex;align-items:center;gap:10px;padding:9px 0;}
  .prog-step+.prog-step{border-top:1px solid rgba(72,72,71,0.12);}
  .step-ind{width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:10px;flex-shrink:0;transition:all .3s;}
  .step-ind.pending{background:var(--surface);border:1px solid var(--border);color:var(--text3);}
  .step-ind.active{background:var(--accent-soft);border:1px solid var(--accent);color:var(--accent);}
  .step-ind.done{background:var(--accent);color:#fff;}
  .step-info{flex:1;}
  .step-t{font-size:12px;font-weight:500;color:var(--text);}
  .step-d{font-size:10px;color:var(--text3);margin-top:1px;}
  .step-time{font-size:10px;color:var(--text3);}

  /* ── DASHBOARD ── */
  .dash-top{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:20px;gap:16px;flex-wrap:wrap;}
  .usage-side{display:flex;flex-direction:column;align-items:flex-end;gap:4px;}
  .usage-lbl{font-size:11px;color:var(--text3);}
  .usage-track{width:100px;height:3px;background:var(--surface);border-radius:2px;overflow:hidden;}
  .usage-fill-bar{height:100%;background:var(--accent);border-radius:2px;}
  .stats-row{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:24px;}
  .stat-c{background:var(--card);border-radius:12px;padding:18px;box-shadow:var(--shadow);}
  .stat-lbl{font-size:10px;color:var(--text3);text-transform:uppercase;letter-spacing:.07em;margin-bottom:5px;font-weight:500;}
  .stat-val{font-family:var(--font-d);font-size:32px;letter-spacing:1px;line-height:1;color:var(--text);}
  .stat-unit{font-size:11px;font-family:var(--font-b);font-weight:400;color:var(--text3);margin-left:2px;}
  .hist-label{font-size:10px;font-weight:500;color:var(--text3);text-transform:uppercase;letter-spacing:.08em;margin-bottom:10px;}
  .hist-list{display:flex;flex-direction:column;gap:7px;}
  .hist-item{display:flex;align-items:center;gap:12px;padding:12px 14px;background:var(--card);border-radius:12px;cursor:pointer;transition:all .15s;box-shadow:var(--shadow);}
  .hist-item:hover{box-shadow:var(--shadow-lg);transform:translateY(-1px);}
  .hist-thumb{width:56px;height:38px;border-radius:6px;background:var(--surface);display:flex;align-items:center;justify-content:center;font-size:17px;flex-shrink:0;position:relative;overflow:hidden;}
  .thumb-tag{position:absolute;bottom:0;left:0;right:0;background:rgba(0,0,0,.65);font-size:7px;font-weight:500;letter-spacing:.05em;text-align:center;padding:2px;color:#999;}
  .hist-main{flex:1;min-width:0;}
  .hist-name{font-size:13px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--text);}
  .hist-meta{font-size:11px;color:var(--text2);margin-top:3px;display:flex;gap:10px;flex-wrap:wrap;}
  .h-chips{display:flex;gap:5px;align-items:center;flex-shrink:0;}
  .h-chip{font-size:9px;padding:2px 7px;border-radius:3px;font-weight:500;}
  .h-chip.g{background:var(--accent-soft);color:var(--accent);}
  .h-acts{display:flex;gap:5px;flex-shrink:0;}
  .h-btn{padding:6px 11px;border-radius:6px;font-size:11px;cursor:pointer;font-family:var(--font-b);transition:all .15s;font-weight:500;}
  .h-btn.dl{background:linear-gradient(135deg,#c0fb60,#7bb016);color:#3f5e00;border:none;}
  .h-btn.dl:hover{opacity:.88;}
  .h-btn.vw{background:transparent;color:var(--text2);border:1px solid rgba(72,72,71,0.20);}
  .h-btn.vw:hover{border-color:rgba(72,72,71,0.45);color:var(--text);}
  .empty-state{background:var(--card);border:2px dashed rgba(72,72,71,0.20);border-radius:var(--radius);padding:48px 24px;text-align:center;}
  .empty-state h3{font-size:16px;font-weight:500;margin-bottom:6px;color:var(--text);}
  .empty-state p{font-size:13px;color:var(--text3);margin-bottom:20px;}

  /* ── SUPPORT ── */
  .support-hero{background:var(--surface);padding:40px var(--px);}
  .support-hero-inner{max-width:860px;margin:0 auto;}
  .support-body{padding:36px var(--px);max-width:860px;margin:0 auto;}
  .support-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-bottom:40px;}

  /* ── FAQ ── */
  .faq-section{margin-bottom:40px;}
  .faq-title{font-family:var(--font-d);font-size:28px;letter-spacing:1px;margin-bottom:16px;color:var(--text);}
  .faq-list{display:flex;flex-direction:column;gap:4px;}
  .faq-item{background:var(--card);border-radius:10px;overflow:hidden;box-shadow:var(--shadow);}
  .faq-q{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;cursor:pointer;font-size:13px;font-weight:500;gap:12px;transition:background .15s;color:var(--text);}
  .faq-q:hover{background:var(--surface);}
  .faq-icon{font-size:16px;color:var(--accent);flex-shrink:0;transition:transform .2s;line-height:1;}
  .faq-icon.open{transform:rotate(45deg);}
  .faq-a{display:none;padding:0 16px 14px;font-size:13px;color:var(--text2);line-height:1.65;border-top:1px solid rgba(72,72,71,0.12);}
  .faq-a.open{display:block;padding-top:12px;}

  /* ── TIPS ── */
  .tips-section{}
  .tips-title{font-family:var(--font-d);font-size:28px;letter-spacing:1px;margin-bottom:16px;color:var(--text);}
  .tip-card{background:var(--card);border-radius:10px;padding:16px;display:flex;gap:14px;margin-bottom:8px;box-shadow:var(--shadow);}
  .tip-icon{font-size:22px;flex-shrink:0;line-height:1;margin-top:1px;}
  .tip-content{}
  .tip-title{font-size:13px;font-weight:500;margin-bottom:4px;color:var(--text);}
  .tip-desc{font-size:12px;color:var(--text2);line-height:1.6;}

  /* ── CONTACT ── */
  .contact-section{background:var(--card);border-radius:var(--radius);padding:24px;margin-bottom:32px;box-shadow:var(--shadow);}
  .contact-title{font-family:var(--font-d);font-size:28px;letter-spacing:1px;margin-bottom:4px;color:var(--text);}
  .contact-sub{font-size:13px;color:var(--text2);margin-bottom:20px;}
  .contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px;}
  .form-grp{display:flex;flex-direction:column;gap:5px;}
  .form-lbl{font-size:11px;color:var(--text2);font-weight:500;}
  .form-inp{padding:10px 13px;border-radius:8px;background:var(--surface);border:1px solid rgba(72,72,71,0.20);color:var(--text);font-size:13px;font-family:var(--font-b);outline:none;transition:border-color .15s;}
  .form-inp:focus{border-color:var(--accent);}
  .form-textarea{padding:10px 13px;border-radius:8px;background:var(--surface);border:1px solid rgba(72,72,71,0.20);color:var(--text);font-size:13px;font-family:var(--font-b);outline:none;transition:border-color .15s;resize:vertical;min-height:90px;width:100%;}
  .form-textarea:focus{border-color:var(--accent);}
  .form-sub{padding:11px 24px;border-radius:9px;background:linear-gradient(135deg,#c0fb60,#7bb016);color:#3f5e00;font-size:13px;font-weight:500;cursor:pointer;border:none;font-family:var(--font-b);transition:all .15s;}
  .form-sub:hover{opacity:.88;}


  /* ── AUTH MODAL ── */
  .modal-overlay{display:none;position:fixed;inset:0;background:rgba(26,26,26,.45);backdrop-filter:blur(4px);z-index:300;align-items:center;justify-content:center;}
  .modal-overlay.show{display:flex;}
  .modal{background:var(--card);border-radius:20px;padding:32px 28px;width:340px;max-width:90vw;box-shadow:var(--shadow-lg);}
  .modal-logo{font-family:var(--font-d);font-size:20px;letter-spacing:2px;color:var(--accent);margin-bottom:4px;}
  .m-title{font-size:19px;font-weight:500;margin-bottom:3px;color:var(--text);}
  .m-sub{font-size:12px;color:var(--text3);margin-bottom:20px;}
  .m-close{float:right;background:none;border:none;color:var(--text3);font-size:18px;cursor:pointer;line-height:1;margin-top:-2px;}
  .divider{display:flex;align-items:center;gap:10px;margin:14px 0;color:var(--text3);font-size:11px;}
  .divider::before,.divider::after{content:'';flex:1;height:1px;background:var(--border);}
  .social-btn{width:100%;padding:10px;border-radius:8px;background:var(--surface);border:1px solid rgba(72,72,71,0.20);color:var(--text2);font-size:12px;cursor:pointer;font-family:var(--font-b);transition:all .15s;display:flex;align-items:center;justify-content:center;gap:8px;margin-bottom:0;}
  .social-btn:hover{border-color:rgba(72,72,71,0.45);color:var(--text);}
  .form-sub-modal{width:100%;padding:11px;border-radius:9px;background:linear-gradient(135deg,#c0fb60,#7bb016);color:#3f5e00;font-size:13px;font-weight:500;cursor:pointer;border:none;font-family:var(--font-b);margin-top:6px;}
  .form-sub-modal:hover{opacity:.88;}
  .m-footer{text-align:center;margin-top:14px;font-size:12px;color:var(--text3);}
  .m-footer a{color:var(--accent);cursor:pointer;font-weight:500;}

  /* ── THEME TOGGLE ── */
  .theme-toggle{background:none;border:none;cursor:pointer;font-size:18px;color:var(--text2);padding:4px 6px;border-radius:6px;transition:color .15s;line-height:1;flex-shrink:0;}
  .theme-toggle:hover{color:var(--text);}

  /* ── ERROR STATE OVERRIDES ── */
  #progError{background:rgba(220,38,38,.12) !important;border-color:rgba(220,38,38,.3) !important;}
  #progErrorTitle{color:#f87171 !important;}
  #progErrorMsg{color:#fca5a5 !important;}
  .step-ind[style*="fef2f2"]{background:rgba(220,38,38,.15) !important;border-color:rgba(220,38,38,.35) !important;color:#f87171 !important;}

  /* ── RESPONSIVE ── */
  @media(max-width:640px){
    :root{--px:20px;}
    .nav-links{display:none;}
    .hamburger{display:flex;}
    .hero{padding:36px var(--px) 28px;}
    .hero h1{font-size:clamp(48px,14vw,72px);}
    .hero p{font-size:15px;}
    .hero-actions{flex-direction:column;align-items:stretch;}
    .btn-primary,.btn-ghost{text-align:center;justify-content:center;}
    .preview-body{grid-template-columns:1fr;}
    .preview-left{border-right:none;border-bottom:none;}
    .pricing-grid{grid-template-columns:1fr;}
    .how-steps{grid-template-columns:1fr;}
    .clips-grid{grid-template-columns:1fr 1fr;}
    .stats-demo,.stats-row{grid-template-columns:repeat(3,1fr);}
    .stat-d-val,.stat-val{font-size:26px;}
    .support-grid{grid-template-columns:1fr;}
    .contact-grid{grid-template-columns:1fr;}
    .h-acts{display:none;}
    .h-chips{margin-left:auto;}
    .cta-bar{flex-direction:column;align-items:flex-start;}
    .dash-top{flex-direction:column;}
    .usage-side{align-items:flex-start;}
  }
  @media(max-width:400px){
    .sports-row{gap:6px;}
    .sport-pill{font-size:11px;padding:6px 12px;}
    .sport-row{gap:5px;}
  }

  /* ── VIDEO PLAYER MODAL ── */
  .player-overlay{display:none;position:fixed;inset:0;background:rgba(26,26,26,.92);z-index:400;align-items:center;justify-content:center;padding:20px;}
  .player-overlay.show{display:flex;}
  .player-modal{width:min(860px,95vw);background:var(--card);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-lg);}
  .player-top{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:var(--surface);}
  .player-title{font-size:13px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;margin-right:12px;color:var(--text);}
  .player-nav{display:flex;align-items:center;gap:6px;flex-shrink:0;}
  .player-nav-btn{padding:5px 10px;border-radius:6px;font-size:11px;cursor:pointer;border:1px solid rgba(72,72,71,0.20);background:transparent;color:var(--text2);font-family:var(--font-b);transition:all .15s;}
  .player-nav-btn:hover{background:var(--surface);color:var(--text);}
  .player-nav-btn:disabled{opacity:.3;cursor:default;}
  .player-close{background:none;border:none;color:var(--text3);font-size:22px;cursor:pointer;line-height:1;flex-shrink:0;}
  .player-video{width:100%;display:block;background:#000;max-height:70vh;}
  .player-footer{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;background:var(--surface);}
  .player-counter{font-size:11px;color:var(--text3);}
  .player-dl{padding:6px 14px;border-radius:6px;background:linear-gradient(135deg,#c0fb60,#7bb016);color:#3f5e00;font-size:11px;font-weight:500;cursor:pointer;border:none;font-family:var(--font-b);text-decoration:none;display:inline-block;}
  .player-dl:hover{opacity:.88;}

  /* ── JOB CARDS (dashboard) ── */
  .job-card{background:var(--card);border-radius:var(--radius);overflow:hidden;margin-bottom:16px;box-shadow:var(--shadow-lg);}
  .job-card-header{padding:14px 20px;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;background:var(--surface);}
  .job-card-title{font-size:13px;font-weight:500;color:var(--text);}
  .job-card-meta{font-size:11px;color:var(--text2);margin-top:2px;}
  .job-card-acts{display:flex;gap:6px;flex-shrink:0;}
  .job-player{position:relative;}
  .job-poster{height:200px;cursor:pointer;overflow:hidden;background:#1a1a1a;display:flex;align-items:center;justify-content:center;position:relative;}
  .job-poster:hover .play-btn{background:var(--accent-h);transform:scale(1.05);}
  .job-poster-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .3s;}
  .job-poster-img.loaded{opacity:1;}
  .job-video{width:100%;display:none;background:#000;max-height:280px;}
  .job-sport-tag{position:absolute;top:10px;left:12px;font-size:9px;color:var(--accent);background:rgba(192,251,96,.12);padding:3px 9px;border-radius:4px;font-weight:500;letter-spacing:.05em;text-transform:uppercase;}
  .job-no-reel{font-size:12px;color:var(--text3);}
  .job-clips-wrap{padding:16px 20px 20px;}
  .job-clips-label{font-size:10px;color:var(--text3);letter-spacing:.08em;text-transform:uppercase;margin-bottom:0;font-weight:500;}
  .clips-nav{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;}
  .clips-nav-btn{width:26px;height:26px;border-radius:5px;background:var(--surface);border:none;color:var(--text2);font-size:13px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s;font-family:var(--font-b);}
  .clips-nav-btn:hover{background:var(--card);color:var(--text);box-shadow:var(--shadow);}
  .job-clips-row{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;}
  .job-clips-row::-webkit-scrollbar{height:3px;}
  .job-clips-row::-webkit-scrollbar-track{background:transparent;}
  .job-clips-row::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px;}
  .jclip{flex-shrink:0;width:130px;border-radius:8px;overflow:hidden;border:none;cursor:pointer;transition:all .15s;background:var(--card);}
  .jclip:hover{border-color:var(--accent);transform:translateY(-2px);box-shadow:var(--shadow);}
  .jclip-thumb{height:72px;background:var(--surface);position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;font-size:22px;}
  .jclip-thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .3s;}
  .jclip-thumb img.loaded{opacity:1;}
  .jclip-bar{position:absolute;bottom:0;left:0;right:0;height:2px;background:var(--accent);}
  .jclip-overlay{position:absolute;inset:0;background:rgba(0,0,0,.35);display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .15s;}
  .jclip:hover .jclip-overlay{opacity:1;}
  .jclip-play{width:26px;height:26px;border-radius:50%;background:var(--accent);display:flex;align-items:center;justify-content:center;}
  .jclip-tri{width:0;height:0;border-top:5px solid transparent;border-bottom:5px solid transparent;border-left:9px solid #fff;margin-left:2px;}
  .jclip-info{padding:7px 8px;background:var(--surface);}
  .jclip-type{font-size:9px;color:var(--accent);font-weight:600;letter-spacing:.03em;margin-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .jclip-dur{font-size:9px;color:var(--text2);}
  .jclip-reel{border-color:rgba(192,251,96,.35);}
  .jclip-reel .jclip-info{background:var(--accent-soft);}
  .jclip.active{border-color:var(--accent) !important;box-shadow:0 0 0 1px var(--accent);}
  .job-desc{padding:10px 20px;font-size:12px;color:var(--text2);font-style:italic;min-height:38px;line-height:1.5;}
  .clips-row-wrap{position:relative;}
  .clips-row-wrap::after{content:'';position:absolute;right:0;top:0;bottom:4px;width:52px;background:linear-gradient(to right,transparent,var(--card));pointer-events:none;border-radius:0 8px 8px 0;}

  /* ── MATCH LIST ── */
  .match-row{display:flex;align-items:center;gap:12px;padding:14px 16px;background:var(--card);border-radius:12px;cursor:pointer;transition:all .15s;margin-bottom:8px;box-shadow:var(--shadow);}
  .match-row:hover{box-shadow:var(--shadow-lg);transform:translateY(-1px);}
  .match-thumb{width:48px;height:36px;border-radius:6px;background:var(--surface);display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0;}
  .match-main{flex:1;min-width:0;}
  .match-name{font-size:13px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--text);}
  .match-meta{font-size:11px;color:var(--text2);margin-top:2px;}
  .match-chip{font-size:9px;padding:3px 8px;border-radius:3px;font-weight:500;flex-shrink:0;}
  .match-chip.g{background:var(--accent-soft);color:var(--accent);}
  .match-arrow{font-size:20px;color:var(--text3);flex-shrink:0;line-height:1;}
  .match-delete{padding:5px 10px;border-radius:6px;background:transparent;border:1px solid rgba(72,72,71,0.20);color:var(--text3);font-size:11px;cursor:pointer;font-family:var(--font-b);transition:all .15s;flex-shrink:0;line-height:1;}
  .match-delete:hover{border-color:#ef4444;color:#ef4444;background:rgba(239,68,68,.06);}

  /* ── DETAIL PAGE ── */
  .detail-back{font-size:13px;color:var(--text2);cursor:pointer;margin-bottom:20px;display:inline-flex;align-items:center;gap:6px;transition:color .15s;background:none;border:none;font-family:var(--font-b);padding:0;}
  .detail-back:hover{color:var(--text);}
  .detail-header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:20px;flex-wrap:wrap;}
  .detail-acts{display:flex;gap:8px;flex-shrink:0;align-items:center;margin-top:6px;}

  /* ── TOAST ── */
  .toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(16px);background:var(--text);color:var(--card);font-size:12px;padding:9px 18px;border-radius:8px;opacity:0;transition:all .25s;pointer-events:none;z-index:500;white-space:nowrap;box-shadow:var(--shadow-lg);}
  .toast.show{opacity:1;transform:translateX(-50%) translateY(0);}

  /* ── AUTH GATE OVERLAY ── */
  .page-relative{position:relative;}
  .auth-gate-overlay{position:absolute;inset:0;backdrop-filter:blur(10px);background:rgba(0,0,0,.4);display:flex;align-items:center;justify-content:center;z-index:10;border-radius:inherit;}
  .auth-gate-overlay.hidden{display:none;}
  .auth-gate-box{background:var(--card);border-radius:20px;padding:36px 28px;text-align:center;width:min(300px,90vw);box-shadow:var(--shadow-lg);}
  .auth-gate-box .lock-icon{font-size:36px;margin-bottom:12px;}
  .auth-gate-box h3{font-size:17px;font-weight:500;margin-bottom:6px;color:var(--text);}
  .auth-gate-box p{font-size:13px;color:var(--text2);margin-bottom:20px;line-height:1.5;}

  /* ── LIGHT THEME ── */
  [data-theme="light"]{
    --bg:#f5f5f3;--card:#ffffff;--surface:#eeeeed;--border:rgba(0,0,0,0.10);
    --accent:#7bb016;--accent-h:#5f8f10;--accent-soft:rgba(123,176,22,.10);
    --text:#1a1a1a;--text2:#6b6b6b;--text3:#999999;
    --shadow:0 4px 16px rgba(0,0,0,0.08);--shadow-lg:0 20px 40px rgba(0,0,0,0.15);
  }
  [data-theme="light"] nav{background:rgba(245,245,243,0.85);}
  [data-theme="light"] .mobile-menu{background:var(--card);}
  [data-theme="light"] .btn-primary,[data-theme="light"] .nav-btn,[data-theme="light"] .mobile-nav-btn,[data-theme="light"] .proc-btn,[data-theme="light"] .form-sub,[data-theme="light"] .form-sub-modal,[data-theme="light"] .price-btn.pl,[data-theme="light"] .player-dl,[data-theme="light"] .h-btn.dl{background:linear-gradient(135deg,#7bb016,#4d7205);color:#fff;}

  /* ── NAV USER ── */
  .nav-user{display:flex;align-items:center;gap:8px;}
  .nav-avatar{width:28px;height:28px;border-radius:50%;background:var(--accent);color:#3f5e00;font-size:12px;font-weight:600;display:flex;align-items:center;justify-content:center;flex-shrink:0;text-transform:uppercase;}
  .nav-username{font-size:13px;color:var(--text);font-weight:500;max-width:100px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  /* ── NAV DROPDOWN ── */
  .nav-avatar-wrap{position:relative;cursor:pointer;}
  .nav-avatar-wrap:hover .nav-avatar{opacity:.85;}
  .nav-dropdown{display:none;position:absolute;top:calc(100% + 8px);right:0;background:var(--card);border:1px solid var(--border);border-radius:12px;padding:6px;min-width:160px;box-shadow:var(--shadow-lg);z-index:300;}
  .nav-dropdown.open{display:block;}
  .nav-dropdown button{display:block;width:100%;padding:9px 12px;text-align:left;background:none;border:none;outline:none;-webkit-appearance:none;appearance:none;color:var(--text2);font-family:var(--font-b);font-size:13px;cursor:pointer;border-radius:8px;transition:all .15s;}
  .nav-dropdown button:hover{background:var(--surface);color:var(--text);}
  .nav-dropdown-hr{border:none;border-top:1px solid var(--border);margin:4px 0;}

  /* ── CONFIRM MODAL ── */
  .confirm-overlay{display:none;position:fixed;inset:0;background:rgba(26,26,26,.55);backdrop-filter:blur(4px);z-index:600;align-items:center;justify-content:center;padding:20px;}
  .confirm-overlay.show{display:flex;}
  .confirm-box{background:var(--card);border-radius:18px;padding:28px 24px;width:min(360px,92vw);box-shadow:var(--shadow-lg);}
  .confirm-title{font-size:16px;font-weight:600;color:var(--text);margin-bottom:6px;}
  .confirm-msg{font-size:13px;color:var(--text2);line-height:1.55;margin-bottom:24px;}
  .confirm-actions{display:flex;flex-direction:column;gap:8px;}
  .confirm-del{width:100%;padding:13px;border-radius:10px;background:#ef4444;color:#fff;font-size:14px;font-weight:500;cursor:pointer;border:none;font-family:var(--font-b);transition:background .15s;}
  .confirm-del:hover{background:#dc2626;}
  .confirm-cancel{width:100%;padding:13px;border-radius:10px;background:var(--surface);color:var(--text2);font-size:14px;cursor:pointer;border:1px solid rgba(72,72,71,0.20);font-family:var(--font-b);transition:all .15s;}
  .confirm-cancel:hover{border-color:rgba(72,72,71,0.45);color:var(--text);}

  /* ── AUTH MODAL ERROR ── */
  .m-error{font-size:12px;color:#f87171;background:rgba(220,38,38,.12);border:1px solid rgba(220,38,38,.3);border-radius:7px;padding:8px 12px;margin-bottom:8px;display:none;}

  @media(max-width:640px){.job-poster{height:160px;}.jclip{width:110px;}.jclip-thumb{height:60px;}.match-name{font-size:12px;}}

  /* ── RENAME INPUT ── */
  .rename-input{font-size:13px;font-weight:500;color:var(--text);background:var(--surface);border:1px solid var(--accent);border-radius:5px;padding:2px 6px;font-family:var(--font-b);width:100%;outline:none;}
  .rename-title{font-size:clamp(22px,5vw,42px);font-weight:900;letter-spacing:-0.5px;padding:4px 10px;width:100%;}

  /* ── SHARE PAGE ── */
  /* ── PLAN BADGE ── */
  .plan-badge{display:inline-block;padding:3px 10px;border-radius:20px;font-size:11px;font-weight:700;letter-spacing:1px;background:var(--surface);color:var(--text2);border:1px solid var(--border);}
  .plan-badge.pro{background:var(--accent);color:#000;}
  .toggle-switch{position:relative;display:inline-block;width:38px;height:22px;}
  .toggle-switch input{opacity:0;width:0;height:0;}
  .toggle-slider{position:absolute;cursor:pointer;inset:0;background:var(--surface);border:1px solid var(--border);border-radius:22px;transition:.2s;}
  .toggle-slider:before{content:'';position:absolute;width:14px;height:14px;left:3px;top:3px;background:var(--text2);border-radius:50%;transition:.2s;}
  .toggle-switch input:checked + .toggle-slider{background:var(--accent);border-color:var(--accent);}
  .toggle-switch input:checked + .toggle-slider:before{transform:translateX(16px);background:#000;}

  .share-brand{margin-bottom:24px;}
  .share-cta{margin-top:32px;padding:24px;background:var(--card);border-radius:14px;text-align:center;border:1px solid var(--border);}

  /* ── SETTINGS PAGE ── */
  .settings-card{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:20px 22px;margin-bottom:16px;}
  .settings-section-title{font-size:11px;font-weight:600;color:var(--text2);text-transform:uppercase;letter-spacing:.06em;margin-bottom:14px;}
  .settings-row{display:flex;align-items:center;justify-content:space-between;padding:8px 0;border-bottom:1px solid var(--border);}
  .settings-row:last-child{border-bottom:none;}
  .settings-label{font-size:13px;color:var(--text2);}
  .settings-value{font-size:13px;color:var(--text);font-weight:500;}
  .settings-msg{font-size:12px;margin-top:8px;min-height:16px;}
  .settings-logout-btn{width:100%;padding:13px;border-radius:10px;background:transparent;color:#ef4444;border:1px solid rgba(239,68,68,.35);font-size:14px;font-weight:500;cursor:pointer;font-family:var(--font-b);transition:all .15s;margin-top:4px;}
  .settings-logout-btn:hover{background:rgba(239,68,68,.08);border-color:#ef4444;}

  /* ── FOOTER ── */
  .site-footer{border-top:1px solid var(--border);padding:32px var(--px);margin-top:48px;}
  .footer-inner{max-width:860px;margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:16px;}
  .footer-logo{font-family:var(--font-d);font-size:18px;letter-spacing:2px;color:var(--accent);}
  .footer-logo span{color:rgba(192,251,96,0.45);}
  .footer-links{display:flex;flex-wrap:wrap;justify-content:center;gap:4px;}
  .footer-links button{background:none;border:none;color:var(--text3);font-size:12px;font-family:var(--font-b);cursor:pointer;padding:4px 10px;border-radius:6px;transition:color .15s;}
  .footer-links button:hover{color:var(--text2);}
  .footer-copy{font-size:11px;color:var(--text3);}

  /* ── LEGAL PAGES ── */
  .legal-page{max-width:720px;}
  .legal-date{font-size:12px;color:var(--text3);margin-bottom:28px;margin-top:-8px;}
  .legal-page p{font-size:14px;color:var(--text2);line-height:1.75;margin-bottom:14px;}
  .legal-page h2{font-size:13px;font-weight:600;color:var(--text);text-transform:uppercase;letter-spacing:.05em;margin:28px 0 10px;}
  .legal-page ul{padding-left:20px;margin-bottom:14px;}
  .legal-page ul li{font-size:14px;color:var(--text2);line-height:1.75;margin-bottom:4px;}
  .legal-table{width:100%;border-collapse:collapse;margin-bottom:14px;font-size:13px;}
  .legal-table th{text-align:left;padding:8px 12px;background:var(--card);color:var(--text2);font-weight:500;border:1px solid var(--border);}
  .legal-table td{padding:8px 12px;color:var(--text2);border:1px solid var(--border);}
  .legal-table tr:hover td{background:var(--surface);}