@import url('https://fonts.googleapis.com/css2?family=Syne:wght@600;700;800&family=IBM+Plex+Mono:wght@400;500;600&family=Plus+Jakarta+Sans:wght@400;500;600;700&display=swap');
*{box-sizing:border-box} body{margin:0;background:#07111f;color:#edf3ff;font-family:'Plus Jakarta Sans',sans-serif} :root{--bg:#07111f;--panel:#0d1b2f;--panel2:#10233d;--line:#203a5f;--blue:#3b82f6;--cyan:#38bdf8;--red:#ef4444;--orange:#f59e0b;--green:#10b981;--muted:#8aa0bd;--text:#edf3ff;--mono:'IBM Plex Mono',monospace;--display:'Syne',sans-serif}
a{color:var(--cyan)} .shell{display:grid;grid-template-columns:280px 1fr;min-height:100vh}.side{background:linear-gradient(180deg,#06101e,#0d1b2f);border-right:1px solid var(--line);padding:18px;position:sticky;top:0;height:100vh}.brand{display:flex;gap:12px;align-items:center;margin-bottom:24px}.brand .logo{width:38px;height:38px;border-radius:14px;background:linear-gradient(135deg,var(--blue),var(--cyan));display:grid;place-items:center;font-weight:800}.brand h1{font-family:var(--display);font-size:18px;margin:0}.brand p{font-size:11px;color:var(--muted);margin:2px 0}.nav button{width:100%;background:transparent;border:1px solid transparent;color:var(--muted);border-radius:14px;padding:12px;text-align:left;margin:5px 0;cursor:pointer;font-weight:700}.nav button.active,.nav button:hover{background:#10233d;border-color:#27496f;color:#fff}.main{padding:20px;min-width:0}.top{display:flex;gap:12px;align-items:center;margin-bottom:18px}.search{flex:1;background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:13px;color:#fff}.pill{background:var(--panel);border:1px solid var(--line);border-radius:999px;padding:8px 12px;color:var(--muted);font-size:12px}.grid{display:grid;grid-template-columns:1.4fr .9fr;gap:16px}.card{background:linear-gradient(180deg,rgba(16,35,61,.96),rgba(8,19,35,.96));border:1px solid var(--line);border-radius:22px;padding:18px;box-shadow:0 18px 60px rgba(0,0,0,.28);margin-bottom:16px}.card h2,.card h3{margin:0 0 12px;font-family:var(--display)}.hero{display:grid;grid-template-columns:330px 1fr;gap:18px;align-items:center}.hero img{width:100%;border-radius:20px;filter:drop-shadow(0 25px 40px rgba(0,0,0,.45));background:#06101e}.big{font-size:28px;font-family:var(--display);font-weight:800}.muted{color:var(--muted);font-size:13px}.kpi{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px}.kpi div{background:#07182d;border:1px solid #1d3b62;border-radius:16px;padding:12px}.kpi b{font-family:var(--mono);font-size:20px;color:var(--cyan)}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.input,.select,.textarea{width:100%;background:#07182d;border:1px solid #25496f;border-radius:14px;color:#fff;padding:12px;font:inherit}.textarea{min-height:90px}.label{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;margin:10px 0 6px;font-weight:800}.btn{border:0;border-radius:14px;padding:12px 16px;font-weight:900;cursor:pointer}.btn.blue{background:linear-gradient(135deg,var(--blue),var(--cyan));color:#fff}.btn.ghost{background:#10233d;color:#fff;border:1px solid var(--line)}.btn.red{background:var(--red);color:#fff}.btn.green{background:var(--green);color:#062016}.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.table{width:100%;border-collapse:collapse;font-size:13px}.table th{text-align:left;color:var(--muted);border-bottom:1px solid var(--line);padding:8px}.table td{border-bottom:1px solid rgba(32,58,95,.6);padding:8px;vertical-align:top}.badge{display:inline-flex;align-items:center;gap:6px;padding:5px 9px;border-radius:999px;font-size:11px;font-weight:900;border:1px solid #27496f;background:#08182d}.badge.red{color:#fecaca;border-color:#7f1d1d;background:#2b0a0a}.badge.orange{color:#fde68a;border-color:#92400e;background:#2b1805}.badge.green{color:#bbf7d0;border-color:#065f46;background:#052e24}.alert{border-radius:16px;border:1px solid #7f1d1d;background:#2b0a0a;color:#fecaca;padding:12px;margin:8px 0}.success{border-color:#065f46;background:#052e24;color:#bbf7d0}.service-cats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.cat{background:#07182d;border:1px solid #25496f;border-radius:16px;padding:14px;cursor:pointer}.cat.active{border-color:var(--cyan);box-shadow:0 0 0 2px rgba(56,189,248,.2)}.damage-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.damage-zone{background:#07182d;border:1px solid #25496f;border-radius:12px;padding:9px;font-size:12px}.modal{position:fixed;inset:0;background:rgba(0,0,0,.75);display:none;align-items:center;justify-content:center;padding:16px;z-index:10}.modal.show{display:flex}.modal-card{background:var(--panel);border:1px solid var(--line);border-radius:24px;padding:20px;max-width:760px;width:100%;max-height:90vh;overflow:auto}.bottom-nav{display:none}.driver-page{max-width:720px;margin:0 auto;padding:14px}.driver-hero{display:flex;gap:12px;align-items:center}.driver-hero img{width:42%;border-radius:18px;background:#06101e}.sticky-save{position:sticky;bottom:10px;width:100%;margin-top:12px}.photo-preview{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.photo-preview img{width:100%;border-radius:10px}.hidden{display:none!important}
@media(max-width:900px){.shell{display:block}.side{display:none}.main{padding:12px 12px 78px}.grid{grid-template-columns:1fr}.top{position:sticky;top:0;z-index:5;background:rgba(7,17,31,.94);padding:8px 0}.hero{grid-template-columns:1fr}.service-cats{grid-template-columns:repeat(2,1fr)}.form-grid{grid-template-columns:1fr}.bottom-nav{display:grid;grid-template-columns:repeat(4,1fr);position:fixed;bottom:0;left:0;right:0;background:#08182d;border-top:1px solid var(--line);z-index:8}.bottom-nav button{background:transparent;border:0;color:var(--muted);padding:10px 4px;font-size:11px;font-weight:800}.bottom-nav button.active{color:var(--cyan)}.kpi{grid-template-columns:1fr 1fr}.damage-grid{grid-template-columns:1fr 1fr}.driver-hero{display:block}.driver-hero img{width:100%}}