/* ===== Fonts ===== */
@font-face{font-family:V;src:url(../fonts/V-Light.woff2) format('woff2');font-weight:300;font-display:swap}
@font-face{font-family:V;src:url(../fonts/V-Regular.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:V;src:url(../fonts/V-Medium.woff2) format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:V;src:url(../fonts/V-Bold.woff2) format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:V;src:url(../fonts/V-ExtraBold.woff2) format('woff2');font-weight:800;font-display:swap}
@font-face{font-family:V;src:url(../fonts/V-Black.woff2) format('woff2');font-weight:900;font-display:swap}
@font-face{font-family:M;src:url(../fonts/JBM-400.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:M;src:url(../fonts/JBM-500.woff2) format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:M;src:url(../fonts/JBM-700.woff2) format('woff2');font-weight:700;font-display:swap}

/* ===== Tokens ===== */
:root{
  --bg:#FFFFFF;--bg2:#F4F6F9;--pn:#FFFFFF;--pn2:#F8FAFC;--ink:#0F172A;--tx2:#334155;--mu:#64748B;--ln:#E8EBF0;--ln2:#D5DAE3;
  --acc:#0E7490;--acc2:#06B6D4;--accs:#ECFEFF;--on-ink:#FFFFFF;
  --ok:#15803D;--oks:#DCFCE7;--bad:#DC2626;--bads:#FEE2E2;--wait:#B45309;--waits:#FEF3C7;--info:#2563EB;--infos:#DBEAFE;
  --r:20px;--r2:12px;--sh:0 10px 30px rgba(15,23,42,.06);--sh-s:0 4px 24px rgba(15,23,42,.05);--hd:66px;
  --f:V,Tahoma,sans-serif;--m:M,ui-monospace,SFMono-Regular,Menlo,monospace;
  color-scheme:light;
}
[data-theme=dark]{
  --bg:#0B1220;--bg2:#0F1829;--pn:#111A2C;--pn2:#14203A;--ink:#F1F5F9;--tx2:#CBD5E1;--mu:#94A3B8;--ln:#1E293B;--ln2:#2A3A55;
  --acc:#22D3EE;--acc2:#67E8F9;--accs:rgba(34,211,238,.12);--on-ink:#0B1220;
  --ok:#4ADE80;--oks:rgba(74,222,128,.12);--bad:#F87171;--bads:rgba(248,113,113,.12);--wait:#FBBF24;--waits:rgba(251,191,36,.12);--info:#60A5FA;--infos:rgba(96,165,250,.12);
  --sh:0 10px 30px rgba(0,0,0,.35);--sh-s:0 4px 24px rgba(0,0,0,.22);color-scheme:dark;
}
body,.hd,.pn,.pc,.box,.ib,.btn{transition:background-color .45s,color .45s,border-color .45s}

/* ===== Base ===== */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--hd) + 16px)}
body{margin:0;font-family:var(--f);font-size:15px;line-height:1.8;background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:inherit;text-decoration:none}
img,svg{display:block;flex:none}
h1,h2,h3,h4{margin:0;line-height:1.3;font-weight:800;letter-spacing:-.3px}
p{margin:0}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--acc);outline-offset:2px;border-radius:2px}
::selection{background:var(--acc);color:#fff}
.w{width:100%;max-width:1240px;margin-inline:auto;padding-inline:24px}
.mono{font-family:var(--m);font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;font-weight:500;color:var(--mu)}
.kick{font-size:13px;font-weight:700;color:var(--mu)}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;top:-200px;right:16px;z-index:100;background:var(--ink);color:var(--on-ink);padding:6px 12px}
.skip:focus{top:8px}
.num{font-variant-numeric:tabular-nums;white-space:nowrap}
.hint{font-size:13.5px;color:var(--mu)}
.warn{color:var(--bad);font-weight:700}
.main{min-height:60vh}

