@font-face{font-family:"Supreme";src:url('../fonts/fontshare/supreme-variable.woff2') format('woff2-variations');font-weight:100 800;font-display:swap}
@font-face{font-family:"Office Code Pro ERP";src:url('../fonts/open-foundry/office-code-pro/officecodepro-regular.otf') format('opentype');font-weight:400;font-display:swap}
@font-face{font-family:"Office Code Pro ERP";src:url('../fonts/open-foundry/office-code-pro/officecodepro-medium.otf') format('opentype');font-weight:500;font-display:swap}
/* Light only, by design. Layout: ERP.AI paper-beige system. One centred column, sections separated by hairlines; the app's accent appears only in the headline, buttons and data marks. */
:root{
  --bg:oklch(98.2% .0054 82); --bg-2:oklch(96.6% .0068 82); --surface:oklch(99.5% .003 82);
  --line:oklch(91% .012 81.5); --line-2:oklch(85% .014 81);
  --fg:oklch(15% .012 78); --fg-2:oklch(38% .008 78); --fg-3:oklch(50% .01 78);
  --accent:#9a3aa6; --accent-deep:#5e3f61; --accent-term:#d68ae0; --accent-soft:color-mix(in oklab, var(--accent) 12%, var(--bg));
  --ok:oklch(45% .13 150); --ok-soft:oklch(94% .05 150);
  --warn:oklch(47% .11 70); --warn-soft:oklch(94% .06 85);
  --bad:oklch(48% .17 28); --bad-soft:oklch(94% .04 28);
  --info:oklch(45% .1 250); --info-soft:oklch(94% .03 250);
  --term-bg:oklch(19% .01 78); --term-fg:oklch(92% .006 78); --term-dim:oklch(68% .008 78);
  --shadow:0 1px 2px rgb(30 25 20 / 6%), 0 18px 46px -20px rgb(30 25 20 / 22%);
  --f-display:"Mozilla Headline", "Clash Grotesk", ui-sans-serif, system-ui, sans-serif;
  --f-body:"Supreme", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --f-mono:"Office Code Pro ERP", "JetBrains Mono", ui-monospace, Menlo, monospace;
  --r:8px; --r-lg:14px;
  --wrap:1180px; --gutter:clamp(16px, 4vw, 40px);
  color-scheme:light;
}


*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:88px;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--fg);font:400 1rem/1.6 var(--f-body);-webkit-font-smoothing:antialiased}
a{color:inherit}
h1,h2,h3{font-family:var(--f-display);font-weight:700;letter-spacing:-.02em;line-height:1.02;margin:0;text-wrap:balance}
p{margin:0}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.wrap{max-width:var(--wrap);margin:0 auto;padding-inline:var(--gutter)}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}
.i{width:20px;height:20px;flex:none}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:.5rem;height:44px;padding:0 1.15rem;border-radius:var(--r);font:500 .9375rem/1 var(--f-body);text-decoration:none;white-space:nowrap;transition:transform .15s, box-shadow .15s, background-color .15s}
.btn .i{width:17px;height:17px}
.btn-primary{color:#fff;background:linear-gradient(145deg, color-mix(in oklab, var(--accent-deep) 72%, white), var(--accent-deep) 55%, color-mix(in oklab, var(--accent-deep) 78%, black));box-shadow:inset 0 1px 0 rgb(255 255 255 / 35%), 0 8px 24px -12px var(--accent-deep)}
.btn-primary:hover{transform:translateY(-1px);box-shadow:inset 0 1px 0 rgb(255 255 255 / 35%), 0 12px 28px -12px var(--accent-deep)}
.btn-ghost{color:var(--fg);background:var(--surface);box-shadow:inset 0 0 0 1px var(--line-2)}
.btn-ghost:hover{background:var(--bg-2)}
.btn-sm{height:36px;padding:0 .9rem;font-size:.875rem}

/* nav */
.nav{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:color-mix(in oklab, var(--bg) 88%, transparent);backdrop-filter:saturate(1.4) blur(12px);-webkit-backdrop-filter:saturate(1.4) blur(12px);border-bottom:1px solid var(--line)}
.nav .wrap{display:flex;align-items:center;gap:1.25rem;height:64px}
.brand{display:flex;align-items:center;gap:.75rem;text-decoration:none;color:var(--fg)}
.wordmark{height:20px;width:auto;color:var(--accent-deep)}
.brand-app{font:600 .9375rem/1 var(--f-body);padding-left:.75rem;border-left:1px solid var(--line-2);color:var(--fg-2)}
.nav-links{display:flex;gap:.25rem;margin-left:.75rem}
.nav-links a{font-size:.875rem;color:var(--fg-2);text-decoration:none;padding:.4rem .6rem;border-radius:6px}
.nav-links a:hover{color:var(--fg);background:var(--bg-2)}
.nav-end{margin-left:auto;display:flex;align-items:center;gap:.5rem}
.nav-end .signin{font-size:.875rem;text-decoration:none;color:var(--fg-2);padding:.4rem .6rem}
.nav-end .signin:hover{color:var(--fg)}
@media (max-width:940px){.nav-links{display:none}}
@media (max-width:420px){.nav-end .signin{display:none}.brand-app{display:none}}

/* sections */
section{padding-block:clamp(3.5rem, 7vw, 5.5rem);border-top:1px solid var(--line)}
.eyebrow{font:500 .75rem/1 var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--accent)}
.head{display:grid;gap:.9rem;max-width:44rem;margin-bottom:clamp(2rem, 5vw, 3.25rem)}
.head h2{font-size:clamp(2rem, 4.2vw, 3rem)}
.head p{font-size:1.0625rem;color:var(--fg-2);max-width:38rem}
.more{display:inline-flex;align-items:center;gap:.4rem;font-weight:500;font-size:.9375rem;color:var(--accent);text-decoration:none}
.more .i{width:16px;height:16px;transition:transform .15s}
.more:hover .i{transform:translateX(3px)}

/* hero */
.hero{border-top:0;padding-block:clamp(3.5rem, 8vw, 5.5rem) clamp(2.5rem, 5vw, 3.5rem);text-align:center}
.hero .eyebrow{display:inline-flex;align-items:center;gap:.5rem;padding:.45rem .7rem;border-radius:999px;background:var(--accent-soft)}
.hero .eyebrow .live{width:7px;height:7px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 3px var(--ok-soft)}
.hero h1{font-size:clamp(2.75rem, 7.4vw, 5.25rem);line-height:.95;letter-spacing:-.03em;margin:1.4rem auto 0;max-width:13ch}
.hero h1 em{font-style:normal;color:var(--accent);display:block}
.hero .lede{font-size:clamp(1.0625rem, 1.6vw, 1.1875rem);color:var(--fg-2);max-width:40rem;margin:1.5rem auto 0}
.hero .ctas{display:flex;flex-wrap:wrap;justify-content:center;gap:.75rem;margin-top:2rem}
.proof{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem 1.5rem;margin:1.5rem 0 0;padding:0;list-style:none;font-size:.875rem;color:var(--fg-3)}
.proof li{display:flex;align-items:center;gap:.4rem}
.proof .i{width:16px;height:16px;color:var(--ok)}
.hero-shot{margin-top:clamp(2.5rem, 6vw, 4rem);text-align:left}

/* window card + table */
.win{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow);overflow:hidden;min-width:0}
.win-bar{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap;padding:.8rem 1rem;border-bottom:1px solid var(--line);background:var(--bg-2)}
.dots{display:flex;gap:6px}.dots i{width:10px;height:10px;border-radius:50%;background:var(--line-2)}
.win-title{font-weight:600;font-size:.9375rem}
.win-filter{font:400 .75rem/1.3 var(--f-mono);color:var(--fg-3);padding:.3rem .55rem;border:1px dashed var(--line-2);border-radius:6px}
.win-foot{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;padding:.7rem 1rem;border-top:1px solid var(--line);font:400 .8125rem/1.4 var(--f-mono);color:var(--fg-3)}
.table-wrap{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:.875rem}
th,td{padding:.7rem 1rem;text-align:left;white-space:nowrap;border-bottom:1px solid var(--line)}
tbody tr:last-child td{border-bottom:0}
th{font:500 .75rem/1.2 var(--f-mono);letter-spacing:.03em;color:var(--fg-3);background:var(--surface)}
td{color:var(--fg-2)}
td:first-child{color:var(--fg);font-weight:500}
.num{text-align:right;font-variant-numeric:tabular-nums}
tbody tr:hover td{background:var(--bg-2)}
.pill{display:inline-block;padding:.18rem .55rem;border-radius:999px;font-size:.75rem;font-weight:500;line-height:1.4}
.pill-ok{color:var(--ok);background:var(--ok-soft)}
.pill-warn{color:var(--warn);background:var(--warn-soft)}
.pill-bad{color:var(--bad);background:var(--bad-soft)}
.pill-info{color:var(--info);background:var(--info-soft)}
.pill-muted{color:var(--fg-2);background:var(--bg-2);box-shadow:inset 0 0 0 1px var(--line)}
.pill-stage{color:var(--accent);background:var(--accent-soft)}

