/* SerpWiz — site styles (extracted from claude/theme.html) */
/* ---- IBM Plex (latin subset, self-hosted) ---- */
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/ibm-plex-sans-400.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/ibm-plex-sans-500.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/ibm-plex-sans-600.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/ibm-plex-sans-700.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/ibm-plex-mono-400.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/ibm-plex-mono-500.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/ibm-plex-mono-600.woff2) format('woff2')}
/* ---- tokens ---- */
html{scroll-behavior:smooth}
body{margin:0;background:#0B0C0E;color:#F4F4F2;font-family:'IBM Plex Sans',system-ui,sans-serif;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
[data-theme="dark"]{--bg:#0B0C0E;--bg2:#0E1013;--bg3:#121417;--line:#1C1F24;--line2:#1F2329;--line3:#2A2E35;--line4:#3A3F47;--fg:#F4F4F2;--fg2:#C9CED6;--muted:#9BA1AB;--dim:#7D8590;--track:#1C1F24;--barfill:#3A3F47;--warn:#FFB224;--danger:#FF6B6B;--ok:#3DDC84;--glow:rgba(198,255,63,.12);--nav:rgba(11,12,14,.78);--shadow:0 30px 80px -40px rgba(0,0,0,.8)}
[data-theme="light"]{--bg:#FFFFFF;--bg2:#F7F7F5;--bg3:#F0F0ED;--line:#E8E8E4;--line2:#E8E8E4;--line3:#D4D4CF;--line4:#BDBDB7;--fg:#0C0C0C;--fg2:#3A3D44;--muted:#5F646D;--dim:#858A93;--track:#E8E8E4;--barfill:#C7C9CE;--warn:#B45309;--danger:#DC2626;--ok:#15803D;--glow:rgba(120,170,0,.12);--nav:rgba(255,255,255,.78);--shadow:0 30px 80px -40px rgba(0,0,0,.25)}
a{color:var(--fg);text-decoration:none}
button{font-family:inherit}
.mono{font-family:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,monospace}
.num{font-variant-numeric:tabular-nums;white-space:nowrap}
.wrap{max-width:1200px;margin:0 auto;padding-left:24px;padding-right:24px;box-sizing:border-box}
section[id]{scroll-margin-top:84px}
@keyframes sw-pulse{0%,100%{opacity:1}50%{opacity:.25}}
@keyframes sw-rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes sw-drop{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:none}}
@keyframes sw-blink{0%,49%{opacity:1}50%,100%{opacity:0}}
@keyframes sw-type{to{width:var(--n)}}
@keyframes sw-in{to{opacity:1}}
@keyframes sw-grow{to{transform:scaleX(1)}}
.sw-pulse{animation:sw-pulse 1.6s ease-in-out infinite}
.sw-blink{animation:sw-blink 1s steps(1) infinite}
.sw-rise{animation:sw-rise .7s cubic-bezier(.2,.8,.2,1) both}
.sw-rise-2{animation:sw-rise .7s .1s cubic-bezier(.2,.8,.2,1) both}
.sw-rise-3{animation:sw-rise .7s .2s cubic-bezier(.2,.8,.2,1) both}
.sw-rise-4{animation:sw-rise .7s .3s cubic-bezier(.2,.8,.2,1) both}
.sw-tick{animation:sw-drop .6s cubic-bezier(.2,.8,.2,1) both}
.sw-type{display:inline-block;vertical-align:bottom;overflow:hidden;white-space:nowrap;width:0;animation:sw-type 1.7s steps(42,end) .5s forwards}
.sw-st{opacity:0;animation:sw-in .3s ease 2.6s forwards}
.sw-ln{display:block;opacity:0;animation:sw-in .22s ease forwards;padding-left:6ch;text-indent:-6ch}
.sw-progress{transform-origin:left center;transform:scaleX(0)}
@supports (animation-timeline: scroll()){.sw-progress{animation:sw-grow linear both;animation-timeline:scroll(root)}}
.sw-bar{transition:width .5s cubic-bezier(.2,.8,.2,1)}
.sw-btn{display:inline-block;transition:transform .15s ease,opacity .15s ease,border-color .15s ease,box-shadow .15s ease}
.sw-btn:hover{transform:translateY(-1px);opacity:.96}
.sw-primary{background:var(--accent);color:#0B0C0E;font-weight:600;border-radius:8px;box-shadow:0 0 0 1px rgba(0,0,0,.08),0 8px 24px -12px var(--accent)}
.sw-primary:hover{box-shadow:0 0 0 1px rgba(0,0,0,.08),0 12px 32px -12px var(--accent)}
.sw-ghost{border:1px solid var(--line3);color:var(--fg);font-weight:500;border-radius:8px}
.sw-ghost:hover{border-color:var(--fg)}
.sw-link{color:var(--muted);transition:color .15s ease}
.sw-link:hover{color:var(--fg)}
.sw-row{transition:background .15s ease}
.sw-row:hover{background:var(--bg3)}
.sw-toggle{border:0;cursor:pointer;padding:8px 14px;border-radius:6px;font-size:13px;background:transparent;color:var(--muted);transition:background .15s ease,color .15s ease;display:inline-flex;align-items:center;gap:8px}
.sw-toggle[aria-pressed="true"]{background:var(--accent);color:#0B0C0E}
.sw-toggle .save{font-size:10px;font-weight:600;letter-spacing:.04em;padding:2px 6px;border-radius:4px;background:var(--accent);color:#0B0C0E}
.sw-toggle[aria-pressed="true"] .save{background:#0B0C0E;color:var(--accent)}
.sw-seg{display:inline-flex;border:1px solid var(--line3);border-radius:8px;padding:3px;gap:2px;background:var(--bg2)}
.sw-icon{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:8px;border:1px solid var(--line3);background:transparent;color:var(--muted);cursor:pointer;transition:color .15s ease,border-color .15s ease}
.sw-icon:hover{color:var(--fg);border-color:var(--fg)}
.sw-grid{background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:56px 56px;mask-image:radial-gradient(ellipse 70% 70% at 40% 0%,#000 20%,transparent 100%);-webkit-mask-image:radial-gradient(ellipse 70% 70% at 40% 0%,#000 20%,transparent 100%)}
.ptable{display:grid;grid-template-columns:1.3fr 1.5fr 1.3fr 1.1fr .8fr;gap:16px;padding:16px 20px;font-size:14px;align-items:center;border-bottom:1px solid var(--line2)}
.ptable.head{padding:14px 20px;font-size:12px;letter-spacing:.05em;color:var(--dim)}
.sw-cmp{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1.15fr) minmax(0,1.5fr) 112px minmax(0,1.6fr) 84px;gap:16px;align-items:center;padding:14px 24px;border-bottom:1px solid var(--line2);font-size:14px}
.sw-cmp>*{min-width:0}
.sw-cell{display:flex;flex-direction:column;gap:3px;white-space:nowrap;overflow:hidden}
.sw-cell>*{overflow:hidden;text-overflow:ellipsis}
.sw-sub{font-size:11px;color:var(--dim)}
.sw-track{height:10px;border-radius:3px;background:var(--track);overflow:hidden}
.sw-foot a{display:block;color:var(--muted);font-size:14px;line-height:1.5;padding:4px 0;transition:color .15s ease}
.sw-foot a:hover{color:var(--fg)}
.sans{font-family:'IBM Plex Sans',system-ui,sans-serif}
h2.sec{margin:0;font-size:clamp(30px,3.4vw,44px);font-weight:700;letter-spacing:-.03em;line-height:1.08}
.eyebrow{margin:0 0 12px;font-size:12px;letter-spacing:.08em;color:var(--accent-text)}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}
input[type=range]{width:100%;height:28px;margin:0;cursor:pointer;background:transparent;accent-color:var(--accent)}
@media (prefers-reduced-motion:reduce){.sw-rise,.sw-rise-2,.sw-rise-3,.sw-rise-4,.sw-tick{animation:none}.sw-pulse,.sw-blink{animation:none}.sw-type{width:auto;animation:none}.sw-st,.sw-ln{opacity:1;animation:none}}
/* ---- layout hooks (desktop values; overridden in the breakpoints below) ---- */
.sw-sec{padding-top:84px;padding-bottom:84px}
.sw-hero{padding-top:88px;padding-bottom:72px}
.sw-stream{margin-top:44px}
.sw-cta{padding-top:112px;padding-bottom:112px}
.sw-cta-h{font-size:clamp(34px,4.8vw,64px)}
.sw-nav{gap:24px}
.sw-nav-cta{font-size:14px;padding:9px 14px;border-radius:7px;white-space:nowrap}
.sw-nav-signin{white-space:nowrap}
.sw-demo{padding:16px 18px;font-size:11.5px}
.sw-demo-head,.sw-demo-foot{font-size:11px}
#ruler{position:relative;margin-top:108px;height:250px}
.sw-ax{transform:translateX(-50%)}
.sw-rulenote{margin:8px 0 0}
.sw-legend{display:none;list-style:none;margin:20px 0 0;padding:0;flex-wrap:wrap;gap:8px 16px;font-size:12px;color:var(--fg2)}
.sw-legend li{display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
.sw-legend li::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--barfill);flex-shrink:0}
.sw-legend .num{color:var(--muted)}
.sw-legend li.is-sw{color:var(--fg);font-weight:600}
.sw-legend li.is-sw::before{background:var(--accent);box-shadow:0 0 8px var(--accent)}
.sw-legend li.is-sw .num{color:var(--accent-text);font-weight:500}
#plans{min-width:760px}
#calc{min-width:960px}
.sw-foot{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr 1fr;gap:40px 32px;padding-top:64px;padding-bottom:40px}
.sw-giant{font-size:clamp(110px,17.5vw,250px)}

/* ---- tablet: hero stacks, both tables become stacked cards (the 760/960px grids no longer fit) ---- */
@media (max-width:980px){
  .sw-hero{grid-template-columns:1fr !important}
  .sw-stream{max-width:none !important}
  /* plans table → stacked rows: name/price, queries/rate, link */
  #plans{min-width:0}
  .ptable.head{display:none}
  .ptable{grid-template-columns:minmax(0,1fr) auto auto;grid-template-areas:"t p l" "q e l";gap:4px 28px;padding:16px 20px;align-items:baseline}
  .ptable>:nth-child(1){grid-area:t;flex-wrap:wrap;row-gap:6px}
  .ptable>:nth-child(2){grid-area:q;font-size:13px;color:var(--muted)}
  .ptable>:nth-child(3){grid-area:p;text-align:right;font-size:15px}
  .ptable>:nth-child(4){grid-area:e;text-align:right;font-size:13px}
  .ptable>.num:nth-child(4)::after{content:" / 1K"}
  .ptable>:nth-child(5){grid-area:l;text-align:right;font-size:13px;align-self:center}
  /* calculator table → one card per provider */
  #calc{min-width:0}
  .sw-cmp.head{display:none}
  .sw-cmp{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"n b" "n v" "r r" "s p";gap:2px 24px;padding:16px 20px}
  .sw-cmp>:nth-child(1){grid-area:n;white-space:normal;overflow:visible}
  .sw-cmp>:nth-child(1)>*{overflow:visible;white-space:normal}
  .sw-cmp>:nth-child(2){grid-area:s}
  .sw-cmp>:nth-child(3){grid-area:p}
  .sw-cmp>:nth-child(2),.sw-cmp>:nth-child(3){display:block;white-space:normal;overflow:visible;line-height:1.5}
  .sw-cmp>:nth-child(2)>*,.sw-cmp>:nth-child(3)>*{display:inline;overflow:visible;white-space:normal;font-size:12px}
  .sw-cmp>:nth-child(2)>.sw-sub::before,.sw-cmp>:nth-child(3)>.sw-sub::before{content:" · "}
  .sw-cmp>:nth-child(2)>.num::after{content:"/1K to start";color:var(--dim);font-weight:400}
  .sw-cmp>:nth-child(4){grid-area:b;text-align:right;align-self:end}
  .sw-cmp>:nth-child(4)::after{content:"/mo";color:var(--dim);font-size:12px;font-weight:400}
  .sw-cmp>:nth-child(5){grid-area:r;margin:10px 0 8px}
  .sw-cmp>:nth-child(6){grid-area:v;align-self:start}
}

/* ---- phone ---- */
@media (max-width:760px){
  .wrap{padding-left:16px;padding-right:16px}
  .sw-sec{padding-top:64px;padding-bottom:64px}
  .sw-hero{padding-top:56px;padding-bottom:56px;gap:40px}
  .sw-stream{margin-top:0}
  .sw-cta{padding-top:88px;padding-bottom:88px}
  .sw-cta-h{font-size:clamp(28px,9vw,34px)}
  .sw-br{display:none}
  h2.sec{font-size:clamp(28px,8vw,32px);text-wrap:balance}
  /* nav: links collapse; CTA + sign-in stay on one line */
  .sw-nav{gap:12px}
  .sw-nav-links{display:none !important}
  .sw-nav-cta{padding:8px 12px}
  /* demo card: everything wraps or shrinks, nothing scrolls sideways */
  .sw-demo-head,.sw-demo-foot{flex-wrap:wrap}
  /* ruler: names move into a legend below the axis */
  #ruler{margin-top:84px;height:200px}
  .sw-ax-first{transform:none}
  .sw-ax-last{transform:translateX(-100%)}
  .sw-rulenote{margin:20px 0 0}
  .sw-lbl{display:none !important}
  .sw-legend{display:flex}
  /* tables: full stack on phones */
  .ptable{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"t p" "q e" "l l";gap:4px 16px;padding:14px 16px}
  .ptable>:nth-child(5){margin-top:6px;align-self:auto}
  .sw-cmp{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"n b" "n v" "r r" "s s" "p p";gap:2px 16px;padding:14px 16px}
  /* content grids collapse */
  .sw-three{grid-template-columns:1fr !important}
  .sw-two{grid-template-columns:1fr !important}
  /* footer: brand on its own row, four link columns in a 2×2 */
  .sw-foot{grid-template-columns:1fr 1fr;gap:32px 24px;padding-top:48px;padding-bottom:32px}
  .sw-foot>:first-child{grid-column:1/-1}
  .sw-foot a{font-size:13px}
  .sw-giant{font-size:24vw}
}

/* ---- small phones ---- */
@media (max-width:430px){
  .sw-demo{font-size:min(11.5px,2.8vw);padding:14px}
  .sw-demo-head,.sw-demo-foot{font-size:10px}
}
@media (max-width:360px){
  .sw-nav-theme{display:none}
}
:root{--accent:#C6FF3F}
[data-theme="dark"]{--accent-text:#C6FF3F;--tile-bg:var(--accent);--tile-fg:#0B0C0E}
[data-theme="dark"]{color-scheme:dark}
[data-theme="light"]{color-scheme:light}
[data-theme="light"]{--accent-text:hsl(78 100% 28%);--tile-bg:#0C0C0C;--tile-fg:var(--accent)}
html[data-theme="light"] body{background:var(--bg)}
.logo-mark rect{fill:var(--tile-bg)}.logo-mark path{stroke:var(--tile-fg)}
[data-theme="light"] .ico-sun,[data-theme="dark"] .ico-moon{display:none}

/* ==== app components (beyond the landing theme) ==== */
body{background:var(--bg)}
html:not([data-term="monthly"]) .t-m{display:none}
html[data-term="monthly"] .t-a{display:none}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.sw-skip{position:absolute;left:-9999px;top:8px;z-index:50;background:var(--accent);color:#0B0C0E;padding:8px 12px;border-radius:6px;font-weight:600}
.sw-skip:focus{left:16px}
.sw-linkbtn{background:none;border:0;padding:0;cursor:pointer;font:inherit}
.sw-flash{margin:16px 0 0;padding:12px 16px;border-radius:8px;border:1px solid var(--line3);background:var(--bg2);font-size:14px}
.sw-flash-ok{border-color:color-mix(in srgb,var(--ok) 50%,var(--line3))}
.sw-flash-error{border-color:color-mix(in srgb,var(--warn) 60%,var(--line3))}
.sw-toasts{position:fixed;right:16px;bottom:16px;z-index:100;display:grid;gap:8px;max-width:min(420px,calc(100vw - 32px));cursor:pointer;transition:opacity .4s ease}
.sw-toasts .sw-flash{margin:0;box-shadow:0 8px 28px rgba(0,0,0,.25)}
.sw-toasts-out{opacity:0}
.sw-muted{color:var(--muted)}
.sw-dim{color:var(--dim)}
.sw-accent{color:var(--accent-text)}
.sw-warn{color:var(--warn)}

/* prose (docs, legal, vs pages) */
.prose{font-size:15.5px;line-height:1.7;color:var(--fg2);max-width:760px;min-width:0}
.prose h1{font-size:clamp(30px,3.6vw,44px);line-height:1.1;letter-spacing:-.03em;color:var(--fg);margin:0 0 16px}
.prose h2{font-size:24px;letter-spacing:-.02em;color:var(--fg);margin:44px 0 12px;scroll-margin-top:84px}
.prose h3{font-size:17px;color:var(--fg);margin:28px 0 8px;scroll-margin-top:84px}
.prose p,.prose ul,.prose ol{margin:0 0 14px}
.prose ul,.prose ol{padding-left:22px}
.prose li{margin:4px 0}
.prose a{color:var(--fg);text-decoration:underline;text-decoration-color:var(--line4);text-underline-offset:3px}
.prose a:hover{text-decoration-color:var(--accent)}
.prose strong{color:var(--fg)}
.prose code{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:.88em;background:var(--bg3);border:1px solid var(--line2);border-radius:5px;padding:1px 5px;color:var(--fg)}
.prose .lead{font-size:18px;color:var(--muted);line-height:1.6}
.code{position:relative;margin:0 0 18px}
.code pre,.prose pre{margin:0 0 18px;padding:16px 18px;background:var(--bg2);border:1px solid var(--line2);border-radius:10px;overflow-x:auto;font:13px/1.65 'IBM Plex Mono',ui-monospace,monospace;color:var(--fg)}
.prose pre code{background:none;border:0;padding:0;font-size:inherit}
.sw-copy{position:absolute;right:8px;top:8px;z-index:1;font-size:11px;padding:4px 8px;border-radius:5px;border:1px solid var(--line3);background:var(--bg);color:var(--muted);cursor:pointer}
.sw-copy:hover{color:var(--fg);border-color:var(--fg)}
.tbl{width:100%;border-collapse:collapse;font-size:14px;margin:0 0 18px}
.tbl-wrap{overflow-x:auto;margin:0 0 18px;border:1px solid var(--line2);border-radius:10px}
.tbl-wrap .tbl{margin:0}
.tbl th,.tbl td{text-align:left;padding:10px 14px;border-bottom:1px solid var(--line2);vertical-align:top}
.tbl th{font:500 11.5px 'IBM Plex Mono',monospace;letter-spacing:.05em;color:var(--dim);text-transform:uppercase;background:var(--bg2)}
.tbl tr:last-child td{border-bottom:0}
.tbl td.num,.tbl th.num{text-align:right}
.callout{border:1px solid var(--line3);border-left:3px solid var(--accent);background:var(--bg2);border-radius:8px;padding:12px 16px;margin:0 0 18px;font-size:14.5px}
.badge{display:inline-block;font:600 10px 'IBM Plex Mono',monospace;letter-spacing:.06em;padding:3px 7px;border-radius:4px;border:1px solid var(--line3);color:var(--muted);vertical-align:middle}
.badge-accent{background:var(--accent);border-color:var(--accent);color:#0B0C0E}
.badge-get{background:color-mix(in srgb,var(--ok) 18%,transparent);border-color:color-mix(in srgb,var(--ok) 40%,transparent);color:var(--ok)}

/* docs layout */
.docs{display:grid;grid-template-columns:220px minmax(0,1fr);gap:48px;padding-top:40px;padding-bottom:80px}
.docs-nav{position:sticky;top:84px;align-self:start;font-size:14px;max-height:calc(100vh - 100px);overflow:auto}
.docs-nav p{margin:18px 0 6px;font:500 11px 'IBM Plex Mono',monospace;letter-spacing:.08em;color:var(--dim)}
.docs-nav p:first-child{margin-top:0}
.docs-nav a{display:block;padding:5px 0 5px 12px;border-left:1px solid var(--line2);color:var(--muted)}
.docs-nav a:hover{color:var(--fg)}
.docs-nav a[aria-current="page"]{color:var(--fg);border-left-color:var(--accent);font-weight:500}
.crumbs{font:12px 'IBM Plex Mono',monospace;color:var(--dim);margin:0 0 14px}
.crumbs a{color:var(--muted)}
.crumbs ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.crumbs li+li::before{content:"/";margin-right:6px;color:var(--line4)}
.doc-foot{display:flex;justify-content:space-between;gap:16px;margin-top:48px;padding-top:20px;border-top:1px solid var(--line2);font-size:14px}
@media (max-width:860px){.docs{grid-template-columns:1fr;gap:24px;padding-top:24px}.docs-nav{position:static;max-height:none;border:1px solid var(--line2);border-radius:10px;padding:14px 16px;background:var(--bg2)}}

/* forms */
.form{display:grid;gap:16px}
.field label{display:block;font-size:13px;font-weight:500;margin:0 0 6px;color:var(--fg2)}
.field .hint{font-size:12px;color:var(--dim);margin-top:6px}
.input,select.input,textarea.input{width:100%;box-sizing:border-box;font:inherit;font-size:15px;color:var(--fg);background:var(--bg);border:1px solid var(--line3);border-radius:8px;padding:11px 12px;transition:border-color .15s ease}
.input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--glow)}
.input[aria-invalid="true"]{border-color:var(--danger);background:color-mix(in srgb,var(--danger) 7%,var(--bg))}
.input[aria-invalid="true"]:focus{border-color:var(--danger);box-shadow:0 0 0 3px color-mix(in srgb,var(--danger) 25%,transparent)}
input[type="checkbox"][aria-invalid="true"]{outline:2px solid var(--danger);outline-offset:2px}
.field-err{display:flex;gap:7px;align-items:flex-start;margin-top:6px;font-size:13.5px;font-weight:500;line-height:1.45;color:var(--danger)}
.field-err::before{content:"!";flex:none;display:inline-grid;place-items:center;width:16px;height:16px;margin-top:1px;border-radius:50%;background:var(--danger);color:var(--bg);font-size:11px;font-weight:700}
.form-errors{margin:0;padding:11px 14px;border:1px solid var(--danger);border-left-width:3px;border-radius:8px;background:color-mix(in srgb,var(--danger) 8%,var(--bg));color:var(--fg);font-size:14px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:inherit;font-size:14px;cursor:pointer;padding:11px 18px;border:0;text-align:center}
.btn-sm{font-size:13px;padding:7px 12px}
.btn-block{width:100%}
.btn.sw-ghost{background:transparent;border:1px solid var(--line3);color:var(--fg)}
.btn.sw-ghost:hover{border-color:var(--fg)}
.btn-danger{border:1px solid color-mix(in srgb,var(--warn) 55%,var(--line3));color:var(--warn);background:transparent;border-radius:8px;font-weight:500}
.auth{max-width:420px;margin:0 auto;padding:64px 0 96px}
.card{border:1px solid var(--line2);border-radius:12px;background:var(--bg2);padding:24px}
.card h2{margin:0 0 4px;font-size:17px}
.card-sub{margin:0 0 16px;font-size:13px;color:var(--muted)}

/* dashboard */
.dash{padding-top:32px;padding-bottom:80px}
.dash-tabs{display:flex;gap:4px;box-shadow:inset 0 -1px 0 var(--line2);margin:0 0 28px;overflow-x:auto;overflow-y:hidden;scrollbar-width:none}
.dash-tabs::-webkit-scrollbar{display:none}
.dash-tabs a{padding:10px 14px;font-size:14px;color:var(--muted);border-bottom:2px solid transparent;white-space:nowrap}
.dash-tabs a[aria-current="page"]{color:var(--fg);border-bottom-color:var(--accent)}
.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.grid-4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.stat{border:1px solid var(--line2);border-radius:12px;background:var(--bg2);padding:18px 20px;min-width:0}
.stat-l{font:500 11px 'IBM Plex Mono',monospace;letter-spacing:.06em;color:var(--dim);margin:0 0 8px;text-transform:uppercase}
.stat-v{font-size:28px;font-weight:700;letter-spacing:-.03em;line-height:1.1;font-variant-numeric:tabular-nums}
.stat-s{font-size:12.5px;color:var(--muted);margin-top:6px}
.meter{height:6px;border-radius:3px;background:var(--track);overflow:hidden;margin-top:12px}
.meter>span{display:block;height:100%;background:var(--accent)}
.chart{width:100%;height:auto;display:block;overflow:visible}
.chart .bar{fill:var(--barfill)}
.chart .bar-ok{fill:var(--accent)}
.chart .bar-429{fill:var(--warn)}
.chart text{fill:var(--dim);font:10px 'IBM Plex Mono',monospace}
.chart .grid{stroke:var(--line2)}
.chart path{fill:none;stroke-width:1.5;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke}
.chart path.main{stroke-width:1.75}
.chart path.line-fail,.chart path.line-429{stroke-width:1.25}
.chart path.fill{stroke:none;opacity:.22}.chart path.fill.line-ok{opacity:1}.chart path.fill.line-fail{fill:var(--muted)}.chart path.fill.line-429{fill:var(--warn)}
.chart .line-ok{stroke:var(--accent-text)}.chart .line-fail{stroke:var(--muted)}.chart .line-429{stroke:var(--warn)}
.chart circle.line-ok{fill:var(--accent-text)}.chart circle.line-fail{fill:var(--muted)}.chart circle.line-429{fill:var(--warn)}
.chart circle{stroke:var(--bg);stroke-width:1.5}
.chart .grid{stroke-dasharray:2 4}.chart .grid.base{stroke:var(--line3);stroke-dasharray:none}
.chart .grad-top{stop-color:var(--accent-text);stop-opacity:.32}.chart .grad-bottom{stop-color:var(--accent-text);stop-opacity:0}
[data-theme="dark"] .chart path.main{filter:drop-shadow(0 0 6px rgba(198,255,63,.45))}
.chart-wrap{position:relative}
.chart-tip{position:absolute;top:0;z-index:2;pointer-events:none;min-width:170px;padding:10px 12px;border:1px solid var(--line3);border-radius:8px;background:var(--bg2);box-shadow:0 12px 30px -12px rgba(0,0,0,.45);font-size:12.5px;line-height:1.5;transform:translateX(-50%)}
.chart-tip b{display:block;margin-bottom:4px;font-weight:600;color:var(--fg)}
.chart-tip div{display:flex;justify-content:space-between;gap:16px;color:var(--muted)}
.chart-tip div span:last-child{font-family:'IBM Plex Mono',monospace;color:var(--fg)}
.chart-tip i{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:7px}
.chart-tip .t-ok{background:var(--accent-text)}.chart-tip .t-fail{background:var(--muted)}.chart-tip .t-429{background:var(--warn)}
.chart .pt rect{fill:transparent}.chart .pt circle,.chart .pt .guide{opacity:0}
.chart .pt:hover circle{opacity:1}.chart .pt:hover .guide{opacity:1;stroke:var(--line4);stroke-dasharray:3 3}
.legend i.line-ok{background:var(--accent-text)}.legend i.line-fail{background:var(--muted)}.legend i.line-429{background:var(--warn)}
.legend i[class^="line-"]{height:3px;width:14px;border-radius:2px;vertical-align:3px}
.legend{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:12px;color:var(--muted);margin-top:10px}
.legend i{display:inline-block;width:8px;height:8px;border-radius:2px;margin-right:6px;vertical-align:0}
.key{font-family:'IBM Plex Mono',monospace;font-size:13px;word-break:break-all}
.plan-pick{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.plan-pick label{display:block;border:1px solid var(--line3);border-radius:10px;padding:12px 14px;cursor:pointer;font-size:14px}
.plan-pick input{position:absolute;opacity:0}
.plan-pick input:checked+span{color:var(--fg)}
.plan-pick label:has(input:checked){border-color:var(--accent);box-shadow:0 0 0 3px var(--glow)}
.plan-pick label:has(input:disabled){opacity:.45;cursor:not-allowed}
.summary{margin:0;display:grid;grid-template-columns:auto auto;gap:8px 24px;font-size:14px}
.summary dt{color:var(--muted)}
.summary dd{margin:0;text-align:right;font-variant-numeric:tabular-nums}
@media (max-width:980px){.grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:760px){.grid-2,.grid-4{grid-template-columns:1fr}.plan-pick{grid-template-columns:1fr 1fr}.dash-tabs{margin-left:-16px;margin-right:-16px;padding:0 8px}}
.prose .anchor{margin-left:8px;color:var(--line4);text-decoration:none;opacity:0;transition:opacity .15s ease}
.prose h2:hover .anchor,.prose h3:hover .anchor,.prose .anchor:focus{opacity:1}
.tbl th[scope="row"]{font:500 13px 'IBM Plex Sans',sans-serif;letter-spacing:0;text-transform:none;color:var(--fg2);background:transparent;white-space:nowrap}
.sw-toggle:has(input:checked){background:var(--accent);color:#0B0C0E}
.sw-toggle:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:2px}
a.sw-toggle{text-decoration:none}
details.card summary::-webkit-details-marker{color:var(--dim)}
.btn[disabled]{opacity:.5;cursor:not-allowed}

/* ---- shared ---- */
.nowrap{white-space:nowrap}
.badge-warn{background:color-mix(in srgb,var(--warn) 16%,transparent);border-color:color-mix(in srgb,var(--warn) 40%,transparent);color:var(--warn)}
.badge-err{background:color-mix(in srgb,#E5484D 14%,transparent);border-color:color-mix(in srgb,#E5484D 40%,transparent);color:#E5484D}

/* ---- dashboard: request log ---- */
.log-filters{display:grid;grid-template-columns:160px 190px 170px minmax(0,1fr) auto;gap:12px;align-items:end;margin:0 0 16px}
.log-filters .field label{margin-bottom:4px}
.log-filters .input{padding:9px 10px;font-size:14px}
.log-filters .btn{padding:10px 18px}
.log-bar{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 20px;font-size:13px;margin:0 0 12px}
.log-tbl{font-size:13.5px}
.log-tbl td{padding:9px 12px}
.log-req{min-width:220px;max-width:420px;overflow-wrap:anywhere}
.log-main{color:var(--fg);font-weight:500}
.log-rest{font-size:11.5px;color:var(--dim);margin-top:2px}
.log-pager{display:flex;justify-content:space-between;align-items:center;margin-top:16px}
.adm-filter-box{margin-top:12px}
.adm-filter-box>summary{cursor:pointer;font-size:14px;color:var(--fg2);width:max-content}
.adm-filters{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px;margin-top:12px}
.adm-filters .field label{margin-bottom:4px;font-size:12.5px}
.adm-filters .input{padding:8px 10px;font-size:14px}
.th-sort{color:inherit;text-decoration:none;white-space:nowrap}
.th-sort:hover{color:var(--fg);text-decoration:underline}
.traffic-range{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;margin:0 0 20px;font-size:14px}
.traffic-range .sw-seg{margin-right:8px}
.traffic-range .input{width:auto;padding:6px 8px;font-size:13.5px}
@media (max-width:900px){.log-filters{grid-template-columns:1fr 1fr}.log-q{grid-column:1/-1}.log-filters .btn{grid-column:1/-1}}

/* ---- playground ---- */
.pg{padding-top:40px;padding-bottom:80px}
.pg-head{max-width:720px;margin:0 0 28px}
.pg-head h1{margin:6px 0 10px;font-size:clamp(30px,4vw,40px);letter-spacing:-.03em;line-height:1.1}
.pg-head p{margin:0;font-size:15.5px;line-height:1.6}
.pg-grid{display:grid;grid-template-columns:minmax(0,420px) minmax(0,1fr);gap:20px;align-items:start}
.pg-form{position:sticky;top:84px}
.pg-switch{justify-self:start;background:var(--bg)}
.pg-fs{border:0;margin:0;padding:0;min-width:0}
.pg-fs[hidden]{display:none}
.pg-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(90px,1fr));gap:12px;align-items:end}
.pg-row .field label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pg-req{font-size:11px;color:var(--dim);font-weight:400;margin-left:4px}
.pg-p{font-size:11px;color:var(--dim);font-weight:400;margin-left:4px}
.pg-adv summary{cursor:pointer;font-size:13.5px;color:var(--muted);padding:2px 0}
.pg-adv[open] summary{margin-bottom:14px}
.pg-adv .field+.field,.pg-adv .pg-row+.pg-row,.pg-adv .field+.pg-row,.pg-adv .pg-row+.field{margin-top:12px}
.pg-checks{border:0;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px 18px;font-size:14px}
.pg-checks legend{font-size:13px;font-weight:500;color:var(--fg2);padding:0;margin:0 0 8px}
.pg-checks label{display:inline-flex;align-items:center;gap:7px;cursor:pointer}
.pg-checks input{accent-color:var(--accent);width:16px;height:16px}
.pg-actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px}
.pg-credits{font-size:13.5px}
.pg-out{display:grid;gap:20px;min-width:0}
.pg-code,.pg-resp{padding:16px 18px;min-width:0}
.pg-pre{position:relative}
.pg-pre pre{margin:0;max-height:560px;overflow:auto;white-space:pre}
.pg-code pre{white-space:pre-wrap;overflow-wrap:anywhere}
.pg-note{margin:10px 0 0;font-size:12.5px;color:var(--muted)}
.pg-tabs{display:flex;gap:2px;margin:0 0 12px;border-bottom:1px solid var(--line2);overflow-x:auto;scrollbar-width:none}
.pg-tabs button{background:transparent;border:0;border-bottom:2px solid transparent;padding:6px 12px;font:inherit;font-size:12.5px;color:var(--muted);cursor:pointer;white-space:nowrap}
.pg-tabs button[aria-selected="true"]{color:var(--fg);border-bottom-color:var(--accent)}
.pg-status{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;font-size:13.5px;margin:0 0 12px;min-height:22px}
.pg-err{color:#E5484D;margin:0 0 8px}
.pg-h{font-size:13px;font-weight:600;margin:18px 0 8px;letter-spacing:0}
.pg-h:first-child{margin-top:0}
.pg-list{list-style:none;margin:0;padding:0}
.pg-list li{display:grid;grid-template-columns:28px minmax(0,1fr);gap:10px;padding:10px 0;border-bottom:1px solid var(--line2)}
.pg-list li:last-child{border-bottom:0}
.pg-pos{font-size:12px;color:var(--dim);padding-top:2px}
.pg-title{font-weight:500;line-height:1.35}
.pg-title a{color:var(--fg);text-decoration:underline;text-decoration-color:var(--line4);text-underline-offset:3px}
.pg-title a:hover{text-decoration-color:var(--accent)}
.pg-url{font-size:12px;color:var(--dim);margin-top:3px;overflow-wrap:anywhere}
.pg-url a{color:var(--dim)}
.pg-desc{font-size:13.5px;color:var(--fg2);margin-top:4px;line-height:1.5}
.pg-kp{display:flex;gap:14px;align-items:flex-start;border:1px solid var(--line3);border-radius:8px;padding:12px 14px;margin:0 0 6px;font-size:14px}
.pg-kp>div{min-width:0;flex:1}
.pg-kp-img{width:72px;height:72px;object-fit:cover;border-radius:6px;flex-shrink:0;background:var(--bg3)}
.pg-kp-name{font-size:15.5px}
.pg-kp-label{font-size:13px;margin-top:2px}
.pg-kp-info{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 14px;margin:10px 0 0;font-size:13px}
.pg-kp-info dt{color:var(--muted)}
.pg-kp-info dd{margin:0;color:var(--fg2)}
.pg-chips button.badge{cursor:pointer;background:transparent}
.pg-chips button.badge:hover{border-color:var(--accent);color:var(--fg)}
.pg-spell{margin:0 0 12px;font-size:14px}
.pg-pager{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:16px;padding-top:14px;border-top:1px solid var(--line2);font-size:12px}
.pg-kp p{margin:6px 0 0;color:var(--fg2);font-size:13.5px;line-height:1.5}
.pg-chips{display:flex;flex-wrap:wrap;gap:6px}
.pg-chips .badge{font:400 12px 'IBM Plex Sans',sans-serif;letter-spacing:0;color:var(--fg2)}
@media (max-width:900px){.pg-grid{grid-template-columns:1fr}.pg-form{position:static}}

/* ---- status ---- */
.st{padding-top:40px;padding-bottom:80px;max-width:920px}
.st-head h1{margin:6px 0 20px;font-size:clamp(30px,4vw,40px);letter-spacing:-.03em}
.st-banner{display:flex;flex-wrap:wrap;align-items:center;gap:10px 12px;padding:16px 20px;border-radius:12px;border:1px solid var(--line3);background:var(--bg2);font-size:16px;margin:0 0 20px}
.st-banner .st-when{margin-left:auto;font-size:12px;color:var(--dim)}
.st-dot{width:10px;height:10px;border-radius:50%;background:var(--dim)}
.st-banner.st-ok{border-color:color-mix(in srgb,var(--ok) 45%,var(--line3))}.st-banner.st-ok .st-dot{background:var(--ok)}
.st-banner.st-degraded,.st-banner.st-maintenance{border-color:color-mix(in srgb,var(--warn) 50%,var(--line3))}.st-banner.st-degraded .st-dot,.st-banner.st-maintenance .st-dot{background:var(--warn)}
.st-banner.st-down{border-color:color-mix(in srgb,#E5484D 55%,var(--line3))}.st-banner.st-down .st-dot{background:#E5484D}
.st-comps{padding:8px 24px 16px}
.st-comps-top{display:flex;justify-content:space-between;align-items:baseline;padding:14px 0 4px}
.st-comp{padding:16px 0;border-top:1px solid var(--line2)}
.st-comps-top+.st-comp{border-top:0}
.st-comp-row{display:flex;justify-content:space-between;gap:12px;font-size:15px;margin:0 0 10px}
.st-name{font-weight:500}
.st-state{font-size:13.5px}
.st-state.st-ok{color:var(--ok)}.st-state.st-degraded,.st-state.st-maintenance{color:var(--warn)}.st-state.st-down{color:#E5484D}.st-state.st-unknown{color:var(--dim)}
.st-bars{display:flex;gap:2px;height:30px}
.st-bar{flex:1;border-radius:2px;background:var(--line3);min-width:2px}
.st-bar.st-ok{background:var(--ok)}.st-bar.st-degraded{background:var(--warn)}.st-bar.st-down{background:#E5484D}
.st-axis{display:flex;justify-content:space-between;font-size:11px;color:var(--dim);margin-top:6px}
.st-incident h2,.st-incident h3{font-size:16px;margin:0 0 8px}
.st-incident p{font-size:14px;line-height:1.6;margin:0 0 8px}
.st-open{border-left:3px solid var(--warn);margin:0 0 20px}
.st-t{font-size:11.5px;white-space:nowrap}
.st-past{margin-top:36px}
.st-past>h2{font-size:20px;margin:0 0 12px}
.st-past .st-incident{padding:16px 0;border-top:1px solid var(--line2)}
.st-foot{font-size:13px;margin-top:36px;line-height:1.6}
@media (max-width:640px){.st-bars{gap:1px;height:26px}.st-bar:nth-child(-n+30){display:none}.st-axis span:first-child{visibility:hidden}}

/* ---- changelog ---- */
.cl{padding-top:40px;padding-bottom:80px;max-width:920px}
.cl-entry{display:grid;grid-template-columns:140px minmax(0,1fr);gap:24px;padding:28px 0;border-top:1px solid var(--line2)}
.cl-date{font-size:12.5px;color:var(--dim);padding-top:6px}
.cl-entry h2{margin-top:0;font-size:20px}
.cl-entry h2 a{text-decoration:none}
.blog-post{padding-top:40px;padding-bottom:80px}
.blog-post .prose{margin:0 auto}
.blog-meta{font-size:12.5px;color:var(--dim);margin:0 0 28px}
.blog-cta{margin:48px 0 8px}
.blog-cta h2{margin:0 0 8px;font-size:20px}
.prose .blog-cta .sw-btn{text-decoration:none}
.prose .blog-cta .sw-primary{color:#0B0C0E}
.blog-related{padding-left:20px}
.inl{font:inherit;color:inherit;background:none;border:0;padding:2px 4px;margin:-2px -4px;border-radius:4px;cursor:pointer;border-bottom:1px dashed var(--line4)}
.inl:hover,.inl:focus-visible{background:var(--bg3);border-bottom-color:var(--accent)}
.inl-ok{background:color-mix(in srgb,var(--ok) 22%,transparent)}
.inl-err{background:color-mix(in srgb,var(--danger) 22%,transparent)}
.inl-input{width:110px;padding:4px 8px;font-size:13px;height:auto}
.pay-menu{display:inline-block;margin-left:8px;font-size:12.5px;vertical-align:middle}
.pay-menu summary{cursor:pointer;color:var(--muted);text-decoration:underline}
.pay-menu[open]>div{display:grid;gap:8px;margin-top:8px;padding:10px;border:1px solid var(--line3);border-radius:8px;background:var(--bg2);min-width:280px}
.pay-form{display:flex;gap:6px;margin:0}
.pay-form .input{padding:5px 8px;font-size:12.5px;min-width:0;flex:1}
.brand-item{margin:0;display:grid;gap:16px;align-content:start}
.brand-item h3{margin:0 0 4px;font-size:16px}
.brand-item p{margin:0;font-size:14px;color:var(--muted);line-height:1.55}
.brand-preview{position:relative;border-radius:8px;border:1px solid var(--line2);aspect-ratio:3/1;overflow:hidden}
.brand-preview img{position:absolute;inset:16px;width:calc(100% - 32px);height:calc(100% - 32px);object-fit:contain;display:block}
.brand-img{background:var(--bg3)}
.brand-dark{background:#0B0C0E}
.brand-light{background:#FFFFFF}
.brand-checker{background:repeating-conic-gradient(var(--bg3) 0 25%,var(--bg2) 0 50%) 0 0/16px 16px}
.brand-dl{display:flex;gap:16px;margin-top:10px!important;font-size:13px}
.brand-dl a{text-decoration:underline;color:var(--fg)}
.brand-colors{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:760px){.brand-grid,.brand-colors{grid-template-columns:1fr}}
@media (max-width:640px){.cl-entry{grid-template-columns:1fr;gap:6px}}

/* ---- legal ---- */
.legal{padding-top:40px;padding-bottom:80px;max-width:780px}
.legal h1{margin:6px 0 24px;font-size:clamp(30px,4vw,40px);letter-spacing:-.03em}

/* ---- light mode: soft page, dark menu bar and footer ---- */
[data-theme="light"]{--bg:#F5F5F3;--bg2:#FFFFFF;--bg3:#ECECE9;--line:#E4E4E0;--line2:#E4E4E0;--line3:#D0D0CA}
[data-theme="light"] #top>header,[data-theme="light"] #top>footer{
  --bg:#0B0C0E;--bg2:#0E1013;--bg3:#121417;--line:#1C1F24;--line2:#1F2329;--line3:#2A2E35;--line4:#3A3F47;--fg:#F4F4F2;--fg2:#C9CED6;--muted:#9BA1AB;--dim:#7D8590;
  --nav:rgba(11,12,14,.92);--accent-text:#C6FF3F;--tile-bg:var(--accent);--tile-fg:#0B0C0E;color-scheme:dark;color:var(--fg)}
/* about */
.ab-hero{padding-top:96px;padding-bottom:72px;max-width:920px;margin-left:auto;margin-right:auto}
.ab-hero h1{margin:0;font-size:clamp(36px,5.5vw,64px);font-weight:700;letter-spacing:-.045em;line-height:1.02}
.ab-lead{margin:20px 0 0;font-size:clamp(17px,1.8vw,20px);line-height:1.55;color:var(--fg2);max-width:760px}
.ab-sec{border-top:1px solid var(--line)}
.ab-sec>.wrap{padding-top:64px;padding-bottom:64px}
.ab-sec h2{margin:0;font-size:clamp(24px,3vw,32px);letter-spacing:-.03em;line-height:1.15}
.ab-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:24px 64px;align-items:start}
.ab-story p{margin:0 0 16px;font-size:16.5px;line-height:1.7;color:var(--fg2)}
.ab-story p:last-child{margin:0}
.ab-grid{display:grid;gap:16px;margin-top:28px}
.ab-grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.ab-grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.ab-card{border:1px solid var(--line2);border-radius:12px;background:var(--bg2);padding:22px 24px}
.ab-card h3{margin:0 0 8px;font-size:16.5px;letter-spacing:-.01em}
.ab-card p{margin:0;font-size:14.5px;line-height:1.6;color:var(--muted)}
.ab-who{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.ab-who li{display:flex;gap:12px;font-size:15.5px;line-height:1.5;color:var(--fg2)}
.ab-who li span{color:var(--accent-text);font-weight:700}
.ab-facts{margin:0;display:grid;grid-template-columns:160px minmax(0,1fr);border-top:1px solid var(--line2)}
.ab-facts dt,.ab-facts dd{margin:0;padding:12px 0;border-bottom:1px solid var(--line2);font-size:14.5px;line-height:1.5}
.ab-facts dt{color:var(--muted)}
@media (max-width:860px){.ab-split,.ab-grid-2,.ab-grid-3{grid-template-columns:minmax(0,1fr)}.ab-facts{grid-template-columns:110px minmax(0,1fr)}.ab-hero{padding-top:64px;padding-bottom:48px}}
/* billing plan picker: queries first, price + RPS second; term radio swaps the figures (no JS) */
.plan-pick .pp-q{display:block;font-size:17px;letter-spacing:-.02em}
.plan-pick .pp-q small{font-size:12px;font-weight:500;color:var(--muted);letter-spacing:0}
.plan-pick .pp-sub{display:block;font-size:12px;margin-top:3px}
.bill-pick .q-m{display:none}
.bill-pick:has(input[name="term"][value="month"]:checked) .q-m{display:inline}
.bill-pick:has(input[name="term"][value="month"]:checked) .q-y{display:none}
.bill-pick .sw-toggle:has(input:checked){background:var(--accent);color:#0B0C0E}
.bill-pick .sw-toggle:has(input:checked) .save{background:#0B0C0E;color:var(--accent)}
/* admin mailer */
.mail-opts{display:flex;flex-wrap:wrap;gap:12px 40px}
.mail-list{margin:0;padding-left:18px;font-size:14px;line-height:1.9}
.mail-frame{width:100%;height:440px;border:1px solid var(--line2);border-radius:8px;background:#F7F7F5}
.mail-filters{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px;margin-bottom:12px;align-items:end}
.mail-filters[hidden]{display:none}
/* support tickets */
.tk-thread{display:grid;gap:12px}
.tk-msg{border:1px solid var(--line2);border-radius:12px;background:var(--bg2);padding:16px 18px}
.tk-msg header{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 12px;font-size:13.5px;margin:0 0 8px}
.tk-msg header .mono{font-size:11.5px}
.tk-staff{border-left:3px solid var(--accent)}
.tk-internal{border-style:dashed;background:transparent}
.tk-body{font-size:14.5px;line-height:1.65;color:var(--fg2);overflow-wrap:anywhere}
.badge.tk-open{color:var(--accent-text);border-color:var(--accent)}
.badge.tk-answered{color:var(--warn);border-color:var(--warn)}
.tab-dot{display:inline-block;min-width:16px;padding:0 5px;border-radius:8px;background:var(--accent);color:#0B0C0E;font:600 10px/16px 'IBM Plex Mono',monospace;text-align:center;margin-left:4px;vertical-align:1px}
/* affiliates */
.aff-points{margin:14px 0 0;padding-left:18px;font-size:14.5px;line-height:1.75;color:var(--fg2)}
.aff-steps{margin:10px 0 0;padding-left:20px;font-size:14.5px;line-height:1.8;color:var(--fg2)}
.aff-link{overflow-wrap:anywhere;user-select:all}
.refer-card{border-color:color-mix(in srgb,var(--accent) 45%,var(--line2))}
.refer-share{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:14px 20px;margin-top:18px}
.refer-copy{display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid var(--line3);border-radius:8px;padding:6px 6px 6px 12px;font-size:13.5px;min-width:0}
.refer-join{display:grid;gap:12px;justify-items:start;margin-top:16px}
@media (max-width:760px){.refer-share{grid-template-columns:1fr}}
.aff-note{margin:12px 0 0;padding:10px 14px;border-radius:8px;border:1px solid var(--line3);font-size:14px}
.aff-note-ok{border-color:color-mix(in srgb,var(--ok) 50%,var(--line3))}
.aff-note-error{border-color:var(--warn);color:var(--fg)}
/* affiliates landing (/affiliates) */
.af-pillar svg{color:var(--accent-text);margin-bottom:12px}
.af-bonus{margin:20px 0 0;font-size:15px;line-height:1.55;color:var(--fg2)}
.af-bonus span{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--accent);color:#0B0C0E;font-weight:700;font-size:13px;margin-right:6px}
.af-code{padding:2px 7px;border-radius:6px;border:1px dashed var(--accent);color:var(--accent-text);font-size:.92em}
.af-steps{list-style:none;padding:0;counter-reset:af}
.af-steps li{counter-increment:af}
.af-steps h3::before{content:counter(af) ". ";color:var(--accent-text)}
.af-calc-in{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.af-calc-out{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:12px;margin:18px 0 0}
.af-calc-out div{border:1px solid var(--line2);border-radius:10px;padding:12px 14px;background:var(--bg)}
.af-calc-out dt{font-size:12.5px;color:var(--muted)}
.af-calc-out dd{margin:4px 0 0;font-size:22px;font-weight:700;letter-spacing:-.02em;color:var(--accent-text)}
.af-ex{list-style:none;margin:18px 0 0;padding:0;border-top:1px solid var(--line2)}
.af-ex li{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--line2);font-size:14px;color:var(--muted)}
.af-ex strong{color:var(--fg)}
.sw-nav-aff{display:inline-flex;align-items:center;gap:6px}
.sw-nav-dollar{display:inline-grid;place-items:center;width:17px;height:17px;border-radius:50%;background:var(--accent);color:#0B0C0E;font:700 11px/1 var(--mono,monospace)}
@media (max-width:560px){.af-calc-in{grid-template-columns:minmax(0,1fr)}}

/* launch-pricing bar above the nav (public pages) */
.sw-ann{display:block;background:var(--accent);color:#1d2408;font-size:13px}
.sw-ann .wrap{display:flex;align-items:center;justify-content:center;gap:12px;padding-top:10px;padding-bottom:10px}
.sw-ann .sw-pulse{width:7px;height:7px;border-radius:50%;background:#0B0C0E;flex-shrink:0}
.sw-ann strong,.sw-ann-cta{color:#0B0C0E;font-weight:600}
.sw-ann:hover .sw-ann-cta{text-decoration:underline}
@media (max-width:760px){.sw-ann-cta{display:none}.sw-ann .wrap{font-size:12px;gap:8px}}
/* launch-pricing pill above the hero heading */
.sw-fomo{transition:border-color .15s ease,transform .15s ease}
.sw-fomo:hover{border-color:var(--fg);transform:translateY(-1px)}
.sw-fomo{display:inline-flex;align-items:center;gap:12px;padding:8px 14px 8px 12px;border:1px solid var(--line3);border-radius:999px;background:var(--bg2);font-size:13px;font-weight:500;color:var(--fg);line-height:1}
@media (max-width:760px){.sw-fomo{flex-wrap:wrap;gap:8px 10px;line-height:1.3;border-radius:16px}.sw-fomo .num{white-space:normal}}
