:root {
    --app-bg: #f4f7fb;
    --app-surface: #ffffff;
    --app-surface-muted: #f7f9fc;
    --app-border: #dce4ef;
    --app-border-strong: #c5d2e3;
    --app-text: #142033;
    --app-text-muted: #60708a;
    --app-primary: #1463ff;
    --app-primary-strong: #0b4ed1;
    --app-primary-soft: #eaf1ff;
    --app-success: #168a52;
    --app-success-soft: #e8f7ef;
    --app-warning: #a86200;
    --app-warning-soft: #fff4dc;
    --app-danger: #c52f43;
    --app-danger-soft: #ffedf0;
    --app-violet: #6f42d9;
    --app-violet-soft: #f1edff;
    --app-radius-sm: 10px;
    --app-radius-md: 16px;
    --app-radius-lg: 24px;
    --app-shadow-sm: 0 8px 24px rgba(28, 48, 77, 0.07);
    --app-shadow-md: 0 18px 50px rgba(28, 48, 77, 0.11);
    --app-content-width: 1280px;
}

html,
body {
    background: var(--app-bg);
    color: var(--app-text);
}

.carbuyer-content {
    width: min(100%, var(--app-content-width));
    margin: 0 auto;
    padding: 28px clamp(16px, 3vw, 42px) 56px;
}

.app-page-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    padding: 28px;
    margin-bottom: 24px;
    border: 1px solid var(--app-border);
    border-radius: var(--app-radius-lg);
    background:
        radial-gradient(circle at 100% 0%, rgba(20, 99, 255, 0.13), transparent 34%),
        var(--app-surface);
    box-shadow: var(--app-shadow-sm);
}

.app-page-header-copy {
    min-width: 0;
}

.app-page-header h1 {
    margin: 4px 0 8px;
    font-size: clamp(1.8rem, 3vw, 2.65rem);
    letter-spacing: -0.04em;
    line-height: 1.05;
}

.app-page-header p {
    max-width: 760px;
    margin: 0;
    color: var(--app-text-muted);
    font-size: 1.02rem;
}

.app-page-header-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
}

.app-eyebrow {
    color: var(--app-primary);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.app-empty-state {
    display: grid;
    justify-items: center;
    gap: 10px;
    padding: 54px 24px;
    text-align: center;
    border: 1px dashed var(--app-border-strong);
    border-radius: var(--app-radius-lg);
    background: var(--app-surface);
}

.app-empty-state-icon {
    display: grid;
    width: 54px;
    height: 54px;
    place-items: center;
    border-radius: 18px;
    background: var(--app-primary-soft);
    color: var(--app-primary);
    font-size: 1.7rem;
    font-weight: 800;
}

.app-empty-state h2,
.app-empty-state p {
    margin: 0;
}

.app-empty-state p {
    max-width: 580px;
    color: var(--app-text-muted);
}

.app-feedback {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 44px;
    padding: 11px 14px;
    margin-bottom: 16px;
    border: 1px solid var(--app-border);
    border-radius: var(--app-radius-sm);
    background: var(--app-surface-muted);
    font-weight: 650;
}

.app-feedback.is-success {
    border-color: #acd9c1;
    background: var(--app-success-soft);
    color: #0e663c;
}

.app-feedback.is-error {
    border-color: #efb7bf;
    background: var(--app-danger-soft);
    color: #922235;
}

.app-feedback.is-loading {
    border-color: #b8cdf7;
    background: var(--app-primary-soft);
    color: var(--app-primary-strong);
}

.app-feedback-spinner {
    width: 16px;
    height: 16px;
    border: 2px solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    animation: app-spin 0.75s linear infinite;
}

@keyframes app-spin {
    to { transform: rotate(360deg); }
}

.vehicle-status-badge {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 4px 10px;
    border-radius: 999px;
    background: var(--app-surface-muted);
    color: var(--app-text-muted);
    font-size: 0.76rem;
    font-weight: 800;
    white-space: nowrap;
}

.vehicle-status-badge.is-attention { background: var(--app-warning-soft); color: #875000; }
.vehicle-status-badge.is-viewing { background: var(--app-primary-soft); color: var(--app-primary-strong); }
.vehicle-status-badge.is-negotiating { background: var(--app-violet-soft); color: #5930b1; }
.vehicle-status-badge.is-purchased { background: var(--app-success-soft); color: #0f7041; }
.vehicle-status-badge.is-rejected { background: var(--app-danger-soft); color: #9c2638; }

.vehicle-workspace-nav {
    position: sticky;
    top: 76px;
    z-index: 20;
    display: flex;
    gap: 6px;
    overflow-x: auto;
    margin: 0 0 22px;
    padding: 7px;
    border: 1px solid var(--app-border);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.94);
    box-shadow: var(--app-shadow-sm);
    backdrop-filter: blur(12px);
    scrollbar-width: thin;
}

.vehicle-workspace-nav a {
    flex: 0 0 auto;
    padding: 9px 13px;
    border-radius: 9px;
    color: var(--app-text-muted);
    font-size: 0.86rem;
    font-weight: 750;
    text-decoration: none;
}

.vehicle-workspace-nav a:hover,
.vehicle-workspace-nav a:focus-visible {
    background: var(--app-surface-muted);
    color: var(--app-text);
}

.vehicle-workspace-nav a.active {
    background: var(--app-primary);
    color: #fff;
}

.app-stat-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 22px;
}

.app-stat-card {
    padding: 18px;
    border: 1px solid var(--app-border);
    border-radius: var(--app-radius-md);
    background: var(--app-surface);
    box-shadow: var(--app-shadow-sm);
}

.app-stat-card span,
.app-stat-card small {
    display: block;
    color: var(--app-text-muted);
}

.app-stat-card strong {
    display: block;
    margin: 5px 0;
    font-size: 1.8rem;
    line-height: 1;
}

.app-panel {
    border: 1px solid var(--app-border);
    border-radius: var(--app-radius-lg);
    background: var(--app-surface);
    box-shadow: var(--app-shadow-sm);
}

.app-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 20px 22px;
    border-bottom: 1px solid var(--app-border);
}

.app-panel-header h2,
.app-panel-header p {
    margin: 0;
}

.app-panel-header p {
    color: var(--app-text-muted);
    font-size: 0.9rem;
}

.app-progress {
    height: 8px;
    overflow: hidden;
    border-radius: 999px;
    background: #e7edf6;
}

.app-progress > span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--app-primary), #53a4ff);
}

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

