/* TOKENS — copied from apps/web/assets/css/styles.css + website/assets/css/styles.css. */
:root{
  --bg:#070B16; --bg2:#0B1120; --card:#0E1729; --card2:#111c33; --card3:#16233f;
  --border:#1E2A44; --line-strong:#5B6C91;
  --txt:#E8EDF7; --muted:#93A2BE; --dim:#6B7A98;
  --c1:#22D3EE; --c2:#3B82F6; --c3:#2563EB; --im:#60A5FA;
  --accent:#3B82F6; --green:#34D399; --amber:#F0B429; --red:#F87171;
  --grad:linear-gradient(90deg,#22D3EE 0%,#3B82F6 100%);
  --grad2:linear-gradient(135deg,#22D3EE,#3B82F6);
  --radius:14px;
  color-scheme:dark;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;overflow-x:clip}
body{
  font-family:'Inter',system-ui,Arial,sans-serif;color:var(--txt);line-height:1.6;
  background:radial-gradient(115% 150% at 70% -10%, #101d3a 0%, var(--bg) 55%);
  background-attachment:fixed;background-color:var(--bg);
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
h1,h2,h3,h4{font-family:'Sora','Inter',sans-serif;letter-spacing:-.2px}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--c2);outline-offset:2px;border-radius:6px}
.wrap{max-width:1160px;margin:0 auto;padding:0 24px;position:relative;z-index:2}
.eyebrow{font-size:13px;letter-spacing:3px;text-transform:uppercase;color:var(--c1);font-weight:600}
.grad-text{background:var(--grad);background-size:200% auto;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:shine 5s linear infinite}
@keyframes shine{to{background-position:200% center}}

/* ══ INTRO LOADER — unchanged from website/index.html + styles.css ══ */
#intro{position:fixed;inset:0;z-index:9999;background:radial-gradient(ellipse at center,#0d1830,#070B16 70%);display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer}
#intro.done{animation:introOut .7s cubic-bezier(.6,.05,.1,1) forwards}
@keyframes introOut{to{opacity:0;transform:scale(1.06);visibility:hidden}}
.intro-word{display:flex;align-items:baseline;font-family:'Sora',sans-serif;font-weight:800;font-size:clamp(42px,10vw,92px);letter-spacing:-3px;line-height:1}
.intro-word .im{color:#38BDF8;opacity:0;transform:translateY(24px);animation:imIn .6s .55s cubic-bezier(.2,.9,.3,1) forwards;text-shadow:0 0 34px rgba(56,189,248,.5)}
.intro-word .i-caret{width:5px;height:.82em;background:#38BDF8;border-radius:3px;align-self:center;margin:0 3px;animation:cBlink 1.2s .6s forwards}
@keyframes cBlink{0%,100%{opacity:0}20%,50%{opacity:1}70%{opacity:0}}
.intro-word .rest{display:inline-block;overflow:hidden;white-space:nowrap;max-width:0;opacity:0;animation:restReveal 1s 1.15s cubic-bezier(.6,.05,.1,1) forwards}
.intro-word .rest .anna{color:#F1F5F9}
.intro-word .rest .ai{color:#7DD3FC;font-weight:300}
@keyframes imIn{to{opacity:1;transform:none}}
@keyframes restReveal{to{max-width:560px;opacity:1}}
.intro-skip{position:absolute;bottom:34px;font-size:12px;color:#4b5b7a;letter-spacing:1px}

/* ══ buttons / chips / logo — apps/web styles.css ══ */
.obtns{display:flex;gap:10px;margin-top:20px;flex-wrap:wrap}
.obtn{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--border);background:var(--card3);color:var(--txt);border-radius:10px;padding:10px 16px;font:inherit;font-weight:600;cursor:pointer;transition:border-color .18s,box-shadow .18s,transform .18s,background .18s}
.obtn:hover{border-color:var(--c2)}
.obtn.primary{background:var(--grad2);color:#fff;border-color:transparent;box-shadow:0 8px 24px rgba(59,130,246,.3)}
.obtn.primary:hover{box-shadow:0 12px 32px rgba(34,211,238,.42);transform:translateY(-1px)}
.obtn.ghost{background:transparent;color:var(--txt);border-color:var(--line-strong)}
.obtn.ghost:hover{border-color:var(--c2);background:rgba(59,130,246,.10)}
.obtn.sm{padding:6px 11px;font-size:12.5px}
.obtn.wide{width:100%;justify-content:center}
.chip2{display:inline-block;font-size:12px;background:var(--card3);border:1px solid var(--border);border-radius:999px;padding:5px 11px;color:var(--muted)}
.imlogo{display:inline-flex;align-items:center;gap:9px;font-family:'Sora','Inter',sans-serif;font-weight:800}
.imlogo .glyph{display:flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:8px;background:var(--grad2);color:#fff;font-size:12px;font-weight:800;letter-spacing:-1px;box-shadow:0 4px 14px rgba(59,130,246,.45);flex:none}
.logo-stack{display:flex;flex-direction:column;line-height:1}
.logo-stack .word{font-size:16px}
.logo-stack .im{color:var(--im)}.logo-stack .anna{color:#F1F5F9}.logo-stack .ai{color:var(--c1);font-weight:400}
.brand-beta{font-family:'Inter',sans-serif;font-size:9px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--dim);margin-top:2px}

/* ══ cards — app/modules.css ══ */
.mod-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px;margin-top:26px}
.mod-card{background:var(--card2);border:1px solid var(--border);border-radius:12px;padding:18px;display:flex;flex-direction:column;gap:9px}
.mod-head{display:flex;align-items:flex-start;gap:8px}
.mod-title{font-weight:700;font-size:16px;flex:1;font-family:'Sora','Inter',sans-serif}
.mod-badge{font-size:11px;font-weight:700;padding:3px 9px;border-radius:999px;flex:none;white-space:nowrap;letter-spacing:.06em;line-height:1.35}
.mod-badge.on{color:var(--green);background:color-mix(in srgb,var(--green) 16%,transparent)}
.mod-badge.hot{color:var(--c1);background:color-mix(in srgb,var(--c1) 14%,transparent)}
.mod-blurb{color:var(--muted);font-size:13.5px;margin:0;line-height:1.5;flex:1}
.mod-ic{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:10px;background:color-mix(in srgb,var(--c2) 16%,transparent);color:var(--c1);flex:none}
.mod-ic svg{width:19px;height:19px}
.mod-card .obtn{align-self:flex-start;margin-top:auto}
.role{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--c1);margin-top:-3px}
.role .pv{display:none}.role .pv.on{display:inline}

/* ══ nav ══ */
.nav{padding:20px 0;position:sticky;top:0;z-index:40;background:transparent;border-bottom:1px solid transparent;transition:background .22s ease,border-color .22s ease,backdrop-filter .22s ease,padding .22s ease}
.nav.stuck{background:rgba(7,11,22,.82);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom-color:var(--border);padding:12px 0}
@media (max-width:620px){.nav-in{gap:12px}.nav-links{gap:14px;font-size:13.5px;order:3;width:100%}.nav-right{margin-left:0;width:100%;justify-content:space-between;gap:10px}.imlogo{margin-right:auto}}
.nav-in{display:flex;align-items:center;gap:24px;flex-wrap:wrap;font-size:14px}
.nav-links{display:flex;gap:22px;color:var(--muted);flex-wrap:wrap}
.nav-links a:hover{color:var(--txt)}
.nav-right{margin-left:auto;display:flex;align-items:center;gap:16px}
.lang{display:flex;gap:2px;background:var(--card3);border:1px solid var(--border);border-radius:999px;padding:3px}
.lang button{font:600 11.5px 'Inter',sans-serif;letter-spacing:.06em;padding:4px 11px;border-radius:999px;border:0;background:none;color:var(--dim);cursor:pointer}
.lang button[aria-pressed="true"]{background:rgba(59,130,246,.18);color:var(--txt)}
.nav-right>a{color:var(--muted)}
.nav-right>a:hover{color:var(--txt)}

/* ══ hero ══ */
.hero{position:relative;padding:44px 0 78px}
.final .wrap{position:relative;z-index:2}
.dots-host{position:relative;overflow:hidden}
.dots{position:absolute;inset:0;z-index:0}
.dots canvas{pointer-events:none}
.dots canvas{position:absolute!important;inset:0}
.hero-in{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);gap:clamp(26px,4vw,52px);align-items:center}
@media (max-width:900px){.hero-in{grid-template-columns:1fr}}
h1{font-size:clamp(31px,4.8vw,54px);line-height:1.06;font-weight:800;margin-top:0}
.hero-h1{margin:0}
.hero-h1 .pv{display:none}
.hero-h1 .pv.on{display:block}
.hero-h1 .kw{display:block;font-family:'Inter',sans-serif;font-size:13px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--c1);margin-bottom:10px}
.hero-h1 .dsp{display:block;font-family:'Sora','Inter',sans-serif;font-size:clamp(31px,4.8vw,54px);line-height:1.06;font-weight:800;letter-spacing:-.2px}

.sub{color:var(--muted);font-size:17px;max-width:56ch;margin-top:14px}
.hero .sub{font-size:18px;max-width:50ch}
.pv{display:none}.pv.on{display:block}
.who-line{margin:18px 0 22px;display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.who-lab{font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);flex:none;margin-right:2px}
.who-line button{display:inline-flex;align-items:center;gap:8px;font:600 15px 'Inter',sans-serif;background:var(--card2);border:1px solid var(--border);color:var(--muted);cursor:pointer;padding:11px 20px;border-radius:999px;transition:border-color .18s,color .18s,background .18s,box-shadow .18s,transform .18s}
.who-line button::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--border);flex:none;transition:background .18s,box-shadow .18s}
.who-line button:hover{border-color:var(--c2);color:var(--txt)}
.who-line button[aria-pressed="true"]{background:rgba(59,130,246,.14);border-color:var(--c1);color:var(--txt);box-shadow:0 0 0 1px rgba(34,211,238,.35),0 8px 22px rgba(34,211,238,.14)}
.who-line button[aria-pressed="true"]::before{background:var(--grad2);box-shadow:0 0 10px rgba(34,211,238,.8)}

/* ══ sections ══ */
section{padding:74px 0;border-top:1px solid var(--border);position:relative;z-index:2}
h2.big{font-size:clamp(27px,3.6vw,42px);line-height:1.1;max-width:19ch;font-weight:700}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,54px);align-items:center;margin-top:30px}
.split.vis-left .visual{order:-1}
section.shot-sec > .wrap{max-width:1320px}
section.shot-sec .split{grid-template-columns:minmax(0,.84fr) minmax(0,1.16fr)}
section.shot-sec .split.vis-left{grid-template-columns:minmax(0,1.16fr) minmax(0,.84fr)}
@media (max-width:900px){section.shot-sec .split,section.shot-sec .split.vis-left{grid-template-columns:minmax(0,1fr)}}
@media (max-width:900px){.split{grid-template-columns:1fr}.split .visual{order:-1}}
ul.pts{list-style:none;margin:20px 0 0;display:grid;gap:11px}
ul.pts li{display:grid;grid-template-columns:auto 1fr;gap:11px;font-size:15px;align-items:start;color:var(--muted)}
ul.pts li::before{content:"";width:6px;height:6px;border-radius:2px;background:var(--c1);margin-top:9px}
ul.pts b{color:var(--txt);font-weight:600}