/* stats */
.stats{display:grid;grid-template-columns:repeat(4, 1fr);margin:clamp(2.5rem,5vw,3.5rem) 0 0;border-top:1px solid var(--line)}
.stats div{padding:1.4rem 1.25rem 0;border-left:1px solid var(--line)}
.stats div:first-child{border-left:0;padding-left:0}
.stats dt{font-size:.875rem;color:var(--fg-3);margin-top:.35rem}
.stats dd{margin:0;font:700 clamp(2rem,4vw,2.75rem)/1 var(--f-display);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.stats div{display:flex;flex-direction:column-reverse;justify-content:flex-end}
@media (max-width:700px){.stats{grid-template-columns:1fr 1fr}.stats div:nth-child(3){border-left:0;padding-left:0}.stats div{padding-bottom:1.25rem}}

/* modules */
.modules{display:grid;grid-template-columns:repeat(4, minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden}
.mod{display:flex;flex-direction:column;gap:.85rem;padding:1.5rem;background:var(--surface);text-decoration:none;color:inherit;transition:background-color .15s}
.mod:hover{background:var(--bg-2)}
.mod .ico{width:40px;height:40px;display:grid;place-items:center;border-radius:10px;background:var(--accent-soft);color:var(--accent)}
.mod h3{font-size:1.3rem;letter-spacing:-.01em}
.mod p{font-size:.9375rem;color:var(--fg-2)}
.mod ul{list-style:none;margin:0;padding:0;display:grid;gap:.45rem;font-size:.875rem;color:var(--fg-2)}
.mod li{display:flex;gap:.5rem;align-items:flex-start}
.mod li .i{width:16px;height:16px;margin-top:.2rem;color:var(--accent)}
.mod .more{margin-top:auto;padding-top:.4rem}
@media (max-width:1040px){.modules{grid-template-columns:repeat(2, minmax(0,1fr))}}
@media (max-width:560px){.modules{grid-template-columns:1fr}}

/* process */
.flow{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(var(--n), minmax(0,1fr));gap:0;counter-reset:step}
.flow li{position:relative;padding:0 1.25rem 0 0}
.flow .dot{position:relative;display:flex;align-items:center;height:44px}
.flow .dot::before{content:counter(step, decimal-leading-zero);counter-increment:step;flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--surface);border:1px solid var(--line-2);font:500 .8125rem/1 var(--f-mono);color:var(--fg-2);position:relative;z-index:1}
.flow li:not(:last-child) .dot::after{content:"";position:absolute;left:44px;right:-1.25rem;top:50%;height:1px;background:var(--line-2)}
.flow li:last-child .dot::before{background:var(--accent-deep);border-color:var(--accent-deep);color:#fff}
.flow h3{font-size:1.25rem;margin-top:1rem}
.flow p{font-size:.9375rem;color:var(--fg-2);margin-top:.4rem}
.gate{display:flex;gap:.55rem;align-items:flex-start;margin-top:.9rem;padding:.7rem .8rem;border-radius:var(--r);background:var(--accent-soft);color:var(--fg);font-size:.8125rem;line-height:1.45}
.gate .i{width:17px;height:17px;color:var(--accent);margin-top:.05rem}
.gate b{display:block;font-weight:600;color:var(--accent);font-size:.75rem;letter-spacing:.02em;text-transform:uppercase;margin-bottom:.1rem}
.others{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;margin-top:3rem;padding-top:1.5rem;border-top:1px solid var(--line)}
.others span{font-size:.875rem;color:var(--fg-3);margin-right:.5rem}
.chip{display:inline-flex;align-items:center;gap:.35rem;padding:.45rem .8rem;border-radius:999px;border:1px solid var(--line-2);font-size:.875rem;text-decoration:none;color:var(--fg-2);background:var(--surface)}
.chip:hover{color:var(--fg);border-color:var(--fg-3)}
@media (max-width:860px){
  .flow{grid-template-columns:1fr;gap:0}
  .flow li{display:grid;grid-template-columns:44px 1fr;column-gap:1rem;padding:0 0 1.75rem}
  .flow .dot{grid-row:span 9;align-items:flex-start}
  .flow li > :not(.dot){grid-column:2;min-width:0}
  .flow li:not(:last-child) .dot::after{left:22px;right:auto;top:44px;bottom:-1.75rem;width:1px;height:auto}
  .flow h3{margin-top:.55rem}
}

/* roles */
.role-tabs{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:2rem}
.role-tab{all:unset;cursor:pointer;padding:.55rem .95rem;border-radius:999px;border:1px solid var(--line-2);background:var(--surface);font-size:.875rem;font-weight:500;color:var(--fg-2);white-space:nowrap}
.role-tab:hover{color:var(--fg);border-color:var(--fg-3)}
.role-tab[aria-selected="true"]{background:var(--accent-deep);border-color:var(--accent-deep);color:#fff}
.role-tab:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.role-panel{display:grid;grid-template-columns:minmax(0,17rem) minmax(0,1fr);gap:clamp(1.25rem,3vw,2.5rem);align-items:start}
.role-panel[hidden]{display:none}
.role-about h3{font-size:1.5rem}
.role-about p{color:var(--fg-2);margin-top:.6rem}
.role-about .note{font-size:.8125rem;color:var(--fg-3);margin-top:1rem}
.roles-foot{margin-top:1.75rem}
@media (max-width:860px){
  .role-tabs{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:.25rem}
  .role-panel{grid-template-columns:1fr}
}

/* reports */
.reports{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(1.5rem,4vw,3rem);align-items:start}
.chart{position:sticky;top:88px;margin:0;padding:1.5rem;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow)}
.chart figcaption{display:grid;gap:1.25rem}
.chart h3{font-size:1.35rem}
.chart figcaption p{font-size:.875rem;color:var(--fg-3);margin-top:.35rem}
.chart-totals{display:grid;grid-template-columns:repeat(3, auto);justify-content:start;gap:2rem;margin:0}
.chart-totals dt{font-size:.75rem;color:var(--fg-3)}
.chart-totals dd{margin:.15rem 0 0;font:700 1.35rem/1 var(--f-display);font-variant-numeric:tabular-nums}
.legend{display:flex;gap:1.25rem;margin:1.5rem 0 .75rem;font-size:.75rem;color:var(--fg-3)}
.legend span{display:flex;align-items:center;gap:.4rem}
.sw{width:10px;height:10px;border-radius:2px;display:inline-block}
.sw-a{background:color-mix(in oklab, var(--accent) 28%, var(--bg-2))}.sw-w{background:var(--accent)}
.bars{list-style:none;margin:0;padding:0;display:grid;gap:1rem}
.bars li{display:grid;grid-template-columns:7.5rem minmax(0,1fr) 5.5rem;gap:1rem;align-items:center}
.bar-label,.bar-val{display:grid;line-height:1.3}
.bar-label b,.bar-val b{font-weight:600;font-size:.875rem;font-variant-numeric:tabular-nums}
.bar-label small,.bar-val small{font-size:.75rem;color:var(--fg-3);font-variant-numeric:tabular-nums}
.bar-val{text-align:right}
.bar-track{position:relative;height:28px;border-radius:4px;background:var(--bg-2)}
.bar{position:absolute;left:0;top:0;bottom:0;border-radius:4px}
.bar-a{background:color-mix(in oklab, var(--accent) 28%, var(--bg-2))}
.bar-w{background:var(--accent);top:7px;bottom:7px;border-radius:0 3px 3px 0}
@media (max-width:560px){.bars li{grid-template-columns:1fr auto}.bar-track{grid-column:1/-1;grid-row:2}.chart-totals{gap:1.25rem}}
.report-list{list-style:none;margin:0;padding:0;display:grid}
.report-list li{display:grid;grid-template-columns:2.25rem 1fr;gap:.1rem .5rem;padding:.7rem 0;border-bottom:1px solid var(--line)}
.report-list li:first-child{padding-top:0}
.report-list .n{font:500 .75rem/1.6 var(--f-mono);color:var(--fg-3);grid-row:span 2}
.report-list b{font-weight:600}
.report-list p{font-size:.875rem;color:var(--fg-2)}
.reports .more{margin-top:1.25rem}
@media (max-width:900px){.reports{grid-template-columns:1fr}.chart{position:static}}

/* industries + related cards */
.cards{display:grid;grid-template-columns:repeat(var(--cols,4), minmax(0,1fr));gap:1rem}
.card{display:flex;flex-direction:column;gap:.6rem;padding:1.35rem;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface);text-decoration:none;color:inherit;transition:border-color .15s, transform .15s}
.card:hover{border-color:var(--line-2);transform:translateY(-2px)}
.card h3{font-size:1.15rem;display:flex;justify-content:space-between;gap:.75rem;align-items:flex-start;letter-spacing:-.01em}
.card h3 .i{width:18px;height:18px;color:var(--fg-3);transition:color .15s, transform .15s;margin-top:.1rem}
.card:hover h3 .i{color:var(--accent);transform:translateX(3px)}
.card p{font-size:.9rem;color:var(--fg-2)}
.card .tag{font:500 .6875rem/1 var(--f-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--fg-3)}
@media (max-width:1000px){.cards{--cols:2 !important}}
@media (max-width:560px){.cards{--cols:1 !important}}

/* agent */
.agent{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(2rem,5vw,4rem);align-items:center}
.agent .head{margin-bottom:1.75rem}
.integrations{display:grid;grid-template-columns:repeat(2, minmax(0,1fr));gap:1.1rem 1.5rem;margin:0}
.integrations dt{font:500 .6875rem/1 var(--f-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--fg-3)}
.integrations dd{margin:.4rem 0 0;font-size:.9375rem}
.agent .ctas{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:2rem}
.term{background:var(--term-bg);color:var(--term-fg);border-radius:var(--r-lg);box-shadow:var(--shadow);overflow:hidden;font:400 .8125rem/1.65 var(--f-mono);min-width:0}
.term-bar{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;border-bottom:1px solid rgb(255 255 255 / 8%);color:var(--term-dim);font-size:.75rem}
.term-bar .dots i{background:rgb(255 255 255 / 16%)}
.term-body{padding:1.1rem 1.25rem 1.4rem;display:grid;gap:.35rem;overflow-x:auto}
.term .cmd{color:var(--term-fg)}
.term .cmd::before{content:"› ";color:var(--accent-term)}
.term .out{color:var(--term-dim);padding-left:1rem;margin-bottom:.5rem}
.term .warn{color:oklch(84% .12 85);padding-left:1rem;display:flex;gap:.4rem;align-items:flex-start}
.term .warn .i{width:15px;height:15px;margin-top:.2rem}
@media (max-width:900px){.agent{grid-template-columns:1fr}}

/* implementation */
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(var(--n), minmax(0,1fr));gap:1rem;counter-reset:s}
.steps li{padding-top:1rem;border-top:2px solid var(--line-2)}
.steps li:first-child{border-top-color:var(--accent)}
.steps li::before{counter-increment:s;content:"Step " counter(s);font:500 .75rem/1 var(--f-mono);color:var(--fg-3);letter-spacing:.04em}
.steps h3{font-size:1.1rem;margin-top:.65rem;letter-spacing:-.01em}
.steps p{font-size:.875rem;color:var(--fg-2);margin-top:.4rem}
@media (max-width:1000px){.steps{grid-template-columns:repeat(2, minmax(0,1fr));row-gap:1.75rem}}
@media (max-width:560px){.steps{grid-template-columns:1fr}}

/* pricing */
.pricing{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(2rem,5vw,4rem);align-items:start}
.price{font:800 clamp(4rem,10vw,6.5rem)/.9 var(--f-body);letter-spacing:-.05em}
.price small{font:500 1rem/1 var(--f-body);letter-spacing:0;color:var(--fg-3);margin-left:.5rem}
.pricing .lede{font-size:1.0625rem;color:var(--fg-2);margin-top:1rem;max-width:30rem}
.checks{list-style:none;margin:1.5rem 0 0;padding:0;display:grid;gap:.6rem}
.checks li{display:flex;gap:.6rem;font-size:.9375rem}
.checks .i{width:18px;height:18px;color:var(--ok);margin-top:.15rem}
.rate{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden}
.rate h3{font:600 .9375rem/1.3 var(--f-body);letter-spacing:0;padding:1rem;border-bottom:1px solid var(--line);background:var(--bg-2);display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.rate h3 span{font-weight:400;color:var(--fg-3);font-size:.8125rem}
.rate td:first-child{font-weight:400;color:var(--fg)}
@media (max-width:900px){.pricing{grid-template-columns:1fr}}

/* faq */
.faq{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:clamp(2rem,5vw,4rem);align-items:start}
.faq .head{position:sticky;top:96px}
.qa{border-top:1px solid var(--line)}
.qa details{border-bottom:1px solid var(--line)}
.qa summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:1rem;padding:1.1rem 0;font-weight:600;font-size:1.0625rem}
.qa summary::-webkit-details-marker{display:none}
.qa summary .i{width:18px;height:18px;color:var(--fg-3);transition:transform .2s;margin-top:.2rem}
.qa details[open] summary .i{transform:rotate(45deg);color:var(--accent)}
.qa details p{padding:0 2rem 1.25rem 0;color:var(--fg-2);max-width:40rem}
@media (max-width:900px){.faq{grid-template-columns:1fr}.faq .head{position:static}}

