:root { --m1-ink: #162338; --m1-muted: #66758a; --m1-line: #dce3eb; --m1-canvas: #f4f7fa; --m1-blue: #1769aa; }
body { min-height: 100vh; margin-bottom: 0; background: var(--m1-canvas); color: var(--m1-ink); font-family: Inter, "Segoe UI", Arial, sans-serif; }
.app-header { position: sticky; top: 0; z-index: 1030; background: #fff; border-bottom: 1px solid var(--m1-line); box-shadow: 0 2px 14px rgba(22, 35, 56, .06); }
.app-header .navbar { min-height: 70px; padding: 9px 24px; }
.app-nav-shell { max-width: 1680px; }
.app-brand { display: flex; align-items: center; gap: 11px; color: var(--m1-ink) !important; font-size: 16px; font-weight: 700; letter-spacing: -.01em; }
.app-brand strong { color: #1769aa; font-weight: 900; letter-spacing: .04em; }
.app-brand small { display: block; color: var(--m1-muted); font-size: 9px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.app-logo-wrap { align-items: center; background: #fff; border-radius: 10px; display: flex; height: 44px; justify-content: center; overflow: hidden; width: 70px; }
.app-logo { display: block; height: auto; max-height: 42px; max-width: 68px; object-fit: contain; }
.app-nav { align-items: center; gap: 3px; margin-left: 28px; }
.app-workspace-label { align-items:center; color:#1769aa; display:flex; font-size:11px; font-weight:900; letter-spacing:.08em; margin-right:8px; padding:8px 10px 8px 0; text-transform:uppercase; }
.app-nav .nav-link { border-radius: 8px; color: #405168 !important; font-size: 13px; font-weight: 750; padding: 9px 11px !important; }
.app-nav .nav-link:hover, .app-nav .nav-link:focus { background: #eaf3f9; color: #135d98 !important; }
.app-nav .nav-link.active { background: #e3f1fa; color: #10588f !important; }
.app-header .dropdown-menu { border: 1px solid var(--m1-line); border-radius: 12px; box-shadow: 0 14px 30px rgba(22, 35, 56, .14); min-width: 238px; padding: 7px; }
.app-menu-label { color: #8491a1; font-size: 10px; font-weight: 800; letter-spacing: .09em; padding: 7px 10px 6px; text-transform: uppercase; }
.app-header .dropdown-item { border-radius: 7px; color: #34465c; font-size: 13px; padding: 8px 11px; }
.app-header .dropdown-item:hover { background: #eaf3f9; color: #135d98; }
.app-home-link { border:1px solid #cfd9e4; border-radius:8px; color:#3f5369; display:inline-flex; font-size:13px; font-weight:800; padding:8px 14px; text-decoration:none; white-space:nowrap; }
.app-home-link:hover { background:#edf4f9; color:#135d98; }
.m1-utility-icon{align-items:center;border-radius:8px;color:#3f5369;display:inline-flex;flex-direction:column;flex:0 0 auto;gap:2px;justify-content:center;min-height:52px;min-width:58px;padding:4px 7px;text-decoration:none}.m1-utility-icon svg{fill:none;height:25px;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8;width:25px}.m1-utility-icon span{font-size:10px;font-weight:850;line-height:1;white-space:nowrap}.m1-utility-icon:hover,.m1-utility-icon.active{background:#e7f2fa;color:#135d98}.m1-utility-icon.active{box-shadow:inset 0 -3px 0 #1686c0}
.m1-icon-library{height:0;position:absolute;visibility:hidden;width:0}.m1-brand{gap:9px;min-width:132px}.m1-brand-mark{align-items:center;background:linear-gradient(145deg,#167ce1,#5637d1);border-radius:13px;box-shadow:0 6px 14px rgba(36,95,190,.2);color:#fff;display:flex;font-size:30px;font-style:italic;font-weight:950;height:48px;justify-content:center;letter-spacing:-.12em;padding-right:4px;width:52px}.m1-brand strong{color:#155f99!important}.m1-icon-item .nav-link{align-items:center;display:flex;flex-direction:column;gap:4px;justify-content:center;min-height:57px;min-width:60px;padding:6px 8px!important;text-align:center}.m1-icon-item .nav-link svg{fill:none;height:24px;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8;width:24px}.m1-icon-item .nav-link span{font-size:10px;font-weight:850;line-height:1.05;white-space:nowrap}.m1-icon-item .nav-link.active{box-shadow:inset 0 -3px 0 #1686c0}.m1-icon-item .nav-link:hover svg,.m1-icon-item .nav-link.active svg{transform:translateY(-1px)}
.app-main { padding-top: 20px; padding-bottom: 36px; }
.workspace-wide { max-width: 1920px; padding-left: clamp(16px, 2.25vw, 42px); padding-right: clamp(16px, 2.25vw, 42px); }
.footer { display: none; }
.drawer-backdrop { display:none; position:fixed; inset:0; z-index:500; background:rgba(15,23,42,.45); }
.drawer { background:#fff; box-shadow:-6px 0 22px rgba(15,23,42,.28); display:none; flex-direction:column; height:100vh; position:fixed; right:0; top:0; width:min(500px,92vw); z-index:501; }
.drawer.open { display:flex; }
.drawer-header { align-items:center; background:#1f4e79; color:#fff; display:flex; font-weight:900; justify-content:space-between; padding:14px 16px; }
.drawer-close { background:rgba(255,255,255,.16); border:0; border-radius:8px; color:#fff; cursor:pointer; font-weight:900; padding:7px 10px; }
.drawer-body { flex:1; overflow-y:auto; padding:16px; }
.drawer-grid { display:grid; gap:10px; }
.drawer-box { background:#f8fbff; border:1px solid #dbe4ee; border-radius:10px; padding:10px; }
.drawer-label { color:#667085; font-size:11px; font-weight:700; margin-bottom:3px; }
.drawer-value { font-weight:900; white-space:pre-wrap; }
.vehicle-class-bar { align-items:center; display:flex; flex-wrap:wrap; gap:7px; margin-bottom:12px; }
.vehicle-class-bar .vehicle-class-label { color:#66758a; font-size:10px; font-weight:900; letter-spacing:.08em; margin-right:2px; text-transform:uppercase; }
.vehicle-class-bar button { background:#fff; border:1px solid #cfd9e4; border-radius:999px; color:#506176; cursor:pointer; font-size:12px; font-weight:800; padding:7px 12px; }
.vehicle-class-bar button.light.active { background:#e8f5ed; border-color:#a9d8b8; color:#187641; }
.vehicle-class-bar button.heavy.active { background:#e8f2fa; border-color:#aac8e3; color:#135d98; }
.vehicle-class-bar button.all.active { background:#fff2e4; border-color:#efc995; color:#a4570b; }
form.filters .vehicle-class-bar { grid-column:1 / -1; }
@media (max-width: 991px) { .app-header .navbar { padding: 9px 14px; } .app-nav { margin: 12px 0 8px; } .app-workspace-label { margin-top:4px; } .app-header .dropdown-menu { border: 0; box-shadow: none; margin-left: 8px; } .app-home-link { margin: 4px 0 8px; width: fit-content; } .app-main { padding-top: 14px; } .workspace-wide { padding-left: 14px; padding-right: 14px; } }
