/* SynQor theme (2026-09-03): indigo core, cyan signal. Semantic status colours are unchanged. */
:root {
    --ink: #171a2e;
    --muted: #66708a;
    --line: #e1e5f0;
    --accent: #4f46e5;
    --accent-strong: #3b34c4;
    --accent-soft: #eef0fd;
    --signal: #22d3ee;
    --panel: #ffffff;
    --bg: #f4f6fb;
    --topbar: linear-gradient(90deg, #1b1a4a 0%, #2b2a7a 55%, #1f3f8f 100%);
}

* { box-sizing: border-box; }

body {
    margin: 0;
    font-family: "Segoe UI", system-ui, sans-serif;
    color: var(--ink);
    background: var(--bg);
}

.topbar {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    padding: 0.7rem 1.5rem;
    background: var(--topbar);
    color: #fff;
}

.topbar .brand {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    color: #fff;
    font-weight: 800;
    font-size: 1.15rem;
    text-decoration: none;
    letter-spacing: 0.01em;
}

.topbar .brand .logo { display: block; }
.wordmark .q { color: var(--signal); }

.topbar nav a {
    color: #c9cdf3;
    text-decoration: none;
    margin-right: 1rem;
}

.topbar nav a:hover { color: #fff; }

.topbar .who { margin-left: auto; color: #fff; text-decoration: none; font-size: 0.85rem; font-weight: 600; }
.topbar .who:hover { color: var(--signal); }
.topbar .signout { margin-left: 1rem; color: #c9cdf3; text-decoration: none; font-size: 0.85rem; }
.topbar .signout:hover { color: #fff; }

.login-box {
    max-width: 420px;
    margin: 12vh auto 0;
    background: var(--panel);
    border: 1px solid var(--line);
    border-radius: 10px;
    padding: 2rem 2.2rem;
}

.login-box h1 { margin-top: 0; }

.content {
    max-width: 1100px;
    margin: 0 auto;
    padding: 1.5rem;
}

.panel {
    background: var(--panel);
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 1.25rem 1.5rem;
    margin-bottom: 1.5rem;
}

.panel h2 { margin-top: 0; font-size: 1.05rem; }

.muted { color: var(--muted); }

.form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem 1.25rem;
    margin-bottom: 1rem;
}

.form-grid label {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    font-size: 0.85rem;
    color: var(--muted);
}

.form-grid .span-2 { grid-column: span 2; }

.form-grid input,
.form-grid select,
.form-grid textarea {
    font: inherit;
    color: var(--ink);
    padding: 0.45rem 0.6rem;
    border: 1px solid var(--line);
    border-radius: 6px;
}

button.primary {
    font: inherit;
    background: var(--accent);
    color: #fff;
    border: none;
    border-radius: 6px;
    padding: 0.55rem 1.2rem;
    cursor: pointer;
}

button.primary:hover:not(:disabled) { background: var(--accent-strong); }
button.primary:disabled { opacity: 0.6; cursor: default; }

.primary-link { color: var(--accent); font-weight: 600; text-decoration: none; }

table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

th, td {
    text-align: left;
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid var(--line);
}

th { color: var(--muted); font-weight: 600; }

.status {
    display: inline-block;
    padding: 0.1rem 0.55rem;
    border-radius: 999px;
    font-size: 0.8rem;
    background: #eef0f4;
}

.status-draft { background: #eef0f4; }
.status-running { background: #e0f0e3; color: #1e6b34; }
.status-awaitinginput, .status-awaitingplanapproval { background: #fdf3d7; color: #8a6d1a; }
.status-failed, .status-cancelled, .status-budgetexceeded { background: #fbe3e0; color: #a12c1f; }
.status-delivered { background: #dff0ee; color: #17635c; }

.live-dot { font-size: 0.7rem; color: #1e6b34; vertical-align: middle; }

/* G1 plan gate */
.tag-frozen {
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    padding: 0.15rem 0.6rem;
    border-radius: 4px;
    background: #dff0ee;
    color: #17635c;
    margin-left: 0.6rem;
    vertical-align: middle;
}

.violations {
    background: #fbe3e0;
    color: #a12c1f;
    border-radius: 6px;
    padding: 0.7rem 1rem;
    margin: 0.8rem 0;
    font-size: 0.9rem;
}

.criterion-row {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.35rem 0.5rem;
    border-bottom: 1px solid var(--line);
    flex-wrap: wrap;
}

.criterion-row.manual { background: #fdf3d7; border-radius: 4px; }
.criterion-row.struck { opacity: 0.55; text-decoration: line-through; }
.criterion-row.struck .muted { text-decoration: none; }
.criterion-row .ac-id { color: var(--muted); min-width: 2.8rem; }
.criterion-row .ac-input { flex: 1; min-width: 240px; font: inherit; padding: 0.3rem 0.5rem; border: 1px solid var(--line); border-radius: 5px; }
.criterion-row .ac-verify { font: inherit; padding: 0.3rem; border: 1px solid var(--line); border-radius: 5px; }
.criterion-row .ac-text { flex: 1; }
.criterion-row .hash { font-size: 0.75rem; }
.criterion-row.add-row { border-bottom: none; margin-top: 0.4rem; }

.manual-badge {
    background: #fdf3d7;
    color: #8a6d1a;
    padding: 0.05rem 0.45rem;
    border-radius: 999px;
    font-size: 0.8rem;
}

button.linkish {
    font: inherit;
    background: none;
    border: none;
    color: var(--accent);
    cursor: pointer;
    padding: 0.2rem 0.4rem;
}

button.linkish.danger { color: #a12c1f; }
button.linkish:disabled { opacity: 0.5; cursor: default; }

.review-md {
    background: #f7f8fd;
    border: 1px solid var(--line);
    border-radius: 6px;
    padding: 0.9rem 1.2rem;
    font-size: 0.86rem;
    font-family: inherit;
    white-space: pre-wrap;
    max-height: 480px;
    overflow-y: auto;
}

.ddl-preview {
    background: #f0f1f4;
    border: 1px solid var(--line);
    border-radius: 6px;
    padding: 0.6rem 0.9rem;
    font-size: 0.82rem;
    white-space: pre-wrap;
    max-height: 240px;
    overflow-y: auto;
}

.question-row { border-bottom: 1px solid var(--line); padding: 0.5rem 0; }
.question-row:last-child { border-bottom: none; }
.question-row p { margin: 0.2rem 0; }

.gate-actions { display: flex; align-items: center; gap: 0.8rem; flex-wrap: wrap; }
.gate-actions .ac-input { flex: 0 1 260px; font: inherit; padding: 0.3rem 0.5rem; border: 1px solid var(--line); border-radius: 5px; }

.mono { font-family: Consolas, monospace; }

.probe-error {
    margin-top: 0.8rem;
    padding: 0.6rem 0.9rem;
    background: #fbe3e0;
    color: #a12c1f;
    border-radius: 6px;
    font-size: 0.88rem;
}

.probe-result { margin-top: 1rem; }

.probe-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem 1.2rem;
    font-size: 0.85rem;
    color: var(--muted);
    margin-bottom: 0.5rem;
    font-variant-numeric: tabular-nums;
}

.probe-result pre {
    background: #f0f1f4;
    border: 1px solid var(--line);
    border-radius: 6px;
    padding: 0.75rem 1rem;
    white-space: pre-wrap;
    font-size: 0.88rem;
    margin: 0;
}

h1:focus {
    outline: none;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid #e50000;
}

.validation-message {
    color: #e50000;
}

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

.darker-border-checkbox.form-check-input {
    border-color: #929292;
}

/* ---- layout refresh (2026-09-02): sticky run header, meters, phase nav, filters ---- */
.run-header { position: sticky; top: 0; z-index: 5; background: var(--bg); padding: 0.5rem 0 0.7rem; margin-bottom: 0.9rem; border-bottom: 1px solid var(--line); }
.run-header h1 { margin: 0 0 0.2rem; font-size: 1.35rem; display: flex; align-items: center; gap: 0.6rem; flex-wrap: wrap; }
.run-header .scope { margin: 0 0 0.5rem; color: var(--muted); font-size: 0.9rem; max-height: 3.2em; overflow: hidden; }
.run-header .meters { display: flex; gap: 1.4rem; flex-wrap: wrap; align-items: center; font-size: 0.83rem; color: var(--muted); font-variant-numeric: tabular-nums; }
.run-header .run-controls { margin-top: 0.45rem; }
.meter { display: inline-flex; align-items: center; gap: 0.5rem; }
.meter .bar { display: inline-block; width: 110px; height: 6px; background: #e3e6ec; border-radius: 3px; overflow: hidden; }
.meter .bar span { display: block; height: 100%; background: var(--accent); }
.meter .bar.warn span { background: #d9a11c; }
.meter .bar.ok span { background: #2e8b57; }
.phase-nav { display: flex; gap: 1.2rem; flex-wrap: wrap; font-size: 0.83rem; margin-top: 0.45rem; }
.phase-nav a { color: var(--accent); text-decoration: none; }
.phase-nav a.current { font-weight: 700; border-bottom: 2px solid var(--accent); }
section[id], h3[id], div[id] { scroll-margin-top: 150px; }
.tag { display: inline-block; font-size: 0.74rem; padding: 0.05rem 0.45rem; border-radius: 4px; background: #eef0f4; color: var(--muted); vertical-align: middle; }
.tag.offpeak { background: #ebe6fa; color: #4b3a9c; }
.two-col { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; align-items: start; margin-bottom: 1.2rem; }
@media (max-width: 900px) { .two-col { grid-template-columns: 1fr; } }
details.panel > summary { cursor: pointer; }
.two-col details.panel { margin-bottom: 0; }
.status-planning, .status-verifying, .status-reviewing { background: #e3ecfa; color: #1f4e9c; }
.status-awaitingdelivery { background: #fdf3d7; color: #8a6d1a; }
.status-scheduled { background: #ebe6fa; color: #4b3a9c; }
.status-paused { background: #e6e8f8; color: #3b34c4; }
.status-inprogress { background: #e0f0e3; color: #1e6b34; }
.status-done { background: #dff0ee; color: #17635c; }
.status-pending, .status-skipped { background: #eef0f4; color: var(--muted); }
.now-panel { border-left: 4px solid var(--accent); }
.banner { padding: 0.55rem 0.9rem; border-radius: 6px; font-size: 0.88rem; margin-bottom: 1rem; }
.banner.offpeak { background: #e6f3ea; color: #1e6b34; }
.banner.peak { background: #fdf3d7; color: #8a6d1a; }
.runs-toolbar { display: flex; gap: 0.8rem; align-items: center; flex-wrap: wrap; margin-bottom: 0.75rem; }
.runs-toolbar input, .runs-toolbar select { font: inherit; padding: 0.35rem 0.55rem; border: 1px solid var(--line); border-radius: 6px; }
.runs-table td { vertical-align: top; }
.runs-table .sub { font-size: 0.78rem; color: var(--muted); margin-top: 0.2rem; }
.runs-table .actions { white-space: nowrap; }
.runs-table .actions a, .runs-table .actions button { margin-right: 0.3rem; }
.mini-bar { display: block; width: 90px; height: 5px; background: #e3e6ec; border-radius: 3px; overflow: hidden; margin-top: 0.3rem; }
.mini-bar span { display: block; height: 100%; background: var(--accent); }
.mini-bar.ok span { background: #2e8b57; }
.form-grid label.check { flex-direction: row; align-items: center; gap: 0.5rem; }
.milestone-desc { font-size: 0.85rem; }
.verdict { font-size: 0.75rem; padding: 0.05rem 0.45rem; border-radius: 999px; }
.verdict.met { background: #dff0ee; color: #17635c; }
.verdict.notmet { background: #fbe3e0; color: #a12c1f; }
.verdict.unverifiable { background: #eef0f4; color: var(--muted); }
.g3-actions { display: flex; align-items: center; gap: 0.8rem; flex-wrap: wrap; padding: 0.7rem 0 0.2rem; border-top: 1px solid var(--line); margin-top: 0.8rem; }
.phase-nav button { font: inherit; font-size: 0.83rem; background: none; border: none; border-bottom: 2px solid transparent; color: var(--accent); cursor: pointer; padding: 0 0 0.1rem; }
.phase-nav button.current { font-weight: 700; border-bottom-color: var(--accent); }
.phase-nav button:hover { text-decoration: underline; }
/* danger zone */
.danger-zone { border-color: #e6b8b1; }
.danger-zone > summary strong { color: #a12c1f; }
button.danger-solid { font: inherit; background: #a12c1f; color: #fff; border: none; border-radius: 6px; padding: 0.45rem 1rem; cursor: pointer; }
button.danger-solid:disabled { opacity: 0.45; cursor: default; }

/* ---- usage charts (2026-09-02): server-rendered SVG, validated palette ---- */
.viz { --s1: #2a78d6; --s2: #eb6834; --s3: #1baf7a; --grid: #e3e6ec; --axis: #c9ccd3; --peak: #f0efec; }
.kpi-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 0.8rem; margin-bottom: 1rem; }
.stat { background: var(--panel); border: 1px solid var(--line); border-radius: 8px; padding: 0.8rem 1rem; }
.stat .label { font-size: 0.8rem; color: var(--muted); }
.stat .value { font-size: 1.55rem; font-weight: 600; margin: 0.15rem 0; }
.stat .sub { font-size: 0.78rem; color: var(--muted); }
.meter-track { display: block; height: 6px; background: #cde2fb; border-radius: 3px; overflow: hidden; margin-top: 0.45rem; }
.meter-fill { display: block; height: 100%; background: var(--s1); }
.meter-fill.warn { background: #eda100; }
.chart-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin-bottom: 1.2rem; }
@media (max-width: 1000px) { .chart-grid { grid-template-columns: 1fr; } }
.chart-card { margin-bottom: 0; }
.chart-card svg { display: block; width: 100%; height: auto; overflow: visible; }
.chart-card svg text { font-family: "Segoe UI", system-ui, sans-serif; }
.chart-card svg text.tick { font-size: 10.5px; fill: var(--muted); font-variant-numeric: tabular-nums; }
.chart-card svg text.direct { font-size: 11px; fill: var(--ink); font-weight: 600; }
.chart-card svg text.direct-small { font-size: 10.5px; fill: var(--ink); }
.chart-card svg line.grid { stroke: var(--grid); stroke-width: 1; }
.chart-card svg line.axis { stroke: var(--axis); stroke-width: 1; }
.chart-card svg line.ref { stroke: var(--muted); stroke-width: 1; }
.chart-card svg .s1 { fill: var(--s1); }
.chart-card svg .s2 { fill: var(--s2); }
.chart-card svg .s3 { fill: var(--s3); }
.chart-card svg path.line { fill: none; stroke: var(--s1); stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.chart-card svg path.wash { fill: var(--s1); fill-opacity: 0.1; }
.chart-card svg rect.peak { fill: var(--peak); }
.chart-card svg circle.hit { fill: transparent; }
.chart-card svg circle.ring { fill: var(--panel); }
.chart-card svg path:hover, .chart-card svg rect:not(.peak):hover { opacity: 0.8; }
.legend { display: flex; gap: 1.2rem; flex-wrap: wrap; font-size: 0.8rem; color: var(--muted); margin-top: 0.4rem; }
.legend .sw { display: inline-block; width: 11px; height: 11px; border-radius: 2px; margin-right: 0.35rem; vertical-align: -1px; }
.legend .sw.s1 { background: var(--s1); }
.legend .sw.s2 { background: var(--s2); }
.legend .sw.s3 { background: var(--s3); }
.chart-table { margin-top: 0.5rem; font-size: 0.82rem; }
.chart-table summary { cursor: pointer; }
.chart-table table { margin-top: 0.4rem; font-size: 0.8rem; }
.muted.small { font-size: 0.8rem; margin: 0.4rem 0 0; }
/* live app (artifact window) */
.artifact-bar { display: flex; gap: 0.6rem; align-items: center; flex-wrap: wrap; margin: 0.4rem 0; font-size: 0.85rem; }
.artifact-bar .ac-input { flex: 0 1 220px; }
.artifact-frame { border: 1px solid var(--line); border-radius: 6px; overflow: hidden; background: #fff; margin-top: 0.4rem; }
.artifact-frame iframe { display: block; width: 100%; height: 70vh; border: 0; }
/* Security pass (2026-09-08): severity badges and the findings table */
.sev { display: inline-block; padding: 0.05rem 0.45rem; border-radius: 4px; font-size: 0.75rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.02em; }
.sev.high { background: #fde2e1; color: #a12622; }
.sev.medium { background: #fff1d6; color: #8a5a00; }
.sev.low { background: #e6f0ff; color: #1f4f9c; }
table.security td { vertical-align: top; }
table.security .sub { font-size: 0.78rem; color: var(--muted); margin-top: 0.2rem; }
.security-note { margin-top: 0.5rem; }
/* App versions (2026-09-08): one app, several runs as versions */
.panel.versions tr.current td { background: #f3f5fc; }
.linkish-tag { cursor: pointer; font: inherit; }
/* Live app with the punch list beside it (2026-09-08): notes are taken while clicking through */
.live-layout { display: flex; gap: 1rem; align-items: flex-start; }
.live-main { flex: 1 1 auto; min-width: 0; }
.live-punch { flex: 0 0 330px; position: sticky; top: 4.5rem; background: #f7f8fd; border: 1px solid var(--line); border-left: 4px solid var(--accent); border-radius: 6px; padding: 0.8rem 0.9rem; font-size: 0.88rem; }
.live-punch h4 { margin: 0 0 0.3rem; font-size: 0.95rem; display: flex; justify-content: space-between; align-items: baseline; gap: 0.5rem; }
.live-punch .punch-list { list-style: none; padding: 0; margin: 0.4rem 0 0.6rem; }
.live-punch .punch-list li { display: flex; justify-content: space-between; align-items: flex-start; gap: 0.5rem; padding: 0.35rem 0; border-top: 1px solid var(--line); }
.live-punch .punch-field { display: block; margin: 0.5rem 0; font-size: 0.8rem; color: var(--muted); }
.live-punch .punch-field .ac-input { display: block; width: 100%; margin-top: 0.2rem; font: inherit; color: inherit; padding: 0.35rem 0.5rem; border: 1px solid var(--line); border-radius: 5px; box-sizing: border-box; background: #fff; }
.live-punch textarea.ac-input { resize: vertical; min-height: 4.5rem; }
.live-punch .small { font-size: 0.78rem; }
@media (max-width: 1100px) { .live-layout { flex-direction: column; } .live-punch { flex-basis: auto; width: 100%; position: static; } }
/* run form hints */
.form-grid .hint { font-size: 0.74rem; color: var(--muted); line-height: 1.35; }
/* G3 review & delivery layout: verdict header, decision block, tabs */
.g3-head { display: flex; align-items: baseline; gap: 1rem; flex-wrap: wrap; }
.g3-head h2 { margin: 0; }
.verdict-row { display: flex; gap: 1rem; flex-wrap: wrap; align-items: center; font-size: 0.88rem; color: var(--muted); margin: 0.5rem 0 0.2rem; }
.verdict-badge { display: inline-block; padding: 0.15rem 0.7rem; border-radius: 999px; font-weight: 700; font-size: 0.85rem; }
.verdict-badge.pass { background: #dff0ee; color: #17635c; }
.verdict-badge.concerns { background: #fdf3d7; color: #8a6d1a; }
.verdict-badge.fail { background: #fbe3e0; color: #a12c1f; }
.verdict-badge.unknown { background: #eef0f4; color: var(--muted); }
.decision { background: #f7f8fd; border: 1px solid var(--line); border-left: 4px solid var(--accent); border-radius: 6px; padding: 0.8rem 1rem; margin: 0.8rem 0; }
.decision h3 { margin: 0 0 0.5rem; font-size: 0.95rem; }
.decision .punch-items p { margin: 0.2rem 0; }
.tabs { display: flex; gap: 0.2rem; flex-wrap: wrap; border-bottom: 1px solid var(--line); margin: 0.9rem 0 0.8rem; }
.tabs button { font: inherit; font-size: 0.9rem; background: none; border: none; border-bottom: 2px solid transparent; margin-bottom: -1px; padding: 0.45rem 0.85rem; color: var(--muted); cursor: pointer; }
.tabs button.active { color: var(--ink); border-bottom-color: var(--accent); font-weight: 600; }
.tabs button:hover { color: var(--ink); }
.tab-panel[hidden] { display: none; }
.deliverables .question-row:first-child { padding-top: 0; }
/* room below the last panel so a phase jump can bring any section up to the header line */
.content { padding-bottom: 50vh; }

/* ---- estimated finish (2026-09-02): Runs "Finish" column and the run-header meter ---- */
.eta { font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
.eta.active { color: #1e6b34; }
.eta.queued { color: #4b3a9c; }
.runs-table .eta-cell { white-space: nowrap; }
.meter.eta strong { color: #1e6b34; font-weight: 600; }
.meter.eta.waiting { color: #8a6d1a; }
/* ---- SynQor brand + accounts (2026-09-03) ---- */
.login-box .brand-block { text-align: center; margin-bottom: 0.6rem; }
.login-box .brand-block .logo { display: inline-block; }
.login-box h1 { margin: 0.2rem 0 0; font-size: 2rem; letter-spacing: -0.01em; }
.login-box h1 .q { color: var(--accent); }
.login-box .tagline { margin: 0.1rem 0 1rem; color: var(--muted); font-size: 0.9rem; }
.users-table tr.inactive td { opacity: 0.6; }
.users-table .actions { white-space: nowrap; }
.users-table .actions .ac-input { width: 160px; font: inherit; padding: 0.25rem 0.45rem; border: 1px solid var(--line); border-radius: 5px; }
.tag.admin { background: var(--accent-soft); color: var(--accent-strong); }
/* ---- settings page (2026-09-03) ---- */
.setting-row { padding: 0.7rem 0; border-bottom: 1px solid var(--line); }
.setting-row:last-child { border-bottom: none; }
.setting-head { display: flex; gap: 0.7rem; align-items: baseline; flex-wrap: wrap; }
.setting-head code { font-size: 0.78rem; }
.setting-desc { margin: 0.15rem 0 0.3rem; font-size: 0.85rem; }
.setting-state { margin: 0 0 0.45rem; font-size: 0.85rem; }
.gate-actions .ac-input.wide { flex: 0 1 440px; }
/* ---- run timeline (2026-09-03) ---- */
.timeline td { vertical-align: top; font-size: 0.85rem; padding: 0.35rem 0.6rem; }
.timeline td.when { white-space: nowrap; }
/* ---- skills (2026-09-03) ---- */
.skill-editor { width: 100%; min-height: 440px; font-family: Consolas, monospace; font-size: 0.85rem; line-height: 1.4; padding: 0.6rem 0.8rem; border: 1px solid var(--line); border-radius: 6px; resize: vertical; }
.skill-picks label.check { display: flex; gap: 0.5rem; align-items: baseline; font-size: 0.85rem; margin: 0.2rem 0; color: var(--ink); }
tr.selected td { background: var(--accent-soft); }

/* ---- responsive pass (2026-09-03): the operator's screenshot showed tags breaking mid-word under a
   squeezed name column and the Actions column spilling past the card; phones had no layout at all. ---- */
.tag { white-space: nowrap; }
.runs-table .name-cell .sub { display: flex; flex-wrap: wrap; gap: 0.25rem 0.3rem; align-items: center; }
.runs-table { table-layout: fixed; width: 100%; }
.runs-table th:nth-child(1) { width: 16%; }
.runs-table th:nth-child(3) { width: 9%; }
.runs-table th:nth-child(4) { width: 12%; }
.runs-table th:nth-child(5) { width: 11%; }
.runs-table th:nth-child(6) { width: 8%; }
.runs-table th:nth-child(7) { width: 14%; }
.runs-table td { overflow-wrap: anywhere; }
.runs-table .actions { white-space: normal; }
.runs-table .actions a, .runs-table .actions button { display: inline-block; margin: 0 0.35rem 0.2rem 0; padding-left: 0; }
.runs-table .eta-cell { white-space: normal; }
.runs-toolbar input { flex: 1 1 180px; min-width: 0; }
.setting-head code, .mono, .run-header .scope, .question-row code { overflow-wrap: anywhere; }
.topbar { flex-wrap: wrap; row-gap: 0.4rem; }
.topbar nav { display: flex; flex-wrap: wrap; gap: 0.15rem 1rem; }
.topbar nav a { margin-right: 0; white-space: nowrap; }
img, svg, iframe, video { max-width: 100%; }
.users-table .actions { white-space: normal; }

@media (max-width: 720px) {
    .topbar { padding: 0.55rem 0.9rem; gap: 0.6rem 0.9rem; }
    .topbar nav { order: 3; flex-basis: 100%; }
    .topbar .who { margin-left: auto; }
    .content { padding: 0.9rem 0.7rem 40vh; }
    .panel { padding: 0.85rem 0.85rem; margin-bottom: 1rem; }
    h1 { font-size: 1.4rem; }
    .form-grid { grid-template-columns: 1fr; }
    .form-grid .span-2, .form-grid .check.span-2 { grid-column: span 1; }
    .form-grid input, .form-grid select, .form-grid textarea { width: 100%; min-width: 0; }
    .gate-actions .ac-input, .gate-actions .ac-input.wide, .artifact-bar .ac-input, .criterion-row .ac-input { flex: 1 1 100%; min-width: 0; }
    .users-table .actions .ac-input { width: 100%; }
    .login-box { margin: 4vh 0.5rem 0; padding: 1.4rem 1.2rem; max-width: none; }
    .run-header { position: static; }
    .run-header h1 { font-size: 1.2rem; }
    .meter .bar { width: 64px; }
    .artifact-frame iframe { height: 60vh; }
    .skill-editor { min-height: 300px; }
    .review-md { max-height: 60vh; }
    /* secondary tables scroll sideways; the runs list becomes cards */
    .panel table:not(.runs-table) { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .panel table:not(.runs-table) th, .panel table:not(.runs-table) td { white-space: nowrap; }
    .runs-table, .runs-table tbody, .runs-table tr, .runs-table td { display: block; width: auto; }
    .runs-table thead { display: none; }
    .runs-table tr { border: 1px solid var(--line); border-radius: 8px; padding: 0.6rem 0.75rem; margin-bottom: 0.7rem; background: var(--panel); }
    .runs-table td { border: 0; padding: 0.2rem 0; }
    .runs-table td[data-label]::before { content: attr(data-label) ": "; color: var(--muted); font-size: 0.78rem; margin-right: 0.3rem; }
    .runs-table td.status-cell::before, .runs-table td.actions::before { display: none; }
    .runs-table .name-cell .primary-link { font-size: 1rem; }
    .runs-table .actions { margin-top: 0.3rem; padding-top: 0.3rem; border-top: 1px dashed var(--line); }
    .runs-table .mini-bar { width: 100%; max-width: 220px; }
}

/* Rendered reviewer markdown (2026-09-08): REVIEW.md and ui-review.md on the G3 tabs are
   formatted documents, not a raw dump. Same panel as .review-md, flowing text instead of
   pre-wrap, and the report's own structure (headings, tables, code, lists) made readable. */
.review-md.rendered {
    white-space: normal;
    font-size: 0.92rem;
    line-height: 1.55;
    max-height: none;
    overflow: visible;
    padding: 1.1rem 1.5rem 1.2rem;
}
.review-md.rendered > :first-child { margin-top: 0; }
.review-md.rendered > :last-child { margin-bottom: 0; }
.review-md.rendered h1,
.review-md.rendered h2,
.review-md.rendered h3,
.review-md.rendered h4 {
    color: var(--ink);
    line-height: 1.25;
    margin: 1.4em 0 0.5em;
}
.review-md.rendered h1 { font-size: 1.35rem; border-bottom: 1px solid var(--line); padding-bottom: 0.35rem; }
.review-md.rendered h2 { font-size: 1.12rem; color: var(--accent-strong); }
.review-md.rendered h3 { font-size: 1rem; }
.review-md.rendered h4 { font-size: 0.92rem; color: var(--muted); text-transform: uppercase; letter-spacing: 0.03em; }
.review-md.rendered p { margin: 0.55em 0; }
.review-md.rendered ul, .review-md.rendered ol { margin: 0.5em 0 0.7em; padding-left: 1.5em; }
.review-md.rendered li { margin: 0.2em 0; }
.review-md.rendered li > p { margin: 0.2em 0; }
.review-md.rendered li.task-list-item { list-style: none; margin-left: -1.3em; }
.review-md.rendered blockquote {
    margin: 0.7em 0;
    padding: 0.4em 1em;
    border-left: 3px solid var(--accent);
    background: var(--accent-soft);
    color: var(--ink);
    border-radius: 0 6px 6px 0;
}
.review-md.rendered code {
    font-family: Consolas, "Cascadia Mono", "Courier New", monospace;
    font-size: 0.85em;
    background: #eceef8;
    border-radius: 4px;
    padding: 0.08em 0.35em;
}
.review-md.rendered pre {
    background: #1e2140;
    color: #e8eaf6;
    border-radius: 6px;
    padding: 0.8em 1em;
    overflow-x: auto;
    font-size: 0.82rem;
    line-height: 1.45;
    margin: 0.7em 0;
}
.review-md.rendered pre code { background: none; padding: 0; font-size: inherit; color: inherit; }
.review-md.rendered table {
    border-collapse: collapse;
    width: 100%;
    margin: 0.7em 0 1em;
    font-size: 0.86rem;
    display: block;
    overflow-x: auto;
}
.review-md.rendered th, .review-md.rendered td {
    border: 1px solid var(--line);
    padding: 0.4em 0.7em;
    vertical-align: top;
    text-align: left;
}
.review-md.rendered th { background: var(--accent-soft); color: var(--ink); font-weight: 600; }
.review-md.rendered tr:nth-child(even) td { background: #fbfbfe; }
.review-md.rendered hr { border: 0; border-top: 1px solid var(--line); margin: 1.2em 0; }
.review-md.rendered a { color: var(--accent); }
.review-md.rendered strong { color: var(--ink); }
.review-raw { margin-top: 0.8rem; }
.review-raw > summary { cursor: pointer; }
.review-raw .review-md { margin-top: 0.5rem; }
@media (max-width: 720px) {
    .review-md.rendered { max-height: none; padding: 0.9rem 1rem; }
}

/* Live activity line (2026-09-08): what the agent is doing right now while the run is
   Running — the last turn's tool calls — so "Running" is never a blank state. */
.live-activity {
    display: flex;
    align-items: baseline;
    gap: 0.6rem;
    margin: 0.35rem 0 0.2rem;
    font-size: 0.84rem;
    color: var(--ink);
    overflow-wrap: anywhere;
}
.live-activity .pulse {
    flex: none;
    width: 0.55rem;
    height: 0.55rem;
    border-radius: 50%;
    background: var(--signal);
    box-shadow: 0 0 0 0 rgba(34, 211, 238, 0.6);
    animation: live-pulse 1.6s ease-out infinite;
    position: relative;
    top: -0.05rem;
}
@keyframes live-pulse {
    0% { box-shadow: 0 0 0 0 rgba(34, 211, 238, 0.55); }
    100% { box-shadow: 0 0 0 0.6rem rgba(34, 211, 238, 0); }
}
@media (prefers-reduced-motion: reduce) {
    .live-activity .pulse { animation: none; }
}

/* Security screen (2026-09-09): where the security pass stands, scan by scan. */
.run-header h1 a.crumb { color: inherit; text-decoration: none; }
.run-header h1 a.crumb:hover { text-decoration: underline; }
.stages { list-style: none; display: flex; flex-wrap: wrap; gap: 0.35rem 1.4rem; padding: 0; margin: 0.4rem 0 0.6rem; }
.stage { display: flex; align-items: baseline; gap: 0.45rem; font-size: 0.9rem; color: var(--muted); }
.stage .dot { flex: none; width: 0.7rem; height: 0.7rem; border-radius: 50%; background: #d5d9e4; position: relative; top: 0.05rem; }
.stage.done { color: var(--ink); }
.stage.done .dot { background: #2e8b57; }
.stage.current { color: var(--ink); font-weight: 600; }
.stage.current .dot { background: var(--accent); box-shadow: 0 0 0 0.25rem rgba(79, 70, 229, 0.18); }
.stage.parked { color: #8a5a00; font-weight: 600; }
.stage.parked .dot { background: #d9a11c; }
.stage .detail { font-size: 0.78rem; color: var(--muted); font-weight: 400; }
.scan-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 0.8rem; margin-top: 0.4rem; }
.scan-card { border: 1px solid var(--line); border-radius: 8px; padding: 0.7rem 0.9rem; background: #fbfbfe; }
.scan-card.latest { border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent-soft); }
.scan-head { display: flex; align-items: baseline; gap: 0.6rem; margin-bottom: 0.4rem; }
.sev-bars { display: flex; flex-direction: column; gap: 3px; margin: 0.3rem 0 0.45rem; }
.sev-bar { height: 7px; border-radius: 3px; min-width: 2px; }
.sev-bar.high { background: #d94a44; }
.sev-bar.medium { background: #e6a23c; }
.sev-bar.low { background: #4d7fd1; }
.scan-counts { display: flex; gap: 0.4rem; flex-wrap: wrap; margin-bottom: 0.3rem; }
.scan-card .notes { margin-top: 0.3rem; }
.fixed-list { padding-left: 1.2rem; }
.fixed-list li { margin: 0.25rem 0; }
td.nowrap { white-space: nowrap; }
td.pre-line { white-space: pre-line; }

/* Findings tables (2026-09-09): the Fix column used to run past the panel edge and the
   punch button broke one word per line. Fixed layout, wrapping cells, a no-wrap action. */
table.security { table-layout: fixed; width: 100%; border-collapse: collapse; }
table.security th, table.security td { overflow-wrap: anywhere; word-break: break-word; }
table.security th:nth-child(1), table.security td:nth-child(1) { width: 7%; }
table.security th:nth-child(2), table.security td:nth-child(2) { width: 32%; }
table.security th:nth-child(3), table.security td:nth-child(3) { width: 22%; }
table.security th:nth-child(4), table.security td:nth-child(4) { width: 31%; }
table.security th:nth-child(5), table.security td:nth-child(5) { width: 8%; white-space: nowrap; text-align: right; }
table.security td code { white-space: normal; overflow-wrap: anywhere; }
table.security td:nth-child(5) button.linkish { white-space: nowrap; padding: 0.2rem 0; }
.table-wrap { overflow-x: auto; }
table.security th:nth-child(1), table.security td:nth-child(1) { width: 5.5rem; white-space: nowrap; overflow-wrap: normal; word-break: keep-all; }
table.security th:nth-child(5), table.security td:nth-child(5) { width: 7.5rem; white-space: normal; text-align: right; }
table.security td:nth-child(5) button.linkish { white-space: normal; text-align: right; }

/* ---- adopt existing source: the zip drop zone on the Runs page (2026-09-11) ---- */
.adopt-block { display: flex; flex-direction: column; gap: 0.45rem; }
.adopt-block > label { display: flex; flex-direction: column; gap: 0.3rem; font-size: 0.85rem; color: var(--muted); }
.drop-zone { position: relative; display: flex; flex-direction: column; align-items: center; gap: 0.3rem; padding: 1rem 1.2rem; border: 2px dashed #c3c9dd; border-radius: 8px; background: #fafbfe; text-align: center; font-size: 0.85rem; color: var(--ink); transition: border-color 0.15s, background 0.15s; }
.drop-zone:hover, .drop-zone.over { border-color: var(--accent); background: var(--accent-soft); }
.drop-zone.busy { border-style: solid; border-color: var(--accent); }
.drop-zone .muted { font-size: 0.78rem; line-height: 1.35; max-width: 42rem; }
.form-grid .drop-zone input[type=file] { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; padding: 0; border: 0; opacity: 0; cursor: pointer; }
.form-grid .drop-zone input[type=file]:disabled { cursor: progress; }
.upload-meter { display: block; width: min(100%, 24rem); height: 0.5rem; border-radius: 999px; background: #e3e7f2; overflow: hidden; }
.upload-meter > span { display: block; height: 100%; background: var(--accent); transition: width 0.2s; }
.adopt-block .upload-result { margin: 0; }

/* ---- layout refresh (2026-10-14): the page you are on is marked in the top bar, admin pages are
   grouped, panels lift off the background, focus is visible for keyboard users, wide screens get
   room for the run tables, and the version chip links to the About page. ---- */
.content { max-width: 1240px; }
.topbar { box-shadow: 0 1px 0 rgba(255, 255, 255, 0.06), 0 2px 10px rgba(16, 18, 52, 0.25); }
.topbar nav { align-items: center; }
.topbar nav a { padding: 0.28rem 0.65rem; border-radius: 999px; transition: background 0.15s, color 0.15s; }
.topbar nav a:hover { background: rgba(255, 255, 255, 0.08); color: #fff; }
.topbar nav a.active { background: rgba(255, 255, 255, 0.16); color: #fff; font-weight: 600; }
.topbar .nav-sep { display: inline-block; width: 1px; height: 1.1rem; background: rgba(255, 255, 255, 0.22); margin: 0 0.35rem; }
.topbar .version-chip { margin-left: 0.9rem; font-size: 0.72rem; font-weight: 600; letter-spacing: 0.02em; color: #c9cdf3; text-decoration: none; border: 1px solid rgba(255, 255, 255, 0.22); border-radius: 999px; padding: 0.08rem 0.5rem; }
.topbar .version-chip:hover { color: #fff; border-color: var(--signal); }
.panel { border-radius: 10px; box-shadow: 0 1px 2px rgba(23, 26, 46, 0.04), 0 4px 14px rgba(23, 26, 46, 0.04); }
h1 { letter-spacing: -0.01em; }
.panel table tbody tr:hover td { background: #fafbff; }
:is(a, button, input, select, textarea, summary):focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.form-grid input:focus, .form-grid select:focus, .form-grid textarea:focus, .ac-input:focus { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); outline: none; }
.tag.ok { background: #dff0ee; color: #17635c; }
.tag.warn { background: #fdf3d7; color: #8a6d1a; }
.tag.danger { background: #fbe3e0; color: #a12c1f; }
.notice { padding: 0.55rem 0.9rem; border-radius: 6px; font-size: 0.88rem; margin: 0.6rem 0; }
.notice.ok { background: #dff0ee; color: #17635c; }
.notice.warn { background: #fdf3d7; color: #8a6d1a; }
.notice.danger { background: #fbe3e0; color: #a12c1f; }
.check-inline { display: inline-flex; gap: 0.4rem; align-items: center; font-size: 0.88rem; }
dl.facts { display: grid; grid-template-columns: max-content 1fr; gap: 0.35rem 1.2rem; margin: 0; font-size: 0.9rem; }
dl.facts dt { color: var(--muted); }
dl.facts dd { margin: 0; overflow-wrap: anywhere; }
.version-number { font-size: 1.15rem; }
.version-verdict { display: flex; gap: 0.6rem; align-items: baseline; flex-wrap: wrap; margin: 0.5rem 0; }
/* reference files (2026-10-14): the Runs form list and the run page's cards */
.field-label { font-size: 0.85rem; color: var(--muted); }
.reference-list { list-style: none; padding: 0; margin: 0.2rem 0 0; display: flex; flex-direction: column; gap: 0.35rem; }
.reference-list li { display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem 0.6rem; font-size: 0.85rem; padding: 0.35rem 0.5rem; border: 1px solid var(--line); border-radius: 6px; background: #fbfbfe; }
.reference-list .name { overflow-wrap: anywhere; }
.reference-list .ac-input { flex: 1 1 260px; min-width: 0; font: inherit; padding: 0.25rem 0.45rem; border: 1px solid var(--line); border-radius: 5px; }
.reference-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0.8rem; margin: 0.6rem 0; }
.reference-card { margin: 0; border: 1px solid var(--line); border-radius: 8px; overflow: hidden; background: #fbfbfe; display: flex; flex-direction: column; }
.reference-card img { display: block; width: 100%; height: 130px; object-fit: cover; object-position: top; background: #eef0f4; }
.reference-card .doc { display: flex; align-items: center; justify-content: center; height: 130px; font-weight: 700; letter-spacing: 0.04em; color: var(--accent-strong); background: var(--accent-soft); text-decoration: none; }
.reference-card figcaption { padding: 0.45rem 0.6rem; font-size: 0.8rem; display: flex; flex-direction: column; gap: 0.15rem; overflow-wrap: anywhere; }
/* scope check on the Runs form (2026-10-14) */
.scope-check { display: flex; flex-direction: column; gap: 0.35rem; }
.scope-advice { border: 1px solid var(--line); border-left: 4px solid var(--signal); border-radius: 6px; background: #f7fbfd; padding: 0.7rem 0.9rem; font-size: 0.88rem; }
.scope-advice ul { margin: 0.2rem 0 0.6rem; padding-left: 1.3rem; }
.scope-advice pre.review-md { max-height: 320px; margin-top: 0.4rem; }
.tier-table td { vertical-align: top; }
.tier-table select { min-width: 13rem; max-width: 100%; }
@media (max-width: 720px) {
    /* the tier table stacks: one job per block, each privacy set labelled, nothing cut off */
    .panel table.tier-table, .panel table.tier-table tbody, .panel table.tier-table tr, .panel table.tier-table td { display: block; width: auto; overflow: visible; }
    .panel table.tier-table thead { display: none; }
    .panel table.tier-table tr { border-bottom: 1px solid var(--line); padding: 0.5rem 0; }
    .panel table.tier-table td { border: 0; padding: 0.25rem 0; white-space: normal; }
    .panel table.tier-table td:nth-child(2)::before { content: "Standard runs"; display: block; font-size: 0.78rem; color: var(--muted); }
    .panel table.tier-table td:nth-child(3)::before { content: "Restricted-privacy runs"; display: block; font-size: 0.78rem; color: var(--muted); }
    .tier-table select { min-width: 0; width: 100%; }
    .topbar .nav-sep { display: none; }
    .topbar .version-chip { margin-left: 0.5rem; }
    dl.facts { grid-template-columns: 1fr; }
    dl.facts dd { margin-bottom: 0.4rem; }
}