*{box-sizing:border-box}
:root{
  --bg:#eef1f4;--card:#fff;--ink:#141a21;--dim:#66707c;--line:#dde3e9;
  --accent:#1d6f8f;--due:#c73d3d;--soon:#b4740d;--ok:#2c7a4b;--new:#5b6470;
}
html,body{margin:0;padding:0}
body{background:var(--bg);color:var(--ink);font:17px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,system-ui,sans-serif;-webkit-text-size-adjust:100%}
.wrap{max-width:760px;margin:0 auto;padding:16px 16px 120px}
.top{background:linear-gradient(160deg,#1b2430,#2e3d4e);color:#fff;border-radius:18px;padding:18px;margin-bottom:14px}
.top h1{margin:0;font-size:28px;letter-spacing:-.02em}
.sub{margin:4px 0 14px;color:#b9c4d0;font-size:15px}
.car{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.field{display:block}
.field span{display:block;font-size:13px;color:#9fb0c0;margin-bottom:5px}
.field input,.field select{width:100%;min-height:44px;padding:10px 12px;border-radius:12px;border:1px solid #46586b;background:#111a24;color:#fff;font:inherit;font-size:17px}
.field input:focus,.field select:focus{outline:2px solid #63b3d6}
.summary{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:12px}
.sum-card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:10px 6px;text-align:center;cursor:pointer;font:inherit;color:inherit;min-height:74px}
.sum-card .num{display:block;font-size:25px;font-weight:700;line-height:1.2}
.sum-card .lbl{display:block;font-size:12px;color:var(--dim);margin-top:2px}
.sum-card[data-filter="due"] .num{color:var(--due)}
.sum-card[data-filter="soon"] .num{color:var(--soon)}
.sum-card[data-filter="ok"] .num{color:var(--ok)}
.sum-card.active{border-color:var(--accent);box-shadow:0 0 0 2px rgba(29,111,143,.18)}
.chips{display:flex;flex-wrap:wrap;gap:8px;padding:2px 0 10px}
.chip{flex:0 0 auto;border:1px solid var(--line);background:var(--card);border-radius:999px;padding:9px 15px;font:inherit;font-size:15px;min-height:44px;display:inline-flex;align-items:center;color:var(--ink);cursor:pointer}
.chip.active{background:var(--ink);color:#fff;border-color:var(--ink)}
.list{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:14px}
.card.st-due{border-left:5px solid var(--due)}
.card.st-soon{border-left:5px solid var(--soon)}
.card.st-ok{border-left:5px solid var(--ok)}
.card.st-new{border-left:5px solid var(--new)}
.card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.cat{font-size:12px;color:var(--dim);text-transform:uppercase;letter-spacing:.06em}
.card h3{margin:2px 0 0;font-size:19px}
.badge{flex:0 0 auto;font-size:13px;font-weight:600;padding:6px 11px;border-radius:999px;white-space:nowrap}
.badge.due{background:#fdecec;color:var(--due)}
.badge.soon{background:#fdf3e0;color:var(--soon)}
.badge.ok{background:#e8f5ee;color:var(--ok)}
.badge.new{background:#eceff2;color:var(--new)}
.bar{height:8px;border-radius:999px;background:#e8ecef;margin:12px 0 8px;overflow:hidden}
.bar i{display:block;height:100%;border-radius:999px;background:var(--ok)}
.st-due .bar i{background:var(--due)}
.st-soon .bar i{background:var(--soon)}
.st-new .bar i{background:var(--new)}
.meta{margin:2px 0;font-size:15px}
.dim{color:var(--dim);font-size:14px}
.acts{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}
.btn{min-height:44px;padding:10px 16px;border-radius:12px;border:1px solid transparent;font:inherit;font-size:16px;cursor:pointer}
.btn.primary{background:var(--accent);color:#fff;flex:1 1 auto}
.btn.ghost{background:#fff;border-color:var(--line);color:var(--ink)}
.btn.danger{background:#fff;border-color:#e2b4b4;color:var(--due)}
.empty{text-align:center;color:var(--dim);padding:30px 10px}
.fab{position:fixed;left:50%;transform:translateX(-50%);bottom:16px;width:calc(100% - 32px);max-width:728px;min-height:52px;border:0;border-radius:16px;background:var(--ink);color:#fff;font:inherit;font-size:17px;font-weight:600;box-shadow:0 10px 24px rgba(0,0,0,.22);cursor:pointer}
.backdrop{position:fixed;inset:0;background:rgba(16,22,28,.5);z-index:10}
.sheet{position:fixed;z-index:11;left:0;right:0;bottom:0;max-width:760px;margin:0 auto;background:#fff;border-radius:18px 18px 0 0;padding:18px 16px calc(18px + env(safe-area-inset-bottom));max-height:92vh;overflow:auto}
[hidden]{display:none !important}
.sheet h2{margin:0 0 12px;font-size:21px}
.row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}
.row .field span{color:var(--dim)}
.row .field input,.row .field select{background:#f4f6f8;border:1px solid var(--line);color:var(--ink)}
.sheet-acts{display:flex;gap:8px;margin-top:16px}
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:84px;background:var(--ink);color:#fff;padding:12px 18px;border-radius:12px;font-size:15px;z-index:20;max-width:88vw;text-align:center}
@media (max-width:480px){
  .car{grid-template-columns:1fr}
  .summary{grid-template-columns:repeat(2,1fr)}
  .row{grid-template-columns:1fr}
}
.quick{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:14px;margin:4px 0 16px}
.quick h2{margin:0 0 10px;font-size:20px}
.quick .field span,.backups .dim{color:var(--dim);font-size:14px}
.quick .field input,.quick .field select,.quick .row{margin-top:8px}
.quick .row .field input,.quick .row .field select{background:#f4f6f8;border:1px solid var(--line);color:var(--ink)}
.quick .row{margin-top:0}
.quick .row:first-of-type{margin-top:8px}
.btn.wide{width:100%;margin-top:12px}
.hist{margin:8px 0 0;font-size:15px}
.hist summary{cursor:pointer;color:var(--accent);padding:6px 0}
.hist ul{list-style:none;margin:4px 0 0;padding:0;border-top:1px solid var(--line)}
.hist li{display:flex;justify-content:space-between;gap:10px;padding:7px 0;border-bottom:1px solid var(--line);font-size:15px}
.hist li span:last-child{color:var(--dim)}
.backups{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:14px;margin-top:18px}
.backups h2{margin:0 0 6px;font-size:19px}
.backups p{margin:0 0 10px}

/* несколько автомобилей */
.car-tabs{display:flex;gap:8px;overflow-x:auto;padding:2px 2px 12px;margin:0 -2px;scrollbar-width:none}
.car-tabs::-webkit-scrollbar{display:none}
.car-tab{flex:0 0 auto;min-height:44px;padding:7px 14px;border-radius:12px;border:1px solid #46586b;background:#111a24;color:#fff;font:inherit;font-size:15px;cursor:pointer;text-align:left;line-height:1.25}
.car-tab .ct-name{display:block;font-weight:600;max-width:190px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.car-tab .ct-meta{display:block;font-size:12px;color:#9fb0c0;margin-top:2px}
.car-tab.active{background:#2f6f8f;border-color:#63b3d6}
.car-tab.add{background:transparent;border-style:dashed;color:#cfe0ea;font-weight:600}
.car-now{margin:0 0 10px}
.car-now b{color:var(--ink)}
.field.spaced{margin-top:10px}
.check{display:flex;align-items:center;gap:10px;margin-top:14px;font-size:16px;cursor:pointer}
.check input{width:22px;height:22px;min-height:22px;accent-color:var(--accent)}