/* ══ plan card — the app's real flow (interaction.css .flow-plan*) ══ */
.planwrap{display:grid;gap:10px}
.ask{background:var(--card3);border:1px solid var(--border);border-radius:12px;padding:11px 14px;font-size:14px;color:var(--txt);justify-self:end;max-width:92%}
.ask .w{display:block;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);margin-bottom:4px}
.plan{background:var(--card2);border:1px solid var(--border);border-left:3px solid var(--accent);border-radius:0 12px 12px 0;padding:14px 16px}
.plan-h{font-family:'Sora','Inter',sans-serif;font-weight:700;font-size:15px;margin-bottom:9px}
.plan-reply{font-size:13.5px;line-height:1.6;color:var(--txt);background:color-mix(in srgb,var(--c2) 9%,var(--card3));border-left:3px solid var(--c2);border-radius:0 8px 8px 0;padding:10px 12px;margin-bottom:10px}
.plan-list{margin:0 0 4px 17px;font-size:13.5px;color:var(--muted);display:grid;gap:3px}
.plan-sec{font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);font-weight:700;margin:11px 0 4px}
.plan-sec:first-of-type{margin-top:10px}
.plan-modh{display:flex;align-items:center;gap:8px;font-family:'Sora','Inter',sans-serif;font-weight:700;font-size:15px;margin-bottom:8px}
.plan-modh s{display:inline-flex;color:var(--c2);text-decoration:none;flex:none}
.plan-modh s svg{width:17px;height:17px}
.plan-modsub{font-size:13px;color:var(--muted);line-height:1.5;margin:0 0 12px}
.est{margin:10px 0 4px;padding:10px 12px;border-radius:10px;background:color-mix(in srgb,var(--accent) 8%,var(--card2));border:1px solid color-mix(in srgb,var(--accent) 22%,var(--border))}
.est-head{font-size:14px;font-weight:600;color:var(--txt)}
.est-bal{font-size:12.5px;color:var(--muted);margin-top:2px}
.est-note{font-size:12px;color:var(--dim);margin-top:4px}
.est.partial{background:color-mix(in srgb,var(--amber) 9%,var(--card2));border-color:color-mix(in srgb,var(--amber) 30%,var(--border))}
.est-partial{font-size:12.5px;color:var(--amber);margin-top:4px}
.plan-acts{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}
.charged{background:var(--card2);border:1px solid color-mix(in srgb,var(--green) 26%,var(--border));border-radius:12px;padding:13px 15px}
.charged .ch-h{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim)}
.charged .ch-n{font-family:'Sora','Inter',sans-serif;font-size:20px;font-weight:700;color:var(--green);font-variant-numeric:tabular-nums;margin:3px 0 2px}
.charged .ch-s{font-size:12.5px;color:var(--muted)}

/* ══ the app frame — styles.css .win ══ */
.win{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,.5)}
img.shot{display:block;width:100%;height:auto;border-radius:var(--radius);border:1px solid var(--border);box-shadow:0 30px 80px rgba(0,0,0,.5)}

.win .titlebar .path{color:var(--dim);font-size:11.5px}
.win .titlebar .wc{margin-left:auto;display:flex;gap:6px}
.win .titlebar .wc s{width:9px;height:9px;border-radius:50%;background:var(--border);text-decoration:none;display:block}

