/* /Components/Pages/FixSimulator.razor.rz.scp.css */
/* Fix Simulator — the tool's "measurement instrument" CSS, themed onto the PageSpeedAudit light
   palette. The :root variables are remapped onto site tokens on the .fsim wrapper; --ink/--line/
   --warn/--bad intentionally inherit the site's (same roles). Global resets/masthead/body from the
   original are dropped (the site layout owns those); the colliding .panel/.field/.cta are prefixed. */
.fsim[b-neisnn09iu] {
    --ink-2:      var(--muted);
    --ink-3:      #8a9b91;
    --canvas:     var(--paper);
    --paper:      var(--card);
    --paper-2:    var(--wash);
    --line-2:     var(--line);

    --signal:     var(--brand);
    --signal-2:   var(--brand-strong);
    --signal-bg:  var(--brand-wash);
    --warn-bg:    #f6ecd6;
    --bad-bg:     #fbe7e5;
    --flat:       var(--muted);
    --flat-bg:    var(--wash);

    --radius:     var(--radius);
    --radius-sm:  var(--radius-sm);
    --shadow:     0 1px 2px rgba(13,33,23,.04), 0 8px 28px -18px rgba(13,33,23,.22);

    --display: var(--font-display);
    --body: var(--font-body);
    --mono: var(--font-mono);

    font-family: var(--body);
}
.fsim em[b-neisnn09iu] { font-style: normal; }
.fsim .hero h1[b-neisnn09iu] { max-width: 16ch; }
.fsim .lede em[b-neisnn09iu] { color: var(--signal-2); font-weight: 500; }

/* ---- Panels & fields ---- */
.fs-panel[b-neisnn09iu] {
    background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius);
    box-shadow: var(--shadow); padding: clamp(18px, 3.5vw, 26px); margin-bottom: 18px;
}
.panel-head[b-neisnn09iu] { margin-bottom: 16px; }
.panel-head h2[b-neisnn09iu], .results-head h2[b-neisnn09iu] {
    font-family: var(--display); font-weight: 600; font-size: 19px; letter-spacing: -.01em; margin: 0 0 4px;
}
.panel-sub[b-neisnn09iu], .field-hint[b-neisnn09iu] { color: var(--ink-3); font-size: 13.5px; margin: 0; }
.panel-sub em[b-neisnn09iu] { color: var(--ink-2); }

.fs-field[b-neisnn09iu] { display: flex; flex-direction: column; gap: 7px; margin-bottom: 18px; }
.fs-field:last-child[b-neisnn09iu] { margin-bottom: 0; }
.fs-field label[b-neisnn09iu] {
    font-size: 12.5px; font-weight: 600; color: var(--ink-2); letter-spacing: .01em;
    display: flex; align-items: baseline; gap: 8px;
}
.label-aside[b-neisnn09iu] {
    font-family: var(--mono); font-weight: 500; font-size: 10.5px; color: var(--ink-3);
    letter-spacing: .04em; text-transform: uppercase;
}

.fsim input[type="url"][b-neisnn09iu] {
    font-family: var(--mono); font-size: 15px; color: var(--ink); background: var(--paper-2);
    border: 1px solid var(--line-2); border-radius: var(--radius-sm); padding: 13px 14px; width: 100%;
    transition: border-color .15s, box-shadow .15s, background .15s;
}
.fsim input[type="url"][b-neisnn09iu]::placeholder { color: var(--ink-3); }
.fsim input[type="url"]:focus[b-neisnn09iu] {
    outline: none; background: var(--paper); border-color: var(--signal); box-shadow: 0 0 0 3px var(--signal-bg);
}
.field-hint[b-neisnn09iu] { margin-top: 1px; }
.field-row[b-neisnn09iu] { display: flex; gap: 22px; flex-wrap: wrap; }
.field-row .fs-field[b-neisnn09iu] { flex: 1 1 200px; margin-bottom: 18px; }

