/* FleetDV visual system v89 — presentation only; no financial or data behavior. */
:root {
  --fl-page: #f4f7f7;
  --fl-surface: #ffffff;
  --fl-surface-soft: #f7f9f9;
  --fl-surface-strong: #eef3f2;
  --fl-text: #141a1d;
  --fl-muted: #667177;
  --fl-line: #dce4e2;
  --fl-line-strong: #cbd7d4;
  --fl-accent: #167861;
  --fl-accent-soft: #e4f3ee;
  --fl-positive: #167861;
  --fl-warning: #9a6513;
  --fl-negative: #b64a43;
  --fl-radius-sm: 10px;
  --fl-radius: 16px;
  --fl-radius-lg: 24px;
  --fl-shadow: 0 10px 30px rgba(20, 35, 39, .06);
  --fl-shadow-raised: 0 18px 48px rgba(20, 35, 39, .09);
}

body[data-experience="modern"] {
  --fl-page: #f3f7fc;
  --fl-surface-soft: #f7faff;
  --fl-surface-strong: #eaf1fb;
  --fl-text: #102238;
  --fl-muted: #627188;
  --fl-line: #dbe5f0;
  --fl-line-strong: #c7d6e6;
  --fl-accent: #1769d2;
  --fl-accent-soft: #e7f0fd;
  --fl-shadow: 0 10px 30px rgba(25, 55, 92, .07);
  --fl-shadow-raised: 0 20px 54px rgba(25, 55, 92, .12);
}

body[data-experience="premium"] {
  --fl-page: #eef2f6;
  --fl-surface: #fbfcfe;
  --fl-surface-soft: #f3f6fa;
  --fl-surface-strong: #e7edf5;
  --fl-text: #101b2d;
  --fl-muted: #637086;
  --fl-line: #d7e0eb;
  --fl-line-strong: #c2cfde;
  --fl-accent: #2459b8;
  --fl-accent-soft: #e5edfb;
  --fl-radius: 18px;
  --fl-radius-lg: 26px;
  --fl-shadow: 0 12px 34px rgba(12, 30, 58, .08);
  --fl-shadow-raised: 0 22px 62px rgba(12, 30, 58, .14);
}

body { background: var(--fl-page); color: var(--fl-text); }
.main-content, .view { min-width: 0; }
.view { animation: fl-view-in .22s ease both; }
@keyframes fl-view-in { from { opacity: .55; transform: translateY(4px); } }

/* Page and section hierarchy */
.section-toolbar {
  align-items: flex-end;
  gap: 20px;
  margin-bottom: 22px;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--fl-line);
}
.section-toolbar h1, .section-toolbar h2 { color: var(--fl-text); letter-spacing: -.035em; }
.section-toolbar p { color: var(--fl-muted); max-width: 68ch; }
.overline, .mini-label { color: var(--fl-accent); letter-spacing: .14em; font-weight: 800; }
.panel {
  background: var(--fl-surface);
  border: 1px solid var(--fl-line);
  border-radius: var(--fl-radius-lg);
  box-shadow: var(--fl-shadow);
  overflow: clip;
}
.panel-head { gap: 18px; padding-bottom: 18px; border-bottom: 1px solid var(--fl-line); }
.panel-head h2 { color: var(--fl-text); letter-spacing: -.025em; }
.panel-head p, .panel-caption { color: var(--fl-muted); }