.vehicle-card {
    display: grid;
    gap: 16px;
    min-width: 0;
    padding: 20px;
    border: 1px solid var(--app-border);
    border-radius: var(--app-radius-md);
    background: var(--app-surface);
    box-shadow: var(--app-shadow-sm);
}

.vehicle-card:hover {
    border-color: #b9c9df;
    box-shadow: var(--app-shadow-md);
}

.vehicle-card-head,
.vehicle-card-score,
.vehicle-card-actions,
.vehicle-card-progress-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.vehicle-card-title {
    min-width: 0;
}

.vehicle-card-title h2,
.vehicle-card-title p {
    margin: 0;
}

.vehicle-card-title h2 {
    overflow: hidden;
    font-size: 1.08rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.vehicle-card-title p {
    margin-top: 4px;
    color: var(--app-text-muted);
    font-size: 0.85rem;
}

.vehicle-card-score strong {
    font-size: 2rem;
    line-height: 1;
}

.vehicle-card-score small {
    color: var(--app-text-muted);
}

.vehicle-card-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.vehicle-card-metrics span {
    display: grid;
    gap: 2px;
    padding: 10px;
    border-radius: 10px;
    background: var(--app-surface-muted);
}

.vehicle-card-metrics small {
    color: var(--app-text-muted);
    font-size: 0.72rem;
}

.vehicle-card-metrics strong {
    font-size: 0.95rem;
}

.vehicle-card-actions {
    align-items: stretch;
    flex-wrap: wrap;
}

.vehicle-card-actions .btn {
    flex: 1 1 auto;
}

.vehicle-filter-bar {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) 220px auto;
    gap: 12px;
    margin-bottom: 18px;
    padding: 14px;
    border: 1px solid var(--app-border);
    border-radius: var(--app-radius-md);
    background: var(--app-surface);
}

.dashboard-action-list {
    display: grid;
}

.dashboard-action-item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 18px;
    align-items: center;
    padding: 18px 22px;
    border-bottom: 1px solid var(--app-border);
}

.dashboard-action-item:last-child {
    border-bottom: 0;
}

.dashboard-action-copy {
    display: grid;
    gap: 5px;
    min-width: 0;
}

.dashboard-action-copy strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard-action-copy span {
    color: var(--app-text-muted);
    font-size: 0.88rem;
}

@media (max-width: 900px) {
    .app-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .vehicle-card-grid { grid-template-columns: 1fr; }
    .vehicle-filter-bar { grid-template-columns: 1fr 1fr; }
    .vehicle-filter-bar .btn { grid-column: 1 / -1; }
}

@media (max-width: 640px) {
    .carbuyer-content { padding: 18px 12px 40px; }
    .app-page-header { align-items: stretch; flex-direction: column; padding: 20px; }
    .app-page-header-actions { justify-content: stretch; }
    .app-page-header-actions .btn { flex: 1 1 auto; }
    .app-stat-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
    .app-stat-card { padding: 14px; }
    .app-stat-card strong { font-size: 1.45rem; }
    .vehicle-filter-bar { grid-template-columns: 1fr; }
    .vehicle-filter-bar .btn { grid-column: auto; }
    .vehicle-card-metrics { grid-template-columns: 1fr 1fr; }
    .dashboard-action-item { grid-template-columns: 1fr; }
    .dashboard-action-item .btn { width: 100%; }
    .vehicle-workspace-nav { top: 66px; margin-inline: -4px; }
}

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

/* Phase 2.0C: durable background work */
.ai-job-card,
.ai-job-inline {
    border: 1px solid #b8cdf7;
    border-radius: var(--app-radius-md);
    background: linear-gradient(135deg, var(--app-primary-soft), #fff 72%);
    box-shadow: var(--app-shadow-sm);
}

.ai-job-card { padding: 18px; }
.ai-job-card-head,
.ai-job-meta,
.ai-job-inline {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.ai-job-card h3 { margin: 3px 0 4px; font-size: 1.08rem; }
.ai-job-card p { margin: 0; color: var(--app-text-muted); }
.ai-job-status {
    flex: 0 0 auto;
    padding: 6px 10px;
    border-radius: 999px;
    background: #fff;
    color: var(--app-primary-strong);
    font-size: .8rem;
    font-weight: 800;
}
.ai-job-progress {
    height: 8px;
    margin: 16px 0 10px;
    overflow: hidden;
    border-radius: 999px;
    background: #dce7fb;
}
.ai-job-progress span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: var(--app-primary);
    transition: width .25s ease;
}
.ai-job-meta { color: var(--app-text-muted); font-size: .84rem; }
.ai-job-inline { padding: 12px 14px; }
.ai-job-inline > div { display: grid; gap: 2px; }
.ai-job-inline span { color: var(--app-text-muted); font-size: .86rem; }

@media (max-width: 640px) {
    .ai-job-card-head,
    .ai-job-meta,
    .ai-job-inline { align-items: flex-start; flex-direction: column; }
}

/* Phase 2.0C accessibility and AI job center */
.app-skip-link {
    position: fixed;
    top: 8px;
    left: 8px;
    z-index: 10000;
    padding: 10px 14px;
    border-radius: 9px;
    background: #fff;
    color: #0b3f9f;
    font-weight: 800;
    transform: translateY(-150%);
    box-shadow: var(--app-shadow-md);
}
.app-skip-link:focus { transform: translateY(0); }

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
    outline: 3px solid #ffbf47;
    outline-offset: 3px;
}

