/* Alpha Website: store, signup, panel and admin.
   System: warm paper, ink, hairlines, rounded glass. Buttons are ink. Yellow is a spark and never a fill:
   the hero underline, the signature dot, the step you are on. Soft light behind things is warm sand, not yellow.
   Persian text takes no letter-spacing (it breaks the joins). */
[hidden]{display:none!important}
:root{
  --font:"IRANYekanX FaNum",system-ui,-apple-system,"Segoe UI",Tahoma,sans-serif;
  --bg:#F6F5F2;--bg2:#EEECE7;--card:#FFFFFF;--field:#FAF9F7;
  --ink:#131312;--ink2:#43423E;--muted:#6C6A63;--faint:#A3A199;
  --line:rgba(19,19,18,.09);--line2:rgba(19,19,18,.17);
  --y:#FFCC00;
  --good:#18794E;--goodw:#E3F3EA;--warn:#8A5300;--warnw:#FAEEDB;--bad:#B3261E;--badw:#FBE7E5;
  --r1:14px;--r2:20px;--r3:26px;--r4:34px;
  --sh1:0 1px 2px rgba(19,19,18,.04),0 2px 10px rgba(19,19,18,.035);
  --sh2:0 1px 2px rgba(19,19,18,.05),0 16px 36px -14px rgba(19,19,18,.16);
  --sh3:0 2px 6px rgba(19,19,18,.06),0 36px 72px -26px rgba(19,19,18,.3);
  --spring:cubic-bezier(.34,1.4,.44,1);--ease:cubic-bezier(.16,.9,.24,1);
  --blur:blur(26px) saturate(200%);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:96px}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);font-size:16px;font-weight:400;line-height:1.9;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:inherit;text-underline-offset:.32em;text-decoration-thickness:1px}
img{max-width:100%}
h1,h2,h3{margin:0;font-weight:800;line-height:1.45;text-wrap:balance}
p{margin:0}
button{font:inherit;color:inherit}
::selection{background:#FFE89A;color:var(--ink)}
:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.ltr{direction:ltr;text-align:left}
.lat{font-family:"IRANYekanX Digits",var(--font)!important}   /* a utility: it has to win over font:inherit on inputs */
.wrap{max-width:1160px;margin:0 auto;padding-inline:20px}

/* ---------- top bar: the same glass as the tab bar we ship on client sites ---------- */
.top{position:sticky;top:0;z-index:50;padding:10px 12px 0;pointer-events:none}
.bar{pointer-events:auto;max-width:1160px;margin:0 auto;height:62px;display:flex;align-items:center;gap:8px;padding:6px;border-radius:26px;background:rgba(255,255,255,.68);border:1px solid var(--line);box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 14px 34px -16px rgba(19,19,18,.24);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur)}
.brand{display:flex;align-items:center;gap:10px;height:50px;padding-inline:12px 10px;border-radius:20px;text-decoration:none}
.brand img{height:26px;width:auto;display:block}
.brand b{font-size:18px;font-weight:800;line-height:1}
.top-acts{margin-inline-start:auto;display:flex;align-items:center;gap:6px}
@media(max-width:359px){.area-panel .brand b,.area-admin .brand b{display:none}}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.bar{background:rgba(255,255,255,.96)}}

/* ---------- store header: desktop nav, mobile sheet ---------- */
.skip{position:absolute;inset-inline-start:12px;top:-60px;z-index:100;padding:10px 16px;border-radius:999px;background:var(--ink);color:#fff;text-decoration:none;font-weight:600;transition:top .2s}
.skip:focus{top:10px}
#main{outline:0}
.nav{display:flex;gap:2px;margin-inline-start:10px}
.nav a{display:inline-flex;align-items:center;height:42px;padding:0 14px;border-radius:999px;text-decoration:none;font-size:14.5px;font-weight:500;color:var(--ink2);transition:background .2s,color .2s}
.nav a.on{background:rgba(19,19,18,.07);color:var(--ink);font-weight:600}
@media(hover:hover) and (pointer:fine){.nav a:hover{background:rgba(19,19,18,.06);color:var(--ink)}}
.menu-btn{display:none;position:relative;width:46px;height:46px;border:1px solid var(--line2);border-radius:999px;background:transparent;cursor:pointer;-webkit-tap-highlight-color:transparent}
.menu-btn span{position:absolute;left:14px;right:14px;height:1.8px;border-radius:2px;background:var(--ink);transition:transform .3s var(--ease),top .3s var(--ease)}
.menu-btn span:first-child{top:18px}.menu-btn span:last-child{top:25px}
.menu-btn[aria-expanded="true"] span:first-child{top:21.5px;transform:rotate(45deg)}
.menu-btn[aria-expanded="true"] span:last-child{top:21.5px;transform:rotate(-45deg)}
.sheet{pointer-events:auto;max-width:1160px;margin:8px auto 0;padding:18px;border-radius:26px;background:rgba(255,255,255,.9);border:1px solid var(--line);box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 24px 50px -20px rgba(19,19,18,.3);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);max-height:calc(100dvh - 96px);overflow:auto;animation:sheetIn .32s var(--ease)}
@keyframes sheetIn{from{opacity:0;transform:translateY(-8px)}}
.sheet nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.sheet-g{display:grid;gap:2px;align-content:start}
.sheet-g b{font-size:12.5px;font-weight:700;color:var(--muted);padding-inline:12px;margin-bottom:4px}
.sheet-g a{display:flex;align-items:center;min-height:46px;padding:0 12px;border-radius:14px;text-decoration:none;font-size:16px;font-weight:500}
.sheet-g a:active{background:rgba(19,19,18,.06)}
.sheet-acts{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:16px;padding-top:16px;border-top:1px solid var(--line)}
.area-tag{margin-inline-start:6px;padding:4px 12px;border-radius:999px;background:var(--bg2);font-size:12.5px;font-weight:600;color:var(--ink2)}
@media(max-width:1020px){.nav{display:none}.menu-btn{display:inline-block}}
@media(min-width:1021px){.sheet{display:none!important}}
@media(max-width:600px){.sheet nav{grid-template-columns:1fr}.hide-sm{display:none!important}}
@media(max-width:400px){.hide-xs{display:none!important}}

