/* JANZEN interface foundation
   Loaded last on every page. This file owns shared geometry, typography,
   accessibility and responsive behaviour; feature styling remains local. */

:root {
  --app-font: "Aptos", "Segoe UI Variable", "Segoe UI", Arial, sans-serif;
  --app-bg: #f3f4f3;
  --app-surface: #ffffff;
  --app-surface-muted: #f3f3f5;
  --app-ink: #1c201e;
  --app-muted: #68716d;
  --app-line: #dedfdf;
  --app-dark: #1d1f1e;
  --app-green: #287854;
  --app-orange: #ef6b2e;
  --app-red: #c63742;
  --app-radius-sm: 10px;
  --app-radius: 18px;
  --app-radius-lg: 24px;
  --app-shadow: 0 14px 38px rgba(23, 31, 27, .06);
  --app-page-max: 2200px;
  --app-record-max: 1460px;
  --app-gutter: clamp(12px, 1.35vw, 22px);
  --app-header-height: 68px;
}

html {
  min-width: 320px;
  background: var(--app-bg);
  color: var(--app-ink);
  font-size: 16px;
  text-size-adjust: 100%;
}

body,
body * {
  font-family: var(--app-font) !important;
}

body {
  max-width: none;
  min-width: 0;
  background: var(--app-bg);
  color: var(--app-ink);
  font-size: 15px;
  line-height: 1.5;
}

img,
svg,
video { max-width: 100%; }

button,
input,
select,
textarea { font: inherit; }

button:not(:disabled),
select:not(:disabled),
summary,
a[href] { cursor: pointer; }

button:disabled { cursor: not-allowed; opacity: .62; }

:focus-visible {
  outline: 3px solid rgba(235, 103, 38, .4) !important;
  outline-offset: 2px !important;
}

.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.sidebar-close,
.sidebar-scrim { display: none; }

.command-nav .nav-label { font-size: 10px !important; }

/* The dashboard already uses a grid; a second left margin previously doubled
   the sidebar width and made the entire workspace unnecessarily narrow. */
.command-main {
  width: 100%;
  max-width: none;
  min-width: 0;
  margin-left: 0 !important;
}

.command-main > .morning-brief,
.command-main > .pulse-grid,
.command-main > .mail-center,
.command-main > .dashboard-workgrid,
.command-main > .routine-center,
.command-main > .printix-note {
  width: auto;
  max-width: 1680px;
  margin-right: var(--app-gutter);
  margin-left: var(--app-gutter);
}

.command-main > .morning-brief { margin-top: var(--app-gutter); }

.brief-copy,
.brief-focus,
.mail-center-head > *,
.section-head > *,
.dashboard-workgrid > * { min-width: 0; }

.brief-copy h1,
.brief-focus strong,
.brief-focus p,
.mail-subject strong,
.work-title strong { overflow-wrap: anywhere; }

/* One transport chrome on every workspace. */
.transport-topbar {
  width: 100%;
  min-height: var(--app-header-height) !important;
  height: var(--app-header-height) !important;
  grid-template-columns: 230px minmax(0, 1fr) 180px !important;
  background: rgba(27, 29, 28, .97) !important;
}

.transport-brand {
  width: auto !important;
  height: var(--app-header-height) !important;
  padding: 7px 22px !important;
}

.transport-brand-logo {
  width: min(152px, 100%) !important;
  max-height: 52px !important;
}

.transport-nav {
  min-width: 0;
  height: var(--app-header-height) !important;
  gap: 4px !important;
  padding: 7px 8px !important;
}

