:root{--primary: #1e40af;--primary-l: #3b82f6;--primary-bg: #eff6ff;--green: #059669;--green-bg: #ecfdf5;--orange: #d97706;--orange-bg: #fffbeb;--red: #dc2626;--red-bg: #fef2f2;--gray-50: #f8fafc;--gray-100: #f1f5f9;--gray-200: #e2e8f0;--gray-400: #94a3b8;--gray-600: #475569;--gray-800: #1e293b;--white: #ffffff;--radius: 12px;--radius-sm: 8px;--shadow: 0 2px 12px rgba(0,0,0,.08);--shadow-md: 0 4px 20px rgba(0,0,0,.12)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;background:var(--gray-100);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:var(--gray-800);-webkit-font-smoothing:antialiased}button{cursor:pointer;border:none;background:none;font:inherit}input,select,textarea{font:inherit;outline:none}a{text-decoration:none;color:inherit}.app-shell{min-height:100dvh;display:flex;flex-direction:column}.page-content{flex:1;padding-bottom:1rem}.page-header{background:var(--primary);color:var(--white);padding:1rem 1rem .8rem;position:sticky;top:0;z-index:10}.page-header h1{font-size:1.2rem;font-weight:700}.page-header .subtitle{font-size:.8rem;opacity:.75;margin-top:2px}.header-row{display:flex;align-items:center;gap:.75rem}.back-btn{width:36px;height:36px;border-radius:50%;background:#fff3;display:flex;align-items:center;justify-content:center;font-size:1.1rem;flex-shrink:0}.back-btn:active{background:#ffffff59}.header-title{flex:1}.header-title h1{font-size:1.1rem;font-weight:700}.header-title p{font-size:.78rem;opacity:.8}.card{background:var(--white);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}.card-list{display:flex;flex-direction:column;gap:.75rem;padding:1rem}.card-body{padding:1rem}.vehicle-card{background:var(--white);border-radius:var(--radius);box-shadow:var(--shadow);padding:1rem;display:flex;align-items:center;gap:1rem;cursor:pointer;transition:transform .1s,box-shadow .1s;border-left:4px solid var(--primary)}.vehicle-card:active{transform:scale(.98);box-shadow:var(--shadow-md)}.vehicle-icon{width:48px;height:48px;border-radius:12px;background:var(--primary-bg);display:flex;align-items:center;justify-content:center;font-size:1.5rem;flex-shrink:0}.vehicle-info{flex:1;min-width:0}.vehicle-name{font-weight:700;font-size:1rem}.vehicle-sub{font-size:.8rem;color:var(--gray-600);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.vehicle-badges{display:flex;gap:.4rem;margin-top:.4rem;flex-wrap:wrap}.badge{font-size:.7rem;font-weight:600;padding:2px 8px;border-radius:20px;background:var(--gray-100);color:var(--gray-600)}.badge.blue{background:var(--primary-bg);color:var(--primary)}.badge.green{background:var(--green-bg);color:var(--green)}.badge.orange{background:var(--orange-bg);color:var(--orange)}.fab{position:fixed;bottom:1.5rem;right:1.25rem;z-index:20;width:56px;height:56px;border-radius:50%;background:var(--primary);color:var(--white);font-size:1.6rem;box-shadow:0 4px 16px #1e40af66;display:flex;align-items:center;justify-content:center;transition:transform .15s,box-shadow .15s}.fab:active{transform:scale(.92);box-shadow:0 2px 8px #1e40af4d}.tabs{display:flex;background:var(--white);border-bottom:2px solid var(--gray-200);position:sticky;top:72px;z-index:9}.tab-btn{flex:1;padding:.7rem .5rem;font-size:.85rem;font-weight:600;color:var(--gray-600);border-bottom:3px solid transparent;margin-bottom:-2px;transition:color .2s,border-color .2s}.tab-btn.active{color:var(--primary);border-color:var(--primary)}.log-item{display:flex;align-items:flex-start;gap:.75rem;padding:.9rem 1rem;border-bottom:1px solid var(--gray-100)}.log-item:last-child{border-bottom:none}.log-icon{width:38px;height:38px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:1.1rem;flex-shrink:0}.log-icon.fuel{background:var(--orange-bg)}.log-icon.maint{background:var(--green-bg)}.log-content{flex:1;min-width:0}.log-title{font-weight:600;font-size:.9rem}.log-meta{font-size:.78rem;color:var(--gray-600);margin-top:2px}.log-right{text-align:right;flex-shrink:0}.log-cost{font-weight:700;font-size:.95rem;color:var(--gray-800)}.log-detail{font-size:.75rem;color:var(--gray-400);margin-top:2px}.delete-btn{font-size:.75rem;color:var(--red);padding:2px 6px;border-radius:4px;margin-top:4px;opacity:.6;transition:opacity .1s}.delete-btn:active{opacity:1}.stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;padding:1rem}.stat-card{background:var(--white);border-radius:var(--radius);box-shadow:var(--shadow);padding:1rem;text-align:center}.stat-card.full{grid-column:span 2}.stat-card.blue{border-top:3px solid var(--primary-l)}.stat-card.green{border-top:3px solid var(--green)}.stat-card.orange{border-top:3px solid var(--orange)}.stat-card.purple{border-top:3px solid #7c3aed}.stat-value{font-size:1.5rem;font-weight:800;color:var(--gray-800)}.stat-value.big{font-size:2rem}.stat-label{font-size:.72rem;color:var(--gray-600);margin-top:4px;text-transform:uppercase;letter-spacing:.04em}.stat-unit{font-size:.8rem;font-weight:400;color:var(--gray-400)}.monthly-section{padding:0 1rem 1rem}.monthly-section h3{font-size:.85rem;font-weight:700;color:var(--gray-600);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.75rem}.month-bar-row{display:flex;align-items:center;gap:.5rem;margin-bottom:.5rem}.month-label{width:40px;font-size:.72rem;color:var(--gray-600);flex-shrink:0}.bar-track{flex:1;height:20px;background:var(--gray-100);border-radius:10px;overflow:hidden}.bar-fill{height:100%;border-radius:10px;background:var(--primary-l);transition:width .5s ease}.bar-fill.green{background:var(--green)}.month-value{width:55px;font-size:.72rem;font-weight:600;color:var(--gray-600);text-align:right}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;background:#00000080;display:flex;align-items:flex-end;animation:fadeIn .2s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal-sheet{width:100%;max-height:92dvh;background:var(--white);border-radius:20px 20px 0 0;overflow-y:auto;padding-bottom:env(safe-area-inset-bottom,1rem);animation:slideUp .25s ease}@keyframes slideUp{0%{transform:translateY(60px);opacity:0}to{transform:translateY(0);opacity:1}}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:1.1rem 1rem .8rem;border-bottom:1px solid var(--gray-200);position:sticky;top:0;background:var(--white);z-index:1}.modal-header h2{font-size:1.05rem;font-weight:700}.modal-close{width:32px;height:32px;border-radius:50%;background:var(--gray-100);display:flex;align-items:center;justify-content:center;font-size:.9rem;color:var(--gray-600)}.form-body{padding:1rem;display:flex;flex-direction:column;gap:.9rem}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}.form-group{display:flex;flex-direction:column;gap:.35rem}.form-group label{font-size:.78rem;font-weight:600;color:var(--gray-600);text-transform:uppercase;letter-spacing:.04em}.form-group input,.form-group select,.form-group textarea{padding:.7rem .9rem;border:2px solid var(--gray-200);border-radius:var(--radius-sm);font-size:.95rem;background:var(--white);color:var(--gray-800);transition:border-color .15s;-webkit-appearance:none}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:var(--primary-l)}.form-group textarea{resize:vertical;min-height:70px}.form-group.checkbox{flex-direction:row;align-items:center;gap:.5rem}.form-group.checkbox label{text-transform:none;font-size:.9rem;font-weight:500;color:var(--gray-800);letter-spacing:0}.form-group.checkbox input{width:20px;height:20px;flex-shrink:0}.cost-preview{background:var(--green-bg);border-radius:var(--radius-sm);padding:.6rem .9rem;display:flex;align-items:center;justify-content:space-between}.cost-preview span{font-size:.8rem;color:var(--green);font-weight:600}.cost-preview strong{font-size:1.1rem;color:var(--green);font-weight:800}.btn{padding:.8rem 1.2rem;border-radius:var(--radius-sm);font-weight:700;font-size:.95rem;transition:opacity .15s,transform .1s;display:flex;align-items:center;justify-content:center;gap:.4rem}.btn:active{transform:scale(.97);opacity:.9}.btn-primary{background:var(--primary);color:var(--white)}.btn-secondary{background:var(--gray-100);color:var(--gray-600)}.btn-danger{background:var(--red-bg);color:var(--red)}.btn-full{width:100%}.empty-state{text-align:center;padding:3rem 1.5rem;color:var(--gray-400)}.empty-state .icon{font-size:3rem;margin-bottom:.75rem}.empty-state h3{font-size:1rem;font-weight:600;color:var(--gray-600)}.empty-state p{font-size:.85rem;margin-top:.25rem}.loading{display:flex;align-items:center;justify-content:center;padding:3rem;color:var(--gray-400);gap:.5rem;font-size:.9rem}.section-title{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--gray-400);padding:.8rem 1rem .4rem}.toast{position:fixed;bottom:1.5rem;left:50%;transform:translate(-50%);background:var(--gray-800);color:var(--white);padding:.65rem 1.25rem;border-radius:24px;font-size:.85rem;font-weight:600;z-index:100;animation:toastIn .2s ease;white-space:nowrap}.toast.success{background:var(--green)}.toast.error{background:var(--red)}@keyframes toastIn{0%{opacity:0;transform:translate(-50%) translateY(12px)}to{opacity:1;transform:translate(-50%) translateY(0)}}