:root{color-scheme:dark;--color-bg: #0f1115;--color-surface: #171a21;--color-surface-raised: #1e222b;--color-border: #2a2f3a;--color-text: #e8eaed;--color-text-muted: #9aa0a8;--color-text-subtle: #6b7280;--color-accent: #4f8cff;--color-accent-hover: #3d78e6;--color-ok: #22c55e;--color-soon: #eab308;--color-overdue: #ef4444;--color-neutral: #6b7280;--font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--font-size-base: 16px;--line-height-base: 1.5;--radius-sm: 6px;--radius-md: 10px;--radius-lg: 16px;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 24px;--space-6: 32px;--space-7: 48px;--tap-target: 44px;--sidebar-width: 240px}*,*:before,*:after{box-sizing:border-box}html,body{margin:0;padding:0;min-height:100%}body{font-family:var(--font-family);font-size:var(--font-size-base);line-height:var(--line-height-base);color:var(--color-text);background-color:var(--color-bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{min-height:100vh}a{color:var(--color-accent);text-decoration:none}a:hover{text-decoration:underline}button,input,select,textarea{font:inherit;color:inherit}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.muted{color:var(--color-text-muted)}.text-sm{font-size:.875rem}.code-chip{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;background:var(--color-surface-raised);border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:2px 8px}.stack{display:flex;flex-direction:column;gap:var(--space-3)}.page-loading{display:grid;place-items:center;min-height:40vh;color:var(--color-text-muted)}.app-shell{min-height:100vh;display:flex;flex-direction:column}.app-body{flex:1;display:flex;flex-direction:column;min-width:0}.app-main{flex:1;padding:var(--space-4);padding-bottom:calc(var(--space-6) + 64px);max-width:1100px;width:100%;margin:0 auto}.sidebar{display:none}.bottom-nav{position:fixed;left:0;right:0;bottom:0;z-index:40;display:flex;background:var(--color-surface);border-top:1px solid var(--color-border);padding:var(--space-1) var(--space-2);gap:var(--space-1)}.bottom-nav__tab{flex:1;min-height:var(--tap-target);display:grid;place-items:center;color:var(--color-text-muted);font-size:.85rem;border-radius:var(--radius-sm);text-decoration:none}.bottom-nav__tab:hover{text-decoration:none;color:var(--color-text)}.bottom-nav__tab.is-active{color:var(--color-accent);background:var(--color-surface-raised)}.offline-banner{background:#3b2a12;color:#f5d78e;padding:var(--space-2) var(--space-4);text-align:center;font-size:.9rem}.page h1,.page-header__title{margin:0 0 var(--space-2);font-size:1.5rem;line-height:1.25}.page-header{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:var(--space-3);margin-bottom:var(--space-4)}.page-header__subtitle{margin:0;color:var(--color-text-muted);font-size:.95rem}.page-header__actions{display:flex;flex-wrap:wrap;gap:var(--space-2)}.page-footnote{margin-top:var(--space-5);color:var(--color-text-subtle);font-size:.85rem}.page--center{display:grid;place-items:center;min-height:70vh}@media(min-width:900px){.app-shell{flex-direction:row}.sidebar{display:flex;flex-direction:column;width:var(--sidebar-width);flex-shrink:0;background:var(--color-surface);border-right:1px solid var(--color-border);padding:var(--space-4);gap:var(--space-4);position:sticky;top:0;height:100vh}.sidebar__brand{display:flex;align-items:center;gap:var(--space-2);font-weight:600;color:var(--color-text);text-decoration:none}.sidebar__brand:hover{text-decoration:none}.sidebar__logo{width:28px;height:28px;display:grid;place-items:center;background:var(--color-surface-raised);border-radius:8px}.sidebar__nav{display:flex;flex-direction:column;gap:var(--space-1);flex:1}.sidebar__section{margin:var(--space-3) 0 var(--space-1);font-size:.75rem;text-transform:uppercase;letter-spacing:.04em;color:var(--color-text-subtle)}.sidebar__link{display:flex;align-items:center;min-height:var(--tap-target);padding:0 var(--space-3);border-radius:var(--radius-sm);color:var(--color-text-muted);text-decoration:none}.sidebar__link:hover{color:var(--color-text);background:var(--color-surface-raised);text-decoration:none}.sidebar__link.is-active{color:var(--color-accent);background:var(--color-surface-raised)}.sidebar__footer{display:flex;flex-direction:column;gap:var(--space-2)}.sidebar__user{display:flex;flex-direction:column}.sidebar__login{font-weight:600}.sidebar__role{font-size:.8rem;color:var(--color-text-muted)}.bottom-nav{display:none}.app-main{padding-bottom:var(--space-6)}}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);min-height:var(--tap-target);padding:0 var(--space-4);border-radius:var(--radius-sm);border:1px solid transparent;background:transparent;color:var(--color-text);font-weight:500;cursor:pointer;text-decoration:none;transition:background .15s ease,border-color .15s ease,color .15s ease}.btn:hover{text-decoration:none}.btn:disabled,.btn.is-loading{opacity:.6;cursor:not-allowed}.btn--primary{background:var(--color-accent);color:#fff}.btn--primary:hover:not(:disabled){background:var(--color-accent-hover);color:#fff}.btn--secondary{background:var(--color-surface-raised);border-color:var(--color-border);color:var(--color-text)}.btn--secondary:hover:not(:disabled){border-color:var(--color-accent)}.btn--danger{background:transparent;border-color:var(--color-overdue);color:var(--color-overdue)}.btn--danger:hover:not(:disabled){background:#ef44441f}.btn--ghost{background:transparent;color:var(--color-text-muted)}.btn--ghost:hover:not(:disabled){color:var(--color-text);background:var(--color-surface-raised)}.btn--sm{min-height:36px;padding:0 var(--space-3);font-size:.9rem}.btn--block{width:100%}.btn__spinner{width:14px;height:14px;border:2px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite}.btn--secondary .btn__spinner,.btn--ghost .btn__spinner,.btn--danger .btn__spinner{border-color:#e8eaed40;border-top-color:var(--color-text)}@keyframes spin{to{transform:rotate(360deg)}}.link-btn{color:var(--color-accent);font-size:.95rem;min-height:36px;display:inline-flex;align-items:center}.field{display:flex;flex-direction:column;gap:6px;margin-bottom:var(--space-3)}.field--block{width:100%}.field__label{font-size:.9rem;color:var(--color-text-muted)}.field__hint{margin:0;font-size:.8rem;color:var(--color-text-subtle)}.field__error{margin:0;font-size:.85rem;color:var(--color-overdue)}.input{width:100%;min-height:var(--tap-target);padding:0 var(--space-3);border-radius:var(--radius-sm);border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text)}.input:focus{outline:2px solid var(--color-accent);outline-offset:1px}.input--invalid{border-color:var(--color-overdue)}.input--compact{width:7rem;min-height:36px}.input--select{-webkit-appearance:auto;-moz-appearance:auto;appearance:auto}.checkbox{display:flex;align-items:flex-start;gap:var(--space-3);min-height:var(--tap-target);cursor:pointer;padding:var(--space-2) 0}.checkbox input{width:18px;height:18px;margin-top:3px;accent-color:var(--color-accent)}.checkbox__text{display:flex;flex-direction:column;gap:2px}.checkbox__hint{color:var(--color-text-subtle);font-size:.85rem}.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);margin-bottom:var(--space-4)}.card--padded{padding:var(--space-4)}.card__header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);margin-bottom:var(--space-3);flex-wrap:wrap}.card__title{margin:0;font-size:1.1rem}.card__actions{display:flex;gap:var(--space-2);flex-wrap:wrap}.form-card,.auth-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-5);max-width:480px}.auth-card{margin:var(--space-6) auto}.auth-card__title{margin:0 0 var(--space-2);font-size:1.5rem}.auth-card__subtitle{margin:0 0 var(--space-4);color:var(--color-text-muted)}.auth-card__link{margin-top:var(--space-4);text-align:center;color:var(--color-text-muted)}.auth-page{min-height:100vh;padding:var(--space-4);background:var(--color-bg)}.form-actions{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-top:var(--space-2)}.form-error{margin:0 0 var(--space-3);padding:var(--space-3);border-radius:var(--radius-sm);background:#ef44441f;border:1px solid rgba(239,68,68,.4);color:var(--color-overdue)}.badge{display:inline-flex;align-items:center;min-height:28px;padding:0 10px;border-radius:999px;font-size:.85rem;font-weight:600;border:1px solid transparent;white-space:nowrap}.badge--compact{min-height:24px;font-size:.8rem;padding:0 8px}.badge--ok{color:var(--color-ok);background:#22c55e1f;border-color:#22c55e59}.badge--soon{color:var(--color-soon);background:#eab3081f;border-color:#eab30859}.badge--overdue{color:var(--color-overdue);background:#ef44441f;border-color:#ef444459}.badge--muted{color:var(--color-text-muted);background:var(--color-surface-raised);border-color:var(--color-border)}.skeleton{display:block;background:linear-gradient(90deg,var(--color-surface-raised) 25%,#252a35 50%,var(--color-surface-raised) 75%);background-size:200% 100%;animation:shimmer 1.2s ease-in-out infinite}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.skeleton-list{display:flex;flex-direction:column;gap:var(--space-3)}.skeleton-list__row{display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-4);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface)}.empty-state,.error-state{text-align:center;padding:var(--space-6) var(--space-4);border:1px dashed var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);margin-bottom:var(--space-4)}.empty-state__title{margin:0 0 var(--space-2);font-weight:600}.empty-state__text,.error-state__title{margin:0 0 var(--space-3);color:var(--color-text-muted)}.error-state{border-color:#ef444466}.error-state__title{color:var(--color-overdue);font-weight:600}.modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;background:#0000008c;display:grid;place-items:center;padding:var(--space-4)}.modal__dialog{width:min(480px,100%);max-height:min(90vh,800px);overflow:auto;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-4)}.modal__dialog--wide{width:min(640px,100%)}.modal__header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);margin-bottom:var(--space-3)}.modal__title{margin:0;font-size:1.15rem}.modal__close{min-width:40px;min-height:40px;border:none;background:transparent;color:var(--color-text-muted);font-size:1.5rem;line-height:1;cursor:pointer;border-radius:var(--radius-sm)}.modal__close:hover{color:var(--color-text);background:var(--color-surface-raised)}.modal__text{margin:0 0 var(--space-3);color:var(--color-text-muted)}.modal__footer{display:flex;justify-content:flex-end;gap:var(--space-2);margin-top:var(--space-4);flex-wrap:wrap}.toaster{position:fixed;top:var(--space-3);right:var(--space-3);z-index:200;display:flex;flex-direction:column;gap:var(--space-2);max-width:min(360px,calc(100vw - 24px))}.toast{border:1px solid var(--color-border);background:var(--color-surface-raised);color:var(--color-text);border-radius:var(--radius-sm);padding:var(--space-3);text-align:left;cursor:pointer;box-shadow:0 8px 24px #00000059}.toast--success{border-color:#22c55e80}.toast--error{border-color:#ef444480}.toast--info{border-color:#4f8cff80}.callout{border:1px solid var(--color-border);background:var(--color-surface);border-radius:var(--radius-md);padding:var(--space-3) var(--space-4);margin-bottom:var(--space-4);color:var(--color-text-muted)}.callout p{margin:0 0 var(--space-2)}.callout p:last-child{margin-bottom:0}.callout--info{border-color:#4f8cff66;background:#4f8cff14;color:var(--color-text)}.counter{display:inline-flex;align-items:center;min-height:28px;padding:0 10px;border-radius:999px;font-size:.85rem;font-weight:600}.counter--overdue{color:var(--color-overdue);background:#ef44441f}.counter--soon{color:var(--color-soon);background:#eab3081f}.chip{min-height:36px;padding:0 12px;border-radius:999px;border:1px solid var(--color-border);background:var(--color-surface-raised);color:var(--color-text-muted);cursor:pointer}.chip.is-active{color:var(--color-accent);border-color:var(--color-accent)}.filter-row{display:flex;flex-wrap:wrap;gap:var(--space-2);margin:var(--space-3) 0}.btn-file{position:relative;overflow:hidden}.btn-file input{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;cursor:pointer}.dashboard-grid{display:grid;gap:var(--space-3)}.car-card__meta{display:flex;gap:var(--space-2);margin-bottom:var(--space-2)}.car-card__mileage{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2);margin-bottom:var(--space-3)}.quick-mileage{display:flex;gap:var(--space-2);align-items:center}.car-card__counters{display:flex;flex-wrap:wrap;gap:var(--space-2)}.urgent-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--space-3)}.urgent-list__item{display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-3);border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface-raised)}.urgent-list__main{display:flex;flex-direction:column;gap:2px}.urgent-list__car{font-weight:600}.urgent-list__title{color:var(--color-text)}.urgent-list__side{display:flex;flex-wrap:wrap;gap:var(--space-2);align-items:center}.mileage-card__form{display:flex;flex-wrap:wrap;gap:var(--space-2);align-items:flex-end;margin-bottom:var(--space-2)}.mileage-card__form .field{margin-bottom:0;min-width:140px}.summary-card__row{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-bottom:var(--space-2)}.position-list{display:flex;flex-direction:column;gap:var(--space-3)}.position-card{border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-3);background:var(--color-surface-raised)}.position-card--overdue{border-color:#ef444473}.position-card--soon{border-color:#eab30873}.position-card__head{display:flex;justify-content:space-between;gap:var(--space-2);align-items:flex-start;flex-wrap:wrap;margin-bottom:var(--space-2)}.position-card__title{margin:0;font-size:1rem}.position-card__meta{display:flex;flex-direction:column;gap:2px;margin-bottom:var(--space-3);font-size:.95rem}.position-card__actions{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-bottom:var(--space-3)}.replacement-form{margin-bottom:var(--space-3);padding-top:var(--space-2);border-top:1px dashed var(--color-border)}.history__body{margin-top:var(--space-2)}.history__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--space-2)}.history__item{padding:var(--space-2) var(--space-3);border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface)}.history__row{display:flex;flex-wrap:wrap;gap:var(--space-2);font-weight:500}.history__comment{margin:var(--space-1) 0;color:var(--color-text-muted);font-size:.9rem}.history__actions{display:flex;gap:var(--space-2);margin-top:var(--space-2)}.template-list,.invite-list,.backup-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--space-2)}.template-list__item,.invite-list__item,.backup-list__item,.admin-card{display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-3);border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface-raised)}.invite-list__item,.backup-list__item{flex-direction:row;justify-content:space-between;align-items:flex-start;gap:var(--space-3);flex-wrap:wrap}.template-list__main{display:flex;flex-direction:column;gap:2px}.template-list__actions,.admin-card__head{display:flex;flex-wrap:wrap;gap:var(--space-2);align-items:center}.admin-card__meta{display:flex;flex-direction:column;gap:2px}.inline-form{margin-top:var(--space-3);padding-top:var(--space-3);border-top:1px solid var(--color-border)}@media(min-width:700px){.dashboard-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.urgent-list__item{flex-direction:row;justify-content:space-between;align-items:flex-start}.admin-card__meta{flex-direction:row;flex-wrap:wrap;gap:var(--space-3)}}
