/* AI Insights pages (added 2026-10-28). Content styles only - the rail and top bar come
   from cp_shell.css exactly as on every other report page. Tokens are the Cockpit's
   (cockpit.html / cockpit.js COLORS), the badges are Financial Ratios', and the AI
   components follow Month-End Close's mec-ai-* look (#1537c7 on #f7f9ff). */

:root {
    --page-ink: #16213e;
    --page-ink-soft: #44526c;
    --page-slate: #667085;
    --page-accent: #0f6cbd;
    --ins-line: rgba(22, 33, 62, 0.10);
    --ins-accent-deep: #0b4f8a;
    --ins-navy: #173f7a;
    --ins-aqua: #1c8fa8;
    --ins-amber: #d17b0f;
    --ins-coral: #d95d39;
    --ins-mint: #2f8f6b;
    --ins-plum: #7a4b8e;
    --ins-good: #1e8a3d;
    --ins-bad: #c62828;
    --ins-warn: #a86a00;
    --ins-ai: #1537c7;
    --ins-ai-soft: #f7f9ff;
    --ins-ai-line: #dbe4fb;
}

.ins-body {
    background:
        radial-gradient(circle at top left, rgba(15, 108, 189, 0.12), transparent 30%),
        linear-gradient(180deg, #eef5fb 0%, #f6f8fb 55%, #eef2f8 100%);
    color: var(--page-ink);
}

.ins-body .axys-navbar,
.ins-body .axys-footer {
    display: none;
}

/* The UA [hidden] rule loses to any author display rule (e.g. .ai-insight's grid). */
.ins-body [hidden] {
    display: none !important;
}

.ins-stack {
    display: grid;
    gap: 18px;
    align-content: start;
    min-width: 0;
}

.ins-main {
    max-width: none;
    margin: 0;
    padding: 0;
}

.ins-page-footer {
    grid-column: 2;
    text-align: center;
    padding: 16px 24px;
    color: var(--page-slate);
    font-size: 12px;
    font-weight: 600;
    border-top: 1px solid rgba(22, 33, 62, 0.08);
    background: rgba(255, 255, 255, 0.72);
    backdrop-filter: blur(10px);
}

/* ---------- Top bar additions ---------- */
.ins-topbar__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-left: 14px;
    padding: 4px 10px;
    border-radius: 999px;
    background: rgba(21, 55, 199, 0.08);
    color: var(--ins-ai);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    white-space: nowrap;
}

.ins-topbar__spacer {
    flex: 1;
}

.ins-topbar__actions {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

/* ---------- KPI strip (Cockpit's separated tiles) ---------- */
.ins-kpis {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    gap: 14px;
    margin-bottom: 18px;
}

.ins-kpi {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(240, 247, 255, 0.92)), #ffffff;
    border: 1px solid rgba(15, 108, 189, 0.22);
    border-radius: 4px;
    box-shadow: 0 10px 22px rgba(14, 31, 64, 0.07);
    padding: 14px 16px;
    position: relative;
    min-width: 0;
}

.ins-kpi::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background: linear-gradient(180deg, var(--page-accent), var(--ins-aqua));
}

.ins-kpi--alert::before { background: linear-gradient(180deg, var(--ins-bad), var(--ins-coral)); }
.ins-kpi--warn::before { background: linear-gradient(180deg, var(--ins-amber), #f0a84a); }
.ins-kpi--good::before { background: linear-gradient(180deg, var(--ins-good), var(--ins-mint)); }

.ins-kpi__label {
    color: var(--page-slate);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 6px;
}

.ins-kpi__value {
    font-size: 23px;
    font-weight: 900;
    color: var(--page-ink);
    line-height: 1.15;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ins-kpi__sub {
    margin-top: 5px;
    font-size: 12.5px;
    font-weight: 700;
    color: var(--page-ink-soft);
}

.ins-pos { color: var(--ins-good); }
.ins-neg { color: var(--ins-bad); }
.ins-muted { color: var(--page-slate); }

.ins-chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 800;
    white-space: nowrap;
}

.ins-chip--good { background: #e6f6ea; color: var(--ins-good); }
.ins-chip--warn { background: #fff6e0; color: var(--ins-warn); }
.ins-chip--bad { background: #fdecea; color: var(--ins-bad); }
.ins-chip--info { background: rgba(15, 108, 189, 0.10); color: var(--ins-accent-deep); }
.ins-chip--ai { background: rgba(21, 55, 199, 0.10); color: var(--ins-ai); }

/* ---------- Grid + panels (Cockpit cp-panel look) ---------- */
.ins-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    margin-bottom: 18px;
}

.ins-grid--ai { grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); }
.ins-grid--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ins-grid--full { grid-template-columns: minmax(0, 1fr); }

.ins-panel {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.97), rgba(246, 249, 253, 0.95)), #ffffff;
    border: 1px solid rgba(22, 33, 62, 0.08);
    box-shadow: 0 20px 40px rgba(14, 31, 64, 0.08);
    padding: 18px 20px 18px 24px;
    position: relative;
    min-width: 0;
}

.ins-panel__bar {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 6px;
    background: linear-gradient(180deg, var(--page-accent), var(--ins-aqua));
}

.ins-panel__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}

