/* motoria-user-v6-private-experience */
:root {
  --mu-ink: #07182f;
  --mu-ink-soft: #20314a;
  --mu-muted: #64748b;
  --mu-blue: #1264ff;
  --mu-blue-deep: #0b3f9e;
  --mu-cyan: #13b5d8;
  --mu-line: #dbe7f6;
  --mu-line-strong: #c7d9ee;
  --mu-soft: #f4f8fd;
  --mu-panel: #ffffff;
  --mu-navy: #061426;
  --mu-green: #0f766e;
  --mu-amber: #b45309;
  --mu-red: #b91c1c;
  --mu-radius-lg: 26px;
  --mu-radius-md: 18px;
  --mu-shadow-soft: 0 18px 54px rgba(15, 23, 42, .08);
  --mu-shadow-strong: 0 28px 90px rgba(15, 23, 42, .16);
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background:
    radial-gradient(circle at 12% 4%, rgba(19, 181, 216, .14), transparent 30%),
    radial-gradient(circle at 82% 2%, rgba(18, 100, 255, .12), transparent 28%),
    linear-gradient(180deg, #f8fbff 0%, #ffffff 46%, #edf5ff 100%);
  color: var(--mu-ink);
}

a {
  color: inherit;
}

.mu-page {
  min-height: 100vh;
}

.mu-header {
  position: sticky;
  top: 0;
  z-index: 20;
  border-bottom: 1px solid rgba(219, 231, 246, .86);
  background: rgba(255, 255, 255, .9);
  backdrop-filter: blur(18px);
}

.mu-header-inner,
.mu-shell {
  width: min(1180px, calc(100% - 32px));
  margin: auto;
}

.mu-header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  min-height: 72px;
}

.mu-brand-lockup {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
  color: var(--mu-ink);
  font-weight: 950;
  text-decoration: none;
}

.mu-logo {
  display: block;
  height: 40px;
}

.mu-brand-separator {
  width: 1px;
  height: 34px;
  background: var(--mu-line);
}

.mu-brand-slogan {
  color: var(--mu-blue-deep);
  font-size: 12px;
  font-weight: 950;
  letter-spacing: .12em;
  text-transform: uppercase;
  white-space: nowrap;
}

.mu-nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.mu-nav a {
  display: inline-flex;
  align-items: center;
  min-height: 38px;
  border: 1px solid var(--mu-line);
  border-radius: 999px;
  padding: 8px 13px;
  background: rgba(255, 255, 255, .94);
  color: #334155;
  font-size: 13px;
  font-weight: 850;
  text-decoration: none;
  box-shadow: 0 8px 22px rgba(15, 23, 42, .04);
}

.mu-nav a.active,
.mu-nav a:hover {
  border-color: var(--mu-blue);
  background: var(--mu-blue);
  color: #ffffff;
}

.mu-shell {
  padding: 28px 0 96px;
}

.mu-public-page .mu-shell {
  padding-bottom: 56px;
}

.mu-landing-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.04fr) minmax(320px, .76fr);
  gap: 24px;
  align-items: stretch;
  overflow: hidden;
  border: 1px solid var(--mu-line);
  border-radius: 32px;
  padding: 36px;
  background:
    radial-gradient(circle at 84% 12%, rgba(19, 181, 216, .2), transparent 34%),
    radial-gradient(circle at 66% 70%, rgba(18, 100, 255, .18), transparent 38%),
    linear-gradient(135deg, #ffffff 0%, #f5fbff 52%, #eaf4ff 100%);
  box-shadow: var(--mu-shadow-strong);
}

.mu-hero-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 430px;
}

