style.css

/* Scoped product pages: Mintlify documentation keeps its native layout. */
.cr-site { --cr-ink:#20221f; --cr-muted:#656963; --cr-line:#e0e3dc; --cr-paper:#fafbf8; --cr-panel:#f2f4ee; --cr-accent:#a96308; color:var(--cr-ink); max-width:1120px; padding:0 32px; margin:0 auto; font-size:16px; line-height:1.65; }
.dark .cr-site { --cr-ink:#f0f1e9; --cr-muted:#b0b5a9; --cr-line:#343b30; --cr-paper:#171b15; --cr-panel:#20261e; --cr-accent:#efb752; }
.cr-site * { box-sizing:border-box; }
.cr-site h1,.cr-site h2,.cr-site h3,.cr-site p,.cr-site pre,.cr-site ul { margin:0; }
.cr-site h1 { font-size:clamp(42px,6.3vw,78px); letter-spacing:-.055em; line-height:1.07; font-weight:600; color:var(--cr-ink); text-wrap:balance; }
.cr-site h2 { font-size:clamp(28px,3vw,36px); letter-spacing:-.035em; line-height:1.2; font-weight:550; color:var(--cr-ink); }
.cr-site h3 { font-size:23px; letter-spacing:-.025em; line-height:1.3; font-weight:600; color:var(--cr-ink); }
.cr-site p { color:var(--cr-muted); }
.cr-site p+p { margin-top:12px; }
.cr-site a { color:inherit; text-decoration:none; }
.cr-site button,.cr-site input,.cr-site select,.cr-site textarea { font:inherit; }
.cr-site button,.cr-site select,.cr-site summary,.cr-site input[type=checkbox],.cr-site input[type=radio] { cursor:pointer; }
.cr-site button:disabled { opacity:.5; cursor:not-allowed; }
.cr-site :focus-visible { outline:3px solid var(--cr-accent); outline-offset:4px; }
.cr-site .cr-eyebrow,.cr-site .cr-step { font-size:10px; font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-weight:600; letter-spacing:.12em; line-height:1.6; color:var(--cr-muted); }
.cr-site .cr-eyebrow { margin-bottom:20px; }
.cr-dot { color:var(--cr-accent); }
.cr-lede .cr-mark,.cr-site h1 .cr-mark { color:var(--cr-accent); font-weight:600; }
.cr-hero { padding:80px 0 52px; max-width:830px; }
.cr-hero h1 { margin-bottom:25px; }
.cr-site .cr-lede { margin-top:24px; font-size:21px; color:var(--cr-ink); letter-spacing:-.015em; }
.cr-site .cr-intro { max-width:625px; margin-top:12px; font-size:17px; line-height:1.75; }
.cr-actions { display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin:28px 0 16px; }
.cr-site .cr-button { display:inline-flex; justify-content:center; align-items:center; gap:28px; min-height:46px; padding:10px 18px; border:1px solid var(--cr-ink); border-radius:5px; background:var(--cr-ink); color:var(--cr-paper); font-size:13px; line-height:1.5; font-weight:600; text-decoration:none; transition:opacity .15s; }
.cr-site .cr-button:hover { opacity:.8; }
.cr-site .cr-secondary { color:var(--cr-ink); background:transparent; border-color:var(--cr-line); }
.cr-site .cr-github-badge { gap:10px; color:var(--cr-accent); background:var(--cr-panel); border-color:var(--cr-accent); }
.cr-github-badge svg { flex-shrink:0; }
.cr-site .cr-caption { font-size:12px; line-height:1.7; color:var(--cr-muted); }
.cr-section { padding:64px 0; border-bottom:1px solid var(--cr-line); scroll-margin-top:100px; }
.cr-section h2+p { margin-top:18px; }
.cr-section-heading { display:flex; justify-content:space-between; gap:20px; align-items:flex-end; margin-bottom:28px; }
.cr-section-heading .cr-eyebrow { margin-bottom:12px; }
.cr-field { display:flex; flex-direction:column; gap:8px; font-size:12px; font-weight:550; min-width:0; }
.cr-site select,.cr-site input:not([type=checkbox]):not([type=radio]),.cr-site textarea,.cr-select-button { width:100%; border:1px solid var(--cr-line); border-radius:4px; background:var(--cr-paper); color:var(--cr-ink); padding:11px 12px; min-height:44px; font-size:13px; line-height:1.5; }
.cr-site textarea { resize:vertical; }
.cr-select-button { display:flex; justify-content:space-between; align-items:center; text-align:left; }
.cr-domain-picker { position:relative; }
.cr-picker-menu { position:absolute; top:100%; left:0; z-index:30; width:max(100%,280px); max-width:calc(100vw - 64px); border:1px solid var(--cr-line); border-radius:6px; background:var(--cr-paper); box-shadow:0 12px 25px #0002; padding:8px; margin-top:5px; }
.cr-domain-options { max-height:245px; overflow:auto; margin-top:6px; }
.cr-domain-options button { width:100%; display:flex; justify-content:space-between; gap:10px; padding:10px; min-height:42px; text-align:left; color:var(--cr-ink); font-size:13px; border:0; border-radius:3px; background:transparent; }
.cr-domain-options button:hover,.cr-domain-options .cr-option-active { background:var(--cr-panel); }
.cr-domain-options p { padding:12px; font-size:12px; }
.cr-site .cr-text-link { padding:0; background:none; border:0; color:var(--cr-ink); font-weight:550; font-size:13px; line-height:1.8; text-decoration:none; text-underline-offset:4px; }
.cr-site .cr-text-link:hover,.cr-footer a:hover { text-decoration:underline; }
.cr-boundary-note { padding:12px 22px; border-top:1px solid var(--cr-line); font-size:10px; }
.cr-domain-cta { display:flex; align-items:center; justify-content:space-between; gap:25px; border-top:1px solid var(--cr-line); padding:20px 22px; }
.cr-domain-cta strong { font-size:13px; font-weight:550; }
.cr-domain-cta p { font-size:12px; margin-top:3px; }
.cr-domain-cta>a { flex-shrink:0; }
.cr-integration { display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center; }
.cr-integration .cr-text-link { display:inline-block; margin-top:24px; }
.cr-code { border:1px solid var(--cr-line); border-radius:6px; overflow:hidden; background:var(--cr-paper); }
.cr-install { padding:15px 22px; border-bottom:1px solid var(--cr-line); font-family:ui-monospace,monospace; font-size:13px; }
.cr-install>span { color:var(--cr-accent); }
.cr-code pre { padding:22px; background:transparent; border:0; font-size:12px; line-height:1.85; overflow:auto; color:var(--cr-ink); }
.cr-site code { font-family:ui-monospace,SFMono-Regular,Consolas,monospace; background:transparent; color:inherit; font-weight:400; padding:0; }
.cr-code p { padding:0 22px 18px; font-size:10px; }
.cr-integration .cr-integration-scope { grid-column:1 / -1; }
.cr-integration-scope a { text-decoration:underline; text-underline-offset:3px; }
.cr-integration .cr-caption a { text-decoration:underline; text-underline-offset:3px; }
.cr-footer { display:flex; justify-content:space-between; gap:32px; padding:38px 0 50px; color:var(--cr-muted); font-size:13px; }
.cr-footer strong { color:var(--cr-ink); font-weight:500; }
.cr-footer>div { display:flex; flex-wrap:wrap; align-items:center; gap:24px; font-size:12px; }
.cr-subpage { max-width:850px; padding-top:40px; padding-bottom:70px; }
.cr-subpage>.cr-eyebrow { margin-top:50px; }
.cr-subpage h1 { font-size:clamp(40px,6vw,64px); }
.cr-subpage>.cr-lede { margin:25px 0 16px; }
.cr-services { margin:30px 0 45px; border-top:1px solid var(--cr-line); }
.cr-services details { border-bottom:1px solid var(--cr-line); padding:16px 0; }
.cr-services summary { font-size:15px; font-weight:550; }
.cr-services p { font-size:14px; padding:12px 0; }
/* The adoption stack, as the adopt deck draws it: the agents you already run, the
   boundary, the layers around it, the systems underneath. The Plus band is the only
   one that carries the accent, because it is the only one we build for you. */
.cr-stack { display:flex; flex-direction:column; align-items:center; gap:8px; margin:38px 0 0; }
.cr-band { width:100%; padding:16px 20px; border:1px solid var(--cr-line); border-radius:6px; background:var(--cr-panel); text-align:center; font-size:15px; line-height:1.5; color:var(--cr-ink); }
.cr-band-mid { border-color:var(--cr-ink); background:var(--cr-ink); color:var(--cr-paper); font-weight:600; box-shadow:inset 4px 0 0 var(--cr-accent); }
.cr-band-arrow { color:var(--cr-accent); font-size:19px; line-height:1; }
.cr-band-plus { display:flex; flex-direction:column; gap:14px; padding:20px 24px; text-align:left; border-color:var(--cr-accent); background:var(--cr-paper); }
.cr-band-plus b { font-size:16px; font-weight:600; letter-spacing:-.015em; }
.cr-site .cr-band-features { list-style:none; padding:0; margin:0; display:grid; grid-template-columns:1fr 1fr; gap:9px 28px; font-size:14px; line-height:1.55; color:var(--cr-muted); }
.cr-band-features li { position:relative; padding-left:17px; }
.cr-band-features li::before { content:""; position:absolute; left:0; top:.6em; width:6px; height:6px; border-radius:50%; background:var(--cr-accent); }
.cr-band-scope { border-top:1px solid var(--cr-line); padding-top:11px; font-size:13px; font-weight:550; color:var(--cr-ink); }
.cr-site .cr-band-note { margin-top:14px; font-size:14px; line-height:1.6; text-align:center; }
.cr-review h2 { margin-bottom:20px; }
.cr-review form { margin:24px 0; }
.cr-review .cr-field { margin-bottom:22px; }
.cr-review form>.cr-caption { margin-bottom:18px; }
.cr-site fieldset { margin:0 0 24px; padding:0; border:0; }
.cr-site legend { font-size:14px; color:var(--cr-ink); font-weight:550; margin-bottom:14px; }
.cr-site input[type=checkbox],.cr-site input[type=radio] { width:17px; height:17px; flex-shrink:0; accent-color:var(--cr-accent); }
.cr-radio-row { display:flex; flex-wrap:wrap; gap:12px 26px; }
.cr-radio-row label,.cr-check-option { display:flex; align-items:center; gap:10px; font-size:13px; min-height:42px; cursor:pointer; }
.cr-check-grid { display:grid; grid-template-columns:1fr 1fr; gap:4px 24px; }
.cr-risk-check { margin-top:42px; }
.cr-risk-check fieldset { padding:24px 0; border-top:1px solid var(--cr-line); }
.cr-risk-check legend { float:left; width:100%; margin-bottom:14px; }
.cr-risk-check legend+.cr-check-grid,.cr-risk-check legend+.cr-radio-row { clear:both; }
.cr-question-number { display:inline-block; font-family:ui-monospace,monospace; color:var(--cr-accent); font-size:11px; margin-right:14px; }
.cr-email-preview,.cr-risk-result { margin-top:32px; border-top:2px solid var(--cr-accent); padding:28px 24px; background:var(--cr-paper); }
.cr-email-preview h3,.cr-risk-result h2 { margin-bottom:16px; }
.cr-email-preview pre { white-space:pre-wrap; overflow-wrap:anywhere; font-size:12px; background:var(--cr-panel); padding:20px; margin-top:20px; }
.cr-risk-result ul { list-style:none; padding:0; margin:25px 0; }
.cr-risk-result li { margin:18px 0; }
.cr-risk-result li p { margin-top:6px; font-size:14px; }
.cr-risk-result a:not(.cr-button),.cr-subpage .cr-caption a,.cr-email-preview p a { text-decoration:underline; text-underline-offset:3px; }
.cr-risk-result>.cr-button { margin-top:24px; }
.cr-sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media (max-width:800px) {
  .cr-site { padding-left:24px; padding-right:24px; }
  .cr-hero { padding-top:55px; }
  .cr-integration { gap:30px; }
  .cr-section-heading { align-items:flex-start; flex-direction:column; gap:10px; }
}
@media (max-width:600px) {
  .cr-hero { padding:42px 0 35px; }
  .cr-site .cr-lede { font-size:18px; }
  .cr-site .cr-intro { font-size:15px; }
  .cr-band-features { grid-template-columns:1fr; }
  .cr-band-plus { padding:18px; }
  .cr-integration { grid-template-columns:1fr; }
  .cr-section { padding:40px 0; }
  .cr-domain-cta { flex-direction:column; align-items:flex-start; gap:12px; }
  .cr-footer { flex-direction:column; }
  .cr-check-grid { grid-template-columns:1fr; }
  .cr-radio-row { gap:8px 22px; }
  .cr-subpage { padding-top:28px; }
  .cr-subpage>.cr-eyebrow { margin-top:32px; }
  .cr-email-preview,.cr-risk-result { padding:24px 16px; }
}
@media (prefers-reduced-motion:reduce) { .cr-site * { transition:none!important; scroll-behavior:auto!important; } }

/* Product pages retain the top navbar; technical tab navigation belongs in docs. */
body:has(.cr-site) #navbar.is-custom div:has(>.nav-tabs) { display:none; }
body:has(.cr-site) { --topbar-tabs-height:0px; }

.cr-honeypot { position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden; }
.cr-site .cr-form-error { color:#a13d32; margin-top:16px; font-size:14px; }
.dark .cr-site .cr-form-error { color:#f5a198; }
.cr-site .cr-form-fields { margin:0; padding:0; }

/* Medical Affairs evidence workbench */

    #cr-medical-workbench{--cr-bg:light-dark(#f6f7f9,#171b23);--cr-panel:light-dark(#ffffff,#202630);--cr-fg:light-dark(#192334,#edf1f7);--cr-muted:light-dark(#576579,#b2bdcd);--cr-line:light-dark(#d9e0e9,#3b4656);--cr-accent:light-dark(#805400,#ffc970);--cr-tint:light-dark(#fff1d5,#3b3020);--cr-ok:light-dark(#17654c,#86dfba);--cr-ok-bg:light-dark(#eaf7f0,#193a30);--cr-bad:light-dark(#a62f37,#ffadb4);--cr-bad-bg:light-dark(#fff0f0,#44292d);--cr-space:20px;--cr-round:10px;color:var(--cr-fg);background:var(--cr-bg);border:1px solid var(--cr-line);border-radius:12px;font-family:Inter,ui-sans-serif,system-ui,sans-serif;font-size:14px;line-height:1.5;overflow-wrap:anywhere;isolation:isolate}
    #cr-medical-workbench *{box-sizing:border-box}
    #cr-medical-workbench button,#cr-medical-workbench select,#cr-medical-workbench input{font:inherit}
    #cr-medical-workbench button{cursor:pointer}
    #cr-medical-workbench button:disabled{cursor:default;opacity:.5}
    #cr-medical-workbench .cr-top{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;padding:16px 22px;background:var(--cr-panel);border-radius:12px 12px 0 0;border-bottom:1px solid var(--cr-line)}
    #cr-medical-workbench .cr-brand{display:flex;align-items:center;gap:12px;font-weight:500;letter-spacing:-.3px}
    #cr-medical-workbench .cr-logo{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:7px;background:var(--cr-tint);color:var(--cr-accent)}
    #cr-medical-workbench .cr-sep{color:var(--cr-line)}
    #cr-medical-workbench .cr-small{font-size:12px;color:var(--cr-muted)}
    #cr-medical-workbench .cr-badge{font-size:12px;padding:3px 8px;border-radius:5px;background:var(--cr-tint);color:var(--cr-accent);display:inline-block;font-weight:500}
    #cr-medical-workbench .cr-badge.ok{background:var(--cr-ok-bg);color:var(--cr-ok)}
    #cr-medical-workbench .cr-badge.bad{background:var(--cr-bad-bg);color:var(--cr-bad)}
    #cr-medical-workbench .cr-body{padding:22px}
    #cr-medical-workbench .cr-title{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;flex-wrap:wrap;margin-bottom:20px}
    #cr-medical-workbench h2{font-size:23px;font-weight:500;line-height:1.25;margin:5px 0 6px;letter-spacing:-.55px}
    #cr-medical-workbench h3{font-size:16px;font-weight:500;margin:0 0 14px;line-height:1.4}
    #cr-medical-workbench h4{font-size:14px;font-weight:500;margin:0 0 8px}
    #cr-medical-workbench p{margin:0 0 14px}
    #cr-medical-workbench .cr-steps{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:5px;padding:5px;border:1px solid var(--cr-line);background:var(--cr-panel);border-radius:var(--cr-round);margin-bottom:18px}
    #cr-medical-workbench .cr-step{border:0;background:transparent;color:var(--cr-muted);border-radius:6px;padding:10px 5px;font-weight:500;display:flex;align-items:center;justify-content:center;gap:8px;white-space:nowrap}
    #cr-medical-workbench .cr-step[aria-current="step"]{background:var(--cr-tint);color:var(--cr-accent)}
    #cr-medical-workbench .cr-num{font-size:12px;opacity:.8}
    #cr-medical-workbench .cr-stage-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:20px 0 12px;flex-wrap:wrap}
    #cr-medical-workbench .cr-stage-head h3{margin:0}
    #cr-medical-workbench .cr-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:16px;align-items:start}
    #cr-medical-workbench .cr-panel{background:var(--cr-panel);border:1px solid var(--cr-line);border-radius:var(--cr-round);padding:var(--cr-space);min-width:0}
    #cr-medical-workbench .cr-stack{display:grid;gap:12px;min-width:0}
    #cr-medical-workbench .cr-source{display:block;width:100%;text-align:left;padding:14px;background:var(--cr-panel);color:var(--cr-fg);border:1px solid var(--cr-line);border-radius:7px}
    #cr-medical-workbench .cr-source[aria-pressed="true"],#cr-medical-workbench .cr-claim[aria-pressed="true"]{border-color:var(--cr-accent);background:var(--cr-tint)}
    #cr-medical-workbench .cr-row{display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap}
    #cr-medical-workbench .cr-source strong{display:block;font-weight:500;margin:7px 0 3px}
    #cr-medical-workbench .cr-quote{padding:15px;border-left:3px solid var(--cr-accent);margin:12px 0;background:var(--cr-tint);border-radius:0 6px 6px 0}
    #cr-medical-workbench .cr-meta{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin-top:18px}
    #cr-medical-workbench .cr-meta span{display:block}
    #cr-medical-workbench .cr-claim{display:block;width:100%;text-align:left;background:var(--cr-panel);color:var(--cr-fg);padding:13px;border:1px solid var(--cr-line);border-radius:7px;margin:10px 0}
    #cr-medical-workbench .cr-claim.cr-error{border-color:var(--cr-bad)}
    #cr-medical-workbench .cr-ref{display:block;font-size:12px;color:var(--cr-accent);font-weight:500;margin-top:7px}
    #cr-medical-workbench .cr-rule{border-top:1px solid var(--cr-line);margin:16px 0}
    #cr-medical-workbench .cr-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:16px}
    #cr-medical-workbench .cr-button{display:inline-flex;align-items:center;justify-content:center;gap:7px;border:1px solid var(--cr-line);border-radius:6px;background:var(--cr-panel);color:var(--cr-fg);padding:8px 12px;font-weight:500}
    #cr-medical-workbench .cr-button.primary{background:var(--cr-fg);color:var(--cr-panel);border-color:var(--cr-fg)}
    #cr-medical-workbench .cr-button.warn{color:var(--cr-bad);border-color:var(--cr-bad)}
    #cr-medical-workbench .cr-facts{margin:0;display:grid;gap:13px}
    #cr-medical-workbench .cr-facts div{display:grid;grid-template-columns:110px minmax(0,1fr);gap:10px}
    #cr-medical-workbench dt{color:var(--cr-muted)}
    #cr-medical-workbench dd{margin:0}
    #cr-medical-workbench .cr-table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
    #cr-medical-workbench .cr-table th{text-align:left;font-size:12px;color:var(--cr-muted);font-weight:400}
    #cr-medical-workbench .cr-table th,#cr-medical-workbench .cr-table td{padding:11px 8px;border-bottom:1px solid var(--cr-line);vertical-align:top}
    #cr-medical-workbench .cr-table th:first-child,#cr-medical-workbench .cr-table td:first-child{padding-left:0}
    #cr-medical-workbench .cr-check{display:grid;grid-template-columns:22px 1fr auto;gap:8px;padding:13px 0;border-bottom:1px solid var(--cr-line);align-items:start}
    #cr-medical-workbench .cr-check:last-child{border:0}
    #cr-medical-workbench .cr-good{color:var(--cr-ok)}
    #cr-medical-workbench .cr-danger{color:var(--cr-bad)}
    #cr-medical-workbench .cr-label{display:flex;align-items:flex-start;gap:9px;margin:16px 0}
    #cr-medical-workbench .cr-label input{margin:4px 0 0;accent-color:var(--cr-accent);flex-shrink:0}
    #cr-medical-workbench .cr-letter p{margin-top:15px}
    #cr-medical-workbench .cr-status{border-radius:7px;padding:15px;background:var(--cr-tint);color:var(--cr-accent);margin:15px 0}
    #cr-medical-workbench .cr-status.bad{background:var(--cr-bad-bg);color:var(--cr-bad)}
    #cr-medical-workbench .cr-status.ok{background:var(--cr-ok-bg);color:var(--cr-ok)}
    #cr-medical-workbench .cr-status strong{font-weight:500;display:block;margin-bottom:4px}
    #cr-medical-workbench .cr-status span{font-size:12px}
    #cr-medical-workbench .cr-log{display:grid;gap:10px;margin:10px 0 0;padding:0;list-style:none}
    #cr-medical-workbench .cr-log li{display:grid;grid-template-columns:25px 1fr;gap:9px;padding:10px 0;border-bottom:1px solid var(--cr-line)}
    #cr-medical-workbench .cr-next{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-top:18px}
    #cr-medical-workbench .cr-footer{border-top:1px solid var(--cr-line);padding:13px 22px;background:var(--cr-panel);border-radius:0 0 12px 12px}
    #cr-medical-workbench details>summary{cursor:pointer;font-weight:500;font-size:12px;color:var(--cr-muted)}
    #cr-medical-workbench .cr-map{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin:18px 0 8px}
    #cr-medical-workbench .cr-map ul{margin:8px 0;padding-left:18px;font-size:12px;color:var(--cr-muted)}
    #cr-medical-workbench .cr-mono{font-family:ui-monospace,SFMono-Regular,monospace;font-size:12px;overflow-wrap:anywhere}
    #cr-medical-workbench .cr-note{margin:16px 0 0;font-size:12px;color:var(--cr-muted)}
    @media(max-width:720px){#cr-medical-workbench .cr-body{padding:16px}#cr-medical-workbench .cr-grid{grid-template-columns:1fr}#cr-medical-workbench .cr-steps{grid-template-columns:repeat(3,minmax(0,1fr))}#cr-medical-workbench .cr-map{grid-template-columns:1fr}#cr-medical-workbench .cr-top{padding:14px 16px}#cr-medical-workbench h2{font-size:21px}}
    @media(max-width:400px){#cr-medical-workbench .cr-body{padding:12px}#cr-medical-workbench .cr-panel{padding:14px}#cr-medical-workbench .cr-meta{grid-template-columns:1fr}#cr-medical-workbench .cr-facts div{grid-template-columns:1fr;gap:2px}#cr-medical-workbench .cr-step{gap:5px}#cr-medical-workbench .cr-check{grid-template-columns:18px 1fr}#cr-medical-workbench .cr-check>.cr-badge{grid-column:2;width:max-content}}
    @media(pointer:coarse){#cr-medical-workbench button{min-height:44px}#cr-medical-workbench .cr-label{min-height:44px}}

#cr-medical-workbench [hidden]{display:none!important}

/* The execution boundary: the check ladder, the chips, the share row. */
.cr-boundary-note a { text-decoration:underline; text-underline-offset:3px; }
.cr-site .cr-boundary-note { padding:14px 22px; font-size:11.5px; line-height:1.7; }

/* Homepage: the same failure as two chains, and the three control pillars. */
.cr-failure-chain .cr-section-heading { margin-bottom:32px; }
.cr-chain { display:flex; flex-direction:column; gap:14px; }
.cr-chain-row { display:grid; grid-template-columns:132px 1fr; align-items:stretch; gap:14px; }
.cr-site .cr-chain-label { display:flex; align-items:center; font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-size:10px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--cr-muted); }
.cr-site .cr-chain-steps { list-style:none; display:flex; align-items:stretch; gap:22px; padding:0; margin:0; }
.cr-chain-steps li { position:relative; flex:1; display:flex; align-items:center; justify-content:center; text-align:center; padding:14px 10px; border:1px solid var(--cr-line); background:var(--cr-paper); font-size:13px; line-height:1.4; color:var(--cr-muted); }
.cr-chain-steps li:not(:last-child)::after { content:"→"; position:absolute; right:-17px; top:50%; transform:translateY(-50%); color:var(--cr-accent); font-size:13px; line-height:1; }
.cr-chain-steps .cr-end { font-weight:600; border-width:2px; }
.cr-chain-steps .cr-end.cr-bad { color:#a13d32; border-color:#a13d32; background:transparent; }
.cr-chain-steps .cr-end.cr-good,.cr-site .cr-chain-label.cr-good { color:#3c7041; }
.cr-chain-steps .cr-end.cr-good { border-color:#3c7041; background:transparent; }
.dark .cr-chain-steps .cr-end.cr-bad { color:#f5a198; border-color:#f5a198; }
.dark .cr-chain-steps .cr-end.cr-good,.dark .cr-site .cr-chain-label.cr-good { color:#9ec793; }
.dark .cr-chain-steps .cr-end.cr-good { border-color:#9ec793; }
@media (max-width:900px) {
  .cr-chain-row { grid-template-columns:1fr; gap:8px; }
  .cr-chain { gap:26px; }
}
@media (max-width:600px) {
  .cr-site .cr-chain-steps { flex-direction:column; gap:16px; }
  .cr-chain-steps li { padding:11px 10px; font-size:12.5px; }
  .cr-chain-steps li:not(:last-child)::after { content:"↓"; right:auto; left:50%; top:auto; bottom:-14px; transform:translateX(-50%); }
}

/* The wordmark carries the brand on every page; give it room to read. */
#navbar img.nav-logo { height:40px; }
@media (max-width:600px) { #navbar img.nav-logo { height:32px; } }

/* Product pages keep a natural document flow and readable type at every height. */
.cr-home,.cr-try-page { max-width:1200px; }
.cr-home .cr-eyebrow,.cr-try-page .cr-eyebrow,.cr-home .cr-step,.cr-try-page .cr-step { font-size:12px; letter-spacing:.08em; }
.cr-home .cr-caption,.cr-try-page .cr-caption { font-size:14px; }
.cr-home .cr-button,.cr-try-page .cr-button,.cr-home .cr-text-link,.cr-try-page .cr-text-link { font-size:14px; }
.cr-home .cr-home-hero { display:grid; grid-template-columns:1fr 1.1fr; gap:72px; align-items:start; padding:64px 0 84px; }
.cr-home-pitch { padding-top:30px; }
.cr-home h1 { font-size:clamp(34px,3.3vw,46px); line-height:1.12; }
.cr-home .cr-lede { font-size:18px; line-height:1.6; max-width:480px; }
.cr-home .cr-actions { gap:18px 24px; margin:36px 0 0; }
.cr-site .cr-hero-aside { margin-top:30px; font-size:14px; line-height:1.6; color:var(--cr-muted); }
.cr-hero-aside a { color:var(--cr-accent); font-weight:550; text-decoration:underline; text-underline-offset:4px; text-decoration-thickness:1px; }
.cr-hero-aside a:hover { text-decoration-thickness:2px; }
.cr-home .cr-integration { align-items:start; gap:80px; }
.cr-home .cr-integration .cr-button { margin-top:30px; }
/* The demo film. It sits in the quickstart, outside `.cr-site`, so the tokens need fallbacks. */
.cr-film { display:block; width:100%; border:1px solid var(--cr-line,#e0e3dc); border-radius:10px; background:var(--cr-ink,#20221f); aspect-ratio:16/9; }
.cr-film-block { width:100%; min-width:0; margin:24px 0; }
.cr-film-block .cr-caption { margin-top:10px; font-size:13px; line-height:1.7; color:var(--cr-muted,#656963); }
.cr-code-col { min-width:0; }
.cr-home .cr-integration .cr-code-col { margin-top:8px; }
.cr-code-col .cr-proof-links { margin-top:26px; padding-left:2px; }
.cr-home .cr-code pre { font-size:14px; padding:24px; }
.cr-home .cr-install { font-size:14px; }
.cr-code-context { padding:20px 24px; border-top:1px solid var(--cr-line); }
.cr-code-context strong { font-weight:550; font-size:15px; }
.cr-site .cr-code-context p { font-size:14px; padding:0; margin-top:8px; }
.cr-home .cr-footer,.cr-home .cr-footer>div { font-size:14px; }
.cr-home .cr-section,.cr-try-workspace { scroll-margin-top:100px; }
.cr-home .cr-section { padding:92px 0; }
.cr-home .cr-section-heading { margin-bottom:40px; }
/* The page opens on the claim, then hands the reader the controls. */
.cr-try-header { padding:36px 0 18px; display:flex; justify-content:space-between; gap:32px; align-items:center; }
.cr-try-header>div { max-width:770px; }
.cr-try-header .cr-eyebrow { margin-bottom:10px; }
/* Every page below the homepage opens the same way: the way back, then the eyebrow. */
.cr-try-header .cr-text-link+.cr-eyebrow { margin-top:30px; }
.cr-try-page h1 { font-size:clamp(30px,3.3vw,42px); line-height:1.15; }
.cr-try-header p:not(.cr-eyebrow) { font-size:16px; margin-top:14px; }
.cr-try-header>.cr-text-link { flex-shrink:0; }
.cr-try-workspace { padding-bottom:36px; }
.cr-try-page .cr-field,.cr-try-page .cr-select-button,.cr-try-page select { font-size:14px; }
/* The three controls are steps, not settings: number them. */
.cr-field>span,.cr-field #cr-domain-label,.cr-domain-picker>span { display:flex; align-items:center; gap:9px; }
.cr-field i { display:inline-flex; align-items:center; justify-content:center; width:19px; height:19px; flex-shrink:0; border-radius:50%; background:var(--cr-accent); color:var(--cr-paper); font:600 11px/1 ui-monospace,SFMono-Regular,Consolas,monospace; font-style:normal; }
.dark .cr-field i { color:#171b15; }
.cr-try-page .cr-boundary-note { font-size:13px; }
/* Keep documentation tools in documentation; product pages use the main links. The rule
   named two of the four product pages, so risk-check and protect-my-agent carried a docs
   search box the other two did not. `.cr-subpage` is the other two.
   The homepage is the exception: Ask Assistant stays, because a first visitor asks a
   question before they know which page answers it. Search still belongs to the docs. */
body:has(.cr-home) #search-bar-entry,
body:has(.cr-try-page) #search-bar-entry,body:has(.cr-try-page) #assistant-entry,
body:has(.cr-subpage) #search-bar-entry,body:has(.cr-subpage) #assistant-entry,
body:has(.cr-home) #search-bar-entry-mobile,
body:has(.cr-try-page) #search-bar-entry-mobile,body:has(.cr-try-page) #assistant-entry-mobile,
body:has(.cr-subpage) #search-bar-entry-mobile,body:has(.cr-subpage) #assistant-entry-mobile { display:none; }
@media (max-width:1000px) {
  .cr-home .cr-home-hero { gap:32px; }
  .cr-try-header { align-items:flex-start; flex-direction:column; gap:14px; }
}
@media (max-width:800px) {
  .cr-home .cr-home-hero { grid-template-columns:1fr; padding:44px 0 60px; gap:40px; }
  .cr-home .cr-section { padding:72px 0; }
  .cr-home h1 { font-size:clamp(30px,6vw,40px); }
  .cr-home .cr-section-heading { align-items:flex-start; flex-direction:column; }
}
@media (max-width:600px) {
  .cr-home,.cr-try-page { padding:0 20px; }
  .cr-home .cr-eyebrow { font-size:12px; letter-spacing:.05em; }
  .cr-home .cr-lede { margin-top:20px; }
  .cr-home .cr-actions { gap:12px; align-items:flex-start; }
  .cr-home .cr-section { padding:56px 0; }
  .cr-home .cr-section-heading { margin-bottom:28px; }
  .cr-home .cr-failure-chain { padding:20px 16px; }
  .cr-home .cr-code pre { font-size:12px; padding:18px; }
  .cr-try-header { padding-top:26px; }
  .cr-try-header .cr-text-link+.cr-eyebrow { margin-top:22px; }
}

/* Preserve the original hallucination example, aligned for direct comparison. */
.cr-home .cr-failure-chain { min-width:0; padding:30px 28px; border:1px solid var(--cr-line); border-radius:10px; background:var(--cr-paper); }
.cr-home .cr-failure-chain h2 { font-size:26px; }
/* Both endings share a premise: state it once, then fork. */
.cr-chain-setup { margin:22px 0 26px; padding:15px 16px; border:1px solid var(--cr-line); border-radius:8px; background:var(--cr-panel); }
.cr-site .cr-chain-setup p { display:flex; justify-content:space-between; align-items:baseline; gap:16px; font-size:14px; font-weight:550; color:var(--cr-ink); }
.cr-site .cr-chain-setup p+p { margin-top:7px; padding-top:7px; border-top:1px solid var(--cr-line); }
.cr-chain-setup span { font-weight:400; color:var(--cr-muted); }
.cr-home .cr-chain { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.cr-home .cr-chain-row { display:flex; flex-direction:column; gap:14px; }
.cr-home .cr-chain-label { font-size:12px; letter-spacing:.05em; }
.cr-home .cr-chain-steps { display:grid; grid-template-rows:repeat(3,minmax(56px,auto)); gap:16px; }
.cr-home .cr-chain-steps li { font-size:14px; padding:12px 8px; line-height:1.4; color:var(--cr-ink); }
.cr-home .cr-chain-steps li:not(:last-child)::after { content:"↓"; right:auto; left:50%; top:auto; bottom:-15px; transform:translateX(-50%); }
.cr-home .cr-home-how { border-top:1px solid var(--cr-line); }
.cr-site .cr-hero-context { margin-top:26px; max-width:470px; font-size:18px; line-height:1.6; letter-spacing:-.012em; color:var(--cr-ink); }
.cr-hero-context b { font-weight:600; color:var(--cr-accent); }
/* Two lines that carry the larger argument without taking a section of their own. */
@media (max-width:600px) {
  .cr-home .cr-failure-chain { padding:18px 14px; }
  .cr-home .cr-failure-chain h2 { font-size:25px; }
  .cr-home .cr-chain { gap:12px; }
  .cr-home .cr-chain-label { font-size:12px; letter-spacing:0; }
  .cr-home .cr-chain-steps { grid-template-rows:repeat(3,minmax(68px,auto)); }
  .cr-home .cr-chain-steps li { padding:10px 6px; }
}

/* Short visual story: many actions pass through one execution boundary. */
.cr-example-wrap { min-width:0; }
.cr-site .cr-example-label { margin:0 0 12px; font:600 12px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace; letter-spacing:.07em; color:var(--cr-accent); }

.cr-how-intro { max-width:780px; margin-bottom:48px; }
.cr-site .cr-how-intro h2 { margin:0 0 24px; letter-spacing:-.03em; }
/* How it works: the boundary, drawn. Two ends we do not own, one box we do. */
/* How it works, drawn. Two variants: the wide one keeps seven stages on one spine, the
   narrow one stacks them -- one SVG scaled down to a phone renders its labels at 4px. */
.cr-diagram { display:block; width:100%; height:auto; }
.cr-dia-narrow { display:none; }
.cr-diagram text { font-family:inherit; }
.cr-dia-label,.cr-dia-num { font-family:ui-monospace,SFMono-Regular,Consolas,monospace; fill:var(--cr-accent); }
.cr-dia-label { font-size:11px; font-weight:600; letter-spacing:.09em; }
.cr-dia-num { font-size:10.5px; font-weight:600; }
.cr-dia-claim { font-size:17px; font-weight:550; letter-spacing:-.02em; fill:var(--cr-ink); }
.cr-dia-note { font-size:13px; fill:var(--cr-muted); }
.cr-dia-name { font-size:15px; font-weight:600; letter-spacing:-.02em; fill:var(--cr-ink); }
.cr-dia-gloss { font-size:11.5px; fill:var(--cr-muted); }
.cr-dia-rule { font-size:13.5px; font-weight:600; fill:var(--cr-ink); }
.cr-dia-rule-note { font-size:12px; fill:var(--cr-muted); }
.cr-dia-strip { fill:none; stroke:var(--cr-line); stroke-dasharray:5 4; }
.cr-dia-box { fill:var(--cr-paper); stroke:var(--cr-ink); stroke-width:1.5; }
.cr-dia-node { fill:var(--cr-panel); stroke:var(--cr-line); }
.cr-dia-arrow { fill:none; stroke:var(--cr-accent); stroke-width:1.5; }
.cr-dia-head { fill:var(--cr-accent); }
.cr-dia-div,.cr-dia-spine { fill:none; stroke:var(--cr-line); }
.cr-dia-tier { fill:var(--cr-panel); stroke:var(--cr-accent); stroke-dasharray:5 4; }
.cr-dia-tier-label { font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-size:11px; font-weight:600; letter-spacing:.09em; fill:var(--cr-accent); }
.cr-dia-tier-text { font-size:12.5px; fill:var(--cr-muted); }
.cr-dia-link { font-size:12.5px; font-weight:600; fill:var(--cr-accent); text-decoration:underline; }
.cr-diagram a:hover .cr-dia-link { text-decoration:none; }
/* Swap high: between 820 and 1100 the wide drawing scales to roughly 0.7 and renders its
   11px labels at 8. The stacked variant at its own size beats the wide one shrunk. */
@media (max-width:1080px) {
  .cr-dia-wide { display:none; }
  /* Its own size, never blown up to fill the column: scaling a 360-wide drawing to 480
     renders 11px labels at 15 and puts the diagram out of step with the page's type. */
  .cr-dia-narrow { display:block; max-width:360px; margin:0 auto; }
}
/* protect-my-agent: what connecting an existing agent involves, and what each way in covers. */
.cr-site .cr-section-title { font-size:23px; letter-spacing:-.025em; margin:44px 0 20px; }
.cr-site .cr-connect { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.cr-connect li { padding-top:16px; border-top:2px solid var(--cr-accent); min-width:0; }
.cr-connect .cr-step { color:var(--cr-accent); }
.cr-connect b { display:block; margin:8px 0 8px; font-size:15.5px; font-weight:600; color:var(--cr-ink); }
.cr-site .cr-connect p { margin:0; font-size:14px; line-height:1.7; color:var(--cr-muted); }
.cr-scroll { overflow-x:auto; overscroll-behavior-x:contain; }
.cr-coverage { width:100%; min-width:520px; border-collapse:collapse; font-size:14px; }
.cr-coverage th,.cr-coverage td { padding:12px 14px; text-align:left; vertical-align:top; border-bottom:1px solid var(--cr-line); }
.cr-coverage thead th { font:600 11px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace; letter-spacing:.09em; text-transform:uppercase; color:var(--cr-accent); }
.cr-coverage tbody th { font-weight:600; color:var(--cr-ink); white-space:nowrap; width:1%; }
.cr-coverage td { color:var(--cr-muted); line-height:1.65; }
.cr-band-scope a { color:var(--cr-accent); text-decoration:underline; text-underline-offset:3px; }
@media (max-width:800px) {
  .cr-site .cr-connect { grid-template-columns:1fr; gap:20px; }
}
/* Pro and Enterprise. Two cards that swap their button for the form that button asks for,
   so the page never sends the reader somewhere else to say who they are. */
/* Its own slide now: the section supplies the boundary rule, so this must not draw a second
   one inset from it -- and the space it used to need is what pushed the footer off-screen. */
.cr-commercial { margin-top:0; padding-top:0; border-top:0; }
.cr-commercial-head { max-width:760px; margin-bottom:28px; }
.cr-commercial-head .cr-eyebrow { margin:0 0 12px; color:var(--cr-accent); }
.cr-site .cr-commercial-head h3 { font-size:23px; letter-spacing:-.02em; margin:0 0 10px; }
.cr-site .cr-commercial-head p { margin:0; font-size:14.5px; line-height:1.7; color:var(--cr-muted); }
.cr-site .cr-commercial-head h2 + p { margin-top:14px; }
.cr-tiers { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.cr-tier { display:flex; flex-direction:column; align-items:flex-start; gap:10px; padding:24px; border:1px solid var(--cr-line); border-radius:6px; background:var(--cr-paper); min-width:0; }
.cr-tier .cr-step { color:var(--cr-accent); }
.cr-site .cr-tier h3 { font-size:21px; letter-spacing:-.02em; margin:0; }
.cr-site .cr-tier-promise { margin:0; font-size:15.5px; font-weight:600; color:var(--cr-ink); }
.cr-site .cr-tier-body { margin:0; font-size:14px; line-height:1.7; color:var(--cr-muted); }
.cr-site .cr-tier-who { display:flex; flex-wrap:wrap; gap:4px 10px; margin:2px 0 0; font-size:13.5px; color:var(--cr-ink); }
.cr-tier-who span { font:600 10px/2 ui-monospace,SFMono-Regular,Consolas,monospace; letter-spacing:.1em; text-transform:uppercase; color:var(--cr-muted); }
.cr-tier > .cr-button { margin-top:auto; }
.cr-tier-open { border-color:var(--cr-accent); }
.cr-tier-form { width:100%; margin-top:6px; }
.cr-tier-form fieldset { display:flex; flex-direction:column; gap:12px; border:0; margin:0; padding:0; }
.cr-tier-form .cr-button { align-self:flex-start; }
.cr-site .cr-tier-form .cr-caption { margin:0; }
.cr-site .cr-tier-done { margin:6px 0 0; padding:14px 16px; border:1px solid var(--cr-accent); border-radius:5px; font-size:14px; line-height:1.65; color:var(--cr-ink); background:var(--cr-panel); }
.cr-site .cr-commercial > .cr-caption { margin-top:18px; }
.cr-commercial .cr-caption a { text-decoration:underline; text-underline-offset:3px; }
@media (max-width:1000px) {
  .cr-tiers { grid-template-columns:1fr; }
}
.cr-site .cr-surfaces { list-style:none; padding:0; margin:34px 0 0; display:flex; flex-direction:column; gap:20px; }
.cr-surfaces li { position:relative; padding-left:16px; font-size:14px; line-height:1.6; color:var(--cr-muted); }
.cr-surfaces li::before { content:""; position:absolute; left:0; top:.6em; width:6px; height:6px; border-radius:50%; background:var(--cr-accent); }
.cr-surfaces b { display:block; font-size:14.5px; font-weight:600; color:var(--cr-ink); }
.cr-surfaces code { font-size:13px; }
.cr-surfaces b span { display:inline-block; margin-left:8px; padding:2px 7px; border:1px solid var(--cr-line); border-radius:3px; font:600 10px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace; letter-spacing:.1em; color:var(--cr-muted); vertical-align:1px; }
.cr-surface-planned::before { opacity:.35; }
.cr-surfaces a { color:var(--cr-ink); font-weight:550; text-decoration:underline; text-underline-offset:3px; }
.cr-proof-links { display:flex; flex-wrap:wrap; gap:12px 22px; font-size:14px; font-weight:550; margin-top:34px; }
.cr-proof-links a:hover { text-decoration:underline; text-underline-offset:4px; }
.cr-site .cr-coming-soon { display:flex; flex-wrap:wrap; align-items:baseline; gap:10px; margin-top:22px; padding-top:18px; border-top:1px solid var(--cr-line); font-size:13.5px; line-height:1.65; color:var(--cr-muted); }
.cr-coming-soon span { flex-shrink:0; padding:2px 7px; border:1px solid var(--cr-line); border-radius:3px; font:600 10px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace; letter-spacing:.1em; color:var(--cr-muted); }
.cr-site .cr-code-context p { margin:0; }
.cr-code-context a { text-decoration:underline; text-underline-offset:4px; }
.cr-try-next h2 { font-size:28px; }
@media (max-width:800px) {
  .cr-home .cr-lede { max-width:520px; }
}
@media (max-width:600px) {
  .cr-home .cr-home-hero { padding:36px 0 52px; gap:34px; }
  .cr-home .cr-lede { font-size:17px; }
  .cr-how-intro { margin-bottom:32px; }
}


/* Four reading chapters. Minimum heights preserve breathing room without clipping
   content on short screens, at larger text sizes, or when columns stack. */
.cr-home {
  max-width:1320px;
  padding-inline:clamp(24px,4vw,56px);
  --cr-chapter-space:clamp(56px,7svh,88px);
}
.cr-home > .cr-home-hero,
.cr-home > .cr-section {
  min-height:calc(100svh - 72px);
  padding-block:var(--cr-chapter-space);
}
.cr-home > .cr-home-hero {
  grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);
  gap:clamp(40px,5vw,72px);
  align-items:center;
}
.cr-home .cr-home-pitch { padding-top:0; }
.cr-home h1 { font-size:clamp(34px,3.3vw,46px); }
.cr-home .cr-lede { max-width:520px; margin-top:24px; }
.cr-home .cr-hero-context { margin-top:24px; max-width:460px; font-size:15px; line-height:1.75; }
.cr-home .cr-actions { margin-top:36px; }
.cr-site .cr-hero-oneline { display:flex; flex-wrap:wrap; align-items:center; gap:8px 14px; margin-top:26px; font-size:12px; line-height:1.6; }
.cr-hero-oneline span { font:600 10px/1.6 ui-monospace,SFMono-Regular,Consolas,monospace; letter-spacing:.1em; text-transform:uppercase; color:var(--cr-muted); }
.cr-hero-oneline code { padding:6px 10px; border:1px solid var(--cr-line); border-radius:4px; background:var(--cr-paper); font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-size:13px; color:var(--cr-ink); white-space:nowrap; }
.cr-home .cr-hero-aside { margin-top:30px; }
.cr-home .cr-example-label { margin-bottom:16px; }
.cr-home .cr-failure-chain { padding:32px; }
.cr-home .cr-chain { gap:20px; }
.cr-home .cr-chain-steps { grid-template-rows:repeat(3,minmax(60px,auto)); }
/* Agents you can and can't modify: one compact band across both hero columns, so it is read
   with the pitch and the first slide still fits a 720px-tall screen. */
.cr-home > .cr-home-hero { row-gap:28px; }
.cr-site .cr-any-agent { grid-column:1 / -1; display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:10px 28px; padding:14px 22px; border:1px solid var(--cr-line); border-radius:6px; background:var(--cr-paper); text-decoration:none; transition:border-color .15s; }
.cr-site .cr-any-agent:hover { border-color:var(--cr-accent); }
.cr-site .cr-any-agent h2 { margin:0; font-size:clamp(17px,1.45vw,20px); line-height:1.25; letter-spacing:-.015em; white-space:nowrap; }
.cr-site .cr-any-agent p { margin:0; font-size:14px; line-height:1.5; }
.cr-any-agent p b { color:var(--cr-ink); font-weight:600; }
.cr-any-agent-link { color:var(--cr-accent); font-size:14px; font-weight:600; white-space:nowrap; text-decoration:underline; text-underline-offset:4px; text-decoration-thickness:1px; }
.cr-any-agent:hover .cr-any-agent-link { text-decoration-thickness:2px; }
@media (max-width:1100px) {
  .cr-site .cr-any-agent { grid-template-columns:minmax(0,1fr) auto; }
  .cr-site .cr-any-agent p { grid-column:1 / -1; grid-row:2; }
}
@media (max-width:600px) {
  .cr-site .cr-any-agent { grid-template-columns:1fr; padding:16px 16px 16px 20px; }
  .cr-site .cr-any-agent h2 { white-space:normal; }
  .cr-site .cr-any-agent p { grid-row:auto; }
}
/* The band costs the first slide about 90px. On a short screen the pitch gives it back. */
@media (max-height:950px) and (min-width:1101px) {
  .cr-slides-active .cr-home .cr-home-pitch > .cr-eyebrow { margin-bottom:12px; }
  .cr-slides-active .cr-home .cr-lede { margin-top:18px; }
  .cr-slides-active .cr-home .cr-hero-context { margin-top:16px; }
  .cr-slides-active .cr-home .cr-actions { margin-top:24px; }
  .cr-slides-active .cr-home .cr-hero-oneline { margin-top:16px; }
  .cr-slides-active .cr-home .cr-hero-aside { margin-top:16px; }
  .cr-slides-active .cr-home .cr-example-label { margin-bottom:10px; }
  .cr-slides-active .cr-home .cr-failure-chain { padding:22px 26px; }
  .cr-slides-active .cr-home .cr-chain-steps { grid-template-rows:repeat(3,minmax(50px,auto)); }
}
.cr-home > .cr-home-how { display:flex; flex-direction:column; justify-content:center; min-height:0; padding-block:64px; }
.cr-home .cr-section-heading { margin-bottom:32px; align-items:center; }
.cr-home .cr-how-intro { max-width:820px; margin-bottom:44px; }
.cr-home .cr-how-intro .cr-eyebrow { margin:0 0 16px; color:var(--cr-accent); }
.cr-site .cr-how-after { margin-top:44px; text-align:right; }
.cr-home .cr-how-after .cr-text-link { font-size:15px; }
.cr-home .cr-how-intro h2 { font-size:clamp(28px,3.4vw,40px); line-height:1.15; }
.cr-home .cr-planned-work { display:grid; grid-template-columns:100px minmax(0,1fr); gap:24px; margin-top:28px; padding:22px 0; border-block:1px solid var(--cr-line); }
.cr-home .cr-planned-work > .cr-step { padding-top:3px; }
.cr-home .cr-planned-work > div { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:48px; }
.cr-home .cr-planned-work p { font-size:14px; line-height:1.6; margin:0; }
.cr-home .cr-planned-work strong { display:block; margin-bottom:4px; color:var(--cr-muted); font-weight:550; }
.cr-home .cr-integration { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(40px,6vw,88px); }
.cr-home .cr-integration h2 + p { margin-top:24px; }
.cr-home .cr-integration .cr-code-col { margin-top:0; }
.cr-home .cr-code pre { padding:28px; }
.cr-home .cr-surfaces { gap:22px; }
.cr-home .cr-surfaces b { margin-bottom:4px; }
.cr-home > .cr-home-commercial { display:flex; flex-direction:column; border-bottom:0; }
.cr-home .cr-home-commercial > .cr-commercial { margin-top:auto; }
.cr-home .cr-footer { margin-top:auto; padding:28px 0 0; border-top:1px solid var(--cr-line); align-items:flex-end; }
.cr-home .cr-footer > span { line-height:1.65; }
.cr-home .cr-footer > div { line-height:1.65; }
.cr-home .cr-footer > span { flex-shrink:0; }
.cr-home .cr-footer > div { justify-content:flex-end; gap:12px 22px; }
@media (max-width:1100px) {
  .cr-home > .cr-home-hero { gap:32px; }
  .cr-home .cr-failure-chain { padding:24px; }
  .cr-home .cr-integration { gap:36px; }
  .cr-home .cr-footer { align-items:flex-start; flex-direction:column; gap:24px; }
  .cr-home .cr-footer > div { justify-content:flex-start; }
}
@media (max-width:800px) {
  .cr-home > .cr-home-hero,.cr-home > .cr-section { min-height:0; padding-block:64px; }
  .cr-home > .cr-home-hero { grid-template-columns:1fr; gap:44px; }
  .cr-home .cr-home-pitch { max-width:580px; }
  .cr-home h1 { font-size:clamp(30px,6vw,40px); }
  .cr-home .cr-section-heading { align-items:flex-start; gap:16px; }
  .cr-home .cr-integration { grid-template-columns:1fr; gap:40px; }
  .cr-home .cr-planned-work { grid-template-columns:1fr; gap:16px; }
  .cr-home .cr-planned-work > div { gap:24px; }
}
@media (max-width:600px) {
  .cr-home { padding-inline:20px; }
  .cr-home > .cr-home-hero,.cr-home > .cr-section { padding-block:48px; }
  .cr-home .cr-lede { margin-top:24px; }
  .cr-home .cr-failure-chain { padding:24px 16px; }
  .cr-home .cr-chain { gap:12px; }
  .cr-home .cr-chain-steps { grid-template-rows:repeat(3,minmax(76px,auto)); }
  .cr-home .cr-planned-work > div { grid-template-columns:1fr; }
  .cr-home .cr-code pre { padding:20px 16px; font-size:12px; }
  .cr-home .cr-footer > span { flex-shrink:1; }
  .cr-home .cr-footer > div { gap:14px 24px; }
}


/* Native slide snapping on desktop: wheel and trackpad scrolling stay the browser's, the
   controller adds keyboard navigation and the dots. Phones and tablets get the plain page.
   The controller only adds the class under the same query, and the query here guards the
   rules themselves: mandatory snapping over sections taller than the screen made every
   flick re-snap mid-scroll. */
@media (min-width:801px) and (hover:hover) {
  html.cr-slides-active { scroll-snap-type:y mandatory; scroll-padding-top:var(--cr-slide-top,64px); }
  .cr-slides-active .cr-home > section {
    min-height:var(--cr-slide-height,calc(100svh - 64px));
    scroll-snap-align:start;
    scroll-snap-stop:always;
    scroll-margin-top:0;
    padding-block:clamp(28px,4svh,48px);
  }
}
.cr-slides-active .cr-home > .cr-home-how { justify-content:center; }
.cr-slide-dots {
  position:fixed;
  z-index:40;
  top:calc(50% + var(--cr-slide-top,64px) / 2);
  right:16px;
  transform:translateY(-50%);
  display:flex;
  flex-direction:column;
  gap:4px;
}
.cr-slide-dots[hidden] { display:none; }
.cr-slide-dots button {
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  width:44px;
  height:44px;
  padding:0;
  border:0;
  background:transparent;
  border-radius:22px;
  cursor:pointer;
}
.cr-slide-dot {
  width:8px;
  height:8px;
  border:1px solid var(--cr-muted);
  border-radius:8px;
  background:transparent;
  transition:height .28s ease,background-color .28s ease,border-color .28s ease;
}
.cr-slide-dots [aria-current="step"] .cr-slide-dot { height:26px; background:var(--cr-accent); border-color:var(--cr-accent); }
.cr-slide-dot-label {
  position:absolute;
  right:44px;
  white-space:nowrap;
  padding:5px 10px;
  background:var(--cr-paper);
  border:1px solid var(--cr-line);
  border-radius:5px;
  color:var(--cr-ink);
  font-size:12px;
  opacity:0;
  transform:translateX(4px);
  pointer-events:none;
  transition:opacity .2s ease,transform .2s ease;
}
.cr-slide-dots button:hover .cr-slide-dot-label,
.cr-slide-dots button:focus-visible .cr-slide-dot-label { opacity:1; transform:translateX(0); }
@media (max-height:950px) and (min-width:1101px) {
  .cr-slides-active .cr-home > section { padding-block:24px; }
  .cr-slides-active .cr-home .cr-how-intro { margin-bottom:26px; }
  .cr-slides-active .cr-home .cr-how-intro h2 { font-size:clamp(24px,2.5vw,32px); margin-bottom:0; max-width:none; }
  .cr-slides-active .cr-home .cr-diagram { max-height:calc(100svh - 290px); }
  .cr-slides-active .cr-home .cr-commercial-head { margin-bottom:20px; }
  .cr-slides-active .cr-home .cr-commercial-head h2 { font-size:clamp(22px,2.3vw,28px); }
  .cr-slides-active .cr-home .cr-tier { padding:18px 20px; gap:8px; }
  .cr-slides-active .cr-home .cr-tiers { gap:20px; }
  .cr-slides-active .cr-home .cr-commercial > .cr-caption { margin-top:10px; }
  .cr-slides-active .cr-home .cr-home-commercial .cr-footer { padding-top:20px; }
  .cr-slides-active .cr-home .cr-section-heading { margin-bottom:28px; }
}
@media (max-width:1400px) {
  .cr-slides-active .cr-home { padding-inline:64px; }
  .cr-slide-dots { right:8px; }
}
@media (prefers-reduced-motion:reduce) {
  .cr-slide-dot,.cr-slide-dot-label { transition:none; }
}

/* ---------------------------------------------------------------------------
   The execution boundary: one drawing, chosen by domain.

   The sections are not cards. They sit on the page's own white, separated by air
   alone -- a border on each would put two hairlines a gap apart, and two hairlines
   a gap apart read as one seam joining them. Only the things that really are
   cards -- a way in, a rung, a refusal -- carry a border, and they are tinted so
   they read against that white.

   Colours come from variables rather than literals, because an SVG presentation
   attribute cannot hold a var() and the dark theme has to reach inside the drawing.
   --------------------------------------------------------------------------- */
.cr-explorer { display:grid; gap:64px; min-width:0; }
.cr-explorer>*,.cr-movement>* { min-width:0; }
.cr-movement { scroll-margin-top:90px; }
.cr-site .cr-movement>h2 { margin-top:7px; font-size:clamp(24px,2.4vw,31px); letter-spacing:-.03em; }
.cr-movement-head { display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:16px 28px; }
.cr-movement-head>div:first-child { min-width:0; }
.cr-movement-head .cr-domain-picker { flex:0 1 320px; }
.cr-site .cr-movement-head #cr-domain-label { font-size:12px; font-weight:600; }
.cr-picker-hint { margin-top:6px; font-size:11px; color:var(--cr-muted); font-weight:400; }

/* The drawing scrolls inside its own box rather than shrinking its labels to nothing. */
.cr-dg-scroll { overflow-x:auto; overscroll-behavior-x:contain; padding:24px 0 6px; min-width:0; }
.cr-dg { display:block; width:100%; min-width:860px; height:auto; }
.cr-dg-node,.cr-dg-rowbox { fill:var(--cr-panel); stroke:var(--cr-line); stroke-width:1; }
.cr-dg-gate { fill:var(--cr-paper); stroke:var(--cr-accent); stroke-width:1.5; }
.cr-dg-zone { fill:none; stroke:var(--cr-line); stroke-width:1; stroke-dasharray:4 5; }
.cr-dg-eyebrow,.cr-dg-zonelabel { font:600 9.5px/1 ui-monospace,SFMono-Regular,Consolas,monospace; letter-spacing:.1em; fill:var(--cr-muted); }
.cr-dg-label { font-size:11.5px; font-weight:500; fill:var(--cr-ink); }
.cr-dg-label-sm { font-size:10px; }
.cr-dg-aside { font-size:10px; fill:var(--cr-muted); }
.cr-dg-wordmark { font-size:13px; font-weight:650; letter-spacing:-.03em; fill:var(--cr-ink); }
.cr-dg-rowlabel { font-size:11.5px; font-weight:550; fill:var(--cr-ink); }
.cr-dg-raises { font:600 9.5px/1 ui-monospace,SFMono-Regular,Consolas,monospace; letter-spacing:.04em; fill:var(--cr-accent); }
.cr-dg-key { font:500 10px/1 ui-monospace,SFMono-Regular,Consolas,monospace; letter-spacing:.04em; fill:var(--cr-accent); }
.cr-dg-arrow { fill:none; stroke:var(--cr-muted); stroke-width:1.4; }
/* `context-stroke` paints each head to match its own line; browsers without it keep the fallback. */
.cr-dg-headfill { fill:var(--cr-muted); fill:context-stroke; }
.cr-site .cr-dg-note { margin-top:16px; font-size:13px; line-height:1.7; }
.cr-dg-note em { font-style:normal; font-weight:600; color:var(--cr-ink); }

/* The picker names the narrower domains each choice holds, so nothing went missing. */
.cr-picker-menu { width:max(100%,370px); }
.cr-domain-options { max-height:330px; }
.cr-domain-options button { align-items:flex-start; }
.cr-domain-options button>span:first-child { display:flex; flex-direction:column; gap:3px; min-width:0; }
.cr-domain-options strong { font-weight:550; }
.cr-domain-options small { font-size:10.5px; line-height:1.55; color:var(--cr-muted); white-space:normal; }

/* Going in: what changes in the codebase, per shape of thing you are running. */
.cr-ways { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-top:22px; }
.cr-way { display:flex; flex-direction:column; gap:9px; padding:18px; border:1px solid var(--cr-line); border-radius:6px; background:var(--cr-panel); }
.cr-way strong { font-size:17px; font-weight:550; letter-spacing:-.02em; color:var(--cr-ink); }
.cr-site .cr-way p { flex:1; font-size:13.5px; line-height:1.65; }
.cr-way pre { overflow-x:auto; padding:12px; border:1px solid var(--cr-line); border-radius:4px; background:var(--cr-paper); }
.cr-way code { font:500 11.5px/1.65 ui-monospace,SFMono-Regular,Consolas,monospace; color:var(--cr-ink); white-space:pre; }

/* Widening: a rung is a number, a name, a line, and where to read more. */
.cr-ladder { list-style:none; margin:22px 0 0; padding:0; display:grid; gap:10px; }
.cr-ladder>li { display:grid; grid-template-columns:26px 1fr auto; gap:2px 16px; align-items:center; padding:14px 18px; border:1px solid var(--cr-line); border-radius:6px; background:var(--cr-panel); }
.cr-ladder-index { grid-row:1/3; display:flex; align-items:center; justify-content:center; width:26px; height:26px; border:1px solid var(--cr-accent); border-radius:50%; color:var(--cr-accent); font:600 12px/1 ui-monospace,SFMono-Regular,Consolas,monospace; }
.cr-ladder>li>strong { grid-column:2; font-size:16px; font-weight:550; letter-spacing:-.02em; color:var(--cr-ink); }
.cr-site .cr-ladder>li>p { grid-column:2; font-size:13.5px; line-height:1.6; }
.cr-ladder>li>a { grid-column:3; grid-row:1/3; white-space:nowrap; }
.cr-site .cr-ladder-close { margin-top:22px; font-size:17px; font-weight:550; color:var(--cr-ink); letter-spacing:-.015em; }

/* Three refusals. Each card is a button that redraws the diagram above. */
.cr-stories { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin-top:22px; }
.cr-site .cr-story { display:flex; flex-direction:column; align-items:flex-start; gap:8px; padding:16px 18px; border:1px solid var(--cr-line); border-radius:6px; background:var(--cr-panel); text-align:left; }
.cr-site .cr-story:hover { border-color:var(--cr-accent); }
.cr-story strong { font-size:15px; font-weight:550; letter-spacing:-.02em; color:var(--cr-ink); }
.cr-story>span { font-size:13px; line-height:1.6; color:var(--cr-muted); }
.cr-story-go { margin-top:auto; color:var(--cr-accent); font-weight:600; font-size:12.5px; }

/* The caveat and the CTA close their section as plain rows: no rule, only space. */
.cr-site .cr-movement>.cr-boundary-note { margin-top:20px; padding:0; border:0; font-size:13px; line-height:1.7; }
.cr-site .cr-movement>.cr-domain-cta { margin-top:28px; padding:0; border:0; }
.cr-site .cr-domain-cta strong { font-size:15px; font-weight:550; }

@media (max-width:1000px) {
  .cr-ladder>li { grid-template-columns:26px 1fr; }
  .cr-ladder>li>a { grid-column:2; grid-row:auto; margin-top:6px; }
}
@media (max-width:860px) {
  .cr-ways,.cr-stories { grid-template-columns:1fr; }
}
@media (max-width:600px) {
  .cr-explorer { gap:44px; }
  .cr-dg-scroll { padding:18px 0 4px; }
}