:root{font-family:"Segoe UI","Malgun Gothic",sans-serif;color:#243d37;background:#f4f5f0;font-synthesis:none;--green:#153d35;--muted:#71817a;--line:#e2e7e0;--orange:#d15d3d;--cream:#f6f5ed;--shadow:0 8px 28px #193c3406}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button,a,input,select,textarea{touch-action:manipulation}button,a{ -webkit-tap-highlight-color:transparent}button{cursor:pointer;border:0;background:none;color:inherit}button:disabled{opacity:.5;cursor:wait}a{color:inherit}button:focus-visible,a:focus-visible{outline:3px solid #e8ad64;outline-offset:3px}input:focus,select:focus,textarea:focus{outline:2px solid #699b85;outline-offset:1px}h1,h2,h3,p{margin:0}h1{font-size:29px;letter-spacing:-1.1px;font-weight:650}h2{font-size:18px;letter-spacing:-.5px}h3{font-size:15px}small,.muted{color:var(--muted)}small{font-size:12px}svg{display:block}.icon{width:20px;height:20px;stroke:currentColor;stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round;flex:none}.shell{display:grid;grid-template-columns:236px minmax(0,1fr);min-height:100vh}.sidebar{background:#fff;border-right:1px solid var(--line);padding:38px 23px 24px;position:fixed;inset:0 auto 0 0;width:236px;display:flex;flex-direction:column;z-index:10}.brand{display:flex;gap:10px;align-items:center;margin-bottom:43px;font-weight:750;letter-spacing:2.5px;font-size:25px}.brand-mark{width:30px;height:36px;display:grid;place-items:center;background:var(--green);color:white;border-radius:9px}.brand-mark svg{width:18px}.brand small{font-size:10px;letter-spacing:1.5px;display:block;margin-top:3px;font-weight:400}.nav-label{font-size:10px;color:#9ba59e;letter-spacing:1.8px;margin:0 15px 14px}nav{display:grid;gap:7px}nav button{display:flex;align-items:center;gap:13px;border-radius:9px;text-align:left;padding:13px 15px;color:#728078;font-size:13px}nav button.active{background:#eaf0e9;color:var(--green);font-weight:700}nav button:hover{background:#f2f5ef}.nav-count{margin-left:auto;background:#fff;border-radius:5px;padding:2px 6px;font-size:10px;color:#617d67}.side-bottom{margin-top:auto;padding-top:35px}.private-note{border:1px solid var(--line);border-radius:10px;padding:15px 13px;font-size:11px;line-height:1.9;color:#7d8c81;margin-bottom:20px}.private-note strong{color:var(--green);display:flex;gap:8px;align-items:center;font-size:12px;margin-bottom:5px}.private-note .icon{width:15px;height:15px}.profile{display:flex;align-items:center;gap:10px;padding:0 5px}.avatar{width:32px;height:32px;display:grid;place-items:center;border-radius:50%;font-size:11px;background:#ebe9db;color:#6f7356;font-weight:700}.profile-text{min-width:0;flex:1}.profile-text strong{font-size:11px;display:block;overflow:hidden;text-overflow:ellipsis}.profile-text small{font-size:10px}.logout{padding:7px}.main{grid-column:2;min-width:0}.topbar{height:82px;border-bottom:1px solid var(--line);padding:0 42px;display:flex;align-items:center;justify-content:space-between;gap:12px;background:#ffffff70}.crumb{font-size:12px;color:#8b968e}.crumb b{font-weight:500;color:#344c41}.top-right{display:flex;align-items:center;gap:19px;font-size:11px;color:#7b887f}.online{display:flex;align-items:center;gap:7px}.online:before{content:"";width:5px;height:5px;border-radius:50%;background:#739a6c}.content{max-width:1440px;margin:auto;padding:34px 42px 35px}.page-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:26px;gap:20px}.eyebrow{color:#81927f;font-size:10px;letter-spacing:1.8px;font-weight:650;margin-bottom:9px}.subtitle{font-size:12px;color:var(--muted);margin-top:10px;line-height:1.8}.actions{display:flex;align-items:center;gap:9px}.btn{display:inline-flex;justify-content:center;align-items:center;gap:7px;border:1px solid var(--line);background:#fff;border-radius:8px;padding:10px 15px;font-size:12px;white-space:nowrap;text-decoration:none;min-height:39px}.btn .icon{width:16px;height:16px}.btn:hover{background:#f4f6f0}.btn.primary{background:var(--green);color:#fff;border-color:var(--green)}.btn.primary:hover{background:#245b4c}.btn.orange{background:var(--orange);border-color:var(--orange);color:white}.btn.danger{color:#ad4937}.btn.text{background:none;border:0;padding:7px 0;min-height:30px;color:#69826c}.vehicle-banner{min-height:202px;display:grid;grid-template-columns:1fr 320px;background:#e8ece1;border:1px solid #dce3d5;border-radius:13px;padding:27px 32px;position:relative;overflow:hidden;margin-bottom:22px}.vehicle-banner:after{content:"";position:absolute;width:350px;height:350px;border:1px solid #ced8c65c;border-radius:50%;right:8px;top:-90px;pointer-events:none}.vehicle-tag{display:inline-block;font-size:9px;letter-spacing:1.3px;border:1px solid #becbb8;border-radius:4px;padding:4px 7px;color:#657c5a;margin-bottom:12px}.vehicle-name{font-size:30px;font-weight:650;letter-spacing:-1px;color:#234332}.vehicle-meta{font-size:11px;color:#6f8267;margin-top:9px;display:flex;gap:14px;flex-wrap:wrap}.vehicle-bottom{margin-top:23px;display:flex;align-items:center;gap:9px;font-size:10px;color:#6c7e61}.vehicle-bottom span{width:5px;height:5px;background:#829e6d;border-radius:50%}.car-art{width:300px;align-self:center;z-index:1;opacity:.96}.car-art text{font-family:inherit}.metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:23px}.card{background:#fff;border:1px solid var(--line);border-radius:11px;box-shadow:var(--shadow)}.metric{padding:21px 21px 18px;min-height:137px}.metric-top{display:flex;justify-content:space-between;align-items:center;font-size:11px;color:#7d897e;margin-bottom:15px}.metric-top .icon{width:17px;height:17px;color:#93a08e}.metric-value{font-size:27px;letter-spacing:-1px;font-weight:650;display:flex;gap:5px;align-items:baseline;color:#2f4c3c}.metric-value span{font-size:11px;font-weight:400;letter-spacing:0;color:#8b9387}.metric-note{margin-top:11px;font-size:10px;color:#9aa292;line-height:1.6}.metric-note b{color:#67815c;font-weight:500}.dashboard-grid{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(290px,1fr);gap:21px;margin-bottom:23px}.panel{padding:23px}.panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:22px}.panel-head p{font-size:10px;color:#919c8f;margin-top:7px;line-height:1.7}.legend{display:flex;gap:13px;font-size:10px;color:#83907f;align-items:center;margin-top:4px}.legend i{display:inline-block;width:6px;height:6px;border-radius:50%;background:#769570;margin-right:5px}.legend i.fuel{background:#d99a72}.chart{width:100%;height:196px;overflow:visible}.chart text{font:10px "Segoe UI","Malgun Gothic",sans-serif;fill:#98a18f}.chart .grid{stroke:#edf0e8;stroke-dasharray:3 4}.chart .chart-hit:hover{fill:#e6ece3;opacity:.55}.chart-note{font-size:10px;color:#8b9784;margin-top:10px;line-height:1.7}.period-tabs{display:flex;gap:3px;background:#f0f3ec;border-radius:6px;padding:3px}.period-tabs button{font-size:10px;padding:5px 8px;border-radius:4px;color:#87917e}.period-tabs button.active{background:#fff;box-shadow:0 1px 3px #213a2710;color:#3e5a39}.reminder-item{display:flex;gap:11px;padding:17px 0;border-bottom:1px solid #edf0e8}.reminder-item:first-child{padding-top:0}.reminder-item:last-child{border-bottom:0;padding-bottom:0}.reminder-icon{background:#f3f2e7;color:#9c9568;padding:9px;border-radius:8px;height:35px}.reminder-icon .icon{width:17px;height:17px}.reminder-body{flex:1;min-width:0}.reminder-title{font-size:12px;font-weight:600;margin:2px 0 7px}.reminder-sub{font-size:10px;color:#939c8a;line-height:1.7}.badge{display:inline-flex;padding:4px 7px;border-radius:4px;font-size:9px;background:#ecf2e8;color:#738568;white-space:nowrap;align-self:flex-start}.badge.warning{background:#fff0e2;color:#b2794b}.badge.fuel{background:#edf2ed;color:#6e8a72}.badge.maintenance{background:#f8eee3;color:#b28d62}.badge.expense{background:#eeedf6;color:#8a83a5}.progress{height:4px;border-radius:5px;background:#edf0e7;margin-top:12px;overflow:hidden}.progress div{height:100%;background:#c7ceaa}.section-bar{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:22px 24px 0}.section-bar h2{font-size:16px}.section-bar small{font-size:10px;margin-left:7px;font-weight:400}.table-wrap{overflow:auto}table{border-collapse:collapse;width:100%;font-size:11px;text-align:left;white-space:nowrap}th{font-weight:400;font-size:10px;color:#959e8f;padding:13px 24px;background:#fafbf7;border-bottom:1px solid #edf0e7}td{padding:16px 24px;border-bottom:1px solid #edf0e7;color:#63715d}tr:last-child td{border-bottom:0}tbody tr.clickable{cursor:pointer}tbody tr.clickable:hover{background:#fcfcf7}.record-name{color:#40543c;font-size:12px;font-weight:500;max-width:310px;overflow:hidden;text-overflow:ellipsis}.record-sub{font-size:10px;color:#9ba491;margin-top:6px;max-width:310px;overflow:hidden;text-overflow:ellipsis}.amount{font-weight:600;color:#4a6043}.table-filters{display:flex;align-items:center;gap:6px;padding:18px 24px 15px;flex-wrap:wrap}.filter{font-size:10px;color:#8b957f;border:1px solid transparent;padding:6px 11px;border-radius:5px}.filter.active{color:#56754b;background:#edf2e8;border-color:#e3eadb}.search{margin-left:auto;position:relative}.search input{border:1px solid var(--line);font-size:11px;padding:8px 10px;border-radius:6px;max-width:240px;background:#fff}.foot{display:flex;justify-content:space-between;padding-top:24px;font-size:9px;color:#a4ac9b;gap:12px}.foot strong{font-weight:600;letter-spacing:1px;color:#819077}.data-note{padding:12px 15px;background:#f7f7ed;border:1px solid #e7e9d9;border-radius:8px;color:#8d936f;font-size:11px;line-height:1.8;margin:18px 0}.empty{padding:30px 15px;text-align:center;font-size:12px;line-height:1.9;color:#85917a}.empty .icon{margin:0 auto 12px;width:26px;height:26px}.empty .btn{margin-top:15px}.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.member{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:16px 0;border-bottom:1px solid var(--line);font-size:12px}.member strong{font-size:12px;overflow-wrap:anywhere}.member small{display:block;margin-top:7px}.member-actions{display:flex;align-items:center;gap:4px}.member-actions select{width:auto;padding:6px;font-size:11px}.archive-tabs{display:flex;gap:6px;margin-bottom:20px;flex-wrap:wrap}.archive-cells{max-height:430px;overflow:auto}.archive-cells td{white-space:normal;max-width:650px;word-break:break-word;line-height:1.6}.archive-cells td:first-child{white-space:nowrap;width:70px;color:#8a9a80}.gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px;margin-top:20px}.gallery a{display:block;background:#fff;border:1px solid var(--line);padding:10px;border-radius:8px;text-decoration:none}.gallery img{width:100%;height:180px;object-fit:contain;background:#f6f7f1}.gallery small{display:block;margin-top:9px}.audit-item{padding:14px 0;border-bottom:1px solid var(--line);font-size:11px;line-height:1.8}.audit-item summary{cursor:pointer}.audit-item pre{white-space:pre-wrap;overflow-wrap:anywhere;max-height:250px;overflow:auto;color:#76886a;background:#f6f7f1;padding:12px}.login-page{display:grid;grid-template-columns:1.05fr 1fr;min-height:100vh;background:#fff}.login-story{background:#e8ece1;padding:65px 65px;display:flex;flex-direction:column;position:relative;overflow:hidden}.login-story .brand{margin:0 0 90px}.login-story h1{font-size:46px;line-height:1.4;letter-spacing:-2px;font-weight:600;max-width:430px}.login-story p{color:#819074;font-size:13px;line-height:2;margin-top:22px;max-width:370px}.login-story .car-art{width:100%;max-width:480px;margin:45px auto}.login-story footer{margin-top:auto;font-size:10px;letter-spacing:2px;color:#829374}.login-form-area{display:flex;align-items:center;justify-content:center;padding:50px}.login-form{width:100%;max-width:340px}.login-form h2{font-size:25px}.login-form p{margin:13px 0 30px;color:#929e86;font-size:12px;line-height:1.9}.field{display:grid;gap:8px;margin-bottom:18px;font-size:11px;color:#7c8b71}.field input,.field select,.field textarea,select{width:100%;border:1px solid var(--line);border-radius:7px;background:#fff;padding:11px 12px;font-size:12px;color:#344b2e;min-height:40px}.field textarea{min-height:85px;resize:vertical}.field input::placeholder{color:#b1b8a9}.login-form .btn{width:100%;padding:13px}.login-hint{font-size:10px;color:#a2ab96;line-height:1.9;margin-top:25px}.login-hint a{text-decoration:underline}.error{font-size:12px;background:#fcf0e9;color:#b56a4b;border-radius:6px;padding:12px;line-height:1.7;margin:12px 0;display:none}.error.visible{display:block}dialog{border:1px solid var(--line);border-radius:14px;box-shadow:0 25px 100px #142e282f;padding:0;width:min(620px,calc(100vw - 30px));max-height:90vh;color:#365030}dialog::backdrop{background:#102c2660;backdrop-filter:blur(3px)}.modal-head{display:flex;justify-content:space-between;align-items:center;padding:24px 26px 18px;border-bottom:1px solid var(--line)}.modal-head button{font-size:23px;color:#a0a994;padding:5px}.modal-body{padding:23px 26px;overflow:auto}.modal-body p{font-size:12px;color:#87977a;line-height:1.8;margin-bottom:20px}.modal-foot{display:flex;align-items:center;justify-content:space-between;padding:18px 26px;border-top:1px solid var(--line);gap:10px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 17px}.span2{grid-column:span 2}.readonly-value{font-size:13px;line-height:1.8;color:#45603c;white-space:pre-wrap;overflow-wrap:anywhere}.checkbox{display:flex;align-items:center;gap:8px;font-size:12px}.checkbox input{width:auto;min-height:0}.loading{display:grid;place-content:center;height:80vh;font-size:30px;letter-spacing:5px;color:#234b38}.loading span{font-size:12px;margin-top:16px;letter-spacing:0}#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(100px);transition:transform .2s;background:#244b37;color:#fff;font-size:12px;border-radius:8px;padding:13px 20px;z-index:100;box-shadow:0 6px 30px #17392630;max-width:calc(100vw - 30px);line-height:1.8}#toast.show{transform:translateX(-50%) translateY(0)}.mobile-brand{display:none}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}.detail-grid small{display:block;margin-bottom:8px}.stat-title{margin-bottom:25px}.wide-chart{height:250px}.mini-kpis{display:flex;gap:32px;margin-bottom:15px}.mini-kpis small{display:block;font-size:10px;margin-bottom:8px}.mini-kpis strong{font-size:20px;font-weight:600}.year-select{width:140px;font-size:11px;padding:9px}.auth-note{font-size:10px;color:#9ca98c;line-height:1.8;margin-top:10px}.inline-link{color:#607c50;text-decoration:underline;cursor:pointer}
@media(min-width:1500px){.content{padding-top:40px}.vehicle-banner{min-height:215px}.metrics{gap:20px}.metric{padding:25px}.chart{height:215px}}
@media(max-width:1150px){.sidebar{width:195px;padding:32px 16px}.shell{grid-template-columns:195px minmax(0,1fr)}.topbar{padding:0 25px}.content{padding:27px 25px}.dashboard-grid{grid-template-columns:minmax(0,1.3fr) minmax(245px,1fr)}.vehicle-banner{grid-template-columns:1fr 250px;padding:24px}.car-art{width:250px}.metrics{gap:10px}.metric{padding:17px}.metric-value{font-size:23px}td,th{padding-left:18px;padding-right:18px}.panel{padding:20px}.login-story{padding:45px}.login-story h1{font-size:38px}}
@media(max-width:850px){.shell{display:block}.sidebar{position:fixed;top:auto;bottom:0;left:0;right:0;width:100%;height:67px;padding:0;border:0;border-top:1px solid var(--line);display:block}.sidebar .brand,.nav-label,.side-bottom,.nav-count{display:none}.sidebar nav{display:flex;justify-content:space-around;height:100%;gap:0}.sidebar nav button{padding:8px 5px;gap:5px;flex-direction:column;justify-content:center;border-radius:0;font-size:9px;flex:1}.sidebar nav button.active{background:#f0f3eb}.sidebar nav button .icon{width:19px;height:19px}.topbar{height:63px;padding:0 22px}.crumb{display:none}.mobile-brand{display:flex;align-items:center;gap:8px;font-weight:700;letter-spacing:1.8px;font-size:17px}.mobile-brand span{font-weight:400;letter-spacing:0;font-size:10px;color:#909e86}.top-right{gap:10px}.top-right .online{display:none}.content{padding:25px 20px 90px}.page-head{margin-bottom:22px;gap:15px}h1{font-size:25px}.eyebrow{font-size:9px}.page-head .actions .btn:not(.primary){display:none}.vehicle-banner{min-height:190px;grid-template-columns:1fr 220px;padding:24px}.car-art{width:220px}.metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.metric{min-height:130px;padding:20px}.dashboard-grid{grid-template-columns:1fr;gap:18px}.chart{height:210px}.reminders-panel .reminder-list{display:grid;grid-template-columns:1fr 1fr;gap:20px}.reminder-item{border:0;padding:0}.settings-grid{grid-template-columns:1fr}.login-story{padding:35px}.login-story .brand{margin-bottom:70px}.login-story h1{font-size:32px}.login-form-area{padding:35px}.gallery{grid-template-columns:repeat(2,minmax(0,1fr))}.search input{width:180px}}
@media(max-width:540px){.content{padding:23px 16px 88px}.page-head{align-items:flex-end}.page-head .btn{padding:10px 12px;font-size:11px}.subtitle{font-size:11px;margin-top:8px}.topbar{padding:0 17px}.top-right{font-size:10px}.vehicle-banner{grid-template-columns:1fr;min-height:235px;padding:22px;margin-bottom:16px}.vehicle-name{font-size:27px}.vehicle-tag{font-size:8px}.vehicle-meta{font-size:10px}.vehicle-bottom{margin-top:62px;font-size:9px}.vehicle-banner .car-art{position:absolute;bottom:29px;right:5px;width:190px}.vehicle-banner:after{right:-140px}.metrics{gap:10px;margin-bottom:17px}.metric{padding:17px 15px;min-height:130px}.metric-top{font-size:10px;margin-bottom:15px}.metric-value{font-size:24px}.metric-value span{font-size:10px}.metric-note{font-size:9px;margin-top:10px}.panel{padding:20px 17px}.panel-head{margin-bottom:20px}h2{font-size:16px}.legend{font-size:9px;gap:8px}.period-tabs button{font-size:9px;padding:5px 7px}.chart{height:185px}.reminders-panel .reminder-list{grid-template-columns:1fr}.section-bar{padding:20px 17px 0}.section-bar h2{font-size:15px}.table-filters{padding:16px 17px;gap:2px}.filter{padding:6px 9px;font-size:10px}.search{width:100%;margin-top:10px}.search input{width:100%;max-width:none}.hide-mobile{display:none}td,th{padding:13px 17px}.record-name,.record-sub{max-width:160px}.record-name{font-size:11px}.foot{font-size:8px}.foot span:last-child{max-width:180px;text-align:right}.login-page{grid-template-columns:1fr}.login-story{min-height:230px;padding:25px 28px}.login-story .brand{font-size:20px;margin-bottom:30px}.login-story h1{font-size:25px;max-width:260px;letter-spacing:-1px}.login-story p,.login-story footer{display:none}.login-story .car-art{position:absolute;width:190px;right:-8px;bottom:8px;margin:0}.login-form-area{padding:35px 30px 50px}.login-form{max-width:none}.login-form h2{font-size:22px}.login-form p{margin-bottom:25px}.form-grid{gap:0 12px}.modal-head{padding:20px}.modal-body{padding:20px}.modal-foot{padding:15px 20px}.modal-foot .actions{gap:6px}.modal-foot .btn{padding:10px 12px}.gallery{grid-template-columns:1fr 1fr;gap:10px}.gallery img{height:125px}.gallery small{font-size:9px}.member{align-items:flex-start;flex-wrap:wrap}.member-actions{margin-left:auto}.member strong{font-size:11px}.mini-kpis{gap:20px}.mini-kpis strong{font-size:18px}.year-select{width:110px}.wide-chart{height:210px}.detail-grid{gap:18px 12px}}

.brand{font-size:21px;letter-spacing:1.8px}.brand small{font-size:8px;letter-spacing:1.2px}.vehicle-switch{margin:-2px 0 23px}.vehicle-switch label{display:block;font-size:10px;color:#8b9982;margin:0 0 8px 3px}.vehicle-switch>div{display:flex;gap:5px}.vehicle-switch select{padding:9px 10px;background:#f8f9f4;font-size:12px;font-weight:600}.vehicle-switch button{padding:8px;border:1px solid #e2e7e0;border-radius:7px;background:#f8f9f4}#mobile-vehicle-select{display:none}.stat-title{margin-top:20px}.member{gap:15px}[hidden]{display:none!important}
@media(max-width:850px){.sidebar .vehicle-switch{display:none}#mobile-vehicle-select{display:block;width:110px;font-size:11px;padding:7px;min-height:33px}.top-right>span:last-child{display:none}.mobile-brand span{display:none}.vehicle-name{max-width:310px;overflow-wrap:anywhere}}

/* Keep long forms usable while the page behind the dialog stays still. */
dialog{max-height:92vh;max-height:calc(100dvh - 32px);overflow:hidden}
dialog[open]{display:flex;flex-direction:column}
dialog>form{display:flex;flex-direction:column;min-height:0;max-height:calc(100dvh - 36px);width:100%;overflow:hidden}
.modal-head,.modal-foot{flex-shrink:0;background:#fff}
.modal-body{min-height:0;overflow-y:auto;overscroll-behavior:contain;scroll-padding-block:18px}
.modal-head h2{line-height:1.5}.modal-head>button{min-width:44px;min-height:44px;padding:0}
.modal-foot .btn{min-height:44px;min-width:72px}
.field input,.field select,.field textarea{min-height:44px;font-size:14px}
.field small{line-height:1.7}.field input[type=number]{font-variant-numeric:tabular-nums}
.vehicle-context{display:flex;align-items:center;gap:10px;background:#edf2e8;border:1px solid #e1e9da;border-radius:8px;padding:13px 14px;font-size:12px;margin-bottom:20px;line-height:1.8}
.vehicle-context small{display:block;font-size:10px}.vehicle-context strong{color:#35552e}
.form-details{border-top:1px solid var(--line);margin-top:8px;padding-top:16px}
.form-details summary{cursor:pointer;font-size:12px;color:#6c805c;padding:7px 0 16px;min-height:44px}
.form-details summary:focus-visible{outline:2px solid #699b85;outline-offset:2px}
.form-intro{font-size:12px}.calculation-note{font-size:11px;line-height:1.8;color:#718964;background:#f5f7ef;padding:11px 12px;border-radius:6px;margin:0 0 18px}
.modal-body .calculation-note{margin-bottom:18px}
.discard-notice{background:#fff3e8;border:1px solid #efd6c2;border-radius:8px;padding:14px;font-size:12px;line-height:1.8;margin-top:18px;color:#906347}
.discard-notice .actions{justify-content:flex-end;margin-top:10px;flex-wrap:wrap}.discard-notice .btn{min-height:44px}
.nav-short,.mobile-register{display:none}
@media(max-width:850px){
 .nav-full{display:none}.nav-short{display:inline}.sidebar nav button{font-size:11px;min-width:44px;min-height:56px;gap:5px}
 .mobile-register{display:grid;place-items:center;min-height:44px;min-width:44px;border:1px solid var(--line);border-radius:8px;background:#fff}
 #mobile-vehicle-select{width:132px;min-height:44px;font-size:14px}.top-right{gap:6px}.sidebar{padding-bottom:env(safe-area-inset-bottom);height:calc(67px + env(safe-area-inset-bottom))}
 .content{padding-bottom:calc(90px + env(safe-area-inset-bottom))}
}
@media(max-width:540px){
 dialog{width:calc(100vw - 16px);max-width:100%;max-height:calc(100dvh - 16px);border-radius:12px}
 dialog>form{max-height:calc(100dvh - 20px)}
 .modal-head{padding:12px 16px}.modal-head h2{font-size:18px}
 .modal-body{padding:18px 16px}.modal-foot{padding:12px 16px max(12px,env(safe-area-inset-bottom));gap:6px;flex-wrap:wrap}
 .modal-foot>small{flex-basis:100%;font-size:10px;line-height:1.6}.modal-foot .actions{margin-left:auto}.modal-foot .btn{font-size:13px;min-height:46px;padding:11px 17px}
 .form-grid{grid-template-columns:minmax(0,1fr);gap:0}.form-grid>.span2{grid-column:1}
 .field{font-size:12px;margin-bottom:19px;gap:8px}.field input,.field select,.field textarea,.login-form input{font-size:16px;min-height:48px;width:100%;min-width:0;padding:12px}
 .field textarea{min-height:100px}.form-details summary{font-size:13px}.vehicle-context{font-size:13px}
 .login-form .btn{min-height:48px}.login-hint{font-size:11px}.login-story{min-height:210px}
 .vehicle-banner .car-art{pointer-events:none}.topbar{gap:8px}.mobile-brand{font-size:16px;letter-spacing:1px}
}

/* Readability pass based on the supplied narrow desktop screenshot. */
:root{--muted:#61715f}
.shell{width:100%;min-width:0}.content{width:100%;min-width:0}
.sidebar{overflow-y:auto;overflow-x:hidden}.brand-mark{flex:none}.brand>div:last-child{min-width:0}
.brand small{font-size:9px;letter-spacing:.7px;line-height:1.65}
.nav-label{font-size:11px;color:#6b7a65}.sidebar nav button{font-size:14px;line-height:1.5;min-height:48px;gap:11px}
.nav-count{font-size:11px}.vehicle-switch label{font-size:12px;color:#61715b}
.vehicle-switch>div{display:grid;grid-template-columns:minmax(0,1fr);gap:8px}
.vehicle-switch select{font-size:14px;min-width:0;min-height:44px}
.vehicle-switch button{display:flex;align-items:center;justify-content:center;gap:7px;min-height:44px;font-size:13px;color:#365a32}
.vehicle-switch button .icon{width:17px;height:17px}
.private-note{font-size:12px;color:#64745d}.profile-text strong{font-size:12px}.profile-text small{font-size:11px}
.page-head{flex-wrap:wrap}.page-head>div:first-child{min-width:0;flex:1 1 240px}
.page-head .actions{flex-wrap:wrap}.subtitle{font-size:14px;line-height:1.8}
.eyebrow{font-size:11px}.btn{font-size:14px;min-height:44px}.btn.text{font-size:13px;min-height:44px}
.vehicle-meta{font-size:13px}.vehicle-bottom{font-size:12px;flex-wrap:wrap;line-height:1.8}
.metric-top{font-size:13px;color:#65725f}.metric-note{font-size:12px;color:#67775f}
.metric-value span{font-size:12px}.metric-value{flex-wrap:wrap;row-gap:2px}
.panel-head p{font-size:12px;color:#65735e}.legend{font-size:12px;color:#65735e;flex-wrap:wrap}
.chart text{font-size:13px;fill:#69765e}.chart-note{font-size:12px;color:#67775f}
.section-bar{flex-wrap:wrap}.section-bar small{font-size:12px;color:#6a775f}
table{font-size:13px}th{font-size:12px;color:#65735d}td{color:#52664b}
.record-name{font-size:14px}.record-sub{font-size:12px;color:#6b7b62}
.badge{font-size:11px}.filter{font-size:12px;min-height:40px}
.search input{font-size:13px;min-height:40px}.reminder-title{font-size:14px}.reminder-sub{font-size:12px}
.empty{font-size:14px;color:#64765c}.empty small{font-size:12px}.foot{font-size:11px;color:#6a7b61}
.field{font-size:13px;color:#536c47}.field small,.auth-note{font-size:12px;color:#677a5b}
.modal-body .form-intro,.modal-body p{font-size:13px;color:#627757}
.form-details summary{font-size:14px}.vehicle-context{font-size:14px}.vehicle-context small{font-size:12px}
.modal-foot>small{font-size:12px;color:#63755a}.calculation-note{font-size:12px}
.mobile-register span{font-size:12px}
@media(min-width:851px) and (max-width:1200px){
 .metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
 .dashboard-grid{grid-template-columns:minmax(0,1fr)}
 .metric{min-height:130px;padding:20px}.metric-value{font-size:27px}
 .vehicle-banner{grid-template-columns:minmax(0,1fr) 230px}
 .vehicle-banner .car-art{width:100%;max-width:230px}
 .chart{height:220px}.chart text{font-size:12px}
 .sidebar .private-note{display:none}.side-bottom{padding-top:24px}
}
@media(max-width:850px){
 .sidebar{overflow:visible}.sidebar nav button{font-size:12px;min-height:56px;line-height:1.3;gap:5px}
 .mobile-register{display:flex;gap:4px;padding:0 8px}.mobile-register .icon{width:16px;height:16px}
 #mobile-vehicle-select{width:clamp(96px,29vw,132px);font-size:14px}
 .subtitle{font-size:13px}.metric-top{font-size:12px}.metric-note{font-size:11px}
 .chart-note{font-size:12px}.top-right{min-width:0}
}
@media(max-width:540px){
 .metric{padding:17px 14px}.metric-value{font-size:25px}.metric-top{gap:7px}
 .vehicle-meta{font-size:12px}.vehicle-bottom{font-size:11px;max-width:100%}
 .vehicle-banner .car-art{bottom:38px;width:170px}
 .record-name{font-size:13px;max-width:160px}.record-sub{font-size:11px;max-width:160px}
 table{font-size:12px}.badge{font-size:10px}.modal-foot>small{font-size:11px}
 .page-head .actions{margin-left:auto}.page-head .btn{font-size:13px}
 .mobile-brand{font-size:15px}.topbar{padding-inline:14px}
 .foot{font-size:10px;flex-wrap:wrap}
}
@media(max-height:760px) and (min-width:851px){
 .sidebar{padding-top:22px;padding-bottom:18px}.sidebar .brand{margin-bottom:24px}
 .sidebar .private-note{display:none}.side-bottom{padding-top:20px}
}