.ins-panel__title {
    font-size: 16px;
    font-weight: 900;
    color: var(--page-ink);
    letter-spacing: 0.01em;
    text-transform: uppercase;
    margin: 0;
}

.ins-panel__subtitle {
    font-size: 12px;
    color: var(--page-slate);
    margin-top: 3px;
}

.ins-panel__tools {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.ins-note {
    font-size: 11.5px;
    color: var(--page-slate);
    margin-top: 8px;
    line-height: 1.45;
}

/* Fixed-height chart box: the canvas fills it absolutely, never the reverse (the
   Chart.js grow-forever loop documented on cockpit.html's .cp-kpi-tile__spark-wrap). */
.ins-chart {
    position: relative;
    width: 100%;
    height: 280px;
    background: linear-gradient(180deg, rgba(248, 251, 255, 0.95), rgba(255, 255, 255, 0.9));
    border: 1px solid rgba(22, 33, 62, 0.06);
}

.ins-chart--sm { height: 220px; }
.ins-chart--lg { height: 360px; }
.ins-chart--xl { height: 420px; }

.ins-chart canvas {
    position: absolute;
    inset: 8px 10px 6px;
    width: calc(100% - 20px) !important;
    height: calc(100% - 14px) !important;
}

.ins-donut-wrap {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 12px;
    align-items: center;
}

.ins-legend {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 6px;
    font-size: 12.5px;
}

.ins-legend li {
    display: grid;
    grid-template-columns: 12px minmax(0, 1fr) auto;
    gap: 8px;
    align-items: center;
}

.ins-legend__swatch {
    width: 12px;
    height: 12px;
    border-radius: 3px;
}

.ins-legend__value {
    font-weight: 800;
    font-variant-numeric: tabular-nums;
}

/* ---------- Buttons and inputs ---------- */
.ins-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: 1px solid var(--page-accent);
    background: var(--page-accent);
    color: #ffffff;
    font: inherit;
    font-size: 13px;
    font-weight: 800;
    padding: 7px 13px;
    border-radius: 6px;
    cursor: pointer;
    white-space: nowrap;
    transition: background 0.15s ease, border-color 0.15s ease;
}

