/* Review actions have the same weight, with the opportunity count as a small accent. */
#review-dock .review-tool,
#review-dock .review-tool.review-opportunities {
  border-color:color-mix(in srgb,var(--secondary) 36%,var(--line));
  background:color-mix(in srgb,var(--secondary) 8%,var(--surface));
  box-shadow:inset 0 1px 0 #ffffff09,0 2px 4px #00000008;
  font-weight:650;
  color:var(--ink);
}
#review-dock .review-tool>.icon,
#review-dock .review-tool.review-opportunities>.icon {color:var(--ink);stroke-width:1.8}
#review-dock .review-tool:hover,
#review-dock .review-tool[aria-expanded="true"] {
  border-color:var(--secondary);
  background:color-mix(in srgb,var(--secondary) 15%,var(--surface));
}
#review-dock .review-opportunities .review-count {
  color:#bf242a;
  background:color-mix(in srgb,var(--red) 10%,var(--surface));
  border:1px solid color-mix(in srgb,var(--red) 20%,transparent);
  font-weight:750;
}
html[data-theme="dark"] #review-dock .review-opportunities .review-count {color:#ff7378}
.sector-times-label {display:flex;flex-direction:column;gap:3px;flex:none;font-size:10px;line-height:1.3;font-weight:600;color:var(--secondary)}
.sector-times-label small {font-size:9px;font-weight:450;color:var(--muted)}

/* Exit controls remain easy to find after selecting a focused section. */
#clear-graph-selection,
#review-dock #review-clear-selection,
.analysis-focus-actions [data-clear-analysis],
[data-clear-custom] {
  min-height:33px;
  padding:7px 11px;
  border:1px solid color-mix(in srgb,var(--secondary) 45%,var(--line));
  border-radius:7px;
  background:var(--surface-raised);
  color:var(--ink);
  font-size:11px;
  font-weight:650;
  line-height:1.25;
  white-space:nowrap;
}
#clear-graph-selection:hover,
#review-dock #review-clear-selection:hover,
.analysis-focus-actions [data-clear-analysis]:hover,
[data-clear-custom]:hover {background:var(--surface-alt);border-color:var(--secondary)}
#map-focus-badge {border-color:color-mix(in srgb,var(--secondary) 38%,var(--line))}
#map-focus-badge #exit-map-focus {
  width:34px;
  height:34px;
  min-width:34px;
  padding:0;
  border:1px solid color-mix(in srgb,var(--secondary) 42%,var(--line));
  border-radius:6px;
  background:var(--surface-alt);
  color:var(--ink);
  font-size:24px;
  font-weight:500;
  line-height:1;
}
#map-focus-badge #exit-map-focus:hover {border-color:var(--secondary);background:var(--surface-raised)}
#review-dock #review-clear-selection {width:auto;height:auto;min-width:0}

/* The same neutral scrim is used by Compare, Details and Review. */
dialog::backdrop,
#modal::backdrop,
.review-dialog::backdrop {background:rgb(12 13 15 / 66%);backdrop-filter:blur(4px)}

/* Reclaim eight pixels from the summary and give them to the map. */
.summary-strip {padding-block:16px}
.map-wrap {height:408px}
@media(min-width:1600px) {.map-wrap {height:438px}}
@media(max-width:850px) {.map-wrap {height:388px}}
@media(max-width:560px) {.summary-strip {padding-block:13px}.map-wrap {height:468px}}

/* Attribution belongs below the map controls, never over the circuit. */
html[data-accent-style] .map-wrap:not(.expanded) .map-attribution,
html[data-accent-style] .map-wrap.is-range-focused.focus-narrow .map-attribution {
  left:18px!important;
  right:18px;
  bottom:4px!important;
  max-width:calc(100% - 36px);
  font-size:8px!important;
  line-height:1.25;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  color:var(--map-panel-muted);
  background:transparent;
  pointer-events:none;
}
.map-attribution a {pointer-events:auto}
html[data-accent-style] .map-wrap.expanded .map-attribution {left:22px!important;right:22px;bottom:86px!important;font-size:8px!important;line-height:1.25;max-width:calc(100% - 44px)}

/* Keep Lap Details attached to the live readings, including narrow focused maps. */
html[data-accent-style] .map-telemetry .map-lap-details {
  display:flex;
  grid-column:1/-1;
  align-items:center;
  justify-content:center;
  gap:6px;
  width:100%;
  min-height:30px;
  margin-top:3px;
  padding:6px 8px;
  pointer-events:auto;
  border:1px solid var(--map-panel-border);
  border-radius:6px;
  background:var(--surface);
  color:var(--ink);
  font-size:10px;
  font-weight:600;
  line-height:1.25;
  white-space:nowrap;
}
html[data-accent-style] .map-telemetry .map-lap-details .icon {width:13px;height:13px}
html[data-accent-style] .map-telemetry .map-lap-details:hover {border-color:var(--secondary);background:var(--surface-alt)}

