
:root{
  --bg:#06000e;--bg2:#0c0018;--bg3:#110020;--bg4:#18002e;
  --red:#cc0000;--pur:#5500aa;--pur2:#7722cc;
  --ice:#f0f0f0;--ice2:#a0a0a0;--ice3:#555;
  --g1:#222;--g2:#333;--g3:#444;
  --green:#00c853;--amber:#ff8f00;
  --sr:0 0 20px rgba(204,0,0,.55),0 0 40px rgba(204,0,0,.2);
  --sp:0 0 20px rgba(136,0,238,.5);
  --ft:"Bebas Neue",sans-serif;
  --fb:"Rajdhani",sans-serif;
  --fm:"Share Tech Mono",monospace;
  --fg:"Permanent Marker",cursive;
}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{scroll-behavior:smooth}
body{font-family:var(--fb);background:var(--bg);color:var(--ice);overflow-x:hidden}
button{cursor:pointer;touch-action:manipulation;font-family:inherit}
a{cursor:pointer}
::-webkit-scrollbar{width:3px}
::-webkit-scrollbar-thumb{background:var(--red)}
::selection{background:var(--red);color:#000}

/* LOADER */
#ldr{position:fixed;inset:0;background:var(--bg);z-index:9999;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;transition:opacity .5s,visibility .5s}
#ldr.hide{opacity:0;visibility:hidden;pointer-events:none}
.ldr-logo{font-family:var(--fg);font-size:58px;color:var(--ice);text-shadow:3px 3px 0 var(--red)}
.ldr-bar{width:160px;height:2px;background:var(--g2);overflow:hidden}
.ldr-fill{height:100%;background:linear-gradient(90deg,var(--red),var(--pur));animation:lf 1.5s ease forwards}
@keyframes lf{from{width:0}to{width:100%}}
.ldr-txt{font-family:var(--fm);font-size:10px;letter-spacing:4px;color:var(--ice2)}

/* NAV */
nav{position:fixed;top:0;left:0;right:0;z-index:1000;height:60px;padding:0 40px;display:flex;align-items:center;justify-content:space-between;transition:background .4s,border-color .4s;border-bottom:1px solid transparent}
nav.sc{background:rgba(6,0,14,.95);backdrop-filter:blur(20px);border-bottom-color:rgba(204,0,0,.15)}
.logo{font-family:var(--fg);font-size:22px;color:var(--ice);text-decoration:none;text-shadow:2px 2px 0 var(--red)}
.logo em{font-style:normal;color:var(--red)}
.nav-lnk{display:flex;gap:28px;list-style:none}
.nav-lnk a{font-size:11px;font-weight:700;letter-spacing:3px;text-transform:uppercase;color:rgba(240,240,240,.6);text-decoration:none;transition:color .2s;position:relative}
.nav-lnk a::after{content:'';position:absolute;bottom:-4px;left:0;width:0;height:1px;background:var(--red);transition:width .3s}
.nav-lnk a:hover,.nav-lnk a:hover::after{color:var(--ice);width:100%}
.nav-r{display:flex;align-items:center;gap:10px}
.nic{background:none;border:none;color:rgba(240,240,240,.6);font-size:18px;padding:4px;position:relative;transition:color .2s}
.nic:hover{color:var(--red)}
.cba{position:absolute;top:-2px;right:-4px;width:16px;height:16px;border-radius:50%;background:var(--red);color:#000;font-family:var(--fm);font-size:9px;display:none;align-items:center;justify-content:center}
.cba.on{display:flex}
.bnav{font-family:var(--ft);font-size:13px;letter-spacing:3px;padding:7px 18px;background:transparent;border:1px solid rgba(204,0,0,.5);color:var(--red);transition:all .3s}
.bnav:hover{background:var(--red);color:#000;box-shadow:var(--sr)}
.bnav.adm{border-color:rgba(136,0,238,.5);color:var(--pur2)}
.bnav.adm:hover{background:var(--pur);color:#fff}
.ham{display:none;flex-direction:column;gap:5px;background:none;border:none;padding:4px}
.ham span{width:22px;height:2px;background:var(--ice);display:block;transition:all .3s}
.mnav{display:none;position:fixed;inset:0;background:rgba(6,0,14,.98);z-index:1100;flex-direction:column;align-items:center;justify-content:center;gap:22px}
.mnav.open{display:flex}
.mnav a{font-family:var(--ft);font-size:36px;letter-spacing:5px;color:var(--ice);text-decoration:none;transition:color .2s}
.mnav a:hover{color:var(--red)}

/* HERO */
#hero{position:relative;width:100%;height:100vh;min-height:600px;overflow:hidden;background:var(--bg)}
.hbg{position:absolute;inset:0;background-size:cover;background-position:center top}
.hpc{background-image:url('../images/hero-pc.png')}
.hmb{display:none;background-image:url('../images/hero-mobile.png')}
.hgr{position:absolute;inset:0;background:linear-gradient(to bottom,rgba(6,0,14,.1) 0%,transparent 30%,transparent 50%,rgba(6,0,14,.65) 75%,rgba(6,0,14,1) 100%)}
.hcta{position:absolute;bottom:9%;left:50%;transform:translateX(-50%);text-align:center;width:100%;padding:0 20px;animation:fup .9s .6s both}
@keyframes fup{from{opacity:0;transform:translateX(-50%) translateY(20px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}
.heye{font-family:var(--fm);font-size:11px;letter-spacing:5px;color:rgba(240,240,240,.5);text-transform:uppercase;margin-bottom:14px}
.hbtns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.btn{font-family:var(--ft);font-size:17px;letter-spacing:4px;padding:13px 42px;border:none;transition:all .3s;position:relative;overflow:hidden;clip-path:polygon(8px 0%,100% 0%,calc(100% - 8px) 100%,0% 100%)}
.btn::before{content:'';position:absolute;inset:0;background:rgba(255,255,255,.12);transform:translateX(-110%) skewX(-15deg);transition:transform .4s}
.btn:hover::before{transform:translateX(110%) skewX(-15deg)}
.br{background:var(--red);color:#000}
.br:hover{box-shadow:var(--sr);transform:translateY(-2px)}
.bg{background:transparent;border:1px solid rgba(255,255,255,.35);color:var(--ice)}
.bg:hover{border-color:var(--pur2);color:var(--pur2)}

/* TICKER */
.ticker{background:var(--red);padding:10px 0;overflow:hidden}
.tkt{display:flex;animation:tk 22s linear infinite;white-space:nowrap}
.tki{font-family:var(--ft);font-size:13px;letter-spacing:4px;color:#000;padding:0 28px}
@keyframes tk{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}

/* SECTIONS */
.sec{padding:88px 48px}
.slbl{font-family:var(--fg);font-size:12px;letter-spacing:2px;color:var(--red);display:flex;align-items:center;gap:8px;margin-bottom:10px}
.slbl::before{content:'//';font-family:var(--fm);font-size:10px}
.sh{font-family:var(--ft);font-size:clamp(46px,8vw,96px);line-height:.88;margin-bottom:40px}
.sh em{font-style:normal;color:transparent;-webkit-text-stroke:2px var(--red)}
.rv{opacity:0;transform:translateY(26px);transition:all .7s ease}
.rvl{opacity:0;transform:translateX(-26px);transition:all .7s ease}
.rvr{opacity:0;transform:translateX(26px);transition:all .7s ease}
.rv.in,.rvl.in,.rvr.in{opacity:1;transform:none}

/* DROPS */
#drops{background:var(--bg)}
.dg{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:3px;min-height:280px}
.dc{position:relative;overflow:hidden;aspect-ratio:3/4;background:var(--bg3)}
.dc.big{grid-row:span 2;aspect-ratio:auto}
.ddbg{position:absolute;inset:0;transition:transform .7s}
.dc:hover .ddbg{transform:scale(1.04)}
.dcov{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.45;transition:opacity .5s}
.dc:hover .dcov{opacity:.62}
.dmsk{position:absolute;inset:0;background:linear-gradient(transparent 20%,rgba(6,0,14,.95) 100%)}
.dbody{position:absolute;bottom:0;left:0;right:0;padding:20px}
.dnum{font-family:var(--fm);font-size:10px;letter-spacing:4px;padding:3px 10px;border:1px solid;display:inline-block;margin-bottom:8px;text-transform:uppercase}
.dr{color:#ff4444;border-color:var(--red)}.dp{color:#cc88ff;border-color:var(--pur)}.db{color:#4af;border-color:#4af}
.dname{font-family:var(--ft);font-size:clamp(24px,3.5vw,46px);line-height:1;margin-bottom:5px}
.dsub{font-size:13px;color:var(--ice2);margin-bottom:11px}
.cdrow{display:flex;gap:12px;margin-bottom:11px}
.cdu{text-align:center}
.cdn{font-family:var(--ft);font-size:23px;color:var(--red);line-height:1;display:block}
.cdl{font-size:9px;letter-spacing:3px;color:var(--ice2);text-transform:uppercase}
.dbg1{background:radial-gradient(ellipse 70% 80% at 40% 30%,rgba(204,0,0,.18) 0%,transparent 70%),linear-gradient(160deg,#130005,#06000e)}
.dbg2{background:radial-gradient(ellipse 80% 80% at 60% 50%,rgba(136,0,238,.18) 0%,transparent 70%),linear-gradient(160deg,#0a0018,#06000e)}
.dbg3{background:radial-gradient(ellipse 80% 80% at 40% 60%,rgba(0,160,255,.1) 0%,transparent 70%),linear-gradient(160deg,#000a14,#06000e)}

/* PRODUCTS */
#products{background:var(--bg2)}
.pfr{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:28px}
.pf{font-size:11px;font-weight:700;letter-spacing:3px;text-transform:uppercase;padding:7px 14px;background:transparent;border:1px solid var(--g3);color:var(--ice2);transition:all .2s}
.pf.on,.pf:hover{border-color:var(--red);color:var(--ice);background:rgba(204,0,0,.07)}
.pg{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px}
.pc{background:var(--bg3);border:1px solid var(--g1);overflow:hidden;transition:all .3s;position:relative}
.pc:hover{border-color:rgba(204,0,0,.35);transform:translateY(-4px)}
.pci{aspect-ratio:1;position:relative;overflow:hidden;background:var(--bg4);display:flex;align-items:center;justify-content:center}
.pci img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .4s}
.pc:hover .pci img{transform:scale(1.06)}
.pcem{font-size:56px;opacity:.3;transition:transform .3s}
.pc:hover .pcem{transform:scale(1.06)}
.pbadge{position:absolute;top:9px;left:9px;font-family:var(--fm);font-size:9px;letter-spacing:3px;text-transform:uppercase;padding:3px 8px}
.pb-new{background:var(--red);color:#000}.pb-hot{background:var(--pur);color:#fff}.pb-sale{background:#ff6b00;color:#000}
.pwsh{position:absolute;top:9px;right:9px;width:28px;height:28px;border-radius:50%;background:rgba(6,0,14,.75);border:1px solid var(--g1);display:flex;align-items:center;justify-content:center;font-size:13px;opacity:0;transition:opacity .2s;color:var(--ice2)}
.pc:hover .pwsh{opacity:1}
.pinfo{padding:12px}
.pbrand{font-family:var(--fm);font-size:9px;letter-spacing:3px;color:var(--ice3);text-transform:uppercase;margin-bottom:2px}
.pname{font-size:13px;font-weight:700;line-height:1.3;margin-bottom:7px}
.pbot{display:flex;align-items:center;justify-content:space-between}
.pprice{font-family:var(--fm);font-size:14px}
.pprice s{font-size:11px;color:var(--ice2);margin-right:4px}
.rar{font-size:8px;letter-spacing:2px;text-transform:uppercase;padding:2px 6px;border:1px solid}
.r-common{color:var(--ice2);border-color:var(--g3)}.r-rare{color:#4af;border-color:#4af}.r-epic{color:#c4f;border-color:#c4f}.r-legendary{color:#ffd700;border-color:#ffd700}

/* GRAU */
#grau{position:relative;min-height:80vh;display:flex;align-items:center;overflow:hidden}
.gbg{position:absolute;inset:0;background-image:url('../images/grau-pc.png');background-size:cover;background-position:center;transition:transform .1s linear}
.gbgm{display:none;position:absolute;inset:0;background-image:url('../images/grau-mobile.png');background-size:cover;background-position:center top}
.gmsk{position:absolute;inset:0;background:linear-gradient(90deg,rgba(6,0,14,.93) 35%,rgba(6,0,14,.5) 70%,rgba(6,0,14,.15) 100%)}
.gbody{position:relative;z-index:2;padding:80px 48px;max-width:480px}
.gq{font-family:var(--ft);font-size:clamp(34px,5.5vw,70px);line-height:.9;margin-bottom:22px}
.gq span{color:var(--red);text-shadow:var(--sr)}
.gp{font-size:15px;color:var(--ice2);line-height:1.7;margin-bottom:26px;max-width:360px}
.gtags{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:26px}
.gtag{font-family:var(--fm);font-size:10px;letter-spacing:2px;text-transform:uppercase;padding:4px 11px;border:1px solid rgba(204,0,0,.3);color:rgba(240,240,240,.5)}

/* OUTFIT BUILDER */
#outfit{background:var(--bg)}
.builder{display:grid;grid-template-columns:170px 1fr 250px;gap:16px;margin-top:14px;align-items:start}
.cats{display:flex;flex-direction:column;gap:5px}
.cbtn{display:flex;align-items:center;gap:9px;padding:10px 12px;background:var(--bg3);border:1px solid var(--g1);transition:all .2s;position:relative;overflow:hidden;width:100%;text-align:left}
.cbtn::before{content:'';position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--red);transform:scaleY(0);transition:transform .2s}
.cbtn.on,.cbtn:hover{border-color:rgba(204,0,0,.4);background:rgba(204,0,0,.06)}
.cbtn.on::before{transform:scaleY(1)}
.cico{font-size:17px;width:22px;text-align:center;flex-shrink:0}
.cn{font-size:11px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--ice)}
.cs{font-size:10px;color:var(--ice2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px}
/* Outfit board */
.obw{background:var(--bg3);border:1px solid var(--g1);padding:18px;display:flex;flex-direction:column;align-items:center;gap:12px;min-height:500px;position:relative;overflow:hidden}
.obw::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 80% 50% at 50% 100%,rgba(136,0,238,.07) 0%,transparent 60%);pointer-events:none}
.obt{font-family:var(--fg);font-size:12px;letter-spacing:2px;color:var(--ice2);align-self:flex-start}
.obg{display:grid;grid-template-areas:"cap cap gls" "sht sht chn" "hod hod ." "pts pts pts" "sho sho sho";grid-template-columns:1fr 1fr 1fr;gap:6px;width:100%;max-width:260px}
.obs{border:1px dashed rgba(255,255,255,.1);background:rgba(255,255,255,.02);aspect-ratio:1;display:flex;align-items:center;justify-content:center;transition:all .2s;position:relative;overflow:hidden;cursor:pointer}
.obs:hover{border-color:rgba(204,0,0,.35);background:rgba(204,0,0,.04)}
.obs.has{border-style:solid;border-color:rgba(204,0,0,.35);background:rgba(204,0,0,.04)}
.obs img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:6px;transition:transform .3s}
.obs:hover img{transform:scale(1.06)}
.obem{font-size:22px;opacity:.2;pointer-events:none}
.oblbl{position:absolute;bottom:3px;left:0;right:0;text-align:center;font-family:var(--fm);font-size:7px;letter-spacing:1px;color:var(--ice3);text-transform:uppercase}
.obs.has .oblbl{color:rgba(204,0,0,.6)}
.obrm{position:absolute;top:2px;right:2px;width:14px;height:14px;border-radius:50%;background:rgba(204,0,0,.9);border:none;color:#fff;font-size:8px;display:none;align-items:center;justify-content:center;z-index:5;line-height:1}
.obs.has:hover .obrm{display:flex}
.obsw{aspect-ratio:2/1}
.oc{grid-area:cap}.og{grid-area:gls}.os{grid-area:sht}.oh{grid-area:hod}.och{grid-area:chn}.op{grid-area:pts}.osho{grid-area:sho}
.obm{text-align:center;width:100%}
.obtl{font-family:var(--fm);font-size:10px;letter-spacing:3px;color:var(--ice2);text-transform:uppercase}
.obto{font-family:var(--ft);font-size:34px;color:var(--red);line-height:1}
.obco{font-family:var(--fm);font-size:10px;color:var(--ice3);letter-spacing:2px;margin-top:3px}
.obacts{display:flex;gap:7px;width:100%}
.obb{font-family:var(--ft);font-size:13px;letter-spacing:2px;padding:10px 0;border:none;clip-path:polygon(5px 0%,100% 0%,calc(100% - 5px) 100%,0% 100%);transition:all .3s;text-align:center}
.obb.m{flex:2;background:var(--red);color:#000}
.obb.m:hover{box-shadow:var(--sr)}
.obb.o{flex:1;background:transparent;border:1px solid var(--g3);color:var(--ice2)}
.obb.o:hover{border-color:var(--pur);color:var(--pur)}
/* Items panel */
.ip{display:flex;flex-direction:column;gap:10px}
.iphd{display:flex;align-items:center;justify-content:space-between;padding-bottom:9px;border-bottom:1px solid var(--g1)}
.ipn{font-family:var(--ft);font-size:22px;letter-spacing:2px}
.ipnn{font-family:var(--fm);font-size:10px;color:var(--ice2);letter-spacing:2px}
.ipsc{display:grid;grid-template-columns:1fr 1fr;gap:7px;max-height:420px;overflow-y:auto;padding-right:2px}
.ipsc::-webkit-scrollbar{width:2px}
.ipsc::-webkit-scrollbar-thumb{background:var(--red)}
.it{background:var(--bg3);border:1px solid var(--g1);transition:all .2s;position:relative;overflow:hidden}
.it:hover{border-color:var(--g3);transform:translateY(-2px)}
.it.sel{border-color:rgba(204,0,0,.6);background:rgba(204,0,0,.06)}
.itck{position:absolute;top:5px;right:5px;width:14px;height:14px;border-radius:50%;background:var(--red);font-size:8px;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s;color:#000;font-weight:900}
.it.sel .itck{opacity:1}
.itph{aspect-ratio:1;overflow:hidden;position:relative;background:var(--bg4);display:flex;align-items:center;justify-content:center}
.itph img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.it:hover .itph img{transform:scale(1.06)}
.item{font-size:32px;opacity:.45}
.itinfo{padding:8px 9px}
.itn{font-size:11px;font-weight:700;line-height:1.3;margin-bottom:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.itp{font-family:var(--fm);font-size:12px;color:var(--red);margin-bottom:3px}
.itr{font-size:8px;letter-spacing:2px;text-transform:uppercase;padding:2px 5px;border:1px solid}
.ite{grid-column:1/-1;text-align:center;padding:30px;font-family:var(--fm);font-size:10px;letter-spacing:3px;color:var(--ice3);line-height:2}

/* AI STYLIST */
#stylist{background:var(--bg2)}
.styw{display:grid;grid-template-columns:1.1fr .9fr;gap:36px;margin-top:14px;align-items:start}
.styc{background:var(--bg3);border:1px solid var(--g1)}
.stytb{height:2px;background:linear-gradient(90deg,var(--red),var(--pur))}
.styhd{padding:14px 18px;border-bottom:1px solid var(--g1);display:flex;align-items:center;gap:11px}
.styav{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,var(--red),var(--pur));display:flex;align-items:center;justify-content:center;font-size:15px;position:relative;flex-shrink:0}
.styav::after{content:'';position:absolute;bottom:1px;right:1px;width:8px;height:8px;border-radius:50%;background:var(--green);border:2px solid var(--bg3)}
.stynm{font-weight:700;font-size:13px;letter-spacing:2px}
.styss{font-size:10px;color:var(--ice2);letter-spacing:1px}
.styq{display:flex;flex-wrap:wrap;gap:5px;padding:9px 13px;border-bottom:1px solid var(--g1)}
.sq{font-family:var(--fm);font-size:10px;letter-spacing:1px;padding:5px 9px;background:transparent;border:1px solid var(--g3);color:var(--ice2);transition:all .2s;white-space:nowrap}
.sq:hover{border-color:var(--pur);color:#cc88ff}
.stym{padding:13px;height:260px;overflow-y:auto;display:flex;flex-direction:column;gap:9px}
.stym::-webkit-scrollbar{width:2px}
.stym::-webkit-scrollbar-thumb{background:var(--pur)}
.msg{padding:10px 13px;font-size:13px;line-height:1.55;max-width:90%}
.mai{background:rgba(85,0,170,.08);border:1px solid rgba(85,0,170,.2);align-self:flex-start;border-radius:0 9px 9px 9px}
.mu{background:rgba(204,0,0,.08);border:1px solid rgba(204,0,0,.15);align-self:flex-end;border-radius:9px 0 9px 9px}
.tdots{display:flex;gap:4px;align-items:center;padding:11px 13px}
.dot{width:5px;height:5px;border-radius:50%;background:var(--pur);animation:bl 1.2s infinite}
.dot:nth-child(2){animation-delay:.2s}.dot:nth-child(3){animation-delay:.4s}
@keyframes bl{0%,100%{opacity:.3;transform:translateY(0)}50%{opacity:1;transform:translateY(-4px)}}
.styi{padding:11px;border-top:1px solid var(--g1);display:flex;gap:7px}
.styin{flex:1;background:var(--bg);border:1px solid var(--g3);color:var(--ice);padding:9px 12px;font-family:var(--fb);font-size:14px;outline:none;transition:border-color .2s}
.styin::placeholder{color:var(--ice2)}
.styin:focus{border-color:var(--pur)}
.stysn{background:var(--pur);border:none;color:#fff;padding:9px 16px;font-family:var(--ft);font-size:14px;letter-spacing:2px;transition:background .2s}
.stysn:hover{background:var(--pur2)}
.stinf{display:flex;flex-direction:column;gap:16px}
.stcard{background:var(--bg3);border:1px solid var(--g1);padding:20px}
.stcardh{font-family:var(--ft);font-size:18px;letter-spacing:3px;margin-bottom:9px}
.stcard p{font-size:13px;color:var(--ice2);line-height:1.7}
.stcard ul{list-style:none;display:flex;flex-direction:column;gap:7px;margin-top:9px}
.stcard ul li{font-size:13px;color:var(--ice2);display:flex;align-items:flex-start;gap:7px}
.stcard ul li::before{content:'→';color:var(--red);flex-shrink:0}
.edgecode{background:var(--bg);padding:10px;margin-top:8px;font-family:var(--fm);font-size:10px;color:var(--green);line-height:2;overflow:auto}

/* VIP */
#vip{background:var(--bg3)}
.vg{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;margin-top:14px}
.vc{background:var(--bg2);border:1px solid var(--g1);padding:26px 20px;position:relative;overflow:hidden;transition:transform .3s}
.vc:hover{transform:translateY(-4px)}
.vc.hot{border-color:rgba(204,0,0,.4)}
.vctop{height:2px;position:absolute;top:0;left:0;right:0;background:var(--g1)}
.vc.hot .vctop{background:linear-gradient(90deg,var(--red),var(--pur))}
.vcti{font-family:var(--ft);font-size:34px;letter-spacing:4px;margin-bottom:2px}
.vcpr{font-family:var(--fm);font-size:12px;color:var(--ice2);margin-bottom:18px}
.vcpe{list-style:none;display:flex;flex-direction:column;gap:7px;margin-bottom:18px}
.vcpe li{font-size:13px;color:var(--ice2);display:flex;align-items:flex-start;gap:7px}
.vcpe li::before{content:'→';color:var(--red);flex-shrink:0}
.httag{position:absolute;top:12px;right:12px;font-family:var(--fm);font-size:9px;letter-spacing:3px;text-transform:uppercase;padding:3px 8px;background:var(--red);color:#000}
.bvip{width:100%;font-family:var(--ft);font-size:14px;letter-spacing:3px;padding:11px;background:transparent;border:1px solid var(--g3);color:var(--ice2);transition:all .3s}
.bvip:hover{border-color:var(--red);color:var(--red)}
.vc.hot .bvip{background:var(--red);border-color:var(--red);color:#000}

/* FOOTER */
footer{background:var(--bg);border-top:1px solid rgba(255,255,255,.05);padding:52px 48px 26px}
.fg{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:40px;margin-bottom:40px}
.flogo{font-family:var(--fg);font-size:20px;letter-spacing:2px;display:block;margin-bottom:10px;text-decoration:none;color:var(--ice);text-shadow:2px 2px 0 var(--red)}
.flogo em{font-style:normal;color:var(--red)}
.fdesc{font-size:14px;color:var(--ice2);line-height:1.65;max-width:240px}
.fh{font-family:var(--ft);font-size:14px;letter-spacing:3px;margin-bottom:11px}
.fl{list-style:none;display:flex;flex-direction:column;gap:7px}
.fl a{font-size:13px;color:var(--ice2);text-decoration:none;transition:color .2s}
.fl a:hover{color:var(--red)}
.fbot{border-top:1px solid rgba(255,255,255,.05);padding-top:18px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:9px}
.fcp{font-family:var(--fm);font-size:10px;color:var(--ice3);letter-spacing:2px}
.socs{display:flex;gap:9px}
.soc{width:30px;height:30px;border:1px solid var(--g1);display:flex;align-items:center;justify-content:center;font-size:13px;text-decoration:none;color:var(--ice2);transition:all .2s}
.soc:hover{border-color:var(--red);color:var(--red)}

/* PRODUCT MODAL */
.pmov{display:none;position:fixed;inset:0;z-index:800;background:rgba(0,0,0,.92);backdrop-filter:blur(12px);align-items:flex-start;justify-content:center;overflow-y:auto;padding:20px}
.pmov.open{display:flex}
.pmbox{background:var(--bg2);border:1px solid rgba(204,0,0,.15);width:100%;max-width:880px;margin:auto;display:grid;grid-template-columns:1fr 1fr;position:relative}
.pmx{position:absolute;top:11px;right:13px;background:rgba(0,0,0,.6);border:1px solid var(--g1);color:var(--ice2);width:28px;height:28px;display:flex;align-items:center;justify-content:center;font-size:16px;z-index:5;transition:all .2s}
.pmx:hover{border-color:var(--red);color:var(--red)}
.pmgal{background:var(--bg3);display:flex;flex-direction:column;min-height:360px}
.pmmain{flex:1;position:relative;overflow:hidden;min-height:300px;display:flex;align-items:center;justify-content:center;background:var(--bg4)}
.pmmain img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.pmem{font-size:75px;opacity:.4;position:relative;z-index:1}
.pmthumbs{display:flex;gap:4px;padding:7px;background:rgba(0,0,0,.3);overflow-x:auto}
.pmthumbs::-webkit-scrollbar{height:2px}
.pmthumbs::-webkit-scrollbar-thumb{background:var(--red)}
.pmth{width:44px;height:44px;flex-shrink:0;border:1px solid var(--g1);overflow:hidden;background:var(--bg4);display:flex;align-items:center;justify-content:center;font-size:16px}
.pmth img{width:100%;height:100%;object-fit:cover}
.pmth.on{border-color:var(--red)}
.pminfo{padding:24px 22px;display:flex;flex-direction:column;overflow-y:auto;max-height:560px}
.pminfo::-webkit-scrollbar{width:2px}
.pminfo::-webkit-scrollbar-thumb{background:var(--pur)}
.pmbr{font-family:var(--fm);font-size:9px;letter-spacing:4px;color:var(--ice2);text-transform:uppercase;margin-bottom:4px}
.pmnm{font-family:var(--ft);font-size:clamp(20px,3vw,34px);line-height:.95;margin-bottom:12px}
.pmpr{display:flex;align-items:baseline;gap:9px;margin-bottom:12px}
.pmpr .pr{font-family:var(--fm);font-size:24px}
.pmpr .od{font-family:var(--fm);font-size:13px;color:var(--ice2);text-decoration:line-through}
.pmdv{height:1px;background:var(--g1);margin:12px 0}
.pmsl{font-family:var(--fm);font-size:9px;letter-spacing:3px;color:var(--ice2);text-transform:uppercase;margin-bottom:7px}
.cpills{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}
.cp{padding:5px 13px;border:1px solid var(--g3);font-size:12px;font-weight:700;background:transparent;color:var(--ice2);transition:all .2s}
.cp.on,.cp:hover{border-color:var(--red);color:var(--ice);background:rgba(204,0,0,.08)}
.spills{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px}
.sp{min-width:40px;height:40px;border:1px solid var(--g3);font-size:12px;font-weight:700;background:transparent;color:var(--ice2);display:flex;align-items:center;justify-content:center;padding:0 9px;transition:all .2s}
.sp.on,.sp:hover:not(.na){border-color:var(--red);color:var(--ice);background:rgba(204,0,0,.08)}
.sp.na{opacity:.3;text-decoration:line-through;pointer-events:none}
.qrow{display:flex;align-items:center;gap:10px;margin-bottom:16px}
.qb{width:32px;height:32px;border:1px solid var(--g3);background:transparent;color:var(--ice);font-size:17px;display:flex;align-items:center;justify-content:center;transition:all .2s}
.qb:hover{border-color:var(--red);color:var(--red)}
.qn{font-family:var(--fm);font-size:16px;min-width:24px;text-align:center}
.pmstk{font-family:var(--fm);font-size:10px}
.bcart{width:100%;font-family:var(--ft);font-size:17px;letter-spacing:4px;padding:14px;background:var(--red);border:none;color:#000;clip-path:polygon(6px 0%,100% 0%,calc(100% - 6px) 100%,0% 100%);transition:all .3s;position:relative;overflow:hidden}
.bcart::before{content:'';position:absolute;inset:0;background:rgba(255,255,255,.12);transform:translateX(-110%) skewX(-15deg);transition:transform .4s}
.bcart:hover::before{transform:translateX(110%) skewX(-15deg)}
.bcart:hover{box-shadow:var(--sr)}
.bcart:disabled{opacity:.45;pointer-events:none}

/* CART */
.cov{display:none;position:fixed;inset:0;z-index:900}
.cov.open{display:block}
.cbd{position:absolute;inset:0;background:rgba(0,0,0,.7)}
.csb{position:absolute;top:60px;right:0;bottom:0;width:100%;max-width:390px;background:var(--bg2);border-left:1px solid rgba(204,0,0,.15);border-top:1px solid rgba(204,0,0,.15);display:flex;flex-direction:column;transform:translateX(100%);transition:transform .32s cubic-bezier(.4,0,.2,1)}
.cov.open .csb{transform:translateX(0)}
.chd{padding:0 20px;height:56px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--g1)}
.chdt{font-family:var(--ft);font-size:19px;letter-spacing:4px;display:flex;align-items:center;gap:7px}
.chdcnt{font-family:var(--fm);font-size:10px;padding:2px 8px;background:var(--red);color:#000;border-radius:20px}
.cx{background:none;border:none;color:var(--ice2);font-size:18px;transition:color .2s}
.cx:hover{color:var(--red)}
.citems{flex:1;overflow-y:auto;padding:13px 20px}
.citems::-webkit-scrollbar{width:2px}
.citems::-webkit-scrollbar-thumb{background:var(--red)}
.ci{display:flex;gap:10px;padding:12px 0;border-bottom:1px solid rgba(255,255,255,.04)}
.ci:last-child{border-bottom:none}
.ciimg{width:58px;height:58px;flex-shrink:0;background:var(--bg4);border:1px solid var(--g1);display:flex;align-items:center;justify-content:center;font-size:22px;overflow:hidden;position:relative}
.ciimg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ciinfo{flex:1;min-width:0}
.cibr{font-family:var(--fm);font-size:9px;letter-spacing:2px;color:var(--ice3);text-transform:uppercase;margin-bottom:2px}
.cinm{font-size:13px;font-weight:600;margin-bottom:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cimt{font-size:11px;color:var(--ice2);margin-bottom:5px}
.ciro{display:flex;align-items:center;justify-content:space-between}
.cipr{font-family:var(--fm);font-size:13px}
.ciqty{display:flex;align-items:center;gap:6px}
.ciqb{width:20px;height:20px;border:1px solid var(--g3);background:transparent;color:var(--ice2);font-size:13px;display:flex;align-items:center;justify-content:center;transition:all .15s}
.ciqb:hover{border-color:var(--red);color:var(--red)}
.ciqn{font-family:var(--fm);font-size:12px;min-width:14px;text-align:center}
.cirm{background:none;border:none;color:var(--ice3);font-size:13px;transition:color .2s}
.cirm:hover{color:var(--red)}
.cem{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:11px;padding:40px 20px;text-align:center}
.cemico{font-size:40px;opacity:.2}
.cemt{font-family:var(--ft);font-size:20px;letter-spacing:3px;color:var(--ice2)}
.cems{font-size:13px;color:var(--ice3);line-height:1.6}
.cfoot{padding:13px 20px;border-top:1px solid var(--g1);flex-shrink:0}
.cpnrow{display:flex;gap:6px;margin-bottom:10px}
.cpnin{flex:1;background:var(--bg);border:1px solid var(--g3);color:var(--ice);padding:8px 10px;font-family:var(--fb);font-size:12px;text-transform:uppercase;letter-spacing:2px;outline:none;transition:border-color .2s}
.cpnin::placeholder{text-transform:none;letter-spacing:1px;color:var(--ice3)}
.cpnin:focus{border-color:var(--pur)}
.cpnbtn{font-family:var(--ft);font-size:12px;letter-spacing:2px;padding:8px 12px;background:transparent;border:1px solid var(--g3);color:var(--ice2);transition:all .2s}
.cpnbtn:hover{border-color:var(--pur);color:var(--pur)}
.cpnmsg{font-size:11px;margin-bottom:9px;min-height:13px;font-family:var(--fm)}
.cpnok{color:var(--green)}.cpnerr{color:#ff2222}
.ctots{display:flex;flex-direction:column;gap:5px;margin-bottom:11px}
.ct{display:flex;justify-content:space-between;font-size:13px;color:var(--ice2)}
.ct.tot{font-family:var(--ft);font-size:19px;color:var(--ice);padding-top:6px;border-top:1px solid var(--g1);margin-top:3px}
.ct .v{font-family:var(--fm)}
.ct.disc .v{color:var(--green)}
.ctship{font-family:var(--fm);font-size:10px;color:var(--ice3);letter-spacing:1px;margin-bottom:9px}
.bck{width:100%;font-family:var(--ft);font-size:16px;letter-spacing:4px;padding:12px;background:var(--red);border:none;color:#000;clip-path:polygon(6px 0%,100% 0%,calc(100% - 6px) 100%,0% 100%);transition:all .3s}
.bck:hover{box-shadow:var(--sr)}
.bck:disabled{opacity:.4;pointer-events:none}

/* CHECKOUT */
.ckov{display:none;position:fixed;inset:0;z-index:1020;background:rgba(0,0,0,.96);backdrop-filter:blur(14px);overflow-y:auto;padding:20px;align-items:flex-start;justify-content:center}
.ckov.open{display:flex}
.ckbox{background:var(--bg2);border:1px solid rgba(204,0,0,.2);width:100%;max-width:800px;margin:auto;display:grid;grid-template-columns:1fr 290px;position:relative}
.ckcls{position:absolute;top:11px;right:13px;background:none;border:none;color:var(--ice2);font-size:18px;z-index:5;transition:color .2s}
.ckcls:hover{color:var(--red)}
.ckmain{padding:26px;border-right:1px solid var(--g1)}
.cksteps{display:flex;gap:0;margin-bottom:20px}
.cks{display:flex;align-items:center;gap:6px;font-family:var(--fm);font-size:10px;letter-spacing:3px;color:var(--ice3);text-transform:uppercase}
.cks::after{content:'›';margin:0 7px;color:var(--g3)}
.cks:last-child::after{display:none}
.cks.active{color:var(--red)}.cks.done{color:var(--green)}
.cksn{width:18px;height:18px;border-radius:50%;border:1px solid currentColor;display:flex;align-items:center;justify-content:center;font-size:9px}
.cktit{font-family:var(--ft);font-size:24px;letter-spacing:3px;margin-bottom:16px}
.ckrow{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:10px}
.ckrow.full{grid-template-columns:1fr}
.ckrow.tri{grid-template-columns:1fr 1fr 1fr}
.ffg{display:flex;flex-direction:column;gap:4px}
.ffg label{font-family:var(--fm);font-size:9px;letter-spacing:3px;color:var(--ice2);text-transform:uppercase}
.ckin{background:var(--bg);border:1px solid var(--g3);color:var(--ice);padding:9px 10px;font-family:var(--fb);font-size:14px;outline:none;transition:border-color .2s;width:100%}
.ckin:focus{border-color:var(--red)}
.ckin.err{border-color:rgba(204,0,0,.5)}
.ckin::placeholder{color:var(--ice3)}
select.ckin option{background:var(--bg);color:var(--ice)}
.payopts{display:flex;flex-direction:column;gap:8px;margin-bottom:14px}
.payo{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid var(--g3);background:transparent;transition:all .2s;width:100%;text-align:left}
.payo.on{border-color:var(--red);background:rgba(204,0,0,.05)}
.payoico{font-size:21px;width:26px;text-align:center}
.payoinfo{flex:1}
.payonm{font-size:13px;font-weight:700;letter-spacing:1px}
.payosb{font-size:11px;color:var(--ice2)}
.payrad{width:14px;height:14px;border-radius:50%;border:2px solid var(--g3);flex-shrink:0;position:relative;transition:border-color .2s}
.payo.on .payrad{border-color:var(--red)}
.payo.on .payrad::after{content:'';position:absolute;inset:3px;border-radius:50%;background:var(--red)}
.pixblk{display:none;padding:16px;background:var(--bg3);border:1px solid rgba(204,0,0,.2);margin-bottom:4px;align-items:center;gap:16px;flex-wrap:wrap}
.pixblk.vis{display:flex}
.pixqr{width:120px;height:120px;background:#fff;display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden}
.pixqr img{width:100%;height:100%}
.pixinfo{flex:1;min-width:170px}
.pixlbl{font-family:var(--fm);font-size:9px;letter-spacing:3px;color:var(--ice2);text-transform:uppercase;margin-bottom:4px}
.pixcode{background:var(--bg);border:1px solid var(--g3);padding:6px 9px;font-family:var(--fm);font-size:10px;color:var(--ice);word-break:break-all;line-height:1.5;max-height:52px;overflow:hidden;margin-bottom:6px}
.pixcopy{font-family:var(--ft);font-size:12px;letter-spacing:2px;padding:6px;width:100%;background:transparent;border:1px solid var(--g3);color:var(--ice2);margin-bottom:5px;transition:all .2s}
.pixcopy:hover{border-color:var(--red);color:var(--red)}
.pixtmr{font-family:var(--fm);font-size:11px;color:var(--amber);letter-spacing:2px}
.cknav{display:flex;gap:8px;margin-top:16px}
.bcknx{flex:1;font-family:var(--ft);font-size:15px;letter-spacing:3px;padding:12px;background:var(--red);border:none;color:#000;clip-path:polygon(5px 0%,100% 0%,calc(100% - 5px) 100%,0% 100%);transition:all .3s}
.bcknx:hover{box-shadow:var(--sr)}
.bckbk{font-family:var(--ft);font-size:14px;letter-spacing:2px;padding:12px 16px;background:transparent;border:1px solid var(--g3);color:var(--ice2);transition:all .2s}
.bckbk:hover{border-color:var(--red);color:var(--red)}
.ckok{text-align:center;padding:20px 0}
.ckok-ico{font-size:54px;margin-bottom:12px}
.ckok-t{font-family:var(--ft);font-size:36px;letter-spacing:4px;color:var(--green);margin-bottom:7px}
.ckok-s{font-size:14px;color:var(--ice2);line-height:1.7;max-width:290px;margin:0 auto 16px}
.ckok-id{font-family:var(--fm);font-size:12px;letter-spacing:3px;padding:8px 16px;border:1px solid var(--green);display:inline-block}
.cksum{padding:22px 18px;background:var(--bg3)}
.cksumtit{font-family:var(--ft);font-size:15px;letter-spacing:3px;margin-bottom:12px;padding-bottom:8px;border-bottom:1px solid var(--g1)}
.cksi{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}
.csi{display:flex;gap:8px;align-items:center}
.csiimg{width:40px;height:40px;background:var(--bg4);border:1px solid var(--g1);flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:16px;overflow:hidden;position:relative}
.csiimg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.csinm{font-size:12px;font-weight:600;flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.csipr{font-family:var(--fm);font-size:11px;flex-shrink:0}
.ckst{display:flex;flex-direction:column;gap:5px;padding-top:10px;border-top:1px solid var(--g1)}
.cst{display:flex;justify-content:space-between;font-size:12px;color:var(--ice2)}
.cst.tot{font-family:var(--ft);font-size:17px;color:var(--ice);margin-top:4px;padding-top:6px;border-top:1px solid var(--g1)}
.cst .v{font-family:var(--fm)}
.cst.disc .v{color:var(--green)}

/* PROFILE */
.pfov{display:none;position:fixed;inset:0;z-index:1050;background:rgba(0,0,0,.7);backdrop-filter:blur(8px)}
.pfov.open{display:block}
.pfsb{position:absolute;top:0;right:0;bottom:0;width:min(390px,100%);background:var(--bg2);border-left:1px solid rgba(85,0,170,.2);display:flex;flex-direction:column;overflow-y:auto;transform:translateX(100%);transition:transform .32s cubic-bezier(.4,0,.2,1)}
.pfov.open .pfsb{transform:translateX(0)}
.pfhero{position:relative;height:160px;flex-shrink:0;overflow:hidden;background:linear-gradient(135deg,#2a0008,#0f0018)}
.pfhbg{position:absolute;inset:0;background-size:cover;background-position:center;opacity:.9}
.pfhmsk{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.2) 0%,rgba(6,0,14,.85) 100%)}
.pfcls{position:absolute;top:12px;right:12px;background:rgba(0,0,0,.6);border:1px solid rgba(255,255,255,.15);color:var(--ice2);width:28px;height:28px;display:flex;align-items:center;justify-content:center;font-size:15px;z-index:10;cursor:pointer;transition:all .2s;border-radius:0}
.pfcls:hover{border-color:var(--red);color:var(--red)}
.pfav-wrap{position:absolute;bottom:-30px;left:18px;z-index:10}
.pfav{width:62px;height:62px;border-radius:50%;border:3px solid var(--bg2);background:linear-gradient(135deg,var(--red),var(--pur));display:flex;align-items:center;justify-content:center;font-size:24px;overflow:hidden;position:relative;box-shadow:0 4px 20px rgba(204,0,0,.4);flex-shrink:0}
.pfav img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.pfaved{position:absolute;bottom:0;right:0;width:20px;height:20px;border-radius:50%;background:var(--red);border:2px solid var(--bg2);display:flex;align-items:center;justify-content:center;font-size:9px;cursor:pointer;overflow:hidden}
.pfavin{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%}
.pfinfo{padding:44px 18px 14px;border-bottom:1px solid var(--g1)}
.pfun{font-family:var(--fg);font-size:20px;letter-spacing:1px;margin-bottom:2px;text-shadow:1px 1px 0 rgba(204,0,0,.3)}
.pfem{font-family:var(--fm);font-size:10px;letter-spacing:2px;color:var(--ice2);text-transform:uppercase;margin-bottom:6px}
.pfvip{display:inline-flex;align-items:center;font-family:var(--fm);font-size:10px;letter-spacing:3px;text-transform:uppercase;padding:3px 9px;border:1px solid}
.vgold{color:#ffd700;border-color:#ffd700}.vd{color:#88ccff;border-color:#88ccff}.vo{color:var(--red);border-color:var(--red)}.vn{color:var(--ice3);border-color:var(--g3)}
.pfbody{padding:18px;display:flex;flex-direction:column;gap:16px;flex:1}
.pfst{font-family:var(--fg);font-size:14px;letter-spacing:1px;margin-bottom:10px;color:var(--ice);text-shadow:1px 1px 0 rgba(204,0,0,.3)}
.pfin{width:100%;background:var(--bg);border:1px solid var(--g3);color:var(--ice);padding:9px 11px;font-family:var(--fb);font-size:14px;outline:none;transition:border-color .2s;margin-bottom:9px}
.pfin:focus{border-color:var(--red)}
.pfbgarea{position:relative;height:88px;border:2px dashed var(--g3);display:flex;align-items:center;justify-content:center;overflow:hidden;transition:border-color .2s;background:var(--bg);cursor:pointer}
.pfbgarea:hover{border-color:var(--red)}
.pfbgfile{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%}
.pfbgph{display:flex;flex-direction:column;align-items:center;gap:5px;pointer-events:none}
.pfbgprev{display:none;position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.pfbgov{position:absolute;inset:0;background:rgba(0,0,0,.5);display:none;align-items:center;justify-content:center;pointer-events:none}
.pfbgarea:hover .pfbgov{display:flex}
.pfbgov span{font-family:var(--fm);font-size:9px;letter-spacing:2px;color:#fff}
.uprog{height:2px;background:var(--g2);margin-top:4px;overflow:hidden;display:none}
.uprog.on{display:block}
.uprogfill{height:100%;background:linear-gradient(90deg,var(--red),var(--pur));width:0%;transition:width .3s}
.pfstats{display:grid;grid-template-columns:1fr 1fr 1fr;gap:7px}
.pfstat{background:var(--bg3);border:1px solid var(--g1);padding:10px 8px;text-align:center}
.pfsv{font-family:var(--ft);font-size:22px;line-height:1}
.pfsl{font-family:var(--fm);font-size:8px;letter-spacing:2px;color:var(--ice2);text-transform:uppercase;margin-top:2px}
.bpfsave{width:100%;font-family:var(--ft);font-size:14px;letter-spacing:3px;padding:11px;background:var(--red);border:none;color:#000;transition:all .3s;clip-path:polygon(5px 0%,100% 0%,calc(100% - 5px) 100%,0% 100%)}
.bpfsave:hover{box-shadow:0 0 16px rgba(204,0,0,.4)}
.bpfout{width:100%;font-family:var(--ft);font-size:13px;letter-spacing:3px;padding:9px;background:transparent;border:1px solid var(--g3);color:var(--ice2);transition:all .3s;margin-top:5px}
.bpfout:hover{border-color:var(--red);color:var(--red)}

/* AUTH */
.authov{display:none;position:fixed;inset:0;background:rgba(0,0,0,.88);backdrop-filter:blur(8px);z-index:2000;align-items:center;justify-content:center;padding:20px}
.authov.open{display:flex}
.authbox{background:var(--bg2);border:1px solid rgba(204,0,0,.22);width:100%;max-width:390px}
.authbar{height:2px;background:linear-gradient(90deg,var(--red),var(--pur))}
.authhd{padding:18px 22px 12px;border-bottom:1px solid var(--g1);display:flex;align-items:center;justify-content:space-between}
.authtit{font-family:var(--ft);font-size:24px;letter-spacing:3px}
.authx{background:none;border:none;color:var(--ice2);font-size:18px;transition:color .2s}
.authx:hover{color:var(--red)}
.authbody{padding:20px 22px}
.authmsg{font-size:12px;padding:7px 11px;border-left:2px solid;margin-bottom:11px;display:none;font-family:var(--fm)}
.authmsg.on{display:block}
.authmsg.err{color:#ff2222;background:rgba(204,0,0,.08);border-color:var(--red)}
.authmsg.ok{color:var(--green);background:rgba(0,200,83,.08);border-color:var(--green)}
.authfg{display:flex;flex-direction:column;gap:4px;margin-bottom:12px}
.authfg label{font-family:var(--fm);font-size:9px;letter-spacing:3px;color:var(--ice2);text-transform:uppercase}
.authin{width:100%;background:var(--bg);border:1px solid var(--g3);color:var(--ice);padding:10px 11px;font-family:var(--fb);font-size:14px;outline:none;transition:border-color .2s}
.authin:focus{border-color:var(--red)}
.bauth{width:100%;font-family:var(--ft);font-size:17px;letter-spacing:3px;padding:12px;background:var(--red);border:none;color:#000;transition:all .3s;margin-top:3px}
.bauth:hover{box-shadow:var(--sr)}
.bauth:disabled{opacity:.5}
.authsw{text-align:center;margin-top:12px;font-size:13px;color:var(--ice2)}
.authsw a{color:var(--red);text-decoration:none;font-weight:600}

/* TOAST */
#toast{position:fixed;bottom:24px;right:24px;background:var(--bg3);border:1px solid rgba(204,0,0,.3);border-left:3px solid var(--red);padding:11px 16px;font-size:13px;z-index:9999;transform:translateX(140%);transition:transform .3s ease;max-width:290px}
#toast.on{transform:translateX(0)}

/* EMPTY STATE */
.empty{text-align:center;padding:60px 20px;grid-column:1/-1}
.emico{font-size:44px;opacity:.2;margin-bottom:12px}
.emtit{font-family:var(--ft);font-size:24px;letter-spacing:3px;color:var(--ice2);margin-bottom:7px}
.emsub{font-size:13px;color:var(--ice3);line-height:1.6;max-width:260px;margin:0 auto}

/* RESPONSIVE */
@media(max-width:1100px){
  .builder{grid-template-columns:1fr}
  .cats{flex-direction:row;flex-wrap:wrap}
  .cbtn{flex:1;min-width:110px}
  .styw{grid-template-columns:1fr}
  .vg{grid-template-columns:1fr 1fr}
  .fg{grid-template-columns:1fr 1fr}
  .dg{grid-template-columns:1fr 1fr}
  .dc.big{grid-row:auto}
  .ckbox{grid-template-columns:1fr}
  .cksum{display:none}
  .pmbox{grid-template-columns:1fr}
}
@media(max-width:768px){
  .sec{padding:52px 18px}
  nav{padding:0 max(16px,env(safe-area-inset-left));height:54px}
  .nav-lnk,.nav-r .bnav{display:none}
  .ham{display:flex}
  .hpc{display:none}
  .hmb{display:block}
  .gbg{display:none}
  .gbgm{display:block}
  .gmsk{background:rgba(6,0,14,.88)}
  .gbody{padding:38px 20px}
  .dg{grid-template-columns:1fr}
  .dc.big{grid-row:auto}
  .vg{grid-template-columns:1fr}
  .fg{grid-template-columns:1fr 1fr}
  .hbtns{flex-direction:column;align-items:center}
  .btn{width:min(290px,100%)}
  .csb,.pfsb{max-width:100%}
  .ckmain{padding:16px}
  .ckrow{grid-template-columns:1fr}
  .ckrow.tri{grid-template-columns:1fr 1fr}
  .pixblk{flex-direction:column}
  .pmbox{grid-template-columns:1fr}
  .pmgal{min-height:220px}
  .pminfo{max-height:none;padding:15px}
  .pg{grid-template-columns:1fr 1fr;gap:9px}
  .obg{gap:5px}
}
@media(max-width:400px){
  .fg{grid-template-columns:1fr}
  .sh{font-size:clamp(36px,12vw,58px)}
}
