:root { color-scheme: light; --ink: #102033; --muted: #6b7b8f; --line: #dce5ed; --surface: #ffffff; --wash: #f5f8fb; --accent: #0d6efd; --accent-soft: #eaf2ff; }
* { box-sizing: border-box; }
body { min-height: 100vh; margin: 0; display: flex; flex-direction: column; background: var(--wash); color: var(--ink); font-family: Inter, ui-sans-serif, system-ui, -apple-system, sans-serif; line-height: 1.5; }
a { color: inherit; }
.container-xl { width: min(1200px, calc(100% - 2rem)); margin-inline: auto; }
.border-bottom { border-bottom: 1px solid var(--line); }
.sticky-top { position: sticky; top: 0; z-index: 10; }
.py-2 { padding-block: .75rem; }
.py-5 { padding-block: 3.5rem; }
main { flex: 1; }
.pb-4 { padding-bottom: 1.5rem; }
.d-flex { display: flex; }
.flex-wrap { flex-wrap: wrap; }
.align-items-center { align-items: center; }
.align-items-end { align-items: flex-end; }
.justify-content-between { justify-content: space-between; }
.ms-auto { margin-left: auto; }
.gap-2 { gap: .5rem; }
.gap-3 { gap: 1rem; }
.gap-4 { gap: 1.5rem; }
.mb-0 { margin-bottom: 0; }
.mb-2 { margin-bottom: .5rem; }
.mb-3 { margin-bottom: 1rem; }
.mb-4 { margin-bottom: 1.5rem; }
.mt-3 { margin-top: 1rem; }
.mt-4 { margin-top: 1.5rem; }
.h-100 { height: 100%; }
.w-100 { width: 100%; }
.small { font-size: .82rem; }
.lead { color: var(--muted); font-size: 1.1rem; }
.text-secondary, footer { color: var(--muted); }
.text-success { color: #238b60; }
.text-end { text-align: right; }
.text-uppercase { text-transform: uppercase; }
.fs-5 { font-size: 1.12rem; }
.fw-bold { font-weight: 750; }
.fw-semibold { font-weight: 650; }
.display-5 { font-size: clamp(2.5rem, 6vw, 4.2rem); line-height: 1.05; }
.display-6 { font-size: clamp(2rem, 4vw, 3rem); line-height: 1.08; }
.h6 { font-size: .82rem; }
.row { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); }
.col-xl-3, .col-xl-4, .col-xl-5, .col-xl-7, .col-xl-8 { grid-column: span 12; }
.analysis-form { gap: 1rem; }
.analysis-form__action { display: flex; }
.analysis-form__action .btn { min-height: 3.45rem; }
.form-label { display: block; margin-bottom: .4rem; }
.form-select, .form-control { width: 100%; border: 1px solid #cbd8e4; border-radius: 10px; background: var(--surface); color: var(--ink); font: inherit; padding: .7rem .85rem; }
.form-select:focus, .form-control:focus { outline: 3px solid rgba(13,110,253,.18); border-color: var(--accent); }
.form-control-lg, .form-select-lg { padding: .9rem 1rem; font-size: 1.05rem; }
.btn { border: 0; border-radius: 10px; cursor: pointer; font: inherit; font-weight: 700; padding: .7rem 1rem; }
.btn-primary { background: var(--accent); color: white; }
.btn-primary:hover { background: #095ecb; }
.btn:focus-visible, .nav-link:focus-visible, .form-control:focus-visible, .form-select:focus-visible { outline: 3px solid rgba(13,110,253,.3); outline-offset: 2px; }
.alert { border-radius: 12px; padding: .9rem 1rem; }
.alert-warning { background: #fff7df; border: 1px solid #f0d98b; color: #725915; }
.navbar { box-shadow: 0 1px 0 rgba(16,32,51,.04); }
.navbar-brand { color: var(--ink); font-weight: 750; letter-spacing: -.02em; text-decoration: none; }
.navbar-nav { display: flex; align-items: center; }
.brand-mark { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: var(--ink); color: white; font-size: .76rem; letter-spacing: .04em; }
.nav-link { color: var(--muted); font-weight: 650; border-radius: 8px; padding: .55rem .8rem; text-decoration: none; }
.nav-link:hover, .nav-link.active { color: var(--ink); background: #edf3f8; }
.eyebrow { color: var(--accent); font-size: .7rem; font-weight: 800; letter-spacing: .16em; margin-bottom: .5rem; }
h1, h2, h3 { letter-spacing: -.04em; }
h1 { margin-top: 0; }
h2 { font-size: 1.15rem; margin: 0; }
.scenario-picker { min-width: 280px; }
.metric-card, .panel { background: var(--surface); border: 1px solid var(--line); border-radius: 16px; box-shadow: 0 8px 28px rgba(16,32,51,.04); }
.metric-card { padding: 1.2rem 1.3rem; }
.metric-grid { display: grid; grid-template-columns: 1fr; gap: 1rem; }
.metric-label, .panel-heading small { color: var(--muted); font-size: .68rem; font-weight: 800; letter-spacing: .1em; }
.metric-value { font-size: 2rem; font-weight: 750; margin-top: .45rem; letter-spacing: -.05em; }
.metric-suffix { color: var(--muted); font-size: .9rem; font-weight: 600; margin-left: .3rem; }
.panel { padding: 1.35rem; }
.panel-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin-bottom: 1.3rem; }
.status-dot { color: #238b60; font-size: .65rem; font-weight: 800; letter-spacing: .08em; }
.status-dot::before { content: ''; display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: #2ca66f; margin: 0 .35rem .05rem 0; }
.chart-wrap { height: 265px; min-height: 0; }
.throughput-chart { display: block; width: 100%; height: 100%; overflow: visible; }
.chart-gridline { stroke: #edf1f5; stroke-width: 1; }
.chart-line { fill: none; stroke: var(--accent); stroke-linecap: round; stroke-linejoin: round; stroke-width: 3; }
.chart-point { fill: var(--surface); stroke: var(--accent); stroke-width: 3; }
.chart-label { fill: var(--muted); font-size: 11px; }
.analysis-evidence { table-layout: fixed; }
.analysis-evidence th:nth-child(1), .analysis-evidence td:nth-child(1) { width: 22%; }
.analysis-evidence th:nth-child(2), .analysis-evidence td:nth-child(2) { width: 16%; }
.analysis-evidence th:nth-child(3), .analysis-evidence td:nth-child(3) { width: 62%; }
.analysis-evidence td { overflow-wrap: anywhere; }
.fact-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .4rem .9rem; margin: 0; }
.fact-item { min-width: 0; }
.fact-item dt { color: var(--muted); font-size: .68rem; font-weight: 750; letter-spacing: .04em; }
.fact-item dd { margin: .05rem 0 0; overflow-wrap: anywhere; }
.equipment-row, .list-row { display: flex; align-items: center; justify-content: space-between; border-top: 1px solid var(--line); padding: .85rem 0; }
.equipment-row span, .list-row > span:last-child { color: var(--muted); font-variant-numeric: tabular-nums; }
.equipment-row small, .list-row small, td small, .list-group-item small { display: block; color: var(--muted); margin-top: .15rem; }
.availability { color: #238b60 !important; font-weight: 750; }
.badge-soft, .event-kind { display: inline-block; border-radius: 999px; background: #edf3f8; color: #49647c; font-size: .72rem; font-weight: 700; padding: .3rem .55rem; }
.event-kind { margin-right: .65rem; text-transform: uppercase; letter-spacing: .06em; font-size: .62rem; }
.empty-state { color: var(--muted); padding: 1.5rem .25rem; text-align: center; }
code { color: #49647c; }
.table-responsive { overflow-x: auto; }
.table { width: 100%; border-collapse: collapse; }
.table th, .table td { border-bottom: 1px solid var(--line); padding: .75rem .5rem; text-align: left; vertical-align: middle; }
.table th { color: var(--muted); font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; }
.table tbody tr:hover { background: #f8fbfd; }
.list-group-item { border-bottom: 1px solid var(--line); padding-block: .9rem; }
.list-group-item:last-child { border-bottom: 0; }
@media (min-width: 576px) { .col-sm-6 { grid-column: span 6; } }
@media (min-width: 576px) { .metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 992px) { .col-lg-2 { grid-column: span 2; } .col-lg-10 { grid-column: span 10; } }
@media (min-width: 992px) { .metric-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1200px) { .col-xl-3 { grid-column: span 3; } .col-xl-4 { grid-column: span 4; } .col-xl-5 { grid-column: span 5; } .col-xl-7 { grid-column: span 7; } .col-xl-8 { grid-column: span 8; } }
@media (min-width: 1200px) { .metric-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
@media (max-width: 767.98px) { .fact-list { grid-template-columns: 1fr; } .analysis-evidence { min-width: 680px; } }
@media (max-width: 575.98px) { .container-xl { width: min(100% - 1.25rem, 1200px); } .navbar .container-xl { align-items: flex-start; flex-direction: column; } .navbar-nav { flex-wrap: wrap; margin-left: 0; } .scenario-picker { width: 100%; } .display-5 { font-size: 2.4rem; } }