:root{--bg:#f5f7fb;--surface:#fff;--surface2:#f8fafc;--ink:#111827;--muted:#6b7280;--line:#e6eaf0;--brand:#1f4fd7;--brand2:#153aa8;--teal:#0f766e;--orange:#c96816;--red:#b42318;--shadow:0 14px 40px rgba(17,24,39,.08);--radius:20px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,system-ui,sans-serif;background:var(--bg);color:var(--ink)}button,input,select,textarea{font:inherit}button{cursor:pointer}.app-shell{min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:248px;background:#0b1220;color:#e5e7eb;padding:22px 16px;display:flex;flex-direction:column;z-index:30}.brand{display:flex;gap:12px;align-items:center;padding:4px 8px 24px}.brand-mark{width:38px;height:38px;border-radius:12px;background:linear-gradient(135deg,#4b74ff,#18a7ff);display:grid;place-items:center;font-family:Manrope;font-weight:800}.brand-name{font-family:Manrope;font-weight:800;color:#fff}.brand-sub{font-size:11px;color:#8b98ab;margin-top:2px}.nav{display:flex;flex-direction:column;gap:6px}.nav-item{border:0;background:transparent;color:#aeb8c7;border-radius:12px;padding:11px 12px;text-align:left;display:flex;align-items:center;gap:11px;transition:.2s}.nav-item span{width:18px;text-align:center}.nav-item em{margin-left:auto;background:#243145;color:#cdd5df;font-style:normal;padding:2px 7px;border-radius:999px;font-size:11px}.nav-item:hover,.nav-item.active{background:#172235;color:#fff}.nav-item.active{box-shadow:inset 3px 0 0 #4b74ff}.sidebar-foot{margin-top:auto}.mini-card{display:flex;gap:10px;align-items:center;background:#111b2d;border:1px solid #20304a;padding:12px;border-radius:14px;margin-bottom:12px}.mini-card small,.profile-chip small{display:block;color:#8090a6;font-size:11px;margin-top:3px}.mini-icon{width:32px;height:32px;border-radius:10px;background:#25365a;display:grid;place-items:center}.profile-chip{width:100%;border:0;background:transparent;color:#e8edf4;display:grid;grid-template-columns:36px 1fr auto;align-items:center;gap:10px;text-align:left;padding:8px}.avatar{width:36px;height:36px;border-radius:50%;background:#d7def0;color:#1f2b3e;display:grid;place-items:center;font-weight:700}.main{margin-left:248px;min-height:100vh}.topbar{height:72px;background:rgba(255,255,255,.94);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:18px;padding:0 28px}.search-wrap{height:42px;display:flex;align-items:center;gap:9px;background:#f7f9fc;border:1px solid var(--line);border-radius:12px;padding:0 12px;flex:1;max-width:650px}.search-wrap input{border:0;outline:0;background:transparent;flex:1;min-width:0}.search-wrap kbd{font-size:11px;color:#7b8493;border:1px solid #d7dce5;border-radius:6px;padding:3px 6px;background:#fff}.top-actions{margin-left:auto;display:flex;gap:9px;align-items:center}.icon-btn{width:40px;height:40px;border:1px solid var(--line);background:#fff;border-radius:11px;display:grid;place-items:center;position:relative}.icon-btn .dot{position:absolute;width:7px;height:7px;background:#ef4444;border-radius:50%;top:8px;right:8px;border:2px solid #fff}.btn{height:42px;border-radius:11px;padding:0 15px;border:1px solid transparent;font-weight:600}.btn.primary{background:var(--brand);color:#fff;box-shadow:0 8px 20px rgba(31,79,215,.18)}.btn.primary:hover{background:var(--brand2)}.btn.secondary{background:#fff;border-color:var(--line);color:#273244}.view{display:none;padding:30px}.view.active{display:block;animation:fade .25s ease}@keyframes fade{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:24px}.page-head.compact{align-items:center}.page-head h1{font-family:Manrope;margin:3px 0 6px;font-size:32px;letter-spacing:-.8px}.page-head p{margin:0;color:var(--muted)}.eyebrow{text-transform:uppercase;letter-spacing:.11em;font-weight:700;font-size:10px;color:#718096}.head-actions{display:flex;gap:10px}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:16px}.stat-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:19px;box-shadow:0 4px 16px rgba(17,24,39,.03)}.stat-card.accent{background:linear-gradient(135deg,#1f4fd7,#1b67eb);color:#fff;border-color:transparent}.stat-top{display:flex;align-items:center;justify-content:space-between}.stat-icon{width:34px;height:34px;border-radius:10px;background:#eff4ff;color:#1f4fd7;display:grid;place-items:center}.accent .stat-icon{background:rgba(255,255,255,.14);color:#fff}.trend{font-size:11px;font-weight:700;border-radius:999px;padding:5px 8px;background:#eef7f4;color:#17765f}.trend.warn{background:#fff3e7;color:#a55c14}.trend.light{background:rgba(255,255,255,.13);color:#fff}.stat-card h2{font-family:Manrope;font-size:31px;margin:16px 0 1px}.stat-card p{margin:0;font-weight:600}.stat-card small{display:block;margin-top:7px;color:#8a94a5}.accent small{color:#d7e2ff}.dashboard-grid{display:grid;grid-template-columns:1.65fr 1fr;gap:16px}.panel{background:#fff;border:1px solid var(--line);border-radius:18px;padding:20px;box-shadow:0 4px 16px rgba(17,24,39,.025)}.panel.flat{box-shadow:none}.panel.wide{min-width:0}.panel-head{display:flex;justify-content:space-between;gap:14px;align-items:center;margin-bottom:18px}.panel-head h3{font-family:Manrope;margin:3px 0 0;font-size:19px}.link-btn{border:0;background:transparent;color:var(--brand);font-weight:700}.pipeline{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;padding:9px 0}.pipe-col strong{font-family:Manrope;font-size:25px}.pipe-col span{display:block;color:var(--muted);font-size:12px;margin:4px 0 12px}.bar,.meter{height:7px;border-radius:999px;background:#edf1f6;overflow:hidden}.bar i,.meter i{height:100%;display:block;background:linear-gradient(90deg,#2658e8,#58a9ff);border-radius:inherit}.timeline{display:flex;flex-direction:column}.timeline-item{display:grid;grid-template-columns:52px 1fr;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}.timeline-item:last-child{border-bottom:0}.timeline-item time{font-size:12px;font-weight:700;color:#596579}.timeline-item strong,.timeline-item span{display:block}.timeline-item span{font-size:11px;color:var(--muted);margin-top:4px}.timeline-item.urgent strong{color:var(--red)}.filter-pills{display:flex;gap:6px}.pill{border:1px solid var(--line);background:#fff;border-radius:999px;padding:7px 10px;font-size:11px}.pill.active{background:#edf3ff;color:#2350c9;border-color:#d6e2ff}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;min-width:740px}th{text-align:left;font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:#8b95a5;padding:11px 12px;border-bottom:1px solid var(--line)}td{padding:14px 12px;border-bottom:1px solid var(--line);font-size:12px;vertical-align:middle}tbody tr{transition:.2s}tbody tr:hover{background:#fafcff}.case-id{font-weight:800;color:#1d4ed8}.status,.priority{display:inline-flex;align-items:center;gap:5px;padding:6px 9px;border-radius:999px;font-size:10px;font-weight:700}.status.new{background:#eef4ff;color:#2f58c7}.status.review{background:#f5efff;color:#7142c7}.status.docs{background:#fff5e9;color:#a96015}.status.resolved{background:#eaf7f1;color:#17765f}.status.escalated{background:#fff0f0;color:#b42318}.priority.urgent{background:#fff0f0;color:#b42318}.priority.high{background:#fff5e9;color:#a96015}.priority.normal{background:#f0f3f7;color:#596579}.owner{display:flex;align-items:center;gap:7px}.owner .avatar{width:26px;height:26px;font-size:9px}.activity-list{display:flex;flex-direction:column}.activity{display:grid;grid-template-columns:12px 1fr;gap:10px;padding:11px 0}.activity-dot{width:8px;height:8px;border-radius:50%;background:#4b74ff;margin-top:5px}.activity strong,.activity span{display:block}.activity strong{font-size:12px}.activity span{font-size:11px;color:var(--muted);margin-top:3px}.toolbar{display:flex;align-items:center;gap:10px;margin-bottom:16px;padding:12px}.toolbar-search{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:10px;padding:0 10px;min-width:320px;height:40px}.toolbar-search input{border:0;outline:0;flex:1}.toolbar select,.form-grid select{height:40px;border:1px solid var(--line);border-radius:10px;background:#fff;padding:0 10px;color:#445066}.vin-hero{display:flex;justify-content:space-between;align-items:center;gap:22px;background:linear-gradient(135deg,#101b32,#16376f);color:#fff;border:0;margin-bottom:16px}.vin-hero p{color:#b9c5d8}.vin-search{display:flex;gap:8px;min-width:410px}.vin-search input{height:44px;flex:1;border-radius:11px;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.09);color:#fff;padding:0 12px;outline:0}.vehicle-grid,.doc-grid,.team-grid,.billing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.vehicle-card,.doc-card,.team-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:18px}.vehicle-top{display:flex;align-items:center;justify-content:space-between}.vehicle-icon{width:44px;height:44px;border-radius:13px;background:#eef4ff;color:#1f4fd7;display:grid;place-items:center;font-size:20px}.vehicle-card h3{margin:15px 0 4px;font-family:Manrope}.vehicle-card p,.vehicle-card small{color:var(--muted)}.vehicle-meta{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:15px}.meta-box{background:#f8fafc;border:1px solid var(--line);border-radius:11px;padding:10px}.meta-box span,.meta-box strong{display:block}.meta-box span{font-size:9px;color:#8b95a5;text-transform:uppercase}.meta-box strong{font-size:11px;margin-top:4px}.doc-card{display:grid;grid-template-columns:42px 1fr auto;gap:12px;align-items:center}.doc-icon{width:42px;height:42px;border-radius:12px;background:#f2f5fa;display:grid;place-items:center}.doc-card h4{margin:0 0 4px}.doc-card p{margin:0;color:var(--muted);font-size:11px}.verify{font-size:9px;font-weight:700;padding:5px 7px;border-radius:999px;background:#eaf7f1;color:#17765f}.reminder-list{display:flex;flex-direction:column;gap:0}.reminder{display:grid;grid-template-columns:18px 1fr auto;gap:12px;align-items:center;padding:15px 0;border-bottom:1px solid var(--line)}.reminder:last-child{border-bottom:0}.check{width:18px;height:18px;border-radius:6px;border:1.5px solid #cbd3df}.reminder h4{margin:0 0 4px}.reminder p{margin:0;color:var(--muted);font-size:11px}.due{font-size:10px;font-weight:700;padding:6px 8px;border-radius:999px;background:#eef4ff;color:#2f58c7}.due.overdue{background:#fff0f0;color:#b42318}.team-card{text-align:center}.team-card .avatar{width:58px;height:58px;margin:4px auto 10px;font-size:15px}.team-card h3{margin:0}.team-card p{margin:4px 0 13px;color:var(--muted);font-size:12px}.role-badge{display:inline-block;padding:6px 9px;border-radius:999px;background:#f1f4f8;font-size:10px;font-weight:700}.billing-grid{grid-template-columns:1.2fr 1fr}.plan-card{display:flex;flex-direction:column;gap:16px}.plan-card h2{font-family:Manrope;font-size:28px;margin:4px 0}.price strong{font-family:Manrope;font-size:34px}.price span{color:var(--muted)}.plan-card ul{padding-left:18px;margin:0;display:grid;gap:10px;color:#4b5563}.usage-card h3{font-family:Manrope}.usage{margin:20px 0}.usage>div:first-child{display:flex;justify-content:space-between;font-size:12px;margin-bottom:8px}.drawer-backdrop,.modal-backdrop{position:fixed;inset:0;background:rgba(7,12,22,.42);backdrop-filter:blur(2px);opacity:0;pointer-events:none;transition:.25s;z-index:50}.drawer-backdrop.show,.modal-backdrop.show{opacity:1;pointer-events:auto}.case-drawer{position:fixed;top:0;right:-520px;width:min(500px,94vw);height:100vh;background:#fff;z-index:60;box-shadow:-20px 0 60px rgba(17,24,39,.18);transition:.3s ease;padding:24px;overflow:auto}.case-drawer.show{right:0}.drawer-head,.modal-head{display:flex;justify-content:space-between;align-items:flex-start;border-bottom:1px solid var(--line);padding-bottom:16px}.drawer-head h2,.modal-head h2{margin:4px 0 0;font-family:Manrope}.drawer-body{padding-top:20px}.detail-hero{background:#f7f9fc;border:1px solid var(--line);border-radius:16px;padding:16px}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}.detail-grid div{border:1px solid var(--line);border-radius:12px;padding:11px}.detail-grid span,.detail-grid strong{display:block}.detail-grid span{font-size:9px;color:#8b95a5;text-transform:uppercase}.detail-grid strong{font-size:11px;margin-top:4px}.modal{position:fixed;z-index:70;left:50%;top:50%;transform:translate(-50%,-46%) scale(.98);width:min(640px,92vw);background:#fff;border-radius:22px;padding:22px;box-shadow:var(--shadow);opacity:0;pointer-events:none;transition:.25s}.modal.show{opacity:1;pointer-events:auto;transform:translate(-50%,-50%) scale(1)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:18px 0}.form-grid label{display:flex;flex-direction:column;gap:7px}.form-grid label span{font-size:11px;font-weight:700;color:#596579}.form-grid .full{grid-column:1/-1}.form-grid input,.form-grid textarea{border:1px solid var(--line);border-radius:10px;padding:11px;outline:0}.form-grid input:focus,.form-grid textarea:focus{border-color:#8ca8fa;box-shadow:0 0 0 3px #eef3ff}.modal-actions{display:flex;justify-content:flex-end;gap:9px}.toast{position:fixed;right:24px;bottom:24px;background:#101827;color:#fff;border-radius:14px;padding:13px 16px;box-shadow:var(--shadow);z-index:90;min-width:260px;transform:translateY(20px);opacity:0;pointer-events:none;transition:.25s}.toast.show{transform:none;opacity:1}.toast strong,.toast span{display:block}.toast span{font-size:11px;color:#b8c2d0;margin-top:3px}.mobile-only{display:none}
@media(max-width:1050px){.stats-grid{grid-template-columns:repeat(2,1fr)}.vehicle-grid,.doc-grid,.team-grid{grid-template-columns:repeat(2,1fr)}.dashboard-grid{grid-template-columns:1fr}.activity-panel{grid-column:1}.vin-hero{align-items:flex-start;flex-direction:column}.vin-search{min-width:0;width:100%}}
@media(max-width:780px){.sidebar{transform:translateX(-100%);transition:.25s}.sidebar.open{transform:none}.main{margin-left:0}.mobile-only{display:grid}.topbar{padding:0 14px}.search-wrap kbd,.top-actions .secondary{display:none}.view{padding:18px}.page-head{align-items:flex-start;flex-direction:column}.stats-grid,.vehicle-grid,.doc-grid,.team-grid,.billing-grid{grid-template-columns:1fr}.pipeline{grid-template-columns:1fr 1fr}.toolbar{align-items:stretch;flex-direction:column}.toolbar-search{min-width:0}.toolbar select{width:100%}.form-grid{grid-template-columns:1fr}.form-grid .full{grid-column:auto}.head-actions{width:100%;flex-wrap:wrap}.head-actions .btn{flex:1}.filter-pills{overflow:auto}.vin-search{flex-direction:column}.search-wrap{max-width:none}.top-actions{gap:6px}.top-actions .btn.primary{padding:0 10px}.page-head h1{font-size:28px}}