/* Application shell: keeps existing forms, routes and authorization intact. */
.app-shell { --sidebar-width: 232px; --radius: 8px; --radius-lg: 8px; background: var(--bg); letter-spacing: 0; }
html:not([data-theme="dark"]) .app-shell { --bg: #f5f6f7; --panel: #fff; --panel-2: #f0f2f3; --line: #dee2e5; }
html[data-theme="dark"] .app-shell { --bg: #171a1c; --panel: #1c2023; --panel-2: #22272a; --line: #343a3e; --line-strong: #485056; --muted: #b0b8bf; --muted-2: #abb4bb; --brand-700: #ffac54; --brand-soft: #33271c; background: var(--bg); }
.app-shell .panel, .app-shell .card, .app-shell .filterbar, .app-shell .exec-summary { box-shadow: none; background: var(--panel); border-radius: 8px; }
.app-shell .card:hover { transform: none; box-shadow: none; }
.app-shell .card::before, .app-shell .card::after { display: none; }
.app-shell h1, .app-shell h2, .app-shell h3, .app-shell .card-label { letter-spacing: 0; }
.app-shell h1 { font-size: 28px; font-weight: 650; }
.app-shell .page-header { margin: 8px 0 24px; }
.app-shell .btn { border-radius: 6px; box-shadow: none; min-height: 36px; }
.app-shell .btn:hover { transform: none; }
.app-shell .card-value, .app-shell .num { font-variant-numeric: tabular-nums; }
.app-shell .notification-toggle { color: var(--text); background: var(--panel); border-color: var(--line); }
.workspace-title { display: none; }
.sidebar-toggle[hidden] { display: none; }
.app-shell .dashboard-view .panel.sec { border: 0; border-top: 1px solid var(--line); border-radius: 0; background: transparent; padding: 20px 0; }
.app-shell .dashboard-view > .panel > .sec-body { padding: 12px 0 0; }
.app-shell .dashboard-view > .panel > .panel-head { padding: 0; }
.app-shell .sec-summary h2 { font-size: 18px; font-weight: 650; }
.app-shell .primary-kpis { display: grid; grid-template-columns: repeat(auto-fit,minmax(170px,1fr)); gap: 0; border-block: 1px solid var(--line); background: transparent; }
.app-shell .primary-kpis > .card { padding: 20px; border: 0; border-right: 1px solid var(--line); border-radius: 0; background: transparent; min-width: 0; }
.app-shell .primary-kpis > .card:last-child { border-right: 0; }
.app-shell .primary-kpis .card-value { font-size: 29px; font-weight: 600; white-space: normal; overflow-wrap: anywhere; }
.app-shell .primary-kpis .card-label { font-size: 12px; }
.app-shell .primary-kpis .kpi-margin { border-top: 2px solid var(--ok); }
.app-shell .quality-unverified .primary-kpis .kpi-margin { border-top-color: var(--line-strong); }
.app-shell .filterbar { padding: 14px 16px; gap: 12px; border: 1px solid var(--line); }
.app-shell .data-quality-gate { border-radius: 4px; box-shadow: none; }
.app-shell .chart-blocked-state { background: transparent; border: 1px dashed var(--line-strong); border-radius: 6px; min-height: 150px; align-content: center; }
.app-shell .table-wrap { border-radius: 4px; }
#vehicleSection { scroll-margin-top: 85px; }
.app-shell table.data th { font-size: 12px; letter-spacing: 0; }
.app-shell table.data td { padding-block: 14px; }
.app-shell .density-compact table.data td { padding-block: 7px; }
.app-shell .density-compact .primary-kpis > .card { padding: 12px 16px; }
.app-shell .density-compact .primary-kpis .card-value { font-size: 25px; }
.analysis-grid { display: grid; grid-template-columns: minmax(0,1.35fr) minmax(0,1fr); gap: 28px; }
.workspace-filters { display: contents; }
.app-shell .mobile-filter-toggle { display: none; }
.analysis-grid > section { min-width: 0; }
.analysis-grid h3 { margin: 0 0 18px; font-size: 16px; }
.analysis-grid .chart-wrap { height: 310px; min-height: 310px; }
.bridge-values { display: flex; flex-wrap: wrap; gap: 12px 24px; font-size: 13px; margin: 16px 0 0; }
.bridge-values div { display: grid; gap: 4px; }
.bridge-values dt { color: var(--muted); }
.bridge-values dd { margin: 0; font-variant-numeric: tabular-nums; font-weight: 600; }
.app-shell .footer { background: transparent; border-top: 1px solid var(--line); font-size: 12px; }
@media (min-width: 900px) {
  .app-shell { padding-left: var(--sidebar-width); }
  .app-shell.sidebar-compact { --sidebar-width: 76px; }
  .app-shell .container { max-width: 1720px; padding: 28px 32px 40px; margin-inline: auto; }
  .app-shell .topbar { position: sticky; top: 0; height: 68px; border: 0; border-bottom: 1px solid var(--line); background: var(--panel); box-shadow: none; z-index: 110; }
  .app-shell .topbar::before { content: ''; position: fixed; inset: 0 auto 0 0; width: var(--sidebar-width); background: var(--panel); border-right: 1px solid var(--line); pointer-events: none; }
  .app-shell .topbar-inner { max-width: none; height: 68px; min-height: 68px; padding: 0 32px; gap: 14px; flex-wrap: nowrap; }
  .app-shell .brand { position: fixed; left: 20px; top: 24px; width: calc(var(--sidebar-width) - 40px); color: var(--text); font-size: 26px; gap: 10px; }
  .app-shell .brand-logo { height: 36px; width: 36px; box-shadow: none; border-radius: 8px; }
  .app-shell .workspace-title { display: block; margin-right: auto; font-size: 14px; color: var(--muted); max-width: 45%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .app-shell .nav-panel, .app-shell.nav-collapsed .nav-panel { display: contents; }
  .app-shell .mainnav { position: fixed; left: 12px; top: 100px; bottom: 70px; width: calc(var(--sidebar-width) - 24px); display: flex; flex-direction: column; align-items: stretch; gap: 6px; overflow-y: auto; padding: 0 4px; }
  .app-shell .mainnav > a, .app-shell .mainnav > details > summary { min-height: 44px; border-radius: 6px; padding: 10px 12px; font-size: 14px; font-weight: 500; color: var(--muted); background: transparent; box-shadow: none; border: 0; white-space: normal; }
  .app-shell .mainnav > a.active, .app-shell .mainnav summary.active { background: var(--brand-soft); color: var(--brand-700); box-shadow: inset 3px 0 var(--brand); }
  .app-shell .mainnav > a:hover, .app-shell .mainnav > details > summary:hover { background: var(--panel-2); color: var(--text); }
  .app-shell .mainnav > a, .app-shell .mainnav > details > summary { display: flex; align-items: center; justify-content: flex-start; gap: 12px; }
  .app-shell .mainnav > details > summary::after { margin-left: auto; }
  .app-shell .mainnav .nav-dropdown { position: static; min-width: 0; width: 100%; background: transparent; border: 0; box-shadow: none; padding: 4px 0 4px 18px; }
  .app-shell .mainnav .nav-dropdown a { color: var(--muted); font-size: 13px; white-space: normal; }
  .app-shell .mainnav .nav-dropdown a.active { color: var(--brand-700); background: var(--brand-soft); }
  .app-shell .nav-burger, .app-shell.nav-collapsed .nav-burger { display: none; }
  .app-shell .userbox { margin-left: 0; gap: 10px; }
  .app-shell .userbox .lang-switch, .app-shell .userbox .theme-toggle, .app-shell .user-summary { color: var(--text); background: transparent; border-color: var(--line); border-radius: 6px; box-shadow: none; }
  .app-shell .user-dropdown { background: var(--panel); border-color: var(--line); }
  .app-shell .user-dropdown a, .app-shell .user-dropdown .user-email { color: var(--text); }
  .app-shell .sidebar-toggle { display: grid; position: fixed; bottom: 20px; left: 20px; }
  .app-shell .sidebar-toggle[hidden] { display: none; }
  .app-shell.sidebar-compact .sidebar-label { display: none; }
  .app-shell.sidebar-compact .brand { left: 20px; width: 36px; }
  .app-shell.sidebar-compact .mainnav { left: 0; width: var(--sidebar-width); padding: 0; overflow-x: hidden; }
  .app-shell.sidebar-compact .mainnav a,
  .app-shell.sidebar-compact .mainnav > details > summary {
    width: 44px; min-height: 44px; padding: 10px; gap: 0;
    margin-left: calc((var(--sidebar-width) - 44px) / 2);
    display: flex; align-items: center; justify-content: center;
  }
  .app-shell.sidebar-compact .mainnav svg { flex-shrink: 0; width: 20px; height: 20px; }
  .app-shell.sidebar-compact .mainnav > details > summary::after { display: none; }
  .app-shell.sidebar-compact .mainnav .nav-dropdown { padding: 4px 0; border-block: 1px solid var(--line); }
  .app-shell.sidebar-compact .mainnav details[open] > summary { background: var(--panel-2); }
  .app-shell.sidebar-compact .sidebar-toggle { left: 16px; width: 44px; height: 44px; }
}
@media (max-width: 1350px) { .analysis-grid { grid-template-columns: minmax(0,1fr); } }
@media (max-width: 899px) {
  .sidebar-toggle { display: none; }
  .app-shell .notification-toggle { color: #fff; background: transparent; }
  .app-shell .container { padding-inline: 20px; }
}
@media (max-width: 600px) {
  .app-shell .mobile-filter-toggle:not([hidden]) { display: inline-flex; }
  .workspace-filters { display: grid; gap: 12px; width: 100%; }
  .workspace-filters.is-enhanced:not(.is-expanded) { display: none; }
  .app-shell:has(.tour-backdrop) .workspace-filters.is-enhanced { display: grid; }
  .app-shell .container { padding-inline: 14px; }
  .app-shell h1 { font-size: 24px; }
  .app-shell .primary-kpis { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .app-shell .primary-kpis > .card { padding: 14px 10px; border-bottom: 1px solid var(--line); }
  .app-shell .primary-kpis .card-value { font-size: 23px; }
  .analysis-grid .chart-wrap { height: 280px; min-height: 280px; }
}
@media (prefers-reduced-motion: reduce) { .app-shell *, .app-shell *::before, .app-shell *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; } }
@media print { .app-shell { padding-left: 0; } .app-shell .topbar { display: none; } }