/* Obsidian visual refresh — presentation-only layer. Existing app logic untouched. */
:root{
  --bg:#07070b;--bg-1:#0d0c12;--surface:#111117;--surface-2:#17151f;--surface-3:#211d2b;
  --glass:rgba(255,255,255,.025);--glass-2:rgba(255,255,255,.055);
  --hair:rgba(255,255,255,.055);--line:rgba(255,255,255,.085);--line-str:rgba(255,255,255,.14);
  --line-v:rgba(167,112,255,.25);--ink:#f6f4fa;--ink-dim:#c6c0d1;--mute:#9993a5;--faint:#686373;
  --v:#8b42ff;--v-2:#a875ff;--v-soft:#c9aaff;--v-deep:#5d22b9;
  --v-glow:rgba(139,66,255,.28);--v-glow-soft:rgba(139,66,255,.11);
  --r-xs:7px;--r-sm:10px;--r:13px;--r-lg:17px;--r-xl:21px;--r-2xl:26px;
  --sh-1:0 3px 10px rgba(0,0,0,.22);--sh-2:0 16px 42px rgba(0,0,0,.28);--sh-3:0 26px 72px rgba(0,0,0,.42);--sh-v:0 12px 34px rgba(111,47,207,.2);
}
body{background:var(--bg);background-image:radial-gradient(ellipse 70% 36% at 50% -8%,rgba(112,60,181,.11),transparent 70%),linear-gradient(180deg,#09080d 0%,#07070b 54%,#09080d 100%);letter-spacing:-.006em}
::selection{background:rgba(155,103,255,.32);color:#fff}
a{transition:color .18s ease,background .18s ease,border-color .18s ease}
button,input,select,textarea{font:inherit}
:focus-visible{outline:2px solid rgba(182,139,255,.8);outline-offset:3px}
.wrap{max-width:1380px}
.ob-bg{opacity:.52}
.ob-grid{opacity:.18}
.ob-aurora{opacity:.34;filter:blur(50px)}
.ob-nav{border-bottom:1px solid rgba(255,255,255,.055);background:rgba(8,7,12,.72);backdrop-filter:blur(20px) saturate(1.15)}
.ob-nav .inner{max-width:1440px;padding-top:15px;padding-bottom:15px;gap:24px}
.ob-nav .brand .mark img{animation:none;filter:drop-shadow(0 2px 12px rgba(140,80,255,.2))}
.ob-nav .links{gap:3px;margin-left:14px}
.ob-nav .links a{font-size:13.5px;padding:10px 15px;border-radius:9px;color:#a7a1b0}
.ob-nav .links a::after{bottom:3px;height:1px}
.ob-nav .links a.on{background:rgba(255,255,255,.045);color:#f4f0fa}
.ob-nav .right{gap:9px}
.btn{border-radius:10px;font-weight:650;letter-spacing:-.01em;box-shadow:none;transition:transform .2s ease,box-shadow .2s ease,background .2s ease,border-color .2s ease}
.btn.solid{background:linear-gradient(135deg,#9c68ff,#7638d9);border:1px solid rgba(196,160,255,.35);box-shadow:0 6px 20px rgba(103,47,190,.18)}
.btn.solid:hover{transform:translateY(-1px);box-shadow:0 10px 26px rgba(103,47,190,.27)}
.btn.ghost{background:rgba(255,255,255,.025);border-color:rgba(255,255,255,.11)}
.btn.ghost:hover{background:rgba(255,255,255,.06);border-color:rgba(183,140,255,.3)}
.btn.sm{padding:9px 14px;font-size:12.5px}
.section{padding:82px 0}
.shead{margin-bottom:28px}
.shead h2{font-size:clamp(25px,3vw,36px);letter-spacing:-.045em}
.shead h2 i{font-style:normal;color:#b58aff}
.shead p{max-width:620px;color:#9690a1;font-size:14px}
.hero{min-height:610px;padding:88px 0 72px}
.hero .herobg{opacity:.27;filter:saturate(.72)}
.hero .herobg::after{background:linear-gradient(90deg,#07070b 0%,rgba(7,7,11,.9) 36%,rgba(7,7,11,.35) 100%),linear-gradient(0deg,#07070b,transparent 55%)}
.hero-copy{max-width:720px}
.hero h1{font-size:clamp(44px,6.4vw,78px);line-height:1.01;letter-spacing:-.065em;font-weight:800}
.hero h1 em{color:#c2a0ff;background:none;-webkit-text-fill-color:initial}
.hero p.sub{font-size:16px;line-height:1.75;color:#b6afc2;max-width:580px}
.hero .cta{gap:11px;margin-top:27px}
.hero .stats{margin-top:46px;border-top:1px solid rgba(255,255,255,.09);padding-top:20px}
.hero .stats .s b{font-size:23px;letter-spacing:-.04em}
.hero .stats .s span{font-size:10px;letter-spacing:.12em}
.hero-emblem{opacity:.72;filter:drop-shadow(0 15px 40px rgba(102,47,184,.16))}
.hero-chip{background:rgba(15,13,21,.72);border-color:rgba(255,255,255,.11);backdrop-filter:blur(16px);box-shadow:0 12px 34px rgba(0,0,0,.22)}
.trust{background:rgba(255,255,255,.018);border-top:1px solid rgba(255,255,255,.055);border-bottom:1px solid rgba(255,255,255,.055)}
.trust .t .ic{background:rgba(145,90,231,.09);border-color:rgba(172,127,255,.16)}
.feat{border:1px solid rgba(255,255,255,.09);border-radius:22px;overflow:hidden}
.feat .fbg{opacity:.24;filter:saturate(.7)}
.feat .fbg::after{background:linear-gradient(90deg,rgba(8,7,12,.96),rgba(8,7,12,.65)),linear-gradient(0deg,rgba(8,7,12,.8),transparent)}
.feat h3{font-size:clamp(28px,4vw,46px);letter-spacing:-.055em}
.feat .tag{border-color:rgba(190,151,255,.2);background:rgba(137,81,218,.09)}
.cats{gap:14px}
.cat{border:1px solid rgba(255,255,255,.075);border-radius:16px;background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.012));overflow:hidden;transition:transform .22s ease,border-color .22s ease,background .22s ease}
.cat:hover{transform:translateY(-3px);border-color:rgba(170,121,255,.27);background:rgba(255,255,255,.035)}
.cat .art{filter:saturate(.76);height:auto;aspect-ratio:1.6}
.cat .body{padding:17px 18px 19px}
.cat .body h4{font-size:15px;letter-spacing:-.02em}
.cat .body p{font-size:12.5px;color:#8e8899}
.grid{gap:15px}
.card{border:1px solid rgba(255,255,255,.075);border-radius:16px;background:linear-gradient(180deg,#15131b,#100f15);box-shadow:0 5px 18px rgba(0,0,0,.12);transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease}
.card::after{opacity:.2}
.card:hover{transform:translateY(-4px);border-color:rgba(174,125,255,.29);box-shadow:0 15px 36px rgba(0,0,0,.24),0 0 0 1px rgba(145,80,255,.04)}
.card .art{background:#14111b;filter:saturate(.76)}
.card .art img{transition:transform .5s ease,filter .5s ease}
.card:hover .art img{transform:scale(1.035);filter:saturate(.95)}
.card .body{padding:17px 18px 18px}
.card h4{font-size:16px;letter-spacing:-.025em}
.card p{font-size:12.5px;line-height:1.65;color:#9d97a8}
.card .foot{border-top:1px solid rgba(255,255,255,.06);padding-top:13px}
.card .foot .p{font-size:14px}
.card .ceyebrow{letter-spacing:.11em;font-size:9px;color:#b69ae2}
.band{border-top:1px solid rgba(255,255,255,.06);border-bottom:1px solid rgba(255,255,255,.06)}
.storehero{padding:58px 0 38px;border-bottom-color:rgba(255,255,255,.06)}
.storehero .shbg{opacity:.2;filter:saturate(.65)}
.storehero .shbg::after{background:linear-gradient(90deg,#08070d 0%,rgba(8,7,13,.8) 55%,rgba(8,7,13,.42)),linear-gradient(0deg,#08070d,transparent 65%)}
.storehero h1,.shero h1,.dhero h1,.thero h1{letter-spacing:-.055em;font-weight:800}
.storehero h1{font-size:clamp(38px,5vw,60px)}
.storehero #subtitle{font-size:14.5px;line-height:1.75;color:#aaa4b5}
.community,.hcommunity{background:rgba(15,13,21,.66);border-color:rgba(255,255,255,.1);backdrop-filter:blur(14px)}
.toolbar{border:1px solid rgba(255,255,255,.075);border-radius:14px;background:rgba(255,255,255,.018);padding:12px}
.chip,.fwchip{border-radius:8px;background:rgba(255,255,255,.025);border-color:rgba(255,255,255,.075);font-size:11.5px}
.chip.active,.fwchip.active{background:rgba(141,83,229,.13);border-color:rgba(176,127,255,.3);color:#d6c0ff}
.search{border-radius:10px;background:#0d0c12;border-color:rgba(255,255,255,.1)}
.search input{font-size:13px}
.sortsel{border-radius:10px;background:#0d0c12;border-color:rgba(255,255,255,.1)}
.crumb{font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:#797383}
main{min-height:55vh}
.top{gap:32px}
.phero{border-radius:19px;border-color:rgba(255,255,255,.1);box-shadow:0 24px 55px rgba(0,0,0,.24);background-color:#111018}
h1{letter-spacing:-.055em}
.tagline{font-size:15px;line-height:1.75;color:#aaa4b5}
.pchips .chip{background:rgba(145,85,228,.08);border-color:rgba(176,126,255,.2);font-size:10px}
.sec-h{font-size:23px;letter-spacing:-.04em}
.feats{gap:12px}
.feat{background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.012));border-color:rgba(255,255,255,.075)}
.feat:hover{border-color:rgba(176,126,255,.24)}
.feat h4{font-size:14px}
.feat p{font-size:12.5px;color:#9c96a7;line-height:1.7}
.desc{font-size:14px;line-height:1.85;color:#b7b1c1}
.buybox{background:linear-gradient(180deg,#17141e,#100f15);border-color:rgba(255,255,255,.095);border-radius:18px;box-shadow:0 18px 48px rgba(0,0,0,.24)}
.buybox .price{letter-spacing:-.04em}
.buybox ul{color:#aaa4b5}
.tiers{gap:12px}
.tier{background:linear-gradient(180deg,#15121c,#100e14);border-color:rgba(255,255,255,.08);border-radius:15px}
.tier.pop{border-color:rgba(177,129,255,.34);box-shadow:0 10px 28px rgba(98,45,171,.12)}
.tier h3{font-size:14px}
.tier .tp{letter-spacing:-.04em}
.linkcard{background:rgba(255,255,255,.025);border-color:rgba(255,255,255,.075);border-radius:13px}
.reviews{border-top:1px solid rgba(255,255,255,.06)}
.authwrap{max-width:1040px}
.authgrid{border-color:rgba(255,255,255,.09);border-radius:22px;background:#100f15;box-shadow:0 26px 70px rgba(0,0,0,.28)}
.authbrand{background:linear-gradient(145deg,#17131f,#100f15);padding:48px}
.authbrand::before{opacity:.3}
.authbrand h2{font-size:clamp(25px,3vw,34px);letter-spacing:-.05em}
.authcard{background:#100f15;padding:38px}
.tabs{background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.06);border-radius:11px;padding:4px}
.tabs button{border-radius:8px}
form.auth label,.rlabel{font-size:11px;letter-spacing:.07em;text-transform:uppercase;color:#aaa3b4}
form.auth input,.pwwrap input,.toolbar input,textarea,select{background:#0b0a10;border-color:rgba(255,255,255,.1);border-radius:10px}
form.auth input:focus,.pwwrap input:focus{border-color:rgba(179,132,255,.4);box-shadow:0 0 0 3px rgba(140,80,255,.09)}
.portal{gap:20px}
.side{background:linear-gradient(180deg,#14121a,#100f15);border:1px solid rgba(255,255,255,.075);border-radius:17px}
.side nav a{border-radius:9px}
.side nav a.on{background:rgba(145,82,229,.11)}
.panel{border-radius:17px}
.phead{margin-bottom:22px}
.phead h1{font-size:clamp(25px,3vw,34px);letter-spacing:-.05em}
.banner{border-radius:12px}
.lics{gap:13px}
.lic{background:linear-gradient(180deg,#15131b,#100f15);border:1px solid rgba(255,255,255,.075);border-radius:15px}
.lic:hover{border-color:rgba(172,121,255,.24);transform:translateY(-2px)}
.dhero,.shero,.thero{padding-top:64px}
.dhbg,.shero .shbg{opacity:.13;filter:saturate(.6)}
.dhero p,.shero p.sub,.thero p{color:#a7a1b2;line-height:1.75}
.dlayout{gap:26px}
.dside{padding:8px;background:rgba(255,255,255,.018);border:1px solid rgba(255,255,255,.055);border-radius:13px}
.dside a{font-size:12.5px;border-radius:8px}
.dblock{background:linear-gradient(180deg,#15131b,#100f15);border-color:rgba(255,255,255,.075);border-radius:16px;padding:26px}
.dblock h2{font-size:21px;letter-spacing:-.04em}
.dblock .sub{color:#8f899a}
.step .n{background:rgba(144,87,229,.1);border-color:rgba(176,126,255,.2)}
.callout{border-radius:12px;background:rgba(145,85,229,.07);border-color:rgba(176,126,255,.18)}
.faq details{border-color:rgba(255,255,255,.075);border-radius:11px;background:rgba(255,255,255,.018)}
.tdoc{max-width:900px}
.tblock{background:linear-gradient(180deg,#15131b,#100f15);border:1px solid rgba(255,255,255,.075);border-radius:15px;padding:25px}
.tblock h2{letter-spacing:-.04em}
.plan{border-radius:22px;border-color:rgba(177,128,255,.25);box-shadow:0 24px 65px rgba(0,0,0,.3),0 0 50px rgba(119,62,190,.06)}
.plan .inner{padding:34px}
.plan .pricebig{letter-spacing:-.06em}
.inclcard{border-radius:14px;background:rgba(255,255,255,.018);border-color:rgba(255,255,255,.075)}
.exclude{border-radius:13px}
.ob-foot{background:linear-gradient(180deg,rgba(121,70,180,.035),transparent 40%);border-top-color:rgba(255,255,255,.06)}
.ob-foot .inner{padding-top:48px;gap:34px}
.ob-foot h5{font-size:10px;letter-spacing:.15em}
.ob-foot a{font-size:13px}
.ob-foot .bottom{font-size:11.5px;border-top-color:rgba(255,255,255,.05)}
.ob-toast{backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.12)}
/* Admin workspace */
header:not(.ob-nav){background:rgba(8,7,12,.82)!important;border-bottom-color:rgba(255,255,255,.07)!important;backdrop-filter:blur(18px)!important}
header:not(.ob-nav) .nav{height:70px;gap:18px}
header:not(.ob-nav) .brand img{border-radius:10px;box-shadow:none}
.tabsnav{gap:3px}
.tabsnav button{border-radius:9px;font-size:12.5px;padding:9px 12px}
.tabsnav button.on{background:rgba(141,82,226,.12);border-color:rgba(178,127,255,.2)}
.stat{background:linear-gradient(180deg,#17151d,#111016);border-color:rgba(255,255,255,.075);border-radius:15px;padding:21px}
.stat b{letter-spacing:-.05em}
.tablewrap{border:1px solid rgba(255,255,255,.075);border-radius:14px;background:#111016;overflow:auto}
table{border-collapse:separate;border-spacing:0}
th{background:#17141d;color:#8f899a;font-size:10px;letter-spacing:.12em;text-transform:uppercase}
td{border-bottom-color:rgba(255,255,255,.045);font-size:12.5px}
tbody tr:hover td{background:rgba(255,255,255,.018)}
.toolbar{background:rgba(255,255,255,.018);border-color:rgba(255,255,255,.07);border-radius:12px}
.drawer,.modal .box{background:#15121b;border-color:rgba(255,255,255,.1);border-radius:18px;box-shadow:0 25px 80px rgba(0,0,0,.5)}
.field input,.field select,.field textarea{border-radius:9px;background:#0b0a10}
@media(max-width:860px){
 .hero{min-height:auto;padding:68px 0 56px}
 .hero h1{font-size:clamp(39px,10vw,62px)}
 .ob-nav .inner{padding:13px 18px}
 .ob-nav .right .btn.ghost{display:none}
 .dlayout{grid-template-columns:1fr;gap:18px}
 .dside{position:static;display:flex;flex-direction:row;overflow:auto;white-space:nowrap}
 .dside a{flex:none}
 .authgrid{grid-template-columns:1fr}
 .authbrand{border-right:0;border-bottom:1px solid var(--line);padding:30px}
 .authcard{padding:28px}
 .portal{grid-template-columns:1fr}
}
@media(max-width:560px){
 .section{padding:58px 0}
 .hero{padding:55px 0 45px}
 .hero .stats{gap:12px;margin-top:30px}
 .storehero{padding:42px 0 28px}
 .toolbar{padding:9px}
 .card .body{padding:14px}
 .dblock{padding:20px}
 .ob-foot .inner{padding:38px 18px 20px}
}
@media(prefers-reduced-motion:reduce){
 .hero h1,.storehero h1,.shero h1,.dhero h1{animation:none}
}