/* A softer light palette: off-white surfaces, neutral grey canvas, legible ink. */
html[data-theme="light"] {
  --canvas:#e7e9e8;
  --surface:#f0f1ef;
  --surface-alt:#e4e7e5;
  --surface-raised:#f5f5f2;
  --ink:#242b2f;
  --secondary:#606a70;
  --muted:#626d72;
  --line:#d0d6d3;
  --chart-grid:#d9dedb;
  --chart-mask:#d7dcd9;
  --map-panel:#eeefecf2;
  --map-panel-border:#c5ccc8;
  --map-panel-text:#374148;
  --map-panel-muted:#687279;
}
html[data-theme="light"] :where(.global-nav,.session-rail,.summary-strip,.analysis-card,.chart-card,.sector-cell,.back-button,.lap-number,.metric-select,.lap-video-card,.custom-sector-card,dialog,kbd) {background:var(--surface);border-color:var(--line)}
html[data-theme="light"] :where(.button:not(.primary):not(.engaged):not(.ai-coach-button),.field select,.field input,.field textarea,.filter-row select,.custom-name input,.offset-controls>button:not(.button),.graph-zoom-toolbar button) {background:var(--surface);border-color:var(--line)}
html[data-theme="light"] :where(.button:not(.primary):not(.engaged):not(.ai-coach-button):hover,.back-button:hover) {background:var(--surface-alt)}
html[data-theme="light"] :where(.segmented button.active,.event-type-toggles button[aria-pressed="true"]) {background:var(--surface-raised)}
html[data-theme="light"] .map-wrap {background:#e1e3e4}
html[data-theme="light"] .map-wrap.layer-none {background:var(--surface)}
html[data-theme="light"] .map-wrap[data-map-style="precision"] {--map-sheet:#e3e5e6;--map-edge:#bac0c4;--map-road:#d3d7da;background:radial-gradient(ellipse at 65% 45%,#f1f2f355,transparent 65%),var(--map-sheet)}
html[data-theme="light"] .map-wrap[data-map-style="precision"].layer-none {background:var(--surface)}
html[data-theme="light"] :is(.catalog-gate-label,.catalog-corner-label) rect {fill:#eef0f1ee;stroke:#bdc3c7}

/* Combined analysis controls remain subordinate to lap selection. */
#combined-session-controls {margin-top:14px;padding:12px 0 0;border-top:1px solid var(--line);flex:none}
.combine-sessions-panel {margin:0;padding:0}
.combine-sessions-panel .modal-intro {margin-top:0}
.combine-sessions-panel .combined-session-warning {margin-top:17px}
.combine-sessions-panel .modal-actions {display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px;margin-top:18px}
.combine-session-options {max-height:330px;overflow:auto;overscroll-behavior:contain;padding:1px 3px 3px 1px}
.combine-sessions-button {display:flex;align-items:center;justify-content:center;gap:7px;width:100%;min-height:38px;border:1px solid color-mix(in srgb,var(--secondary) 30%,var(--line));border-radius:7px;background:var(--surface-alt);color:var(--ink);font-size:11px;font-weight:600;padding:8px}
.combine-sessions-button .icon {width:15px;height:15px}
.combine-sessions-button:hover {border-color:var(--secondary);background:var(--surface-raised)}
.combined-session-summary {font-size:10px;line-height:1.5;color:var(--secondary);margin:0 2px 9px}
.combined-session-summary strong {font-weight:600;color:var(--ink);display:block}
.combined-session-summary>span {display:block;margin-top:3px}
.lap-source-label {font-size:9px!important;letter-spacing:0!important;color:var(--muted);line-height:1.35;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:125px}
.combine-session-option {display:flex;align-items:center;gap:13px;width:100%;padding:15px;border:1px solid var(--line);border-radius:9px;background:var(--surface);text-align:left;margin-top:9px;color:var(--ink);cursor:pointer}
.combine-session-option:hover {border-color:var(--secondary);background:var(--surface-alt)}
.combine-session-option:has(input:checked) {border-color:color-mix(in srgb,var(--secondary) 45%,var(--line));background:var(--surface-alt)}
.combine-session-option>span {min-width:0;flex:1}
.combine-session-option strong {font-size:14px;font-weight:600;display:block}
.combine-session-option small {font-size:11px;color:var(--secondary);line-height:1.5;display:block;margin-top:5px}
.combine-session-option>b {font-size:18px;font-weight:600;letter-spacing:-.3px;font-variant-numeric:tabular-nums;white-space:nowrap;text-align:right}
.combine-session-option>b small {font-size:10px;font-weight:450;letter-spacing:0}
.combine-session-option input {accent-color:var(--red);width:17px;height:17px;flex:none}
.combined-session-warning {display:block;margin:0 0 17px;padding:12px 14px;border:1px solid color-mix(in srgb,#b78b43 40%,var(--line));border-radius:9px;background:color-mix(in srgb,#b78b43 9%,var(--surface));color:var(--ink);font-size:12px;line-height:1.6}
.combined-session-warning>.icon {color:#bc924f;width:19px;height:19px;margin-top:2px}
.combined-session-warning strong {font-size:12px;display:block;font-weight:650;margin-bottom:3px}
.combined-session-warning p {margin:0;color:var(--secondary)}
#combine-session-error {color:var(--red);font-size:12px;line-height:1.5}
.app-shell.rail-collapsed .session-rail>#combined-session-controls {display:block;width:100%;padding-top:10px}
.rail-collapsed #combined-session-controls .combined-session-summary,.rail-collapsed .combine-sessions-button>span {display:none}
.rail-collapsed .combine-sessions-button {width:38px;min-height:36px;margin:auto;padding:8px}
#combine-session-mobile {display:none}
@media(max-width:850px) {#combine-session-mobile {display:inline-flex}.sector-times-label {flex-direction:row;gap:7px;align-items:baseline}}
@media(max-width:560px) {.sector-times-label {width:100%;font-size:10px}.combined-session-warning {padding:11px;font-size:11px}.combine-session-option {padding:12px 10px;gap:9px}.combine-session-option strong {font-size:12px}.combine-session-option small {font-size:10px}.combine-session-option>b {font-size:15px}.combine-sessions-panel .modal-actions {justify-content:stretch}.combine-sessions-panel .modal-actions>.button {flex:1 1 auto}}
