/* AlgosWay tools (prop-firm calculator and trade journal), tools preview 2026-10-23.
   Builds on styles.css tokens and components (.card, .kpi, .callout, .pill, .button, tables). Brand colours
   never colour numbers: money uses the --gain / --loss / --neutral data tokens with a sign and a glyph.
   Every selector is scoped under .tool so the existing dashboard pages are unchanged. Minimum text 12px. */
.nav-caption.tools-caption { margin-top: 22px; }
.tool { display: flex; flex-direction: column; gap: 18px; min-width: 0; }
.tool [hidden] { display: none !important; }
.tool .page-heading p { max-width: 780px; }
.tool a.ext, .tool .link { color: var(--ink); text-decoration: underline; text-decoration-color: var(--line-2); text-underline-offset: 3px; }
.tool a.ext:hover, .tool .link:hover { text-decoration-color: var(--accent-hi); }
.tool .tool-warning { border-style: solid; border-color: var(--line-2); background: rgba(14,11,12,0.92); }
.tool .tool-warning strong { display: block; margin-bottom: 4px; font-size: 14px; }
.tool .muted { color: var(--muted); }
.tool .small { font-size: 12px; }
.tool .rules-asof { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; color: var(--ink-2); font-size: 13px; }
.tool .rules-asof b { color: var(--ink); }
.tool-grid { display: grid; grid-template-columns: minmax(0, 420px) minmax(0, 1fr); gap: 18px; align-items: start; }
.tool .stack-gap { display: flex; flex-direction: column; gap: 16px; min-width: 0; }

/* ---------- forms ---------- */
.tool-form { padding: 18px 20px 20px; }
.tool fieldset { margin: 0 0 16px; padding: 0 0 14px; border: 0; border-bottom: 1px solid var(--line); min-width: 0; }
.tool fieldset:last-of-type { border-bottom: 0; margin-bottom: 8px; }
.tool legend { padding: 0; margin-bottom: 10px; font-family: var(--display); font-size: 15px; font-weight: 650; color: var(--ink); }
.tool .field { display: flex; flex-direction: column; gap: 5px; margin-bottom: 12px; min-width: 0; }
.tool .field > span, .tool .field > label { color: var(--ink-2); font-size: 13px; }
.tool .field small, .tool .hint { color: var(--muted); font-size: 12px; }
.tool .row2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 12px; }
.tool .row3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 12px; }
.tool input[type="text"], .tool input[type="number"], .tool input[type="date"], .tool input[type="time"], .tool input[type="url"], .tool input[type="search"], .tool textarea, .tool select {
  width: 100%; max-width: 100%; min-width: 0; padding: 9px 11px; border: 1px solid var(--line-2); border-radius: 10px; background: var(--surface); color: var(--ink); font: inherit; font-size: 14px; }
.tool input[type="number"] { font-variant-numeric: tabular-nums; }
.tool textarea { min-height: 72px; resize: vertical; }
.tool input:focus-visible, .tool select:focus-visible, .tool textarea:focus-visible { outline: 2px solid var(--accent-hi); outline-offset: 1px; }
.tool input[aria-invalid="true"], .tool select[aria-invalid="true"] { border-color: var(--loss-mark); }
.tool .check { display: flex; align-items: flex-start; gap: 9px; margin: 2px 0 12px; color: var(--ink-2); font-size: 13px; cursor: pointer; }
.tool .check input { width: 18px; height: 18px; margin: 1px 0 0; flex: none; accent-color: var(--accent); }
.tool .seg { display: inline-flex; flex-wrap: wrap; gap: 6px; }
.tool .seg label { display: inline-flex; align-items: center; gap: 6px; padding: 6px 10px; border: 1px solid var(--line-2); border-radius: 9px; color: var(--ink-2); font-size: 13px; cursor: pointer; }
.tool .seg input { accent-color: var(--accent); }
.tool .form-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 14px; }
.tool .form-errors { margin: 0 0 12px; padding: 10px 12px; border: 1px solid var(--loss-mark); border-radius: 10px; color: var(--ink); font-size: 13px; }
.tool .form-errors:empty { display: none; }
.tool .form-errors ul { margin: 6px 0 0; padding-left: 18px; }
.tool .derived { color: var(--ink-2); font-size: 12px; font-variant-numeric: tabular-nums; }
.tool .button.danger { border-color: var(--loss-mark); }
.tool .button.ghost { background: transparent; }
.tool .button.tiny { padding: 5px 9px; font-size: 12px; }
.tool .progress { color: var(--ink-2); font-size: 13px; font-variant-numeric: tabular-nums; }
.tool .progress-bar { width: 160px; height: 6px; border: 1px solid var(--line); border-radius: 4px; overflow: hidden; background: var(--sunken); }
.tool .progress-bar span { display: block; height: 100%; background: var(--neutral); }

