/* =============================================================================
   SOLODRIVE.PRO — /operator/ Cockpit + Dashboard, 2026-10 (WO-2026-3743)
   Spec of record: design-system/operator-cockpit-2026-10/SPEC.md + comps.html
   (WO-2026-3264, approved by Mike 2026-10-06).

   Two skins on #co-root, set by the shell (124):
     .sdk-car     — the Cockpit, in the car, dark (cockpit / drive / gig / pause)
     .sdk-parked  — the Dashboard and its sections, parked, light

   COLOURS: the live staging tokens only (operator-refresh-2026.css), the same
   values the comps used. No colour here is new.

   The work view (140, `.co-parked.sdk-work`) is styled by operator-refresh-2026
   for the parked light theme. In the car it is re-skinned by RE-POINTING that
   file's tokens (--paper, --surface, --ink, ...) to the in-car values, so every
   older card (set a fare, waiting on rider, closeout, the stale-location repair,
   Make a regular) turns dark without a second copy of its rules.

   Loaded after operator-refresh-2026.css. Every selector is under .sdk-car,
   .sdk-parked or an .sdk-* class.
   ============================================================================= */

#co-root.sdk-car,
#co-root.sdk-parked {
  --car-bg: #0d1428; --car-raised: #161f3c; --car-raised-2: #1d2848;
  --car-line: rgba(244, 241, 234, .12);
  --car-ink: #f4f1ea; --car-soft: rgba(244, 241, 234, .68); --car-faint: rgba(244, 241, 234, .44);
  --car-green: #5fd08a; --car-amber: #f0b454;
  --k-clay: #c2613d; --k-clay-ink: #9c4a2c; --k-clay-soft: #f3e2d8;
  --k-paper: #f4f1ea; --k-surface: #ffffff; --k-ink: #14182b; --k-muted: #5b6076;
  --k-line: rgba(20, 24, 43, .10); --k-navy: #121b36; --k-ok: #15803d; --k-amber-soft: #f6e6cf;
  --k-sans: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --k-mono: 'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;
  --k-serif: 'Fraunces', 'Iowan Old Style', Georgia, serif;
  font-family: var(--k-sans);
}

