:root{
    color-scheme:dark;
    --rb-bg:#090d0a;
    --rb-bg-deep:#060806;
    --rb-graphite:#0d120e;
    --rb-surface:#111712;
    --rb-surface-2:#161e17;
    --rb-surface-3:#1c261d;
    --rb-glass:rgba(25,34,26,.76);
    --rb-text:#f2f6ee;
    --rb-soft:#cad4c5;
    --rb-muted:#8f9e8e;
    --rb-line:rgba(191,234,134,.14);
    --rb-line-strong:rgba(191,234,134,.25);
    --rb-lime:#a8e95a;
    --rb-lime-bright:#c1ff73;
    --rb-lime-deep:#78ba31;
    --rb-lime-soft:rgba(168,233,90,.12);
    --rb-danger:#ff7b72;
    --rb-warning:#ffbd5b;
    --ink:var(--rb-text);
    --muted:var(--rb-muted);
    --line:var(--rb-line);
    --surface:var(--rb-surface);
    --accent:var(--rb-lime);
    --signal:var(--rb-lime-bright);
    --sidebar:var(--rb-graphite);
    font-family:Inter,-apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI",sans-serif;
}

html,body{min-height:100%;background:var(--rb-bg)!important;color:var(--rb-text)!important}
body{
    background:
        radial-gradient(circle at 78% -10%,rgba(168,233,90,.08),transparent 34rem),
        radial-gradient(circle at -15% 85%,rgba(116,166,79,.06),transparent 32rem),
        var(--rb-bg)!important;
    -webkit-font-smoothing:antialiased;
}
a{color:inherit}
::selection{background:rgba(168,233,90,.3);color:#fff}

/* App frame and desktop navigation */
.app-shell{min-height:100dvh;background:transparent}
.app-sidebar{
    position:sticky;
    top:0;
    width:280px;
    height:100dvh;
    flex:0 0 280px;
    padding:24px 18px 20px;
    overflow:hidden;
    border-right:1px solid var(--rb-line);
    background:
        radial-gradient(circle at 15% 0%,rgba(168,233,90,.1),transparent 18rem),
        linear-gradient(180deg,rgba(17,23,18,.98),rgba(9,13,10,.98))!important;
    color:var(--rb-text);
}
.app-sidebar:after{
    content:"";
    position:absolute;
    right:-85px;
    bottom:8%;
    width:190px;
    height:190px;
    border-radius:50%;
    background:rgba(168,233,90,.055);
    filter:blur(22px);
    pointer-events:none;
}
.app-brand{position:relative;z-index:1;gap:12px;padding:2px 8px 25px;color:var(--rb-text);font-size:25px}
.app-brand>span:last-child>span{color:var(--rb-lime)!important}
.brand-mark{
    width:42px;
    height:42px;
    border:1px solid rgba(255,255,255,.23);
    border-radius:13px;
    background:linear-gradient(145deg,var(--rb-lime-bright),var(--rb-lime-deep))!important;
    color:#11170e!important;
    font-size:20px;
    font-weight:850;
    box-shadow:0 12px 28px rgba(83,139,34,.28),inset 0 1px 0 rgba(255,255,255,.62);
}
.nav-section-label{display:block;margin:2px 12px 9px;color:#6f7e6f;font-size:9px;font-weight:850;letter-spacing:.14em;text-transform:uppercase}
.app-nav{position:relative;z-index:1;display:grid;gap:6px}
.app-nav a{
    display:grid;
    grid-template-columns:38px minmax(0,1fr);
    align-items:center;
    gap:10px;
    min-height:58px;
    padding:9px 11px;
    border:1px solid transparent;
    border-radius:15px;
    color:#9dac9b;
    text-decoration:none;
    transition:border-color .18s ease,background .18s ease,color .18s ease,transform .18s ease;
}
.app-nav a:hover{transform:translateX(2px);border-color:var(--rb-line);background:rgba(255,255,255,.035);color:var(--rb-text)}
.app-nav a.active{
    border-color:rgba(168,233,90,.26);
    background:linear-gradient(135deg,rgba(168,233,90,.15),rgba(168,233,90,.055))!important;
    color:var(--rb-lime-bright)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 10px 24px rgba(0,0,0,.16);
}
.app-nav svg{width:22px;height:22px;justify-self:center;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.app-nav a>span{display:grid;gap:1px;min-width:0}
.app-nav strong{color:inherit;font-size:13px;font-weight:780}
.app-nav small{overflow:hidden;color:#6f7e6f;font-size:10px;font-weight:560;text-overflow:ellipsis;white-space:nowrap}
.app-nav a.active small{color:#a9bf9d}
.sidebar-foot{position:relative;z-index:1;display:grid;gap:12px;margin-top:auto;padding:16px 8px 0;border-color:var(--rb-line)!important}
.sidebar-profile{display:flex;align-items:center;gap:10px}
.sidebar-profile>span{display:grid;place-items:center;width:38px;height:38px;border:1px solid var(--rb-line-strong);border-radius:13px;background:var(--rb-lime-soft);color:var(--rb-lime);font-weight:850}
.sidebar-profile>div{display:grid;min-width:0}
.sidebar-profile strong{overflow:hidden;color:var(--rb-text)!important;font-size:12px;text-overflow:ellipsis;white-space:nowrap}
.sidebar-profile small{color:var(--rb-muted);font-size:9px}
.sidebar-logout{color:#9cab99!important;font-size:11px!important}
.sidebar-logout:hover{color:var(--rb-lime)!important}

.app-main{width:min(100%,1500px);max-width:none;padding:34px clamp(24px,4vw,64px) 60px}
.page-header{margin-bottom:24px}
.eyebrow{color:var(--rb-lime)!important;font-size:10px;letter-spacing:.14em}
.page-title{color:var(--rb-text);font-size:clamp(31px,4vw,46px)}
.page-description{color:var(--rb-muted)!important}
.section-heading{display:flex;align-items:flex-end;justify-content:space-between;margin:27px 2px 12px}
.section-heading h2{margin:0;color:var(--rb-text);font-size:20px;letter-spacing:-.025em}
.section-heading .eyebrow{margin-bottom:2px}

/* Home */
.roadbase-hero{
    position:relative;
    display:grid;
    grid-template-columns:minmax(0,1.35fr) minmax(310px,.65fr);
    gap:28px;
    align-items:end;
    min-height:290px;
    padding:clamp(28px,4vw,48px);
    overflow:hidden;
    border:1px solid rgba(168,233,90,.22);
    border-radius:28px;
    background:
        radial-gradient(circle at 87% 8%,rgba(193,255,115,.13),transparent 20rem),
        linear-gradient(145deg,#172019 0%,#0e140f 62%,#0b100c 100%);
    box-shadow:0 26px 70px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.045);
}
.roadbase-hero:after{content:"R";position:absolute;right:3%;top:-14%;color:rgba(168,233,90,.045);font-size:260px;font-weight:900;line-height:1;pointer-events:none}
.roadbase-hero-copy{position:relative;z-index:1}
.roadbase-hero-copy h1{max-width:800px;margin:0 0 13px;color:#f7faf3;font-size:clamp(39px,5.2vw,67px);letter-spacing:-.055em;line-height:.98}
.roadbase-hero-copy p{max-width:620px;margin:0;color:#aebbaa;font-size:15px;line-height:1.55}
.roadbase-hero-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:25px}
.roadbase-hero-vehicle{
    position:relative;
    z-index:1;
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    gap:13px;
    min-height:92px;
    padding:16px;
    border:1px solid rgba(206,244,157,.16);
    border-radius:20px;
    background:rgba(255,255,255,.045);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.045);
    backdrop-filter:blur(14px);
}
.roadbase-vehicle-swatch{display:grid;place-items:center;width:50px;height:50px;border:1px solid rgba(255,255,255,.1);border-radius:16px;background:color-mix(in srgb,var(--vehicle-color,#a8e95a) 35%,#111712);box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
.roadbase-vehicle-swatch.is-empty{color:var(--rb-lime);font-size:22px}
.roadbase-hero-vehicle>div{display:grid;gap:1px;min-width:0}
.roadbase-hero-vehicle small{color:var(--rb-lime);font-size:9px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.roadbase-hero-vehicle strong{overflow:hidden;color:var(--rb-text);font-size:15px;text-overflow:ellipsis;white-space:nowrap}
.roadbase-hero-vehicle span:not(.roadbase-vehicle-swatch){overflow:hidden;color:var(--rb-muted);font-size:10px;text-overflow:ellipsis;white-space:nowrap}
.roadbase-hero-vehicle>a{display:grid;place-items:center;width:36px;height:36px;border:1px solid var(--rb-line);border-radius:12px;color:var(--rb-lime);font-size:25px;text-decoration:none}

/* Shared surfaces */
.stat-card,.finance-card,.panel,.vehicle-card,.vehicle-summary-card{
    border:1px solid var(--rb-line)!important;
    background:linear-gradient(145deg,rgba(23,31,24,.96),rgba(15,21,16,.96))!important;
    color:var(--rb-text)!important;
    box-shadow:0 14px 38px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.035)!important;
}
.stat-card,.finance-card{position:relative;min-height:128px;padding:20px!important;border-radius:19px!important;overflow:hidden}
.stat-card:after,.finance-card:after{content:"";position:absolute;right:-22px;bottom:-28px;width:86px;height:86px;border-radius:50%;background:rgba(168,233,90,.055)}
.stat-card h2,.finance-card h2{color:#9ead9b!important;font-size:11px!important;font-weight:680}
.stat-value,.finance-value{color:#f3f7ef;font-size:28px!important}
.stat-help,.finance-help{color:var(--rb-muted)!important}
.panel,.vehicle-card{border-radius:20px!important}
.panel-header{padding-bottom:13px;border-bottom:1px solid rgba(191,234,134,.1)}
.panel-header h2,.maintenance-group-header h2{color:var(--rb-text)!important}
.vehicle-row,.cost-row,.metric-row,.history-row,.maintenance-row,.maintenance-history-row,.type-row{border-color:rgba(191,234,134,.1)!important}
.vehicle-name,.cost-label,.metric-name,.history-title,.maintenance-activity-link{color:var(--rb-text)!important}
.vehicle-meta,.cost-date,.cost-type,.cost-vehicle,.metric-name small,.metric-number small,.chart-note{color:var(--rb-muted)!important}
.vehicle-dot{border-color:rgba(255,255,255,.2)}
.status-pill,.group-count,.energy-type-badge{border:1px solid rgba(168,233,90,.17)!important;background:var(--rb-lime-soft)!important;color:var(--rb-lime)!important}
.detail,.instruction-block,.completion-next,.choice-field,.color-control,.summary-table,.info-table{
    border:1px solid var(--rb-line)!important;
    background:rgba(255,255,255,.025)!important;
    color:var(--rb-text)!important;
}
.detail small,.instruction-block small,.summary-label{color:var(--rb-muted)!important}
.empty-state{border-color:var(--rb-line-strong)!important;background:rgba(255,255,255,.018)!important;color:var(--rb-muted)!important}
.empty-state strong{color:var(--rb-soft)!important}
.month-bar{background:linear-gradient(180deg,var(--rb-lime-bright),var(--rb-lime-deep))!important;box-shadow:0 0 18px rgba(168,233,90,.14)}
.vehicle-summary-card:hover,.vehicle-summary-card:focus{border-color:rgba(168,233,90,.38)!important;box-shadow:0 18px 44px rgba(0,0,0,.3)!important;outline:2px solid rgba(168,233,90,.35)!important}
.vehicle-illustration{color:var(--vehicle-color)!important;background:linear-gradient(145deg,color-mix(in srgb,var(--vehicle-color) 12%,#161d17),#0d130e 75%)!important}
.vehicle-illustration:after{background:rgba(168,233,90,.13)!important;box-shadow:0 9px 24px rgba(0,0,0,.35)!important}
.vehicle-illustration-label{border-color:var(--rb-line)!important;background:rgba(11,16,12,.72)!important;color:var(--rb-soft)!important;box-shadow:none!important;backdrop-filter:blur(10px)}
.vehicle-summary-title h2,.vehicle-license{color:var(--rb-text)!important}
.vehicle-model,.vehicle-open-hint{color:var(--rb-muted)!important}
.vehicle-summary-footer{border-color:var(--rb-line)!important}
.vehicle-color-large{border-color:var(--rb-line-strong)!important;box-shadow:inset 0 0 0 5px rgba(255,255,255,.08)!important}
.history-row.is-soon{background:rgba(255,189,91,.075)!important}
.history-row.is-overdue{background:rgba(255,123,114,.075)!important}
.planned-due{color:var(--rb-soft)!important}
.energy-type-badge.charging{border-color:rgba(168,233,90,.2)!important;background:var(--rb-lime-soft)!important;color:var(--rb-lime)!important}
.energy-type-badge.unknown{border-color:var(--rb-line-strong)!important;background:transparent!important;color:var(--rb-muted)!important}
.pagination{border-color:var(--rb-line)!important}
.page-link{border:1px solid var(--rb-line)!important;background:rgba(255,255,255,.035)!important;color:var(--rb-soft)!important}
.page-link.active{border-color:rgba(168,233,90,.3)!important;background:var(--rb-lime-soft)!important;color:var(--rb-lime)!important}

/* Buttons and inputs */
.button{min-height:42px;border:1px solid transparent;border-radius:13px}
.button.primary,.success-button{
    border-color:rgba(213,255,162,.24)!important;
    background:linear-gradient(135deg,var(--rb-lime-bright),var(--rb-lime-deep))!important;
    color:#10160d!important;
    box-shadow:0 10px 25px rgba(104,171,47,.22),inset 0 1px 0 rgba(255,255,255,.55)!important;
}
.button.secondary,.compact-button,.icon-button{
    border-color:var(--rb-line)!important;
    background:rgba(255,255,255,.045)!important;
    color:var(--rb-soft)!important;
}
.button:hover,.icon-button:hover{filter:none;transform:translateY(-1px);border-color:var(--rb-line-strong)!important}
.field>span:first-child,.choice-field legend{color:var(--rb-soft)!important}
.field input,.field select,.field textarea,.type-row input:not([type=checkbox]){
    min-height:45px;
    border:1px solid var(--rb-line-strong)!important;
    border-radius:12px!important;
    background:#0d130e!important;
    color:var(--rb-text)!important;
}
.field input:focus,.field select:focus,.field textarea:focus,.type-row input:focus{
    outline:3px solid rgba(168,233,90,.13)!important;
    border-color:rgba(168,233,90,.55)!important;
}
input[type="checkbox"],input[type="radio"]{accent-color:var(--rb-lime-deep)}

/* Maintenance and tables */
.maintenance-group{overflow:hidden;padding:0!important}
.maintenance-group-header{border-color:var(--rb-line)!important;background:rgba(255,255,255,.018)}
.maintenance-table-head,.maintenance-history-head{background:#0c120d!important;color:#758474!important}
.maintenance-row.is-soon{background:rgba(255,189,91,.075)!important}
.maintenance-row.is-overdue{background:rgba(255,123,114,.075)!important}
.maintenance-row.is-soon .maintenance-dot{border-color:var(--rb-warning);background:var(--rb-warning)}
.maintenance-row.is-overdue .maintenance-dot{border-color:var(--rb-danger);background:var(--rb-danger)}
.status-pill.done{background:rgba(168,233,90,.11)!important;color:var(--rb-lime)!important}
.status-pill.warning{background:rgba(255,189,91,.12)!important;color:#ffd08a!important}
.status-pill.overdue{background:rgba(255,123,114,.12)!important;color:#ffaaa4!important}
.status-pill.setup{background:rgba(255,255,255,.045)!important;color:var(--rb-muted)!important}
.source-box{border-color:rgba(255,189,91,.2)!important;background:rgba(255,189,91,.065)!important;color:#d8c6a8!important}

/* Modals and quick add */
.modal-backdrop{z-index:140!important;background:rgba(3,6,4,.74)!important;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.modal-panel{
    border:1px solid var(--rb-line-strong)!important;
    background:linear-gradient(165deg,#182019,#0d130e)!important;
    color:var(--rb-text)!important;
    box-shadow:0 30px 90px rgba(0,0,0,.62)!important;
}
.modal-header{border-color:var(--rb-line)!important;background:transparent!important}
.modal-header h2{color:var(--rb-text)}
.modal-actions{border-color:var(--rb-line)!important;background:rgba(13,19,14,.92)!important}
.quick-vehicle-picker{border-color:var(--rb-line)!important;background:#0a0f0b!important}
.quick-vehicle-option{color:var(--rb-soft)!important}
.quick-vehicle-option:hover{background:rgba(255,255,255,.035)!important}
.quick-vehicle-option.is-selected{border-color:rgba(168,233,90,.4)!important;background:var(--rb-lime-soft)!important;box-shadow:none!important}
.quick-vehicle-copy small{color:var(--rb-muted)!important}
.quick-vehicle-check{background:var(--rb-lime-deep)!important;color:#10160d!important}
.quick-action{border-color:var(--rb-line)!important;background:rgba(255,255,255,.03)!important;color:var(--rb-text)!important;box-shadow:none!important}
.quick-action:hover{border-color:rgba(168,233,90,.35)!important;background:var(--rb-lime-soft)!important}
.quick-action-icon{background:var(--rb-lime-soft)!important;color:var(--rb-lime)!important}
.quick-action small,.quick-action-help{color:var(--rb-muted)!important}
#quick-add .quick-add-panel{border-color:var(--rb-line-strong)!important;background:linear-gradient(165deg,#182019,#0d130e)!important;color:var(--rb-text)!important}
#quick-add .modal-header{border-color:var(--rb-line)!important;background:transparent!important}
#quick-add .modal-header .eyebrow{color:var(--rb-lime)!important}
#quick-add .modal-header h2{color:var(--rb-text)!important}
#quick-add .icon-button{border-color:var(--rb-line)!important;background:rgba(255,255,255,.04)!important;color:var(--rb-soft)!important}
#quick-add .quick-vehicle-picker{border-color:var(--rb-line)!important;background:#090e0a!important}
#quick-add .quick-vehicle-option{color:var(--rb-soft)!important}
#quick-add .quick-vehicle-option.is-selected{border-color:rgba(168,233,90,.42)!important;background:var(--rb-lime-soft)!important}
#quick-add .quick-action{border-color:var(--rb-line)!important;background:rgba(255,255,255,.03)!important;color:var(--rb-text)!important}
#quick-add .quick-action-icon{background:var(--rb-lime-soft)!important;color:var(--rb-lime)!important}

/* Login */
.login-page{background:radial-gradient(circle at 28% 15%,rgba(168,233,90,.12),transparent 25rem),linear-gradient(145deg,#0f1610,#060906)!important}
.login-brand>span:last-child>span{color:var(--rb-lime)!important}
.login-card{border-color:var(--rb-line)!important;background:linear-gradient(145deg,#182019,#0e140f)!important;color:var(--rb-text)!important;box-shadow:0 30px 90px rgba(0,0,0,.48)!important}

/* Mobile shell */
.mobile-appbar,.mobile-bottom-nav,.roadbase-menu-backdrop{display:none}
@media(max-width:850px){
    :root{--mobile-appbar-height:76px;--mobile-nav-height:76px}
    html,body{background:var(--rb-bg)!important}
    body.roadbase-menu-is-open{overflow:hidden}
    .app-sidebar{display:none}
    .mobile-appbar{
        position:fixed;
        z-index:80;
        top:0;
        left:0;
        right:0;
        display:flex;
        align-items:flex-end;
        justify-content:space-between;
        height:calc(var(--mobile-appbar-height) + env(safe-area-inset-top));
        padding:env(safe-area-inset-top) 18px 12px;
        border-bottom:1px solid var(--rb-line);
        background:rgba(9,13,10,.78)!important;
        box-shadow:0 12px 34px rgba(0,0,0,.25);
        backdrop-filter:blur(28px) saturate(150%);
        -webkit-backdrop-filter:blur(28px) saturate(150%);
    }
    .mobile-appbar-brand{gap:10px;color:var(--rb-text);font-size:21px}
    .mobile-appbar-brand>span:nth-child(2)>span{color:var(--rb-lime)!important}
    .mobile-appbar .brand-mark{width:40px;height:40px;border-radius:13px}
    .mobile-menu-button{display:grid;place-content:center;gap:4px;width:42px;height:42px;padding:0;border:1px solid var(--rb-line);border-radius:14px;background:rgba(255,255,255,.04);box-shadow:inset 0 1px 0 rgba(255,255,255,.04)}
    .mobile-menu-button span{display:block;width:18px;height:2px;border-radius:99px;background:var(--rb-lime)}
    .app-main{max-width:none;padding:calc(var(--mobile-appbar-height) + env(safe-area-inset-top) + 18px) 14px calc(146px + env(safe-area-inset-bottom))}
    .page-header{align-items:flex-start;margin:0 2px 18px}
    .page-title{font-size:31px}
    .page-description{font-size:12px}
    .roadbase-hero{grid-template-columns:1fr;gap:22px;min-height:0;padding:27px 22px 22px;border-radius:24px}
    .roadbase-hero:after{right:-3%;top:2%;font-size:150px}
    .roadbase-hero-copy h1{font-size:clamp(40px,11vw,54px)}
    .roadbase-hero-copy p{font-size:13px}
    .roadbase-hero-actions{margin-top:20px}
    .roadbase-hero-actions .button{flex:1 1 140px}
    .roadbase-hero-vehicle{min-height:82px;padding:13px;border-radius:18px}
    .section-heading{margin:24px 2px 10px}
    .stats-grid,.finance-grid,.cost-grid{
        display:grid!important;
        grid-auto-flow:column!important;
        grid-auto-columns:minmax(174px,76vw)!important;
        grid-template-columns:none!important;
        gap:10px!important;
        margin:0 -14px 16px!important;
        padding:0 14px 4px!important;
        overflow-x:auto!important;
        scroll-snap-type:x proximity;
        scrollbar-width:none;
    }
    .stats-grid::-webkit-scrollbar,.finance-grid::-webkit-scrollbar,.cost-grid::-webkit-scrollbar{display:none}
    .stats-grid>*,.finance-grid>*,.cost-grid>*{grid-column:auto!important;scroll-snap-align:start}
    .stat-card,.finance-card{min-height:118px!important;padding:17px!important;border-radius:18px!important}
    .dashboard-grid,.insight-grid,.two-columns{grid-template-columns:1fr!important;gap:13px!important}
    .panel,.vehicle-card,.vehicle-summary-card{border-radius:19px!important}
    .panel{padding:15px}
    .panel-header{align-items:center}
    .vehicle-row{min-height:61px}

    .mobile-bottom-nav{
        --mobile-nav-count:5;
        position:fixed;
        z-index:75;
        left:12px;
        right:12px;
        bottom:calc(9px + env(safe-area-inset-bottom));
        display:grid;
        grid-template-columns:repeat(5,minmax(0,1fr));
        height:70px;
        min-height:70px;
        padding:7px;
        overflow:visible;
        border:1px solid rgba(220,255,177,.2);
        border-radius:25px;
        background:
            radial-gradient(circle at 16% 0%,rgba(255,255,255,.13),transparent 42%),
            radial-gradient(circle at 82% 110%,rgba(168,233,90,.12),transparent 50%),
            linear-gradient(145deg,rgba(34,44,35,.88),rgba(12,18,13,.82))!important;
        box-shadow:0 22px 56px rgba(0,0,0,.58),inset 0 1px 0 rgba(255,255,255,.09),inset 0 -1px 0 rgba(0,0,0,.35);
        backdrop-filter:blur(34px) saturate(155%);
        -webkit-backdrop-filter:blur(34px) saturate(155%);
        isolation:isolate;
    }
    .mobile-bottom-nav:before{content:"";position:absolute;z-index:3;left:18px;right:18px;top:2px;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.38),transparent);pointer-events:none}
    .mobile-bottom-nav:after{
        content:"";
        position:absolute;
        z-index:0;
        top:8px;
        left:7px;
        width:calc((100% - 14px)/var(--mobile-nav-count));
        height:54px;
        border:1px solid rgba(217,255,171,.25);
        border-radius:19px;
        background:radial-gradient(circle at 28% 10%,rgba(255,255,255,.18),transparent 44%),linear-gradient(145deg,rgba(168,233,90,.22),rgba(92,148,44,.13));
        box-shadow:0 8px 24px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.14);
        transform:translate3d(var(--mobile-nav-offset,0%),0,0) scaleX(.86);
        transition:transform .52s cubic-bezier(.22,1.45,.36,1);
        pointer-events:none;
    }
    .mobile-bottom-nav a{position:relative;z-index:1;gap:4px;border-radius:18px;background:transparent!important;color:#829080!important;font-size:9px;transition:color .2s ease,transform .4s cubic-bezier(.22,1.45,.36,1)}
    .mobile-bottom-nav a.active{color:var(--rb-lime-bright)!important;transform:translateY(-1px)}
    .mobile-bottom-nav a.active:before{display:none!important}
    .mobile-bottom-nav svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.75}
    .mobile-add-button{position:relative;z-index:4;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:2px;margin:-12px 3px 0;padding:0;border:0;background:transparent;color:var(--rb-lime-bright);font:inherit;font-size:9px;font-weight:760}
    .mobile-add-icon{display:grid;place-items:center;width:46px;height:46px;border:1px solid rgba(231,255,201,.45);border-radius:17px;background:linear-gradient(145deg,var(--rb-lime-bright),var(--rb-lime-deep))!important;color:#10160d!important;font-size:27px;font-weight:350;box-shadow:0 11px 25px rgba(71,120,29,.4),inset 0 1px 0 rgba(255,255,255,.64)}

    .roadbase-menu-backdrop{position:fixed;z-index:120;inset:0;display:flex;justify-content:flex-end;padding:12px;background:rgba(2,5,3,.68);opacity:0;visibility:hidden;backdrop-filter:blur(12px);transition:opacity .22s ease,visibility .22s ease}
    .roadbase-menu-backdrop.is-open{opacity:1;visibility:visible}
    .roadbase-menu-panel{display:flex;flex-direction:column;width:min(360px,92vw);height:100%;padding:20px;border:1px solid var(--rb-line-strong);border-radius:25px;background:linear-gradient(160deg,rgba(27,37,28,.97),rgba(10,15,11,.98));box-shadow:-22px 0 70px rgba(0,0,0,.48);transform:translateX(calc(100% + 24px));transition:transform .34s cubic-bezier(.22,1,.36,1)}
    .roadbase-menu-backdrop.is-open .roadbase-menu-panel{transform:translateX(0)}
    .roadbase-menu-panel>header{display:flex;align-items:flex-start;justify-content:space-between;padding-bottom:16px;border-bottom:1px solid var(--rb-line)}
    .roadbase-menu-panel h2{margin:0;font-size:28px}
    .roadbase-menu-user{display:flex;align-items:center;gap:12px;margin:16px 0;padding:13px;border:1px solid var(--rb-line);border-radius:17px;background:rgba(255,255,255,.025)}
    .roadbase-menu-user>span{display:grid;place-items:center;width:42px;height:42px;border-radius:14px;background:var(--rb-lime-soft);color:var(--rb-lime);font-weight:850}
    .roadbase-menu-user>div{display:grid}.roadbase-menu-user small{color:var(--rb-muted)}
    .roadbase-menu-panel nav{display:grid;gap:6px}
    .roadbase-menu-panel nav a{display:flex;align-items:center;justify-content:space-between;min-height:50px;padding:0 14px;border:1px solid transparent;border-radius:14px;color:var(--rb-soft);font-weight:720;text-decoration:none}
    .roadbase-menu-panel nav a:hover{border-color:var(--rb-line);background:var(--rb-lime-soft);color:var(--rb-lime-bright)}
    .roadbase-menu-panel nav a span{font-size:23px;font-weight:400}
    .roadbase-menu-panel form{margin-top:auto}
    .roadbase-menu-logout{width:100%;min-height:46px;border:1px solid var(--rb-line);border-radius:14px;background:rgba(255,255,255,.035);color:var(--rb-soft);font:inherit;font-weight:720}

    .modal-backdrop{align-items:flex-end;padding:0}
    .modal-panel,.modal-panel.wide{width:100%;max-width:none;max-height:calc(94dvh - env(safe-area-inset-top));margin:0;padding:20px 18px calc(20px + env(safe-area-inset-bottom));border-radius:24px 24px 0 0!important}
    .modal-panel:before{content:"";display:block;width:42px;height:4px;margin:-8px auto 15px;border-radius:99px;background:#5a6959!important}
    .modal-header{position:sticky;z-index:2;top:-20px;margin:0 -2px 17px;padding:0 2px 13px;background:#151d16!important}
    .modal-actions{position:sticky;bottom:calc(-20px - env(safe-area-inset-bottom));z-index:3;margin:8px -18px calc(-20px - env(safe-area-inset-bottom));padding:12px 18px calc(12px + env(safe-area-inset-bottom))}
    .field input,.field select,.field textarea{font-size:16px}
}

@media(max-width:560px){
    .roadbase-hero-actions{display:grid;grid-template-columns:1fr 1fr}
    .roadbase-hero-actions .button{min-width:0;padding-inline:10px;font-size:12px}
    .page-header{flex-wrap:wrap}
    .header-actions{width:100%;max-width:none!important;justify-content:flex-start!important}
    .details-grid,.vehicle-specs{grid-template-columns:1fr 1fr!important;gap:8px!important}
    .maintenance-table-head{display:none!important}
    .maintenance-row{background:transparent}
}

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