* {
        box-sizing: border-box;
      }
      html {
        scroll-behavior: smooth;
      }
      body {
        margin: 0;
        min-height: 100vh;
        font-family:
          Inter,
          ui-sans-serif,
          -apple-system,
          BlinkMacSystemFont,
          "Segoe UI",
          sans-serif;
        color: var(--text);
        background:
          radial-gradient(
            circle at 12% 12%,
            rgba(0, 0, 0, 0.05),
            transparent 24%
          ),
          radial-gradient(
            circle at 92% 10%,
            rgba(0, 0, 0, 0.03),
            transparent 20%
          ),
          radial-gradient(
            circle at 80% 85%,
            rgba(0, 0, 0, 0.03),
            transparent 26%
          ),
          linear-gradient(135deg, #fbfbfb, #f2f2f2 45%, #ececec 100%);
        overflow-x: hidden;
      }
      body:before {
        content: "";
        position: fixed;
        inset: 0;
        pointer-events: none;
        background: linear-gradient(
          to bottom,
          rgba(255, 255, 255, 0.35),
          transparent 20%,
          transparent 80%,
          rgba(255, 255, 255, 0.25)
        );
        mix-blend-mode: normal;
      }
      button,
      input,
      select {
        font: inherit;
      }
      button {
        cursor: pointer;
      }
      a {
        text-decoration: none;
        color: inherit;
      }
      .hidden {
        display: none !important;
      }

      .app {
        min-height: 100vh;
      }
      .sidebar {
        position: fixed;
        inset: 0 auto 0 0;
        width: var(--sidebar);
        z-index: 30;
        padding: 22px 18px 18px;
        background: rgba(255, 255, 255, 0.72);
        backdrop-filter: blur(24px) saturate(110%);
        border-right: 1px solid var(--line);
        box-shadow: 18px 0 60px rgba(0, 0, 0, 0.08);
        display: flex;
        flex-direction: column;
      }
      .brand {
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 8px 8px 26px;
      }
      .brand-logo-img {
        display: block;
        width: 156px;
        height: auto;
        object-fit: contain;
      }
      .brand-copy p {
        margin: 7px 0 0;
        color: #6f6f6f;
        font-size: 9px;
        letter-spacing: 0.24em;
        text-transform: uppercase;
      }
      .nav-section {
        padding: 10px 10px 6px;
        color: #7b7b7b;
        font-size: 10px;
        letter-spacing: 0.18em;
        text-transform: uppercase;
      }
      .nav-item {
        width: 100%;
        border: 0;
        background: transparent;
        color: #2d2d2d;
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 13px 14px;
        border-radius: 16px;
        text-align: left;
        transition: 0.2s;
        margin-bottom: 4px;
      }
      .nav-item:hover,
      .nav-item.active {
        background: rgba(0, 0, 0, 0.06);
        color: #111;
        box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.05);
      }
      .ico {
        width: 18px;
        height: 18px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 18px;
      }
      .ico svg {
        width: 18px;
        height: 18px;
        stroke: currentColor;
        fill: none;
        stroke-width: 1.8;
        stroke-linecap: round;
        stroke-linejoin: round;
      }
      .profile-card {
        margin-top: auto;
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 12px;
        border-radius: 18px;
        border: 1px solid var(--line);
        background: rgba(255, 255, 255, 0.55);
      }
      .avatar {
        width: 40px;
        height: 40px;
        border-radius: 50%;
        overflow: hidden;
        border: 1px solid var(--line-2);
        background: #222;
      }
      .avatar img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        filter: grayscale(1);
      }
      .profile-card b {
        display: block;
        font-size: 12px;
      }
      .profile-card small {
        color: #6f6f6f;
        font-size: 10px;
      }
      .status-dot {
        margin-left: auto;
        width: 8px;
        height: 8px;
        border-radius: 50%;
        background: #111;
        box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.08);
      }

      .shell {
        margin-left: var(--sidebar);
        min-height: 100vh;
      }
      .topbar {
        position: sticky;
        top: 0;
        z-index: 20;
        height: 82px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0 28px;
        background: rgba(255, 255, 255, 0.68);
        backdrop-filter: blur(20px);
        border-bottom: 1px solid rgba(0, 0, 0, 0.06);
      }
      .page-title h1,
      .greeting h1 {
        margin: 0;
        font-size: 31px;
        letter-spacing: -0.05em;
        font-weight: 700;
      }
      .page-title p,
      .greeting p {
        margin: 6px 0 0;
        font-size: 12px;
        color: #666;
      }
      .top-actions {
        display: flex;
        align-items: center;
        gap: 10px;
      }
      .search,
      .control,
      .icon-btn,
      .btn {
        border: 1px solid var(--line);
        background: rgba(255, 255, 255, 0.75);
        backdrop-filter: blur(18px);
        color: #111;
        border-radius: 16px;
      }
      .search {
        width: 420px;
        height: 46px;
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 0 14px;
      }
      .search input {
        width: 100%;
        border: 0;
        outline: 0;
        background: transparent;
        color: #111;
        font-size: 12px;
      }
      .search input::placeholder {
        color: #8a8a8a;
      }
      .key {
        padding: 5px 7px;
        border-radius: 9px;
        border: 1px solid var(--line);
        font-size: 10px;
        color: #8c8c8c;
      }
      .control {
        height: 46px;
        padding: 0 14px;
        display: flex;
        align-items: center;
        gap: 10px;
        font-size: 12px;
        color: #efefef;
      }
      .icon-btn {
        width: 46px;
        height: 46px;
        display: grid;
        place-items: center;
        position: relative;
      }
      .notif {
        position: absolute;
        right: 6px;
        top: 6px;
        min-width: 17px;
        height: 17px;
        border-radius: 10px;
        background: #fff;
        color: #000;
        font-size: 10px;
        display: grid;
        place-items: center;
        font-weight: 700;
      }
      .top-avatar {
        width: 38px;
        height: 38px;
        border-radius: 50%;
        border: 1px solid var(--line-2);
        display: grid;
        place-items: center;
        background: rgba(255, 255, 255, 0.78);
        font-weight: 700;
      }
      .page {
        display: none;
        padding: 26px 28px 38px;
      }
      .page.active {
        display: block;
      }
      .glass {
        background: var(--panel);
        border: 1px solid rgba(255, 255, 255, 0.7);
        box-shadow:
          var(--shadow),
          inset 0 1px 0 rgba(255, 255, 255, 0.95);
        backdrop-filter: blur(22px) saturate(115%);
        border-radius: var(--radius);
      }
      .panel {
        padding: 18px;
      }
      .section-title {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 14px;
      }
      .section-title h3 {
        margin: 0;
        font-size: 15px;
        color: #111;
      }
      .link {
        font-size: 11px;
        color: #4b4b4b;
      }
      .btn {
        height: 44px;
        padding: 0 16px;
        display: inline-flex;
        align-items: center;
        gap: 10px;
        color: #fff;
        font-size: 12px;
      }
      .btn.primary {
        background: #111;
        color: #fff;
        border-color: #111;
        font-weight: 700;
      }
      .actions {
        display: flex;
        gap: 10px;
        flex-wrap: wrap;
      }
      .page-head {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 12px;
        margin-bottom: 18px;
      }

      .kpis {
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        gap: 12px;
      }
      .kpi {
        padding: 16px;
        position: relative;
        overflow: hidden;
        min-height: 116px;
      }
      .kpi:after {
        content: "";
        position: absolute;
        inset: auto -30px -30px auto;
        width: 110px;
        height: 110px;
        border-radius: 50%;
        background: radial-gradient(
          circle,
          rgba(255, 255, 255, 0.1),
          transparent 70%
        );
      }
      .kpi-top {
        display: flex;
        align-items: center;
        gap: 8px;
        color: #666;
        font-size: 11px;
      }
      .iconbox {
        width: 32px;
        height: 32px;
        border-radius: 12px;
        display: grid;
        place-items: center;
        background: rgba(255, 255, 255, 0.75);
        border: 1px solid rgba(0, 0, 0, 0.08);
      }
      .kpi strong {
        display: block;
        margin: 12px 0 4px;
        font-size: 28px;
        letter-spacing: -0.05em;
      }
      .kpi small {
        display: block;
        color: #6f6f6f;
        font-size: 10px;
        line-height: 1.5;
      }
      .delta {
        margin-top: 8px;
        font-size: 11px;
        color: #444;
      }

      .finance-strip {
        display: grid;
        grid-template-columns: 1.05fr 1.05fr 0.9fr 1fr 1.5fr;
        gap: 0;
        margin-top: 12px;
        overflow: hidden;
      }
      .fin {
        padding: 18px;
        border-right: 1px solid rgba(255, 255, 255, 0.08);
      }
      .fin:last-child {
        border-right: 0;
      }
      .fin label {
        display: block;
        font-size: 10px;
        color: #666;
      }
      .fin strong {
        display: block;
        margin: 10px 0 6px;
        font-size: 20px;
      }
      .progress {
        height: 6px;
        background: rgba(0, 0, 0, 0.08);
        border-radius: 999px;
        overflow: hidden;
        flex: 1;
      }
      .progress i {
        display: block;
        height: 100%;
        background: linear-gradient(90deg, #111, #666);
        border-radius: 999px;
      }
      .progress-row {
        display: flex;
        align-items: center;
        gap: 10px;
        margin-top: 10px;
        color: #666;
        font-size: 10px;
      }
      .objective-wrap {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 10px;
        margin-top: 4px;
      }
      .objective {
        text-align: center;
      }
      .ring {
        --p: 80%;
        width: 54px;
        height: 54px;
        margin: 0 auto 8px;
        border-radius: 50%;
        background: conic-gradient(#111 var(--p), rgba(0, 0, 0, 0.08) 0);
        display: grid;
        place-items: center;
        position: relative;
      }
      .ring:after {
        content: "";
        position: absolute;
        inset: 7px;
        border-radius: 50%;
        background: rgba(255, 255, 255, 0.96);
        border: 1px solid rgba(0, 0, 0, 0.06);
      }
      .ring b {
        position: relative;
        z-index: 1;
        font-size: 10px;
      }
      .objective span {
        display: block;
        color: #666;
        font-size: 9px;
        line-height: 1.35;
      }

      .dashboard-grid {
        display: grid;
        grid-template-columns: 1.1fr 1.15fr 1.25fr;
        gap: 12px;
        margin-top: 12px;
      }
      .service-row {
        display: grid;
        grid-template-columns: 1fr auto auto;
        align-items: center;
        gap: 10px;
        margin: 12px 0;
      }
      .service-row b {
        font-size: 12px;
      }
      .service-row small {
        font-size: 10px;
        color: #666;
      }
      .service-bar {
        height: 5px;
        background: rgba(0, 0, 0, 0.08);
        border-radius: 999px;
        margin-top: 6px;
        overflow: hidden;
      }
      .service-bar i {
        height: 100%;
        display: block;
        background: linear-gradient(90deg, #111, #777);
      }
      .chart {
        height: 196px;
        padding-top: 10px;
      }
      .chart svg {
        width: 100%;
        height: 100%;
        overflow: visible;
      }
      .gridline {
        stroke: rgba(0, 0, 0, 0.1);
        stroke-dasharray: 4 5;
        stroke-width: 1;
      }
      .line1 {
        fill: none;
        stroke: #111;
        stroke-width: 2.5;
      }
      .line2 {
        fill: none;
        stroke: #666;
        stroke-width: 2;
      }
      .line3 {
        fill: none;
        stroke: #9a9a9a;
        stroke-width: 1.5;
        stroke-dasharray: 5 5;
      }
      .legend {
        display: flex;
        gap: 16px;
        font-size: 10px;
        color: #666;
      }
      .legend i {
        display: inline-block;
        width: 14px;
        height: 3px;
        border-radius: 999px;
        margin-right: 5px;
        vertical-align: middle;
      }
      .crm-stats {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 2px;
        margin: 0 0 12px;
      }
      .crm-stat {
        padding: 6px 8px;
        border-right: 1px solid rgba(255, 255, 255, 0.08);
      }
      .crm-stat:last-child {
        border-right: 0;
      }
      .crm-stat b {
        display: block;
        font-size: 22px;
      }
      .crm-stat span {
        display: block;
        font-size: 9px;
        color: #666;
        line-height: 1.4;
      }
      .mini-table {
        width: 100%;
        border-collapse: collapse;
      }
      .mini-table th {
        padding: 8px 4px;
        border-bottom: 1px solid rgba(0, 0, 0, 0.08);
        text-align: left;
        font-size: 9px;
        color: #666;
        font-weight: 600;
      }
      .mini-table td {
        padding: 9px 4px;
        border-bottom: 1px solid rgba(0, 0, 0, 0.05);
        font-size: 10px;
        vertical-align: top;
      }
      .pill {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        padding: 5px 9px;
        border-radius: 999px;
        font-size: 9px;
        background: rgba(0, 0, 0, 0.05);
        color: #111;
        border: 1px solid rgba(0, 0, 0, 0.08);
        white-space: nowrap;
      }
      .pill.soft {
        background: rgba(0, 0, 0, 0.08);
      }
      .pill.s1 {
        background: rgba(0, 0, 0, 0.08);
      }
      .pill.s2 {
        background: rgba(0, 0, 0, 0.06);
      }
      .pill.s3 {
        background: rgba(0, 0, 0, 0.04);
      }
      .person {
        display: flex;
        align-items: center;
        gap: 6px;
      }
      .person .dotavatar {
        width: 21px;
        height: 21px;
        border-radius: 50%;
        overflow: hidden;
        border: 1px solid var(--line);
      }
      .person .dotavatar img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        filter: grayscale(1);
      }

      .board-row {
        display: grid;
        grid-template-columns: 1.25fr 1fr 1fr;
        gap: 12px;
        margin-top: 12px;
      }
      .kanban {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 8px;
      }
      .kan-col {
        border: 1px solid rgba(0, 0, 0, 0.08);
        border-radius: 14px;
        padding: 10px;
        background: rgba(255, 255, 255, 0.5);
      }
      .kan-head {
        display: flex;
        justify-content: space-between;
        font-size: 10px;
        font-weight: 700;
        margin-bottom: 8px;
      }
      .task {
        padding: 8px 2px;
        border-bottom: 1px solid rgba(0, 0, 0, 0.05);
      }
      .task:last-child {
        border-bottom: 0;
      }
      .task b {
        display: block;
        font-size: 10px;
        margin-bottom: 4px;
      }
      .task small {
        font-size: 8px;
        color: #666;
      }
      .agenda-row,
      .alert-row,
      .doc-row {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        padding: 10px 0;
        border-bottom: 1px solid rgba(0, 0, 0, 0.06);
      }
      .agenda-row:last-child,
      .alert-row:last-child,
      .doc-row:last-child {
        border-bottom: 0;
      }
      .agenda-row time {
        width: 46px;
        color: #666;
        font-size: 10px;
        padding-top: 2px;
      }
      .agenda-row b,
      .alert-row b {
        display: block;
        font-size: 11px;
      }
      .agenda-row span,
      .alert-row small,
      .doc-row small {
        color: #666;
        font-size: 9px;
        line-height: 1.4;
      }
      .alert-icon {
        width: 24px;
        height: 24px;
        border-radius: 8px;
        display: grid;
        place-items: center;
        background: rgba(0, 0, 0, 0.07);
        font-size: 11px;
        font-weight: 700;
      }
      .count {
        margin-left: auto;
        padding: 4px 8px;
        border-radius: 999px;
        background: rgba(0, 0, 0, 0.06);
        font-size: 10px;
      }

      .stock-strip {
        margin-top: 12px;
      }
      .vehicle-cards {
        display: grid;
        grid-template-columns: repeat(6, minmax(0, 1fr));
        gap: 10px;
      }
      .vehicle-card {
        padding: 10px;
        border-radius: 18px;
        background: rgba(255, 255, 255, 0.6);
        border: 1px solid rgba(0, 0, 0, 0.08);
        cursor: pointer;
        transition: 0.2s;
      }
      .vehicle-card:hover {
        transform: translateY(-2px);
        background: rgba(255, 255, 255, 0.9);
      }
      .car-thumb {
        height: 130px;
        border-radius: 14px;
        position: relative;
        overflow: hidden;
        background: #efefef;
      }
      .car-thumb img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        filter: none;
      }
      .age {
        position: absolute;
        right: 8px;
        top: 8px;
        padding: 5px 7px;
        border-radius: 999px;
        background: rgba(255, 255, 255, 0.78);
        backdrop-filter: blur(10px);
        font-size: 9px;
        border: 1px solid rgba(0, 0, 0, 0.08);
      }
      .vehicle-card h4 {
        margin: 10px 0 5px;
        font-size: 12px;
      }
      .vehicle-card p {
        margin: 0;
        color: #666;
        font-size: 10px;
        line-height: 1.4;
      }
      .vehicle-values {
        display: flex;
        justify-content: space-between;
        gap: 8px;
        margin-top: 10px;
        font-size: 10px;
        color: #666;
      }
      .vehicle-values b {
        display: block;
        color: #fff;
        font-size: 12px;
        margin-top: 4px;
      }

      .stock-kpis {
        grid-template-columns: repeat(7, minmax(0, 1fr));
      }
      .stock-layout {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: 12px;
        margin-top: 12px;
      }
      .stock-main {
        padding: 16px;
        min-width: 0;
      }
      .tabs {
        display: flex;
        gap: 18px;
        padding: 4px 2px 14px;
        overflow: auto;
        white-space: nowrap;
      }
      .tab {
        border: 0;
        background: none;
        color: #9d9d9d;
        padding: 0 0 8px;
        font-size: 11px;
        border-bottom: 2px solid transparent;
      }
      .tab.active {
        color: #fff;
        border-bottom-color: #fff;
        font-weight: 700;
      }
      .filterbar {
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr)) minmax(150px, auto);
        gap: 10px;
        padding: 14px 0;
        border-top: 1px solid rgba(0, 0, 0, 0.06);
        border-bottom: 1px solid rgba(0, 0, 0, 0.06);
      }
      .filter {
        padding: 9px 10px;
        border-radius: 14px;
        background: rgba(255, 255, 255, 0.75);
        border: 1px solid rgba(0, 0, 0, 0.08);
      }
      .filter label {
        display: block;
        font-size: 9px;
        color: #666;
        margin-bottom: 5px;
      }
      .filter select,
      .filter input {
        width: 100%;
        border: 0;
        outline: 0;
        background: transparent;
        color: #111;
        font-size: 11px;
        padding: 0;
      }
      .filter input::placeholder {
        color: #999;
      }
      .advanced-filter-btn { min-height:52px; align-self:stretch; justify-content:center; white-space:nowrap; }
      .advanced-filter-panel { margin-top:12px; padding:18px; border-radius:18px; }
      .advanced-filter-head { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; margin-bottom:16px; }
      .advanced-filter-head b, .advanced-filter-head small { display:block; }
      .advanced-filter-head small { margin-top:5px; color:var(--muted); }
      .advanced-filter-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
      .advanced-filter-actions { display:flex; justify-content:flex-end; gap:10px; margin-top:16px; padding-top:16px; border-top:1px solid var(--line); }
      .table-toolbar {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 14px 0 10px;
      }
      .table-actions {
        display: flex;
        gap: 8px;
        flex-wrap: wrap;
      }
      .table-wrap {
        overflow: auto;
        max-height: 680px;
        border: 1px solid rgba(0, 0, 0, 0.08);
        border-radius: 18px;
        background: rgba(255, 255, 255, 0.82);
        scrollbar-gutter: stable;
      }
      .stock-table {
        width: 100%;
        border-collapse: collapse;
        min-width: 1450px;
      }
      .stock-table th {
        position: sticky;
        top: 0;
        z-index: 3;
        padding: 10px 8px;
        border-bottom: 1px solid rgba(0, 0, 0, 0.08);
        text-align: left;
        font-size: 9px;
        color: #666;
        letter-spacing: 0.02em;
        font-weight: 600;
        background: rgba(247, 249, 255, 0.97);
        backdrop-filter: blur(16px);
      }
      .stock-table th.sortable {
        cursor: pointer;
        user-select: none;
      }
      .stock-table th.sortable:hover {
        color: var(--accent);
      }
      .sort-indicator {
        margin-left: 5px;
        color: var(--accent);
        font-size: 8px;
      }
      .stock-table td {
        padding: 8px;
        border-bottom: 1px solid rgba(0, 0, 0, 0.05);
        font-size: 9px;
        vertical-align: middle;
      }
      .stock-table tbody tr {
        cursor: pointer;
        transition: 0.15s;
      }
      .stock-table tbody tr:hover {
        background: rgba(0, 0, 0, 0.03);
      }
      .thumb-sm {
        width: 100px;
        height: 62px;
        border-radius: 14px;
        overflow: hidden;
        background: #eef1f6;
        border: 1px solid rgba(0, 0, 0, 0.08);
        display: block;
        padding: 0;
      }
      .thumb-sm img {
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover;
        filter: none;
      }
      .brand-logo {
        width: 100%;
        height: 100%;
        display: grid;
        place-items: center;
      }
      .brand-logo img {
        display: block;
        max-width: 100%;
        max-height: 100%;
        object-fit: contain;
        filter: grayscale(1) contrast(1.04);
      }
      .brand-logo.logo-audi img {
        max-width: 100%;
        max-height: 22px;
      }
      .brand-logo.logo-bmw img {
        max-width: 30px;
        max-height: 30px;
      }
      .brand-logo.logo-mercedes img {
        max-width: 30px;
        max-height: 30px;
      }
      .brand-logo.logo-volkswagen img {
        max-width: 30px;
        max-height: 30px;
      }
      .brand-logo.logo-volvo img {
        max-width: 52px;
        max-height: 26px;
      }
      .brand-logo.logo-porsche img {
        max-width: 26px;
        max-height: 36px;
      }
      .brand-logo.logo-peugeot img {
        max-width: 28px;
        max-height: 36px;
      }
      .brand-logo.logo-generic svg {
        width: 100%;
        height: 100%;
        display: block;
        overflow: visible;
      }
      .thumb-sm .brand-word {
        font-size: 8px;
        font-weight: 700;
        letter-spacing: 0.08em;
        fill: #111;
      }
      .ref {
        color: #666;
        font-size: 9px;
      }
      .progress-icons {
        display: flex;
        gap: 6px;
        align-items: center;
        flex-wrap: nowrap;
      }
      .picon {
        width: 22px;
        height: 22px;
        border-radius: 999px;
        border: 1px solid rgba(0, 0, 0, 0.14);
        background: rgba(255, 255, 255, 0.84);
        display: grid;
        place-items: center;
        color: #a1a1a1;
        flex: 0 0 22px;
      }
      .picon svg {
        width: 11px;
        height: 11px;
        stroke: currentColor;
        fill: none;
        stroke-width: 1.9;
        stroke-linecap: round;
        stroke-linejoin: round;
      }
      .picon.on {
        background: #111;
        border-color: #111;
        color: #fff;
      }
      .picon.off {
        background: rgba(255, 255, 255, 0.9);
      }
      .sync-dot {
        display: inline-block;
        width: 10px;
        height: 10px;
        border-radius: 50%;
        background: #111;
        box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.08);
      }
      .pagination {
        display: flex;
        justify-content: flex-end;
        gap: 6px;
        padding-top: 14px;
      }
      .page-n {
        width: 34px;
        height: 34px;
        border-radius: 12px;
        border: 1px solid rgba(0, 0, 0, 0.08);
        background: rgba(255, 255, 255, 0.7);
        color: #111;
      }
      .page-n.active {
        background: #111;
        color: #fff;
        font-weight: 700;
      }
      .stock-side {
        display: grid;
        gap: 12px;
      }
      .donut-wrap {
        display: grid;
        grid-template-columns: 110px 1fr;
        gap: 12px;
        align-items: center;
      }
      .donut {
        width: 110px;
        height: 110px;
        border-radius: 50%;
        display: grid;
        place-items: center;
        background: conic-gradient(
          #fff 0 22%,
          #d6d6d6 22% 42%,
          #9e9e9e 42% 59%,
          #f1f1f1 59% 68%,
          #7a7a7a 68% 100%
        );
        position: relative;
      }
      .donut:after {
        content: "";
        position: absolute;
        inset: 14px;
        border-radius: 50%;
        background: #fff;
        border: 1px solid rgba(0, 0, 0, 0.06);
      }
      .donut div {
        position: relative;
        z-index: 1;
        text-align: center;
      }
      .donut b {
        display: block;
        font-size: 24px;
      }
      .donut small {
        color: #666;
        font-size: 9px;
      }
      .legend-list {
        display: grid;
        gap: 7px;
      }
      .legend-list div {
        display: grid;
        grid-template-columns: 10px 1fr auto;
        gap: 7px;
        align-items: center;
        font-size: 10px;
        color: #555;
      }
      .legend-list i {
        display: block;
        width: 10px;
        height: 10px;
        border-radius: 50%;
      }
      .shortcuts button {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-top: 8px;
        height: 42px;
        border-radius: 14px;
        border: 1px solid rgba(0, 0, 0, 0.08);
        background: rgba(255, 255, 255, 0.7);
        color: #111;
        padding: 0 12px;
        font-size: 11px;
      }
      .sync-box {
        padding: 12px;
        border-radius: 16px;
        background: rgba(255, 255, 255, 0.7);
        border: 1px solid rgba(0, 0, 0, 0.08);
      }
      .sync-box b {
        display: block;
        font-size: 12px;
      }
      .sync-box p {
        margin: 8px 0 12px;
        color: #666;
        font-size: 10px;
        line-height: 1.5;
      }

      .breadcrumbs {
        display: flex;
        align-items: center;
        gap: 8px;
        font-size: 10px;
        color: #666;
        margin-bottom: 14px;
      }
      .vehicle-hero {
        padding: 18px;
        display: grid;
        grid-template-columns: 310px 1fr auto;
        gap: 18px;
        align-items: center;
      }
      .hero-car {
        height: 210px;
        border-radius: 18px;
        overflow: hidden;
        position: relative;
        background: #efefef;
      }
      .hero-car img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        filter: none;
      }
      .photo-chip {
        position: absolute;
        left: 10px;
        bottom: 10px;
        padding: 6px 9px;
        border-radius: 999px;
        background: rgba(255, 255, 255, 0.84);
        backdrop-filter: blur(10px);
        font-size: 10px;
        border: 1px solid rgba(0, 0, 0, 0.08);
      }
      .vehicle-title-line {
        display: flex;
        align-items: center;
        gap: 10px;
      }
      .vehicle-title-line h2 {
        margin: 0;
        font-size: 28px;
        letter-spacing: -0.05em;
      }
      .vehicle-ident {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 0;
        margin: 14px 0 18px;
      }
      .ident {
        padding-right: 20px;
        border-right: 1px solid rgba(0, 0, 0, 0.08);
      }
      .ident:nth-child(2) {
        padding-left: 20px;
      }
      .ident:last-child {
        border-right: 0;
        padding-left: 20px;
      }
      .ident span {
        display: block;
        font-size: 10px;
        color: #666;
      }
      .ident b {
        display: block;
        font-size: 12px;
        margin-top: 6px;
      }
      .vehicle-metrics {
        display: grid;
        grid-template-columns: repeat(7, minmax(82px, 1fr));
        gap: 10px;
      }
      .vmet {
        padding: 12px;
        border: 1px solid rgba(0, 0, 0, 0.08);
        border-radius: 14px;
        background: rgba(255, 255, 255, 0.72);
      }
      .vmet:first-child {
        padding: 12px;
      }
      .vmet:last-child {
        border-right: 1px solid rgba(0, 0, 0, 0.08);
      }
      .vmet label {
        display: block;
        font-size: 9px;
        color: #666;
        text-transform: uppercase;
        letter-spacing: 0.05em;
      }
      .vmet b {
        display: block;
        margin-top: 6px;
        font-size: 12px;
      }
      .vmet small {
        display: block;
        margin-top: 5px;
        font-size: 9px;
        color: #666;
      }
      .hero-actions {
        align-self: start;
        display: flex;
        gap: 8px;
        position: relative;
      }
      .dropdown {
        position: absolute;
        right: 0;
        top: 50px;
        width: 230px;
        border-radius: 18px;
        padding: 8px;
        background: rgba(255, 255, 255, 0.96);
        backdrop-filter: blur(22px);
        border: 1px solid rgba(0, 0, 0, 0.08);
        box-shadow: 0 20px 60px rgba(0, 0, 0, 0.12);
      }
      .dropdown button {
        width: 100%;
        text-align: left;
        border: 0;
        background: none;
        color: #111;
        padding: 9px 10px;
        border-radius: 10px;
        font-size: 10px;
      }
      .dropdown button:hover {
        background: rgba(0, 0, 0, 0.04);
      }
      .vehicle-tabs {
        display: flex;
        gap: 22px;
        padding: 0 16px;
        margin-top: 12px;
        overflow: auto;
        white-space: nowrap;
      }
      .vehicle-tabs button {
        border: 0;
        background: none;
        color: #666;
        padding: 14px 0;
        font-size: 11px;
        border-bottom: 2px solid transparent;
      }
      .vehicle-tabs button.active {
        color: #111;
        border-bottom-color: #111;
        font-weight: 700;
      }
      .vehicle-layout {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 320px;
        gap: 12px;
        margin-top: 12px;
      }
      .timeline-panel {
        padding: 18px;
      }
      .flow {
        display: flex;
        align-items: flex-start;
        gap: 0;
        overflow: auto;
        padding: 12px 2px 4px;
      }
      .step {
        flex: 1;
        min-width: 62px;
        position: relative;
        text-align: center;
      }
      .step:before {
        content: "";
        position: absolute;
        top: 12px;
        left: -50%;
        right: 50%;
        height: 2px;
        background: rgba(0, 0, 0, 0.12);
      }
      .step:first-child:before {
        display: none;
      }
      .step-dot {
        position: relative;
        z-index: 1;
        width: 28px;
        height: 28px;
        border-radius: 50%;
        margin: 0 auto 7px;
        background: rgba(255, 255, 255, 0.78);
        border: 1px solid rgba(0, 0, 0, 0.14);
        display: grid;
        place-items: center;
        color: #8c8c8c;
      }
      .step-dot svg {
        width: 14px;
        height: 14px;
        stroke: currentColor;
        fill: none;
        stroke-width: 1.9;
        stroke-linecap: round;
        stroke-linejoin: round;
      }
      .step.done .step-dot {
        background: #111;
        color: #fff;
        border-color: #111;
      }
      .step.done:before {
        background: #111;
      }
      .step.current .step-dot {
        box-shadow: 0 0 0 5px rgba(0, 0, 0, 0.08);
        border-color: #111;
        color: #111;
        background: #fff;
      }
      .step b {
        display: block;
        font-size: 9px;
        white-space: nowrap;
      }
      .step small {
        display: block;
        margin-top: 4px;
        font-size: 8px;
        color: #666;
      }
      .quick-grid {
        display: grid;
        grid-template-columns: 1fr;
        gap: 10px;
      }
      .quick-grid button {
        height: 70px;
        text-align: left;
        padding: 10px 12px;
        font-size: 9px;
        border-radius: 14px;
        border: 1px solid rgba(0, 0, 0, 0.12);
        background: rgba(255, 255, 255, 0.92);
        color: #111;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.05);
        transition: 0.18s;
      }
      .quick-grid button:hover {
        transform: translateY(-1px);
        box-shadow: 0 14px 30px rgba(0, 0, 0, 0.08);
        background: #fff;
      }
      .action-main {
        display: flex;
        align-items: center;
        gap: 12px;
        min-width: 0;
      }
      .action-ico {
        width: 38px;
        height: 38px;
        border-radius: 12px;
        display: grid;
        place-items: center;
        background: #111;
        color: #fff;
        flex: 0 0 38px;
        box-shadow: 0 10px 22px rgba(0, 0, 0, 0.12);
      }
      .action-ico svg {
        width: 18px;
        height: 18px;
        stroke: currentColor;
        fill: none;
        stroke-width: 1.9;
        stroke-linecap: round;
        stroke-linejoin: round;
      }
      .action-copy b {
        display: block;
        font-size: 11px;
        line-height: 1.25;
        margin-bottom: 3px;
      }
      .action-copy small {
        display: block;
        font-size: 8px;
        color: #666;
        line-height: 1.35;
      }
      .action-arrow {
        font-size: 17px;
        color: #111;
        opacity: 0.7;
        flex: 0 0 auto;
      }
      .notice-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 8px;
      }
      .notice {
        padding: 12px;
        border-radius: 14px;
        background: rgba(255, 255, 255, 0.7);
        border: 1px solid rgba(0, 0, 0, 0.08);
      }
      .notice b {
        display: block;
        font-size: 9px;
      }
      .notice small {
        display: block;
        margin-top: 5px;
        font-size: 8px;
        color: #666;
        line-height: 1.4;
      }
      .cards4 {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 10px;
        margin-top: 12px;
      }
      .info-card {
        padding: 16px;
      }
      .info-card .label {
        font-size: 10px;
        font-weight: 700;
        margin-bottom: 10px;
        color: #555;
        text-transform: uppercase;
        letter-spacing: 0.05em;
      }
      .info-card h4 {
        margin: 6px 0;
        font-size: 12px;
      }
      .info-card p {
        margin: 0;
        color: #666;
        font-size: 9px;
        line-height: 1.55;
      }
      .meta-row {
        display: flex;
        justify-content: space-between;
        gap: 10px;
        margin-top: 10px;
        padding-top: 10px;
        border-top: 1px solid rgba(0, 0, 0, 0.08);
        font-size: 9px;
        color: #666;
      }
      .bottom-info {
        display: grid;
        grid-template-columns: 1.25fr 0.9fr 0.9fr;
        gap: 12px;
        margin-top: 12px;
      }
      .definition-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 10px;
      }
      .definition-grid div,
      .kv div {
        padding: 12px;
        border-radius: 14px;
        background: rgba(255, 255, 255, 0.78);
        border: 1px solid rgba(0, 0, 0, 0.08);
      }
      .definition-grid span,
      .kv span {
        display: block;
        font-size: 8px;
        color: #666;
        text-transform: uppercase;
        letter-spacing: 0.05em;
      }
      .definition-grid b,
      .kv b {
        display: block;
        font-size: 11px;
        margin-top: 6px;
        line-height: 1.35;
      }
      .kv {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 10px;
      }
      .autoscout {
        margin-top: 12px;
        padding-top: 12px;
        border-top: 1px solid rgba(0, 0, 0, 0.08);
      }
      .autoscout-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 8px;
      }
      .autoscout-grid div {
        padding: 9px;
        border-radius: 12px;
        background: rgba(255, 255, 255, 0.7);
        border: 1px solid rgba(0, 0, 0, 0.08);
      }
      .autoscout-grid span {
        display: block;
        font-size: 8px;
        color: #666;
      }
      .autoscout-grid b {
        display: block;
        margin-top: 4px;
        font-size: 9px;
      }

      .toast {
        position: fixed;
        right: 22px;
        bottom: 22px;
        display: flex;
        align-items: flex-start;
        gap: 12px;
        padding: 14px 16px;
        border-radius: 18px;
        background: rgba(17, 17, 17, 0.96);
        color: #fff;
        box-shadow: 0 18px 50px rgba(0, 0, 0, 0.18);
        z-index: 999;
        max-width: 320px;
        transform: translateY(16px);
        opacity: 0;
        pointer-events: none;
        transition: 0.2s;
      }
      .toast.show {
        transform: translateY(0);
        opacity: 1;
      }
      .toast-icon {
        width: 36px;
        height: 36px;
        border-radius: 12px;
        background: rgba(255, 255, 255, 0.12);
        display: grid;
        place-items: center;
        flex: 0 0 36px;
      }
      .toast-icon svg {
        width: 18px;
        height: 18px;
        stroke: #fff;
        fill: none;
        stroke-width: 1.9;
        stroke-linecap: round;
        stroke-linejoin: round;
      }
      .toast-copy b {
        display: block;
        font-size: 12px;
        margin-bottom: 4px;
      }
      .toast-copy small {
        display: block;
        font-size: 10px;
        line-height: 1.45;
        color: rgba(255, 255, 255, 0.76);
      }

      
      .nav-item:hover {
        background: rgba(21, 94, 239, 0.05);
        color: var(--accent);
      }
      .nav-item.active {
        background: var(--accent-soft);
        color: var(--accent);
        box-shadow: inset 0 0 0 1px rgba(21, 94, 239, 0.08);
      }
      .nav-item.active .ico,
      .link,
      .delta,
      .section-note {
        color: var(--accent);
      }
      .status-dot {
        background: var(--accent);
        box-shadow: 0 0 0 4px var(--accent-soft);
      }
      .control {
        color: #111;
      }
      .icon-btn:hover,
      .control:hover,
      .btn:hover {
        border-color: var(--accent-line);
        background: #fff;
      }
      .notif {
        background: var(--accent);
        color: #fff;
        box-shadow: 0 0 0 2px #fff;
      }
      .btn {
        color: #111;
        background: rgba(255, 255, 255, 0.82);
      }
      .btn.primary {
        background: var(--accent);
        color: #fff;
        border-color: var(--accent);
        font-weight: 700;
      }
      .btn.primary:hover {
        background: var(--accent-strong);
        border-color: var(--accent-strong);
      }
      .btn.accent-outline {
        color: var(--accent);
        border-color: var(--accent);
        background: #fff;
        font-weight: 700;
      }
      .iconbox {
        background: var(--accent-soft);
        border-color: var(--accent-line);
        color: var(--accent);
      }
      .progress i,
      .service-bar i {
        background: var(--accent);
      }
      .ring {
        background: conic-gradient(
          var(--accent) var(--p),
          rgba(21, 94, 239, 0.1) 0
        );
      }
      .ring b {
        color: var(--accent);
      }
      .pill.s1 {
        background: var(--accent-soft);
        color: var(--accent);
        border-color: var(--accent-line);
      }
      .pill.s2 {
        background: rgba(21, 94, 239, 0.06);
        color: #174ea6;
        border-color: rgba(21, 94, 239, 0.12);
      }
      .pill.s3 {
        background: rgba(21, 94, 239, 0.04);
        color: #315a9b;
        border-color: rgba(21, 94, 239, 0.1);
      }
      .picon.on,
      .step.done .step-dot {
        background: var(--accent);
        border-color: var(--accent);
        color: #fff;
      }
      .step.done:before {
        background: var(--accent);
      }
      .sync-dot {
        background: var(--accent);
        box-shadow: 0 0 0 4px var(--accent-soft);
      }
      .action-ico {
        background: var(--accent);
        box-shadow: 0 10px 22px rgba(21, 94, 239, 0.18);
      }
      .tab.active,
      .vehicle-tabs button.active {
        color: var(--accent);
        border-bottom-color: var(--accent);
      }
      .vehicle-values b {
        color: #111;
      }
      .stock-main,
      .stock-side .panel,
      .timeline-panel,
      .info-card {
        background: rgba(255, 255, 255, 0.74);
      }
      .table-wrap {
        background: rgba(255, 255, 255, 0.82);
        border-color: rgba(21, 94, 239, 0.1);
      }
      .stock-table th {
        background: rgba(21, 94, 239, 0.04);
      }
      .stock-table tbody tr:hover {
        background: rgba(21, 94, 239, 0.04);
      }
      .shortcuts button:hover,
      .sync-box .btn:hover,
      .page-n:hover {
        border-color: var(--accent-line);
      }
      .page-n.active {
        background: var(--accent);
        border-color: var(--accent);
        color: #fff;
      }
      .vehicle-hero {
        background: linear-gradient(
          180deg,
          rgba(255, 255, 255, 0.82),
          rgba(255, 255, 255, 0.72)
        );
      }
      .hero-car {
        box-shadow: 0 18px 40px rgba(21, 94, 239, 0.08);
      }
      .vmet {
        border-color: rgba(21, 94, 239, 0.12);
        background: rgba(255, 255, 255, 0.82);
      }
      .info-card,
      .timeline-panel,
      .bottom-info .panel,
      .vehicle-layout aside .panel {
        border: 1px solid rgba(255, 255, 255, 0.7);
      }
      .notice {
        background: rgba(255, 255, 255, 0.82);
      }

      .top-popover-wrap {
        position: relative;
      }
      .top-popover {
        position: absolute;
        right: 0;
        top: 54px;
        width: 310px;
        padding: 12px;
        border-radius: 18px;
        background: rgba(255, 255, 255, 0.98);
        border: 1px solid var(--line);
        box-shadow: 0 20px 60px rgba(0, 0, 0, 0.14);
        backdrop-filter: blur(24px);
        z-index: 80;
      }
      .popover-title {
        display: flex;
        flex-direction: column;
        gap: 3px;
        padding: 4px 4px 10px;
        border-bottom: 1px solid var(--line);
      }
      .popover-title b {
        font-size: 12px;
      }
      .popover-title small {
        font-size: 9px;
        color: var(--muted);
      }
      .top-popover label {
        display: block;
        font-size: 9px;
        color: var(--muted);
        margin-top: 10px;
      }
      .top-popover select {
        width: 100%;
        height: 38px;
        margin-top: 5px;
        padding: 0 10px;
        border: 1px solid var(--line);
        border-radius: 11px;
        background: #fff;
        color: #111;
        outline: 0;
      }
      .notifications-popover {
        width: 370px;
      }
      .notification-item {
        width: 100%;
        display: grid;
        grid-template-columns: 10px 1fr auto;
        align-items: center;
        gap: 10px;
        text-align: left;
        padding: 11px 6px;
        border: 0;
        border-bottom: 1px solid rgba(0, 0, 0, 0.05);
        background: transparent;
        color: #111;
      }
      .notification-item:hover {
        background: var(--accent-soft);
        border-radius: 12px;
      }
      .notification-item b {
        display: block;
        font-size: 10px;
      }
      .notification-item small {
        display: block;
        margin-top: 3px;
        font-size: 9px;
        color: var(--muted);
      }
      .notification-item em {
        font-style: normal;
        font-size: 9px;
        font-weight: 700;
        color: var(--accent);
        background: var(--accent-soft);
        padding: 4px 7px;
        border-radius: 999px;
      }
      .notification-dot {
        width: 8px;
        height: 8px;
        border-radius: 50%;
        background: var(--accent);
      }
      .notification-dot.danger {
        background: var(--danger);
      }

      .dashboard-intro {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        padding: 0 2px 16px;
      }
      .dashboard-intro-copy {
        display: flex;
        align-items: baseline;
        gap: 10px;
        flex-wrap: wrap;
      }
      .dashboard-intro .eyebrow {
        width: 100%;
        font-size: 9px;
        color: var(--muted);
        text-transform: uppercase;
        letter-spacing: 0.09em;
      }
      .dashboard-intro strong {
        font-size: 14px;
      }
      .dashboard-intro-copy > span:last-child {
        font-size: 11px;
        color: var(--muted);
      }
      .dashboard-intro-badge {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        padding: 8px 11px;
        border-radius: 999px;
        background: var(--accent-soft);
        color: var(--accent);
        font-size: 10px;
        font-weight: 700;
        white-space: nowrap;
      }

      .kpi-link {
        text-align: left;
        color: #111;
        cursor: pointer;
        border: 1px solid rgba(255, 255, 255, 0.7);
      }
      .kpi-link:hover {
        transform: translateY(-1px);
        border-color: var(--accent-line);
        box-shadow:
          0 18px 48px rgba(21, 94, 239, 0.09),
          inset 0 1px 0 rgba(255, 255, 255, 0.95);
      }
      .fin-link {
        border: 0;
        background: transparent;
        text-align: left;
        color: #111;
        cursor: pointer;
      }
      .fin-link:hover {
        background: var(--accent-soft);
      }
      .muted-delta {
        color: #666;
      }

      .dashboard-summary-grid {
        display: grid;
        grid-template-columns: 0.95fr 1.45fr;
        gap: 12px;
        margin-top: 12px;
      }
      .crm-panel {
        min-width: 0;
      }
      .crm-stats {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 12px;
        margin: 0 0 14px;
      }
      .crm-stat {
        padding: 18px 16px;
        border: 1px solid rgba(0, 0, 0, 0.06);
        background: rgba(255, 255, 255, 0.78);
        border-radius: 18px;
        text-align: left;
        color: #111;
        cursor: pointer;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
      }
      .crm-stat:hover {
        background: #fff;
        border-color: var(--accent-line);
      }
      .crm-stat.primary-stat {
        background: rgba(21, 94, 239, 0.1);
        border-color: rgba(21, 94, 239, 0.1);
      }
      .crm-stat.danger-stat {
        background: rgba(217, 45, 32, 0.04);
        border-color: rgba(217, 45, 32, 0.08);
      }
      .crm-stat b {
        display: block;
        font-size: 22px;
        line-height: 1;
        margin-bottom: 8px;
      }
      .crm-stat span {
        display: block;
        font-size: 9px;
        color: var(--muted);
        line-height: 1.4;
      }
      .crm-stat.danger-stat b {
        color: var(--danger);
      }
      .link-button {
        border: 0;
        background: transparent;
        padding: 0;
        cursor: pointer;
      }
      .link-button:hover {
        text-decoration: underline;
      }

      .operations-grid {
        display: grid;
        grid-template-columns: 1.55fr 1fr;
        gap: 12px;
        margin-top: 12px;
      }
      .task-tabs {
        display: flex;
        gap: 8px;
        flex-wrap: wrap;
        margin-bottom: 12px;
      }
      .task-tab {
        border: 1px solid var(--line);
        background: rgba(255, 255, 255, 0.72);
        color: #555;
        border-radius: 12px;
        padding: 9px 12px;
        font-size: 10px;
        display: inline-flex;
        align-items: center;
        gap: 8px;
      }
      .task-tab b {
        min-width: 20px;
        height: 20px;
        padding: 0 6px;
        border-radius: 999px;
        display: grid;
        place-items: center;
        background: rgba(0, 0, 0, 0.05);
        font-size: 9px;
      }
      .task-tab.active {
        border-color: var(--accent-line);
        background: var(--accent-soft);
        color: var(--accent);
        font-weight: 700;
      }
      .task-tab.danger {
        color: var(--danger);
      }
      .task-tab.danger.active {
        border-color: rgba(217, 45, 32, 0.18);
        background: var(--danger-soft);
        color: var(--danger);
      }
      .task-tab-content {
        display: none;
      }
      .task-tab-content.active {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 8px;
      }
      .task-line {
        display: grid;
        grid-template-columns: 8px 1fr auto 16px;
        align-items: center;
        gap: 10px;
        min-height: 62px;
        text-align: left;
        border: 1px solid rgba(0, 0, 0, 0.07);
        border-radius: 14px;
        background: rgba(255, 255, 255, 0.62);
        color: #111;
        padding: 9px 10px;
      }
      .task-line:hover {
        border-color: var(--accent-line);
        background: #fff;
      }
      .task-line b {
        display: block;
        font-size: 10px;
      }
      .task-line small {
        display: block;
        margin-top: 4px;
        color: var(--muted);
        font-size: 8px;
      }
      .task-line time {
        font-size: 9px;
        color: var(--muted);
      }
      .task-arrow {
        font-size: 16px;
        color: var(--accent);
      }
      .task-priority {
        width: 7px;
        height: 7px;
        border-radius: 50%;
        background: var(--accent);
      }
      .task-priority.danger {
        background: var(--danger);
      }
      .task-priority.done {
        background: #17a673;
      }

      .agenda-panel {
        padding: 22px 20px;
      }
      .agenda-header {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 16px;
        margin-bottom: 10px;
      }
      .agenda-title h3 {
        margin: 0;
        font-size: 18px;
        letter-spacing: -0.02em;
      }
      .agenda-date {
        display: block;
        margin-top: 10px;
        font-size: 12px;
        color: var(--muted);
      }
      .agenda-launch {
        width: 48px;
        height: 48px;
        border-radius: 16px;
        border: 1px solid rgba(0, 0, 0, 0.1);
        background: rgba(255, 255, 255, 0.82);
        display: grid;
        place-items: center;
        color: #111;
        flex: 0 0 48px;
      }
      .agenda-launch:hover {
        border-color: var(--accent-line);
        background: #fff;
      }
      .agenda-launch span {
        font-size: 20px;
        line-height: 1;
      }
      .agenda-timeline {
        position: relative;
        padding-top: 4px;
      }
      .agenda-timeline:before {
        content: "";
        position: absolute;
        left: 96px;
        top: 8px;
        bottom: 10px;
        width: 2px;
        background: rgba(0, 0, 0, 0.1);
      }
      .agenda-item {
        width: 100%;
        display: grid;
        grid-template-columns: 72px 18px 1fr auto;
        align-items: center;
        gap: 16px;
        text-align: left;
        border: 0;
        background: transparent;
        color: #111;
        padding: 14px 0;
        position: relative;
      }
      .agenda-item:hover {
        background: var(--accent-soft);
        border-radius: 16px;
        padding-left: 8px;
        padding-right: 8px;
      }
      .agenda-item time {
        font-size: 16px;
        font-weight: 700;
        color: #383838;
        letter-spacing: -0.02em;
      }
      .agenda-marker {
        width: 18px;
        height: 18px;
        border-radius: 999px;
        border: 2px solid rgba(0, 0, 0, 0.22);
        background: #fff;
        position: relative;
        z-index: 1;
        box-shadow: 0 0 0 6px rgba(0, 0, 0, 0.03);
      }
      .agenda-item.current .agenda-marker:after {
        content: "";
        position: absolute;
        inset: 4px;
        border-radius: 999px;
        background: #111;
      }
      .agenda-body b {
        display: block;
        font-size: 12px;
        line-height: 1.25;
      }
      .agenda-body span {
        display: block;
        margin-top: 8px;
        font-size: 10px;
        color: var(--muted);
        line-height: 1.45;
      }
      .agenda-item .pill {
        margin-left: 0;
        justify-self: end;
        font-size: 10px;
        padding: 10px 14px;
        background: rgba(0, 0, 0, 0.04);
        border-color: rgba(0, 0, 0, 0.08);
        color: #444;
      }
      .agenda-item .pill.s1 {
        background: rgba(0, 0, 0, 0.04);
        color: #444;
        border-color: rgba(0, 0, 0, 0.08);
      }

      .recent-activity {
        margin-top: 12px;
      }
      .activity-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 8px;
      }
      .activity-item {
        display: flex;
        align-items: center;
        gap: 10px;
        text-align: left;
        border: 1px solid rgba(0, 0, 0, 0.06);
        border-radius: 14px;
        background: rgba(255, 255, 255, 0.58);
        padding: 10px;
        color: #111;
      }
      .activity-item:hover {
        background: #fff;
        border-color: var(--accent-line);
      }
      .activity-icon {
        width: 32px;
        height: 32px;
        display: grid;
        place-items: center;
        flex: 0 0 32px;
        border-radius: 10px;
        background: var(--accent-soft);
        color: var(--accent);
      }
      .activity-item b {
        display: block;
        font-size: 9px;
      }
      .activity-item small {
        display: block;
        margin-top: 4px;
        font-size: 8px;
        color: var(--muted);
      }
      .section-note {
        font-size: 11px;
        font-weight: 400;
      }

      @media (max-width: 1440px) {
        .kpis {
          grid-template-columns: repeat(3, minmax(0, 1fr));
        }
        .stock-kpis {
          grid-template-columns: repeat(4, minmax(0, 1fr));
        }
        .finance-strip,
        .dashboard-grid,
        .board-row,
        .bottom-info,
        .vehicle-cards {
          grid-template-columns: 1fr;
        }
        .cards4,
        .notice-grid {
          grid-template-columns: repeat(2, 1fr);
        }
        .stock-layout {
          grid-template-columns: 1fr;
        }
        .filterbar {
          grid-template-columns: repeat(3, minmax(0, 1fr));
        }
        .vehicle-metrics {
          grid-template-columns: repeat(3, 1fr);
          gap: 12px;
        }
        .vmet {
          border-right: 0;
          padding: 0;
        }
        .vehicle-ident {
          grid-template-columns: 1fr;
        }
        .ident,
        .ident:last-child,
        .ident:nth-child(2) {
          padding: 0;
          border-right: 0;
        }
      }
      @media (max-width: 1080px) {
        .vehicle-hero,
        .vehicle-layout {
          grid-template-columns: 1fr;
        }
        .sidebar {
          position: static;
          width: 100%;
          height: auto;
        }
        .shell {
          margin-left: 0;
        }
        .topbar {
          position: static;
          height: auto;
          flex-direction: column;
          align-items: flex-start;
          padding: 18px;
          gap: 12px;
        }
        .search {
          width: 100%;
        }
        .page {
          padding: 18px;
        }
        .kpis,
        .stock-kpis,
        .cards4,
        .notice-grid,
        .objective-wrap,
        .bottom-info,
        .vehicle-cards {
          grid-template-columns: 1fr;
        }
        .crm-stats {
          grid-template-columns: 1fr;
        }
        .board-row,
        .dashboard-grid,
        .stock-layout,
        .vehicle-layout {
          grid-template-columns: 1fr;
        }
        .vehicle-metrics {
          grid-template-columns: 1fr;
        }
        .filterbar {
          grid-template-columns: 1fr 1fr;
        }
        .hero-actions {
          flex-wrap: wrap;
        }
        .agenda-timeline:before {
          left: 92px;
        }
      }
      @media (max-width: 700px) {
        .filterbar {
          grid-template-columns: 1fr;
        }
        .tabs,
        .vehicle-tabs {
          gap: 14px;
        }
        .search {
          width: 100%;
        }
        .top-actions {
          width: 100%;
          flex-wrap: wrap;
        }
        .page-head {
          flex-direction: column;
        }
        .actions {
          width: 100%;
        }
        .actions .btn {
          width: 100%;
          justify-content: center;
        }
        .agenda-item {
          grid-template-columns: 62px 16px 1fr;
          align-items: flex-start;
        }
        .agenda-item .pill {
          grid-column: 3;
          justify-self: start;
          margin-top: 8px;
        }
        .agenda-timeline:before {
          left: 85px;
        }
      }

      @media (max-width: 1440px) {
        .dashboard-summary-grid,
        .operations-grid {
          grid-template-columns: 1fr;
        }
        .activity-grid {
          grid-template-columns: repeat(2, 1fr);
        }
        .crm-stats {
          grid-template-columns: repeat(2, 1fr);
        }
      }
      @media (max-width: 1080px) {
        .dashboard-intro {
          align-items: flex-start;
          flex-direction: column;
        }
        .task-tab-content.active,
        .activity-grid {
          grid-template-columns: 1fr;
        }
        .top-popover {
          left: 0;
          right: auto;
        }
      }
      @media (max-width: 700px) {
        .top-popover {
          position: fixed;
          left: 12px;
          right: 12px;
          top: 110px;
          width: auto;
        }
        .notifications-popover {
          width: auto;
        }
      }

      /* ===== Ajustements réunion 20/08 · Parc & fiche véhicule ===== */
      .stock-layout .stock-main {
        width: 100%;
      }
      .stock-photo-cell {
        width: 138px;
      }
      .progress-na {
        color: #999;
        font-size: 10px;
      }
      .sale-only {
        background: rgba(21, 94, 239, 0.04) !important;
        border-color: rgba(21, 94, 239, 0.1) !important;
      }
      .sale-only span:after {
        content: " · après vente";
        text-transform: none;
        letter-spacing: 0;
        color: var(--accent);
        font-size: 7px;
      }
      .attention-list {
        display: grid;
        gap: 8px;
      }
      .attention-item {
        display: flex;
        align-items: flex-start;
        gap: 10px;
        padding: 11px 12px;
        border-radius: 14px;
        border: 1px solid rgba(21, 94, 239, 0.1);
        background: rgba(21, 94, 239, 0.045);
      }
      .attention-item .attention-dot {
        width: 9px;
        height: 9px;
        border-radius: 50%;
        background: var(--accent);
        margin-top: 4px;
        flex: 0 0 9px;
      }
      .attention-item b {
        display: block;
        font-size: 10px;
      }
      .attention-item small {
        display: block;
        margin-top: 4px;
        color: var(--muted);
        font-size: 8px;
        line-height: 1.45;
      }
      @media (max-width: 1440px) {
        .filterbar {
          grid-template-columns: repeat(5, minmax(0, 1fr)) minmax(150px, auto);
        }
      }
      @media (max-width: 1080px) {
        .advanced-filter-grid {
          grid-template-columns: repeat(2, minmax(0, 1fr));
        }
        .filterbar {
          grid-template-columns: repeat(2, minmax(0, 1fr));
        }
      }
      @media (max-width: 700px) {
        .advanced-filter-grid {
          grid-template-columns: 1fr;
        }
        .filterbar {
          grid-template-columns: 1fr;
        }
      }

      /* ===== Refonte fiche véhicule · structure des onglets & responsive ===== */
      .vehicle-tab-content {
        margin-top: 14px;
      }
      .vehicle-tab-panel {
        display: none;
      }
      .vehicle-tab-panel.active {
        display: block;
      }
      .tab-view-head {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 16px;
        margin-bottom: 14px;
      }
      .tab-view-head h2 {
        margin: 4px 0 6px;
        font-size: 28px;
        line-height: 1.1;
        letter-spacing: -0.03em;
      }
      .tab-view-head p {
        margin: 0;
        max-width: 760px;
        color: var(--muted);
        line-height: 1.55;
        font-size: 14px;
      }
      .eyebrow {
        display: inline-block;
        font-size: 11px;
        font-weight: 700;
        letter-spacing: .12em;
        text-transform: uppercase;
        color: var(--accent);
      }
      .overview-grid {
        display: grid;
        gap: 12px;
        margin-top: 12px;
      }
      .tab-grid {
        display: grid;
        gap: 12px;
        margin-top: 12px;
      }
      .tab-grid.two-col {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
      .tab-grid.three-col {
        grid-template-columns: repeat(3, minmax(0, 1fr));
      }
      .planning-layout {
        grid-template-columns: minmax(0, 1.4fr) minmax(280px, .75fr);
      }
      .docs-layout,
      .autoscout-layout {
        grid-template-columns: minmax(0, 1.35fr) minmax(280px, .75fr);
      }
      .tab-grid > .panel,
      .overview-grid > .panel,
      .metric-card,
      .photo-toolbar,
      .sync-hero {
        background: rgba(255,255,255,.82);
        border: 1px solid rgba(21,94,239,.10);
      }
      .metric-strip {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 12px;
        margin-bottom: 12px;
      }
      .metric-card {
        padding: 16px;
        border-radius: 20px;
      }
      .metric-card span {
        display: block;
        font-size: 11px;
        color: var(--muted);
        margin-bottom: 8px;
      }
      .metric-card b {
        display: block;
        font-size: 28px;
        line-height: 1;
        letter-spacing: -.03em;
      }
      .metric-card small {
        display: block;
        margin-top: 8px;
        color: var(--muted);
        font-size: 12px;
        line-height: 1.45;
      }
      .detail-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
      }
      .detail-grid.one-col {
        grid-template-columns: 1fr;
      }
      .detail-grid div,
      .kv div {
        padding: 16px;
        border-radius: 18px;
        background: rgba(255,255,255,.78);
        border: 1px solid rgba(0,0,0,.08);
      }
      .detail-grid span,
      .kv span {
        display: block;
        font-size: 11px;
        color: #666;
        text-transform: uppercase;
        letter-spacing: .08em;
      }
      .detail-grid b,
      .kv b {
        display: block;
        margin-top: 8px;
        font-size: 14px;
        line-height: 1.45;
        letter-spacing: -.01em;
        overflow-wrap: anywhere;
      }
      .helper {
        margin: 12px 0 0;
        color: var(--muted);
        font-size: 13px;
        line-height: 1.55;
      }
      .client-card {
        display: flex;
        align-items: center;
        gap: 14px;
        padding: 14px 16px;
        border-radius: 18px;
        margin-bottom: 12px;
        background: rgba(21,94,239,.05);
        border: 1px solid rgba(21,94,239,.10);
      }
      .client-avatar {
        width: 46px;
        height: 46px;
        border-radius: 14px;
        display: grid;
        place-items: center;
        background: var(--accent);
        color: #fff;
        font-weight: 700;
        flex: 0 0 46px;
      }
      .client-card h3 {
        margin: 0 0 4px;
        font-size: 18px;
      }
      .client-card p {
        margin: 0;
        font-size: 13px;
        color: var(--muted);
        line-height: 1.45;
      }
      .table-responsive {
        overflow: auto;
        border-radius: 18px;
        border: 1px solid rgba(0,0,0,.08);
        background: rgba(255,255,255,.72);
      }
      .detail-table {
        width: 100%;
        border-collapse: collapse;
        min-width: 720px;
      }
      .detail-table th,
      .detail-table td {
        padding: 14px 16px;
        text-align: left;
        vertical-align: top;
        border-bottom: 1px solid rgba(0,0,0,.06);
        font-size: 13px;
      }
      .detail-table th {
        font-size: 11px;
        text-transform: uppercase;
        letter-spacing: .08em;
        color: #666;
        background: rgba(21,94,239,.04);
      }
      .detail-table tbody tr:last-child td {
        border-bottom: 0;
      }
      .checklist-list {
        display: grid;
        gap: 10px;
      }
      .check-row,
      .doc-row,
      .missing-doc {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 14px;
        padding: 14px 16px;
        border-radius: 16px;
        border: 1px solid rgba(0,0,0,.08);
        background: rgba(255,255,255,.78);
      }
      .check-row b,
      .doc-row b,
      .missing-doc b {
        display: block;
        font-size: 14px;
        line-height: 1.35;
      }
      .check-row small,
      .doc-row small,
      .missing-doc small {
        display: block;
        margin-top: 4px;
        color: var(--muted);
        font-size: 12px;
        line-height: 1.5;
      }
      .missing-doc span:first-child {
        width: 28px;
        height: 28px;
        border-radius: 999px;
        display: grid;
        place-items: center;
        background: rgba(217,45,32,.08);
        color: var(--danger);
        font-weight: 700;
        flex: 0 0 28px;
      }
      .field-status-list {
        display: grid;
        gap: 10px;
      }
      .field-status-list > div {
        display: grid;
        grid-template-columns: 1.2fr 1fr auto;
        gap: 14px;
        align-items: center;
        padding: 14px 16px;
        border-radius: 16px;
        border: 1px solid rgba(0,0,0,.08);
        background: rgba(255,255,255,.78);
      }
      .field-status-list span {
        color: var(--muted);
        font-size: 12px;
      }
      .field-status-list b {
        font-size: 14px;
      }
      .field-status-list em {
        font-style: normal;
        font-size: 12px;
        font-weight: 700;
      }
      .field-status-list .ok { color: #157347; }
      .field-status-list .missing { color: var(--danger); }
      .sync-hero {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 14px;
        padding: 16px 18px;
        border-radius: 20px;
        margin-bottom: 12px;
      }
      .sync-hero > div:first-child {
        display: flex;
        align-items: center;
        gap: 12px;
      }
      .sync-state-dot {
        width: 12px;
        height: 12px;
        border-radius: 999px;
        background: var(--accent);
        box-shadow: 0 0 0 6px rgba(21,94,239,.10);
      }
      .sync-hero b { display:block; font-size: 15px; }
      .sync-hero small { color: var(--muted); font-size: 12px; }
      .photo-toolbar {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        padding: 16px 18px;
        border-radius: 20px;
      }
      .photo-toolbar span {
        display: block;
        margin-top: 4px;
        font-size: 13px;
        color: var(--muted);
      }
      .photo-gallery {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 12px;
        margin-top: 12px;
      }
      .photo-gallery figure {
        margin: 0;
        overflow: hidden;
        border-radius: 22px;
        border: 1px solid rgba(21,94,239,.10);
        background: rgba(255,255,255,.82);
      }
      .photo-gallery img {
        display: block;
        width: 100%;
        aspect-ratio: 4 / 3;
        object-fit: cover;
      }
      .photo-gallery figcaption {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        padding: 14px 16px;
      }
      .photo-gallery figcaption b { font-size: 14px; }
      .history-list {
        display: grid;
        gap: 10px;
      }
      .history-item {
        display: flex;
        align-items: flex-start;
        gap: 14px;
        padding: 14px 16px;
        border-radius: 18px;
        border: 1px solid rgba(0,0,0,.08);
        background: rgba(255,255,255,.78);
      }
      .history-icon {
        width: 40px;
        height: 40px;
        border-radius: 14px;
        background: rgba(21,94,239,.08);
        color: var(--accent);
        display: grid;
        place-items: center;
        flex: 0 0 40px;
      }
      .history-item b { display:block; font-size: 14px; margin-bottom: 4px; }
      .history-item p { margin: 0; font-size: 13px; line-height: 1.5; color: #222; }
      .history-item small { display:block; margin-top: 6px; color: var(--muted); font-size: 12px; line-height: 1.45; }
      .empty-inline {
        padding: 18px;
        border-radius: 18px;
        border: 1px dashed rgba(21,94,239,.24);
        background: rgba(21,94,239,.03);
      }
      .empty-inline b { display:block; font-size: 15px; margin-bottom: 6px; }
      .empty-inline span { color: var(--muted); font-size: 13px; line-height: 1.55; }
      .calendar-strip {
        display: grid;
        grid-template-columns: repeat(7, minmax(0, 1fr));
        gap: 10px;
        margin: 12px 0 16px;
      }
      .calendar-strip button {
        border: 1px solid rgba(0,0,0,.08);
        border-radius: 16px;
        background: rgba(255,255,255,.8);
        padding: 12px 8px;
        color: #111;
      }
      .calendar-strip button.active {
        border-color: var(--accent-line);
        background: var(--accent-soft);
        color: var(--accent);
      }
      .calendar-strip b { display:block; font-size: 16px; line-height: 1; }
      .calendar-strip span { display:block; margin-top: 8px; font-size: 12px; color: var(--muted); }
      .event-timeline {
        display: grid;
        gap: 10px;
      }
      .event-item {
        display: grid;
        grid-template-columns: 72px 12px minmax(0,1fr) auto;
        gap: 14px;
        align-items: center;
        padding: 14px 16px;
        border-radius: 18px;
        border: 1px solid rgba(0,0,0,.08);
        background: rgba(255,255,255,.78);
      }
      .event-item time { font-size: 13px; font-weight: 700; }
      .event-dot {
        width: 10px;
        height: 10px;
        border-radius: 999px;
        background: var(--accent);
        box-shadow: 0 0 0 4px rgba(21,94,239,.08);
      }
      .event-item b { display:block; font-size: 14px; }
      .event-item small { display:block; margin-top: 4px; font-size: 12px; color: var(--muted); }
      .compact-actions .action-copy small { font-size: 11px; }
      .compact-actions button { min-height: 62px; height: auto; }
      .vehicle-tabs {
        scrollbar-width: none;
      }
      .vehicle-tabs::-webkit-scrollbar {
        display: none;
      }
      @media (max-width: 1280px) {
        .metric-strip,
        .photo-gallery,
        .tab-grid.three-col {
          grid-template-columns: repeat(2, minmax(0, 1fr));
        }
        .tab-grid.two-col,
        .planning-layout,
        .docs-layout,
        .autoscout-layout,
        .field-status-list > div {
          grid-template-columns: 1fr;
        }
      }
      @media (max-width: 1080px) {
        .tab-view-head {
          flex-direction: column;
        }
        .tab-view-head .actions,
        .tab-view-head .btn,
        .tab-view-head > .actions {
          width: 100%;
        }
        .tab-view-head .actions {
          display: flex;
          flex-wrap: wrap;
        }
        .tab-view-head .actions .btn,
        .tab-view-head > .btn {
          width: auto;
        }
        .detail-grid,
        .definition-grid,
        .kv,
        .metric-strip,
        .photo-gallery,
        .tab-grid.three-col {
          grid-template-columns: 1fr;
        }
        .event-item {
          grid-template-columns: 64px 10px minmax(0,1fr);
          align-items: flex-start;
        }
        .event-item .pill {
          grid-column: 3;
          justify-self: start;
          margin-top: 8px;
        }
        .calendar-strip {
          grid-template-columns: repeat(4, minmax(0, 1fr));
        }
        .photo-toolbar {
          flex-direction: column;
          align-items: flex-start;
        }
        .client-card {
          align-items: flex-start;
          flex-wrap: wrap;
        }
      }
      @media (max-width: 700px) {
        .vehicle-tabs {
          padding: 0 12px;
          gap: 18px;
        }
        .vehicle-tabs button {
          font-size: 14px;
          padding: 16px 0;
        }
        .tab-view-head h2 {
          font-size: 24px;
        }
        .detail-grid div,
        .kv div,
        .metric-card,
        .check-row,
        .doc-row,
        .missing-doc,
        .event-item,
        .history-item {
          padding: 14px;
        }
        .photo-gallery {
          grid-template-columns: 1fr;
        }
        .calendar-strip {
          grid-template-columns: repeat(2, minmax(0, 1fr));
        }
        .field-status-list > div {
          grid-template-columns: 1fr;
        }
        .detail-table {
          min-width: 620px;
        }
        .sync-hero,
        .photo-toolbar {
          align-items: flex-start;
          flex-direction: column;
        }
      }

    
      /* ===== Correctifs chevauchement onglets / sections ===== */
      .vehicle-tabs {
        position: relative;
        z-index: 3;
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
        gap: 24px;
        padding: 0 18px;
        margin-top: 12px;
        overflow-x: auto;
        overflow-y: hidden;
        white-space: nowrap;
        min-height: 58px;
      }
      .vehicle-tabs button {
        flex: 0 0 auto;
        position: relative;
        z-index: 1;
      }
      .vehicle-tab-content {
        position: relative;
        z-index: 1;
        margin-top: 18px;
        min-width: 0;
      }
      .vehicle-tab-panel {
        position: relative;
        min-width: 0;
      }
      .vehicle-tab-panel > * + * {
        margin-top: 12px;
      }
      .vehicle-layout,
      .overview-grid,
      .tab-grid,
      .metric-strip,
      .detail-grid,
      .definition-grid,
      .kv,
      .photo-gallery,
      .field-status-list,
      .history-list,
      .checklist-list,
      .event-timeline {
        align-items: start;
        min-width: 0;
      }
      .vehicle-layout > *,
      .overview-grid > *,
      .tab-grid > *,
      .detail-grid > *,
      .definition-grid > *,
      .kv > * {
        min-width: 0;
      }
      .glass.panel,
      .timeline-panel,
      .metric-card,
      .photo-toolbar,
      .sync-hero,
      .history-item,
      .check-row,
      .doc-row,
      .missing-doc,
      .event-item,
      .field-status-list > div {
        overflow: hidden;
      }
      .section-title {
        gap: 10px;
        align-items: flex-start;
        flex-wrap: wrap;
      }
      .section-title h3,
      .tab-view-head h2,
      .client-card h3,
      .detail-grid b,
      .definition-grid b,
      .kv b,
      .event-item b,
      .history-item b,
      .field-status-list b,
      .check-row b,
      .doc-row b,
      .missing-doc b {
        overflow-wrap: anywhere;
        word-break: break-word;
      }
      .client-card .pill,
      .event-item .pill,
      .sync-hero .pill,
      .field-status-list em {
        flex: 0 0 auto;
      }
      @media (max-width: 1080px) {
        .vehicle-tabs {
          gap: 20px;
          padding: 0 14px;
        }
        .planning-layout,
        .docs-layout,
        .autoscout-layout,
        .tab-grid.two-col,
        .tab-grid.three-col {
          grid-template-columns: 1fr !important;
        }
        .vehicle-layout {
          grid-template-columns: 1fr !important;
        }
        .overview-grid,
        .metric-strip,
        .photo-gallery,
        .detail-grid,
        .definition-grid,
        .kv {
          grid-template-columns: 1fr !important;
        }
      }
      @media (max-width: 700px) {
        .vehicle-tabs {
          min-height: 52px;
          gap: 16px;
          padding: 0 12px;
          margin-top: 10px;
        }
        .vehicle-tab-content {
          margin-top: 14px;
        }
        .section-title {
          flex-direction: column;
          align-items: flex-start;
        }
        .client-card {
          gap: 12px;
        }
      }

    
      /* ===== Car-Pass · réunion 20/08/2026 ===== */
      .carpass-card {
        grid-column: 1 / -1;
        padding: 20px;
        border-color: rgba(21,94,239,.14) !important;
        background: linear-gradient(135deg, rgba(21,94,239,.055), rgba(255,255,255,.88)) !important;
      }
      .carpass-head {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 16px;
        margin-bottom: 16px;
      }
      .carpass-title {
        display: flex;
        align-items: flex-start;
        gap: 12px;
        min-width: 0;
      }
      .carpass-mark {
        width: 42px;
        height: 42px;
        border-radius: 14px;
        display: grid;
        place-items: center;
        flex: 0 0 42px;
        background: var(--accent);
        color: #fff;
        font-size: 12px;
        font-weight: 800;
        letter-spacing: -.03em;
        box-shadow: 0 10px 24px rgba(21,94,239,.18);
      }
      .carpass-title h3 {
        margin: 0;
        font-size: 17px;
        line-height: 1.25;
      }
      .carpass-title p {
        margin: 5px 0 0;
        max-width: 760px;
        color: var(--muted);
        font-size: 12px;
        line-height: 1.55;
      }
      .carpass-status-grid {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 10px;
      }
      .carpass-status-grid > div {
        padding: 14px;
        border-radius: 16px;
        background: rgba(255,255,255,.82);
        border: 1px solid rgba(0,0,0,.07);
        min-width: 0;
      }
      .carpass-status-grid span {
        display: block;
        color: var(--muted);
        font-size: 9px;
        text-transform: uppercase;
        letter-spacing: .07em;
      }
      .carpass-status-grid b {
        display: block;
        margin-top: 7px;
        font-size: 12px;
        line-height: 1.4;
        overflow-wrap: anywhere;
      }
      .carpass-footer {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 14px;
        margin-top: 14px;
        padding-top: 14px;
        border-top: 1px solid rgba(0,0,0,.07);
      }
      .carpass-note {
        max-width: 760px;
        color: var(--muted);
        font-size: 10px;
        line-height: 1.55;
      }
      .carpass-order-card {
        margin-top: 12px;
        padding: 20px;
      }
      .carpass-order-top {
        display: grid;
        grid-template-columns: minmax(0,1fr) auto;
        gap: 16px;
        align-items: start;
      }
      .carpass-order-summary {
        display: grid;
        grid-template-columns: repeat(3,minmax(0,1fr));
        gap: 10px;
        margin-top: 14px;
      }
      .carpass-order-summary > div {
        padding: 14px;
        border-radius: 16px;
        background: rgba(255,255,255,.80);
        border: 1px solid rgba(0,0,0,.07);
      }
      .carpass-order-summary span {
        display: block;
        color: var(--muted);
        font-size: 9px;
        text-transform: uppercase;
        letter-spacing: .07em;
      }
      .carpass-order-summary b {
        display: block;
        margin-top: 7px;
        font-size: 13px;
        line-height: 1.35;
      }
      .inspection-head {
        display: flex;
        justify-content: space-between;
        align-items: flex-end;
        gap: 12px;
        flex-wrap: wrap;
        margin: 18px 0 10px;
        padding-top: 16px;
        border-top: 1px solid rgba(0,0,0,.07);
      }
      .inspection-head h4 {
        margin: 0;
        font-size: 14px;
      }
      .inspection-head p {
        margin: 4px 0 0;
        color: var(--muted);
        font-size: 10px;
      }
      .inspection-bulk {
        display: flex;
        gap: 7px;
        flex-wrap: wrap;
      }
      .inspection-bulk .btn {
        height: 34px;
        padding: 0 11px;
        font-size: 9px;
      }
      .inspection-list {
        display: grid;
        grid-template-columns: repeat(2,minmax(0,1fr));
        gap: 8px;
      }
      .inspection-row {
        display: grid;
        grid-template-columns: minmax(0,1fr) auto;
        align-items: center;
        gap: 10px;
        min-width: 0;
        padding: 11px 12px;
        border-radius: 14px;
        background: rgba(255,255,255,.82);
        border: 1px solid rgba(0,0,0,.07);
      }
      .inspection-row b {
        display: block;
        font-size: 11px;
        overflow-wrap: anywhere;
      }
      .inspection-row small {
        display: block;
        margin-top: 3px;
        color: var(--muted);
        font-size: 8px;
      }
      .inspection-state {
        min-width: 78px;
        padding: 7px 9px;
        border-radius: 999px;
        border: 1px solid rgba(0,0,0,.08);
        background: rgba(0,0,0,.04);
        text-align: center;
        font-size: 9px;
        font-weight: 700;
        white-space: nowrap;
      }
      .inspection-state.good { color: #157347; background: rgba(21,115,71,.08); border-color: rgba(21,115,71,.14); }
      .inspection-state.worn { color: #8A5A00; background: rgba(245,158,11,.10); border-color: rgba(245,158,11,.18); }
      .inspection-state.repair { color: var(--danger); background: var(--danger-soft); border-color: rgba(217,45,32,.16); }
      .carpass-rule-note {
        margin-top: 10px;
        padding: 10px 12px;
        border-radius: 13px;
        background: rgba(21,94,239,.045);
        color: #456;
        font-size: 9px;
        line-height: 1.5;
      }
      @media (max-width: 1080px) {
        .carpass-status-grid,
        .carpass-order-summary,
        .inspection-list {
          grid-template-columns: repeat(2,minmax(0,1fr));
        }
        .carpass-order-top {
          grid-template-columns: 1fr;
        }
      }
      @media (max-width: 700px) {
        .carpass-card,
        .carpass-order-card { padding: 16px; }
        .carpass-head,
        .carpass-footer {
          flex-direction: column;
          align-items: stretch;
        }
        .carpass-status-grid,
        .carpass-order-summary,
        .inspection-list {
          grid-template-columns: 1fr;
        }
        .carpass-footer .btn,
        .carpass-order-top .actions,
        .carpass-order-top .actions .btn {
          width: 100%;
          justify-content: center;
        }
        .inspection-row {
          grid-template-columns: minmax(0,1fr) auto;
        }
      }


      /* ===== Préparation · correction de structure 20/08/2026 ===== */
      .prep-summary {
        display: grid;
        grid-template-columns: minmax(150px, auto) minmax(220px, 1fr) auto;
        align-items: center;
        gap: 18px;
        min-width: 0;
      }
      .prep-summary > div:first-child {
        min-width: 0;
      }
      .prep-summary > div:first-child b {
        display: block;
        font-size: 18px;
        line-height: 1.15;
        letter-spacing: -.02em;
      }
      .prep-summary > div:first-child span {
        display: block;
        margin-top: 5px;
        color: var(--muted);
        font-size: 11px;
        line-height: 1.4;
      }
      .prep-summary .progress {
        width: 100%;
        min-width: 0;
        height: 8px;
        margin: 0;
        background: rgba(21,94,239,.10);
      }
      .prep-summary .pill {
        justify-self: end;
      }

      .checklist-grid {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 12px;
        margin-top: 12px;
        align-items: stretch;
      }
      .checklist-card {
        min-width: 0;
        min-height: 172px;
        padding: 18px;
        display: flex;
        flex-direction: column;
        border: 1px solid rgba(0,0,0,.07);
        background: rgba(255,255,255,.82);
        overflow: hidden;
      }
      .checklist-card.done {
        background: rgba(255,255,255,.78);
      }
      .checklist-card.current {
        border-color: var(--accent-line);
        background: linear-gradient(145deg, rgba(21,94,239,.075), rgba(255,255,255,.90));
        box-shadow: 0 14px 34px rgba(21,94,239,.08), inset 0 1px 0 rgba(255,255,255,.95);
      }
      .check-top {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        min-width: 0;
        margin-bottom: 20px;
      }
      .check-icon {
        width: 34px;
        height: 34px;
        flex: 0 0 34px;
        display: grid;
        place-items: center;
        border-radius: 999px;
        border: 1px solid rgba(0,0,0,.10);
        background: rgba(255,255,255,.9);
        color: #555;
        font-size: 12px;
        font-weight: 800;
      }
      .checklist-card.done .check-icon {
        background: var(--accent);
        border-color: var(--accent);
        color: #fff;
      }
      .checklist-card.current .check-icon {
        background: var(--accent-soft);
        border-color: var(--accent-line);
        color: var(--accent);
      }
      .checklist-card h3 {
        margin: 0;
        font-size: 17px;
        line-height: 1.25;
        letter-spacing: -.02em;
        overflow-wrap: anywhere;
      }
      .checklist-card p {
        margin: 9px 0 16px;
        color: var(--muted);
        font-size: 12px;
        line-height: 1.55;
        overflow-wrap: anywhere;
      }
      .checklist-card > small {
        display: block;
        margin-top: auto;
        padding-top: 12px;
        border-top: 1px solid rgba(0,0,0,.06);
        color: var(--muted);
        font-size: 10px;
        line-height: 1.45;
      }

      @media (max-width: 1280px) {
        .checklist-grid {
          grid-template-columns: repeat(2, minmax(0, 1fr));
        }
      }
      @media (max-width: 900px) {
        .prep-summary {
          grid-template-columns: 1fr auto;
          gap: 12px;
        }
        .prep-summary .progress {
          grid-column: 1 / -1;
          grid-row: 2;
        }
        .prep-summary .pill {
          grid-column: 2;
          grid-row: 1;
        }
      }
      @media (max-width: 700px) {
        .prep-summary {
          grid-template-columns: 1fr;
        }
        .prep-summary .progress,
        .prep-summary .pill {
          grid-column: 1;
          grid-row: auto;
          justify-self: start;
        }
        .prep-summary .pill {
          margin-top: 2px;
        }
        .checklist-grid {
          grid-template-columns: 1fr;
          gap: 10px;
        }
        .checklist-card {
          min-height: 0;
          padding: 16px;
        }
        .check-top {
          margin-bottom: 14px;
        }
      }

      /* Fiche véhicule · densité et hiérarchie */
      #view-vehicle .vehicle-hero {
        padding: 16px;
        gap: 14px;
        grid-template-columns: 310px minmax(0, 1fr);
      }
      #view-vehicle .hero-actions {
        grid-column: 2;
        justify-self: end;
        margin-top: 2px;
      }
      #view-vehicle .vehicle-metrics {
        width: 100%;
        grid-template-columns: repeat(7, minmax(105px, 1fr));
        gap: 12px;
      }
      #view-vehicle .hero-car {
        height: 180px;
      }
      #view-vehicle .vehicle-title-line h2 {
        font-size: 26px;
      }
      #view-vehicle .vehicle-ident {
        margin: 10px 0 14px;
      }
      #view-vehicle .vmet {
        padding: 10px;
      }
      #view-vehicle .vehicle-tabs {
        margin-top: 10px;
        min-height: 52px;
      }
      #view-vehicle .vehicle-tabs button {
        padding: 11px 0;
        font-weight: 600;
      }
      #view-vehicle .glass.panel,
      #view-vehicle .timeline-panel {
        padding: 15px;
      }
      #view-vehicle .section-title {
        margin-bottom: 10px;
      }
      #view-vehicle .section-title h3 {
        font-size: 16px;
        letter-spacing: -0.02em;
      }
      #view-vehicle .definition-grid div,
      #view-vehicle .kv div {
        padding: 12px;
      }
      #view-vehicle .definition-grid span,
      #view-vehicle .kv span {
        font-size: 10px;
      }
      #view-vehicle .definition-grid b,
      #view-vehicle .kv b {
        font-size: 13px;
      }
      #view-vehicle .quick-grid {
        gap: 7px;
      }
      #view-vehicle .compact-actions button {
        min-height: 56px;
        padding: 8px 10px;
      }
      #view-vehicle .action-ico {
        width: 34px;
        height: 34px;
        flex-basis: 34px;
      }
      #view-vehicle .action-copy b {
        font-size: 12px;
      }
      #view-vehicle .compact-actions .action-copy small {
        font-size: 10px;
      }
      #view-vehicle .tab-view-head > .btn {
        flex: 0 0 auto;
        white-space: nowrap;
      }
      #view-vehicle [data-vehicle-panel="planning"] .planning-layout {
        grid-template-columns: minmax(0, 2fr) minmax(320px, 1fr);
        align-items: start;
      }
      #view-vehicle [data-vehicle-panel="planning"] .section-title {
        align-items: center;
      }
      #view-vehicle [data-vehicle-panel="planning"] .section-title .actions {
        flex: 0 0 auto;
        flex-wrap: nowrap;
      }
      #view-vehicle [data-vehicle-panel="planning"] .calendar-strip {
        min-width: 0;
      }
      #view-vehicle [data-vehicle-panel="planning"] .event-item {
        min-width: 0;
      }
      #view-vehicle [data-vehicle-panel="planning"] .doc-row + .doc-row {
        margin-top: 10px;
      }
      #view-vehicle [data-vehicle-panel="docs"] .missing-doc + .missing-doc {
        margin-top: 10px;
      }
      @media (max-width: 1280px) {
        #view-vehicle [data-vehicle-panel="planning"] .planning-layout {
          grid-template-columns: 1fr;
        }
      }
      @media (max-width: 1080px) {
        #view-vehicle .hero-actions {
          grid-column: 1;
          justify-self: stretch;
        }
        #view-vehicle .vehicle-metrics {
          grid-template-columns: repeat(2, minmax(0, 1fr));
        }
      }
      @media (max-width: 700px) {
        #view-vehicle [data-vehicle-panel="planning"] .section-title {
          align-items: flex-start;
        }
        #view-vehicle [data-vehicle-panel="planning"] .section-title .actions {
          width: 100%;
          overflow-x: auto;
        }
      }