@import url('https://fonts.googleapis.com/css2?family=Geist:wght@100..900&family=Geist+Mono:wght@100..900&display=swap');

/* A single dark design system shared by the product site and strategy brief. */
:root {
  color-scheme: dark;
  --bg: #000;
  --ink: #ededed;
  --muted: #a1a1a1;
  --line: #232323;
  --orange: #ff743d;
  --sans: 'Geist', Arial, sans-serif;
  --mono: 'Geist Mono', monospace;
}
body { background: #000; }
::selection { background: #7c361c; color: #fff; }
.header { background: rgba(0,0,0,.88); border-color: #1f1f1f; }
.brand-slash { color: #454545; }
.brand-agent { color: #a1a1a1; }
nav a { color: #a1a1a1; }
nav a:hover { color: #fff; }
.skip { background: #171717; color: #fff; }
.frame:before,.frame:after { color: #505050; }
.button { background: #0a0a0a; border-color: #333; color: #ededed; border-radius: 100px; }
.button:hover { background: #171717; border-color: #555; box-shadow: 0 0 0 3px #ffffff05; }
.button.primary { background: #ededed; border-color: #ededed; color: #0a0a0a; }
.button.primary:hover { background: #fff; border-color: #fff; box-shadow: 0 0 25px #ffffff12; }
.button.small { border-radius: 6px; }
.nav-cta { background: #ededed; border-color: #ededed; color: #0a0a0a; }
.nav-cta:hover { background: #fff; color: #000; }
.hero { background: radial-gradient(ellipse at 50% 81%,#3a180c22,transparent 38%); }
.hero:before { background: linear-gradient(90deg,transparent calc(25% - .5px),#ffffff07 25%,transparent calc(25% + .5px),transparent calc(75% - .5px),#ffffff07 75%,transparent calc(75% + .5px)); }
.announcement { color: #d0d0d0; background: #080808; border-color: #292929; box-shadow: none; }
.announcement:hover { border-color: #484848; }
.announcement-divider { background: #333; }
.announcement>span:nth-last-child(2) { color: #888; }
.hero h1 { color: #f5f5f5; font-weight: 550; }
.hero h1>span { color: #a1a1a1; background: linear-gradient(180deg,#d7d7d7 10%,#777 100%); background-clip: text; -webkit-text-fill-color: transparent; }
.hero-copy { color: #999; }
.hero-diagram { isolation: isolate; }
.diagram-grid { background-image: linear-gradient(#ffffff0b 1px,transparent 1px),linear-gradient(90deg,#ffffff0b 1px,transparent 1px); }
.diagram-grid:after { width: 480px; height: 300px; background: radial-gradient(ellipse,#ff712327,transparent 64%); }
.wire { stroke: #373737; }
.wire.faint { stroke: #202020; }
.flow-wire { stroke: #ff8f57; filter: drop-shadow(0 0 4px #ff742f); }
.agent-card,.backend-card { background: linear-gradient(140deg,#131313,#0a0a0a); border-color: #363636; box-shadow: 0 10px 35px #0008,inset 0 1px #ffffff06; }
.diagram-caption { border-color: #272727; color: #a1a1a1; }
.mini-label { color: #5f5f5f; }
.agent-card p { color: #dedede; }
.agent-status { color: #888; }
.core { background: linear-gradient(150deg,#141414,#050505); border-color: #d98c654d; box-shadow: inset 0 1px 1px #ffd4ac40,0 0 0 7px #ff752809,0 0 0 8px #f88b3820,0 0 35px #ff73244d,0 0 80px #ff732422; }
.core .jot-mark { filter: drop-shadow(0 0 8px #ff7b3470); }
.core .jot-mark i { background: #ff824a; }
.core-orbit { border-color: #e276442f; }
.orbit-two { border-color: #e2764419; }
.core-label { color: #9a7462; }
.backend-card .diagram-caption { color: #c6c6c6; }
.backend-row { border-color: #232323; color: #a1a1a1; }
.backend-row span:last-child { color: #7ac39a; }
.backend-foot { color: #858585; }
.green-chip { background: #0d2418; color: #82cda1; border-color: #204e32; }
.diagram-note { color: #666; }
.agent-ecosystem { background: #030303; }
.agent-ecosystem>p { color: #999; }
.agent-logos>span { color: #d8d8d8; }
.agent-ecosystem .ecosystem-note { color: #777; }
.eyebrow { color: #888; }
.section h2,.section-heading h2 { color: #ededed; }
.section-heading>p,.product-card>p,.human-copy>p,.connection-copy>p,.vision-banner>p { color: #a1a1a1; }
.product-grid { background: #080808; border-radius: 6px; }
.product-card { background: linear-gradient(155deg,#0c0c0c,#060606); }
.product-card:hover { background: linear-gradient(155deg,#141414,#0b0b0b); }
.product-card h3 { color: #ededed; }
.product-card h3>span { color: #777; }
.product-icon { background: #111; border-color: #333; }
.orange { color: #ff995e; background: #23130c; border-color: #53301c; }
.blue { color: #76b8ff; background: #0d1724; border-color: #213955; }
.purple { color: #bb9bff; background: #1b1226; border-color: #3e2b54; }
.cyan { color: #7cd8de; background: #0d2023; border-color: #1f464a; }
.green { color: #86c99d; background: #0e2015; border-color: #254a32; }
.neutral { color: #ccc; background: #171717; border-color: #383838; }
.tag { background: #111; border-color: #303030; color: #888; }
.live-tag { color: #7fc397; background: #0c1d13; border-color: #23442e; }
.card-art { color: #929292; }
.fields-art>div { background: #101010; border-color: #292929; }
.field-type { color: #737373; }
.mini-code { color: #686868; }
.table-art { border-color: #292929; background: #0b0b0b; }
.table-art>div { border-color: #242424; }
.table-art .table-head { background: #141414; color: #878787; }
.table-chip { color: #c69672; background: #2a1e16; }
.blue-chip { color: #87a7c8; background: #15212e; }
.flow-node { color: #a1a1a1; background: #101010; border-color: #333; }
.flow-art i { border-color: #333; }
.flow-node.flow-orange { color: #dc9f74; background: #24170f; border-color: #59351f; }
.sign-art { background: #101010; border-color: #333; }
.document-label { color: #888; }
.doc-lines i { background: #282828; }
.signature { color: #bbb; }
.signed-tag { color: #8eb39b; }
.payment-art { background: #101010; border-color: #333; }
.payment-art>strong { color: #ededed; }
.payment-art>strong>span { color: #757575; }
.payment-art>div { border-color: #2a2a2a; color: #8eb39b; }
.connect-art>div:first-child>span { background: #141414; border-color: #353535; color: #ccc; }
.connect-line { background: #333; }
.mcp-endpoint { background: #141414; border-color: #353535; color: #b8b8b8; }
.mcp-endpoint>span { color: #777; }
.card-footer { color: #929292; border-color: #252525; }
.stack-footnote { color: #828282; }
.stack-footnote a { color: #b1b1b1; }
.stack-footnote a:hover { color: #fff; }
.playground { background: #070707; border-color: #303030; box-shadow: 0 0 70px #ffffff03; }
.playground-toolbar { border-color: #272727; color: #8a8a8a; }
.window-dot { background: #444; }
.simulation-badge { color: #999; border-color: #333; }
.prompt-side { border-color: #272727; }
.prompt-side .eyebrow { color: #888; }
.scenario-tabs button { color: #a1a1a1; }
.scenario-tabs button:hover { background: #161616; }
.scenario-tabs button.active { background: #191919; border-color: #373737; color: #eee; }
.prompt-text p { color: #b7b7b7; }
.stack-used span { color: #999; border-color: #333; }
.demo-disclaimer { color: #888; }
.demo-side { background: #0e0e0e; }
.demo-tabs { border-color: #2a2a2a; }
.demo-tabs>button { color: #888; }
.demo-tabs>button.active { color: #ededed; border-color: #ededed; }
.demo-tabs>span { color: #999; }
.demo-form-wrap { background: #151515; color: #ededed; border: 1px solid #343434; }
.demo-form-heading { color: #a1a1a1; }
.demo-form-logo { color: #ededed; }
.demo-powered { color: #888; }
.demo-form-wrap>p,#demo-form label { color: #a1a1a1; }
#demo-form input { color: #ddd; background: #0a0a0a; border-color: #383838; }
#demo-form input:focus { border-color: #888; }
.demo-submit { background: #ededed; color: #0a0a0a; }
.demo-submit:hover { background: #fff; }
.event-console { border-color: #292929; }
.event-label { color: #888; }
.event-console code { color: #a1a1a1; }
.event-line code { color: #95c9a5; }
.event-dot { background: #666; }
.success-check { background: #102017; border-color: #31553c; color: #9ccea8; }
.demo-success p { color: #a1a1a1; }
.demo-success button { color: #b1c9b5; border-color: #405948; }
#code-panel pre { color: #d0d0d0; }
.code-caption { color: #888; }
.human-copy h2>span { color: #888; }
.text-link { color: #ddd; }
.approval-visual { background: linear-gradient(135deg,#111,#060606); border-color: #2c2c2c; }
.approval-top { color: #888; }
.step-icon { background: #151515; border-color: #333; color: #94c7a4; }
.approval-event>div>span { color: #929292; }
.approval-event small { color: #777; }
.approval-line { border-color: #434343; }
.approval-decision { background: #101010; border-color: #69513b; box-shadow: 0 0 30px #ff8b3307; }
.approval-decision>div:first-child { color: #e2a77d; }
.approval-decision .tag { color: #999; }
.approval-decision>p { color: #a1a1a1; }
.avatar { background: #2c251e; color: #d7b596; }
.reviewer small { color: #999; }
.pending-chip { color: #d9b77b; background: #281f10; border-color: #4f4024; }
#approve-demo { background: #ededed; color: #0a0a0a; }
.approval-caption { color: #888; }
.connect-grid { background: #080808; border-color: #2a2a2a; }
.connection-copy>a { color: #999; }
.connection-copy>a:hover { color: #eee; }
.connection-code { background: #0c0c0c; }
.connection-code>div:first-child { border-color: #292929; color: #999; }
.copy-button { color: #b1b1b1; }
.code-muted { color: #888; }
.code-orange { color: #efab7e; }
.code-green { color: #a4ccaf; }
.code-bottom { border-color: #292929; color: #888; }
.vision-banner { background-color: #030303; background-image: radial-gradient(ellipse at 50% 100%,#ff78240c,transparent 65%),linear-gradient(#ffffff07 1px,transparent 1px),linear-gradient(90deg,#ffffff07 1px,transparent 1px); background-size: 100% 100%,36px 36px,36px 36px; }
.vision-banner>.eyebrow { color: #8e8e8e; }
.vision-banner h2>span { color: #999; }
.vision-coordinate { color: #727272; }
.footer .brand-agent { color: #999; }
.footer-main>div { color: #a1a1a1; }
.footer-main a:hover { color: #fff; }
.footer-bottom { color: #888; }
.modal { background: #0c0c0c; color: #ededed; border-color: #3d3d3d; box-shadow: 0 20px 100px #000b; }
.modal::backdrop { background: #000b; backdrop-filter: blur(8px); }
.close-modal { color: #a1a1a1; }
.close-modal:hover { background: #252525; color: #fff; }
.modal p,.modal ul,.modal ol { color: #a1a1a1; }
.modal-foundation { border-color: #303030; }
.modal-foundation>span { color: #c69c7c; }
.modal-foundation a { color: #d0d0d0; }
.connect-tabs { border-color: #333; }
.connect-tabs>button { color: #999; }
.connect-tabs>button.active { color: #ededed; border-color: #ededed; }
.endpoint-copy { background: #161616; border-color: #343434; }
.modal-note a { color: #ddd; }
.toast { background: #ededed; color: #0a0a0a; box-shadow: 0 4px 24px #0008; }
.vision-intro .eyebrow { color: #c19272; }
.vision-intro .lede { color: #a1a1a1; }
.vision-meta { color: #888; }
.vision-toc>div>span { color: #c5c5c5; }
.vision-toc a { color: #929292; }
.vision-content p,.vision-content li { color: #a1a1a1; }
.vision-content strong { color: #e5e5e5; }
.vision-content .eyebrow { color: #999; }
.vision-callout { background: #15100b; }
.vision-callout p { color: #c1b6ad; }
.vision-table th { background: #141414; color: #a1a1a1; }
.vision-table td { color: #a1a1a1; }
.vision-table td:first-child { color: #ededed; }
.vision-content pre { background: #111; border: 1px solid #303030; color: #cfcfcf; }
.vision-content a { color: #d1d1d1; }
.vision-content a:hover { color: #ffb38a; }
.milestone { background: #0b0b0b; border-color: #303030; }
.milestone>span { color: #c79c7c; }
/* Open page layout: no framing rails, section rules, or background grid. */
.frame,.header,.header nav,.section,.playground-section,.agent-ecosystem,
.vision-intro,.vision-toc,.vision-content section,.footer-bottom { border: 0; }
.frame:before,.frame:after,.hero:before { display: none; }
.diagram-grid { background-image: none; }
.vision-banner {
  background-image: radial-gradient(ellipse at 50% 100%,#ff78240c,transparent 65%);
  background-size: 100% 100%;
}
@media(max-width:650px) {
  .header nav { background: #0a0a0a; box-shadow: 0 15px 24px #0008; }
  .brand-slash { color: #555; }
  .core-wrap:before { background: linear-gradient(transparent,#925b38,#383838); }
}
@media print {
  :root { color-scheme: light; --bg:#fff; --ink:#111; --line:#ddd; }
  body { background:#fff; color:#111; }
  .vision-content p,.vision-content li,.vision-content strong,.vision-table td,.vision-table td:first-child,.vision-intro .lede { color:#333; }
  .vision-callout,.milestone,.vision-content pre,.vision-table th { background:#f5f5f5; color:#333; border-color:#ddd; }
  .vision-content a,.vision-callout p { color:#333; }
}