/* ══ app chrome, recreated from the QA captures ══ */
.win .titlebar{display:flex;align-items:center;gap:10px;padding:8px 12px;background:rgba(11,17,32,.85);border-bottom:1px solid var(--border)}
.tb-logo{display:inline-flex;align-items:center;gap:7px;font-family:'Sora','Inter',sans-serif;font-weight:800;font-size:12.5px}
.tb-logo .g{width:18px;height:18px;border-radius:6px;background:var(--grad2);display:grid;place-items:center;color:#fff;font-size:8.5px;font-weight:800}
.tb-logo .beta{font-family:'Inter',sans-serif;font-size:7px;letter-spacing:.14em;background:var(--card3);border:1px solid var(--border);border-radius:4px;padding:1px 4px;color:var(--muted);font-weight:600}
.tb-right{margin-left:auto;display:flex;align-items:center;gap:9px}
.tb-cr{display:inline-flex;align-items:center;gap:6px;background:var(--card2);border:1px solid var(--border);border-radius:999px;padding:3px 10px;font-size:11px;font-weight:600;font-variant-numeric:tabular-nums}
.tb-cr s{width:11px;height:11px;border-radius:50%;background:var(--grad2);text-decoration:none;flex:none}
.tb-v{font-size:10px;color:var(--dim)}
.win>.body{display:grid;grid-template-columns:158px 1fr;min-height:300px}
@media (max-width:560px){
  .navdrawer{padding:16px 22px 34px}.win>.body{grid-template-columns:1fr}.win .side{display:none}}
.win .side{background:var(--card);border-right:1px solid var(--border);padding:9px 8px;display:flex;flex-direction:column;gap:6px}
.side-tabs{display:flex;gap:3px;background:var(--card2);border:1px solid var(--border);border-radius:9px;padding:3px}
.side-tabs span{flex:1;text-align:center;font-size:10px;font-weight:700;padding:4px 2px;border-radius:6px;color:var(--muted)}
.side-tabs span.on{background:var(--card);color:var(--txt)}
.side-new{background:linear-gradient(135deg,#2563EB,#1E40AF);color:#fff;border-radius:9px;padding:7px;text-align:center;font-size:10.5px;font-weight:700}
.side-h{font-size:8.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--dim);font-weight:700;margin-top:3px}
.side-i{display:flex;align-items:center;gap:6px;padding:4px 6px;border-radius:7px;color:var(--muted);font-size:10.5px}
.side-i.on{background:rgba(59,130,246,.14);color:var(--txt);box-shadow:inset 0 0 0 1px rgba(59,130,246,.28)}
.side-i s{width:11px;height:11px;border-radius:3px;background:currentColor;opacity:.4;text-decoration:none;flex:none}
.side-c{padding:4px 6px;border-radius:7px;font-size:10px;color:var(--muted);line-height:1.3}
.side-c.on{background:var(--card2);box-shadow:inset 0 0 0 1px var(--border);color:var(--txt)}
.side-c em{font-style:normal;display:block;color:var(--dim);font-size:9px}
.side-foot{margin-top:auto;display:flex;align-items:center;gap:6px;border-top:1px solid var(--border);padding-top:7px;font-size:10px;color:var(--muted)}
.side-foot s{width:16px;height:16px;border-radius:5px;background:var(--card3);display:grid;place-items:center;font-size:8px;color:var(--muted);text-decoration:none;font-weight:700}
.win .main{padding:13px 15px;min-width:0;display:flex;flex-direction:column;gap:9px}

/* module screen bits */
.m-back{align-self:flex-start;font-size:10px;color:var(--muted);border:1px solid var(--border);border-radius:7px;padding:3px 8px}
.m-h{font-family:'Sora','Inter',sans-serif;font-weight:700;font-size:14px}
.m-s{font-size:10.5px;color:var(--dim);line-height:1.45}
.m-lab{font-size:8.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--dim);font-weight:700;margin-top:3px}
.plat{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}
.plat div{border:1px solid var(--border);background:var(--card2);border-radius:9px;padding:8px 9px;display:flex;align-items:center;gap:7px}
.plat div.on{border-color:rgba(59,130,246,.55);background:rgba(59,130,246,.10)}
.plat s{width:16px;height:16px;border-radius:5px;background:var(--card3);text-decoration:none;flex:none}
.plat b{font-size:10.5px;font-weight:600;display:block;line-height:1.2}
.plat i{font-style:normal;font-size:8.5px;color:var(--green)}
.plat i.soon{color:var(--dim)}
.fchips{display:flex;flex-wrap:wrap;gap:5px}
.fchips span{font-size:9.5px;border:1px solid var(--border);background:var(--card3);border-radius:999px;padding:3px 8px;color:var(--muted)}
.fchips span.on{background:var(--grad2);color:#fff;border-color:transparent;font-weight:600}
.mfield{border:1px solid var(--border);background:var(--card2);border-radius:8px;padding:8px 10px;font-size:10px;color:var(--dim);min-height:34px}
.mrow{display:flex;gap:7px;align-items:center}
.mbtn{background:var(--grad2);color:#fff;font-size:10.5px;font-weight:700;border-radius:8px;padding:6px 14px}
.mbtn.alt{background:var(--card3);color:var(--txt);border:1px solid var(--border)}

/* the merchant role cards, as the product presents them */
.roles{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}
.roles div{border:1px solid var(--border);background:var(--card2);border-radius:9px;padding:9px}
.roles div.on{border-color:rgba(59,130,246,.6);background:rgba(59,130,246,.10)}
.roles b{font-size:10.5px;display:block;margin-bottom:2px}
.roles p{font-size:9px;color:var(--dim);line-height:1.4}

/* chat composer, as it really looks */
.composer{display:flex;align-items:center;gap:6px;border:1px solid var(--border);background:var(--card2);border-radius:9px;padding:5px 6px;margin-top:auto}
.composer .ci{flex:1;font-size:10px;color:var(--dim);padding:0 4px}
.composer s{width:20px;height:20px;border-radius:6px;background:var(--card3);text-decoration:none;flex:none}
.composer .sel{font-size:9px;color:var(--muted);border:1px solid var(--border);border-radius:6px;padding:3px 7px}
.composer .go{background:var(--c3);color:#fff;font-size:10px;font-weight:700;border-radius:6px;padding:4px 10px}

/* approval, exactly as the plan card asks for it */
.approve-row{display:flex;align-items:flex-start;gap:8px;margin-top:12px;font-size:13px;line-height:1.35}
.approve-row > span{display:grid;gap:2px}
.approve-row s{width:15px;height:15px;border-radius:4px;border:1px solid var(--line-strong);flex:none;margin-top:2px;text-decoration:none;display:block}
.approve-note{display:block;font-size:11.5px;color:var(--dim)}

/* ══ findings ══ */
.finds{display:grid;gap:9px}
.find{background:var(--card2);border:1px solid var(--border);border-radius:10px;padding:12px 14px;display:grid;gap:5px}
.find .top{display:flex;gap:9px;align-items:center;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.find .lens{color:var(--c1)}
.find .tally{margin-left:auto;color:var(--dim);letter-spacing:0;text-transform:none;font-weight:500;font-size:11.5px}
.find .txt{font-size:13.5px;color:var(--txt);line-height:1.45}
.find .file{font:400 11.5px ui-monospace,Consolas,monospace;color:var(--dim)}
.find s{width:7px;height:7px;border-radius:50%;background:var(--red);text-decoration:none;flex:none}
.find s.b{background:var(--amber)}.find s.c{background:var(--c2)}

/* ══ chat thread ══ */
.thread{display:grid;gap:9px}
.msg{max-width:86%;padding:10px 13px;border-radius:12px;font-size:13.5px;line-height:1.45}
.msg.them{background:var(--card3);border:1px solid var(--border);border-bottom-left-radius:4px;color:var(--txt)}
.msg.us{background:var(--grad2);color:#fff;justify-self:end;border-bottom-right-radius:4px}
.msg .t{display:block;font-size:10.5px;opacity:.7;margin-top:5px}
.handoff{border:1px solid var(--border);border-left:3px solid var(--amber);border-radius:8px;padding:10px 12px;font-size:12.5px;color:var(--muted);background:color-mix(in srgb,var(--amber) 8%,transparent)}

/* ══ calendar ══ */
.cal .ch{display:flex;justify-content:space-between;font-size:11.5px;color:var(--muted);font-weight:600;margin-bottom:9px}
.cal .g{display:grid;grid-template-columns:repeat(7,1fr);border-top:1px solid var(--border);border-left:1px solid var(--border);border-radius:6px;overflow:hidden}
.cal .d{aspect-ratio:1.15;border-right:1px solid var(--border);border-bottom:1px solid var(--border);padding:4px;display:grid;gap:3px;align-content:start}
.cal .d i{font-style:normal;font-size:9.5px;color:var(--dim)}
.cal .p{height:4px;border-radius:2px;background:rgba(59,130,246,.28)}
.cal .p.f{background:var(--c2)}.cal .p.c{background:var(--c1)}
.cal .cf{display:flex;gap:16px;margin-top:10px;font-size:11.5px;color:var(--dim);flex-wrap:wrap}
.cal .cf b{color:var(--txt);font-variant-numeric:tabular-nums}

/* ══ pricing ══ */
.beta{display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:center;background:var(--card2);border:1px solid rgba(34,211,238,.35);border-radius:14px;padding:20px 22px;margin-top:26px}
.beta .n{font-family:'Sora',sans-serif;font-size:38px;font-weight:800;line-height:1;color:var(--c1);font-variant-numeric:tabular-nums}
.beta p{font-size:15px;color:var(--muted)}
.beta p b{color:var(--txt)}
.packs{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:14px}
@media (max-width:800px){.packs{grid-template-columns:1fr}}
.pack{background:var(--card2);border:1px solid var(--border);border-radius:12px;padding:18px}
.pack .c{font-size:12px;color:var(--dim);font-weight:600}
.pack .p{font-family:'Sora',sans-serif;font-size:29px;font-weight:700;font-variant-numeric:tabular-nums;margin:4px 0 2px}
.pack .alt{font-size:13px;color:var(--muted);font-variant-numeric:tabular-nums}
.pack .b{font-size:13px;color:var(--dim);margin-top:9px;line-height:1.45}

/* ══ close + footer ══ */
.final{text-align:center;padding:76px 0}
.final h2{margin:0 auto;max-width:22ch}
.final .sub{margin:14px auto 0}
.final .obtns{justify-content:center}
footer{border-top:1px solid var(--border);padding:36px 0 58px;position:relative;z-index:2}
.fmap{display:grid;grid-template-columns:repeat(5,1fr);gap:24px;font-size:13.5px}
@media (max-width:800px){.fmap{grid-template-columns:1fr 1fr}}
/* An h2, not the h5 it used to be. Every page reaches the footer straight from its own h1 or h2, so
   an h5 here jumped two or three levels and made the footer read to a screen reader as a subsection of
   whatever the last heading happened to be. The tag carries the outline; these declarations carry the
   look, which is why the Inter face and the -.2px letter-spacing that `h1,h2,h3,h4` would otherwise
   impose are both overridden back to what the h5 rendered. */
.fmap h2{font-family:'Inter',system-ui,Arial,sans-serif;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--dim);margin-bottom:10px;font-weight:600}
.fmap a{display:block;color:var(--muted);padding:3px 0}
.fmap a:hover{color:var(--c1)}
.fmap a em{font-style:normal;color:var(--dim);font-size:11px;display:block;font-family:ui-monospace,Consolas,monospace}
.fbot{border-top:1px solid var(--border);margin-top:28px;padding-top:18px;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;font-size:12.5px;color:var(--dim)}

/* ══ LOGIN — apps/web/assets/css/app/login.css ══ */
.login-screen{position:fixed;inset:0;z-index:500;display:flex;align-items:center;justify-content:center;padding:20px;overflow-y:auto;background:radial-gradient(900px 560px at 50% -10%, #16203a 0%, var(--bg) 58%)}
.login-screen[hidden]{display:none}
.login-screen::before{content:"";position:absolute;top:12%;left:50%;transform:translateX(-50%);width:640px;height:420px;pointer-events:none;background:radial-gradient(ellipse at center,rgba(59,130,246,.18),rgba(34,211,238,.10) 40%,transparent 70%)}
.login-screen .lang-toggle{position:absolute;top:18px;right:18px;z-index:2;display:inline-flex;gap:2px;padding:3px;background:var(--card);border:1px solid var(--border);border-radius:999px}
.login-screen .lang-btn{background:none;border:0;cursor:pointer;font:inherit;font-weight:700;font-size:11px;letter-spacing:.04em;color:var(--muted);padding:4px 10px;border-radius:999px;transition:color .15s,background .15s}
.login-screen .lang-btn:hover{color:var(--txt)}
.login-screen .lang-btn[aria-pressed="true"]{background:var(--grad2);color:#fff}
.login-card{position:relative;width:360px;max-width:100%;background:var(--card);border:1px solid var(--border);border-radius:18px;padding:34px 30px;text-align:center;box-shadow:0 30px 80px rgba(0,0,0,.55),0 0 0 1px rgba(59,130,246,.10)}
.imlogo-lg{flex-direction:column;gap:12px;align-items:center;margin-bottom:12px}
.imlogo-lg .glyph{width:54px;height:54px;border-radius:15px;font-size:25px}
.imlogo-lg .logo-stack{align-items:center}
.imlogo-lg .word{font-size:24px}
.login-card h3{margin:8px 0 2px;font-size:19px}
.muted2{color:var(--muted);font-size:12px;margin:0 0 18px}
.login-card input[type="email"],.login-card input[type="password"]{width:100%;background:var(--card2);border:1px solid var(--border);border-radius:10px;padding:12px 13px;color:var(--txt);font:inherit;margin:7px 0;transition:border-color .18s,box-shadow .18s}
.login-card input[type="email"]:focus,.login-card input[type="password"]:focus{outline:0;border-color:var(--c2);box-shadow:0 0 0 3px rgba(59,130,246,.16)}
.login-remember{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted);margin:8px 0 4px;cursor:pointer;user-select:none}
.login-remember input{width:auto;margin:0;accent-color:var(--c2);cursor:pointer;flex:none}
.login-forgot{display:block;margin:12px 0 0;font-size:13px;color:var(--muted);text-decoration:none}
.login-forgot:hover{color:var(--txt);text-decoration:underline}
.oauth{margin-top:16px}
.oauth-sep{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:12px;margin:4px 0 12px}
.oauth-sep::before,.oauth-sep::after{content:"";flex:1;height:1px;background:var(--border)}
.btn-google{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;background:#fff;color:#1f1f1f;border:1px solid #dadce0;border-radius:10px;padding:11px;font:inherit;font-weight:600;cursor:pointer}
.btn-google:hover{background:#f7f8f8;box-shadow:0 1px 3px rgba(0,0,0,.28)}
.btn-facebook{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:11px 14px;border-radius:10px;cursor:pointer;border:1px solid #1877F2;background:#1877F2;color:#fff;font:inherit;font-size:14px;font-weight:600;margin-top:10px}
.btn-facebook:hover{background:#166FE5;border-color:#166FE5}
.btn-facebook svg{flex:0 0 auto}
.btn-facebook svg path{fill:#fff}
.login-back{display:block;width:100%;margin-top:16px;background:none;border:0;color:var(--dim);font:inherit;font-size:13px;cursor:pointer}
.login-back:hover{color:var(--txt)}
.login-note{margin-top:14px;font-size:12px;color:var(--dim);line-height:1.5}

/* ── the burger and its drawer ─────────────────────────────────────────────────────────────── */
.navtoggle{display:none;align-items:center;justify-content:center;width:42px;height:42px;margin-left:auto;border:1px solid var(--border);background:var(--card2);border-radius:11px;color:var(--txt);cursor:pointer;padding:0}
.navtoggle svg{width:22px;height:22px}
.navdrawer{position:fixed;inset:0;z-index:400;background:rgba(7,11,22,.97);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);flex-direction:column;padding:16px 20px 32px;overflow-y:auto;display:none}
.navdrawer.open{display:flex}
.navdrawer-top{display:flex;align-items:center;gap:12px;margin-bottom:26px}
.navdrawer-x{margin-left:auto;width:42px;height:42px;display:flex;align-items:center;justify-content:center;border:1px solid var(--border);background:var(--card2);border-radius:11px;color:var(--txt);cursor:pointer;padding:0}
.navdrawer-x svg{width:20px;height:20px}
.navdrawer nav{display:flex;flex-direction:column}
.navdrawer nav a{font-family:'Sora','Inter',sans-serif;font-size:22px;font-weight:700;color:var(--txt);padding:13px 0;border-bottom:1px solid var(--border)}
.navdrawer nav a em{display:block;font-style:normal;font-family:'Inter',sans-serif;font-size:13px;font-weight:400;color:var(--dim);margin-top:3px}
.navdrawer-more{display:grid;grid-template-columns:1fr 1fr;gap:2px 18px;margin-top:22px}
.navdrawer-more a{font-size:14px;color:var(--muted);padding:7px 0}
.navdrawer-foot{margin-top:26px;display:grid;gap:10px}
.navdrawer-foot .lang{justify-self:start;align-self:start}
.navdrawer-foot .obtn{width:100%;text-align:center;padding:14px}

/* ── the phone layout ──────────────────────────────────────────────────────────────────────── */
@media (max-width:860px){
  .nav-links,.nav-right{display:none}
  .navtoggle{display:flex}
  .nav{padding:12px 0}
  .nav.stuck{padding:9px 0}
  .nav-in{gap:12px;flex-wrap:nowrap}
}
@media (max-width:760px){
  .wrap{padding:0 22px}
  section{padding:52px 0}
  .hero{padding:28px 0 54px}
  .eyebrow{font-size:11.5px;letter-spacing:2.2px}
  h2.big{font-size:clamp(26px,7.4vw,34px);max-width:none}
  .sub,.hero .sub{font-size:15.5px;max-width:none;margin-top:12px}
  .hero-h1 .kw{font-size:11.5px;letter-spacing:.1em}
  .hero-h1 .dsp{font-size:clamp(30px,8.6vw,42px);line-height:1.08}
  .obtns{flex-direction:column;align-items:stretch;gap:9px}
  .obtns .obtn{width:100%;text-align:center;justify-content:center;padding:14px 18px}
  .split,.hero-in{gap:26px}
  .pts li{font-size:14px}
  .fmap{grid-template-columns:1fr;gap:22px}
  .fbot{flex-direction:column;gap:8px}
  .intro-word{letter-spacing:-2px}
  .plan,.ask{font-size:13px}
  .mod-grid{gap:12px}
  .mod-card{padding:16px}
  section.shot-sec .visual{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:thin;border-radius:var(--radius)}
  section.shot-sec .visual img.shot{width:min(640px,172vw);max-width:none;height:auto}
  section.shot-sec .visual .pv.on{display:block}
}
@media (max-width:560px){
  /* The label rejoins its own line here: "I'M HERE AS" plus three pills cannot share 354px, and a
     switch that wraps mid-row is worse than a label with its own line. */
  .who-lab{width:100%;margin:0 0 4px}
  .who-line{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin:14px 0 18px}
  .who-line button{padding:10px 6px;font-size:13px;gap:6px;justify-content:center}
  .who-line button::before{width:7px;height:7px}
  .login-card{padding:26px 20px}
  .packs{gap:12px}
}
/* ══ PAGES ══ Every route below the home page. One shell, one router — the nav, the footer and the
   language toggle are shared, so a page can never drift from the site around it. */
.pg{padding:34px 0 90px}
.pg-head{max-width:70ch}
.pg-kicker{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--c1);font-weight:700}
.pg h1{font-family:'Sora','Inter',sans-serif;font-size:clamp(30px,4.4vw,46px);line-height:1.08;font-weight:800;margin:10px 0 0;letter-spacing:-.4px}
.pg-h1{margin:10px 0 0}
.pg-h1 .kw{display:block;font-family:'Inter',sans-serif;font-size:12.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--c1);margin-bottom:9px}
.pg-h1 .dsp{display:block;font-family:'Sora','Inter',sans-serif;font-size:clamp(30px,4.4vw,46px);line-height:1.08;font-weight:800;letter-spacing:-.4px}
.pg-lead + .pg-lead{margin-top:12px}
.pg-lead{color:var(--muted);font-size:17px;line-height:1.6;margin-top:14px;max-width:62ch}
.pg-sec{margin-top:44px}
.pg-sec > h2{font-family:'Sora','Inter',sans-serif;font-size:21px;font-weight:700;margin:0 0 6px}
.pg-sec > p{color:var(--muted);font-size:15px;line-height:1.65;max-width:66ch;margin:0}
.pg-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(258px,1fr));gap:14px;margin-top:18px}
.pg-card{background:var(--card2);border:1px solid var(--border);border-radius:12px;padding:17px 18px;display:flex;flex-direction:column;gap:7px}
.pg-card h3{font-family:'Sora','Inter',sans-serif;font-size:15.5px;margin:0;font-weight:700}
.pg-card p{margin:0;color:var(--muted);font-size:13.5px;line-height:1.55}
.pg-card .n{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);font-weight:700}
.pg-card a{color:var(--c1);font-size:13px;font-weight:600;margin-top:auto;padding-top:4px}
.pg-steps{counter-reset:st;display:grid;gap:14px;margin-top:20px}
.pg-step{display:grid;grid-template-columns:34px 1fr;gap:14px;align-items:start}
.pg-step .b{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--card3);border:1px solid var(--border);color:var(--c1);font-weight:800;font-size:13px}
.pg-step h3{margin:5px 0 3px;font-size:16px;font-family:'Sora','Inter',sans-serif}
.pg-step p{margin:0;color:var(--muted);font-size:14px;line-height:1.6}
.pg-back{display:inline-flex;align-items:center;gap:7px;color:var(--muted);font-size:13.5px;font-weight:600;margin-bottom:20px}
.pg-back:hover{color:var(--c1)}
.pg-art{display:block;width:100%;height:auto;border-radius:14px;border:1px solid var(--border);margin-top:30px}
.pg-split{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(26px,4vw,54px);align-items:center}
.pg-split .pg-head{max-width:none}
.pg-hero-art{margin:0}
.pg-hero-art img{display:block;width:100%;height:auto;border-radius:16px;border:1px solid var(--border)}
@media (max-width:860px){.pg-split{grid-template-columns:1fr;gap:24px}.pg-hero-art{order:-1}}
.hc-ic{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:10px;background:color-mix(in srgb,var(--c2) 16%,transparent);color:var(--c1);flex:none;margin-bottom:2px}
.hc-ic svg{width:19px;height:19px}
.hc-group{margin-top:38px;scroll-margin-top:84px}
.hc-group > h2{font-family:'Sora','Inter',sans-serif;font-size:19px;font-weight:700;margin:0 0 4px}
.hc-col{text-decoration:none}
.hc-col:hover{border-color:var(--c2)}
.bl-chip{font-size:10.5px;color:var(--dim);border:1px solid var(--border);border-radius:999px;padding:1px 8px}
.cl{display:grid;gap:16px;margin-top:26px}
.cl-entry{background:var(--card2);border:1px solid var(--border);border-radius:14px;padding:20px 22px}
.cl-head{display:flex;align-items:baseline;gap:12px;margin-bottom:6px}
.cl-entry h2{font-family:'Sora','Inter',sans-serif;font-size:18px;margin:0 0 10px;font-weight:700}
.cl-entry ul{margin:0;padding-left:19px;color:var(--muted);font-size:14.5px;line-height:1.65}
.cl-entry li{margin:6px 0}
.pg-pre{margin:12px 0 0;padding:13px 15px;background:var(--card3);border:1px solid var(--border);border-radius:10px;font-family:ui-monospace,Consolas,monospace;font-size:12.5px;line-height:1.7;color:var(--txt);overflow-x:auto;white-space:pre}
.pg-pre .cm{color:var(--dim)}
.pg-card code,.pg-step code,.pg-lead code{background:rgba(127,127,127,.18);padding:1px 5px;border-radius:4px;font-family:ui-monospace,Consolas,monospace;font-size:12.5px}
.cf{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:18px;max-width:620px}
.cf-f{display:grid;gap:5px;font-size:13px;color:var(--muted)}
.cf-wide{grid-column:1/-1}
.cf input,.cf textarea{background:var(--card2);border:1px solid var(--border);border-radius:10px;padding:11px 13px;color:var(--txt);font:inherit;width:100%;box-sizing:border-box}
.cf input:focus,.cf textarea:focus{outline:0;border-color:var(--c2);box-shadow:0 0 0 3px rgba(59,130,246,.16)}
.cmp-jump{display:flex;gap:8px;flex-wrap:wrap;margin-top:20px}
.cmp-jump a{background:var(--card2);border:1px solid var(--border);color:var(--muted);border-radius:999px;padding:8px 15px;font-size:13px;font-weight:600}
.cmp-jump a:hover{border-color:var(--c2);color:var(--txt)}
.cmp{scroll-margin-top:84px}
.cmp > h2{font-size:23px}
.cmp-them{color:var(--muted);font-size:15px;line-height:1.65;max-width:70ch;margin:10px 0 0;padding-left:13px;border-left:2px solid var(--border)}
.cmp-tbl{width:100%;border-collapse:collapse;margin:20px 0 14px;font-size:14px;border:1px solid var(--border);border-radius:12px;overflow:hidden;table-layout:fixed}
.cmp-tbl th{text-align:left;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--dim);font-weight:700;padding:11px 14px;background:var(--card3);border-bottom:1px solid var(--border)}
.cmp-tbl th:nth-child(2){color:var(--c1)}
.cmp-tbl td{padding:13px 14px;border-bottom:1px solid var(--border);color:var(--muted);line-height:1.55;vertical-align:top}
.cmp-tbl tr:last-child td{border-bottom:0}
.cmp-tbl td:first-child{color:var(--txt);font-weight:600}
.cmp-tbl td.y{position:relative;padding-left:32px;color:var(--txt)}
.cmp-tbl td.y::before{content:"";position:absolute;left:14px;top:17px;width:11px;height:6px;border-left:2px solid var(--green);border-bottom:2px solid var(--green);transform:rotate(-45deg)}
.cmp-tbl td.n{position:relative;padding-left:32px}
.cmp-tbl td.n::before{content:"";position:absolute;left:16px;top:19px;width:9px;height:2px;background:var(--faint,var(--dim))}
.cmp-note{margin-top:40px;padding-top:18px;border-top:1px solid var(--border);font-size:12.5px;color:var(--dim);line-height:1.6;max-width:78ch}
.cmp-note a{color:var(--c1)}
@media (max-width:700px){
  .cmp-tbl,.cmp-tbl tbody,.cmp-tbl tr,.cmp-tbl td{display:block;width:100%;box-sizing:border-box}
  .cmp-tbl thead{display:none}
  .cmp-tbl tr{border-bottom:1px solid var(--border);padding:4px 0}
  .cmp-tbl tr:last-child{border-bottom:0}
  .cmp-tbl td{border-bottom:0;padding:7px 14px}
  .cmp-tbl td.y::before{top:11px}.cmp-tbl td.n::before{top:13px}
}
@media (max-width:560px){.cf{grid-template-columns:1fr}}
article[data-route="docs"] .pg-art{border-color:#1c1e24}
.post .pg-art{margin:0 0 26px}
@media (max-width:760px){.pg-art{border-radius:12px;margin-top:22px}}

/* the help center */
.hc-search{display:flex;gap:9px;margin-top:22px;max-width:520px}
/* Shown by site.js only when a query matches none of the 36 answers. A filter that empties the page
   and says nothing is indistinguishable from a page that failed to load, which is the state the search
   box used to leave the help centre in before it had a handler at all. */
.hc-none{margin-top:18px;color:var(--muted);font-size:14.5px}
.hc-none[hidden]{display:none}
.hc-search input{flex:1;background:var(--card2);border:1px solid var(--border);border-radius:11px;padding:13px 15px;color:var(--txt);font:inherit}
.hc-search input:focus{outline:0;border-color:var(--c2);box-shadow:0 0 0 3px rgba(59,130,246,.16)}
.hc-col{display:flex;flex-direction:column;gap:6px}
.hc-col .n{font-size:11.5px;color:var(--dim)}
.qa{border-top:1px solid var(--border)}
.qa details{border-bottom:1px solid var(--border)}
.qa summary{list-style:none;cursor:pointer;padding:15px 0;font-size:15.5px;font-weight:600;display:flex;align-items:center;gap:11px}
.qa summary::-webkit-details-marker{display:none}
.qa summary::before{content:"+";color:var(--c1);font-weight:800;font-size:17px;line-height:1;width:14px;flex:none}
.qa details[open] summary::before{content:"–"}
.qa details[open] summary{color:var(--c1)}
.qa .a{padding:0 0 16px 25px;color:var(--muted);font-size:14.5px;line-height:1.65;max-width:70ch}
.qa .a code{background:rgba(127,127,127,.18);padding:1px 5px;border-radius:4px;font-family:ui-monospace,Consolas,monospace;font-size:12.5px}

/* the api reference */
.api-legend{display:flex;gap:9px;flex-wrap:wrap;margin-top:18px}
.api-auth{font-family:ui-monospace,Consolas,monospace;font-size:10.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;padding:3px 8px;border-radius:6px;border:1px solid var(--border);color:var(--dim);background:var(--card2);white-space:nowrap}
.api-auth.bearer{color:var(--c1);border-color:rgba(34,211,238,.4)}
.api-auth.public{color:var(--green);border-color:rgba(52,211,153,.4)}
.api-auth.session{color:var(--im);border-color:rgba(96,165,250,.4)}
.api-auth.install{color:var(--amber);border-color:rgba(240,180,41,.4)}
.api-auth.admin{color:var(--red);border-color:rgba(248,113,113,.4)}
.api-auth.ingest{color:var(--violet,#a78bfa);border-color:rgba(167,139,250,.4)}
.api-cat{margin-top:32px}
.api-cat h2{font-family:'Sora','Inter',sans-serif;font-size:17px;margin:0 0 10px;font-weight:700}
.api-rows{border:1px solid var(--border);border-radius:12px;overflow:hidden}
.api-row{display:grid;grid-template-columns:104px minmax(0,1fr) 84px;gap:14px;align-items:baseline;padding:11px 14px;border-bottom:1px solid var(--border);font-size:13px}
.api-row:last-child{border-bottom:0}
.api-row .m{font-family:ui-monospace,Consolas,monospace;font-size:10.5px;font-weight:700;color:var(--im)}
.api-row .p{font-family:ui-monospace,Consolas,monospace;font-size:12.5px;color:var(--txt);overflow-wrap:anywhere}
.api-row .p span{display:block;font-family:'Inter',sans-serif;font-size:12.5px;color:var(--muted);margin-top:3px;line-height:1.5}
.api-row .a{justify-self:end}
@media (max-width:640px){.api-row{grid-template-columns:1fr;gap:5px}.api-row .a{justify-self:start}}

/* the blog */
.bl-list{display:grid;gap:12px;margin-top:22px}
.bl-item{display:block;background:var(--card2);border:1px solid var(--border);border-radius:13px;padding:18px 20px;transition:border-color .16s,background .16s}
.bl-item:hover{border-color:var(--c2);background:var(--card3)}
.bl-meta{display:flex;gap:9px;align-items:center;flex-wrap:wrap;font-size:11.5px;color:var(--dim);font-variant-numeric:tabular-nums}
.bl-tag{font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--c1);background:color-mix(in srgb,var(--c1) 13%,transparent);border-radius:999px;padding:2px 9px}
.bl-tag.rel{color:var(--green);background:color-mix(in srgb,var(--green) 13%,transparent)}
.bl-item h3{font-family:'Sora','Inter',sans-serif;font-size:18px;margin:9px 0 5px;font-weight:700;line-height:1.3}
.bl-item p{margin:0;color:var(--muted);font-size:14px;line-height:1.55}
.bl-feat{background:linear-gradient(150deg,color-mix(in srgb,var(--c2) 12%,var(--card2)),var(--card2));border-color:rgba(59,130,246,.4)}
.post{max-width:70ch}
.post h2{font-family:'Sora','Inter',sans-serif;font-size:20px;margin:30px 0 8px;font-weight:700}
.post p{color:var(--muted);font-size:16px;line-height:1.75;margin:0 0 14px}
.post ul{color:var(--muted);font-size:16px;line-height:1.75;padding-left:20px;margin:0 0 16px}
.post li{margin:5px 0}
.post b{color:var(--txt)}
.post blockquote{margin:20px 0;padding:14px 18px;border-left:3px solid var(--c2);background:var(--card2);border-radius:0 10px 10px 0;color:var(--txt);font-size:15.5px;line-height:1.6}

/* legal — the verbatim policy, in the site's type */
.legal-body{max-width:72ch;margin-top:26px}
.legal-body h2{font-family:'Sora','Inter',sans-serif;font-size:19px;margin:32px 0 8px;font-weight:700}
.legal-body h3{font-family:'Sora','Inter',sans-serif;font-size:15.5px;margin:20px 0 6px;font-weight:700;color:var(--txt)}
.legal-body p,.legal-body li{color:var(--muted);font-size:15px;line-height:1.72}
.legal-body p{margin:0 0 12px}
.legal-body ul,.legal-body ol{padding-left:20px;margin:0 0 14px}
.legal-body li{margin:5px 0}
.legal-body a{color:var(--c1);text-decoration:underline}
.legal-body table{width:100%;border-collapse:collapse;margin:14px 0;font-size:13.5px}
.legal-body th,.legal-body td{text-align:left;padding:9px 11px;border-bottom:1px solid var(--border);color:var(--muted)}
.legal-body th{color:var(--dim);font-size:11px;letter-spacing:.08em;text-transform:uppercase}
.legal-body .updated,.legal-body .meta{font-size:13px;color:var(--dim)}
.legal-body .legal-meta{font-size:12.5px;color:var(--dim);margin:0 0 18px;letter-spacing:.02em}
.legal-body .legal-lead{font-size:16px;color:var(--txt);line-height:1.7;margin:0 0 20px}
.legal-wrap{display:grid;grid-template-columns:242px minmax(0,1fr);gap:44px;align-items:start;margin-top:26px}
.stack-more{margin:30px auto 0;max-width:80ch;text-align:center;font-size:14.5px;line-height:1.7;color:var(--muted)}
.stack-more b{color:var(--txt);font-weight:650;white-space:nowrap}
.stack-more{text-wrap:pretty}
.price-note{margin:14px 0 0;font-size:13px;line-height:1.6;color:var(--dim);max-width:74ch}
@media (max-width:760px){.stack-more{text-align:left;margin-top:24px}}
.pg-note{margin-top:14px;font-size:13px;color:var(--muted);line-height:1.62;border-left:2px solid var(--border);padding-left:13px}
.bc-superseded{margin-top:10px;font-size:12.5px;color:var(--dim);line-height:1.55;border-left:2px solid var(--amber,#f0b429);padding-left:11px}
.legal-wrap .legal-body{max-width:84ch;margin-top:0}
.legal-toc{position:sticky;top:78px;max-height:calc(100vh - 112px);overflow-y:auto;border-left:1px solid var(--border);padding-left:2px;font-size:12.5px}
.legal-toc strong{display:block;padding:0 12px 8px;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);font-weight:700}
.legal-toc ul{list-style:none;margin:0;padding:0}
.legal-toc li{margin:0}
.legal-toc a{display:block;padding:5px 12px;color:var(--muted);border-left:2px solid transparent;margin-left:-3px;text-decoration:none;line-height:1.35}
.legal-toc a:hover{color:var(--txt);border-left-color:var(--c1)}
.legal-body h2{scroll-margin-top:84px}
@media (max-width:960px){.legal-wrap{grid-template-columns:1fr;gap:18px}.legal-toc{position:static;max-height:none;border-left:0;padding-left:0}.legal-toc ul{display:flex;flex-wrap:wrap;gap:5px}.legal-toc a{border:1px solid var(--border);border-radius:999px;margin:0;padding:6px 12px;font-size:12px}.legal-wrap .legal-body{max-width:none}}

/* the chat widget — imanna's own Merchant widget, on imanna's own site */
.anna-help{position:fixed;right:20px;bottom:20px;z-index:300}
.ah-bubble{width:54px;height:54px;border-radius:50%;border:0;cursor:pointer;color:#fff;background:var(--grad2);box-shadow:0 10px 30px rgba(59,130,246,.4);display:flex;align-items:center;justify-content:center;transition:transform .15s}
.ah-bubble:hover{transform:translateY(-2px) scale(1.04)}
.ah-bubble svg{width:24px;height:24px}
.anna-help.open .ah-bubble{display:none}
.ah-panel{width:344px;max-width:calc(100vw - 32px);height:470px;max-height:calc(100vh - 40px);display:flex;flex-direction:column;background:var(--card);border:1px solid var(--border);border-radius:16px;overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,.55)}
.ah-panel[hidden]{display:none}
.ah-head{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;background:rgba(11,17,32,.72);border-bottom:1px solid var(--border)}
.ah-brand{font-family:'Sora','Inter',sans-serif;font-weight:700;font-size:14px}
.ah-im{color:var(--im)}
.ah-x{background:none;border:0;color:var(--dim);cursor:pointer;font-size:13px}
.ah-x:hover{color:var(--txt)}
.ah-log{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:10px}
.ah-msg{max-width:88%;padding:9px 12px;border-radius:12px;font-size:13.5px;line-height:1.5}
.ah-msg.ah-anna{align-self:flex-start;background:var(--card2);border:1px solid var(--border);border-bottom-left-radius:4px}
.ah-msg.ah-user{align-self:flex-end;background:var(--accent);color:#fff;border-bottom-right-radius:4px}
.ah-quick{display:flex;flex-wrap:wrap;gap:6px;padding:0 14px 10px}
.ah-quick button{background:var(--card2);border:1px solid var(--border);color:var(--muted);border-radius:999px;padding:7px 12px;font:inherit;font-size:12.5px;cursor:pointer}
.ah-quick button:hover{border-color:var(--c2);color:var(--txt)}
.ah-composer{display:flex;gap:8px;padding:12px;border-top:1px solid var(--border)}
.ah-composer input{flex:1;background:var(--card2);border:1px solid var(--border);border-radius:10px;padding:10px 12px;color:var(--txt);font:inherit;min-width:0}
.ah-composer input:focus{outline:0;border-color:var(--c2)}
.ah-send{background:var(--grad2);color:#fff;border:0;border-radius:10px;padding:0 16px;font-weight:700;cursor:pointer}
@media (max-width:560px){.anna-help{right:14px;bottom:14px}.ah-panel{height:min(560px,calc(100vh - 28px))}}

/* the blog */
.bl-filter{display:flex;gap:8px;flex-wrap:wrap;margin:24px 0 4px}
.bl-filter button{background:var(--card2);border:1px solid var(--border);color:var(--muted);border-radius:999px;padding:8px 15px;font:inherit;font-size:13px;font-weight:600;cursor:pointer;transition:border-color .16s,color .16s,background .16s}
.bl-filter button:hover{border-color:var(--c2);color:var(--txt)}
.bl-filter button[aria-pressed="true"]{background:rgba(59,130,246,.14);border-color:var(--c1);color:var(--txt)}
.bl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px;margin-top:18px}
.bl-card{display:flex;flex-direction:column;background:var(--card2);border:1px solid var(--border);border-radius:14px;overflow:hidden;transition:border-color .16s,transform .16s,box-shadow .16s}
.bl-card:hover{border-color:var(--c2);transform:translateY(-2px);box-shadow:0 18px 44px rgba(0,0,0,.4)}
.bl-card[hidden]{display:none}
.bl-thumb{display:block;aspect-ratio:4/1;overflow:hidden;border-bottom:1px solid var(--border)}
.bl-art{display:block;width:100%;height:100%}
.bl-body{display:flex;flex-direction:column;gap:6px;padding:16px 18px 18px}
.bl-card h3{font-family:'Sora','Inter',sans-serif;font-size:17px;margin:2px 0 0;font-weight:700;line-height:1.28;color:var(--txt)}
.bl-card p{margin:0;color:var(--muted);font-size:13.5px;line-height:1.55}
.bl-ver{font-family:ui-monospace,Consolas,monospace;font-size:11px;color:var(--im)}
.bl-card.bl-first{grid-column:1/-1}
.bl-card.bl-first .bl-thumb{aspect-ratio:6/1}
.bl-card.bl-first h3{font-size:21px}
.rn{border:1px solid var(--border);border-radius:12px;overflow:hidden;margin-top:16px}
.rn-row{display:grid;grid-template-columns:88px 108px minmax(0,1fr);gap:14px;align-items:baseline;padding:12px 15px;border-bottom:1px solid var(--border);font-size:13.5px;color:var(--muted)}
.rn-row:last-child{border-bottom:0}
.rn-v{font-family:ui-monospace,Consolas,monospace;font-size:12px;color:var(--c1);font-weight:700}
.rn-d{font-size:12px;color:var(--dim);font-variant-numeric:tabular-nums}
@media (max-width:640px){.rn-row{grid-template-columns:1fr;gap:3px}}

/* ══ THE API REFERENCE ══ Its own canvas: near-black, a sticky category index, monospace rows. A
   developer reference is scanned, not read, so it gets the surface that convention has trained
   people to scan — and it is visibly a different room from the marketing pages. */
article[data-route="docs"]{background:#08090B;border-top:1px solid #17181C}
article[data-route="docs"] .pg-lead{color:#8b93a3}
article[data-route="docs"] .api-cat h2{color:#E8EDF7}
.api-wrap{display:grid;grid-template-columns:206px minmax(0,1fr);gap:34px;align-items:start;margin-top:30px}
.api-idx{position:sticky;top:76px;display:flex;flex-direction:column;gap:1px;border-left:1px solid #1c1e24;padding-left:2px}
.api-idx a{display:block;padding:6px 12px;font-size:13px;color:#8b93a3;border-left:2px solid transparent;margin-left:-3px}
.api-idx a:hover{color:#E8EDF7;border-left-color:var(--c1)}
.api-cat{margin-top:0;scroll-margin-top:84px}
.api-cat + .api-cat{margin-top:30px}
.api-rows{border:1px solid #1c1e24;border-radius:10px;background:#0C0D11;overflow:hidden}
.api-row{border-bottom:1px solid #16181d}
.api-row .p{color:#E8EDF7}
.api-row .p span{color:#8b93a3}
.api-auth{background:#12141a;border-color:#22252d}
@media (max-width:900px){.api-wrap{grid-template-columns:1fr;gap:18px}.api-idx{position:static;flex-direction:row;flex-wrap:wrap;border-left:0;padding-left:0;gap:4px}.api-idx a{border:1px solid #1c1e24;border-radius:999px;margin:0;padding:6px 12px;font-size:12px}}
/* `animation:none` alone left the curtain STANDING. #intro is a full-viewport opaque layer whose only
   exit is the `introOut` animation plus the timer in site.js that removes the node; strip the animation
   and a reduced-motion visitor gets a motionless wall over the page instead of a calmer entrance, which
   is the opposite of what the query asks for. `display:none` is the honest reading of "no motion here":
   there is no curtain to move. */
@media (prefers-reduced-motion: reduce){.grad-text{animation:none}.obtn.primary:hover{transform:none}#intro,.intro-word .im,.intro-word .rest,.intro-word .i-caret{animation:none}#intro{display:none}.intro-word .im{opacity:1;transform:none}.intro-word .rest{max-width:560px;opacity:1}}

/* ── the language pair is navigation on the static site ───────────────────────────────────────── */
.lang a{font:600 11.5px 'Inter',sans-serif;letter-spacing:.06em;padding:4px 11px;border-radius:999px;border:0;background:none;color:var(--muted);cursor:pointer;text-decoration:none;line-height:1.25}
.lang a:hover{color:var(--txt)}
.lang a[aria-current="page"]{background:rgba(59,130,246,.18);color:var(--txt)}

/* ── the account menu, injected by account-nav.js ─────────────────────────────────────────────── */
.acct{position:relative;display:inline-flex}
.acct-btn{display:inline-flex;align-items:center;gap:6px;font:600 14px/1.2 'Inter',system-ui,sans-serif;color:var(--txt);
  background:transparent;border:1px solid var(--border);border-radius:999px;padding:9px 16px;cursor:pointer;
  transition:border-color .2s,background .2s;white-space:nowrap}
.acct-btn:hover,.acct.open .acct-btn{border-color:var(--c2);background:rgba(59,130,246,.08)}
.acct-menu{position:absolute;top:calc(100% + 8px);right:0;min-width:210px;z-index:60;
  background:var(--card);border:1px solid var(--border);border-radius:12px;padding:6px;
  box-shadow:0 24px 60px rgba(0,0,0,.55)}
.acct-menu[hidden]{display:none}
.acct-who{padding:8px 10px 10px;font-size:12.5px;color:var(--dim);border-bottom:1px solid var(--border);
  margin-bottom:6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.acct-item{display:block;width:100%;text-align:left;font:500 14px/1.2 'Inter',system-ui,sans-serif;color:var(--txt);
  background:none;border:0;border-radius:8px;padding:9px 10px;cursor:pointer;text-decoration:none}
.acct-item:hover{background:var(--card2);color:var(--c1)}
.acct-out{color:var(--muted)}
.acct-out:disabled{opacity:.6;cursor:default}
/* THE HELP FILTER'S hidden HAS TO BEAT .hc-col's OWN display. A class rule setting display:flex outranks
   [hidden], which is only a UA default of display:none — so card.hidden = true set the attribute and
   changed nothing on screen: the answer groups vanished while all nine collection cards stayed put,
   seven of them now linking to a section the filter had just removed. Every other hideable component in
   this sheet already carries its own [hidden] rule for exactly this reason; this one shipped without. */
.hc-col[hidden]{display:none}
/* ── the contact form's two status lines ──────────────────────────────────────────────────────── */
.cf-ok{grid-column:1/-1;margin:12px 0 0;padding:12px 14px;border-radius:10px;border:1px solid var(--border);
  background:var(--card2);color:var(--txt);font-size:14px;line-height:1.5}
.cf-ok[hidden]{display:none}
.cf-fine{margin:10px 0 0;font-size:13px;color:var(--dim)}
.cf-fine a{color:var(--c1)}
/* In the burger drawer the menu is a full-width block, not a pill floating at the right of a bar. */
.navdrawer-foot .acct{display:block}
.navdrawer-foot .acct-btn{width:100%;justify-content:center;padding:14px}
.navdrawer-foot .acct-menu{position:static;min-width:0;margin-top:8px;box-shadow:none}