/* ===== Buttons ===== */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 18px;border-radius:var(--r2);border:1px solid transparent;font-weight:700;font-size:14px;cursor:pointer;white-space:nowrap;transition:background .15s,border-color .15s,color .15s,transform .1s}
.btn:active{transform:translateY(1px)}
.btn-p{background:var(--ink);color:var(--on-ink)}
.btn-p:hover{background:var(--acc);color:#fff}
.btn-o{background:transparent;border-color:var(--ln2);color:var(--ink)}
.btn-o:hover{border-color:var(--ink)}
.btn-sm{min-height:36px;padding:0 12px;font-size:13.5px}
.btn-lg{min-height:50px;padding:0 22px;font-size:15px;width:100%}
.btn[disabled]{opacity:.45;cursor:not-allowed;pointer-events:none}
.ib{position:relative;display:inline-grid;place-items:center;width:40px;height:40px;border-radius:var(--r2);border:1px solid var(--ln);background:var(--pn);color:var(--ink);cursor:pointer;transition:border-color .15s}
.ib:hover{border-color:var(--ink)}
.cnt{position:absolute;top:-6px;left:-6px;min-width:19px;height:19px;padding:0 5px;border-radius:10px;background:var(--acc);color:#fff;font-size:11px;font-weight:800;display:grid;place-items:center;line-height:1}
.cnt[hidden]{display:none}
.lnk{display:inline-flex;align-items:center;gap:6px;color:var(--ink);font-weight:700;font-size:14px;background:none;border:0;padding:0;cursor:pointer;border-bottom:1px solid var(--ln2)}
.lnk:hover{color:var(--acc);border-color:var(--acc)}
.i-moon{display:none}[data-theme=dark] .i-moon{display:block}[data-theme=dark] .i-sun{display:none}

/* ===== Announcement & Header ===== */
.ann{background:var(--ink);color:var(--on-ink);font-size:13px;line-height:1;padding:9px 0}
.ann .mono{color:var(--acc);margin-left:10px}
.hd{position:sticky;top:0;z-index:40;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:saturate(1.4) blur(12px);border-bottom:1px solid var(--ln)}
.hd-in{height:var(--hd);display:flex;align-items:center;gap:28px}
.brand{display:flex;align-items:center;gap:11px}
.brand-tx{display:flex;flex-direction:column;line-height:1.25}
.brand-tx b{font-size:17px;font-weight:900}
.brand-tx small{font-size:11.5px;color:var(--mu)}
.nav{display:flex;gap:4px;margin-inline-start:8px}
.nav a{padding:6px 10px;font-size:14px;font-weight:500;color:var(--tx2);border-radius:var(--r2)}
.nav a:hover{color:var(--ink);background:var(--bg2)}
.nav a[aria-current]{color:var(--ink);box-shadow:inset 0 -2px 0 var(--acc);border-radius:0}
.hd-act{display:flex;align-items:center;gap:8px;margin-inline-start:auto}
.nav-tg{display:none}
.mnav[hidden]{display:none}
.mnav{border-top:1px solid var(--ln);padding:8px 24px 16px;display:grid;gap:2px;background:var(--bg)}
.mnav a{padding:10px 4px;border-bottom:1px solid var(--ln);font-weight:500}
.flashes{display:grid;gap:8px;margin-top:16px}
.fl{padding:12px 14px;border-radius:var(--r2);font-size:14.5px;border:1px solid;border-inline-start-width:3px}
.fl-ok{background:var(--oks);border-color:var(--ok);color:var(--ink)}
.fl-bad{background:var(--bads);border-color:var(--bad);color:var(--ink)}
.fl-info{background:var(--infos);border-color:var(--info);color:var(--ink)}

/* ===== Hero ===== */
.hero{position:relative;overflow:hidden;background:radial-gradient(520px 340px at 22% 50%,color-mix(in srgb,var(--acc2) 9%,transparent),transparent 72%)}
.hero-in{position:relative;display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center;padding-block:64px 64px;min-height:500px}
.pill{display:inline-flex;align-items:center;gap:8px;background:var(--accs);color:var(--acc);padding:5px 13px;border-radius:999px;font-size:12.5px;font-weight:700}
.hero h1{font-size:clamp(26px,3.2vw,40px);line-height:1.5;font-weight:900;letter-spacing:-.3px;margin-top:16px;text-wrap:balance}
.hero h1 .hl{color:var(--acc)}
.hero-p{margin-top:14px;font-size:15.5px;color:var(--mu);max-width:560px;line-height:1.95}
.hero-cta{display:flex;gap:10px;margin-top:26px;flex-wrap:wrap}
.hero-facts{list-style:none;padding:0;margin:30px 0 0;display:flex;gap:22px;flex-wrap:wrap}
.hero-facts li{display:flex;align-items:center;gap:8px;font-size:13.5px;font-weight:500;color:var(--tx2)}
.hero-facts svg{color:var(--acc)}

/* ===== Sections ===== */
.sec{padding-block:64px 0}
.sec-top{padding-top:32px}
.narrow{max-width:860px}
.sh{margin-bottom:28px}
.sh-k{font-size:14px;font-weight:700;color:var(--tx2);display:flex;gap:8px;align-items:center;margin-bottom:8px}
.sh-k .mono{color:var(--acc);font-size:12px}
.sh-row{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap}
.sh h2{font-size:clamp(21px,2.3vw,28px);font-weight:900}
.sh-d{color:var(--mu);margin-top:6px;max-width:640px;font-size:14.5px}
.crumbs{display:flex;gap:8px;align-items:center;padding-top:22px;flex-wrap:wrap;text-transform:none;letter-spacing:0;font-family:var(--f);font-size:13px}
.crumbs a:hover{color:var(--acc)}

/* product card: white body + soft brand header */
.grid-p{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.pc{position:relative;display:flex;flex-direction:column;border-radius:22px;background:var(--pn);border:1px solid var(--ln);box-shadow:var(--sh-s);overflow:hidden;isolation:isolate;transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s,border-color .3s}
.pc:hover{transform:translateY(-6px);border-color:color-mix(in srgb,var(--brand) 35%,var(--ln));box-shadow:0 26px 50px -16px color-mix(in srgb,var(--brand) 48%,transparent)}
.pc-hd{position:relative;display:flex;justify-content:space-between;align-items:flex-start;gap:8px;min-height:104px;padding:18px 18px 20px;background:linear-gradient(140deg,color-mix(in srgb,var(--brand) 17%,var(--pn)),color-mix(in srgb,var(--brand) 5%,var(--pn)));overflow:hidden}
[data-theme=dark] .pc-hd{background:linear-gradient(140deg,color-mix(in srgb,var(--brand) 26%,var(--pn)),color-mix(in srgb,var(--brand) 7%,var(--pn)))}
.pc-wm{position:absolute;left:-20px;bottom:-40px;color:var(--brand);opacity:.13;transform:rotate(-12deg);transition:transform .6s cubic-bezier(.2,.8,.2,1),opacity .6s;z-index:-1}
[data-theme=dark] .pc-wm{color:color-mix(in srgb,var(--brand) 60%,#fff);opacity:.1}
.pc:hover .pc-wm{transform:rotate(0) scale(1.08);opacity:.22}
.pc-logo{width:54px;height:54px;flex:none;display:grid;place-items:center;border-radius:16px;color:#fff;background:linear-gradient(140deg,var(--brand),color-mix(in srgb,var(--brand) 62%,#000));box-shadow:0 10px 22px -6px color-mix(in srgb,var(--brand) 55%,transparent);transition:transform .45s cubic-bezier(.2,.8,.2,1)}
[data-theme=dark] .pc-logo{outline:1px solid rgba(255,255,255,.14)}
.pc:hover .pc-logo{transform:scale(1.06) rotate(-4deg)}
.pc-off .pc-logo{filter:grayscale(.9);opacity:.6}
.pc-tags{display:flex;gap:6px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.pc-badge{font-size:11.5px;font-weight:700;background:var(--pn);color:color-mix(in srgb,var(--brand) 70%,var(--ink));padding:3px 10px;border-radius:999px;white-space:nowrap}
.stk{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:700;padding:3px 9px;border-radius:999px;white-space:nowrap;background:var(--pn)}
.stk i{width:6px;height:6px;border-radius:50%;background:currentColor}
.stk-ok{color:var(--ok)}.stk-no{color:var(--bad)}
.pd-logo,.tl-l{display:grid;place-items:center;flex:none;background:color-mix(in srgb,var(--brand) 10%,var(--pn));color:var(--brand)}
[data-theme=dark] .pd-logo{background:color-mix(in srgb,var(--brand) 20%,var(--pn));color:color-mix(in srgb,var(--brand) 55%,#fff)}
.pc-body{padding:14px 20px 0;flex:1}
.pc-body h3{font-size:17px;font-weight:800;letter-spacing:0;text-align:right;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pc-body p{margin-top:4px;color:var(--mu);font-size:13.5px;line-height:1.8;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pc-meta{display:inline-block;margin-top:8px;font-size:12px;color:var(--mu)}
.pc-foot{display:flex;justify-content:space-between;align-items:center;gap:8px;margin:14px 20px 18px;padding-top:12px;border-top:1px solid var(--ln)}
.pc-from{display:flex;flex-direction:column;line-height:1.4;white-space:nowrap}
.pc-from>small{font-size:11.5px;color:var(--mu)}
.pl-na{font-size:13.5px;font-weight:700;color:var(--mu)}.pl-na.big{font-size:17px}
.price b{font-size:17px;font-weight:800;font-variant-numeric:tabular-nums}
.price small{font-size:12px;color:var(--mu);font-weight:500}
.price.big b{font-size:21px}
.pc-go{display:inline-flex;align-items:center;gap:5px;background:var(--bg2);color:var(--ink);padding:7px 12px;border-radius:12px;font-size:13px;font-weight:700;white-space:nowrap;transition:background .25s,color .25s,transform .3s}
.pc:hover .pc-go{background:var(--brand);color:#fff;transform:translateX(-3px)}
.js .rv{opacity:0;translate:0 26px;transition:opacity .6s var(--rd,0ms),translate .6s cubic-bezier(.2,.8,.2,1) var(--rd,0ms),transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s,border-color .3s}
.js .rv.in{opacity:1;translate:0 0}

/* categories / steps / features / posts / cta */
.cats{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:0;border:1px solid var(--ln);border-radius:var(--r);overflow:hidden;background:var(--pn)}
.cat{display:grid;grid-template-columns:44px 1fr auto 24px;align-items:center;gap:12px;padding:20px 22px;border-bottom:1px solid var(--ln);transition:background .15s}
.cat:nth-child(odd){border-inline-end:1px solid var(--ln)}
.cat:nth-last-child(-n+2){border-bottom:0}
.cat b{font-size:15px;white-space:nowrap}
.cat small{color:var(--mu);font-size:13px}
.cat .mono{color:var(--acc)}
.cat:hover{background:var(--bg2)}
.cat svg{color:var(--mu)}
.cat:hover svg{color:var(--acc)}
.steps{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.steps li{border-top:2px solid var(--ink);padding-top:16px;counter-increment:s}
.steps li .mono{color:var(--acc)}
.steps b{display:block;font-size:16px;margin:6px 0 4px}
.steps p{color:var(--mu);font-size:13.5px}
.feat{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--ln);border-radius:var(--r);background:var(--pn)}
.feat div{padding:24px 22px}
.feat div+div{border-inline-start:1px solid var(--ln)}
.feat svg{color:var(--acc)}
.feat b{display:block;font-size:15.5px;margin:14px 0 6px}
.feat p{color:var(--mu);font-size:13.5px;line-height:1.8}
.posts{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.post{background:var(--pn);border:1px solid var(--ln);border-radius:var(--r);padding:20px;display:flex;flex-direction:column;gap:8px;transition:border-color .15s}
.post:hover{border-color:var(--ink)}
.post b{font-size:15.5px;line-height:1.6}
.post p{color:var(--mu);font-size:13.5px}
.cta{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;background:var(--ink);color:var(--on-ink);border-radius:var(--r);padding:36px 40px;margin-bottom:8px}
.cta .mono{color:var(--acc)}
.cta h2{font-size:clamp(20px,2.2vw,25px);margin:6px 0}
.cta p{opacity:.7}
.cta-a{display:flex;gap:10px;flex-wrap:wrap}
.cta .btn-p{background:var(--acc);color:#fff}
.cta .btn-p:hover{background:var(--acc2)}
.cta .btn-o{border-color:color-mix(in srgb,var(--on-ink) 30%,transparent);color:var(--on-ink)}
.cta .btn-o:hover{border-color:var(--on-ink)}

/* filters */
.filters{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:20px}
.chips{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}
.filters .chips{margin:0}
.chip{padding:6px 13px;border:1px solid var(--ln2);border-radius:999px;font-size:13.5px;font-weight:500;background:var(--pn)}
.chip:hover{border-color:var(--ink)}
.chip.on{background:var(--ink);color:var(--on-ink);border-color:var(--ink)}
.srch{display:flex;gap:6px;margin-bottom:12px}
.filters .srch{margin:0}
.srch input,.srch select{height:36px;border:1px solid var(--ln2);border-radius:var(--r2);background:var(--pn);padding:0 12px;font-size:14px;min-width:0}
.srch input{width:220px}
.empty{display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center;padding:56px 20px;border:1px dashed var(--ln2);border-radius:var(--r);color:var(--mu)}
.empty b{color:var(--ink);font-size:17px}
.empty.sm{padding:28px 16px;border:0}

/* ===== Product page ===== */
.pd{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:32px;align-items:start;padding-top:20px}
.pd-hd{display:flex;gap:22px;align-items:flex-start;padding-bottom:28px;border-bottom:1px solid var(--ln)}
.pd-logo{width:76px;height:76px;border-radius:20px}
.pd-meta{margin-bottom:6px;text-align:right}
.pd h1{font-size:clamp(21px,2.3vw,27px);font-weight:900}
.pd-short{color:var(--tx2);margin-top:6px;font-size:14.5px}
.pd-tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:14px}
.pd-tabs{position:sticky;top:var(--hd);z-index:5;display:flex;gap:0;background:var(--bg);border-bottom:1px solid var(--ln);overflow-x:auto;scrollbar-width:none}
.pd-tabs a{padding:14px 16px;white-space:nowrap;color:var(--tx2);text-transform:none;font-family:var(--f);font-size:14px;letter-spacing:0;font-weight:700}
.pd-tabs a:hover{color:var(--acc)}
.pd-sec{padding:28px 0;border-bottom:1px solid var(--ln)}
.pd-sec h2{font-size:17px;margin-bottom:12px;display:flex;gap:10px;align-items:center}
.pd-sec h2 .mono{color:var(--acc);font-size:12px}
.prose p{color:var(--tx2);margin-bottom:10px;font-size:15px;line-height:1.95}
.prose p:last-child{margin-bottom:0}
.ticks{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px 24px}
.ticks li{display:flex;gap:10px;align-items:center;font-weight:500}
.ticks svg{color:var(--ok);padding:2px;border:1px solid currentColor;border-radius:2px;width:20px;height:20px}
.tbl-w{overflow-x:auto}
.tbl{width:100%;border-collapse:collapse;font-size:14.5px}
.tbl th{font-size:12.5px;color:var(--mu);font-weight:500;text-align:start;padding:10px 12px;border-bottom:1px solid var(--ln2);white-space:nowrap}
.tbl td{padding:12px;border-bottom:1px solid var(--ln);vertical-align:middle}
.tbl tbody tr:hover{background:var(--pn2)}
.tbl a:not(.lnk):not(.btn){font-weight:700}
.tbl a:hover{color:var(--acc)}
.faq{border:1px solid var(--ln);border-radius:var(--r);background:var(--pn)}
.faq details+details{border-top:1px solid var(--ln)}
.faq summary{list-style:none;cursor:pointer;padding:16px 18px;font-weight:700;display:flex;justify-content:space-between;gap:12px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--m);color:var(--acc);font-size:18px;line-height:1.4}
.faq details[open] summary::after{content:"−"}
.faq details p{padding:0 18px 18px;color:var(--tx2)}
.buy{position:sticky;top:calc(var(--hd) + 16px);display:grid;gap:12px}
.buy-f,.notify,.co-s{background:var(--pn);border:1px solid var(--ln2);border-radius:var(--r);padding:18px;display:grid;gap:14px}
.buy-h{display:flex;justify-content:space-between;align-items:center;font-weight:800;padding-bottom:12px;border-bottom:1px solid var(--ln)}
.buy-h .mono{color:var(--acc)}
.plans{border:0;margin:0;padding:0;display:grid;gap:8px}
.pl{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:12px 14px;border:1px solid var(--ln);border-radius:var(--r2);cursor:pointer;transition:border-color .12s,background .12s}
.pl:hover{border-color:var(--ln2)}
.pl:has(input:checked){border-color:var(--ink);background:var(--pn2);box-shadow:inset 3px 0 0 var(--acc)}
.pl.off{opacity:.5;cursor:not-allowed}
.pl input{accent-color:var(--acc);width:18px;height:18px;margin:0}
.pl-t b{display:block;font-size:14.5px}
.pl-t small{font-size:12.5px;color:var(--mu)}
.pl-p{text-align:left;display:flex;flex-direction:column;line-height:1.4}
.pl-p b{font-variant-numeric:tabular-nums;font-size:15px}
.pl-p s{font-size:12px;color:var(--mu)}
.buy-sum{display:flex;justify-content:space-between;align-items:center;padding:12px 0 0;border-top:1px dashed var(--ln2)}
.buy-n{display:flex;gap:6px;align-items:center;font-size:12.5px;color:var(--mu);justify-content:center}
.notify b{font-size:15px}.notify p{font-size:13.5px;color:var(--mu)}
.notify select,.notify input,.cpn input{height:38px;border:1px solid var(--ln2);border-radius:var(--r2);background:var(--pn);padding:0 10px;width:100%}
.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.notify .row input{flex:1;width:auto}
.ask{display:flex;gap:12px;align-items:center;padding:14px 16px;border:1px solid var(--ln);border-radius:var(--r);background:var(--pn)}
.ask:hover{border-color:var(--ink)}
.ask svg{color:var(--acc)}
.ask b{display:block;font-size:14.5px}.ask small{color:var(--mu);font-size:12.5px}

/* status pills */
.st{display:inline-flex;align-items:center;gap:6px;padding:3px 9px;border-radius:999px;font-size:12.5px;font-weight:700;border:1px solid var(--ln2);background:var(--pn);white-space:nowrap}
.st i{width:6px;height:6px;border-radius:50%;background:var(--mu)}
.st-ok{color:var(--ok);background:var(--oks);border-color:transparent}.st-ok i{background:var(--ok)}
.st-bad{color:var(--bad);background:var(--bads);border-color:transparent}.st-bad i{background:var(--bad)}
.st-wait{color:var(--wait);background:var(--waits);border-color:transparent}.st-wait i{background:var(--wait)}
.st-info{color:var(--info);background:var(--infos);border-color:transparent}.st-info i{background:var(--info)}
.st-acc{color:var(--acc);background:var(--accs);border-color:transparent}.st-acc i{background:var(--acc)}

/* ===== Cart / checkout ===== */
.prog{list-style:none;padding:0;margin:0 0 24px;display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.prog li{border-top:3px solid var(--ln2);padding-top:8px;text-transform:none;font-family:var(--f);letter-spacing:0;font-size:13px}
.prog li.done{border-color:var(--ink);color:var(--ink)}
.prog li.on{border-color:var(--acc);color:var(--ink);font-weight:700}
.cart{background:var(--pn);border:1px solid var(--ln);border-radius:var(--r)}
.ci{display:grid;grid-template-columns:auto 1fr auto auto;gap:14px;align-items:center;padding:16px 18px;border-bottom:1px solid var(--ln)}
.ci-l{width:42px;height:42px;display:grid;place-items:center;border:1px solid var(--ln);border-radius:var(--r2);color:var(--brand);background:var(--pn2)}
.ci-l.sm{width:30px;height:30px}
.ci-t a{font-weight:800}
.ci-t small{display:block;font-size:13px;color:var(--mu)}
.cart-f{display:flex;justify-content:space-between;align-items:center;padding:18px}
.cart-a{display:flex;gap:10px;padding:0 18px 18px}
.cart-a .btn-lg{flex:1}
.co{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:28px;align-items:start}
.co-s{position:sticky;top:calc(var(--hd) + 16px)}
.co-l{display:grid;grid-template-columns:1fr auto;gap:0 10px;font-size:14.5px}
.co-l span:first-child{font-weight:700}
.co-l small{grid-row:2;color:var(--mu);font-size:12.5px}
.co-l .num{grid-row:1/3;grid-column:2;align-self:center}
.cpn{display:flex;gap:6px}
.err-t{color:var(--bad);font-size:13px}
.co-t{display:flex;justify-content:space-between;font-size:14.5px;color:var(--tx2)}
.co-g{border-top:1px dashed var(--ln2);padding-top:12px;align-items:center;color:var(--ink);font-weight:700}

/* ===== Forms ===== */
.frm{display:grid;gap:16px}
.fld{display:grid;gap:6px}
.fld label{font-weight:700;font-size:14px}
.fld input,.fld select,.fld textarea{width:100%;min-height:44px;padding:9px 12px;border:1px solid var(--ln2);border-radius:var(--r2);background:var(--pn);font-size:14.5px;transition:border-color .12s}
.fld textarea{resize:vertical;min-height:96px;line-height:1.8}
.fld input:focus,.fld select:focus,.fld textarea:focus{border-color:var(--ink);outline:0;box-shadow:0 0 0 3px var(--accs)}
.fld input[type=color]{padding:4px;height:46px}
.fld input:disabled{opacity:.6}
.otp{font-family:var(--m);font-size:22px!important;letter-spacing:.5em;text-align:center}
.pay{border:0;margin:0;padding:0;display:grid;gap:8px}
.pay legend{font-weight:700;font-size:14px;margin-bottom:6px;padding:0}
.po{display:flex;gap:12px;align-items:flex-start;padding:14px;border:1px solid var(--ln);border-radius:var(--r2);cursor:pointer;background:var(--pn)}
.po:has(input:checked){border-color:var(--ink);box-shadow:inset 3px 0 0 var(--acc)}
.po.off{opacity:.55;cursor:not-allowed}
.po input{accent-color:var(--acc);margin-top:6px;width:17px;height:17px}
.po b{display:block;font-size:14.5px}.po small{font-size:13px;color:var(--mu)}
.chk{display:flex;gap:10px;align-items:center;font-size:14.5px;cursor:pointer}
.chk input{accent-color:var(--acc);width:18px;height:18px;margin:0;flex:none}
.chk a{border-bottom:1px solid var(--ln2);font-weight:700}
.chk.sm{font-size:13px}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.row3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}

/* ===== Auth ===== */
.auth{display:grid;place-items:center;padding-block:64px}
.auth-card{width:100%;max-width:440px;background:var(--pn);border:1px solid var(--ln2);border-radius:var(--r);padding:32px;display:grid;gap:14px}
.auth-k{color:var(--acc)}
.auth-card h1{font-size:22px}
.auth-card p{color:var(--tx2);font-size:15px}
.auth-card p a{border-bottom:1px solid var(--ln2);font-weight:700}
.auth-n{font-size:13px!important;color:var(--mu)!important}
.resend{justify-self:start}

/* ===== Account ===== */
.acc{display:grid;grid-template-columns:240px minmax(0,1fr);gap:28px;padding-block:32px 0;align-items:start}
.acc-nav{position:sticky;top:calc(var(--hd) + 16px);background:var(--pn);border:1px solid var(--ln);border-radius:var(--r);padding:8px}
.acc-u{padding:12px;border-bottom:1px solid var(--ln);margin-bottom:6px;display:grid}
.acc-u b{font-size:17px}.acc-u small{color:var(--mu)}
.acc-nav nav{display:grid}
.acc-nav nav a{position:relative;padding:10px 12px;border-radius:var(--r2);font-weight:500;font-size:14.5px;display:flex;justify-content:space-between;align-items:center}
.acc-nav nav a:hover{background:var(--bg2)}
.acc-nav nav a[aria-current]{background:var(--ink);color:var(--on-ink)}
.acc-nav nav .cnt{position:static}
.acc-nav form{padding:10px 12px;border-top:1px solid var(--ln);margin-top:6px}
.acc-b{display:grid;gap:16px;min-width:0}
.acc-h{font-size:22px}
.acc-ht{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.kpis{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--ln);border-radius:var(--r);background:var(--pn)}
.kpis.k4{grid-template-columns:repeat(4,1fr)}
.kpis div{padding:18px 20px;display:grid}
.kpis div+div{border-inline-start:1px solid var(--ln)}
.kpis b{font-size:22px;font-weight:900;font-variant-numeric:tabular-nums}
.kpis small{color:var(--mu);font-size:13px}
.kpis .mono{color:var(--acc)}
.box{background:var(--pn);border:1px solid var(--ln);border-radius:var(--r);padding:18px;display:grid;gap:14px;min-width:0}
.box-h{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.box-h b{font-size:16px}
.box-h.sub{padding-top:12px;border-top:1px solid var(--ln)}
.oi{border:1px solid var(--ln);border-radius:var(--r2);padding:14px;display:grid;gap:12px}
.oi-h{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center}
.oi-h:not(:has(.ci-l)){grid-template-columns:1fr auto}
.oi-h small{display:block;color:var(--mu);font-size:13px}
.deliv{border:1px solid var(--ok);border-radius:var(--r2);overflow:hidden}
.deliv-h{display:flex;justify-content:space-between;align-items:center;padding:8px 12px;background:var(--oks);color:var(--ok)}
.deliv pre{margin:0;padding:14px;font-family:var(--m);font-size:13.5px;white-space:pre-wrap;word-break:break-word;background:var(--pn2);text-align:left}
.sumdl{margin:0;display:grid}
.sumdl div{display:flex;justify-content:space-between;gap:16px;padding:9px 0;border-bottom:1px solid var(--ln);font-size:14.5px}
.sumdl div:last-child{border-bottom:0}
.sumdl dt{color:var(--mu)}.sumdl dd{margin:0;text-align:left}
.cardno{font-size:22px;color:var(--ink);letter-spacing:.12em;padding:14px;border:1px dashed var(--ln2);border-radius:var(--r2);text-align:center;background:var(--pn2)}
.row-f{grid-template-columns:1fr auto;align-items:end}
.thread{display:grid;gap:12px}
.msg{max-width:80%;border:1px solid var(--ln);border-radius:var(--r);background:var(--pn);overflow:hidden}
.msg.me{justify-self:start}
.msg.them{justify-self:end;border-color:var(--ln2);background:var(--pn2)}
.msg.them .msg-h{color:var(--acc)}
.msg-h{display:flex;justify-content:space-between;gap:16px;padding:8px 14px;border-bottom:1px solid var(--ln)}
.msg-b{padding:12px 14px;font-size:14.5px;white-space:normal;word-break:break-word}

/* content */
.art{max-width:780px;padding-block:32px 0}
.art h1{font-size:clamp(23px,2.8vw,32px);margin:8px 0 24px}
.sup{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.sup-c{background:var(--pn);border:1px solid var(--ln);border-radius:var(--r);padding:22px;display:grid;gap:8px}
.sup-c:hover{border-color:var(--ink)}
.sup-c svg{color:var(--acc)}
.sup-c p{color:var(--mu);font-size:14px}
.err{text-align:center;padding-block:96px;display:grid;justify-items:center;gap:12px}
.err .mono{color:var(--acc)}
.err h1{font-size:30px}

/* ===== Footer ===== */
.ft{margin-top:96px;border-top:1px solid var(--ln);background:var(--pn2)}
.ft-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:32px;padding-block:48px 32px}
.ft-grid h4{font-size:13px;color:var(--mu);font-weight:700;margin-bottom:10px}
.ft-grid>div{display:flex;flex-direction:column;gap:8px;font-size:14.5px}
.ft-grid>div a:hover{color:var(--acc)}
.ft-grid .mono{font-size:13px;color:var(--ink);text-transform:none;text-align:right}
.ft-about p{color:var(--mu);font-size:14px;max-width:340px;margin-top:8px}
.ft-h{color:var(--mu);font-size:13.5px}
.ft-bot{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;border-top:1px solid var(--ln);padding-block:18px;font-size:13px;color:var(--mu)}

.toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%,20px);background:var(--ink);color:var(--on-ink);padding:12px 18px;border-radius:var(--r2);font-size:14.5px;font-weight:700;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;z-index:60;box-shadow:0 12px 32px -12px rgba(0,0,0,.4)}
.toast.show{opacity:1;transform:translate(-50%,0)}
.toast::before{content:"";display:inline-block;width:7px;height:7px;background:var(--acc);margin-inline-end:10px;vertical-align:1px}

/* ===== Admin ===== */
.adm{display:grid;grid-template-columns:248px minmax(0,1fr);min-height:100vh}
.adm-side{position:sticky;top:0;height:100vh;overflow-y:auto;border-inline-end:1px solid var(--ln);background:var(--pn);padding:18px 12px;display:flex;flex-direction:column;gap:18px}
.adm-side .brand{padding:0 8px}
.adm-side nav{display:grid;gap:2px}
.adm-side nav a{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:var(--r2);font-size:14.5px;font-weight:500;color:var(--tx2)}
.adm-side nav a:hover{background:var(--bg2);color:var(--ink)}
.adm-side nav a[aria-current]{background:var(--ink);color:var(--on-ink)}
.adm-side nav .cnt{position:static;margin-inline-start:auto}
.adm-me{margin-top:auto;display:grid;gap:8px;padding:12px 8px 0;border-top:1px solid var(--ln);justify-items:start}
.adm-main{padding:28px 32px 64px;display:grid;gap:16px;align-content:start;min-width:0}
.adm-main.adm-auth{grid-column:1/-1;place-items:center;min-height:100vh}
.adm-top{display:flex;justify-content:space-between;align-items:center;gap:12px;padding-bottom:12px;border-bottom:1px solid var(--ln)}
.adm-top h1{font-size:21px}
.adm-env{color:var(--acc)}
.adm-2{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
.bars{display:flex;justify-content:space-between;gap:6px;align-items:flex-end;height:180px;padding-top:10px}
.bar{flex:1;max-width:40px;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:6px}
.bar span{width:100%;height:var(--h);min-height:2px;background:var(--ink);border-radius:2px 2px 0 0}
.bar:hover span{background:var(--acc)}
.bar small{font-size:9.5px}
.plan-row{display:grid;grid-template-columns:minmax(0,1.8fr) 56px minmax(0,1fr) minmax(0,1fr) 84px minmax(0,1.1fr) 60px 96px 60px 70px;gap:8px;align-items:center;padding:8px 0;border-bottom:1px solid var(--ln)}
.plan-row .chk input{width:18px;height:18px;padding:0}
.plan-head{font-size:12px;color:var(--mu);border-bottom:1px solid var(--ln2);padding-bottom:6px}
.plan-row input:not([type=checkbox]),.plan-row select{height:38px;border:1px solid var(--ln2);border-radius:var(--r2);background:var(--pn);padding:0 8px;font-size:14px;width:100%;min-width:0}

/* ===== Skin extras ===== */
.ann{background:linear-gradient(90deg,#0E7490,#06B6D4);color:#fff}
.ann .w{display:flex;align-items:center;gap:8px}
.hd{background:color-mix(in srgb,var(--bg) 82%,transparent)}
.btn{border-radius:14px;font-weight:700;transition:background .25s,border-color .25s,color .25s,transform .25s,box-shadow .25s}
.btn-p{background:var(--ink);color:var(--on-ink)}
.btn-p:hover{background:var(--acc);color:#fff}
[data-theme=dark] .btn-p:hover{color:#0B1220}
.btn-o{background:var(--pn);border-color:var(--ln)}
.btn-o:hover{border-color:var(--acc);color:var(--acc)}
.ib{border-radius:12px}.ib:hover{border-color:var(--acc);color:var(--acc)}
.nav a{border-radius:10px}.nav a[aria-current]{box-shadow:none;color:var(--acc);background:var(--accs);border-radius:10px}
.lbl{display:inline-block;font-size:12.5px;font-weight:700;color:var(--acc)}
.sh-k{color:var(--acc);font-size:13px}
.cat-n{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;background:var(--accs);color:var(--acc);font-weight:800}
.cats{gap:14px;border:0;background:none;overflow:visible}
.cat,.cat:nth-child(odd),.cat:nth-last-child(-n+2){border:1px solid var(--ln);border-radius:18px;background:var(--pn);transition:transform .3s,border-color .3s,box-shadow .3s}
.cat:hover{border-color:var(--acc);background:var(--pn)}
.steps li{border-top:0;background:var(--pn);border:1px solid var(--ln);border-radius:18px;padding:20px}
.steps li .lbl{background:var(--accs);padding:3px 10px;border-radius:999px}
.feat{gap:14px;border:0;background:none}
.feat div,.feat div+div{border:1px solid var(--ln);border-radius:18px;background:var(--pn)}
.feat svg{width:44px;height:44px;padding:11px;border-radius:14px;background:var(--accs)}
.post{border-radius:18px;transition:transform .3s,border-color .3s}.post:hover{border-color:var(--acc)}
.cta{background:linear-gradient(135deg,#0F172A,#0E3A4A);color:#fff;border-radius:24px}
.cta .lbl{color:#67E8F9}.cta .btn-p{background:#fff;color:#0F172A}.cta .btn-p:hover{background:var(--acc2);color:#0F172A}
.cta .btn-o{background:transparent;border-color:rgba(255,255,255,.3);color:#fff}
.chip{border-color:var(--ln)}.chip:hover{border-color:var(--acc);color:var(--acc)}.chip.on{background:var(--acc);border-color:var(--acc);color:#fff}
[data-theme=dark] .chip.on{color:#0B1220}
.pd-tabs a{font-family:var(--f);text-transform:none;letter-spacing:0;font-size:14.5px}
.pl:has(input:checked){border-color:var(--acc)!important;box-shadow:0 0 0 3px var(--accs)}
.fld input:focus,.fld select:focus,.fld textarea:focus{border-color:var(--acc);box-shadow:0 0 0 3px var(--accs)}
.st{border-radius:999px}
.ft{background:var(--pn2)}
.adm-side nav a[aria-current]{background:var(--acc)!important;color:#fff!important}
[data-theme=dark] .adm-side nav a[aria-current]{color:#0B1220!important}
.adm-env{font-size:12.5px;font-weight:700;color:var(--acc);background:var(--accs);padding:5px 12px;border-radius:999px}
.bar span{background:linear-gradient(180deg,var(--acc2),var(--acc))!important;border-radius:6px 6px 0 0}

/* ===== SOLAI v3 ===== */
.skip:not(:focus){clip-path:inset(50%)}
.brand{display:flex;align-items:center}
.wm{display:block;height:20px;width:auto}
.wm-s{fill:var(--ink)}.wm-a{fill:var(--acc)}
.brand-ft{flex-direction:column;align-items:flex-start;gap:12px}
.brand-ft .wm{height:24px}
.brand-ft .brand-tx b{font-size:14.5px;font-weight:800}
.brand-adm{flex-direction:column;align-items:flex-start;gap:6px}
.brand-adm small{font-size:12px;color:var(--mu)}
/* hero: floating brand tiles, typing word, pulse */
.pill i{width:8px;height:8px;border-radius:50%;background:var(--acc2);animation:pulse 2s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--acc2) 60%,transparent)}70%,100%{box-shadow:0 0 0 10px transparent}}
.ty{display:inline-block;transition:color .3s;white-space:nowrap}
.js .ty::after{content:"";display:inline-block;width:4px;height:.82em;background:currentColor;margin-left:6px;vertical-align:-3px;border-radius:2px;animation:caret 1s steps(1) infinite}
@keyframes caret{50%{opacity:0}}
.hero h1{white-space:nowrap}
.float{position:relative;height:440px}
.tl{position:absolute;width:calc(96px*var(--s));height:calc(96px*var(--s));border-radius:calc(28px*var(--s));background:linear-gradient(140deg,var(--brand),color-mix(in srgb,var(--brand) 62%,#000));color:#fff;display:grid;place-items:center;box-shadow:0 24px 44px -6px color-mix(in srgb,var(--brand) 50%,transparent);animation:bob 6s ease-in-out infinite var(--dl);transition:translate .5s ease-out}
.tl svg{filter:drop-shadow(0 2px 4px rgba(0,0,0,.18))}
[data-theme=dark] .tl{outline:1px solid rgba(255,255,255,.14)}
@keyframes bob{0%,100%{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-22px) rotate(4deg)}}
.hero .btn-p{position:relative;overflow:hidden}
.hero .btn-p::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 30%,rgba(255,255,255,.35) 50%,transparent 70%);transform:translateX(-120%);animation:shine 4s infinite 1.5s}
@keyframes shine{0%{transform:translateX(-120%)}35%,100%{transform:translateX(120%)}}
/* soft framed pages (product) */
.pg-soft{background:var(--bg2)}
.pg-soft .hd{background:color-mix(in srgb,var(--pn) 90%,transparent)}
.pnl{background:var(--pn);border:1px solid var(--ln);border-radius:20px;box-shadow:var(--sh-s)}
.pd{gap:24px}
.pd-main{display:grid;gap:16px;min-width:0}
.pd-hd.pnl{padding:24px;border:1px solid var(--ln)}
.pd-tabs{top:calc(var(--hd) + 10px);background:var(--pn);border:1px solid var(--ln);border-radius:16px;padding:0 8px;box-shadow:var(--sh-s)}
.pd-tabs a{padding:12px 14px;font-size:14px}
.pd-sec.pnl{padding:22px 24px;border:1px solid var(--ln)}
.pd-sec .faq{box-shadow:none}
.buy-f.pnl,.notify.pnl{border-color:var(--ln);padding:20px}
.ask.pnl{border-color:var(--ln)}
.ask:hover{border-color:var(--acc)}
.pl{padding:11px 13px}
.pl-t b{font-size:14px}
.pg-soft :is(.prose p,.pd-short,.ticks li,.tbl td,.faq details p,.pl-t small,.buy-n,.ask small,.notify p,.crumbs){font-weight:300}
.pg-soft .ticks li{font-weight:300;color:var(--tx2)}
/* floating support chat */
.sw-btn{position:fixed;left:20px;bottom:20px;z-index:55;display:inline-flex;align-items:center;gap:8px;height:50px;padding:0 16px 0 20px;border-radius:999px;border:0;background:var(--ink);color:var(--on-ink);font-weight:700;font-size:14px;box-shadow:0 10px 30px rgba(15,23,42,.2);cursor:pointer;transition:background .2s,color .2s}
.sw-btn:hover,.sw-btn.on{background:var(--acc);color:#fff}
[data-theme=dark] .sw-btn:hover,[data-theme=dark] .sw-btn.on{color:#0B1220}
.sw-panel{position:fixed;left:20px;bottom:82px;z-index:56;width:min(370px,calc(100vw - 32px));max-height:calc(100vh - 110px);display:flex;flex-direction:column;background:var(--pn);border:1px solid var(--ln);border-radius:20px;box-shadow:0 20px 60px rgba(15,23,42,.2);overflow:hidden}
.sw-panel[hidden]{display:none}
.sw-h{display:flex;align-items:center;gap:12px;padding:14px 16px;background:linear-gradient(135deg,#0F172A,#0E3A4A);color:#fff}
.sw-av svg{width:38px;height:38px;border-radius:10px;outline:1px solid rgba(255,255,255,.18)}
.sw-h b{display:block;font-size:14.5px;line-height:1.5}
.sw-h small{font-size:12px;opacity:.75}
.sw-x{margin-inline-start:auto;width:34px;height:34px;display:grid;place-items:center;border:0;border-radius:10px;background:transparent;color:inherit;cursor:pointer}
.sw-x:hover{background:rgba(255,255,255,.12)}
.sw-log{flex:1;min-height:150px;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:10px;background:var(--bg2)}
.sw-m{max-width:86%;padding:9px 13px;border-radius:16px;font-size:13.5px;line-height:1.85;white-space:pre-wrap;word-break:break-word}
.sw-m.them{align-self:flex-start;background:var(--pn);border:1px solid var(--ln);border-start-start-radius:4px}
.sw-m.me{align-self:flex-end;background:var(--acc);color:#fff;border-end-end-radius:4px}
[data-theme=dark] .sw-m.me{color:#0B1220}
.sw-m.err{align-self:flex-start;background:var(--bads);color:var(--bad)}
.sw-m a{font-weight:700;border-bottom:1px solid currentColor}
.sw-f{display:grid;gap:8px;padding:12px;border-top:1px solid var(--ln);background:var(--pn)}
.sw-in{width:100%;border:1px solid var(--ln2);border-radius:14px;background:var(--pn);padding:9px 12px;font-size:14px}
.sw-in:focus{outline:0;border-color:var(--acc);box-shadow:0 0 0 3px var(--accs)}
input.sw-in{height:42px}
input.sw-in:placeholder-shown{direction:rtl}
.sw-row{display:flex;gap:8px;align-items:flex-end}
textarea.sw-in{resize:none;min-height:44px;max-height:120px;line-height:1.7}
.sw-send{flex:none;width:44px;height:44px;display:grid;place-items:center;border:0;border-radius:14px;background:var(--acc);color:#fff;cursor:pointer}
.sw-send svg{transform:scaleX(-1)}
[data-theme=dark] .sw-send{color:#0B1220}
.sw-send[disabled]{opacity:.5}
.sw-n{font-size:11.5px;color:var(--mu);line-height:1.7}
.sw-n a{color:var(--acc);font-weight:700}
.cat,.cat:nth-child(odd),.cat:nth-last-child(-n+2){grid-template-columns:36px minmax(0,1fr) 18px;grid-template-rows:auto auto;gap:0 12px;padding:14px 16px}
.cat .cat-n{grid-row:1/3}.cat b{grid-column:2;line-height:1.6}.cat small{grid-column:2;grid-row:2;line-height:1.5}.cat svg{grid-column:3;grid-row:1/3}
.sw-dot{position:absolute;top:-4px;left:-4px;min-width:20px;height:20px;padding:0 5px;border-radius:10px;background:var(--bad);color:#fff;font-size:11px;font-weight:800;display:grid;place-items:center;line-height:1;box-shadow:0 0 0 2px var(--bg)}
.sw-dot[hidden]{display:none}
.sw-av{position:relative}
.sw-av i{position:absolute;bottom:-2px;left:-2px;width:11px;height:11px;border-radius:50%;background:#22C55E;box-shadow:0 0 0 2px #0F172A}
.sw-m{display:grid;gap:2px}
.sw-m time{font-size:10.5px;opacity:.6;justify-self:end;font-variant-numeric:tabular-nums}
.sw-m.sys{background:transparent;border:1px dashed var(--ln2);color:var(--mu);font-size:12.5px;align-self:center;max-width:94%;text-align:center}
.sw-m.sys time{display:none}
.sw-log{scroll-behavior:smooth}
.sw-mob[hidden]{display:none}
/* admin: live chat */
.chl{display:grid}
.chl-i{display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:12px;align-items:center;padding:12px 10px;border-bottom:1px solid var(--ln);border-radius:12px}
.chl-i:hover{background:var(--bg2)}
.chl-i.new b{color:var(--acc)}
.chl-av{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:var(--accs);color:var(--acc)}
.chl-t{display:grid;min-width:0}.chl-t small{color:var(--mu);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chl-m{display:grid;justify-items:end;gap:4px}.chl-m small{color:var(--mu);font-size:12px}.chl-m .cnt{position:static}
.adm-chat{padding:0;overflow:hidden;gap:0}
.adm-log{height:min(60vh,560px);min-height:260px}
/* admin: guest messages */
.gm{display:grid;gap:10px}
.gm-i{border:1px solid var(--ln);border-radius:14px;padding:14px;display:grid;gap:10px}
.gm-h{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.gm-h .st{margin-inline-start:auto}
.gm-b{white-space:pre-wrap;word-break:break-word;font-size:14.5px}
@media (max-width:1180px){.grid-p{grid-template-columns:repeat(3,1fr)}}

/* ===== Responsive ===== */
@media (max-width:1080px){
  .nav{display:none}.nav-tg{display:inline-grid}
  .hero-in{grid-template-columns:1fr;gap:20px;padding-block:48px;min-height:0}
  .grid-p,.posts{grid-template-columns:1fr 1fr}
  .float{height:320px;max-width:560px;width:100%;margin-inline:auto}
  .feat,.steps{grid-template-columns:1fr 1fr}
  .feat div:nth-child(3){border-inline-start:0}
  .feat div:nth-child(n+3){border-top:1px solid var(--ln)}
  .pd,.co{grid-template-columns:1fr}
  .buy,.co-s{position:static}
  .ft-grid{grid-template-columns:1fr 1fr}
  .adm{grid-template-columns:1fr}
  .adm-side{position:static;height:auto}
  .adm-side nav{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}
  .plan-row{grid-template-columns:1fr 1fr 1fr}
}
@media (max-width:720px){
  .w{padding-inline:16px}
  .hd-act{gap:6px}.hd-acc span{display:none}.hd-acc{width:40px;padding:0}
  .brand-tx small{display:none}
  .grid-p,.posts,.cats,.sup,.ticks,.row2,.row3,.adm-2{grid-template-columns:1fr}
  .cat:nth-child(odd){border-inline-end:0}.cat:nth-last-child(2){border-bottom:1px solid var(--ln)}
  .feat,.steps{grid-template-columns:1fr}
  .feat div+div{border-inline-start:0;border-top:1px solid var(--ln)}
  .hero-facts{flex-direction:column;gap:10px}
  .sec{padding-top:48px}
  .hero h1{white-space:normal}
  .hero-in>*{min-width:0}
  .float{order:2;height:auto;display:flex;justify-content:center;gap:9px;padding:14px 0 6px;margin:0}
  .tl:nth-child(n+7){display:none}
  .tl{position:relative;left:auto!important;top:auto!important;width:46px;height:46px;border-radius:14px;box-shadow:0 10px 20px -6px color-mix(in srgb,var(--brand) 50%,transparent);animation-name:bob-s}
  .tl svg{width:24px;height:24px}
  @keyframes bob-s{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
  .sw-btn{left:14px;bottom:14px;width:52px;height:52px;padding:0;justify-content:center}.sw-btn span{display:none}
  .sw-panel{left:8px;right:8px;bottom:76px;width:auto}
  .pd-hd.pnl,.pd-sec.pnl{padding:18px}
  .pd-hd{flex-direction:column;gap:14px}.pd-logo{width:64px;height:64px}
  .ci{grid-template-columns:auto 1fr auto;}.ci .price{grid-column:2;grid-row:2}.ci form{grid-row:1/3;grid-column:3}
  .acc{grid-template-columns:1fr}.acc-nav{position:static}
  .acc-nav nav{grid-template-columns:repeat(4,auto);overflow-x:auto}
  .kpis,.kpis.k4{grid-template-columns:1fr 1fr}.kpis div:nth-child(3){border-inline-start:0}.kpis div:nth-child(n+3){border-top:1px solid var(--ln)}
  .cta{padding:28px 22px}
  .ft-grid{grid-template-columns:1fr}
  .msg{max-width:100%}
  .row-f{grid-template-columns:1fr}
  .srch input{width:100%}.filters .srch{width:100%}
  .adm-main{padding:20px 16px 48px}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}html{scroll-behavior:auto}}
@media print{.hd,.ft,.ann,.toast,.sw-btn,.sw-panel{display:none}}
/* chat: edit/delete + sound */
.sw-snd{margin-inline-start:auto}.sw-snd+.sw-x{margin-inline-start:0}
.sw-snd .slash,#sndBtn .slash{display:none}.sw-snd.off .slash,#sndBtn.off .slash{display:inline}.sw-snd.off,#sndBtn.off{opacity:.6}
.adm-top #sndBtn{margin-inline-start:auto;width:34px;height:34px}
.sw-m{position:relative}
.sw-m[tabindex]{cursor:pointer;outline:0}
.sw-ft{display:flex;align-items:center;justify-content:flex-end;gap:6px;min-height:18px}
.sw-acts{display:none;gap:2px}
.sw-m:hover .sw-acts,.sw-m:focus-within .sw-acts,.sw-m.act .sw-acts{display:inline-flex}
.sw-acts button{display:grid;place-items:center;width:24px;height:22px;border:0;border-radius:6px;background:transparent;color:inherit;opacity:.75;cursor:pointer;padding:0}
.sw-acts button:hover{opacity:1;background:rgba(127,127,127,.18)}
.sw-m.del{background:transparent!important;color:var(--mu)!important;border:1px dashed var(--ln2)!important;font-style:italic;font-size:12.5px}
.sw-edit{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:6px 10px;border-radius:10px;background:var(--accs);color:var(--acc);font-size:12.5px;font-weight:700}
.sw-edit[hidden]{display:none}
.sw-edit button{border:0;background:transparent;color:inherit;font:inherit;cursor:pointer;text-decoration:underline}
@media (hover:none){.sw-m:hover .sw-acts{display:none}.sw-m.act .sw-acts{display:inline-flex}}

/* === mobile-fit patch (additive) === */
@media (max-width:720px){
  html,body{overflow-x:hidden}
  .grid-p{grid-template-columns:1fr!important}
  .pc-body h3{white-space:normal!important;overflow:visible!important;text-overflow:clip!important;line-height:1.65}
  .pc-foot{flex-wrap:wrap;row-gap:10px}
  .pc-from{white-space:normal}
  .srch input{width:100%!important}
  .w{padding-inline:14px}
  img,svg{max-width:100%}
}

/* === pd-mobile-fix (additive) === */
@media (max-width:720px){
  .pd{grid-template-columns:minmax(0,1fr)!important;gap:16px}
  .pd-hd{flex-wrap:wrap;gap:14px}
  .pd h1,.pd-short,.pc-body p,.pc-body h3{overflow-wrap:anywhere}
  .buy{order:-1;position:static}
  .pd-tabs{overflow-x:auto}
}
@media (max-width:1080px){
  .pd{grid-template-columns:minmax(0,1fr) 320px}
}

/* === frame-fix (additive, mobile) === */
@media (max-width:820px){
  .pd-main>*{min-width:0;max-width:100%}
  .tbl-w{min-width:0;max-width:100%;overflow-x:auto}
  .tbl{min-width:0;width:100%}
  .tbl th{white-space:normal}
  .pd-sec p,.pd-sec li,.pd-sec td,.pd-sec h2{overflow-wrap:anywhere;word-break:break-word}
  .pd-sec ul,.pd-sec ol{padding-inline-start:20px}
  .grid-p{grid-template-columns:1fr!important}
}

/* === table-scroll-fix (additive, mobile) === */
@media (max-width:820px){
  .tbl-w{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
  .pd-sec .tbl{width:620px!important;min-width:620px!important}
  .pd-sec .tbl th,.pd-sec .tbl td{
    white-space:normal!important;
    word-break:normal!important;
    overflow-wrap:normal!important;
    hyphens:none;
  }
  .pd-sec .tbl th:first-child,.pd-sec .tbl td:first-child{min-width:170px}
  .pd-sec .tbl td.num,.pd-sec .tbl th.num{white-space:nowrap!important}
}