:root {
  color-scheme: light;
  --ink: #1c2925;
  --muted: #718079;
  --line: #e5eae6;
  --paper: #f4f6f3;
  --surface: #ffffff;
  --green: #176c55;
  --green-soft: #e8f4ed;
  --amber: #a76523;
  --amber-soft: #fff4e6;
  --coral: #be6553;
  --teal: #2c8b7d;
  --shadow: 0 2px 6px rgba(26, 49, 39, .035), 0 12px 32px rgba(26, 49, 39, .025);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--paper); font-size: 13px; -webkit-font-smoothing: antialiased; }
button, select { font: inherit; }
button { color: inherit; }
a { color: inherit; text-decoration: none; }
.demo-ribbon { height: 29px; display: flex; align-items: center; justify-content: center; gap: 9px; background: #193b32; color: #d7efe2; font-size: 9px; font-weight: 750; letter-spacing: .13em; position: sticky; top: 0; z-index: 20; }
.pulse-dot { width: 6px; height: 6px; border-radius: 50%; background: #7de1a7; box-shadow: 0 0 0 3px rgba(125,225,167,.15); }
.ribbon-divider { color: #769286; font-weight: 400; }
.app-shell { min-height: calc(100vh - 29px); }
.sidebar { width: 218px; position: fixed; z-index: 10; top: 29px; bottom: 0; left: 0; display: flex; flex-direction: column; padding: 25px 14px 15px; background: #fbfcfa; border-right: 1px solid var(--line); }
.brand { display: flex; align-items: center; gap: 9px; padding: 1px 8px 33px; }
.brand-mark { display: block; width: 22px; height: 22px; flex: 0 0 22px; border-radius: 7px; }
.brand-name { font-weight: 790; font-size: 16px; letter-spacing: -.065em; color: #21332c; }.brand-name span { color: #4a7764; font-weight: 530; }
.brand-tag { color: #688476; background: #edf3ef; border-radius: 4px; padding: 3px 5px; font-size: 8px; font-weight: 800; letter-spacing: .08em; }
.workspace-label, .panel-kicker { color: #8a9790; font-size: 9px; letter-spacing: .13em; font-weight: 750; }
.workspace-label { padding: 0 9px 9px; }
.workspace-switch { display: flex; align-items: center; gap: 9px; margin: 0 1px 26px; padding: 9px 8px; border: 1px solid #e7ece8; border-radius: 8px; background: #fff; }
.workspace-avatar { display: grid; place-items: center; flex: 0 0 27px; height: 27px; border-radius: 7px; background: #e9f2ed; color: #28745d; font-weight: 760; font-size: 11px; }
.workspace-switch b, .workspace-switch small { display: block; }.workspace-switch b { font-size: 10px; }.workspace-switch small { color: #89958f; margin-top: 3px; font-size: 9px; }.chevron { margin-left: auto; color: #829088; font-size: 15px; }
.nav-list { display: grid; gap: 4px; }
.nav-item { display: flex; align-items: center; min-height: 35px; gap: 10px; padding: 0 10px; border-radius: 6px; color: #66736c; font-size: 11px; font-weight: 560; }
.nav-item:hover { background: #f0f4f1; color: #324a3e; }.nav-item.active { background: #eaf3ed; color: #195b45; font-weight: 720; }
.nav-icon { width: 16px; text-align: center; font-size: 14px; color: #788c80; }.active .nav-icon { color: #237454; }
.nav-count { margin-left: auto; border-radius: 4px; padding: 2px 5px; background: #dcebe1; font-size: 9px; }.nav-new { margin-left: auto; color: #728579; font-size: 7px; letter-spacing: .07em; font-weight: 800; }
.sidebar-bottom { margin-top: auto; }
.offline-card { display: flex; align-items: center; gap: 9px; padding: 10px 9px; margin: 0 1px 14px; border-radius: 7px; background: #f0f4f1; }.offline-icon { color: #367859; font-size: 15px; }.offline-card b, .offline-card small { display: block; }.offline-card b { font-size: 9px; }.offline-card small { color: #7c8982; margin-top: 3px; font-size: 8px; }.status-led { width: 6px; height: 6px; background: #9aaca1; border-radius: 50%; margin-left: auto; }
.sidebar-help { display: flex; justify-content: space-between; padding: 10px 10px 13px; border-bottom: 1px solid var(--line); color: #62736a; font-size: 10px; }.sidebar-help span { font-size: 12px; }
.sidebar-version { padding: 13px 9px 0; color: #9aa59f; font-size: 8px; letter-spacing: .08em; }.sidebar-version span { margin: 0 3px; color: #bbc5bf; }
.main-content { max-width: 1600px; margin-left: 218px; padding: 0 34px 24px; }
.topbar { height: 53px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #e4e9e5; }
.breadcrumb { display: flex; gap: 9px; align-items: center; color: #929d96; font-size: 10px; }.breadcrumb b { color: #bbc3be; font-weight: 400; }.breadcrumb strong { color: #47584f; font-weight: 650; }
.topbar-actions { display: flex; align-items: center; gap: 13px; }.snapshot-chip { display: flex; align-items: center; gap: 7px; color: #748078; font-size: 9px; }.snapshot-dot { width: 6px; height: 6px; background: #6aa47e; border-radius: 50%; }.avatar-button { border: 1px solid #e4e9e5; border-radius: 50%; width: 27px; height: 27px; background: #fff; color: #64766b; font-size: 9px; font-weight: 700; }
.page-heading { display: flex; justify-content: space-between; align-items: end; padding: 27px 1px 20px; }.eyebrow { display: flex; align-items: center; gap: 8px; color: #84938a; font-size: 8px; font-weight: 780; letter-spacing: .13em; }.eyebrow-mark { color: #277558; font-size: 12px; }.eyebrow-line { height: 1px; width: 23px; background: #cbd7cf; margin-left: 2px; }
h1 { margin: 7px 0 5px; font-size: 27px; letter-spacing: -.055em; line-height: 1.16; font-weight: 720; }.heading-period { color: #4b9874; }.page-subtitle { margin: 0; color: #7a8780; font-size: 11px; }.heading-badges { display: flex; gap: 7px; padding-bottom: 2px; }
.badge { border-radius: 4px; padding: 6px 8px; font-size: 8px; letter-spacing: .07em; font-weight: 760; }.badge-synthetic { color: #297354; background: #e7f2eb; }.badge-synthetic span { font-size: 7px; margin-right: 3px; }.badge-neutral { color: #78867e; background: #ecefeb; }.ring-dot { display: inline-block; width: 6px; height: 6px; border: 1px solid #83948a; border-radius: 50%; margin-right: 4px; vertical-align: 1px; }
.metrics-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 11px; margin-bottom: 15px; }.metric-card, .panel { background: var(--surface); border: 1px solid #e6ebe7; border-radius: 8px; box-shadow: var(--shadow); }.metric-card { min-height: 105px; padding: 13px 14px 10px; }.metric-top { display: flex; align-items: center; justify-content: space-between; color: #78857e; font-size: 10px; font-weight: 570; }.metric-icon { width: 23px; height: 23px; display: grid; place-items: center; border-radius: 6px; font-size: 14px; }.icon-amber { color: #a96b2a; background: #fff1df; }.icon-coral { color: #bc6656; background: #fbefeb; }.icon-teal { color: #2b887a; background: #e8f4f1; }.icon-slate { color: #62776c; background: #edf1ed; }.metric-value { margin-top: 4px; color: #20332b; font-size: 24px; letter-spacing: -.055em; font-weight: 730; line-height: 1.15; }.metric-label, .metric-unit { color: #87928c; font-size: 10px; letter-spacing: 0; font-weight: 520; }.metric-unit { margin-left: 1px; }.policy-value { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 18px; letter-spacing: -.045em; padding-top: 3px; }.metric-foot { display: flex; align-items: center; gap: 7px; margin-top: 8px; color: #8a968f; font-size: 9px; }.status-pill { border-radius: 3px; padding: 3px 5px; font-size: 7px; font-weight: 770; letter-spacing: .05em; }.status-amber { color: #a56627; background: #fff2e2; }.small-check { color: #4d996c; font-weight: 800; font-size: 11px; }.teal-check { color: #348c7d; }.lock-mark { color: #708278; font-size: 9px; }
.content-grid { display: grid; grid-template-columns: minmax(0,1.72fr) minmax(265px,.88fr); gap: 14px; align-items: start; }.primary-column, .secondary-column { display: grid; gap: 13px; }.panel { padding: 16px 16px 14px; }.panel-header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 14px; }.panel-header-tight { align-items: center; margin-bottom: 12px; }.panel h2, .dialog-top h2 { margin: 4px 0 0; color: #24362e; font-size: 15px; letter-spacing: -.025em; font-weight: 690; }.evidence-count { display: flex; align-items: center; gap: 6px; color: #88948d; font-size: 9px; }.count-dot { width: 6px; height: 6px; background: #75a987; border-radius: 50%; }
.narrative-list { display: grid; gap: 9px; }.narrative-card { display: grid; grid-template-columns: 32px minmax(0,1fr) auto; gap: 10px; align-items: start; padding: 12px 11px; border: 1px solid #e9ede9; border-radius: 7px; background: #fdfefd; cursor: pointer; transition: border-color .16s ease, background .16s ease, transform .16s ease; }.narrative-card:hover { border-color: #bdd6c5; background: #fbfefb; transform: translateY(-1px); }.narrative-symbol { width: 29px; height: 29px; display: grid; place-items: center; background: #fff1df; color: #ae712f; border-radius: 7px; font-size: 15px; }.narrative-symbol.negative { color: #438672; background: #e9f3ee; }.narrative-main { min-width: 0; }.narrative-title-row { display: flex; align-items: center; gap: 7px; }.narrative-title { margin: 0; color: #2a3c33; font-size: 10px; font-weight: 700; }.narrative-description { margin: 5px 0 7px; color: #75827b; line-height: 1.5; font-size: 9px; }.narrative-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }.confidence-chip, .case-chip { border-radius: 3px; padding: 3px 5px; color: #8b632d; background: #fff4e5; font-size: 7px; font-weight: 760; letter-spacing: .04em; }.case-chip { color: #748179; background: #edf1ed; }.evidence-links { color: #4a8063; font-size: 8px; font-weight: 650; }.narrative-arrow { padding-top: 7px; color: #9ba69f; font-size: 15px; }.panel-note { display: flex; align-items: start; gap: 7px; padding: 10px 2px 0; color: #89958e; font-size: 8px; line-height: 1.45; }.panel-note b { color: #6e7e74; font-weight: 690; }.note-icon { flex: 0 0 13px; display: grid; place-items: center; height: 13px; border-radius: 50%; background: #eef2ef; color: #708279; font-size: 8px; font-style: italic; font-weight: 700; }
.tag { border-radius: 3px; padding: 5px 6px; font-size: 7px; letter-spacing: .07em; font-weight: 750; white-space: nowrap; }.tag-outline { border: 1px solid #e0e8e2; color: #708279; }.tag-muted { color: #78867e; background: #eff2ef; }
.rule-card { background: #f8faf8; border: 1px solid #e8ede9; border-radius: 6px; padding: 10px 11px 9px; }.rule-title-row { display: flex; align-items: center; gap: 9px; }.rule-glyph { display: grid; place-items: center; width: 25px; height: 25px; border-radius: 6px; color: #36785b; background: #e7f2eb; font-size: 17px; }.rule-title-row b, .rule-title-row small { display: block; }.rule-title-row b { color: #405149; font-size: 9px; }.rule-title-row small { margin-top: 3px; color: #87938c; font: 8px ui-monospace, monospace; }.rule-mode { margin-left: auto; color: #4b7d62; font-size: 7px; letter-spacing: .05em; font-weight: 800; }.rule-flow { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin: 11px 0 9px; }.flow-node { border: 1px solid #e4eae5; border-radius: 4px; padding: 5px 6px; color: #596a60; background: #fff; font: 8px ui-monospace, SFMono-Regular, Menlo, monospace; }.flow-arrow { color: #9ba89f; font-size: 9px; }.flow-result { color: #906021; background: #fff9f0; border-color: #f2e5cf; }.rule-foot { display: flex; justify-content: space-between; align-items: center; border-top: 1px solid #e7ece8; padding-top: 7px; color: #839088; font-size: 8px; }.rule-foot code, .policy-callout code { color: #537460; font-family: ui-monospace, monospace; font-size: 8px; }.text-button { border: 0; background: none; color: #39785b; padding: 2px 0; font-size: 8px; font-weight: 690; cursor: pointer; }.text-button:hover { text-decoration: underline; }
.test-results { margin-top: 9px; }.test-result { display: flex; align-items: center; gap: 8px; padding: 7px 1px; border-bottom: 1px solid #f0f2f0; }.test-mark { width: 17px; height: 17px; display: grid; place-items: center; border-radius: 50%; font-size: 9px; font-weight: 800; }.test-mark.pass { color: #41845d; background: #e9f4ec; }.test-name { flex: 1; }.test-name b, .test-name small { display: block; }.test-name b { color: #5a6a61; font-size: 8px; font-weight: 660; }.test-name small { margin-top: 3px; color: #8c9890; font-size: 8px; }.test-status { color: #49815f; font-size: 7px; letter-spacing: .07em; font-weight: 800; }.unmeasured-row { display: flex; align-items: center; gap: 7px; padding-top: 10px; color: #929d96; font-size: 8px; }.unmeasured-row b { color: #77847c; font-size: 8px; font-weight: 650; }.unmeasured-divider { height: 11px; width: 1px; background: #dfe5e0; margin: 0 2px; }
.source-list { display: grid; }.source-row { display: grid; grid-template-columns: 27px minmax(0,1fr) auto; align-items: start; gap: 9px; padding: 9px 1px; border-top: 1px solid #f0f2f0; }.source-icon { display: grid; place-items: center; width: 25px; height: 25px; border-radius: 6px; background: #eff3f0; color: #567263; font-size: 10px; font-weight: 760; }.source-icon.aws { color: #9b682c; background: #fff3e3; }.source-icon.workspace { color: #4d7189; background: #edf3f7; }.source-row b, .source-row small { display: block; }.source-row b { color: #52635a; font-size: 9px; font-weight: 690; }.source-row small { margin-top: 3px; color: #89958e; font-size: 8px; line-height: 1.45; }.source-state { border-radius: 3px; padding: 4px 5px; color: #7a887f; background: #eff2ef; font-size: 7px; font-weight: 780; white-space: nowrap; letter-spacing: .02em; }.source-state.recorded { color: #5e793d; background: #f0f4e9; }.source-footnote { padding-top: 9px; border-top: 1px solid #eef1ee; color: #909b94; font-size: 8px; line-height: 1.45; }
.alert-number { min-width: 28px; height: 26px; display: grid; place-items: center; border-radius: 5px; background: #fff0df; color: #aa6d2a; font-size: 12px; font-weight: 740; }.section-intro { margin: -4px 0 10px; color: #849089; font-size: 8px; line-height: 1.5; }.alert-list { display: grid; gap: 7px; }.alert-item { display: grid; grid-template-columns: 23px minmax(0,1fr) auto; align-items: center; gap: 7px; padding: 9px 8px; border: 1px solid #ecefeb; border-radius: 6px; }.alert-alert-icon { display: grid; place-items: center; width: 21px; height: 21px; color: #a96b2d; background: #fff3e4; border-radius: 5px; }.alert-item b, .alert-item small { display: block; }.alert-item b { color: #5c695f; font-size: 8px; font-weight: 670; }.alert-item small { margin-top: 3px; color: #929c95; font-size: 7px; }.alert-label { color: #9a6c36; background: #fff5e9; border-radius: 3px; padding: 4px 5px; font-size: 6px; letter-spacing: .06em; font-weight: 780; }.human-controls { display: flex; gap: 5px; margin-top: 7px; }.mini-control { border: 1px solid #e6ebe7; background: #fff; border-radius: 4px; padding: 4px 5px; color: #77847c; font-size: 7px; cursor: pointer; }.mini-control:hover, .mini-control.selected { color: #27694f; border-color: #b9d2c0; background: #f4faf5; }.policy-callout { display: flex; gap: 8px; margin-top: 11px; padding: 9px; border-radius: 5px; background: #f4f7f4; }.policy-shield { color: #61806c; font-size: 14px; }.policy-callout b { display: block; color: #56665d; font-size: 8px; }.policy-callout p { margin: 4px 0 0; color: #849088; font-size: 7px; line-height: 1.5; }
.agents-panel { padding-bottom: 12px; }.agent-status-row { display: grid; grid-template-columns: 24px minmax(0,1fr) auto; gap: 8px; align-items: center; padding: 8px 0; border-top: 1px solid #f0f2f0; }.agent-avatar { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 6px; font-size: 12px; }.agent-disabled { color: #929b95; background: #f0f2f0; }.agent-static { color: #44846a; background: #eaf3ed; }.agent-status-row b, .agent-status-row small { display: block; }.agent-status-row b { color: #5c6b62; font-size: 8px; font-weight: 670; }.agent-status-row small { margin-top: 3px; color: #929c95; font-size: 7px; }.state-badge { padding: 4px 5px; border-radius: 3px; font-size: 6px; letter-spacing: .04em; font-weight: 770; white-space: nowrap; }.state-off { background: #eff1ef; color: #828d86; }.state-static { background: #edf4ee; color: #548064; }.agent-disclaimer { border-top: 1px solid #eff2ef; padding-top: 8px; margin-top: 2px; color: #929c95; font-size: 7px; line-height: 1.45; }
.cost-icon { color: #87978d; font-size: 15px; }.cost-empty { display: flex; align-items: center; gap: 10px; padding: 11px 10px; border-radius: 6px; background: #f7f9f7; }.cost-dash { color: #7f8c83; font-size: 22px; }.cost-empty b, .cost-empty small { display: block; }.cost-empty b { color: #56665d; font-size: 9px; }.cost-empty small { margin-top: 4px; color: #929d95; font-size: 7px; }.cost-foot { padding: 8px 1px 0; color: #909a94; font-size: 7px; line-height: 1.5; }
.source-key-panel { padding: 12px 14px; background: #f9fbf9; box-shadow: none; }.source-key-title { margin-bottom: 9px; color: #839188; font-size: 8px; letter-spacing: .1em; font-weight: 760; }.key-spark { color: #5c9974; margin-right: 5px; }.key-line { display: flex; align-items: center; gap: 7px; margin: 6px 0; color: #8a958e; font-size: 7px; }.key-line b { color: #69786e; font-weight: 680; }.key-dot { width: 6px; height: 6px; border-radius: 50%; }.key-green { background: #77a884; }.key-gray { background: #aab3ac; }.key-hollow { border: 1px solid #a7b1a9; }
.onboarding-section { margin-top: 28px; scroll-margin-top: 45px; }.onboarding-heading { display: flex; justify-content: space-between; align-items: end; margin-bottom: 13px; }.onboarding-heading h2 { margin: 7px 0 4px; font-size: 20px; letter-spacing: -.045em; }.onboarding-heading p { margin: 0; color: #808c85; font-size: 10px; }.preview-only-badge { margin-bottom: 2px; padding: 6px 8px; border: 1px solid #dce8df; border-radius: 4px; color: #538267; font-size: 7px; letter-spacing: .08em; font-weight: 780; }.preview-only-badge span { color: #adbab0; margin: 0 3px; }.onboarding-card { overflow: hidden; border: 1px solid #e3e9e4; background: #fff; border-radius: 8px; box-shadow: var(--shadow); }.stepper { display: flex; align-items: center; padding: 13px 20px; border-bottom: 1px solid #edf0ed; background: #fcfdfc; }.step { display: flex; align-items: center; gap: 7px; border: 0; background: transparent; color: #98a29c; font-size: 9px; cursor: pointer; padding: 3px 0; }.step.active { color: #286c52; font-weight: 700; }.step.done { color: #688c73; }.step-number { display: grid; place-items: center; width: 20px; height: 20px; border: 1px solid #e0e6e1; border-radius: 50%; font-size: 7px; font-weight: 720; }.step.active .step-number { border-color: #398361; background: #e9f4ed; }.step.done .step-number { color: #fff; border-color: #689578; background: #689578; }.step-line { height: 1px; flex: 1; max-width: 90px; margin: 0 12px; background: #e5ebe6; }.onboarding-body { display: grid; grid-template-columns: minmax(0,1.3fr) minmax(220px,.7fr); min-height: 184px; }.step-content { padding: 19px 21px; }.step-title { margin: 0 0 6px; color: #34483d; font-size: 11px; font-weight: 690; }.step-description { max-width: 490px; margin: 0 0 13px; color: #88948d; font-size: 8px; line-height: 1.5; }.field-label { display: block; margin-bottom: 5px; color: #6b7a71; font-size: 8px; font-weight: 670; }.form-row { display: flex; gap: 10px; }.field-group { flex: 1; min-width: 0; }.preview-select { width: 100%; border: 1px solid #dfe6e0; border-radius: 5px; padding: 8px 9px; color: #506158; background: #fff; font-size: 9px; outline: none; }.preview-select:focus { border-color: #71a684; box-shadow: 0 0 0 2px #e6f2e9; }.source-warning { display: flex; gap: 7px; align-items: start; margin-top: 11px; color: #818e86; font-size: 8px; line-height: 1.45; }.source-warning span { color: #ad7a37; }.checklist { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px 11px; }.check-item { display: flex; align-items: center; gap: 6px; color: #69786f; font-size: 8px; }.check-square { width: 13px; height: 13px; display: grid; place-items: center; border: 1px solid #9bb9a2; border-radius: 3px; color: #3a805e; background: #f2f8f3; font-size: 8px; }.permission-note { margin-top: 10px; padding: 7px 8px; border-left: 2px solid #a9c8ae; color: #78877e; background: #f6faf6; font-size: 8px; line-height: 1.5; }.retention-options { display: flex; gap: 7px; }.retention-option { min-width: 70px; padding: 8px 10px; border: 1px solid #e1e8e2; border-radius: 5px; background: #fff; color: #77847c; text-align: left; cursor: pointer; }.retention-option.selected { border-color: #73a786; background: #f2f8f3; color: #2c6e50; }.retention-option b, .retention-option small { display: block; }.retention-option b { font-size: 9px; }.retention-option small { margin-top: 4px; font-size: 7px; }.retention-foot { margin-top: 10px; color: #8c9890; font-size: 8px; }.review-list { display: grid; gap: 6px; }.review-row { display: flex; justify-content: space-between; gap: 12px; padding-bottom: 6px; border-bottom: 1px solid #f0f2f0; color: #859189; font-size: 8px; }.review-row b { color: #5d6d63; font-weight: 670; text-align: right; }.review-verdict { margin-top: 9px; padding: 8px; border-radius: 4px; color: #7a6b52; background: #fbf7ef; font-size: 8px; line-height: 1.45; }
.preview-pane { align-self: stretch; margin: 13px 14px 13px 0; border: 1px solid #e7ede8; border-radius: 6px; background: #f8faf8; overflow: hidden; display: flex; flex-direction: column; }.preview-pane-header { display: flex; align-items: center; gap: 6px; padding: 8px 10px; border-bottom: 1px solid #e7ece8; color: #849188; font-size: 7px; letter-spacing: .09em; font-weight: 760; }.preview-terminal-dot { width: 6px; height: 6px; border-radius: 50%; background: #80aa88; }.preview-lock { margin-left: auto; color: #7a9181; }.preview-content { flex: 1; padding: 10px; color: #68796e; font: 8px/1.7 ui-monospace, SFMono-Regular, Menlo, monospace; white-space: pre-wrap; }.preview-content .preview-key { color: #86948a; }.preview-content .preview-value { color: #3c7758; }.preview-content .preview-warning { color: #9a7646; }.preview-footer { border-top: 1px solid #e7ece8; padding: 7px 10px; color: #819087; font-size: 7px; }.preview-ok { color: #62a278; margin-right: 4px; }.onboarding-controls { display: flex; align-items: center; justify-content: space-between; padding: 10px 17px; border-top: 1px solid #edf0ed; }.no-op-note { color: #849188; font-size: 8px; }.no-op-note span { color: #6b9877; margin-right: 4px; }.onboarding-controls > div { display: flex; gap: 6px; }.button { border: 1px solid #e0e6e1; border-radius: 5px; padding: 7px 10px; font-size: 8px; font-weight: 670; cursor: pointer; }.button:disabled { opacity: .45; cursor: default; }.button-quiet { color: #76847b; background: #fff; }.button-dark { border-color: #286b50; color: #fff; background: #286b50; }.button-dark:hover:not(:disabled) { background: #1e5b43; }.button-dark span { margin-left: 6px; }
.page-footer { display: flex; align-items: center; gap: 13px; margin-top: 18px; padding: 12px 1px; border-top: 1px solid #e2e8e3; color: #96a099; font-size: 7px; letter-spacing: .04em; }.page-footer > span:nth-child(2) { margin-left: auto; letter-spacing: 0; }.page-footer a { color: #668372; }.footer-sep { color: #c0c8c1; margin: 0 4px; }
.evidence-dialog { width: min(600px, calc(100vw - 32px)); max-height: min(80vh, 690px); padding: 0; border: 1px solid #dfe7e1; border-radius: 10px; color: var(--ink); box-shadow: 0 22px 70px rgba(22,41,31,.24); }.evidence-dialog::backdrop { background: rgba(24,42,33,.38); backdrop-filter: blur(2px); }.dialog-top { display: flex; justify-content: space-between; align-items: start; padding: 18px 20px 15px; border-bottom: 1px solid #edf0ed; }.dialog-top h2 { font-size: 17px; }.dialog-close { width: 27px; height: 27px; display: grid; place-items: center; border: 1px solid #e5eae6; border-radius: 5px; background: #fff; color: #75827a; font-size: 18px; cursor: pointer; }.dialog-content { padding: 15px 20px; }.dialog-narrative { padding: 13px 20px; overflow: auto; max-height: 53vh; }.dialog-summary { margin: 0 0 12px; color: #68786e; font-size: 10px; line-height: 1.6; }.dialog-label { margin: 12px 0 6px; color: #87938b; font-size: 8px; letter-spacing: .1em; font-weight: 760; }.evidence-row { display: grid; grid-template-columns: 7px minmax(0,1fr) auto; gap: 8px; align-items: start; padding: 9px 0; border-bottom: 1px solid #f0f2f0; }.evidence-bullet { width: 6px; height: 6px; margin-top: 4px; border-radius: 50%; background: #69a07a; }.evidence-row b { display: block; color: #53645a; font: 8px ui-monospace, monospace; overflow-wrap: anywhere; }.evidence-row small { display: block; margin-top: 4px; color: #849087; font-size: 8px; line-height: 1.5; }.evidence-link { color: #47805e; white-space: nowrap; font-size: 7px; font-weight: 690; }.rationale-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px; margin-top: 8px; }.rationale-item { padding: 8px; border: 1px solid #e9eeea; border-radius: 5px; }.rationale-item small, .rationale-item b { display: block; }.rationale-item small { color: #8b9790; font-size: 7px; }.rationale-item b { margin-top: 4px; color: #587264; font-size: 8px; font-weight: 650; }.human-review { margin-top: 13px; padding: 11px; background: #f6f9f6; border-radius: 6px; }.human-review-head { display: flex; justify-content: space-between; align-items: center; }.human-review-head b { color: #5e7064; font-size: 8px; }.local-state-tag { color: #5c8b6a; font-size: 7px; }.human-controls-large { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 8px; }.human-select { border: 1px solid #e0e7e1; border-radius: 4px; padding: 6px 7px; color: #66756c; background: white; font-size: 8px; }.dialog-footer { display: flex; justify-content: space-between; align-items: center; padding: 11px 20px; border-top: 1px solid #edf0ed; color: #909b94; font-size: 7px; }
.toast { position: fixed; z-index: 30; right: 22px; bottom: 20px; padding: 10px 13px; border-radius: 6px; background: #203d31; color: #f1f7f2; box-shadow: 0 8px 24px rgba(21,44,32,.18); font-size: 9px; opacity: 0; transform: translateY(8px); pointer-events: none; transition: opacity .18s ease, transform .18s ease; }.toast.visible { opacity: 1; transform: translateY(0); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.control-note { display: block; margin-top: 7px; color: #8d9991; font-size: 7px; }
@media (min-width: 1500px) { .main-content { padding-left: 44px; padding-right: 44px; } .content-grid { grid-template-columns: minmax(0,1.8fr) minmax(290px,.8fr); } }
@media (max-width: 1080px) { .sidebar { width: 190px; }.main-content { margin-left: 190px; padding-left: 23px; padding-right: 23px; }.content-grid { grid-template-columns: minmax(0,1.4fr) minmax(245px,.9fr); gap: 11px; }.metric-card { padding-left: 11px; padding-right: 11px; }.unmeasured-row { flex-wrap: wrap; } }
@media (max-width: 820px) { .sidebar { width: 58px; padding: 18px 8px 12px; align-items: center; }.brand { padding: 0 0 28px; }.brand-name, .brand-tag, .workspace-label, .workspace-switch, .nav-item:not(.active), .nav-item.active { font-size: 0; }.nav-list { width: 100%; }.nav-item { justify-content: center; gap: 0; padding: 0; }.nav-item.active { font-size: 0; }.nav-icon { font-size: 16px; }.nav-count, .nav-new, .sidebar-bottom { display: none; }.main-content { margin-left: 58px; padding-left: 18px; padding-right: 18px; }.content-grid { grid-template-columns: 1fr; }.secondary-column { grid-template-columns: repeat(2,minmax(0,1fr)); align-items: start; }.source-key-panel { display: none; }.metrics-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 560px) { .demo-ribbon { font-size: 8px; }.sidebar { display: none; }.main-content { margin-left: 0; padding: 0 13px 18px; }.topbar { height: 45px; }.breadcrumb span, .breadcrumb b { display: none; }.snapshot-chip { font-size: 8px; }.page-heading { align-items: start; flex-direction: column; gap: 13px; padding: 20px 1px 16px; }.page-heading h1 { font-size: 24px; }.heading-badges { padding: 0; }.metrics-grid { gap: 8px; }.metric-card { min-height: 99px; padding: 11px 10px 9px; }.metric-value { font-size: 21px; }.policy-value { font-size: 16px; }.secondary-column { grid-template-columns: 1fr; }.panel { padding: 14px 12px; }.narrative-card { grid-template-columns: 28px minmax(0,1fr) auto; gap: 7px; padding: 10px 8px; }.narrative-symbol { width: 26px; height: 26px; }.narrative-title { line-height: 1.4; }.rule-flow { gap: 4px; }.flow-node { font-size: 7px; padding: 4px; }.unmeasured-row { font-size: 7px; gap: 5px; }.onboarding-heading { align-items: start; flex-direction: column; gap: 10px; }.onboarding-heading h2 { font-size: 18px; }.stepper { padding: 11px 9px; }.step { flex-direction: column; gap: 3px; font-size: 7px; }.step-number { width: 18px; height: 18px; }.step-line { margin: 0 5px; }.onboarding-body { grid-template-columns: 1fr; }.step-content { padding: 15px 13px; min-height: 146px; }.preview-pane { margin: 0 12px 12px; min-height: 104px; }.onboarding-controls { gap: 8px; align-items: start; flex-direction: column; padding: 10px 12px; }.onboarding-controls > div { align-self: end; }.page-footer { flex-wrap: wrap; gap: 8px; }.page-footer > span:nth-child(2) { margin-left: 0; }.page-footer a { margin-left: auto; }.rationale-grid { grid-template-columns: 1fr 1fr; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; } }

.pipeline-panel { margin-bottom: 15px; scroll-margin-top: 45px; }
.pipeline-intro { margin: 6px 0 0; max-width: 650px; color: #839087; font-size: 9px; line-height: 1.5; }
.pipeline-legend { display: flex; flex-wrap: wrap; gap: 13px; margin: -2px 0 12px; color: #7e8a82; font-size: 8px; }
.pipeline-legend span { display: inline-flex; align-items: center; gap: 5px; }
.pipeline-legend i, .pipeline-state-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; }
.legend-observed, .pipeline-state-dot.recorded { background: #68a27a; }
.legend-fixture, .pipeline-state-dot.fixture { background: #9aa89e; }
.legend-estimated, .pipeline-state-dot.estimated, .pipeline-state-dot.candidate { background: #d39a51; }
.legend-unavailable, .pipeline-state-dot.unavailable, .pipeline-state-dot.preview { border: 1px solid #9eaaa1; background: transparent; }
.pipeline-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; }
.pipeline-card { min-width: 0; padding: 10px; border: 1px solid #e8ede9; border-radius: 6px; background: #fcfdfc; }
.pipeline-card-head { display: flex; align-items: center; gap: 6px; min-height: 17px; }
.pipeline-status { display: inline-flex; align-items: center; width: fit-content; max-width: 100%; border-radius: 3px; padding: 3px 5px; font-size: 6px; line-height: 1.35; letter-spacing: .045em; font-weight: 800; }
.pipeline-status.recorded { color: #477c59; background: #eaf4ec; }
.pipeline-status.fixture { color: #66786d; background: #edf1ee; }
.pipeline-status.estimated { color: #936429; background: #fff3e2; }
.pipeline-status.candidate { color: #936429; background: #fff3e2; }
.pipeline-status.unavailable { color: #75827a; background: #eff2ef; }
.pipeline-status.preview { color: #557d67; background: #edf5ef; }
.pipeline-card h3 { margin: 8px 0 5px; color: #35483d; font-size: 9px; line-height: 1.4; }
.pipeline-card > p { min-height: 46px; margin: 0 0 8px; color: #78857d; font-size: 8px; line-height: 1.5; }
.pipeline-limit { display: grid; gap: 3px; padding: 7px; border-radius: 4px; background: #f4f7f4; color: #78857d; font-size: 7px; line-height: 1.45; }
.pipeline-limit b { color: #67766d; font-size: 7px; }
.reference-links { display: flex; flex-wrap: wrap; gap: 4px 8px; margin-top: 7px; }
.reference-link { display: inline-block; color: #47805e; font-size: 7px; line-height: 1.4; font-weight: 680; text-decoration: underline; text-decoration-color: #c3d8c8; text-underline-offset: 2px; }
.reference-link:hover { color: #245d43; text-decoration-color: currentColor; }
.source-row-content { min-width: 0; }
.source-row-content small { overflow-wrap: anywhere; }
.source-row-content .reference-links { margin-top: 5px; }
.detection-evidence { padding: 2px 1px 8px; }
.unmeasured-row { flex-wrap: wrap; }
.cost-estimates-title { margin: 13px 0 7px; color: #89958d; font-size: 7px; line-height: 1.5; letter-spacing: .07em; font-weight: 780; }
.cost-estimate { margin-top: 7px; padding: 9px; border: 1px solid #e9eeea; border-radius: 5px; background: #fcfdfc; }
.cost-estimate-head { display: flex; align-items: center; justify-content: space-between; gap: 5px; }
.cost-estimate-head b { color: #5a6a61; font-size: 8px; }
.cost-estimate strong, .cost-estimate small { display: block; }
.cost-estimate strong { margin-top: 6px; color: #34493d; font-size: 13px; }
.cost-estimate > small { margin-top: 3px; color: #818e85; font-size: 7px; line-height: 1.4; }
.cost-estimate p { margin: 6px 0 0; color: #8a958e; font-size: 7px; line-height: 1.45; }
.cost-unavailable { margin-top: 8px; }
.source-key-panel .key-amber { background: #d39a51; }
@media (max-width: 1280px) { .pipeline-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 820px) { .pipeline-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .pipeline-grid { grid-template-columns: 1fr; }.pipeline-card > p { min-height: 0; }.pipeline-panel .panel-header { align-items: start; gap: 8px; flex-direction: column; }.pipeline-legend { gap: 8px; }.source-row { grid-template-columns: 27px minmax(0,1fr); }.source-row .source-state { grid-column: 2; width: fit-content; }.cost-estimates-title { margin-top: 10px; } }

.story-panel { margin: 0 0 15px; scroll-margin-top: 45px; padding: 18px; }
.story-heading { align-items: start; }
.story-heading h2 { margin-top: 5px; font-size: 17px; }
.story-summary { max-width: 770px; margin: 7px 0 0; color: #5f7066; font-size: 12px; line-height: 1.55; }
.story-status { border: 1px solid #eedfc6; color: #91652e; background: #fff8ed; }
.verified-path-note { display: grid; grid-template-columns: minmax(180px,.52fr) minmax(0,1.5fr); gap: 5px 12px; align-items: center; margin: 0 0 10px; padding: 10px; border: 1px solid #dce9df; border-radius: 5px; background: #f3f8f3; color: #53645a; font-size: 11px; line-height: 1.5; }
.verified-path-note > b { color: #3f684b; font-size: 10px; letter-spacing: .04em; }
.verified-path-note .reference-links { grid-column: 2; margin: 0; }
.fixture-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.fixture-card { min-width: 0; padding: 12px; border: 1px solid #e6ebe7; border-radius: 7px; background: #fbfcfb; }
.fixture-card-head { display: flex; justify-content: space-between; align-items: start; gap: 8px; }
.fixture-card-head > div { display: flex; align-items: center; gap: 8px; min-width: 0; }
.fixture-source-mark { display: grid; place-items: center; flex: 0 0 28px; height: 28px; border-radius: 7px; background: #edf3ef; color: #46705a; font-size: 8px; font-weight: 800; }
.fixture-card:first-child .fixture-source-mark { color: #9a682d; background: #fff2e2; }
.fixture-type, .fixture-card-head b { display: block; overflow-wrap: anywhere; }
.fixture-type { color: #596a60; font-size: 10px; }
.fixture-card-head b { margin-top: 3px; color: #53645a; font: 9px ui-monospace, SFMono-Regular, Menlo, monospace; }
.fixture-tag { flex: 0 0 auto; border-radius: 3px; padding: 4px 5px; color: #765122; background: #fff5e8; font-size: 9px; font-weight: 800; letter-spacing: .035em; }
.fixture-time { margin: 10px 0 6px; color: #66766c; font-size: 9px; }
.fixture-time time { margin-left: 4px; color: #465b4e; font: 9px ui-monospace, SFMono-Regular, Menlo, monospace; }
.fixture-card pre { max-height: 290px; overflow: auto; margin: 0; padding: 10px; border: 1px solid #e9eeea; border-radius: 5px; color: #43554a; background: #f5f8f5; font: 10px/1.5 ui-monospace, SFMono-Regular, Menlo, monospace; tab-size: 2; white-space: pre-wrap; overflow-wrap: anywhere; }
.story-boundary { display: grid; grid-template-columns: 115px minmax(0,1fr); gap: 10px; margin-top: 10px; padding: 10px; border: 1px solid #eee4d5; border-radius: 5px; color: #62533d; background: #fffaf2; font-size: 11px; line-height: 1.55; }
.story-boundary b { color: #75551f; }
.story-path { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; margin-top: 11px; }
.story-path-card { min-width: 0; padding: 9px; border: 1px solid #e8ede9; border-radius: 5px; background: #fff; }
.story-path-card > span { display: block; color: #586a5f; font-size: 9px; font-weight: 750; letter-spacing: .06em; text-transform: uppercase; }
.story-path-card b { display: block; margin-top: 5px; color: #6b512e; font-size: 9px; line-height: 1.4; }
.story-path-card p { margin: 5px 0 0; color: #5f7066; font-size: 10px; line-height: 1.5; }
.assessment-note { margin-top: 11px; padding: 12px; border-left: 3px solid #6b9a78; border-radius: 4px; background: #f5f9f5; }
.assessment-head, .triage-config-heading { display: flex; justify-content: space-between; align-items: start; gap: 10px; }
.assessment-head h3, .triage-config-heading h3, .response-preview h3 { margin: 4px 0 0; color: #43564a; font-size: 10px; }
.assessment-note > p { margin: 7px 0 0; color: #53645a; font-size: 11px; line-height: 1.6; }
.model-run-provenance { overflow-wrap: anywhere; font: 9px/1.5 ui-monospace, SFMono-Regular, Menlo, monospace; color: #506257; }
.model-output-details { margin-top: 8px; color: #4f6256; font-size: 10px; }
.model-output-details summary { cursor: pointer; font-weight: 700; }
.model-output-details pre { max-height: 180px; overflow: auto; padding: 9px; background: #edf3ee; border-radius: 4px; color: #354b3d; font: 9px/1.5 ui-monospace, SFMono-Regular, Menlo, monospace; white-space: pre-wrap; overflow-wrap: anywhere; }
.triage-outcome-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 10px; }
.triage-outcome-card { min-width: 0; padding: 11px; border: 1px solid #e7ece8; border-radius: 6px; background: #fbfcfb; color: #53645a; }
.triage-outcome-card h3 { margin: 5px 0; color: #475a4d; font-size: 12px; }
.triage-outcome-card p { margin: 5px 0 0; color: #586a5f; font-size: 10px; line-height: 1.55; overflow-wrap: anywhere; }
.triage-config { margin-top: 11px; padding: 12px; border: 1px solid #e7ece8; border-radius: 6px; background: #fbfcfb; }
.triage-config-heading p { margin: 5px 0 0; color: #586a5f; font-size: 10px; line-height: 1.5; }
.triage-controls { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; margin-top: 12px; }
.triage-control { min-width: 0; }
.triage-control label { display: block; margin-bottom: 5px; color: #53645a; font-size: 10px; font-weight: 720; }
.triage-control select { width: 100%; min-height: 36px; padding: 6px 8px; border: 1px solid #dfe7e1; border-radius: 4px; color: #465b4e; background: white; font-size: 10px; }
.triage-control small { display: block; margin-top: 4px; color: #5f7066; font-size: 9px; line-height: 1.4; }
.triage-draft { margin-top: 10px; padding: 8px; border-radius: 4px; color: #4f6256; background: #f0f4f1; font: 10px/1.55 ui-monospace, SFMono-Regular, Menlo, monospace; }
.triage-result { margin: 8px 0 0; color: #56685e; font-size: 10px; line-height: 1.5; }
.triage-result b { color: #4d6254; }
.triage-result > span:first-of-type { color: #70552e; font-weight: 780; }
.response-preview { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 11px; padding: 12px; border: 1px solid #e8ebe8; border-radius: 6px; background: #f8f9f8; }
.response-preview h3 { color: #68766e; }
.response-preview p { margin: 5px 0; color: #56685e; font-size: 10px; line-height: 1.5; }
.response-preview code { color: #73552d; font: 10px ui-monospace, SFMono-Regular, Menlo, monospace; }
.response-preview button { flex: 0 0 auto; padding: 8px 10px; border: 1px solid #e0e4e0; border-radius: 4px; color: #66756b; background: #f0f2f0; font-size: 10px; cursor: not-allowed; }
.story-panel select:focus-visible, .story-panel button:focus-visible { outline: 2px solid #398361; outline-offset: 2px; }
@media (max-width: 1080px) { .story-path { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 700px) { .fixture-grid, .triage-outcome-grid { grid-template-columns: 1fr; }.triage-controls { grid-template-columns: 1fr; }.story-heading { flex-direction: column; gap: 8px; }.story-boundary { grid-template-columns: 1fr; gap: 4px; }.verified-path-note { grid-template-columns: 1fr; }.verified-path-note .reference-links { grid-column: 1; }.response-preview { align-items: start; flex-direction: column; } }
@media (max-width: 560px) { .story-panel { padding: 13px 11px; }.story-path { grid-template-columns: 1fr; }.fixture-card { padding: 9px; }.fixture-card-head { flex-direction: column; }.fixture-card pre { max-height: 230px; } }