/* ---------- status badges for rule fields ---------- */
.tool .status { display: inline-flex; align-items: center; padding: 1px 7px; border: 1px solid var(--line-2); border-radius: 6px; font-size: 12px; letter-spacing: 0.03em; white-space: nowrap; }
.tool .status-official { color: var(--ink-2); }
.tool .status-derived, .tool .status-reading { color: var(--ink); border-style: dashed; }
.tool .status-unverified { color: var(--ink); border: 1px dashed var(--brand-gold); }
.tool .status-not-stated { color: var(--muted); }
.tool .status-edited { color: var(--ink); border-color: var(--accent-hi); }
.tool .rule-table td { vertical-align: middle; }
.tool .rule-table td.rule-value { min-width: 150px; }
.tool .rule-table td.rule-value input, .tool .rule-table td.rule-value select { padding: 6px 9px; font-size: 13px; }
.tool .rule-table .rule-note { display: block; margin-top: 3px; color: var(--muted); font-size: 12px; }
.tool .rule-group th { padding-top: 16px; color: var(--ink); }
.tool details.card > summary { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 16px 20px; cursor: pointer; list-style: none; font-family: var(--display); font-weight: 650; font-size: 15px; }
.tool details.card > summary::-webkit-details-marker { display: none; }
.tool details.card > summary::after { content: "Show \25BE"; color: var(--muted); font-size: 12px; font-family: var(--font); font-weight: 400; }
.tool details.card[open] > summary::after { content: "Hide \25B4"; }
.tool details.card .details-body { padding: 0 12px 16px; }

/* ---------- results ---------- */
.tool .results-empty { display: grid; place-items: center; min-height: 260px; padding: 28px; border: 1px dashed var(--line-2); border-radius: var(--radius); color: var(--muted); text-align: center; background: repeating-linear-gradient(135deg, rgba(255,255,255,0.018) 0 10px, transparent 10px 20px); }
.tool .results-empty h3 { color: var(--ink-2); margin-bottom: 6px; }
.tool .kpis.tool-kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.tool .kpi .kpi-value { font-size: 26px; }
.tool .kpi .kpi-value .pnl { font-size: inherit; }
.tool .result-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 14px; }
.tool .result-head h2 { font-size: 17px; }
.tool .note-list { margin: 8px 0 0; padding-left: 18px; color: var(--ink-2); font-size: 13px; }
.tool .note-list li { margin: 4px 0; }
.tool .hist { margin: 4px 0 0; padding: 12px 20px 16px; }
.tool .hist svg { width: 100%; height: 190px; display: block; background: var(--sunken); border-radius: 8px; }
.tool .hist .bar-gain { fill: var(--gain-mark); opacity: 0.85; }
.tool .hist .bar-loss { fill: var(--loss-mark); opacity: 0.85; }
.tool .hist .bar-zero { fill: var(--neutral); opacity: 0.6; }
.tool .hist .zero-line { stroke: var(--chart-base); stroke-width: 1.25; stroke-dasharray: 5 4; }
.tool .hist-axis { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 2px 12px; margin-top: 6px; color: var(--chart-axis); font-size: 12px; font-variant-numeric: tabular-nums; }
.tool .hist-axis span { white-space: nowrap; }
.tool .flag { padding: 10px 12px; border: 1px dashed var(--brand-gold); border-radius: 10px; color: var(--ink); font-size: 13px; }