/* closing cta */
.closing{text-align:center}
.closing h2{font-size:clamp(2.25rem,5.5vw,3.75rem);max-width:16ch;margin:0 auto}
.closing h2 em{font-style:normal;color:var(--accent)}
.closing p{color:var(--fg-2);margin:1.1rem auto 0;max-width:34rem;font-size:1.0625rem}
.closing .ctas{display:flex;flex-wrap:wrap;justify-content:center;gap:.75rem;margin-top:2rem}

/* footer */
footer{border-top:1px solid var(--line);background:var(--bg-2);padding-block:2.5rem;font-size:.875rem;color:var(--fg-3)}
footer .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1.25rem}
footer nav{display:flex;flex-wrap:wrap;gap:.25rem 1.25rem}
footer a{text-decoration:none;color:var(--fg-2)}
footer a:hover{color:var(--fg)}
footer .wordmark{height:16px;color:var(--fg-2)}

@media (prefers-reduced-motion:reduce){*{transition:none !important;scroll-behavior:auto !important}}

/* ---------- header menus (shared by every page) ---------- */
.menus{display:flex;gap:.1rem;margin-left:.75rem}
.menu{position:relative}
.menu > button{all:unset;cursor:pointer;display:flex;align-items:center;gap:.3rem;font-size:.875rem;color:var(--fg-2);padding:.45rem .6rem;border-radius:6px}
.menu > button .i{width:14px;height:14px;transition:transform .15s}
.menu:hover > button,.menu:focus-within > button{color:var(--fg);background:var(--bg-2)}
.menu:hover > button .i,.menu:focus-within > button .i{transform:rotate(180deg)}
.menu > button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.menu-panel{position:absolute;left:-.5rem;top:100%;padding-top:.5rem;opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity .15s, transform .15s, visibility .15s}
.menu:hover .menu-panel,.menu:focus-within .menu-panel{opacity:1;visibility:visible;transform:none}
.menu-panel ul{list-style:none;margin:0;padding:.4rem;min-width:15rem;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow);display:grid}
.menu-panel a{display:grid;gap:.1rem;padding:.55rem .7rem;border-radius:6px;text-decoration:none;font-size:.875rem;color:var(--fg)}
.menu-panel a small{color:var(--fg-3);font-size:.75rem;line-height:1.35}
.menu-panel a:hover,.menu-panel a[aria-current="page"]{background:var(--bg-2)}
.menu-panel a[aria-current="page"]{color:var(--accent)}
.menu-panel .all{border-top:1px solid var(--line);margin-top:.3rem;padding-top:.3rem}
.mobile-menu{display:none;margin-left:auto}
.mobile-menu summary{list-style:none;cursor:pointer;display:grid;place-items:center;width:40px;height:40px;border-radius:var(--r);border:1px solid var(--line-2);background:var(--surface)}
.mobile-menu summary::-webkit-details-marker{display:none}
.mobile-menu[open] .sheet{display:grid}
.mobile-menu .sheet{display:none;position:absolute;left:0;right:0;top:64px;max-height:calc(100vh - 64px);overflow:auto;background:var(--bg);border-bottom:1px solid var(--line);padding:1rem var(--gutter) 1.5rem;gap:1.25rem;box-shadow:var(--shadow)}
.mobile-menu .sheet h4{margin:0 0 .4rem;font:500 .6875rem/1 var(--f-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--fg-3)}
.mobile-menu .sheet ul{list-style:none;margin:0;padding:0;display:grid}
.mobile-menu .sheet a{display:block;padding:.45rem 0;text-decoration:none;color:var(--fg)}
@media (max-width:1000px){.menus{display:none}.mobile-menu{display:block}.nav-end{margin-left:0}}

/* ---------- subpage hero ---------- */
.crumbs{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center;font-size:.8125rem;color:var(--fg-3);margin:0 0 1.5rem;padding:0;list-style:none}
.crumbs a{color:var(--fg-2);text-decoration:none}
.crumbs a:hover{color:var(--accent)}
.crumbs li + li::before{content:"/";margin-right:.4rem;color:var(--line-2)}
.page-hero{border-top:0;padding-block:clamp(2.5rem,6vw,4rem) clamp(2.5rem,5vw,3.5rem)}
.page-hero .eyebrow{display:block;margin-bottom:1rem}
.page-hero h1{font-size:clamp(2.4rem,5.6vw,4.25rem);letter-spacing:-.03em;line-height:.98;max-width:18ch}
.page-hero h1 em{font-style:normal;color:var(--accent)}
.page-hero .lede{font-size:clamp(1.0625rem,1.6vw,1.1875rem);color:var(--fg-2);max-width:44rem;margin-top:1.25rem}
.page-hero .ctas{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1.75rem}
.page-hero .shot{margin-top:clamp(2rem,5vw,3rem)}
.facts{display:grid;grid-template-columns:repeat(auto-fit, minmax(14rem,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;margin-top:2rem}
.facts div{background:var(--surface);padding:1rem 1.25rem}
.facts dt{font:500 .6875rem/1 var(--f-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--fg-3)}
.facts dd{margin:.5rem 0 0;font-size:.9375rem}
section.tight{padding-block:clamp(2.5rem,5vw,4rem)}
.h2{font-size:clamp(1.6rem,3vw,2.1rem);margin-bottom:1.5rem}
.sub-h{display:flex;justify-content:space-between;align-items:end;gap:1rem;flex-wrap:wrap;margin-bottom:1.5rem}
.sub-h .h2{margin:0}

/* capability grid */
.caps{display:grid;grid-template-columns:repeat(3, minmax(0,1fr));gap:2rem 2.5rem}
.cap{padding-top:1rem;border-top:1px solid var(--line-2)}
.cap h3{font:600 1.0625rem/1.3 var(--f-body);letter-spacing:0}
.cap p{font-size:.9375rem;color:var(--fg-2);margin-top:.4rem}
.caps.two{grid-template-columns:repeat(2, minmax(0,1fr))}
.caps.four{grid-template-columns:repeat(4, minmax(0,1fr))}
@media (max-width:900px){.caps,.caps.four{grid-template-columns:repeat(2, minmax(0,1fr))}}
@media (max-width:560px){.caps,.caps.two,.caps.four{grid-template-columns:1fr}}

/* two columns */
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(2rem,5vw,4rem);align-items:start}
.split.wide-left{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr)}
@media (max-width:900px){.split,.split.wide-left{grid-template-columns:1fr}}

/* definition rows */
.rows{margin:0;border-top:1px solid var(--line)}
.rows > div{display:grid;grid-template-columns:minmax(0,11rem) minmax(0,1fr);gap:.25rem 1.5rem;padding:.85rem 0;border-bottom:1px solid var(--line)}
.rows dt{font-weight:600;font-size:.9375rem}
.rows dd{margin:0;font-size:.9375rem;color:var(--fg-2)}
.rows dt a{text-decoration:none}
.rows dt a:hover{color:var(--accent)}
@media (max-width:560px){.rows > div{grid-template-columns:1fr}}

/* tags */
.tags{display:flex;flex-wrap:wrap;gap:.4rem;margin:0;padding:0;list-style:none}
.tag-chip{display:inline-flex;align-items:center;padding:.25rem .6rem;border-radius:999px;font-size:.75rem;font-weight:500;background:var(--bg-2);color:var(--fg-2);box-shadow:inset 0 0 0 1px var(--line);text-decoration:none}
a.tag-chip:hover{color:var(--accent);box-shadow:inset 0 0 0 1px var(--line-2)}
.tag-chip.accent{background:var(--accent-soft);color:var(--accent);box-shadow:none}

/* pager */
.pager{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.pager a{display:grid;gap:.3rem;padding:1.1rem 1.25rem;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface);text-decoration:none;color:var(--fg);transition:border-color .15s}
.pager a:hover{border-color:var(--line-2)}
.pager small{font:500 .6875rem/1 var(--f-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--fg-3)}
.pager b{font:700 1.2rem/1.2 var(--f-display);letter-spacing:-.01em}
.pager .next{text-align:right}
@media (max-width:560px){.pager{grid-template-columns:1fr}.pager .next{text-align:left}}

/* vertical timeline (process + implementation) */
.timeline{list-style:none;margin:0;padding:0;counter-reset:t}
.timeline > li{position:relative;display:grid;grid-template-columns:44px minmax(0,1fr);column-gap:1.25rem;padding-bottom:2rem}
.timeline > li::before{counter-increment:t;content:counter(t, decimal-leading-zero);grid-row:span 9;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--surface);border:1px solid var(--line-2);font:500 .8125rem/1 var(--f-mono);color:var(--fg-2);position:relative;z-index:1}
.timeline > li:not(:last-child)::after{content:"";position:absolute;left:22px;top:44px;bottom:0;width:1px;background:var(--line-2)}
.timeline > li:last-child{padding-bottom:0}
.timeline h3{font-size:1.3rem;margin-top:.55rem;display:flex;flex-wrap:wrap;gap:.6rem;align-items:center}
.timeline p{color:var(--fg-2);margin-top:.4rem;max-width:42rem}
.timeline .gate{max-width:34rem}
.timeline ul{margin:.75rem 0 0;padding:0;list-style:none;display:grid;gap:.35rem;font-size:.9375rem;color:var(--fg-2)}
.timeline ul li{display:flex;gap:.5rem}
.timeline ul .i{width:16px;height:16px;margin-top:.25rem;color:var(--accent)}
.owner{font:500 .75rem/1 var(--f-body);letter-spacing:0;padding:.3rem .55rem;border-radius:999px;background:var(--bg-2);box-shadow:inset 0 0 0 1px var(--line);color:var(--fg-2)}
.side-box{border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface);padding:1.25rem;display:grid;gap:1.25rem;position:sticky;top:88px}
.side-box h3{font:500 .6875rem/1 var(--f-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--fg-3);margin-bottom:.6rem}
.side-box ul{list-style:none;margin:0;padding:0;display:grid;gap:.35rem}
.side-box a{text-decoration:none;color:var(--fg);font-size:.9375rem;display:flex;justify-content:space-between;gap:.5rem}
.side-box a:hover{color:var(--accent)}
.side-box a .i{width:16px;height:16px;color:var(--fg-3)}
@media (max-width:900px){.side-box{position:static}}