/* ---- skins -------------------------------------------------------------- */
#co-root.sdk-car { background: var(--car-bg); color: var(--car-ink); display: flex; flex-direction: column; }
#co-root.sdk-parked { background: var(--k-paper); color: var(--k-ink); }
body:has(#co-root.sdk-car) { background: #0d1428; }
body:has(#co-root.sdk-parked) { background: #f4f1ea; }
#co-root.sdk-car [hidden], #co-root.sdk-parked [hidden] { display: none !important; }
/* 142's full-width "Location is off for this app" notice (WO-2026-3366) is folded
   into the GPS line under these skins (SPEC §3); the line checks the permission
   itself and shows the same instruction. */
#co-root.sdk-car > .sd-op-loc-denied, #co-root.sdk-parked > .sd-op-loc-denied { display: none; }

/* The car column: bar -> GPS -> body (flex) -> thumb zone. Max 540, centred. */
#co-root.sdk-car > .sdk-bar,
#co-root.sdk-car > .sdk-gps,
#co-root.sdk-car > .sdk-gps-help,
#co-root.sdk-car > .sdk-explain,
#co-root.sdk-car > .sd-operator-app-body { width: 100%; max-width: 540px; margin-left: auto; margin-right: auto; }
#co-root.sdk-car > .sd-operator-app-body { flex: 1 1 auto; display: flex; flex-direction: column; min-height: 0; }

/* ---- §2 · the shared top bar --------------------------------------------- */
.sdk-bar {
  display: flex; align-items: center; gap: 10px; padding: 10px 14px 10px;
  max-width: 540px; margin: 0 auto; box-sizing: border-box;
}
.sdk-state { flex: none; }
.sdk-state .sd-operator-status-btn,
.sdk-state .sdk-state__ro {
  height: 52px; display: inline-flex; align-items: center; gap: 10px; padding: 0 16px 0 12px;
  border-radius: 999px; font: 700 17px/1 var(--k-sans); letter-spacing: 0; text-transform: none;
  border: 1px solid var(--car-line); background: var(--car-raised); color: var(--car-ink);
  cursor: pointer; white-space: nowrap; margin: 0; box-shadow: none; min-width: 0;
}
.sdk-state .sd-operator-status-btn::before,
.sdk-state .sdk-state__ro::before {
  content: ""; width: 40px; height: 24px; border-radius: 999px; flex: none;
  background: rgba(244, 241, 234, .18) radial-gradient(circle 9px at 12px 50%, var(--car-ink) 98%, transparent 100%) no-repeat;
}
.sdk-state--on .sd-operator-status-btn::before,
.sdk-state--trip .sdk-state__ro::before {
  background: var(--car-green) radial-gradient(circle 9px at 28px 50%, #0d1428 98%, transparent 100%) no-repeat;
}
.sdk-state--off .sd-operator-status-btn::before {
  background: rgba(240, 180, 84, .35) radial-gradient(circle 9px at 12px 50%, var(--car-amber) 98%, transparent 100%) no-repeat;
}
.sdk-state--gig .sd-operator-status-btn::before {
  background: var(--car-amber) radial-gradient(circle 9px at 28px 50%, #0d1428 98%, transparent 100%) no-repeat;
}
.sdk-state__ro { cursor: help; }

.sdk-modes {
  margin-left: auto; display: flex; height: 52px; border-radius: 999px; padding: 4px; box-sizing: border-box;
  background: var(--car-raised); border: 1px solid var(--car-line);
}
.sdk-modes a {
  flex: 1 1 0; display: flex; align-items: center; justify-content: center; gap: 6px; padding: 0 13px;
  border-radius: 999px; font: 700 15px/1 var(--k-sans); color: var(--car-soft); text-decoration: none; white-space: nowrap;
}
.sdk-modes a.is-cur { background: var(--car-ink); color: var(--car-bg); }
.sdk-badge {
  min-width: 20px; height: 20px; border-radius: 10px; background: var(--k-clay); color: #fff;
  font: 800 12px/20px var(--k-sans); display: inline-flex; align-items: center; justify-content: center; padding: 0 5px;
  box-sizing: border-box;
}
.sdk-explain {
  margin: 0 14px 8px; padding: 10px 14px; border-radius: 14px; font-size: 15px;
  background: var(--car-raised-2); color: var(--car-ink);
}

/* parked bar */
.sdk-parked .sdk-state .sd-operator-status-btn,
.sdk-parked .sdk-state .sdk-state__ro { background: var(--k-surface); border-color: var(--k-line); color: var(--k-ink); padding: 0 12px 0 10px; gap: 8px; }
.sdk-parked .sdk-state--on .sd-operator-status-btn::before,
.sdk-parked .sdk-state--trip .sdk-state__ro::before {
  background: var(--k-ok) radial-gradient(circle 9px at 28px 50%, #fff 98%, transparent 100%) no-repeat;
}
.sdk-parked .sdk-state--off .sd-operator-status-btn::before {
  background: var(--k-amber-soft) radial-gradient(circle 9px at 12px 50%, #d98a2b 98%, transparent 100%) no-repeat;
}
.sdk-parked .sdk-modes { background: #e7e2d7; border-color: transparent; }
.sdk-parked .sdk-modes a { color: var(--k-muted); padding: 0 11px; }
.sdk-parked .sdk-modes a.is-cur { background: var(--k-navy); color: #fff; }
.sdk-parked .sdk-explain { background: var(--k-surface); color: var(--k-ink); border: 1px solid var(--k-line); }

/* ---- §3 · the GPS line ------------------------------------------------------ */
.sdk-gps {
  display: flex; align-items: center; gap: 8px; margin: 0 auto; padding: 0 18px 10px;
  font-size: 15px; color: var(--car-soft); border-bottom: 1px solid var(--car-line); box-sizing: border-box;
  min-height: 26px;
}
.sdk-gps > i { width: 9px; height: 9px; border-radius: 50%; background: var(--car-green); flex: none; }
.sdk-gps--stale, .sdk-gps--stale > span { color: var(--car-amber); }
.sdk-gps--stale > i { background: var(--car-amber); }
.sdk-gps .sd-operator-location-btn {
  margin-left: auto; flex: none; height: 36px; padding: 0 14px; border-radius: 999px;
  border: 1px solid rgba(240, 180, 84, .5); background: transparent; color: var(--car-amber);
  font: 700 15px/1 var(--k-sans); cursor: pointer; position: relative;
}
.sdk-gps .sd-operator-location-btn::after { content: ""; position: absolute; inset: -6px -4px; } /* 48px hit area */
.sdk-gps-help { margin: 8px auto 0; padding: 0 18px; font-size: 14px; color: var(--car-amber); box-sizing: border-box; }

/* ---- §4 · the in-car instrument (S1 / S2 / S7 / pause) -------------------- */
/* margin:0 + width:100% — refresh-2026 gives .co-cockpit / .co-parked `margin: 0 auto`,
   and auto margins in a flex column switch off stretch: the box would size to its
   content (measured 487px inside a 390px viewport with the up-next strip present). */
.sdk-car .co-cockpit.sdk-cockpit {
  margin: 0; width: 100%; box-sizing: border-box;
  min-height: 0; flex: 1 1 auto; border-radius: 0; background: transparent; max-width: none;
  display: flex; flex-direction: column;
}
.sdk-cockpit .sdk-body { flex: 1 1 auto; display: flex; flex-direction: column; padding: 18px 18px 0; min-height: 0; }
.sdk-kicker { font-size: 16px; font-weight: 500; color: var(--car-soft); }
.sdk-word { font-size: 58px; font-weight: 850; letter-spacing: -.035em; line-height: 1; margin-top: 6px; }
.sdk-word--amber { color: var(--car-amber); }
.sdk-word--green { color: var(--car-green); }
.sdk-sub { font-size: 18px; line-height: 1.4; color: var(--car-soft); margin: 12px 0 0; max-width: 30ch; }
.sdk-today { margin-top: auto; display: flex; align-items: baseline; gap: 12px; padding: 16px 0 18px; }
.sdk-today b { font: 800 44px/1 var(--k-mono); letter-spacing: -.03em; color: var(--car-ink); }
.sdk-today span { font-size: 16px; color: var(--car-soft); }
.sdk-clock { display: flex; gap: 28px; margin-top: 22px; }
.sdk-clock b { display: block; font: 800 44px/1.05 var(--k-mono); letter-spacing: -.03em; }
.sdk-clock span { font-size: 15px; color: var(--car-soft); }

/* convert card (S7): paper card on navy, 112px QR, the handle in mono */
.sdk-convert {
  margin-top: 16px; display: flex; gap: 14px; align-items: center; padding: 14px;
  border-radius: 18px; background: var(--car-ink); color: var(--k-ink);
}
.sdk-convert .sdk-qr { width: 112px; height: 112px; flex: none; border-radius: 10px; background: #fff; padding: 6px; box-sizing: border-box; overflow: hidden; }
.sdk-convert .sdk-qr img, .sdk-convert .sdk-qr canvas, .sdk-convert .sdk-qr svg { width: 100% !important; height: 100% !important; display: block; }
.sdk-convert h3 { font: 800 19px/1.2 var(--k-sans); letter-spacing: -.01em; margin: 0; color: var(--k-ink); }
.sdk-convert p { font-size: 15px; color: var(--k-muted); margin: 6px 0 0; line-height: 1.35; }
.sdk-convert .handle { font: 700 15px var(--k-mono); color: var(--k-clay-ink); margin-top: 8px; }

/* pickers keep the 84px tiles from WO-2026-323 */
.sdk-cockpit .ck-grid { margin-top: 14px; }

/* ---- thumb zone: one 76px primary, up to two 58px secondaries ------------ */
.sdk-thumb {
  flex: none; padding: 12px 18px 22px; display: flex; flex-direction: column; gap: 12px;
  background: linear-gradient(180deg, rgba(13, 20, 40, 0), var(--car-bg) 18px);
  position: sticky; bottom: 0; z-index: 3;
}
.sdk-car .sdk-btn,
.sdk-car .sdk-go .sd-operator-status-btn {
  width: 100%; box-sizing: border-box; display: flex; align-items: center; justify-content: center;
  text-decoration: none; cursor: pointer; font-family: var(--k-sans); text-transform: none; margin: 0;
}
.sdk-car .sdk-btn--primary,
.sdk-car .sdk-go .sd-operator-status-btn {
  height: 76px; min-height: 76px; border-radius: 22px; border: 0; font-size: 22px; font-weight: 800; letter-spacing: -.01em;
  background: var(--k-clay); color: #fff; box-shadow: 0 10px 28px rgba(194, 97, 61, .35);
}
.sdk-car .sdk-go .sd-operator-status-btn { background: var(--car-green); color: #0d1428; box-shadow: none; }
.sdk-car .sdk-go .sd-operator-status-btn.is-online { background: var(--car-raised); color: var(--car-ink); border: 1px solid var(--car-line); }
.sdk-car .sdk-btn--primary.sdk-btn--green { background: var(--car-green); color: #0d1428; box-shadow: none; } /* pause: I'm back (3766 item 3) */
.sdk-car .sdk-btn--primary[disabled] { opacity: .45; box-shadow: none; cursor: default; }
.sdk-car .sdk-btn--ghost {
  height: 58px; min-height: 58px; border-radius: 18px; font-size: 18px; font-weight: 700;
  border: 1px solid var(--car-line); background: var(--car-raised); color: var(--car-ink); padding: 0 10px;
}
.sdk-car .sdk-btn--quiet, .sdk-car .sdk-scr .sdk-btn--ghost { color: var(--car-soft); }
.sdk-row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.sdk-row2 > :only-child { grid-column: 1 / -1; }
.sdk-row2 form { margin: 0 !important; }
.sdk-thumb .ck-statusline { min-height: 0; font-size: 15px; color: var(--car-soft); text-align: center; }
.sdk-thumb .ck-statusline:empty { display: none; }

/* up-next strip: 56px, raised navy */
.sdk-next {
  flex: none; margin: 0; display: flex; align-items: center; gap: 12px; height: 56px; padding: 0 14px;
  border-radius: 16px; background: var(--car-raised-2); font: 400 16px var(--k-sans); color: var(--car-ink);
  text-decoration: none; border: 0; cursor: pointer; text-align: left; box-sizing: border-box; width: auto;
}
/* min-width:0 down the column: in a flex column a child's min-content width
   (the strip's no-wrap name + place) would otherwise widen the whole screen. */
#co-root.sdk-car .sd-operator-app-body, .sdk-car .co-cockpit, .sdk-cockpit .sdk-body, .sdk-thumb, .sdk-next,
.sdk-car .sdk-work, .sdk-scr, .sdk-car .sdk-work > .sd-operator-panel { min-width: 0; }
.sdk-next b { font-weight: 700; white-space: nowrap; flex: none; }
.sdk-next .w { flex: 1 1 auto; color: var(--car-soft); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.sdk-next em { margin-left: auto; font-style: normal; color: var(--car-soft); font-weight: 700; flex: none; }
.sdk-thumb .sdk-next { width: 100%; }
.sdk-next--request { border: 2px solid var(--k-clay); } /* request waiting behind a gig/pause (3766 item 1) */
.sdk-scr > .sdk-next { width: 100%; margin-top: 14px; }

/* ---- the work view (140) in the car: token re-point ------------------------ */
.sdk-car .co-parked.sdk-work {
  --paper: #f4f1ea; /* stays cream: refresh-2026 uses it as TEXT on the navy readouts / fare */
  --paper-2: #1d2848; --surface: #161f3c; --surface-soft: #161f3c;
  --ink: #f4f1ea; --muted: rgba(244, 241, 234, .68); --faint: rgba(244, 241, 234, .44);
  --line: rgba(244, 241, 234, .12); --line-2: rgba(244, 241, 234, .20);
  --navy: #f4f1ea; --navy-2: #1d2848; --green: #5fd08a; --amber: #f0b454; --amber-soft: rgba(240, 180, 84, .14);
  --clay-soft: rgba(194, 97, 61, .18); --clay-ink: #f08a63; --teal-ink: #5fd08a;
  --shadow-card: none;
  max-width: none; width: 100%; margin: 0; flex: 1 1 auto; display: flex; flex-direction: column;
  padding: 12px 18px 0; box-sizing: border-box; gap: 0; color: var(--car-ink);
}
.sdk-car .sdk-work > .sd-operator-panel.is-active { flex: 1 1 auto; display: flex; flex-direction: column; min-height: 0; }
.sdk-car .sdk-work .sd-operator-live-note { display: none; }
.sdk-car .sdk-work .statusbar.st-act .sword { color: #f08a63; }
.sdk-car .sdk-work .readouts { background: var(--car-raised); border: 1px solid var(--car-line); }
.sdk-car .sdk-work .co-trip-map .ctm-canvas { background: #1a2340; }
.sdk-car .sdk-work .actzone { position: sticky; bottom: 0; padding-bottom: 22px; background: linear-gradient(180deg, rgba(13, 20, 40, 0), var(--car-bg) 18px); }
.sdk-car .sdk-work .opbtn.primary { min-height: 76px; border-radius: 22px; font-size: 22px; }
.sdk-car .sdk-work .opbtn.ghost { min-height: 58px; border-radius: 18px; font-size: 18px; font-weight: 700; background: var(--car-raised); border: 1px solid var(--car-line); color: var(--car-soft); }
.sdk-car .sdk-work .qb-amount input { color: var(--car-ink); }
.sdk-car .sdk-work .sd-locwarn__fail { color: #f08a63; }
.sdk-car .sdk-work .sd-op-state-box { color: var(--car-ink); }

/* the queue panel is the up-next sheet */
.sdk-sheet-head { display: none; }
.sdk-car .sdk-work .sdk-sheet-head { display: block; font-size: 22px; font-weight: 800; margin: 6px 0 12px; }
.sdk-parked .sdk-work .sdk-sheet-head { display: none; }

/* ---- S3-S6 screens ------------------------------------------------------------ */
.sdk-scr { flex: 1 1 auto; display: flex; flex-direction: column; min-height: 0; }
.sdk-scr .sdk-thumb { margin: auto -18px 0; }
.sdk-crumb { margin: 0 0 8px; }
.sdk-status { display: flex; align-items: center; gap: 8px; font-size: 16px; font-weight: 700; margin-bottom: 12px; }
.sdk-status i { width: 10px; height: 10px; border-radius: 50%; flex: none; }
.sdk-status--clay { color: #f08a63; } .sdk-status--clay i { background: var(--k-clay); box-shadow: 0 0 0 5px rgba(194, 97, 61, .25); }
.sdk-status--green { color: var(--car-green); } .sdk-status--green i { background: var(--car-green); }
.sdk-status--amber { color: var(--car-amber); } .sdk-status--amber i { background: var(--car-amber); }

.sdk-who { display: flex; align-items: center; gap: 12px; }
.sdk-who .av { width: 48px; height: 48px; border-radius: 50%; background: var(--car-raised-2); color: var(--car-ink); display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 20px; flex: none; }
.sdk-who .nm { font-size: 22px; font-weight: 800; letter-spacing: -.01em; }
.sdk-who .meta { font-size: 15px; color: var(--car-soft); margin-top: 2px; }
.sdk-who .call { margin-left: auto; width: 52px; height: 52px; border-radius: 50%; border: 1px solid var(--car-line); background: var(--car-raised); color: var(--car-ink); display: flex; align-items: center; justify-content: center; flex: none; }
.sdk-who .call svg { width: 22px; height: 22px; }

/* §5 · map slots. 140c draws inside; only the slot is ours. Radius 18. */
.sdk-map { position: relative; margin-top: 14px; flex: none; }
.sdk-car .sdk-work .sdk-map .co-trip-map { margin: 0; border: 0; border-radius: 18px; background: #1a2340; overflow: hidden; }
.sdk-car .sdk-work .sdk-map .ctm-head { position: absolute; left: 10px; top: 10px; z-index: 2; padding: 4px 8px; border-radius: 6px; background: rgba(13, 20, 40, .78); gap: 8px; max-width: calc(100% - 20px); box-sizing: border-box; }
.sdk-car .sdk-work .sdk-map .ctm-head .k { display: none; }
.sdk-car .sdk-work .sdk-map .ctm-head:not(:has(.ctm-state:not(:empty), .ctm-pax:not([hidden]))) { display: none; }
.sdk-car .sdk-work .sdk-map .ctm-state { font-size: 12px; color: var(--car-soft); }
.sdk-car .sdk-work .sdk-map .ctm-state[data-live="1"] { color: var(--car-green); }
.sdk-map--quote .ctm-canvas { height: 196px !important; }
.sdk-map--paid  .ctm-canvas { height: 260px !important; }
.sdk-scr--fill .sdk-map--fill { flex: 1 1 auto; min-height: 260px; display: flex; flex-direction: column; }
.sdk-scr--fill .sdk-map--fill .co-trip-map { flex: 1 1 auto; display: flex; flex-direction: column; }
.sdk-scr--fill .sdk-map--fill .ctm-canvas { flex: 1 1 auto; height: auto !important; min-height: 260px; }
.sdk-maps {
  position: absolute; right: 10px; bottom: 10px; z-index: 2; height: 44px; padding: 0 14px; border-radius: 999px;
  background: var(--car-ink); color: var(--car-bg); font: 800 15px/44px var(--k-sans); text-decoration: none; white-space: nowrap;
}
.sdk-car .sdk-work a.sdk-maps { color: var(--car-bg); } /* beats refresh-2026's `.co-parked a { color: inherit }` */
.sdk-maps-row { margin-top: 14px; }
.sdk-maps-row .sdk-maps { position: static; display: inline-flex; align-items: center; }

.sdk-stops { margin-top: 14px; display: grid; grid-template-columns: 16px 1fr; column-gap: 12px; row-gap: 10px; font-size: 17px; line-height: 1.3; }
.sdk-stops .dot { width: 6px; height: 6px; box-sizing: content-box; border-radius: 50%; margin-top: 4px; border: 3px solid var(--car-ink); }
.sdk-stops .dot.end { background: var(--car-ink); }
.sdk-stops small { display: block; font-size: 14px; color: var(--car-faint); }

.sdk-fare {
  display: flex; align-items: flex-end; justify-content: space-between; margin-top: 14px; padding: 14px 16px;
  border-radius: 18px; background: var(--car-raised); border: 1px solid var(--car-line);
}
.sdk-fare .amt { font: 700 44px/1 var(--k-serif); letter-spacing: -.01em; }
.sdk-fare .lab { font-size: 15px; color: var(--car-soft); margin-bottom: 6px; }
.sdk-fare .keep { text-align: right; font-size: 15px; color: var(--car-soft); }
.sdk-fare .keep b { display: block; font: 800 22px var(--k-mono); color: var(--car-green); }
.sdk-note { font-size: 14px; color: var(--car-soft); margin-top: 8px; line-height: 1.4; }
.sdk-facts { display: flex; gap: 18px; font-size: 16px; color: var(--car-soft); margin-top: 14px; }
.sdk-facts b { color: var(--car-ink); font-family: var(--k-mono); font-weight: 800; }

/* 3281 telemetry in the car: three tiles, mono numerals, caption under */
.sdk-car .sdk-work .sdk-scr .ride-telemetry .readouts { margin-top: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); background: var(--car-raised); border: 1px solid var(--car-line); border-radius: 18px; }
.sdk-car .sdk-work .sdk-scr .ride-telemetry .ro { text-align: left; padding: 12px 10px 12px 14px; border-left: 1px solid var(--car-line); }
.sdk-car .sdk-work .sdk-scr .ride-telemetry .ro:first-child { border-left: 0; }
.sdk-car .sdk-work .sdk-scr .ride-telemetry .ro + .ro::before { display: none; }
.sdk-car .sdk-work .sdk-scr .ride-telemetry .rn { font: 800 30px/1.05 var(--k-mono); letter-spacing: -.03em; }
.sdk-car .sdk-work .sdk-scr .ride-telemetry .rn small { font-size: 15px; font-weight: 700; color: var(--car-soft); }
.sdk-car .sdk-work .sdk-scr .ride-telemetry .rl { font: 400 14px var(--k-sans); letter-spacing: 0; text-transform: none; color: var(--car-soft); margin-top: 4px; }
.sdk-car .sdk-work .sdk-scr .ride-telemetry .ro-src { text-align: left; font: 400 14px var(--k-sans); letter-spacing: 0; text-transform: none; color: var(--car-faint); margin-top: 8px; }
.sdk-car .sdk-work .sdk-scr .ride-telemetry .ro-src[data-tone="warn"] { color: var(--car-amber); }

/* cancel confirms + More / Make a regular disclosures in the 2-up row */
.sdk-row2--cancel .opcancel-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 0 !important; grid-column: 1 / -1; }
.sdk-row2--cancel { display: block; }
.sdk-row2--cancel + .hint, .sdk-thumb .hint { font-size: 14px; color: var(--car-faint); text-align: center; }
.sdk-car .sdk-work .opcancel + .opcancel { margin-top: 0; }
.sdk-car .sdk-work .opcancel[open], .sdk-more[open] { grid-column: 1 / -1; }
.sdk-car .sdk-work .opcancel > summary.opbtn,
.sdk-more > summary.opbtn { list-style: none; }
.sdk-more > summary::-webkit-details-marker { display: none; }
.sdk-more__body { margin-top: 10px; display: grid; gap: 10px; }
.sdk-more__body .opcancel-row { display: grid; gap: 10px; margin: 0 !important; }
.sdk-more--regular .sdk-more__body { max-height: 60vh; overflow: auto; padding: 4px 2px; }

/* ---- §6 · the Dashboard (S8) ------------------------------------------------ */
#co-root.sdk-parked > .sd-operator-app-body,
#co-root.sdk-parked > .sdk-bar { max-width: 540px; margin-left: auto; margin-right: auto; }
.sdk-parked .co-parked { padding: 4px 16px 24px; box-sizing: border-box; }
.sdk-parked .co-parked .pk-eyebrow { font: 700 15px var(--k-sans); letter-spacing: 0; text-transform: none; color: var(--k-muted); margin: 18px 2px 8px; }
.sdk-needs { background: var(--k-surface); border: 2px solid var(--k-clay); border-radius: 18px; overflow: hidden; }
.sdk-needs a { display: flex; align-items: center; gap: 12px; padding: 14px; border-top: 1px solid var(--k-line); color: inherit; text-decoration: none; }
.sdk-needs a:first-child { border-top: 0; }
.sdk-needs .av { width: 40px; height: 40px; border-radius: 50%; background: var(--k-clay-soft); color: var(--k-clay-ink); display: flex; align-items: center; justify-content: center; font-weight: 800; flex: none; font-size: 16px; }
.sdk-needs .m { min-width: 0; }
.sdk-needs .t { font-size: 16px; font-weight: 700; }
.sdk-needs .s { font-size: 14px; color: var(--k-muted); margin-top: 2px; }
.sdk-needs .sdk-flag { color: var(--k-clay-ink); font-weight: 600; }
.sdk-pill { margin-left: auto; flex: none; font-size: 14px; font-weight: 700; padding: 8px 12px; border-radius: 999px; background: var(--k-clay); color: #fff; white-space: nowrap; }
.sdk-pill--ok { background: #e1f1e6; color: var(--k-ok); }
.sdk-needs-empty { padding: 14px 16px; }
.sdk-needs-empty .t { font-weight: 700; }
.sdk-needs-empty .s { font-size: 14px; color: var(--k-muted); margin-top: 2px; }
.sdk-viewall { display: inline-block; margin-top: 10px; font-size: 14px; }
.sdk-nudge { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-radius: 14px; background: var(--k-amber-soft); font-size: 15px; margin-top: 12px; color: var(--k-ink); text-decoration: none; }
.sdk-nudge b { font-weight: 700; }
.sdk-nudge em { margin-left: auto; white-space: nowrap; font-style: normal; font-weight: 700; color: var(--k-clay-ink); }
.sdk-nudge-help { font-size: 14px; line-height: 1.4; color: var(--k-muted); margin: 6px 2px 0; }
.sdk-paused { display: block; margin-top: 12px; text-decoration: none; color: inherit; }
.co-parked .pkcard.sdk-money, .sdk-money { display: grid; grid-template-columns: 1.3fr 1fr 1fr; padding: 14px 16px; }
.sdk-money b { display: block; font: 800 24px var(--k-mono); letter-spacing: -.02em; }
.sdk-money span { font-size: 14px; color: var(--k-muted); }

/* the console as 56px list rows (same a.mod entries + badges) */
.sdk-parked .mods.sdk-list { display: block; background: var(--k-surface); border: 1px solid var(--k-line); border-radius: 18px; overflow: hidden; }
.sdk-parked .mods.sdk-list .mod {
  display: grid; grid-template-columns: 30px 1fr auto; grid-template-rows: auto auto; column-gap: 12px; align-items: center;
  min-height: 56px; padding: 8px 14px; box-sizing: border-box; border: 0; border-top: 1px solid var(--k-line);
  border-radius: 0; box-shadow: none; background: transparent; color: inherit; text-decoration: none;
}
.sdk-parked .mods.sdk-list .mod:first-child { border-top: 0; }
.sdk-parked .mods.sdk-list .mod .ic { grid-row: 1 / span 2; width: 30px; height: 30px; border-radius: 9px; background: var(--k-paper); display: flex; align-items: center; justify-content: center; color: var(--k-clay-ink); font-weight: 800; font-size: 14px; margin: 0; }
.sdk-parked .mods.sdk-list .mod .mt { grid-column: 2; font-size: 16px; font-weight: 600; margin: 0; }
.sdk-parked .mods.sdk-list .mod .ms { grid-column: 2; font-size: 13px; color: var(--k-muted); margin: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sdk-parked .mods.sdk-list .mod .stat { grid-column: 3; grid-row: 1 / span 2; font-size: 14px; font-weight: 500; margin: 0; }
.sdk-parked .mods.sdk-list .mod.is-coming { opacity: .55; }