.mu-eyebrow {
  display: inline-flex;
  width: max-content;
  align-items: center;
  gap: 8px;
  border: 1px solid #bfdbfe;
  border-radius: 999px;
  padding: 8px 12px;
  background: #eff6ff;
  color: var(--mu-blue-deep);
  font-size: 12px;
  font-weight: 950;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.mu-landing-hero h1,
.mu-app-top h1,
.mu-section-hero h1 {
  max-width: 820px;
  margin: 15px 0 12px;
  color: #05142a;
  font-size: clamp(34px, 5vw, 60px);
  line-height: 1;
  letter-spacing: -.04em;
}

.mu-landing-hero p,
.mu-app-top p,
.mu-section-hero p {
  max-width: 730px;
  color: #475569;
  font-size: 17px;
  line-height: 1.62;
}

.mu-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 18px;
}

.mu-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  border: 1px solid var(--mu-line);
  border-radius: 14px;
  padding: 11px 15px;
  background: #ffffff;
  color: #0f172a;
  font: inherit;
  font-weight: 900;
  text-decoration: none;
  cursor: pointer;
  box-shadow: 0 10px 24px rgba(15, 23, 42, .05);
}

.mu-btn.primary {
  border-color: var(--mu-blue);
  background: linear-gradient(135deg, var(--mu-blue), #0b55dc);
  color: #ffffff;
}

.mu-btn.subtle {
  background: #f8fbff;
}

.mu-btn.compact {
  min-height: 36px;
  padding: 8px 11px;
  font-size: 13px;
}

.mu-btn[disabled],
.mu-provider-list button:disabled {
  cursor: not-allowed;
  opacity: .72;
}

.mu-device-panel {
  display: grid;
  gap: 13px;
  min-height: 430px;
  border-radius: 30px;
  padding: 17px;
  background:
    radial-gradient(circle at 80% 8%, rgba(19, 181, 216, .22), transparent 28%),
    linear-gradient(180deg, #061426, #0b1c33);
  color: #ffffff;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08);
}

.mu-device-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #dbeafe;
  font-size: 13px;
}

.mu-device-head span {
  width: 54px;
  height: 6px;
  border-radius: 99px;
  background: #dbeafe;
  opacity: .68;
}

.mu-device-panel .mu-vehicle-card,
.mu-device-panel .mu-mini-card {
  background: #ffffff;
  color: var(--mu-ink);
}

.mu-split-band {
  display: grid;
  grid-template-columns: 1fr .9fr;
  gap: 20px;
  margin-top: 20px;
  border: 1px solid #bfdbfe;
  border-radius: 26px;
  padding: 25px;
  background:
    linear-gradient(135deg, #eff6ff, #ffffff);
  box-shadow: var(--mu-shadow-soft);
}

.mu-split-band h2 {
  margin: 10px 0;
  font-size: 30px;
  letter-spacing: -.03em;
}

.mu-split-band p {
  color: #41536b;
  line-height: 1.6;
}

.mu-stack {
  display: grid;
  align-content: center;
  gap: 10px;
}

.mu-section-hero,
.mu-app-top {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  border: 1px solid var(--mu-line);
  border-radius: var(--mu-radius-lg);
  padding: 25px;
  background:
    radial-gradient(circle at 100% 0%, rgba(18, 100, 255, .11), transparent 34%),
    #ffffff;
  box-shadow: var(--mu-shadow-soft);
}

.mu-private-page .mu-app-top {
  border-color: rgba(191, 219, 254, .9);
}

.mu-app-status {
  display: grid;
  gap: 4px;
  min-width: 250px;
  border: 1px solid #bfdbfe;
  border-radius: 20px;
  padding: 15px;
  background: #eff6ff;
  color: #1e3a8a;
}

.mu-app-status span {
  color: #335e9b;
  font-size: 13px;
  line-height: 1.4;
}

.mu-aviso-conexion {
  width: min(1320px, calc(100% - 32px));
  margin: 12px auto 0;
  display: grid;
  grid-template-columns: 12px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  border: 1px solid #fed7aa;
  border-left: 4px solid var(--mu-amber);
  border-radius: 6px;
  padding: 12px 14px;
  background: #fff7ed;
  color: #7c2d12;
}

.mu-aviso-conexion[hidden] {
  display: none;
}

.mu-aviso-conexion[data-estado="restablecida"] {
  border-color: #a7f3d0;
  border-left-color: var(--mu-green);
  background: #ecfdf5;
  color: #065f46;
}

.mu-aviso-conexion[data-estado="comprobando"] {
  border-color: #bfdbfe;
  border-left-color: var(--mu-blue-deep);
  background: #eff6ff;
  color: #1e3a8a;
}

.mu-aviso-conexion-senal {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: currentColor;
}

.mu-aviso-conexion-texto {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.mu-aviso-conexion-texto b {
  font-size: 14px;
}

.mu-aviso-conexion-texto span {
  font-size: 13px;
  line-height: 1.4;
}

.mu-aviso-conexion-accion {
  min-height: 44px;
  border: 1px solid currentColor;
  border-radius: 5px;
  padding: 8px 14px;
  background: transparent;
  color: inherit;
  font: inherit;
  font-size: 13px;
  font-weight: 850;
  cursor: pointer;
}

.mu-aviso-conexion-accion:focus-visible {
  outline: 3px solid rgba(18, 100, 255, .28);
  outline-offset: 2px;
}

.mu-aviso-conexion-accion:disabled {
  cursor: wait;
  opacity: .72;
}

.mu-grid,
.mu-feature-grid,
.mu-stats-row,
.mu-vehicle-grid {
  display: grid;
}

.mu-grid {
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 16px;
  margin-top: 18px;
}

.mu-feature-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-top: 18px;
}

.mu-stats-row {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-top: 16px;
}

.mu-future-surface {
  margin-top: 16px;
  border: 1px solid #cfe0f7;
  border-radius: 24px;
  padding: 18px;
  background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
  box-shadow: var(--mu-shadow-soft);
}

.mu-future-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.mu-future-head span {
  display: inline-flex;
  border: 1px solid #bfdbfe;
  border-radius: 999px;
  padding: 6px 10px;
  background: #eff6ff;
  color: var(--mu-blue-deep);
  font-size: 11px;
  font-weight: 950;
}

.mu-future-head h2 {
  margin: 8px 0 5px;
  color: var(--mu-ink);
  font-size: 22px;
  letter-spacing: -.035em;
}

.mu-future-head p {
  margin: 0;
  max-width: 740px;
  color: var(--mu-muted);
  font-size: 13px;
  font-weight: 650;
  line-height: 1.45;
}

.mu-future-head strong {
  white-space: nowrap;
  border: 1px solid #bbf7d0;
  border-radius: 999px;
  padding: 6px 10px;
  background: #ecfdf5;
  color: #166534;
  font-size: 11px;
}

.mu-future-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 13px;
}

.mu-future-grid article {
  min-height: 92px;
  border: 1px solid var(--mu-line);
  border-radius: 16px;
  padding: 12px;
  background: #ffffff;
}

.mu-future-grid b,
.mu-future-grid span,
.mu-future-grid small {
  display: block;
}

.mu-future-grid b {
  color: var(--mu-ink);
  font-size: 13px;
}

.mu-future-grid span {
  margin-top: 6px;
  color: var(--mu-blue-deep);
  font-size: 12px;
  font-weight: 900;
}

.mu-future-grid small {
  margin-top: 6px;
  color: var(--mu-muted);
  font-size: 11px;
  font-weight: 650;
  line-height: 1.28;
}

.mu-future-foot {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

.mu-future-foot span {
  border: 1px solid var(--mu-line);
  border-radius: 999px;
  padding: 7px 9px;
  background: #ffffff;
  color: #334155;
  font-size: 10.5px;
  font-weight: 850;
}

.mu-vehicle-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.span-3 { grid-column: span 3; }
.span-4 { grid-column: span 4; }
.span-6 { grid-column: span 6; }
.span-8 { grid-column: span 8; }
.span-12 { grid-column: span 12; }

.mu-card,
.mu-stat,
.mu-mini-card,
.mu-vehicle-card {
  border: 1px solid var(--mu-line);
  background: #ffffff;
  box-shadow: var(--mu-shadow-soft);
}

.mu-card {
  border-radius: 22px;
  padding: 20px;
}

.mu-card h2,
.mu-card h3 {
  margin-top: 0;
  letter-spacing: -.025em;
}

.mu-card p {
  color: var(--mu-muted);
  line-height: 1.58;
}

.mu-action-card {
  display: flex;
  min-height: 214px;
  flex-direction: column;
}

.mu-card-icon,
.mu-vehicle-icon {
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  border-radius: 15px;
  background: linear-gradient(135deg, #eef6ff, #dff7ff);
  color: #1454d8;
}

.mu-icon {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.9;
}

.mu-card-link {
  margin-top: auto;
  color: #1454d8;
  font-weight: 900;
  text-decoration: none;
}

.mu-card-link.is-disabled {
  color: var(--mu-muted);
  cursor: default;
}

.mu-driver-os {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, .38fr);
  gap: 14px;
  margin-bottom: 16px;
}

.mu-driver-focus,
.mu-ai-rail {
  border: 1px solid #cfe0f7;
  border-radius: 26px;
  box-shadow: var(--mu-shadow-soft);
}

.mu-driver-focus {
  display: grid;
  gap: 18px;
  padding: 22px;
  background:
    radial-gradient(circle at 92% 0%, rgba(18, 100, 255, .14), transparent 32%),
    linear-gradient(135deg, #ffffff 0%, #f6fbff 100%);
}

.mu-driver-focus h2 {
  max-width: 650px;
  margin: 11px 0 8px;
  color: #05142a;
  font-size: clamp(32px, 4.4vw, 52px);
  line-height: .96;
  letter-spacing: -.045em;
}

.mu-driver-focus p {
  max-width: 620px;
  margin: 0;
  color: #475569;
  font-size: 15px;
  line-height: 1.5;
}

.mu-focus-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.mu-focus-tile {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 11px;
  min-height: 118px;
  align-items: start;
  border: 1px solid #dbeafe;
  border-radius: 19px;
  padding: 14px;
  background: #ffffff;
}

.mu-focus-tile b,
.mu-focus-tile strong,
.mu-focus-tile small {
  display: block;
}

.mu-focus-tile b {
  color: #1e3a8a;
  font-size: 11px;
  font-weight: 950;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.mu-focus-tile strong {
  margin-top: 6px;
  color: var(--mu-ink);
  font-size: 20px;
  line-height: 1.04;
  letter-spacing: -.025em;
}

.mu-focus-tile small {
  margin-top: 6px;
  color: #475569;
  font-size: 12px;
  font-weight: 800;
}

.mu-focus-tile.urgent {
  border-color: #fed7aa;
  background: #fff7ed;
}

.mu-focus-tile.attention {
  border-color: #bfdbfe;
  background: #eff6ff;
}

.mu-focus-tile.calm {
  border-color: #99f6e4;
  background: #f0fdfa;
}

.mu-ai-rail {
  display: flex;
  flex-direction: column;
  gap: 12px;
  justify-content: space-between;
  padding: 18px;
  background:
    radial-gradient(circle at 90% 8%, rgba(19, 181, 216, .17), transparent 32%),
    linear-gradient(180deg, #07182f, #0a2d64);
  color: #ffffff;
}

.mu-ai-rail .mu-card-icon {
  background: rgba(255, 255, 255, .14);
  color: #dff7ff;
}

.mu-ai-rail b {
  font-size: 25px;
  line-height: 1;
  letter-spacing: -.03em;
}

.mu-ai-rail p {
  margin: 0;
  color: #c7d7f4;
  font-size: 13px;
  font-weight: 750;
  line-height: 1.45;
}

.mu-mini-tasks {
  display: grid;
  gap: 8px;
}

.mu-task-pill {
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  border: 1px solid rgba(219, 234, 254, .16);
  border-radius: 14px;
  padding: 9px 10px;
  background: rgba(255, 255, 255, .08);
}

.mu-task-pill b {
  font-size: 12px;
  letter-spacing: 0;
}

.mu-task-pill span {
  color: #dbeafe;
  font-size: 12px;
  font-weight: 850;
}

.mu-user-cockpit {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, .34fr);
  gap: 14px;
  margin-bottom: 16px;
}

.mu-cockpit-main,
.mu-copilot-card {
  border: 1px solid #cfe0f7;
  border-radius: 24px;
  background: #ffffff;
  box-shadow: var(--mu-shadow-soft);
}

.mu-cockpit-main {
  display: grid;
  gap: 16px;
  padding: 20px;
  background:
    radial-gradient(circle at 94% 12%, rgba(19, 181, 216, .15), transparent 26%),
    linear-gradient(135deg, #ffffff 0%, #f7fbff 100%);
}

.mu-cockpit-main h2 {
  max-width: 680px;
  margin: 10px 0 0;
  color: #05142a;
  font-size: clamp(30px, 4vw, 48px);
  line-height: .98;
  letter-spacing: -.04em;
}

.mu-cockpit-signals {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.mu-signal-card {
  display: grid;
  gap: 5px;
  min-height: 118px;
  border: 1px solid #dbeafe;
  border-radius: 18px;
  padding: 14px;
  background: #ffffff;
}

.mu-signal-card span,
.mu-guide-pill span {
  color: #64748b;
  font-size: 11px;
  font-weight: 950;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.mu-signal-card b {
  color: #0f172a;
  font-size: 19px;
  line-height: 1.05;
  letter-spacing: -.02em;
}

.mu-signal-card small {
  color: #475569;
  font-size: 12px;
  font-weight: 800;
}

.mu-signal-card.urgent {
  border-color: #fed7aa;
  background: #fff7ed;
}

.mu-signal-card.attention {
  border-color: #bfdbfe;
  background: #eff6ff;
}

.mu-signal-card.calm {
  border-color: #99f6e4;
  background: #f0fdfa;
}

.mu-guide-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.mu-guide-pill {
  display: inline-grid;
  min-width: 150px;
  gap: 2px;
  border: 1px solid #dbeafe;
  border-radius: 14px;
  padding: 9px 11px;
  background: rgba(255, 255, 255, .86);
}

.mu-guide-pill b {
  color: #0b3f9e;
  font-size: 13px;
}

.mu-copilot-card {
  display: flex;
  flex-direction: column;
  gap: 10px;
  justify-content: space-between;
  padding: 18px;
}

.mu-copilot-card b {
  color: var(--mu-ink);
  font-size: 22px;
  line-height: 1;
  letter-spacing: -.025em;
}

.mu-copilot-card p {
  margin: 0;
  color: var(--mu-muted);
  font-size: 13px;
  font-weight: 750;
  line-height: 1.4;
}

.mu-command-center {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-top: 16px;
}

.mu-command-lane {
  display: grid;
  grid-template-columns: 44px 1fr;
  gap: 12px;
  min-height: 178px;
  border: 1px solid #dbeafe;
  border-radius: 22px;
  padding: 15px;
  background:
    radial-gradient(circle at 92% 8%, rgba(19, 181, 216, .12), transparent 28%),
    #ffffff;
  box-shadow: var(--mu-shadow-soft);
}

.mu-command-lane b,
.mu-command-lane strong,
.mu-command-lane small {
  display: block;
}

.mu-command-lane b {
  color: #1e3a8a;
  font-size: 12px;
  font-weight: 950;
  text-transform: uppercase;
}

.mu-command-lane strong {
  margin-top: 7px;
  color: var(--mu-ink);
  font-size: 22px;
  line-height: 1.04;
  letter-spacing: -.025em;
}

.mu-command-lane small {
  margin-top: 8px;
  color: var(--mu-muted);
  font-weight: 700;
  line-height: 1.35;
}

.mu-command-lane .mu-card-link {
  grid-column: 2;
  width: max-content;
}

.mu-compact-step {
  display: grid;
  gap: 5px;
  border: 1px solid var(--mu-line);
  border-radius: 15px;
  padding: 12px;
  background: #f8fbff;
}

.mu-compact-step b {
  color: var(--mu-ink);
}

.mu-compact-step span {
  color: var(--mu-muted);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.36;
}

.mu-assistant-strip {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 18px;
  align-items: center;
  margin-top: 18px;
  border: 1px solid #bfdbfe;
  border-radius: 26px;
  padding: 24px;
  background:
    radial-gradient(circle at 88% 0%, rgba(18, 100, 255, .16), transparent 32%),
    linear-gradient(135deg, #ffffff, #eff6ff);
  box-shadow: var(--mu-shadow-soft);
}

.mu-assistant-strip h2 {
  margin: 10px 0 7px;
  font-size: 30px;
  line-height: 1;
  letter-spacing: -.035em;
}

.mu-assistant-strip p {
  max-width: 700px;
  margin: 0;
  color: var(--mu-muted);
  font-weight: 700;
  line-height: 1.52;
}

.mu-stat {
  display: grid;
  gap: 4px;
  border-radius: 18px;
  padding: 16px;
}

.mu-stat strong {
  color: var(--mu-blue-deep);
  font-size: 30px;
  line-height: 1;
  letter-spacing: -.035em;
}

.mu-stat span {
  font-weight: 900;
}

.mu-stat small,
.mu-mini-card small {
  color: var(--mu-muted);
}

.mu-mini-card {
  display: grid;
  gap: 5px;
  margin-top: 10px;
  border-radius: 16px;
  padding: 13px;
  box-shadow: 0 10px 26px rgba(15, 23, 42, .05);
}

.mu-manual-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 12px;
}

.mu-manual-tile {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border: 1px solid #dbeafe;
  border-radius: 16px;
  padding: 13px;
  background: linear-gradient(135deg, #ffffff, #f8fbff);
}

.mu-manual-tile b,
.mu-manual-tile span,
.mu-manual-tile small {
  display: block;
}

.mu-manual-tile b {
  color: var(--mu-ink);
}

.mu-manual-tile span,
.mu-manual-tile small {
  color: var(--mu-muted);
  font-size: 12px;
  font-weight: 760;
}

.mu-manual-tile small {
  width: max-content;
  border: 1px solid #bfdbfe;
  border-radius: 999px;
  padding: 5px 8px;
  background: #eff6ff;
  color: #0b3f9e;
}

.mu-mini-card span {
  color: var(--mu-muted);
  line-height: 1.45;
}

.mu-vehicle-card {
  display: grid;
  gap: 10px;
  border-color: #dbeafe;
  border-radius: 20px;
  padding: 16px;
  background: linear-gradient(180deg, #ffffff, #f8fbff);
}

.mu-vehicle-top,
.mu-vehicle-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.mu-vehicle-meta {
  align-items: flex-start;
  flex-direction: column;
  color: var(--mu-muted);
  font-size: 13px;
}

.mu-badge {
  display: inline-flex;
  width: max-content;
  align-items: center;
  border: 1px solid #bfdbfe;
  border-radius: 999px;
  padding: 6px 10px;
  background: #eff6ff;
  color: var(--mu-blue-deep);
  font-size: 12px;
  font-weight: 900;
}

.mu-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 12px 0;
}

.mu-tabs span {
  border: 1px solid var(--mu-line);
  border-radius: 999px;
  padding: 7px 10px;
  color: #475569;
  font-size: 12px;
  font-weight: 850;
}

.mu-tabs span.active {
  border-color: var(--mu-blue-deep);
  background: var(--mu-blue-deep);
  color: #ffffff;
}

.mu-empty-note,
.mu-note,
.mu-safety {
  border: 1px dashed #bfdbfe;
  border-radius: 15px;
  padding: 12px;
  background: #f8fbff;
  color: #36567d;
  font-weight: 750;
  line-height: 1.5;
}

.mu-document-list,
.mu-alert-list,
.mu-timeline {
  display: grid;
}

.mu-document-list,
.mu-alert-list {
  gap: 10px;
}

.mu-timeline {
  gap: 0;
  margin-top: 4px;
}

.mu-timeline-item {
  position: relative;
  display: grid;
  grid-template-columns: 132px 1fr;
  gap: 14px;
  border-bottom: 1px solid #e2e8f0;
  padding: 14px 0;
}

.mu-timeline-item time {
  color: var(--mu-blue-deep);
  font-weight: 950;
}

.mu-timeline-item span {
  display: block;
  margin-top: 4px;
  color: var(--mu-muted);
}

.mu-alert-row {
  display: grid;
  grid-template-columns: 92px 1fr 1.2fr;
  gap: 14px;
  align-items: center;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  padding: 12px;
  background: #ffffff;
}

.mu-alert-row p {
  margin: 0;
  color: var(--mu-muted);
}

.mu-alert-row span:not(.mu-priority) {
  display: block;
  margin-top: 3px;
  color: var(--mu-muted);
}

.mu-priority {
  border-radius: 999px;
  padding: 7px 10px;
  color: #ffffff;
  font-weight: 950;
  text-align: center;
}

.mu-priority.alta { background: var(--mu-red); }
.mu-priority.media { background: var(--mu-amber); }
.mu-priority.baja { background: var(--mu-green); }

.mu-provider-list,
.mu-example-list {
  display: grid;
  gap: 10px;
}

.mu-provider-list {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 14px 0;
}

.mu-provider-list button,
.mu-example-list button {
  border: 1px solid var(--mu-line);
  border-radius: 14px;
  padding: 11px;
  background: #f8fafc;
  color: #475569;
  font-weight: 850;
}

.mu-example-list {
  margin-top: 14px;
}

.mu-form {
  display: grid;
  gap: 12px;
}

.mu-field {
  display: grid;
  gap: 6px;
  font-weight: 850;
}

.mu-field input,
.mu-field textarea,
.full {
  width: 100%;
  border: 1px solid var(--mu-line);
  border-radius: 14px;
  padding: 12px 13px;
  background: #ffffff;
  color: var(--mu-ink);
  font: inherit;
}

.mu-bottom-nav {
  display: none;
}

.mu-toast {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 99;
  max-width: min(360px, calc(100% - 36px));
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 14px;
  padding: 12px 14px;
  background: #061426;
  color: #ffffff;
  box-shadow: 0 14px 40px rgba(0, 0, 0, .2);
}

.mu-toast[hidden] {
  display: none;
}

@media (max-width: 980px) {
  .mu-landing-hero,
  .mu-split-band,
  .mu-section-hero,
  .mu-app-top {
    display: grid;
    grid-template-columns: 1fr;
  }

  .mu-feature-grid,
  .mu-stats-row,
  .mu-command-center,
  .mu-future-grid,
  .mu-focus-grid,
  .mu-user-cockpit {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .mu-driver-os,
  .mu-user-cockpit {
    grid-template-columns: 1fr;
  }

  .mu-assistant-strip {
    grid-template-columns: 1fr;
  }

  .mu-vehicle-grid {
    grid-template-columns: 1fr;
  }

  .span-3,
  .span-4,
  .span-6,
  .span-8 {
    grid-column: span 12;
  }

  .mu-nav {
    display: none;
  }

  .mu-bottom-nav {
    position: fixed;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 30;
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    border-top: 1px solid var(--mu-line);
    background: rgba(255, 255, 255, .96);
    backdrop-filter: blur(14px);
  }

  .mu-bottom-nav a {
    display: grid;
    min-width: 0;
    place-items: center;
    padding: 8px 2px;
    color: var(--mu-muted);
    font-size: 11px;
    text-decoration: none;
  }

  .mu-bottom-nav a.active {
    color: var(--mu-blue);
    font-weight: 900;
  }
}

@media (max-width: 620px) {
  .mu-header-inner,
  .mu-shell {
    width: min(calc(100% - 22px), 1180px);
  }

  .mu-header-inner {
    min-height: 64px;
  }

  .mu-logo {
    height: 34px;
  }

  .mu-brand-slogan {
    display: none;
  }

  .mu-landing-hero,
  .mu-section-hero,
  .mu-app-top,
  .mu-split-band {
    border-radius: 22px;
    padding: 20px;
  }

  .mu-hero-copy {
    min-height: 0;
  }

  .mu-actions .mu-btn {
    width: 100%;
    text-align: center;
  }

  .mu-feature-grid,
  .mu-stats-row,
  .mu-command-center,
  .mu-future-grid,
  .mu-focus-grid,
  .mu-cockpit-signals,
  .mu-manual-grid,
  .mu-provider-list {
    grid-template-columns: 1fr;
  }

  .mu-cockpit-main,
  .mu-copilot-card,
  .mu-driver-focus,
  .mu-ai-rail {
    border-radius: 20px;
    padding: 16px;
  }

  .mu-driver-focus h2 {
    font-size: 32px;
  }

  .mu-cockpit-main h2 {
    font-size: 30px;
  }

  .mu-guide-pill {
    width: 100%;
  }

  .mu-command-lane {
    min-height: 0;
  }

  .mu-task-pill {
    grid-template-columns: 1fr;
  }

  .mu-assistant-strip {
    padding: 20px;
  }

  .mu-future-head {
    display: grid;
  }

  .mu-future-head strong {
    width: max-content;
    white-space: normal;
  }

  .mu-alert-row,
  .mu-timeline-item {
    grid-template-columns: 1fr;
  }

  .mu-landing-hero h1,
  .mu-app-top h1,
  .mu-section-hero h1 {
    font-size: 34px;
  }

  .mu-public-page .mu-shell {
    padding-top: 14px;
    padding-bottom: 18px;
  }

  .mu-public-page .mu-landing-hero,
  .mu-public-page .mu-section-hero,
  .mu-public-page .mu-split-band {
    padding: 13px;
    border-radius: 10px;
  }

  .mu-public-page .mu-landing-hero h1,
  .mu-public-page .mu-section-hero h1 {
    font-size: 25px;
    line-height: 1.02;
  }

  .mu-public-page .mu-landing-hero p,
  .mu-public-page .mu-section-hero p,
  .mu-public-page .mu-split-band p {
    font-size: 12px;
    line-height: 1.3;
  }

  .mu-public-page .mu-section-hero {
    display: none;
  }

  .mu-public-page .mu-device-panel {
    padding: 10px;
  }

  .mu-public-page .mu-device-panel h2,
  .mu-public-page .mu-split-band h2 {
    font-size: 24px;
    line-height: 1.05;
  }

  .mu-public-page .mu-device-panel .mu-mini-card:nth-child(n+3) {
    display: none;
  }

  .mu-public-page .mu-split-band .mu-mini-card:nth-child(n+3) {
    display: none;
  }

  .mu-public-page .mu-feature-grid {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    padding-bottom: 6px;
  }

  .mu-public-page .mu-feature-grid .mu-card {
    flex: 0 0 205px;
    min-height: 162px;
    padding: 13px;
    scroll-snap-align: start;
  }

  .mu-public-page .mu-feature-grid .mu-card h3 {
    font-size: 16px;
  }

  .mu-public-page .mu-feature-grid .mu-card p {
    font-size: 11px;
    line-height: 1.3;
  }
}