.carbuyer-ai-jobs-link {
    position: relative;
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border: 1px solid var(--app-border);
    border-radius: 12px;
    background: var(--app-surface);
    color: var(--app-primary-strong);
    text-decoration: none;
}
.carbuyer-ai-jobs-link strong {
    position: absolute;
    top: -6px;
    right: -6px;
    display: grid;
    min-width: 20px;
    height: 20px;
    padding: 0 5px;
    place-items: center;
    border: 2px solid #fff;
    border-radius: 999px;
    background: var(--app-danger);
    color: #fff;
    font-size: .7rem;
}

.ai-jobs-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 20px;
}
.ai-jobs-summary > div {
    display: grid;
    gap: 2px;
    padding: 18px;
    border: 1px solid var(--app-border);
    border-radius: var(--app-radius-md);
    background: var(--app-surface);
}
.ai-jobs-summary strong { font-size: 1.55rem; }
.ai-jobs-summary span { color: var(--app-text-muted); }
.ai-jobs-list { display: grid; gap: 12px; }
.ai-jobs-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 16px;
    align-items: start;
    padding: 18px;
    border: 1px solid var(--app-border);
    border-radius: var(--app-radius-md);
    background: var(--app-surface);
    box-shadow: var(--app-shadow-sm);
}
.ai-jobs-row-icon {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 13px;
    background: var(--app-primary-soft);
    color: var(--app-primary-strong);
    font-weight: 850;
}
.ai-jobs-row-title,
.ai-jobs-row-meta,
.ai-jobs-row-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}
.ai-jobs-row-title > div { display: grid; gap: 2px; }
.ai-jobs-row-title span,
.ai-jobs-row-meta { color: var(--app-text-muted); font-size: .84rem; }
.ai-jobs-row-meta { justify-content: flex-start; flex-wrap: wrap; }
.ai-jobs-row-actions { align-items: stretch; flex-direction: column; }
.ai-jobs-failure { margin: 10px 0 0; color: var(--app-danger); }

button,
.btn,
input,
select { min-height: 44px; }
.btn-sm { min-height: 36px; }

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

@media (max-width: 760px) {
    .ai-jobs-summary { grid-template-columns: 1fr; }
    .ai-jobs-row { grid-template-columns: auto minmax(0, 1fr); }
    .ai-jobs-row-actions { grid-column: 1 / -1; flex-direction: row; flex-wrap: wrap; }
}

/* =========================================================
   Phase 2.0D.1 UX consolidation
   ========================================================= */

.vehicle-workspace-nav-shell {
    position: sticky;
    top: 74px;
    z-index: 25;
    display: grid;
    gap: 7px;
    margin: 0 0 24px;
    padding: 8px;
    border: 1px solid var(--app-border);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.97);
    box-shadow: var(--app-shadow-sm);
    backdrop-filter: blur(14px);
}

.vehicle-workspace-nav-heading {
    display: none;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    padding: 3px 7px 0;
}

.vehicle-workspace-nav-heading span {
    color: var(--app-text);
    font-size: .82rem;
    font-weight: 850;
}

.vehicle-workspace-nav-heading small {
    color: var(--app-text-muted);
    font-size: .72rem;
}

.vehicle-workspace-nav-shell .vehicle-workspace-nav {
    position: static;
    top: auto;
    z-index: auto;
    display: grid;
    grid-template-columns: repeat(9, minmax(0, 1fr));
    gap: 5px;
    overflow: visible;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    backdrop-filter: none;
    scrollbar-width: auto;
}

.vehicle-workspace-nav-shell .vehicle-workspace-nav a {
    display: grid;
    min-width: 0;
    min-height: 42px;
    place-items: center;
    padding: 8px 6px;
    text-align: center;
    white-space: normal;
    line-height: 1.15;
}

#buying-journey,
#saved-report,
#buyer-command-center,
#decision-tools,
#evidence-score,
#workspace-attention,
#workspace-reminder,
#workspace-timeline,
#decision-checklist {
    scroll-margin-top: 156px;
}