/* permission matrix */
.matrix th:not(:first-child),.matrix td:not(:first-child){text-align:center}
.perm{display:inline-block;min-width:4.5rem;padding:.2rem .5rem;border-radius:999px;font-size:.75rem;font-weight:500}
.perm-own{background:var(--accent-deep);color:#fff}
.perm-approve{background:var(--accent-soft);color:var(--accent)}
.perm-edit{background:var(--info-soft);color:var(--info)}
.perm-view{background:var(--bg-2);color:var(--fg-2);box-shadow:inset 0 0 0 1px var(--line)}
.perm-none{color:var(--fg-3)}
.legend-row{display:flex;flex-wrap:wrap;gap:.75rem 1.25rem;margin-top:1rem;font-size:.8125rem;color:var(--fg-3)}
.legend-row span{display:flex;gap:.45rem;align-items:center}

/* role + report cards */
.boxes{display:grid;grid-template-columns:repeat(2, minmax(0,1fr));gap:1rem}
.box{border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface);padding:1.5rem;display:grid;gap:1rem;align-content:start;scroll-margin-top:88px}
.box h3{font-size:1.35rem;display:flex;justify-content:space-between;gap:1rem;align-items:baseline;flex-wrap:wrap}
.box h3 .tag-chip{font-family:var(--f-body);letter-spacing:0}
.box > p{color:var(--fg-2)}
.box h4{margin:0 0 .45rem;font:500 .6875rem/1 var(--f-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--fg-3)}
.box ul.ticks{list-style:none;margin:0;padding:0;display:grid;gap:.35rem;font-size:.9375rem}
.box ul.ticks li{display:flex;gap:.5rem}
.box ul.ticks .i{width:16px;height:16px;margin-top:.25rem;flex:none}
.ticks .yes .i{color:var(--ok)} .ticks .appr .i{color:var(--accent)} .ticks .no .i{color:var(--bad)}
.box .foot{display:flex;flex-wrap:wrap;gap:.5rem 1rem;align-items:center;padding-top:1rem;border-top:1px solid var(--line);font-size:.8125rem;color:var(--fg-3)}
@media (max-width:860px){.boxes{grid-template-columns:1fr}}

/* data model */
.dm{display:grid;gap:2.5rem}
.dm-group{display:grid;grid-template-columns:minmax(0,15rem) minmax(0,1fr);gap:1.5rem 2.5rem;padding-top:1.5rem;border-top:1px solid var(--line-2)}
.dm-group h3{font-size:1.3rem}
.dm-group h3 + p{font-size:.875rem;color:var(--fg-3);margin-top:.4rem}
.dm-group h3 + p a{color:var(--accent);text-decoration:none}
.dm-tables{display:grid;grid-template-columns:repeat(2, minmax(0,1fr));gap:.9rem 2rem;margin:0}
.dm-tables dt{font-weight:600;font-size:.9375rem}
.dm-tables dd{margin:.15rem 0 0;font-size:.875rem;color:var(--fg-2)}
@media (max-width:900px){.dm-group{grid-template-columns:1fr}}
@media (max-width:560px){.dm-tables{grid-template-columns:1fr}}

/* integration direction pills */
.dir{display:inline-block;padding:.15rem .5rem;border-radius:999px;font-size:.75rem;font-weight:500}
.dir-in{background:var(--info-soft);color:var(--info)}
.dir-out{background:var(--ok-soft);color:var(--ok)}
.dir-both{background:var(--accent-soft);color:var(--accent)}
td.wrap-cell{white-space:normal;min-width:16rem}

/* code */
.code{display:flex;align-items:center;gap:.75rem;margin-top:.75rem;padding:.6rem .6rem .6rem 1rem;border-radius:var(--r);background:var(--term-bg);color:var(--term-fg);font:400 .8125rem/1.5 var(--f-mono);max-width:40rem}
.code code{flex:1;min-width:0;overflow-x:auto;white-space:nowrap}
.code button{all:unset;cursor:pointer;font:500 .75rem/1 var(--f-body);padding:.45rem .65rem;border-radius:6px;background:rgb(255 255 255 / 10%);color:var(--term-fg)}
.code button:hover{background:rgb(255 255 255 / 18%)}
.code button:focus-visible{outline:2px solid var(--accent-term)}

/* pricing examples */
.price-hero{display:flex;align-items:baseline;gap:.75rem;flex-wrap:wrap}
.footnote{font-size:.8125rem;color:var(--fg-3);margin-top:.9rem}

/* get started */
.start-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4, minmax(0,1fr));gap:1rem;counter-reset:g}
.start-steps li{border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface);padding:1.5rem;display:flex;flex-direction:column;gap:.6rem}
.start-steps li::before{counter-increment:g;content:counter(g);display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--accent-soft);color:var(--accent);font:600 .875rem/1 var(--f-mono)}
.start-steps h3{font-size:1.2rem;letter-spacing:-.01em}
.start-steps p{font-size:.9375rem;color:var(--fg-2)}
.start-steps .btn{margin-top:auto;align-self:flex-start}
@media (max-width:1000px){.start-steps{grid-template-columns:repeat(2, minmax(0,1fr))}}
@media (max-width:560px){.start-steps{grid-template-columns:1fr}}

.boxes > .box:last-child:nth-child(odd){grid-column:1/-1}
.int table{table-layout:fixed;min-width:640px}
.stack{display:grid;gap:2.5rem}
.stack > *{min-width:0}
.int th:nth-child(1){width:24%}.int th:nth-child(2){width:15%}
.int td{white-space:normal}

