:root {
      --bg:      #080808;
      --surface: #111111;
      --surface2:#1a1a1a;
      --surface3:#222222;
      --border:  #2e2e2e;
      --border2: #3a3a3a;
      --accent:  #cc1111;
      --accent-bright: #ff2222;
      --accent-dim:    #7a0a0a;
      --grey:    #888888;
      --grey2:   #555555;
      --text:    #ebebeb;
      --muted:   #666666;
      --danger:  #ff3b3b;
    }
    *, *::before, *::after { box-sizing:border-box; margin:0; padding:0; }
    html { scroll-behavior:smooth; }
    body { background:var(--bg); color:var(--text); font-family:'Syne',sans-serif; overflow-x:hidden; }

    
    

    body::after {
      content:''; position:fixed; inset:0;
      background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
      pointer-events:none; z-index:9997; opacity:.3;
    }

    /* NAV */
    nav { position:fixed; top:0; left:0; right:0; z-index:9999; display:flex; align-items:center; justify-content:space-between; padding:18px 52px; border-bottom:1px solid transparent; transition:background .3s,border-color .3s; background:rgba(8,8,8,.97); backdrop-filter:blur(14px); }
    nav.scrolled { background:rgba(8,8,8,.95); border-color:var(--border); backdrop-filter:blur(14px); }
    .nav-logo { font-family:'Bebas Neue',sans-serif; font-size:26px; letter-spacing:4px; color:var(--text); text-decoration:none; }
    .nav-logo .dot { color:var(--accent); }
    .nav-links { display:flex; gap:28px; align-items:center; }
    .nav-links a { color:var(--muted); text-decoration:none; font-size:11px; font-weight:700; letter-spacing:2.5px; text-transform:uppercase; transition:color .2s; }
    .nav-links a:hover { color:var(--text); }
    .nav-links a.active-link { color:var(--accent-bright); }
    .nav-cta { background:var(--accent)!important; color:#fff!important; padding:8px 18px; font-size:10px!important; letter-spacing:2px!important; border:none; transition:background .2s,transform .2s!important; }
    .nav-cta:hover { background:var(--accent-bright)!important; transform:translateY(-1px); }

    /* PAGES */
    section { display:none; position:relative; }
    section.active { display:block; position:relative; }

    /* BUTTONS */
    .btn-primary { background:var(--accent); color:#fff; border:none; padding:15px 34px; font-family:'Syne',sans-serif; font-size:12px; font-weight:700; letter-spacing:2px; text-transform:uppercase;  transition:background .2s,transform .2s,box-shadow .2s; }
    .btn-primary:hover { background:var(--accent-bright); transform:translateY(-2px); box-shadow:0 8px 28px rgba(204,17,17,.35); }
    .btn-outline { background:transparent; color:var(--text); border:1px solid var(--border2); padding:15px 34px; font-family:'Syne',sans-serif; font-size:12px; font-weight:700; letter-spacing:2px; text-transform:uppercase;  transition:border-color .2s,color .2s; }
    .btn-outline:hover { border-color:var(--grey); }
    .btn-buy { background:var(--accent); color:#fff; border:none; padding:11px 22px; font-family:'Syne',sans-serif; font-size:11px; font-weight:700; letter-spacing:2px; text-transform:uppercase;  transition:background .15s,transform .15s,box-shadow .15s; }
    .btn-buy:hover { background:var(--accent-bright); transform:translateY(-1px); box-shadow:0 6px 18px rgba(204,17,17,.35); }
    .btn-full { width:100%; background:var(--accent); color:#fff; border:none; padding:15px; font-family:'Syne',sans-serif; font-size:12px; font-weight:700; letter-spacing:2px; text-transform:uppercase;  transition:background .2s; }
    .btn-full:hover { background:var(--accent-bright); }
    .btn-full:disabled { opacity:.4; }

    /* FORMS */
    .form-group { margin-bottom:14px; }
    .form-group label { display:block; font-family:'Space Mono',monospace; font-size:9px; letter-spacing:2px; color:var(--muted); text-transform:uppercase; margin-bottom:7px; }
    .form-group input, .form-group select { width:100%; background:var(--surface); border:1px solid var(--border); color:var(--text); padding:11px 14px; font-family:'Syne',sans-serif; font-size:13px; outline:none; transition:border-color .2s; }
    .form-group input:focus, .form-group select:focus { border-color:var(--accent); }
    .form-group select { appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 12px center;  }

    /* ═══ HOME ═══ */
    .hero { min-height:0; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; padding:120px 52px 60px; position:relative; overflow:hidden; }
    .hero-bg { position:absolute; inset:0; background: radial-gradient(ellipse 70% 55% at 72% 48%, rgba(150,10,10,.2) 0%,transparent 65%), radial-gradient(ellipse 35% 40% at 15% 80%, rgba(90,5,5,.12) 0%,transparent 55%); }
    .hero-grid { position:absolute; inset:0; background-image:linear-gradient(var(--border) 1px,transparent 1px),linear-gradient(90deg,var(--border) 1px,transparent 1px); background-size:64px 64px; opacity:.22; mask-image:radial-gradient(ellipse at center,black 0%,transparent 72%); }
    .hero-tag { font-family:'Space Mono',monospace; font-size:10px; letter-spacing:4px; color:var(--accent); text-transform:uppercase; margin-bottom:14px; position:relative; display:flex; align-items:center; justify-content:center; gap:12px; }
    .hero-tag::before { content:''; width:36px; height:1px; background:var(--accent); }
    .hero-tag::after { content:''; width:36px; height:1px; background:var(--accent); }
    .hero h1 { font-family:'Bebas Neue',sans-serif; font-size:clamp(44px,7vw,96px); line-height:.88; letter-spacing:5px; position:relative; }
    .hero h1 .rl { color:var(--accent); display:block; }
    .hero-sub { font-size:14px; color:var(--muted); max-width:420px; line-height:1.7; margin:16px auto 28px; position:relative; letter-spacing:.4px; text-align:center; }
    .hero-btns { display:flex; gap:14px; position:relative; flex-wrap:wrap; justify-content:center; }

    /* Hero floating mockup */
    .hero-visual { position:absolute; right:52px; top:50%; transform:translateY(-50%); width:300px; pointer-events:none; opacity:.7; }
    .pm-wrap { background:var(--surface3); border:1px solid var(--border2); border-radius:3px; box-shadow:0 24px 60px rgba(0,0,0,.9),0 0 0 1px rgba(204,17,17,.07); }
    .pm-header { height:30px; background:#0e0e0e; border-bottom:1px solid var(--border); display:flex; align-items:center; padding:0 10px; gap:7px; }
    .pm-dot { width:7px; height:7px; border-radius:50%; }
    .pm-title { font-family:'Bebas Neue',sans-serif; font-size:11px; letter-spacing:3px; color:var(--accent); margin-left:auto; margin-right:4px; }
    .pm-body { padding:16px 14px; display:flex; flex-direction:column; gap:12px; }
    .pm-knobs { display:flex; gap:14px; justify-content:center; }
    .pm-kg { display:flex; flex-direction:column; align-items:center; gap:5px; }
    .pm-knob { width:36px; height:36px; border-radius:50%; border:1.5px solid var(--border2); position:relative; }
    .pm-knob::after { content:''; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:22px; height:22px; background:var(--surface); border-radius:50%; border:1px solid var(--border); }
    .pm-kl { font-family:'Space Mono',monospace; font-size:7px; letter-spacing:1.5px; color:var(--muted); text-transform:uppercase; }
    .pm-meter { height:16px; background:var(--surface); border:1px solid var(--border); overflow:hidden; }
    .pm-fill { height:100%; background:linear-gradient(90deg,var(--accent-dim),var(--accent-bright)); }
    .pm-wave { width:100%; height:28px; }

    /* Marquee */
    .marquee-wrap { overflow:hidden; border-top:1px solid var(--border); border-bottom:1px solid var(--border); padding:12px 0; background:var(--surface); }
    .marquee-track { display:flex; gap:56px; animation:marquee 22s linear infinite; white-space:nowrap; }
    .marquee-item { font-family:'Bebas Neue',sans-serif; font-size:15px; letter-spacing:4px; color:var(--grey2); display:flex; align-items:center; gap:56px; flex-shrink:0; }
    .marquee-item em { color:var(--accent); font-style:normal; font-size:9px; }
    @keyframes marquee { from{transform:translateX(0)} to{transform:translateX(-50%)} }

    /* Featured */
    .featured-section { padding:80px 52px; border-top:1px solid var(--border); background:var(--surface); position:relative; overflow:hidden; }
    .featured-section::before { content:''; position:absolute; top:0; left:0; right:0; height:1px; background:linear-gradient(90deg,transparent,var(--accent),transparent); opacity:.45; }
    .section-label { font-family:'Space Mono',monospace; font-size:10px; letter-spacing:4px; color:var(--accent); text-transform:uppercase; margin-bottom:36px; display:flex; align-items:center; gap:12px; }
    .section-label::before { content:''; width:28px; height:1px; background:var(--accent); }
    .featured-card { display:grid; grid-template-columns:1fr 1fr; border:1px solid rgba(255,255,255,.07); background:rgba(12,12,12,.95); max-width:1000px; box-shadow:0 24px 80px rgba(0,0,0,.8), 0 0 0 1px rgba(180,10,10,.08); overflow:hidden; }
    .featured-visual { background:var(--surface2); border-right:1px solid var(--border); padding:44px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:16px; position:relative; overflow:hidden; min-height:340px; }
    .featured-visual::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse at center,rgba(170,10,10,.1) 0%,transparent 65%); }
    .featured-info { padding:40px; display:flex; flex-direction:column; justify-content:space-between; box-shadow:inset 0 0 60px rgba(0,0,0,.6), 4px 0 32px rgba(0,0,0,.5); }
    .featured-badge { display:inline-flex; background:var(--accent); color:#fff; font-family:'Space Mono',monospace; font-size:8px; letter-spacing:2px; padding:3px 9px; text-transform:uppercase; width:fit-content; margin-bottom:14px; }
    .featured-name { font-family:'Bebas Neue',sans-serif; font-size:52px; letter-spacing:3px; line-height:.95; margin-bottom:14px; }
    .featured-desc { font-size:13px; color:var(--muted); line-height:1.75; letter-spacing:.3px; margin-bottom:20px; text-shadow:0 1px 8px rgba(0,0,0,.7); }
    .featured-specs { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:28px; }
    .spec-chip { font-family:'Space Mono',monospace; font-size:8px; letter-spacing:1.5px; color:var(--grey2); border:1px solid var(--border); padding:3px 8px; }
    .featured-price-row { display:flex; align-items:center; justify-content:space-between; padding-top:20px; border-top:1px solid var(--border); }
    .featured-price { font-family:'Bebas Neue',sans-serif; font-size:56px; letter-spacing:2px; }
    .featured-price sup { font-size:22px; vertical-align:super; color:var(--accent); }

    /* ═══ SHOP ═══ */
    .page-header { padding:130px 52px 48px; border-bottom:1px solid var(--border); background:var(--surface); position:relative; overflow:hidden; }
    .page-header::after { content:''; position:absolute; bottom:0; left:0; right:0; height:1px; background:linear-gradient(90deg,var(--accent),transparent); }
    .page-header h2 { font-family:'Bebas Neue',sans-serif; font-size:clamp(48px,8vw,96px); letter-spacing:4px; line-height:.95; }
    .page-header h2 em { color:var(--accent); font-style:normal; }
    .page-header p { color:var(--muted); margin-top:10px; font-size:13px; letter-spacing:.5px; }
    .shop-filters { display:flex; gap:0; border-bottom:1px solid var(--border); background:var(--surface); padding:0 52px; }
    .filter-btn { background:none; border:none; border-bottom:2px solid transparent; color:var(--muted); font-family:'Syne',sans-serif; font-size:11px; font-weight:700; letter-spacing:2px; text-transform:uppercase; padding:15px 18px;  transition:color .2s,border-color .2s; margin-bottom:-1px; }
    .filter-btn:hover { color:var(--text); }
    .filter-btn.active { color:var(--accent); border-bottom-color:var(--accent); }
    .products-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:1px; background:var(--border); border-top:1px solid var(--border); }
    .product-card { background:var(--bg); padding:34px; display:flex; flex-direction:column; gap:16px; transition:background .2s; position:relative; overflow:hidden; }
    .product-card:hover { background:var(--surface); }
    .product-card::before { content:''; position:absolute; top:0; left:0; right:0; height:2px; background:linear-gradient(90deg,var(--accent),transparent); opacity:0; transition:opacity .3s; }
    .product-card:hover::before { opacity:1; }
    .product-badge { display:inline-flex; background:var(--accent); color:#fff; font-family:'Space Mono',monospace; font-size:8px; letter-spacing:2px; padding:3px 9px; text-transform:uppercase; width:fit-content; }
    .product-badge.sale { background:var(--grey2); }
    .product-badge.new { background:#990f0f; }
    .product-visual { height:148px; background:var(--surface2); border:1px solid var(--border); display:flex; align-items:center; justify-content:center; overflow:hidden; position:relative; }
    .product-visual-txt { font-family:'Bebas Neue',sans-serif; font-size:42px; letter-spacing:4px; color:var(--border2); user-select:none; }
    .product-visual::after { content:''; position:absolute; bottom:0; left:0; right:0; height:28px; background:linear-gradient(to top,var(--surface2),transparent); }
    .product-name { font-family:'Bebas Neue',sans-serif; font-size:26px; letter-spacing:3px; }
    .product-desc { font-size:12px; color:var(--muted); line-height:1.75; letter-spacing:.3px; }
    .product-specs { display:flex; gap:7px; flex-wrap:wrap; }
    .spec-tag { font-family:'Space Mono',monospace; font-size:8px; letter-spacing:1px; color:var(--grey2); border:1px solid var(--border); padding:2px 7px; }
    .product-footer { display:flex; align-items:center; justify-content:space-between; margin-top:auto; padding-top:16px; border-top:1px solid var(--border); }
    .product-price { font-family:'Bebas Neue',sans-serif; font-size:36px; letter-spacing:2px; }
    .product-price sup { font-size:15px; vertical-align:super; color:var(--accent); }
    .bundle-banner { padding:40px 52px; background:var(--surface); border-top:1px solid var(--border); display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap; }
    .bundle-banner h3 { font-family:'Bebas Neue',sans-serif; font-size:34px; letter-spacing:3px; margin-bottom:5px; }
    .bundle-banner h3 span { color:var(--accent); }
    .bundle-banner p { font-size:13px; color:var(--muted); }
    .bundle-price { font-family:'Bebas Neue',sans-serif; font-size:54px; letter-spacing:2px; }
    .bundle-price sup { font-size:20px; vertical-align:super; color:var(--accent); }
    .bundle-price s { font-size:26px; color:var(--grey2); margin-right:8px; font-family:'Bebas Neue',sans-serif; }

    /* ═══ PROFILE ═══ */
    .profile-wrap { max-width:880px; margin:0 auto; padding:130px 24px 80px; }
    .profile-grid { display:grid; grid-template-columns:240px 1fr; gap:1px; background:var(--border); border:1px solid var(--border); }
    .profile-sidebar { background:var(--surface); padding:28px; display:flex; flex-direction:column; gap:2px; }
    .profile-avatar { width:68px; height:68px; border-radius:50%; background:var(--surface3); border:2px solid var(--accent); display:flex; align-items:center; justify-content:center; font-family:'Bebas Neue',sans-serif; font-size:26px; letter-spacing:2px; color:var(--accent); margin-bottom:12px; }
    .profile-username { font-family:'Bebas Neue',sans-serif; font-size:22px; letter-spacing:3px; margin-bottom:4px; }
    .profile-email { font-family:'Space Mono',monospace; font-size:9px; letter-spacing:1px; color:var(--muted); margin-bottom:24px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
    .profile-nav-item { background:none; border:none; color:var(--muted); font-family:'Syne',sans-serif; font-size:11px; font-weight:700; letter-spacing:2px; text-transform:uppercase; padding:10px 10px; text-align:left;  transition:color .2s,background .2s; display:flex; align-items:center; gap:10px; }
    .profile-nav-item:hover { color:var(--text); background:var(--surface2); }
    .profile-nav-item.active { color:var(--accent); background:rgba(204,17,17,.08); }
    .profile-nav-item .icon { width:16px; text-align:center; font-size:13px; }
    .profile-main-pane { background:var(--bg); }
    .profile-panel { display:none; padding:32px; }
    .profile-panel.active { display:block; }
    .profile-panel h3 { font-family:'Bebas Neue',sans-serif; font-size:30px; letter-spacing:3px; margin-bottom:18px; padding-bottom:16px; border-bottom:1px solid var(--border); }
    .profile-panel h3 span { color:var(--accent); }
    .purchase-item { display:flex; align-items:center; justify-content:space-between; padding:18px 22px; background:var(--surface); border:1px solid var(--border); margin-bottom:1px; transition:background .2s; gap:12px; }
    .purchase-item:hover { background:var(--surface2); }
    .purchase-info h5 { font-family:'Bebas Neue',sans-serif; font-size:18px; letter-spacing:2px; margin-bottom:4px; }
    .purchase-info p { font-family:'Space Mono',monospace; font-size:9px; color:var(--muted); letter-spacing:1px; }
    .btn-download { background:none; border:1px solid var(--accent); color:var(--accent); padding:8px 16px; font-family:'Syne',sans-serif; font-size:10px; font-weight:700; letter-spacing:2px; text-transform:uppercase;  text-decoration:none; display:flex; align-items:center; gap:7px; transition:background .2s,color .2s; flex-shrink:0; }
    .btn-download:hover { background:var(--accent); color:#fff; }
    .settings-section { margin-bottom:30px; }
    .settings-section h4 { font-family:'Space Mono',monospace; font-size:9px; letter-spacing:3px; color:var(--muted); text-transform:uppercase; margin-bottom:16px; padding-bottom:10px; border-bottom:1px solid var(--border); }
    .settings-row { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
    .empty-state { padding:44px; text-align:center; border:1px dashed var(--border); }
    .empty-state p { color:var(--muted); font-size:13px; line-height:1.75; margin-bottom:18px; }

    /* ═══ ACCOUNT AUTH ═══ */
    .account-wrap { max-width:500px; margin:0 auto; padding:130px 24px 80px; }
    .auth-tabs { display:flex; border-bottom:1px solid var(--border); margin-bottom:32px; }
    .auth-tab { flex:1; background:none; border:none; border-bottom:2px solid transparent; color:var(--muted); font-family:'Syne',sans-serif; font-size:11px; font-weight:700; letter-spacing:2px; text-transform:uppercase; padding:13px;  margin-bottom:-1px; transition:color .2s,border-color .2s; }
    .auth-tab.active { color:var(--accent); border-bottom-color:var(--accent); }
    .auth-panel { display:none; }
    .auth-panel.active { display:block; }
    .auth-panel h3 { font-family:'Bebas Neue',sans-serif; font-size:44px; letter-spacing:4px; margin-bottom:7px; }
    .auth-panel > p { color:var(--muted); font-size:13px; margin-bottom:26px; line-height:1.65; }

    /* ═══ MODAL ═══ */
    .modal-overlay { position:fixed; inset:0; background:rgba(0,0,0,.88); backdrop-filter:blur(10px); z-index:500; display:flex; align-items:center; justify-content:center; opacity:0; pointer-events:none; transition:opacity .25s; }
    .modal-overlay.open { opacity:1; pointer-events:all; }
    .modal { background:var(--surface); border:1px solid var(--border); border-top:2px solid var(--accent); width:100%; max-width:490px; padding:42px; position:relative; transform:translateY(18px); transition:transform .25s; }
    .modal-overlay.open .modal { transform:translateY(0); }
    .modal-close { position:absolute; top:14px; right:16px; background:none; border:none; color:var(--muted); font-size:20px;  line-height:1; }
    .modal-close:hover { color:var(--text); }
    .modal h3 { font-family:'Bebas Neue',sans-serif; font-size:30px; letter-spacing:3px; margin-bottom:5px; }
    .modal-product-name { color:var(--accent); }
    .modal p { font-size:12px; color:var(--muted); margin-bottom:22px; line-height:1.65; }
    .modal-price-row { display:flex; align-items:center; justify-content:space-between; padding:13px 0; border-top:1px solid var(--border); border-bottom:1px solid var(--border); margin:18px 0; }
    .modal-price-label { font-size:12px; color:var(--muted); letter-spacing:1px; }
    .modal-price-val { font-family:'Bebas Neue',sans-serif; font-size:28px; letter-spacing:2px; color:var(--accent); }
    .modal-note { font-size:10px!important; margin-top:10px; margin-bottom:0!important; text-align:center; color:var(--muted); }
    .success-box { text-align:center; padding:16px 0; }
    .success-icon { width:56px; height:56px; border:2px solid var(--accent); border-radius:50%; display:flex; align-items:center; justify-content:center; margin:0 auto 20px; font-size:24px; color:var(--accent); }
    .success-box h3 { font-family:'Bebas Neue',sans-serif; font-size:28px; letter-spacing:3px; margin-bottom:10px; }
    .success-box p { color:var(--muted); font-size:13px; line-height:1.65; }

    /* TOAST */
    .toast { position:fixed; bottom:26px; right:26px; background:var(--surface); border:1px solid var(--border); border-left:3px solid var(--accent); padding:13px 20px; font-size:12px; z-index:9996; transform:translateY(70px); opacity:0; transition:transform .3s,opacity .3s; max-width:300px; line-height:1.5; }
    .toast.show { transform:translateY(0); opacity:1; }
    .toast.error { border-left-color:var(--danger); }

    /* FOOTER */
    footer { border-top:1px solid var(--border); padding:34px 52px; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:14px; background:var(--surface); }
    .footer-logo { font-family:'Bebas Neue',sans-serif; font-size:17px; letter-spacing:4px; color:var(--muted); }
    .footer-logo span { color:var(--accent); }
    footer p { font-size:11px; color:var(--muted); letter-spacing:.8px; }
    .footer-links { display:flex; gap:18px; }
    .footer-links a { font-size:11px; color:var(--muted); text-decoration:none; letter-spacing:1.5px; text-transform:uppercase; transition:color .2s; }
    .footer-links a:hover { color:var(--accent); }

    /* Guard box */
    .guard-box { max-width:500px; margin:0 auto; padding:140px 24px; text-align:center; }
    .guard-box p { font-family:'Bebas Neue',sans-serif; font-size:26px; letter-spacing:3px; color:var(--muted); margin-bottom:28px; }

    @media(max-width:768px){
      nav { padding:14px 20px; }
      .hero { padding:110px 20px 60px; }
      .hero-visual { display:none; }
      .featured-section { padding:48px 20px; }
      .featured-card { grid-template-columns:1fr; }
      .featured-visual { border-right:none; border-bottom:1px solid var(--border); }
      .page-header { padding:110px 20px 36px; }
      .shop-filters { padding:0 20px; }
      .products-grid { grid-template-columns:1fr; }
      .product-card { padding:22px; }
      .bundle-banner { padding:28px 20px; }
      .profile-grid { grid-template-columns:1fr; }
      .settings-row { grid-template-columns:1fr; }
      footer { padding:26px 20px; }
      .profile-wrap { padding:110px 14px 60px; }
    }