.ins-btn:hover { background: var(--ins-accent-deep); border-color: var(--ins-accent-deep); }
.ins-btn:disabled, .ins-btn.is-disabled { opacity: 0.5; cursor: not-allowed; }
.ins-btn--ghost { background: #ffffff; color: var(--page-accent); }
.ins-btn--ghost:hover { background: rgba(15, 108, 189, 0.08); color: var(--ins-accent-deep); }
.ins-btn--ai { background: var(--ins-ai); border-color: var(--ins-ai); }
.ins-btn--ai:hover { background: #102ea0; border-color: #102ea0; }
.ins-btn--ai-ghost { background: #ffffff; color: var(--ins-ai); border-color: var(--ins-ai); }
.ins-btn--ai-ghost:hover { background: #eef2fd; }
.ins-btn--sm { font-size: 12px; padding: 5px 10px; }
.ins-btn--done { background: #e6f6ea; border-color: #b9e2c4; color: var(--ins-good); cursor: default; }
.ins-btn svg { width: 14px; height: 14px; }

.ins-link-btn {
    border: none;
    background: none;
    color: var(--page-accent);
    font: inherit;
    font-size: 12px;
    font-weight: 800;
    cursor: pointer;
    padding: 0;
}

.ins-link-btn:hover { text-decoration: underline; }

.ins-input,
.ins-select {
    border: 1px solid rgba(22, 33, 62, 0.16);
    background: #ffffff;
    color: var(--page-ink);
    font: inherit;
    font-size: 13px;
    padding: 6px 10px;
    border-radius: 6px;
    min-width: 0;
}

.ins-input:focus,
.ins-select:focus,
.ins-btn:focus-visible,
.ins-link-btn:focus-visible {
    outline: 2px solid rgba(15, 108, 189, 0.45);
    outline-offset: 1px;
}

.ins-subhead {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 16px 0 8px;
}

.ins-subhead .ai-section-title { margin: 0; }

.ins-filters input[type="search"] { min-width: 240px; }

.ins-filters {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 10px;
}

/* ---------- Tables ---------- */
.ins-table-wrap {
    max-height: 520px;
    overflow: auto;
    border: 1px solid var(--ins-line);
    background: #ffffff;
}

.ins-table-wrap--short { max-height: 320px; }
.ins-table-wrap--full { max-height: none; }

.ins-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 12.5px;
}

.ins-table thead th {
    position: sticky;
    top: 0;
    z-index: 1;
    background: #f4f7fc;
    color: #4a5670;
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    text-align: left;
    padding: 8px 9px;
    border-bottom: 1px solid var(--ins-line);
    white-space: nowrap;
}

.ins-table thead th[data-sort] { cursor: pointer; user-select: none; }
.ins-table thead th[data-sort]:hover { color: var(--page-accent); }
.ins-table thead th.is-sorted-asc::after { content: " \25B2"; font-size: 9px; }
.ins-table thead th.is-sorted-desc::after { content: " \25BC"; font-size: 9px; }

.ins-table td {
    padding: 7px 9px;
    border-bottom: 1px solid rgba(22, 33, 62, 0.06);
    vertical-align: middle;
}

.ins-table tbody tr:hover > td { background: rgba(15, 108, 189, 0.04); }
.ins-table .num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ins-table .ctr { text-align: center; }
.ins-table tr.is-clickable { cursor: pointer; }
.ins-table tr.is-open > td { background: rgba(15, 108, 189, 0.06); }
.ins-table tr.ins-detail-row > td { background: #fbfcff; padding: 12px 14px 16px; }
.ins-table tfoot td { font-weight: 900; background: #f4f7fc; border-top: 1px solid var(--ins-line); }
.ins-table .ins-strong { font-weight: 800; color: var(--page-ink); }
.ins-table .ins-sub { display: block; color: var(--page-slate); font-size: 11px; }

/* Statement tables (13-week cash flow): sticky line column, section/total rows,
   clickable amounts. */
.ins-table--sticky th:first-child,
.ins-table--sticky td:first-child {
    position: sticky;
    left: 0;
    z-index: 1;
    background: #ffffff;
    min-width: 200px;
    box-shadow: 1px 0 0 var(--ins-line);
}

.ins-table--sticky thead th:first-child { z-index: 3; background: #f4f7fc; }
.ins-cash-table td.num, .ins-cash-table th.num { white-space: nowrap; min-width: 68px; }
.ins-table tr.ins-row-section > td { background: #eef3fa; font-size: 11px; font-weight: 900; letter-spacing: 0.05em; text-transform: uppercase; color: var(--page-slate); }
.ins-table tr.ins-row-total > td { font-weight: 800; background: #f8fafd; border-top: 1px solid var(--ins-line); }
.ins-table tr.ins-row-key > td { font-weight: 900; background: #f4f7fc; color: var(--page-ink); }
.ins-table tr.ins-row-muted > td { color: var(--page-slate); font-size: 12px; }
.ins-table td.ins-cell-drill { cursor: pointer; }
.ins-table td.ins-cell-drill:hover,
.ins-table td.ins-cell-drill:focus-visible { background: rgba(21, 55, 199, 0.08); color: var(--ins-ai); outline: none; text-decoration: underline; }

/* What-if banner shown while the page is not on the base case. */
.ins-scenario-banner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    background: #fff6e0;
    border: 1px solid #f1d38a;
    color: #6b4a00;
    padding: 10px 14px;
    margin-bottom: 18px;
    font-size: 13px;
}

/* Mitigation toggles on the cash page. */
.ins-mitigation {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 10px;
    align-items: start;
    padding: 10px 12px;
    border: 1px solid var(--ins-line);
    background: #ffffff;
    margin-bottom: 8px;
    cursor: pointer;
}

.ins-mitigation:hover { border-color: rgba(21, 55, 199, 0.35); }
.ins-mitigation input { margin-top: 3px; width: 16px; height: 16px; accent-color: var(--ins-ai); }
.ins-mitigation__title { display: block; font-weight: 800; font-size: 13px; color: var(--page-ink); }
.ins-mitigation__detail { display: block; font-size: 12px; color: var(--page-slate); margin-top: 2px; line-height: 1.45; }
.ins-mitigation__chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }

.ins-bar-cell {
    position: relative;
    min-width: 90px;
}

.ins-bar-cell__bar {
    position: absolute;
    left: 0;
    top: 50%;
    height: 14px;
    transform: translateY(-50%);
    background: rgba(15, 108, 189, 0.16);
    border-radius: 2px;
}

.ins-bar-cell__text { position: relative; }

/* ---------- Badges (Financial Ratios fr-badge + Month-End priority pills) ---------- */
.ins-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 3px 9px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 800;
    white-space: nowrap;
}

.ins-badge--critical { background: #c62828; color: #ffffff; }
.ins-badge--high { background: #fdecea; color: var(--ins-bad); }
.ins-badge--medium { background: #fff6e0; color: var(--ins-warn); }
.ins-badge--low { background: #e6f6ea; color: var(--ins-good); }
.ins-badge--positive { background: #e6f6ea; color: var(--ins-good); }
.ins-badge--neutral { background: #f0f0f0; color: #7a7a7a; }
.ins-badge--info { background: rgba(15, 108, 189, 0.10); color: var(--ins-accent-deep); }

/* ---------- AI panel ---------- */
.ai-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: var(--ins-ai);
    color: #ffffff;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.04em;
    border-radius: 4px;
    padding: 3px 7px;
    text-transform: uppercase;
}

.ai-badge svg { width: 11px; height: 11px; }

.ai-panel {
    background: linear-gradient(180deg, #ffffff 0%, var(--ins-ai-soft) 100%);
    border: 1px solid var(--ins-ai-line);
    box-shadow: 0 20px 40px rgba(14, 31, 64, 0.08);
    padding: 18px 20px 14px 24px;
    position: relative;
    min-width: 0;
}

.ai-panel::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 6px;
    background: linear-gradient(180deg, var(--ins-ai), #6f9bf0);
}

.ai-panel__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 10px;
}

.ai-panel__title {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    font-size: 16px;
    font-weight: 900;
    color: var(--ins-ai);
    text-transform: uppercase;
    letter-spacing: 0.01em;
}

.ai-panel__controls { display: flex; gap: 8px; flex-wrap: wrap; }

.ai-headline {
    font-size: 16.5px;
    font-weight: 800;
    line-height: 1.4;
    color: var(--page-ink);
    margin: 4px 0 8px;
    min-height: 1.4em;
}

.ai-summary {
    font-size: 13.5px;
    line-height: 1.55;
    color: #33415c;
    margin: 0 0 12px;
}

.ai-caret::after {
    content: "";
    display: inline-block;
    width: 7px;
    height: 1em;
    margin-left: 2px;
    vertical-align: -2px;
    background: var(--ins-ai);
    animation: ai-blink 0.9s steps(1) infinite;
}

@keyframes ai-blink { 50% { opacity: 0; } }

.ai-run {
    list-style: none;
    margin: 0 0 12px;
    padding: 10px 12px;
    background: #ffffff;
    border: 1px dashed var(--ins-ai-line);
    border-radius: 8px;
    display: grid;
    gap: 7px;
}

.ai-run li {
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    gap: 8px;
    font-size: 12.5px;
    color: #44526c;
    opacity: 0.45;
    transition: opacity 0.2s ease;
}

.ai-run li.is-active,
.ai-run li.is-done { opacity: 1; }

.ai-run__icon {
    width: 14px;
    height: 14px;
    margin-top: 2px;
    border-radius: 50%;
    border: 2px solid var(--ins-ai-line);
}

.ai-run li.is-active .ai-run__icon {
    border-top-color: var(--ins-ai);
    animation: ai-spin 0.7s linear infinite;
}

.ai-run li.is-done .ai-run__icon {
    border-color: var(--ins-good);
    background: var(--ins-good);
    box-shadow: inset 0 0 0 2px #ffffff;
}

@keyframes ai-spin { to { transform: rotate(360deg); } }

.ai-run__label { font-weight: 800; color: var(--page-ink); }
.ai-run__tool {
    font-family: "SFMono-Regular", Consolas, monospace;
    font-size: 11px;
    color: var(--ins-ai);
    margin-left: 6px;
}
.ai-run__detail { display: block; margin-top: 1px; }

.ai-insights {
    display: grid;
    gap: 8px;
    margin-bottom: 12px;
}

.ai-insight {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 4px 12px;
    padding: 10px 12px 10px 14px;
    background: #ffffff;
    border: 1px solid #e3e9fa;
    border-left: 4px solid var(--page-slate);
    border-radius: 6px;
}

.ai-insight--critical { border-left-color: var(--ins-bad); }
.ai-insight--high { border-left-color: var(--ins-coral); }
.ai-insight--medium { border-left-color: var(--ins-amber); }
.ai-insight--low { border-left-color: var(--ins-aqua); }
.ai-insight--positive { border-left-color: var(--ins-good); }

.ai-insight__title { font-weight: 800; font-size: 13.5px; color: var(--page-ink); }
.ai-insight__body { grid-column: 1 / -1; font-size: 12.8px; line-height: 1.5; color: #44526c; }
.ai-insight__metric { text-align: right; }
.ai-insight__metric-value { display: block; font-size: 15px; font-weight: 900; color: var(--page-ink); white-space: nowrap; }
.ai-insight__metric-label { display: block; font-size: 10.5px; color: var(--page-slate); font-weight: 700; text-transform: uppercase; }
.ai-insight__foot { grid-column: 1 / -1; display: flex; gap: 10px; align-items: center; }

.ai-section-title {
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--ins-ai);
    margin: 14px 0 7px;
}

.ai-actions {
    display: grid;
    gap: 7px;
}

.ai-action {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
    padding: 8px 10px;
    background: #ffffff;
    border: 1px solid #e3e9fa;
    border-radius: 6px;
    font-size: 12.5px;
}

.ai-action__title { font-weight: 800; color: var(--page-ink); }
.ai-action__meta { display: block; color: var(--page-slate); font-size: 11.5px; margin-top: 2px; }

.ai-foresight {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    gap: 8px;
}

.ai-foresight__item {
    background: rgba(21, 55, 199, 0.05);
    border-radius: 6px;
    padding: 8px 10px;
    font-size: 12px;
    line-height: 1.45;
    color: #33415c;
}

.ai-foresight__item strong { display: block; color: var(--ins-ai); font-size: 11px; text-transform: uppercase; letter-spacing: 0.04em; }

.ai-provenance {
    margin-top: 12px;
    padding-top: 8px;
    border-top: 1px solid var(--ins-ai-line);
    font-size: 10.5px;
    color: var(--page-slate);
    line-height: 1.5;
}

.ai-empty {
    padding: 22px;
    text-align: center;
    color: var(--page-slate);
    font-size: 13px;
    border: 1px dashed var(--ins-ai-line);
    border-radius: 8px;
    background: #ffffff;
}

/* ---------- Copilot ---------- */
.ai-copilot-fab {
    position: fixed;
    right: 22px;
    bottom: 22px;
    z-index: 900;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 18px;
    border: none;
    border-radius: 999px;
    background: var(--ins-ai);
    color: #ffffff;
    font: inherit;
    font-size: 14px;
    font-weight: 800;
    box-shadow: 0 14px 30px rgba(21, 55, 199, 0.35);
    cursor: pointer;
}

.ai-copilot-fab:hover { background: #102ea0; }
.ai-copilot-fab svg { width: 18px; height: 18px; }

.ai-copilot {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 950;
    width: min(440px, 100%);
    background: #ffffff;
    box-shadow: -18px 0 40px rgba(14, 31, 64, 0.18);
    display: flex;
    flex-direction: column;
    transform: translateX(105%);
    transition: transform 0.25s ease;
}

.ai-copilot.is-open { transform: translateX(0); }

.ai-copilot__head {
    padding: 16px 18px 12px;
    border-bottom: 1px solid var(--ins-ai-line);
    background: linear-gradient(180deg, #ffffff, var(--ins-ai-soft));
}

.ai-copilot__title { display: flex; align-items: center; gap: 8px; font-size: 16px; font-weight: 900; color: var(--ins-ai); margin: 0; }
.ai-copilot__sub { font-size: 11.5px; color: var(--page-slate); margin-top: 4px; }

.ai-copilot__close {
    position: absolute;
    top: 14px;
    right: 14px;
    width: 30px;
    height: 30px;
    border: none;
    border-radius: 50%;
    background: rgba(22, 33, 62, 0.06);
    color: var(--page-ink-soft);
    font-size: 18px;
    cursor: pointer;
}

.ai-copilot__body {
    flex: 1;
    overflow-y: auto;
    padding: 14px 16px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    background: #fbfcff;
}

.ai-msg {
    max-width: 92%;
    font-size: 13px;
    line-height: 1.5;
    padding: 10px 12px;
    border-radius: 10px;
}

.ai-msg--user { align-self: flex-end; background: var(--page-accent); color: #ffffff; border-bottom-right-radius: 3px; }
.ai-msg--ai { align-self: flex-start; background: #ffffff; border: 1px solid var(--ins-ai-line); color: #33415c; border-bottom-left-radius: 3px; }
.ai-msg__steps { list-style: none; margin: 0 0 8px; padding: 0; display: grid; gap: 3px; }
.ai-msg__steps li { font-family: "SFMono-Regular", Consolas, monospace; font-size: 11px; color: var(--ins-ai); }
.ai-msg__steps li::before { content: "\2192  "; }
.ai-msg .ins-table { margin-top: 8px; font-size: 11.5px; }
.ai-msg .ins-table th, .ai-msg .ins-table td { white-space: nowrap; }
.ai-msg .ins-table td.ins-wrap { white-space: normal; min-width: 200px; }
.ai-msg .ins-table-wrap { max-height: 240px; }

.ai-chips { display: flex; flex-wrap: wrap; gap: 6px; }

.ai-chip {
    border: 1px solid var(--ins-ai-line);
    background: #ffffff;
    color: var(--ins-ai);
    font: inherit;
    font-size: 12px;
    font-weight: 700;
    padding: 6px 10px;
    border-radius: 999px;
    cursor: pointer;
    text-align: left;
}

.ai-chip:hover { background: #eef2fd; }

.ai-copilot__foot {
    border-top: 1px solid var(--ins-ai-line);
    padding: 10px 12px;
    display: flex;
    gap: 8px;
    background: #ffffff;
}

.ai-copilot__foot .ins-input { flex: 1; font-size: 13px; padding: 9px 11px; }

/* ---------- Modal + toast ---------- */
.ins-modal {
    position: fixed;
    inset: 0;
    z-index: 1000;
    background: rgba(15, 23, 42, 0.55);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 28px;
}

.ins-modal[hidden] { display: none; }

.ins-modal__panel {
    position: relative;
    width: min(980px, 100%);
    max-height: 100%;
    overflow: auto;
    background: #ffffff;
    border-radius: 8px;
    box-shadow: 0 30px 70px rgba(14, 31, 64, 0.35);
    padding: 20px 24px;
}

.ins-modal__panel--wide { width: min(1180px, 100%); }
.ins-modal__title { font-size: 22px; font-weight: 900; color: var(--page-ink); margin: 0 40px 4px 0; }
.ins-modal__sub { font-size: 12.5px; color: var(--page-slate); margin-bottom: 14px; }

.ins-modal__close {
    position: absolute;
    top: 14px;
    right: 14px;
    width: 32px;
    height: 32px;
    border: none;
    border-radius: 50%;
    background: rgba(22, 33, 62, 0.06);
    color: var(--page-ink-soft);
    font-size: 18px;
    cursor: pointer;
}

.ins-modal textarea.ins-input { width: 100%; min-height: 300px; font-family: "SFMono-Regular", Consolas, monospace; font-size: 12px; line-height: 1.5; }

.ins-toast {
    position: fixed;
    left: 50%;
    bottom: 26px;
    z-index: 1100;
    transform: translate(-50%, 20px);
    opacity: 0;
    background: var(--page-ink);
    color: #ffffff;
    font-size: 13px;
    font-weight: 700;
    padding: 10px 16px;
    border-radius: 8px;
    box-shadow: 0 12px 28px rgba(14, 31, 64, 0.3);
    transition: opacity 0.2s ease, transform 0.2s ease;
    pointer-events: none;
}

.ins-toast.is-visible { opacity: 1; transform: translate(-50%, 0); }
.ins-toast--error { background: var(--ins-bad); }

/* ---------- Misc components ---------- */
.ins-crumbs {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    font-size: 12.5px;
    margin-bottom: 10px;
}

.ins-crumbs button { border: none; background: none; font: inherit; color: var(--page-accent); font-weight: 800; cursor: pointer; padding: 0; }
.ins-crumbs span.sep { color: var(--page-slate); }
.ins-crumbs span.current { font-weight: 800; color: var(--page-ink); }

.ins-segmented {
    display: inline-flex;
    background: rgba(15, 108, 189, 0.06);
    border-radius: 999px;
    padding: 3px;
}

.ins-segmented button {
    border: none;
    background: none;
    font: inherit;
    font-size: 12px;
    font-weight: 800;
    color: var(--page-ink-soft);
    padding: 6px 12px;
    border-radius: 999px;
    cursor: pointer;
}

.ins-segmented button.is-active { background: var(--page-accent); color: #ffffff; }

.ins-levers {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 14px 18px;
}

.ins-lever label {
    display: flex;
    justify-content: space-between;
    font-size: 12px;
    font-weight: 800;
    color: var(--page-ink-soft);
    margin-bottom: 4px;
}

.ins-lever output { color: var(--page-accent); font-variant-numeric: tabular-nums; }
.ins-lever input[type="range"] { width: 100%; accent-color: var(--page-accent); }
.ins-lever__hint { font-size: 11px; color: var(--page-slate); margin-top: 2px; }

.ins-toggle { display: inline-flex; align-items: center; gap: 7px; font-size: 12.5px; font-weight: 700; color: var(--page-ink-soft); cursor: pointer; }
.ins-toggle input { accent-color: var(--page-accent); width: 15px; height: 15px; }

.ins-presets { display: flex; flex-wrap: wrap; gap: 8px; }

.ins-preset {
    border: 1px solid rgba(15, 108, 189, 0.25);
    background: #ffffff;
    color: var(--page-ink);
    font: inherit;
    font-size: 12.5px;
    font-weight: 700;
    padding: 8px 12px;
    border-radius: 8px;
    cursor: pointer;
    text-align: left;
    max-width: 240px;
}

.ins-preset small { display: block; font-weight: 600; color: var(--page-slate); font-size: 11px; margin-top: 2px; }
.ins-preset:hover { border-color: var(--page-accent); }
.ins-preset.is-active { background: var(--page-accent); color: #ffffff; border-color: var(--page-accent); }
.ins-preset.is-active small { color: rgba(255, 255, 255, 0.85); }

.ins-compare {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 10px;
}

.ins-compare--two { grid-template-columns: repeat(2, minmax(0, 1fr)); }

.ins-compare__item { background: #ffffff; border: 1px solid var(--ins-line); padding: 10px 12px; }
.ins-compare__label { font-size: 11px; font-weight: 800; text-transform: uppercase; color: var(--page-slate); letter-spacing: 0.03em; }
.ins-compare__value { font-size: 19px; font-weight: 900; margin-top: 3px; }
.ins-compare__base { font-size: 11.5px; color: var(--page-slate); margin-top: 2px; }

/* Scenario planner: save row, AI commentary bullets and recommendation. */
.ins-save-row { display: flex; gap: 8px; margin-top: 14px; }
.ins-save-row .ins-input { flex: 1; min-width: 0; }
.ins-bullets { margin: 6px 0 10px 18px; padding: 0; font-size: 13px; line-height: 1.6; color: var(--page-ink-soft); }
.ins-advice { background: rgba(21, 55, 199, 0.06); border-left: 3px solid var(--ins-ai); padding: 9px 12px; font-size: 13px; color: var(--page-ink); }
.ins-chart.is-empty canvas { display: none; }
.ins-chart.is-empty::after {
    content: "Nothing to attribute in the base case";
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--page-slate);
    font-size: 12.5px;
}

.ins-health {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 18px;
}

.ins-health__card {
    display: block;
    background: #ffffff;
    border: 1px solid rgba(15, 108, 189, 0.18);
    border-top: 4px solid var(--ins-good);
    padding: 14px 16px;
    box-shadow: 0 10px 22px rgba(14, 31, 64, 0.06);
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.ins-health__card:hover { transform: translateY(-3px); box-shadow: 0 16px 30px rgba(14, 31, 64, 0.1); }
.ins-health__card--critical, .ins-health__card--high { border-top-color: var(--ins-bad); }
.ins-health__card--medium { border-top-color: var(--ins-amber); }
.ins-health__label { font-size: 11px; font-weight: 900; text-transform: uppercase; letter-spacing: 0.05em; color: var(--page-slate); }
.ins-health__value { font-size: 14px; font-weight: 800; color: var(--page-ink); margin-top: 6px; line-height: 1.4; }
.ins-health__link { display: inline-block; margin-top: 8px; font-size: 12px; font-weight: 800; color: var(--page-accent); }

/* CFO briefing: action tracker, governance details and model cards. */
.ins-action-list { display: grid; gap: 8px; max-height: 620px; overflow: auto; }
.ins-action-item { border: 1px solid var(--ins-line); background: #ffffff; padding: 10px 12px; }
.ins-action-item.is-closed { opacity: 0.65; }
.ins-action-item__head { display: flex; align-items: flex-start; gap: 8px; }
.ins-action-item__title { font-weight: 800; font-size: 13px; color: var(--page-ink); line-height: 1.35; }
.ins-action-item__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 6px; font-size: 11.5px; }
.ins-action-item__meta a.ins-chip { text-decoration: none; }
.ins-action-item__detail { font-size: 12px; color: var(--page-slate); margin-top: 6px; line-height: 1.45; }
.ins-action-item__controls { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 8px; margin-top: 8px; }
.ins-action-item__controls label { display: grid; gap: 2px; font-size: 10.5px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.04em; color: var(--page-slate); }
.ins-action-item__controls .ins-input, .ins-action-item__controls .ins-select { font-size: 12px; padding: 5px 8px; }
.ins-action-item__controls .ins-input[data-field="owner"] { width: 150px; }
.ins-action-item__controls .ins-input.is-late { border-color: var(--ins-bad); color: var(--ins-bad); }
.ins-action-item__history { margin: 8px 0 0 18px; padding: 0; font-size: 11.5px; line-height: 1.6; color: var(--page-ink-soft); }

.ins-details > summary { cursor: pointer; font-size: 12px; font-weight: 900; text-transform: uppercase; letter-spacing: 0.05em; color: var(--ins-ai); }
.ins-model-card { border: 1px solid var(--ins-line); background: #ffffff; padding: 10px 12px; margin-bottom: 8px; }
.ins-model-card__name { font-weight: 800; font-size: 13px; color: var(--page-ink); }
.ins-model-card__body { font-size: 12px; color: var(--page-ink-soft); margin-top: 4px; line-height: 1.5; }
.ins-model-card__stats { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 12px; color: var(--page-slate); margin-top: 6px; }
.ins-model-card__stats strong { color: var(--page-ink); }

.ins-hero {
    background: linear-gradient(120deg, #0b0f75 0%, #173f7a 55%, #1c8fa8 100%);
    color: #ffffff;
    padding: 22px 26px;
    margin-bottom: 18px;
    position: relative;
    overflow: hidden;
    box-shadow: 0 20px 40px rgba(14, 31, 64, 0.16);
}

.ins-hero::after {
    content: "";
    position: absolute;
    right: -80px;
    top: -120px;
    width: 340px;
    height: 340px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(111, 155, 240, 0.35), transparent 70%);
}

.ins-hero__greeting { font-size: 12px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; color: #9db0d8; }
.ins-hero__headline { font-size: 22px; font-weight: 900; line-height: 1.3; margin: 8px 0 8px; max-width: 980px; position: relative; z-index: 1; }
.ins-hero__summary { font-size: 13.5px; line-height: 1.6; color: #dbe6ff; max-width: 1080px; position: relative; z-index: 1; margin: 0; }

.ins-heat td.ins-heat__cell { text-align: center; font-weight: 800; font-size: 11.5px; min-width: 44px; }
.ins-heat td:first-child,
.ins-heat th:first-child { white-space: nowrap; min-width: 190px; max-width: 230px; overflow: hidden; text-overflow: ellipsis; }

.ins-timeline { display: grid; gap: 6px; }

.ins-empty {
    padding: 18px;
    text-align: center;
    color: var(--page-slate);
    font-size: 12.5px;
}

.ins-loading {
    position: relative;
    pointer-events: none;
    opacity: 0.55;
    transition: opacity 0.15s ease;
}

.ins-skip { position: absolute; left: -9999px; }

@media (max-width: 1250px) {
    .ins-grid--ai, .ins-grid--three { grid-template-columns: minmax(0, 1fr); }
    .ins-health { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 1000px) {
    .ins-grid { grid-template-columns: minmax(0, 1fr); }
    .ins-donut-wrap { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 700px) {
    .ins-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ins-health { grid-template-columns: minmax(0, 1fr); }
    .ai-copilot-fab span { display: none; }
    .ins-modal { padding: 10px; }
}

@media print {
    .cp-rail, .ai-copilot, .ai-copilot-fab, .ai-panel__controls, .ins-topbar__actions { display: none !important; }
    .cp-dashboard { grid-template-columns: 1fr !important; }
}
