@import url("/console/fonts/plex.css?v=1");

/* One visual system for every embedded CertaRail surface. */
:root,
:root[data-theme="light"] {
  --cr-suite-height: 60px;
  --shell-sidebar: 260px;
  --cr-font-sans: "IBM Plex Sans", "Segoe UI", Arial, sans-serif;
  --cr-font-mono: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  --sans: var(--cr-font-sans); --display: var(--cr-font-sans); --mono: var(--cr-font-mono);
  --bg: #f7f8fa; --workbench: #f7f8fa; --paper: #fff;
  --surface: #fff; --surface-2: #f1f4f7; --surface-3: #eaf0f6;
  --text: #17212b; --ink: #17212b; --muted: #52606d; --faint: #52606d;
  --line: #d9dfe5; --line-strong: #7c8a98;
  --accent: #245edb; --accent-fill: #245edb; --accent-ink: #fff; --accent-text: #245edb;
  --green: #245edb; --green-deep: #1848ad; --green-soft: #eaf0f6;
  --sidebar: #fff; --sidebar-text: #17212b; --sidebar-muted: #52606d;
  --sidebar-faint: #52606d; --sidebar-line: #d9dfe5; --sidebar-active: #eaf0f6;
  --radius-sm: 12px; --radius-md: 16px; --radius-lg: 22px;
  --shadow-card: none;
}
:root[data-theme="dark"] {
  --bg: #111c28; --workbench: #111c28; --paper: #182635;
  --surface: #182635; --surface-2: #213346; --surface-3: #2a4057;
  --text: #f0f4f8; --ink: #f0f4f8; --muted: #b5c3d0; --faint: #b5c3d0;
  --line: #3b4c5d; --line-strong: #7c8d9d;
  --accent: #a4c8ee; --accent-fill: #a4c8ee; --accent-ink: #111c28; --accent-text: #a4c8ee;
  --green: #a4c8ee; --green-deep: #245edb; --green-soft: #213346;
  --sidebar: #182635; --sidebar-text: #f0f4f8; --sidebar-muted: #b5c3d0;
  --sidebar-faint: #b5c3d0; --sidebar-line: #3b4c5d; --sidebar-active: #2a4057;
}
html { background: var(--bg); scroll-padding-top: 86px; }
body { font-family: var(--cr-font-sans); font-size: 15px; line-height: 1.5; color: var(--text); background: var(--bg); }
body :where(button, input, select, textarea) { font-family: var(--cr-font-sans); font-size: 14px; line-height: 1.45; }
body :where(h1, h2, h3, h4) { font-family: var(--cr-font-sans); font-weight: 600; letter-spacing: -.015em; overflow-wrap: break-word; }
body :where(pre, code, kbd, samp) { font-family: var(--cr-font-mono); }
body :where(button, a, input, select, textarea, summary, [tabindex]):focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; }
body :where(button, .button, .primary-button, .ghost-button, .text-link, .nav-link, .dc-row-action) { font-size: 14px; line-height: 20px; letter-spacing: 0; font-weight: 500; text-transform: none; }
body :where(input:not([type="checkbox"]):not([type="radio"]), select, textarea) { max-width: 100%; border-color: var(--line-strong); border-radius: 12px; color: var(--text); background: var(--surface); }
body :where(input:not([type="checkbox"]):not([type="radio"]), select) { min-height: 42px; }
body :where(.eyebrow, .sales-eyebrow, .nav-group-title, .panel-heading > span, label > span) { font-family: var(--cr-font-sans); font-size: 12px; line-height: 18px; font-weight: 500; letter-spacing: .025em; text-transform: none; }
body :where(p, li, dd) { overflow-wrap: break-word; }
body :where(.primary-button, .button.primary, .button--primary) { color: var(--accent-ink); background: var(--accent-fill); border-color: var(--accent-fill); border-radius: 12px; box-shadow: none; }
body :where(.primary-button, .button.primary, .button--primary):hover { background: #1848ad; color: #fff; }
body :where(.ghost-button, .button.secondary, .button--secondary, .dc-row-action) { border-radius: 12px; }
body :where(.section-heading h2, .developer-panel-heading h3, .panel-heading h2, .dc-surface h4, .dc-inspector h4) { font-size: 18px; line-height: 24px; }
body :where(.form-block > p, .panel-heading p, .field > small, .readiness-fields label > span, .field > span, .provider-selector label b, .provider-selector label small) { font-family: var(--cr-font-sans); font-size: 13px; line-height: 19px; }
body [hidden] { display: none !important; }

/* The global bar, local navigation and runtime context have distinct jobs. */
.cr-suite-bar, .cr-suite-bar[data-surface] { min-height: 60px; height: 60px; gap: 24px; padding-inline: 24px; color: var(--text); background: var(--surface); border-bottom: 1px solid var(--line); }
.cr-suite-brand strong { font-size: 19px; font-weight: 600; letter-spacing: -.02em; }
.cr-suite-brand small { display: none; }
.cr-suite-mark { width: 28px; height: 28px; color: var(--accent); transform: none; }
.cr-suite-mark svg { display: block; width: 100%; height: 100%; }
.cr-suite-bar[data-surface] :is(.cr-suite-link, .cr-suite-tool) { color: var(--muted) !important; font-size: 14px; font-weight: 500; padding-inline: 12px; }
.cr-suite-bar[data-surface] :is(.cr-suite-link, .cr-suite-tool):hover { color: var(--text) !important; background: var(--surface-2); }
.cr-suite-bar[data-surface] .cr-suite-link[aria-current="page"] { color: var(--accent) !important; background: var(--surface-3); box-shadow: none; }
.cr-suite-bar[data-surface] .cr-suite-tool[data-boundary="true"] { border-color: var(--line-strong); }
.cr-suite-menu-body { background: var(--surface); color: var(--text); border-color: var(--line); }
.cr-runtime-environment { position: relative; z-index: 21; margin: 0; padding: 0 24px; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; color: var(--muted); background: var(--surface-2); font-family: var(--cr-font-sans); }
.cr-runtime-environment__identity { display: flex; align-items: center; gap: 12px; min-height: 40px; cursor: pointer; list-style: none; }
.cr-runtime-environment__identity::after { content: "Требования и источник +"; margin-left: auto; font-size: 12px; color: var(--accent); }
.cr-runtime-environment[open] .cr-runtime-environment__identity::after { content: "Свернуть −"; }
.cr-runtime-environment__identity strong { font: 500 13px/20px var(--cr-font-sans); color: var(--text); }
.cr-runtime-environment__eyebrow { font: 400 12px/18px var(--cr-font-sans); color: var(--muted); letter-spacing: 0; }
.cr-runtime-environment__identity small { display: none; }
.cr-runtime-environment__header { padding: 12px 0; border-top: 1px solid var(--line); grid-template-columns: minmax(220px, 320px) 1fr; }
.cr-runtime-environment__control, .cr-runtime-environment__help, .cr-runtime-environment__fact :where(dt, small) { font: 400 13px/20px var(--cr-font-sans); }
.cr-runtime-environment__facts { padding-bottom: 16px; }
.app-shell { grid-template-columns: var(--shell-sidebar) minmax(0, 1fr); }
.sidebar { width: var(--shell-sidebar); padding: 20px 12px; color: var(--sidebar-text); background: var(--sidebar); border-right: 1px solid var(--sidebar-line); }
.sidebar .brand { padding: 0 12px 18px; margin: 0; min-height: 56px; }
.sidebar .brand strong { font-size: 15px; line-height: 21px; }
.sidebar .brand small { font: 400 12px/18px var(--cr-font-sans); text-transform: none; letter-spacing: 0; }
.nav-group { margin-top: 18px; }
.nav-group-title { margin: 0 12px 6px; color: var(--sidebar-muted); }
.nav-link { min-height: 40px; padding: 9px 12px; gap: 10px; border: 0; border-radius: 12px; color: var(--sidebar-muted); }
.nav-link .nav-icon { width: 18px; height: 18px; }
.nav-link::after, .nav-link::before { display: none; }
.nav-link:is(.active, [aria-current="page"]), .primary-nav a[aria-current="page"] { color: var(--accent) !important; background: var(--sidebar-active) !important; box-shadow: none; }
.nav-link:is(.active, [aria-current="page"]) :where(span, .nav-label), .nav-link:hover .nav-label { color: inherit !important; opacity: 1; }
.nav-link .nav-label { font-size: 14px; line-height: 20px; }
.sidebar-bottom .environment, .environment-badge, .mobile-boundary-mark, .mobile-runtime-status { display: none; }
.topbar { position: relative; top: auto; min-height: 86px; padding: 20px 28px; background: var(--bg); border-bottom: 1px solid var(--line); }
.topbar h1, #page-title { font-size: 26px; line-height: 32px; letter-spacing: -.02em; }
.topbar-context .eyebrow { font-size: 12px; line-height: 18px; margin-bottom: 4px; }
.top-actions { gap: 8px; flex-wrap: wrap; }
.runtime-cluster { display: none; }
.command-trigger[aria-disabled="true"] { display: none; }
.command-trigger { min-height: 40px; }
.command-trigger strong { font: 400 13px var(--cr-font-sans); }
.session-button { background: var(--surface); border: 1px solid var(--line-strong); min-height: 42px; }
.session-button > span { display: none; }
.session-button strong { font-size: 13px; }
.session-button small { font-size: 12px; }
.session-key-icon { display: block; width: 22px; height: 22px; flex: 0 0 22px; color: var(--accent); }
.session-button { gap: 8px; justify-content: center; }
.workspace .topbar .session-button { width: auto; padding: 10px 12px; color: var(--text); }
.workspace .topbar .session-button > span { display: inline; color: inherit; }
.workspace .topbar .session-button:hover:not(:disabled) { color: var(--accent); background: var(--surface-3); }
#main > .section { padding: 24px 28px; }
.section-heading { align-items: start; margin-bottom: 20px; }
.section-heading > p { max-width: 55ch; font-size: 14px; line-height: 21px; }

/* Advanced work starts directly at its instrument. Contracts remain navigable. */
.developer-console { --dc-surface: var(--surface); --dc-surface-soft: var(--surface-2); --dc-text: var(--text); --dc-muted: var(--muted); --dc-line: var(--line); --dc-line-strong: var(--line-strong); --dc-accent-strong: var(--accent); --dc-accent-soft: var(--surface-3); }
.developer-console .dc-environment-bar, .developer-console-workspaces, .developer-workspace-gate { display: none; }
html[data-developer-route="true"] body[data-developer-workspace]:not([data-developer-workspace="quickstart"]) .developer-console-hero { display: none; }
.developer-console-hero { display: block; padding: 0 0 20px; margin: 0 0 20px; border: 0; border-bottom: 1px solid var(--line); background: transparent; }
.developer-console-intro h2 { font-size: 26px; line-height: 32px; max-width: 35ch; }
.developer-console-intro > p { max-width: 78ch; font-size: 14px; line-height: 22px; }
.developer-console-boundary { display: none; }
.developer-console-actions { margin-top: 16px; }
.developer-panel-heading { padding: 0; gap: 24px; margin-bottom: 18px; }
.developer-panel-heading > p { font-size: 13px; line-height: 20px; max-width: 66ch; }
.developer-console-panels { padding-top: 0; }
.developer-console-panel { scroll-margin-top: 76px; }
.dc-explorer-layout { display: grid; grid-template-columns: minmax(280px, .9fr) minmax(340px, 1.3fr); gap: 20px; align-items: start; }
.dc-surface, .dc-inspector, .dc-integration-start { border-radius: 16px; box-shadow: none; }
.dc-explorer-form { padding: 20px; gap: 14px; }
.dc-explorer-form label > span { font-size: 13px; line-height: 19px; font-weight: 500; }
.dc-explorer-form textarea { font-family: var(--cr-font-mono); font-size: 13px; line-height: 21px; resize: vertical; min-height: 90px; }
.dc-search-status { margin: -6px 0 0; color: var(--muted); font-size: 12px; min-height: 18px; }
.dc-operation-summary { font-size: 13px; line-height: 20px; max-height: 100px; overflow: auto; }
.dc-parameter-register { display: grid; gap: 8px; margin: 0; }
.dc-parameter-register > div { display: grid; grid-template-columns: minmax(100px, .6fr) 1fr; gap: 12px; padding: 8px 0; border-bottom: 1px solid var(--line); }
.dc-parameter-register dt { font: 500 12px/19px var(--cr-font-mono); overflow-wrap: anywhere; }
.dc-parameter-register dd { margin: 0; color: var(--muted); font-size: 12px; line-height: 19px; }
.dc-editor-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.dc-editor-actions span { font-size: 12px; }
.dc-api-execute-actions { margin: 0 0 14px; gap: 8px; }
.dc-api-execute-actions #dc-api-send { flex: 1 1 170px; }
.dc-api-execute-actions #dc-api-format { flex: 0 1 auto; }
.dc-api-execute-actions #dc-api-format-status { flex-basis: 100%; }
.dc-api-execute-actions #dc-api-format-status:empty { display: none; }
.dc-api-parameter-details { margin-top: 8px; border-top: 1px solid var(--line); }
.dc-api-parameter-details > summary { min-height: 44px; padding: 12px 0; color: var(--accent); font-size: 13px; line-height: 20px; cursor: pointer; }
.dc-api-parameter-details .dc-parameter-register { padding-bottom: 8px; }
.dc-inspector > header { min-height: 64px; padding: 16px 20px; }
.dc-inspector > header h4 { font-size: 18px; line-height: 24px; }
.dc-request-meta { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding: 16px 20px; }
.dc-request-meta dt { font: 400 12px/18px var(--cr-font-sans); text-transform: none; }
.dc-request-meta dd { font: 400 13px/20px var(--cr-font-mono); }
.dc-code-toolbar { display: flex; flex-wrap: wrap; align-items: start; gap: 12px; padding: 12px 16px; }
.dc-code-tabs { display: flex; flex-wrap: wrap; overflow: visible; gap: 4px; width: auto; }
.dc-code-tabs button { min-height: 36px; padding: 6px 10px; font: 500 13px/20px var(--cr-font-sans); }
.dc-code-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: end; }
.dc-code-actions button { min-height: 36px; padding: 6px 10px; font: 400 12px/20px var(--cr-font-sans); }
.dc-code-language { display: grid; gap: 3px; }
.dc-code-language > span { font-size: 12px; }
.dc-code-language select { width: 144px; min-height: 36px; font-size: 12px; }
.dc-inspector pre, #dc-api-output { min-height: 190px; max-height: 500px; padding: 20px; color: #ecf2f8; background: #111c28; font: 400 13px/21px var(--cr-font-mono); }
.dc-inspector pre[data-wrap="true"] { overflow-wrap: anywhere; }
.dc-code-toolbar .dc-copy-status:empty { display: none; }
.dc-opaque-id-shelf { padding: 12px 20px; }
.dc-opaque-id-shelf p { font-size: 12px; }
.dc-quickstart-list { margin: 0 0 20px; }
.dc-quickstart-list li { padding: 14px 16px; min-height: 64px; }
.dc-quickstart-list li strong { font-size: 14px; }
.dc-quickstart-list li code { font-size: 12px; }
.dc-quickstart-next { margin-top: 16px; }
.dc-scenario-catalog { display: grid; grid-template-columns: 1fr; gap: 0; max-height: 390px; overflow-y: auto; margin: 14px 0 20px; border: 1px solid var(--line); border-radius: 16px; }
.dc-scenario-card { border: 0; border-bottom: 1px solid var(--line); border-radius: 0; padding: 14px 18px; }
.dc-scenario-search { display: grid; gap: 6px; max-width: 560px; }
.dc-fact-register { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.developer-console[data-connected="false"] #dc-overview-facts { display: none; }
.dc-fact-register article { padding: 16px; }
.dc-fact-register strong { font-size: 18px; }
.dc-runtime-list, .dc-lined-list { font-size: 14px; }

/* Form, configuration, document and reference templates share a compact scale. */
:is(.connections-main, .mock-main, .pilot-main, .white-label-main, .guide-main) { max-width: 1440px; margin-inline: auto; padding-inline: 32px; }
:is(.connections-hero, .mock-hero, .pilot-hero, .white-label-hero, .implementation-hero, .engineering-home-hero, .security-hero) { padding-block: 26px; gap: 24px; min-height: 0; }
:is(.connections-hero, .mock-hero, .pilot-hero, .white-label-hero, .implementation-hero, .engineering-home-hero, .security-hero) h1,
:is(.implementation-hero, .engineering-home-hero) h2 { font-size: 30px; line-height: 38px; letter-spacing: -.02em; max-width: 36ch; }
:is(.connections-hero, .mock-hero, .pilot-hero, .white-label-hero, .implementation-hero, .engineering-home-hero) :is(.hero-copy, p:not(.eyebrow)) { font-size: 14px; line-height: 22px; max-width: 74ch; }
.hero-context { padding: 16px; border-radius: 16px; }
.hero-context :where(strong, span, small) { font-family: var(--cr-font-sans); font-size: 13px; line-height: 20px; }
.truth-register { margin-block: 16px; }
.truth-register :where(b, span, dt, dd) { font-family: var(--cr-font-sans); font-size: 12px; line-height: 18px; letter-spacing: 0; }
.truth-register > strong { font-family: var(--cr-font-sans); font-size: 12px; line-height: 18px; min-height: 54px; }
.pilot-workspace { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0; margin-top: 24px; border-top-width: 1px; }
.panel-heading { min-height: 84px; padding: 20px; grid-template-columns: 1fr; gap: 6px; }
.empty-evidence { padding: 40px 24px; min-height: 260px; }
.empty-evidence h3 { font-size: 20px; line-height: 28px; }
.empty-evidence p { font-size: 14px; line-height: 22px; }
.pilot-document { padding: 28px; }
.pilot-document h2 { font-size: 24px; line-height: 31px; }
.pilot-document h3 { font-size: 18px; line-height: 25px; }
.pilot-document :where(p, li, td, th, dt, dd) { font-size: 14px; line-height: 22px; }
.boundary-stamp { padding: 12px; margin: 0 0 14px; }
.boundary-stamp > span { font: 400 12px/18px var(--cr-font-sans); }
.boundary-stamp strong { font-size: 12px; line-height: 18px; }
.boundary-stamp small { font-size: 12px; line-height: 18px; }
.draft-task-errors:empty { display: none; }
body :where(.primary-nav a, .workspace-tabs a, .draft-task-title) { font-size: 14px; line-height: 20px; }
body :where(.primary-nav a[aria-current="page"], .primary-nav a.active) :where(span, strong) { color: inherit; }
body :where(.architecture-node, .ecosystem-node, .flow-node) { min-width: 0; overflow-wrap: anywhere; }
body :where(.architecture-node, .ecosystem-node, .flow-node) :where(b, span, small) { white-space: normal; max-width: 100%; }
.security-hero { max-width: 1320px; margin-inline: auto; }
.security-hero h1 { font-size: 32px; line-height: 40px; }
.security-hero-lead { font-size: 16px; line-height: 25px; }

@media (min-width: 1101px) {
  html[data-developer-route="true"] body[data-developer-workspace] .sidebar .nav-group:not([data-developer-navigation]) { margin-top: 14px; }
  html[data-developer-route="true"] body[data-developer-workspace] #nav-architecture-title ~ .nav-group-links { display: none; }
  html[data-developer-route="true"] body[data-developer-workspace] #nav-architecture-title { display: none; }
  html[data-developer-route="true"] body[data-developer-workspace] .developer-sidebar-nav a { min-height: 34px; padding-block: 7px; }
}
@media (max-width: 1279px) {
  .topbar { padding-inline: 22px; }
  #main > .section { padding: 22px; }
  .command-trigger { display: none; }
  .dc-explorer-layout { grid-template-columns: minmax(260px, 1fr) minmax(300px, 1.1fr); }
  .cr-suite-bar { gap: 16px; }
}
@media (max-width: 1100px) {
  .app-shell { grid-template-columns: minmax(0, 1fr); }
  .dc-explorer-layout { grid-template-columns: minmax(280px, .9fr) minmax(340px, 1.1fr); }
  .cr-suite-bar .cr-suite-links, .cr-suite-bar .cr-suite-tools { display: none; }
  .cr-suite-bar { grid-template-columns: 1fr auto; }
  .cr-suite-menu { display: block; }
}
@media (max-width: 767px) {
  .cr-suite-bar, .cr-runtime-environment { padding-inline: 16px; }
  .cr-runtime-environment__identity { flex-wrap: wrap; gap: 4px 10px; padding-block: 8px; }
  .cr-runtime-environment__eyebrow { display: none; }
  .cr-runtime-environment__identity::after { font-size: 11px; }
  .cr-runtime-environment__header { display: block; }
  .cr-runtime-environment__facts { grid-template-columns: 1fr; }
  .topbar { padding: 16px; gap: 14px; flex-wrap: wrap; }
  .topbar h1, #page-title { font-size: 24px; line-height: 30px; }
  .topbar-context { min-width: 0; }
  .top-actions { margin-left: auto; }
  #main > .section { padding: 20px 16px; }
  .dc-explorer-layout, .dc-two-column, .pilot-workspace { grid-template-columns: minmax(0, 1fr); }
  .dc-explorer-form { padding: 16px; }
  .dc-request-meta { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 16px; }
  .dc-fact-register { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dc-scenario-catalog { max-height: 300px; }
  .dc-quickstart-list li { grid-template-columns: 28px minmax(0, 1fr); }
  .dc-quickstart-list li > b { grid-column: 2; }
  .developer-panel-heading, .section-heading { display: block; }
  .developer-panel-heading > p { margin-top: 8px; }
  :is(.connections-main, .mock-main, .pilot-main, .white-label-main, .guide-main) { padding-inline: 16px; }
  :is(.connections-hero, .mock-hero, .pilot-hero, .white-label-hero, .implementation-hero, .engineering-home-hero, .security-hero) { grid-template-columns: 1fr; padding-block: 20px; }
  :is(.connections-hero, .mock-hero, .pilot-hero, .white-label-hero, .security-hero) h1 { font-size: 26px; line-height: 34px; }
  .truth-register { display: flex; flex-wrap: wrap; }
  .truth-register > div { flex: 1 1 140px; }
  .evidence-panel { border-left: 1px solid var(--line); }
}
@media (max-width: 390px) {
  .cr-suite-brand strong { font-size: 17px; }
  .cr-runtime-environment__identity { display: block; }
  .cr-runtime-environment__identity::after { display: block; margin-top: 2px; }
  .session-button small { display: none; }
  .dc-fact-register, .dc-request-meta { grid-template-columns: 1fr; }
}
@media (pointer: coarse) { body :where(button, .button, .nav-link, .cr-suite-link, input:not([type="checkbox"]):not([type="radio"]), select, summary) { min-height: 44px; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; } }

/* Complete the domain-specific tokens without changing their state vocabulary. */
:root { --font-sans: var(--cr-font-sans); --font-mono: var(--cr-font-mono); --sidebar-width: 236px; --ink-soft: var(--muted); --ink-faint: var(--muted); --surface-soft: var(--surface-2); --green-dark: #1848ad; --color-bg: var(--bg); --color-surface: var(--surface); --color-surface-subtle: var(--surface-2); --color-ink: var(--text); --color-ink-muted: var(--muted); --color-ink-faint: var(--muted); --color-line: var(--line); --color-accent: var(--accent); --color-sidebar: var(--sidebar); --color-sidebar-raised: var(--surface-2); --color-sidebar-ink: var(--sidebar-text); --color-sidebar-muted: var(--sidebar-muted); --color-sidebar-border: var(--line); }
.cr-suite-enabled .topbar { top: auto !important; }
.cr-suite-enabled .sidebar { top: calc(var(--cr-suite-height) + 40px) !important; height: calc(100dvh - var(--cr-suite-height) - 40px) !important; }
html[data-developer-route="true"] body[data-developer-workspace] .sidebar .nav > .nav-group:not([data-developer-navigation]) { display: none; }
html[data-developer-route="true"] body[data-developer-workspace] .developer-context-links { display: grid; gap: 4px; padding-top: 14px; margin-top: 14px; border-top: 1px solid var(--line); }
html[data-developer-route="true"] body[data-developer-workspace] .developer-context-links summary { cursor: pointer; color: var(--muted); padding: 10px 12px; font-size: 13px; }
html[data-developer-route="true"] body[data-developer-workspace] .developer-context-links details .nav-link { margin-left: 8px; }
.cr-context-details { display: block; padding: 0; border: 1px solid var(--line); border-radius: 12px; color: var(--text); background: var(--surface); }
.cr-context-details > summary { display: block; min-height: 42px; padding: 11px 16px; font: 500 13px/20px var(--cr-font-sans); cursor: pointer; }
.cr-context-details > summary::after { content: "+"; float: right; }
.cr-context-details[open] > summary::after { content: "−"; }
.cr-context-details:not([open]) > :not(summary) { display: none !important; }
.cr-context-details[open] > div { padding: 14px 16px; border-top: 1px solid var(--line); }
.cr-context-details[open] > dl { margin: 0; padding: 0 16px 16px; }
.cr-context-details[open] > dl div { background: var(--surface-2); }
.cr-context-details[open] :is(.eyebrow, dt, dd) { color: var(--text); }
.mock-studio-main { width: auto; max-width: 1440px; padding: 24px 32px 60px; }
.studio-hero { grid-template-columns: minmax(0, 1fr) minmax(230px, .5fr); gap: 24px; padding: 0 0 18px; }
.studio-hero h1 { font-size: 30px; line-height: 38px; letter-spacing: -.02em; }
.studio-hero-copy > p:not(.eyebrow) { max-width: 80ch; font-size: 14px; line-height: 22px; }
.studio-contract { padding: 16px; border-radius: 12px; }
.studio-contract :where(strong, dt, dd) { font-size: 12px; line-height: 19px; }
.connections-main { padding-top: 0; }
.connections-hero { padding-block: 22px; }
.session-panel, .studio-session { margin-block: 16px; padding: 16px 20px; border-radius: 16px; }
.session-panel h2, .studio-session h2 { font-size: 18px; line-height: 24px; }
.session-panel p, .studio-session p { font-size: 13px; line-height: 20px; }
.session-panel :is(label, small), .studio-session :is(label, small) { font-family: var(--cr-font-sans); font-size: 12px; line-height: 18px; }
.scenario-rail, .connection-tabs { position: relative; top: auto; display: flex; flex-wrap: wrap; overflow: visible; gap: 4px; margin: 0 0 20px; padding: 8px 0; background: transparent; }
.scenario-rail a, .connection-tabs a { font-family: var(--cr-font-sans); font-size: 13px; line-height: 20px; padding: 8px 12px; min-height: 38px; border-radius: 12px; white-space: normal; }
.scenario-rail a[aria-current="page"], .connection-tabs a[aria-current="page"] { background: var(--surface-3); color: var(--accent); border-color: var(--line); }
.studio-workspace { grid-template-columns: minmax(280px, .9fr) minmax(320px, 1.1fr); gap: 20px; }
.fixture-form, .result-register { border-radius: 16px; box-shadow: none; }
.fixture-form > header, .result-register > header { padding: 18px 20px; min-height: 70px; }
.fixture-form h2, .result-register h2 { font-size: 18px; line-height: 24px; }
.fixture-form > .form-intro { font-size: 13px; line-height: 20px; }
.artifact-grid { grid-template-columns: 1fr; gap: 0; }
.artifact { padding: 16px 20px; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; }
.artifact header { flex-wrap: wrap; }
.artifact h3 { font-size: 16px; line-height: 23px; }
.artifact :is(p, dd, dt) { font-size: 13px; line-height: 20px; }
.artifact header > span { display: none; }
.connection-card-grid { display: grid; grid-template-columns: 1fr; gap: 0; border: 1px solid var(--line); border-radius: 16px; }
.connection-card { display: grid; grid-template-columns: minmax(170px, 1fr) minmax(140px, .8fr) minmax(220px, 1.3fr); gap: 18px; padding: 16px 20px; min-height: 78px; align-items: center; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; box-shadow: none; }
.connection-card:last-child { border-bottom: 0; }
.connection-card .connection-mark { display: none; }
.connection-card .connection-card-copy { grid-column: auto; }
.connection-card .connection-card-copy b { font-size: 15px; line-height: 21px; }
.connection-card .connection-card-copy small, .connection-card .card-detail { grid-column: auto; font-size: 13px; line-height: 20px; }
.connection-card .status-badge { justify-self: start; font: 500 12px/18px var(--cr-font-sans); }
.form-page .page-heading h2 { font-size: 20px; line-height: 28px; }
.form-page .boundary-grid { margin-bottom: 20px; }
.form-page .boundary-grid :is(h3, p) { font-size: 14px; line-height: 21px; }
.guide-hero { padding-block: 24px; }
.guide-hero h1, .catalog-hero h1, .journey-screen-heading h1, .white-label-page h1 { font-size: 30px; line-height: 38px; letter-spacing: -.02em; max-width: 38ch; }
.guide-hero p, .catalog-hero p, .journey-screen-heading p { font-size: 15px; line-height: 23px; }
.journey-screen-heading, .catalog-hero { padding-block: 24px; margin-bottom: 24px; }
.actor-node { display: flex; flex-direction: column; gap: 8px; min-width: 0; height: auto; }
.actor-node .boundary-states { position: static; display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
.actor-node .boundary-states b { display: block; max-width: 100%; white-space: normal; overflow-wrap: anywhere; font: 500 12px/18px var(--cr-font-sans); }
.actor-node > strong { font-size: 15px; line-height: 22px; }
.actor-node > small { font-size: 13px; line-height: 21px; }
.workspace h1 { font-size: 26px; line-height: 32px; }
.workspace .view-heading h2, .workspace .section-heading h2 { font-size: 24px; line-height: 31px; }
.workspace :is(.truth-register, .sidebar-session) :is(strong, small, p) { font-family: var(--cr-font-sans); font-size: 12px; line-height: 19px; white-space: normal; }
@media (max-width: 1180px) { .cr-suite-enabled .sidebar { top: var(--cr-suite-height) !important; height: calc(100dvh - var(--cr-suite-height)) !important; } }
@media (max-width: 767px) {
  .mock-studio-main { padding: 20px 16px 40px; }
  .studio-hero, .studio-workspace { grid-template-columns: 1fr; }
  .studio-hero h1, .guide-hero h1, .catalog-hero h1, .journey-screen-heading h1, .white-label-page h1 { font-size: 26px; line-height: 34px; }
  .studio-contract { display: none; }
  .connection-card { grid-template-columns: minmax(0, 1fr) auto; padding: 16px; gap: 10px; }
  .connection-card .card-detail { grid-column: 1 / -1; }
  .topbar h1 { white-space: normal; overflow: visible; }
  .actor-node { max-width: 100%; }
}
.dc-inspector .dc-code-language > span { color: #b5c3d0; }
.dc-code-toolbar .dc-code-language { margin: 0; }
.dc-explorer-form, .dc-explorer-layout > .dc-inspector { margin-top: 0; }
.dc-request-meta { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; padding: 1px; border-radius: 0; }
.dc-request-meta > div { padding: 10px 14px; }
.dc-request-meta > div:nth-child(2) { grid-column: auto; }
.dc-request-meta dd { margin-top: 3px; }
.dc-code-toolbar { margin-top: 0; }
.dc-inspector #dc-api-output { margin: 0; border-radius: 0; border-inline: 0; }
.dc-api-response-details > summary { min-height: 44px; padding: 12px 16px; font-size: 13px; line-height: 20px; color: #b5c3d0; cursor: pointer; }
.dc-api-response-details { border-top: 1px solid #3b4c5d; }
#dc-panel-api .dc-api-response-status { flex: 0 0 auto; text-align: right; color: #b5c3d0; font-size: 12px; line-height: 20px; white-space: nowrap; }
#dc-panel-api #dc-api-latency { display: none; font: 400 12px/18px var(--cr-font-mono); }
#dc-panel-api:has(#dc-api-request-meta:not([hidden])) #dc-api-latency { display: block; }
.dc-inspector .dc-code-actions { flex-shrink: 1; }
.primary-nav a { color: var(--sidebar-muted); }
.primary-nav a:hover { color: var(--sidebar-text); background: var(--surface-2); }
.sidebar .brand-block :is(strong, span) { color: var(--sidebar-text); }
:root { --color-canvas: var(--bg); --color-surface-raised: var(--surface); --color-line-strong: var(--line-strong); --color-accent-soft: var(--surface-3); }
@media (max-width: 767px) { .dc-request-meta { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.developer-console :is(.primary-button, .ghost-button, .dc-row-action) { font: 500 14px/20px var(--cr-font-sans); }
.developer-console-actions .primary-button { color: var(--accent-ink); background: var(--accent-fill); }
.developer-console :is(.dc-pack-tabs, .dc-webhook-tabs) { flex-wrap: wrap; overflow: visible; }
.developer-console :is(.dc-pack-tabs, .dc-webhook-tabs) button { font: 500 13px/20px var(--cr-font-sans); }
.developer-console :is(.dc-integration-start, .dc-durable-run, .dc-pack-heading, .dc-webhook-heading, .dc-doc-workflow, .dc-doc-operations, .dc-doc-scenarios) h4 { font-size: 18px; line-height: 25px; }
.developer-console :is(.dc-scenario-tags span, .dc-binding-preflight li small, .dc-opaque-id-main small, .dc-opaque-id-main span, .dc-integration-start-list li > b) { font-family: var(--cr-font-sans); font-size: 12px; line-height: 18px; letter-spacing: 0; }
.dc-operation-summary code { display: block; font-size: 12px; }
@media (min-width: 900px) {
  #dc-panel-scenarios { display: grid; grid-template-columns: minmax(280px, .9fr) minmax(320px, 1.1fr); gap: 12px 20px; align-items: start; }
  #dc-panel-scenarios > .developer-panel-heading { grid-column: 1 / -1; }
  #dc-panel-scenarios > .dc-scenario-search, #dc-panel-scenarios > .dc-search-status, #dc-panel-scenarios > .dc-scenario-catalog { grid-column: 1; }
  #dc-panel-scenarios > .dc-inspector { grid-column: 2; grid-row: 2 / span 3; margin-top: 0; }
  #dc-panel-scenarios > .dc-scenario-catalog { margin-top: 0; max-height: 520px; }
}
.session-register { margin: 16px 0; padding: 16px 20px; gap: 24px; border-radius: 16px; }
.session-register h2 { font-size: 18px; line-height: 24px; }
.session-register :is(p, label, small) { font-family: var(--cr-font-sans); font-size: 13px; line-height: 20px; }
.connections-page .connections-main :is(h2, .form-intro h3) { font-size: 24px; line-height: 32px; font-weight: 600; letter-spacing: -.015em; }
.connections-page .page-heading { gap: 20px; margin-bottom: 16px; align-items: start; }
.connections-page .session-panel { gap: 20px; margin-block: 12px 16px; }
.connections-page .session-copy > p:not(.eyebrow) { margin: 0; font-size: 13px; line-height: 20px; }
.connections-page .session-credential-details { margin-top: 6px; font-size: 12px; line-height: 19px; }
.connections-page .session-credential-details > summary { padding-block: 6px; color: var(--accent); cursor: pointer; }
.connections-page .session-credential-details p { margin: 6px 0 0; font-size: 12px; line-height: 19px; color: var(--muted); }

/* The same bundle initializes on technical routes; keep their native navigation. */
.sidebar [data-developer-navigation], .sidebar .developer-context-links { display: none; }
html[data-developer-route="true"] .sidebar [data-developer-navigation] { display: block; }
html[data-developer-route="true"] .sidebar .developer-context-links { display: grid; }
.developer-panel-heading h3 { font-size: 18px; line-height: 24px; letter-spacing: -.015em; }
.section-heading h2 { font-size: 24px; line-height: 31px; letter-spacing: -.015em; }
/* Workspace links have no leading icon, so they occupy the full navigation row. */
html[data-developer-route="true"] .developer-sidebar-nav { display: grid; grid-template-columns: minmax(0, 1fr); width: 100%; }
html[data-developer-route="true"] .developer-sidebar-nav .nav-link { display: block; width: 100%; height: auto; min-height: 40px; padding: 10px 12px; white-space: normal; overflow-wrap: break-word; line-height: 20px; }

.dc-api-mobile-switch { display: none; }
@media (max-width: 767px) {
  #dc-panel-api .dc-explorer-layout > .dc-inspector { padding: 0; }
  #dc-panel-api .dc-inspector > header { min-height: 0; padding: 14px 16px; gap: 12px; }
  #dc-panel-api .dc-inspector > header .eyebrow { display: none; }
  #dc-panel-api .dc-inspector > header h4 { margin: 0; font-size: 16px; line-height: 22px; }
  #dc-panel-api .dc-code-toolbar { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; padding: 0 16px 12px; }
  #dc-panel-api .dc-code-tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); width: 100%; gap: 4px; }
  #dc-panel-api .dc-code-tabs button { min-width: 0; min-height: 44px; padding: 6px 4px; font-size: 12px; }
  #dc-panel-api .dc-code-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; align-items: center; }
  #dc-panel-api .dc-code-language { grid-column: 1 / -1; min-width: 0; margin: 0; }
  #dc-panel-api .dc-code-language > span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  #dc-panel-api .dc-code-language select { width: 100%; min-height: 40px; }
  #dc-panel-api .dc-code-actions .ghost-button { width: 100%; min-width: 0; min-height: 44px; padding: 6px 8px; font-size: 12px; }
  #dc-panel-api .dc-inspector #dc-api-output { padding: 16px; min-height: 180px; }
}
@media (max-width: 760px) {
  .workspace .topbar .session-button { width: 44px; min-height: 44px; padding: 0; }
  .workspace .topbar .session-button > span { display: none; }
}
@media (max-width: 1180px) {
  body:not(.mobile-nav-open) #primary-navigation { visibility: hidden; pointer-events: none; }
  #primary-navigation[aria-hidden="true"] { visibility: hidden; }
}
@supports selector(:has(*)) {
  @media (max-width: 767px) {
    .dc-api-mobile-switch { display: flex; min-width: 0; gap: 4px; margin: 0 0 16px; padding: 4px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); }
    .dc-api-mobile-switch label { display: flex; align-items: center; justify-content: center; flex: 1; gap: 8px; min-height: 44px; margin: 0; padding: 8px 12px; border-radius: 12px; cursor: pointer; }
    .dc-api-mobile-switch input { flex: 0 0 auto; width: 16px; height: 16px; min-height: 16px; margin: 0; accent-color: var(--accent); }
    .dc-api-mobile-switch label:has(:checked) { color: var(--accent); background: var(--surface-3); }
    #dc-panel-api:has(#dc-mobile-response:checked) .dc-explorer-form,
    #dc-panel-api:has(#dc-mobile-request:checked) .dc-explorer-layout > .dc-inspector { display: none; }
  }
}

/* A scenario opens its existing guarded runner in the same workspace. */
#dc-panel-scenarios[data-runner-mounted="true"] { display: block; }
#dc-panel-scenarios[data-runner-mounted="true"] > :is(.dc-scenario-search, .dc-search-status, .dc-scenario-catalog, .dc-inspector) { display: none; }
.dc-scenario-runner { display: grid; grid-template-columns: minmax(280px, .85fr) minmax(360px, 1.15fr); gap: 20px; align-items: start; }
.dc-scenario-runner .dc-buy-form { margin: 0; padding: 20px; }
.dc-scenario-protocol { min-width: 0; padding: 20px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); }
.dc-scenario-protocol h4 { font-size: 18px; line-height: 24px; margin: 0 0 8px; }
.dc-scenario-source, .dc-scenario-run-empty { font-size: 13px; line-height: 20px; color: var(--muted); }
.dc-scenario-protocol .dc-checkout-progress { margin-top: 16px; }
.dc-scenario-protocol .dc-checkout-progress li { grid-template-columns: 24px minmax(0, 1fr) auto; padding: 12px 0; }
.dc-scenario-protocol .dc-checkout-progress :is(strong, b) { font-size: 12px; line-height: 18px; }
.dc-scenario-protocol .dc-checkout-progress code { font-size: 11px; overflow-wrap: anywhere; }
.dc-scenario-protocol :is(.dc-run-source-grid, .dc-run-detail-grid, .dc-checkout-result) { grid-template-columns: minmax(0, 1fr); }
.dc-scenario-protocol .dc-durable-run { padding: 16px 0; border: 0; }
.dc-scenario-result-details > summary { padding: 12px; font-size: 14px; cursor: pointer; border: 1px solid var(--line); border-radius: 12px; }
.dc-scenario-assertions { margin-top: 16px; }
.dc-scenario-assertions .dc-assertion-list article { padding: 12px 0; }
.dc-scenario-assertions :is(strong, small, b) { font-size: 12px; line-height: 19px; overflow-wrap: anywhere; }
@media (max-width: 767px) {
  .dc-scenario-runner { grid-template-columns: minmax(0, 1fr); }
  .dc-scenario-protocol { padding: 16px; }
  .dc-scenario-protocol .dc-checkout-progress li { grid-template-columns: 24px minmax(0, 1fr); }
  .dc-scenario-protocol .dc-checkout-progress li > b { grid-column: 2; }
}

/* Compact engineering headers; long-form context stays in native disclosures. */
.engineering-home.section { min-height: 0; gap: 20px; }
.implementation-page > :is(.implementation-hero, .deployment-blueprint, .delivery-profiles, .implementation-phases, .implementation-truth, .implementation-ownership, .delivery-register) { padding-inline: 0; padding-block: 24px; }
.implementation-page > .implementation-hero { align-items: start; grid-template-columns: minmax(0, 1fr) minmax(240px, .42fr); min-height: 0; padding-top: 0; gap: 24px; }
.implementation-page .implementation-hero-copy { align-self: start; min-width: 0; }
.implementation-page .implementation-hero h2, .engineering-home .engineering-home-hero h2 { margin: 8px 0 0; font-size: 30px; line-height: 38px; font-weight: 600; letter-spacing: -.02em; }
.implementation-page .implementation-lead { margin-top: 12px !important; font-size: 14px; line-height: 22px; }
.implementation-page .implementation-actions, .engineering-home .engineering-home-actions { margin-top: 16px; gap: 8px 16px; }
.implementation-page .implementation-answer { align-self: start; min-width: 0; width: 100%; max-width: none; padding: 0; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.implementation-page .implementation-answer > summary { min-height: 44px; padding: 12px 16px; color: var(--text); }
.implementation-page .implementation-answer[open] > div { padding: 16px; }
.implementation-page .implementation-answer h3 { margin: 0; font-size: 18px; line-height: 25px; letter-spacing: -.015em; }
.implementation-page .implementation-answer ol { margin-top: 12px; }
.implementation-page .implementation-answer li { grid-template-columns: 24px minmax(0, 1fr); gap: 8px; padding: 10px 0; }
.implementation-page .implementation-answer li :is(strong, small) { font-family: var(--cr-font-sans); font-size: 13px; line-height: 19px; }
.implementation-page :is(.deployment-blueprint, .delivery-profiles, .implementation-phases, .implementation-truth, .implementation-ownership, .delivery-register) > header { align-items: start; gap: 16px; margin-bottom: 16px; }
.implementation-page :is(.deployment-blueprint, .delivery-profiles, .implementation-phases, .implementation-truth, .implementation-ownership, .delivery-register) > header h3 { font-size: 22px; line-height: 29px; letter-spacing: -.015em; }
.engineering-home .engineering-home-hero { align-items: start; padding-block: 0; }
.engineering-home .engineering-home-hero > div > p:last-of-type { margin-top: 12px; font-size: 14px; line-height: 22px; }
.engineering-home .console-boundary-note { padding: 16px; }
.engineering-home .console-boundary-note h3 { margin-top: 8px; font-size: 18px; line-height: 25px; }
.engineering-home .console-scope-list { margin-top: 12px; }

/* Labels occupy real layout space; no status or evidence text is clipped. */
.architecture-page .deployment-flow { grid-template-columns: minmax(0, .9fr) 72px minmax(0, 1.25fr) 72px minmax(0, .9fr); }
.architecture-page .deployment-zone { padding: 16px; }
.architecture-page .deployment-zone-title { gap: 8px; padding-bottom: 12px; }
.architecture-page .deployment-zone-title > span { flex: 0 0 28px; width: 28px; height: 28px; }
.architecture-page .deployment-zone-title p { min-width: 0; }
.architecture-page .deployment-zone-title strong { font-size: 15px; line-height: 21px; }
.architecture-page .deployment-zone > ol li { min-height: 0; padding: 12px 22px 12px 0; }
.architecture-page .deployment-zone > ol li::after { top: 12px; }
.architecture-page .deployment-zone > ol em { position: static; inset: auto; display: block; margin-top: 6px; font-family: var(--cr-font-sans); font-size: 11px; line-height: 17px; font-weight: 500; letter-spacing: 0; white-space: normal; overflow-wrap: anywhere; }
.architecture-page .deployment-zone > ol :is(b, small), .architecture-page .runtime-topology :is(b, small) { font-family: var(--cr-font-sans); font-size: 12px; line-height: 18px; }
.architecture-page :is(.deployment-zone-title small, .deployment-data-note, .deployment-blueprint figcaption) { font-family: var(--cr-font-sans); font-size: 12px; line-height: 18px; letter-spacing: 0; }
.architecture-page .deployment-handoff :is(span, small) { display: block; max-width: 100%; font-size: 11px; line-height: 16px; letter-spacing: 0; overflow-wrap: anywhere; }
.architecture-page .runtime-topology :is(div, span) { min-width: 0; overflow-wrap: anywhere; }
.architecture-page .runtime-topology :is(.runtime-ingress, .runtime-replicas > span, .runtime-core > span, .runtime-async > span) { padding: 10px; }
.architecture-page .runtime-async { grid-template-columns: minmax(0, 1fr); }
.architecture-page .deployment-blueprint > header > span { max-width: 100%; white-space: normal; font-size: 11px; line-height: 17px; }

/* This disclosure preserves the existing truth-api/truth-provider update targets. */
.workspace > .workspace-capabilities { margin: 0; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; background: var(--surface); }
.workspace > .workspace-capabilities > summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 44px; padding: 12px 28px; color: var(--muted); }
.workspace > .workspace-capabilities[open] > .truth-register { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); padding: 0; margin: 0; border-top: 1px solid var(--line); border-bottom: 0; }
.workspace > .workspace-capabilities .truth-register > span { padding: 12px 16px; }
.workspace > .workspace-capabilities .truth-register :is(b, strong, small) { overflow: visible; font-family: var(--cr-font-sans); font-size: 12px; line-height: 19px; letter-spacing: 0; text-overflow: clip; white-space: normal; overflow-wrap: anywhere; }

/* Match legacy important boundary-link specificity in both themes and states. */
.cr-suite-bar[data-surface] .cr-suite-tool[data-boundary="true"],
.cr-suite-bar[data-surface="developer"] .cr-suite-tool[data-boundary="true"] { color: var(--text) !important; background: var(--surface); border-color: var(--line-strong); }
.cr-suite-bar[data-surface] :is(.cr-suite-link, .cr-suite-tool):is(:hover, :focus-visible) { color: var(--text) !important; background: var(--surface-2); }
.cr-suite-bar[data-surface] .cr-suite-tool[data-boundary="true"]:is(:hover, :focus-visible) { color: var(--text) !important; background: var(--surface-2); border-color: var(--accent); }
.cr-suite-bar[data-surface] .cr-suite-tool[data-variant="primary"] { color: var(--accent-ink) !important; background: var(--accent-fill); border-color: var(--accent-fill); }
.cr-suite-bar[data-surface] .cr-suite-menu summary { color: var(--text); border-color: var(--line-strong); }
.cr-suite-bar[data-surface] .cr-suite-menu summary::after { color: var(--accent); }
.topbar .icon-button { color: var(--text); background: var(--surface); border-color: var(--line-strong); }
.topbar .icon-button:is(:hover, :focus-visible):not(:disabled) { color: var(--accent); background: var(--surface-2); border-color: var(--accent); }
.topbar .icon-button .ui-icon { width: 18px; height: 18px; color: inherit; fill: none; stroke: currentColor; stroke-width: 1.75; }

@container implementation-page (max-width: 800px) {
  .implementation-page > .implementation-hero { grid-template-columns: minmax(0, 1fr); gap: 16px; }
}
@container deployment-blueprint (max-width: 960px) {
  .architecture-page .deployment-flow { grid-template-columns: minmax(0, 1fr); }
  .architecture-page .deployment-handoff { min-height: 56px; grid-template-columns: minmax(0, auto) minmax(0, auto) minmax(0, 1fr) auto; align-items: center; justify-content: stretch; gap: 8px; padding: 12px 16px; border-inline: 0; border-block: 1px solid var(--line); }
  .architecture-page .deployment-handoff::after { grid-row: 1; grid-column: 4; margin: 0; transform: rotate(90deg); }
  .architecture-page .deployment-handoff > small { max-width: none; }
}
@media (max-width: 1100px) {
  .architecture-page .deployment-flow { grid-template-columns: minmax(0, 1fr); }
  .architecture-page .deployment-handoff { min-height: 56px; grid-template-columns: minmax(0, auto) minmax(0, auto) minmax(0, 1fr) auto; align-items: center; justify-content: stretch; gap: 8px; padding: 12px 16px; border-inline: 0; border-block: 1px solid var(--line); }
  .architecture-page .deployment-handoff::after { grid-row: 1; grid-column: 4; margin: 0; transform: rotate(90deg); }
}
@media (max-width: 767px) {
  .implementation-page > .implementation-hero { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .implementation-page .implementation-hero h2, .engineering-home .engineering-home-hero h2 { font-size: 26px; line-height: 34px; }
  .implementation-page > :is(.deployment-blueprint, .delivery-profiles, .implementation-phases, .implementation-truth, .implementation-ownership, .delivery-register) { padding-block: 20px; }
  .workspace > .workspace-capabilities > summary { padding-inline: 16px; }
  .workspace > .workspace-capabilities[open] > .truth-register { grid-template-columns: minmax(0, 1fr); }
  .workspace > .workspace-capabilities .truth-register > span { border-right: 0; border-bottom: 1px solid var(--line); }
  .workspace > .workspace-capabilities .truth-register > span:last-child { border-bottom: 0; }
}

/* The former dark hero now uses a neutral surface: foreground must follow it. */
body .developer-console-hero,body .developer-console-intro :is(h2,p),body .developer-console-hero .ghost-button { color:var(--text); }
body .developer-console-hero .ghost-button { background:var(--surface-2); border-color:var(--line); }
body :is(.primary-button,.ghost-button,.icon-button,.session-button,.dc-row-action,.button,.tab,.flow-control,.flow-scenario) { min-height:42px; border-radius:12px; font:500 14px/1.45 var(--sans); letter-spacing:0; text-transform:none; }
body :is(button,.button,.primary-button,.ghost-button,[role="tab"]) { transition:background-color 150ms ease,color 150ms ease,border-color 150ms ease,box-shadow 150ms ease; }
body :is(.primary-button,.ghost-button,.dc-row-action):active:not(:disabled) { transform:translateY(1px); }
body :is(.ghost-button,.dc-row-action) { background:var(--surface-2); color:var(--text); border:1px solid var(--line); }
body :is(button,.button):disabled { opacity:1; color:var(--muted); background:var(--surface-2); cursor:not-allowed; }
body :is(h2,.section-heading h2,.developer-console-intro h2) { font-size:24px; line-height:1.25; }
body :is(.panel-heading h2,.developer-panel-heading h3,.dc-surface h4,.dc-inspector h4) { font-size:18px; line-height:1.35; }
body :is(.flow-heading h2,.architecture-heading h2,.overview-heading h2) { font-size:26px; }
body :is(.nav-label,.nav-link span) { white-space:normal; overflow:visible; text-overflow:clip; }
body :is(.nav-link,.primary-nav a) { border-radius:10px; }
body :is(.dc-surface,.dc-inspector,.panel,.form-block,.flow-stage,.architecture-panel) { border-radius:16px; }
body :is(.tabs button,.segmented button,[role="tab"]) { min-height:40px; border-radius:10px; font-size:14px; }
body :is(.section-heading>p,.panel-heading p,.developer-panel-heading>p) { font-size:15px; line-height:1.5; }
body :is(pre,code) { font-size:13px; line-height:1.6; }
body :is(.dc-surface,.panel,.workspace,.main,.section,.app-shell) { min-width:0; }
body :is(button,input,select,textarea,a,summary) { scroll-margin-block:100px 24px; }
.cr-sidebar-collapse { display:flex; align-items:center;gap:8px;min-height:40px;width:100%;border:1px solid var(--line);border-radius:12px;background:var(--surface-2);color:var(--text);padding:8px 12px;margin-bottom:16px; }
.cr-sidebar-collapse svg { width:18px;height:18px;flex:none; }
@media(min-width:1181px) {
  body[data-sidebar-collapsed="true"] { --shell-sidebar:76px; }
  body[data-sidebar-collapsed="true"] .sidebar :is(.brand,.nav-group-title,.nav-label,.sidebar-bottom,.nav-group>summary) { display:none; }
  body[data-sidebar-collapsed="true"] .sidebar .nav-link { justify-content:center;min-height:44px;padding:10px; }
  body[data-sidebar-collapsed="true"] .cr-sidebar-collapse span { display:none; }
  body[data-sidebar-collapsed="true"] .sidebar details.nav-group:not([open])>.nav-link { display:flex; }
}
@media(max-width:1180px) { .cr-sidebar-collapse { display:none; } }
@media(max-width:480px) { body :is(button,.button,input,select) { min-height:44px; } body #main>.section { padding:20px 16px; } }
@media(prefers-reduced-motion:reduce) { body :is(button,a,.sidebar) { transition:none; } }
@media print { details>* { display:block!important; } [hidden] { display:none!important; } }

/* Quickstart keeps its single action next to the expected outcome. */
body[data-active-developer-module="quickstart"] .developer-console-actions { display: none; }