/* Suparagent site theme: neutral light and dark, one green accent.
   Dark is the default on every page; light only when chosen with the header toggle (data-theme on <html>, remembered). */
:root{color-scheme:light;
--bg:#fcfcfb;--surface:#fff;--surface-2:#f5f5f3;--line:#e8e8e4;--line-2:#d8d8d2;--text:#0e1110;--muted:#5b625d;--dim:#8a918c;
--ink:#0e1110;--accent:#0a8a4a;--cta-bg:#0e1110;--cta-fg:#fff;--panel:#0f1211;--shadow:0 1px 2px #0e111010,0 12px 32px #0e11100d;--shadow-hover:0 2px 4px #0e11101a,0 22px 50px #0e111018;
--h-from:#0e1110;--h-to:#4b524d;--label-filter:brightness(.82);--glow-1:#0a8a4a1c;--glow-2:#7b6cf012;--glow-3:#0a8a4a0d;--header-bg:#fcfcfbcc;
--i3:color-mix(in srgb,var(--ink) 3%,transparent);--i5:color-mix(in srgb,var(--ink) 5%,transparent);--i8:color-mix(in srgb,var(--ink) 8%,transparent);--i12:color-mix(in srgb,var(--ink) 12%,transparent);
--ac8:color-mix(in srgb,var(--accent) 8%,transparent);--ac14:color-mix(in srgb,var(--accent) 14%,transparent);--ac25:color-mix(in srgb,var(--accent) 25%,transparent);--ac45:color-mix(in srgb,var(--accent) 45%,transparent);
--fg:var(--text);--card:var(--surface);--accent-fg:#fff;--paper:var(--bg);--quiet:var(--muted);--stroke:var(--line);--green:var(--accent)}
/* dark is the default; light only when chosen with the header toggle */
:root:not([data-theme=light]){color-scheme:dark;
--bg:#09090a;--surface:#111113;--surface-2:#18181b;--line:#242427;--line-2:#34343a;--text:#f4f4f3;--muted:#a1a1a8;--dim:#70707a;
--ink:#fff;--accent:#5ddc8f;--cta-bg:#f4f4f3;--cta-fg:#0b0b0c;--panel:#101113;--shadow:0 0 0 1px #ffffff08;--shadow-hover:0 20px 50px #000a;
--h-from:#fff;--h-to:#9a9aa3;--label-filter:brightness(1.3);--glow-1:#5ddc8f22;--glow-2:#8b7cff1c;--glow-3:#5ddc8f10;--header-bg:#09090acc;--accent-fg:#06240f}
:root[data-theme=dark]{color-scheme:dark;
--bg:#09090a;--surface:#111113;--surface-2:#18181b;--line:#242427;--line-2:#34343a;--text:#f4f4f3;--muted:#a1a1a8;--dim:#70707a;
--ink:#fff;--accent:#5ddc8f;--cta-bg:#f4f4f3;--cta-fg:#0b0b0c;--panel:#101113;--shadow:0 0 0 1px #ffffff08;--shadow-hover:0 20px 50px #000a;
--h-from:#fff;--h-to:#9a9aa3;--label-filter:brightness(1.3);--glow-1:#5ddc8f22;--glow-2:#8b7cff1c;--glow-3:#5ddc8f10;--header-bg:#09090acc;--accent-fg:#06240f}

html{background:var(--bg)}
body{position:relative;background:var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden;transition:background .2s,color .2s}
body:before{content:"";position:absolute;z-index:-1;inset:0 0 auto 0;height:820px;pointer-events:none;background:radial-gradient(ellipse 55% 50% at 50% -8%,var(--glow-1) 0,transparent 70%),radial-gradient(ellipse 35% 35% at 92% 10%,var(--glow-2) 0,transparent 70%),radial-gradient(ellipse 30% 30% at 6% 16%,var(--glow-3) 0,transparent 70%)}
body:after{content:"";position:absolute;z-index:-1;inset:0 0 auto 0;height:640px;pointer-events:none;background-image:linear-gradient(var(--i5) 1px,transparent 1px),linear-gradient(90deg,var(--i5) 1px,transparent 1px);background-size:64px 64px;-webkit-mask-image:radial-gradient(ellipse 70% 70% at 50% 0,#000 0,transparent 75%);mask-image:radial-gradient(ellipse 70% 70% at 50% 0,#000 0,transparent 75%)}
a{color:inherit}a:hover{color:var(--accent)}a:focus-visible,summary:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
::selection{background:var(--ac25)}

/* Announcement + header */
.announcement,.home-site .announcement{background:transparent;border-bottom:1px solid var(--line);color:var(--muted);font-size:12px}
.announcement a{color:var(--accent);text-decoration:none;font-weight:600}.announcement a:hover{text-decoration:underline}
.site-header,.home-site .site-header{position:sticky;top:0;z-index:30;max-width:none;padding:14px max(28px,calc((100vw - 1240px)/2));border-bottom:1px solid var(--line);background:var(--header-bg);-webkit-backdrop-filter:saturate(1.5) blur(16px);backdrop-filter:saturate(1.5) blur(16px)}
.brand{color:var(--text)}.brand-mark{background:#16301f;color:#c9f08f;border-radius:9px}.brand-period{color:var(--accent)}
.desktop-nav{gap:4px;padding:5px;border:1px solid var(--line);border-radius:999px;background:var(--i3);font-size:13px}
.desktop-nav a{padding:7px 14px;border-radius:999px;color:var(--muted);text-decoration:none!important;transition:background .15s,color .15s}
.desktop-nav a:hover{background:var(--i5);color:var(--text)}.desktop-nav a.active{background:var(--surface);color:var(--text);box-shadow:0 0 0 1px var(--line),0 1px 3px #0001}
.account-nav{gap:12px}.account-nav a{color:var(--muted)}.account-nav a:hover{color:var(--text)}
.theme-toggle{display:inline-grid;place-items:center;width:36px;height:36px;padding:0;border:1px solid var(--line);border-radius:50%;background:var(--i3);color:var(--text);cursor:pointer;transition:background .15s,border-color .15s}
.theme-toggle:hover{background:var(--i8);border-color:var(--line-2)}.theme-toggle svg{width:17px;height:17px}
.theme-toggle .icon-sun{display:none}
:root[data-theme=dark] .theme-toggle .icon-sun{display:block}:root[data-theme=dark] .theme-toggle .icon-moon{display:none}
.button,.home-copy .button{background:var(--cta-bg);border-color:var(--cta-bg);color:var(--cta-fg)!important;border-radius:999px;font-weight:600;box-shadow:none;transition:transform .15s,opacity .15s,box-shadow .15s}
.button:hover,.home-copy .button:hover{background:var(--cta-bg);color:var(--cta-fg)!important;opacity:.88;transform:translateY(-1px);box-shadow:var(--shadow-hover)}
.button.secondary,.home-copy .button.secondary{background:var(--surface);border-color:var(--line-2);color:var(--text)!important;opacity:1}
.button.secondary:hover,.home-copy .button.secondary:hover{background:var(--surface-2);color:var(--text)!important;box-shadow:none}
.button.compact{padding:9px 17px;gap:10px;font-size:13px}
.mobile-nav summary{color:var(--text);cursor:pointer}.mobile-nav nav{background:var(--surface);border-color:var(--line-2);box-shadow:var(--shadow-hover)}.mobile-nav nav a{color:var(--text)}

/* Typography */
h1,h2,h3{color:var(--text)}h1{font-weight:620;letter-spacing:-.045em}h2{font-weight:600;letter-spacing:-.035em}
.eyebrow{color:var(--accent);font-size:11px;letter-spacing:.16em}
.intro{color:var(--muted)}.small{color:var(--dim)}
.breadcrumbs{justify-content:center;color:var(--dim);padding-top:28px}.breadcrumbs a{text-decoration:none}.breadcrumbs a:hover{color:var(--accent)}
.breadcrumbs span[aria-current]{max-width:42ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted)}

/* Inner page hero */
main:not(.home-page) .page-hero{max-width:900px;margin:0 auto;padding:54px 0;text-align:center}
main:not(.home-page) .page-hero .eyebrow{display:inline-block;margin:0 0 24px;padding:7px 15px;border:1px solid var(--ac25);border-radius:999px;background:var(--ac8);font-size:10px}
main:not(.home-page) .page-hero h1{font-size:clamp(38px,6vw,76px);line-height:1.02;margin:0 auto 22px;max-width:15ch;text-wrap:balance;background:linear-gradient(180deg,var(--h-from) 35%,var(--h-to) 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
main:not(.home-page) .page-hero .intro{margin:0 auto;max-width:640px;font-size:19px}

/* Content sections */
section.article-section,section.collection,.sources{border-color:var(--line)}
main:not(.home-page) section.article-section{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.6fr);gap:0 56px;padding:56px 0}
main:not(.home-page) section.article-section>h2{grid-column:1;grid-row:1 / span 12;margin:0;position:sticky;top:104px;align-self:start;font-size:clamp(24px,2.6vw,32px)}
main:not(.home-page) section.article-section>*:not(h2){grid-column:2;min-width:0;margin-bottom:16px!important}
main:not(.home-page) section.article-section>p,main:not(.home-page) section.article-section>ul,main:not(.home-page) section.article-section>ol{max-width:none;color:var(--muted);font-size:16px;line-height:1.75;margin:0}
.article-section li::marker{color:var(--accent)}.article-section ul,.article-section ol:not(.numbered){padding-left:20px}
.numbered{list-style:none;counter-reset:n;padding:0}.numbered li{counter-increment:n;position:relative;margin:0 0 12px;padding:16px 18px 16px 60px;border:1px solid var(--line);border-radius:14px;background:var(--surface)}
.numbered li:before{content:counter(n,decimal-leading-zero);position:absolute;left:18px;top:16px;color:var(--accent);font:600 12px/1.9 ui-monospace,monospace}
main:not(.home-page) section.collection{padding:64px 0 24px}main:not(.home-page) section.collection>h2{margin-bottom:6px;font-size:clamp(26px,3vw,38px)}

/* Cards */
.cards{gap:14px;margin-top:26px}
.content-card{display:flex;flex-direction:column;min-height:215px;padding:24px 24px 66px;border:1px solid var(--line);border-radius:18px;background:var(--surface);box-shadow:var(--shadow);overflow:hidden;transition:transform .2s,border-color .2s,box-shadow .2s}
.content-card:before{content:"";position:absolute;inset:0;background:radial-gradient(420px circle at 100% 0,var(--ac14),transparent 55%);opacity:0;transition:opacity .25s}
.content-card:hover{transform:translateY(-3px);background:var(--surface);border-color:var(--ac45);box-shadow:var(--shadow-hover);color:var(--text)}.content-card:hover:before{opacity:1}
.content-card>*:not(.arrow){position:relative}
.content-card .eyebrow{font-size:10px;margin-bottom:14px}
.content-card h3{color:var(--text);font-size:21px;font-weight:600}.content-card p{color:var(--muted);line-height:1.6}
.content-card .arrow{position:absolute;inset:auto 22px 20px auto;display:grid;place-items:center;width:34px;height:34px;border:1px solid var(--line-2);border-radius:50%;font-size:15px;color:var(--text);transition:background .2s,color .2s,border-color .2s}
.content-card:hover .arrow{background:var(--cta-bg);border-color:var(--cta-bg);color:var(--cta-fg)}

/* FAQ */
details{max-width:none;border:1px solid var(--line);border-radius:14px;background:var(--surface);padding:0;margin:0 0 10px;transition:border-color .2s}
details[open]{border-color:var(--line-2)}
summary{list-style:none;display:flex;justify-content:space-between;gap:16px;align-items:center;padding:17px 20px;cursor:pointer;font-weight:600;color:var(--text)}
summary::-webkit-details-marker{display:none}summary:after{content:"+";flex:none;display:grid;place-items:center;width:26px;height:26px;border:1px solid var(--line-2);border-radius:50%;color:var(--accent);font-weight:400;transition:transform .2s}
details[open] summary:after{transform:rotate(45deg)}
details p{margin:0;padding:0 20px 19px;color:var(--muted);line-height:1.7}
.mobile-nav{border:0}.mobile-nav summary{padding:0;display:block}.mobile-nav summary:after{display:none}

/* Closing CTA: a dark feature panel in both themes */
.closing,.home-page .home-closing{position:relative;overflow:hidden;margin:56px 0 80px;padding:clamp(34px,6vw,72px)!important;border:1px solid #ffffff14;border-radius:28px;background:radial-gradient(ellipse 70% 120% at 50% 0,#5ddc8f2e 0,transparent 65%),#0e1011;color:#f4f4f3;text-align:center}
.closing:after{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(#ffffff0a 1px,transparent 1px),linear-gradient(90deg,#ffffff0a 1px,transparent 1px);background-size:44px 44px;-webkit-mask-image:radial-gradient(ellipse at 50% 0,#000,transparent 70%);mask-image:radial-gradient(ellipse at 50% 0,#000,transparent 70%);border:0;box-shadow:none;width:auto;height:auto;right:0;bottom:0}
.closing>*{position:relative;z-index:1}.closing .eyebrow{color:#5ddc8f}
.closing h2{max-width:16ch;margin:0 auto 14px;font-size:clamp(34px,5vw,60px);line-height:1.04;letter-spacing:-.04em;color:#fff}
.closing p{color:#a8aeab;max-width:560px;margin-left:auto;margin-right:auto}.closing .actions{justify-content:center}.closing .actions>a:not(.button){color:#f4f4f3}
.closing .small{color:#7f8582}
.closing .button{background:#f4f4f3;border-color:#f4f4f3;color:#0b0b0c!important}.closing .button:hover{background:#f4f4f3;color:#0b0b0c!important}
.home-closing .button.closing-secondary{background:#ffffff10;border-color:#ffffff30;color:#f4f4f3!important}
.sources{padding:34px 0}.sources h2{font-size:17px;color:var(--muted)}.sources a{color:var(--muted)}.sources a:hover{color:var(--accent)}
.site-footer,.home-site .site-footer{max-width:1240px;padding:56px 28px 0;border-top:1px solid var(--line);color:var(--muted)}
.site-footer h3{color:var(--text)}.site-footer a{text-decoration:none}.site-footer a:hover{color:var(--accent)}
.footer-intro .brand{color:var(--text)}.footer-bottom{border-color:var(--line);color:var(--dim)}.site-map a{text-decoration:none}

/* Pricing */
.pricing-options{padding:8px 0 40px}
.section-head{max-width:640px;margin:0 auto 36px;text-align:center}.section-head h2{font-size:clamp(30px,4vw,48px);margin:0 0 12px}.section-head>p:last-child{color:var(--muted);margin:0}
.plan-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;align-items:stretch;color:var(--muted)}
.plan-card{position:relative;display:flex;flex-direction:column;padding:30px 26px 26px;border:1px solid var(--line);border-radius:22px;background:var(--surface);box-shadow:var(--shadow);overflow:hidden;transition:transform .2s,border-color .2s,box-shadow .2s}
.plan-card:hover{transform:translateY(-3px);border-color:var(--ac45);box-shadow:var(--shadow-hover)}
.plan-card:before{content:"";position:absolute;inset:0;background:radial-gradient(380px circle at 50% -10%,var(--ac8),transparent 60%);pointer-events:none}
.plan-card>*{position:relative}.plan-card h3{margin:0 0 4px;font-size:20px;font-weight:600;color:var(--text)}
.plan-card .plan-tag{margin:0 0 20px;color:var(--dim);font-size:13px}
.plan-card .plan-price{margin:0 0 22px;color:var(--text);font-size:clamp(34px,3.4vw,46px);font-weight:620;letter-spacing:-.045em;line-height:1.05}
.plan-card .plan-price small{display:block;margin-top:7px;color:var(--muted);font-size:13px;font-weight:450;letter-spacing:0}
.plan-card .plan-points{align-self:stretch;list-style:none;margin:0 0 26px;padding:20px 0 0;border-top:1px solid var(--line);display:grid;gap:11px;color:var(--muted);font-size:14px;line-height:1.45}
.plan-points li{position:relative;padding-left:26px}.plan-points li:before{content:"✓";position:absolute;left:0;top:0;display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:var(--ac14);color:var(--accent);font-size:10px;font-weight:800}
.plan-card .button{margin-top:auto;width:100%}
.plan-grid>p{grid-column:span 3;align-self:start;display:flex;align-items:center;padding:26px 30px;border:1px dashed var(--line-2);border-radius:14px;background:var(--i3);font-size:14px}
.bill-split{margin-top:72px;text-align:center}.bill-split>.eyebrow{margin-bottom:22px}
.bill-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;text-align:left}
.bill-grid article{padding:24px;border:1px solid var(--line);border-radius:18px;background:var(--surface);box-shadow:var(--shadow)}
.bill-mark{display:inline-block;margin-bottom:34px;color:var(--accent);font:600 12px/1 ui-monospace,monospace;letter-spacing:.12em}
.bill-grid h3{margin:0 0 8px;font-size:19px;font-weight:600}.bill-grid p{margin:0;color:var(--muted);font-size:14px;line-height:1.65}

/* Provider strip (home) */
.provider-strip{margin:-30px 0 70px;text-align:center}
.provider-strip>p{margin:0 0 20px;color:var(--dim);font:600 11px/1.4 ui-monospace,monospace;letter-spacing:.16em;text-transform:uppercase}
.provider-strip>div{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.provider-strip a{display:inline-flex;align-items:center;gap:9px;padding:9px 16px 9px 10px;border:1px solid var(--line);border-radius:999px;background:var(--surface);color:var(--text);font-size:14px;font-weight:550;text-decoration:none;box-shadow:var(--shadow);transition:border-color .2s,transform .2s}
.provider-strip a:hover{border-color:var(--ac45);color:var(--text);transform:translateY(-2px)}
.provider-strip i{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--ac14);color:var(--accent);font:700 11px/1 ui-monospace,monospace;font-style:normal}

/* Home */
.home-site{background:var(--bg)}
.home-page .home-hero-section{margin:34px 0 64px}
.home-copy .eyebrow{border-color:var(--ac25);background:var(--ac8);color:var(--accent)}
.home-copy .eyebrow-mark{background:var(--accent);box-shadow:0 0 0 4px var(--ac14)}
.home-copy h1{font-weight:640;letter-spacing:-.055em;line-height:.98;background:linear-gradient(180deg,var(--h-from) 40%,var(--h-to) 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.home-copy .intro{color:var(--muted)}
.home-hero-tags span{border-color:var(--line);background:var(--surface);color:var(--text)}
.home-note{color:var(--dim)}.home-note a{color:var(--accent)}.home-note-dot{background:var(--accent);box-shadow:0 0 10px var(--accent)}
.product-preview{border-color:var(--line-2);box-shadow:0 0 0 1px var(--line),0 40px 100px #0e111028}
.product-preview:before{content:"";position:absolute;inset:0 0 auto;height:1px;z-index:2;background:linear-gradient(90deg,transparent,#5ddc8f99,transparent)}
.home-page .home-section-heading .eyebrow{color:var(--accent)}
.home-page .home-section-heading h2{color:var(--text);font-weight:620;letter-spacing:-.05em}
.home-page .home-section-heading>p:last-child{color:var(--muted)}
.employee-card,.work-example-card,.home-page .setup-card{border-color:var(--line);background:var(--surface);box-shadow:var(--shadow)}
.employee-card:hover{border-color:var(--line-2);box-shadow:var(--shadow-hover)}
.employee-card h3,.work-example-card h3{color:var(--text)}
.employee-glyph{background:color-mix(in srgb,var(--role-accent),transparent 88%);border-color:color-mix(in srgb,var(--role-accent),transparent 62%)}
.employee-label,.example-category{filter:var(--label-filter)}
.employee-description,.example-brief p,.example-handoff p,.home-page .setup-card>p:not(.eyebrow){color:var(--muted)}
.employee-example{border-color:var(--line)}.employee-example p{color:var(--text)}
.employee-index,.feature-card-label,.employee-example>span,.example-brief>span,.example-handoff>span{color:var(--dim)}
.employee-section-footer{color:var(--dim)}
.employee-section-footer a,.work-example-card>a,.home-page .setup-card>a{color:var(--accent)}
.example-brief{background:var(--i3)}.example-handoff{background:color-mix(in srgb,var(--example-accent),transparent 90%)}
.home-page .setup-card .eyebrow{color:var(--accent)}
.home-faq-section,.home-page .home-faq-section{border-color:var(--line)}
.home-faq-grid details{background:var(--surface);border-color:var(--line)}.home-faq-grid summary{color:var(--text);font-size:14px}.home-faq-grid details p{color:var(--muted);font-size:13px}
/* Dark feature panels stay dark in both themes */
.home-workflow-section,.home-workspace-section{border-color:#ffffff14;background:radial-gradient(ellipse at 100% 0,#5ddc8f18 0,transparent 45%),radial-gradient(ellipse at 0 100%,#8b7cff16 0,transparent 45%),var(--panel);color:#f4f4f3}
.home-workflow-section .home-section-heading h2,.home-workspace-section .home-section-heading h2{color:#fff}
.home-workflow-section .home-section-heading>p:last-child,.home-workspace-section .home-section-heading>p:last-child{color:#b3b9b5}
.home-workflow-section .home-section-heading .eyebrow,.home-workspace-section .home-section-heading .eyebrow{color:#5ddc8f}
.home-workflow li,.workspace-feature-card{border-color:#ffffff1c;background:#ffffff08}
.home-workflow .workflow-index{background:#5ddc8f;color:#06240f}
.home-page .home-closing{margin-bottom:84px}.home-closing h2{max-width:16ch}

@media(max-width:1100px){.plan-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.plan-grid>p{grid-column:span 1}}
@media(max-width:1050px){.site-header,.home-site .site-header{padding-left:22px;padding-right:22px}.desktop-nav{gap:0}.desktop-nav a{padding:6px 10px}}
@media(max-width:850px){.desktop-nav{display:none}main:not(.home-page) section.article-section{grid-template-columns:1fr;gap:14px}main:not(.home-page) section.article-section>h2{grid-column:1;grid-row:auto;position:static}main:not(.home-page) section.article-section>*:not(h2){grid-column:1}.bill-grid{grid-template-columns:1fr}.provider-strip{margin-top:-14px}}
@media(max-width:620px){.plan-grid{grid-template-columns:1fr}}
@media(max-width:560px){main:not(.home-page) .page-hero{padding:34px 0}.site-header,.home-site .site-header{padding:14px 18px}.closing,.home-page .home-closing{border-radius:22px}.provider-strip a{font-size:13px}.account-nav{gap:8px}}
@media(prefers-reduced-motion:reduce){.content-card,.plan-card,.provider-strip a,.button,body{transition:none!important;transform:none!important}}
.preview-room.selected-room{background:#2c3130!important;color:#fff!important}.preview-room.selected-room span{color:#a19aff}.scene-content h3,.scene-content{color:#292e29}

/* Illustrated role characters */
.mascot{display:block;width:96px;height:96px;margin:0 0 16px;filter:drop-shadow(0 12px 14px color-mix(in srgb,var(--role-accent) 30%,transparent))}
.mascot svg{display:block;width:100%;height:100%;overflow:visible}
.employee-card{min-height:0;padding:24px 22px 22px;border-radius:20px}
.employee-card:before{display:none}
.employee-card h3{margin:0 0 4px;font-size:21px;letter-spacing:-.03em}
.employee-label{margin:0 0 12px;font-size:13px;font-weight:650}
.employee-description{font-size:14px;line-height:1.6}
.employee-example{margin-top:auto;padding-top:16px;border-top:0}
.employee-example>span{display:inline-block;margin:0 0 7px;padding:3px 9px;border-radius:999px;background:color-mix(in srgb,var(--role-accent) 14%,transparent);color:var(--role-accent);font:700 10px/1.5 ui-monospace,monospace;letter-spacing:.08em;text-transform:uppercase;filter:var(--label-filter)}
.employee-example p{font-size:13px;line-height:1.5;color:var(--text)}
.employee-card{display:flex;flex-direction:column}.employee-description{margin-bottom:16px}
.employee-section-footer{font-size:13px}
.home-page .home-hero-section{position:relative}
.hero-mascots{position:absolute;inset:0;pointer-events:none}
.hero-mascot{position:absolute;display:block;animation:mascot-float 6s ease-in-out infinite}
.hero-mascot svg{display:block;width:100%;height:100%;overflow:visible;filter:drop-shadow(0 16px 18px #0e11102e)}
.hm-a{left:1%;top:3%;width:118px;height:118px;transform:rotate(-8deg)}
.hm-b{right:2%;top:7%;width:132px;height:132px;transform:rotate(7deg);animation-delay:-2s}
.hm-c{left:8%;top:47%;width:92px;height:92px;transform:rotate(6deg);animation-delay:-4s}
.hm-d{right:9%;top:50%;width:100px;height:100px;transform:rotate(-6deg);animation-delay:-1s}
@keyframes mascot-float{0%,100%{translate:0 0}50%{translate:0 -12px}}
@media(max-width:1180px){.hero-mascots{display:none}}
@media(prefers-reduced-motion:reduce){.hero-mascot{animation:none}}

/* Homepage text: lift the very small type */
.work-example-card h3{font-size:24px}.example-brief p,.example-handoff p{font-size:14px}
.example-brief>span,.example-handoff>span{font-size:10px}.example-category{font-size:11px}
.work-example-card>a,.home-page .setup-card>a,.employee-section-footer a{font-size:13px}
.home-page .setup-card{min-height:0}.home-page .setup-card>p:not(.eyebrow){font-size:15px;line-height:1.65}.home-page .setup-card .eyebrow{font-size:11px}
.workspace-feature-card>p{font-size:14px}.workspace-feature-card h3{font-size:21px}.feature-snippet{font-size:11px;padding:12px}.workspace-feature-card>a{font-size:13px}.feature-card-label{font-size:10px}
.home-workflow li h3{font-size:21px}.home-workflow li p{font-size:15px}
.home-hero-tags span{font-size:13px}.home-note{font-size:12px}

/* Homepage rhythm: centered section headings, inset dark bands, tighter gaps */
.home-workflow-section,.home-workspace-section{margin-left:0;margin-right:0;border-radius:28px}
.home-workflow-section:after{display:none}
.home-employee-section .home-section-heading,.home-examples-section .home-section-heading,.home-setup-section .home-section-heading,.home-faq-section .home-section-heading{max-width:760px;margin:0 auto 44px;text-align:center}
.home-employee-section .home-section-heading>p:last-child,.home-examples-section .home-section-heading>p:last-child,.home-setup-section .home-section-heading>p:last-child{margin-left:auto;margin-right:auto}
.home-page .home-section-heading h2{text-wrap:balance}
.home-page .home-employee-section{padding:8px 0 72px}
.home-page .home-examples-section{padding:84px 0 72px}
.home-page .home-setup-section{padding:84px 0 56px}
.home-page .home-faq-section{padding:64px 0 24px;border-top:0}
.home-page .home-closing{margin-top:40px}
.provider-strip{margin:-24px 0 56px}
.home-site .site-footer{max-width:1440px;padding-left:44px;padding-right:44px}
.employee-section-footer{justify-content:center;gap:28px}
.home-page .home-workflow-section,.home-page .home-workspace-section{margin-top:12px;margin-bottom:12px}
@media(max-width:850px){.home-site .site-footer{padding-left:26px;padding-right:26px}.home-page .home-employee-section{padding-bottom:48px}.home-page .home-examples-section,.home-page .home-setup-section{padding-top:56px}}
.hero-mascots{inset:0 0 auto 0;height:620px}
.hm-a{top:24px}.hm-b{top:56px}.hm-c{top:360px}.hm-d{top:392px}
@media(max-width:560px){.account-nav>a:not(.button){display:none}}

/* ---- Page-level fixes from the per-area review (product pages, content library, docs/pricing/account) ---- */
/* area a */
Owned by one reviewer; merged into polish.css later. Docs and the homepage have their own layouts and are excluded. */

/* Align page content, header and footer on one grid (header content is 1240px wide) */
body:not(.docs-site):not(.home-site) main{max-width:1296px}
body:not(.docs-site):not(.home-site) .site-footer{max-width:1296px;padding-top:44px}
body:not(.docs-site):not(.home-site) .footer-bottom{margin-top:12px}

/* Article sections: tighter rhythm, no trailing gap under the last block */
main:not(.home-page) section.article-section{padding:48px 0}
main:not(.home-page) section.article-section>*:not(h2):last-child{margin-bottom:0!important}

/* Card grids that sit inside a section's narrow right column: two readable columns instead of three cramped ones */
main:not(.home-page) section.article-section .cards{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));margin-top:8px}
main:not(.home-page) section.article-section .content-card{min-height:200px}

/* "Keep exploring" and library grids: keep a lone card from looking stranded */
main:not(.home-page) section.collection .cards:has(> .content-card:only-child){grid-template-columns:minmax(0,420px)}

/* Sources and further reading is styled globally in fixes-b.css (left to its owner to avoid conflicting rules). */

/* Sitemap: readable three-column index, no bullets */
.site-map{columns:3;column-gap:48px;margin:28px 0 0;padding:0;list-style:none;font-size:15px;line-height:1.4}
.site-map li{margin:0 0 4px;break-inside:avoid}
.site-map a{display:block;padding:7px 0;color:var(--muted);text-decoration:none;border-bottom:1px solid transparent;transition:color .15s}
.site-map a:hover{color:var(--accent)}

/* Keyboard focus on cards */
.content-card:focus-visible{outline:2px solid var(--accent);outline-offset:3px}

@media(max-width:850px){.site-map{columns:2}}
@media(max-width:560px){
  body:not(.docs-site):not(.home-site) .site-footer{padding-top:36px}
  main:not(.home-page) section.article-section{padding:36px 0}
  main:not(.home-page) section.article-section .cards{grid-template-columns:1fr}
  main:not(.home-page) section.collection .cards:has(> .content-card:only-child){grid-template-columns:1fr}
  .site-map{columns:1}
}
/* area b */
/* Guides, use cases, providers, integrations, compare: long-form rhythm, sources, cards, phone spacing */
main:not(.home-page) section.article-section{padding:48px 0}
main:not(.home-page) section.article-section>*:last-child{margin-bottom:0!important}
main:not(.home-page) section.article-section>p,main:not(.home-page) section.article-section>ul,main:not(.home-page) section.article-section>ol{font-size:17px;line-height:1.75}
main:not(.home-page) section.article-section>p+p,main:not(.home-page) section.article-section>p+ul{margin-top:2px}
main:not(.home-page) section.article-section>h2{font-size:clamp(24px,2.5vw,31px);line-height:1.2;text-wrap:balance}
/* Index pages: the single intro row shouldn't look like a full article section */
main:not(.home-page) .page-hero+section.article-section{padding:36px 0}
main:not(.home-page) .page-hero+section.article-section>h2{font-size:clamp(22px,2.2vw,28px)}
/* Collections ("Keep exploring", "All comparisons"): label + readable cards */
main:not(.home-page) section.collection{padding:56px 0 16px;border-top:0}
main:not(.home-page) section.collection>h2{font-size:clamp(26px,2.8vw,34px);margin:0 0 4px}
.cards{margin-top:22px}
.content-card .eyebrow{color:var(--dim);letter-spacing:.14em}
.content-card:hover .eyebrow{color:var(--accent)}
.content-card h3{line-height:1.3}.content-card p{font-size:15px}
/* Sources and further reading: a quiet card with link chips */
.sources{margin:24px 0 8px;padding:24px 26px;border:1px solid var(--line);border-radius:18px;background:var(--surface)}
.sources h2{margin:0 0 6px;font-size:16px;color:var(--text)}
.sources .small{margin:0 0 14px;font-size:13px;color:var(--dim)}
.sources ul{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
.sources li{margin:0}
.sources a{display:inline-flex;align-items:center;gap:6px;padding:7px 13px;border:1px solid var(--line-2);border-radius:999px;background:var(--i3);color:var(--text);font-size:13px;text-decoration:none}
.sources a:after{content:"\2197";color:var(--accent);font-size:12px}
.sources a:hover{border-color:var(--ac45);color:var(--accent)}
/* FAQ on content pages */
main:not(.home-page) section.article-section details{margin-bottom:10px}
main:not(.home-page) section.article-section summary{font-size:16px}
/* Footer lines up with the page column on inner pages */
body:not(.home-site):not(.docs-site) .site-footer{max-width:1184px}
/* Closing panel sits flush with the content column and is visible in dark */
.closing{margin-top:40px}
:root[data-theme=dark] .closing{border-color:#ffffff1f}
@media(max-width:850px){main:not(.home-page) section.article-section{padding:36px 0}main:not(.home-page) section.article-section>p,main:not(.home-page) section.article-section>ul,main:not(.home-page) section.article-section>ol{font-size:16px}main:not(.home-page) .page-hero+section.article-section{padding:28px 0}}
@media(max-width:560px){main:not(.home-page) section.collection{padding-top:40px}.sources{padding:20px}.content-card{min-height:0;padding-bottom:62px}.closing{margin:32px 0 56px}.breadcrumbs{font-size:11px;padding-top:20px}.breadcrumbs span[aria-current]{max-width:26ch}}
main:not(.home-page) section.article-section>p{margin:0 0 14px!important}
main:not(.home-page) section.article-section>p:last-child,main:not(.home-page) section.article-section>ul:last-child,main:not(.home-page) section.article-section>ol:last-child{margin-bottom:0!important}
/* area c */
/* ---- Auth, account, billing and legal pages ---- */
.auth h1{line-height:1.15;margin-bottom:8px}
.auth .lead{margin:0 0 6px;line-height:1.6}
.auth p a,.auth .lead a{color:var(--accent);text-decoration:underline;text-underline-offset:3px}
.auth .note{line-height:1.6}
.auth form{margin-top:20px}
.auth label{color:var(--text)}
.auth input::placeholder{color:var(--dim)}
.auth .notice{margin-top:14px}
.auth form .notice{margin-top:0}
/* Billing is wider than a sign-in card: plan cards need room */
.auth.billing-page{max-width:900px;padding:40px 40px 34px}
.billing-page h1{font-size:clamp(28px,4vw,38px)}
.billing-page .lead{max-width:60ch}
.billing-page .billing-state{margin:20px 0 4px;padding:16px 20px;line-height:1.6;color:var(--text)}
.billing-page .billing-state p{margin:6px 0;color:var(--muted);font-size:15px}
.billing-page .billing-options{margin:26px 0;padding:26px 0;border-color:var(--line)}
.billing-page .billing-options h2{margin:0 0 4px;font-size:24px}
.billing-page .billing-options>.plan-grid{color:var(--muted);font-size:15px;line-height:1.6}
.billing-page .plan-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin:18px 0 0}
.billing-page .plan-grid>p{grid-column:1/-1;display:block}
.billing-page .plan-card{align-items:stretch;gap:6px;padding:24px 22px}
.billing-page .plan-card h2{font-size:20px;margin:0}
.billing-page .plan-card .plan-price{margin:6px 0 4px;font-size:30px;letter-spacing:-.03em}
.billing-page .plan-card p{color:var(--muted);font-size:14px;line-height:1.6;margin:0}
.billing-page .plan-card .btn{margin-top:14px;width:100%;text-align:center}
.billing-page #billing-portal{margin:4px 0 0}
.billing-page>.note{margin-top:22px;text-align:left;color:var(--dim);font-size:13px;line-height:1.7;max-width:70ch}
/* Provider page: disconnect button and state */
#connected{margin:18px 0 0}
#connected .btn{width:100%}
/* Legal pages: one readable text colour, clear hierarchy */
.legal{max-width:740px;margin:56px auto 100px;padding:0 4px}
.legal h1{font-size:clamp(32px,5vw,44px);line-height:1.1;margin:0 0 10px}
.legal .policy-date{margin:0 0 28px;color:var(--dim);font-size:14px}
.legal h2{margin:38px 0 10px;font-size:21px;line-height:1.3;letter-spacing:-.02em}
.legal p,.legal li{color:color-mix(in srgb,var(--text) 78%,var(--bg));font-size:16px;line-height:1.75}
.legal p{margin:0 0 14px}
.legal ul,.legal ol{margin:0 0 16px;padding-left:22px}
.legal li{margin:0 0 8px}
.legal li::marker{color:var(--accent)}
.legal strong,.legal b{color:var(--text);font-weight:650}
.legal a{color:var(--accent);text-decoration:underline;text-underline-offset:3px}
.legal .draft{margin:0 0 24px;padding:12px 16px;border:1px dashed var(--ac45);border-radius:12px;background:var(--ac8);color:var(--text)!important;font-size:14px}
@media(max-width:560px){
  .auth{margin:32px 16px 64px;padding:28px 22px 24px;border-radius:20px}
  .auth.billing-page{padding:28px 20px 24px}
  .legal{margin:36px auto 72px;padding:0 20px}
  header.top{padding:0 16px}
}
.billing-page .plan-card .plan-price{color:var(--text);font-size:26px;line-height:1.2;white-space:nowrap;margin:6px 0 4px}

/* ---- Pricing ---- */
.pricing-options{max-width:none}
.plan-card .plan-price small{line-height:1.45}

/* ---- Docs portal ---- */
/* style.css has a generic `nav a{margin-left:20px;font-size:15px}` that leaks into docs navs */
.docs-site .docs-sidebar a,.docs-site .docs-toc nav a,.docs-site .docs-pager a,.docs-site .docs-mobile-browse a{margin-left:0}
/* header lines up with the docs layout (1440 wide, 38px gutters) */
.docs-site .docs-header{padding-left:max(28px,calc((100vw - 1440px)/2 + 38px));padding-right:max(28px,calc((100vw - 1440px)/2 + 38px))}
/* readable type: docs.css used 9-12px for most chrome */
.docs-nav-group>p{font-size:10px;letter-spacing:.12em}
.docs-nav-group a{font-size:13px;padding:7px 10px}
.docs-nav-home{font-size:13px}
.docs-breadcrumbs{font-size:12px}
.docs-eyebrow{font-size:11px;letter-spacing:.14em}
.docs-article-section p,.docs-article-section li{font-size:15.5px;line-height:1.8}
.docs-article-section h2{font-size:26px}
.docs-callout p{font-size:15px}.docs-callout span{font-size:10px}
.docs-inline-links a{font-size:13px;padding:9px 13px;border-radius:999px}
.docs-toc{font-size:13px}
.docs-toc nav>p,.docs-index-aside>p:first-child{font-size:13px}
.docs-toc ul{padding-left:14px}
.docs-toc li{margin:0 0 10px}
.docs-toc li a{display:block;font-size:13px;line-height:1.45}
.docs-edit-link{font-size:12px}.docs-index-aside>a{font-size:13px}.docs-aside-note{font-size:12px!important}
.docs-quickstart{border-radius:20px;padding:28px 30px}
.docs-quickstart h2{font-size:24px}.docs-quickstart p{font-size:14px;max-width:48ch}
.docs-quickstart>div>span{font-size:10px}.docs-quickstart .button{font-size:13px;padding:12px 20px}
/* category sections: one rule, even gaps (style.css gives every <section> a border and 56px padding) */
.docs-category{margin:0;padding:36px 0 8px}
.docs-category:first-of-type{border-top:0}
.docs-category h2{font-size:22px;margin-bottom:16px}
.docs-card-grid{gap:14px}
.docs-card{min-height:0;padding:22px 24px 46px;border-radius:16px}
.docs-card>span{font-size:10px}
.docs-card h3{font-size:18px;margin:10px 0 6px}
.docs-card p{font-size:14px;line-height:1.6}
.docs-card>b{font-size:16px;right:20px;bottom:16px}
.docs-pager{gap:14px;margin:48px 0 20px}
.docs-pager-card{min-height:84px;padding:16px 20px;border-radius:14px;gap:8px;transition:border-color .2s,transform .2s}
.docs-pager-card:hover{transform:translateY(-2px)}
.docs-pager-card span{font-size:10px}
.docs-pager-card b{font-size:15px}
.docs-feedback{font-size:14px}
.docs-footer{font-size:12px}.docs-footer>a:first-child{font-size:15px}
@media(max-width:850px){
  .docs-site .docs-header{padding-left:22px;padding-right:22px}
  .docs-search-bar{padding:12px 22px 0}
  .docs-mobile-browse summary{font-size:14px;padding:13px 16px}
  .docs-card{padding:20px 20px 44px}
}
@media(max-width:560px){
  .docs-site .docs-header{padding-left:16px;padding-right:16px}
  .docs-main h1{font-size:clamp(34px,10vw,44px)}
  .docs-article-section h2{font-size:22px}
  .docs-quickstart{flex-direction:column;align-items:stretch;padding:22px}
  .docs-quickstart .button{justify-content:center}
  .docs-pager{grid-template-columns:1fr}
}
.docs-category{padding:40px 0}
.docs-category+.docs-category{margin-top:0}
.docs-edit-link{white-space:nowrap;font-size:12px;letter-spacing:-.005em}
.docs-search-field{height:44px}.docs-search-field input{font-size:14px}
.docs-search-results a strong{font-size:14px}.docs-search-results a small{font-size:12px}.docs-search-results .docs-result-category{font-size:10px}

/* Keep account/legal widths even when another stylesheet sets a generic `main` max-width (auth pages have a class-less <body>) */
body:not(.docs-site):not(.home-site) main.auth{max-width:440px}
body:not(.docs-site):not(.home-site) main.auth.billing-page{max-width:900px}
body:not(.docs-site):not(.home-site) main.legal{max-width:740px}
/* Phone menu button */
.mobile-nav summary{display:inline-flex;align-items:center;padding:8px 15px;border:1px solid var(--line-2);border-radius:999px;background:var(--surface);color:var(--text);font-size:13px;font-weight:600;line-height:1}
.mobile-nav summary:after{display:none}

/* ---- Homepage scene cards: a tiny UI mock on a pastel header, short title, one line ---- */
.scene{display:grid;place-items:center;height:184px;padding:18px;border-radius:22px 22px 0 0;border-bottom:1px solid var(--line);background:radial-gradient(ellipse 70% 90% at 50% 125%,color-mix(in srgb,var(--tint) 34%,transparent),transparent 70%),linear-gradient(180deg,color-mix(in srgb,var(--tint) 16%,var(--surface-2)),color-mix(in srgb,var(--tint) 6%,var(--surface-2)))}
.v-card,.flow-card,.ex-card,.quote-card{position:relative;border:1px solid var(--line);border-radius:22px;background:var(--surface);box-shadow:var(--shadow);transition:transform .2s,box-shadow .2s,border-color .2s}
.v-card:hover,.flow-card:hover,.ex-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-hover);border-color:var(--line-2)}
.v-body{padding:22px 24px 24px}
.v-body h3{margin:0 0 6px;font-size:21px;font-weight:600;letter-spacing:-.03em}
.v-body p{margin:0;color:var(--muted);font-size:15px;line-height:1.55}
.v-link{display:inline-block;margin-top:14px;color:var(--accent);font-size:13px;font-weight:650;text-decoration:none}.v-link:hover{text-decoration:underline}
.ui-card{display:grid;gap:9px;width:min(82%,270px);padding:14px 15px;border:1px solid var(--line);border-radius:14px;background:var(--surface);box-shadow:0 10px 28px #0e11101c;color:var(--text);font-size:13px;line-height:1.35;text-align:left}
.ui-card b{font-weight:650}.ui-card small{display:block;margin-top:2px;color:var(--dim);font-size:11px}
.ui-label{margin:0;color:var(--dim);font-size:11px;font-weight:600;letter-spacing:.02em}
.ui-input{margin:0;padding:9px 11px;border:1px solid var(--line-2);border-radius:9px;background:var(--bg);font-size:13px}
.ui-btn{justify-self:end;padding:6px 14px;border-radius:999px;background:var(--cta-bg);color:var(--cta-fg);font-size:12px;font-weight:600}
.ui-btn-accent{background:var(--accent);color:#fff}
:root[data-theme=dark] .ui-btn-accent{color:#06240f}
.ui-row{display:flex;align-items:center;gap:10px}.ui-between{justify-content:space-between}
.ui-file{display:grid;place-items:center;width:30px;height:34px;border-radius:8px;background:var(--surface-2);border:1px solid var(--line);color:var(--muted);font:700 9px/1 ui-monospace,monospace}
.ui-chip{display:inline-block;padding:3px 9px;border-radius:999px;background:var(--ac14);color:var(--accent);font-size:11px;font-style:normal;font-weight:650}
.ui-ok{margin:0;font-size:13px}.ui-ok:before{content:"\2713";display:inline-grid;place-items:center;width:17px;height:17px;margin-right:8px;border-radius:50%;background:var(--ac14);color:var(--accent);font-size:10px;font-weight:800}
.ui-skel{display:block;width:70%;height:9px;border-radius:5px;background:var(--i8)}
.ui-toggle{position:relative;flex:none;width:34px;height:20px;border-radius:99px;background:var(--i12)}
.ui-toggle:after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #0003;transition:left .2s}
.ui-toggle.on{background:var(--accent)}.ui-toggle.on:after{left:16px}
.ui-caret:after{content:"\2304";color:var(--dim);font-size:14px;font-style:normal;line-height:1}
.ui-faces{display:flex;align-items:center;gap:4px}.ui-faces .mini{width:38px;height:38px}.ui-faces .ui-chip{margin-left:6px}
.ui-pair{display:flex;align-items:center;justify-content:center}.ui-pair .mini{width:62px;height:62px;padding:6px;border-radius:50%;background:var(--surface);box-shadow:0 8px 22px #0e11101f}
.ui-dot{display:block;width:26px;height:0;margin:0 2px;border-top:2.5px dotted color-mix(in srgb,var(--tint) 80%,var(--ink))}
.mini{display:block}.mini svg{display:block;width:100%;height:100%;overflow:visible}

/* Workflow */
.flow-section{margin:12px 0 0;padding:72px 0 24px}
.flow-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px;margin:0;padding:0;list-style:none}
.flow-card:not(:last-child):after{content:"\2192";position:absolute;z-index:3;top:76px;right:-30px;display:grid;place-items:center;width:30px;height:30px;border:1px solid var(--line-2);border-radius:50%;background:var(--surface);color:var(--accent);font-size:15px;box-shadow:var(--shadow)}
.flow-num{display:inline-block;margin:0 0 10px;color:var(--accent);font:700 12px/1 ui-monospace,monospace;letter-spacing:.1em}

/* Workspace + setup grids */
.bench-section{margin:0;padding:72px 0 24px}
.bench-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.setup-grid2{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.bench-grid .scene{height:164px}.bench-grid .v-body h3{font-size:19px}

/* Examples as a conversation */
.ex-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.ex-card{display:flex;flex-direction:column;padding:24px}
.ex-head{display:flex;align-items:center;gap:16px}
.ex-head .mascot{width:68px;height:68px;margin:0;flex:none}
.ex-head h3{margin:2px 0 0;font-size:22px;font-weight:600;letter-spacing:-.03em}
.ex-card .example-category{margin:0;display:inline-block;padding:3px 10px;border-radius:999px;background:color-mix(in srgb,var(--example-accent) 14%,transparent);color:var(--example-accent);font:700 10px/1.5 ui-monospace,monospace;letter-spacing:.1em;filter:var(--label-filter)}
.ex-chat{display:grid;gap:10px;margin:20px 0 18px}
.ex-chat span{display:block;margin:0 0 3px;color:var(--dim);font:600 10px/1.4 ui-monospace,monospace;letter-spacing:.08em;text-transform:uppercase}
.ex-chat p{margin:0;font-size:15px;line-height:1.5;color:var(--text)}
.ex-you,.ex-agent{padding:12px 16px;border-radius:16px;max-width:88%}
.ex-you{justify-self:end;background:var(--surface-2);border:1px solid var(--line);border-bottom-right-radius:5px}
.ex-agent{background:color-mix(in srgb,var(--example-accent) 11%,var(--surface));border:1px solid color-mix(in srgb,var(--example-accent) 28%,transparent);border-bottom-left-radius:5px}
.ex-link{margin-top:auto;color:var(--accent);font-size:13px;font-weight:650;text-decoration:none}.ex-link:hover{text-decoration:underline}

/* Testimonials: only rendered when real quotes are added to the page content */
.home-page .home-quotes-section{padding:72px 0 24px;border-top:0}
.home-quotes-section .home-section-heading,.flow-section .home-section-heading,.bench-section .home-section-heading{max-width:760px;margin:0 auto 44px;text-align:center}
.flow-section .home-section-heading>p:last-child,.bench-section .home-section-heading>p:last-child{margin-left:auto;margin-right:auto}
.quote-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.quote-card{display:flex;flex-direction:column;justify-content:space-between;gap:22px;margin:0;padding:24px}
.quote-card blockquote{margin:0}.quote-card p{margin:0;font-size:16px;line-height:1.6;color:var(--text)}
.quote-card figcaption{display:flex;align-items:center;gap:12px;font-size:14px;font-weight:600}.quote-card small{display:block;color:var(--dim);font-weight:450}
.quote-avatar{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--ac14);color:var(--accent);font-weight:700}

/* Closing characters peek up from the bottom of the panel */
.closing-cast{position:absolute;inset:0;pointer-events:none;z-index:0}
.cc{position:absolute;bottom:-26px;display:block}.cc svg{display:block;width:100%;height:100%;overflow:visible;filter:drop-shadow(0 12px 16px #0006)}
.cc-l1{left:5%;width:116px;height:116px;transform:rotate(-7deg)}.cc-l2{left:17%;width:84px;height:84px;bottom:-34px;transform:rotate(5deg)}
.cc-r2{right:5%;width:120px;height:120px;transform:rotate(7deg)}.cc-r1{right:17%;width:88px;height:88px;bottom:-34px;transform:rotate(-5deg)}
@media(max-width:1000px){.cc{display:none}.bench-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.setup-grid2,.quote-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.flow-steps{gap:16px}.flow-card:not(:last-child):after{display:none}}
@media(max-width:700px){.flow-steps,.ex-grid,.bench-grid,.setup-grid2,.quote-grid{grid-template-columns:1fr}.scene{height:168px}.ex-you,.ex-agent{max-width:100%}}

/* Testimonials row: scrolling quote cards with a pause button (only when real quotes exist) */
.quotes-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 28px}
.home-page .quotes-head h2{margin:0;font-size:clamp(32px,4vw,48px);letter-spacing:-.045em}
.quote-pause{display:inline-flex;align-items:center;justify-content:center;gap:4px;width:38px;height:38px;padding:0;border:1px solid var(--line-2);border-radius:50%;background:var(--surface);cursor:pointer}
.quote-pause i{display:block;width:3px;height:12px;border-radius:2px;background:var(--text)}
.quote-pause[aria-pressed=true] i:first-child{width:0;height:0;border-style:solid;border-width:6px 0 6px 10px;border-color:transparent transparent transparent var(--text);background:none;border-radius:0}.quote-pause[aria-pressed=true] i:last-child{display:none}
.quote-marquee{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.quote-track{display:flex;gap:16px;width:max-content;padding:6px 0 14px;animation:quote-scroll 70s linear infinite}
.quote-track.paused{animation-play-state:paused}
.quote-dup{display:contents}
.quote-marquee .quote-card{flex:none;width:350px;min-height:190px}
.quote-avatar{width:36px;height:36px;padding:0;background:none}.quote-avatar svg{display:block;width:100%;height:100%;overflow:visible}
@keyframes quote-scroll{to{transform:translateX(calc(-50% - 8px))}}
@media(prefers-reduced-motion:reduce){.quote-track{animation:none;width:auto;flex-wrap:wrap}.quote-dup{display:none}.quote-marquee{-webkit-mask-image:none;mask-image:none}.quote-pause{display:none}}

/* GitHub proof pill above the provider row */
.strip-proof{display:flex;justify-content:center;margin:0 0 34px}
.github-proof{display:inline-flex;align-items:center;gap:8px;padding:9px 18px;border:1px solid var(--line-2);border-radius:999px;background:var(--surface);color:var(--muted);font-size:14px;text-decoration:none;box-shadow:var(--shadow);transition:border-color .2s,transform .2s}
.github-proof:hover{border-color:var(--ac45);color:var(--text);transform:translateY(-2px)}
.github-proof b{color:var(--text);font-weight:650}.github-proof svg{width:15px;height:15px;color:#e8a317}
.account-nav{flex:0 0 auto;white-space:nowrap}
.account-nav>a{flex:0 0 auto;white-space:nowrap}
.desktop-nav{flex:1 1 auto;min-width:0;margin:0;justify-content:center}
.site-header .desktop-nav{gap:0}
.site-header .desktop-nav a{padding:6px 8px;white-space:nowrap}
.language-select{width:142px;max-width:142px;flex:0 0 142px;height:36px;padding:0 28px 0 11px;border:1px solid var(--line);border-radius:999px;background:var(--surface);color:var(--text);font:inherit;font-size:12px;font-weight:500;line-height:1.2;cursor:pointer}
.language-select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.mobile-language{display:none}
.site-language-note{margin-top:12px;color:var(--muted);font-size:11px;line-height:1.5}
@media(max-width:1050px){.account-nav{gap:9px}.account-nav .desktop-language{width:126px;max-width:126px;flex-basis:126px}}
@media(max-width:1180px){.desktop-nav{display:none}.mobile-nav{display:block}}
@media(max-width:850px){.mobile-nav .mobile-language{display:none}}
@media(max-width:560px){.site-header,.home-site .site-header{gap:10px}.account-nav{gap:7px}.account-nav>.button.compact{padding:7px 9px;gap:6px;font-size:11px}.mobile-nav summary{padding:7px 11px;font-size:12px}.account-nav .desktop-language{display:none}.mobile-nav nav .mobile-language{display:block;width:100%;max-width:none;height:38px;margin:3px 0 8px;padding:0 10px;border-radius:8px}}