/* ---------- journal ---------- */
.tool .tool-tabs { display: flex; flex-wrap: wrap; gap: 6px; }
.tool .tool-tabs button { padding: 9px 14px; border: 1px solid var(--line-2); border-radius: 10px; background: var(--surface); color: var(--ink-2); font-size: 13px; }
.tool .tool-tabs button[aria-selected="true"] { color: var(--ink); border-color: var(--accent-hi); background: linear-gradient(180deg, var(--accent-wash), rgba(227,25,47,0.04)); }
.tool .journal-status { color: var(--ink-2); font-size: 14px; min-height: 0; }
.tool .journal-status:empty { display: none; }
.tool .tab-count { font-variant-numeric: tabular-nums; }
.tool .journal-start { gap: 14px; }
.tool .journal-start .quick-add { padding: 0; border: 0; background: none; box-shadow: none; }
.tool .more-fields { margin: 4px 0 8px; }
.tool .plan-source { margin-left: 8px; }
.tool .filters { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 12px; padding: 16px 20px 4px; }
.tool .panel-pad { padding: 18px 20px 20px; }
.tool .trade-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.tool .pager { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 0 20px 16px; color: var(--muted); font-size: 12px; }
.tool .jr-eq { padding: 12px 20px 16px; }
.tool .jr-eq svg { width: 100%; height: 220px; display: block; background: var(--sunken); border-radius: 8px; }
.tool .jr-eq .eq-line { fill: none; stroke: var(--chart-line); stroke-width: 2; }
.tool .jr-eq .eq-base { stroke: var(--chart-base); stroke-width: 1.25; stroke-dasharray: 6 5; }
.tool .jr-eq .eq-area.gain { fill: var(--gain-wash); }
.tool .jr-eq .eq-area.loss { fill: var(--loss-wash); }
.tool .cal-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 16px 20px 0; }
.tool .cal-head h3 { min-width: 0; }
.tool .cal { width: 100%; table-layout: fixed; border-collapse: separate; border-spacing: 4px; padding: 8px 14px 4px; }
.tool .cal th { padding: 4px 2px; border: 0; text-align: center; letter-spacing: 0.04em; }
.tool .cal td { height: 64px; padding: 6px; border: 1px solid var(--line); border-radius: 8px; vertical-align: top; background: var(--sunken); color: var(--muted); font-size: 12px; }
.tool .cal td.out { border-color: transparent; background: transparent; }
.tool .cal td .d { display: block; color: var(--ink-2); }
.tool .cal td .v { display: block; margin-top: 4px; font-size: 12px; font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tool .cal td.gain { border-color: var(--gain-mark); background: rgba(31,168,152,var(--heat, 0.12)); }
.tool .cal td.loss { border-color: var(--loss-mark); background: rgba(207,127,26,var(--heat, 0.12)); }
.tool .cal td.zero { border-color: var(--neutral); }
.tool .cal td.gain .v { color: var(--gain); } .tool .cal td.loss .v { color: var(--loss); } .tool .cal td.zero .v { color: var(--neutral); }
.tool .cal-legend { display: flex; flex-wrap: wrap; gap: 6px 16px; padding: 0 20px 16px; color: var(--muted); font-size: 12px; }
.tool .chip-list { display: flex; flex-wrap: wrap; gap: 4px; }
.tool .chip-list .pill { font-size: 12px; }
.tool .check-grid { display: grid; gap: 8px; margin: 10px 0 14px; }
.tool .check-grid .check-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 10px; }
.tool .check-grid .check-row span { color: var(--ink-2); font-size: 13px; }
.tool .check-grid .seg label { padding: 5px 9px; }
.tool .preview-wrap { max-height: 420px; overflow: auto; }
.tool .row-bad td { background: rgba(207,127,26,0.06); }
.tool .settings-list { display: grid; gap: 8px; margin: 10px 0; }
.tool .settings-list .item { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
.tool-dialog { width: min(480px, calc(100vw - 32px)); padding: 22px; border: 1px solid var(--ring-strong); border-radius: 18px; background: linear-gradient(180deg, #1a0d10, #0f0b0c); color: var(--ink); box-shadow: 0 30px 80px rgba(0,0,0,0.6); }
.tool-dialog::backdrop { background: rgba(3,2,2,0.74); }
.tool-dialog h2 { margin-bottom: 8px; }
.tool-dialog p { color: var(--ink-2); font-size: 13px; margin: 8px 0; }
.tool-dialog .field { margin: 12px 0; }
.tool-dialog .form-actions { justify-content: flex-end; margin-top: 16px; }
.tool .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

@media (max-width: 1200px) {
  .tool-grid { grid-template-columns: minmax(0, 1fr); }
  .tool .kpis.tool-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .tool .filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  .tool { gap: 12px; }
  .tool .page-heading p { display: block; }
  .tool-form { padding: 14px; }
  .tool .row3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tool .filters { grid-template-columns: minmax(0, 1fr); padding: 14px 14px 2px; }
  .tool .panel-pad { padding: 14px; }
  .tool .kpi .kpi-value { font-size: 20px; }
  .tool .hist, .tool .jr-eq { padding: 10px 12px 14px; }
  .tool .cal { border-spacing: 2px; padding: 6px 6px 2px; }
  .tool .cal td { height: 46px; padding: 4px 3px; }
  .tool .cal td .v { font-size: 12px; }
  .tool .cal td .v .amt { display: none; }
  .tool .cal-head { padding: 14px 14px 0; }
  .tool .pager { padding: 0 14px 14px; }
  .tool details.card > summary { padding: 14px; }
  .tool .rule-table td.rule-value { min-width: 0; }
  .tool table.stack td[data-label="Net"] { order: -1; }
}

/* ---------- review fixes 2026-10-23: policy beside the headline, automation box, CFTC text, badges list ---------- */
.tool .kpi-policy { display: block; margin-top: 6px; color: var(--ink-2); font-family: var(--font); font-size: 12px; font-weight: 500; line-height: 1.4; }
.tool .automation { margin: 0 0 14px; padding: 12px 14px; border: 1px solid var(--line-2); border-radius: 12px; background: var(--sunken); }
.tool .automation p { margin: 0 0 6px; color: var(--ink-2); font-size: 13px; }
.tool .automation p:last-child { margin-bottom: 0; }
.tool .automation b { color: var(--ink); }
.tool .automation-no, .tool .automation-uncertain { border-color: var(--brand-gold); border-style: dashed; }
.tool .cftc { color: var(--ink-2); font-size: 12px; letter-spacing: 0.01em; line-height: 1.55; }
.tool .callout .cftc { margin: 6px 0 8px; }
.tool .nonofficial { margin: 4px 0 6px; }
.tool .note-list.badges { padding-left: 0; list-style: none; }
.tool .note-list.badges li { margin: 6px 0; }
.tool .example-flag { margin-bottom: 12px; }
.tool .note-list.badges .rule-note { display: block; margin-top: 2px; color: var(--muted); font-size: 12px; }
.tool .kpi-value .small { display: block; margin-top: 4px; font-family: var(--font); font-weight: 500; }
/* My dashboard */
.tool .dash-section { display: grid; gap: 14px; }
.tool .dash-head { display: flex; align-items: baseline; justify-content: space-between; gap: 6px 14px; flex-wrap: wrap; }
.tool .dash-head h2 { font-size: 19px; }
.tool .dash-head .tag { color: var(--muted); font-size: 12px; letter-spacing: 0.06em; text-transform: uppercase; }
.tool .dash-eq .jr-eq svg { height: 150px; }
.tool .dash-empty { padding: 24px; display: grid; gap: 10px; }
.tool .dash-empty h2 { font-size: 21px; }
.tool .dash-empty p { color: var(--ink-2); line-height: 1.6; max-width: 760px; }
.tool .scenario .detail-list { margin-top: 8px; }
.tool .dash-links { margin-top: 4px; }
.tool .fill-warning { color: var(--ink); }
.tool .fill-warning b { color: var(--brand-gold-ink); }

/* ---------- v3 (2026-10-25): new tools and their parts. Scoped under .tool; colours come from the theme tokens ---------- */
.tool .sim-details, .tool .plan-details { margin: 0 0 12px; }
.tool .sim-details > summary, .tool .plan-details > summary, .tool details.sub > summary { cursor: pointer; min-height: 32px; padding: 6px 0; }
.tool .sim-details > summary.legend-like { font-size: 15px; font-weight: 650; color: var(--ink); }
.tool .sim-details[open] > summary { margin-bottom: 10px; }
.tool .run-bar { margin-top: 4px; }
.tool [data-part="results"] .kpis.tool-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.tool .kpi-pair .kpi-values { display: grid; gap: 8px; margin-top: 12px; }
.tool .kpi-pair .kpi-value { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 2px 10px; margin-top: 0; font-size: 20px; min-width: 0; }
.tool .kpi-pair .kpi-value[data-series="zero"] { padding-top: 8px; border-top: 1px dashed var(--line-2); }
.tool .kpi-pair .kv-label { flex: none; color: var(--muted); font-family: var(--font); font-size: 12px; font-weight: 500; letter-spacing: 0.02em; }
.tool .kpi-pair .kv { min-width: 0; text-align: right; }
.tool .kpi-pair .kpi-value .small { display: inline; margin-left: 6px; font-size: 12px; }
.tool .fan-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; padding: 12px 20px 0; }
.tool .fan-panel h4 { margin-bottom: 6px; font-size: 13px; color: var(--ink-2); }
.tool .fan-panel svg { width: 100%; height: 200px; display: block; background: var(--sunken); border-radius: 8px; }
.tool .fan-outer { fill: var(--fan-outer, rgba(150, 170, 220, 0.16)); }
.tool .fan-inner { fill: var(--fan-inner, rgba(150, 170, 220, 0.32)); }
.tool .fan-median { fill: none; stroke: var(--fan-line, var(--chart-line)); stroke-width: 2; }
.tool .chart-card > .hist-axis { padding: 0 20px; }
.tool .view-table { margin: 8px 12px 14px; }
.tool .view-table > summary { display: inline-flex; align-items: center; min-height: 32px; padding: 4px 8px; border-radius: 8px; color: var(--ink-2); font-size: 13px; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--line-2); }
.tool .view-table > summary:hover { color: var(--ink); }
.tool .view-table[open] .table-wrap { max-height: 420px; overflow: auto; }
.tool .readout { font-size: 16px; color: var(--ink); line-height: 1.6; }
.tool .readout b { font-size: 22px; font-weight: 650; }
.tool .readout .readout-label { margin-right: 8px; color: var(--ink-2); font-size: 14px; }
.tool .result-card { padding: 18px 20px; display: grid; gap: 10px; }
.tool .result-card .table-wrap { padding: 0; }
.tool .asof { color: var(--ink-2); font-size: 13px; }
.tool .empty-card { padding: 24px; display: grid; gap: 10px; }
.tool .empty-card h2 { font-size: 20px; }
.tool .empty-card p { color: var(--ink-2); max-width: 680px; }
.tool .ghost-chart { display: flex; align-items: flex-end; gap: 8px; height: 90px; margin-top: 6px; padding: 10px; border: 1px dashed var(--line-2); border-radius: 10px; opacity: 0.6; }
.tool .ghost-chart span { flex: 1; border-radius: 4px 4px 0 0; background: var(--line); }
.tool .ghost-chart span:nth-child(1) { height: 30%; } .tool .ghost-chart span:nth-child(2) { height: 55%; } .tool .ghost-chart span:nth-child(3) { height: 42%; }
.tool .ghost-chart span:nth-child(4) { height: 70%; } .tool .ghost-chart span:nth-child(5) { height: 58%; } .tool .ghost-chart span:nth-child(6) { height: 85%; }
.tool .ghost-preview { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 12px; }
.tool .ghost-cal { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; align-content: end; padding: 10px; border: 1px dashed var(--line-2); border-radius: 10px; opacity: 0.6; }
.tool .ghost-cal i { display: block; height: 16px; border-radius: 4px; background: var(--line); }
.tool .dd-chart, .tool .wf { margin: 4px 0 0; padding: 12px 20px 8px; }
.tool .dd-chart svg, .tool .wf svg { width: 100%; height: 240px; display: block; background: var(--sunken); border-radius: 8px; }
.tool .wf svg { height: 220px; }
.tool .dd-chart .eq-line { fill: none; stroke: var(--chart-line); stroke-width: 2; }
.tool .dd-chart .eq-base, .tool .wf .eq-base { stroke: var(--chart-base); stroke-width: 1; stroke-dasharray: 2 4; }
.tool .dd-floor { fill: none; stroke: var(--chart-base); stroke-width: 1.75; stroke-dasharray: 7 5; }
.tool .dd-low { stroke: var(--chart-axis); stroke-width: 3; opacity: 0.55; }
.tool .wf-step { fill: var(--wf-step, var(--neutral)); }
.tool .wf-total { fill: var(--wf-total, var(--ink-2)); }
.tool .wf-axis { display: flex; margin-top: 6px; color: var(--chart-axis); font-size: 12px; text-align: center; }
.tool .wf-axis span { padding: 0 2px; overflow-wrap: anywhere; }
.tool .dd-rows td input { min-width: 0; padding: 7px 9px; }
.tool .dd-rows td { vertical-align: middle; }
.tool .rule-line { line-height: 1.6; }
.tool .cite { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; font-size: 12px; }
.tool .cell-cite { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin-top: 4px; font-size: 12px; }
.tool table.compare th[scope="row"] { color: var(--ink); text-transform: none; letter-spacing: 0; font-size: 14px; white-space: normal; min-width: 180px; }
.tool table.compare th[scope="row"] .rule-note { display: block; margin-top: 2px; color: var(--muted); font-size: 12px; font-weight: 400; }
.tool table.compare td { min-width: 120px; color: var(--ink); }
.tool table.compare .sort { display: inline-flex; align-items: center; gap: 2px; min-height: 32px; color: inherit; font: inherit; letter-spacing: inherit; text-transform: inherit; text-align: left; white-space: normal; }
.tool table.compare .sort:hover { color: var(--ink); }
.tool .timer { display: flex; align-items: baseline; gap: 14px; margin: 6px 0 12px; }
.tool .timer-clock { font-size: 40px; font-weight: 600; color: var(--ink); line-height: 1; }
.tool .backup-flag { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 14px; }
.tool .backup-flag .form-actions { gap: 8px; }
.tool .pill[data-met] { font-weight: 600; }
.tool .pill[data-met="no"] { border-style: dashed; }
.tool .save-mapping { margin-top: 4px; }
.tool .ledger-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 14px 0; }
@media (max-width: 900px) {
  .tool .fan-pair { grid-template-columns: minmax(0, 1fr); }
  .tool .ghost-preview { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 600px) {
  .tool .run-bar { position: sticky; bottom: 0; z-index: 5; margin: 0 -14px -14px; padding: 10px 14px; border-top: 1px solid var(--line); border-radius: 0 0 var(--radius) var(--radius); background: var(--surface); box-shadow: 0 -6px 16px rgba(0, 0, 0, 0.06); }
  .tool .kpi-pair .kpi-value { font-size: 18px; }
  .tool [data-part="results"] .kpis.tool-kpis { grid-template-columns: minmax(0, 1fr); }
  .tool .fan-pair { padding: 10px 12px 0; }
  .tool .dd-chart, .tool .wf { padding: 10px 12px 6px; }
  .tool .ledger-kpis { grid-template-columns: minmax(0, 1fr); }
  .tool .wf-axis { font-size: 12px; }
  .tool .readout b { font-size: 20px; }
}
.tool .plan-pick { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; }
.tool .scenario .example-flag { margin-top: 10px; }
/* a long caption between the axis ends may wrap on a phone instead of running past the card */
.tool .dd-chart .hist-axis span:nth-child(2) { white-space: normal; text-align: center; flex: 1 1 160px; }
/* ---------- The owner's declutter round (2026-10-25): basic inputs first, Advanced collapsed, results Details, marks ---------- */
.tool .fill-from { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; margin: 0 0 14px; color: var(--muted); font-size: 13px; }
.tool .adv-details { margin: 4px 0 12px; border: 1px solid var(--line); border-radius: 12px; padding: 0 14px; }
.tool .adv-details > summary { cursor: pointer; min-height: 48px; display: flex; align-items: center; color: var(--ink); font-size: 15px; font-weight: 650; list-style: none; }
.tool .adv-details > summary::-webkit-details-marker { display: none; }
.tool .adv-details > summary::after, .tool details.more > summary::after { content: ""; flex: none; margin-left: auto; width: 8px; height: 8px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: translateY(-2px) rotate(45deg); transition: transform 150ms; }
.tool .adv-details[open] > summary::after, .tool details.more[open] > summary::after { transform: translateY(2px) rotate(-135deg); }
.tool .adv-details > fieldset { padding-top: 6px; }
.tool .adv-details > fieldset:last-of-type { border-bottom: 0; }
.tool .sub-legend { font-size: 14px; color: var(--ink-2); }
.tool .more-group { display: grid; gap: 0; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); overflow: hidden; }
.tool details.more { border-bottom: 1px solid var(--line); }
.tool details.more:last-child { border-bottom: 0; }
.tool details.more > summary { display: flex; align-items: center; gap: 10px; min-height: 52px; padding: 12px 20px; cursor: pointer; list-style: none; color: var(--ink); font-size: 15px; font-weight: 600; }
.tool details.more > summary::-webkit-details-marker { display: none; }
.tool details.more > summary:hover { background: var(--surface-2); }
.tool details.more > .kpis, .tool details.more > .more-body { padding: 4px 20px 20px; }
.tool details.more .kpi { box-shadow: none; }
.tool .mark { display: inline-grid; place-items: center; flex: none; width: 24px; height: 24px; margin-left: 6px; vertical-align: middle; border-radius: 50%; position: relative; }
.tool .mark > span { display: grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; border: 1.5px solid var(--line-2); color: var(--ink-2); font-size: 11px; font-weight: 700; line-height: 1; font-family: var(--font); }
.tool .mark-official > span { border-color: var(--gain-mark); color: var(--ink); }
.tool .mark-derived > span, .tool .mark-reading > span { border: 1.5px dashed var(--ink-2); color: var(--ink); }
.tool .mark-unverified > span { border: 1px dashed var(--loss-mark); color: var(--ink); }
.tool a.mark:hover > span, .tool a.mark:focus-visible > span { border-color: var(--accent); color: var(--accent-hi); }
.tool a.mark[data-tip]:hover::after, .tool a.mark[data-tip]:focus-visible::after { content: attr(data-tip); position: absolute; z-index: 20; bottom: calc(100% + 6px); left: 50%; transform: translateX(-50%); padding: 6px 9px; border: 1px solid var(--line-2); border-radius: 8px; background: var(--surface-2); color: var(--ink); font-size: 12px; font-weight: 500; white-space: nowrap; box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3); pointer-events: none; }
.tool .mark-legend { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; padding: 14px 20px 0; color: var(--ink-2); font-size: 13px; }
.tool .mark-legend > span { display: inline-flex; align-items: center; gap: 2px; }
.tool .mark-legend .mark { margin-left: 0; }
.tool .cell-v { display: inline-flex; align-items: center; flex-wrap: nowrap; gap: 0; }
.tool .cite .mark { margin-left: 0; }

