/* ══════════════════════════════════════════════════════════════════
   ИНТЕРФЕЙС «ВОКРУГ МАШИНЫ»

   Стили перенесены со стенда, который заказчик принял 28.08.2026,
   без переизобретения. Каждый селектор ограничен корнем .v2: имена
   (.card, .btn, .head) совпадают с боевыми, и без области действия
   старый интерфейс поехал бы.

   Правки вносить здесь, а не в styles.css — это отдельный слой,
   живущий за флагом wb:ui:v2. Обвязка витрины (боковое меню, панель
   пояснений, корпус телефона) при переносе выброшена.
   ══════════════════════════════════════════════════════════════════ */

/* Корпус: в витрине это был телефон в рамке, здесь — весь экран. */
.v2{
  position:fixed; inset:0; z-index:30;
  display:flex; flex-direction:column;
  padding-bottom:env(safe-area-inset-bottom,0);
}
.v2[hidden]{display:none}

.v2{--ink:#06080B;--surface:#0D1116;--raised:#131920;--line:#212832;--line-soft:#171D25;
 --text:#E9EDF3;--muted:#8D98A7;--dim:#5B6572;--hi:#DDE4EC;--lo:#7E8894;
 /* действие — «белый лак»: единственный акцент интерфейса */
 --car:#1A2430;--car-lit:#EDF1F7;--acc-ink:#0A0D11;
 --glow:rgba(190,214,255,.28);
 /* материалы: цвет здесь означает покрытие, а не украшает */
 --ppf:#A9B6C6;--cer:#4FD1C5;--none:#FF7A4D;--dmg:#FFB454;
 /* типографическая шкала: восемь ступеней, ничего между ними */
 --t1:10px;--t2:11.5px;--t3:13px;--t4:15px;--t5:18px;--t6:22px;--t7:28px;
 /* сетка отступов, шаг 4 */
 --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:20px;--s6:24px}
/* цифры всегда табличные: суммы, даты и VIN должны стоять в колонку */.v2 .num, .v2 .money, .v2 .tile b, .v2 .pass b, .v2 .vin, .v2 time, .v2 .zi time, .v2 .slots button, .v2 .days button b{font-variant-numeric:tabular-nums}
/* разряды в моно стоят слишком широко: 61 510 читалось как два числа.
   Сжимаем только сами числа — подписи рядом должны дышать как обычно. */.v2 .num, .v2 .money, .v2 .tile b, .v2 .svc em{word-spacing:-.3em}.v2 .num small, .v2 .tile span, .v2 .money s, .v2 .pass span{word-spacing:normal}.v2, .v2 *{box-sizing:border-box}.v2{margin:0;background:#040608;color:var(--text);
 font:15px/1.5 Onest,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,system-ui,sans-serif}
/* три роли и ни одной сверх того: Unbounded — заголовки, JetBrains Mono — цифры
   и служебные подписи, Onest — всё остальное. При первом переносе эти две
   строки потерялись, и интерфейс на стенд был не похож именно поэтому. */
.v2 .mark,.v2 .ident h2,.v2 .sheet h3{font-family:Unbounded,Onest,system-ui,sans-serif}
.v2 .eyebrow,.v2 .vin,.v2 .num,.v2 .money,.v2 .tile span,.v2 .tile b,.v2 .pass b,.v2 .row time,
.v2 .zi time,.v2 .share b,.v2 .slots button,.v2 .days button b{font-family:"JetBrains Mono",ui-monospace,monospace}
/* блик по верхней кромке — как отражение лампы на лаке; в витрине он лежал на корпусе телефона */
.v2::after{content:"";position:absolute;inset:0 0 auto;height:1px;z-index:9;pointer-events:none;
 background:linear-gradient(90deg,transparent,rgba(233,237,243,.30) 30%,rgba(233,237,243,.10) 70%,transparent)}