/* ---------- buttons: full pills, ink first ---------- */
.btn{--h:46px;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:var(--h);padding:0 22px;border:1px solid transparent;border-radius:999px;font:inherit;font-size:15px;font-weight:600;line-height:1.5;white-space:nowrap;text-decoration:none;cursor:pointer;background:var(--ink);color:#fff;transition:transform .16s var(--ease),background .2s,border-color .2s;-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none}
.btn:active{transform:scale(.97)}
.btn.ghost{background:transparent;border-color:var(--line2);color:var(--ink)}
.btn.light{background:#fff;color:var(--ink)}
.btn.danger{background:var(--badw);color:var(--bad)}
.btn.sm{--h:38px;padding:0 16px;font-size:13.5px}
.btn.lg{--h:54px;padding:0 28px;font-size:16px}
.btn.block{width:100%;white-space:normal;padding-block:10px;text-align:center}
.btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
@media(hover:hover) and (pointer:fine){
  .btn:hover{background:#2B2B29}
  .btn.ghost:hover{background:rgba(19,19,18,.05);border-color:rgba(19,19,18,.3)}
  .btn.light:hover{background:#EEECE7}
  .btn.danger:hover{background:#F6D4D0}
}

/* ---------- shared pieces ---------- */
.flash{display:flex;align-items:center;gap:10px;margin:16px 0 0;padding:12px 18px;border-radius:var(--r2);background:var(--card);border:1px solid var(--line);box-shadow:var(--sh1);font-size:14.5px;font-weight:500}
.flash::before{content:"";flex:none;width:8px;height:8px;border-radius:50%;background:var(--ink)}
main.page{padding-block:34px 72px;display:flex;flex-direction:column;gap:28px}
.sec{display:flex;flex-direction:column;gap:18px}
.sec>h2,.page-h h1{font-size:clamp(26px,1.2rem + 1.6vw,36px)}
.narrow{max-width:600px}
.eyebrow{display:inline-flex;align-items:center;gap:9px;margin:0;font-size:13.5px;font-weight:600;color:var(--muted)}
.eyebrow .dot,.tier-tag::before,.badge-sig::before{content:"";flex:none;width:7px;height:7px;border-radius:50%;background:var(--y);box-shadow:0 0 0 3px rgba(255,204,0,.24)}
.lead{color:var(--ink2);font-size:clamp(16px,.94rem + .3vw,18.5px);line-height:2;max-width:60ch}
.hint{margin:0;font-size:13px;line-height:1.85;color:var(--muted)}
.band{padding-block:clamp(40px,6vw,84px)}
.sec-h{display:grid;gap:10px;justify-items:start;max-width:66ch;margin-bottom:clamp(22px,3vw,36px)}
.sec-h h2{font-size:clamp(26px,1.2rem + 1.9vw,40px)}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r3);padding:24px;box-shadow:var(--sh1)}
.card>h2,.cathead h2{font-size:18px;font-weight:700}
.card-h{font-size:22px}
.rows{display:grid;gap:12px}
.row2{display:flex;justify-content:space-between;align-items:baseline;gap:14px}
.row2.sub{color:var(--muted);font-size:14px}

/* ---------- store: hero ---------- */
.hero{padding-block:clamp(26px,5vw,68px) clamp(20px,3vw,40px);overflow-x:clip}   /* the soft light behind the phones may not widen the page */
@supports not (overflow:clip){.hero{overflow:hidden}}
.hero-in{display:grid;gap:34px;align-items:center}
.hero-copy{display:grid;gap:22px;justify-items:start;min-width:0}
.hero h1{font-size:clamp(34px,1.05rem + 4.4vw,62px);line-height:1.36}
.hero h1 mark{background:none;color:inherit;text-decoration:underline;text-decoration-color:var(--y);text-decoration-thickness:.15em;text-underline-offset:.2em;text-decoration-skip-ink:none}
.hero .cta{display:flex;gap:10px;flex-wrap:wrap}
.hero-note{display:flex;gap:10px;align-items:flex-start;max-width:52ch;font-size:14px;line-height:1.9;color:var(--muted)}
.hero-note svg{flex:none;width:20px;height:20px;margin-top:3px;fill:none;stroke:var(--ink);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.hero-art{position:relative;justify-self:center;display:flex;flex-direction:column;align-items:center;gap:16px;min-width:0}
.hero-art .phone{--s:.6}
.hero-art.pair{display:block;width:262px;height:400px;overflow:hidden;-webkit-mask-image:linear-gradient(#000 76%,transparent);mask-image:linear-gradient(#000 76%,transparent)}
.hero-art.pair .p2{display:none}
/* a phone that shows a live demo: the page is laid out at 390px and scaled down */
.phone{--s:.62;position:relative;display:block;flex:none;width:calc(390px*var(--s) + 14px);height:calc(844px*var(--s) + 14px);border-radius:calc(52px*var(--s) + 7px);background:#151514;box-shadow:inset 0 0 0 1px #3B3B38,var(--sh3)}
.scr{position:absolute;inset:7px;border-radius:calc(52px*var(--s));overflow:hidden;background:var(--stage,#fff);transform:translateZ(0)}
.scr iframe{position:absolute;top:0;right:0;width:390px;height:844px;border:0;transform:scale(var(--s));transform-origin:top right;pointer-events:none}
@media(min-width:940px){
  .hero-in{grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:40px}
  .hero-art::before{content:"";position:absolute;inset:-6% -30% -8%;border-radius:50%;background:radial-gradient(closest-side,rgba(226,182,124,.42),rgba(226,182,124,.2) 56%,rgba(226,182,124,0));pointer-events:none;z-index:-1}
  .hero-art .phone{--s:.66}
  .hero-art.pair{width:min(100%,470px);height:556px;overflow:visible;-webkit-mask-image:none;mask-image:none}
  .hero-art.pair .p1{position:absolute;top:0;right:7%;z-index:2;--s:.62}
  .hero-art.pair .p2{display:block;position:absolute;top:62px;left:0;--s:.52;z-index:1}
}
.hero{isolation:isolate}
.scr img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top center;display:block}
.scr iframe{z-index:1;opacity:0;transition:opacity .4s var(--ease)}
.scr iframe.ready{opacity:1}

/* ---------- store: steps ---------- */
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);counter-reset:s;background:var(--card);border:1px solid var(--line);border-radius:var(--r3);box-shadow:var(--sh1)}
.step{counter-increment:s;padding:24px 22px;display:grid;gap:6px;align-content:start}
.step+.step{border-inline-start:1px solid var(--line)}
.step::before{content:counter(s,persian);display:grid;place-items:center;width:30px;height:30px;margin-bottom:8px;border-radius:50%;border:1px solid var(--line2);font-size:13.5px;font-weight:700;line-height:1;color:var(--ink2)}
.step h3{font-size:16.5px;font-weight:700}
.step p{font-size:14px;line-height:1.9;color:var(--muted)}
@media(max-width:880px){.steps{grid-template-columns:1fr 1fr}.step:nth-child(3){border-inline-start:0}.step:nth-child(n+3){border-top:1px solid var(--line)}}
@media(max-width:500px){.steps{grid-template-columns:1fr}.step{grid-template-columns:auto 1fr;column-gap:14px;padding:18px}.step+.step{border-inline-start:0;border-top:1px solid var(--line)}.step::before{grid-row:span 2;margin:1px 0 0}}

/* ---------- store: layouts ---------- */
.chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:22px}
.chip{min-height:40px;padding:0 18px;border:1px solid var(--line2);border-radius:999px;background:transparent;font:inherit;font-size:14px;font-weight:500;color:var(--ink2);cursor:pointer;transition:background .2s,color .2s,border-color .2s,transform .16s var(--ease);-webkit-tap-highlight-color:transparent}
.chip:active{transform:scale(.96)}
.chip[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:#fff}
.layouts{display:grid;grid-template-columns:repeat(auto-fill,minmax(252px,1fr));gap:18px}
.lay{display:flex;flex-direction:column;overflow:hidden;background:var(--card);border:1px solid var(--line);border-radius:var(--r4);box-shadow:var(--sh1);transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
@media(hover:hover) and (pointer:fine){.lay:hover{transform:translateY(-4px);box-shadow:var(--sh2)}}
.stage{position:relative;display:flex;justify-content:center;height:366px;padding-top:26px;overflow:hidden;background:var(--stage,var(--bg2))}
.stage-link{position:absolute;inset:0;z-index:2}
.stage::after{content:"";position:absolute;inset:0;background:linear-gradient(rgba(255,255,255,.1),rgba(0,0,0,.07));pointer-events:none}
.stage .phone{--s:.54}
.lay .meta{display:grid;gap:5px;padding:18px 18px 20px}
.lay-type{font-size:12.5px;font-weight:600;color:var(--muted)}
.lay h3{display:flex;align-items:center;gap:6px 12px;flex-wrap:wrap;font-size:18px}
.lay-tag{font-size:14px;color:var(--muted)}
.lay .acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.badge-sig{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:600;line-height:1.6;color:var(--ink2);white-space:nowrap}
.badge-sig::before,.tier-tag::before{display:inline-block}
@media(max-width:699px){
  .layouts{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;margin-inline:-20px;padding:6px 20px 20px;scrollbar-width:none}
  .layouts::-webkit-scrollbar{display:none}
  .lay{flex:0 0 min(80vw,300px);scroll-snap-align:center}
}

/* ---------- store: the Alpha signature, on a dark panel ---------- */
.dark-panel{position:relative;overflow:hidden;background:#131312;color:#F2F1ED;border-radius:clamp(28px,4vw,44px);padding:clamp(24px,4.6vw,60px)}
.dark-panel::before{content:"";position:absolute;width:62%;aspect-ratio:1;top:-34%;inset-inline-end:-16%;background:radial-gradient(closest-side,rgba(226,182,124,.2),rgba(226,182,124,0));pointer-events:none}
.dark-panel>*{position:relative}
.dark-panel .sec-h h2{color:#fff}
.dark-panel .lead,.sigc p{color:#B9B7AF}
.sigs{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.sigc{grid-column:span 2;display:grid;gap:8px;align-content:start;padding:22px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.085);border-radius:var(--r3)}
.sigc.wide{grid-column:span 3}
.sigc h3{font-size:18px;font-weight:700;color:#fff}
.sigc p{font-size:14.5px;line-height:1.95}
.sigc .ic{display:grid;place-items:center;width:46px;height:46px;margin-bottom:6px;border-radius:15px;background:rgba(255,255,255,.085)}
.sigc .ic svg,.m-acts svg{width:22px;height:22px;fill:none;stroke:#fff;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.sig-art{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;height:168px;margin-bottom:8px;padding:16px;border-radius:18px;overflow:hidden;background:linear-gradient(140deg,#2E251C,#6E5237 52%,#B98F63)}
.m-pill{display:inline-flex;align-items:center;gap:9px;max-width:100%;height:40px;padding:0 16px;border-radius:999px;background:rgba(255,255,255,.74);border:1px solid rgba(255,255,255,.55);box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 14px 30px rgba(0,0,0,.3);color:#131312;font-size:13.5px;font-weight:700;line-height:1;white-space:nowrap;-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur)}
.m-pill i{flex:none;width:8px;height:8px;border-radius:50%;background:#22A55A}
.m-pill em{min-width:0;font-style:normal;font-weight:500;color:#55534D;padding-inline-start:9px;border-inline-start:1px solid rgba(19,19,18,.14);overflow:hidden;text-overflow:ellipsis}
.m-acts{display:flex;gap:8px}
.m-acts span{display:grid;place-items:center;width:44px;height:44px;border-radius:15px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.2)}
.art-chat{background:linear-gradient(140deg,#1D2420,#31463A 55%,#587A64);align-items:stretch;gap:8px}
.m-b{max-width:82%;padding:8px 14px;border-radius:18px;font-size:13.5px;line-height:1.7}
.m-b.them{align-self:flex-start;background:#fff;color:#131312;border-end-start-radius:6px}
.m-b.me{align-self:flex-end;background:#131312;color:#fff;border-end-end-radius:6px}
@media(max-width:940px){.sigs{grid-template-columns:1fr 1fr}.sigc{grid-column:auto}.sigc.wide{grid-column:1/-1}}
@media(max-width:600px){.sigs{grid-template-columns:1fr}.sigc.wide{grid-column:auto}.dark-panel{margin-inline:-8px}}

/* ---------- store: pricing ---------- */
.tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;align-items:stretch}
.tier{display:flex;flex-direction:column;gap:12px;padding:28px 26px;background:var(--card);border:1px solid var(--line);border-radius:var(--r4);box-shadow:var(--sh1)}
.tier.pop{background:var(--ink);border-color:var(--ink);color:#fff;box-shadow:var(--sh3)}
.tier-h{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:30px}
.tier h3{font-size:18px;font-weight:700}
.tier-tag{display:inline-flex;align-items:center;gap:8px;padding:3px 12px;border-radius:999px;background:rgba(255,255,255,.12);font-size:12px;font-weight:600;white-space:nowrap}
.amt{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.amt b{font-size:clamp(30px,1.4rem + 1.3vw,40px);font-weight:800;line-height:1.25}
.amt small{font-size:14px;font-weight:500;color:var(--muted)}
.yearly{font-size:13.5px;color:var(--muted)}
.tier.pop .amt small,.tier.pop .yearly{color:#B9B7AF}
.feat{list-style:none;margin:6px 0 10px;padding:18px 0 0;border-top:1px solid var(--line);display:grid;gap:10px;font-size:14.5px;line-height:1.8;color:var(--ink2)}
.feat li{display:flex;gap:10px;align-items:flex-start}
.feat li::before{content:"";flex:none;width:18px;height:18px;margin-top:4px;border-radius:50%;background:var(--ink) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m2.8 6.2 2.1 2.1 4.3-4.6'/%3E%3C/svg%3E") center/11px no-repeat}
.tier.pop .feat{border-color:rgba(255,255,255,.14);color:#E6E4DD}
.tier.pop .feat li::before{background-color:#fff;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='%23131312' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m2.8 6.2 2.1 2.1 4.3-4.6'/%3E%3C/svg%3E")}
.tier .btn{margin-top:auto}
@media(max-width:880px){.tiers{grid-template-columns:1fr}}

/* ---------- store: questions, closing card, footer ---------- */
.faq-wrap{display:grid;gap:8px 56px}
@media(min-width:940px){.faq-wrap{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);align-items:start}.faq-wrap .sec-h{position:sticky;top:104px}}
.faq{overflow:hidden;background:var(--card);border:1px solid var(--line);border-radius:var(--r3);box-shadow:var(--sh1)}
.faq details+details{border-top:1px solid var(--line)}
.faq summary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 22px;list-style:none;cursor:pointer;font-size:16px;font-weight:600;line-height:1.8;-webkit-tap-highlight-color:transparent}
.faq summary::-webkit-details-marker{display:none}
.faq summary h3{font:inherit;margin:0}
.faq summary::after{content:"";flex:none;width:30px;height:30px;border-radius:50%;background:var(--bg) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='%23131312' stroke-width='1.6' stroke-linecap='round'%3E%3Cpath d='M6 2v8M2 6h8'/%3E%3C/svg%3E") center/12px no-repeat;transition:transform .3s var(--ease)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{padding:0 22px 20px;max-width:64ch;font-size:15px;line-height:2;color:var(--ink2)}
.closer{position:relative;overflow:hidden;display:grid;gap:14px;justify-items:center;text-align:center;padding:clamp(34px,6vw,76px) 24px;background:var(--card);border:1px solid var(--line);border-radius:clamp(28px,4vw,44px);box-shadow:var(--sh2)}
.closer::before{content:"";position:absolute;width:min(90%,620px);aspect-ratio:1.6;bottom:-58%;left:50%;margin-left:max(-45%,-310px);border-radius:50%;background:radial-gradient(closest-side,rgba(226,182,124,.5),rgba(226,182,124,0));pointer-events:none}
.closer>*{position:relative}
.closer h2{font-size:clamp(26px,1.2rem + 2.2vw,44px)}
.closer p{color:var(--ink2)}
.foot{margin-top:clamp(36px,5vw,72px);background:#131312;color:#B9B7AF;font-size:14px}
.foot a{color:#E6E4DD;text-decoration:none}
@media(hover:hover) and (pointer:fine){.foot a:hover{color:#fff;text-decoration:underline}}
.foot-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:34px 56px;padding-block:52px 38px}
.foot-brand{display:grid;gap:14px;justify-items:start;align-content:start}
.foot-brand p{max-width:34ch;line-height:2;color:#A3A199}
.brand.light{color:#fff;padding-inline:0}
.brand.light b{color:#fff}
.foot-cols{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.foot-cols div{display:grid;gap:4px;align-content:start}
.foot-cols b{margin-bottom:6px;font-size:13px;font-weight:700;color:#fff}
.foot-cols a{display:flex;align-items:center;min-height:34px;line-height:1.6;color:#C9C7BF}
.foot-bottom{display:flex;align-items:center;justify-content:space-between;gap:16px 28px;flex-wrap:wrap;padding-block:22px 30px;border-top:1px solid rgba(255,255,255,.1)}
.foot .powered{display:flex;align-items:center;gap:12px;text-decoration:none!important;color:#F4F3EF}
.foot .powered img{height:40px;width:auto;display:block}
.foot .powered span{display:grid;line-height:1.2;text-align:left}
.foot .powered .pb{font-size:9.5px;font-weight:500;letter-spacing:.26em;color:#A3A199}
.foot .powered .pa{font-size:17px;font-weight:700}
.foot-note{font-size:13px;color:#8F8D86}
.foot-note a{color:#C9C7BF;text-decoration:underline}
.foot.slim .wrap{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;padding-block:24px}
.trust{display:grid;place-items:center;grid-column:1/-1;justify-self:start;padding:8px;border-radius:18px;background:#fff}
@media(max-width:960px){.foot-top{grid-template-columns:1fr}.foot-cols{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:420px){.foot-cols{gap:18px 14px}}

/* ---------- forms ---------- */
.form{display:grid;gap:20px}
.form>.btn,.card>form>.btn:not(.block){justify-self:start}
.fs{min-width:0;margin:0;border:0;display:grid;gap:14px}
.fs:not(.card){padding:0}
.fs legend{float:right;width:100%;padding:0;font-size:18px;font-weight:800;line-height:1.6}
.steps-form{counter-reset:f}
.steps-form .fs legend{display:flex;align-items:center;gap:12px;counter-increment:f}
.steps-form .fs legend::before{content:counter(f,persian);display:grid;place-items:center;flex:none;width:30px;height:30px;border-radius:50%;background:var(--ink);color:#fff;font-size:13.5px;font-weight:700;line-height:1}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px}
label.f{display:flex;flex-direction:column;gap:6px;font-size:14px;font-weight:500;color:var(--ink2)}
label.f small{font-size:12.5px;font-weight:400;line-height:1.75;color:var(--muted)}
input:not([type=checkbox]):not([type=radio]):not([type=file]),select,textarea{width:100%;min-height:48px;padding:10px 14px;border:1px solid var(--line2);border-radius:var(--r1);background:var(--field);color:var(--ink);font:inherit;font-size:16px;line-height:1.6;transition:border-color .2s,box-shadow .2s,background .2s;-webkit-appearance:none;appearance:none}
select{padding-inline-end:38px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='%2343423E' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m2.5 4.5 3.5 3.5 3.5-3.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-size:12px;background-position:left 14px center}
textarea{min-height:96px;resize:vertical}
input[type=file]{width:100%;font:inherit;font-size:13.5px;color:var(--muted)}
input[type=file]::file-selector-button{margin-inline-end:12px;height:40px;padding:0 16px;border:1px solid var(--line2);border-radius:999px;background:var(--card);color:var(--ink);font:inherit;font-size:13.5px;font-weight:600;cursor:pointer}
::placeholder{color:var(--faint);opacity:1}
input:not([type=checkbox]):not([type=radio]):not([type=file]):focus,select:focus,textarea:focus{outline:0;border-color:var(--ink);background-color:#fff;box-shadow:0 0 0 4px rgba(19,19,18,.08)}
.domainrow{display:flex;gap:8px;align-items:stretch}
.domainrow input{min-width:0;flex:1}
.domainrow .suffix{display:grid;place-items:center;flex:none;padding:0 14px;border-radius:var(--r1);background:var(--bg2);font-weight:700;color:var(--ink2);direction:ltr}
.domainrow .btn{--h:48px}
.dstate{min-height:22px;font-size:13px;font-weight:500}
.dstate.free{color:var(--good)}.dstate.taken{color:var(--bad)}.dstate.unknown{color:var(--warn)}
.radios{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px}
.radio{position:relative;display:block;cursor:pointer;-webkit-tap-highlight-color:transparent}
.radio input{position:absolute;opacity:0;pointer-events:none}
.radio>span{display:flex;flex-direction:column;gap:4px;height:100%;padding:14px 16px;border:1px solid var(--line2);border-radius:var(--r2);background:var(--field);transition:border-color .2s,background .2s,box-shadow .2s}
.radio>span b{font-size:15.5px;font-weight:700}
.radio>span em{font-style:normal;font-size:13px;line-height:1.85;color:var(--muted)}
.radio input:checked+span{border-color:var(--ink);background:#fff;box-shadow:inset 0 0 0 1px var(--ink),var(--sh1)}
.radio input:focus-visible+span{outline:2px solid var(--ink);outline-offset:3px}
.r-top{display:flex;align-items:center;justify-content:space-between;gap:4px 12px;flex-wrap:wrap}
.r-price{font-size:14px;font-weight:700;white-space:nowrap}
.r-price small{font-size:12px;font-weight:500;color:var(--muted)}
.errors{padding:12px 18px;border-radius:var(--r2);background:var(--badw);color:var(--bad);font-size:14.5px;font-weight:500}
.errors ul{margin:0;padding-inline-start:18px}
.check{display:flex;gap:12px;align-items:flex-start;font-size:14px;line-height:1.9;color:var(--ink2);cursor:pointer}
.check input{flex:none;width:20px;height:20px;margin:4px 0 0;accent-color:var(--ink)}
.signup{display:grid;gap:18px;align-items:start}
.signup-main{display:grid;gap:18px;min-width:0}
.summary{display:grid;gap:14px}
.summary dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:8px 14px;font-size:14.5px}
.summary dt{color:var(--muted)}
.summary dd{margin:0;font-weight:600;text-align:end}
.total{display:flex;justify-content:space-between;align-items:baseline;gap:6px 12px;flex-wrap:wrap;padding-top:14px;border-top:1px solid var(--line)}
.total span{font-size:14px;color:var(--muted)}
.total b{font-size:24px;font-weight:800;line-height:1.4}
@media(min-width:980px){.signup{grid-template-columns:minmax(0,1fr) 340px;gap:24px}.summary{position:sticky;top:92px}}
.login{width:100%;max-width:440px;margin:28px auto;display:grid;gap:18px}

/* ---------- panel + admin ---------- */
.shell{display:grid;grid-template-columns:244px minmax(0,1fr);gap:28px;align-items:start;padding-block:28px 72px}
.side{position:sticky;top:92px;display:flex;flex-direction:column;gap:2px;padding:8px;background:var(--card);border:1px solid var(--line);border-radius:var(--r3);box-shadow:var(--sh1)}
.side a{display:flex;align-items:center;gap:11px;min-height:44px;padding:0 12px;border-radius:var(--r1);text-decoration:none;font-size:14.5px;font-weight:500;color:var(--ink2);transition:background .2s,color .2s}
.side a svg{flex:none;width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.side a.on{background:var(--ink);color:#fff;font-weight:600}
.side a.ext{margin-top:6px;border-top:1px solid var(--line);border-radius:0 0 var(--r1) var(--r1);padding-top:4px;color:var(--muted)}
@media(hover:hover) and (pointer:fine){.side a:not(.on):hover{background:rgba(19,19,18,.05);color:var(--ink)}}
.side .nb{margin-inline-start:auto}
@media(max-width:880px){
  .shell{grid-template-columns:minmax(0,1fr);gap:16px;padding-top:16px}
  .side{position:static;flex-direction:row;overflow-x:auto;padding:6px;border-radius:22px;scrollbar-width:none}
  .side::-webkit-scrollbar{display:none}
  .side a{flex:none;min-height:42px}
  .side a.ext{margin:0;border:0;padding-top:0;border-radius:var(--r1)}
}
.content{display:flex;flex-direction:column;gap:18px;min-width:0}
.content h1{font-size:clamp(24px,1.2rem + .9vw,30px)}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(168px,1fr));gap:12px}
.kpi{display:grid;gap:6px;align-content:start;padding:16px 18px;background:var(--card);border:1px solid var(--line);border-radius:var(--r2);box-shadow:var(--sh1);color:inherit;text-decoration:none}
.kpi span{font-size:13px;color:var(--muted)}
.kpi b{font-size:24px;font-weight:800;line-height:1.35}
.kpi b small{font-size:13px;font-weight:500;color:var(--muted)}
.pill{display:inline-flex;align-items:center;gap:6px;width:fit-content;padding:2px 11px;border-radius:999px;font-size:12.5px;font-weight:600;line-height:1.7;white-space:nowrap}
.pill::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.pill.good{background:var(--goodw);color:var(--good)}.pill.warn{background:var(--warnw);color:var(--warn)}.pill.bad{background:var(--badw);color:var(--bad)}.pill.mut{background:var(--bg2);color:var(--ink2)}
.notice{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;background:var(--warnw);border-color:rgba(138,83,0,.18)}
.tblwrap{overflow-x:auto;background:var(--card);border:1px solid var(--line);border-radius:var(--r3);box-shadow:var(--sh1)}
.tbl{width:100%;border-collapse:collapse;font-size:14px}
.tbl th,.tbl td{padding:13px 16px;text-align:right;vertical-align:middle;border-bottom:1px solid var(--line)}
.tbl th{font-size:12.5px;font-weight:600;color:var(--muted);background:var(--field);white-space:nowrap}
.tbl tr:last-child td{border-bottom:0}
.tbl td.n{white-space:nowrap}
.tbl small{color:var(--muted)}
.inline{display:inline}
.list{display:flex;flex-direction:column;gap:10px}
.mi{display:grid;grid-template-columns:64px minmax(0,1fr) auto;gap:14px;align-items:center;padding:10px;background:var(--card);border:1px solid var(--line);border-radius:var(--r2);box-shadow:var(--sh1)}
.mi img,.mi .noimg{width:64px;height:64px;border-radius:var(--r1);object-fit:cover;background:var(--bg2)}
.mi h3{font-size:15.5px;font-weight:700}
.mi p{font-size:13.5px;color:var(--muted)}
.mi .acts{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
@media(max-width:520px){.mi{grid-template-columns:56px minmax(0,1fr)}.mi img,.mi .noimg{width:56px;height:56px}.mi .acts{grid-column:1/-1;justify-content:flex-start}}
.cathead{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:10px}
.task{display:grid;gap:12px;padding:20px 22px;background:var(--card);border:1px solid var(--line);border-radius:var(--r3);box-shadow:var(--sh1)}
.task>b{font-size:17px;font-weight:700}
.task dl{margin:0;max-width:560px;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:8px 14px;align-items:center;font-size:14px}
.task dt{color:var(--muted)}
.task dd{margin:0;font-weight:600;overflow-wrap:anywhere}
.task dd.ltr{text-align:right}
.copy{min-height:30px;padding:0 12px;border:1px solid var(--line2);border-radius:999px;background:var(--card);font:inherit;font-size:12.5px;font-weight:600;cursor:pointer;transition:background .2s,transform .16s var(--ease)}
.copy:active{transform:scale(.96)}
.copy.lat{font-family:"IRANYekanX Digits",var(--font);direction:ltr}
.timeline{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;font-size:14.5px}
.timeline li{display:flex;gap:12px;align-items:center;color:var(--muted)}
.timeline li::before{content:"";flex:none;width:10px;height:10px;border-radius:50%;background:var(--line2)}
.timeline li.done{color:var(--ink)}
.timeline li.done::before{background:var(--good)}
.timeline li.now{color:var(--ink);font-weight:600}
.timeline li.now::before{background:var(--y);box-shadow:0 0 0 4px rgba(255,204,0,.26)}
.swatches{display:flex;gap:10px;flex-wrap:wrap}
.sw{position:relative;cursor:pointer}
.sw input{position:absolute;opacity:0}
.sw span{display:block;width:42px;height:42px;border-radius:50%;border:3px solid var(--card);box-shadow:0 0 0 1px var(--line2);transition:box-shadow .2s,transform .16s var(--ease)}
.sw input:checked+span{box-shadow:0 0 0 2px var(--ink)}
.sw input:focus-visible+span{outline:2px solid var(--ink);outline-offset:4px}
.sw:active span{transform:scale(.94)}

/* ---------- chat inbox ---------- */
.nb{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:#E5484D;color:#fff;font-size:12px;font-weight:700;line-height:1}
.inbox{display:flex;flex-direction:column;gap:8px}
.thread{display:grid;grid-template-columns:46px minmax(0,1fr) auto;gap:14px;align-items:center;padding:12px 16px;background:var(--card);border:1px solid var(--line);border-radius:var(--r2);box-shadow:var(--sh1);text-decoration:none;transition:border-color .2s}
.thread.unread{border-color:var(--ink)}
.thread .av{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:var(--bg2);color:var(--ink);font-size:18px;font-weight:700}
.thread.unread .av{background:var(--ink);color:#fff}
.thread .tx{display:flex;flex-direction:column;min-width:0;line-height:1.6}
.thread .tx small{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:var(--muted)}
.thread .mt{display:flex;flex-direction:column;align-items:flex-end;gap:4px;color:var(--muted);font-size:12.5px}
.thread-head{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.thread-head h1{font-size:22px}
.convo{display:flex;flex-direction:column;gap:6px;max-height:min(60vh,560px);overflow-y:auto;background:var(--field)}
.bubble{max-width:80%;padding:9px 14px 6px;border-radius:20px;font-size:15px;line-height:1.75;white-space:pre-line;overflow-wrap:anywhere}
.bubble time{display:block;font-size:10.5px;opacity:.6;text-align:end}
/* your own messages on the right, like the customer's side of the chat */
.bubble.theirs{align-self:flex-end;background:var(--card);border:1px solid var(--line);border-end-end-radius:6px}
.bubble.mine{align-self:flex-start;background:var(--ink);color:#fff;border-end-start-radius:6px}
.bubble.order{background:var(--card);border:1px solid var(--ink);color:var(--ink)}
.bubble.order::before{content:"سفارش";display:block;margin-bottom:2px;font-size:11.5px;font-weight:700;color:var(--muted)}
.bubble.system{align-self:center;background:transparent;border:0;color:var(--muted);font-size:13px;text-align:center}
.quick{display:flex;gap:6px;overflow-x:auto;padding-bottom:4px;scrollbar-width:none}
.quick::-webkit-scrollbar{display:none}
.quick .chip{flex:none;min-height:36px;padding:0 14px;font-size:13.5px;background:var(--card)}
.replybar{position:sticky;bottom:0;display:grid;gap:8px;padding:8px 0 calc(8px + env(safe-area-inset-bottom,0px));background:var(--bg)}
.reply{display:flex;gap:8px;align-items:flex-end}
.reply textarea{min-height:52px;border-radius:var(--r2)}

/* ---------- store: live demo switcher ---------- */
.seg{position:relative;display:inline-grid;grid-auto-flow:column;grid-auto-columns:1fr;padding:5px;border-radius:999px;background:rgba(255,255,255,.72);border:1px solid var(--line);box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 10px 26px -14px rgba(19,19,18,.25);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur)}
.seg button{position:relative;z-index:1;min-width:84px;height:40px;padding:0 16px;border:0;border-radius:999px;background:none;font-size:14.5px;font-weight:600;color:var(--ink2);cursor:pointer;transition:color .3s;-webkit-tap-highlight-color:transparent}
.seg button[aria-selected="true"]{color:#fff}
.seg-pill{position:absolute;top:5px;bottom:5px;left:5px;width:84px;border-radius:999px;background:var(--ink);transition:left .38s var(--spring),width .38s var(--spring)}
.live{position:relative}
.live-cap{font-size:13.5px;font-weight:500;color:var(--muted);text-decoration:none}
a.live-cap{text-decoration:underline;text-underline-offset:.35em;text-decoration-color:var(--line2)}

/* ---------- store: facts strip ---------- */
.facts ul{list-style:none;margin:0;padding:6px 0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-block:1px solid var(--line)}
.facts li{display:flex;gap:12px;align-items:flex-start;padding:18px 20px}
.facts li+li{border-inline-start:1px solid var(--line)}
.facts svg{flex:none;width:24px;height:24px;margin-top:3px;fill:none;stroke:var(--ink);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.facts span{display:grid;font-size:13.5px;line-height:1.85;color:var(--muted)}
.facts b{font-size:15px;font-weight:700;color:var(--ink)}
@media(max-width:900px){.facts ul{grid-template-columns:1fr 1fr}.facts li:nth-child(3){border-inline-start:0}.facts li:nth-child(n+3){border-top:1px solid var(--line)}}
@media(max-width:520px){.facts ul{grid-template-columns:1fr}.facts li+li{border-inline-start:0;border-top:1px solid var(--line)}.facts li{padding:14px 4px}}

/* ---------- store: business types ---------- */
.niches{display:grid;gap:18px}
.niche{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:center;overflow:hidden;padding:clamp(22px,3.4vw,40px);background:var(--card);border:1px solid var(--line);border-radius:var(--r4);box-shadow:var(--sh1)}
.niche:nth-child(even) .niche-copy{order:2}
.niche-copy{display:grid;gap:12px;justify-items:start;align-content:center}
.niche h3{font-size:clamp(21px,1rem + 1vw,28px);line-height:1.5}
.niche h3 a{text-decoration:none}
.niche-art{position:relative;display:flex;justify-content:center;gap:16px;height:300px;padding-top:6px;-webkit-mask-image:linear-gradient(#000 74%,transparent);mask-image:linear-gradient(#000 74%,transparent)}
.niche-art .phone{--s:.5}
.niche-art .n2{margin-top:38px}
@media(max-width:780px){.niche{grid-template-columns:1fr}.niche:nth-child(even) .niche-copy{order:0}.niche-art{height:250px}.niche-art .phone{--s:.42}}
.ticks{list-style:none;margin:0;padding:0;display:grid;gap:9px;font-size:15px;line-height:1.85;color:var(--ink2)}
.ticks li{display:flex;gap:10px;align-items:flex-start}
.ticks li::before{content:"";flex:none;width:18px;height:18px;margin-top:5px;border-radius:50%;background:var(--ink) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m2.8 6.2 2.1 2.1 4.3-4.6'/%3E%3C/svg%3E") center/11px no-repeat}
.ticks b{color:var(--ink)}

/* ---------- tables: comparison and plan matrix ---------- */
.sr{position:absolute;top:0;inset-inline-start:0;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
.tblwrap,.tbl th{position:relative}
.tbl th[scope=row]{font-size:14.5px;font-weight:600;color:var(--ink);background:none;white-space:normal}
.tbl thead th{font-size:13.5px}
.cmp .tbl td,.matrix td{color:var(--ink2)}
.cmp .tbl td svg,.matrix svg{width:18px;height:18px;margin-inline-end:6px;vertical-align:-4px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.tbl .us{background:rgba(19,19,18,.035);color:var(--ink);font-weight:600}
.tbl thead .us{background:var(--ink);color:#fff}
.matrix td,.matrix thead th{text-align:center}
.matrix thead th:first-child{text-align:right}
.matrix .y{color:var(--good)}.matrix .n{color:var(--faint)}
.matrix td svg{margin:0}
@media(max-width:640px){.tbl th,.tbl td{padding:11px 12px}.cmp .tbl{min-width:560px}}

/* ---------- sections: shared ---------- */
.sec-h.row{display:flex;align-items:center;justify-content:space-between;max-width:none;flex-wrap:wrap}
.more{margin-top:18px;font-weight:600}
.band.tight{padding-top:8px}
.h2s{font-size:clamp(20px,1rem + .8vw,26px);font-weight:800;line-height:1.5;margin-bottom:12px}
.h3{font-size:18px;font-weight:700;line-height:1.6}
.twocol{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 56px;align-items:start}
.twocol p{color:var(--ink2);line-height:2}
@media(max-width:820px){.twocol{grid-template-columns:1fr}}
.cards3{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:16px}
.gcard{display:grid;gap:8px;align-content:start;padding:24px;background:var(--card);border:1px solid var(--line);border-radius:var(--r3);box-shadow:var(--sh1);text-decoration:none;transition:border-color .25s,box-shadow .35s var(--ease)}
.gcard h3{font-size:17.5px;line-height:1.7}
.gcard p{font-size:14px;line-height:1.95;color:var(--muted)}
.g-meta{font-size:12.5px;font-weight:600;color:var(--muted)}
@media(hover:hover) and (pointer:fine){.gcard:hover{border-color:var(--line2);box-shadow:var(--sh2)}}
.layouts.three{grid-template-columns:repeat(auto-fill,minmax(252px,1fr))}
.lay h3 a{text-decoration:none}
.lay .stage{text-decoration:none}
.dp-more{margin-top:22px}
.cta{display:flex;gap:10px;flex-wrap:wrap}
.cta.center,.center{justify-content:center;text-align:center;justify-items:center}

/* ---------- inner page head + breadcrumbs ---------- */
.ph{padding-block:clamp(22px,4vw,48px) clamp(10px,2vw,22px)}
.ph .wrap,.ph.in{display:grid;gap:12px;justify-items:start}
.ph.in{padding-inline:0}
.ph.center{justify-items:center;text-align:center}
.ph h1{font-size:clamp(30px,1.1rem + 2.6vw,48px);line-height:1.4}
.ph-acts{display:flex;gap:10px;flex-wrap:wrap;margin-top:4px}
.crumbs ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:2px 0;font-size:13px;color:var(--muted)}
.crumbs li{display:flex;align-items:center}
.crumbs li+li::before{content:"";width:6px;height:6px;margin:0 10px;border-top:1.5px solid var(--faint);border-left:1.5px solid var(--faint);transform:rotate(-45deg)}
.crumbs a{text-decoration:none;color:var(--muted)}
.crumbs a:hover{color:var(--ink);text-decoration:underline}
.crumbs [aria-current]{color:var(--ink2);font-weight:500}

/* ---------- layout detail ---------- */
.detail{padding-block:clamp(18px,3vw,40px) 10px}
.detail-in{display:grid;grid-template-columns:minmax(0,1fr);gap:30px;align-items:center}
.detail-copy{display:grid;gap:14px;justify-items:start}
.detail h1{font-size:clamp(30px,1.1rem + 2.4vw,46px);line-height:1.4}
.detail .lay-type{display:flex;align-items:center;gap:12px;font-size:13.5px}
.fit{font-size:15px;color:var(--ink2);line-height:1.95}
.detail-art{display:grid;justify-items:center;gap:12px}
.detail-art .phone{--s:.7}
@media(min-width:940px){.detail-in{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}}
@media(max-width:520px){.detail-art .phone{--s:.6}}

/* ---------- landing pages ---------- */
.points{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px;overflow:hidden;background:var(--line);border:1px solid var(--line);border-radius:var(--r4)}
.point{display:grid;gap:8px;align-content:start;padding:clamp(20px,3vw,32px);background:var(--card)}
.point p{color:var(--ink2);line-height:2}
@media(max-width:700px){.points{grid-template-columns:1fr}}
.rec .amt{margin:8px 0 14px}
.niche-hero h1{font-size:clamp(30px,1rem + 3vw,50px);line-height:1.42}
.niche-hero .hero-copy{gap:18px}

/* ---------- features ---------- */
.fgroups{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.fgroup{padding:clamp(20px,3vw,30px);background:var(--card);border:1px solid var(--line);border-radius:var(--r3);box-shadow:var(--sh1)}
.fgroup h2{display:flex;align-items:center;gap:12px;font-size:20px;margin-bottom:14px}
.fgroup .ic{display:grid;place-items:center;width:42px;height:42px;border-radius:14px;background:var(--bg2)}
.fgroup .ic svg{width:21px;height:21px;fill:none;stroke:var(--ink);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.fgroup dl{margin:0;display:grid;gap:4px}
.fgroup dt{font-weight:700;font-size:15.5px;margin-top:10px}
.fgroup dd{margin:0;font-size:14.5px;line-height:1.95;color:var(--muted)}
@media(max-width:760px){.fgroups{grid-template-columns:1fr}}

/* ---------- pricing ---------- */
.bill-toggle{display:inline-flex;gap:4px;padding:5px;margin-bottom:22px;border-radius:999px;background:var(--card);border:1px solid var(--line);box-shadow:var(--sh1)}
.bill-toggle button{display:inline-flex;align-items:center;gap:8px;height:42px;padding:0 18px;border:0;border-radius:999px;background:none;font-size:14.5px;font-weight:600;color:var(--ink2);cursor:pointer}
.bill-toggle button[aria-pressed="true"]{background:var(--ink);color:#fff}
.bill-toggle small{font-size:12px;font-weight:600;opacity:.75}
.tier{scroll-margin-top:110px}
.guarantee{display:flex;gap:12px;align-items:flex-start;margin-top:20px;padding:16px 20px;border-radius:var(--r2);background:var(--card);border:1px solid var(--line);font-size:14.5px;line-height:1.95;color:var(--ink2)}
.guarantee svg{flex:none;width:22px;height:22px;margin-top:3px;fill:none;stroke:var(--good);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
dl.terms{margin:0;display:grid;gap:4px}
dl.terms dt{font-weight:700;margin-top:12px}
dl.terms dd{margin:0;color:var(--ink2);line-height:1.95}
.faq-groups{display:grid;gap:34px}
.faq-groups section{scroll-margin-top:110px}
nav.chips a.chip{display:inline-flex;align-items:center;text-decoration:none}

/* ---------- about ---------- */
.about{display:grid;grid-template-columns:minmax(0,1fr);gap:28px;align-items:start}
@media(min-width:940px){.about{grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr)}}
.facts-card{display:grid;gap:14px}
.facts-card dl{margin:0;display:grid;gap:2px}
.facts-card dt{font-size:12.5px;font-weight:600;color:var(--muted);margin-top:10px}
.facts-card dd{margin:0;font-size:15px;line-height:1.85}
.team{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-bottom:18px}
.person{display:flex;gap:16px;align-items:flex-start;padding:22px;background:var(--card);border:1px solid var(--line);border-radius:var(--r3);box-shadow:var(--sh1)}
.person h3{font-size:18px}
.person p{font-size:14.5px;line-height:1.95;color:var(--muted)}
.mono{display:grid;place-items:center;flex:none;width:52px;height:52px;border-radius:50%;background:var(--ink);color:#fff;font-size:21px;font-weight:800}
@media(max-width:700px){.team{grid-template-columns:1fr}}
.note-card{display:flex;gap:14px;align-items:flex-start;padding:18px 22px;border-radius:var(--r2);background:var(--card);border:1px solid var(--line)}
.note-card svg{flex:none;width:24px;height:24px;margin-top:3px;fill:none;stroke:var(--ink);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.note-card p{line-height:1.95;color:var(--ink2)}

/* ---------- long text: guides and legal ---------- */
.narrow-w{max-width:760px}
.article{padding-block:clamp(20px,3vw,40px) 10px}
.article .wrap{display:grid;gap:16px}
.article h1{font-size:clamp(28px,1.1rem + 2vw,42px);line-height:1.45}
.a-meta{font-size:13.5px;color:var(--muted)}
.prose{font-size:17px;line-height:2.15;color:var(--ink2)}
.prose>*+*{margin-top:16px}
.prose h2{margin-top:34px;font-size:clamp(21px,1rem + .8vw,26px);line-height:1.55;color:var(--ink)}
.prose h3{margin-top:22px;font-size:18.5px;color:var(--ink)}
.prose ul,.prose ol{padding-inline-start:22px;display:grid;gap:8px}
.prose li::marker{color:var(--faint)}
.prose a{color:var(--ink)}
.prose b{color:var(--ink)}
.a-cta{display:grid;gap:12px;margin-top:22px;padding:clamp(22px,3vw,34px);border-radius:var(--r4);background:#131312;color:#E6E4DD}
.a-cta h2{font-size:22px;color:#fff}
.a-cta .btn{background:#fff;color:var(--ink)}
.a-cta .btn.ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.3)}
.related{margin-top:28px}

/* ---------- 404 ---------- */
.nf{padding-block:clamp(40px,8vw,110px)}
.nf .wrap{display:grid;gap:14px;justify-items:center;text-align:center}
.nf-code{font-size:clamp(70px,14vw,140px);font-weight:800;line-height:1;color:var(--bg2);-webkit-text-stroke:1.5px var(--line2)}
.nf h1{font-size:clamp(26px,1.2rem + 1.6vw,38px)}

/* ---------- signup ---------- */
.signup-page{padding-bottom:72px}
.progress{list-style:none;margin:6px 0 18px;padding:0;display:flex;gap:6px;flex-wrap:wrap;counter-reset:pg}
.progress li{counter-increment:pg;display:flex;align-items:center;gap:8px;height:36px;padding:0 14px 0 16px;border-radius:999px;background:var(--card);border:1px solid var(--line);font-size:13px;font-weight:600;color:var(--muted);transition:color .3s,border-color .3s}
.progress li::before{content:counter(pg,persian);font-weight:700}
.progress li.now{color:var(--ink);border-color:var(--ink)}
.progress li.now::after{content:"";width:7px;height:7px;border-radius:50%;background:var(--y);box-shadow:0 0 0 3px rgba(255,204,0,.24)}
.progress li.done{color:var(--ink2)}
@media(max-width:600px){.progress{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-inline:-20px;padding-inline:20px}.progress li{flex:none}}
.lay-picks{display:grid;grid-template-columns:repeat(auto-fill,minmax(146px,1fr));gap:10px}
.lay-pick{position:relative;cursor:pointer;-webkit-tap-highlight-color:transparent}
.lay-pick input{position:absolute;opacity:0;pointer-events:none}
.lay-pick>span{display:grid;gap:10px;height:100%;padding:10px;border:1px solid var(--line2);border-radius:var(--r2);background:var(--field);transition:border-color .2s,box-shadow .2s,background .2s}
.lp-shot{position:relative;display:block;aspect-ratio:4/5;overflow:hidden;border-radius:14px;background:var(--stage,var(--bg2))}
.lp-shot img{position:absolute;inset:0;width:100%;height:auto;display:block}
.lp-tx{display:grid;gap:2px;padding-inline:4px}
.lp-tx b{font-size:15px}
.lp-tx em{font-style:normal;font-size:12.5px;color:var(--muted)}
.lay-pick input:checked+span{border-color:var(--ink);background:#fff;box-shadow:inset 0 0 0 1px var(--ink),var(--sh1)}
.lay-pick input:focus-visible+span{outline:2px solid var(--ink);outline-offset:3px}
@media(max-width:420px){.lay-picks{grid-template-columns:repeat(2,minmax(0,1fr))}}
.ltrrow{direction:ltr}
.ltrrow .suffix{font-size:14px}
.radios.two{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.save{display:inline-block;margin-inline-start:8px;padding:1px 10px;border-radius:999px;background:var(--goodw);color:var(--good);font-size:12px;font-weight:700}
.pw{position:relative;display:block}
.pw input{padding-inline-end:52px!important}
.pw-t{position:absolute;inset-inline-end:6px;top:50%;transform:translateY(-50%);display:grid;place-items:center;width:38px;height:38px;border:0;border-radius:12px;background:none;cursor:pointer;color:var(--muted)}
.pw-t svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.pw-t[aria-pressed="true"]{color:var(--ink)}
.sum-shot{position:relative;height:150px;overflow:hidden;border-radius:18px;background:var(--bg2);-webkit-mask-image:linear-gradient(#000 70%,transparent);mask-image:linear-gradient(#000 70%,transparent)}
.sum-shot img{position:absolute;top:10px;left:50%;width:120px;height:auto;margin-left:-60px;border-radius:16px;box-shadow:0 0 0 5px #151514,var(--sh2)}
.sum-trust{list-style:none;margin:0;padding:12px 0 0;border-top:1px solid var(--line);display:grid;gap:8px;font-size:13.5px;color:var(--ink2)}
.sum-trust li{display:flex;gap:10px;align-items:center}
.sum-trust svg{flex:none;width:18px;height:18px;fill:none;stroke:var(--ink);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.check a{color:var(--ink)}

/* ---------- payment + welcome ---------- */
.pay-page,.welcome-page{padding-bottom:64px}
.pay-page .wrap,.welcome-page .wrap{display:grid;gap:18px}
.invoice{display:grid;gap:16px}
.inv-h{display:flex;justify-content:space-between;gap:14px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.inv-h div{display:grid;gap:2px}
.muted{color:var(--muted)}
.inv-rows{margin:0;display:grid;grid-template-columns:auto 1fr;gap:10px 18px;font-size:15px}
.inv-rows dt{color:var(--muted)}
.inv-rows dd{margin:0;font-weight:600}
.done-mark{display:grid;place-items:center;justify-self:center;width:76px;height:76px;margin-top:24px;border-radius:50%;background:var(--goodw)}
.done-mark svg{width:38px;height:38px;fill:none;stroke:var(--good);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.next{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.nx{display:grid;gap:6px;align-content:start;padding:18px;background:var(--card);border:1px solid var(--line);border-radius:var(--r2);box-shadow:var(--sh1);text-decoration:none}
.nx span:last-child{font-size:13.5px;line-height:1.85;color:var(--muted)}
.nx .ic,.empty>svg,.created .ic{display:grid;place-items:center;width:42px;height:42px;border-radius:14px;background:var(--bg2)}
.nx .ic svg,.created .ic svg{width:21px;height:21px;fill:none;stroke:var(--ink);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:720px){.next{grid-template-columns:1fr}}

/* ---------- sign in ---------- */
.auth-wrap{padding-block:clamp(22px,4vw,56px) 72px}
.auth-wrap.split{display:grid;gap:18px;align-items:stretch;max-width:980px}
@media(min-width:880px){.auth-wrap.split{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.auth{width:100%;max-width:460px;margin:0 auto;display:grid;gap:14px;align-content:start;padding:clamp(22px,4vw,36px)}
.auth-wrap.split .auth{max-width:none}
.auth-aside{position:relative;overflow:hidden;display:grid;gap:18px;align-content:center;padding:clamp(24px,4vw,40px);border-radius:var(--r3);background:linear-gradient(150deg,#2E251C,#6E5237 55%,#B98F63);color:#fff}
.auth-aside h2{font-size:clamp(22px,1rem + 1vw,28px)}
.auth-aside ul{list-style:none;margin:0;padding:0;display:grid;gap:10px;font-size:15px;line-height:1.85;color:rgba(255,255,255,.88)}
.auth-aside li{display:flex;gap:10px;align-items:flex-start}
.auth-aside svg{flex:none;width:20px;height:20px;margin-top:4px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.auth-aside .m-pill{justify-self:start}
@media(max-width:879px){.auth-aside{display:none}}
.lbl-row{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.lbl-row a{font-size:13px;font-weight:500;color:var(--ink2)}
.hp{position:absolute!important;top:0;inset-inline-start:0;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);opacity:0;pointer-events:none}
.ticket-form,.auth form{position:relative}

/* ---------- file picker ---------- */
.attach{position:relative;display:flex;align-items:center;gap:12px;min-width:0;min-height:44px}
.attach input[type=file]{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;font-size:0}
.attach-btn{display:inline-flex;align-items:center;flex:none;height:40px;padding:0 16px;border:1px solid var(--line2);border-radius:999px;background:var(--card);font-size:13.5px;font-weight:600;color:var(--ink)}
.attach-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px;color:var(--muted)}
.attach:focus-within .attach-btn{outline:2px solid var(--ink);outline-offset:2px}
.reply-acts .attach{flex:1;min-width:180px}

/* ---------- tickets ---------- */
.support{display:grid;grid-template-columns:minmax(0,1fr);gap:22px;align-items:start}
@media(min-width:940px){.support{grid-template-columns:minmax(0,1fr) 320px}}
.support-main{display:grid;gap:16px;min-width:0}
.support-side,.t-side{display:grid;gap:14px;align-content:start}
.card-t{font-size:17px;font-weight:700;margin-bottom:8px}
.side-card{display:grid;gap:8px}
.side-card p{font-size:14px;line-height:1.95;color:var(--ink2)}
.links{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.links a{display:flex;align-items:center;min-height:38px;color:var(--ink)}
.ticket-page{display:grid;gap:16px;padding-block:24px 64px}
.created{display:flex;gap:16px;align-items:flex-start;border-color:rgba(24,121,78,.25)}
.created .ic{background:var(--goodw)}.created .ic svg{stroke:var(--good)}
.created h2{font-size:19px;margin-bottom:6px}
.created p{line-height:2;color:var(--ink2)}
.code{font-size:1.15em;font-weight:800;letter-spacing:.04em}
.copyrow{display:flex;gap:8px;margin-top:10px}
.copyrow input{min-height:42px!important;font-size:13px!important}
.t-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap}
.t-head h1{font-size:clamp(22px,1rem + 1vw,28px)}
.t-head p{font-size:13.5px}
.tthread{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.tm{display:grid;gap:6px;max-width:88%;padding:14px 18px;border-radius:22px;background:var(--card);border:1px solid var(--line);box-shadow:var(--sh1)}
.tm.staff{justify-self:end;border-end-end-radius:8px}
.tm.cust{justify-self:start;border-end-start-radius:8px}
.tm.mine{background:var(--ink);color:#fff;border-color:var(--ink)}
.tm.mine .tm-h time,.tm.mine .tm-h b{color:rgba(255,255,255,.75)}
.tm-h{display:flex;justify-content:space-between;gap:14px;font-size:12.5px}
.tm-h b{font-weight:700;color:var(--ink2)}
.tm-h time{color:var(--muted)}
.tm p{font-size:15px;line-height:1.95;white-space:normal;overflow-wrap:anywhere}
.tm.sys{justify-self:center;max-width:100%;padding:4px 14px;background:none;border:0;box-shadow:none;font-size:13px;color:var(--muted)}
.tm-img img{display:block;max-width:240px;max-height:240px;border-radius:14px;margin-top:4px}
.reply-card{display:grid;gap:12px}
.reply-acts{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.reply-acts input[type=file]{flex:1;min-width:180px}
.tlist{display:grid;gap:8px}
.trow{display:flex;align-items:center;gap:12px;padding:14px 18px;background:var(--card);border:1px solid var(--line);border-radius:var(--r2);box-shadow:var(--sh1);text-decoration:none;transition:border-color .2s}
.trow.unread{border-color:var(--ink)}
.trow.unread b::after{content:"";display:inline-block;width:8px;height:8px;margin-inline-start:8px;border-radius:50%;background:#E5484D;vertical-align:2px}
.tr-main{display:grid;flex:1;min-width:0;line-height:1.7}
.tr-main b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tr-main small{color:var(--muted);font-size:12.5px}
.tabs{display:flex;gap:4px;flex-wrap:wrap}
.tabs a{display:inline-flex;align-items:center;gap:6px;height:40px;padding:0 16px;border-radius:999px;border:1px solid var(--line2);text-decoration:none;font-size:14px;font-weight:500;color:var(--ink2)}
.tabs a.on{background:var(--ink);border-color:var(--ink);color:#fff}
.tabs small{font-size:12px;opacity:.7}
.back{display:inline-flex;align-items:center;gap:8px;width:fit-content;font-size:14px;font-weight:600;text-decoration:none;color:var(--ink2)}
.back::before{content:"";width:7px;height:7px;border-top:1.6px solid currentColor;border-right:1.6px solid currentColor;transform:rotate(45deg)}
.t-layout{display:grid;grid-template-columns:minmax(0,1fr);gap:18px;align-items:start}
.t-main{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;min-width:0}
.tscroll{overflow-x:auto;margin-inline:-4px;padding-inline:4px}
@media(min-width:1100px){.t-layout{grid-template-columns:minmax(0,1fr) 300px}}
.kv{margin:0;display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px 14px;font-size:14px}
.kv dt{color:var(--muted)}
.kv dd{margin:0;font-weight:500;overflow-wrap:anywhere}
.empty{display:grid;gap:10px;justify-items:center;text-align:center;padding:clamp(28px,5vw,48px) 22px}
.empty>svg{width:56px;height:56px;padding:15px;fill:none;stroke:var(--ink);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.empty h2{font-size:19px}
.empty p{max-width:46ch;color:var(--muted);line-height:1.95}
.evlist{list-style:none;margin:0;padding:0;display:grid;gap:8px;font-size:14px}
.evlist time{display:inline-block;min-width:88px;color:var(--muted)}
.ticket-form textarea{min-height:150px}

/* ---------- panel + admin ---------- */
.c-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px 18px;flex-wrap:wrap}
.c-head p{font-size:14px;margin-top:2px}
.c-acts{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.side-site{display:grid;gap:6px;padding:12px 12px 14px;margin-bottom:4px;border-bottom:1px solid var(--line)}
.side-site b{font-size:15px;line-height:1.6}
.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:start}
@media(max-width:820px){.grid-2{grid-template-columns:1fr}}
.setup{display:grid;gap:12px}
.setup-h{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap}
.bar-p{height:8px;border-radius:999px;background:var(--bg2);overflow:hidden}
.bar-p i{display:block;height:100%;border-radius:999px;background:var(--ink)}
.setup-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px}
.setup-list a{display:flex;gap:12px;align-items:flex-start;height:100%;padding:12px 14px;border-radius:var(--r2);border:1px solid var(--line);text-decoration:none}
.setup-list a span:last-child{display:grid;line-height:1.7}
.setup-list small{font-size:12.5px;color:var(--muted)}
.sl-dot{display:grid;place-items:center;flex:none;width:24px;height:24px;margin-top:2px;border-radius:50%;border:1.5px solid var(--line2)}
.setup-list li.ok .sl-dot{background:var(--good);border-color:var(--good)}
.sl-dot svg{width:14px;height:14px;fill:none;stroke:#fff;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.setup-list li.ok b{color:var(--muted);text-decoration:line-through;text-decoration-color:var(--line2)}
.setup-list li:not(.ok):first-of-type a,.setup-list li:not(.ok) a:focus-visible{border-color:var(--ink)}
.more-list{display:grid;gap:2px;padding:6px;background:var(--card);border:1px solid var(--line);border-radius:var(--r3);box-shadow:var(--sh1)}
.more-list a{display:flex;align-items:center;gap:14px;min-height:54px;padding:0 14px;border-radius:14px;text-decoration:none;font-size:16px;font-weight:500}
.more-list a+a{border-top:1px solid var(--line)}
.more-list svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.bars{display:flex;align-items:flex-end;gap:3px;height:160px;margin-top:16px}
.bars span{flex:1;min-width:0;height:max(var(--h),2px);border-radius:6px 6px 2px 2px;background:var(--ink);opacity:.85}
.bars span:last-child{opacity:1;background:var(--ink)}
.bars-x{display:flex;justify-content:space-between;margin-top:8px;font-size:12px;color:var(--muted)}
.big{font-size:26px;font-weight:800}
.tbl.plain{border:0}
.tbl.plain th{background:none}
.toplist{margin:0;padding-inline-start:22px;display:grid;gap:8px}
.toplist li{padding-inline-start:4px}
.toplist li span{display:inline-block;min-width:60%}
.plan-card{display:grid;gap:10px}
.plan-card h2{font-size:24px}
.plan-card h2 small{font-size:14px;font-weight:500;color:var(--muted)}
.form.attention{border-color:var(--warn);box-shadow:0 0 0 3px var(--warnw)}
.warn-note{padding:10px 14px;border-radius:14px;background:var(--warnw);color:var(--warn);font-weight:600;font-size:14px}
.add-item{padding:0}
.add-item summary{display:flex;align-items:center;gap:12px;padding:18px 22px;list-style:none;cursor:pointer;font-size:16px}
.add-item summary::-webkit-details-marker{display:none}
.add-item summary::after{content:"";flex:none;width:30px;height:30px;margin-inline-start:auto;border-radius:50%;background:var(--bg) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='%23131312' stroke-width='1.6' stroke-linecap='round'%3E%3Cpath d='M6 2v8M2 6h8'/%3E%3C/svg%3E") center/12px no-repeat;transition:transform .3s var(--ease)}
.add-item[open] summary::after{transform:rotate(45deg)}
.add-item summary .ic svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.add-item[open] summary{border-bottom:1px solid var(--line)}
.add-item form{padding:20px 22px 22px}
.inline-form{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end}
.inline-form label{flex:1;min-width:200px}
.btns{display:flex;gap:8px;flex-wrap:wrap}
.cur-img{width:120px;height:120px;object-fit:cover;border-radius:var(--r1)}
.search-form{display:flex;gap:8px}
.search-form input{min-height:40px!important;min-width:200px}
.card>h2{margin-bottom:6px}
.content>.h2s{margin:10px 0 0}

/* panel on phones: the same glass tab bar we ship on client sites */
.tabbar{display:none}
@media(max-width:880px){
  .area-panel .side{display:none}
  .area-panel .shell{padding-bottom:110px}
  .tabbar{display:block;position:fixed;left:0;right:0;bottom:0;z-index:60;padding:0 12px calc(10px + env(safe-area-inset-bottom,0px));pointer-events:none}
  .tb-in{pointer-events:auto;max-width:460px;margin:0 auto;height:62px;display:grid;grid-template-columns:repeat(5,1fr);gap:2px;padding:6px;border-radius:26px;background:rgba(255,255,255,.72);border:1px solid var(--line);box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 18px 40px -14px rgba(19,19,18,.3);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur)}
  .tb-in a{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;height:50px;border-radius:20px;text-decoration:none;font-size:11px;font-weight:600;color:var(--muted)}
  .tb-in a.on{background:rgba(19,19,18,.08);color:var(--ink)}
  .tb-in svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
  .tb-in .nb{position:absolute;top:4px;left:calc(50% - 22px);min-width:18px;height:18px;font-size:11px}
}
@media(max-width:880px){.area-admin .side{position:sticky;top:84px;z-index:20}.area-panel .foot{padding-bottom:96px}}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
}
@media(prefers-reduced-transparency:reduce){.bar,.m-pill,.seg,.sheet,.tb-in{-webkit-backdrop-filter:none;backdrop-filter:none;background:#fff}}
@media(prefers-contrast:more){:root{--line:rgba(19,19,18,.3);--line2:rgba(19,19,18,.5);--muted:#4A4944}.bar{background:#fff}}