/* KPI and analytical surfaces */
.mini-metrics { gap: 14px; }
.mini-metric {
  position: relative;
  min-width: 0;
  background: var(--fl-surface);
  border: 1px solid var(--fl-line);
  border-radius: var(--fl-radius);
  box-shadow: var(--fl-shadow);
  padding: 19px 20px;
  overflow: hidden;
}
.mini-metric::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 3px; background: var(--fl-accent); opacity: .82; }
.mini-metric span { color: var(--fl-muted); font-size: .82rem; font-weight: 700; letter-spacing: .025em; }
.mini-metric strong { color: var(--fl-text); font-family: Manrope, sans-serif; letter-spacing: -.035em; }
body[data-experience="premium"] .mini-metric:first-child,
body[data-experience="premium"] .insight-card { background: linear-gradient(145deg, #12233f, #1d3b69); color: #fff; border-color: transparent; }
body[data-experience="premium"] .mini-metric:first-child span,
body[data-experience="premium"] .mini-metric:first-child strong,
body[data-experience="premium"] .insight-card :is(h2,p,.overline) { color: #fff; }

/* Controls */
.table-filters, .filter-bar {
  background: var(--fl-surface-soft);
  border: 1px solid var(--fl-line);
  border-radius: var(--fl-radius);
  padding: 12px;
  gap: 10px;
}
.table-filters label, .filter-bar label { color: var(--fl-muted); font-weight: 700; }
:is(input, select, textarea) {
  background: var(--fl-surface);
  color: var(--fl-text);
  border-color: var(--fl-line-strong);
  border-radius: var(--fl-radius-sm);
  transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
:is(input, select, textarea):focus { border-color: var(--fl-accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--fl-accent) 16%, transparent); outline: 0; }
:is(button, a, input, select, textarea):focus-visible { outline: 3px solid color-mix(in srgb, var(--fl-accent) 28%, transparent); outline-offset: 2px; }
.primary-button, .checkout-button { box-shadow: 0 8px 20px color-mix(in srgb, var(--fl-accent) 18%, transparent); }
.primary-button:hover, .checkout-button:hover { transform: translateY(-1px); }
.secondary-button, .account-button, .more-button { background: var(--fl-surface); border-color: var(--fl-line-strong); color: var(--fl-text); }
.secondary-button:hover, .account-button:hover, .more-button:hover { background: var(--fl-accent-soft); border-color: color-mix(in srgb, var(--fl-accent) 34%, var(--fl-line)); }
.status-pill, .signal, .account-status, .admin-status { font-weight: 800; border: 1px solid currentColor; border-color: color-mix(in srgb, currentColor 22%, transparent); }

/* Intentional financial tables */
.fleet-table-wrap, .table-wrap { border: 1px solid var(--fl-line); border-radius: var(--fl-radius); background: var(--fl-surface); overflow: auto; }
.data-table { width: 100%; border-collapse: separate; border-spacing: 0; }
.data-table thead th {
  position: relative;
  background: var(--fl-surface-strong);
  color: var(--fl-muted);
  border-bottom: 1px solid var(--fl-line-strong);
  font-size: .75rem;
  letter-spacing: .055em;
  text-transform: uppercase;
  white-space: nowrap;
}
.data-table tbody td { border-bottom: 1px solid var(--fl-line); color: var(--fl-text); vertical-align: middle; }
.data-table tbody tr:last-child td { border-bottom: 0; }
.data-table tbody tr { transition: background .14s ease; }
.data-table tbody tr:hover { background: color-mix(in srgb, var(--fl-accent-soft) 48%, var(--fl-surface)); }
.data-table td:not(:first-child), .data-table th:not(:first-child) { font-variant-numeric: tabular-nums; }
.profit-value { color: var(--fl-positive) !important; font-weight: 800; }
.data-table small { color: var(--fl-muted); }

/* Shared content patterns */
.vehicle-card, .expense-vehicle-card, .maintenance-vehicle-card, .annual-vehicle-card, .vehicle-decision-card, .loan-card, .mileage-card {
  border-color: var(--fl-line);
  box-shadow: var(--fl-shadow);
  transition: border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}
.vehicle-card:hover, .expense-vehicle-card:hover, .annual-vehicle-card:hover, .vehicle-decision-card:hover { border-color: var(--fl-line-strong); box-shadow: var(--fl-shadow-raised); transform: translateY(-2px); }
.vehicle-photo-frame { background: linear-gradient(145deg, var(--fl-surface-strong), var(--fl-surface-soft)); }
.vehicle-photo-frame img { transition: transform .3s ease; }
.vehicle-card:hover .vehicle-photo-frame img, .expense-vehicle-card:hover .vehicle-photo-frame img { transform: scale(1.015); }
.expense-row, .mileage-row, .loan-payment-row, .pricing-row, .booking-row, .service-timeline-item, .reimbursement-row, .alert-row {
  border-color: var(--fl-line);
  background: var(--fl-surface);
}
.expense-row:hover, .mileage-row:hover, .loan-payment-row:hover, .pricing-row:hover { background: var(--fl-surface-soft); }
.expense-bars i, .weekday-bars i, .break-track i { background: var(--fl-accent); }
.empty-state {
  min-height: 128px;
  border: 1px dashed var(--fl-line-strong);
  border-radius: var(--fl-radius);
  background: var(--fl-surface-soft);
  color: var(--fl-muted);
}
.empty-state strong { color: var(--fl-text); }
.empty-state.small { min-height: 92px; }

/* Bookings: desktop financial surface + purpose-built phone cards */
.bookings-data-surface { padding: 18px; }
.bookings-data-surface .table-filters { margin-bottom: 16px; }
.bookings-desktop-table .data-table td:nth-child(n+4):nth-child(-n+9),
.bookings-desktop-table .data-table th:nth-child(n+4):nth-child(-n+9) { text-align: right; }
.bookings-desktop-table .data-table td:last-child { white-space: nowrap; }
.bookings-mobile-cards { display: none; }
.booking-mobile-card {
  background: var(--fl-surface);
  border: 1px solid var(--fl-line);
  border-radius: var(--fl-radius);
  box-shadow: var(--fl-shadow);
  padding: 14px;
}
.booking-mobile-head { display: grid; grid-template-columns: 64px minmax(0,1fr) auto; gap: 12px; align-items: center; }
.booking-vehicle-image { width: 64px; aspect-ratio: 4/3; border-radius: 11px; }
.booking-mobile-identity { min-width: 0; display: grid; gap: 2px; }
.booking-mobile-identity strong, .booking-mobile-identity small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.booking-mobile-identity small { color: var(--fl-muted); }
.booking-mobile-guest { color: var(--fl-text); font-weight: 800; font-size: 1rem; }
.booking-mobile-result { display: flex; justify-content: space-between; align-items: baseline; margin: 14px 0 10px; padding: 12px 0; border-block: 1px solid var(--fl-line); }
.booking-mobile-result span { color: var(--fl-muted); font-weight: 700; }
.booking-mobile-result strong { color: var(--fl-positive); font: 800 1.28rem Manrope, sans-serif; }
.booking-mobile-card details summary { cursor: pointer; color: var(--fl-accent); font-weight: 800; padding: 4px 0; }
.booking-mobile-card dl { display: grid; gap: 0; margin: 10px 0 0; }
.booking-mobile-card dl div { display: flex; justify-content: space-between; gap: 16px; padding: 9px 0; border-bottom: 1px solid var(--fl-line); }
.booking-mobile-card dt { color: var(--fl-muted); }
.booking-mobile-card dd { margin: 0; color: var(--fl-text); font-weight: 700; text-align: right; font-variant-numeric: tabular-nums; }
.booking-mobile-actions { display: grid; grid-template-columns: 1fr auto; gap: 10px; padding-top: 14px; }

/* Shared vehicle recognition */
.fleet-vehicle-image--compact { width: 48px; aspect-ratio: 4 / 3; flex: 0 0 48px; border-radius: 10px; }
.fleet-vehicle-image--thumbnail { width: clamp(100px, 12vw, 150px); aspect-ratio: 16 / 9; flex: 0 0 auto; border-radius: 13px; }
.fleet-vehicle-image :is(img,.vehicle-image-fallback) { width: 100%; height: 100%; }
.fleet-vehicle-image img { object-fit: contain; object-position: var(--vehicle-image-position,50% 50%); }
.vehicle-cell-photo { min-width: 210px; gap: 12px; }
.vehicle-summary-image { max-width: 100%; }
.booking-row-photo { grid-template-columns: 48px auto minmax(0,1fr) auto; align-items: center; }
.booking-row-photo .fleet-vehicle-image { width: 48px; }

/* Fleet Pulse is one shared data component with three visual expressions. */
.fleet-pulse { margin: 20px 0; padding: 20px; }
.fleet-pulse-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,290px),1fr)); gap: 14px; padding-top: 18px; }
.fleet-pulse-card { min-width: 0; overflow: hidden; background: var(--fl-surface); border: 1px solid var(--fl-line); border-radius: var(--fl-radius); cursor: pointer; transition: transform .18s ease,box-shadow .18s ease,border-color .18s ease; }
.fleet-pulse-card:hover { transform: translateY(-2px); border-color: var(--fl-line-strong); box-shadow: var(--fl-shadow-raised); }
.fleet-pulse-media { position: relative; background: var(--fl-surface-strong); }
.fleet-pulse-media .fleet-vehicle-image { width: 100%; aspect-ratio: 16 / 9; border-radius: 0; }
.fleet-pulse-media .vin-status { position: absolute; left: 12px; bottom: 12px; }
.fleet-pulse-body { padding: 16px; }
.fleet-pulse-title { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.fleet-pulse-title h3 { margin: 0; color: var(--fl-text); font: 800 1.05rem Manrope,sans-serif; letter-spacing: -.025em; }
.fleet-pulse-title small { color: var(--fl-muted); }
.fleet-pulse-metrics { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 16px; }
.fleet-pulse-metrics div { min-width: 0; padding: 11px; border-radius: 11px; background: var(--fl-surface-soft); }
.fleet-pulse-metrics span { display: block; color: var(--fl-muted); font-size: .75rem; font-weight: 700; }
.fleet-pulse-metrics strong { display: block; margin-top: 4px; color: var(--fl-text); font-variant-numeric: tabular-nums; }
body[data-experience="classic"] .fleet-pulse-card { display: grid; grid-template-columns: 118px minmax(0,1fr); }
body[data-experience="classic"] .fleet-pulse-media .fleet-vehicle-image { height: 100%; aspect-ratio: auto; border-radius: 0; }
body[data-experience="classic"] .fleet-pulse-media .vin-status { display: none; }
body[data-experience="classic"] .fleet-pulse-metrics { grid-template-columns: repeat(2,1fr); }
body[data-experience="modern"] .fleet-pulse-card { box-shadow: 0 10px 28px rgba(25,55,92,.08); }
body[data-experience="premium"] .fleet-pulse-card { border-color: #cfdae8; box-shadow: 0 16px 38px rgba(12,30,58,.1); }
body[data-experience="premium"] .fleet-pulse-title h3 { font-size: 1.12rem; }
.modern-side-stack-wide { grid-template-columns: repeat(2,minmax(0,1fr)); }

/* Goal presentation uses the selected global reporting period. */
.goal-card { overflow: hidden; }
.goal-card .goal-track { height: 8px; background: color-mix(in srgb,#fff 16%,transparent); border-radius: 999px; overflow: hidden; }
.goal-card .goal-track i { display: block; height: 100%; border-radius: inherit; transition: width .3s ease; }
.goal-context { display: block; margin-top: 7px; opacity: .78; line-height: 1.35; }
.goal-remaining { display: block; margin-top: 7px; font-size: .82rem; }
.goal-card.goal-achieved .goal-track i { background: #57db9e; }
body[data-experience="modern"] .goal-card { border-color: rgba(126,169,224,.35); }
body[data-experience="premium"] .goal-card { background: linear-gradient(145deg,rgba(255,255,255,.1),rgba(255,255,255,.035)); border-color: rgba(255,255,255,.16); }

/* Operational trip thumbnails */
.trip-vehicle-identity { min-width: 0; display: flex; align-items: center; gap: 14px; }
.trip-vehicle-identity > div:last-child { min-width: 0; }
.trip-vehicle-identity strong,.trip-vehicle-identity small { display: block; }
.trip-vehicle-image { max-width: 100%; }

/* Charts, dashboards and page-specific cohesion */
.revenue-panel, .breakdown-panel, .annual-trend-panel, .expense-category-panel { background: var(--fl-surface); }
.insight-card { border-color: color-mix(in srgb, var(--fl-accent) 28%, var(--fl-line)); background: var(--fl-accent-soft); }
.annual-trend-chart, .chart-area, .calendar-content { background: var(--fl-surface-soft); border-radius: var(--fl-radius); }
.annual-month-grid, .annual-vehicle-grid, .expense-vehicle-grid, .maintenance-grid { gap: 16px; }
.annual-detail-table > summary { color: var(--fl-text); font-weight: 800; }
.calendar-day { border-color: var(--fl-line); background: var(--fl-surface); }
.calendar-day:hover { border-color: var(--fl-accent); background: var(--fl-accent-soft); }
.goal-card progress, .progress-track { accent-color: var(--fl-accent); }
.decision-card, .annual-highlight-card, .goal-card { background: var(--fl-surface); border: 1px solid var(--fl-line); box-shadow: var(--fl-shadow); }
.account-panel, .modal { background: var(--fl-surface); border-color: var(--fl-line); box-shadow: var(--fl-shadow-raised); }
.account-identity, .account-plan-card, .account-support-card, .account-danger-card { background: var(--fl-surface-soft); border-color: var(--fl-line); }
.auth-card { box-shadow: var(--fl-shadow-raised); border: 1px solid var(--fl-line); }
.loading-card { border: 1px solid rgba(255,255,255,.12); box-shadow: var(--fl-shadow-raised); }
.toast { box-shadow: var(--fl-shadow-raised); }

body[data-experience="modern"] .panel,
body[data-experience="modern"] .mini-metric { border-radius: 18px; }
body[data-experience="modern"] .panel-head { border-bottom-color: #dce7f3; }
body[data-experience="premium"] .panel { box-shadow: 0 14px 38px rgba(12,30,58,.075), inset 0 1px rgba(255,255,255,.75); }
body[data-experience="premium"] .data-table thead th { background: #e9eef6; color: #45546b; }
body[data-experience="classic"] .panel,
body:not([data-experience]) .panel { box-shadow: 0 5px 18px rgba(20,35,39,.045); }

/* Loading and motion preferences */
.skeleton, [data-loading="true"] { position: relative; overflow: hidden; background: var(--fl-surface-strong); }
.skeleton::after, [data-loading="true"]::after { content: ""; position: absolute; inset: 0; transform: translateX(-100%); background: linear-gradient(90deg, transparent, rgba(255,255,255,.55), transparent); animation: fl-shimmer 1.25s infinite; }
@keyframes fl-shimmer { to { transform: translateX(100%); } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; } }

@media (max-width: 760px) {
  .view { max-width: 100%; overflow-x: clip; }
  .section-toolbar { align-items: stretch; gap: 12px; margin-bottom: 16px; padding-bottom: 14px; }
  .section-toolbar > :is(button, .primary-button, .secondary-button) { width: 100%; }
  .panel { border-radius: 18px; }
  .panel-head { align-items: flex-start; gap: 10px; }
  .mini-metrics { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
  .mini-metric { padding: 15px 14px; min-height: 104px; }
  .mini-metric span { font-size: .76rem; line-height: 1.25; }
  .mini-metric strong { font-size: clamp(1.18rem,6vw,1.62rem); }
  .table-filters, .filter-bar { display: grid; grid-template-columns: 1fr; }
  .table-filters label, .table-filters input, .table-filters select { width: 100%; min-width: 0; }
  .bookings-data-surface { padding: 12px; background: transparent; border: 0; box-shadow: none; overflow: visible; }
  .bookings-desktop-table { display: none; }
  .bookings-mobile-cards { display: grid; gap: 12px; }
  .booking-mobile-head { grid-template-columns: 58px minmax(0,1fr); }
  .booking-mobile-head > .status-pill { grid-column: 2; justify-self: start; }
  .booking-vehicle-image { width: 58px; grid-row: 1 / span 2; }
  .booking-mobile-actions { grid-template-columns: 1fr; }
  .booking-mobile-actions > * { width: 100%; min-height: 44px; }
  .fleet-pulse { padding: 14px; }
  .fleet-pulse-grid { grid-template-columns: 1fr; }
  body[data-experience="classic"] .fleet-pulse-card { display: block; }
  body[data-experience="classic"] .fleet-pulse-media .fleet-vehicle-image { width: 100%; height: auto; aspect-ratio: 16 / 9; }
  .fleet-pulse-card:hover { transform: none; }
  .fleet-pulse-metrics { grid-template-columns: 1fr 1fr; }
  .modern-side-stack-wide { grid-template-columns: 1fr; }
  .trip-action-head { align-items: flex-start; }
  .trip-vehicle-identity { align-items: flex-start; }
  .trip-vehicle-identity .fleet-vehicle-image--thumbnail { width: 88px; flex-basis: 88px; }
  .booking-row-photo { grid-template-columns: 44px auto minmax(0,1fr); }
  .booking-row-photo > span:last-child { grid-column: 3; }
  .data-table { font-size: .9rem; }
  .empty-state { min-height: 112px; padding: 18px; }
  .vehicle-card:hover, .expense-vehicle-card:hover, .annual-vehicle-card:hover, .vehicle-decision-card:hover { transform: none; }
}

@media (max-width: 390px) {
  .mini-metrics { grid-template-columns: 1fr 1fr; }
  .booking-mobile-card { padding: 12px; }
  .booking-mobile-result strong { font-size: 1.15rem; }
}
/* Version 91: operational calendar, compact setup, profile, and vehicle lifecycle */
.setup-launchpad{overflow:hidden}.setup-launchpad>summary{display:flex;align-items:center;justify-content:space-between;gap:24px;cursor:pointer;list-style:none}.setup-launchpad>summary::-webkit-details-marker{display:none}.setup-launchpad:not([open]){padding-block:18px}.setup-launchpad:not([open]) .setup-intro h2{font-size:20px;margin:2px 0}.setup-launchpad:not([open]) .setup-intro p{margin:0}.setup-toggle{white-space:nowrap;font-weight:800;color:var(--accent,#177e66)}
.profile{width:100%;border:0;text-align:left;cursor:pointer}.profile-avatar,.account-avatar,.profile-photo-preview{background-size:cover!important;background-position:center!important}.profile b{margin-left:auto}.account-identity span#accountEmail{display:block;color:#718078;font-size:13px}.account-profile-card{padding:18px;border:1px solid rgba(21,47,39,.12);border-radius:18px;background:rgba(247,250,248,.88)}.profile-photo-editor{display:grid;grid-template-columns:64px 1fr;gap:14px;align-items:start;margin:12px 0}.profile-photo-preview{width:64px;height:64px}.profile-photo-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:8px}
.vehicle-lifecycle-filter select{min-height:44px;border:1px solid rgba(20,45,38,.16);border-radius:12px;padding:0 36px 0 12px;background:#fff}.sold-vehicle-card{opacity:.84}.vehicle-sold-badge{display:inline-flex;padding:6px 9px;border-radius:999px;background:#eef0f0;color:#47514e;font-weight:800;font-size:11px}.vehicle-activity.sold{background:#eef0f0;color:#47514e}.vehicle-card-footer>div{display:flex;gap:12px;align-items:center}
.calendar-booking-modal{max-width:560px}.calendar-booking-identity{display:grid;grid-template-columns:minmax(160px,42%) 1fr;gap:18px;align-items:center;margin:18px 0}.calendar-booking-identity .fl-vehicle-image{aspect-ratio:16/9;border-radius:16px;overflow:hidden}.calendar-booking-identity h2{margin:0 0 4px}.calendar-booking-facts{display:grid;grid-template-columns:1fr 1fr;gap:10px}.calendar-booking-facts>div{padding:13px;border-radius:13px;background:#f3f6f4}.calendar-booking-facts span{display:block;color:#6b7671;font-size:12px}.calendar-booking-facts strong{display:block;margin-top:4px}.calendar-event.booking-event{cursor:pointer}
.goal-card{flex:none!important;overflow:visible!important;min-height:max-content}.goal-card small,.goal-card strong{white-space:normal}.goal-track{flex:none}
@media(max-width:680px){.vehicle-header-actions{display:grid!important;grid-template-columns:1fr 1fr;width:100%}.vehicle-search{grid-column:1/-1}.vehicle-header-actions .primary-button{width:100%}.calendar-booking-identity{grid-template-columns:1fr}.calendar-booking-identity .fl-vehicle-image{width:100%}.calendar-booking-facts{grid-template-columns:1fr}.setup-launchpad>summary{align-items:flex-start}.setup-toggle{font-size:13px}.profile-photo-editor{grid-template-columns:56px 1fr}.profile-photo-preview{width:56px;height:56px}}

/* Version 92: calmer account surfaces and compact Turo onboarding */
.setup-launchpad{
  display:block;
  padding:0;
  overflow:hidden;
  border:1px solid #d9e3df;
  border-radius:20px;
  background:#fff;
  color:#15201d;
  box-shadow:0 14px 40px rgba(18,39,32,.07);
}
.setup-launchpad>summary{
  min-height:92px;
  padding:22px 26px;
  border-bottom:1px solid #e4ebe8;
  background:linear-gradient(110deg,#f7faf9 0%,#f0f7f4 62%,#eef5ff 100%);
}
.setup-launchpad:not([open])>summary{border-bottom:0}
.setup-launchpad .setup-intro .overline{color:#16725c}
.setup-launchpad .setup-intro h2{color:#14201d;font-size:20px}
.setup-launchpad .setup-intro p{max-width:none;color:#64726d;font-size:13px}
.setup-launchpad .setup-toggle{
  display:inline-flex;
  align-items:center;
  min-height:38px;
  padding:0 16px;
  border:1px solid #bed2ca;
  border-radius:999px;
  background:#fff;
  color:#176a57;
  font-size:12px;
}
.setup-launchpad .setup-toggle:after{content:"  ↓";margin-left:7px}
.setup-launchpad[open] .setup-toggle:after{content:"  ↑"}
.setup-launchpad .setup-steps{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;padding:18px 20px 20px}
.setup-launchpad .setup-step{
  grid-template-columns:auto minmax(0,1fr) auto;
  min-height:88px;
  padding:15px;
  border:1px solid #dce6e2;
  border-radius:15px;
  background:#f8faf9;
  color:#17211e;
}
.setup-launchpad .setup-number{width:36px;height:36px;border-radius:11px;background:#dff7ed;color:#12644f;font-size:14px}
.setup-launchpad .setup-step strong{font-size:14px;color:#17211e}
.setup-launchpad .setup-step small{color:#6f7c77;font-size:11px}
.setup-launchpad .setup-step .secondary-button{min-height:40px;border-color:#bdccc6;background:#fff;color:#18231f}
.setup-launchpad .setup-step .secondary-button:hover{border-color:#16725c;background:#eef7f3}
.setup-launchpad .setup-state{background:#edf1ef;color:#5f6d68;font-size:10px}
.setup-launchpad .setup-step[data-status="complete"]{border-color:#b9dfd0;background:#f1faf6}
.setup-launchpad .setup-step[data-status="complete"] .setup-state{background:#d9f4e8;color:#12644f}
.setup-launchpad .setup-step[data-status="attention"]{border-color:#ead7a5;background:#fffaf0}
.setup-launchpad .setup-step[data-status="attention"] .setup-state{background:#fff0c7;color:#7b5710}

.account-panel{background:#f3f6f8;color:#142033}
.account-panel-head{border-bottom-color:#dce3ea;background:rgba(248,250,252,.97)}
.account-panel-body{gap:16px;padding-top:20px}
.account-identity{
  grid-template-columns:64px minmax(0,1fr);
  padding:18px;
  border-color:#d8e1ea;
  border-radius:18px;
  background:#fff;
  box-shadow:0 8px 25px rgba(26,48,79,.05);
}
.account-identity .account-avatar{width:64px;height:64px;border-radius:18px;background:#10243f;color:#caff4a;font-size:20px}
.account-identity small{color:#708096}
.account-identity strong{font-size:17px;color:#152238}
.account-identity span#accountEmail{color:#68788e;font-size:13px}
.account-profile-card{
  padding:20px;
  border-color:#d8e1ea;
  border-radius:18px;
  background:#fff;
  box-shadow:0 8px 25px rgba(26,48,79,.05);
}
.account-profile-card>.mini-label{color:#2763ba}
.profile-photo-editor{grid-template-columns:72px minmax(0,1fr);gap:16px;margin:14px 0 18px}
.profile-photo-preview{width:72px;height:72px;border-radius:18px;background:#10243f;color:#caff4a;font-size:20px}
.profile-photo-editor>div{display:grid;gap:9px;min-width:0}
.profile-photo-editor label{display:grid;gap:7px;color:#566579;font-size:12px;font-weight:800}
.profile-photo-editor input:not([type="file"]){width:100%;min-width:0;height:44px;padding:0 13px;border:1px solid #cad5e1;border-radius:11px;background:#f9fbfc;color:#142033;font-size:15px}
.profile-photo-editor input:focus{border-color:#3978d6;outline:3px solid rgba(57,120,214,.14)}
.profile-photo-actions{margin-top:0}
.account-profile-card #saveProfileButton{min-height:44px;border-color:#1f5fae;background:#1f5fae;color:#fff}
.account-profile-card #saveProfileButton:hover{background:#184d8e}
.account-plan-card,
[data-experience="classic"] .account-plan-card,
[data-experience="modern"] .account-plan-card,
[data-experience="premium"] .account-plan-card{
  border:1px solid #19375e;
  background:linear-gradient(135deg,#0c1d33 0%,#12345b 100%);
  color:#fff;
  box-shadow:0 16px 36px rgba(12,35,65,.2);
}
.account-plan-card .mini-label{color:#8fb8f5}
.account-plan-card .account-plan-head h3{color:#fff}
.account-plan-card .account-plan-head p,.account-plan-card .account-plan-benefits{color:#c2d1e4}
.account-plan-card .account-status.active{border-color:#92bf35;background:#1e351d;color:#d5ff62}
.account-support-card,.account-danger-card{border-color:#d8e1ea!important;background:#fff!important;color:#142033;box-shadow:0 8px 25px rgba(26,48,79,.04)}

[data-experience="modern"] .setup-launchpad{border-color:#d5e1ec}
[data-experience="modern"] .setup-launchpad>summary{background:linear-gradient(110deg,#f6f9fc,#edf5ff)}
[data-experience="premium"] .setup-launchpad{border-color:#cddaea;box-shadow:0 18px 45px rgba(24,64,118,.1)}
[data-experience="premium"] .setup-launchpad>summary{background:linear-gradient(110deg,#f6f9fd 0%,#eaf2ff 100%)}
[data-experience="premium"] .setup-launchpad .setup-intro .overline,[data-experience="premium"] .setup-launchpad .setup-toggle{color:#205fb8}
[data-experience="premium"] .setup-launchpad .setup-number{background:#e0ebff;color:#1958ae}

/* FleetDV appearance system v93 — semantic color modes shared by every experience. */
:root,
html[data-appearance="light"] {
  --background: var(--fl-page);
  --surface: var(--fl-surface);
  --surface-elevated: #ffffff;
  --surface-soft: var(--fl-surface-soft);
  --surface-strong: var(--fl-surface-strong);
  --text-primary: var(--fl-text);
  --text-secondary: var(--fl-muted);
  --text-muted: #7a858a;
  --border: var(--fl-line);
  --border-strong: var(--fl-line-strong);
  --accent: var(--fl-accent);
  --accent-soft: var(--fl-accent-soft);
  --positive: var(--fl-positive);
  --negative: var(--fl-negative);
  --warning: var(--fl-warning);
  --information: #2469bd;
  --selected: var(--fl-accent-soft);
  --hover: #f0f5f4;
  --focus: color-mix(in srgb, var(--fl-accent) 30%, transparent);
  --disabled: #e7eceb;
  --chart-grid: #dfe6e5;
  --chart-axis: #778287;
  --overlay: rgba(7,16,20,.58);
  --skeleton-base: var(--fl-surface-strong);
  --skeleton-shine: rgba(255,255,255,.62);
}

html[data-appearance="dark"] {
  color-scheme: dark;
  --background: #0d141d;
  --surface: #141d28;
  --surface-elevated: #192432;
  --surface-soft: #111a24;
  --surface-strong: #202d3b;
  --text-primary: #f1f5f8;
  --text-secondary: #b2bec9;
  --text-muted: #8997a4;
  --border: #293746;
  --border-strong: #3a4a5c;
  --accent: #68a8ff;
  --accent-soft: #182f4c;
  --positive: #55d5ac;
  --negative: #ff8c91;
  --warning: #f4c56b;
  --information: #7db8ff;
  --selected: #1c3655;
  --hover: #1b2835;
  --focus: rgba(104,168,255,.36);
  --disabled: #25313d;
  --chart-grid: #2b3a49;
  --chart-axis: #a3b0bc;
  --overlay: rgba(2,7,12,.76);
  --skeleton-base: #202d3b;
  --skeleton-shine: rgba(255,255,255,.075);
  --fl-page: var(--background);
  --fl-surface: var(--surface);
  --fl-surface-soft: var(--surface-soft);
  --fl-surface-strong: var(--surface-strong);
  --fl-text: var(--text-primary);
  --fl-muted: var(--text-secondary);
  --fl-line: var(--border);
  --fl-line-strong: var(--border-strong);
  --fl-accent: var(--accent);
  --fl-accent-soft: var(--accent-soft);
  --fl-positive: var(--positive);
  --fl-warning: var(--warning);
  --fl-negative: var(--negative);
  --fl-shadow: 0 12px 32px rgba(0,0,0,.22);
  --fl-shadow-raised: 0 24px 64px rgba(0,0,0,.32);
}
html[data-appearance="dark"] body[data-experience="classic"] { --accent:#62c4aa; --accent-soft:#17372f; }
html[data-appearance="dark"] body[data-experience="modern"] { --accent:#69aaff; --accent-soft:#182f50; }
html[data-appearance="dark"] body[data-experience="premium"] { --accent:#8bb5ff; --accent-soft:#213653; --surface:#151e2b; --surface-elevated:#1b2635; }
html[data-appearance="dark"] body { --fl-accent:var(--accent); --fl-accent-soft:var(--accent-soft); background:var(--background); color:var(--text-primary); }

/* Shared surfaces: appearance changes presentation, never component or business logic. */
body,
.main-content,.workspace,.view,.content,.app-loading-shell,.auth-shell,.auth-form-pane,
.account-panel-body { background-color:var(--background); color:var(--text-primary); }
:is(.panel,.mini-metric,.metric-card,.feature-panel,.fleet-panel,.vehicle-card,.fleet-pulse-card,.trip-action-card,.booking-mobile-card,.bookings-data-surface,.expense-vehicle-card,.expense-category-panel,.expense-transactions-panel,.maintenance-card,.maintenance-vehicle-card,.goal-card,.report-card,.loan-card,.mileage-card,.decision-card,.vehicle-decision-card,.annual-kpi-card,.annual-month-card,.annual-highlight-card,.annual-trend-panel,.annual-month-panel,.annual-vehicle-panel,.annual-vehicle-card,.breakdown-panel,.calculator-panel,.reconciliation-card,.breakeven-card,.sidebar-card,.calendar-board,.calendar-mini-month,.account-identity,.account-profile-card,.account-appearance-card,.account-plan-card,.account-support-card,.account-danger-card,.setup-launchpad,.setup-step,.auth-card,.loading-card,.modal,.pro-upgrade-modal,.calendar-booking-modal) {
  background-color:var(--surface); border-color:var(--border); color:var(--text-primary);
}
:is(.section-toolbar,.panel-head,.account-panel-head,.calendar-board-head,.maintenance-card-head,.loan-card-head,.annual-vehicle-row,.pricing-detail-row,.profit-detail-row,.account-detail-row) { border-color:var(--border); }
:is(h1,h2,h3,h4,strong,b,.data-table td,.annual-financial-table td,.calendar-day-number) { color:var(--text-primary); }
:is(p,small,.panel-caption,.metric-label,.account-billing-note,.formula-note,.modal-note,.calendar-availability,.chart-label) { color:var(--text-secondary); }
:is(.overline,.mini-label,a,.text-button) { color:var(--accent); }

/* Appearance selector lives with the account profile, not in permanent chrome. */
.account-appearance-card { padding:20px; border:1px solid var(--border); border-radius:18px; display:grid; gap:16px; }
.account-appearance-card h3 { margin:5px 0 2px; }
.account-appearance-card p { margin:0; max-width:58ch; }
.appearance-options { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.appearance-options button { min-width:0; min-height:92px; padding:14px; display:grid; align-content:center; gap:3px; text-align:left; border:1px solid var(--border-strong); border-radius:14px; background:var(--surface-soft); color:var(--text-primary); cursor:pointer; transition:.16s ease; }
.appearance-options button>span { font-size:1.25rem; line-height:1; }
.appearance-options button small { color:var(--text-secondary); }
.appearance-options button:hover { background:var(--hover); border-color:var(--accent); transform:translateY(-1px); }
.appearance-options button.active { background:var(--selected); border-color:var(--accent); box-shadow:0 0 0 2px var(--focus); }

/* Forms, filters, buttons, menus and layered UI. */
:is(input,select,textarea,.search-box,.table-filters,.filter-bar,.calendar-filter) { background-color:var(--surface-soft); border-color:var(--border-strong); color:var(--text-primary); }
:is(input,textarea)::placeholder { color:var(--text-muted); opacity:1; }
:is(input,select,textarea):focus { border-color:var(--accent); box-shadow:0 0 0 3px var(--focus); }
:is(button,a,input,select,textarea):focus-visible { outline-color:var(--focus); }
:is(button,input,select,textarea):disabled { color:var(--text-muted); background-color:var(--disabled); opacity:.72; }
.secondary-button,.account-panel-close,.calendar-toolbar button { background:var(--surface-elevated); border-color:var(--border-strong); color:var(--text-primary); }
.secondary-button:hover,.account-panel-close:hover { background:var(--hover); }
.modal-backdrop,.account-panel-backdrop,.experience-drawer-backdrop { background:var(--overlay); }
.account-panel,.experience-drawer { background:var(--surface-elevated); color:var(--text-primary); border-color:var(--border); box-shadow:var(--fl-shadow-raised); }
.tooltip,[role="tooltip"] { background:var(--surface-elevated); color:var(--text-primary); border-color:var(--border); box-shadow:var(--fl-shadow); }

/* Financial data surfaces. Color is reinforced by signs, labels, weight and badges. */
.data-table,.annual-financial-table,.bookings-desktop-table { background:var(--surface); color:var(--text-primary); }
.data-table thead th,.annual-financial-table thead th,.bookings-desktop-table thead th { background:var(--surface-strong)!important; color:var(--text-secondary)!important; border-color:var(--border); }
.data-table :is(td,th),.annual-financial-table :is(td,th),.bookings-desktop-table :is(td,th),.booking-row,.expense-transaction-row,.maintenance-row,.loan-payment-row,.mileage-row,.cost-row,.plan-row { border-color:var(--border); }
.data-table tbody tr:hover,.annual-financial-table tbody tr:hover,.booking-row:hover,.expense-transaction-row:hover { background:var(--hover); }
:is(.positive,.profit-positive,[data-tone="positive"]) { color:var(--positive)!important; font-weight:800; }
:is(.negative,.profit-negative,[data-tone="negative"]) { color:var(--negative)!important; font-weight:800; }
:is(.warning,[data-tone="warning"]) { color:var(--warning)!important; font-weight:700; }

/* Calendar semantics in both color modes. */
.calendar-grid,.calendar-weekdays,.calendar-mini-grid { border-color:var(--border); }
.calendar-day { background:var(--surface); border-color:var(--border); color:var(--text-primary); }
.calendar-day:hover { background:var(--hover); border-color:var(--accent); }
.calendar-day.outside { background:var(--surface-soft); color:var(--text-muted); opacity:.7; }
.calendar-day.available { background:color-mix(in srgb,var(--positive) 7%,var(--surface)); }
.calendar-day.booked { background:color-mix(in srgb,var(--information) 9%,var(--surface)); }
.calendar-day.partial { background:color-mix(in srgb,var(--warning) 8%,var(--surface)); }
.calendar-day.today { box-shadow:inset 0 0 0 2px var(--accent); }
.calendar-day.selected { background:var(--selected); border-color:var(--accent); }
.calendar-event { background:var(--selected); border-color:color-mix(in srgb,var(--accent) 45%,var(--border)); color:var(--text-primary); }
.calendar-event span,.calendar-event b { color:inherit; }

/* Charts and skeletons consume semantic colors instead of assuming a white canvas. */
.chart,.chart-area,.annual-trend-chart { color:var(--text-primary); }
.chart-grid,.chart line,.annual-trend-chart line { stroke:var(--chart-grid); }
.chart text,.chart-label,.annual-trend-chart text,.annual-chart-legend { fill:var(--chart-axis); color:var(--chart-axis); }
.chart-tooltip { background:var(--surface-elevated); color:var(--text-primary); border:1px solid var(--border); box-shadow:var(--fl-shadow); }
.skeleton,[data-loading="true"] { background:var(--skeleton-base); }
.skeleton::after,[data-loading="true"]::after { background:linear-gradient(90deg,transparent,var(--skeleton-shine),transparent); }

/* Dark-mode corrections for legacy light-only presentation rules. */
html[data-appearance="dark"] :is(.setup-launchpad>summary,.setup-intro,.setup-steps,.profile-photo-editor,.account-plan-details,.calendar-content,.annual-table-wrap,.fleet-table-wrap,.expense-group-rows) { background-color:var(--surface); color:var(--text-primary); border-color:var(--border); }
html[data-appearance="dark"] :is(.setup-launchpad>summary,.account-profile-card,.account-plan-card,.account-support-card,.account-danger-card) { background-image:none; }

/* v98: Complimentary Pro remains a plan entitlement, visually separate from admin role. */
.complimentary-access-modal{max-width:560px}
.complimentary-access-modal #complimentaryAccessUser{margin:-8px 0 16px;color:var(--text-secondary);font-weight:700;overflow-wrap:anywhere}
.complimentary-access-modal .entry-form{margin-top:18px}
.admin-users-table td:last-child{min-width:190px;white-space:nowrap}
.admin-users-table td:last-child .delete-button{margin-left:7px}
@media(max-width:780px){.complimentary-access-modal{width:calc(100% - 24px);max-height:calc(100dvh - env(safe-area-inset-bottom) - 24px);overflow:auto}.admin-users-panel .table-wrap{overflow-x:auto}}
html[data-appearance="dark"] body[data-experience="premium"] :is(.mini-metric:first-child,.insight-card) { background:linear-gradient(145deg,#152843,#1c385d); }
html[data-appearance="dark"] body[data-experience="premium"] .goal-card { background:var(--surface); border-color:var(--border); }
html[data-appearance="dark"] .auth-story { background-color:#0b121a; }
html[data-appearance="dark"] .auth-card { background:var(--surface-elevated); }
html[data-appearance="dark"] .auth-tabs { background:var(--surface-soft); }
html[data-appearance="dark"] .auth-tabs button.active { background:var(--selected); color:var(--text-primary); }
html[data-appearance="dark"] .app-loading-shell .loading-card { background:var(--surface-elevated); }
html[data-appearance="dark"] :is(.fleet-vehicle-image,.vehicle-image-fallback,.profile-avatar,.account-avatar) { background-color:var(--surface-strong); border-color:var(--border); }
html[data-appearance="dark"] :is(.fleet-vehicle-image img,img[data-vehicle-image-path],.vehicle-card-image,.auth-fleet-showcase img) { filter:none!important; }

@media (max-width:640px) {
  .appearance-options { grid-template-columns:1fr; }
  .appearance-options button { min-height:64px; grid-template-columns:28px 1fr; align-items:center; }
  .appearance-options button small { grid-column:2; }
}

@media(max-width:900px){.setup-launchpad .setup-steps{grid-template-columns:1fr}}
@media(max-width:600px){
  .setup-launchpad{border-radius:16px}
  .setup-launchpad>summary{min-height:0;padding:18px;gap:12px}
  .setup-launchpad .setup-intro h2{font-size:18px}
  .setup-launchpad .setup-steps{padding:12px}
  .setup-launchpad .setup-step{grid-template-columns:auto minmax(0,1fr);min-height:0}
  .setup-launchpad .setup-step .setup-state{justify-self:start}
  .setup-launchpad .setup-step .secondary-button{grid-column:1/-1;width:100%}
  .account-identity{grid-template-columns:54px minmax(0,1fr)}
  .account-identity .account-avatar{width:54px;height:54px}
  .profile-photo-editor{grid-template-columns:60px minmax(0,1fr)}
  .profile-photo-preview{width:60px;height:60px}
  .profile-photo-actions{display:grid;grid-template-columns:1fr auto}
  .profile-photo-actions .secondary-button{width:100%}
}

/* FleetDV visual release v94 — shared structure across Classic, Modern and Premium. */
.sidebar>.profile{display:none}
.experience-profile-control{display:block;position:relative;flex:0 0 auto}
.experience-command-trigger{display:flex;align-items:center;gap:9px;width:min(320px,28vw);height:44px;margin-left:auto;padding:0 13px;border:1px solid var(--border-strong);border-radius:12px;background:var(--surface-elevated);color:var(--text-secondary);text-align:left;box-shadow:var(--fl-shadow);cursor:pointer}
.experience-command-trigger strong{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.experience-command-trigger kbd{padding:3px 6px;border:1px solid var(--border);border-radius:6px;background:var(--surface-strong);color:var(--text-secondary);font:750 .7rem "DM Sans"}
.experience-command-palette{position:fixed;inset:0;z-index:120;display:grid;place-items:start center;padding-top:12vh;background:var(--overlay);backdrop-filter:blur(10px)}
.experience-command-palette[hidden]{display:none}
.experience-command-palette>section{width:min(620px,calc(100vw - 28px));overflow:hidden;border:1px solid var(--border);border-radius:18px;background:var(--surface-elevated);box-shadow:var(--fl-shadow-raised)}
.experience-command-input{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;padding:14px;border-bottom:1px solid var(--border)}
.experience-command-input input{min-width:0;border:0!important;box-shadow:none!important;background:transparent!important}
.experience-command-results{display:grid;gap:4px;max-height:55vh;padding:8px;overflow:auto}
.experience-command-results button{display:flex;justify-content:space-between;min-height:52px;padding:9px 11px;border:0;border-radius:10px;background:var(--surface-soft);color:var(--text-primary);text-align:left}
.experience-command-results button:hover{background:var(--hover)}
.experience-command-results small{display:block;color:var(--text-secondary)}
#experienceProfileButton{display:grid;place-items:center;width:44px;height:44px;padding:0;border:1px solid var(--border-strong);border-radius:50%;background:var(--surface-elevated);color:var(--text-primary);box-shadow:var(--fl-shadow);cursor:pointer}
#experienceProfileInitials,#experienceProfileMenuAvatar{display:grid;place-items:center;background:var(--surface-strong);color:var(--accent);font-weight:850;background-size:cover;background-position:center}
#experienceProfileInitials{width:34px;height:34px;border-radius:50%}
#experienceProfileMenuAvatar{width:46px;height:46px;border-radius:14px}
.experience-profile-menu{position:absolute!important;z-index:110!important;right:0!important;top:52px!important;width:min(320px,calc(100vw - 24px))!important;display:grid!important;gap:7px!important;padding:14px!important;border:1px solid var(--border)!important;border-radius:18px!important;background:var(--surface-elevated)!important;color:var(--text-primary)!important;box-shadow:var(--fl-shadow-raised)!important}
.experience-profile-menu[hidden]{display:none!important}
.experience-profile-identity{display:grid;grid-template-columns:46px minmax(0,1fr);gap:11px;align-items:center;padding:4px 4px 8px}
.experience-profile-identity strong,.experience-profile-identity small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.experience-profile-identity small{color:var(--text-secondary);font-size:.78rem}
.experience-profile-plan{justify-self:start;margin:0 4px 5px;padding:5px 9px;border-radius:999px;background:var(--accent-soft);color:var(--accent);font-size:.72rem;font-weight:800}
.experience-profile-menu>a,.experience-profile-menu>button{display:flex;align-items:center;min-height:42px;padding:0 11px;border:0;border-radius:10px;background:var(--surface-soft)!important;color:var(--text-primary)!important;font:750 .86rem "DM Sans";text-decoration:none;text-align:left;cursor:pointer}
.experience-profile-menu>a:hover,.experience-profile-menu>button:hover{background:var(--hover)!important}
.experience-menu-group{display:grid;gap:6px;padding:9px 4px;border-top:1px solid var(--border)}
.experience-menu-group>small{color:var(--text-muted);font-size:.7rem;font-weight:850;text-transform:uppercase;letter-spacing:.11em}
.experience-menu-options{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}
.experience-menu-options button{min-width:0;min-height:38px;padding:6px;border:1px solid var(--border);border-radius:9px;background:var(--surface-soft);color:var(--text-secondary);font-weight:750;cursor:pointer}
.experience-menu-options button.active{border-color:var(--accent);background:var(--selected);color:var(--text-primary)}
.workspace-header>.header-actions .profile-button,.workspace-header>.header-actions>#signOutButton,.workspace-header>.header-actions>.subscription-badge{display:none!important}
.workspace-header{border-bottom-color:var(--border);background:color-mix(in srgb,var(--background) 92%,transparent);backdrop-filter:blur(18px)}
.header-actions{margin-left:auto}

/* Overview has an executive hierarchy instead of a wall of equal cards. */
#overviewView.active{display:flex;flex-direction:column;gap:18px}
.overview-welcome{order:0;display:flex;align-items:end;justify-content:space-between;padding:4px 2px 2px}
.overview-welcome h2{margin:4px 0 3px;color:var(--text-primary);font:800 clamp(1.55rem,3vw,2.35rem)/1.08 Manrope,sans-serif;letter-spacing:-.045em}
.overview-welcome p{margin:0;color:var(--text-secondary);font-size:.98rem}
#overviewView>.metric-grid{order:1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
#overviewView>.metric-grid .metric-card{min-height:138px;padding:20px;background:var(--surface-elevated);border:1px solid var(--border);border-radius:var(--fl-radius);box-shadow:var(--fl-shadow)}
#overviewView>.metric-grid .metric-card strong{font:800 clamp(1.65rem,3vw,2.35rem)/1 Manrope,sans-serif;color:var(--text-primary);font-variant-numeric:tabular-nums}
#overviewView>.metric-grid .metric-card.profit{background:linear-gradient(145deg,color-mix(in srgb,var(--accent-soft) 72%,var(--surface)),var(--surface-elevated));border-color:color-mix(in srgb,var(--accent) 38%,var(--border))}
#overviewView>.dashboard-grid{order:2}
#overviewView>.overview-operations-grid{order:3;grid-template-columns:repeat(3,minmax(0,1fr))}
#overviewView>.fleet-pulse{order:4}
#overviewView>.overview-alerts-panel{order:5}
#overviewView>.fleet-panel{order:6}
#overviewView>.formula-note{order:7}
#overviewView>.setup-launchpad{order:-2}
.overview-goal-card{display:flex;flex-direction:column;min-height:0!important;padding:22px!important;overflow:visible!important}
.overview-goal-card .panel-head{padding:0 0 16px;margin:0 0 16px}
.goal-summary{display:flex;align-items:end;justify-content:space-between;gap:12px;margin-bottom:12px}
.goal-summary>strong:first-child{font:800 1.15rem Manrope,sans-serif;color:var(--text-primary)}
.goal-percentage{font:800 1.5rem Manrope,sans-serif;color:var(--accent);font-variant-numeric:tabular-nums}
.overview-goal-card .goal-track{height:10px;margin:0 0 12px;background:var(--surface-strong)}
.overview-goal-card .goal-context,.overview-goal-card .goal-remaining{display:block;margin-top:5px;color:var(--text-secondary)}
.overview-goal-card .goal-remaining{color:var(--text-primary);font-size:.84rem}
.compact-alert-list{display:grid;gap:8px}
.compact-alert-list .alert-row{min-height:64px}

/* Compact operational trips; full checklists reveal only on demand. */
.trip-action-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.trip-action-card{align-self:start;padding:18px!important;background:var(--surface-elevated);border:1px solid var(--border);border-radius:var(--fl-radius-lg);box-shadow:var(--fl-shadow)}
.trip-action-head{align-items:start}
.trip-vehicle-identity{min-width:0}
.trip-vehicle-identity .fleet-vehicle-image{width:118px;max-width:32%;aspect-ratio:16/9;border-radius:12px;overflow:hidden}
.trip-handoff{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.trip-handoff>div{min-width:0;padding:10px;border:1px solid var(--border);border-radius:11px;background:var(--surface-soft)}
.trip-handoff span,.trip-phase-progress{color:var(--text-muted)}
.trip-handoff strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text-primary);font-size:.82rem}
.trip-phase-progress{display:flex;justify-content:space-between;margin-top:7px;font-size:.76rem;font-weight:750}
.trip-checklist-details{margin-top:12px;border:1px solid var(--border);border-radius:12px;background:var(--surface-soft)}
.trip-checklist-details>summary{display:flex;justify-content:space-between;padding:12px 14px;color:var(--text-primary);font-weight:800;cursor:pointer;list-style:none}
.trip-checklist-details>summary::-webkit-details-marker{display:none}
.trip-checklist-details>summary span{color:var(--text-secondary)}
.trip-checklist-details .trip-checklists{padding:4px 14px 14px}
.task-check{background:var(--surface);border-color:var(--border);color:var(--text-primary)}

/* One coherent card/table language across operational and financial pages. */
:is(.bookings-data-surface,.expense-transactions-panel,.expense-category-panel,.maintenance-vehicle-card,.annual-trend-panel,.annual-month-panel,.annual-vehicle-panel,.report-card,.loan-card,.mileage-card,.reconciliation-card,.vehicle-decision-card){background:var(--surface);border:1px solid var(--border);box-shadow:var(--fl-shadow)}
.panel,.bookings-data-surface{overflow:hidden}
.panel-head{padding:20px 22px;margin:0;border-color:var(--border)}
.fleet-table-wrap{background:var(--surface);border-radius:0 0 var(--fl-radius-lg) var(--fl-radius-lg)}
.data-table{width:100%;border-collapse:separate;border-spacing:0;font-variant-numeric:tabular-nums}
.data-table th{position:sticky;top:0;z-index:1;padding:13px 15px;font-size:.72rem;letter-spacing:.07em;text-transform:uppercase}
.data-table td{padding:15px;border-bottom:1px solid var(--border)}
.data-table td:not(:first-child),.data-table th:not(:first-child){text-align:right}
.data-table td:last-child,.data-table th:last-child{text-align:center}
.profit-value{font-weight:850;color:var(--positive)!important}
.margin-pill,.status-pill,.signal{border:1px solid var(--border);font-weight:800}
.alert-row{display:grid;grid-template-columns:32px minmax(0,1fr) auto;align-items:center;gap:12px;padding:13px 15px;border:1px solid var(--border);border-radius:12px;background:var(--surface-soft)}
.alert-row>span{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:var(--surface-strong);font-weight:900}
.alert-row.high>span{background:color-mix(in srgb,var(--negative) 17%,var(--surface));color:var(--negative)}
.alert-row.medium>span{background:color-mix(in srgb,var(--warning) 17%,var(--surface));color:var(--warning)}
.alert-row small{display:block;margin-top:2px;color:var(--text-secondary)}
.empty-state{min-height:0!important;padding:34px 22px!important;background:var(--surface-soft)!important;color:var(--text-primary)!important}
.empty-state>div{max-width:520px;margin:auto;text-align:center}
.empty-state p{margin:6px auto 14px;color:var(--text-secondary)}

/* Premium is layered, never a single giant navy slab. */
body[data-experience="premium"]{--fl-radius:18px;--fl-radius-lg:24px}
body[data-experience="premium"] .workspace{background:var(--background)!important}
body[data-experience="premium"] :is(.panel,.metric-card,.fleet-pulse-card,.vehicle-card,.trip-action-card){border:1px solid var(--border)!important;background-color:var(--surface)!important;box-shadow:0 14px 38px color-mix(in srgb,#000 12%,transparent)!important}
body[data-experience="premium"] :is(.mini-metric:first-child,.insight-card){background:linear-gradient(145deg,color-mix(in srgb,var(--accent) 19%,var(--surface-elevated)),var(--surface))!important;color:var(--text-primary)!important;border-color:color-mix(in srgb,var(--accent) 28%,var(--border))!important}
body[data-experience="premium"] :is(.mini-metric:first-child,.insight-card) :is(h2,p,strong,span,.overline){color:inherit!important}
html[data-appearance="dark"] body[data-experience="premium"]{--background:#0b121b;--surface:#131d29;--surface-elevated:#192533;--surface-soft:#101923;--surface-strong:#223141;--border:#2b3b4c;--border-strong:#3b4e61;--text-primary:#f3f6fa;--text-secondary:#b8c4cf;--text-muted:#8f9daa;--accent:#75aaff;--accent-soft:#1b3150;--positive:#54d4aa;--negative:#ff8d92;--warning:#f4c56b;--information:#84b9ff}
html[data-appearance="dark"] body[data-experience="modern"]{--background:#0d151e;--surface:#15202b;--surface-elevated:#1a2734;--surface-soft:#111b25;--surface-strong:#223240;--border:#2b3d4c;--text-primary:#f1f5f8;--text-secondary:#b5c1cb;--accent:#65a8ff;--accent-soft:#173452}
html[data-appearance="dark"] body[data-experience="classic"]{--background:#101718;--surface:#182122;--surface-elevated:#1d2828;--surface-soft:#141d1e;--surface-strong:#253131;--border:#334140;--text-primary:#f2f6f4;--text-secondary:#bac5c1;--accent:#65cbb0;--accent-soft:#19382f}
html[data-appearance="dark"] :is(.experience-modern,.experience-premium) .workspace-header{background:color-mix(in srgb,var(--background) 92%,transparent)!important;border-color:var(--border)!important}
html[data-appearance="dark"] :is(.experience-command-trigger,.experience-profile-menu,.experience-command-palette>section,.experience-command-input,.experience-command-results button,.modern-revenue-panel,.modern-expense-panel){background:var(--surface-elevated)!important;color:var(--text-primary)!important;border-color:var(--border)!important}
html[data-appearance="dark"] :is(.experience-command-trigger strong,.experience-command-input input,.experience-command-results strong,.modern-revenue-list strong,.modern-expense-list strong){color:var(--text-primary)!important}
html[data-appearance="dark"] :is(.experience-command-trigger kbd,.experience-command-input kbd){background:var(--surface-strong)!important;color:var(--text-secondary)!important;border-color:var(--border)!important}
html[data-appearance="dark"] :is(.formula-note,.setup-launchpad,.setup-launchpad>summary,.setup-steps,.setup-step,.table-filters,.filter-bar,.bookings-data-surface,.fleet-table-wrap,.data-table,.data-table tbody,.data-table tr,.data-table td,.expense-group-rows,.expense-transaction-row,.maintenance-row,.loan-payment-row,.mileage-row,.annual-table-wrap,.annual-financial-table,.calendar-board,.calendar-content,.calendar-grid,.calendar-mini-month,.auth-form-pane,.auth-card,.account-panel,.account-panel-body,.modal){background-color:var(--surface)!important;background-image:none!important;color:var(--text-primary)!important;border-color:var(--border)!important}
html[data-appearance="dark"] :is(input,select,textarea,.password-field,.experience-command-input input){background:var(--surface-soft)!important;color:var(--text-primary)!important;border-color:var(--border-strong)!important}
html[data-appearance="dark"] :is(.data-table thead th,.annual-financial-table thead th){background:var(--surface-strong)!important;color:var(--text-secondary)!important}
html[data-appearance="dark"] :is(.data-table tbody tr:hover,.expense-transaction-row:hover,.booking-row:hover){background:var(--hover)!important}
html[data-appearance="dark"] .donut{box-shadow:inset 0 0 0 1px var(--border)}

@media(max-width:1100px){
  #overviewView>.metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  #overviewView>.overview-operations-grid{grid-template-columns:1fr 1fr}
  #overviewView>.overview-operations-grid .insight-card{grid-column:1/-1}
  .trip-action-grid{grid-template-columns:1fr}
}
@media(max-width:780px){
  .workspace-header{position:sticky;top:0;z-index:45}
  .experience-profile-control{display:block!important}
  .experience-command-trigger{width:42px;margin-left:auto;padding:0;justify-content:center}
  .experience-command-trigger strong,.experience-command-trigger kbd{display:none}
  .workspace-header>.header-actions .profile-button,.workspace-header>.header-actions>#signOutButton{display:none!important}
  .overview-welcome{padding:6px 0 0}
  .overview-welcome h2{font-size:1.55rem}
  .overview-welcome p{font-size:.9rem}
  #overviewView>.metric-grid{grid-template-columns:1fr 1fr;gap:10px}
  #overviewView>.metric-grid .metric-card{min-height:120px;padding:15px}
  #overviewView>.metric-grid .metric-card strong{font-size:1.55rem}
  #overviewView>.overview-operations-grid{grid-template-columns:1fr}
  #overviewView>.overview-operations-grid .insight-card{grid-column:auto}
  .trip-action-card{padding:14px!important}
  .trip-vehicle-identity .fleet-vehicle-image{width:92px;max-width:34%}
  .trip-handoff{grid-template-columns:1fr}
  .trip-checklists{grid-template-columns:1fr!important}
  .data-table th,.data-table td{padding:12px}
  .empty-state{padding:26px 16px!important}
  .alert-row{grid-template-columns:30px minmax(0,1fr)}
  .alert-row .secondary-button{grid-column:2;justify-self:start}
}
@media(max-width:430px){
  #overviewView>.metric-grid{grid-template-columns:1fr}
  #overviewView>.metric-grid .metric-card{min-height:105px}
  .experience-profile-menu{position:fixed!important;left:12px!important;right:12px!important;top:70px!important;width:auto!important;max-height:calc(100dvh - 92px);overflow:auto}
  .goal-summary{align-items:start;flex-direction:column;gap:5px}
}

/* Mobile reliability: shared by Classic, Modern and Premium. */
.experience-profile-backdrop{position:fixed;inset:0;z-index:10000;border:0;background:transparent}
.experience-profile-backdrop[hidden]{display:none}
@media(max-width:780px){
  :root{--mobile-nav-height:72px}
  html,body{width:100%;max-width:100%}
  body.experience-drawer-open,body.profile-menu-open{overflow:hidden;overscroll-behavior:none;touch-action:none}
  .app-shell:not([hidden]){display:block!important;width:100%!important;max-width:100%!important;min-width:0!important}
  .workspace{position:relative!important;left:0!important;transform:none!important;width:100%!important;max-width:100%!important;min-width:0!important;margin:0!important;padding:0 14px calc(var(--mobile-nav-height) + env(safe-area-inset-bottom) + 32px)!important}
  .view,.panel,.metric-card,.section-toolbar,.dashboard-grid,.vehicle-grid{min-width:0;max-width:100%}
  .workspace-header{position:sticky!important;top:0;z-index:45;display:grid!important;grid-template-columns:42px minmax(0,1fr) 40px 40px!important;grid-template-rows:auto auto;align-items:center;gap:8px;width:100%!important;max-width:100%;height:auto!important;min-height:0!important;margin:0 0 16px!important;padding:10px 0 11px!important;background:color-mix(in srgb,var(--background) 94%,transparent)!important;backdrop-filter:blur(16px)}
  .menu-button{display:grid!important;grid-column:1;grid-row:1;place-items:center;width:42px;height:42px;margin:0}
  .workspace-header>div:nth-of-type(1){grid-column:2;grid-row:1;min-width:0;margin:0!important}
  .workspace-header>div:nth-of-type(1)>p{display:none}
  #pageTitle{overflow:hidden;margin:0;font-size:20px;line-height:1.15;white-space:nowrap;text-overflow:ellipsis}
  .experience-command-trigger{grid-column:3;grid-row:1;display:grid!important;place-items:center;width:40px!important;height:40px;margin:0!important;padding:0!important}
  .experience-command-trigger strong,.experience-command-trigger kbd{display:none!important}
  .experience-profile-control{position:relative;grid-column:4;grid-row:1;display:block!important;z-index:151}
  #experienceProfileButton{width:40px!important;height:40px!important;border-radius:11px!important}
  .header-actions{grid-column:1/-1;grid-row:2;display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;gap:8px;width:100%!important;min-width:0;margin:0!important;padding:0!important}
  .header-actions .month-select,.header-actions .month-select select{width:100%!important;min-width:0;max-width:100%}
  .header-actions .sample-pill,.header-actions .subscription-badge,.header-actions .account-button,.header-actions>#signOutButton{display:none!important}
  .sidebar{position:fixed!important;z-index:10020!important;inset:0 auto 0 0!important;width:min(86vw,348px)!important;max-width:calc(100vw - 40px)!important;height:100vh!important;height:100dvh!important;padding:calc(12px + env(safe-area-inset-top)) 13px calc(12px + env(safe-area-inset-bottom))!important;overflow:hidden!important;transform:translate3d(-105%,0,0)!important;transition:transform .24s ease!important;box-shadow:22px 0 56px rgba(0,0,0,.38)!important}
  .sidebar.open{transform:translate3d(0,0,0)!important}
  .experience-drawer-backdrop{position:fixed!important;z-index:10010!important;inset:0!important;display:block;width:100%;height:100%;margin:0;padding:0;border:0;background:rgba(4,11,20,.68);backdrop-filter:blur(3px)}
  .experience-drawer-backdrop[hidden]{display:none!important}
  .experience-drawer-head{display:flex!important;align-items:center;justify-content:space-between;min-height:42px;margin-bottom:7px;padding:0 5px 8px;border-bottom:1px solid rgba(255,255,255,.1)}
  #experienceDrawerClose{display:grid!important;place-items:center;width:38px;height:38px;border:1px solid rgba(255,255,255,.13);border-radius:11px;background:rgba(255,255,255,.07);color:#fff;font-size:25px}
  .sidebar .main-nav{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain}
  .main-nav :is([data-view="overview"],[data-view="bookings"],[data-view="vehicles"],[data-view="expenses"],[data-view="reports"],[data-view="profit"],[data-view="yearly"],[data-view="performance"],[data-view="decisions"],[data-view="mileage"],[data-view="safety"],[data-view="reconciliation"]){display:none!important}
  .sidebar-card,.sidebar>.profile{display:none!important}
  .experience-drawer-settings{display:grid!important;gap:3px;margin-top:auto;padding-top:9px;border-top:1px solid rgba(255,255,255,.1)}
  .experience-drawer-settings>*{display:flex;align-items:center;justify-content:space-between;min-height:44px;padding:0 12px;border:0;border-radius:10px;background:transparent;color:#aab8c2;text-decoration:none;font:700 13px "DM Sans";text-align:left}
  .experience-drawer-settings>*:focus-visible{outline:3px solid var(--focus);outline-offset:1px}
  .experience-drawer-settings>[hidden]{display:none!important}
  .experience-mobile-nav{display:grid!important;position:fixed!important;z-index:9000!important;left:10px!important;right:10px!important;bottom:max(8px,env(safe-area-inset-bottom))!important;width:auto!important;max-width:calc(100vw - 20px)!important;min-height:var(--mobile-nav-height);grid-template-columns:repeat(5,minmax(0,1fr));padding:7px!important;border:1px solid var(--border);border-radius:15px;background:color-mix(in srgb,var(--surface-elevated) 96%,transparent);box-shadow:0 14px 38px rgba(0,0,0,.24);backdrop-filter:blur(16px)}
  .experience-mobile-nav button{min-width:0;padding:7px 1px}
  .experience-mobile-nav small{font-size:10px;line-height:1.1}
  body.profile-menu-open .experience-mobile-nav{visibility:hidden;pointer-events:none}
  .experience-profile-backdrop{z-index:10030;background:rgba(4,11,20,.58);backdrop-filter:blur(3px)}
  .experience-profile-menu{position:fixed!important;z-index:10040!important;left:10px!important;right:10px!important;top:auto!important;bottom:max(10px,env(safe-area-inset-bottom))!important;width:auto!important;max-width:none!important;max-height:min(78dvh,620px)!important;overflow-y:auto!important;overscroll-behavior:contain;padding:14px 14px calc(14px + env(safe-area-inset-bottom))!important;border-radius:20px 20px 16px 16px!important;-webkit-overflow-scrolling:touch;touch-action:pan-y}
  .experience-profile-menu :is(button,a){min-height:44px;pointer-events:auto}
  .overview-welcome{min-width:0;align-items:flex-start!important}
  .overview-welcome h2{max-width:100%;overflow-wrap:anywhere;line-height:1.15}
  img,.fleet-vehicle-image{max-width:100%}
}
@media(max-width:360px){
  .workspace{padding-left:10px!important;padding-right:10px!important}
  .workspace-header{grid-template-columns:40px minmax(0,1fr) 38px 38px!important;gap:5px}
  #pageTitle{font-size:18px}
}

/* Version 95 release-blocker repairs: top-layer account UI and token-native surfaces. */
.experience-profile-control{position:relative;z-index:151}
#experienceProfileButton{display:flex;align-items:center;justify-content:center;gap:4px;width:52px;height:44px;border-radius:14px;box-shadow:none}
.experience-profile-chevron{color:var(--text-muted);font-size:.72rem;line-height:1}
.experience-profile-menu{position:fixed!important;z-index:10001!important;right:auto!important;top:auto;width:min(340px,calc(100vw - 24px));max-height:calc(100dvh - 24px);overflow:auto;overscroll-behavior:contain;padding:14px;border:1px solid var(--border);border-radius:18px;background:var(--surface-elevated);color:var(--text-primary);box-shadow:0 28px 80px color-mix(in srgb,#000 42%,transparent)}
.experience-profile-menu :is(button,a){font-family:inherit}
.experience-profile-menu :is(button,a):focus-visible,#experienceProfileButton:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
body.profile-menu-open::before{content:"";position:fixed;inset:0;z-index:10000;background:transparent}

/* Shared section/card primitives never assume a white canvas. */
:is(.booking-list,.pricing-list,.expense-list,.modern-revenue-list,.modern-expense-list,.calendar-content,.calendar-grid,.calendar-weekdays,.calendar-year-grid,.calendar-mini-grid,.expense-group-rows,.annual-table-wrap,.fleet-table-wrap){color:var(--text-primary)}
:is(.booking-row,.upcoming-booking-row,.pricing-row,.pricing-detail-row,.pricing-signal-card,.expense-row,.expense-transaction-row,.maintenance-row,.loan-payment-row,.mileage-row,.account-detail-row,.profit-detail-row){background:var(--surface-soft);color:var(--text-primary);border-color:var(--border)}
:is(.booking-row,.expense-row,.pricing-row,.pricing-detail-row,.upcoming-booking-row) :is(strong,b){color:var(--text-primary)}
:is(.booking-row,.expense-row,.pricing-row,.pricing-detail-row,.upcoming-booking-row) :is(small,p,span:not(.status-pill):not(.signal)){color:var(--text-secondary)}
:is(.date-box,.vehicle-badge,.stat-pairs>div,.pricing-numbers>span,.pricing-signal-metrics>span,.calendar-booking-facts>div,.loan-result,.booking-mobile-result){background:var(--surface-strong);color:var(--text-primary);border-color:var(--border)}
.empty-state button,.secondary-button,.danger-outline-button{background:var(--surface-elevated)!important;color:var(--text-primary)!important;border-color:var(--border-strong)!important}
.text-link{color:var(--accent)!important}

/* Compact, image-led upcoming booking rows. */
#upcomingList.booking-list{display:grid;gap:2px;margin:0;padding:0 14px 14px}
.upcoming-booking-row{display:grid;grid-template-columns:72px minmax(0,1fr) auto;align-items:center;gap:13px;min-height:82px;padding:11px 8px;border:0;border-bottom:1px solid var(--border);background:transparent}
.upcoming-booking-row:last-child{border-bottom:0}
.upcoming-vehicle-image{width:72px;aspect-ratio:16/10;border-radius:11px;overflow:hidden}
.upcoming-booking-copy{display:grid;min-width:0;gap:2px}
.upcoming-booking-copy strong{font-size:.9rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.upcoming-booking-copy span,.upcoming-booking-copy small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.upcoming-booking-copy span{font-size:.8rem;color:var(--text-secondary)}
.upcoming-booking-copy small{font-size:.72rem;color:var(--text-muted)}
.upcoming-booking-result{display:grid;justify-items:end;gap:7px;font-variant-numeric:tabular-nums}
.upcoming-booking-result>strong{font-size:.88rem}

/* Pricing intelligence uses compact native surfaces in both appearances. */
.pricing-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:0 20px 20px}
.pricing-signal-card{display:grid;grid-template-columns:46px minmax(0,1fr);align-items:start;gap:11px;padding:15px;border:1px solid var(--border);border-radius:14px;background:var(--surface-soft);box-shadow:none}
.pricing-vehicle-image{width:46px;aspect-ratio:4/3;border-radius:10px;overflow:hidden}
.pricing-signal-head{display:flex;align-items:start;justify-content:space-between;gap:8px;min-width:0}
.pricing-signal-head>div{display:grid;min-width:0;gap:2px}
.pricing-signal-head strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.82rem}
.pricing-signal-head small{color:var(--text-secondary);font-size:.7rem}
.pricing-signal-card>.pricing-signal-metrics,.pricing-signal-card>p{grid-column:1/-1}
.pricing-signal-metrics{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.pricing-signal-metrics>span{display:grid;gap:3px;padding:8px;border:1px solid color-mix(in srgb,var(--border) 70%,transparent);border-radius:9px;background:var(--surface);color:var(--text-muted);font-size:.68rem}
.pricing-signal-metrics b{color:var(--text-primary);font-size:.78rem;font-variant-numeric:tabular-nums}
.pricing-signal-card>p{margin:0;color:var(--text-secondary);font-size:.74rem}

/* Calendar is fully appearance-native, including generated availability classes. */
.calendar-board{background:var(--surface);border-color:var(--border);box-shadow:var(--fl-shadow)}
.calendar-board-head{background:var(--surface-elevated);border-color:var(--border)}
.calendar-weekdays{background:var(--surface-strong);border-color:var(--border)}
.calendar-weekdays span{color:var(--text-secondary)}
.calendar-grid{background:var(--border);gap:1px}
.calendar-day{min-height:132px;background:var(--surface);border:0!important;color:var(--text-primary)}
.calendar-day.outside{background:var(--surface-soft);color:var(--text-muted);opacity:.72}
.calendar-day.open-day{background:color-mix(in srgb,var(--positive) 4%,var(--surface))}
.calendar-day.partially-booked{background:color-mix(in srgb,var(--information) 6%,var(--surface))}
.calendar-day.fully-booked{background:color-mix(in srgb,var(--information) 10%,var(--surface))}
.calendar-day.today{box-shadow:inset 0 0 0 2px var(--accent)}
.calendar-day-head small{background:var(--accent-soft);color:var(--accent)}
.calendar-day-number,.outside .calendar-day-number{color:inherit}
.calendar-event{min-height:27px;border:1px solid color-mix(in srgb,var(--information) 34%,var(--border));background:color-mix(in srgb,var(--information) 16%,var(--surface-elevated));color:var(--text-primary)}
.calendar-event.tone-1{background:color-mix(in srgb,var(--positive) 14%,var(--surface-elevated));border-color:color-mix(in srgb,var(--positive) 34%,var(--border))}
.calendar-event.tone-2{background:color-mix(in srgb,var(--warning) 14%,var(--surface-elevated));border-color:color-mix(in srgb,var(--warning) 34%,var(--border))}
.calendar-event.tone-3{background:color-mix(in srgb,var(--negative) 12%,var(--surface-elevated));border-color:color-mix(in srgb,var(--negative) 28%,var(--border))}
.calendar-event:focus-visible{outline:3px solid var(--focus);outline-offset:1px}
.calendar-event b{flex:0 0 auto;font-size:.67rem}
.calendar-event span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.calendar-availability{margin-top:auto;color:var(--text-muted)!important;font-size:.65rem}
.calendar-more{color:var(--accent);font-weight:800}
.calendar-mini-month,.calendar-mini-month :is(button,span,i){background-color:var(--surface);color:var(--text-primary);border-color:var(--border)}
.calendar-mini-month .open-day{background:color-mix(in srgb,var(--positive) 12%,var(--surface-strong))}
.calendar-mini-month .partially-booked,.calendar-mini-month .fully-booked{background:color-mix(in srgb,var(--information) 20%,var(--surface-strong))}
.calendar-legend{color:var(--text-secondary)}
.legend-open{background:var(--surface)!important;border-color:var(--border-strong)!important}
.legend-booked{background:color-mix(in srgb,var(--information) 22%,var(--surface))!important;border-color:color-mix(in srgb,var(--information) 48%,var(--border))!important}
.legend-partial{background:color-mix(in srgb,var(--warning) 18%,var(--surface))!important;border-color:color-mix(in srgb,var(--warning) 48%,var(--border))!important}
.legend-service{background:color-mix(in srgb,var(--positive) 18%,var(--surface))!important;border-color:color-mix(in srgb,var(--positive) 48%,var(--border))!important}

/* Inputs, dropdowns, dialogs and old high-specificity cards all consume tokens. */
:is(.month-select select,.table-filters select,.table-filters input,.calendar-filter select,.calculator-form input,.calculator-form select,.entry-form input,.entry-form select,.entry-form textarea,.password-field,.auth-card input){background:var(--surface-soft)!important;color:var(--text-primary)!important;border-color:var(--border-strong)!important}
:is(input,select,textarea)::placeholder{color:var(--text-muted)!important;opacity:1}
:is(input,select,textarea,button,a):focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.account-support-card,.account-danger-card,.setup-launchpad>summary,.setup-step,.profile-photo-editor,.account-plan-details{background:var(--surface)!important;color:var(--text-primary)!important;border-color:var(--border)!important}
.account-plan-card{background:linear-gradient(145deg,color-mix(in srgb,var(--accent) 15%,var(--surface-elevated)),var(--surface))!important;color:var(--text-primary)!important;border-color:var(--border)!important}
.account-plan-card :is(h3,p,.account-plan-benefits){color:var(--text-primary)!important}
.modal,.account-panel,.calendar-booking-modal{background:var(--surface-elevated)!important;color:var(--text-primary)!important;border:1px solid var(--border)}
.modal-backdrop{background:var(--overlay)}
.menu-button,.account-button,.account-panel-close,.mapping-grid select,.expense-filter select,.profit-vehicle-filter select{background:var(--surface-elevated)!important;color:var(--text-primary)!important;border-color:var(--border-strong)!important}
:is(.mini-metric,.vehicle-card,.decision-card,.mileage-card,.breakeven-card,.loan-card,.report-card,.maintenance-card,.profit-month-card,.trip-action-card,.reconciliation-card,.vehicle-decision-card,.calendar-row,.account-identity,.admin-stat,.admin-loading-card,.vehicle-profile-section){background:var(--surface)!important;color:var(--text-primary)!important;border-color:var(--border)!important}
.donut:after{background:var(--surface)!important}
.auth-tabs button.active{background:var(--surface-elevated)!important;color:var(--text-primary)!important}
.signal.hold,.setup-step[data-status="attention"],.setup-step[data-status="attention"] .setup-state,.admin-status.past_due,.admin-status.unpaid{background:color-mix(in srgb,var(--warning) 16%,var(--surface))!important;color:var(--warning)!important;border-color:color-mix(in srgb,var(--warning) 36%,var(--border))!important}
.danger-outline-button{background:var(--surface-elevated)!important;color:var(--negative)!important;border-color:color-mix(in srgb,var(--negative) 55%,var(--border))!important}
.admin-loading-card.error,.account-danger-card{background:color-mix(in srgb,var(--negative) 6%,var(--surface))!important}

/* Quieter premium hierarchy: fewer outlines and no page-wide dark slabs. */
body[data-experience="premium"] :is(.panel,.metric-card,.fleet-pulse-card,.vehicle-card,.trip-action-card,.maintenance-vehicle-card,.annual-trend-panel,.annual-month-panel,.annual-vehicle-panel){border-color:color-mix(in srgb,var(--border) 72%,transparent)!important;box-shadow:0 12px 30px color-mix(in srgb,#000 10%,transparent)!important}
body[data-experience="premium"] :is(.dashboard-grid,.lower-grid,.overview-operations-grid,.maintenance-grid,.annual-dashboard,.expense-dashboard){background:transparent!important;border:0!important;box-shadow:none!important}

@media(max-width:980px){
  .pricing-list{grid-template-columns:1fr}
}
@media(max-width:780px){
  body.profile-menu-open{overflow:hidden}
  body.profile-menu-open::before{background:var(--overlay);backdrop-filter:blur(4px)}
  .experience-profile-menu{left:12px!important;right:12px!important;top:auto!important;bottom:max(12px,env(safe-area-inset-bottom))!important;width:auto!important;max-height:min(82dvh,680px);border-radius:22px;padding:16px}
  .experience-profile-menu::before{content:"Account";display:block;padding:2px 4px 8px;color:var(--text-primary);font:800 1rem Manrope,sans-serif}
  .upcoming-booking-row{grid-template-columns:64px minmax(0,1fr);gap:11px}
  .upcoming-vehicle-image{width:64px}
  .upcoming-booking-result{grid-column:2;display:flex;align-items:center;justify-content:space-between;width:100%}
  .calendar-board{overflow:auto;overscroll-behavior-x:contain}
  .calendar-day{min-height:116px;padding:7px}
}
@media(max-width:430px){
  #experienceProfileButton{width:46px}
  .experience-profile-chevron{display:none}
  .pricing-signal-metrics{grid-template-columns:1fr}
}

/* Version 96 dark-mode correction pass: shared semantic surfaces only. */
body {
  --bg-app:var(--background);
  --bg-section:var(--surface-soft);
  --bg-card:var(--surface);
  --bg-elevated:var(--surface-elevated);
  --bg-interactive:var(--surface-strong);
  --border-subtle:var(--border);
}

/* Legacy metric groups now share one appearance-aware primitive. */
:is(
  .mileage-stats>div,
  .decision-facts>div,
  .reconciliation-numbers>div,
  .trip-handoff>div,
  .scenario-results>article,
  .stat-pairs>div,
  .pricing-numbers>span,
  .pricing-signal-metrics>span,
  .calendar-booking-facts>div,
  .loan-result,
  .booking-mobile-result
) {
  background:var(--bg-elevated)!important;
  color:var(--text-primary)!important;
  border:1px solid var(--border-subtle)!important;
  box-shadow:none!important;
}
:is(
  .mileage-stats>div,
  .decision-facts>div,
  .reconciliation-numbers>div,
  .trip-handoff>div,
  .scenario-results>article,
  .pricing-numbers>span,
  .pricing-signal-metrics>span
) span { color:var(--text-secondary)!important; }
:is(
  .mileage-stats>div,
  .decision-facts>div,
  .reconciliation-numbers>div,
  .trip-handoff>div,
  .scenario-results>article,
  .pricing-numbers>span,
  .pricing-signal-metrics>span
) strong { color:var(--text-primary); }
.reconciliation-detail span {
  background:var(--bg-interactive)!important;
  color:var(--text-secondary)!important;
  border:1px solid var(--border-subtle);
}
.mileage-booking-ref {
  border-color:var(--border-subtle)!important;
  color:var(--text-primary);
}
.mileage-booking-ref :is(span,small) { color:var(--text-secondary)!important; }
.sold-vehicle-card { opacity:1!important; }
.sold-vehicle-card .decision-hero,
.sold-vehicle-card .decision-facts>div { color:var(--text-primary); }
.sold-vehicle-card .signal { opacity:1; }

/* Remaining report, expense, maintenance and overview sub-surfaces inherit the same layers. */
:is(
  .annual-highlights article,
  .annual-month-card,
  .annual-vehicle-metrics>div,
  .annual-detail-table,
  .annual-detail-table summary,
  .annual-mobile-month>div>span,
  .expense-vehicle-primary,
  .expense-transaction-group>summary,
  .expense-allocation-context span,
  .metric-icon,
  .maintenance-stat,
  .profit-detail-row,
  .account-detail-row
) {
  background:var(--bg-elevated)!important;
  color:var(--text-primary)!important;
  border-color:var(--border-subtle)!important;
}
:is(
  .annual-highlights article,
  .annual-month-card,
  .annual-vehicle-metrics>div,
  .annual-mobile-month>div>span,
  .expense-vehicle-primary,
  .expense-transaction-group>summary,
  .expense-allocation-context span
) :is(span,small,p) { color:var(--text-secondary)!important; }
.annual-contribution>i,
.goal-track,
.progress-track { background:var(--bg-interactive)!important; }
.donut:after { background:var(--bg-card)!important; }
.chart:before,.chart:after { border-color:var(--chart-grid)!important; }

/* Turo setup uses the same layered surfaces in every experience and appearance. */
.setup-launchpad {
  background:var(--bg-card)!important;
  background-image:none!important;
  color:var(--text-primary)!important;
  border-color:var(--border-subtle)!important;
}
.setup-launchpad>summary,
.setup-launchpad .setup-steps { background:var(--bg-card)!important; color:var(--text-primary)!important; }
.setup-launchpad .setup-intro :is(h2,.overline),
.setup-launchpad .setup-toggle { color:var(--text-primary)!important; }
.setup-launchpad .setup-intro .overline,
.setup-launchpad .setup-toggle { color:var(--accent)!important; }
.setup-launchpad .setup-intro p,
.setup-launchpad .setup-step small { color:var(--text-secondary)!important; }
.setup-launchpad .setup-step {
  background:var(--bg-elevated)!important;
  color:var(--text-primary)!important;
  border-color:var(--border-subtle)!important;
}
.setup-launchpad .setup-step strong { color:var(--text-primary)!important; }
.setup-launchpad .setup-number {
  background:var(--selected)!important;
  color:var(--accent)!important;
}
.setup-launchpad .setup-state {
  background:var(--bg-interactive)!important;
  color:var(--text-secondary)!important;
  border:1px solid var(--border-subtle);
}
.setup-launchpad .setup-step[data-status="complete"] {
  background:color-mix(in srgb,var(--positive) 7%,var(--bg-elevated))!important;
  border-color:color-mix(in srgb,var(--positive) 30%,var(--border-subtle))!important;
}
.setup-launchpad .setup-step[data-status="complete"] .setup-state {
  background:color-mix(in srgb,var(--positive) 14%,var(--bg-elevated))!important;
  color:var(--positive)!important;
}
.setup-launchpad .setup-step .secondary-button {
  background:var(--bg-interactive)!important;
  color:var(--text-primary)!important;
  border-color:var(--border-strong)!important;
}

/* Upcoming bookings stay compact and readable without image collisions. */
#upcomingList.booking-list { background:transparent!important; }
.upcoming-booking-row {
  grid-template-columns:80px minmax(0,1fr) minmax(82px,auto);
  min-height:78px;
  gap:12px;
  padding:10px 4px;
  background:transparent!important;
}
.upcoming-vehicle-image { width:80px;aspect-ratio:16/10;align-self:center; }
.upcoming-booking-copy { min-width:0;overflow:hidden; }
.upcoming-booking-copy strong { color:var(--text-primary)!important;font-size:.92rem; }
.upcoming-booking-copy span { color:var(--text-secondary)!important; }
.upcoming-booking-copy small { color:var(--text-muted)!important; }
.upcoming-booking-result { min-width:82px;align-self:center; }
.upcoming-booking-result>strong { color:var(--text-primary)!important; }

/* Native text and interaction colors across reusable rows and cards. */
:is(
  .reconciliation-card,
  .mileage-card,
  .vehicle-decision-card,
  .pricing-signal-card,
  .setup-step,
  .upcoming-booking-row
) :is(h2,h3,h4,strong,b) { color:var(--text-primary); }
:is(
  .reconciliation-card,
  .mileage-card,
  .vehicle-decision-card,
  .pricing-signal-card,
  .setup-step,
  .upcoming-booking-row
) :is(p,small) { color:var(--text-secondary); }

/* The sheet and backdrop are separate opaque layers; Safari must not blend them. */
.experience-profile-backdrop {
  z-index:10030!important;
  opacity:1!important;
  filter:none!important;
}
.experience-profile-menu {
  z-index:10040!important;
  isolation:isolate;
  opacity:1!important;
  filter:none!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
  mix-blend-mode:normal!important;
  background-color:var(--bg-elevated)!important;
  background-image:none!important;
  color:var(--text-primary)!important;
}
.experience-profile-menu::after {
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  border-radius:inherit;
  background:var(--bg-elevated);
  pointer-events:none;
}
.experience-profile-menu :is(.experience-profile-identity,.experience-menu-group) { opacity:1;color:var(--text-primary); }
.experience-profile-menu :is(a,button) {
  opacity:1;
  color:var(--text-primary)!important;
}
.experience-profile-menu .experience-menu-options button {
  background:var(--bg-card)!important;
  color:var(--text-secondary)!important;
  border-color:var(--border-subtle)!important;
}
.experience-profile-menu .experience-menu-options button.active {
  background:var(--selected)!important;
  color:var(--text-primary)!important;
  border-color:var(--accent)!important;
}

@media(max-width:780px) {
  body.profile-menu-open::before { display:none!important; }
  .experience-profile-backdrop {
    display:block;
    background:var(--overlay)!important;
    -webkit-backdrop-filter:blur(3px);
    backdrop-filter:blur(3px);
  }
  .experience-profile-backdrop[hidden] { display:none!important; }
  .experience-profile-menu {
    left:10px!important;
    right:10px!important;
    bottom:max(10px,env(safe-area-inset-bottom))!important;
    max-height:min(78dvh,620px)!important;
    overflow-y:auto!important;
    transform:translate3d(0,0,0)!important;
    will-change:transform;
    box-shadow:0 26px 72px rgba(0,0,0,.46)!important;
  }
  body.profile-menu-open .experience-mobile-nav { visibility:hidden!important;pointer-events:none!important; }
  .upcoming-booking-row { grid-template-columns:72px minmax(0,1fr);min-height:76px; }
  .upcoming-vehicle-image { width:72px; }
  .upcoming-booking-result { grid-column:2;min-width:0; }
  :is(.reconciliation-numbers,.mileage-stats,.decision-facts) { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media(max-width:430px) {
  .experience-profile-menu { left:8px!important;right:8px!important; }
  :is(.reconciliation-numbers,.mileage-stats,.decision-facts) { grid-template-columns:1fr; }
}

/* Version 97: Modern Dark vehicle imagery uses a native dark frame. */
html[data-appearance="dark"] body[data-experience="modern"] .fleet-vehicle-image {
  background:var(--surface-strong)!important;
  background-image:none!important;
  border:1px solid color-mix(in srgb,var(--border-strong) 78%,transparent)!important;
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--text-primary) 3%,transparent);
}
html[data-appearance="dark"] body[data-experience="modern"] .fleet-vehicle-image>img {
  padding:0!important;
  object-fit:cover!important;
  object-position:var(--vehicle-image-position,50% 50%)!important;
  background:transparent!important;
  filter:none!important;
  mix-blend-mode:normal!important;
}
html[data-appearance="dark"] body[data-experience="modern"] .fleet-vehicle-image>.vehicle-image-fallback {
  background:linear-gradient(145deg,var(--surface-strong),var(--surface-elevated))!important;
  color:var(--text-primary)!important;
}

/* Version 99: Modern quality pass — semantic layers, dashboard hierarchy, and responsive revenue rows. */
body[data-experience="modern"] {
  --modern-app:var(--background);
  --modern-section:var(--surface);
  --modern-card:var(--surface-elevated);
  --modern-interactive:var(--surface-strong);
}
body[data-experience="modern"] .workspace {
  padding-inline:clamp(24px,3vw,44px)!important;
  background:var(--modern-app)!important;
}
body[data-experience="modern"] .workspace-header {
  margin-inline:0;
  padding-inline:2px;
}
body[data-experience="modern"] #overviewView>.metric-grid { order:1; }
body[data-experience="modern"] #modernOverviewExtension { order:2;margin:0; }
body[data-experience="modern"] #overviewView>.dashboard-grid:not(.overview-operations-grid) { order:3; }
body[data-experience="modern"] #overviewView>.overview-operations-grid { order:4; }
body[data-experience="modern"] #overviewView>.fleet-pulse { order:5; }
body[data-experience="modern"] #overviewView>.overview-alerts-panel { order:6; }
body[data-experience="modern"] #overviewView>.formula-note { order:7; }
body[data-experience="modern"] #overviewView>.setup-launchpad { order:-2; }
body[data-experience="modern"] #overviewView>.metric-grid .metric-card {
  display:grid;
  grid-template-rows:auto 1fr auto;
  min-height:142px;
  padding:20px;
  background:var(--modern-card)!important;
}
body[data-experience="modern"] #overviewView>.metric-grid .metric-card small { align-self:end; }
body[data-experience="modern"] :is(.panel,.modern-revenue-panel,.modern-expense-panel,.fleet-pulse-card,.vehicle-card) {
  background:var(--modern-section)!important;
  color:var(--text-primary)!important;
  border:1px solid var(--border)!important;
}
body[data-experience="modern"] :is(.panel,.modern-revenue-panel,.modern-expense-panel) :is(h2,h3,strong,b,dd) { color:var(--text-primary); }
body[data-experience="modern"] :is(.panel,.modern-revenue-panel,.modern-expense-panel) :is(p,small,dt) { color:var(--text-secondary); }
body[data-experience="modern"] .modern-side-stack-wide {
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);
  align-items:start;
  gap:16px;
}
body[data-experience="modern"] .modern-revenue-panel,
body[data-experience="modern"] .modern-expense-panel { padding:22px;border-radius:18px;box-shadow:var(--fl-shadow); }
body[data-experience="modern"] .modern-revenue-list { display:grid;gap:0; }
body[data-experience="modern"] .modern-revenue-row {
  display:grid;
  grid-template-columns:minmax(220px,1.2fr) minmax(170px,.8fr);
  gap:12px 20px;
  padding:16px 0;
  border-top:1px solid var(--border);
}
body[data-experience="modern"] .modern-revenue-row:first-child { padding-top:0;border-top:0; }
body[data-experience="modern"] .modern-revenue-identity { display:grid;grid-template-columns:52px minmax(0,1fr);gap:12px;align-items:center;min-width:0; }
body[data-experience="modern"] .modern-revenue-identity .fleet-vehicle-image { width:52px;aspect-ratio:1;border-radius:13px; }
body[data-experience="modern"] .modern-revenue-identity>span { min-width:0; }
body[data-experience="modern"] .modern-revenue-identity strong,
body[data-experience="modern"] .modern-revenue-identity small { display:block;overflow-wrap:anywhere; }
body[data-experience="modern"] .modern-revenue-identity strong { font-size:.9rem;line-height:1.3; }
body[data-experience="modern"] .modern-revenue-identity small { margin-top:3px;font-size:.76rem; }
body[data-experience="modern"] .modern-revenue-values { display:grid;gap:5px;margin:0; }
body[data-experience="modern"] .modern-revenue-values>div { display:flex;align-items:baseline;justify-content:space-between;gap:12px; }
body[data-experience="modern"] .modern-revenue-values dt { font-size:.75rem; }
body[data-experience="modern"] .modern-revenue-values dd { margin:0;font-size:.84rem;font-weight:850;font-variant-numeric:tabular-nums; }
body[data-experience="modern"] .modern-revenue-bar { grid-column:1/-1;height:8px;overflow:hidden;border-radius:999px;background:var(--modern-interactive); }
body[data-experience="modern"] .modern-revenue-bar i { display:block;width:var(--bar);height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--accent),color-mix(in srgb,var(--accent) 58%,var(--positive))); }
body[data-experience="modern"] .modern-expense-panel.is-empty { min-height:0; }
body[data-experience="modern"] .modern-compact-empty { display:flex;align-items:center;justify-content:space-between;gap:14px;padding:4px 0 2px; }
body[data-experience="modern"] .modern-compact-empty p { margin:0; }
body[data-experience="modern"] .modern-compact-empty .secondary-button { flex:none; }
body[data-experience="modern"] .sidebar .nav-item { color:#9eacb4; }
body[data-experience="modern"] .sidebar .nav-item:hover { background:#16242b;color:#edf4f7; }
body[data-experience="modern"] .sidebar .nav-item.active { background:#3182f6;color:#f8fbff;box-shadow:0 8px 20px rgba(49,130,246,.2); }
body[data-experience="modern"] .sidebar .nav-item .nav-count { background:#293842;color:#e8eef2; }
html[data-appearance="dark"] body[data-experience="modern"] {
  --text-muted:#94a4b1;
  --border-strong:#405466;
  --hover:#20303e;
  --selected:#1a3858;
}
html[data-appearance="dark"] body[data-experience="modern"] :is(.section-toolbar p,.panel-head p,.overline,.mini-label,.chart-label,.legend,.empty-state p,.experience-empty) { color:var(--text-secondary)!important; }
html[data-appearance="dark"] body[data-experience="modern"] :is(.modal,.account-panel,.experience-profile-menu,.experience-command-palette>section) { background:var(--modern-card)!important;border-color:var(--border)!important; }
html[data-appearance="dark"] body[data-experience="modern"] :is(.data-table tbody tr,.expense-transaction-row,.booking-row,.reconciliation-card,.mileage-card,.vehicle-decision-card,.pricing-signal-card) { background:var(--modern-section)!important; }
html[data-appearance="dark"] body[data-experience="modern"] :is(input,select,textarea,button.secondary-button,.experience-menu-options button) { background-color:var(--modern-interactive)!important;color:var(--text-primary)!important;border-color:var(--border-strong)!important; }

@media(max-width:1050px) {
  body[data-experience="modern"] .modern-side-stack-wide { grid-template-columns:1fr; }
  body[data-experience="modern"] .modern-expense-panel.is-empty { max-width:none; }
}
@media(max-width:780px) {
  body[data-experience="modern"] .workspace { padding-inline:14px!important; }
  body[data-experience="modern"] .workspace-header { padding-inline:0; }
  body[data-experience="modern"] .modern-overview-extension,
  body[data-experience="modern"] .modern-side-stack-wide { min-width:0;width:100%; }
  body[data-experience="modern"] .modern-revenue-panel,
  body[data-experience="modern"] .modern-expense-panel { min-width:0;padding:17px; }
  body[data-experience="modern"] .modern-revenue-row { grid-template-columns:1fr;gap:10px;padding:15px 0; }
  body[data-experience="modern"] .modern-revenue-bar { grid-column:1; }
  body[data-experience="modern"] .modern-compact-empty { align-items:flex-start;flex-direction:column; }
  body[data-experience="modern"] #overviewView>.metric-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));overflow:visible; }
  body[data-experience="modern"] #overviewView>.metric-grid .metric-card { width:100%;min-width:0;min-height:126px; }
}
@media(max-width:430px) {
  body[data-experience="modern"] #overviewView>.metric-grid { grid-template-columns:1fr; }
  body[data-experience="modern"] #overviewView>.metric-grid .metric-card { min-height:112px; }
  body[data-experience="modern"] .modern-revenue-identity { grid-template-columns:46px minmax(0,1fr); }
  body[data-experience="modern"] .modern-revenue-identity .fleet-vehicle-image { width:46px; }
}