/* Native CSS. Load after tokens.css. No external fonts, imports or assets. */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-padding-top: calc(var(--cx-header) + var(--cx-environment) + var(--cx-space-6)); scroll-padding-bottom: calc(var(--cx-actionbar) + var(--cx-space-6)); }
body { margin: 0; color: var(--cx-ink); background: var(--cx-canvas); font: var(--cx-text-body)/var(--cx-leading) var(--cx-font); }
.cx-stack { min-width: 0; }
.cx-stack > * { min-width: 0; overflow-wrap: anywhere; }
.cx-data-table .cx-table-wrap > table.cx-table--wide { min-width: 820px; }
@media (min-width: 701px) { .cx-metric-row.cx-metric-row--five { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
body[data-environment="prod"] { --cx-environment: 0px; }
button, input, select, textarea { font: inherit; }
button, a, input, select, textarea, summary { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
button:disabled { cursor: not-allowed; }
a { color: var(--cx-code); text-underline-offset: 3px; }
img { max-width: 100%; height: auto; }
svg { vertical-align: middle; }
p { margin: 0 0 var(--cx-space-3); }
h1, h2, h3 { margin: 0; font-weight: var(--cx-weight-title); line-height: var(--cx-leading-heading); }
h1 { font-size: var(--cx-text-title); } h2 { font-size: var(--cx-text-section); } h3 { font-size: var(--cx-text-lead); }
:focus-visible { outline: var(--cx-focus-width) solid var(--cx-focus); outline-offset: var(--cx-focus-offset); }
.cx-masthead :focus-visible, .cx-brand-band :focus-visible { outline-color: var(--cx-on-brand); }
[hidden] { display: none !important; }
.cx-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.cx-skip { position: fixed; top: -80px; left: 20px; padding: 12px; background: var(--cx-paper); z-index: 100; }
.cx-skip:focus { top: 8px; }
.cx-icon { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.65; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
.cx-data { font-family: var(--cx-font-data); font-variant-numeric: tabular-nums lining-nums; }
.cx-mono { font-family: var(--cx-font-mono); font-variant-numeric: tabular-nums; }
.cx-muted { color: var(--cx-muted); }
.cx-meta { color: var(--cx-muted); font-size: var(--cx-text-body); }
.cx-link { min-height: 44px; display: inline-flex; align-items: center; gap: 6px; }
.cx-masthead { height: var(--cx-header); display: flex; align-items: center; gap: 22px; padding: 0 24px; color: var(--cx-on-brand); background: var(--cx-brand); position: sticky; top: 0; z-index: var(--cx-z-header); }
.cx-product { text-decoration: none; color: inherit; font-size: 19px; font-weight: 700; white-space: nowrap; letter-spacing: .02em; }
.cx-product span { font-size: 14px; font-weight: 400; margin-left: 8px; }
.cx-global-nav { display: flex; height: 100%; align-items: stretch; gap: 2px; }
.cx-global-nav a, .cx-nav-action { display: flex; align-items: center; justify-content: center; min-width: 50px; padding: 0 10px; color: inherit; text-decoration: none; white-space: nowrap; border: 0; background: transparent; border-bottom: 3px solid transparent; }
.cx-global-nav [aria-current="page"] { border-bottom-color: var(--cx-brand-light); background: var(--cx-nav-hover); }
.cx-global-nav a:hover, .cx-nav-action:hover { background: var(--cx-nav-hover); }
.cx-header-tools { margin-left: auto; display: flex; align-items: center; gap: 8px; }
.cx-header-tools button { color: inherit; background: transparent; border: 0; height: 44px; min-width: 44px; display: flex; align-items: center; justify-content: center; gap: 8px; }
.cx-header-logo { width: 112px; height: auto; display: block; margin-left: 6px; }
.cx-avatar { border: 1px solid var(--cx-border-on-dark); height: 30px; width: 30px; display: grid; place-items: center; font-weight: 700; }
.cx-environment { min-height: var(--cx-environment); display: flex; align-items: center; gap: 14px; padding: 2px 24px; background: var(--cx-demo); border-bottom: 1px solid var(--cx-rule); color: var(--cx-ink); position: sticky; top: var(--cx-header); z-index: var(--cx-z-header); }
body[data-page="login"] .cx-environment { top: 0; }
.cx-environment strong { font-size: 14px; }
.cx-environment .cx-asof { margin-left: auto; }
.cx-page { max-width: calc(var(--cx-max-width) + 48px); margin: 0 auto; padding: 18px 24px 16px; }
.cx-page-header { display: flex; justify-content: space-between; gap: 20px; align-items: center; margin-bottom: 20px; }
.cx-page-header p { margin: 6px 0 0; }
.cx-eyebrow { color: var(--cx-muted); display: flex; align-items: center; gap: 8px; margin-bottom: 7px; }
.cx-eyebrow .cx-icon { color: var(--cx-brand); }
.cx-breadcrumb { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; color: var(--cx-muted); }
.cx-breadcrumb a { min-height: var(--cx-control-height); display: flex; align-items: center; }
.cx-toolbar, .cx-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.cx-toolbar { padding: 12px 16px; background: var(--cx-paper); border-bottom: 1px solid var(--cx-rule); }
.cx-toolbar .cx-spacer { margin-left: auto; }
.cx-btn { min-height: var(--cx-control-height); padding: 9px 16px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; border: 1px solid var(--cx-control); border-radius: var(--cx-radius); background: var(--cx-paper); color: var(--cx-ink); text-decoration: none; font-weight: var(--cx-weight-label); line-height: 1.45; white-space: nowrap; transition: background-color var(--cx-duration-fast) var(--cx-ease); }
.cx-btn:hover { background: var(--cx-subtle); }
.cx-btn--primary { background: var(--cx-brand); border-color: var(--cx-brand); color: var(--cx-on-brand); }
.cx-btn--primary:hover { background: var(--cx-brand-hover); border-color: var(--cx-brand-hover); }
.cx-btn--text { background: transparent; border-color: transparent; color: var(--cx-code); padding: 9px 10px; }
.cx-btn--danger { background: var(--cx-danger); border-color: var(--cx-danger); color: var(--cx-on-brand); }
.cx-btn--danger:hover { background: var(--cx-danger); }
.cx-btn:disabled, .cx-btn[aria-disabled="true"] { color: var(--cx-muted); background: var(--cx-neutral-soft); border-color: var(--cx-rule); }
.cx-btn--icon { padding: 10px; min-width: 44px; }
.cx-btn.htmx-request { pointer-events: none; }
.cx-btn .htmx-indicator { display: none; } .cx-btn.htmx-request .htmx-indicator { display: inline-block; }
.cx-field { display: flex; flex-direction: column; gap: 6px; margin-bottom: 16px; }
.cx-field label { font-weight: 600; }
.cx-field input, .cx-field select, .cx-field textarea, .cx-input { color: var(--cx-ink); background: var(--cx-paper); border: 1px solid var(--cx-control); border-radius: var(--cx-radius); padding: 9px 12px; min-height: 44px; width: 100%; }
.cx-field input::placeholder, .cx-input::placeholder { color: var(--cx-muted); opacity: 1; }
.cx-field textarea { min-height: 90px; resize: vertical; }
.cx-field [aria-invalid="true"] { border-color: var(--cx-danger); }
.cx-field-error { color: var(--cx-danger); }
.cx-field-help { color: var(--cx-muted); }
.cx-check { display: flex; align-items: center; gap: 8px; min-height: 44px; }
.cx-check input { accent-color: var(--cx-brand); width: 18px; height: 18px; }
.cx-filter-field { display: flex; align-items: center; gap: 8px; } .cx-filter-field input { width: 235px; } .cx-filter-field select { width: 135px; }
.cx-panel { border: 1px solid var(--cx-rule); background: var(--cx-paper); border-radius: var(--cx-radius-panel); min-width: 0; }
.cx-panel-header { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 10px 16px; border-bottom: 1px solid var(--cx-rule); min-height: 48px; }
.cx-panel-body { padding: 16px; }
.cx-section-heading { display: flex; align-items: baseline; gap: 10px; margin-bottom: 14px; } .cx-section-heading span { color: var(--cx-muted); }
.cx-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--cx-grid-gap); }
.cx-span-12 { grid-column: span 12; } .cx-span-8 { grid-column: span 8; } .cx-span-7 { grid-column: span 7; } .cx-span-6 { grid-column: span 6; } .cx-span-5 { grid-column: span 5; } .cx-span-4 { grid-column: span 4; }
.cx-stack { display: grid; gap: 16px; } .cx-gap { margin-top: 20px; }
.cx-definition-list { margin: 0; min-width: 0; }
.cx-definition-list dt { font-weight: var(--cx-weight-label); }
.cx-definition-list dd { margin: 0 0 var(--cx-space-4); min-width: 0; overflow-wrap: anywhere; }
body[data-page="solution"] .cx-gate-red { color: var(--cx-danger); background: var(--cx-danger-soft); }
body[data-page="solution"] .cx-gate-yellow { color: var(--cx-warning); background: var(--cx-warning-soft); }
body[data-page="solution"] .cx-gate-green { color: var(--cx-success); background: var(--cx-success-soft); }
body[data-page="solution_cards"] #result-state.blocked,
body[data-page="solution_cards"] #flow-rules.blocked { color: var(--cx-danger); background: var(--cx-danger-soft); }
body[data-page="solution_cards"] tr.selected { background: var(--cx-brand-soft); }
body[data-page="solution_cards"] .item-label { overflow-wrap: anywhere; }
.cx-table--feature-catalog { table-layout: fixed; min-width: calc(var(--cx-inspector) * 2 + var(--cx-sidebar)); }
.cx-table--feature-catalog th:nth-child(1) { width: 15%; }
.cx-table--feature-catalog th:nth-child(2) { width: 10%; }
.cx-table--feature-catalog th:nth-child(3) { width: 20%; }
.cx-table--feature-catalog th:nth-child(4) { width: 30%; }
.cx-table--feature-catalog th:nth-child(5) { width: 10%; }
.cx-table--feature-catalog th:nth-child(6) { width: 15%; }
.cx-brand-band { display: flex; align-items: center; justify-content: space-between; padding: 18px 24px; color: var(--cx-on-brand); background: var(--cx-brand-night); border-left: 5px solid var(--cx-brand); min-height: 86px; }
.cx-brand-band>div { display: flex; gap: 18px; align-items: center; }
.cx-brand-band h2.cx-gap { margin-top: 0; }
.cx-brand-band h2 { font-size: 24px; } .cx-brand-band p { margin: 8px 0 0; }
.cx-brand-band img { width: 126px; margin-left: 16px; }
.cx-ribbon { display: inline-block; padding: 4px 20px 4px 10px; background: var(--cx-brand-middle); color: var(--cx-on-green); clip-path: polygon(0 0,100% 0,calc(100% - 9px) 50%,100% 100%,0 100%); font-weight: 700; }
.cx-kpis { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); background: var(--cx-paper); border: 1px solid var(--cx-rule); }
.cx-kpi { padding: 10px 20px; border-right: 1px solid var(--cx-rule); min-width: 0; } .cx-kpi:last-child { border: 0; }
.cx-kpi-label { color: var(--cx-muted); display: flex; gap: 8px; align-items: center; }
.cx-kpi-value { font-family: var(--cx-font-data); font-size: var(--cx-text-figure); line-height: 1.2; font-weight: 700; padding: 4px 0; }
.cx-kpi-value small { font-size: 16px; margin-left: 5px; font-weight: 400; }
.cx-kpi-note { color: var(--cx-muted); } .cx-kpi-note a { text-decoration: underline; }
.cx-table-wrap { overflow: auto; max-width: 100%; }
.cx-table { width: 100%; border-collapse: collapse; text-align: left; font-size: var(--cx-text-table); }
.cx-table th { background: var(--cx-subtle); color: var(--cx-ink); font-weight: 700; position: sticky; top: 0; z-index: 1; }
.cx-table th, .cx-table td { padding: 7px 14px; border-bottom: 1px solid var(--cx-rule); vertical-align: middle; height: var(--cx-row-height); }
.cx-table td small { display: block; font-size: 13px; color: var(--cx-muted); }
.cx-table .cx-num { text-align: right; font-family: var(--cx-font-data); font-variant-numeric: tabular-nums; white-space: nowrap; }
.cx-table tr:last-child td { border-bottom: 0; }
.cx-table tbody tr:hover { background: var(--cx-brand-soft); }
.cx-table tbody tr.cx-selected { background: var(--cx-brand-soft); }
.cx-table tbody tr.cx-selected td:first-child { box-shadow: inset 3px 0 var(--cx-brand); }
.cx-table button.cx-sort { padding: 0; min-height: var(--cx-control-height); border: 0; background: transparent; color: inherit; font-weight: 700; display: inline-flex; gap: 6px; align-items: center; }
.cx-project-link { padding: 0; min-height: var(--cx-control-height); border: 0; background: transparent; color: var(--cx-code); text-align: left; cursor: pointer; }
.cx-project-link:hover { text-decoration: underline; }
.cx-table--compact td { height: var(--cx-row-compact); padding-top: 7px; padding-bottom: 7px; }
.cx-table .cx-btn { font-size: 13px; }
.cx-badge { display: inline-flex; align-items: center; gap: 5px; padding: 2px 7px; border: 1px solid currentColor; font-size: 14px; white-space: nowrap; line-height: 1.5; border-radius: var(--cx-radius); }
.cx-table .cx-badge { font-size: 13px; }
.cx-badge .cx-icon { width: 14px; height: 14px; }
.cx-badge--not_started { color: var(--cx-neutral); background: var(--cx-neutral-soft); }
.cx-badge--code_complete { color: var(--cx-code); background: var(--cx-code-soft); }
.cx-badge--field_failed, .cx-badge--test_failed { color: var(--cx-danger); background: var(--cx-danger-soft); }
.cx-badge--passed { color: var(--cx-success); background: var(--cx-success-soft); }
.cx-gate { display: inline-flex; gap: 6px; align-items: flex-start; max-width: 100%; min-width: 0; color: var(--cx-ink); white-space: normal; overflow-wrap: anywhere; }
.cx-gate-dot { flex: 0 0 9px; width: 9px; height: 9px; margin-top: .4em; background: currentColor; border: 1px solid currentColor; }
.cx-gate--red { color: var(--cx-danger); } .cx-gate--yellow { color: var(--cx-warning); } .cx-gate--green { color: var(--cx-success); }
.cx-gate--yellow .cx-gate-dot { border-radius: 0; transform: rotate(45deg); width: 8px; height: 8px; }
.cx-gate--green .cx-gate-dot { border-radius: 50%; }
.cx-callout { border-left: 3px solid var(--cx-brand); background: var(--cx-brand-soft); padding: 12px 16px; display: flex; align-items: flex-start; gap: 10px; }
.cx-callout p:last-child { margin-bottom: 0; }
.cx-callout--warning { background: var(--cx-warning-soft); border-color: var(--cx-warning); }
.cx-callout--danger { background: var(--cx-danger-soft); border-color: var(--cx-danger); }
.cx-callout--success { background: var(--cx-success-soft); border-color: var(--cx-success); }
.cx-deadline { padding: 16px 20px; background: var(--cx-paper); }
.cx-deadline-top { display: flex; justify-content: space-between; gap: 10px; color: var(--cx-muted); }
.cx-clock { font-size: 38px; font-weight: 700; line-height: 1.3; margin: 10px 0 8px; font-family: var(--cx-font-data); font-variant-numeric: tabular-nums; }
.cx-clock small { font-size: 16px; margin: 0 7px 0 3px; font-weight: 400; }
.cx-clock--urgent { color: var(--cx-danger); } .cx-clock--warning { color: var(--cx-warning); }
.cx-deadline dl, .cx-detail-list { margin: 0; } .cx-deadline dl>div, .cx-detail-list>div { display: flex; justify-content: space-between; gap: 16px; padding: 5px 0; }
.cx-deadline dt, .cx-detail-list dt { color: var(--cx-muted); } .cx-deadline dd, .cx-detail-list dd { margin: 0; text-align: right; }
.cx-deadline-foot { border-top: 1px solid var(--cx-rule); padding-top: 10px; margin-top: 10px; }
.cx-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,150px),1fr)); border: 1px solid var(--cx-rule); background: var(--cx-paper); }
.cx-steps li { min-width: 0; position: relative; border-right: 1px solid var(--cx-rule); } .cx-steps li:last-child { border-right: 0; }
.cx-steps a, .cx-steps > li > span { display: flex; padding: 12px 10px; gap: 8px; text-decoration: none; color: inherit; min-height: 64px; align-items: center; }
.cx-steps > li > :is(a, span) > span:last-child { min-width: 0; overflow-wrap: anywhere; }
.cx-step-number { color: var(--cx-success); font-size: 23px; font-family: var(--cx-font-data); font-weight: 700; }
.cx-steps small { display: block; font-size: 14px; color: var(--cx-muted); }
.cx-steps .cx-current { background: var(--cx-brand); color: var(--cx-on-brand); } .cx-steps .cx-current a, .cx-steps .cx-current small { color: var(--cx-on-brand); }
.cx-steps .cx-current .cx-step-number { color: var(--cx-brand-light); }
.cx-list { list-style: none; padding: 0; margin: 0; }
.cx-list>li { padding: 8px 16px; border-bottom: 1px solid var(--cx-rule); display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.cx-list>li:last-child { border: 0; }
.cx-list p { margin: 3px 0 0; color: var(--cx-muted); }
.cx-progress { width: 90px; height: 5px; background: var(--cx-rule); display: inline-block; margin-left: 8px; vertical-align: middle; } .cx-progress span { height: 100%; display: block; background: var(--cx-brand); }
.cx-footer { max-width: var(--cx-max-width); margin: 16px auto 0; border-top: 1px solid var(--cx-rule); display: flex; align-items: center; gap: 16px; padding: 14px 24px; color: var(--cx-muted); min-height: 56px; }
.cx-footer img { width: 86px; margin-left: auto; } .cx-footer a { color: var(--cx-muted); }
.cx-project-head { background: var(--cx-paper); padding: 14px 24px; border-bottom: 1px solid var(--cx-rule); display: flex; justify-content: space-between; gap: 16px; align-items: center; }
.cx-project-head h1 { font-size: 22px; display: flex; align-items: baseline; gap: 12px; }
.cx-project-head p { margin: 6px 0 0; }
.cx-project-head .cx-mono { font-size: 14px; color: var(--cx-muted); font-weight: 400; }
.cx-project-context { color: var(--cx-muted); display: flex; gap: 16px; }
.cx-workbench { display: flex; min-height: calc(100vh - 226px); }
.cx-sidebar { width: var(--cx-sidebar); flex-shrink: 0; background: var(--cx-subtle); border-right: 1px solid var(--cx-rule); padding: 18px 12px; }
.cx-sidebar-title { padding: 0 12px 10px; color: var(--cx-muted); }
.cx-stage { display: flex; align-items: center; gap: 13px; padding: 6px 12px; color: var(--cx-ink); text-decoration: none; min-height: 54px; }
.cx-stage-num { font-family: var(--cx-font-data); font-size: 28px; line-height: 1; font-weight: 700; color: var(--cx-stage-number); min-width: 35px; }
.cx-stage small { display: block; color: var(--cx-muted); font-size: 14px; line-height: 1.4; }
.cx-stage:hover { background: var(--cx-paper); }
.cx-stage[aria-current="step"] { background: var(--cx-brand); color: var(--cx-on-brand); clip-path: polygon(0 0,calc(100% - 10px) 0,100% 50%,calc(100% - 10px) 100%,0 100%); }
.cx-stage[aria-current="step"] small { color: var(--cx-on-brand); } .cx-stage[aria-current="step"] .cx-stage-num { color: var(--cx-brand-light); }
.cx-sidebar-tools { border-top: 1px solid var(--cx-rule); margin-top: 14px; padding-top: 10px; }
.cx-sidebar-tools a { display: flex; align-items: center; gap: 10px; color: var(--cx-muted); padding: 9px 12px; min-height: 44px; text-decoration: none; }
.cx-work-content { flex: 1; min-width: 0; padding: 18px 24px 16px; }
.cx-work-title { display: flex; justify-content: space-between; gap: 14px; align-items: center; margin-bottom: 14px; }
.cx-work-title h2 { margin-top: 8px; font-size: 24px; } .cx-work-title p { margin: 6px 0 0; }
.cx-work-title>div:first-child { display: grid; grid-template-columns: max-content minmax(0,1fr); column-gap: 12px; row-gap: 6px; align-items: center; }
.cx-work-title h2 { margin-top: 0; }
.cx-work-title>div:first-child>p { grid-column: 1 / -1; margin: 0; }
.cx-tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--cx-rule); margin-bottom: 16px; overflow-x: auto; }
.cx-tabs a, .cx-tabs button { background: transparent; border: 0; border-bottom: 3px solid transparent; color: var(--cx-muted); padding: 10px 12px; min-height: 44px; text-decoration: none; white-space: nowrap; }
.cx-tabs [aria-current="page"], .cx-tabs [aria-pressed="true"] { border-bottom-color: var(--cx-brand); color: var(--cx-ink); font-weight: 700; }
.cx-actionbar { background: var(--cx-paper); border-top: 1px solid var(--cx-rule); padding: 10px 24px; min-height: 64px; display: flex; align-items: center; gap: 16px; position: sticky; bottom: 0; z-index: var(--cx-z-action); }
.cx-actionbar .cx-actions { margin-left: auto; }
.cx-split { display: grid; grid-template-columns: minmax(0,1fr) var(--cx-inspector); gap: 16px; }
.cx-inspector { background: var(--cx-paper); border: 1px solid var(--cx-rule); min-width: 0; }
.cx-inspector-header { padding: 12px 16px; border-bottom: 1px solid var(--cx-rule); display: flex; align-items: center; justify-content: space-between; }
.cx-inspector .cx-tabs { margin: 0; padding: 0 6px; } .cx-inspector .cx-tabs a, .cx-inspector .cx-tabs button { padding: 10px 9px; }
.cx-citation { color: var(--cx-code); background: var(--cx-code-soft); border: 1px solid var(--cx-code); padding: 2px 6px; display: inline-flex; align-items: center; gap: 4px; font-size: 13px; min-height: var(--cx-control-height); min-width: 0; max-width: 100%; overflow-wrap: anywhere; }
.cx-quote { border-left: 3px solid var(--cx-brand); padding: 9px 12px; margin: 12px 0; background: var(--cx-brand-soft); line-height: 1.7; }
mark { color: var(--cx-ink); background: var(--cx-brand-light); padding: 1px 3px; }
.cx-source-page { padding: 16px; border: 1px solid var(--cx-rule); background: var(--cx-paper); min-height: 210px; }
.cx-source-page h3 { font-size: 16px; border-bottom: 2px solid var(--cx-brand); padding-bottom: 10px; margin-bottom: 12px; }
.cx-source-page p { font-size: 14px; }
.cx-file { display: flex; align-items: center; gap: 12px; padding: 12px 16px; border-bottom: 1px solid var(--cx-rule); }
.cx-file:last-child { border: 0; }
.cx-file-icon { width: 38px; height: 44px; display: grid; place-items: center; border: 1px solid var(--cx-control); color: var(--cx-code); font-size: 14px; font-weight: 700; }
.cx-file-info { flex: 1; min-width: 0; } .cx-file-info strong { overflow-wrap: anywhere; } .cx-file-info p { color: var(--cx-muted); margin: 2px 0 0; overflow-wrap: anywhere; }
.cx-dropzone { border: 1px dashed var(--cx-control); background: var(--cx-paper); padding: 26px 18px; text-align: center; }
.cx-dropzone .cx-icon { color: var(--cx-brand); width: 28px; height: 28px; margin-bottom: 8px; }
.cx-dropzone h3 { margin-bottom: 6px; } .cx-dropzone .cx-actions { justify-content: center; margin-top: 14px; }
.cx-dropzone.cx-dragover { border-color: var(--cx-brand); background: var(--cx-brand-soft); }
.cx-tree { padding: 0 12px; max-height: 420px; overflow-y: auto; } .cx-tree details { border-bottom: 1px solid var(--cx-rule); } .cx-tree details:last-child { border-bottom: 0; }
.cx-tree summary { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 8px 4px; min-height: 44px; cursor: pointer; list-style: none; } .cx-tree summary::-webkit-details-marker { display: none; }
.cx-tree summary > strong { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.cx-tree summary .cx-icon { width: 16px; height: 16px; } .cx-tree details[open]>summary .cx-icon { transform: rotate(90deg); }
.cx-tree-number { font-family: var(--cx-font-data); font-size: 20px; font-weight: 700; width: 25px; color: var(--cx-success); }
.cx-tree-meta { margin-left: auto; color: var(--cx-muted); white-space: nowrap; }
.cx-tree-child { padding: 0 0 8px 32px; } .cx-tree-child a { min-height: var(--cx-control-height); display: flex; align-items: center; gap: 8px; text-decoration: none; }
.cx-document { background: var(--cx-paper); border: 1px solid var(--cx-rule); padding: 22px 26px; }
.cx-document-head { display: flex; justify-content: space-between; align-items: center; border-bottom: 3px solid var(--cx-brand); padding-bottom: 14px; margin-bottom: 18px; }
.cx-document-head img { width: 116px; } .cx-document h3 { font-size: 19px; margin-bottom: 12px; } .cx-document p { margin-bottom: 12px; }
.cx-document-table { width: 100%; border-collapse: collapse; font-size: 14px; } .cx-document-table td { padding: 9px 0; border-bottom: 1px solid var(--cx-rule); }
.cx-watermark { text-align: center; color: var(--cx-danger); border: 1px solid var(--cx-danger); padding: 5px; margin-top: 16px; }
.cx-drawing { border: 1px solid var(--cx-rule); background: var(--cx-paper); padding: 12px; margin: 0; }
.cx-drawing svg { width: 100%; display: block; color: var(--cx-ink); }
.cx-drawing-tools { display: flex; align-items: center; gap: 8px; border-bottom: 1px solid var(--cx-rule); padding: 8px 12px; }
.cx-drawing-tools span { margin-right: auto; }
.cx-drawing-grid { display: grid; grid-template-columns: minmax(0,1fr) 288px; gap: 16px; }
.cx-drawing-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px; border-top: 1px solid var(--cx-rule); color: var(--cx-muted); }
.cx-empty { padding: 22px; display: flex; align-items: center; gap: 20px; background: var(--cx-paper); }
.cx-empty > div { min-width: 0; overflow-wrap: anywhere; }
.cx-empty img { width: 90px; flex-shrink: 0; } .cx-empty h3 { margin-bottom: 5px; } .cx-empty p { color: var(--cx-muted); margin: 0; }
.cx-pagination { display: flex; justify-content: space-between; align-items: center; padding: 12px 16px; gap: 12px; border-top: 1px solid var(--cx-rule); }
.cx-pagination .cx-actions { gap: 4px; } .cx-pagination button { min-width: 44px; }
.cx-toast { position: fixed; right: 24px; top: 106px; display: flex; align-items: center; gap: 10px; background: var(--cx-paper); border: 1px solid var(--cx-control); border-left: 4px solid var(--cx-success); padding: 10px 12px; max-width: min(460px,calc(100vw - 32px)); z-index: var(--cx-z-toast); }
.cx-toast button { margin-left: 10px; border: 0; background: transparent; min-height: 44px; min-width: 44px; color: var(--cx-ink); }
dialog { color: var(--cx-ink); background: var(--cx-paper); border: 1px solid var(--cx-control); border-radius: 0; width: min(560px,calc(100vw - 32px)); padding: 0; }
dialog::backdrop { background: var(--cx-backdrop); }
.cx-dialog-header { padding: 16px 20px; border-bottom: 1px solid var(--cx-rule); display: flex; align-items: center; justify-content: space-between; }
.cx-dialog-body { padding: 20px; } .cx-dialog-actions { display: flex; justify-content: flex-end; gap: 8px; padding: 12px 20px; border-top: 1px solid var(--cx-rule); }
.cx-drawer { position: fixed; right: 0; top: calc(var(--cx-header) + var(--cx-environment)); height: calc(100dvh - var(--cx-header) - var(--cx-environment)); width: 420px; background: var(--cx-paper); border-left: 1px solid var(--cx-control); z-index: var(--cx-z-drawer); padding: 0; overflow-y: auto; }
.cx-drawer-shade { position: fixed; inset: calc(var(--cx-header) + var(--cx-environment)) 0 0; background: var(--cx-backdrop); z-index: 39; }
.cx-loading { text-align: center; padding: 32px; } .cx-loading img { width: 116px; display: block; margin: 0 auto 20px; }
.cx-loading-track { height: 3px; background: var(--cx-rule); overflow: hidden; margin-top: 20px; } .cx-loading-track span { width: 35%; height: 100%; display: block; background: var(--cx-brand); animation: cx-loading 1s ease-in-out infinite alternate; }
@keyframes cx-loading { from { transform: translateX(0); } to { transform: translateX(180%); } }
.cx-feishu { border: 1px solid var(--cx-rule); background: var(--cx-paper); }
.cx-feishu-head { background: var(--cx-brand); color: var(--cx-on-brand); display: flex; align-items: center; gap: 12px; padding: 12px; } .cx-feishu-head img { width: 86px; margin-left: auto; }
.cx-feishu-body { padding: 16px; } .cx-feishu-body .cx-btn { width: 100%; margin-top: 12px; }
.cx-login { min-height: calc(100dvh - 30px); display: grid; grid-template-columns: 54% 46%; background: var(--cx-paper); }
.cx-login-brand { background: var(--cx-brand); color: var(--cx-on-brand); padding: 40px 56px; position: relative; overflow: hidden; display: flex; flex-direction: column; }
.cx-login-brand>img { width: 172px; position: relative; z-index: 1; }
.cx-login-thesis { position: relative; z-index: 1; margin: 84px 0 0; } .cx-login-thesis h1 { font-size: 42px; line-height: 1.35; }
.cx-login-thesis p { font-size: 16px; max-width: 420px; margin: 18px 0; }
.cx-login-photo { height: 245px; position: absolute; bottom: 62px; right: 0; width: 290px; margin: 0; overflow: hidden; clip-path: polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%); }
.cx-login-photo img { width: 100%; height: 100%; object-fit: cover; object-position: center 30%; }
.cx-login-stages { display: flex; gap: 24px; margin-top: 36px; } .cx-login-stages span { color: var(--cx-brand-light); font-size: 36px; display: block; font-family: var(--cx-font-data); font-weight: 700; }
.cx-login-brand-foot { margin-top: auto; position: relative; z-index: 1; font-size: 14px; }
.cx-login-form { padding: 70px 70px 24px; display: flex; flex-direction: column; justify-content: center; }
.cx-login-form h2 { font-size: 28px; margin-bottom: 10px; } .cx-login-form form { margin-top: 24px; }
.cx-login-form .cx-btn--primary { width: 100%; } .cx-login-form .cx-footer { padding: 12px 0; margin-top: 32px; font-size: 14px; }
.cx-error { max-width: 960px; margin: 60px auto; padding: 32px; background: var(--cx-paper); border-top: 4px solid var(--cx-brand); display: grid; grid-template-columns: 170px 1fr; gap: 40px; }
.cx-error-number { color: var(--cx-brand); font-size: 92px; line-height: 1; font-family: var(--cx-font-data); font-weight: 700; } .cx-error h1 { font-size: 30px; margin-bottom: 16px; } .cx-error .cx-actions { margin: 24px 0; }
.cx-mobile-header, .cx-bottom-nav { display: none; }
.cx-mobile-page { display: none; }
.cx-legend { display: flex; gap: 16px; flex-wrap: wrap; align-items: center; }
.cx-number-passport { display: inline-flex; align-items: center; gap: 4px; text-decoration: none; font: 14px var(--cx-font-mono); padding: 3px 5px; border: 1px solid var(--cx-code); color: var(--cx-code); background: var(--cx-code-soft); min-height: var(--cx-control-height); }
.cx-table .cx-number-passport { font-size: 13px; }
.cx-inspector-closed { grid-template-columns: 1fr; }
.cx-mobile-only { display: none; }
@media (max-width: 700px) { .cx-mobile-only { display: block; margin: 20px 16px; padding: 20px; background: var(--cx-paper); border-top: 3px solid var(--cx-brand); } }
.cx-switch-row { padding: 12px 16px; border-bottom: 1px solid var(--cx-rule); display: flex; align-items: center; justify-content: space-between; gap: 16px; } .cx-switch-row:last-child { border-bottom: 0; } .cx-switch-row p { color: var(--cx-muted); margin: 4px 0 0; }
.cx-matrix-panel { max-height: 412px; }
.cx-matrix-table { max-width: 100%; }
body[data-page="requirements_matrix"] .cx-table-wrap { max-height: 342px; }
body[data-page="requirements_matrix"] .cx-inspector { max-height: 462px; overflow-y: auto; }
body[data-page="solution_to"] #sizing-results { grid-template-columns: repeat(4,minmax(0,1fr)); }
body[data-page="solution_to"] #sizing-results .cx-kpi { padding: 8px 12px; }
body[data-page="solution_to"] #sizing-results .cx-kpi-value { font-size: 30px; }
body[data-page="solution_to"] #sizing-results .cx-kpi-note { font-size: 14px; }
.cx-matrix-table { min-width: 540px; } .cx-matrix-table td { vertical-align: top; } .cx-matrix-table .cx-citation { margin-top: 6px; } .cx-matrix-table .cx-quote-cell { max-width: 245px; line-height: 1.65; }
.cx-two-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.cx-two-fields .cx-field { margin-bottom: 0; }
.cx-parameter-table td:first-child { width: 44%; }
.cx-skill-preview { border-left: 3px solid var(--cx-brand); padding: 18px; background: var(--cx-paper); }
.cx-json { font: 14px/1.8 var(--cx-font-mono); background: var(--cx-neutral-soft); padding: 12px; margin: 12px 0; white-space: pre-wrap; overflow-wrap: anywhere; }
@media (max-width: 1320px) {
  .cx-masthead { gap: 12px; padding: 0 20px; }
  .cx-product span, .cx-search-label { display: none; }
  .cx-sidebar { width: var(--cx-sidebar-compact); padding: 18px 6px; }
  .cx-stage { padding: 12px 6px; justify-content: center; }
  .cx-stage-label, .cx-sidebar-title, .cx-sidebar-tools span { display: none; }
  .cx-sidebar-tools a { padding: 10px; justify-content: center; }
  .cx-work-content { padding: 18px 20px; }
  .cx-split { grid-template-columns: minmax(0,1fr) 320px; }
}
@media (max-width: 1000px) and (min-width: 701px) {
  .cx-global-nav { gap: 0; } .cx-global-nav a, .cx-nav-action { padding: 0 5px; min-width: 44px; }
  .cx-header-logo { width: 90px; } .cx-global-nav a:nth-child(4), .cx-global-nav a:nth-child(5) { display: none; }
  .cx-grid { gap: 16px; } .cx-span-8, .cx-span-7, .cx-span-6, .cx-span-5, .cx-span-4 { grid-column: span 12; }
  .cx-split { grid-template-columns: 1fr; } .cx-inspector { min-height: 240px; }
  .cx-drawing-grid { grid-template-columns: 1fr; }
}
@media (max-width: 700px) {
  .cx-masthead, .cx-sidebar, .cx-project-head, .cx-workbench, .cx-actionbar, .cx-desktop-only { display: none; }
  .cx-mobile-header { display: flex; height: 48px; padding: 0 16px; align-items: center; gap: 9px; background: var(--cx-brand); color: var(--cx-on-brand); position: sticky; top: 0; z-index: 20; }
  .cx-mobile-header img { width: 25px; height: 29px; object-fit: contain; }
  .cx-mobile-header strong { font-size: 18px; }
  .cx-brand-band { display: block; padding: 16px; }
  .cx-brand-band>div { display: block; }
  .cx-brand-band h2 { font-size: 20px; }
  .cx-brand-band h2.cx-gap { margin-top: 12px; }
  .cx-brand-band img { display: block; width: 104px; margin: 16px 0 0; }
  .cx-mobile-header button { margin-left: auto; min-width: 44px; min-height: 44px; border: 0; background: transparent; color: inherit; }
  .cx-environment { padding: 4px 16px; gap: 4px 8px; flex-wrap: wrap; min-height: 30px; font-size: 14px; }
  .cx-environment .cx-asof { display: none; }
  .cx-environment { top: 48px; }
  body[data-page="login"] .cx-environment { top: 0; }
  .cx-page { padding: 18px 16px 90px; }
  .cx-page-header { align-items: flex-start; } .cx-page-header h1 { font-size: 24px; }
  .cx-grid { grid-template-columns: 1fr; gap: 16px; } .cx-span-12, .cx-span-8, .cx-span-7, .cx-span-6, .cx-span-5, .cx-span-4 { grid-column: auto; }
  .cx-kpis { grid-template-columns: 1fr 1fr; } .cx-kpi { padding: 12px 16px; } .cx-kpi:nth-child(2) { border-right: 0; } .cx-kpi:nth-child(-n+2) { border-bottom: 1px solid var(--cx-rule); }
  .cx-footer { padding: 14px 16px; flex-wrap: wrap; margin-bottom: 76px; } .cx-footer span { max-width: 240px; }
  .cx-bottom-nav { position: fixed; bottom: 0; left: 0; right: 0; z-index: 30; display: grid; grid-template-columns: repeat(4,1fr); background: var(--cx-paper); border-top: 1px solid var(--cx-control); padding-bottom: env(safe-area-inset-bottom); min-height: 64px; }
  .cx-bottom-nav a, .cx-bottom-nav button { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 2px; min-height: 64px; border: 0; background: transparent; color: var(--cx-muted); font-size: 14px; text-decoration: none; }
  .cx-bottom-nav [aria-current="page"] { color: var(--cx-code); border-top: 3px solid var(--cx-brand); }
  .cx-mobile-page { display: block; padding: 18px 16px 92px; }
  .cx-mobile-greeting { display: flex; justify-content: space-between; align-items: center; margin-bottom: 14px; }
  .cx-mobile-greeting h1 { font-size: 24px; } .cx-mobile-greeting p { color: var(--cx-muted); margin: 4px 0 0; }
  .cx-task-item { padding: 14px 0; border-bottom: 1px solid var(--cx-rule); }
  .cx-task-item:last-child { border: 0; } .cx-task-item h3 { margin: 6px 0; font-size: 16px; } .cx-task-item p { margin: 0; color: var(--cx-muted); }
  .cx-task-item-top { display: flex; align-items: center; justify-content: space-between; }
  .cx-task-item .cx-actions { margin-top: 10px; }
  .cx-mobile-clock { background: var(--cx-brand-night); color: var(--cx-on-brand); padding: 16px; border-left: 4px solid var(--cx-brand-light); }
  .cx-mobile-clock .cx-clock { margin: 6px 0; font-size: 34px; } .cx-mobile-clock p { margin: 0; }
  .cx-mobile-summary { display: flex; gap: 24px; padding: 14px 0; } .cx-mobile-summary strong { font-size: 24px; margin-right: 5px; font-family: var(--cx-font-data); }
  .cx-mobile-tabs { margin-bottom: 0; } .cx-mobile-tabs button { flex: 1; padding: 10px 6px; }
  .cx-drawer { top: 78px; height: calc(100dvh - 78px); width: min(100%,420px); padding-bottom: 74px; } .cx-drawer-shade { inset: 78px 0 0; }
  .cx-toast { top: 90px; right: 16px; }
  .cx-login { grid-template-columns: 1fr; min-height: auto; } .cx-login-brand { padding: 24px; min-height: 260px; } .cx-login-brand>img { width: 130px; }
  .cx-login-thesis { margin: 22px 0; } .cx-login-thesis h1 { font-size: 30px; } .cx-login-thesis p, .cx-login-stages, .cx-login-photo, .cx-login-brand-foot { display: none; }
  .cx-login-form { padding: 28px 24px; } .cx-login-form .cx-footer { margin-bottom: 0; }
  .cx-error { display: block; padding: 24px; margin: 24px 16px; } .cx-error-number { font-size: 64px; margin-bottom: 16px; } .cx-error h1 { font-size: 26px; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; } }

