/* Waiting-list viewer — shared by the web page and the Shiny app. */
.wlv {
  --wlv-surface: #fcfcfb;
  --wlv-plane: #f4f4f1;
  --wlv-ink: #0b0b0b;
  --wlv-ink2: #52514e;
  --wlv-muted: #898781;
  --wlv-grid: #e8e7e1;
  --wlv-axis: #c3c2b7;
  --wlv-zone: rgba(11, 11, 11, 0.035);
  --wlv-border: rgba(11, 11, 11, 0.10);
  --wlv-accent: #0f766e;
  --wlv-accent-fill: #0f766e;
  --wlv-on-accent: #ffffff;
  --wlv-accent-soft: rgba(15, 118, 110, 0.10);
  /* blood groups: O, A, B, AB (shapes carry identity too) */
  --wlv-bg-0: #2a78d6; --wlv-bg-1: #eb6834; --wlv-bg-2: #1baf7a; --wlv-bg-3: #e87ba4;
  /* disease groups, fixed order */
  --wlv-dg-0: #2a78d6; --wlv-dg-1: #eb6834; --wlv-dg-2: #1baf7a; --wlv-dg-3: #eda100;
  --wlv-dg-4: #e87ba4; --wlv-dg-5: #008300; --wlv-dg-6: #6250d6; --wlv-dg-7: #898781;
  --wlv-tx: #0f766e; --wlv-gone: #9a3412; --wlv-follow: #111110; --wlv-ok: #15803d; --wlv-off: #b42318;
  --wlv-age-0: #1baf7a; --wlv-age-1: #2a78d6; --wlv-age-2: #eb6834; --wlv-age-3: #6250d6;
  --wlv-pt-0: #2a78d6; --wlv-pt-1: #e87ba4; --wlv-pt-2: #eda100; --wlv-pt-3: #008300;

  color: var(--wlv-ink);
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 14px;
  line-height: 1.4;
  outline: none;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .wlv {
    --wlv-surface: #1a1a19; --wlv-plane: #121211; --wlv-ink: #f0efec; --wlv-ink2: #c3c2b7;
    --wlv-muted: #8f8d86; --wlv-grid: #2c2c2a; --wlv-axis: #45453f; --wlv-zone: rgba(255,255,255,0.035);
    --wlv-border: rgba(255,255,255,0.10); --wlv-accent: #2dd4bf; --wlv-on-accent: #062b27; --wlv-accent-soft: rgba(45,212,191,0.12);
    --wlv-bg-0: #3987e5; --wlv-bg-1: #d95926; --wlv-bg-2: #199e70; --wlv-bg-3: #d55181;
    --wlv-dg-0: #3987e5; --wlv-dg-1: #d95926; --wlv-dg-2: #199e70; --wlv-dg-3: #c98500;
    --wlv-dg-4: #d55181; --wlv-dg-5: #008300; --wlv-dg-6: #9085e9; --wlv-dg-7: #8f8d86;
    --wlv-tx: #2dd4bf; --wlv-gone: #f59e7a; --wlv-follow: #fafaf7; --wlv-ok: #4ade80; --wlv-off: #fca5a5; --wlv-age-0: #199e70; --wlv-age-1: #3987e5; --wlv-age-2: #d95926; --wlv-age-3: #9085e9; --wlv-pt-0: #3987e5; --wlv-pt-1: #d55181; --wlv-pt-2: #c98500; --wlv-pt-3: #008300;
  }
}
:root[data-theme="dark"] .wlv {
  --wlv-surface: #1a1a19; --wlv-plane: #121211; --wlv-ink: #f0efec; --wlv-ink2: #c3c2b7;
  --wlv-muted: #8f8d86; --wlv-grid: #2c2c2a; --wlv-axis: #45453f; --wlv-zone: rgba(255,255,255,0.035);
  --wlv-border: rgba(255,255,255,0.10); --wlv-accent: #2dd4bf; --wlv-on-accent: #062b27; --wlv-accent-soft: rgba(45,212,191,0.12);
  --wlv-bg-0: #3987e5; --wlv-bg-1: #d95926; --wlv-bg-2: #199e70; --wlv-bg-3: #d55181;
  --wlv-dg-0: #3987e5; --wlv-dg-1: #d95926; --wlv-dg-2: #199e70; --wlv-dg-3: #c98500;
  --wlv-dg-4: #d55181; --wlv-dg-5: #008300; --wlv-dg-6: #9085e9; --wlv-dg-7: #8f8d86;
  --wlv-ok: #4ade80; --wlv-off: #fca5a5; --wlv-tx: #2dd4bf; --wlv-gone: #f59e7a; --wlv-follow: #fafaf7; --wlv-age-0: #199e70; --wlv-age-1: #3987e5; --wlv-age-2: #d95926; --wlv-age-3: #9085e9; --wlv-pt-0: #3987e5; --wlv-pt-1: #d55181; --wlv-pt-2: #c98500; --wlv-pt-3: #008300;
}

.wlv button { font: inherit; color: inherit; }

/* header ------------------------------------------------------------------ */
.wlv-head {
  display: flex; flex-wrap: wrap; align-items: stretch; gap: 12px; margin-bottom: 10px;
}
.wlv-clock {
  min-width: 150px; padding: 8px 14px; border-radius: 10px;
  background: var(--wlv-accent-soft); color: var(--wlv-ink);
  display: flex; flex-direction: column; justify-content: center;
}
.wlv-clock-year { font-size: 22px; font-weight: 700; letter-spacing: -0.01em; line-height: 1.1; }
.wlv-clock-week { font-size: 12px; color: var(--wlv-ink2); font-variant-numeric: tabular-nums; white-space: pre; }
.wlv-tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; flex: 1 1 380px; }
.wlv-tile {
  padding: 8px 12px; border-radius: 10px; background: var(--wlv-surface);
  box-shadow: inset 0 0 0 1px var(--wlv-border);
}
.wlv-tile-v { font-size: 22px; font-weight: 650; line-height: 1.15; font-variant-numeric: tabular-nums; }
.wlv-tile-l { font-size: 12px; color: var(--wlv-ink2); }

/* toolbar ----------------------------------------------------------------- */
.wlv-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-bottom: 8px; }
.wlv-seg-label { font-size: 12px; color: var(--wlv-ink2); }
.wlv-seg {
  display: inline-flex; padding: 2px; border-radius: 8px; background: var(--wlv-plane);
  box-shadow: inset 0 0 0 1px var(--wlv-border);
}
.wlv-seg-btn {
  border: 0; background: transparent; padding: 5px 12px; border-radius: 6px; cursor: pointer;
  font-size: 13px; color: var(--wlv-ink2);
}
.wlv-seg-btn.is-on { background: var(--wlv-surface); color: var(--wlv-ink); font-weight: 600;
  box-shadow: 0 1px 2px rgba(0,0,0,0.12), inset 0 0 0 1px var(--wlv-border); }