.transport-nav a,
.billing-body .transport-nav a {
  min-width: 92px !important;
  padding: 0 14px !important;
  border-radius: 11px !important;
  font-size: 13px !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

.transport-live {
  width: auto !important;
  height: var(--app-header-height) !important;
  padding: 0 18px !important;
}

.transport-live span { font-size: 12px !important; }
.transport-live small { font-size: 11px !important; }

.mxp-subnav {
  width: 100%;
  min-width: 0;
  min-height: 48px;
  padding-inline: max(var(--app-gutter), calc((100% - var(--app-page-max)) / 2 + var(--app-gutter)));
}

.mxp-subnav > span { font-size: 10px !important; }
.mxp-subnav a { min-height: 40px; font-size: 13px !important; }

/* Transport overview: retain the cockpit while removing tiny operational text. */
html[data-transport-page="hub"] .ops-shell {
  padding-inline: var(--app-gutter) !important;
}

html[data-transport-page="hub"] .ops-head,
html[data-transport-page="hub"] .ops-workspace {
  width: min(var(--app-page-max), 100%);
  max-width: var(--app-page-max) !important;
}

html[data-transport-page="hub"] .ops-title .overline,
html[data-transport-page="hub"] .ops-panel-head .overline,
html[data-transport-page="hub"] .ops-summary span,
html[data-transport-page="hub"] .wheel-legend button,
html[data-transport-page="hub"] .wheel-legend span,
html[data-transport-page="hub"] .ops-flow-foot,
html[data-transport-page="hub"] .deck-signal,
html[data-transport-page="hub"] .deck-metric span,
html[data-transport-page="hub"] .deck-brand strong {
  font-size: 11px !important;
}

html[data-transport-page="hub"] .ops-summary small,
html[data-transport-page="hub"] .ops-ticker small { font-size: 11px !important; }

html[data-transport-page="hub"] .ops-panel-head > small,
html[data-transport-page="hub"] .ops-ticker > span,
html[data-transport-page="hub"] .ops-ticker > a,
html[data-transport-page="hub"] .ops-live-chip,
html[data-transport-page="hub"] .wheel-legend b,
html[data-transport-page="hub"] .area-sector-button span,
html[data-transport-page="hub"] .area-overview-core small,
html[data-transport-page="hub"] .area-overview-core em { font-size: 10px !important; }

html[data-transport-page="hub"] .area-overview-core span { font-size: 11px !important; }
html[data-transport-page="hub"] .ops-flow-foot a { font-size: 11px !important; }

html[data-transport-page="hub"] .business-deck,
html[data-transport-page="hub"] .business-deck.is-fuelix,
html[data-transport-page="hub"] .deck-body,
html[data-transport-page="hub"] .deck-metrics,
html[data-transport-page="hub"] .deck-metric { min-width: 0; }

html[data-transport-page="hub"] .deck-metrics {
  width: 100%;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

/* Business lists share a single page edge and readable data density. */
html[data-transport-page="area"] main { width: 100%; max-width: none; }

html[data-transport-page="area"] .area-hero,
html[data-transport-page="area"] .area-workspace,
html[data-transport-page="drafts"] .draft-command,
html[data-transport-page="drafts"] .draft-workbench,
html[data-transport-page="billing"] .billing-page-head,
html[data-transport-page="billing"] .billing-kpis,
html[data-transport-page="billing"] .billing-workspace {
  box-sizing: border-box;
  width: min(var(--app-page-max), calc(100% - (2 * var(--app-gutter)))) !important;
  max-width: var(--app-page-max) !important;
  margin-right: auto !important;
  margin-left: auto !important;
}

html[data-transport-page="area"] .area-workspace,
html[data-transport-page="drafts"] .draft-workbench { padding-right: 0 !important; padding-left: 0 !important; }

html[data-transport-page="area"] .area-summary span,
html[data-transport-page="area"] .manifest-head,
html[data-transport-page="area"] .area-select span,
html[data-transport-page="area"] .manifest-status { font-size: 11px !important; }

html[data-transport-page="area"] .manifest-order strong,
html[data-transport-page="area"] .manifest-route strong,
html[data-transport-page="area"] .manifest-date strong,
html[data-transport-page="area"] .manifest-value strong { font-size: 13px !important; }

html[data-transport-page="area"] .manifest-order small,
html[data-transport-page="area"] .manifest-route small,
html[data-transport-page="area"] .manifest-date small,
html[data-transport-page="area"] .manifest-value small { font-size: 11px !important; }

html[data-transport-page="area"] .area-filter,
html[data-transport-page="area"] .area-reset,
html[data-transport-page="area"] .area-export,
html[data-transport-page="area"] .area-select select { font-size: 12px !important; }

html[data-transport-page="area"] .area-billing-link { font-size: 12px !important; }

/* Draft review: more readable evidence and a practical split view. */
html[data-transport-page="drafts"] .draft-workbench { grid-template-columns: 350px minmax(0, 1fr); }
html[data-transport-page="drafts"] .draft-inbox,
html[data-transport-page="drafts"] .draft-detail { min-width: 0; }
html[data-transport-page="drafts"] .queue-top b,
html[data-transport-page="drafts"] .draft-queue-item > strong { font-size: 13px !important; }
html[data-transport-page="drafts"] .queue-top time,
html[data-transport-page="drafts"] .draft-queue-item > span,
html[data-transport-page="drafts"] .queue-bottom { font-size: 11px !important; }
html[data-transport-page="drafts"] .draft-field small,
html[data-transport-page="drafts"] .price-evidence span,
html[data-transport-page="drafts"] .price-evidence strong { font-size: 11px !important; }
html[data-transport-page="drafts"] .price-chip { font-size: 10px !important; }

/* Billing: same edges as every other transport page and readable finance data. */
html[data-transport-page="billing"] .billing-page-head { min-height: 106px; }
html[data-transport-page="billing"] .billing-workspace { grid-template-columns: minmax(0, 1fr) minmax(330px, 380px); }
html[data-transport-page="billing"] .billing-toolbar > *,
html[data-transport-page="billing"] .billing-row > * { min-width: 0; }
html[data-transport-page="billing"] .billing-table-head { font-size: 10px !important; }
html[data-transport-page="billing"] .billing-position strong,
html[data-transport-page="billing"] .billing-reference strong,
html[data-transport-page="billing"] .billing-money strong { font-size: 13px !important; }
html[data-transport-page="billing"] .billing-position small,
html[data-transport-page="billing"] .billing-reference small,
html[data-transport-page="billing"] .billing-money small,
html[data-transport-page="billing"] .billing-status { font-size: 10px !important; }
html[data-transport-page="billing"] .billing-checklist small,
html[data-transport-page="billing"] .billing-blockers p,
html[data-transport-page="billing"] .billing-action-note { font-size: 11px !important; }
html[data-transport-page="billing"] .billing-position > span { font-size: 10px !important; }
html[data-transport-page="billing"] .billing-secondary-action { font-size: 11px !important; }

/* Every order tab follows the exact same record width. */
html[data-transport-page="order"] .order-panels {
  box-sizing: border-box;
  padding-right: var(--app-gutter) !important;
  padding-left: var(--app-gutter) !important;
}

html[data-transport-page="order"] .order-head,
html[data-transport-page="order"] .order-tabs {
  box-sizing: border-box;
  width: min(var(--app-record-max), calc(100% - (2 * var(--app-gutter)))) !important;
  max-width: var(--app-record-max) !important;
  margin-right: auto !important;
  margin-left: auto !important;
}

html[data-transport-page="order"] .order-overview-grid,
html[data-transport-page="order"] .order-editor,
html[data-transport-page="order"] .finance-workspace,
html[data-transport-page="order"] .kn-tracking-shell,
html[data-transport-page="order"] .document-shell,
html[data-transport-page="order"] .history-shell,
html[data-transport-page="order"] .order-empty-panel,
html[data-order-division="fuelix"] .fuelix-overview-shell {
  box-sizing: border-box;
  width: min(var(--app-record-max), 100%) !important;
  max-width: var(--app-record-max) !important;
  margin-right: auto !important;
  margin-left: auto !important;
}

html[data-transport-page="order"] .order-head-main > div,
html[data-transport-page="order"] .order-head-facts article,
html[data-transport-page="order"] .order-tabs,
html[data-transport-page="order"] .order-panel { min-width: 0; }

html[data-transport-page="order"] .order-head-main h1,
html[data-transport-page="order"] .order-head-facts strong,
html[data-transport-page="order"] .route-stop strong,
html[data-transport-page="order"] .fuelix-focus-card strong { overflow-wrap: anywhere; }

html[data-transport-page="order"] .order-tabs button { min-height: 40px; font-size: 12px !important; }
html[data-transport-page="order"] .order-head-facts span,
html[data-transport-page="order"] .order-card-label,
html[data-transport-page="order"] .fuelix-kicker,
html[data-transport-page="order"] .fuelix-focus-card dt { font-size: 11px !important; }

html[data-transport-page="order"] .kn-tracking-head span,
html[data-transport-page="order"] .kn-tracking-head small,
html[data-transport-page="order"] .kn-location-copy > span,
html[data-transport-page="order"] .kn-location-copy > p,
html[data-transport-page="order"] .kn-shipment-facts > div span,
html[data-transport-page="order"] .kn-shipment-facts > div small { font-size: 11px !important; }

html[data-transport-page="order"] .kn-tracking-head strong { font-size: 15px !important; }
html[data-transport-page="order"] .kn-location-copy h3 { font-size: 17px !important; }
html[data-transport-page="order"] .kn-milestones strong { font-size: 12px !important; }
html[data-transport-page="order"] .kn-milestones time { font-size: 11px !important; }
html[data-transport-page="order"] .kn-milestones small { font-size: 10px !important; }
html[data-transport-page="order"] .kn-shipment-facts > div strong { font-size: 15px !important; }

/* FuelIX administration and manual intake use the normal transport page edge. */
.fuelix-admin {
  width: 100%;
  max-width: none !important;
  padding-right: var(--app-gutter) !important;
  padding-left: var(--app-gutter) !important;
}

.fuelix-admin-head,
.fuelix-admin-grid {
  width: min(var(--app-page-max), 100%) !important;
  max-width: var(--app-page-max) !important;
}

.fuelix-admin-panel,
.fuelix-partner-card,
.fuelix-new-form { min-width: 0; }

.fuelix-partner-card .order-field-grid > *,
.fuelix-settings-form > * { min-width: 0; }

.fuelix-partner-card label,
.fuelix-settings-form > label,
.fuelix-comment-form label { font-size: 12px !important; }

.fuelix-partner-card label > span,
.fuelix-partner-card > header > div > span,
.fuelix-settings-form label > span,
.fuelix-comment-form label > span,
.fuelix-new-form label > span,
.fuelix-switch > span { font-size: 11px !important; }

.fuelix-partner-card input,
.fuelix-partner-card textarea,
.fuelix-settings-form input,
.fuelix-settings-form textarea,
.fuelix-new-form input,
.fuelix-new-form select,
.fuelix-new-form textarea {
  border-radius: var(--app-radius-sm) !important;
  font-size: 14px !important;
}

.fuelix-partner-dialog {
  width: min(520px, calc(100vw - 32px));
  padding: 0;
  color: var(--app-ink);
  background: #fff;
  border: 0;
  border-radius: var(--app-radius-lg);
  box-shadow: 0 28px 90px rgba(16, 24, 20, .26);
}

.fuelix-partner-dialog::backdrop {
  background: rgba(12, 18, 15, .5);
  backdrop-filter: blur(7px);
}

.fuelix-partner-dialog-form {
  display: grid;
  gap: 18px;
  padding: 26px;
}

.fuelix-partner-dialog-form > header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
}

.fuelix-partner-dialog-form h2 { margin: 5px 0; font-size: 24px; letter-spacing: -.025em; }
.fuelix-partner-dialog-form p { margin: 0; color: var(--app-muted); font-size: 13px; line-height: 1.5; }
.fuelix-partner-dialog-form > label { display: grid; gap: 7px; color: var(--app-muted); font-size: 12px; font-weight: 720; }
.fuelix-partner-dialog-form input,
.fuelix-partner-dialog-form select { width: 100%; min-height: 46px; padding: 10px 12px; color: var(--app-ink); background: #f5f5f6; border: 1px solid var(--app-line); border-radius: var(--app-radius-sm); font: inherit; }
.fuelix-partner-dialog-form > footer { display: flex; justify-content: flex-end; gap: 10px; padding-top: 4px; }
.fuelix-dialog-close { display: grid; flex: 0 0 auto; width: 38px; height: 38px; place-items: center; padding: 0; color: var(--app-ink); background: var(--app-surface-muted); border: 1px solid var(--app-line); border-radius: 50%; font-size: 22px; cursor: pointer; }
.fuelix-dialog-cancel { min-height: 42px; padding: 0 16px; color: var(--app-ink); background: #fff; border: 1px solid var(--app-line); border-radius: var(--app-radius-sm); font: inherit; font-weight: 720; cursor: pointer; }
.fuelix-partner-dialog button:disabled { cursor: wait; opacity: .65; }

@media (min-width: 1681px) {
  .command-main > .morning-brief,
  .command-main > .pulse-grid,
  .command-main > .mail-center,
  .command-main > .dashboard-workgrid,
  .command-main > .routine-center,
  .command-main > .printix-note {
    margin-right: auto;
    margin-left: auto;
  }
}

@media (max-width: 1180px) {
  .transport-topbar {
    grid-template-columns: 205px minmax(0, 1fr) 150px !important;
  }

  .transport-nav a,
  .billing-body .transport-nav a {
    min-width: 78px !important;
    padding-inline: 10px !important;
  }

  html[data-transport-page="billing"] .billing-workspace { grid-template-columns: 1fr; }
  html[data-transport-page="billing"] .billing-inspector { position: static; }
}

@media (max-width: 900px) {
  .sidebar-close {
    position: absolute;
    z-index: 2;
    top: 14px;
    right: 14px;
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    color: var(--app-ink);
    background: #f0f0f2;
    border: 0;
    border-radius: 50%;
    font-size: 25px;
    line-height: 1;
  }

  .sidebar-scrim {
    position: fixed;
    z-index: 65;
    inset: 0;
    width: 100%;
    height: 100%;
    display: block;
    padding: 0;
    background: rgba(20, 22, 21, .28);
    border: 0;
    opacity: 0;
    pointer-events: none;
    transition: opacity .2s ease;
  }

  .is-menu-open .sidebar-scrim { opacity: 1; pointer-events: auto; }

  .transport-topbar {
    position: sticky;
    top: 0;
    height: auto !important;
    min-height: 0 !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
  }

  .transport-brand {
    width: 100% !important;
    height: 58px !important;
    border-right: 0 !important;
  }

  .transport-nav {
    width: 100%;
    height: 54px !important;
    justify-content: flex-start !important;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-width: none;
  }

  .transport-nav::-webkit-scrollbar,
  .mxp-subnav::-webkit-scrollbar,
  .order-tabs::-webkit-scrollbar,
  .area-filters::-webkit-scrollbar,
  .billing-filterbar::-webkit-scrollbar { display: none; }

  .transport-nav a,
  .billing-body .transport-nav a {
    min-width: 82px !important;
    min-height: 42px;
    flex: 0 0 auto;
    padding-inline: 12px !important;
  }

  .transport-live { display: none !important; }

  .mxp-subnav {
    min-height: 48px;
    justify-content: flex-start;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    padding-inline: 10px;
    scrollbar-width: none;
  }

  .mxp-subnav > span { display: none; }
  .mxp-subnav a { min-width: max-content; flex: 0 0 auto; padding-inline: 16px; }

  html[data-transport-page="drafts"] .draft-workbench { grid-template-columns: 310px minmax(0, 1fr); }
}

@media (max-width: 720px) {
  :root { --app-gutter: 12px; }

  body { font-size: 14px; }

  button,
  input,
  select,
  textarea { min-height: 44px; }

  .command-topbar { overflow: hidden; }
  .command-topbar > div { min-width: 0; }
  .top-date { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

  .command-main > .morning-brief,
  .command-main > .pulse-grid,
  .command-main > .mail-center,
  .command-main > .dashboard-workgrid,
  .command-main > .routine-center,
  .command-main > .printix-note { margin-right: 12px; margin-left: 12px; }

  .morning-brief { padding: 28px 24px !important; }
  .brief-copy h1 { font-size: clamp(31px, 10vw, 42px) !important; }
  .brief-focus { width: 100%; padding: 20px !important; }
  .brief-focus p { font-size: 13px !important; }
  .pulse-grid.operations-pulse { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  html[data-transport-page="hub"] .ops-head,
  html[data-transport-page="hub"] .ops-workspace { min-width: 0; }
  html[data-transport-page="hub"] .ops-title h1 { font-size: clamp(40px, 12vw, 54px); overflow-wrap: anywhere; }
  html[data-transport-page="hub"] .ops-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  html[data-transport-page="hub"] .ops-summary article { min-width: 0; }
  html[data-transport-page="hub"] .ops-businesses,
  html[data-transport-page="hub"] .ops-flow { min-width: 0; overflow: hidden; }
  html[data-transport-page="hub"] .business-deck,
  html[data-transport-page="hub"] .business-deck.is-fuelix {
    width: 100%;
    grid-template-columns: 80px minmax(0, 1fr) 34px;
  }
  html[data-transport-page="hub"] .deck-body { width: 100%; padding-right: 10px; padding-left: 12px; }
  html[data-transport-page="hub"] .deck-head h3 { font-size: 14px !important; white-space: normal; }
  html[data-transport-page="hub"] .deck-signal { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  html[data-transport-page="hub"] .deck-metric { padding-right: 5px; }
  html[data-transport-page="hub"] .deck-metric:not(:first-child) { padding-left: 6px; }
  html[data-transport-page="hub"] .deck-metric span { font-size: 9px !important; overflow-wrap: anywhere; }
  html[data-transport-page="hub"] .deck-metric strong { font-size: 23px !important; }
  html[data-transport-page="hub"] .area-overview-disc { width: min(310px, 82vw) !important; }
  html[data-transport-page="hub"] .area-overview-orbit { width: min(334px, 88vw) !important; }

  /* Compact branded area summary instead of the former tall empty hero. */
  html[data-transport-page="area"] .area-hero {
    min-height: 0 !important;
    display: grid !important;
    grid-template-columns: 96px minmax(0, 1fr) !important;
    grid-template-rows: auto auto !important;
    align-items: center !important;
    gap: 16px !important;
    padding: 18px !important;
  }

  html[data-transport-page="area"] .area-identity {
    grid-column: 1;
    grid-row: 1;
    display: block !important;
    min-height: 0 !important;
    align-self: center;
    padding: 0 !important;
  }

  html[data-transport-page="area"] .area-identity > span { display: none !important; }
  html[data-transport-page="area"] .area-logo { width: 96px; height: 58px; padding: 7px; }
  html[data-transport-page="area"] .area-hero-copy { grid-column: 2; grid-row: 1; min-width: 0; padding: 0 !important; }
  html[data-transport-page="area"] .area-hero-copy .overline { font-size: 9px !important; }
  html[data-transport-page="area"] .area-hero-copy h1 { margin: 4px 0 0; font-size: 25px !important; line-height: 1.08; overflow-wrap: anywhere; }
  html[data-transport-page="area"] .area-hero-copy p { display: none !important; }
  html[data-transport-page="area"] .area-summary {
    grid-column: 1 / -1;
    grid-row: 2;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }
  html[data-transport-page="area"] .area-summary article { min-width: 0; min-height: 74px; padding: 12px; }
  html[data-transport-page="area"] .area-summary strong { font-size: 24px !important; }
  html[data-transport-page="area"] .area-workspace { padding-top: 18px !important; }
  html[data-transport-page="area"] .area-commandbar { align-items: flex-start !important; }
  html[data-transport-page="area"] .area-commandbar h2 { font-size: 23px !important; text-align: left; overflow-wrap: anywhere; }
  html[data-transport-page="area"] .area-list-tools { grid-template-columns: 1fr 1fr !important; }
  html[data-transport-page="area"] .area-search,
  html[data-transport-page="area"] .area-select,
  html[data-transport-page="area"] .area-result-count { grid-column: 1 / -1 !important; }
  html[data-transport-page="area"] .area-reset { display: inline-flex !important; align-items: center; justify-content: center; }
  html[data-transport-page="area"] .area-result-count { justify-items: start; }
  html[data-transport-page="area"] .manifest-row { grid-template-columns: minmax(0, 1fr) auto !important; }
  html[data-transport-page="area"] .manifest-order,
  html[data-transport-page="area"] .manifest-route { grid-column: 1 / -1; }
  html[data-transport-page="area"] .manifest-value { display: grid !important; grid-column: 2; grid-row: 3; justify-items: end; text-align: right; }

  html[data-transport-page="drafts"] .draft-command { min-height: 0; }
  html[data-transport-page="drafts"] .draft-command h1 { font-size: 27px !important; }
  html[data-transport-page="drafts"] .draft-command-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  html[data-transport-page="drafts"] .draft-command-stats article { min-width: 0; padding: 11px; }
  html[data-transport-page="drafts"] .draft-command-stats span { font-size: 9px !important; overflow-wrap: anywhere; }
  html[data-transport-page="drafts"] .draft-workbench { display: block; }
  html[data-transport-page="drafts"] .draft-inbox { position: static; margin-bottom: 12px; }
  html[data-transport-page="drafts"] .draft-queue { max-height: 430px; overflow-y: auto; overscroll-behavior: contain; }
  html[data-transport-page="drafts"] .draft-detail { min-height: 0; }
  html[data-transport-page="drafts"] .draft-actionbar {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    padding: 14px !important;
  }
  html[data-transport-page="drafts"] .draft-actionbar > div,
  html[data-transport-page="drafts"] .draft-actionbar .draft-approve { grid-column: 1 / -1; }
  html[data-transport-page="drafts"] .draft-actionbar button {
    width: 100%;
    min-width: 0 !important;
    white-space: normal;
  }

  html[data-transport-page="billing"] .billing-page-head { min-height: 0; }
  html[data-transport-page="billing"] .billing-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  html[data-transport-page="billing"] .billing-kpis article { min-width: 0; min-height: 104px; padding: 14px; }
  html[data-transport-page="billing"] .billing-kpis strong { font-size: 25px !important; overflow-wrap: anywhere; }
  html[data-transport-page="billing"] .billing-toolbar { grid-template-columns: 1fr !important; }
  html[data-transport-page="billing"] .billing-toolbar > select,
  html[data-transport-page="billing"] .billing-search { width: 100%; min-width: 0; }
  html[data-transport-page="billing"] .billing-filterbar { scrollbar-width: none; }
  html[data-transport-page="billing"] .billing-row { grid-template-columns: minmax(0, 1fr) auto !important; align-items: start; }
  html[data-transport-page="billing"] .billing-reference { grid-column: 1 / -1; }
  html[data-transport-page="billing"] .billing-money { display: grid !important; gap: 2px; padding-top: 4px; }
  html[data-transport-page="billing"] .billing-money::before { color: var(--app-muted); font-size: 9px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
  html[data-transport-page="billing"] .billing-money:nth-child(3)::before { content: "Kundenpreis"; }
  html[data-transport-page="billing"] .billing-money:nth-child(4)::before { content: "Fremdkosten"; }
  html[data-transport-page="billing"] .billing-money:nth-child(5)::before { content: "Marge"; }
  html[data-transport-page="billing"] .billing-status { align-self: end; }

  html[data-transport-page="order"] .order-main { padding-top: 12px; }
  html[data-transport-page="order"] .order-head-main {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) !important;
    align-items: start !important;
    gap: 12px !important;
  }
  html[data-transport-page="order"] .order-head-main h1 { max-width: 100%; font-size: 22px !important; }
  html[data-transport-page="order"] .order-status { display: none !important; }
  html[data-transport-page="order"] .order-head-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 0 10px 10px; }
  html[data-transport-page="order"] .order-head-facts article { min-height: 72px; padding: 12px; }
  html[data-transport-page="order"] .order-tabs { overflow-x: auto; overscroll-behavior-inline: contain; scrollbar-width: none; }
  html[data-transport-page="order"] .order-tabs button { min-height: 42px; }
  html[data-transport-page="order"] .order-panels { padding-right: 12px; padding-left: 12px; }
  html[data-transport-page="order"] .order-route,
  html[data-transport-page="order"] .route-grid,
  html[data-transport-page="order"] .fuelix-focus-grid,
  html[data-transport-page="order"] .fuelix-place-facts,
  html[data-transport-page="order"] .fuelix-contact-strip { grid-template-columns: 1fr !important; }
  html[data-transport-page="order"] .fuelix-focus-head,
  html[data-transport-page="order"] .fuelix-source-line { align-items: flex-start; flex-direction: column; }
  html[data-transport-page="order"] .fuelix-place-panel,
  html[data-transport-page="order"] .fuelix-volume-panel { padding: 22px 18px; }
  html[data-transport-page="order"] .fuelix-contact-strip > div + div { border-top: 1px solid var(--app-line); border-left: 0; }

  .fuelix-admin { padding-top: 18px; }
  .fuelix-admin-head { align-items: flex-start; padding: 22px 20px; }
  .fuelix-admin-head h1 { font-size: 30px; overflow-wrap: anywhere; }
  .fuelix-admin-head p { max-width: 100%; overflow-wrap: anywhere; }
  .fuelix-admin-grid { grid-template-columns: 1fr; }
  .fuelix-admin-panel { padding: 18px; }
  .fuelix-admin-panel > header,
  .fuelix-partner-card > header { align-items: stretch; flex-direction: column; }
  .fuelix-admin-panel > header > button { width: 100%; }
  .fuelix-partner-card .order-field-grid { grid-template-columns: 1fr; }
  .fuelix-switch { align-self: flex-start; }
  .fuelix-partner-dialog-form { padding: 22px 18px; }
  .fuelix-partner-dialog-form > footer { display: grid; grid-template-columns: 1fr 1fr; }
  .fuelix-partner-dialog-form > footer > * { width: 100%; }

  .fuelix-new-shell { padding: 14px 12px 44px; }
  .fuelix-new-form > header { align-items: flex-start; flex-direction: column; padding: 22px 20px; }
  .fuelix-new-form > header h1 { font-size: 29px; }
  .fuelix-new-form > section,
  .fuelix-new-form > footer { padding-right: 20px; padding-left: 20px; }
  .fuelix-new-form .order-field-grid { grid-template-columns: 1fr; }
  .fuelix-new-form .order-field-grid .is-wide { grid-column: auto; }

  input,
  select,
  textarea { font-size: 16px !important; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

@media (prefers-contrast: more) {
  :root { --app-line: #aeb4b0; --app-muted: #4e5853; }
  .transport-nav a { color: #d5dcd8 !important; }
}