/* Public My dashboard: local record counts and useful first steps, no sample performance. */
.tools-workspace .tool .dash-welcome { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 24px; background: radial-gradient(ellipse at 0 0, var(--accent-wash), transparent 75%), var(--surface); }
.tools-workspace .tool .dash-welcome > div { min-width: 0; }
.tools-workspace .tool .dash-welcome h2 { margin: 8px 0; font-size: 26px; line-height: 1.2; letter-spacing: -.03em; }
.tools-workspace .tool .dash-welcome p { color: var(--ink-2); font-size: 14px; line-height: 1.6; }
.tools-workspace .tool .dash-welcome > .button { flex: none; }
.tools-workspace .tool .dash-eyebrow { color: var(--wordmark); font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; }
.tools-workspace .tool .dash-overview { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.tools-workspace .tool .dash-overview-card { display: flex; flex-direction: column; gap: 12px; min-width: 0; padding: 20px; color: var(--ink); text-decoration: none; transition: border-color .15s ease; }
.tools-workspace .tool .dash-overview-card:hover { border-color: var(--ring-strong); }
.tools-workspace .tool .dash-overview-label { color: var(--ink-2); font-size: 12px; line-height: 1.4; }
.tools-workspace .tool .dash-overview-card strong { font: 500 30px/1.2 var(--mono); }
.tools-workspace .tool .dash-overview-note { margin-top: auto; color: var(--muted); font-size: 12px; line-height: 1.5; }
.tools-workspace .tool .dash-shortcut strong { font: 600 19px/1.4 var(--font); }
.tools-workspace .tool .dash-shortcut strong span { color: var(--wordmark); }
.tools-workspace .tool .dash-empty { padding: 28px; gap: 12px; }
.tools-workspace .tool .dash-empty h2 { font-size: 25px; letter-spacing: -.025em; }
.tools-workspace .tool .dash-start-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin: 12px 0; padding: 22px 0; border-block: 1px solid var(--line); }
.tools-workspace .tool .dash-start-steps > div { min-width: 0; }
.tools-workspace .tool .dash-step-number { display: inline-block; margin-bottom: 12px; color: var(--wordmark); font: 500 12px var(--mono); }
.tools-workspace .tool .dash-start-steps h3 { font-size: 15px; margin-bottom: 8px; }
.tools-workspace .tool .dash-start-steps p { font-size: 13px; line-height: 1.6; }
@media (max-width: 1200px) {
  .tools-workspace .tool .dash-overview { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  .tools-workspace .tool .dash-welcome { align-items: flex-start; flex-direction: column; padding: 20px; gap: 16px; }
  .tools-workspace .tool .dash-welcome h2 { font-size: 24px; }
  .tools-workspace .tool .dash-overview { gap: 10px; }
  .tools-workspace .tool .dash-overview-card { padding: 16px; gap: 10px; }
  .tools-workspace .tool .dash-overview-card strong { font-size: 26px; }
  .tools-workspace .tool .dash-shortcut strong { font-size: 17px; }
  .tools-workspace .tool .dash-empty { padding: 20px; }
  .tools-workspace .tool .dash-start-steps { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  .tools-workspace .tool .dash-step-number { margin-bottom: 6px; }
}

/* New revision applies to DESKTOP ONLY. Mobile below961px retains exact publicv6 rules. */
@media (min-width: 961px) {

/* Compact dashboard rhythm; display and editing remain in the document's normal flow. */
.tools-workspace .tool .dash-welcome { padding: 20px 22px; }
.tools-workspace .tool .dash-overview { gap: 12px; }
.tools-workspace .tool .dash-overview-card { padding: 18px; gap: 10px; }
.tools-workspace .tool .dash-empty { padding: 24px; }
.tools-workspace .tool .dash-start-steps { padding: 18px 0; gap: 18px; margin: 8px 0; }

}