/* ── телефон ── */.v2 .head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 16px;
 border-bottom:1px solid var(--line-soft);flex:0 0 auto}.v2 .mark{font-weight:600;font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--hi)}.v2 .pick{display:flex;align-items:center;gap:var(--s2);padding:6px var(--s3);background:var(--raised);
 border:1px solid var(--line);border-radius:999px;font-size:var(--t3);cursor:pointer;color:var(--text);
 max-width:62%;min-width:0}.v2 .pick b{font-weight:inherit;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.v2 .pick i{flex:0 0 auto;width:6px;height:6px;border-radius:50%;background:var(--car-lit);
 box-shadow:0 0 10px var(--glow)}.v2 .body{flex:1;overflow-y:auto;overflow-x:hidden}.v2 .body::-webkit-scrollbar{width:0}.v2 .photo{position:relative;line-height:0;background:#07090C}.v2 .photo img{width:100%;display:block}.v2 .photo svg{position:absolute;inset:0;width:100%;height:100%}
/* невыбранные детали — только тонкий контур, иначе машина тонет в заливке */.v2 .zn{fill-opacity:.05;stroke-width:1.5;vector-effect:non-scaling-stroke;stroke-opacity:.45;cursor:pointer;
 transition:fill-opacity .15s,stroke-opacity .15s,stroke-width .15s}.v2 .zn:hover{fill-opacity:.22;stroke-opacity:.9}.v2 .zn.on{fill-opacity:.42;stroke-width:3;stroke-opacity:1}.v2 .hint{position:absolute;left:0;right:0;bottom:var(--s2);text-align:center;
 font-size:var(--t2);color:var(--muted)}.v2 .views{display:flex;gap:6px;justify-content:center;padding:9px 16px 0;flex-wrap:wrap}.v2 .views button{padding:6px 11px;border-radius:999px;border:1px solid var(--line);background:var(--surface);
 color:var(--muted);font:inherit;font-size:11.5px;cursor:pointer}.v2 .views button.on{border-color:var(--car-lit);color:var(--text)}.v2 .modes{display:flex;gap:4px;margin:11px 16px 0;padding:4px;background:var(--raised);border:1px solid var(--line);border-radius:11px}.v2 .modes button{flex:1;padding:var(--s2);border:0;border-radius:8px;background:transparent;
 color:var(--muted);font:inherit;font-size:var(--t3);font-weight:600;cursor:pointer}.v2 .modes button.on{background:var(--surface);color:var(--text)}.v2 .card.next{border-color:rgba(233,237,243,.20);
 background:linear-gradient(180deg,rgba(233,237,243,.045),transparent)}.v2 .card.warn{border-color:rgba(255,180,84,.42);
 background:linear-gradient(180deg,rgba(255,180,84,.05),transparent)}.v2 .card.promo{cursor:pointer;transition:border-color .16s ease}.v2 .card.promo:hover{border-color:rgba(233,237,243,.28)}
/* категория показывается работой: фотография несёт смысл, иконка его только называла */.v2 .cats{display:grid;gap:9px;margin:var(--s3) var(--s4)}.v2 .cat{position:relative;height:98px;border-radius:16px;overflow:hidden;cursor:pointer;
 border:1px solid var(--line-soft);background:var(--surface)}.v2 .cat img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
 transform:scale(1.03);transition:transform .6s cubic-bezier(.2,.7,.3,1)}.v2 .cat:hover img{transform:scale(1.09)}.v2 .cat:hover{border-color:rgba(233,237,243,.24)}.v2 .cat::after{content:"";position:absolute;inset:0;z-index:1;
 background:linear-gradient(90deg,rgba(6,8,11,.96),rgba(6,8,11,.88) 34%,rgba(6,8,11,.58) 62%,rgba(6,8,11,.20))}.v2 .cat::before{content:"";position:absolute;inset:0 0 auto;height:1px;z-index:3;
 background:linear-gradient(90deg,rgba(233,237,243,.34),rgba(233,237,243,.06) 46%,transparent)}.v2 .cat .in{position:absolute;inset:0;z-index:2;display:flex;align-items:center;
 gap:var(--s3);padding:0 14px}.v2 .cat b{display:block;font-size:var(--t4);font-weight:600;letter-spacing:-.012em;line-height:1.2}.v2 .cat p{margin:3px 0 0;font-size:var(--t2);color:var(--muted);line-height:1.3}.v2 .cat em{font-style:normal;display:block;margin-top:5px;font-size:var(--t2);color:var(--hi);
 font-family:"JetBrains Mono",ui-monospace,monospace;letter-spacing:-.01em}.v2 .cat u{margin-left:auto;flex:0 0 auto;width:32px;height:32px;border-radius:50%;text-decoration:none;
 display:grid;place-items:center;background:var(--car-lit);color:var(--acc-ink);
 font-size:15px;box-shadow:0 6px 18px -10px var(--glow)}.v2 .search{display:flex;align-items:center;gap:var(--s2);margin:0 var(--s4);padding:11px var(--s3);
 border-radius:11px;background:var(--raised);border:1px solid var(--line);color:var(--dim);font-size:var(--t3)}.v2 .search span{opacity:.7}.v2 .mrow{display:flex;align-items:center;gap:var(--s3);padding:10px 0;border-bottom:1px solid var(--line-soft)}.v2 .mrow:last-child{border-bottom:0}.v2 .mrow i{width:10px;height:10px;border-radius:3px;flex:0 0 auto}.v2 .mrow div{flex:1;min-width:0}.v2 .mrow b{display:block;font-size:var(--t3);font-weight:600}.v2 .mrow p{margin:2px 0 0;font-size:var(--t2);color:var(--muted)}.v2 .mdel{width:30px;height:30px;border-radius:8px;border:1px solid var(--line);background:var(--surface);
 color:var(--dim);font:inherit;font-size:var(--t3);cursor:pointer;flex:0 0 auto}.v2 .dock{position:absolute;left:0;right:0;bottom:58px;padding:var(--s3) var(--s4);
 background:linear-gradient(180deg,transparent,var(--ink) 26%);z-index:6}.v2 .sheet .opt{min-height:52px}.v2 .chips{display:flex;gap:7px;flex-wrap:wrap}.v2 .chips button{padding:8px var(--s3);border-radius:999px;border:1px solid var(--line);
 background:var(--surface);color:var(--muted);font:inherit;font-size:var(--t3);cursor:pointer}.v2 .chips button.on{border-color:var(--car-lit);color:var(--text);background:var(--raised)}.v2 .dots{display:flex;gap:5px}.v2 .dots i{width:16px;height:16px;border-radius:50%;border:1px solid rgba(255,255,255,.16)}.v2 .tile{flex:1;padding:11px;background:var(--raised);border:1px solid var(--line-soft);border-radius:11px}.v2 .tile span{display:block;font-size:var(--t1);font-weight:500;
 letter-spacing:.16em;color:var(--dim);line-height:1}.v2 .tile b{display:block;font-size:var(--t5);font-weight:500;
 margin:var(--s1) 0 2px;line-height:1.15;letter-spacing:-.01em}.v2 .tile em{font-style:normal;font-size:var(--t2);color:var(--muted);line-height:1.3}.v2 .days{display:flex;gap:6px}.v2 .days button{flex:1;padding:8px 0;border-radius:10px;border:1px solid var(--line);background:var(--surface);
 color:var(--muted);font:inherit;font-size:11px;cursor:pointer}.v2 .days button b{display:block;font-size:15px;color:var(--text);margin-top:2px}.v2 .days button.on{border-color:var(--car-lit);background:var(--raised)}.v2 .days button.on b{color:var(--car-lit)}.v2 .slots{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}.v2 .slots button{padding:9px 0;border-radius:9px;border:1px solid var(--line);background:var(--surface);
 color:var(--text);font:inherit;font-size:12.5px;cursor:pointer}.v2 .slots button.on{background:var(--car-lit);border-color:transparent;color:var(--acc-ink);font-weight:600}.v2 .slots button.off{opacity:.32;text-decoration:line-through}.v2 .chk-row{display:flex;align-items:center;gap:var(--s3);padding:10px 0;
 border-bottom:1px solid var(--line-soft);font-size:var(--t3);line-height:1.4}.v2 .chk-row:last-child{border-bottom:0}.v2 .chk-row span:first-child{flex:1}.v2 .yn{display:flex;gap:6px}.v2 .yn b{width:32px;height:30px;border-radius:8px;border:1px solid var(--line);display:flex;
 align-items:center;justify-content:center;font-size:13px;color:var(--dim);font-weight:400}.v2 .yn b.ok{background:rgba(79,209,197,.14);border-color:var(--cer);color:var(--cer)}.v2 .yn b.no{background:rgba(255,180,84,.15);border-color:var(--dmg);color:var(--dmg)}.v2 .ident{padding:var(--s4) var(--s4) var(--s1)}.v2 .ident h2{margin:0;font-size:25px;font-weight:600;letter-spacing:-.015em;line-height:1.12}.v2 .vin{margin-top:6px;font-family:"JetBrains Mono",monospace;font-size:var(--t2);
 color:var(--muted);letter-spacing:.02em;line-height:1.45}.v2 .vin s{color:var(--dim);text-decoration:none}.v2 .card{position:relative;margin:var(--s3) var(--s4);padding:var(--s4);background:var(--surface);
 border:1px solid var(--line-soft);border-radius:16px}.v2 .card::before{content:"";position:absolute;inset:0 0 auto;height:1px;border-radius:16px 16px 0 0;
 background:linear-gradient(90deg,rgba(233,237,243,.42),rgba(233,237,243,.10) 42%,transparent 78%)}.v2 .eyebrow{display:flex;justify-content:space-between;align-items:baseline;gap:var(--s3);
 margin-bottom:var(--s3);font-size:10.5px;font-weight:500;
 letter-spacing:.15em;text-transform:uppercase;color:var(--dim);line-height:1.2}.v2 .eyebrow em{font-style:normal;color:var(--muted);font-size:var(--t2);letter-spacing:.01em;
 text-transform:none;font-weight:400}.v2 .legend{display:flex;flex-wrap:wrap;gap:7px 14px;margin-bottom:11px;font-size:11.5px;color:var(--muted)}.v2 .legend i{display:inline-block;width:9px;height:9px;border-radius:2px;margin-right:6px}.v2 .zi{padding:12px;background:var(--raised);border:1px solid var(--line-soft);border-radius:10px;min-height:76px}.v2 .zi b{font-size:var(--t4);font-weight:600;line-height:1.25;letter-spacing:-.005em}.v2 .zi p{margin:var(--s1) 0 0;font-size:var(--t3);color:var(--muted);line-height:1.45}.v2 .zi time{display:block;margin-top:var(--s2);font-family:"JetBrains Mono",monospace;
 font-size:var(--t2);color:var(--dim);letter-spacing:.02em;line-height:1.4}.v2 .gauge{position:relative;height:22px;margin:2px 0 8px}.v2 .ticks{position:absolute;inset:auto 0 0;height:22px;display:flex;justify-content:space-between}.v2 .ticks i{width:1px;height:7px;background:var(--line);align-self:flex-end}.v2 .ticks i.m{height:13px;background:var(--lo)}.v2 .fill{position:absolute;left:0;bottom:0;height:2px;
 background:linear-gradient(90deg,rgba(233,237,243,.35),var(--car-lit));transition:width .5s}.v2 .grow{display:flex;justify-content:space-between;align-items:baseline;gap:10px}.v2 .num{font-size:var(--t6);font-weight:500;line-height:1.1;letter-spacing:-.02em}.v2 .num small{font-size:var(--t3);font-weight:500;color:var(--muted);margin-left:var(--s1)}.v2 .note{font-size:var(--t2);color:var(--dim);text-align:right;line-height:1.4}.v2 .sw{display:flex;gap:9px;overflow-x:auto;padding:2px 0 4px;scrollbar-width:none}.v2 .sw::-webkit-scrollbar{display:none}.v2 .sw button{width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.15);
 flex:0 0 auto;position:relative;cursor:pointer;padding:0}.v2 .sw button.on{box-shadow:0 0 0 2px var(--ink),0 0 0 3px var(--hi)}.v2 .sw button i{position:absolute;left:22%;top:14%;width:46%;height:24%;border-radius:50%;
 background:linear-gradient(180deg,rgba(255,255,255,.45),transparent)}.v2 .btn{display:flex;align-items:center;justify-content:space-between;gap:var(--s3);
 margin:var(--s2) var(--s4);min-height:50px;padding:11px var(--s4);border-radius:12px;
 text-align:left;line-height:1.25;
 border:1px solid var(--line);background:var(--surface);font:inherit;font-size:var(--t4);
 font-weight:600;color:var(--text);cursor:pointer;width:calc(100% - var(--s4) * 2)}.v2 .btn.primary{background:linear-gradient(180deg,#FFFFFF,#D9E1EC);border-color:transparent;
 color:var(--acc-ink);box-shadow:0 6px 22px -12px var(--glow)}.v2 .btn.off{background:var(--raised);border:1px solid var(--line);color:var(--dim);cursor:default}.v2 .btn.off span{color:var(--line)}.v2 .btn span{flex:0 0 auto;color:var(--dim);font-size:17px}.v2 .btn.primary span{color:rgba(10,13,17,.45)}.v2 .row{display:flex;gap:11px;padding:12px 0;border-bottom:1px solid rgba(233,237,243,.06);align-items:center}.v2 .row:last-child{border-bottom:0}.v2 .row img{width:74px;height:52px;object-fit:cover;border-radius:8px;flex:0 0 auto}.v2 .row div{flex:1;min-width:0}.v2 .row b{display:block;font-size:var(--t3);font-weight:600;line-height:1.3}.v2 .row p{margin:2px 0 0;font-size:var(--t2);color:var(--muted);line-height:1.35;
 white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.v2 .row time{font-family:"JetBrains Mono",monospace;font-size:var(--t2);color:var(--dim);letter-spacing:.02em}.v2 .money{font-weight:500;font-size:var(--t3);white-space:nowrap;letter-spacing:-.01em}.v2 .pass{display:flex;justify-content:space-between;gap:var(--s3);padding:10px 0;
 border-bottom:1px solid var(--line-soft);font-size:var(--t3);line-height:1.4}.v2 .pass:last-child{border-bottom:0}.v2 .pass span{color:var(--muted)}.v2 .pass b{font-family:"JetBrains Mono",monospace;font-size:var(--t2);font-weight:500;
 letter-spacing:.02em;text-align:right}.v2 .share{margin:var(--s3) var(--s4);padding:var(--s3) var(--s4);border-radius:12px;
 border:1px dashed var(--line);background:rgba(233,237,243,.04);font-size:var(--t3);
 color:var(--muted);line-height:1.5}.v2 .share b{display:block;color:var(--text);font-family:"JetBrains Mono",monospace;
 font-size:var(--t2);margin-top:var(--s2);letter-spacing:.02em}.v2 .tabs{display:flex;border-top:1px solid var(--line-soft);background:var(--ink);flex:0 0 auto}.v2 .tabs button{flex:1;padding:10px 0 var(--s3);border:0;background:transparent;color:var(--dim);
 font:inherit;font-size:var(--t1);letter-spacing:.02em;cursor:pointer}.v2 .tabs button.on{color:var(--text)}.v2 .tabs u{display:block;font-size:15px;text-decoration:none;margin-bottom:2px;opacity:.85}.v2 .tool{display:flex;gap:7px;margin:11px 16px 0;flex-wrap:wrap}.v2 .tool button{padding:8px 12px;border-radius:9px;border:1px solid var(--line);background:var(--surface);
 color:var(--text);font:inherit;font-size:12.5px;cursor:pointer;display:flex;align-items:center;gap:7px}.v2 .tool button.on{border-color:currentColor}.v2 .tool button i{width:10px;height:10px;border-radius:3px;display:inline-block}.v2 .svc{display:flex;align-items:center;gap:12px;padding:11px 0;border-bottom:1px solid var(--line-soft)}.v2 .svc:last-child{border-bottom:0}.v2 .svc u.pic{padding:0;overflow:hidden;border-color:var(--line-soft)}.v2 .svc u.pic img{width:100%;height:100%;object-fit:cover;display:block}.v2 .svc u{width:38px;height:38px;border-radius:10px;background:var(--raised);border:1px solid var(--line);
 flex:0 0 auto;display:flex;align-items:center;justify-content:center;text-decoration:none;font-size:17px}.v2 .svc div{flex:1}.v2 .svc b{display:block;font-size:var(--t3);font-weight:600;line-height:1.3}.v2 .svc p{margin:2px 0 0;font-size:var(--t2);color:var(--muted);line-height:1.35}.v2 .svc em{font-style:normal;font-weight:500;font-size:var(--t3);color:var(--muted);
 font-family:"JetBrains Mono",ui-monospace,monospace}.v2 .sheet{position:absolute;left:0;right:0;bottom:0;background:var(--surface);border-top:1px solid var(--line);
 border-radius:18px 18px 0 0;padding:16px;transform:translateY(101%);transition:transform .28s cubic-bezier(.2,.7,.2,1);z-index:9}.v2 .sheet.on{transform:none}.v2 .sheet h3{margin:0 0 12px;font-size:17px;font-weight:600;letter-spacing:-.01em}.v2 .sheet .opt{display:flex;align-items:center;gap:11px;padding:11px;border-radius:10px;cursor:pointer}.v2 .sheet .opt:hover{background:var(--raised)}.v2 .sheet .opt i{width:11px;height:11px;border-radius:3px}

/* ══════════════════════════════════════════════════════════════════
   ДОПОЛНЕНИЯ К ПЕРЕНЕСЁННЫМ СТИЛЯМ

   Того, чего на стенде не было: он показывал заполненные экраны, а
   живому приложению нужны ещё ожидание, пустой гараж и правка машины.
   Всё построено на тех же токенах, никаких новых величин.
   ══════════════════════════════════════════════════════════════════ */

/* Место снимка, пока снимка нет. Не занимает высоту кадра: пустой
   прямоугольник в четверть экрана читается как дыра, а не как место. */
.v2 .photo.empty{
  display:flex; align-items:center; min-height:78px; padding:0 var(--s4);
  background:
    linear-gradient(101deg,transparent 8%,rgba(233,237,243,.10) 17%,transparent 26%),
    linear-gradient(101deg,transparent 64%,rgba(233,237,243,.05) 73%,transparent 81%),
    #07090C;
  border-bottom:1px solid var(--line-soft);
}
.v2 .photo.empty .ph{font-size:var(--t3); color:var(--dim); line-height:1.4}

/* Последний визит — событие, а не характеристика машины: своей строкой. */
.v2 .ident .seen{margin-top:var(--s1); font-size:var(--t2); color:var(--dim)}

/* Снимок 680×453 в стенде; резервируем высоту, чтобы экран не прыгал,
   пока картинка едет по сети. */
.v2 .photo img{aspect-ratio:680/453; object-fit:cover}

/* Шторка выбора машины закрывается касанием мимо неё — для этого подложка. */
.v2 .veil{position:absolute; inset:0; z-index:8; background:rgba(4,6,8,.55); opacity:0;
  pointer-events:none; transition:opacity .28s ease}
.v2 .veil.on{opacity:1; pointer-events:auto}
.v2 .sheet{padding-bottom:calc(16px + env(safe-area-inset-bottom,0))}
.v2 .sheet .opt b{display:block; font-size:var(--t4); font-weight:600}
.v2 .sheet .opt div{flex:1; min-width:0}

/* Короткое подтверждение действия — вместо всплывающего окна, которое в
   Telegram роняет фантомный тап на кнопку под ним. */
.v2 .toast{position:absolute; left:var(--s4); right:var(--s4); bottom:70px; z-index:10;
  padding:var(--s3) var(--s4); border-radius:12px; background:var(--raised);
  border:1px solid var(--line); color:var(--text); font-size:var(--t3); line-height:1.4;
  box-shadow:0 12px 30px -14px rgba(0,0,0,.8); pointer-events:none;
  transform:translateY(8px); opacity:0; transition:opacity .2s ease,transform .2s ease}
.v2 .toast.on{opacity:1; transform:none}

/* Листание недель в заголовке карточки и ссылка-повтор внутри абзаца. */
.v2 .wk{padding:0 6px; border:1px solid var(--line); border-radius:6px; background:var(--raised);
  color:var(--text); font:inherit; font-size:var(--t3); line-height:18px; cursor:pointer; vertical-align:middle}
.v2 .lnk{padding:0; border:0; background:none; color:var(--text); font:inherit; text-decoration:underline; cursor:pointer}
.v2 .days button:disabled{opacity:.32; cursor:default}
.v2 .search input::placeholder{color:var(--dim)}
.v2 .card.warn .fhint{color:var(--dmg)}

.v2 .btn.quiet{
  background:transparent; border-color:transparent; color:var(--dim);
  font-weight:400; font-size:var(--t2); min-height:38px;
}
.v2 .btn.quiet:active{color:var(--muted)}

/* Поля правки машины. */
.v2 label.f{display:block; margin-bottom:var(--s3)}
.v2 label.f span{
  display:block; margin-bottom:var(--s1);
  font-size:var(--t1); letter-spacing:.14em; text-transform:uppercase; color:var(--muted);
  font-family:"JetBrains Mono",ui-monospace,monospace;
}
.v2 label.f input{
  width:100%; min-height:44px; padding:0 var(--s3);
  background:var(--ink); border:1px solid var(--line); border-radius:var(--s3);
  color:var(--text); font:inherit; font-size:var(--t4);
}
.v2 label.f input:focus{outline:none; border-color:var(--car-lit)}
.v2 label.f input::placeholder{color:var(--dim)}
.v2 .fhint{margin:calc(var(--s2) * -1) 0 var(--s4); font-size:var(--t2); color:var(--dim); line-height:1.45}
/* Абзац в карточке. Не .note — так на стенде зовётся подпись справа от шкалы. */
.v2 .para{margin:0 0 var(--s3); font-size:var(--t3); color:var(--muted); line-height:1.5}

/* Ожидание данных. */
.v2 .skel{
  height:112px; margin:var(--s4); border-radius:16px; border:1px solid var(--line-soft);
  background:linear-gradient(100deg,var(--surface) 30%,var(--raised) 50%,var(--surface) 70%);
  background-size:220% 100%; animation:v2shimmer 1.4s linear infinite;
}
.v2 .skel.s2{height:88px; margin-top:0}
@keyframes v2shimmer{to{background-position:-120% 0}}
@media (prefers-reduced-motion:reduce){ .v2 .skel{animation:none} }

.v2 .btn:focus-visible,.v2 .tabs button:focus-visible,.v2 .pick:focus-visible{
  outline:2px solid var(--car-lit); outline-offset:2px;
}
/* Пока слой открыт, прежнее приложение прячем целиком: оно не должно ни
   прокручиваться под ним, ни просвечивать по краям. */
body.v2-on{overflow:hidden}
body.v2-on #app,body.v2-on .footer,body.v2-on .offline-banner{display:none}