/* ---------- process: people, swimlane, step rows ---------- */
.who{display:inline-flex;align-items:center;gap:.6rem}
.who-av{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--accent-soft);color:var(--accent);font:600 .75rem/1 var(--f-body);flex:none}
.who > span:last-child{display:grid;line-height:1.25}
.who b{font-weight:600;font-size:.9375rem}
.who small{font-size:.8125rem;color:var(--fg-3)}
.lanes-sec{padding-top:0}
.lanes-scroll{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface)}
.lanes,.dmap{display:block;width:100%;height:auto;font-family:var(--f-body)}
.ln-lane-a{fill:var(--surface)} .ln-lane-b{fill:var(--bg-2)}
.ln-divider{stroke:var(--line)}
.ln-av{fill:var(--accent-soft)}
.ln-av-t{font-size:11px;font-weight:600;fill:var(--accent)}
.ln-name{font-size:13px;font-weight:600;fill:var(--fg)}
.ln-role{font-size:11.5px;fill:var(--fg-3)}
.ln-edge{fill:none;stroke:var(--line-2);stroke-width:1.5}
.ln-arrowhead{fill:var(--fg-3)}
.ln-node rect:first-child{fill:#fff;stroke:var(--line-2);stroke-width:1}
.ln-node.is-appr rect:first-child{stroke:var(--accent);stroke-width:1.5;fill:color-mix(in oklab, var(--accent) 5%, #fff)}
.ln-n{font:500 10.5px var(--f-mono);fill:var(--fg-3)}
.ln-step{font-size:12.5px;font-weight:600;fill:var(--fg)}
.ln-tag{fill:var(--accent-soft)}
.ln-tag-t{font-size:9px;font-weight:600;fill:var(--accent);letter-spacing:.02em}
.lanes-key{display:flex;align-items:center;gap:.5rem;font-size:.8125rem;color:var(--fg-3)}
.lanes-key i{display:inline-block;width:18px;height:12px;border-radius:4px;border:1px solid var(--line-2);background:#fff}
.lanes-key .k-appr{border:1.5px solid var(--accent);background:color-mix(in oklab, var(--accent) 5%, #fff);margin-left:.75rem}

.timeline.with-aside > li{grid-template-columns:44px minmax(0,1fr) minmax(0,17rem);column-gap:1.5rem;padding-bottom:2.25rem}
.timeline.with-aside > li > :not(.step-aside){grid-column:2}
.step-aside{grid-column:3;grid-row:1 / span 6;display:grid;gap:.25rem;align-content:start;padding-top:.35rem}
.step-aside .flow-card{margin-right:0}
@media (max-width:900px){
  .timeline.with-aside > li{grid-template-columns:44px minmax(0,1fr)}
  .step-aside{grid-column:2;grid-row:auto;margin-top:.9rem}
}

.touch{display:grid;grid-template-columns:repeat(auto-fill,minmax(16rem,1fr));gap:1rem}
.touch-card{border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface);padding:1.1rem 1.2rem;display:grid;gap:.8rem;border-top:3px solid var(--c)}
.touch-h{display:flex;align-items:center;gap:.5rem;font-weight:600;text-decoration:none;color:var(--fg)}
.touch-h .i{width:16px;height:16px;margin-left:auto;color:var(--fg-3)}
.touch-h:hover{color:var(--accent)}
.mdot{width:9px;height:9px;border-radius:50%;background:var(--c);flex:none}

/* ---------- data model ---------- */
.dmap-edge{stroke:var(--line-2);stroke-width:1.5}
.dmap-label{font-size:11px;fill:var(--fg-3);paint-order:stroke;stroke:var(--surface);stroke-width:5px;stroke-linejoin:round}
.dmap-node rect:first-child{fill:#fff;stroke:var(--line-2)}
.dmap-stripe{fill:var(--c)}
.dmap-name{font-size:13.5px;font-weight:600;fill:var(--fg)}
.dmap-mod{font-size:11px;fill:var(--fg-3)}
.dm-jump{list-style:none;margin:0 0 2rem;padding:0;display:flex;flex-wrap:wrap;gap:.45rem}
.dm-jump a{display:inline-flex;align-items:center;gap:.5rem;padding:.45rem .8rem;border-radius:999px;border:1px solid var(--line-2);background:var(--surface);font-size:.875rem;text-decoration:none;color:var(--fg-2)}
.dm-jump a:hover{border-color:var(--c);color:var(--fg)}
.dm-jump i{font-style:normal;font-size:.75rem;color:var(--fg-3);font-variant-numeric:tabular-nums}
.dm2{display:grid;gap:2.5rem}
.dm2-group{scroll-margin-top:96px}
.dm2-h{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 1rem;margin-bottom:1rem}
.dm2-h h3{font-size:1.4rem}
.dm2-n{font-size:.8125rem;color:var(--fg-3)}
.dm2-h .more{margin-left:auto}
.dm2-tiles{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem}
.dm2-tiles li{display:flex;gap:.75rem;padding:.9rem 1rem;border:1px solid var(--line);border-radius:12px;background:var(--surface);min-width:0}
.dm2-ic{width:32px;height:32px;border-radius:8px;display:grid;place-items:center;flex:none;background:color-mix(in oklab, var(--c) 12%, #fff);color:var(--c)}
.dm2-ic .i{width:17px;height:17px}
.dm2-tiles b{font-weight:600}
.dm2-tiles p{font-size:.8125rem;color:var(--fg-2);margin-top:.15rem}
.dm2-links{display:block;margin-top:.45rem;font-size:.75rem;color:var(--c);font-weight:500}
@media (max-width:1000px){.dm2-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.dm2-tiles{grid-template-columns:1fr}.dm2-h .more{margin-left:0}}

.lanes-hint{display:none;align-items:center;gap:.4rem;font-size:.8125rem;color:var(--fg-3);margin:-.5rem 0 .75rem}
.lanes-hint .i{width:14px;height:14px}
@media (max-width:900px){.lanes-hint{display:flex}}
.menu-link{font-size:.875rem;color:var(--fg-2);text-decoration:none;padding:.45rem .6rem;border-radius:6px}
.menu-link:hover,.menu-link[aria-current="page"]{color:var(--fg);background:var(--bg-2)}
.closing-more{margin-top:1.25rem !important}

/* ================= product scenes: the ERP.AI app's own look =================
   Scoped under .ui. Geist, neutral canvas, white cards, tinted status pills. */
.ui{
  --u-canvas:#f5f5f4; --u-side:#f0efed; --u-card:#ffffff; --u-line:#e7e5e2; --u-line-2:#d9d6d1;
  --u-fg:#0b0b0c; --u-fg-2:#57534e; --u-fg-3:#8f8a84; --u-field:#f1f0ee; --u-track:#ededeb;
  --u-blue:#2563eb; --u-blue-bg:#e8effd; --u-violet:#6d4fd8; --u-violet-bg:#efebfc;
  --u-orange:#c2560c; --u-orange-bg:#fdefe3; --u-green:#16803c; --u-green-bg:#e5f5ea;
  --u-red:#c0262d; --u-red-bg:#fceaea; --u-gray:#57534e; --u-gray-bg:#f0efed;
  --u-teal:#4e9a8b; --u-teal-bg:#e4f2ef;
  position:relative;margin:0;font:400 13px/1.45 "Geist", ui-sans-serif, system-ui, -apple-system, sans-serif;color:var(--u-fg);
  -webkit-font-smoothing:antialiased;text-align:left;container-type:inline-size;
}
.ui *{box-sizing:border-box}
.ui b{font-weight:600}
.u-i{width:15px;height:15px;flex:none}
.u-dim{color:var(--u-fg-3)}
.u-num{font-variant-numeric:tabular-nums}
.u-r{text-align:right !important}
.u-strong{font-weight:500;color:var(--u-fg) !important}

/* frame */
.ui-frame{display:grid;grid-template-columns:212px minmax(0,1fr);background:var(--u-canvas);border:1px solid var(--u-line-2);border-radius:14px;overflow:hidden;box-shadow:0 1px 2px rgb(20 16 12 / 6%), 0 30px 70px -30px rgb(40 25 45 / 35%)}
.ui-frame.no-side{grid-template-columns:minmax(0,1fr)}
.u-side{background:var(--u-side);border-right:1px solid var(--u-line);padding:12px 10px;display:flex;flex-direction:column;gap:10px;min-width:0;height:0;min-height:100%;overflow:hidden}
.u-ws{display:flex;align-items:center;gap:9px;padding:2px 4px}
.u-ws-logo{width:26px;height:26px;border-radius:7px;background:var(--u-fg);color:#fff;display:grid;place-items:center;font-weight:600;font-size:12px}
.u-ws div{display:grid;line-height:1.2;min-width:0}
.u-ws b{font-size:13px}
.u-ws div span{font-size:11px;color:var(--u-fg-3)}
.u-search{display:flex;align-items:center;gap:7px;padding:6px 9px;border-radius:8px;background:var(--u-card);border:1px solid var(--u-line);color:var(--u-fg-3);font-size:12px}
.u-search kbd{margin-left:auto;font:500 10px/1 "Geist Mono", ui-monospace, monospace;color:var(--u-fg-3);border:1px solid var(--u-line);border-radius:4px;padding:2px 4px}
.u-navg{display:grid;gap:1px}
.u-navg > span{font-size:11px;font-weight:500;color:var(--u-fg-3);padding:6px 8px 3px}
.u-nav{display:flex;align-items:center;gap:8px;padding:5px 8px;border-radius:7px;color:var(--u-fg-2);font-size:12.5px;white-space:nowrap}
.u-nav.is-on{background:#e2e0dc;color:var(--u-fg);font-weight:500}
.u-main{min-width:0;display:flex;flex-direction:column}
.u-tabs{display:flex;align-items:center;gap:4px;padding:7px 12px;border-bottom:1px solid var(--u-line);background:#fafaf9}
.u-tab{display:inline-flex;align-items:center;gap:8px;padding:4px 10px;border-radius:7px;font-size:12px;color:var(--u-fg-3);white-space:nowrap}
.u-tab.is-on{background:#ebe9e6;color:var(--u-fg)}
.u-tab i{font-style:normal;color:var(--u-fg-3)}
.u-tabs-end{margin-left:auto;color:var(--u-fg-3);display:flex}
.u-page{padding:18px 20px 20px;display:grid;gap:12px;min-width:0}
.no-chrome .u-page{padding:0;background:transparent}
.ui-frame.no-chrome{border:0;box-shadow:none;background:transparent;border-radius:0}
.u-page-h{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:2px}
.u-crumb{font-size:11.5px;color:var(--u-fg-3)}
.u-page-h h3{font:600 22px/1.15 "Geist", sans-serif;letter-spacing:-.02em;margin:2px 0 0}
.u-page-h p{margin:4px 0 0;color:var(--u-fg-3);font-size:12.5px}
.u-btn{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 12px;border-radius:8px;font-size:12.5px;font-weight:500;border:1px solid var(--u-line-2);background:var(--u-card);color:var(--u-fg);white-space:nowrap}
.u-btn-dark{background:var(--u-fg);border-color:var(--u-fg);color:#fff}

/* cards */
.u-card{background:var(--u-card);border:1px solid var(--u-line);border-radius:12px;min-width:0}
.u-pad{padding:14px}
.u-h{margin:0 0 10px;font:600 13.5px/1.3 "Geist", sans-serif}
.u-sub{margin:-6px 0 10px;font-size:11.5px;color:var(--u-fg-3)}
.u-row{display:grid;gap:12px;min-width:0}

/* kpis */
.u-kpis{display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));gap:12px}
.u-kpi{padding:12px 14px;display:grid;gap:6px;align-content:start;container-type:inline-size;min-width:0}
.u-kpi-top{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;font-size:12px;line-height:1.3;color:var(--u-fg-2)}
.u-kpi b{font:600 min(24px, 14.5cqi)/1.1 "Geist", sans-serif;white-space:nowrap;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.u-kpi small{font-size:11px;color:var(--u-fg-3)}
.u-badge{width:26px;height:26px;border-radius:7px;display:grid;place-items:center;flex:none}
.u-badge .u-i{width:14px;height:14px}

/* tones */
.u-blue{background:var(--u-blue-bg);color:var(--u-blue)} .u-violet{background:var(--u-violet-bg);color:var(--u-violet)}
.u-orange{background:var(--u-orange-bg);color:var(--u-orange)} .u-green{background:var(--u-green-bg);color:var(--u-green)}
.u-red{background:var(--u-red-bg);color:var(--u-red)} .u-gray{background:var(--u-gray-bg);color:var(--u-gray)} .u-teal{background:var(--u-teal-bg);color:var(--u-teal)}
.u-pill{display:inline-flex;align-items:center;padding:2px 8px;border-radius:999px;font-size:11.5px;font-weight:500;line-height:1.5;white-space:nowrap}
.u-dot{width:8px;height:8px;border-radius:50%;flex:none}
.u-dot.u-blue{background:var(--u-blue)} .u-dot.u-violet{background:var(--u-violet)} .u-dot.u-orange{background:var(--u-orange)} .u-dot.u-green{background:var(--u-green)} .u-dot.u-red{background:var(--u-red)} .u-dot.u-gray{background:var(--u-fg-3)}
.u-av{width:22px;height:22px;border-radius:50%;display:inline-grid;place-items:center;font-size:9.5px;font-weight:600;flex:none}
.u-av-violet{background:#e9e2fb;color:#5b3fc4}.u-av-blue{background:#dfe9fd;color:#1f55d1}.u-av-orange{background:#fde6d4;color:#b4500e}.u-av-green{background:#dcf2e3;color:#13703a}.u-av-teal{background:#daf0eb;color:#2f7a6c}.u-av-red{background:#fbdede;color:#b3242a}
.u-person{display:inline-flex;align-items:center;gap:7px;white-space:nowrap}

/* board */
.u-board{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(148px,1fr);gap:10px;overflow-x:auto;scrollbar-width:none}
.u-col{background:#f7f7f6;border:1px solid var(--u-line);border-radius:10px;padding:8px;display:flex;flex-direction:column;gap:7px;min-width:0}
.u-col-h{display:flex;align-items:center;gap:6px;padding:2px 2px 4px;font-size:12px;white-space:nowrap}
.u-col-h .u-dim{margin-left:auto;font-size:11px}
.u-tile{background:var(--u-card);border:1px solid var(--u-line);border-radius:9px;padding:9px 10px;display:grid;gap:3px;box-shadow:0 1px 1px rgb(0 0 0 / 3%)}
.u-tile > b{font-size:12.5px;line-height:1.3}
.u-tile > .u-dim{font-size:11.5px}
.u-tile-row{display:flex;justify-content:space-between;align-items:center;margin-top:3px}
.u-money{font-weight:600;font-variant-numeric:tabular-nums}
.u-date{display:inline-flex;align-items:center;gap:5px;font-size:11px;color:var(--u-fg-2);background:var(--u-gray-bg);padding:2px 7px;border-radius:6px;justify-self:start;margin-top:2px}
.u-date .u-i{width:12px;height:12px}
.u-date.is-late{background:var(--u-red-bg);color:var(--u-red)}
.u-tile.is-focus{border-color:#b9a6e8;box-shadow:0 0 0 3px rgb(124 92 214 / 14%)}
.u-add{display:flex;align-items:center;justify-content:center;gap:5px;padding:5px;border:1px dashed var(--u-line-2);border-radius:8px;font-size:11.5px;color:var(--u-fg-3)}

/* grid (the app's table) */
.u-gridcard{overflow:hidden}
.u-grid-h{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 14px 0}
.u-grid-h .u-h{margin:0}
.u-chip{display:inline-flex;align-items:center;gap:5px;font-size:11px;color:var(--u-fg-2);border:1px solid var(--u-line);border-radius:7px;padding:3px 8px;white-space:nowrap}
.u-chip .u-i{width:12px;height:12px}
.u-scroll{overflow-x:auto;scrollbar-width:thin}
.u-grid{width:100%;border-collapse:collapse;font-size:12.5px}
.u-grid th{font-weight:500;color:var(--u-fg-3);font-size:11.5px;text-align:left;padding:9px 9px;border-bottom:1px solid var(--u-line);white-space:nowrap;background:#fbfbfa}
.u-grid th .u-i{width:12px;height:12px;margin-right:5px;vertical-align:-2px}
.u-grid td{padding:8px 9px;border-bottom:1px solid #f0eeeb;color:var(--u-fg-2);white-space:nowrap}
.u-grid tbody tr:last-child td{border-bottom:0}
.u-grid tr.is-focus td{background:#f6f2fd}
.u-grid tr.is-flag td{background:#fff8f1}
.u-cb{width:30px;padding-right:0 !important}
.u-cb i{display:block;width:13px;height:13px;border:1px solid var(--u-line-2);border-radius:4px;background:#fff}
.u-grid-f{padding:8px 14px;border-top:1px solid var(--u-line);font-size:11px;color:var(--u-fg-3)}
.u-score{display:inline-block;width:46px;height:5px;border-radius:3px;background:var(--u-track);vertical-align:middle;margin-right:7px;overflow:hidden}
.u-score i{display:block;height:100%;background:var(--u-violet);border-radius:3px}

/* list */
.u-list{list-style:none;margin:0;padding:0;display:grid}
.u-list li{display:flex;align-items:center;gap:10px;padding:9px 0;border-top:1px solid #f0eeeb}
.u-list li:first-child{border-top:0;padding-top:0}
.u-list li > div{display:grid;min-width:0;flex:1}
.u-list b{font-size:12.5px;font-weight:500;line-height:1.35}
.u-list .u-dim{font-size:11.5px}

/* funnel */
.u-funnel{width:100%;border-collapse:collapse;font-size:12.5px}
.u-funnel th{font-weight:500;color:var(--u-fg-3);font-size:11.5px;text-align:left;padding:0 0 8px;border-bottom:1px solid var(--u-line)}
.u-funnel td{padding:7px 0;color:var(--u-fg-2)}
.u-funnel td:first-child{width:28%;color:var(--u-fg)}
.u-barcell{padding:7px 12px !important}
.u-barcell span{display:block;height:16px;border-radius:4px;background:var(--u-blue);margin-inline:auto}
.u-funnel td:nth-child(3){width:14%} .u-funnel td:nth-child(4){width:12%}

/* bars */
.u-bars{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px;height:190px}
.u-axis{display:flex;flex-direction:column;justify-content:space-between;font-size:10.5px;color:var(--u-fg-3);padding-bottom:20px;text-align:right}
.u-axis span{transform:translateY(-50%)} .u-axis span:last-child{transform:translateY(50%)}
.u-plot{position:relative;display:flex;align-items:flex-end;justify-content:space-around;gap:8px;padding-bottom:20px}
.u-gl{position:absolute;left:0;right:0;height:1px;background:#efedea}
.u-plot{background-clip:content-box}
.u-bar{position:relative;flex:1;max-width:56px;height:calc(100%);display:flex;flex-direction:column;justify-content:flex-end;align-items:center}
.u-bar-f{width:100%;background:var(--u-teal);border-radius:5px 5px 0 0;position:relative;z-index:1}
.u-bar-f.is-muted{background:#b9d8d1}
.u-bar-v{font-size:10.5px;font-weight:600;margin-bottom:3px;z-index:1;white-space:nowrap}
.u-bar-l{position:absolute;bottom:-19px;font-size:10.5px;color:var(--u-fg-3);white-space:nowrap}
.u-gl{bottom:auto}
.u-plot .u-gl:nth-child(1){top:0}.u-plot .u-gl:nth-child(2){top:calc((100% - 20px) / 2)}.u-plot .u-gl:nth-child(3){top:calc(100% - 20px)}

/* donut */
.u-donut svg{width:150px;height:150px;display:block;margin:4px auto 0}
.u-donut-v{font:600 22px "Geist", sans-serif;fill:var(--u-fg)}
.u-donut-l{font:400 9px "Geist", sans-serif;fill:var(--u-fg-3)}

/* record */
.u-record{padding:14px;display:grid;gap:12px}
.u-rec-h{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.u-rec-h > div{display:grid}
.u-rec-h b{font-size:15px;letter-spacing:-.01em}
.u-rec-h .u-dim{font-size:11.5px}
.u-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.u-field{display:grid;gap:4px;min-width:0}
.u-field.is-wide{grid-column:1/-1}
.u-label{display:flex;align-items:center;gap:5px;font-size:10.5px;font-weight:500;letter-spacing:.04em;text-transform:uppercase;color:var(--u-fg-3)}
.u-label .u-i{width:12px;height:12px}
.u-value{background:var(--u-field);border-radius:7px;padding:6px 9px;font-size:12.5px;min-height:31px;display:flex;align-items:center;min-width:0;overflow-wrap:anywhere}
.u-sec{border:1px solid var(--u-line);border-radius:10px;padding:10px 12px;display:grid;gap:10px}
.u-sec-h{display:flex;align-items:center;gap:6px;font-weight:600;font-size:12.5px}
.u-sec-h .u-dim{margin-left:auto;font-weight:400;font-size:11.5px}
.u-rot{transform:rotate(90deg);width:13px;height:13px;color:var(--u-fg-3)}
.u-mini{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.u-mini li{display:flex;align-items:center;gap:9px;font-size:12.5px}
.u-mini li > span:not(.u-badge):not(.u-av):not(.u-pill):not(.u-num){display:grid;flex:1;min-width:0;line-height:1.3}
.u-mini b{font-weight:500;line-height:1.35}
.u-mini .u-dim{font-size:11.5px}

/* quote doc */
.u-doc{overflow:hidden}
.u-doc-h{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:14px 16px;border-bottom:1px solid var(--u-line)}
.u-doc-h > div{display:grid}
.u-doc-h h4{margin:2px 0;font:600 16px/1.2 "Geist", sans-serif;letter-spacing:-.01em}
.u-doc-h .u-dim{font-size:11.5px}
.u-flag{display:flex;width:max-content;margin-left:auto;margin-top:3px;align-items:center;gap:3px;font-size:10.5px;font-weight:500;color:var(--u-orange);background:var(--u-orange-bg);padding:1px 6px;border-radius:5px}
.u-flag .u-i{width:11px;height:11px}
.u-doc-tot{margin:0;padding:12px 16px;border-top:1px solid var(--u-line);display:grid;gap:5px;justify-items:end}
.u-doc-tot div{display:grid;grid-template-columns:130px 130px;text-align:right;font-size:12.5px;color:var(--u-fg-2)}
.u-doc-tot dd{margin:0;font-variant-numeric:tabular-nums;color:var(--u-fg)}
.u-doc-tot .is-total{font-weight:600;font-size:14px;color:var(--u-fg);padding-top:5px;border-top:1px solid var(--u-line)}

/* overlays */
.ui.has-ov{padding-bottom:0}
.u-ov{position:absolute;z-index:3;filter:drop-shadow(0 18px 30px rgb(30 20 40 / 18%)) drop-shadow(0 2px 4px rgb(0 0 0 / 6%))}
.u-ov-right{right:-28px;top:76px;width:min(340px,40%)}
.u-ov-left{left:-28px;top:110px;width:min(320px,38%)}
.u-ov-bottom-left{left:-32px;bottom:-34px;width:min(330px,40%)}
.u-ov-bottom-right{right:-28px;bottom:-30px;width:min(330px,40%)}
.u-ov .u-card{border-color:var(--u-line-2)}
.u-approval{padding:14px;display:grid;gap:10px;align-content:start}
.u-appr-h{display:flex;gap:10px;align-items:flex-start}
.u-appr-h > div{display:grid;line-height:1.3}
.u-appr-h b{font-size:13.5px}
.u-appr-h .u-dim{font-size:11.5px}
.u-approval p{margin:0;font-size:12.5px;color:var(--u-fg-2)}
.u-appr-who{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--u-fg-2)}
.u-appr-a{display:flex;flex-wrap:wrap;gap:8px}
.u-toast{display:flex;align-items:center;gap:10px;padding:10px 12px;font-size:12.5px}
.u-agent{padding:12px;display:grid;gap:8px}
.u-agent-h{display:flex;align-items:center;gap:7px;font-size:12.5px;color:var(--u-violet)}
.u-agent-h b{color:var(--u-fg)}
.u-msg{padding:8px 11px;border-radius:12px;font-size:12.5px;max-width:92%;line-height:1.45}
.u-msg-you{justify-self:end;background:var(--u-fg);color:#fff;border-bottom-right-radius:4px}
.u-msg-agent{background:var(--u-field);border-bottom-left-radius:4px}
.u-msg-warn{background:var(--u-orange-bg);color:#8a3d08;border-bottom-left-radius:4px}

/* stage backdrop (hero) */
.ui-stage{padding:clamp(18px,4vw,48px) clamp(18px,5vw,64px) clamp(44px,6vw,72px);border-radius:24px;background:
  radial-gradient(120% 90% at 50% 0%, color-mix(in oklab, var(--accent) 16%, transparent), transparent 70%),
  linear-gradient(180deg, color-mix(in oklab, var(--accent) 7%, var(--bg)), color-mix(in oklab, var(--accent) 3%, var(--bg)));
  border:1px solid color-mix(in oklab, var(--accent) 14%, var(--line))}
.ui-stage::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background-image:radial-gradient(color-mix(in oklab, var(--accent) 22%, transparent) 1px, transparent 1px);background-size:22px 22px;mask-image:linear-gradient(180deg,#000,transparent 70%);-webkit-mask-image:linear-gradient(180deg,#000,transparent 70%);opacity:.5}
.ui-stage .ui-frame{position:relative}
.ui-stage .u-ov-right{right:clamp(-28px,-1.5vw,-8px);top:clamp(150px,16vw,230px);width:min(300px,34%)}
.ui-stage .u-ov-bottom-left{left:clamp(-28px,-1.5vw,-8px);bottom:clamp(14px,2vw,26px);width:min(300px,34%)}

/* responsive: the frame adapts to its own width */
@container (max-width: 980px){
  .ui-frame{grid-template-columns:minmax(0,1fr)}
  .u-side{display:none}
}
@container (max-width: 620px){
  .u-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .u-row{grid-template-columns:minmax(0,1fr) !important}
  .u-ov{position:static;width:auto !important;margin-top:12px;filter:none}
  .ui-stage .u-ov{margin-top:12px}
  .ui-stage .u-ov-right{display:none}
  .u-page{padding:14px}
  .u-page-h h3{font-size:18px}
  .u-fields{grid-template-columns:minmax(0,1fr)}
}

/* never let a scene shrink to its content: container sizing needs a real width */
.ui{width:100%}

/* stacked blocks + numbered markers */
.u-stack{display:grid;gap:12px;min-width:0;align-content:start}
.u-pinned{position:relative;min-width:0}
.u-pin{position:absolute;z-index:2;top:-9px;left:-9px;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:var(--accent-deep, #5e3f61);color:#fff;font:600 11px/1 "Geist", sans-serif;box-shadow:0 0 0 3px #fff, 0 4px 10px rgb(60 30 70 / 30%)}

/* review queue */
.u-queue{display:grid;gap:10px}
.u-queue .u-h{margin:0}
.u-q-counts{display:flex;flex-wrap:wrap;align-items:center;gap:6px 16px;font-size:12px;color:var(--u-fg-3)}
.u-q-counts b{color:var(--u-fg);font-weight:600;margin-right:3px}
.u-q-mine{margin-left:auto}
.u-q-bulk{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:12px}
.u-q-bulk .u-btn{height:27px;font-size:12px}
.u-q-rows{list-style:none;margin:0;padding:0;display:grid}
.u-q-rows li{display:grid;grid-template-columns:22px minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px 4px;border-top:1px solid #f0eeeb}
.u-q-rows li.is-focus{background:#f6f2fd;border-radius:8px}
.u-q-main{display:grid;gap:2px;min-width:0}
.u-q-id{font:500 11px/1.2 "Geist Mono", ui-monospace, monospace;color:var(--u-fg-3)}
.u-q-main b{font-size:12.5px;font-weight:500}
.u-q-meta{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;font-size:11.5px;color:var(--u-fg-3)}
.u-q-meta > span{display:inline-flex;align-items:center;gap:5px}
.u-q-meta .u-av{width:18px;height:18px;font-size:8px}
.u-q-side{display:flex;align-items:center;gap:8px;white-space:nowrap}
.u-age{font-size:11px;font-weight:500;padding:2px 6px;border-radius:5px;background:var(--u-gray-bg);color:var(--u-fg-2)}
.u-age.is-late{background:var(--u-red-bg);color:var(--u-red)}
.u-q-act{display:inline-flex;align-items:center;gap:3px;font-size:12px;color:var(--u-fg-2)}
.u-q-act .u-rot{width:12px;height:12px}

/* workflow canvas */
.u-wf{overflow:hidden}
.u-wf-bar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:10px 12px;border-bottom:1px solid var(--u-line);font-size:12.5px}
.u-wf-bar b{font-weight:600;margin-right:auto}
.u-wf-back{width:28px;padding:0;justify-content:center}
.u-flip{transform:rotate(180deg)}
.u-toggle{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--u-fg-2);padding:3px 9px 3px 4px;border:1px solid var(--u-line);border-radius:999px}
.u-toggle i{width:26px;height:15px;border-radius:999px;background:var(--u-line-2);position:relative}
.u-toggle i::after{content:"";position:absolute;top:2px;left:2px;width:11px;height:11px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgb(0 0 0 / 20%)}
.u-toggle.is-on i{background:#3fae6a}
.u-toggle.is-on i::after{left:13px}
.u-flow-h .u-toggle{border:0;padding:0}
.u-wf-canvas{padding:22px 18px;background-color:#fbfbfa;background-image:radial-gradient(#dcd9d4 1px, transparent 1px);background-size:16px 16px;overflow-x:auto;scrollbar-width:none}
.u-wf-steps{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:0;width:max-content;margin-inline:auto}
.u-wf-steps li{display:flex;align-items:center}
.u-wf-edge{position:relative;width:24px;height:2px;background:#cfcac3;flex:none}
.u-wf-edge::after{content:"";position:absolute;right:-1px;top:-3px;border:4px solid transparent;border-left-color:#cfcac3;border-right:0}
.u-wf-edge em{position:absolute;left:50%;top:-20px;transform:translateX(-50%);font-style:normal;font-size:10.5px;font-weight:600;color:var(--u-green);background:var(--u-green-bg);padding:1px 6px;border-radius:5px}
.u-wf-node{width:144px;background:#fff;border:1px solid var(--u-line-2);border-radius:11px;padding:9px 10px;display:grid;gap:7px;box-shadow:0 1px 2px rgb(0 0 0 / 4%)}
.u-wf-kind{font:600 9.5px/1 "Geist", sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--u-fg-3)}
.u-wf-title{display:flex;gap:8px;align-items:flex-start}
.u-wf-title > div{display:grid;line-height:1.3;min-width:0}
.u-wf-title b{font-size:12.5px}
.u-wf-title .u-dim{font-size:11px}
.u-wf-chip{justify-self:start;font:500 11px/1 "Geist Mono", ui-monospace, monospace;color:var(--u-fg-2);background:var(--u-field);padding:4px 7px;border-radius:5px}
.u-wf-tools{display:flex;justify-content:center;gap:18px;padding:8px;border-top:1px solid var(--u-line);font-size:12px;color:var(--u-fg-2)}
.u-wf-tools span{display:inline-flex;align-items:center;gap:5px}
.u-wf-tools .u-i{width:13px;height:13px}

/* workflow cards */
.u-flows{display:grid;gap:12px}
.u-flow-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.u-flow{padding:12px 14px;display:grid;gap:8px}
.u-flow-h{display:flex;justify-content:space-between;align-items:flex-start;gap:8px}
.u-flow-h b{font-size:13px;line-height:1.3}
.u-flow > .u-dim{display:flex;align-items:center;gap:5px;font-size:11.5px}
.u-flow > .u-dim .u-i{width:12px;height:12px}
.u-flow dl{margin:0;display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.u-flow dt{font-size:11px;color:var(--u-fg-3)}
.u-flow dd{margin:0;font-weight:600;font-variant-numeric:tabular-nums}
.u-ok{color:var(--u-green)}
.u-flow-f{display:flex;justify-content:space-between;gap:8px;padding-top:8px;border-top:1px solid var(--u-line);font-size:11.5px;color:var(--u-fg-2)}
.u-flow-f > span:first-child{display:inline-flex;align-items:center;gap:5px}
.u-flow-f .u-dot{width:6px;height:6px}

@container (max-width: 980px){
  .u-wf-steps{flex-direction:column;align-items:stretch;width:auto;max-width:300px}
  .u-wf-steps li{flex-direction:column;align-items:stretch}
  .u-wf-edge{width:2px;height:26px;align-self:center}
  .u-wf-edge::after{right:-3px;top:auto;bottom:-1px;border:4px solid transparent;border-top-color:#cfcac3;border-bottom:0}
  .u-wf-edge em{left:12px;top:50%;transform:translateY(-50%)}
  .u-wf-node{width:auto}
}
@container (max-width: 760px){
  .u-flow-cards{grid-template-columns:minmax(0,1fr)}
}
@container (max-width: 620px){
  .u-q-rows li{grid-template-columns:22px minmax(0,1fr)}
  .u-q-side{grid-column:2;flex-wrap:wrap}
  .u-q-mine{margin-left:0}
}
.u-person-t{display:grid;line-height:1.25}
.u-person-t b{font-weight:500;color:var(--u-fg)}
.u-person-t .u-dim{font-size:11px}
.u-grid td{vertical-align:middle}
.u-doc-t td,.u-doc-t th{padding-inline:8px}
.u-doc-t td:first-child,.u-doc-t th:first-child{padding-left:12px}
.u-doc-t td:last-child,.u-doc-t th:last-child{padding-right:12px}
.u-grid td .u-person-t b{white-space:normal}

/* side-by-side blocks stack before a table would need to scroll */
@container (max-width: 900px){ .u-row:not(.keep){grid-template-columns:minmax(0,1fr) !important} }
.ui-cap{margin-top:10px;font:400 11.5px/1.3 "Geist", sans-serif;color:var(--u-fg-3);text-align:right}
.ui-stage .ui-cap{position:relative;z-index:4;margin-top:14px;text-align:center}

/* ===== laptop screens: 1120x700 (16:10) scaled to the space available ===== */
.ui-shot{container-type:normal}
.ui-vp{position:relative;container-type:inline-size}
.ui-fit{position:relative}
.ui-fit.is-laptop{height:calc(700px * var(--s))}
.ui-fit.is-laptop .ui-vp{position:absolute;left:0;top:0;width:1120px;height:700px;transform:scale(var(--s));transform-origin:0 0}
.ui-fit.is-laptop .ui-frame{height:100%;grid-template-rows:100%}
.ui-fit.is-laptop .u-main{min-height:0;overflow:hidden}
.ui-fit.is-laptop .u-page{flex:1;min-height:0;overflow:hidden;align-content:start}
.ui-fit.is-laptop .u-ov-right{right:-30px;top:120px}
.ui-fit.is-laptop .u-ov-bottom-left{left:-30px;bottom:-24px}
.ui-fit.is-laptop .u-ov-bottom-right{right:-30px;bottom:-24px}
.ui-stage .ui-fit.is-laptop .u-ov-right{right:-44px;top:190px;width:310px}
.ui-stage .ui-fit.is-laptop .u-ov-bottom-left{left:-44px;bottom:36px;width:310px}

/* ================= main page: showcase sections ================= */
.ui-inline{display:inline;container-type:normal}
.hero-shot .ui-stage{margin-inline:clamp(-24px,-2vw,0px)}
#features{background:color-mix(in oklab, var(--accent) 3%, var(--bg-2))}

/* module explorer */
.explorer{display:grid;gap:clamp(1.5rem,3vw,2.25rem)}
.ex-tabs{display:flex;flex-wrap:wrap;gap:.45rem}
.ex-tab{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:.5rem;padding:.55rem .9rem;border-radius:999px;background:var(--surface);border:1px solid var(--line-2);font-size:.875rem;font-weight:500;color:var(--fg-2);white-space:nowrap;transition:background-color .15s,color .15s,border-color .15s}
.ex-tab .i{width:16px;height:16px;color:var(--accent)}
.ex-tab:hover{color:var(--fg);border-color:var(--fg-3)}
.ex-tab[aria-selected="true"]{background:var(--accent-deep);border-color:var(--accent-deep);color:#fff}
.ex-tab[aria-selected="true"] .i{color:#fff}
.ex-tab:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.ex-panel{display:grid;grid-template-columns:minmax(0,14rem) minmax(0,1fr);gap:clamp(1.5rem,4vw,3.5rem);align-items:start}
.ex-panel[hidden]{display:none}
.ex-copy{display:grid;gap:1rem;padding-top:.5rem}
.ex-copy h3{font-size:clamp(1.6rem,2.6vw,2rem)}
.ex-copy p{color:var(--fg-2)}
.ex-copy ul{list-style:none;margin:0;padding:0;display:grid;gap:.55rem;font-size:.9375rem;color:var(--fg-2)}
.ex-copy li{display:flex;gap:.55rem}
.ex-copy li .i{width:17px;height:17px;margin-top:.2rem;color:var(--accent)}
.ex-shot{min-width:0;padding-right:clamp(0px,2vw,28px);padding-bottom:clamp(0px,2.5vw,36px)}
@media (max-width:900px){.ex-panel{grid-template-columns:1fr}.ex-tabs{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-inline:calc(var(--gutter) * -1);padding-inline:var(--gutter)}.ex-shot{padding-right:0}}

/* deal flow cards */
.flow-card{margin-top:1rem;margin-right:.5rem;padding:.75rem .85rem;border-radius:12px;background:#fff;border:1px solid #e7e5e2;box-shadow:0 1px 2px rgb(0 0 0 / 4%), 0 10px 24px -18px rgb(40 25 45 / 30%);font:400 13px/1.4 "Geist", ui-sans-serif, system-ui, sans-serif;color:#0b0b0c;display:grid;gap:.6rem}
.flow-card > div:first-child{display:grid}
.flow-card b{font-weight:600}
.flow-card span{color:#8f8a84;font-size:12px}
.flow-card-f{display:flex;align-items:center;justify-content:space-between;gap:.5rem;flex-wrap:wrap}
.flow-card small{font-size:11.5px;color:#57534e}
.flow-drop[data-last] .flow-card{border-color:#bfe3cb}

/* reports */
.report-grid{list-style:none;margin:2rem 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 2rem}
.report-grid a{display:grid;grid-template-columns:2rem 1fr;gap:.15rem .25rem;padding:.9rem 0;border-top:1px solid var(--line);text-decoration:none;color:inherit}
.report-grid a:hover b{color:var(--accent)}
.report-grid .n{grid-row:span 2;font:500 .75rem/1.7 var(--f-mono);color:var(--fg-3)}
.report-grid b{font-weight:600;transition:color .15s}
.report-grid p{font-size:.875rem;color:var(--fg-2)}
@media (max-width:900px){.report-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.report-grid{grid-template-columns:1fr}}

/* bento */
.bento{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:1rem}
.bt{grid-column:span 6;display:grid;grid-template-rows:auto 1fr;gap:1.5rem;padding:clamp(1.25rem,2.5vw,1.75rem);border:1px solid var(--line);border-radius:20px;background:var(--surface);min-width:0}
.bt-c{grid-column:span 5}.bt-d{grid-column:span 7}
.bt-copy{display:grid;gap:.6rem;align-content:start}
.bt-copy h3{font-size:clamp(1.4rem,2.2vw,1.75rem)}
.bt-copy p{color:var(--fg-2);max-width:34rem}
.bt-copy .more{margin-top:.25rem}
.bt-vis{align-self:stretch;display:grid;place-items:center;padding:clamp(1rem,2vw,1.5rem);border-radius:14px;background:color-mix(in oklab, var(--accent) 6%, var(--bg-2));border:1px solid color-mix(in oklab, var(--accent) 10%, var(--line))}
.bt-a .bt-vis .u-approval,.bt-b .bt-vis .u-agent{max-width:26rem;margin-inline:auto;box-shadow:0 18px 40px -24px rgb(40 25 45 / 40%)}
.hub{align-self:stretch;align-content:center;list-style:none;margin:0;padding:clamp(1rem,2vw,1.5rem);display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center;border-radius:14px;background:color-mix(in oklab, var(--accent) 6%, var(--bg-2));border:1px solid color-mix(in oklab, var(--accent) 10%, var(--line))}
.hub li{padding:.45rem .8rem;border-radius:999px;background:var(--surface);border:1px solid var(--line-2);font-size:.8125rem;color:var(--fg-2)}
.hub .hub-core{background:var(--accent-deep);border-color:var(--accent-deep);color:#fff;font-weight:600}
.dm-mini{align-self:stretch;align-content:center;display:grid;grid-template-columns:auto 1fr;gap:.25rem 1.75rem;align-items:center;padding:clamp(1rem,2vw,1.5rem);border-radius:14px;background:color-mix(in oklab, var(--accent) 6%, var(--bg-2));border:1px solid color-mix(in oklab, var(--accent) 10%, var(--line))}
.dm-mini > b{font:700 clamp(3rem,6vw,4.5rem)/.9 var(--f-display);letter-spacing:-.03em;color:var(--accent-deep)}
.dm-mini > span{grid-row:2;font-size:.875rem;color:var(--fg-3)}
.dm-mini ul{grid-row:1 / span 2;grid-column:2;list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.3rem 1.25rem;font-size:.8125rem}
.dm-mini li{display:flex;justify-content:space-between;gap:.5rem;padding:.3rem 0;border-bottom:1px solid var(--line)}
.dm-mini li i{font-style:normal;font-variant-numeric:tabular-nums;color:var(--fg-3)}
@media (max-width:900px){.bt,.bt-a,.bt-b,.bt-c,.bt-d{grid-column:1/-1}}
@media (max-width:560px){.dm-mini{grid-template-columns:1fr}.dm-mini ul{grid-row:auto;grid-column:auto;grid-template-columns:1fr}.dm-mini > span{grid-row:auto}}

/* role panel uses a scene now */
.role-panel .ui{min-width:0}

/* deal tour */
#deal{background:color-mix(in oklab, var(--accent) 3%, var(--bg-2))}
.tour{display:grid;grid-template-columns:minmax(0,13rem) minmax(0,1fr);gap:clamp(1.5rem,4vw,3rem);align-items:start}
.tour-legend{list-style:none;margin:0;padding:0;display:grid;gap:1.1rem;position:sticky;top:96px}
.tour-legend li{display:grid;grid-template-columns:26px 1fr;gap:.75rem;align-items:start}
.tour-n{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:var(--accent-deep);color:#fff;font:600 .75rem/1 var(--f-body);margin-top:.1rem}
.tour-legend b{font-weight:600}
.tour-legend p{font-size:.875rem;color:var(--fg-2);margin-top:.15rem}
.tour-shot{min-width:0;padding-left:10px}
@media (max-width:1000px){.tour{grid-template-columns:1fr}.tour-legend{position:static;grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.tour-legend{grid-template-columns:1fr}}

/* approvals */
.appr-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(1.25rem,3vw,2rem);align-items:start}
.appr-queue{min-width:0;padding-bottom:clamp(0px,3vw,40px)}
.appr-rules{min-width:0;display:grid;gap:1.25rem}
.appr-links{display:flex;flex-wrap:wrap;gap:.75rem 1.5rem}
@media (max-width:1000px){.appr-grid{grid-template-columns:1fr}}

/* automation */
#automation{background:color-mix(in oklab, var(--accent) 3%, var(--bg-2))}

/* agent */
.agent-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(2rem,5vw,4rem);align-items:center}
.agent-split .head{margin-bottom:1.75rem}
.can-cant{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem}
.can-cant h3{font:500 .6875rem/1 var(--f-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--fg-3);margin-bottom:.75rem}
.can-cant ul{list-style:none;margin:0;padding:0;display:grid;gap:.6rem;font-size:.9375rem}
.can-cant li{display:flex;gap:.55rem}
.can-cant li .i{width:17px;height:17px;margin-top:.2rem;color:var(--ok);flex:none}
.can-cant .stays .i{color:var(--accent)}
.agent-vis{padding:clamp(1rem,3vw,2rem);border-radius:20px;background:color-mix(in oklab, var(--accent) 7%, var(--bg-2));border:1px solid color-mix(in oklab, var(--accent) 12%, var(--line))}
.agent-vis .u-agent{box-shadow:0 22px 50px -28px rgb(40 25 45 / 45%)}
@media (max-width:900px){.agent-split{grid-template-columns:1fr}}
@media (max-width:560px){.can-cant{grid-template-columns:1fr}}

/* draggable deal flow */
.flow-try{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1rem;margin:-1rem 0 2rem;font-size:.875rem;color:var(--fg-3)}
.flow-try > span{display:inline-flex;align-items:center;gap:.45rem}
.flow-try .i{width:15px;height:15px;color:var(--accent)}
.flow-reset{all:unset;cursor:pointer;font-size:.8125rem;font-weight:500;color:var(--accent);padding:.3rem .7rem;border:1px solid var(--line-2);border-radius:999px;background:var(--surface)}
.flow-reset:hover{border-color:var(--accent)}
.flow-reset:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.flow-reset[hidden]{display:none}
.flow-drop{margin-top:1rem;margin-right:.5rem;display:grid;gap:.6rem;min-height:7.5rem;border-radius:14px;transition:background-color .15s, outline-color .15s;outline:1.5px dashed transparent;outline-offset:4px}
.flow-drop .flow-card{margin:0}
.flow-card.is-draggable{cursor:grab;touch-action:pan-y;user-select:none;-webkit-user-select:none;transition:transform .15s, box-shadow .15s, opacity .15s}
.flow-card.is-draggable:hover{transform:translateY(-2px);box-shadow:0 1px 2px rgb(0 0 0 / 4%), 0 16px 30px -18px rgb(40 25 45 / 40%)}
.flow-card.is-draggable:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.flow-card.is-lifted{opacity:.35}
.flow-card.is-ghost{position:fixed;z-index:50;margin:0;pointer-events:none;cursor:grabbing;transform:rotate(-2deg) scale(1.02);box-shadow:0 30px 50px -20px rgb(40 25 45 / 45%)}
.is-dragging, .is-dragging *{cursor:grabbing !important}
.is-dragging .flow-drop{outline-color:var(--line-2)}
.flow-drop.is-over{outline-color:var(--accent);background:color-mix(in oklab, var(--accent) 6%, transparent)}
@media (prefers-reduced-motion:reduce){.flow-card.is-ghost{transform:none}}

/* full-width laptop screens for roles and approvals */
.role-panel{grid-template-columns:minmax(0,1fr) !important;gap:1.25rem}
.role-about{display:flex;flex-wrap:wrap;align-items:baseline;gap:.25rem 1rem}
.role-about p{margin-top:0 !important}
.role-about .note{flex-basis:100%;margin-top:.1rem !important}
.appr-grid{grid-template-columns:minmax(0,1fr) !important}
.appr-queue{padding-bottom:0}
.appr-rules{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);align-items:end}
@media (max-width:900px){.appr-rules{grid-template-columns:1fr}}

/* app-site template: long-form registry content inside caps, FAQ answers and industry pages */
.cap-md{font-size:.9375rem;color:var(--fg-2)}
.cap-md > * + *{margin-top:.6rem}
.cap-md p{margin-top:.4rem}
.cap-md ul,.cap-md ol{margin:.6rem 0 0;padding-left:1.15rem;display:grid;gap:.3rem}
.cap-md li::marker{color:var(--fg-3)}
.cap-md strong{color:var(--fg);font-weight:600}
.cap-md table{width:100%;border-collapse:collapse;margin-top:.8rem;font-size:.875rem;display:block;overflow-x:auto}
.cap-md th,.cap-md td{text-align:left;padding:.5rem .7rem .5rem 0;border-bottom:1px solid var(--line);vertical-align:top}
.cap-md th{font:500 .6875rem/1.2 var(--f-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--fg-3)}
.cap-md pre{background:var(--term-bg);color:var(--term-fg);padding:.8rem 1rem;border-radius:var(--r);overflow-x:auto;font:400 .8125rem/1.6 var(--f-mono)}
.cap-md code{font-family:var(--f-mono);font-size:.85em}
.cap-md a{color:var(--accent)}
.qa .cap-md{padding:0 2rem 1.25rem 0;max-width:44rem}
.ind-prose{max-width:46rem;color:var(--fg-2);margin-top:2rem}
.hub-wide{min-height:9rem}
.ex-recs{display:flex;flex-wrap:wrap;gap:.4rem;margin:0;padding:0;list-style:none}
.ex-copy .ex-recs{display:flex;flex-wrap:wrap;gap:.4rem}
.ex-copy .ex-recs li{display:inline-flex}
.u-grid.u-wrap td,.u-grid.u-wrap .u-dim,.u-grid.u-wrap b{white-space:normal}
.u-grid.u-wrap td:nth-child(2){min-width:13rem}
.caps > *,.split > *,.pricing > *,.boxes > *{min-width:0}
@media (max-width:760px){.caps,.caps.two,.caps.four{grid-template-columns:minmax(0,1fr)}}
.hero h1.is-long{font-size:clamp(2.4rem,5vw,4.1rem);max-width:24ch;margin-inline:auto}