.wlv-legend { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; }
.wlv-chip {
  display: inline-flex; align-items: center; gap: 5px; padding: 3px 9px 3px 6px; border-radius: 999px;
  border: 0; background: transparent; cursor: pointer; font-size: 13px;
  box-shadow: inset 0 0 0 1px var(--wlv-border);
}
.wlv-chip:hover { background: var(--wlv-zone); }
.wlv-chip[aria-pressed="true"] { box-shadow: inset 0 0 0 1.5px var(--wlv-ink2); font-weight: 600; }
.wlv-chip.is-dim { opacity: 0.45; }
.wlv-chip-sw { width: 14px; height: 14px; }
.wlv-legend-note { font-size: 12px; color: var(--wlv-muted); margin-left: 4px; }

/* stage ------------------------------------------------------------------- */
.wlv-stage {
  position: relative; border-radius: 12px; overflow: hidden; background: var(--wlv-surface);
  box-shadow: inset 0 0 0 1px var(--wlv-border);
}
.wlv-canvas { display: block; touch-action: manipulation; }
.wlv-empty {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  color: var(--wlv-muted); font-size: 15px; pointer-events: none;
}
.wlv-empty[hidden] { display: none; }

/* tooltip ----------------------------------------------------------------- */
.wlv-tip {
  position: absolute; z-index: 5; width: max-content; max-width: 270px; pointer-events: none;
  padding: 10px 12px; border-radius: 10px; font-size: 12.5px;
  background: var(--wlv-surface); color: var(--wlv-ink);
  box-shadow: 0 6px 24px rgba(0,0,0,0.16), 0 0 0 1px var(--wlv-border);
}
.wlv-tip[hidden] { display: none; }
.wlv-tip-head { display: flex; align-items: center; gap: 7px; font-size: 13.5px; margin-bottom: 6px; }
.wlv-tip-key { width: 10px; height: 10px; border-radius: 50%; flex: none; }
.wlv-tip-total { margin-left: auto; color: var(--wlv-ink2); font-size: 12px; padding-left: 12px; }
.wlv-pill {
  display: inline-block; padding: 2px 8px; border-radius: 999px; font-size: 11.5px; font-weight: 600;
  margin-bottom: 6px; background: var(--wlv-zone); color: var(--wlv-ink2);
}
.wlv-pill-tx { background: var(--wlv-accent-soft); color: var(--wlv-tx); }
.wlv-pill-gone { color: var(--wlv-gone); background: rgba(154, 52, 18, 0.10); }
.wlv-tip-rows { display: grid; grid-template-columns: auto 1fr; gap: 2px 12px; margin: 0; }
.wlv-tip-rows dt { color: var(--wlv-ink2); }
.wlv-tip-rows dd { margin: 0; font-weight: 600; font-variant-numeric: tabular-nums; }
.wlv-tip-foot { margin-top: 7px; font-size: 11px; color: var(--wlv-muted); }
.wlv-tip-series { display: grid; gap: 2px; }
.wlv-tip-srow { display: grid; grid-template-columns: 14px 34px 1fr; align-items: center; gap: 6px; }
.wlv-tip-srow strong { text-align: right; font-variant-numeric: tabular-nums; }
.wlv-tip-line { width: 14px; height: 3px; border-radius: 2px; }

/* playback ---------------------------------------------------------------- */
.wlv-play { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; margin-top: 10px; }
.wlv-btn {
  min-width: 38px; height: 36px; padding: 0 10px; border-radius: 8px; border: 0; cursor: pointer;
  background: var(--wlv-plane); box-shadow: inset 0 0 0 1px var(--wlv-border); font-size: 14px;
}
.wlv-btn:hover { background: var(--wlv-zone); }
.wlv-btn-play { min-width: 56px; background: var(--wlv-accent-fill); color: #ffffff !important; box-shadow: none; font-size: 15px; }
.wlv-btn-play:hover { background: var(--wlv-accent-fill); filter: brightness(1.08); }
.wlv-speed { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--wlv-ink2); margin-left: 4px; }
.wlv-speed select {
  font: inherit; font-size: 13px; color: var(--wlv-ink); background: var(--wlv-surface);
  border: 1px solid var(--wlv-border); border-radius: 7px; padding: 5px 6px;
}
.wlv-scrub { flex: 1 1 200px; accent-color: var(--wlv-accent); min-width: 160px; }
.wlv-event {
  /* room for two lines is always kept, so the panels below do not jump as the text wraps from week to week */
  line-height: 1.45; min-height: calc(2 * 1.45em); margin: 6px 2px 0; font-size: 13px; color: var(--wlv-ink2); font-variant-numeric: tabular-nums;
}
@media (max-width: 760px) { .wlv-event { min-height: calc(3 * 1.45em); } }
@media (max-width: 480px) { .wlv-event { min-height: calc(4 * 1.45em); } }

/* panels ------------------------------------------------------------------ */
.wlv-panels { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: 14px; margin-top: 14px; }
.wlv-panel { padding: 12px 14px; border-radius: 12px; background: var(--wlv-surface); box-shadow: inset 0 0 0 1px var(--wlv-border); min-width: 0; }
.wlv-panel h3 { margin: 0; font-size: 14px; font-weight: 650; }
.wlv-panel-sub { margin: 2px 0 8px; font-size: 12px; color: var(--wlv-ink2); }
.wlv-comp-wrap { position: relative; }
.wlv-comp { display: block; }
.wlv-table-wrap { overflow-x: auto; }
.wlv-table { width: 100%; border-collapse: collapse; font-size: 12.5px; font-variant-numeric: tabular-nums; }
.wlv-table th, .wlv-table td { padding: 5px 6px; border-bottom: 1px solid var(--wlv-grid); text-align: left; white-space: nowrap; }
.wlv-table thead th { font-weight: 600; color: var(--wlv-ink2); font-size: 11.5px; white-space: normal; vertical-align: bottom; }
.wlv-table .num { text-align: right; }
.wlv-table tbody th { font-weight: 500; }
.wlv-table tr.is-total th, .wlv-table tr.is-total td { font-weight: 650; border-bottom: 0; border-top: 1px solid var(--wlv-axis); }
.wlv-table tr.is-dim { opacity: 0.45; }
.wlv-table-key { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 6px; vertical-align: 0; }

