body{background:#f3f5f7!important;--surface:#fff;--shade:#f6f7f9;--line:#e1e6eb;--shadow:0 8px 24px #141d290c}
body.dark{background:#16191e!important;--surface:#242930;--shade:#2d333b;--line:#434b55}
header{background:linear-gradient(105deg,#14171d,#232832);box-shadow:0 4px 23px #0003}
header .brand{cursor:pointer;font-weight:850}#exit{display:none!important}
#topHome,#menuDots{width:41px;height:41px;display:grid;place-items:center;background:#2b313a;color:#fff;border:1px solid #535b65;border-radius:12px;box-shadow:none;padding:8px}
#topHome svg,#menuDots svg{width:21px;height:21px}
#quickBar{position:fixed;bottom:0;left:0;right:0;z-index:30;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));background:var(--surface);border-top:1px solid var(--line);box-shadow:0 -8px 24px #10182016;padding:5px 8px calc(5px + env(safe-area-inset-bottom))}
#quickBar button{min-width:0;min-height:54px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;border-radius:11px;background:transparent;color:var(--muted);box-shadow:none;font-size:11px;padding:6px 2px}
#quickBar .tile-icon{height:22px;width:22px}
#quickBar .is-current{background:#fde7e9;color:#bd1720}
body.dark #quickBar .is-current{background:#60252e;color:#fff}
#appMenu{position:fixed;inset:0;z-index:50;display:flex;align-items:flex-end;justify-content:center}
#appMenu.hidden{display:none!important}
.menu-shade{position:absolute;inset:0;background:#11151bbb;backdrop-filter:blur(5px)}
.menu-sheet{position:relative;z-index:1;width:min(750px,100%);max-height:86vh;overflow:auto;border-radius:24px 24px 0 0;background:var(--surface);padding:18px 16px calc(23px + env(safe-area-inset-bottom));box-shadow:0 -9px 35px #0004;animation:menuUp .23s ease}
@keyframes menuUp{from{transform:translateY(80%);opacity:.5}to{transform:translateY(0);opacity:1}}
.menu-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.menu-header h2{margin:0;font-size:21px}
.menu-header button{background:var(--shade);color:inherit;border:1px solid var(--line);border-radius:11px;width:39px;height:39px;padding:0;font-size:23px;box-shadow:none}
.menu-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.menu-grid .nav-tile{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:90px;border:1px solid var(--line);border-radius:15px;background:var(--shade);color:inherit;box-shadow:none;font-size:12px;padding:9px 3px}
.menu-grid .tile-icon{width:29px;height:29px;color:#bd1a21}
.menu-bottom{border-top:1px solid var(--line);margin-top:13px;padding-top:13px}
.menu-bottom button{display:flex;align-items:center;gap:8px;background:var(--shade);color:inherit;border:1px solid var(--line);font-size:13px}
main{padding-bottom:max(105px,env(safe-area-inset-bottom) + 95px)!important}
#topbtn{bottom:93px}
main .bar h2{font-weight:800;letter-spacing:-.4px}
#nav.tile-nav .nav-tile{border-radius:19px;background:var(--surface);box-shadow:0 6px 22px #141b2415}
#nav.tile-nav .nav-tile:first-child{background:linear-gradient(135deg,#d51c27,#a5121a)}
#nav.tile-nav .tile-icon{width:39px;height:39px}
.record-card{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;background:var(--shade);border:1px solid var(--line);border-radius:15px;margin:9px 0;padding:13px}
.record-data{min-width:0;flex:1}.record-data strong{display:block;font-size:15px;overflow-wrap:anywhere}
.record-data small{display:block;color:var(--muted);margin-top:5px;font-size:12px;overflow-wrap:anywhere}
.record-actions{display:flex;gap:7px;flex-wrap:wrap}.record-actions button{display:inline-flex;align-items:center;gap:6px;min-height:36px}
.record-actions .tile-icon{height:16px;width:16px}
.record-editor .gridform{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.record-editor input,.record-editor select{min-height:46px}
.record-editor .field label{font-weight:650;font-size:13px;margin-bottom:6px}
.vehicle-editor .field:has(#vehicleModel){position:relative;z-index:22}
.model-choices{position:absolute;left:0;right:0;top:calc(100% - 27px);background:var(--surface);border:1px solid #cbd1d9;border-radius:15px;box-shadow:0 15px 40px #141c273b;z-index:24;overflow:hidden}
.model-choices.hidden{display:none!important}
.model-filter{display:flex;flex-wrap:wrap;gap:5px;padding:8px;border-bottom:1px solid var(--line)}
.model-filter button{background:var(--shade);color:var(--muted);padding:6px 8px;border:1px solid var(--line);box-shadow:none;border-radius:8px;font-size:11px}
.model-filter button.active{background:#bd1b23;color:#fff;border-color:#bd1b23}
.model-results{max-height:min(260px,34vh);overflow:auto;overscroll-behavior:contain}
.model-option{width:100%;min-height:44px;display:flex;justify-content:space-between;align-items:center;gap:10px;padding:9px 12px;text-align:left;background:var(--surface);color:inherit;border-bottom:1px solid var(--line);border-radius:0;box-shadow:none;font-size:13px}
.model-option:hover,.model-option.key-active{background:var(--shade);box-shadow:none}
.model-option small{font-size:11px;color:var(--muted);white-space:nowrap}
.model-credit{display:block;margin-top:8px;color:var(--muted);font-size:10px}
.model-credit a{color:#c51b23;text-decoration:underline}
body.menu-open{overflow:hidden}
body.keyboard-open #quickBar{display:none}
@media(max-width:600px){
 .hin{grid-template-columns:minmax(0,1fr) repeat(3,auto);gap:5px;padding:9px 10px}
 .hin .brand{font-size:15px!important}
 #bell{grid-column:2;grid-row:1;min-width:37px;width:37px;height:37px;padding:6px}
 #topHome{grid-column:3;grid-row:1;width:37px;height:37px;padding:7px}
 #menuDots{grid-column:4;grid-row:1;width:37px;height:37px;padding:7px}
 .hgroup:not(.hidden){grid-column:1/-1;grid-row:2;width:100%}
 #nav.tile-nav{grid-template-columns:repeat(2,minmax(0,1fr))}
 #nav.tile-nav .nav-tile{min-height:115px}
 .record-actions{width:100%}.record-actions button{flex:1}
 .record-editor .gridform{grid-template-columns:1fr}
}
@media(max-width:350px){.hin .brand{font-size:13px!important}.menu-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:900px){
 #quickBar{position:sticky;top:60px;bottom:auto;border-top:0;border-bottom:1px solid var(--line);padding:6px}
 #quickBar button{flex-direction:row;min-height:36px;font-size:13px}#quickBar .tile-icon{width:18px;height:18px}
 main{padding-bottom:65px!important}
 #appMenu{align-items:center}.menu-sheet{border-radius:24px;max-height:78vh}
}
@media(prefers-reduced-motion:reduce){.menu-sheet{animation:none}}
body.lowmotion .menu-sheet{animation:none}