@charset "UTF-8";

:root {
  color-scheme: light;
  --navy: #102b3c;
  --navy-deep: #0c2231;
  --teal: #138b7b;
  --teal-dark: #096c60;
  --teal-soft: #e4f5ef;
  --mint: #8ee6ca;
  --bg: #f5f7f9;
  --surface: #fff;
  --text: #203447;
  --heading: #10293b;
  --muted: #66788b;
  --line: #e3e9ee;
  --line-strong: #cbd6de;
  --blue: #3567a7;
  --blue-soft: #eaf1fc;
  --amber: #96600c;
  --amber-soft: #fff4df;
  --red: #b34242;
  --red-soft: #fcecec;
  --radius: 15px;
  --shadow: 0 8px 30px rgb(20 45 65 / 4%);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-synthesis: none;
  font-size: 14px;
  line-height: 1.55;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 92px; }
body { margin: 0; color: var(--text); background: var(--bg); -webkit-font-smoothing: antialiased; }
button, input, select, textarea { font: inherit; }
button, a, input, select, textarea { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
button:disabled { opacity: .5; cursor: not-allowed; }
a { color: var(--teal-dark); text-decoration: none; }
a:hover { text-decoration: underline; text-underline-offset: 3px; }
button, input, select, textarea, a { outline-offset: 4px; }
:focus-visible { outline: 3px solid #3286d1; }
h1, h2, h3, h4, p { margin: 0; }
h1, h2, h3, h4 { color: var(--heading); line-height: 1.25; }
h1 { font-size: clamp(26px, 2.6vw, 35px); letter-spacing: -.045em; font-weight: 730; }
h2 { font-size: 20px; letter-spacing: -.025em; font-weight: 680; }
h3 { font-size: 16px; letter-spacing: -.018em; font-weight: 670; }
h4 { font-size: 14px; }
p + p { margin-top: 12px; }
svg { flex-shrink: 0; vertical-align: middle; }
button svg, .button svg { width: 17px; height: 17px; }
code { padding: 2px 5px; font-size: .9em; color: #345468; background: #edf2f5; border-radius: 4px; overflow-wrap: anywhere; }
strong { font-weight: 650; }
ul, ol { padding-left: 21px; }
li + li { margin-top: 5px; }
[hidden] { display: none !important; }
.skip-link { position: fixed; z-index: 100; top: -100px; left: 20px; padding: 12px 20px; background: var(--surface); color: var(--navy); border-radius: 8px; box-shadow: var(--shadow); }
.skip-link:focus { top: 14px; }

.sidebar { width: 244px; height: 100dvh; position: fixed; inset: 0 auto 0 0; z-index: 30; display: flex; flex-direction: column; padding: 29px 20px 20px; color: #c2d1dc; background: var(--navy); overflow-y: auto; }
.brand { display: flex; align-items: center; gap: 11px; color: #fff; font-weight: 750; font-size: 16px; letter-spacing: .025em; }
.brand:hover { text-decoration: none; }
.brand-mark { width: 42px; height: 42px; background: var(--mint); color: var(--navy); border-radius: 12px; display: grid; place-content: center; font-size: 26px; font-weight: 800; letter-spacing: -.2em; padding-right: 6px; line-height: 1; }
.brand-mark span { display: inline; font-size: 17px; margin-left: 9px; margin-top: -8px; }
.brand small { display: block; margin-top: 4px; color: #9db3c3; font-size: 12px; font-weight: 450; letter-spacing: .04em; }
.workspace-tag { margin: 29px -1px 28px; padding: 10px 9px; display: flex; align-items: center; gap: 6px; color: #c2d6df; background: #183748; border: 1px solid #2b4657; border-radius: 7px; font-size: 12px; white-space: nowrap; }
.status-dot { width: 6px; height: 6px; border-radius: 50%; background: #46bca3; display: inline-block; flex: 0 0 auto; }
.version-tag { font-size: 11px; color: #93aabb; margin-left: auto; }
.nav-label { display: block; margin: 0 12px 11px; color: #90a9ba; text-transform: uppercase; letter-spacing: .12em; font-size: 11px; font-weight: 650; }
#navigation { display: grid; gap: 5px; }
#navigation a, #navigation button { display: flex; align-items: center; gap: 12px; min-height: 43px; padding: 10px 12px; border: 0; width: 100%; background: transparent; border-radius: 8px; color: #bbcedc; font-size: 12px; text-align: left; font-weight: 500; text-decoration: none; transition: background .15s, color .15s; }
#navigation svg { width: 17px; height: 17px; opacity: .85; }
#navigation a:hover, #navigation button:hover { color: #fff; background: #1b3b4e; }
#navigation [aria-current="page"], #navigation .active { background: #254b59; color: #a9f3dd; font-weight: 650; }
#navigation [aria-current="page"] svg, #navigation .active svg { opacity: 1; }
#navigation .nav-count, #navigation .count { margin-left: auto; min-width: 21px; text-align: center; padding: 1px 6px; border-radius: 5px; font-size: 12px; background: #234759; color: #b6d0dd; }
.sidebar-note { margin: auto 0 22px; padding: 23px 12px 0; }
.note-kicker { color: #87acbb; font-size: 11px; font-weight: 650; letter-spacing: .12em; }
.sidebar-note strong { display: block; color: #e7f0f4; font-size: 16px; line-height: 1.45; margin-top: 9px; font-weight: 550; letter-spacing: -.015em; }
.sidebar-note p { color: #93aebf; font-size: 12px; line-height: 1.8; margin: 11px 0; }
.sidebar-note a { display: flex; align-items: center; justify-content: space-between; color: #a6e7d7; font-size: 12px; }
.sidebar-footer { display: flex; align-items: center; gap: 10px; padding: 18px 9px 0; border-top: 1px solid #294555; color: #d8e5ed; font-size: 12px; }
.sidebar-footer small { display: block; font-size: 11px; color: #8da7b8; margin-top: 3px; }
.avatar { width: 31px; height: 31px; display: grid; place-content: center; background: #2b4b5c; color: #e6f2f6; font-weight: 650; border-radius: 9px; }
.shell { margin-left: 244px; min-width: 0; }
.topbar { min-height: 75px; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 17px 38px; background: rgb(255 255 255 / 97%); border-bottom: 1px solid var(--line); }
.breadcrumb { font-size: 12px; color: #81909e; display: flex; gap: 12px; align-items: center; }
.breadcrumb span { color: #bfccd4; }
.breadcrumb strong { color: #435969; font-weight: 550; }
.top-actions { display: flex; align-items: center; gap: 10px; }
.save-state { font-size: 12px; color: var(--muted); display: flex; gap: 7px; align-items: center; margin-right: 8px; }
.save-state.error { color: var(--red); }
.save-state.error .status-dot { background: var(--red); }
#main { max-width: 1550px; min-height: calc(100dvh - 132px); margin: 0 auto; padding: 32px 38px 38px; outline: none; }
.page-footer { margin: 0 38px; padding: 18px 0; border-top: 1px solid var(--line); display: flex; justify-content: space-between; gap: 15px; color: #7b8b98; font-size: 12px; }

.button { border: 1px solid var(--line-strong); border-radius: 7px; padding: 9px 14px; min-height: 36px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; background: #fff; color: var(--heading); font-size: 12px; line-height: 1.4; font-weight: 600; transition: background .15s, border-color .15s, transform .15s; text-decoration: none; }
.button:hover { background: #f1f6f7; border-color: #a9bbc6; text-decoration: none; }
.button:active { transform: translateY(1px); }
.button-dark { color: #fff; background: var(--navy); border-color: var(--navy); }
.button-dark:hover { color: #fff; background: #204659; border-color: #204659; }
.button-primary, .button-teal { color: #fff; background: var(--teal-dark); border-color: var(--teal-dark); }
.button-primary:hover, .button-teal:hover { color: #fff; background: #07584f; border-color: #07584f; }
.button-quiet { background: transparent; border-color: transparent; }
.button-small, .button.compact { font-size: 12px; padding: 6px 10px; min-height: 30px; }
.button-danger { color: var(--red); border-color: #e8c2c2; }
.btn-link { border: 0; background: none; padding: 0; display: inline-flex; align-items: center; gap: 7px; color: var(--teal-dark); font-size: 12px; font-weight: 650; text-align: left; }
.btn-link:hover { text-decoration: underline; text-underline-offset: 3px; }
.icon-button { width: 34px; height: 34px; display: inline-grid; place-content: center; padding: 7px; background: #f2f5f7; border: 1px solid var(--line); border-radius: 8px; color: var(--muted); }
.icon-button:hover { background: #e8eef1; color: var(--heading); }
.icon-button svg { width: 16px; height: 16px; }

.page-heading { margin-bottom: 25px; }
.eyebrow { display: flex; align-items: center; gap: 7px; font-size: 12px; letter-spacing: .12em; text-transform: uppercase; font-weight: 650; color: var(--teal-dark); margin-bottom: 9px; }
.heading-row { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.page-subtitle { color: var(--muted); font-size: 12px; max-width: 760px; margin-top: 9px; line-height: 1.7; }
.badge { display: inline-flex; align-items: center; justify-content: center; gap: 5px; max-width: 100%; border-radius: 5px; padding: 4px 7px; font-size: 11px; font-weight: 650; line-height: 1.35; white-space: nowrap; background: #edf1f5; color: #556a7d; }
.badge.proven, .badge.success { background: var(--teal-soft); color: #126653; }
.badge.observed, .badge.info { background: var(--blue-soft); color: #315f9b; }
.badge.unverified, .badge.warning, .badge.p1 { background: var(--amber-soft); color: #8b5b0f; }
.badge.danger, .badge.p0 { background: var(--red-soft); color: #a53a3a; }
.badge.p2, .badge.neutral { background: #edf1f5; color: #5b6e80; }
.badge.large { padding: 7px 10px; font-size: 12px; }
.hero { display: flex; align-items: center; justify-content: space-between; gap: 28px; position: relative; overflow: hidden; border: 1px solid #cfe5e0; border-radius: var(--radius); background: #edf7f2; margin: 0 0 23px; padding: 29px 32px; min-height: 220px; }
.hero-content { position: relative; z-index: 1; flex: 1; max-width: 610px; }
.hero-pill { display: inline-flex; align-items: center; gap: 7px; color: #397866; border: 1px solid #bcdcd1; background: #f8fcf9; padding: 4px 8px; border-radius: 20px; margin-bottom: 13px; font-size: 11px; font-weight: 650; }
.hero h2 { font-size: clamp(24px, 2.2vw, 30px); letter-spacing: -.045em; line-height: 1.25; color: #163f3b; max-width: 590px; }
.hero p { margin-top: 13px; max-width: 530px; color: #5b7870; font-size: 12px; line-height: 1.8; }
.hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 15px; margin-top: 20px; }
.hero-visual { flex: 0 0 235px; display: grid; place-content: center; align-self: stretch; }
.hero-visual svg, svg.orbit { width: 230px; max-width: 100%; height: auto; }
.orbit { color: var(--teal-dark); }
.stats-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-bottom: 26px; }
.stat-card { padding: 20px 22px; border: 1px solid var(--line); border-radius: 11px; background: var(--surface); min-width: 0; box-shadow: var(--shadow); position: relative; }
.stat-icon { float: right; display: inline-grid; place-content: center; width: 30px; height: 30px; border-radius: 8px; color: #5f8092; background: #f0f5f7; }
.stat-icon svg { width: 16px; height: 16px; }
.stat-value { color: var(--heading); font-size: 32px; font-weight: 720; line-height: 1.1; letter-spacing: -.05em; margin: 4px 0 10px; }
.stat-value small { font-size: 15px; color: #7d8f9a; letter-spacing: -.015em; font-weight: 500; }
.stat-label { color: #3b5266; font-size: 12px; font-weight: 600; }
.stat-foot { margin-top: 6px; color: #7c8d9a; font-size: 12px; }
.section-heading { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin: 28px 0 15px; }
.section-heading h2 { font-size: 17px; }
.section-heading > p { color: var(--muted); font-size: 12px; }
.two-col { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 20px; margin-bottom: 20px; }
.two-col.equal { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.three-col { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.span-2 { grid-column: span 2; }
.wide { grid-column: 1 / -1; }
.panel { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 24px; min-width: 0; box-shadow: var(--shadow); }
.panel + .panel { margin-top: 0; }
.panel-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 15px; margin-bottom: 20px; }
.panel-head h2 { font-size: 16px; }
.panel-head h3 { font-size: 15px; }
.panel-head p { margin-top: 5px; color: var(--muted); font-size: 12px; }
.panel-body { min-width: 0; }
.panel.compact { padding: 19px; }
.muted { color: var(--muted); }
.small { font-size: 12px; }
.kicker { font-size: 11px; letter-spacing: .09em; font-weight: 650; text-transform: uppercase; color: var(--muted); }
.progress-track { height: 7px; background: #eaf0f2; border-radius: 5px; overflow: hidden; }
.progress-fill { display: block; height: 100%; background: var(--teal); border-radius: inherit; transition: width .2s ease; }
.progress-fill.warning { background: #c89942; }
.progress-fill.info { background: #7194c8; }
.progress-fill.danger { background: #c26868; }
.evidence-row { display: flex; gap: 10px; align-items: center; margin-top: 16px; font-size: 12px; }
.evidence-row strong { margin-left: auto; }
.legend { display: flex; flex-wrap: wrap; gap: 13px; margin-top: 17px; }
.legend-item { display: flex; gap: 6px; align-items: center; color: var(--muted); font-size: 11px; }
.legend-item i { height: 6px; width: 6px; border-radius: 2px; display: inline-block; background: #92a8bb; }
.legend-item i.proven { background: var(--teal); }
.legend-item i.observed { background: #7194c8; }
.legend-item i.unverified { background: #c89942; }
.mini-list { list-style: none; padding: 0; margin: 0; }
.mini-list li { padding: 11px 0; border-bottom: 1px solid var(--line); font-size: 12px; }
.mini-list li:last-child { border-bottom: 0; }
.priority-item { display: flex; align-items: flex-start; gap: 12px; padding: 13px 0; border-bottom: 1px solid var(--line); }
.priority-item:first-child { padding-top: 0; }
.priority-item:last-child { border-bottom: 0; padding-bottom: 0; }
.priority-num { flex: 0 0 25px; width: 25px; height: 25px; border-radius: 7px; background: #f8efdf; color: #946b2d; font-size: 12px; font-weight: 650; display: grid; place-content: center; }
.priority-item strong { display: block; font-size: 12px; }
.priority-item p { font-size: 12px; color: var(--muted); margin: 4px 0 0; line-height: 1.7; }
.priority-item > .badge { margin-left: auto; flex-shrink: 0; }
.phase-strip { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; padding: 4px 0; }
.phase-node { border-top: 2px solid #d9e7e5; padding-top: 15px; position: relative; min-width: 0; }
.phase-node strong { display: block; font-size: 12px; margin: 7px 0 4px; color: var(--heading); }
.phase-node small { font-size: 11px; color: var(--muted); line-height: 1.6; display: block; }
.phase-dot { width: 7px; height: 7px; border-radius: 50%; background: #86b3aa; position: absolute; top: -4px; }
.phase-node.active .phase-dot { background: var(--teal); box-shadow: 0 0 0 4px #e1f2ec; }
.phase-node.active { border-color: var(--teal); }
.flow { display: flex; flex-wrap: wrap; gap: 9px; align-items: stretch; margin-top: 16px; }
.flow-step { flex: 1; min-width: 100px; background: #f5f8fa; border: 1px solid #e6edf1; border-radius: 8px; padding: 13px; font-size: 12px; }
.flow-step strong { display: block; margin-bottom: 5px; }
.flow-step span, .flow-step small { font-size: 12px; color: var(--muted); }
.flow > span { align-self: center; color: #8da5b3; }
.notice { padding: 15px 18px; background: #f0f5f8; border: 1px solid #dce8ee; border-radius: 9px; color: #506b7e; font-size: 12px; line-height: 1.8; margin: 18px 0; }
.notice strong { color: #2e5166; }
.notice-warning { background: #fff8eb; border-color: #ecdcb9; color: #866024; }
.notice-warning strong { color: #805713; }
.notice-info { background: #eff5fc; border-color: #d6e3f2; color: #466387; }
.notice-success { background: var(--teal-soft); border-color: #c8e4d9; color: #28745d; }

.filters, .roadmap-controls { display: flex; flex-wrap: wrap; align-items: end; gap: 12px; margin: 20px 0; }
.field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.field label, .field > span, label.field { font-size: 12px; color: #52697c; font-weight: 600; }
.filters .field:first-child { flex: 1; min-width: 220px; }
.filters .field { min-width: 140px; }
.input, .select, input[type="search"], input[type="text"], input[type="date"], input[type="url"], input[type="number"], select, textarea { width: 100%; min-height: 39px; padding: 9px 11px; border: 1px solid #d5dfe5; border-radius: 7px; color: var(--text); background: #fff; font-size: 12px; line-height: 1.5; }
input::placeholder, textarea::placeholder { color: #8b9aa6; }
textarea { min-height: 92px; resize: vertical; }
input:focus, select:focus, textarea:focus { border-color: #47a896; }
input[type="checkbox"] { accent-color: var(--teal-dark); width: 16px; height: 16px; flex: 0 0 auto; margin: 1px 0 0; }
input[type="range"] { accent-color: var(--teal); width: 100%; }
input[type="date"] { font-variant-numeric: tabular-nums; }
.table-wrap { position: relative; width: 100%; min-width: 0; overflow-x: auto; border: 1px solid var(--line); border-radius: 12px; background: #fff; }
.data-table { width: 100%; border-collapse: collapse; text-align: left; font-size: 12px; }
.data-table th { background: #f6f8fa; color: #788a99; text-transform: uppercase; letter-spacing: .055em; font-size: 11px; font-weight: 650; padding: 12px 17px; border-bottom: 1px solid var(--line); white-space: nowrap; }
.data-table td { padding: 17px; border-bottom: 1px solid var(--line); vertical-align: top; }
.data-table tr:last-child td { border-bottom: 0; }
.data-table tbody tr:hover { background: #fbfdfd; }
.cell-title { display: block; color: var(--heading); font-weight: 650; font-size: 12px; }
.cell-sub { display: block; color: var(--muted); font-size: 12px; margin-top: 5px; max-width: 400px; line-height: 1.75; }
.empty-state { padding: 45px 20px; text-align: center; border: 1px dashed #d5e1e7; border-radius: 12px; color: var(--muted); background: #fff; }
.empty-state h3 { margin-bottom: 8px; }
.empty-state p { font-size: 12px; }
.empty-state svg { width: 35px; height: 35px; margin-bottom: 15px; color: #8ca7b5; }
.feature-count { font-size: 12px; color: var(--muted); margin: 12px 0; }
.findings-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.finding-card { padding: 23px; border: 1px solid var(--line); border-radius: 12px; background: #fff; min-width: 0; }
.finding-meta { display: flex; align-items: center; gap: 8px; margin-bottom: 14px; color: var(--muted); font-size: 12px; }
.finding-card h3 { margin-bottom: 12px; }
.finding-body { color: #526b7d; font-size: 12px; line-height: 1.8; }
.finding-body p + p { margin-top: 10px; }
.acceptance { margin-top: 17px; padding-top: 14px; border-top: 1px solid var(--line); color: #486a60; font-size: 12px; line-height: 1.8; }
.acceptance strong { display: block; font-size: 11px; letter-spacing: .05em; margin-bottom: 3px; color: var(--teal-dark); text-transform: uppercase; }
.source-link { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; margin-top: 13px; color: var(--teal-dark); font-weight: 600; }

.task-list, .phase-tasks, .checklist { display: grid; gap: 12px; }
.task-card { border: 1px solid var(--line); background: #fff; border-radius: 10px; padding: 17px 19px; min-width: 0; }
.task-card.done { background: #f9fcfa; border-color: #cfdfd6; }
.task-card.blocked { border-color: #e4c8bd; }
.task-top { display: flex; align-items: flex-start; gap: 11px; }
.task-top > .badge { margin-left: auto; }
.task-title { color: var(--heading); font-weight: 650; font-size: 12px; }
.task-title button { color: inherit; font: inherit; background: none; border: 0; padding: 0; text-align: left; }
.task-card p { font-size: 12px; color: var(--muted); line-height: 1.75; margin-top: 8px; }
.task-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 7px 13px; color: #738899; font-size: 11px; margin-top: 9px; }
.task-meta span { display: inline-flex; align-items: center; gap: 5px; }
.task-meta svg { width: 12px; height: 12px; }
.task-bottom { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-top: 13px; border-top: 1px solid #edf1f4; padding-top: 12px; }
.task-bottom select { width: auto; max-width: 190px; min-height: 31px; font-size: 12px; padding: 5px 8px; }
.dependency-note { font-size: 12px; line-height: 1.6; color: #926c35; padding-top: 9px; }
.check-control { display: inline-flex; align-items: flex-start; gap: 9px; font-size: 12px; line-height: 1.5; color: var(--text); cursor: pointer; }
.roadmap-controls { background: #fff; border: 1px solid var(--line); border-radius: 11px; padding: 17px 20px; }
.roadmap-controls .field { flex: 1; min-width: 150px; }
.timeline { display: grid; gap: 20px; margin-top: 24px; }
.phase-block { min-width: 0; }
.phase-header { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-bottom: 12px; }
.phase-header > div:first-child { display: flex; align-items: center; gap: 12px; }
.phase-header h3 { font-size: 15px; }
.phase-header p, .phase-header small { color: var(--muted); font-size: 12px; margin-top: 3px; }
.phase-header .progress-track { width: 90px; }
.phase-tasks { margin-left: 0; }
.phase-number { flex: 0 0 34px; height: 34px; border: 1px solid #cfe2dc; border-radius: 9px; background: #eaf5f0; color: var(--teal-dark); display: grid; place-content: center; font-size: 12px; font-weight: 700; }
.deploy-tabs { display: flex; flex-wrap: wrap; gap: 7px; margin: 22px 0; padding: 5px; width: fit-content; border: 1px solid var(--line); border-radius: 10px; background: #eaf0f3; }
.deploy-tabs button { background: none; border: 0; color: #607787; border-radius: 6px; padding: 10px 16px; font-size: 12px; font-weight: 600; }
.deploy-tabs button.active, .deploy-tabs button[aria-selected="true"] { color: var(--teal-dark); background: #fff; box-shadow: 0 2px 6px #122f4010; }
.deploy-step { display: flex; align-items: flex-start; gap: 16px; padding: 20px 0; border-bottom: 1px solid var(--line); }
.deploy-step:first-child { padding-top: 0; }
.deploy-step:last-child { padding-bottom: 0; border-bottom: 0; }
.step-number { flex: 0 0 31px; width: 31px; height: 31px; display: grid; place-content: center; border-radius: 8px; color: #387c70; background: #eaf5f0; font-size: 12px; font-weight: 650; }
.step-content { flex: 1; min-width: 0; }
.step-content h3 { font-size: 13px; margin-bottom: 7px; }
.step-content p, .step-content li { color: var(--muted); font-size: 12px; line-height: 1.85; }
.step-content ul { margin: 8px 0 0; }
.gate-card { background: #fff; border: 1px solid var(--line); padding: 22px; border-radius: 11px; min-width: 0; }
.gate-card.approved { border-color: #bfdccf; background: #fcfefc; }
.gate-card.blocked { border-color: #e5bdbd; }
.gate-top { display: flex; align-items: flex-start; gap: 12px; justify-content: space-between; }
.gate-top h3 { font-size: 13px; margin: 6px 0 8px; }
.gate-top p { font-size: 12px; color: var(--muted); line-height: 1.75; }
.gate-status { min-width: 120px; max-width: 170px; }
.gate-status select { font-size: 12px; min-height: 34px; }
.gate-evidence { margin-top: 15px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; }
.gate-evidence label { font-size: 12px; color: var(--muted); display: grid; gap: 5px; }
.gate-evidence textarea { min-height: 64px; }
.gate-metric { display: block; margin-top: 10px; color: #4b6878; font-size: 12px; }
.readiness-ring { width: 128px; height: 128px; border-radius: 50%; display: grid; place-content: center; color: var(--heading); flex-shrink: 0; text-align: center; }
.readiness-ring > div { width: 103px; height: 103px; border-radius: 50%; background: #fff; display: grid; place-content: center; }
.readiness-ring strong { font-size: 30px; font-weight: 700; letter-spacing: -.04em; line-height: 1.2; }
.readiness-ring small { font-size: 11px; color: var(--muted); }
.release-status { display: flex; align-items: center; gap: 25px; }
.release-status h2 { font-size: 22px; margin: 8px 0; }
.release-status p { color: var(--muted); font-size: 12px; max-width: 500px; line-height: 1.8; }
.completion-summary { display: flex; align-items: center; gap: 20px; margin-bottom: 22px; padding: 19px 23px; background: #fff; border: 1px solid var(--line); border-radius: 11px; }
.completion-summary .progress-track { flex: 1; min-width: 60px; max-width: 320px; }
.completion-summary strong { font-size: 13px; }
.completion-summary small { font-size: 12px; color: var(--muted); }
.scope-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.scope-grid ul { font-size: 12px; color: var(--muted); margin-bottom: 0; line-height: 1.85; }
.chart-bars { display: grid; gap: 15px; margin-top: 20px; }
.chart-bar { display: grid; grid-template-columns: 84px minmax(0, 1fr) 28px; gap: 12px; align-items: center; }
.chart-label { font-size: 12px; color: var(--muted); }
.chart-fill { display: block; height: 7px; border-radius: 5px; background: var(--teal); }
.chart-value { font-size: 12px; font-weight: 650; color: #476173; text-align: right; }

.report-section { padding: 24px; margin-bottom: 18px; border: 1px solid var(--line); border-radius: 12px; background: #fff; }
.report-section h2 { margin-bottom: 14px; font-size: 18px; }
.report-section h3 { margin: 18px 0 10px; font-size: 14px; }
.report-section p, .report-section li { font-size: 12px; color: #536c7e; line-height: 1.85; }
.report-section ul, .report-section ol { margin-bottom: 0; }
.report-section .table-wrap { margin-top: 15px; }
.source-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 13px; }
.source-list li { margin: 0; padding: 13px 0; border-bottom: 1px solid var(--line); }
.source-list li:last-child { border-bottom: 0; }
.source-list a { font-size: 12px; font-weight: 600; overflow-wrap: anywhere; }
.source-list p, .source-list small { display: block; font-size: 12px; color: var(--muted); margin-top: 5px; line-height: 1.75; }
.detail-dialog { max-width: min(720px, calc(100vw - 32px)); width: 720px; max-height: calc(100dvh - 50px); padding: 0; margin: auto; border: 1px solid #d6e0e5; border-radius: 16px; color: var(--text); box-shadow: 0 28px 100px #102b3c38; overflow-y: auto; background: #fff; }
.detail-dialog::backdrop { background: #0b223b78; }
.dialog-head { position: sticky; top: 0; z-index: 1; padding: 24px 27px 20px; display: flex; justify-content: space-between; align-items: flex-start; gap: 15px; background: #fff; border-bottom: 1px solid var(--line); }
.dialog-head h2 { margin: 6px 0 0; font-size: 22px; }
.dialog-head p { font-size: 12px; color: var(--muted); margin-top: 7px; }
.dialog-body { padding: 25px 27px; }
.dialog-body > p { font-size: 12px; line-height: 1.8; color: #587083; }
.dialog-body h3 { font-size: 13px; margin: 20px 0 7px; }
.dialog-body ul { font-size: 12px; color: #587083; line-height: 1.8; }
.dialog-footer { padding: 17px 27px; display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 10px; border-top: 1px solid var(--line); background: #f9fbfc; }
.detail-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin-top: 20px; }
.detail-item > span, .detail-item label { display: block; font-size: 11px; color: var(--muted); font-weight: 650; letter-spacing: .04em; margin-bottom: 6px; }
.detail-item p { font-size: 12px; line-height: 1.8; }
.detail-item.wide { grid-column: 1 / -1; }
.export-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.export-option { padding: 20px; border: 1px solid var(--line); border-radius: 10px; background: #fff; text-align: left; color: var(--heading); min-width: 0; }
.export-option:hover { background: #f2f8f5; border-color: #b1d5c8; }
.export-option strong { display: block; font-size: 12px; margin: 9px 0 5px; }
.export-option span, .export-option small { display: block; color: var(--muted); font-size: 12px; line-height: 1.7; }
.export-option svg { width: 22px; height: 22px; color: var(--teal-dark); }
.toast { position: fixed; bottom: 25px; left: calc(50% + 122px); z-index: 60; padding: 12px 19px; max-width: calc(100vw - 32px); background: #173c43; border: 1px solid #3d6669; color: #f4fbf7; box-shadow: 0 8px 25px #102b3c25; font-size: 12px; border-radius: 9px; opacity: 0; transform: translate(-50%, 12px); pointer-events: none; transition: transform .2s, opacity .2s; }
.toast.visible, .toast.show { transform: translate(-50%, 0); opacity: 1; }
.toast.error { background: #833d3d; border-color: #b46565; }
.print-only { display: none; }

/* Components aligned with the rendered report and planning controls. */
.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; }
#navigation small { margin-left: auto; min-width: 23px; padding: 1px 6px; color: #c4dfdf; background: #315462; border-radius: 5px; text-align: center; font-size: 11px; font-weight: 600; }
.hero { min-height: 282px; padding: 34px 36px; }
.hero h1 { color: #163f3b; font-size: clamp(31px, 3vw, 43px); line-height: 1.15; letter-spacing: -.05em; }
.hero h1 > span { color: var(--teal); }
.hero-content > small { display: block; margin-top: 18px; color: #5c7a70; font-size: 11px; line-height: 1.7; }
.hero-content > p { font-size: 14px; max-width: 570px; line-height: 1.75; }
.hero-visual { flex-basis: 300px; min-width: 0; }
.hero-visual svg, svg.orbit { width: 300px; }
.hero-actions { margin-top: 22px; }
.stat-card { padding: 24px; }
.stat-value { font-size: 35px; }
.stat-label { font-size: 13px; }
.stat-foot { font-size: 12px; line-height: 1.6; }
.panel-head { flex-wrap: wrap; align-items: baseline; }
.panel-head > .badge { white-space: normal; text-align: left; }
.panel-body > p { line-height: 1.8; }
.panel-body > .scope-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 20px 0 22px; gap: 12px; }
.scope-grid > div > strong { display: block; font-size: 27px; letter-spacing: -.04em; color: var(--heading); }
.scope-grid > div > span { display: block; color: var(--muted); font-size: 11px; line-height: 1.65; margin-top: 3px; }
.panel-body > .small.muted { margin-top: 18px; }
.panel-body > .button { margin-top: 18px; }
#main > .panel { margin-bottom: 22px; }
#main > .findings-grid { margin-bottom: 24px; }
.two-col + .panel, .panel + .two-col, .panel + .panel { margin-top: 22px; }
.two-col > .panel + .panel { margin-top: 0; }
.mini-priorities { display: grid; }
button.priority-item { width: 100%; background: transparent; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; color: var(--text); text-align: left; padding: 17px 0; }
button.priority-item:first-child { padding-top: 0; }
button.priority-item:last-child { padding-bottom: 0; border-bottom: 0; }
button.priority-item:hover { background: #f8fbfa; }
.priority-item > span:nth-child(2) { flex: 1; min-width: 0; }
.priority-item strong { font-size: 13px; line-height: 1.6; }
.priority-item small { display: block; margin-top: 5px; color: var(--muted); font-size: 11px; }
.priority-item > svg { width: 16px; height: 16px; color: #8aa0af; margin-top: 3px; }
.priority-item > .badge { margin-top: 3px; }
.priority-num { font-size: 11px; margin-top: 3px; }
.phase-node { padding-top: 0; border: 0; display: flex; flex-direction: column; align-items: flex-start; }
.phase-node:hover { text-decoration: none; }
.phase-dot { position: static; display: grid; place-content: center; flex: 0 0 34px; height: 34px; width: 34px; border: 1px solid #cce2d9; border-radius: 9px; color: #327967; background: #ecf6f1; font-weight: 700; font-size: 12px; }
.phase-dot.complete { color: #fff; background: var(--teal-dark); border-color: var(--teal-dark); }
.phase-node .progress-track { width: 100%; margin: 12px 0 6px; }
.phase-node strong { margin-top: 12px; font-size: 12px; line-height: 1.5; }
.phase-node small { font-size: 11px; }
.phase-header { justify-content: flex-start; align-items: flex-start; gap: 16px; padding: 0 0 4px; }
.phase-header > div { flex: 1; min-width: 0; }
.phase-header .eyebrow { margin-bottom: 6px; }
.phase-header h2 { font-size: 20px; }
.phase-header p { font-size: 13px; margin-top: 7px; line-height: 1.7; }
.phase-header small { display: block; font-size: 12px; margin-top: 7px; line-height: 1.7; }
.phase-tasks { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-left: 50px; }
.task-card.completed { background: #f5fbf7; border-color: #c4dccd; }
.task-card > .task-title { margin-top: 12px; font-size: 14px; color: var(--heading); line-height: 1.55; display: inline-block; }
.task-card > p { font-size: 12px; }
.task-top { flex-wrap: wrap; align-items: center; gap: 8px; }
.task-top .cell-sub { margin-top: 0; }
.task-top > .badge { margin-left: 0; }
.task-top > .small.muted { margin-left: auto; font-size: 11px; }
.ready-dependency { color: #32836b; }
.chart-bar { grid-template-columns: 92px minmax(0, 1fr) 26px; }
.chart-label, .chart-value { font-size: 12px; }
.chart-fill { width: 100%; height: 8px; background: #ecf1f3; overflow: hidden; }
.chart-fill > span { display: block; height: 100%; border-radius: inherit; background: var(--teal); }
.chart-fill > .observed { background: #6e91bc; }
.chart-fill > .unverified { background: #c99a48; }
.input-icon { position: relative; }
.input-icon > svg { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: #7b929f; width: 16px; height: 16px; pointer-events: none; }
.input-icon > input { padding-left: 36px; }
.field { margin-bottom: 1px; }
.dialog-body form > .field, .dialog-body form > .detail-grid { margin: 18px 0; }
.dialog-body form > .button { margin-top: 8px; }
.field > small { font-size: 12px; color: var(--muted); font-weight: 400; line-height: 1.7; }
.form-error { color: #a23636; font-size: 12px; margin: 12px 0; line-height: 1.7; }
.form-error:empty { display: none; }
.danger-text { color: var(--red); }
.observation-cell { max-width: 430px; font-size: 13px; line-height: 1.8; }
.cell-title.btn-link { color: var(--heading); font-size: 13px; line-height: 1.6; }
.finding-card > h2 { font-size: 18px; margin-bottom: 13px; }
.finding-card > p, .finding-body > p { font-size: 13px; line-height: 1.8; color: #536c7e; }
.finding-body { margin-top: 18px; }
.finding-meta { font-size: 12px; }
.release-status { padding: 28px; background: #fff; border: 1px solid var(--line); border-radius: 13px; margin-bottom: 24px; }
.release-status > div:last-child { flex: 1; min-width: 0; }
.release-status p { font-size: 13px; }
.release-status > div > small { display: block; font-size: 12px; color: var(--muted); margin-top: 9px; }
.readiness-ring { background: conic-gradient(var(--teal) 0 var(--progress, 0%), #e8eef1 var(--progress, 0%) 100%); }
.readiness-ring > span { display: flex; flex-direction: column; justify-content: center; height: 104px; width: 104px; background: #fff; border-radius: 50%; font-size: 34px; font-weight: 700; line-height: 1.15; }
.readiness-ring small { display: block; font-size: 12px; font-weight: 400; margin-top: 5px; }
.gate-card > h2 { font-size: 18px; margin: 14px 0 10px; }
.gate-card > p { font-size: 13px; line-height: 1.8; color: var(--muted); }
.gate-metric { padding: 14px; background: #f5f8fa; border-radius: 8px; margin-top: 16px; }
.gate-metric p { font-size: 12px; color: #526e7d; margin-top: 6px; line-height: 1.75; }
.gate-evidence { display: block; padding: 15px 0; }
.gate-evidence small { color: #687f8c; font-size: 11px; }
.gate-evidence p { font-size: 12px; margin: 6px 0 0; color: var(--muted); overflow-wrap: anywhere; line-height: 1.75; }
.gate-card > .button { width: 100%; margin-top: 3px; }
.roadmap-controls .completion-summary { padding: 0; margin: 0; border: 0; flex: 0 0 170px; display: grid; grid-template-columns: 1fr auto; gap: 4px 9px; }
.roadmap-controls .completion-summary strong { font-size: 20px; }
.roadmap-controls .completion-summary > span { font-size: 11px; color: var(--muted); }
.roadmap-controls .completion-summary .progress-track { width: 100%; max-width: none; grid-column: 1 / -1; }
.deploy-steps { margin-top: 25px; }
.step-content > small { display: block; color: #5d7e72; font-size: 12px; line-height: 1.8; margin-top: 10px; }
.report-feature { margin-top: 22px; padding-top: 19px; border-top: 1px solid var(--line); }
.report-feature h3 { line-height: 1.65; }
.report-feature h3 > .badge { vertical-align: middle; margin-left: 5px; }
.report-feature p { overflow-wrap: anywhere; }
.report-section .stats-grid { margin-top: 22px; margin-bottom: 0; }
.report-section > .flow { margin: 17px 0; }
.report-section > .flow + p { margin-bottom: 27px; }
.report-section .flow-step { min-width: 130px; }
.report-section .flow-step > span { display: inline-grid; place-content: center; height: 23px; width: 23px; border-radius: 6px; background: #e1ede8; color: #36765f; font-weight: 650; margin-bottom: 9px; }
.report-section .flow-step > p { font-size: 12px; line-height: 1.7; }
.report-section > .mini-list { margin: 14px 0; }
.report-section .source-list .source-link { margin-top: 0; }
.export-grid { margin-top: 22px; }
blockquote { margin: 17px 0; padding: 13px 16px; border-left: 3px solid #7bbca9; background: #f2f8f4; font-size: 13px; line-height: 1.8; color: #466759; border-radius: 0 7px 7px 0; }

@media (min-width: 1550px) {
  #main { padding-left: 48px; padding-right: 48px; }
  .topbar { padding-left: 48px; padding-right: 48px; }
  .hero { padding: 33px 40px; }
  .hero-visual { flex-basis: 300px; }
  .hero-visual svg { width: 300px; }
}
@media (max-width: 1180px) {
  .sidebar { width: 220px; padding-left: 15px; padding-right: 15px; }
  .shell { margin-left: 220px; }
  #main { padding: 28px 26px; }
  .topbar { padding: 16px 26px; }
  .page-footer { margin: 0 26px; }
  .workspace-tag { font-size: 11px; }
  .top-actions .save-state { display: none; }
  .hero { padding: 26px; gap: 20px; }
  .hero-visual { flex-basis: 180px; }
  .stats-grid { gap: 12px; }
  .stat-card { padding: 18px 16px; }
  .stat-value { font-size: 29px; }
  .stat-icon { width: 26px; height: 26px; }
  .two-col { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
  .panel { padding: 21px; }
  .phase-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 24px; }
  .toast { left: calc(50% + 110px); }
}
@media (max-width: 900px) {
  .sidebar { width: 195px; padding: 24px 12px 18px; }
  .brand { font-size: 14px; gap: 9px; }
  .brand-mark { width: 35px; height: 35px; }
  .brand small { font-size: 11px; }
  .workspace-tag { margin-top: 23px; padding: 9px 6px; font-size: 11px; }
  .version-tag { font-size: 11px; }
  #navigation a, #navigation button { gap: 10px; padding: 10px; font-size: 12px; }
  .shell { margin-left: 195px; }
  .breadcrumb { font-size: 12px; gap: 8px; }
  #main { padding: 25px 22px; }
  .topbar { padding: 15px 22px; gap: 10px; }
  .page-footer { margin: 0 22px; font-size: 11px; }
  .top-actions { gap: 4px; }
  .top-actions .button { padding: 8px 10px; font-size: 12px; }
  .hero-visual { display: none; }
  .hero { min-height: 0; }
  .stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .two-col, .two-col.equal, .three-col, .findings-grid { grid-template-columns: 1fr; }
  .span-2 { grid-column: auto; }
  .toast { left: calc(50% + 97px); }
  .filters .field:first-child { min-width: 100%; }
  .filters .field { flex: 1; }
  .gate-evidence { grid-template-columns: 1fr; }
  .scope-grid { grid-template-columns: 1fr; }
}
@media (max-width: 680px) {
  html { scroll-padding-top: 15px; }
  .sidebar { position: relative; width: 100%; height: auto; min-height: 0; overflow: visible; padding: 17px 20px 0; }
  .brand { font-size: 14px; width: fit-content; }
  .brand-mark { width: 34px; height: 34px; border-radius: 9px; font-size: 22px; }
  .brand-mark span { font-size: 14px; }
  .brand small { font-size: 11px; margin-top: 3px; }
  .workspace-tag { position: absolute; top: 19px; right: 20px; margin: 0; width: auto; padding: 6px 8px; gap: 5px; font-size: 11px; background: #1a394a; }
  .workspace-tag .version-tag { display: none; }
  .nav-label, .sidebar-note, .sidebar-footer { display: none; }
  #navigation { display: flex; gap: 4px; overflow-x: auto; scrollbar-width: none; margin: 17px -20px 0; padding: 0 16px 10px; overscroll-behavior-inline: contain; }
  #navigation::-webkit-scrollbar { display: none; }
  #navigation a, #navigation button { flex: 0 0 auto; width: auto; min-height: 36px; padding: 8px 10px; gap: 6px; font-size: 12px; white-space: nowrap; }
  #navigation svg { width: 14px; height: 14px; }
  #navigation .nav-count, #navigation .count { display: none; }
  .shell { margin-left: 0; }
  .topbar { padding: 12px 20px; min-height: 58px; }
  .breadcrumb { font-size: 11px; gap: 6px; min-width: 0; }
  .breadcrumb > strong { max-width: 130px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .breadcrumb > span:first-of-type { display: none; }
  .breadcrumb { font-size: 0; }
  .breadcrumb strong { font-size: 12px; }
  .top-actions .button { padding: 7px 9px; min-height: 32px; font-size: 11px; }
  #main { padding: 24px 20px 28px; min-height: 60dvh; }
  .page-heading { margin-bottom: 20px; }
  .heading-row { flex-wrap: wrap; gap: 12px; align-items: flex-start; }
  h1 { font-size: 27px; }
  .eyebrow { font-size: 11px; margin-bottom: 8px; }
  .page-subtitle { font-size: 12px; line-height: 1.75; }
  .hero { padding: 23px; margin-bottom: 17px; border-radius: 12px; }
  .hero h2 { font-size: 25px; }
  .hero h1 { font-size: 31px; }
  .hero p { font-size: 12px; }
  .hero-actions { gap: 12px; }
  .hero-actions .button { font-size: 12px; padding: 9px 11px; }
  .hero-pill { font-size: 11px; }
  .stats-grid { gap: 10px; margin-bottom: 22px; }
  .stat-card { padding: 17px 15px; border-radius: 10px; }
  .stat-value { font-size: 27px; }
  .stat-icon { width: 25px; height: 25px; }
  .stat-icon svg { width: 13px; height: 13px; }
  .stat-label { font-size: 12px; }
  .stat-foot { font-size: 11px; }
  .panel, .report-section, .finding-card { padding: 21px; border-radius: 11px; }
  .panel-head { gap: 9px; }
  .panel-head h2 { font-size: 16px; }
  .panel-head .btn-link { font-size: 12px; }
  .section-heading { margin-top: 24px; }
  .section-heading h2 { font-size: 16px; }
  .phase-strip { gap: 22px 13px; }
  .phase-node strong { font-size: 12px; }
  .phase-node small { font-size: 11px; }
  .filters, .roadmap-controls { gap: 10px; }
  .filters .field, .roadmap-controls .field { min-width: 125px; }
  .filters .field:first-child { min-width: 100%; }
  .roadmap-controls { padding: 15px; }
  .table-wrap { border-radius: 9px; }
  .data-table { min-width: 620px; }
  .data-table th { font-size: 11px; padding: 11px 13px; }
  .data-table td { padding: 13px; }
  .cell-sub { font-size: 12px; max-width: 240px; }
  .notice { padding: 14px 15px; font-size: 12px; }
  .task-card { padding: 16px; }
  .task-title { font-size: 12px; }
  .task-bottom { flex-wrap: wrap; gap: 10px; }
  .task-meta { gap: 5px 10px; }
  .phase-header { align-items: flex-start; }
  .phase-header h3 { font-size: 13px; }
  .phase-header .progress-track { width: 65px; }
  .phase-number { width: 30px; height: 30px; flex-basis: 30px; }
  .phase-header > div:first-child { gap: 9px; }
  .phase-header { gap: 12px; }
  .phase-header h2 { font-size: 18px; }
  .phase-tasks { grid-template-columns: 1fr; margin-left: 0; }
  .phase-dot { width: 30px; height: 30px; flex-basis: 30px; }
  .roadmap-controls .completion-summary { flex: 1 0 100%; padding-top: 11px; border-top: 1px solid var(--line); }
  .deploy-tabs { width: 100%; }
  .deploy-tabs button { flex: 1; padding: 9px 10px; font-size: 12px; }
  .deploy-step { gap: 12px; }
  .step-number { width: 27px; height: 27px; flex-basis: 27px; font-size: 12px; }
  .gate-card { padding: 18px; }
  .gate-top { flex-wrap: wrap; }
  .gate-status { max-width: 100%; width: 100%; }
  .gate-status select { width: 100%; }
  .release-status { align-items: flex-start; gap: 17px; }
  .readiness-ring { width: 95px; height: 95px; }
  .readiness-ring > div { width: 77px; height: 77px; }
  .readiness-ring > span { width: 77px; height: 77px; font-size: 26px; }
  .readiness-ring strong { font-size: 23px; }
  .readiness-ring small { font-size: 11px; }
  .release-status h2 { font-size: 18px; }
  .release-status p { font-size: 12px; }
  .release-status { padding: 20px; gap: 17px; }
  .release-status > div > small { font-size: 11px; }
  .completion-summary { flex-wrap: wrap; padding: 16px; gap: 12px; }
  .completion-summary .progress-track { max-width: none; }
  .scope-grid { gap: 14px; }
  .export-grid { grid-template-columns: 1fr; }
  .export-option { padding: 17px; }
  .detail-dialog { max-width: calc(100vw - 24px); max-height: calc(100dvh - 24px); border-radius: 13px; }
  .dialog-head { padding: 21px 21px 17px; }
  .dialog-head h2 { font-size: 19px; }
  .dialog-body { padding: 21px; }
  .dialog-footer { padding: 16px 21px; }
  .detail-grid { grid-template-columns: 1fr; gap: 14px; }
  .hero-content > small { font-size: 11px; }
  .finding-card > h2, .gate-card > h2 { font-size: 17px; }
  .scope-grid > div > strong { font-size: 25px; }
  .scope-grid > div > span { font-size: 11px; }
  .panel-body > .scope-grid { gap: 10px; }
  .page-footer { margin: 0 20px; padding: 15px 0; flex-wrap: wrap; gap: 6px; font-size: 11px; }
  .toast { left: 50%; width: max-content; bottom: 17px; font-size: 12px; }
}
@media (max-width: 380px) {
  .workspace-tag { font-size: 0; padding: 7px; }
  #main { padding-left: 15px; padding-right: 15px; }
  .topbar { padding-left: 15px; padding-right: 15px; }
  .hero { padding: 20px; }
  .hero h2 { font-size: 23px; }
  .hero h1 { font-size: 29px; }
  .stat-card { padding: 15px 12px; }
  .stat-icon { display: none; }
  .phase-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; animation: none !important; }
}
@media print {
  @page { size: A4; margin: 15mm; }
  :root { font-size: 10pt; }
  body { background: #fff; color: #172c3a; }
  .sidebar, .topbar, .page-footer, .filters, .roadmap-controls, .hero-actions, .top-actions, .toast, .skip-link, dialog, #import-file, button, .button, .btn-link, .icon-button, .no-print, .deploy-tabs { display: none !important; }
  .shell { margin: 0; }
  #main { max-width: none; min-height: 0; margin: 0; padding: 0; }
  .print-only { display: block; }
  h1 { font-size: 23pt; }
  h2 { font-size: 15pt; }
  h3 { font-size: 12pt; }
  p, .page-subtitle, .report-section p, .report-section li, .finding-body, .acceptance { font-size: 10pt; line-height: 1.55; }
  h1, h2, h3, h4 { break-after: avoid; }
  .page-heading { margin-bottom: 18pt; }
  .report-section, .panel, .finding-card, .gate-card, .task-card, .stat-card { border-color: #c9d3d9; border-radius: 0; box-shadow: none; padding: 12pt; margin-bottom: 12pt; }
  .report-section { break-inside: auto; }
  .panel, .finding-card, .gate-card, .task-card, .stat-card, .deploy-step, .flow-step, .notice, tr { break-inside: avoid; }
  .stats-grid { grid-template-columns: repeat(4, 1fr); gap: 9pt; }
  .stat-value { font-size: 24pt; }
  .stat-label, .stat-foot { font-size: 8pt; }
  .hero { padding: 15pt; background: #f1f7f3; border-radius: 0; min-height: 0; break-inside: avoid; }
  .hero-visual { display: none; }
  .hero h2 { font-size: 20pt; }
  .two-col, .three-col, .findings-grid, .scope-grid { display: block; }
  .table-wrap { overflow: visible; border-radius: 0; }
  .data-table { min-width: 0; width: 100%; font-size: 8pt; }
  .data-table th { font-size: 7pt; padding: 8pt; }
  .data-table td { padding: 8pt; }
  .cell-title { font-size: 8pt; }
  .cell-sub { font-size: 7.5pt; max-width: none; }
  thead { display: table-header-group; }
  a { color: #173d59; text-decoration: none; }
  .source-list a { font-size: 9pt; }
  .source-list a::after { content: " — " attr(href); display: block; font-size: 7pt; font-weight: 400; word-break: break-all; color: #53616a; }
  .badge { font-size: 7pt; border: 1px solid #ccd7df; }
  .gate-evidence { display: block; }
  .gate-evidence label { margin-top: 8pt; }
  input, select, textarea { border: 0; padding: 0; background: transparent; min-height: 0; font-size: 8pt; }
  textarea { resize: none; }
  .release-status { break-inside: avoid; }
  .phase-strip { grid-template-columns: repeat(4, 1fr); }
  .phase-node strong { font-size: 9pt; }
  .phase-node small { font-size: 8pt; }
  .notice { border-radius: 0; }
}

/* Economic planning and provider comparison. */
.economic-hero { padding: 30px 32px; margin-bottom: 24px; border: 1px solid #244b5e; border-radius: var(--radius); background: var(--navy); color: #dcebf0; min-width: 0; }
.economic-hero .kicker, .economic-hero .eyebrow { color: #98ddc9; }
.economic-hero h2 { color: #fff; font-size: clamp(24px, 2.5vw, 31px); line-height: 1.25; letter-spacing: -.035em; margin: 9px 0 12px; }
.economic-hero p { max-width: 800px; color: #bdcfd9; font-size: 14px; line-height: 1.8; }
.economic-hero small { display: block; color: #9fb9c6; font-size: 12px; line-height: 1.7; margin-top: 12px; }
.economic-hero strong { color: #e4f5ef; }
.economic-hero a { color: #a4e8d3; }
.economic-hero .badge { background: #264b56; color: #b3edda; }
.economic-hero .button { background: #e1f7ef; border-color: #e1f7ef; color: #133d3b; }
.economic-hero .button:hover { background: #c9f1e4; border-color: #c9f1e4; }
.economic-toolbar { display: flex; flex-wrap: wrap; align-items: end; justify-content: flex-start; gap: 12px; margin: 22px 0; }
.economic-toolbar > .field { flex: 1 1 175px; max-width: 310px; }
.economic-toolbar > select { width: auto; min-width: 175px; max-width: 100%; }
.economic-toolbar > .button { flex-shrink: 0; min-height: 39px; }
.economic-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin: 22px 0 26px; }
.economic-summary .stat-card { padding: 22px 20px; }
.economic-summary .stat-value { font-size: clamp(22px, 1.9vw, 30px); font-variant-numeric: tabular-nums; line-height: 1.2; letter-spacing: -.04em; overflow-wrap: anywhere; }
.economic-summary .stat-label { font-size: 12px; line-height: 1.6; }
.economic-summary .stat-foot { font-size: 11px; line-height: 1.7; overflow-wrap: anywhere; }
.economic-summary .stat-icon { width: 26px; height: 26px; margin-left: 5px; }
.economic-columns { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 22px; margin: 24px 0; align-items: start; }
.economic-columns > * { min-width: 0; }
.economic-columns > .panel + .panel { margin-top: 0; }
.economic-columns .data-table th { white-space: normal; line-height: 1.6; }
.economic-columns .data-table td { font-variant-numeric: tabular-nums; }
.economic-breakdown { margin: 0; min-width: 0; }
.economic-breakdown > div { display: flex; justify-content: space-between; gap: 22px; padding: 13px 0; border-bottom: 1px solid var(--line); align-items: baseline; }
.economic-breakdown > div:first-child { padding-top: 0; }
.economic-breakdown dt { font-size: 13px; line-height: 1.7; color: #5a7282; min-width: 0; }
.economic-breakdown dt small { display: block; color: #7c8e9a; font-size: 11px; line-height: 1.7; margin-top: 3px; }
.economic-breakdown dd { color: var(--heading); font-size: 14px; font-weight: 600; font-variant-numeric: tabular-nums; margin: 0; text-align: right; flex-shrink: 0; }
.economic-breakdown .total { margin-top: 10px; border-top: 1px solid #bed7ce; border-bottom: 0; padding: 17px 0 3px; }
.economic-breakdown .total dt { color: #245f51; font-weight: 650; }
.economic-breakdown .total dd { color: #155d4a; font-size: 22px; letter-spacing: -.035em; }
.economic-breakdown + .notice { margin-bottom: 0; }
.economic-payment-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin: 20px 0 24px; }
.economic-payment { min-width: 0; padding: 20px; border: 1px solid var(--line); border-radius: 11px; background: #fff; }
.economic-payment small { display: block; color: #6c8291; font-size: 11px; line-height: 1.65; }
.economic-payment strong { display: block; color: var(--heading); font-size: clamp(21px, 1.8vw, 28px); line-height: 1.2; letter-spacing: -.04em; font-variant-numeric: tabular-nums; margin: 13px 0 10px; overflow-wrap: anywhere; }
.economic-payment p { font-size: 12px; color: var(--muted); line-height: 1.75; }
.economic-payment:first-child { border-color: #bcdccf; background: #f7fcf9; }
.economic-payment:first-child strong { color: var(--teal-dark); }
.economic-provider-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 17px; margin: 21px 0 25px; align-items: stretch; }
.economic-provider { display: flex; flex-direction: column; min-width: 0; padding: 23px; border: 1px solid var(--line); border-radius: 12px; background: #fff; position: relative; }
.economic-provider.selected { border-color: #78bca8; background: #f7fcf9; box-shadow: inset 0 3px 0 #2b957c; }
.economic-provider h3 { font-size: 18px; line-height: 1.4; margin: 5px 0 10px; }
.economic-provider > .badge { align-self: flex-start; white-space: normal; margin-bottom: 10px; }
.economic-provider p, .economic-provider li { font-size: 12px; line-height: 1.8; color: #5d7485; }
.economic-provider ul { padding-left: 18px; margin: 14px 0; }
.economic-provider .price, .economic-price { color: var(--heading); font-size: clamp(24px, 2.2vw, 34px); letter-spacing: -.045em; line-height: 1.2; font-weight: 700; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; margin: 12px 0 8px; }
.economic-provider .price small, .economic-price small { color: #6f8492; font-size: 12px; font-weight: 450; letter-spacing: 0; margin-left: 4px; line-height: 1.7; }
.economic-provider > .button { width: 100%; margin-top: auto; }
.economic-provider .economic-source { margin-top: auto; padding-top: 16px; }
.economic-provider .economic-source + .button { margin-top: 17px; }
.economic-source { display: block; color: #6c8190; font-size: 11px; line-height: 1.8; overflow-wrap: anywhere; }
.economic-source a { font-size: inherit; color: var(--teal-dark); text-decoration: underline; text-underline-offset: 3px; }
.economic-terms { margin: 20px 0; border: 1px solid var(--line); background: #fff; border-radius: 11px; overflow: hidden; }
.economic-terms > summary { cursor: pointer; padding: 17px 21px; color: var(--heading); font-size: 13px; font-weight: 650; line-height: 1.6; }
.economic-terms > summary:hover { background: #f4f8f7; }
.economic-terms > summary::marker { color: var(--teal); }
.economic-terms[open] > summary { border-bottom: 1px solid var(--line); background: #f7faf9; }
.economic-terms > :not(summary) { margin: 18px 21px; }
.economic-terms p, .economic-terms li, .economic-terms label { font-size: 12px; color: #5b7485; line-height: 1.85; }
.economic-terms .checklist { list-style: none; padding: 0; gap: 11px; }
.economic-terms .checklist li { display: flex; gap: 10px; margin-top: 0; }
.economic-terms .checklist li::before { content: "✓"; color: var(--teal-dark); font-weight: 700; }
.economic-assumption-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 17px 20px; margin: 17px 0; }
.economic-assumption-grid > * { min-width: 0; }
.economic-assumption-grid .field > label { font-size: 12px; line-height: 1.65; }
.economic-assumption-grid input, .economic-assumption-grid select { font-size: 13px; min-height: 42px; }
.economic-assumption-grid .field > small { font-size: 11px; font-weight: 400; }
.economic-phase-input { display: grid; grid-template-columns: 20px minmax(0, 1fr) minmax(105px, 140px); gap: 12px; align-items: center; padding: 15px 0; border-bottom: 1px solid var(--line); min-width: 0; }
.economic-phase-input:last-child { border-bottom: 0; }
.economic-phase-input input[type="checkbox"] { width: 16px; height: 16px; margin: 0; }
.economic-phase-input label, .economic-phase-input strong { font-size: 13px; line-height: 1.65; }
.economic-phase-input small { display: block; font-size: 11px; line-height: 1.7; color: var(--muted); }
.economic-phase-input input[type="number"] { min-height: 40px; font-size: 13px; font-variant-numeric: tabular-nums; text-align: right; }
.economic-fieldset { min-width: 0; margin: 20px 0; padding: 18px 20px 20px; border: 1px solid #d7e2e8; border-radius: 11px; }
.economic-fieldset > legend { color: var(--heading); font-size: 13px; font-weight: 650; padding: 0 8px; margin-left: -7px; max-width: 100%; }
.economic-fieldset > p { font-size: 12px; color: var(--muted); line-height: 1.8; }
.economic-fieldset > .economic-assumption-grid:last-child { margin-bottom: 0; }
.detail-dialog:has(#economic-form) { width: 920px; max-width: min(920px, calc(100vw - 36px)); }
#economic-form > .button { min-height: 42px; }

@media (max-width: 1180px) {
  .economic-summary, .economic-payment-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .economic-summary .stat-value { font-size: 29px; }
  .economic-provider-grid { grid-template-columns: 1fr; }
  .economic-provider { padding: 23px; }
  .economic-provider .price, .economic-price { font-size: 31px; }
}
@media (max-width: 900px) {
  .economic-columns { grid-template-columns: 1fr; gap: 19px; }
  .economic-hero { padding: 26px; }
  .economic-hero h2 { font-size: 27px; }
  .economic-toolbar > .field { max-width: none; }
  .economic-summary { gap: 13px; }
  .economic-payment strong { font-size: 26px; }
}
@media (max-width: 680px) {
  .economic-hero { padding: 24px; margin-bottom: 21px; border-radius: 12px; }
  .economic-hero h2 { font-size: 25px; }
  .economic-hero p { font-size: 13px; }
  .economic-summary, .economic-payment-grid, .economic-provider-grid { grid-template-columns: 1fr; gap: 13px; }
  .economic-summary .stat-card { padding: 21px 23px; }
  .economic-summary .stat-value { font-size: 31px; }
  .economic-toolbar { gap: 11px; margin: 19px 0; }
  .economic-toolbar > .field, .economic-toolbar > select { flex: 1 0 100%; width: 100%; max-width: 100%; }
  .economic-toolbar > .button { flex: 1 1 130px; }
  .economic-columns { margin: 20px 0; }
  .economic-payment { padding: 21px 23px; }
  .economic-payment strong { font-size: 29px; }
  .economic-provider { padding: 22px; }
  .economic-provider h3 { font-size: 18px; }
  .economic-provider .price, .economic-price { font-size: 30px; }
  .economic-breakdown > div { gap: 15px; }
  .economic-breakdown dt { font-size: 12px; }
  .economic-breakdown dd { font-size: 13px; }
  .economic-breakdown .total dd { font-size: 20px; }
  .economic-terms > summary { padding: 16px 18px; }
  .economic-terms > :not(summary) { margin: 16px 18px; }
  .economic-assumption-grid { grid-template-columns: 1fr; gap: 15px; }
  .economic-phase-input { grid-template-columns: 20px minmax(0, 1fr); gap: 8px 11px; }
  .economic-phase-input > :last-child { grid-column: 2; max-width: 190px; }
  .economic-fieldset { padding: 14px 16px 17px; margin: 18px 0; }
  .detail-dialog:has(#economic-form) { max-width: calc(100vw - 24px); }
  #economic-form > .button { width: 100%; }
}
@media print {
  .economic-toolbar { display: none !important; }
  .economic-hero { border: 1px solid #c4d3da; border-radius: 0; color: #183743; background: #f0f5f5; padding: 13pt; margin-bottom: 13pt; break-inside: avoid; }
  .economic-hero h2 { font-size: 19pt; color: #183743; }
  .economic-hero .eyebrow, .economic-hero .kicker, .economic-hero p, .economic-hero small, .economic-hero strong { color: #375767; }
  .economic-hero p { font-size: 10pt; }
  .economic-summary, .economic-payment-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9pt; margin: 12pt 0; }
  .economic-summary .stat-card { padding: 11pt; }
  .economic-summary .stat-value { font-size: 22pt; }
  .economic-columns, .economic-provider-grid { display: block; }
  .economic-payment, .economic-provider, .economic-fieldset { border-radius: 0; box-shadow: none; padding: 11pt; break-inside: avoid; margin-bottom: 10pt; }
  .economic-payment strong, .economic-provider .price, .economic-price { font-size: 21pt; }
  .economic-payment p, .economic-provider p, .economic-provider li { font-size: 9pt; }
  .economic-breakdown dt { font-size: 9pt; }
  .economic-breakdown dd { font-size: 10pt; }
  .economic-breakdown .total dd { font-size: 16pt; }
  .economic-source { font-size: 8pt; }
  .economic-terms { border-radius: 0; break-inside: avoid; }
  .economic-terms > summary { font-size: 11pt; padding: 10pt; }
  .economic-terms > :not(summary) { margin: 10pt; }
  .economic-terms li, .economic-terms p { font-size: 9pt; }
}

/* Evidence gallery, source records and printable screenshots. */
.evidence-notice { margin-top: 0; }
.evidence-notice > strong { display: block; margin-bottom: 3px; }
.evidence-filters { align-items: end; }
.evidence-filters > .field:first-child { min-width: 210px; }
.evidence-filters > .field:last-child { min-width: 200px; }
.evidence-results-count { display: flex; flex-wrap: wrap; align-items: baseline; gap: 5px; color: #5c7384; font-size: 12px; margin: 18px 0 15px; }
.evidence-results-count strong { color: var(--heading); font-size: 14px; }
.evidence-results-count > span { margin-left: 3px; color: #7c8e9c; }
.evidence-gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; margin-bottom: 26px; }
.evidence-card { display: flex; flex-direction: column; min-width: 0; background: #fff; border: 1px solid var(--line); border-radius: 13px; overflow: hidden; box-shadow: var(--shadow); }
.evidence-preview { position: relative; display: block; width: 100%; aspect-ratio: 16 / 9; padding: 0; border: 0; border-radius: 0; background: #e9f0f3; overflow: hidden; }
.evidence-preview:hover img { filter: brightness(.97); }
.evidence-preview:focus-visible { outline-offset: -4px; }
.evidence-preview img { display: block; height: 100%; width: 100%; object-fit: cover; object-position: top center; }
.evidence-capture-count { display: inline-flex; align-items: center; position: absolute; right: 12px; bottom: 12px; padding: 5px 9px; color: #eaf6f4; background: #173a48; border: 1px solid #4d6b75; border-radius: 6px; font-size: 11px; font-weight: 550; }
.evidence-card-body { display: flex; flex-direction: column; align-items: flex-start; padding: 22px; flex: 1; border-top: 1px solid var(--line); }
.evidence-card-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 7px 13px; font-size: 11px; color: #738b99; margin-bottom: 11px; }
.evidence-card-meta > span:first-child { color: #277863; font-weight: 700; }
.evidence-card-body > h2 { color: var(--heading); font-size: 18px; letter-spacing: -.02em; line-height: 1.45; margin: 0 0 12px; }
.evidence-card-body > .badge { white-space: normal; font-size: 11px; text-align: left; }
.evidence-card-body > p { font-size: 13px; line-height: 1.8; color: #607889; margin-top: 13px; }
.evidence-card-scope { display: flex; align-items: center; gap: 7px; color: #778d9a; font-size: 11px; line-height: 1.6; margin-top: 17px; }
.evidence-card-scope svg { width: 14px; height: 14px; color: #829da9; }
.evidence-card-footer { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; width: 100%; padding-top: 16px; margin-top: auto; }
.evidence-card-footer .btn-link { min-height: 32px; }
.evidence-card-footer small { font-size: 11px; color: #7c8e9a; }
.evidence-gallery.compact { gap: 16px; }
.evidence-card.compact .evidence-card-body { padding: 18px; }
.evidence-card.compact .evidence-card-body > h2 { font-size: 16px; }
.evidence-card.compact .evidence-card-body > p { font-size: 12px; }
.evidence-card.compact .evidence-card-meta { font-size: 11px; }
.evidence-text-only { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 14px; width: 100%; min-height: 170px; background: #f4f7f9; color: #6e8795; padding: 25px; text-align: center; }
.evidence-text-only > svg { width: 29px; height: 29px; color: #7898a7; }
.evidence-text-only > span { font-size: 13px; font-weight: 600; line-height: 1.7; }
.evidence-text-only small { display: block; font-size: 11px; font-weight: 400; margin-top: 4px; color: #8396a1; }
.evidence-empty h3 { font-size: 17px; }
.evidence-empty p { font-size: 13px; }
.detail-dialog:has(.evidence-detail) { width: 1080px; max-width: min(1080px, calc(100vw - 40px)); }
.evidence-detail { min-width: 0; }
.evidence-detail-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; }
.evidence-detail-meta > .badge { white-space: normal; text-align: left; }
.evidence-detail-meta > span:last-child:not(.badge) { color: #7a8f9b; font-size: 11px; }
.evidence-detail-summary { font-size: 14px; line-height: 1.85; color: #4d697b; margin-top: 17px; }
.evidence-record-meta { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin: 22px 0; padding: 17px 19px; border: 1px solid #e0e9ed; border-radius: 9px; background: #f7fafb; }
.evidence-record-meta > div { min-width: 0; }
.evidence-record-meta dt { font-size: 11px; color: #7a8e9d; margin-bottom: 7px; }
.evidence-record-meta dd { display: flex; flex-wrap: wrap; gap: 6px; color: #395c6f; font-size: 12px; margin: 0; line-height: 1.8; }
.evidence-record-meta time { overflow-wrap: anywhere; }
.evidence-ref { display: inline-flex; padding: 3px 6px; font-size: 10px; line-height: 1.45; color: #437298; border: 1px solid #cee1ef; background: #edf5fc; border-radius: 4px; font-weight: 600; }
.evidence-ref.finding { color: #987335; background: #fcf6e9; border-color: #e7dab7; }
.evidence-images { display: grid; gap: 22px; }
.evidence-figure { margin: 0; border: 1px solid #dbe5eb; border-radius: 11px; overflow: hidden; background: #f1f5f7; }
.evidence-image-link { display: block; cursor: zoom-in; }
.evidence-image-link:focus-visible { outline-offset: -4px; }
.evidence-figure img { display: block; width: 100%; height: auto; max-height: 72vh; object-fit: contain; object-position: top center; }
.evidence-figure figcaption { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 8px 15px; padding: 14px 17px; background: #fff; color: #5f7989; border-top: 1px solid #dbe5eb; font-size: 12px; line-height: 1.75; }
.evidence-figure figcaption > span { flex: 1 1 290px; min-width: 0; }
.evidence-figure figcaption strong { color: #285f55; margin-right: 6px; }
.evidence-figure .evidence-original { font-size: 11px; margin: 0; flex-shrink: 0; }
.evidence-original svg { height: 13px; width: 13px; }
.evidence-context-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 28px; margin-top: 25px; }
.evidence-context-grid > section { min-width: 0; }
.evidence-context-grid h3 { margin: 0 0 13px; font-size: 14px; }
.evidence-context-grid p, .evidence-steps li { color: #577185; font-size: 13px; line-height: 1.85; }
.evidence-steps { margin: 0; padding-left: 21px; }
.evidence-steps li { padding-left: 3px; }
.evidence-steps li + li { margin-top: 7px; }
.evidence-steps li::marker { color: #397d6c; font-weight: 650; }
.evidence-detail > .notice { margin: 24px 0 20px; }
.evidence-source { display: flex; flex-direction: column; align-items: flex-start; gap: 7px; }
.evidence-source .source-link { font-size: 12px; margin-top: 0; overflow-wrap: anywhere; word-break: break-word; }
.evidence-source small { color: #7c909c; font-size: 11px; line-height: 1.8; }
.evidence-related { padding-top: 20px; margin-top: 22px; border-top: 1px solid var(--line); }
.evidence-related > h3 { margin-top: 0; margin-bottom: 12px; }
.evidence-related-list { display: grid; gap: 10px; }
.evidence-related-button { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 65px; padding: 14px; background: #f6faf8; border: 1px solid #dcebe3; border-radius: 9px; color: #2c665b; text-align: left; }
.evidence-related-button:hover { border-color: #9ecdbb; background: #edf7f1; }
.evidence-related-icon { display: grid; place-content: center; height: 30px; width: 30px; flex: 0 0 30px; border-radius: 8px; background: #e4f1e9; color: #438a73; }
.evidence-related-icon svg { height: 16px; width: 16px; }
.evidence-related-button > span:nth-child(2) { flex: 1; min-width: 0; }
.evidence-related-button strong { display: block; font-size: 12px; line-height: 1.65; }
.evidence-related-button small { display: block; margin-top: 3px; color: #739084; font-size: 11px; line-height: 1.7; }
.evidence-related-button > svg { width: 17px; height: 17px; flex-shrink: 0; }
.evidence-report-record { margin-top: 26px; padding-top: 22px; border-top: 1px solid var(--line); }
.evidence-report-record h3 { line-height: 1.7; }
.evidence-report-record h3 .badge { margin-left: 5px; vertical-align: middle; white-space: normal; text-align: left; }
.evidence-report-record .evidence-report-meta { font-size: 11px; color: #79909f; margin-top: 7px; }
.evidence-report-record .evidence-figure { margin: 19px 0; }
.evidence-report-record .evidence-figure + .evidence-figure { margin-top: 22px; }
.evidence-report-record h4 { font-size: 13px; margin: 19px 0 11px; }
.evidence-report-record .evidence-steps { margin-bottom: 18px; }
.evidence-report-record .evidence-report-refs { font-size: 11px; color: #6c8392; }
.evidence-report-source a { overflow-wrap: anywhere; font-size: 11px; }
.evidence-text-record { padding: 15px 18px; border: 1px dashed #d0dfe6; border-radius: 8px; background: #f6f9fa; color: #708997; }

@media (min-width: 1600px) {
  .evidence-gallery:not(.compact) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 1180px) {
  .evidence-gallery { gap: 17px; }
  .evidence-card-body { padding: 20px; }
  .evidence-card-body > h2 { font-size: 17px; }
}
@media (max-width: 900px) {
  .evidence-gallery { grid-template-columns: 1fr; gap: 20px; }
  .evidence-preview { aspect-ratio: 16 / 8; }
  .evidence-filters > .field:first-child { min-width: 100%; }
  .evidence-filters > .field:last-child { min-width: 170px; }
  .evidence-card-body { padding: 23px; }
  .evidence-context-grid { grid-template-columns: 1fr; gap: 23px; }
}
@media (max-width: 680px) {
  .evidence-gallery, .evidence-gallery.compact { grid-template-columns: 1fr; gap: 18px; }
  .evidence-preview { aspect-ratio: 16 / 9; }
  .evidence-filters > .field { flex: 1 0 100%; min-width: 0 !important; }
  .evidence-card { border-radius: 11px; }
  .evidence-card-body { padding: 20px; }
  .evidence-card-body > h2 { font-size: 17px; }
  .evidence-card-body > p { font-size: 13px; }
  .evidence-capture-count { right: 10px; bottom: 10px; padding: 4px 7px; font-size: 11px; }
  .evidence-record-meta { grid-template-columns: 1fr; gap: 15px; padding: 15px; }
  .detail-dialog:has(.evidence-detail) { max-width: calc(100vw - 20px); }
  .evidence-detail-summary { font-size: 13px; }
  .evidence-figure { border-radius: 8px; }
  .evidence-figure figcaption { padding: 12px 13px; gap: 9px; font-size: 12px; }
  .evidence-figure figcaption > span { flex-basis: 100%; }
  .evidence-figure img { max-height: 65vh; }
  .evidence-figure .evidence-original { min-height: 30px; }
  .evidence-related-button { gap: 10px; padding: 12px; }
  .evidence-related-icon { width: 26px; height: 26px; flex-basis: 26px; }
  .evidence-context-grid { gap: 21px; }
  .evidence-report-record h3 .badge { margin-left: 0; margin-top: 5px; }
}
@media print {
  .evidence-notice, .evidence-filters, .evidence-results-count, .evidence-card-footer, .evidence-original, .evidence-related, .evidence-capture-count { display: none !important; }
  .evidence-gallery { display: block; }
  .evidence-card { border-radius: 0; box-shadow: none; margin-bottom: 12pt; break-inside: avoid; }
  .evidence-card .evidence-preview { display: block !important; }
  .evidence-preview { aspect-ratio: auto; }
  .evidence-preview img { height: auto; width: 100%; max-height: 130mm; object-fit: contain; }
  .evidence-card-body { padding: 10pt; }
  .evidence-card-body > h2 { font-size: 13pt; }
  .evidence-card-body > p { font-size: 9pt; }
  .evidence-text-only { min-height: 0; padding: 10pt; display: block; border: 1px dashed #c5d5dc; background: #fff; }
  .evidence-text-only svg { display: none; }
  .evidence-text-only span, .evidence-text-only small { font-size: 9pt; }
  .evidence-report-record { break-inside: auto; padding-top: 12pt; margin-top: 17pt; }
  .evidence-report-record > h3 { font-size: 12pt; break-after: avoid; }
  .evidence-report-record .evidence-report-meta { font-size: 8pt; }
  .evidence-report-record .evidence-figure { margin: 12pt 0; }
  .evidence-figure { break-inside: avoid; border-radius: 0; background: #fff; max-width: 100%; }
  .evidence-figure img { width: 100%; height: auto; max-height: 145mm; object-fit: contain; background: #fff; }
  .evidence-figure figcaption { padding: 8pt; display: block; font-size: 8pt; line-height: 1.5; background: #fff; }
  .evidence-report-source a { font-size: 8pt; }
  .evidence-report-refs, .evidence-steps li, .evidence-text-record { font-size: 9pt !important; }
  .evidence-text-record { border-radius: 0; }
}

/* Proposed use cases, user stories and their traceable acceptance criteria. */
.product-scope-notice { margin-top: 0; color: #355d70; font-size: 13px; line-height: 1.85; }
.product-scope-notice > strong { display: block; margin-bottom: 3px; color: #234c60; }
.product-export-actions { flex-shrink: 0; }
.product-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 24px 0; border: 1px solid #dce6eb; border-radius: 12px; overflow: hidden; background: #fff; box-shadow: var(--shadow); }
.product-summary-item { display: grid; align-content: start; min-width: 0; padding: 22px 25px; border-right: 1px solid #e4ebef; }
.product-summary-item:last-child { border-right: 0; }
.product-summary-item > strong { color: var(--heading); font-size: 29px; font-weight: 730; letter-spacing: -.04em; line-height: 1.25; font-variant-numeric: tabular-nums; }
.product-summary-item > span { color: #34596c; font-size: 13px; font-weight: 600; margin-top: 6px; }
.product-summary-item > small { color: #6a8190; font-size: 12px; line-height: 1.7; margin-top: 4px; }
.filters.product-filters { display: grid; align-items: end; gap: 13px; margin: 24px 0 19px; }
.product-case-filters { grid-template-columns: minmax(220px, 1.7fr) minmax(150px, 1fr) minmax(160px, 1fr); }
.product-story-filters { grid-template-columns: minmax(220px, 1.7fr) minmax(150px, 1fr) minmax(170px, 1.1fr) minmax(145px, .9fr) minmax(140px, .9fr); }
.filters.product-filters > .field { min-width: 0; width: 100%; }
.product-filters input, .product-filters select { width: 100%; min-width: 0; max-width: 100%; min-height: 42px; font-size: 13px; }
.product-results-count { display: flex; flex-wrap: wrap; align-items: baseline; gap: 5px; color: #5c7485; font-size: 13px; margin: 18px 0 17px; }
.product-results-count > strong { color: #2b5364; font-weight: 650; }
.product-results-count > span { color: #6e8390; font-size: 12px; margin-left: 4px; }
.product-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 21px; margin-bottom: 28px; }
.product-card { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; padding: 25px; background: #fff; border: 1px solid #dfe7ec; border-radius: 13px; box-shadow: var(--shadow); }
.product-card-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 7px 10px; margin-bottom: 15px; }
.product-id { color: #3e7669; font-size: 12px; font-weight: 700; letter-spacing: .03em; }
.product-card-meta .badge, .product-detail-meta .badge { white-space: normal; text-align: left; line-height: 1.5; }
.product-card > h2 { font-size: 19px; line-height: 1.4; letter-spacing: -.025em; overflow-wrap: anywhere; }
.product-card-actor, .product-card-phase { display: flex; align-items: flex-start; gap: 8px; color: #5d7787; font-size: 12px; line-height: 1.75; margin-top: 12px; }
.product-card-actor > svg, .product-card-phase > svg { height: 15px; width: 15px; margin-top: 3px; color: #6d8a98; }
.product-card-actor > span, .product-card-phase > span { min-width: 0; overflow-wrap: anywhere; }
.product-card > .product-card-goal { color: #405e72; font-size: 14px; line-height: 1.85; margin-top: 18px; }
.product-current-state { width: 100%; padding: 15px 16px; margin-top: 20px; border: 1px solid #e1e9ee; border-radius: 8px; background: #f7f9fb; }
.product-current-state .kicker { color: #637b8a; font-size: 11px; letter-spacing: .07em; }
.product-current-state p { font-size: 13px; color: #526c80; line-height: 1.8; margin-top: 6px; }
.product-card-counts { display: flex; flex-wrap: wrap; gap: 6px 13px; color: #6b8391; font-size: 12px; line-height: 1.7; margin: 18px 0; }
.product-card-counts > span + span::before { display: inline-block; content: "·"; margin-right: 10px; color: #879ba7; }
.product-card-footer { display: flex; align-items: center; justify-content: space-between; gap: 14px; width: 100%; padding-top: 15px; margin-top: auto; border-top: 1px solid #e5ecef; }
.product-detail-link { min-height: 32px; font-size: 13px; line-height: 1.6; }
.product-card-footer > svg { width: 16px; height: 16px; color: #438676; }
.product-empty { padding: 38px 24px; }
.product-empty > svg { color: #819ba9; margin-bottom: 12px; }
.product-empty > h2 { font-size: 19px; line-height: 1.45; margin-bottom: 9px; }
.product-empty > p { font-size: 13px; line-height: 1.8; }
.product-story-statement { display: grid; gap: 11px; width: 100%; padding: 20px; margin: 21px 0 0; border: 1px solid #dcebe5; border-radius: 9px; background: #f3f9f6; }
.product-story-statement > div { display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: 10px; align-items: baseline; min-width: 0; }
.product-story-statement dt { color: #25715f; font-size: 12px; font-weight: 650; }
.product-story-statement dd { color: #365c54; font-size: 14px; line-height: 1.8; margin: 0; min-width: 0; overflow-wrap: anywhere; }
.product-card .product-story-statement { padding: 17px 16px; gap: 10px; }
.product-card .product-story-statement dd { font-size: 13px; }
.product-card-phase { margin-top: 18px; }
.detail-dialog:has(.product-detail) { width: 960px; max-width: min(960px, calc(100vw - 40px)); }
.product-detail { min-width: 0; }
.product-detail-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.product-goal { padding: 21px 23px; margin: 23px 0; background: #f0f8f5; border: 1px solid #d7e9df; border-left: 3px solid #3c9a7e; border-radius: 8px; }
.product-goal .kicker { color: #347663; font-size: 11px; letter-spacing: .08em; }
.product-goal > p { font-size: 16px; color: #285749; line-height: 1.8; margin-top: 8px; }
.product-definition { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 21px; padding: 20px 22px; margin: 23px 0; background: #f7f9fb; border: 1px solid #e0e8ed; border-radius: 9px; }
.product-definition > div { min-width: 0; }
.product-definition dt { color: #6a8290; font-size: 12px; margin-bottom: 7px; }
.product-definition dd { color: #36566a; font-size: 14px; line-height: 1.8; margin: 0; overflow-wrap: anywhere; }
.product-definition dd > small { display: block; color: #6b8390; font-size: 12px; line-height: 1.85; margin-top: 6px; }
.product-detail-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 25px; margin: 27px 0; }
.product-detail-section { min-width: 0; margin: 25px 0; }
.product-detail-columns > .product-detail-section { margin: 0; }
.product-detail h3, .product-report-record h3 { font-size: 16px; line-height: 1.5; }
.product-detail-section > h3, .product-references > h3, .product-observation > h3 { margin-bottom: 13px; }
.product-section-note, .product-reference-note { font-size: 12px; color: #6a8190; line-height: 1.85; }
.product-detail-section > .product-section-note { margin: -4px 0 15px; }
.product-empty-note { font-size: 13px; line-height: 1.8; }
.product-list { margin: 0; padding-left: 20px; color: #506d80; font-size: 14px; line-height: 1.85; }
.product-list li { padding-left: 4px; overflow-wrap: anywhere; }
.product-list li + li { margin-top: 9px; }
.product-list li::marker { color: #4b8c78; }
.product-flow { list-style: none; counter-reset: product-step; padding: 0; }
.product-flow li { position: relative; counter-increment: product-step; padding: 14px 18px 14px 59px; border: 1px solid #e0e9ed; border-radius: 8px; background: #fbfcfd; }
.product-flow li + li { margin-top: 9px; }
.product-flow li::before { position: absolute; left: 16px; top: 15px; content: counter(product-step, decimal-leading-zero); display: grid; place-items: center; width: 27px; height: 27px; border-radius: 7px; background: #e7f2ed; color: #327561; font-size: 11px; font-weight: 700; }
.product-alternatives { display: grid; gap: 12px; margin: 0; }
.product-alternatives > div { padding: 17px 19px; border: 1px solid #e0e7ec; border-radius: 8px; background: #f7f9fb; }
.product-alternatives dt { font-size: 13px; font-weight: 650; line-height: 1.8; color: #3b5d72; }
.product-alternatives dd { font-size: 14px; line-height: 1.85; color: #567286; margin: 6px 0 0; overflow-wrap: anywhere; }
.product-observation { padding: 22px; margin: 27px 0; border: 1px solid #e5d6b1; border-radius: 10px; background: #fffbf1; }
.product-observation > h3 { color: #73591f; }
.product-observation p { color: #75613c; font-size: 14px; line-height: 1.85; }
.product-validation-limit { padding-top: 16px; margin-top: 17px; border-top: 1px solid #e9ddbf; }
.product-validation-limit h4 { color: #7a5d24; font-size: 13px; line-height: 1.6; margin-bottom: 6px; }
.product-validation-limit p { font-size: 13px; }
.product-references { padding-top: 24px; margin-top: 28px; border-top: 1px solid #e2e9ed; }
.product-reference-group { margin-top: 16px; }
.product-reference-group > h4 { color: #6a8090; font-size: 12px; font-weight: 600; line-height: 1.7; margin-bottom: 8px; }
.product-reference-list { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 7px; min-width: 0; }
.product-reference { display: inline-block; max-width: 100%; min-height: 34px; padding: 6px 10px; color: #316d60; background: #f0f8f4; border: 1px solid #cfe5d9; border-radius: 6px; font-size: 12px; line-height: 1.7; text-align: left; overflow-wrap: anywhere; }
.product-reference:hover { background: #e4f3eb; border-color: #9ecbb7; color: #215a4b; }
.product-reference-note { margin-top: 18px; }
.product-acceptance { list-style: none; counter-reset: product-criterion; padding: 0; margin: 0; display: grid; gap: 14px; }
.product-acceptance > li { counter-increment: product-criterion; position: relative; padding: 20px 20px 20px 65px; border: 1px solid #dce7ed; border-radius: 10px; background: #f7fafc; }
.product-acceptance > li::before { content: counter(product-criterion, decimal-leading-zero); position: absolute; top: 20px; left: 19px; display: grid; place-items: center; width: 28px; height: 28px; color: #3a6b8a; background: #e5eff6; border-radius: 7px; font-size: 11px; font-weight: 700; }
.product-acceptance > li + li { margin-top: 0; }
.product-acceptance dl { display: grid; gap: 10px; margin: 0; }
.product-acceptance dl > div { display: grid; grid-template-columns: 67px minmax(0, 1fr); align-items: baseline; gap: 12px; }
.product-acceptance dt { font-size: 12px; color: #466e87; font-weight: 650; }
.product-acceptance dd { font-size: 14px; line-height: 1.85; color: #4b697f; margin: 0; min-width: 0; overflow-wrap: anywhere; }
.product-dependencies > .product-section-note { margin: 14px 0 0; }
.product-story-notes { padding: 20px 22px; margin: 25px 0; background: #f7f9fb; border: 1px solid #e0e8ed; border-radius: 9px; }
.product-story-notes > h3 { margin-bottom: 10px; }
.product-story-notes > p { font-size: 14px; line-height: 1.85; color: #587387; overflow-wrap: anywhere; }
.product-related { margin-top: 25px; padding-top: 23px; border-top: 1px solid var(--line); }
.product-related > h3 { margin-bottom: 9px; }
.product-related-group { margin-top: 18px; }
.product-related-group > h4 { color: #6b8190; font-size: 12px; margin-bottom: 10px; }
.product-related-list { display: grid; gap: 9px; }
.product-related-button { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 64px; padding: 13px 15px; background: #f5f9fc; border: 1px solid #dbe7ed; border-radius: 8px; color: #396279; text-align: left; }
.product-related-button:hover { background: #edf5fa; border-color: #a9c9d9; }
.product-related-icon { display: grid; place-content: center; flex: 0 0 30px; width: 30px; height: 30px; border-radius: 7px; background: #e5eff5; color: #5e8399; }
.product-related-icon > svg { width: 16px; height: 16px; }
.product-related-button > span:nth-child(2) { flex: 1; min-width: 0; }
.product-related-button strong { display: block; font-size: 13px; line-height: 1.7; overflow-wrap: anywhere; }
.product-related-button small { display: block; font-size: 12px; line-height: 1.7; color: #708896; margin-top: 3px; }
.product-related-button > svg { flex-shrink: 0; width: 16px; height: 16px; }
.product-report-intro { color: #5c7688; font-size: 14px; line-height: 1.85; margin-bottom: 23px; }
.product-report-record { margin: 29px 0; padding-top: 25px; border-top: 1px solid #dce6ec; }
.product-report-record > h3:first-child { font-size: 19px; line-height: 1.5; margin: 0 0 17px; }
.product-report-record .product-reference-list { display: grid; gap: 6px; }
.product-print-reference { display: block; color: #5d7789; font-size: 12px; line-height: 1.8; overflow-wrap: anywhere; }
.product-report-record .product-references { padding-top: 18px; margin-top: 23px; }

@media (min-width: 681px) {
  .sidebar > * { flex-shrink: 0; }
}
@media (min-width: 1600px) {
  .product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 1450px) {
  .product-story-filters { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .product-story-filters > .field:first-child { grid-column: span 2; }
}
@media (max-width: 1180px) {
  .product-card { padding: 21px; }
  .product-grid { gap: 17px; }
  .product-summary-item { padding: 20px; }
  .product-case-filters { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .product-case-filters > .field:first-child { grid-column: 1 / -1; }
  .product-card .product-story-statement { padding: 16px; }
}
@media (max-width: 900px) {
  .product-grid { grid-template-columns: 1fr; gap: 20px; }
  .product-card { padding: 24px; }
  .product-summary-item { padding: 18px 15px; }
  .product-summary-item > strong { font-size: 26px; }
  .product-summary-item > span { font-size: 12px; line-height: 1.65; }
  .product-story-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .product-story-filters > .field:first-child { grid-column: 1 / -1; }
  .product-detail-columns { gap: 20px; }
}
@media (max-width: 680px) {
  .product-scope-notice { font-size: 13px; }
  .product-export-actions { width: 100%; gap: 9px; }
  .product-export-actions > .button { flex: 1 1 130px; min-height: 38px; }
  .product-summary { grid-template-columns: 1fr; margin: 21px 0; }
  .product-summary-item { grid-template-columns: 48px minmax(0, 1fr); gap: 3px 15px; padding: 18px 20px; border-right: 0; border-bottom: 1px solid #e4ebef; }
  .product-summary-item:last-child { border-bottom: 0; }
  .product-summary-item > strong { grid-row: span 2; align-self: center; font-size: 29px; }
  .product-summary-item > span { margin: 0; font-size: 13px; }
  .product-summary-item > small { margin: 0; font-size: 12px; }
  .filters.product-filters { grid-template-columns: 1fr; gap: 13px; margin-top: 20px; }
  .product-filters > .field:first-child { grid-column: auto; }
  .product-results-count { gap: 4px 5px; font-size: 12px; }
  .product-results-count > span { flex-basis: 100%; margin-left: 0; }
  .product-card { padding: 21px; border-radius: 11px; }
  .product-card > h2 { font-size: 18px; }
  .product-current-state { padding: 14px; }
  .product-card-counts { gap: 5px 10px; }
  .product-card-counts > span + span::before { margin-right: 7px; }
  .product-card .product-story-statement { padding: 16px 14px; }
  .product-story-statement { padding: 18px 16px; }
  .product-story-statement > div { grid-template-columns: 43px minmax(0, 1fr); gap: 9px; }
  .detail-dialog:has(.product-detail) { max-width: calc(100vw - 20px); }
  .product-detail-columns, .product-definition { grid-template-columns: 1fr; gap: 19px; }
  .product-goal { padding: 18px; }
  .product-goal > p { font-size: 15px; }
  .product-definition { padding: 18px; }
  .product-detail-section { margin: 24px 0; }
  .product-flow li { padding: 13px 14px 13px 50px; }
  .product-flow li::before { left: 13px; top: 14px; width: 25px; height: 25px; }
  .product-alternatives > div { padding: 16px; }
  .product-observation { padding: 19px; }
  .product-acceptance > li { padding: 18px 16px; }
  .product-acceptance > li::before { position: static; margin-bottom: 13px; }
  .product-acceptance dl > div { grid-template-columns: 1fr; gap: 2px; }
  .product-acceptance dl { gap: 13px; }
  .product-story-notes { padding: 18px; }
  .product-related-button { gap: 10px; padding: 12px; }
  .product-related-icon { flex-basis: 26px; width: 26px; height: 26px; }
  .product-related-button strong { font-size: 12px; }
  .product-related-button small { font-size: 11px; }
  .product-report-record > h3:first-child { font-size: 18px; }
}
@media print {
  .product-export-actions, .product-filters, .product-summary, .product-results-count, .product-card-footer, .product-related { display: none !important; }
  .product-report, .product-report-record { max-width: 100%; }
  .product-report-record { break-inside: auto; border-color: #cbd7de; padding-top: 13pt; margin: 17pt 0; }
  .product-report-record > h3:first-child { font-size: 14pt; margin-bottom: 10pt; break-after: avoid; }
  .product-detail h3, .product-report-record h3 { font-size: 11pt; margin-bottom: 8pt; break-after: avoid; }
  .product-report-intro, .product-goal > p, .product-definition dd, .product-list, .product-story-statement dd, .product-alternatives dd, .product-observation p, .product-acceptance dd, .product-story-notes > p { font-size: 10pt; line-height: 1.55; }
  .product-detail-meta { gap: 5pt; }
  .product-detail-columns { display: block; margin: 12pt 0; }
  .product-detail-columns > section + section { margin-top: 12pt; }
  .product-definition { gap: 12pt; padding: 11pt; margin: 12pt 0; background: #fff; border-radius: 0; break-inside: avoid; }
  .product-definition dt, .product-definition dd > small, .product-section-note, .product-reference-note, .product-empty-note, .product-print-reference, .product-reference-group > h4 { font-size: 8.5pt; line-height: 1.55; }
  .product-goal, .product-story-statement, .product-observation, .product-story-notes { border-radius: 0; background: #fff; padding: 11pt; margin: 12pt 0; box-shadow: none; }
  .product-goal, .product-story-statement { break-inside: avoid; }
  .product-story-statement dt { font-size: 9pt; }
  .product-detail-section { margin: 13pt 0; }
  .product-flow { list-style: decimal; padding-left: 18pt; }
  .product-flow li { padding: 2pt 0 2pt 3pt; border: 0; background: none; border-radius: 0; break-inside: avoid; }
  .product-flow li::before, .product-acceptance > li::before { display: none; }
  .product-flow li + li, .product-list li + li { margin-top: 5pt; }
  .product-alternatives { gap: 8pt; }
  .product-alternatives > div { border-radius: 0; padding: 9pt; background: #fff; break-inside: avoid; }
  .product-alternatives dt, .product-validation-limit h4 { font-size: 9pt; }
  .product-observation { break-inside: auto; }
  .product-validation-limit { padding-top: 9pt; margin-top: 10pt; }
  .product-validation-limit p { font-size: 9pt; }
  .product-acceptance { gap: 9pt; list-style: decimal; padding-left: 18pt; }
  .product-acceptance > li { padding: 10pt; border-radius: 0; background: #fff; break-inside: avoid; }
  .product-acceptance dl { gap: 6pt; }
  .product-acceptance dl > div { grid-template-columns: 50pt minmax(0, 1fr); gap: 8pt; }
  .product-acceptance dt { font-size: 8.5pt; }
  .product-references { padding-top: 11pt; margin-top: 12pt; }
  .product-reference-group { margin-top: 9pt; break-inside: avoid; }
  .product-reference-group > h4 { margin-bottom: 4pt; }
  .product-reference-list { gap: 4pt; }
  .product-report-record .product-references { padding-top: 10pt; margin-top: 12pt; }
  .product-reference-note { margin-top: 9pt; }
  .product-grid { display: block; }
  .product-card { box-shadow: none; border-radius: 0; padding: 11pt; margin-bottom: 12pt; break-inside: avoid; }
}

/* Economic proposal for the four-phase Base44 to Hostinger migration. */
.phase-node > h3 { font-size: 18px; line-height: 1.45; margin: 14px 0 8px; }
.phase-node > p { font-size: 13px; line-height: 1.8; color: #5b7385; }
.economic-migration-hero { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(275px, .8fr); align-items: center; gap: 38px; padding: 36px; background: linear-gradient(120deg, #102b3c 0%, #123e49 100%); }
.economic-migration-copy { min-width: 0; }
.economic-migration-copy h2 { font-size: clamp(28px, 2.6vw, 38px); line-height: 1.22; margin: 13px 0 16px; letter-spacing: -.035em; }
.economic-migration-copy > p { font-size: 14px; line-height: 1.9; color: #c5d9df; }
.economic-migration-path { display: flex; align-items: center; flex-wrap: wrap; gap: 9px; margin-top: 23px; }
.economic-migration-path > span { padding: 6px 9px; color: #d0eae4; background: #244d56; border: 1px solid #3b626a; border-radius: 6px; font-size: 11px; line-height: 1.7; }
.economic-migration-path > svg { width: 14px; height: 14px; color: #79b5aa; }
.economic-hero-price { min-width: 0; display: flex; flex-direction: column; align-items: flex-start; padding: 26px; color: #d9f1ea; border: 1px solid #49786e; border-radius: 13px; background: #224f50; }
.economic-hero-price > span:first-child { color: #c4e7db; font-size: 13px; font-weight: 550; line-height: 1.65; }
.economic-hero-price > strong { color: #fff; font-size: clamp(32px, 3vw, 44px); font-weight: 740; letter-spacing: -.05em; line-height: 1.25; font-variant-numeric: tabular-nums; margin: 8px 0 3px; overflow-wrap: anywhere; }
.economic-hero-price > small { color: #b4d7d0; font-size: 12px; margin: 0 0 17px; }
.economic-hero-price > .badge { background: #d5f2e5; color: #1e5b49; font-size: 11px; }
.economic-hero-price > p { color: #b5d4cd; font-size: 12px; line-height: 1.8; margin-top: 17px; }
.economic-migration-scope { font-size: 13px; line-height: 1.85; margin-top: 0; }
.economic-migration-scope > strong { display: block; margin-bottom: 3px; }
.economic-toolbar-note { font-size: 12px; line-height: 1.85; color: #6b8190; margin: 0 0 3px auto; }
.economic-migration-phases { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin: 5px 0 22px; }
.economic-migration-phase { min-width: 0; display: flex; flex-direction: column; padding: 21px 19px; border: 1px solid #dae7e3; border-radius: 10px; background: #f7fbf9; }
.economic-phase-kicker { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-bottom: 17px; }
.economic-phase-kicker > span { display: grid; place-items: center; min-width: 32px; height: 29px; padding: 0 6px; font-size: 12px; font-weight: 700; color: #296f5c; background: #e2f0e9; border: 1px solid #c7e1d4; border-radius: 6px; }
.economic-phase-kicker > small { font-size: 10px; color: #698c7e; letter-spacing: .07em; font-weight: 600; }
.economic-migration-phase h3 { font-size: 17px; line-height: 1.45; color: #214a3d; letter-spacing: -.015em; margin-bottom: 12px; }
.economic-migration-phase > p { font-size: 12px; line-height: 1.85; color: #5f7b70; margin: 0 0 22px; }
.economic-phase-amount { display: block; font-size: clamp(23px, 1.75vw, 29px); line-height: 1.3; letter-spacing: -.04em; color: #245f4c; font-variant-numeric: tabular-nums; margin-top: auto; overflow-wrap: anywhere; }
.economic-phase-unit { font-size: 11px; color: #6c897c; margin-top: 5px; line-height: 1.6; }
.economic-phase-foot { font-size: 12px; line-height: 1.85; }
.economic-scope-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 30px; margin: 5px 0 24px; }
.economic-scope-columns > section { min-width: 0; }
.economic-scope-columns h3 { font-size: 18px; line-height: 1.5; margin: 9px 0 14px; }
.economic-scope-columns .mini-list { margin-bottom: 0; }
.economic-scope-columns .mini-list li { font-size: 13px; line-height: 1.8; color: #567184; }
.economic-scope-columns > section:nth-child(2) { border-left: 1px solid #e0e8ed; padding-left: 29px; }
.economic-scope-bounds { margin: 24px 0; padding: 21px 23px; background: #f7f9fb; border: 1px solid #dfe8ed; border-radius: 9px; }
.economic-scope-bounds h3 { font-size: 16px; margin-bottom: 15px; }
.economic-scope-bounds li { font-size: 13px; line-height: 1.8; }
.economic-source p > small { display: block; margin-top: 4px; color: #708592; font-size: 12px; line-height: 1.8; }
.economic-payment .economic-payment-trigger { padding-top: 12px; margin-top: 12px; border-top: 1px solid #e2e9ed; font-size: 12px; color: #496c7b; }
.economic-migration-providers { grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 24px 0; }
.economic-migration-providers .economic-provider { padding: 26px; }
.economic-migration-providers .economic-price { margin: 14px 0 0; font-size: 34px; }
.economic-migration-providers .economic-price > small { display: block; margin: 6px 0 0; font-size: 12px; }
.economic-provider-facts { display: grid; gap: 12px; margin: 23px 0 21px; padding-top: 18px; border-top: 1px solid #dde8e4; }
.economic-provider-facts > div { display: flex; justify-content: space-between; align-items: baseline; gap: 15px; }
.economic-provider-facts dt { color: #627d7a; font-size: 12px; line-height: 1.8; }
.economic-provider-facts dd { color: #365c52; font-size: 13px; font-weight: 650; margin: 0; text-align: right; flex-shrink: 0; line-height: 1.8; }
.economic-migration-providers .source-link { margin-top: auto; padding-top: 18px; font-size: 12px; }
.economic-tax-note { display: flex; gap: 10px; align-items: flex-start; padding: 16px; margin-top: 20px; background: #f7f9fb; border: 1px solid #e1e8ed; border-radius: 8px; }
.economic-tax-note > svg { width: 17px; height: 17px; color: #698595; margin-top: 3px; }
.economic-tax-note > p { font-size: 12px; line-height: 1.85; color: #627a8b; }
.economic-tax-note strong { display: block; color: #3c6275; }
.economic-pilot-note { display: flex; align-items: flex-start; gap: 17px; padding-bottom: 22px; border-bottom: 1px solid #e0e8ed; }
.economic-pilot-mark { display: grid; place-items: center; flex: 0 0 53px; height: 53px; border: 1px solid #cbe5d8; border-radius: 11px; background: #e7f5ee; color: #2f8066; font-size: 16px; font-weight: 700; }
.economic-pilot-note > div { min-width: 0; }
.economic-pilot-note h3, .economic-support-note h3 { font-size: 16px; line-height: 1.5; margin: 0 0 10px; }
.economic-pilot-note p, .economic-support-note p { font-size: 13px; line-height: 1.85; color: #5e798b; }
.economic-support-note { display: flex; flex-direction: column; align-items: flex-start; gap: 13px; margin: 23px 0; }
.economic-fixed-phase { display: grid; grid-template-columns: minmax(0, 1fr) minmax(130px, 180px); align-items: center; gap: 20px; padding: 19px 0; border-bottom: 1px solid #e1e9ed; }
.economic-fixed-phase:first-of-type { padding-top: 3px; }
.economic-fixed-phase > div { min-width: 0; }
.economic-fixed-phase strong { color: #31576b; font-size: 14px; line-height: 1.7; }
.economic-fixed-phase small { display: block; margin-top: 6px; color: #728895; font-size: 12px; line-height: 1.8; }
.economic-fixed-phase .field label { font-size: 12px; }
.economic-fixed-phase input { font-size: 14px; min-height: 43px; text-align: right; font-variant-numeric: tabular-nums; }
.economic-fixed-phase + p { margin-top: 17px; }
.economic-support-toggle { display: flex; align-items: flex-start; gap: 9px; color: #42677a; font-size: 13px; line-height: 1.75; }
.economic-support-toggle input { margin-top: 4px; flex-shrink: 0; }
.economic-migration-report > h3 { margin-top: 28px; margin-bottom: 17px; }
.economic-migration-report > p { line-height: 1.85; }
.economic-migration-report .economic-columns { margin-top: 23px; }
.economic-migration-report .economic-tax-note > svg { display: none; }

@media (max-width: 1400px) {
  .economic-migration-hero { gap: 25px; padding: 29px; grid-template-columns: minmax(0, 1.2fr) minmax(265px, .9fr); }
  .economic-hero-price { padding: 23px; }
  .economic-migration-phases { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; }
  .economic-migration-phase { padding: 23px; }
  .economic-phase-amount { font-size: 28px; }
}
@media (max-width: 1050px) {
  .economic-migration-hero { grid-template-columns: 1fr; gap: 23px; }
  .economic-hero-price { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 0 16px; }
  .economic-hero-price > span:first-child { grid-column: 1; }
  .economic-hero-price > strong { grid-column: 1; }
  .economic-hero-price > small { grid-column: 1; margin-bottom: 0; }
  .economic-hero-price > .badge { grid-column: 2; grid-row: 1 / 3; }
  .economic-hero-price > p { grid-column: 1 / -1; margin-top: 15px; }
  .economic-toolbar-note { margin-left: 0; }
  .economic-migration-providers { grid-template-columns: 1fr; }
  .economic-scope-columns { grid-template-columns: 1fr; gap: 22px; }
  .economic-scope-columns > section:nth-child(2) { padding: 22px 0 0; border-left: 0; border-top: 1px solid #e0e8ed; }
}
@media (max-width: 680px) {
  .economic-migration-hero { padding: 24px; gap: 23px; }
  .economic-migration-copy h2 { font-size: 29px; }
  .economic-migration-copy > p { font-size: 13px; }
  .economic-migration-path { gap: 6px; margin-top: 19px; }
  .economic-migration-path > span { font-size: 10px; padding: 5px 7px; }
  .economic-migration-path > svg { width: 12px; height: 12px; }
  .economic-hero-price { display: flex; padding: 22px; gap: 0; }
  .economic-hero-price > strong { font-size: 36px; }
  .economic-hero-price > small { margin-bottom: 16px; }
  .economic-hero-price > p { font-size: 12px; }
  .economic-migration-phases { grid-template-columns: 1fr; gap: 13px; }
  .economic-migration-phase { padding: 22px; }
  .economic-migration-phase h3 { font-size: 18px; }
  .economic-migration-phase > p { font-size: 13px; }
  .economic-phase-amount { font-size: 30px; }
  .economic-migration-providers .economic-provider { padding: 22px; }
  .economic-migration-providers .economic-price { font-size: 31px; }
  .economic-provider-facts > div { gap: 10px; }
  .economic-provider-facts dt { font-size: 12px; }
  .economic-provider-facts dd { font-size: 12px; }
  .economic-pilot-note { gap: 13px; }
  .economic-pilot-mark { flex-basis: 45px; height: 45px; border-radius: 9px; font-size: 14px; }
  .economic-fixed-phase { grid-template-columns: 1fr; gap: 13px; padding: 20px 0; }
  .economic-fixed-phase > .field { max-width: 100%; }
  .economic-fixed-phase input { text-align: left; }
  .economic-tax-note { padding: 14px; }
  .economic-toolbar-note { flex-basis: 100%; }
}
@media print {
  .phase-node > h3 { font-size: 10pt; }
  .phase-node > p { font-size: 8pt; }
  .economic-migration-hero { display: block; background: #fff; padding: 12pt; }
  .economic-migration-copy h2 { color: #163e46; font-size: 20pt; }
  .economic-migration-copy > p { color: #486a70; font-size: 10pt; }
  .economic-migration-path { display: none; }
  .economic-hero-price { display: block; border: 1px solid #c7dcd1; border-radius: 0; background: #fff; padding: 11pt; margin-top: 13pt; }
  .economic-hero-price > strong { display: block; color: #1e5d4d; font-size: 27pt; margin: 5pt 0; }
  .economic-hero-price > span:first-child, .economic-hero-price > small, .economic-hero-price > p { color: #496b60; font-size: 9pt; }
  .economic-migration-phases { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10pt; }
  .economic-migration-phase { padding: 11pt; border-radius: 0; background: #fff; break-inside: avoid; }
  .economic-migration-phase h3 { font-size: 12pt; }
  .economic-migration-phase > p { font-size: 9pt; line-height: 1.6; }
  .economic-phase-amount { font-size: 21pt; }
  .economic-scope-columns, .economic-migration-providers { display: block; }
  .economic-scope-columns > section { margin: 11pt 0; }
  .economic-scope-columns > section:nth-child(2) { border-left: 0; padding: 10pt 0 0; border-top: 1px solid #d5e0e5; }
  .economic-scope-columns h3 { font-size: 12pt; }
  .economic-scope-columns .mini-list li { font-size: 9pt; }
  .economic-provider-facts { gap: 7pt; margin: 12pt 0; padding-top: 10pt; }
  .economic-provider-facts dt, .economic-provider-facts dd { font-size: 9pt; }
  .economic-migration-providers .economic-provider { padding: 11pt; }
  .economic-migration-providers .economic-price { font-size: 22pt; }
  .economic-migration-providers .economic-price > small { font-size: 8pt; }
  .economic-migration-providers .source-link { font-size: 8pt; }
  .economic-tax-note { border-radius: 0; padding: 9pt; margin-top: 11pt; background: #fff; break-inside: avoid; }
  .economic-tax-note > svg { display: none; }
  .economic-tax-note > p { font-size: 9pt; }
  .economic-pilot-note { break-inside: avoid; gap: 10pt; padding-bottom: 12pt; }
  .economic-pilot-mark { flex-basis: 36pt; height: 36pt; font-size: 12pt; }
  .economic-pilot-note h3, .economic-support-note h3 { font-size: 11pt; }
  .economic-pilot-note p, .economic-support-note p { font-size: 9pt; line-height: 1.6; }
  .economic-support-note { margin: 12pt 0; }
  .economic-migration-report > h3 { margin-top: 16pt; margin-bottom: 10pt; }
}