/* Shared macro aliases and brand highlights. Values remain in tokens.css. */
.cx-screenreader-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.cx-search { position: relative; }
.cx-search summary { cursor: pointer; display: flex; align-items: center; min-height: var(--cx-control-height); padding: var(--cx-space-2); }
.cx-search-panel { position: absolute; top: 100%; right: 0; width: min(400px, calc(100vw - 32px)); padding: var(--cx-space-4); border: var(--cx-line) solid var(--cx-control); background: var(--cx-paper); color: var(--cx-ink); z-index: var(--cx-z-drawer); }
.cx-search-panel :focus-visible { outline-color: var(--cx-focus); }
.cx-search-panel form { display: flex; gap: var(--cx-space-2); }
.cx-environment-label { padding: var(--cx-space-1) var(--cx-space-2); border: var(--cx-line) solid currentColor; font-size: var(--cx-text-table); white-space: nowrap; }
.cx-toast-region { position: fixed; right: var(--cx-space-4); top: calc(var(--cx-header) + var(--cx-environment) + var(--cx-space-4)); z-index: var(--cx-z-toast); }
.cx-stage--disabled { opacity: 1; cursor: default; }
.cx-stage--disabled .cx-stage-label { color: var(--cx-muted); }
.cx-stage-current { background: var(--cx-brand); color: var(--cx-on-brand); }
.cx-stage-current .cx-stage-num, .cx-stage-current .cx-stage-number { color: var(--cx-stage-on-dark); }
.cx-workspace { flex: 1; min-width: 0; padding: var(--cx-space-6); }
.cx-stage-heading { display: flex; align-items: center; gap: var(--cx-space-4); margin-bottom: var(--cx-space-4); }
.cx-stage-heading:not(:has(*)) { color: var(--cx-stage-number); font: var(--cx-weight-title) var(--cx-text-stage)/1 var(--cx-font-data); }
.cx-stage-number { color: var(--cx-stage-number); font: var(--cx-weight-title) var(--cx-text-stage)/1 var(--cx-font-data); }
.cx-stage-heading .cx-stage-number, .cx-stage-heading .cx-stage-num { color: var(--cx-stage-number); font-size: var(--cx-text-stage); font-weight: var(--cx-weight-title); }
.cx-stage-slogan { font-size: var(--cx-text-section); color: var(--cx-ink); }
.cx-error-code { color: var(--cx-brand); font-size: var(--cx-text-hero); font-family: var(--cx-font-data); font-weight: var(--cx-weight-title); }
.cx-evidence { color: var(--cx-code); background: var(--cx-code-soft); border: var(--cx-line) solid var(--cx-code); padding: var(--cx-space-1) var(--cx-space-2); display: inline-flex; flex-wrap: wrap; max-width: 100%; min-width: 0; align-items: center; gap: var(--cx-space-1); font-size: var(--cx-text-table); min-height: var(--cx-control-height); }
.cx-evidence-drawer { background: var(--cx-paper); border: var(--cx-line) solid var(--cx-control); padding: var(--cx-space-4); overflow-y: auto; overflow-wrap: anywhere; scroll-padding: var(--cx-space-4); }
.cx-node { min-height: var(--cx-control-height); padding: var(--cx-space-2) var(--cx-space-3); border-bottom: var(--cx-line) solid var(--cx-rule); }
.cx-node summary { min-height: var(--cx-control-height); cursor: pointer; }
.cx-stepper { list-style: none; display: flex; flex-wrap: wrap; gap: var(--cx-space-2); padding: 0; margin: var(--cx-space-4) 0; }
.cx-stepper li { padding: var(--cx-space-2) var(--cx-space-3); border: var(--cx-line) solid var(--cx-control); color: var(--cx-ink); background: var(--cx-paper); }
.cx-stepper [aria-current="step"] { border-color: var(--cx-brand); color: var(--cx-code); background: var(--cx-code-soft); }
.cx-data-table { width: 100%; border-collapse: collapse; text-align: left; font-size: var(--cx-text-table); background: var(--cx-paper); }
.cx-data-table th, .cx-data-table td { padding: var(--cx-space-2) var(--cx-space-3); border-bottom: var(--cx-line) solid var(--cx-rule); min-height: var(--cx-row-height); overflow-wrap: anywhere; }
.cx-data-table th { color: var(--cx-ink); background: var(--cx-subtle); }
.cx-data-table tr[data-ui-highlight="true"] { background: var(--cx-brand-soft); }
.cx-row-evidence { background: var(--cx-brand-soft); }
.cx-row-evidence td:first-child { box-shadow: inset var(--cx-line-accent) 0 var(--cx-brand); }
.cx-is-loading { cursor: progress; }
.cx-toast--info { border-left-color: var(--cx-brand); }
.cx-toast--error { border-left-color: var(--cx-danger); }
.cx-toast--success { border-left-color: var(--cx-success); }
dialog[data-ui-evidence-drawer] { margin: 0 0 0 auto; width: min(var(--cx-inspector), calc(100vw - 32px)); height: 100dvh; max-height: none; border-left: var(--cx-line) solid var(--cx-control); padding: var(--cx-space-4); }
dialog[data-ui-evidence-drawer][open] { display: flex; flex-direction: column; }
.cx-table-controls { display: flex; flex-wrap: wrap; gap: var(--cx-space-2); align-items: center; padding: var(--cx-space-3) 0; }
.cx-table-controls input, .cx-table-controls select { min-height: var(--cx-control-height); color: var(--cx-ink); background: var(--cx-paper); border: var(--cx-line) solid var(--cx-control); padding: var(--cx-space-2); max-width: 100%; }
.cx-table-sort { color: inherit; background: transparent; border: 0; min-height: var(--cx-control-height); padding: var(--cx-space-2); text-align: left; font-weight: var(--cx-weight-title); }
.cx-kit-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr)); gap: var(--cx-space-6); }
.cx-kit-section { padding: var(--cx-space-4); border-top: var(--cx-line-accent) solid var(--cx-brand); background: var(--cx-paper); }
.cx-demo-ribbon { display: inline-block; padding: var(--cx-space-1) var(--cx-space-5) var(--cx-space-1) var(--cx-space-2); background: var(--cx-brand-middle); color: var(--cx-on-green); clip-path: polygon(0 0,100% 0,calc(100% - 9px) 50%,100% 100%,0 100%); font-weight: var(--cx-weight-title); }
.cx-countdown { font: var(--cx-text-body)/var(--cx-leading) var(--cx-font); font-variant-numeric: tabular-nums; }
.cx-countdown .cx-clock { font-size: var(--cx-text-figure); font-weight: var(--cx-weight-title); font-family: var(--cx-font-data); }
.cx-countdown small { font-size: var(--cx-text-lead); }
.cx-login-statement { position: relative; z-index: 1; margin-top: var(--cx-space-16); font-size: var(--cx-text-hero); line-height: 1.3; }
.cx-login-statement span, .cx-login-thesis h1 span { display: block; color: var(--cx-brand-light); font-weight: var(--cx-weight-title); }
.cx-login-thesis .cx-ribbon { margin-bottom: var(--cx-space-6); }
.cx-action-heading { font-size: var(--cx-text-title); max-width: 720px; }
.cx-date-display { display: flex; align-items: center; gap: var(--cx-space-3); border-left: var(--cx-line-accent) solid var(--cx-brand-middle); padding-left: var(--cx-space-6); color: var(--cx-ink); font-variant-numeric: tabular-nums; }
.cx-date-display strong { font-family: var(--cx-font-data); font-size: var(--cx-text-hero); line-height: 1; font-weight: var(--cx-weight-body); }
.cx-deadline--hero { color: var(--cx-on-brand); background: var(--cx-brand-night); border-left: var(--cx-line-accent) solid var(--cx-brand-middle); }
.cx-deadline--hero .cx-clock, .cx-deadline--hero .cx-countdown { color: var(--cx-brand-middle); font-size: var(--cx-text-display); }
.cx-deadline--hero .cx-deadline-top, .cx-deadline--hero dt, .cx-deadline--hero .cx-meta, .cx-deadline--hero .cx-muted { color: var(--cx-on-brand); }
.cx-deadline--hero :focus-visible, .cx-login-brand :focus-visible { outline-color: var(--cx-on-brand); }
.cx-deadline--hero .cx-clock small, .cx-deadline--hero .cx-countdown small { color: var(--cx-on-brand); }
.cx-deadline--hero .cx-deadline-foot { border-color: var(--cx-border-on-dark); }
.cx-deadline--hero .cx-clock--urgent, .cx-deadline--hero .cx-clock--warning { color: var(--cx-brand-middle); }
.cx-stage-current:hover { background: var(--cx-brand-hover); color: var(--cx-on-brand); }
.cx-stage-current small { color: var(--cx-on-brand); }
.cx-brand-band a:not(.cx-btn), .cx-login-brand a:not(.cx-btn), .cx-deadline--hero a:not(.cx-btn) { color: var(--cx-on-brand); }
.cx-login-brand .cx-muted, .cx-login-brand .cx-meta, .cx-login-brand .cx-eyebrow { color: var(--cx-on-brand); }
.cx-decision-number { color: var(--cx-code); font: var(--cx-weight-body) var(--cx-text-figure)/1 var(--cx-font-data); min-width: 2ch; }
.cx-brand-mark { width: 28px; height: 32px; object-fit: contain; }
.cx-page-heading { display: flex; align-items: center; justify-content: space-between; gap: var(--cx-space-4); margin-bottom: var(--cx-space-6); }
.cx-banner { padding: var(--cx-space-3) var(--cx-space-4); border-left: var(--cx-line-accent) solid var(--cx-brand); color: var(--cx-ink); background: var(--cx-brand-soft); margin-bottom: var(--cx-space-6); }
.cx-banner p { margin: var(--cx-space-1) 0 0; }
.cx-banner--warning { color: var(--cx-warning); background: var(--cx-warning-soft); border-color: var(--cx-warning); }
.cx-disclosure { margin: var(--cx-space-6) 0; padding-top: var(--cx-space-3); border-top: var(--cx-line) solid var(--cx-rule); }
.cx-disclosure summary { min-height: var(--cx-control-height); cursor: pointer; display: flex; align-items: center; font-weight: var(--cx-weight-label); }
.cx-page-links { display: flex; flex-wrap: wrap; gap: var(--cx-space-2); }
.cx-page-links a { display: inline-flex; align-items: center; min-height: var(--cx-control-height); padding: var(--cx-space-2) var(--cx-space-3); border: var(--cx-line) solid var(--cx-control); }
.cx-page-links [aria-current="page"] { color: var(--cx-code); background: var(--cx-code-soft); border-color: var(--cx-code); }
.cx-login-layout { display: grid; grid-template-columns: 54% 46%; background: var(--cx-paper); min-height: 650px; }
.cx-login-layout .cx-login-brand { min-height: 650px; padding: var(--cx-space-10) var(--cx-space-12); }
.cx-login-layout .cx-login-brand h2 { margin-top: var(--cx-space-8); font-size: var(--cx-text-hero); line-height: 1.3; position: relative; z-index: 1; }
.cx-login-slogan { color: var(--cx-brand-light); font-size: inherit; font-weight: var(--cx-weight-title); }
.cx-login-layout .cx-building { position: absolute; right: 0; bottom: var(--cx-space-6); width: 300px; height: 250px; object-fit: cover; clip-path: polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%); }
.cx-swallowtail { align-self: flex-start; margin-top: var(--cx-space-6); padding: var(--cx-space-1) var(--cx-space-5) var(--cx-space-1) var(--cx-space-2); color: var(--cx-on-green); background: var(--cx-brand-middle); font-weight: var(--cx-weight-title); clip-path: polygon(0 0,100% 0,calc(100% - 9px) 50%,100% 100%,0 100%); }
.cx-action-title { display: flex; justify-content: space-between; gap: var(--cx-space-6); align-items: center; margin-bottom: var(--cx-space-6); }
.cx-action-title h2 { font-size: var(--cx-text-title); }
.cx-display-date { color: var(--cx-ink); font-size: var(--cx-text-display); font-family: var(--cx-font-data); line-height: 1; border-left: var(--cx-line-accent) solid var(--cx-brand-middle); padding-left: var(--cx-space-6); }
.cx-dashboard-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--cx-space-6); margin-bottom: var(--cx-space-6); }
.cx-deadline-panel { color: var(--cx-on-brand); background: var(--cx-brand-night); padding: var(--cx-space-6); border-left: var(--cx-line-accent) solid var(--cx-brand-middle); }
.cx-deadline-panel .cx-eyebrow, .cx-deadline-panel .cx-muted, .cx-deadline-panel .cx-meta, .cx-deadline-panel small { color: var(--cx-on-brand); }
.cx-deadline-panel .cx-countdown { color: var(--cx-on-brand); font-size: var(--cx-text-body); margin: var(--cx-space-4) 0; }
.cx-deadline-panel .cx-deadline { background: transparent; padding: 0; }
.cx-deadline-panel .cx-clock { color: var(--cx-brand-middle); font-size: var(--cx-text-display); }
.cx-deadline-panel dt, .cx-deadline-panel dd { color: var(--cx-on-brand); font-size: var(--cx-text-body); }
.cx-deadline-panel a:not(.cx-btn) { color: var(--cx-on-brand); }
.cx-deadline-panel .cx-field-error { color: var(--cx-danger); background: var(--cx-danger-soft); padding: var(--cx-space-2); }
.cx-deadline-panel :focus-visible { outline-color: var(--cx-on-brand); }
.cx-decision-list { background: var(--cx-paper); padding: var(--cx-space-4) var(--cx-space-6); border-top: var(--cx-line-accent) solid var(--cx-brand); }
.cx-decision { display: flex; align-items: center; gap: var(--cx-space-4); border-bottom: var(--cx-line) solid var(--cx-rule); padding: var(--cx-space-4) 0; }
.cx-decision:last-child { border-bottom: 0; }
.cx-decision p { color: var(--cx-muted); margin: var(--cx-space-1) 0 0; }
.cx-metric-row { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); background: var(--cx-paper); border-top: var(--cx-line-accent) solid var(--cx-brand-middle); border-bottom: var(--cx-line) solid var(--cx-rule); margin: var(--cx-space-6) 0; }
.cx-two-column { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--cx-space-6); margin: var(--cx-space-6) 0; }
.cx-two-column > section { padding: var(--cx-space-4); background: var(--cx-paper); border-top: var(--cx-line-accent) solid var(--cx-brand); min-width: 0; }
.cx-upload-zone { background: var(--cx-paper); border: var(--cx-line) dashed var(--cx-control); padding: var(--cx-space-6); margin: var(--cx-space-6) 0; }
.cx-task-list { list-style: none; padding: 0; margin: var(--cx-space-6) 0; }
.cx-task { padding: var(--cx-space-4) 0; border-bottom: var(--cx-line) solid var(--cx-rule); }
.cx-task h3 { margin: var(--cx-space-2) 0; }
.cx-mobile-nav { display: flex; flex-wrap: wrap; gap: var(--cx-space-2); border-top: var(--cx-line) solid var(--cx-control); padding: var(--cx-space-2) 0; }
.cx-mobile-nav a { min-height: var(--cx-control-height); display: flex; align-items: center; padding: var(--cx-space-2) var(--cx-space-3); color: var(--cx-code); }
:where(.cx-page, .cx-login-form) :where(form, fieldset) { min-width: 0; }
:where(.cx-page, .cx-login-form) :where(label) { display: block; font-weight: var(--cx-weight-label); margin: var(--cx-space-2) 0 var(--cx-space-1); }
:where(.cx-page, .cx-login-form) :where(input:not([type="checkbox"]):not([type="radio"]), select, textarea) { color: var(--cx-ink); background: var(--cx-paper); min-height: var(--cx-control-height); border: var(--cx-line) solid var(--cx-control); border-radius: var(--cx-radius); padding: var(--cx-space-2) var(--cx-space-3); max-width: 100%; }
:where(.cx-page, .cx-login-form) :where(fieldset) { border: var(--cx-line) solid var(--cx-control); padding: var(--cx-space-4); display: grid; gap: var(--cx-space-2); }
:where(.cx-page, .cx-login-form) :where(legend) { font-weight: var(--cx-weight-label); }
.cx-login-form .login { width: min(420px, 100%); max-width: 100%; margin: 0 auto; }
.cx-login-form .login input { display: block; width: 100%; }
.cx-login-form .login form { display: grid; gap: var(--cx-space-3); }
.cx-login-form .login button { min-height: var(--cx-control-height); padding: var(--cx-space-2) var(--cx-space-4); color: var(--cx-on-brand); background: var(--cx-brand); border: var(--cx-line) solid var(--cx-brand); border-radius: var(--cx-radius); font-weight: var(--cx-weight-label); }
.cx-login-form .login button:hover { background: var(--cx-brand-hover); border-color: var(--cx-brand-hover); }
.cx-login-form .login button:disabled { color: var(--cx-muted); background: var(--cx-neutral-soft); border-color: var(--cx-control); }
.cx-login-form [role="alert"] { color: var(--cx-danger); background: var(--cx-danger-soft); border-left: var(--cx-line-accent) solid var(--cx-danger); padding: var(--cx-space-3); }
.cx-login-form--full-width form :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), .cx-btn) { display: block; width: 100%; }
.cx-tabs--scrollable { min-width: 0; max-width: 100%; }
.cx-tabs--scrollable > :is(a, button, span) { flex-shrink: 0; white-space: nowrap; }
.cx-tabs--scrollable > span { display: inline-flex; align-items: center; min-height: var(--cx-control-height); padding: var(--cx-space-2) var(--cx-space-3); color: var(--cx-muted); }
@media (min-width: 701px) and (max-width: 1320px) {
  .cx-workbench--mobile-strip > .cx-sidebar .cx-stage > span:not(.cx-stage-num) { display: none; }
}
@media (max-width: 700px) {
  .cx-workbench--mobile-strip > .cx-sidebar { display: flex; align-items: center; gap: var(--cx-space-1); overflow-x: auto; max-width: 100%; }
  .cx-workbench--mobile-strip > .cx-sidebar .cx-stage { flex: 0 0 auto; flex-direction: row; gap: var(--cx-space-1); min-height: var(--cx-control-height); padding: var(--cx-space-2); white-space: nowrap; }
  .cx-workbench--mobile-strip > .cx-sidebar .cx-stage-num { min-width: 0; font-size: var(--cx-text-lead); }
  .cx-workbench--mobile-strip > .cx-sidebar .cx-stage > span:not(.cx-stage-num) { font-size: var(--cx-text-table); white-space: nowrap; }
}
.cx-page :where(table) { width: 100%; border-collapse: collapse; background: var(--cx-paper); text-align: left; }
.cx-page :where(th, td) { border-bottom: var(--cx-line) solid var(--cx-rule); padding: var(--cx-space-2) var(--cx-space-3); overflow-wrap: anywhere; }
.cx-page :where(th) { color: var(--cx-ink); background: var(--cx-subtle); }
.cx-page :where(pre) { white-space: pre-wrap; overflow-wrap: anywhere; }
@media (max-width: 700px) {
  body { --cx-header: var(--cx-mobile-header-height); }
  .cx-masthead { display: grid; grid-template-columns: auto minmax(0, 1fr); grid-template-rows: 48px 44px; gap: var(--cx-space-1) var(--cx-space-2); height: var(--cx-mobile-header-height); padding: var(--cx-space-1) var(--cx-space-4); }
  .cx-global-nav { grid-column: 1 / -1; grid-row: 2; overflow-x: auto; min-width: 0; height: 44px; }
  .cx-global-nav a { flex: 0 0 auto; padding: 0 var(--cx-space-2); }
  .cx-global-nav a:nth-child(4), .cx-global-nav a:nth-child(5) { display: flex; }
  .cx-header-tools { margin-left: 0; gap: var(--cx-space-1); justify-content: flex-end; min-width: 0; }
  .cx-header-tools .cx-nav-action { min-width: 44px; padding: 0; }
  .cx-header-tools .cx-nav-action > span:not(.cx-avatar):not(.cx-sr-only) { display: none; }
  .cx-header-tools .cx-environment-label { font-size: var(--cx-text-table); padding: var(--cx-space-1); }
  .cx-header-logo { width: 56px; margin-left: 0; }
  .cx-environment { top: var(--cx-mobile-header-height); }
  .cx-workbench { display: block; min-height: 0; }
  .cx-project-head { display: flex; flex-wrap: wrap; padding: var(--cx-space-4); }
  .cx-sidebar { display: block; width: 100%; border-right: 0; border-bottom: var(--cx-line) solid var(--cx-rule); padding: var(--cx-space-2); }
  .cx-sidebar nav { display: flex; overflow-x: auto; gap: var(--cx-space-2); }
  .cx-sidebar .cx-stage { flex: 0 0 88px; flex-direction: column; gap: var(--cx-space-1); padding: var(--cx-space-2); }
  .cx-sidebar .cx-stage-label { display: block; font-size: var(--cx-text-table); text-align: center; }
  .cx-sidebar .cx-stage small { display: none; }
  .cx-sidebar-tools { display: none; }
  .cx-actionbar { display: flex; flex-wrap: wrap; gap: var(--cx-space-2); padding: var(--cx-space-2) var(--cx-space-4); }
  .cx-actionbar .cx-actions { margin-left: 0; flex-wrap: wrap; }
  .cx-split { grid-template-columns: minmax(0, 1fr); }
  .cx-drawer { top: calc(var(--cx-header) + var(--cx-environment)); height: calc(100dvh - var(--cx-header) - var(--cx-environment)); }
  .cx-drawer-shade { inset: calc(var(--cx-header) + var(--cx-environment)) 0 0; }
  .cx-login-statement { font-size: var(--cx-text-figure); margin-top: var(--cx-space-6); }
  .cx-date-display { display: none; }
  .cx-action-heading { font-size: var(--cx-text-section); }
  .cx-workspace { padding: var(--cx-space-4); }
  .cx-stage-number, .cx-stage-heading .cx-stage-number, .cx-stage-heading .cx-stage-num { font-size: var(--cx-text-figure); }
  .cx-search-panel { position: fixed; top: calc(var(--cx-header) + var(--cx-environment)); left: var(--cx-space-4); right: var(--cx-space-4); width: auto; }
  .cx-data-table { min-width: 0; width: 100%; }
  .cx-data-table .cx-table-wrap > table { min-width: 540px; }
  .cx-file { display: grid; grid-template-columns: 38px minmax(0, 1fr); align-items: start; gap: var(--cx-space-2) var(--cx-space-3); }
  .cx-file-info { grid-column: 2; }
  .cx-file-info p { overflow-wrap: anywhere; }
  .cx-file > :is(.cx-badge, .cx-meta, .cx-btn) { grid-column: 2; justify-self: start; max-width: 100%; }
  .cx-login-layout { grid-template-columns: 1fr; min-height: 0; }
  .cx-login-layout .cx-login-brand { padding: var(--cx-space-6); min-height: 300px; }
  .cx-login-layout .cx-login-brand h2 { font-size: var(--cx-text-figure); margin-top: var(--cx-space-4); }
  .cx-login-layout .cx-building { display: none; }
  .cx-page-heading, .cx-action-title { align-items: flex-start; flex-direction: column; }
  .cx-display-date { font-size: var(--cx-text-figure); }
  .cx-dashboard-grid, .cx-two-column { grid-template-columns: 1fr; }
  .cx-metric-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cx-decision { flex-wrap: wrap; }
  .cx-decision > div { flex: 1; min-width: 150px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}