@media (max-width: 900px) {
  .wlv-panels { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .wlv-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); flex-basis: 100%; }
  .wlv-clock { flex: 1 1 100%; flex-direction: row; align-items: baseline; gap: 10px; }
  .wlv-tile-v { font-size: 19px; }
  .wlv-legend-note { flex-basis: 100%; margin-left: 0; }
  .wlv-scrub { flex-basis: 100%; order: 10; }
}

/* score selector, richer tooltip ---------------------------------------- */
.wlv .wlv-select {
  width: auto; font: inherit; font-size: 13px; color: var(--wlv-ink); background: var(--wlv-surface);
  border: 1px solid var(--wlv-border); border-radius: 7px; padding: 5px 6px;
}
.wlv-tip { max-width: 300px; }
.wlv-tip-scores { border-collapse: collapse; width: 100%; margin: 6px 0 4px; font-variant-numeric: tabular-nums; }
.wlv-tip-scores th, .wlv-tip-scores td { padding: 1px 6px 1px 0; text-align: right; font-weight: 600; }
.wlv-tip-scores th:first-child { text-align: left; font-weight: 400; color: var(--wlv-ink2); }
.wlv-tip-scores tr:first-child th { font-size: 11px; color: var(--wlv-muted); font-weight: 500; }
.wlv-tip-scores tr.is-axis th:first-child { color: var(--wlv-ink); font-weight: 650; }
.wlv-tip-labs { font-size: 11.5px; color: var(--wlv-ink2); margin-bottom: 5px; }

/* end-of-run report ---------------------------------------------------- */
.wlv-report { margin-top: 26px; padding-top: 18px; border-top: 1px solid var(--wlv-grid); display: grid; gap: 14px; }
.wlv-report-head h2 { margin: 0; font-size: 18px; font-weight: 700; letter-spacing: -0.01em; }
.wlv-rtiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 8px; }
.wlv-rgrid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; }
.wlv-rtables { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; }
.wlv-cmp-btn { margin: 4px 0 10px; }
.wlv-table tr.is-current th, .wlv-table tr.is-current td { background: var(--wlv-accent-soft); font-weight: 650; }
@media (max-width: 900px) { .wlv-rgrid { grid-template-columns: 1fr; } }