.segmented[b-neisnn09iu] { display: inline-flex; gap: 4px; padding: 4px; background: var(--paper-2); border: 1px solid var(--line); border-radius: var(--radius-sm); }
.seg[b-neisnn09iu] {
    font-family: var(--mono); font-size: 13px; font-weight: 500; color: var(--ink-2); background: transparent;
    border: none; border-radius: 5px; padding: 7px 16px; cursor: pointer; transition: background .12s, color .12s;
}
.seg:hover[b-neisnn09iu] { color: var(--ink); }
.seg-on[b-neisnn09iu] { background: var(--ink); color: #fff; box-shadow: 0 1px 2px rgba(13,33,23,.25); }
.seg-on:hover[b-neisnn09iu] { color: #fff; }

.fs-cta[b-neisnn09iu] {
    display: inline-flex; align-items: center; justify-content: center;
    font-family: var(--display); font-weight: 600; font-size: 15px; color: #fff; background: var(--brand);
    border: none; border-radius: var(--radius-sm); padding: 14px 24px; width: 100%; cursor: pointer; margin-top: 4px;
    transition: transform .08s, background .15s, box-shadow .15s; box-shadow: 0 1px 2px rgba(13,33,23,.2);
}
.fs-cta:hover:not(:disabled)[b-neisnn09iu] { background: var(--brand-strong); box-shadow: 0 6px 20px -10px rgba(13,33,23,.45); }
.fs-cta:active:not(:disabled)[b-neisnn09iu] { transform: translateY(1px); }
.fs-cta:disabled[b-neisnn09iu] { background: var(--line-2); color: #fff; cursor: not-allowed; box-shadow: none; }
.cta-note[b-neisnn09iu] { font-size: 12.5px; color: var(--ink-3); margin: 12px 0 0; max-width: 60ch; }

.form-error[b-neisnn09iu] { color: var(--bad); font-size: 13px; font-weight: 500; margin: 0 0 14px; }

.ghost[b-neisnn09iu] {
    font-family: var(--body); font-size: 13px; font-weight: 500; color: var(--ink-2); background: transparent;
    border: 1px solid var(--line-2); border-radius: 6px; padding: 7px 14px; cursor: pointer; transition: border-color .12s, color .12s;
}
.ghost:hover[b-neisnn09iu] { color: var(--ink); border-color: var(--ink-3); }

.run-context[b-neisnn09iu] {
    display: flex; align-items: center; gap: 14px; padding: 12px 16px; margin-bottom: 18px;
    background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius);
}
.rc-url[b-neisnn09iu] { font-family: var(--mono); font-size: 13px; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; flex: 1 1 auto; }
.rc-meta[b-neisnn09iu] { font-family: var(--mono); font-size: 11.5px; color: var(--ink-3); display: flex; gap: 7px; flex: 0 0 auto; }
.rc-meta .dot[b-neisnn09iu] { opacity: .5; }

.notice[b-neisnn09iu] { display: flex; gap: 12px; align-items: flex-start; padding: 13px 16px; margin-bottom: 14px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--paper); }
.notice p[b-neisnn09iu] { margin: 0; font-size: 13.5px; color: var(--ink-2); }
.notice code[b-neisnn09iu] { font-family: var(--mono); font-size: 12px; background: var(--paper-2); padding: 1px 5px; border-radius: 4px; border: 1px solid var(--line); }
.notice-key[b-neisnn09iu] { flex: 0 0 auto; font-family: var(--mono); font-size: 10.5px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; padding: 3px 8px; border-radius: 100px; margin-top: 1px; }
.notice-info .notice-key[b-neisnn09iu] { background: var(--flat-bg); color: var(--ink-2); }
.notice-warn[b-neisnn09iu] { border-color: #ecd9b4; background: var(--warn-bg); }
.notice-warn .notice-key[b-neisnn09iu] { background: var(--warn); color: #fff; }
.notice-block[b-neisnn09iu] { border-color: #efc9c4; background: var(--bad-bg); }
.notice-block .notice-key[b-neisnn09iu] { background: var(--bad); color: #fff; }

.progress-head[b-neisnn09iu] { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 12px; }
.progress-stage[b-neisnn09iu] { font-family: var(--mono); font-size: 11px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-2); }
.progress-pct[b-neisnn09iu] { font-family: var(--mono); font-size: 22px; font-weight: 600; color: var(--ink); font-variant-numeric: tabular-nums; }
.meter[b-neisnn09iu] { height: 6px; background: var(--paper-2); border: 1px solid var(--line); border-radius: 100px; overflow: hidden; }
.meter-fill[b-neisnn09iu] { height: 100%; background: linear-gradient(90deg, var(--signal-2), var(--signal)); border-radius: 100px; transition: width .4s cubic-bezier(.4,0,.1,1); }
.progress-label[b-neisnn09iu] { font-family: var(--mono); font-size: 12.5px; color: var(--ink-3); margin: 12px 0 0; }

.changes[b-neisnn09iu] { display: flex; flex-direction: column; gap: 9px; margin-bottom: 18px; }
.change[b-neisnn09iu] { display: flex; align-items: center; gap: 14px; padding: 14px 16px; cursor: pointer; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--paper); transition: border-color .12s, background .12s; }
.change:hover[b-neisnn09iu] { border-color: var(--line-2); background: var(--paper-2); }
.change-on[b-neisnn09iu] { border-color: var(--signal); background: var(--signal-bg); box-shadow: 0 0 0 1px var(--signal) inset; }
.change-on:hover[b-neisnn09iu] { background: var(--signal-bg); }
.change input[type="checkbox"][b-neisnn09iu] { width: 17px; height: 17px; accent-color: var(--signal); flex: 0 0 auto; cursor: pointer; }
.change-body[b-neisnn09iu] { display: flex; flex-direction: column; gap: 2px; flex: 1 1 auto; min-width: 0; }
.change-label[b-neisnn09iu] { font-weight: 600; font-size: 14.5px; color: var(--ink); }
.change-detail[b-neisnn09iu] { font-family: var(--mono); font-size: 11.5px; color: var(--ink-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.change-claim[b-neisnn09iu] { flex: 0 0 auto; font-family: var(--mono); font-size: 11px; font-weight: 600; color: var(--warn); background: var(--warn-bg); border: 1px solid #ecd9b4; padding: 4px 9px; border-radius: 100px; }

.nonsim[b-neisnn09iu] { border-top: 1px dashed var(--line-2); padding-top: 16px; margin-bottom: 18px; }
.nonsim-key[b-neisnn09iu] { font-size: 12.5px; color: var(--ink-3); display: block; margin-bottom: 10px; }
.nonsim ul[b-neisnn09iu] { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; }
.nonsim li[b-neisnn09iu] { display: grid; grid-template-columns: 1fr auto; align-items: baseline; gap: 2px 12px; font-size: 13px; color: var(--ink-2); padding: 7px 0; border-bottom: 1px solid var(--line); }
.nonsim li:last-child[b-neisnn09iu] { border-bottom: none; }
.nonsim-label[b-neisnn09iu] { font-weight: 600; color: var(--ink); }
.nonsim-reason[b-neisnn09iu] { grid-column: 1 / -1; font-size: 12px; color: var(--ink-3); }
.nonsim-claim[b-neisnn09iu] { font-family: var(--mono); font-size: 11px; color: var(--ink-3); white-space: nowrap; }

.results[b-neisnn09iu] { margin-top: 4px; }
.results-head[b-neisnn09iu] { margin: 26px 0 14px; }
.results-head:first-child[b-neisnn09iu] { margin-top: 0; }

.calib[b-neisnn09iu] { background: var(--paper); border: 1px solid var(--line); border-left: 3px solid var(--flat); border-radius: var(--radius); box-shadow: var(--shadow); padding: 20px 22px; margin-bottom: 14px; }
.calib-overclaim[b-neisnn09iu] { border-left-color: var(--warn); }
.calib-match[b-neisnn09iu], .calib-underclaim[b-neisnn09iu] { border-left-color: var(--signal); }
.calib-unverifiable[b-neisnn09iu] { border-left-color: var(--flat); border-style: dashed; }
.calib-head[b-neisnn09iu] { display: flex; justify-content: space-between; align-items: baseline; gap: 14px; margin-bottom: 16px; }
.calib-head h3[b-neisnn09iu] { font-family: var(--display); font-weight: 600; font-size: 16.5px; margin: 0; letter-spacing: -.01em; }
.calib-verdict[b-neisnn09iu] { flex: 0 0 auto; font-family: var(--mono); font-size: 12px; font-weight: 700; padding: 5px 11px; border-radius: 100px; }
.calib-overclaim .calib-verdict[b-neisnn09iu] { color: var(--warn); background: var(--warn-bg); }
.calib-match .calib-verdict[b-neisnn09iu], .calib-underclaim .calib-verdict[b-neisnn09iu] { color: var(--signal-2); background: var(--signal-bg); }
.calib-track[b-neisnn09iu] { display: flex; flex-direction: column; gap: 10px; }
.calib-row[b-neisnn09iu] { display: grid; grid-template-columns: 116px 1fr 88px; align-items: center; gap: 14px; }
.calib-tag[b-neisnn09iu] { font-family: var(--mono); font-size: 11px; color: var(--ink-3); letter-spacing: .03em; text-transform: uppercase; }
.bar[b-neisnn09iu] { height: 16px; background: var(--paper-2); border: 1px solid var(--line); border-radius: 5px; overflow: hidden; }
.bar-fill[b-neisnn09iu] { height: 100%; border-radius: 4px 0 0 4px; transition: width .7s cubic-bezier(.34,1.2,.4,1); }
.bar-claim .bar-fill[b-neisnn09iu] { background: repeating-linear-gradient(135deg, var(--warn) 0 6px, #c08a36 6px 12px); }
.bar-measured .bar-fill[b-neisnn09iu] { background: linear-gradient(90deg, var(--signal-2), var(--signal)); }
.calib-num[b-neisnn09iu] { font-family: var(--mono); font-size: 14px; font-weight: 600; text-align: right; color: var(--ink); font-variant-numeric: tabular-nums; }
.calib-note[b-neisnn09iu] { font-size: 13.5px; color: var(--ink-2); margin: 16px 0 0; line-height: 1.55; }

.comp[b-neisnn09iu] { margin-top: 18px; }
.comp-grid[b-neisnn09iu] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: var(--radius-sm); overflow: hidden; }
.comp-cell[b-neisnn09iu] { background: var(--paper); padding: 16px; display: flex; flex-direction: column; gap: 6px; }
.comp-k[b-neisnn09iu] { font-size: 11.5px; color: var(--ink-3); }
.comp-v[b-neisnn09iu] { font-family: var(--mono); font-size: 21px; font-weight: 600; color: var(--ink); font-variant-numeric: tabular-nums; }
.comp-overlap[b-neisnn09iu] { color: var(--warn); }
.comp-note[b-neisnn09iu] { font-size: 13.5px; color: var(--ink-2); margin: 14px 0 0; }

.arm[b-neisnn09iu] { background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); padding: 18px 20px; margin-bottom: 14px; }
.arm-head[b-neisnn09iu] { display: flex; align-items: baseline; gap: 12px; margin-bottom: 14px; }
.arm-head h3[b-neisnn09iu] { font-family: var(--display); font-weight: 600; font-size: 15.5px; margin: 0; }
.arm-failed[b-neisnn09iu] { font-family: var(--mono); font-size: 11px; color: var(--bad); }

.metric-table[b-neisnn09iu] { font-family: var(--mono); font-size: 12.5px; }
.mt-head[b-neisnn09iu], .mt-row[b-neisnn09iu] { display: grid; grid-template-columns: 1.3fr .9fr .9fr .9fr .9fr 1.5fr; align-items: center; gap: 8px; }
.mt-head[b-neisnn09iu] { color: var(--ink-3); font-size: 10.5px; letter-spacing: .04em; text-transform: uppercase; padding: 0 0 9px; border-bottom: 1px solid var(--line); }
.mt-row[b-neisnn09iu] { padding: 9px 0; border-bottom: 1px solid var(--paper-2); }
.mt-row:last-child[b-neisnn09iu] { border-bottom: none; }
.mt-metric[b-neisnn09iu] { font-family: var(--body); font-weight: 600; font-size: 13px; color: var(--ink); }
.mt-num[b-neisnn09iu] { text-align: right; font-variant-numeric: tabular-nums; color: var(--ink-2); }
.mt-delta[b-neisnn09iu] { font-weight: 600; }
.mt-delta.pos[b-neisnn09iu] { color: var(--signal-2); }
.mt-delta.neg[b-neisnn09iu] { color: var(--bad); }
.mt-floor[b-neisnn09iu] { color: var(--ink-3); }
.mt-verdict[b-neisnn09iu] { text-align: right; }

.chip[b-neisnn09iu] { display: inline-block; font-family: var(--mono); font-size: 10.5px; font-weight: 600; padding: 4px 9px; border-radius: 100px; white-space: nowrap; }
.chip-good[b-neisnn09iu] { color: var(--signal-2); background: var(--signal-bg); }
.chip-bad[b-neisnn09iu] { color: var(--bad); background: var(--bad-bg); }
.chip-flat[b-neisnn09iu] { color: var(--warn); background: var(--warn-bg); }
.chip-unknown[b-neisnn09iu] { color: var(--ink-2); background: var(--flat-bg); }

.tracks[b-neisnn09iu] { margin-top: 2px; }

.synthesis[b-neisnn09iu] { font-size: 14.5px; color: var(--ink); line-height: 1.55; margin: 0 0 18px; }

details.advanced[b-neisnn09iu] { margin-top: 8px; border-top: 1px solid var(--line); padding-top: 14px; }
details.detail[b-neisnn09iu] { margin-top: 18px; border-top: 1px solid var(--line); padding-top: 14px; }
details.advanced > summary[b-neisnn09iu], details.detail > summary[b-neisnn09iu] { cursor: pointer; font-family: var(--mono); font-size: 11.5px; color: var(--ink-2); letter-spacing: .03em; list-style: none; user-select: none; }
.fsim details > summary[b-neisnn09iu]::-webkit-details-marker { display: none; }
details.advanced > summary[b-neisnn09iu]::before, details.detail > summary[b-neisnn09iu]::before { content: "+ "; color: var(--ink-3); }
details[open].advanced > summary[b-neisnn09iu]::before, details[open].detail > summary[b-neisnn09iu]::before { content: "– "; }
details.detail .metric-table[b-neisnn09iu] { margin-top: 14px; }

.fsim code[b-neisnn09iu] { font-family: var(--mono); }

@media (max-width: 560px) {
    .calib-row[b-neisnn09iu] { grid-template-columns: 92px 1fr 72px; gap: 9px; }
    .calib-tag[b-neisnn09iu] { font-size: 10px; }
    .comp-grid[b-neisnn09iu] { grid-template-columns: 1fr; }
    .mt-head[b-neisnn09iu], .mt-row[b-neisnn09iu] { grid-template-columns: 1.2fr .9fr .9fr 1.4fr; }
    .mt-head span:nth-child(5)[b-neisnn09iu], .mt-row .mt-floor[b-neisnn09iu],
    .mt-head span:nth-child(2)[b-neisnn09iu], .mt-row span:nth-child(2)[b-neisnn09iu] { display: none; }
    .field-row[b-neisnn09iu] { gap: 14px; }
}

@media (prefers-reduced-motion: reduce) {
    .fsim *[b-neisnn09iu], .fsim *[b-neisnn09iu]::before, .fsim *[b-neisnn09iu]::after { animation: none !important; transition: none !important; }
}

/* ---- CrUX field data, run provenance, and PSI diagnostics (read-only context) ---- */
.rating[b-neisnn09iu] { font-weight: 600; }
.rating-good[b-neisnn09iu] { color: var(--signal-2); }
.rating-ni[b-neisnn09iu]   { color: var(--warn); }
.rating-poor[b-neisnn09iu] { color: var(--bad); }
.rating-flat[b-neisnn09iu] { color: var(--ink-3); }

.field-data[b-neisnn09iu] { display: flex; flex-direction: column; gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: var(--radius-sm); overflow: hidden; }
.fd-row[b-neisnn09iu] { display: flex; flex-direction: column; gap: 7px; background: var(--paper); padding: 11px 14px; }
.fd-head[b-neisnn09iu] { display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: 14px; }
.fd-metric[b-neisnn09iu] { font-family: var(--mono); font-size: 12.5px; font-weight: 600; color: var(--ink); }
.fd-value[b-neisnn09iu] { font-family: var(--mono); font-size: 13px; color: var(--ink-2); font-variant-numeric: tabular-nums; text-align: right; }
.fd-cat[b-neisnn09iu] { font-size: 10.5px; padding: 3px 9px; border-radius: 100px; white-space: nowrap; }
.fd-cat.rating-good[b-neisnn09iu] { background: var(--signal-bg); }
.fd-cat.rating-ni[b-neisnn09iu]   { background: var(--warn-bg); }
.fd-cat.rating-poor[b-neisnn09iu] { background: var(--bad-bg); }
.fd-cat.rating-flat[b-neisnn09iu] { background: var(--flat-bg); }
.fd-dist[b-neisnn09iu] { display: flex; height: 5px; border-radius: 3px; overflow: hidden; background: var(--flat-bg); }
.fd-seg[b-neisnn09iu] { height: 100%; }
.fd-seg.fd-good[b-neisnn09iu] { background: var(--signal-2); }
.fd-seg.fd-ni[b-neisnn09iu]   { background: var(--warn); }
.fd-seg.fd-poor[b-neisnn09iu] { background: var(--bad); }

.run-meta[b-neisnn09iu] { font-family: var(--mono); font-size: 11px; color: var(--ink-3); margin: -8px 2px 16px; }

.diag[b-neisnn09iu] { margin: 4px 0 18px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--paper); }
.diag > summary[b-neisnn09iu] { cursor: pointer; padding: 11px 14px; font-size: 12.5px; font-weight: 600; color: var(--ink-2); list-style: none; }
.diag > summary[b-neisnn09iu]::-webkit-details-marker { display: none; }
.diag > summary[b-neisnn09iu]::before { content: "▸ "; color: var(--ink-3); }
.diag[open] > summary[b-neisnn09iu]::before { content: "▾ "; }
.diag-body[b-neisnn09iu] { display: flex; flex-direction: column; gap: 1px; border-top: 1px solid var(--line); }
.diag-row[b-neisnn09iu] { display: flex; justify-content: space-between; align-items: baseline; gap: 14px; padding: 9px 14px; }
.diag-title[b-neisnn09iu] { font-size: 12.5px; color: var(--ink-2); }
.diag-val[b-neisnn09iu] { font-family: var(--mono); font-size: 12px; color: var(--ink); font-variant-numeric: tabular-nums; white-space: nowrap; }

/* ---- "How loading actually changed" wrapper (the TimelineCompare component styles itself) ---- */
.tlc-section-head[b-neisnn09iu] { margin-top: 36px; }
.tlc-wrap[b-neisnn09iu] { border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--paper); margin-bottom: 12px; }
.tlc-wrap > summary[b-neisnn09iu] { cursor: pointer; padding: 13px 16px; font-family: var(--display); font-weight: 600; font-size: 14px; color: var(--ink); list-style: none; }
.tlc-wrap > summary[b-neisnn09iu]::-webkit-details-marker { display: none; }
.tlc-wrap > summary[b-neisnn09iu]::before { content: "▸"; color: var(--ink-3); margin-right: 9px; font-size: 11px; }
.tlc-wrap[open] > summary[b-neisnn09iu]::before { content: "▾"; }
/* /Components/Pages/SpeedRevenueCalculator.razor.rz.scp.css */
/* Speed → Revenue · scoped styles, themed to the PageSpeedAudit design system.
   The whole component is wrapped in .psa, which remaps the tool's internal variables onto the
   site's light tokens. --ink / --line / --good / --warn are intentionally NOT redefined here, so
   they inherit the site's :root values (dark ink, light border, brand green, amber). */
.psa[b-qcerjzw6gg]{
  --bg:var(--card);
  --panel:var(--card);
  --panel-2:var(--wash);
  --raise:var(--wash-deep);
  --line-2:var(--line);
  --line-strong:#c6d5cc;
  --ink-mid:var(--muted);
  --ink-dim:#6a7c72;
  --ink-faint:#93a69b;
  --accent:var(--brand);
  --accent-2:var(--brand-strong);
  --accent-deep:var(--brand-deep);
  --accent-soft:var(--brand-wash);
  --accent-line:#bcdcc8;
  --good-soft:#e3f2e8;
  --warn-soft:#f6ecd6;
  --poor:var(--bad);
  --poor-soft:#fbe7e5;
  /* Vivid data-viz palette for the CWV gauge + dots (decorative; rating *text* keeps the
     accessible site colors). Bright but harmonised with the brand green. */
  --gauge-good:#1aa05a;
  --gauge-warn:#e0a52e;
  --gauge-poor:#e4524a;
  --mono:var(--font-mono);
  --disp:var(--font-display);
  --body:var(--font-body);
  --r:var(--radius);
  --r-sm:var(--radius-sm);
  --r-lg:18px;
  font-feature-settings:"tnum";
}
.psa *[b-qcerjzw6gg]{box-sizing:border-box;}

/* ---------- hero accents (the rest of the hero uses site .hero/.eyebrow/.lede) ---------- */
.sr-em[b-qcerjzw6gg]{position:relative; white-space:nowrap;}
.sr-em[b-qcerjzw6gg]::after{content:""; position:absolute; left:0; right:0; bottom:.06em; height:.34em; background:var(--accent-soft); border-bottom:2px solid var(--accent-line); z-index:-1; border-radius:2px;}

/* ---------- input ---------- */
.sr-inputrow[b-qcerjzw6gg]{margin-top:clamp(1.4rem,3vw,1.9rem); display:flex; gap:.6rem; max-width:42rem;}
.sr-field[b-qcerjzw6gg]{flex:1; display:flex; align-items:center; gap:.7rem; background:var(--card); border:1px solid var(--line); border-radius:var(--r); padding:0 1.1rem; box-shadow:0 1px 2px rgba(13,33,23,.04); transition:border-color .15s, box-shadow .15s;}
.sr-field:focus-within[b-qcerjzw6gg]{border-color:var(--accent); box-shadow:0 0 0 4px rgba(13,107,60,.14);}
.sr-field .pre[b-qcerjzw6gg]{color:var(--ink-faint); flex:none; display:block;}
.sr-field input[b-qcerjzw6gg]{flex:1; background:transparent; border:0; outline:0; color:var(--ink); font-family:var(--mono); font-size:1.02rem; padding:1.05rem 0; letter-spacing:-.01em; min-width:0;}
.sr-field input[b-qcerjzw6gg]::placeholder{color:var(--ink-faint);}
.sr-go[b-qcerjzw6gg]{flex:none; white-space:nowrap;}
.sr-go .arrow[b-qcerjzw6gg]{margin-left:.15rem;}

.sr-meta[b-qcerjzw6gg]{display:flex; align-items:center; gap:1rem; margin-top:.9rem; flex-wrap:wrap;}
.sr-seg[b-qcerjzw6gg]{display:inline-flex; padding:3px; gap:2px; background:var(--wash); border:1px solid var(--line); border-radius:999px;}
.sr-seg button[b-qcerjzw6gg]{appearance:none; border:0; background:transparent; color:var(--ink-dim); font-family:var(--mono); font-size:.72rem; letter-spacing:.05em; padding:.4rem .85rem; border-radius:999px; cursor:pointer; transition:.15s;}
.sr-seg button.on[b-qcerjzw6gg]{background:var(--card); color:var(--ink); box-shadow:0 1px 2px rgba(13,33,23,.08);}
.sr-tiny[b-qcerjzw6gg]{font-family:var(--mono); font-size:.72rem; color:var(--ink-dim); letter-spacing:.01em;}

/* ---------- loading ---------- */
.sr-loading[b-qcerjzw6gg]{border:1px solid var(--line); border-radius:var(--r-lg); background:var(--card); box-shadow:var(--shadow-1); padding:2.4rem 1.75rem; position:relative; overflow:hidden;}
.sr-loading .scan[b-qcerjzw6gg]{position:absolute; top:0; left:-40%; width:40%; height:2px; background:linear-gradient(90deg,transparent,var(--accent),transparent); animation:psa-scan-b-qcerjzw6gg 1.5s ease-in-out infinite;}
@keyframes psa-scan-b-qcerjzw6gg{0%{left:-40%}100%{left:100%}}
.lmsg[b-qcerjzw6gg]{font-family:var(--disp); font-weight:600; font-size:1.25rem; color:var(--ink);}
.lsub[b-qcerjzw6gg]{font-family:var(--mono); font-size:.75rem; color:var(--ink-dim); margin-top:.5rem; letter-spacing:.01em;}

/* ---------- results scaffold ---------- */
.results[b-qcerjzw6gg]{display:flex; flex-direction:column; gap:1.15rem;}
.sr-panel[b-qcerjzw6gg]{background:var(--card); border:1px solid var(--line-soft); border-radius:var(--r-lg); padding:1.7rem 1.9rem; box-shadow:0 1px 2px rgba(13,33,23,.04), 0 14px 36px -18px rgba(13,33,23,.22); position:relative;}
.phead[b-qcerjzw6gg]{display:flex; align-items:center; justify-content:space-between; margin-bottom:1.4rem; gap:.9rem; flex-wrap:wrap;}
.ptag[b-qcerjzw6gg]{display:flex; align-items:center; gap:.75rem;}
.pnum[b-qcerjzw6gg]{font-family:var(--mono); font-size:.7rem; color:var(--ink-faint); letter-spacing:.14em;}
.ptitle[b-qcerjzw6gg]{font-family:var(--mono); font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-mid);}
.pill[b-qcerjzw6gg]{font-family:var(--mono); font-size:.7rem; letter-spacing:.03em; padding:.3rem .7rem; border-radius:999px; border:1px solid var(--line); color:var(--ink-mid); background:var(--wash); display:inline-flex; align-items:center; gap:.45rem; white-space:nowrap;}
.pill .d[b-qcerjzw6gg]{width:6px;height:6px;border-radius:50%;}
.d.good[b-qcerjzw6gg]{background:var(--gauge-good);} .d.warn[b-qcerjzw6gg]{background:var(--gauge-warn);} .d.poor[b-qcerjzw6gg]{background:var(--gauge-poor);}

/* ---------- baseline panel ---------- */
.baseline[b-qcerjzw6gg]{display:grid; grid-template-columns:minmax(240px,1fr) 1.25fr; gap:2rem; align-items:center;}
.lcpbig[b-qcerjzw6gg]{display:flex; align-items:flex-end; gap:1rem;}
.lcpbig .sr-num[b-qcerjzw6gg]{font-family:var(--disp); font-weight:600; font-size:5.1rem; line-height:.82; letter-spacing:-.04em; color:var(--ink);}
.lcpbig .unit[b-qcerjzw6gg]{font-family:var(--disp); font-size:1.6rem; color:var(--ink-dim); font-weight:500; transform:translateY(-6px);}
.lcpmeta[b-qcerjzw6gg]{margin-top:.9rem;}
.lcpmeta .lbl[b-qcerjzw6gg]{font-size:.85rem; color:var(--ink-mid); line-height:1.45;}
.lcpmeta .rate[b-qcerjzw6gg]{display:inline-flex; align-items:center; gap:.5rem; margin-top:.5rem; font-family:var(--mono); font-size:.72rem; letter-spacing:.03em;}
.lcpmeta .rate .d[b-qcerjzw6gg]{width:7px;height:7px;border-radius:50%;}
.rate.rgood[b-qcerjzw6gg]{color:var(--good);} .rate.rgood .d[b-qcerjzw6gg]{background:var(--gauge-good);}
.rate.rwarn[b-qcerjzw6gg]{color:var(--warn);} .rate.rwarn .d[b-qcerjzw6gg]{background:var(--gauge-warn);}
.rate.rpoor[b-qcerjzw6gg]{color:var(--poor);} .rate.rpoor .d[b-qcerjzw6gg]{background:var(--gauge-poor);}

/* speed map — NOW → recoverable best, with scenario waypoints */
.speedmap[b-qcerjzw6gg]{min-width:0;}
.sm-head[b-qcerjzw6gg]{font-family:var(--mono); font-size:.66rem; color:var(--ink-dim); letter-spacing:.05em; margin-bottom:3.25rem; display:flex; justify-content:space-between; gap:1rem;}
.sm-wrap[b-qcerjzw6gg]{position:relative; height:14px; margin-bottom:1.9rem;}
.sm-track[b-qcerjzw6gg]{position:absolute; inset:0; border-radius:7px;}
.sm-track[b-qcerjzw6gg]::after{content:""; position:absolute; inset:0; border-radius:7px; box-shadow:inset 0 0 0 1px rgba(13,33,23,.10);}
.sm-bound[b-qcerjzw6gg]{position:absolute; top:-2px; bottom:-2px; width:1px; background:rgba(13,33,23,.32); z-index:2;}
.sm-bl[b-qcerjzw6gg]{position:absolute; top:calc(100% + 9px); transform:translateX(-50%); font-family:var(--mono); font-size:.6rem; color:var(--ink-faint); letter-spacing:.04em; white-space:nowrap;}
.sm-move[b-qcerjzw6gg]{position:absolute; top:50%; height:6px; transform:translateY(-50%); border-radius:3px; background:linear-gradient(90deg, var(--gauge-good), var(--gauge-warn)); opacity:.85; z-index:3; transform-origin:right center; animation:psa-move-b-qcerjzw6gg .7s cubic-bezier(.22,.61,.36,1) both;}
.sm-move[b-qcerjzw6gg]::before{content:""; position:absolute; left:-1px; top:50%; transform:translateY(-50%); border-top:6px solid transparent; border-bottom:6px solid transparent; border-right:8px solid var(--gauge-good);}
.sm-wrap .dot[b-qcerjzw6gg]{position:absolute; top:50%; width:9px; height:9px; border-radius:50%; background:var(--card); border:2px solid var(--accent-deep); transform:translate(-50%,-50%); box-shadow:0 1px 3px rgba(13,33,23,.3); z-index:4;}
@keyframes psa-move-b-qcerjzw6gg{from{transform:translateY(-50%) scaleX(0);} to{transform:translateY(-50%) scaleX(1);}}
.sm-now[b-qcerjzw6gg]{position:absolute; top:-7px; bottom:-7px; width:2px; background:var(--ink); border-radius:2px; box-shadow:0 0 0 3px var(--card), 0 1px 5px rgba(13,33,23,.32); z-index:6;}
.sm-now .lab[b-qcerjzw6gg]{position:absolute; bottom:calc(100% + 9px); left:50%; transform:translateX(-50%); font-family:var(--disp); font-weight:600; font-size:.88rem; white-space:nowrap; color:var(--ink); text-align:center;}
.sm-now .lab b[b-qcerjzw6gg]{font-family:var(--mono); font-size:.56rem; font-weight:500; letter-spacing:.16em; color:var(--ink-dim); display:block; margin-bottom:.25rem;}
.sm-dest[b-qcerjzw6gg]{position:absolute; top:calc(100% + 9px); transform:translateX(-50%); font-family:var(--disp); font-weight:600; font-size:.84rem; color:var(--ink-mid); white-space:nowrap; z-index:5;}
.sm-dest.ok[b-qcerjzw6gg]{color:var(--good);}
.sm-ann[b-qcerjzw6gg]{font-size:.84rem; color:var(--ink-mid); line-height:1.55; max-width:460px;}
.sm-ann b[b-qcerjzw6gg]{color:var(--ink); font-weight:600;}
.sm-ann .good[b-qcerjzw6gg]{color:var(--good);}
.sm-ann .warnt[b-qcerjzw6gg]{color:var(--warn);}
.chips[b-qcerjzw6gg]{display:flex; gap:.6rem; margin-top:1.4rem; flex-wrap:wrap;}
.chip[b-qcerjzw6gg]{flex:1; min-width:112px; background:var(--wash); border:1px solid var(--line); border-radius:var(--r-sm); padding:.75rem .85rem;}
.chip .k[b-qcerjzw6gg]{font-family:var(--mono); font-size:.64rem; letter-spacing:.08em; color:var(--ink-dim); text-transform:uppercase; display:flex; align-items:center; gap:.45rem;}
.chip .v[b-qcerjzw6gg]{font-family:var(--disp); font-size:1.5rem; font-weight:600; margin-top:.4rem; color:var(--ink);}
.chip.muted[b-qcerjzw6gg]{opacity:.85;}
.chip .ex[b-qcerjzw6gg]{font-family:var(--mono); font-size:.58rem; color:var(--ink-faint); letter-spacing:.02em; margin-top:.3rem; text-transform:uppercase;}

/* ---------- revenue input ---------- */
.revrow[b-qcerjzw6gg]{display:flex; align-items:center; gap:1.1rem; flex-wrap:wrap;}
.revfield[b-qcerjzw6gg]{display:flex; align-items:center; background:var(--wash); border:1px solid var(--line); border-radius:var(--r); padding:0 .25rem 0 1.1rem; transition:border-color .15s, box-shadow .15s;}
.revfield:focus-within[b-qcerjzw6gg]{border-color:var(--accent); box-shadow:0 0 0 3px rgba(13,107,60,.16);}
.revfield .cur[b-qcerjzw6gg]{font-family:var(--disp); font-size:1.6rem; color:var(--ink-dim); font-weight:500;}
.revfield input[b-qcerjzw6gg]{width:160px; background:transparent;border:0;outline:0;color:var(--ink); font-family:var(--disp); font-weight:600; font-size:1.85rem; padding:.6rem .5rem .6rem .4rem; letter-spacing:-.02em;}
.perseg[b-qcerjzw6gg]{display:inline-flex; padding:3px; gap:2px; background:var(--card); border:1px solid var(--line); border-radius:10px;}
.perseg button[b-qcerjzw6gg]{appearance:none;border:0;background:transparent;color:var(--ink-dim);font-family:var(--mono);font-size:.72rem;letter-spacing:.03em;padding:.5rem .85rem;border-radius:8px;cursor:pointer;}
.perseg button.on[b-qcerjzw6gg]{background:var(--brand);color:#fff;}
.revhint[b-qcerjzw6gg]{font-size:.82rem;color:var(--ink-dim);max-width:300px;line-height:1.45;}

/* ---------- scenario ladder (signature) ---------- */
.ladder-cap[b-qcerjzw6gg]{font-family:var(--mono);font-size:.7rem;color:var(--ink-dim);letter-spacing:.03em;}
.ladder[b-qcerjzw6gg]{margin-top:.5rem;}
.lad-row[b-qcerjzw6gg]{display:grid; grid-template-columns:168px 1fr; gap:1.5rem; align-items:center; padding:1.6rem 0; border-top:1px solid var(--line-soft);}
.lad-row:first-child[b-qcerjzw6gg]{border-top:0; padding-top:.85rem;}
.lad-name[b-qcerjzw6gg]{font-family:var(--disp); font-weight:600; font-size:1.1rem; color:var(--ink);}
.lad-sub[b-qcerjzw6gg]{font-family:var(--mono); font-size:.7rem; color:var(--ink-dim); margin-top:.4rem; letter-spacing:.01em;}
.lad-sub .ar[b-qcerjzw6gg]{color:var(--accent-2);} .lad-sub .gd[b-qcerjzw6gg], .gd[b-qcerjzw6gg]{color:var(--good);}
.bar-wrap[b-qcerjzw6gg]{position:relative; padding-top:3.15rem;}
.bartrack[b-qcerjzw6gg]{position:relative; height:16px; background:var(--wash); border:1px solid var(--line); border-radius:9px;}
.barfill[b-qcerjzw6gg]{position:absolute; top:-1px; bottom:-1px; border-radius:9px;
  background:linear-gradient(90deg, rgba(13,107,60,.18), rgba(13,107,60,.42)); border:1px solid var(--accent-line);}
.barcen[b-qcerjzw6gg]{position:absolute; top:-5px; width:3px; height:24px; background:var(--accent-deep); border-radius:2px; box-shadow:0 1px 5px rgba(13,107,60,.4); z-index:2;}
.barval[b-qcerjzw6gg]{position:absolute; top:0; transform:translateX(-50%); white-space:nowrap; text-align:center; z-index:3;}
.barval.r[b-qcerjzw6gg]{transform:translateX(-100%); text-align:right;}
.barval .m[b-qcerjzw6gg]{font-family:var(--disp); font-weight:600; font-size:1.35rem; color:var(--ink); line-height:1;}
.barval .p[b-qcerjzw6gg]{font-family:var(--mono); font-size:.66rem; color:var(--ink-mid); margin-top:.3rem; letter-spacing:.01em;}
.barval .p .pc[b-qcerjzw6gg]{color:var(--accent-2);}
.axis[b-qcerjzw6gg]{position:relative; height:26px; margin-top:.4rem; margin-left:192px;}
.axis .t[b-qcerjzw6gg]{position:absolute; top:6px; transform:translateX(-50%); font-family:var(--mono); font-size:.62rem; color:var(--ink-faint);}
.axis .t[b-qcerjzw6gg]::before{content:"";position:absolute;top:-8px;left:50%;width:1px;height:5px;background:var(--line);}
.ladder-foot[b-qcerjzw6gg]{margin-top:1.1rem; font-size:.78rem; color:var(--ink-dim); display:flex; gap:.5rem; align-items:flex-start; line-height:1.5;}
.ladder-foot b[b-qcerjzw6gg]{color:var(--ink-mid); font-weight:600;}
.ladder-foot .mk[b-qcerjzw6gg]{color:var(--accent-2);}

/* ---------- slope explorer ---------- */
.slope[b-qcerjzw6gg]{display:grid; grid-template-columns:1fr; gap:.25rem;}
.slope-hud[b-qcerjzw6gg]{display:flex; align-items:center; justify-content:space-between; gap:1.25rem; margin-bottom:1.1rem; padding:1rem 1.25rem; background:var(--wash); border:1px solid var(--line); border-radius:var(--r); flex-wrap:wrap;}
.slope-hud .blk .k[b-qcerjzw6gg]{font-family:var(--mono); font-size:.62rem; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-dim); margin-bottom:.3rem;}
.slope-hud .tval[b-qcerjzw6gg]{font-family:var(--disp); font-weight:600; font-size:1.75rem; color:var(--ink); line-height:1;}
.slope-hud .tval-delta[b-qcerjzw6gg]{font-family:var(--mono);font-size:.72rem;color:var(--ink-dim);font-weight:400;}
.slope-hud .rhs[b-qcerjzw6gg]{text-align:right; margin-left:auto;}
.slope-hud .mval[b-qcerjzw6gg]{font-family:var(--disp); font-weight:600; font-size:2.1rem; color:var(--ink); line-height:1; letter-spacing:-.02em;}
.slope-hud .mval .un[b-qcerjzw6gg]{font-family:var(--mono); font-size:.8rem; color:var(--ink-dim); font-weight:400; margin-left:.25rem;}
.slope-hud .pct[b-qcerjzw6gg]{font-family:var(--mono); font-size:.72rem; color:var(--accent-2); margin-top:.45rem;}
.slope-hud .pct .hint-inline[b-qcerjzw6gg]{color:var(--ink-dim);}
.curvebox[b-qcerjzw6gg]{position:relative; border:1px solid var(--line); border-radius:var(--r); background:var(--wash); padding:1.1rem 1.1rem .6rem;}
.curve-area[b-qcerjzw6gg]{position:relative; height:188px;}
.curve-pts[b-qcerjzw6gg]{position:absolute; inset:0; pointer-events:none;}
.cpt[b-qcerjzw6gg]{position:absolute; transform:translate(-50%,-50%);}
.cpt .cdot[b-qcerjzw6gg]{display:block; width:9px; height:9px; border-radius:50%; background:var(--card); border:2px solid var(--ink-dim); margin:0 auto; box-shadow:0 0 0 3px var(--card), 0 1px 2px rgba(13,33,23,.25);}
.cpt.acc .cdot[b-qcerjzw6gg]{border-color:var(--accent); box-shadow:0 0 0 3px var(--card), 0 1px 4px rgba(13,107,60,.45);}
.cpt .clab[b-qcerjzw6gg]{position:absolute; bottom:calc(100% + 6px); left:50%; transform:translateX(-50%); font-family:var(--mono); font-size:.6rem; white-space:nowrap; color:var(--ink-dim);}
.cpt.acc .clab[b-qcerjzw6gg]{color:var(--accent-2); font-weight:600;}
.cpt.below .clab[b-qcerjzw6gg]{bottom:auto; top:calc(100% + 6px);}
.curve-yhint[b-qcerjzw6gg]{position:absolute; left:1.1rem; top:.85rem; font-family:var(--mono); font-size:.62rem; color:var(--ink-dim); letter-spacing:.03em;}
.curve-x[b-qcerjzw6gg]{display:flex; justify-content:space-between; font-family:var(--mono); font-size:.62rem; color:var(--ink-faint); margin-top:.4rem;}
.sliderrow[b-qcerjzw6gg]{margin-top:1rem;}
.psa input[type=range][b-qcerjzw6gg]{-webkit-appearance:none; appearance:none; width:100%; height:4px; border-radius:3px; background:var(--line); outline:0;}
.psa input[type=range][b-qcerjzw6gg]::-webkit-slider-thumb{-webkit-appearance:none; width:18px;height:18px;border-radius:50%; background:var(--card); border:3px solid var(--accent); box-shadow:0 0 0 4px var(--card),0 1px 5px rgba(13,33,23,.28); cursor:pointer;}
.psa input[type=range][b-qcerjzw6gg]::-moz-range-thumb{width:18px;height:18px;border-radius:50%; background:var(--card); border:3px solid var(--accent); box-shadow:0 0 0 4px var(--card),0 1px 5px rgba(13,33,23,.28); cursor:pointer;}
.slope-cap[b-qcerjzw6gg]{margin-top:1rem; font-size:.78rem; color:var(--ink-dim); line-height:1.55; max-width:680px;}
.slope-cap b[b-qcerjzw6gg]{color:var(--ink-mid); font-weight:600;}

/* ---------- opportunities ---------- */
.opp[b-qcerjzw6gg]{display:flex; flex-direction:column; gap:1px; background:var(--line); border-radius:var(--r); overflow:hidden; border:1px solid var(--line);}
.opp-row[b-qcerjzw6gg]{display:grid; grid-template-columns:1fr auto auto; gap:1.1rem; align-items:center; padding:.9rem 1.1rem; background:var(--card);}
.opp-row .name[b-qcerjzw6gg]{font-size:.9rem; color:var(--ink);}
.opp-row .by[b-qcerjzw6gg]{font-family:var(--mono); font-size:.72rem; color:var(--ink-dim);}
.opp-row .ms[b-qcerjzw6gg]{font-family:var(--disp); font-weight:600; font-size:1rem; color:var(--accent-2); min-width:86px; text-align:right;}
.opp-foot[b-qcerjzw6gg]{margin-top:.9rem; font-family:var(--mono); font-size:.7rem; color:var(--ink-dim); letter-spacing:.01em;}

/* ---------- honesty ---------- */
.honest[b-qcerjzw6gg]{background:radial-gradient(600px 300px at 100% 0%, var(--brand-wash), transparent 60%), var(--wash); border:1px solid var(--line);}
.honest h2[b-qcerjzw6gg]{font-family:var(--disp); font-weight:600; font-size:1.6rem; letter-spacing:-.02em; margin:.1rem 0 .5rem; color:var(--ink);}
.honest .sub[b-qcerjzw6gg]{color:var(--ink-mid); font-size:.95rem; max-width:680px; line-height:1.55; margin-bottom:1.5rem;}
.hgrid[b-qcerjzw6gg]{display:grid; grid-template-columns:1fr 1fr; gap:.9rem 1.75rem; margin-bottom:1.6rem;}
.hitem[b-qcerjzw6gg]{display:flex; gap:.8rem; align-items:flex-start;}
.hitem .ic[b-qcerjzw6gg]{flex:none; width:26px;height:26px;border-radius:8px; background:var(--accent-soft); border:1px solid var(--accent-line); display:grid;place-items:center; color:var(--accent-2); font-family:var(--mono); font-size:.78rem; font-weight:600;}
.hitem .tx[b-qcerjzw6gg]{font-size:.85rem; color:var(--ink-mid); line-height:1.5;}
.hitem .tx b[b-qcerjzw6gg]{color:var(--ink); font-weight:600; display:block; margin-bottom:.15rem; font-size:.85rem;}
.sr-cta[b-qcerjzw6gg]{display:flex; align-items:center; gap:1.1rem; flex-wrap:wrap; padding-top:1.4rem; border-top:1px solid var(--line);}
.sr-cta .links[b-qcerjzw6gg]{display:flex; gap:1.1rem; font-family:var(--mono); font-size:.75rem; flex-wrap:wrap;}
.sr-cta .links a[b-qcerjzw6gg]{color:var(--ink-mid); text-decoration:none; border-bottom:1px solid var(--line); padding-bottom:2px;}
.sr-cta .links a:hover[b-qcerjzw6gg]{color:var(--accent-2); border-color:var(--accent-line);}

.foot[b-qcerjzw6gg]{margin-top:1.75rem; text-align:center; font-family:var(--mono); font-size:.68rem; color:var(--ink-faint); letter-spacing:.02em; line-height:1.7;}
.foot a[b-qcerjzw6gg]{color:var(--ink-dim);text-decoration:none;}

@media (max-width:780px){
  .baseline[b-qcerjzw6gg]{grid-template-columns:1fr; gap:1.6rem;}
  .lad-row[b-qcerjzw6gg]{grid-template-columns:1fr; gap:.65rem;}
  .axis[b-qcerjzw6gg]{margin-left:0;}
  .hgrid[b-qcerjzw6gg]{grid-template-columns:1fr;}
  .lcpbig .sr-num[b-qcerjzw6gg]{font-size:3.9rem;}
  .sr-inputrow[b-qcerjzw6gg]{flex-wrap:wrap;}
  .sr-go[b-qcerjzw6gg]{width:100%; justify-content:center;}
}

@media (prefers-reduced-motion: reduce){
  .sr-loading .scan[b-qcerjzw6gg]{animation:none;}
  .sm-move[b-qcerjzw6gg]{animation:none;}
}
/* /Components/Pages/SpeedTrack.razor.rz.scp.css */
/* Speed track — its own scoped styles. The --signal/--warn/--paper… variables cascade from the
   page's .fsim wrapper (CSS custom properties inherit through the DOM regardless of scope). */
.track[b-n633sqw7jf] { margin-bottom: 20px; }
.track:last-child[b-n633sqw7jf] { margin-bottom: 0; }
.track-head[b-n633sqw7jf] { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 9px; flex-wrap: wrap; }
.track-metric[b-n633sqw7jf] { font-family: var(--mono); font-size: 12.5px; font-weight: 600; color: var(--ink); letter-spacing: .02em; }
.track-readout[b-n633sqw7jf] { font-size: 12.5px; color: var(--ink-3); display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; }
.rating[b-n633sqw7jf] { font-family: var(--mono); font-weight: 600; }
.rating-good[b-n633sqw7jf] { color: var(--signal-2); }
.rating-ni[b-n633sqw7jf] { color: var(--warn); }
.rating-poor[b-n633sqw7jf] { color: var(--bad); }
.rating-flat[b-n633sqw7jf] { color: var(--ink-3); }
.rating-word[b-n633sqw7jf] { color: var(--ink-3); }
.track-arrow[b-n633sqw7jf] { color: var(--ink-3); }
.delta-chip[b-n633sqw7jf] { font-family: var(--mono); font-size: 11px; font-weight: 600; padding: 3px 8px; border-radius: 100px; margin-left: 2px; }
.delta-good[b-n633sqw7jf] { color: var(--signal-2); background: var(--signal-bg); }
.delta-bad[b-n633sqw7jf] { color: var(--bad); background: var(--bad-bg); }
.delta-flat[b-n633sqw7jf] { color: var(--ink-2); background: var(--flat-bg); }
.track-band-wrap[b-n633sqw7jf] { position: relative; height: 24px; }
.track-band[b-n633sqw7jf] { position: absolute; top: 8px; left: 0; right: 0; height: 8px; display: flex; border-radius: 5px; overflow: hidden; }
.zone[b-n633sqw7jf] { height: 100%; }
.zone-good[b-n633sqw7jf] { background: var(--signal-bg); }
.zone-ni[b-n633sqw7jf] { background: var(--warn-bg); }
.zone-poor[b-n633sqw7jf] { background: var(--bad-bg); }
.connector[b-n633sqw7jf] { position: absolute; top: 11px; height: 2px; border-radius: 2px; }
.connector-good[b-n633sqw7jf] { background: var(--signal); }
.connector-bad[b-n633sqw7jf] { background: var(--bad); }
.connector-flat[b-n633sqw7jf] { background: var(--ink-3); }
.marker[b-n633sqw7jf] { position: absolute; top: 5px; width: 14px; height: 14px; border-radius: 50%; transform: translateX(-50%); box-shadow: 0 0 0 2px var(--paper); }
.marker-base[b-n633sqw7jf] { background: var(--paper); border: 2px solid var(--ink-3); }
.marker-after[b-n633sqw7jf] { background: var(--signal); border: 2px solid var(--paper); }
/* /Components/Pages/TimelineCompare.razor.rz.scp.css */
/* Side-by-side loading timeline. Colour tokens (--ink, --line, --mono, …) cascade in from the
   .fsim wrapper of the Fix Simulator page that hosts this component. */
.tlc[b-ntz87jtc30] { padding: 4px 16px 18px; }
.tlc-warn[b-ntz87jtc30] { background: var(--warn-bg); border: 1px solid var(--warn); border-radius: var(--radius-sm); color: var(--ink); font-size: 12.5px; line-height: 1.5; padding: 10px 13px; margin-bottom: 14px; }

.tlc-cols[b-ntz87jtc30] { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.tlc-col[b-ntz87jtc30] { min-width: 0; }
.tlc-head[b-ntz87jtc30] { display: flex; flex-direction: column; gap: 2px; padding-bottom: 10px; border-bottom: 1px solid var(--line); margin-bottom: 12px; }
.tlc-arm[b-ntz87jtc30] { font-family: var(--display); font-weight: 600; font-size: 14px; color: var(--ink); }
.tlc-var[b-ntz87jtc30] { font-family: var(--mono); font-size: 11px; color: var(--ink-3); font-variant-numeric: tabular-nums; }

/* Filmstrip — both arms sampled at identical tick times */
.tlc-film[b-ntz87jtc30] { display: grid; gap: 3px; margin-bottom: 14px; }
.tlc-frame[b-ntz87jtc30] { display: flex; flex-direction: column; align-items: center; gap: 3px; min-width: 0; }
.tlc-frame img[b-ntz87jtc30] { width: 100%; height: auto; max-height: 150px; object-fit: contain; border: 1px solid var(--line); border-radius: 2px; background: var(--canvas); }
.tlc-frame-blank[b-ntz87jtc30] { width: 100%; padding-top: 130%; border: 1px dashed var(--line); border-radius: 2px; background: repeating-linear-gradient(45deg, var(--paper), var(--paper) 4px, var(--paper-2) 4px, var(--paper-2) 8px); }
.tlc-frame-t[b-ntz87jtc30] { font-family: var(--mono); font-size: 9.5px; color: var(--ink-3); }

/* Shared ruler */
.tlc-ruler[b-ntz87jtc30] { position: relative; height: 15px; border-top: 1px solid var(--line-2); margin-bottom: 3px; }
.tlc-tick[b-ntz87jtc30] { position: absolute; top: 1px; transform: translateX(-50%); font-family: var(--mono); font-size: 9.5px; color: var(--ink-3); white-space: nowrap; }

/* Waterfall */
.tlc-wf[b-ntz87jtc30] { position: relative; }
.tlc-wf-rows[b-ntz87jtc30] { display: flex; flex-direction: column; gap: 2px; }
.tlc-row[b-ntz87jtc30] { display: grid; grid-template-columns: 132px 1fr; gap: 8px; align-items: center; height: 14px; }
.tlc-row-label[b-ntz87jtc30] { font-family: var(--mono); font-size: 10px; color: var(--ink-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tlc-row.is-block .tlc-row-label[b-ntz87jtc30] { color: var(--bad); }
.tlc-row.is-block .tlc-row-label[b-ntz87jtc30]::before { content: "●"; font-size: 7px; vertical-align: middle; margin-right: 4px; }
.tlc-track[b-ntz87jtc30] { position: relative; height: 10px; background: var(--flat-bg); border-radius: 2px; }
.tlc-bar[b-ntz87jtc30] { position: absolute; top: 1px; height: 8px; min-width: 2px; display: flex; border-radius: 2px; overflow: hidden; }
.tlc-bar-wait[b-ntz87jtc30] { height: 100%; background: var(--ink-3); opacity: 0.35; flex: 0 0 auto; }
.tlc-bar-dl[b-ntz87jtc30] { height: 100%; flex: 1 1 auto; background: var(--ink-2); }
.tlc-script .tlc-bar-dl[b-ntz87jtc30] { background: var(--warn); }
.tlc-css .tlc-bar-dl[b-ntz87jtc30] { background: var(--signal); }
.tlc-img .tlc-bar-dl[b-ntz87jtc30] { background: #3E8E6E; }
.tlc-font .tlc-bar-dl[b-ntz87jtc30] { background: #7C5CF0; }
.tlc-doc .tlc-bar-dl[b-ntz87jtc30] { background: var(--ink-2); }
.tlc-other .tlc-bar-dl[b-ntz87jtc30] { background: #9AA0A6; }

/* FCP / LCP markers, overlaid on the track area (which starts at 140px = 132 label + 8 gap) */
.tlc-lines[b-ntz87jtc30] { position: absolute; top: 0; bottom: 0; left: 140px; right: 0; pointer-events: none; }
.tlc-line[b-ntz87jtc30] { position: absolute; top: 0; bottom: 0; width: 0; }
.tlc-fcp[b-ntz87jtc30] { border-left: 1px dashed #2E8B6F; }
.tlc-lcp[b-ntz87jtc30] { border-left: 1px dashed #4F6BED; }

.tlc-wf-foot[b-ntz87jtc30] { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 8px; font-family: var(--mono); font-size: 10px; color: var(--ink-3); }
.tlc-legend[b-ntz87jtc30] { display: flex; gap: 11px; flex-wrap: wrap; }
.tlc-key[b-ntz87jtc30] { display: inline-flex; align-items: center; gap: 4px; }
.tlc-sw[b-ntz87jtc30] { width: 9px; height: 9px; border-radius: 2px; display: inline-block; }
.tlc-fcp-sw[b-ntz87jtc30] { background: #2E8B6F; }
.tlc-lcp-sw[b-ntz87jtc30] { background: #4F6BED; }
.tlc-wait-sw[b-ntz87jtc30] { background: var(--ink-3); opacity: 0.4; }
.tlc-dl-sw[b-ntz87jtc30] { background: var(--signal); }

/* Main-thread occupancy */
.tlc-mt[b-ntz87jtc30] { display: grid; grid-template-columns: 132px 1fr; gap: 8px; align-items: center; height: 14px; margin-top: 12px; }
.tlc-mt .tlc-track[b-ntz87jtc30] { height: 11px; }
.tlc-mt-label[b-ntz87jtc30] { font-family: var(--mono); font-size: 10px; color: var(--ink-2); }
.tlc-task[b-ntz87jtc30] { position: absolute; top: 1px; height: 9px; min-width: 2px; border-radius: 2px; background: var(--warn); opacity: 0.55; }
.tlc-task.is-mid[b-ntz87jtc30] { opacity: 0.9; }
.tlc-task.is-heavy[b-ntz87jtc30] { background: var(--bad); opacity: 0.9; }

.tlc-empty[b-ntz87jtc30] { font-size: 12px; color: var(--ink-3); padding: 10px 0; }
.tlc-mt-empty[b-ntz87jtc30] { padding: 4px 0 0; }
.tlc-note[b-ntz87jtc30] { font-size: 11.5px; line-height: 1.55; color: var(--ink-3); margin-top: 16px; padding-top: 12px; border-top: 1px solid var(--line); }

@media (max-width: 900px) {
  .tlc-cols[b-ntz87jtc30] { grid-template-columns: 1fr; gap: 26px; }
}