.dashboard-plan-overview {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(360px, .75fr);
    gap: 22px;
    margin-bottom: 22px;
    padding: 26px;
    overflow: hidden;
    border: 1px solid var(--app-border);
    border-radius: var(--app-radius-lg);
    background:
        radial-gradient(circle at 92% 8%, rgba(83, 164, 255, .22), transparent 32%),
        linear-gradient(135deg, #10214a, #173c92 68%, #1463ff);
    color: #fff;
    box-shadow: var(--app-shadow-md);
}

.dashboard-plan-overview.is-free {
    background:
        radial-gradient(circle at 92% 8%, rgba(111, 66, 217, .18), transparent 32%),
        linear-gradient(135deg, #26334b, #475569);
}

.dashboard-plan-copy .app-eyebrow { color: #bfdbfe; }
.dashboard-plan-title-row { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; }
.dashboard-plan-title-row h2 { margin: 5px 0 2px; color: #fff; font-size: clamp(1.65rem, 3vw, 2.4rem); }
.dashboard-plan-badge { padding: 5px 9px; border-radius: 999px; background: rgba(255,255,255,.16); font-size: .75rem; font-weight: 900; letter-spacing: .08em; }
.dashboard-plan-copy > p { max-width: 680px; margin: 0 0 18px; color: rgba(255,255,255,.78); }

.dashboard-pass-expiry {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 14px 16px;
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 14px;
    background: rgba(255,255,255,.1);
}
.dashboard-pass-expiry > div { display: grid; gap: 3px; }
.dashboard-pass-expiry strong { font-size: 1.05rem; }
.dashboard-pass-expiry span { color: rgba(255,255,255,.74); font-size: .84rem; }

.dashboard-plan-metrics {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}
.dashboard-plan-metrics article {
    display: grid;
    align-content: center;
    min-height: 108px;
    padding: 15px;
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 14px;
    background: rgba(255,255,255,.09);
}
.dashboard-plan-metrics span,
.dashboard-plan-metrics small { color: rgba(255,255,255,.7); }
.dashboard-plan-metrics strong { margin: 4px 0; font-size: 1.85rem; line-height: 1; }

.dashboard-overview-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(320px, .65fr);
    gap: 18px;
    margin-bottom: 22px;
}
.dashboard-quick-action-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; padding: 18px; }
.dashboard-quick-action-grid a {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 3px 12px;
    padding: 15px;
    border: 1px solid var(--app-border);
    border-radius: 14px;
    color: var(--app-text);
    background: var(--app-surface-muted);
    text-decoration: none;
}
.dashboard-quick-action-grid a:hover { border-color: #aac2ef; background: var(--app-primary-soft); }
.dashboard-quick-action-grid a > span { grid-row: 1 / 3; display: grid; width: 34px; height: 34px; place-items: center; border-radius: 11px; background: #fff; color: var(--app-primary); font-size: .72rem; font-weight: 900; }
.dashboard-quick-action-grid strong { align-self: end; }
.dashboard-quick-action-grid small { color: var(--app-text-muted); }

.dashboard-account-list { margin: 0; padding: 12px 20px 18px; }
.dashboard-account-list > div { display: flex; justify-content: space-between; gap: 18px; padding: 12px 2px; border-bottom: 1px solid var(--app-border); }
.dashboard-account-list > div:last-child { border-bottom: 0; }
.dashboard-account-list dt { color: var(--app-text-muted); font-weight: 650; }
.dashboard-account-list dd { margin: 0; text-align: right; font-weight: 850; }

.dashboard-recent-list { display: grid; }
.dashboard-recent-item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto 170px auto;
    gap: 16px;
    align-items: center;
    padding: 16px 20px;
    border-bottom: 1px solid var(--app-border);
    color: var(--app-text);
    text-decoration: none;
}
.dashboard-recent-item:last-child { border-bottom: 0; }
.dashboard-recent-item:hover { background: var(--app-surface-muted); }
.dashboard-recent-score { display: flex; align-items: baseline; min-width: 58px; }
.dashboard-recent-score strong { font-size: 1.6rem; }
.dashboard-recent-score small { color: var(--app-text-muted); }
.dashboard-recent-copy { display: grid; min-width: 0; }
.dashboard-recent-copy strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dashboard-recent-copy span { color: var(--app-text-muted); font-size: .84rem; }
.dashboard-recent-progress { display: grid; gap: 5px; }
.dashboard-recent-progress > span { text-align: right; font-size: .78rem; font-weight: 800; }
.dashboard-recent-arrow { color: var(--app-primary); font-size: 1.35rem; }

.vehicle-library-list { display: grid; gap: 14px; }
.vehicle-library-card {
    overflow: hidden;
    border: 1px solid var(--app-border);
    border-radius: 20px;
    background: var(--app-surface);
    box-shadow: var(--app-shadow-sm);
    transition: border-color 150ms ease, box-shadow 150ms ease, transform 150ms ease;
}
.vehicle-library-card:hover { border-color: #b8c8df; box-shadow: var(--app-shadow-md); transform: translateY(-1px); }
.vehicle-library-head { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 18px 20px; border-bottom: 1px solid var(--app-border); background: linear-gradient(180deg, #fff, #fbfcff); }
.vehicle-library-identity { display: flex; align-items: center; gap: 13px; min-width: 0; }
.vehicle-library-year { display: grid; width: 54px; height: 54px; flex: 0 0 auto; place-items: center; border-radius: 16px; background: var(--app-primary-soft); color: var(--app-primary-strong); font-size: .85rem; font-weight: 900; }
.vehicle-library-identity > div { min-width: 0; }
.vehicle-library-identity h2 { margin: 0; overflow: hidden; font-size: 1.25rem; text-overflow: ellipsis; white-space: nowrap; }
.vehicle-library-identity p { margin: 4px 0 0; color: var(--app-text-muted); font-size: .88rem; }
.vehicle-library-status { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 8px; }
.vehicle-library-shortlisted { padding: 5px 9px; border-radius: 999px; background: #fff5cf; color: #815500; font-size: .74rem; font-weight: 850; }
.vehicle-library-inline-edit { display: flex; gap: 8px; padding: 12px 20px 0; }

.vehicle-library-body { display: grid; grid-template-columns: 230px minmax(300px, 1fr) minmax(310px, 1fr); gap: 22px; align-items: stretch; padding: 20px; }
.vehicle-library-score { display: flex; align-items: center; gap: 14px; padding-right: 20px; border-right: 1px solid var(--app-border); }
.vehicle-library-score-ring {
    --vehicle-score: 50%;
    position: relative;
    display: grid;
    width: 94px;
    height: 94px;
    flex: 0 0 auto;
    place-content: center;
    border-radius: 50%;
    background: conic-gradient(var(--app-primary) var(--vehicle-score), #e8edf5 0);
}
.vehicle-library-score-ring::after { content: ""; position: absolute; inset: 8px; border-radius: 50%; background: #fff; }
.vehicle-library-score-ring span,
.vehicle-library-score-ring small { position: relative; z-index: 1; text-align: center; }
.vehicle-library-score-ring span { font-size: 1.7rem; font-weight: 900; line-height: 1; }
.vehicle-library-score-ring small { color: var(--app-text-muted); font-size: .72rem; }
.vehicle-library-score > div:last-child { display: grid; gap: 3px; }
.vehicle-library-score > div:last-child > span,
.vehicle-library-score > div:last-child > small { color: var(--app-text-muted); font-size: .76rem; }
.vehicle-library-score .is-positive { color: var(--app-success); }
.vehicle-library-score .is-negative { color: var(--app-danger); }
.vehicle-library-score .is-neutral { color: var(--app-text-muted); }

.vehicle-library-progress { display: grid; align-content: center; gap: 10px; }
.vehicle-library-progress-head { display: flex; justify-content: space-between; gap: 12px; }
.vehicle-library-progress-head > div { display: flex; align-items: baseline; gap: 8px; }
.vehicle-library-progress-head span,
.vehicle-library-progress-head small { color: var(--app-text-muted); font-size: .8rem; }
.vehicle-library-progress-head strong { font-size: 1.05rem; }
.vehicle-library-next { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 12px; padding: 10px 12px; border-radius: 12px; background: var(--app-primary-soft); color: var(--app-primary-strong); text-decoration: none; }
.vehicle-library-next span { grid-column: 1; font-size: .7rem; font-weight: 750; text-transform: uppercase; letter-spacing: .05em; }
.vehicle-library-next strong { grid-column: 1; }
.vehicle-library-next b { grid-column: 2; grid-row: 1 / 3; align-self: center; font-size: 1.25rem; }

.vehicle-library-signals { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.vehicle-library-signals > span { display: grid; align-content: center; gap: 2px; min-height: 58px; padding: 9px 10px; border-radius: 11px; background: var(--app-surface-muted); }
.vehicle-library-signals > span.has-alert { background: var(--app-warning-soft); color: #855100; }
.vehicle-library-signals small { color: var(--app-text-muted); font-size: .68rem; }
.vehicle-library-signals strong { overflow: hidden; font-size: .9rem; text-overflow: ellipsis; white-space: nowrap; }
.vehicle-library-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; padding: 14px 20px; border-top: 1px solid var(--app-border); background: #fbfcfe; }
.vehicle-library-actions .btn-primary { min-width: 210px; }
.vehicle-library-archive { margin-left: auto; }

.saved-report-overview {
    margin: 24px 0;
    overflow: hidden;
    border: 1px solid var(--app-border);
    border-radius: var(--app-radius-lg);
    background: var(--app-surface);
    box-shadow: var(--app-shadow-sm);
}
.saved-report-overview-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 24px; align-items: center; padding: 24px; background: linear-gradient(135deg, #fff, #f3f7ff); }
.saved-report-overview-head h2 { margin: 5px 0 6px; }
.saved-report-overview-head p { max-width: 720px; margin: 0; color: var(--app-text-muted); }
.saved-report-overview-score { display: grid; min-width: 160px; justify-items: end; }
.saved-report-overview-score span { color: var(--app-text-muted); font-size: .78rem; }
.saved-report-overview-score strong { font-size: 2.2rem; line-height: 1; }
.saved-report-overview-score small { color: var(--app-text-muted); font-size: .85rem; }
.saved-report-overview-score em { margin-top: 5px; color: var(--app-text-muted); font-size: .78rem; font-style: normal; }
.saved-report-overview-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; border-top: 1px solid var(--app-border); border-bottom: 1px solid var(--app-border); background: var(--app-border); }
.saved-report-overview-facts article { display: grid; gap: 4px; padding: 15px 18px; background: #fff; }
.saved-report-overview-facts span { color: var(--app-text-muted); font-size: .72rem; text-transform: uppercase; letter-spacing: .04em; }
.saved-report-overview-verdict { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: 20px; padding: 20px 24px; background: #fff9e8; }
.saved-report-overview-verdict > div { display: grid; gap: 4px; }
.saved-report-overview-verdict span { color: #995b00; font-size: .72rem; font-weight: 800; text-transform: uppercase; }
.saved-report-overview-verdict p { margin: 0; }
.saved-report-overview-sections { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; padding: 20px 24px 24px; }
.saved-report-overview-sections details { min-width: 0; padding: 14px; border: 1px solid var(--app-border); border-radius: 12px; background: var(--app-surface-muted); }
.saved-report-overview-sections summary { display: flex; justify-content: space-between; gap: 12px; cursor: pointer; font-weight: 820; }
.saved-report-overview-sections summary span { display: grid; min-width: 26px; height: 26px; place-items: center; border-radius: 999px; background: #fff; color: var(--app-primary); font-size: .72rem; }
.saved-report-overview-sections ul { margin: 12px 0 0; padding-left: 20px; }
.saved-report-overview-sections li + li { margin-top: 7px; }
.saved-report-empty { margin: 12px 0 0; color: var(--app-text-muted); }

.decision-tools-group { margin: 24px 0; padding: 22px; border: 1px solid #d8cef8; border-radius: var(--app-radius-lg); background: linear-gradient(180deg, #fbf9ff, #fff); }
.decision-tools-group-head { margin-bottom: 18px; }
.decision-tools-group-head h2 { margin: 4px 0 6px; }
.decision-tools-group-head p { margin: 0; color: var(--app-text-muted); }

@media (max-width: 1180px) {
    .vehicle-workspace-nav-shell .vehicle-workspace-nav { grid-template-columns: repeat(5, minmax(0, 1fr)); }
    .vehicle-library-body { grid-template-columns: 210px minmax(0, 1fr); }
    .vehicle-library-signals { grid-column: 1 / -1; grid-template-columns: repeat(6, minmax(0, 1fr)); }
    .dashboard-recent-item { grid-template-columns: auto minmax(0, 1fr) auto auto; }
    .dashboard-recent-progress { display: none; }
}

@media (max-width: 900px) {
    .vehicle-workspace-nav-shell { position: static; top: auto; }
    .vehicle-workspace-nav-heading { display: flex; }
    .vehicle-workspace-nav-shell .vehicle-workspace-nav { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .dashboard-plan-overview,
    .dashboard-overview-grid { grid-template-columns: 1fr; }
    .vehicle-library-body { grid-template-columns: 1fr; }
    .vehicle-library-score { padding-right: 0; padding-bottom: 16px; border-right: 0; border-bottom: 1px solid var(--app-border); }
    .vehicle-library-signals { grid-column: auto; grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .saved-report-overview-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 640px) {
    .vehicle-workspace-nav-shell { margin-inline: 0; }
    .vehicle-workspace-nav-heading { align-items: flex-start; flex-direction: column; gap: 0; }
    .vehicle-workspace-nav-shell .vehicle-workspace-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .vehicle-workspace-nav-shell .vehicle-workspace-nav a { min-height: 44px; }
    .dashboard-plan-overview { padding: 20px; }
    .dashboard-pass-expiry { align-items: stretch; flex-direction: column; }
    .dashboard-pass-expiry .btn { width: 100%; }
    .dashboard-plan-metrics { grid-template-columns: 1fr 1fr; }
    .dashboard-quick-action-grid { grid-template-columns: 1fr; }
    .dashboard-recent-item { grid-template-columns: auto minmax(0, 1fr) auto; }
    .dashboard-recent-item .vehicle-status-badge { display: none; }
    .vehicle-library-head { align-items: flex-start; flex-direction: column; }
    .vehicle-library-status { justify-content: flex-start; }
    .vehicle-library-body { padding: 16px; }
    .vehicle-library-score-ring { width: 82px; height: 82px; }
    .vehicle-library-signals { grid-template-columns: 1fr 1fr; }
    .vehicle-library-actions { align-items: stretch; flex-direction: column; }
    .vehicle-library-actions .btn { width: 100%; }
    .vehicle-library-archive { margin-left: 0; }
    .saved-report-overview-head { grid-template-columns: 1fr; }
    .saved-report-overview-score { justify-items: start; }
    .saved-report-overview-facts,
    .saved-report-overview-sections { grid-template-columns: 1fr; }
    .saved-report-overview-verdict { grid-template-columns: 1fr; }
    .decision-tools-group { padding: 16px; }
}

/* Phase 2.0D.2: unified Pro gates, page polish and large-list rendering */
.pro-feature-lock {
    width: min(100%, 1180px);
    margin: 24px auto;
    padding: clamp(32px, 6vw, 64px);
    display: grid;
    justify-items: center;
    gap: 14px;
    border: 1px dashed #bfd0ea;
    border-radius: 28px;
    background:
        radial-gradient(circle at 50% 0%, rgba(37, 99, 235, .09), transparent 24rem),
        #fff;
    box-shadow: 0 20px 52px rgba(15, 23, 42, .07);
    text-align: center;
}

.pro-feature-lock-icon {
    width: 58px;
    height: 58px;
    display: grid;
    place-items: center;
    border-radius: 18px;
    color: #155eef;
    background: #edf4ff;
    font-size: 1.7rem;
    font-weight: 900;
}

.pro-feature-lock-kicker {
    margin: 4px 0 0;
    color: #155eef;
    font-size: .75rem;
    font-weight: 900;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.pro-feature-lock h1 {
    margin: 0;
    max-width: 760px;
    color: #0f172a;
    font-size: clamp(2rem, 4vw, 3.25rem);
    line-height: 1.02;
    letter-spacing: -.045em;
}

.pro-feature-lock-description {
    max-width: 780px;
    margin: 0;
    color: #52627a;
    font-size: 1.03rem;
    line-height: 1.65;
}

.pro-feature-lock-benefits {
    width: min(100%, 820px);
    margin: 8px 0 4px;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    list-style: none;
    text-align: left;
}

.pro-feature-lock-benefits li {
    min-height: 58px;
    padding: 12px 14px;
    display: flex;
    align-items: center;
    gap: 10px;
    border: 1px solid #e1e9f5;
    border-radius: 14px;
    color: #263750;
    background: #f8fbff;
    font-weight: 750;
}

.pro-feature-lock-benefits li span {
    width: 24px;
    height: 24px;
    display: inline-grid;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 50%;
    color: #067647;
    background: #eafaf2;
}

.pro-feature-lock-actions {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 10px;
}

.pro-feature-lock > small {
    max-width: 720px;
    color: #6b7890;
    line-height: 1.5;
}

.vehicle-library-card,
.shortlist-car-card,
.app-panel,
.app-stat-card {
    transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
}

.vehicle-library-card {
    content-visibility: auto;
    contain-intrinsic-size: 310px;
}

@media (max-width: 700px) {
    .pro-feature-lock-benefits { grid-template-columns: 1fr; }
    .pro-feature-lock-actions { width: 100%; }
    .pro-feature-lock-actions .btn { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
    .vehicle-library-card,
    .shortlist-car-card,
    .app-panel,
    .app-stat-card { transition: none; }
}

.vehicle-library-footer {
    padding: 14px 4px 2px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    color: var(--app-text-muted);
    font-size: .88rem;
}

@media (max-width: 620px) {
    .vehicle-library-footer { align-items: stretch; flex-direction: column; }
    .vehicle-library-footer .btn { width: 100%; }
}

/* Phase 2.0D.3 — richer vehicle filters, operations command center and plan status */
.vehicle-filter-panel {
    margin: 22px 0 18px;
    padding: 20px;
    border: 1px solid var(--app-border);
    border-radius: 20px;
    background: linear-gradient(145deg, #fff, #f7faff);
    box-shadow: var(--app-shadow-sm);
}
.vehicle-filter-heading,
.vehicle-filter-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}
.vehicle-filter-heading h2 { margin: 0; font-size: 1.2rem; }
.vehicle-search-row { margin-top: 16px; }
.vehicle-search-row .form-control { min-height: 50px; border-radius: 14px; }
.vehicle-filter-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 13px;
    margin-top: 13px;
}
.vehicle-filter-grid label { display: grid; gap: 6px; min-width: 0; }
.vehicle-filter-grid label > span {
    color: var(--app-text-muted);
    font-size: .72rem;
    font-weight: 850;
    letter-spacing: .055em;
    text-transform: uppercase;
}
.vehicle-filter-grid .form-select { min-height: 45px; border-radius: 12px; }
.vehicle-filter-footer {
    margin-top: 16px;
    padding-top: 14px;
    border-top: 1px solid var(--app-border);
    color: var(--app-text-muted);
    font-size: .88rem;
}
.vehicle-filter-footer strong { color: var(--app-text); }

.command-center-overhaul { display: grid; gap: 18px; }
.command-center-metric-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}
.command-center-metric-grid article {
    min-height: 126px;
    padding: 18px;
    display: grid;
    align-content: space-between;
    gap: 7px;
    border: 1px solid var(--app-border);
    border-radius: 18px;
    background: var(--app-surface);
    box-shadow: var(--app-shadow-sm);
}
.command-center-metric-grid span,
.command-center-metric-grid small { color: var(--app-text-muted); }
.command-center-metric-grid span { font-size: .76rem; font-weight: 850; text-transform: uppercase; letter-spacing: .045em; }
.command-center-metric-grid strong { color: var(--app-text); font-size: 2rem; line-height: 1; }
.command-focus-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 20px;
    align-items: center;
    padding: 22px;
    overflow: hidden;
    border: 1px solid #bfd1ef;
    border-radius: 22px;
    background: radial-gradient(circle at 90% 10%, rgba(14, 165, 233, .13), transparent 34%), linear-gradient(135deg, #fff, #f4f8ff);
    box-shadow: var(--app-shadow-md);
}
.command-focus-rank {
    width: 54px;
    height: 54px;
    display: grid;
    place-items: center;
    border-radius: 17px;
    color: #fff;
    background: linear-gradient(135deg, var(--app-primary), #0ea5e9);
    font-weight: 950;
}
.command-focus-title-row { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.command-focus-title-row h2 { margin: 0; }
.command-focus-copy > p:not(.app-eyebrow) { margin: 8px 0 0; color: var(--app-text-muted); }
.command-focus-meta { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 12px; color: var(--app-text-muted); font-size: .82rem; }
.command-focus-meta strong { color: var(--app-text); }
.command-focus-actions { display: grid; gap: 8px; min-width: 180px; }
.command-work-grid { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(300px, .7fr); gap: 18px; }
.command-panel-header { align-items: flex-start; }
.command-filter-tabs { display: flex; flex-wrap: wrap; gap: 8px; padding: 0 20px 16px; }
.command-filter-tabs button {
    padding: 8px 11px;
    border: 1px solid var(--app-border);
    border-radius: 999px;
    color: var(--app-text-muted);
    background: #fff;
    font: inherit;
    font-size: .78rem;
    font-weight: 800;
    cursor: pointer;
}
.command-filter-tabs button span { margin-left: 4px; padding: 2px 6px; border-radius: 999px; background: var(--app-surface-muted); }
.command-filter-tabs button.is-active { border-color: #a8c3f6; color: var(--app-primary-strong); background: var(--app-primary-soft); }
.command-action-list,
.command-attention-list,
.command-recent-list { display: grid; }
.command-action-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 13px;
    align-items: center;
    padding: 14px 20px;
    border-top: 1px solid var(--app-border);
}
.command-action-priority { min-width: 66px; padding: 5px 8px; border-radius: 999px; text-align: center; font-size: .68rem; font-weight: 900; text-transform: uppercase; }
.command-action-priority.is-urgent { color: #9f1239; background: #ffe4e6; }
.command-action-priority.is-high { color: #9a3412; background: #ffedd5; }
.command-action-priority.is-medium { color: #854d0e; background: #fef9c3; }
.command-action-priority.is-normal { color: #166534; background: #dcfce7; }
.command-action-copy { display: grid; min-width: 0; gap: 3px; }
.command-action-copy > div { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.command-action-copy > span,
.command-action-copy small { color: var(--app-text-muted); }
.command-action-copy > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.command-queue-empty { padding: 24px 20px; color: var(--app-text-muted); }
.command-attention-list a,
.command-recent-list a {
    display: grid;
    align-items: center;
    gap: 12px;
    padding: 13px 18px;
    border-top: 1px solid var(--app-border);
    color: var(--app-text);
    text-decoration: none;
}
.command-attention-list a { grid-template-columns: auto minmax(0, 1fr) auto; }
.command-attention-list a > span { width: 57px; min-height: 50px; display: grid; place-content: center; border-radius: 13px; color: #9a3412; background: #fff2e8; text-align: center; }
.command-attention-list a > span strong { font-size: 1.25rem; line-height: 1; }
.command-attention-list a > span { font-size: .64rem; }
.command-attention-list a > div,
.command-recent-list a > div { display: grid; min-width: 0; }
.command-attention-list small,
.command-recent-list small { color: var(--app-text-muted); }
.command-pipeline-grid { display: grid; grid-template-columns: repeat(6, minmax(150px, 1fr)); gap: 10px; padding: 0 20px 20px; overflow-x: auto; }
.command-pipeline-grid > article { min-height: 180px; padding: 12px; border: 1px solid var(--app-border); border-radius: 14px; background: var(--app-surface-muted); }
.command-pipeline-grid header { display: flex; justify-content: space-between; gap: 8px; margin-bottom: 10px; }
.command-pipeline-grid header span { font-size: .75rem; font-weight: 850; }
.command-pipeline-grid header strong { min-width: 24px; height: 24px; display: grid; place-items: center; border-radius: 999px; background: #fff; font-size: .72rem; }
.command-pipeline-grid article > p,
.command-pipeline-grid article > small { color: var(--app-text-muted); font-size: .76rem; }
.command-pipeline-grid article > a { display: grid; gap: 2px; margin-top: 7px; padding: 9px; border-radius: 10px; color: var(--app-text); background: #fff; text-decoration: none; }
.command-pipeline-grid article > a strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .78rem; }
.command-pipeline-grid article > a span { color: var(--app-text-muted); font-size: .68rem; }
.command-bottom-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.command-recent-list a { grid-template-columns: auto minmax(0, 1fr) auto; }
.command-recent-score { width: 45px; height: 45px; display: grid; place-items: center; border-radius: 13px; color: var(--app-primary-strong); background: var(--app-primary-soft); font-weight: 900; }
.command-tool-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 0 20px 20px; }
.command-tool-grid a { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 2px 10px; padding: 13px; border: 1px solid var(--app-border); border-radius: 13px; color: var(--app-text); background: var(--app-surface-muted); text-decoration: none; }
.command-tool-grid a > span { grid-row: 1 / 3; display: grid; width: 32px; height: 32px; place-items: center; border-radius: 10px; color: var(--app-primary); background: #fff; font-size: .68rem; font-weight: 900; }
.command-tool-grid small { color: var(--app-text-muted); }

.plan-status-page { display: grid; gap: 20px; }
.plan-status-hero {
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(250px, .6fr);
    gap: 20px;
    padding: clamp(22px, 4vw, 34px);
    border-radius: 24px;
    color: #fff;
    background: radial-gradient(circle at 85% 0, rgba(85, 201, 255, .22), transparent 34%), #101f3b;
    box-shadow: var(--app-shadow-lg);
}
.plan-status-hero.is-free { background: radial-gradient(circle at 85% 0, rgba(148, 163, 184, .18), transparent 34%), #172033; }
.plan-status-tier { display: inline-flex; width: max-content; padding: 6px 10px; border-radius: 999px; color: #dbeafe; background: rgba(255,255,255,.1); font-size: .73rem; font-weight: 900; text-transform: uppercase; letter-spacing: .07em; }
.plan-status-hero h1 { margin: 12px 0 7px; color: #fff; font-size: clamp(2rem, 5vw, 3.4rem); }
.plan-status-hero p { max-width: 720px; margin: 0; color: #cbd5e1; }
.plan-status-balance { display: grid; align-content: center; gap: 11px; padding: 18px; border: 1px solid rgba(255,255,255,.12); border-radius: 18px; background: rgba(255,255,255,.07); }
.plan-status-balance > div { display: flex; align-items: end; justify-content: space-between; gap: 12px; }
.plan-status-balance span { color: #bfdbfe; font-size: .78rem; }
.plan-status-balance strong { color: #fff; font-size: 2rem; }
.plan-status-metric-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.plan-status-metric-grid article { display: grid; gap: 7px; min-height: 125px; padding: 18px; border: 1px solid var(--app-border); border-radius: 17px; background: #fff; box-shadow: var(--app-shadow-sm); }
.plan-status-metric-grid span,
.plan-status-metric-grid small { color: var(--app-text-muted); }
.plan-status-metric-grid strong { font-size: 1.35rem; overflow-wrap: anywhere; }
.plan-status-content-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.plan-status-check-list,
.plan-status-link-list { display: grid; gap: 9px; padding: 0 20px 20px; }
.plan-status-check-list > div { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 2px 10px; align-items: center; padding: 12px; border-radius: 12px; background: var(--app-surface-muted); }
.plan-status-check-list > div > span { grid-row: 1 / 3; display: grid; width: 28px; height: 28px; place-items: center; border-radius: 999px; color: #067647; background: #eafaf2; font-weight: 900; }
.plan-status-check-list small { color: var(--app-text-muted); }
.plan-status-link-list a { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 12px; padding: 13px; border: 1px solid var(--app-border); border-radius: 12px; color: var(--app-text); text-decoration: none; }
.plan-status-link-list a strong,
.plan-status-link-list a span { grid-column: 1; }
.plan-status-link-list a span { color: var(--app-text-muted); font-size: .8rem; }
.plan-status-link-list a b { grid-column: 2; grid-row: 1 / 3; align-self: center; color: var(--app-primary); }
.plans-current-status { display: grid; grid-template-columns: 1fr 1fr auto; gap: 14px; align-items: center; margin: 18px 0 22px; padding: 16px 18px; border: 1px solid #bfd1ef; border-radius: 18px; color: #fff; background: #13213e; }
.plans-current-status.is-free { background: #263248; }
.plans-current-status > div { display: grid; gap: 2px; }
.plans-current-status span,
.plans-current-status small { color: #cbd5e1; }
.plans-current-status strong { font-size: 1.05rem; }

@media (max-width: 1050px) {
    .vehicle-filter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .command-center-metric-grid,
    .plan-status-metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .command-work-grid,
    .command-bottom-grid,
    .plan-status-content-grid { grid-template-columns: 1fr; }
    .command-pipeline-grid { grid-template-columns: repeat(6, minmax(170px, 1fr)); }
}
@media (max-width: 760px) {
    .vehicle-filter-heading,
    .vehicle-filter-footer { align-items: stretch; flex-direction: column; }
    .vehicle-filter-grid { grid-template-columns: 1fr; }
    .command-focus-card { grid-template-columns: 1fr; }
    .command-focus-actions { min-width: 0; }
    .command-action-row { grid-template-columns: 1fr; }
    .command-action-priority { width: max-content; }
    .command-tool-grid { grid-template-columns: 1fr; }
    .plan-status-hero { grid-template-columns: 1fr; }
    .plans-current-status { grid-template-columns: 1fr; }
}
@media (max-width: 540px) {
    .command-center-metric-grid,
    .plan-status-metric-grid { grid-template-columns: 1fr; }
    .command-filter-tabs { flex-direction: column; }
    .command-filter-tabs button { width: 100%; display: flex; justify-content: space-between; }
}

/* Plan status component alignment */
.plan-status-main { min-width: 0; }
.plan-status-title-row { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.plan-status-title-row h2 { margin: 8px 0 0; color: #fff; font-size: clamp(2rem, 5vw, 3.35rem); }
.plan-status-expiry { display: grid; gap: 3px; margin-top: 20px; padding: 13px 15px; border: 1px solid rgba(255,255,255,.12); border-radius: 14px; background: rgba(255,255,255,.07); }
.plan-status-expiry strong { color: #fff; }
.plan-status-expiry span { color: #cbd5e1; font-size: .82rem; }
.plan-status-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.plan-status-check-list { margin: 0; padding: 0 20px 20px; list-style: none; }
.plan-status-check-list li { display: flex; align-items: center; gap: 10px; padding: 12px; border-radius: 12px; background: var(--app-surface-muted); font-weight: 720; }
.plan-status-check-list li + li { margin-top: 9px; }
.plan-status-check-list li > span { display: grid; width: 28px; height: 28px; flex: 0 0 auto; place-items: center; border-radius: 999px; color: #067647; background: #eafaf2; font-weight: 900; }
.plan-status-check-list li.is-locked { color: var(--app-text-muted); }
.plan-status-check-list li.is-locked > span { color: #64748b; background: #e2e8f0; }
.plan-status-action-list { display: grid; gap: 9px; padding: 0 20px 20px; }
.plan-status-action-list a { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 12px; padding: 13px; border: 1px solid var(--app-border); border-radius: 12px; color: var(--app-text); text-decoration: none; }
.plan-status-action-list a strong,
.plan-status-action-list a span { grid-column: 1; }
.plan-status-action-list a span { color: var(--app-text-muted); font-size: .8rem; }
.plan-status-action-list a b { grid-column: 2; grid-row: 1 / 3; align-self: center; color: var(--app-primary); }
@media (max-width: 1050px) { .plan-status-grid { grid-template-columns: 1fr; } }