.wlv-tip-note { margin: 4px 0 6px; font-size: 11.5px; line-height: 1.35; color: var(--wlv-ink2, #52514e); max-width: 300px; }

/* saved strategies ------------------------------------------------------ */
.wls { display: grid; gap: 14px; }
.wls { --wls-0: var(--wlv-dg-0); --wls-1: var(--wlv-dg-1); --wls-2: var(--wlv-dg-2); --wls-3: var(--wlv-dg-6);
  --wls-4: var(--wlv-dg-4); --wls-5: var(--wlv-dg-3); --wls-6: var(--wlv-dg-5); --wls-7: var(--wlv-dg-7);
  --wls-good: #15803d; --wls-bad: #b42318; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .wls { --wls-good: #4ade80; --wls-bad: #f97066; } }
:root[data-theme="dark"] .wls { --wls-good: #4ade80; --wls-bad: #f97066; }
.wls-c0 { background: var(--wls-0); } .wls-c1 { background: var(--wls-1); } .wls-c2 { background: var(--wls-2); } .wls-c3 { background: var(--wls-3); }
.wls-c4 { background: var(--wls-4); } .wls-c5 { background: var(--wls-5); } .wls-c6 { background: var(--wls-6); } .wls-c7 { background: var(--wls-7); }
.wls-f0 { fill: var(--wls-0); } .wls-f1 { fill: var(--wls-1); } .wls-f2 { fill: var(--wls-2); } .wls-f3 { fill: var(--wls-3); }
.wls-f4 { fill: var(--wls-4); } .wls-f5 { fill: var(--wls-5); } .wls-f6 { fill: var(--wls-6); } .wls-f7 { fill: var(--wls-7); }
.wls-s0 { stroke: var(--wls-0); } .wls-s1 { stroke: var(--wls-1); } .wls-s2 { stroke: var(--wls-2); } .wls-s3 { stroke: var(--wls-3); }
.wls-s4 { stroke: var(--wls-4); } .wls-s5 { stroke: var(--wls-5); } .wls-s6 { stroke: var(--wls-6); } .wls-s7 { stroke: var(--wls-7); }
.wls-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.wls-head > .explain { display: contents; }
.wls-head > .explain > .explain-body { flex-basis: 100%; margin-top: 2px; }
.wls .explain-body { font-size: 12.5px; }
.wls-tag { display: inline-grid; place-items: center; min-width: 20px; height: 20px; padding: 0 4px; border-radius: 6px;
  color: #fff; font-size: 11.5px; font-weight: 700; flex: none; vertical-align: 1px; }
.wls-btn { font: inherit; font-size: 12.5px; padding: 5px 10px; border-radius: 8px; border: 0; cursor: pointer; white-space: nowrap;
  color: var(--wlv-ink); background: var(--wlv-plane); box-shadow: inset 0 0 0 1px var(--wlv-border); }
.wls-btn:hover:not(:disabled) { box-shadow: inset 0 0 0 1px var(--wlv-accent); }
.wls-btn:disabled { opacity: 0.45; cursor: default; }
.wls-btn-main { background: var(--wlv-accent-fill); color: #ffffff; box-shadow: none; font-weight: 650; }
.wls-btn-main:hover:not(:disabled) { box-shadow: none; filter: brightness(1.07); }
.wls-btn-quiet { background: transparent; }
.wls-btn-del:hover:not(:disabled) { box-shadow: inset 0 0 0 1px var(--wls-bad); color: var(--wls-bad); }
.wls-save { display: grid; gap: 6px; }
.wls-cur { margin: 0; font-size: 13px; color: var(--wlv-ink2); }
.wls-cur strong { color: var(--wlv-ink); }
.wls-save-row { display: flex; gap: 8px; flex-wrap: wrap; }
.wls-name, .wls-item-name { font: inherit; font-size: 16px; color: var(--wlv-ink); background: var(--wlv-surface);
  border: 1px solid var(--wlv-border); border-radius: 8px; padding: 5px 8px; min-width: 0; }
.wls-name { flex: 1 1 200px; }
.wls-run { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 10px; padding: 8px 10px; border-radius: 10px;
  background: var(--wlv-accent-soft); font-size: 12.5px; font-variant-numeric: tabular-nums; }
.wls-run[hidden] { display: none; }
.wls-run-text { flex: 1 1 220px; }
.wls-bar { flex: 1 1 120px; height: 6px; border-radius: 3px; background: var(--wlv-border); overflow: hidden; }
.wls-bar > span { display: block; height: 100%; width: 0; background: var(--wlv-accent); transition: width 0.2s; }
.wls-list { display: grid; gap: 8px; margin-top: 12px; }
.wls-empty { margin: 0; font-size: 13px; color: var(--wlv-ink2); }
.wls-item { padding: 8px 10px; border-radius: 10px; box-shadow: inset 0 0 0 1px var(--wlv-border); display: grid; gap: 4px; }
.wls-item.is-stale { box-shadow: inset 0 0 0 1px var(--wls-bad); }
.wls-item-top { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.wls-item-name { flex: 1 1 160px; font-size: 14px; font-weight: 600; border-color: transparent; background: transparent; padding: 3px 6px; }
.wls-item-name:hover, .wls-item-name:focus { border-color: var(--wlv-border); background: var(--wlv-surface); }
.wls-item-seeds { font-size: 12px; color: var(--wlv-ink2); font-variant-numeric: tabular-nums; }
.wls-item-diff { margin: 0; font-size: 12px; color: var(--wlv-ink2); }
.wls-item-acts { display: flex; gap: 6px; flex-wrap: wrap; }
.wls-warn { color: var(--wls-bad) !important; }
p.wls-warn { margin: 0; font-size: 12px; }
.wls-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; margin-top: 12px;
  padding-top: 10px; border-top: 1px solid var(--wlv-grid); }
.wls-keep { margin: 0; font-size: 13px; }
.wls-keep input { accent-color: var(--wlv-accent); }
.wls-foot-acts { display: flex; gap: 4px; flex-wrap: wrap; }
.wls-compare[hidden] { display: none; }
.wls-controls { display: flex; gap: 10px; flex-wrap: wrap; margin: 4px 0 8px; }
.wls-ctl { display: grid; gap: 2px; font-size: 12px; color: var(--wlv-ink2); flex: 1 1 220px; }
.wls-ctl select { font: inherit; font-size: 14px; color: var(--wlv-ink); background: var(--wlv-surface);
  border: 1px solid var(--wlv-border); border-radius: 8px; padding: 5px 6px; width: 100%; }
.wls-chips { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 8px; }
.wls-chip { display: inline-flex; align-items: center; gap: 6px; font: inherit; font-size: 12.5px; padding: 3px 9px 3px 4px; border-radius: 999px;
  border: 0; cursor: pointer; color: var(--wlv-ink); background: var(--wlv-surface); box-shadow: inset 0 0 0 1px var(--wlv-border); max-width: 100%; }
.wls-chip.is-off { opacity: 0.45; }
.wls-chip.is-off .wls-tag { background: var(--wlv-muted); }
.wls-cmp-body { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; min-width: 0; }
.wls-cmp-body > *, .wls > * { min-width: 0; }
.wls { grid-template-columns: minmax(0, 1fr); }
.wls-table td.wls-verdict { white-space: normal; font-weight: 600; min-width: 120px; font-size: 12px; }
.wls-verdict.is-good { color: var(--wls-good); }
.wls-verdict.is-bad { color: var(--wls-bad); }
.wls-table tbody th { white-space: normal; min-width: 140px; }
.wls-note { margin: 0; font-size: 12px; color: var(--wlv-ink2); }
.wls-chart h4, .wls-curves h4 { margin: 4px 0 4px; font-size: 13px; font-weight: 650; }
.wls-svg { display: block; max-width: 100%; height: auto; overflow: visible; }
.wls-grid { stroke: var(--wlv-grid); stroke-width: 1; }
.wls-axis { stroke: var(--wlv-axis); stroke-width: 1; }
.wls-axis-t { fill: var(--wlv-muted); font-size: 10px; font-variant-numeric: tabular-nums; }
.wls-base-band { fill: var(--wlv-zone); }
.wls-row-l { font-size: 12px; font-weight: 700; }
.wls-dot { fill-opacity: 0.6; cursor: pointer; }
.wls-dot:hover, .wls-dot:focus { fill-opacity: 1; stroke: var(--wlv-ink); stroke-width: 1.2; outline: none; }
.wls-mean { stroke: var(--wlv-ink); stroke-width: 2.2; }
.wls-range { stroke-width: 2.5; stroke-linecap: round; opacity: 0.85; }
.wls-line { fill: none; stroke-width: 2; }
.wls-band { fill-opacity: 0.13; }
.wls-end-l { font-size: 11px; font-weight: 700; }
.wls-curve-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.wls-seg { display: inline-flex; border-radius: 8px; box-shadow: inset 0 0 0 1px var(--wlv-border); overflow: hidden; }
.wls-seg button { font: inherit; font-size: 12px; padding: 4px 9px; border: 0; background: transparent; color: var(--wlv-ink2); cursor: pointer; }
.wls-seg button[aria-pressed="true"] { background: var(--wlv-accent-fill); color: #ffffff; }
.wls-groups > summary { cursor: pointer; font-size: 13px; font-weight: 650; padding: 4px 0; }
.wls-groups[open] > summary { margin-bottom: 4px; }
@media (prefers-reduced-motion: reduce) { .wls-bar > span { transition: none; } }
.wls-head > .explain > summary { margin-left: auto; }

/* results header: seed arrows, combine seeds, UK figures ------------------ */
.wlv-rtop { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; }
.wlv-rctl { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; font-size: 13px; }
.wlv-seednav { display: inline-flex; align-items: center; gap: 4px; }
.wlv-seedbtn { min-width: 34px; font-size: 17px; line-height: 1; padding: 4px 8px; }
.wlv-seedbtn:disabled { opacity: 0.4; cursor: default; }
.wlv-seedlab { min-width: 86px; text-align: center; font-weight: 600; font-variant-numeric: tabular-nums; }
.wlv-check { display: inline-flex; align-items: center; gap: 4px; cursor: pointer; color: var(--wlv-ink); }
.wlv-check input { accent-color: var(--wlv-accent); width: 16px; height: 16px; margin: 0 2px 0 0; }
.wlv-check .wlv-select { padding: 2px 4px; }
.wlv-combine-msg { margin: 6px 0 0; font-size: 12.5px; color: var(--wlv-accent); font-weight: 600; }
.wlv-combine-msg[hidden], .wlv-ukyears[hidden], .wlv-follow[hidden], .wlv-cif-key[hidden] { display: none; }
.wlv-ukyears { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; margin-top: 4px; }
.wlv-ychip { padding: 3px 10px; }
.wlv-ychip.is-on { background: var(--wlv-accent-soft); box-shadow: inset 0 0 0 1.5px var(--wlv-accent); font-weight: 600; }
.wlv-cif-key { margin: 6px 0 0; font-size: 11.5px; color: var(--wlv-ink2); }
.wlv-table th.is-sim, .wlv-table td.is-sim { background: var(--wlv-accent-soft); font-weight: 650; }
.wlv-uktable tbody th { white-space: normal; min-width: 180px; }

/* followed patient ------------------------------------------------------- */
.wlv-follow { margin-top: 10px; box-shadow: inset 0 0 0 2px var(--wlv-follow); }
.wlv-follow-head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.wlv-follow-head h3 { margin: 0; }
.wlv-follow-dot { width: 12px; height: 12px; border-radius: 50%; box-shadow: 0 0 0 2px var(--wlv-surface), 0 0 0 4px var(--wlv-follow); flex: none; margin: 0 4px 0 2px; }
.wlv-follow-pin { margin-left: auto; font-size: 12.5px; padding: 4px 10px; }
.wlv-follow-rows { display: grid; grid-template-columns: max-content 1fr; gap: 3px 14px; margin: 2px 0 6px; font-size: 13px; }
.wlv-follow-rows dt { color: var(--wlv-ink2); }
.wlv-follow-rows dd { margin: 0; font-weight: 600; font-variant-numeric: tabular-nums; }
.wlv-follow-offers { display: flex; flex-wrap: wrap; gap: 4px; }
.wlv-offer { font-size: 11.5px; padding: 2px 8px; border-radius: 999px; box-shadow: inset 0 0 0 1px var(--wlv-border); font-variant-numeric: tabular-nums; }
.wlv-offer.is-acc { background: var(--wlv-accent-soft); color: var(--wlv-tx); font-weight: 650; box-shadow: none; }
.wlv-offer-more { font-size: 11.5px; color: var(--wlv-muted); padding: 2px 4px; }
.wlv-follow-across { margin: 8px 0 0; font-size: 12.5px; color: var(--wlv-ink); }
@media (max-width: 600px) { .wlv-follow-rows { grid-template-columns: 1fr; gap: 0 0; } .wlv-follow-rows dd { margin-bottom: 4px; } }

/* UK figures by patient group */
.wlv-ukgroups { margin-top: 18px; }
.wlv-ukg-bar { display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: center; margin: 4px 0 6px; }
.wlv-ukg-ctl { display: inline-flex; gap: 6px; align-items: center; }
.wlv-ukgtable th.wlv-ukg-head { text-align: center; white-space: normal; font-weight: 600; }
.wlv-ukgtable tbody th { min-width: 120px; }
.wlv-ukgtable td.is-ok { color: var(--wlv-ok); }
.wlv-ukgtable td.is-off { color: var(--wlv-off); }
.wlv-ukg-score { margin: 6px 0 2px; font-size: 13px; font-weight: 600; }

/* layout: steps, playback above the plot, totals below ----------------------- */
.wlv-guide-wrap { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; margin: 0 0 10px; padding: 9px 12px;
  border-radius: 10px; background: var(--wlv-accent-soft); }
.wlv-guide { display: flex; flex-wrap: wrap; gap: 4px 18px; margin: 0; padding: 0; list-style: none; counter-reset: wg; flex: 1 1 520px; font-size: 13px; color: var(--wlv-ink2); }
.wlv-guide li { counter-increment: wg; position: relative; padding-left: 26px; flex: 1 1 220px; }
.wlv-guide li::before { content: counter(wg); position: absolute; left: 0; top: 0; width: 19px; height: 19px; border-radius: 50%; background: var(--wlv-accent-fill); color: #ffffff;
  font-size: 11.5px; font-weight: 700; display: grid; place-items: center; }
.wlv-guide strong { color: var(--wlv-ink); }
.wlv-guide-jump { font-size: 13px; font-weight: 600; color: var(--wlv-tx); text-decoration: none; white-space: nowrap; }
.wlv-guide-jump:hover { text-decoration: underline; }
.wlv-play { margin: 0 0 10px; padding: 8px; border-radius: 12px; background: var(--wlv-surface); box-shadow: inset 0 0 0 1px var(--wlv-border); }
.wlv-play .wlv-clock { min-width: 0; padding: 4px 12px; flex-direction: row; align-items: baseline; gap: 8px; margin-right: 4px; }
.wlv-play .wlv-clock-year { font-size: 17px; }
.wlv-btn-play { min-width: 92px; font-weight: 650; }
.wlv-head { margin: 10px 0 0; }
.wlv-head .wlv-tiles { flex: 1 1 100%; }
@media (max-width: 600px) {
  .wlv-play .wlv-clock { flex: 1 1 100%; }
  .wlv-head .wlv-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* results guidance, strategies steps and side-by-side tables -------------- */
.wlv-rhow { margin: 6px 0 0; font-size: 13px; color: var(--wlv-ink2); max-width: 980px; }
.wlv-rhow strong { color: var(--wlv-ink); font-weight: 650; }
.wls-steps { list-style: none; margin: 6px 0 12px; padding: 0; display: grid; gap: 6px; font-size: 13px; }
.wls-steps li { display: flex; gap: 8px; align-items: baseline; color: var(--wlv-ink2); }
.wls-step-n { flex: none; width: 21px; height: 21px; border-radius: 50%; display: inline-grid; place-items: center; font-size: 11.5px; font-weight: 700;
  background: var(--wlv-plane); box-shadow: inset 0 0 0 1px var(--wlv-border); color: var(--wlv-ink2); transform: translateY(-1px); }
.wls-steps li.is-done .wls-step-n { background: var(--wlv-accent-fill); color: #ffffff; box-shadow: none; }
.wls-steps li.is-done { color: var(--wlv-muted); }
.wls-steps li.is-next { color: var(--wlv-ink); font-weight: 600; }
.wls-steps li.is-next .wls-step-n { box-shadow: inset 0 0 0 2px var(--wlv-accent); color: var(--wlv-accent); }
.wls-slots { align-items: end; }
.wls-slots .wls-ctl { flex: 1 1 180px; }
.wls-slots .wls-btn-main { flex: 0 0 auto; height: 36px; }
.wls-sbs { margin-top: 6px; }
.wls-sbs thead th { vertical-align: bottom; }
.wls-sbs tbody th { white-space: normal; min-width: 170px; }
.wls-sbs td { white-space: nowrap; }
.wls-sbs td.wls-diffcell { background: var(--wlv-accent-soft); font-weight: 650; }
.wls-dcell { color: var(--wlv-ink2); }
.wls-word { display: inline-block; margin-left: 6px; padding: 0 6px; border-radius: 999px; font-size: 11px; font-weight: 700; background: var(--wlv-zone); color: var(--wlv-ink2); }
.wls-word.is-good { color: var(--wls-good); background: color-mix(in srgb, var(--wls-good) 14%, transparent); }
.wls-word.is-bad { color: var(--wls-bad); background: color-mix(in srgb, var(--wls-bad) 14%, transparent); }
.wls-compare h3 { font-size: 15px; }

/* plot title: make clear this is a simulation (28 Oct 2026) ---------------- */
.wlv-plot-title { margin: 14px 0 8px; }
.wlv-plot-h { margin: 0; font-size: 18px; font-weight: 650; line-height: 1.25; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.wlv-sim-badge {
  display: inline-block; font-size: 11px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase;
  padding: 2px 8px; border-radius: 999px; color: var(--wlv-accent); background: var(--wlv-accent-soft);
  box-shadow: inset 0 0 0 1px var(--wlv-accent);
}
.wlv-plot-sub { margin: 3px 0 0; font-size: 13px; color: var(--wlv-ink2); }
.wlv-stage.is-busy .wlv-empty { background: var(--wlv-surface); color: var(--wlv-ink2); font-weight: 600; }
.wlv-head .wlv-tiles { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.wlv-tile-rem .wlv-tile-l { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 760px) {
  .wlv-head .wlv-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .wlv-plot-h { font-size: 16px; }
}
@media (max-width: 480px) {
  .wlv-head .wlv-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .wlv-tile-rem .wlv-tile-l { white-space: normal; }
}
.wlv-plot-h .wlv-guide-jump { margin-left: auto; font-size: 13px; }

/* results: what to show + bar charts v NHSBT (28 Oct 2026) ------------------ */
.wlv-show { display: flex; flex-wrap: wrap; align-items: stretch; gap: 8px; margin: 12px 0 14px; }
.wlv-show-lab { font-size: 13px; font-weight: 650; color: var(--wlv-ink2); align-self: center; margin-right: 2px; }
.wlv-show-opt { display: flex; gap: 8px; align-items: flex-start; padding: 8px 12px; border-radius: 10px; cursor: pointer;
  background: var(--wlv-surface); box-shadow: inset 0 0 0 1px var(--wlv-border); font-size: 14px; flex: 1 1 220px; }
.wlv-show-opt input { margin-top: 3px; accent-color: var(--wlv-accent); }
.wlv-show-opt span { display: flex; flex-direction: column; }
.wlv-show-opt small { font-size: 12px; color: var(--wlv-muted); }
.wlv-show-opt:has(input:checked) { box-shadow: inset 0 0 0 1.5px var(--wlv-accent); background: var(--wlv-accent-soft); }
.wlv-show-opt.is-off { opacity: 0.5; cursor: not-allowed; }
.wlv-detail[hidden], .wlv-bars[hidden] { display: none; }
.wlv-bars { margin-bottom: 14px; }
.wlb-legend { display: flex; flex-wrap: wrap; gap: 6px 16px; margin: 8px 0 4px; font-size: 13px; color: var(--wlv-ink2); }
.wlb-key { display: inline-flex; align-items: center; gap: 6px; }
.wlb-sw { width: 14px; height: 10px; border-radius: 2px; display: inline-block; }
.wlb-note { font-size: 13px; color: var(--wlv-ink2); background: var(--wlv-accent-soft); padding: 8px 10px; border-radius: 8px; }
.wlb-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap: 12px 22px; margin-top: 8px; }
.wlb-chart { margin: 0; }
.wlb-chart figcaption { font-size: 14px; font-weight: 650; margin: 4px 0 2px; }
.wlb-svg { width: 100%; height: auto; display: block; overflow: visible; }
.wlb-grid line, line.wlb-grid { stroke: var(--wlv-grid); stroke-width: 1; }
.wlb-rowlab { font-size: 12px; fill: var(--wlv-ink); font-weight: 600; }
.wlb-val { font-size: 11px; fill: var(--wlv-ink2); font-variant-numeric: tabular-nums; }
.wlb-na { fill: var(--wlv-muted); font-style: italic; }
.wlb-whisk { stroke: var(--wlv-ink); stroke-width: 1.2; opacity: 0.75; }
.wlb-uk { fill: var(--wlv-ink2); background: var(--wlv-ink2); }
.wlb-run { fill: var(--wlv-accent); background: var(--wlv-accent); }
.wlb-s0 { fill: var(--wlv-dg-0); background: var(--wlv-dg-0); } .wlb-s1 { fill: var(--wlv-dg-1); background: var(--wlv-dg-1); }
.wlb-s2 { fill: var(--wlv-dg-2); background: var(--wlv-dg-2); } .wlb-s3 { fill: var(--wlv-dg-6); background: var(--wlv-dg-6); }
.wlb-s4 { fill: var(--wlv-dg-4); background: var(--wlv-dg-4); } .wlb-s5 { fill: var(--wlv-dg-3); background: var(--wlv-dg-3); }
.wlb-s6 { fill: var(--wlv-dg-5); background: var(--wlv-dg-5); } .wlb-s7 { fill: var(--wlv-dg-7); background: var(--wlv-dg-7); }
@media (max-width: 480px) { .wlb-grid { grid-template-columns: 1fr; } }

/* spinner while simulations run (28 Oct 2026) */
.wl-spin { display: inline-block; width: 14px; height: 14px; border-radius: 50%; vertical-align: -2px; flex: none;
  border: 2px solid currentColor; border-right-color: transparent; opacity: 0.85; animation: wl-spin 0.8s linear infinite; }
@keyframes wl-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .wl-spin { animation-duration: 2.4s; } }
.wls-run .wl-spin { color: var(--wlv-accent); margin-right: 6px; }
.wlv-combine-msg .wl-spin { color: var(--wlv-accent); margin-right: 2px; }
.wl-busy { position: fixed; right: 16px; bottom: 16px; z-index: 50; display: flex; align-items: center; gap: 10px; max-width: min(460px, calc(100vw - 32px));
  padding: 10px 14px; border-radius: 999px; background: var(--wlv-ink, #0b0b0b); color: var(--wlv-surface, #fcfcfb);
  font: 600 13px/1.35 system-ui, -apple-system, "Segoe UI", sans-serif; box-shadow: 0 6px 24px rgba(0,0,0,0.18); }
.wl-busy[hidden] { display: none; }
.wlv-show-next { align-self: center; margin-left: auto; font-size: 14px; font-weight: 650; color: var(--wlv-accent); text-decoration: none; white-space: nowrap; }
.wlv-show-next:hover { text-decoration: underline; }

/* dynamics and patient-group charts, plot-only viewer (28 Oct 2026) ---------- */
.wlv-plot-only > .wlv-show, .wlv-plot-only .wlv-report { display: none; }
.wlv-plotbox[hidden], .wlv-dyn[hidden], .wlv-grp[hidden] { display: none; }
.wlv > .wlv-show { margin-top: 0; }
.wlv-dyn, .wlv-grp { margin-bottom: 14px; }
.wlb-grid4 { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.wlb-gridl { stroke: var(--wlv-grid); stroke-width: 1; }
.wlb-ax { font-size: 10.5px; fill: var(--wlv-muted); font-variant-numeric: tabular-nums; }
.wlb-line { fill: none; stroke-width: 2; stroke: var(--wlv-accent); }
.wlb-line.wlb-uk { stroke: var(--wlv-ink2); }
.wlb-line.wlb-run { stroke: var(--wlv-accent); }
.wlb-line.wlb-s0 { stroke: var(--wlv-dg-0); } .wlb-line.wlb-s1 { stroke: var(--wlv-dg-1); } .wlb-line.wlb-s2 { stroke: var(--wlv-dg-2); }
.wlb-line.wlb-s3 { stroke: var(--wlv-dg-6); } .wlb-line.wlb-s4 { stroke: var(--wlv-dg-4); } .wlb-line.wlb-s5 { stroke: var(--wlv-dg-3); }
.wlb-line.wlb-s6 { stroke: var(--wlv-dg-5); } .wlb-line.wlb-s7 { stroke: var(--wlv-dg-7); }
.wlb-dash { stroke-dasharray: 4 3; stroke-width: 1.5; }
.wlb-band { opacity: 0.16; stroke: none; }
.wlb-ukpt { fill: var(--wlv-surface); stroke: var(--wlv-ink); stroke-width: 1.8; }
.wlb-ref { stroke: var(--wlv-ink2); stroke-dasharray: 2 3; stroke-width: 1; }
.wlb-wide { margin-top: 12px; max-width: 900px; }
.wlb-dyntable td .wlb-sw { vertical-align: -1px; }
.wlb-dyntable tr.wlb-hfirst > * { border-top: 2px solid var(--wlv-border); }
.wlb-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; }
.wlb-head h3 { margin: 0; }
.wlg-tx { fill: var(--wlv-tx); background: var(--wlv-tx); }
.wlg-died { fill: var(--wlv-gone); background: var(--wlv-gone); }
.wlg-rem { fill: var(--wlv-axis); background: var(--wlv-axis); }
.wlg-wait { fill: var(--wlv-grid); background: var(--wlv-grid); }
.wlg-seg { stroke: var(--wlv-surface); stroke-width: 0.6; }
.wlg-in { font-size: 10px; fill: #fff; font-weight: 600; }
.wlb-types { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 10px 0 6px; }
.wlb-type { display: inline-flex; align-items: center; gap: 6px; padding: 5px 11px; border-radius: 999px; cursor: pointer; font-size: 13.5px;
  background: var(--wlv-surface); box-shadow: inset 0 0 0 1px var(--wlv-border); }
.wlb-type input { margin: 0; accent-color: var(--wlv-accent); }
.wlb-type:has(input:checked) { box-shadow: inset 0 0 0 1.5px var(--wlv-accent); background: var(--wlv-accent-soft); font-weight: 600; }
.wlb-dynsec { margin-top: 14px; padding-top: 10px; border-top: 1px solid var(--wlv-border); }
.wlb-dynsec h4 { margin: 0 0 2px; font-size: 15px; }
.wlv-show-opt { flex: 1 1 170px; }
.cmp-tab { --wls-0: var(--wlv-dg-0); --wls-1: var(--wlv-dg-1); --wls-2: var(--wlv-dg-2); --wls-3: var(--wlv-dg-6);
  --wls-4: var(--wlv-dg-4); --wls-5: var(--wlv-dg-3); --wls-6: var(--wlv-dg-5); --wls-7: var(--wlv-dg-7); }
.cmp-plot-ctl .wlv-seg-btn { display: inline-flex; align-items: center; gap: 6px; }

/* tidier results (28 Oct 2026) ----------------------------------------------- */
.wlv-report { display: grid; gap: 14px; }
.wlv-report > * { margin: 0; }
.wlv-report-head { display: grid; gap: 6px; }
.wlv-rhow { margin: 0; }
.wlv-used { font-size: 13px; color: var(--wlv-ink2); }
.wlv-used > summary { cursor: pointer; display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: baseline; list-style: none; }
.wlv-used > summary::-webkit-details-marker { display: none; }
.wlv-used > summary > span { font-weight: 650; color: var(--wlv-accent); }
.wlv-used > summary > span::after { content: ' ▸'; }
.wlv-used[open] > summary > span::after { content: ' ▾'; }
.wlv-used > summary small { color: var(--wlv-muted); font-size: 12.5px; }
.wlv-used .wlv-panel-sub { margin: 6px 0 0; }
.wlv-detail { display: grid; gap: 14px; }
.wlv-detail > * { margin: 0; }
.wlv-rtiles { grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); }
.wlv-rtiles .wlv-tile { min-height: 0; }
.wlv-tile-s { font-size: 11.5px; color: var(--wlv-muted); margin-top: 2px; line-height: 1.3; }
.wlv-tablecard .wlb-head { margin-bottom: 4px; }
.wlv-seg-wrap { flex-wrap: wrap; }
.wlv-tablebox { margin-top: 8px; }
.wlv-tablebox[hidden] { display: none; }
.wlv-quick > summary { cursor: pointer; list-style: none; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; }
.wlv-quick > summary::-webkit-details-marker { display: none; }
.wlv-quick > summary h3 { margin: 0; }
.wlv-quick > summary h3::before { content: '▸ '; color: var(--wlv-accent); }
.wlv-quick[open] > summary h3::before { content: '▾ '; }
.wlv-quick > summary small { color: var(--wlv-muted); font-size: 12.5px; }
.wlv-quick[open] > summary { margin-bottom: 8px; }
@media (max-width: 980px) { .wl-busy { bottom: 70px; } }
/* controls sit under the plot (28 Oct 2026) */
.wlv-plotbox > .wlv-play { margin-bottom: 8px; }
.wlv-plotbox > .wlv-toolbar { margin: 10px 0 0; padding: 10px 12px; border-radius: 12px; background: var(--wlv-surface); box-shadow: inset 0 0 0 1px var(--wlv-border); }
.wlv-plotbox > .wlv-head { margin-top: 10px; }
.wlv-cif-panel .wlv-ukyears { margin-top: 10px; padding-top: 8px; border-top: 1px solid var(--wlv-border); }

/* "+" list of every setting of the run (28 Oct 2026) ------------------------- */
.wlv-allset { margin-top: 4px; font-size: 13px; }
.wlv-allset[hidden] { display: none; }
.wlv-allset > summary { list-style: none; cursor: pointer; display: inline-flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; }
.wlv-allset > summary::-webkit-details-marker { display: none; }
.wlv-plus { width: 22px; height: 22px; border-radius: 50%; flex: none; display: inline-grid; place-items: center; color: var(--wlv-accent);
  box-shadow: inset 0 0 0 1.5px var(--wlv-accent); background: var(--wlv-surface); }
.wlv-plus::before { content: "+"; font-weight: 700; font-size: 15px; line-height: 1; }
.wlv-allset[open] > summary .wlv-plus { background: var(--wlv-accent-fill); color: #ffffff; }
.wlv-allset[open] > summary .wlv-plus::before { content: "\2212"; }
.wlv-allset-lab { font-weight: 650; color: var(--wlv-accent); }
.wlv-allset > summary small { color: var(--wlv-muted); font-size: 12.5px; }
.wlv-allset > summary:focus-visible { outline: 2px solid var(--wlv-accent); outline-offset: 2px; border-radius: 6px; }
.wlv-allset-body { margin-top: 8px; padding: 12px 14px; border-radius: 12px; background: var(--wlv-surface); box-shadow: inset 0 0 0 1px var(--wlv-border); }
.wlv-allset-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px 22px; }
.wlv-allset-grp h4 { margin: 0 0 4px; font-size: 13px; font-weight: 700; color: var(--wlv-ink); }
.wlv-allset-grp dl { margin: 0; display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 2px 10px; font-size: 12.5px; }
.wlv-allset-grp dt { color: var(--wlv-ink2); }
.wlv-allset-grp dd { margin: 0; color: var(--wlv-ink); font-weight: 600; font-variant-numeric: tabular-nums; }
.wlv-allset-note { margin: 0 0 8px; font-size: 12.5px; color: var(--wlv-muted); }
.wlv-allset-note:last-child { margin: 10px 0 0; }
.wlv-used > summary > span.wlv-allset-lab::after { content: none; }

/* run button and calculation progress (28 Oct 2026) ------------------------- */
.wlv-runrow { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin: 10px 0 2px; }
.wlv-runrow[hidden] { display: none; }
.wlv-runbtn { height: 40px; padding: 0 20px; border: 0; border-radius: 10px; cursor: pointer; font: inherit; font-weight: 700; font-size: 15px;
  background: var(--wlv-accent-fill); color: #ffffff; box-shadow: 0 1px 0 rgba(0,0,0,0.06); }
.wlv-runbtn:hover:not(:disabled) { filter: brightness(1.06); }
.wlv-runbtn:disabled { cursor: progress; opacity: 0.75; }
.wlv-runbtn:focus-visible { outline: 2px solid var(--wlv-accent); outline-offset: 2px; }
.wlv-runhint { font-size: 12.5px; color: var(--wlv-muted); }
.wlv-runhint[hidden], .wlv-runprog[hidden], .wlv-emptyprog[hidden] { display: none; }
.wlv-runprog { flex: 1 1 280px; display: grid; gap: 4px; min-width: 0; }
.wlv-progbar { height: 8px; border-radius: 999px; background: var(--wlv-plane); box-shadow: inset 0 0 0 1px var(--wlv-border); overflow: hidden; }
.wlv-progbar > span { display: block; height: 100%; width: 0; background: var(--wlv-accent); border-radius: 999px; transition: width 0.15s linear; }
.wlv-progtext { font-size: 12.5px; color: var(--wlv-ink2); font-variant-numeric: tabular-nums; }
.wlv-empty { flex-direction: column; gap: 12px; }
.wlv-progmsg { font-size: 15px; font-weight: 650; color: var(--wlv-ink); }
.wlv-emptyprog { width: min(420px, 80%); display: grid; gap: 8px; text-align: center; }
.wlv-emptyprog .wlv-progbar { height: 10px; }
.wlv-progstep { font-size: 13px; color: var(--wlv-ink2); font-variant-numeric: tabular-nums; }
@media (prefers-reduced-motion: reduce) { .wlv-progbar > span { transition: none; } }
.wlv .wlv-runbtn, .wlv .wlv-runbtn:disabled { color: #ffffff; }
.wlv .run, .wlv .wls-btn-main, .wls .wls-btn-main, .cmp-tab .run, .wlv .wls-seg button[aria-pressed="true"] { color: #ffffff; }
/* patient-group dot plots (28 Oct 2026) */
.wlb-dot { opacity: 0.75; stroke: none; }
.wlb-iqr { opacity: 0.35; stroke: none; }
.wlb-med { stroke: var(--wlv-ink); stroke-width: 2; }
.wlb-ukdia { fill: var(--wlv-ink); stroke: var(--wlv-surface); stroke-width: 1; }
.wlb-chart > svg + svg { margin-top: 10px; }
.wlv-trail-ctl { font-size: 13px; gap: 6px; }
.wlv-trail-ctl select[hidden] { display: none; }
.wlv-trail-ctl .wlv-select { padding: 3px 5px; }
/* real-world bars: one shade per UK year (oldest lightest) */
/* real-world years, lightest = oldest (2021/22) to darkest (2025/26) */
.wlb-uk.wlb-uky0 { fill: color-mix(in srgb, var(--wlv-ink2) 18%, var(--wlv-surface)); background: color-mix(in srgb, var(--wlv-ink2) 18%, var(--wlv-surface)); }
.wlb-uk.wlb-uky1 { fill: color-mix(in srgb, var(--wlv-ink2) 34%, var(--wlv-surface)); background: color-mix(in srgb, var(--wlv-ink2) 34%, var(--wlv-surface)); }
.wlb-uk.wlb-uky2 { fill: color-mix(in srgb, var(--wlv-ink2) 52%, var(--wlv-surface)); background: color-mix(in srgb, var(--wlv-ink2) 52%, var(--wlv-surface)); }
.wlb-uk.wlb-uky3 { fill: color-mix(in srgb, var(--wlv-ink2) 74%, var(--wlv-surface)); background: color-mix(in srgb, var(--wlv-ink2) 74%, var(--wlv-surface)); }
.wlb-uk.wlb-uky4 { fill: var(--wlv-ink2); background: var(--wlv-ink2); }
.wlb-ref31 { fill: var(--wlv-ink2); opacity: .35; }
.wlv-dl-btn { height: 34px; font-size: 13px; font-weight: 600; white-space: nowrap; }
.wlv-dl-btn span { font-size: 15px; margin-right: 2px; }