/* ═══════════════════════════════════════════════════════════════════════════════════════════
   НЕВСКИЙ · единая дизайн-система «Янтарь и Балтика»  (NEVSKY_DS_V1, #37 п.1, 26.09.2026 Клг)
   Основа — кликабельный макет «Сегодня» (_кабинет_критика_26_09/maket_segodnya.html) и 1_dizain.md §3.2.

   Как подключить:  <link rel="stylesheet" href="nevsky.css">  и  <body class="nv">.
   Тема:     сама по системной настройке; принудительно — data-theme="light|dark" на любом элементе.
   Объект:   data-object="hotel|hostel|parking" (без атрибута — общий янтарь). Ставится на тот же
             элемент, что data-theme, или ВНУТРИ него.
   Цвета НЕ правятся здесь руками: сначала tokens.json, затем этот файл, затем
             python3 _сайты/бренд/система/проверка_системы.py   (сверяет CSS с токенами и контраст)
   Шрифт:    Golos Text (SIL OFL 1.1, шрифты/OFL.txt), свой файл, без Google Fonts; нет файла — системный.
   ═══════════════════════════════════════════════════════════════════════════════════════════ */

@font-face{
  font-family:"Golos Text";
  src:url("fonts/GolosText-var.woff2") format("woff2");
  font-weight:400 900; font-style:normal; font-display:swap;
}

/* ── 1. Цвета: светлая тема ─────────────────────────────────────────────────────────────── */
/* @токены светлая */
:root, [data-theme="light"]{
  color-scheme:light;
  --bg:#FBF4EE; --surface:#FFFFFF; --surface-2:#FFF7F0; --line:#F0E2D4; --line-strong:#8F7A66; --text:#2A1A0E; --muted:#6E5A47; --brand:#DB5C00; --ok:#127A47; --ok-bg:#E6F4EC; --ok-ink:#FFFFFF; --danger:#B3261E; --danger-bg:#FBE4E6; --warn:#8A4B00; --warn-bg:#FFF1DC;
  --common-accent:#B34A00; --common-accent-ink:#FFFFFF; --common-accent-text:#B34A00; --common-hero-a:#A84300; --common-hero-b:#B34A00; --common-hero-text:#FFFFFF; --common-hero-btn:#FFFFFF; --common-hero-btn-ink:#8A3500;
  --hotel-accent:#0F4C5C; --hotel-accent-ink:#FFFFFF; --hotel-accent-text:#0F4C5C; --hotel-hero-a:#0B3A45; --hotel-hero-b:#12566A; --hotel-hero-text:#FFFFFF; --hotel-hero-btn:#FFFFFF; --hotel-hero-btn-ink:#0B3A45;
  --hostel-accent:#BF4F00; --hostel-accent-ink:#FFFFFF; --hostel-accent-text:#A84300; --hostel-hero-a:#AE4800; --hostel-hero-b:#B84C00; --hostel-hero-text:#FFFFFF; --hostel-hero-btn:#FFFFFF; --hostel-hero-btn-ink:#8A3500;
  --parking-accent:#1A56A0; --parking-accent-ink:#FFFFFF; --parking-accent-text:#1A56A0; --parking-hero-a:#0E2E55; --parking-hero-b:#174A8C; --parking-hero-text:#FFFFFF; --parking-hero-btn:#FFFFFF; --parking-hero-btn-ink:#0E2E55;
  --t-amber:#FFE8D6; --i-amber:#B34A00; --t-sea:#DDF1EE; --i-sea:#0F6E66; --t-sky:#E3EEFB; --i-sky:#1F5FAF; --t-rose:#FBE4E6; --i-rose:#A8323E; --t-leaf:#E4F2DF; --i-leaf:#2F6F2A; --t-sand:#F3EBDD; --i-sand:#6B5423;
  --hero-soft:rgba(40,12,0,.18); --hero-line:rgba(255,255,255,.24); --hero-glow:rgba(255,200,140,.10);
  --shadow:0 1px 2px rgba(80,40,10,.06),0 6px 20px rgba(80,40,10,.06);
  --shadow-hero:0 10px 30px rgba(120,48,0,.26);
  --shadow-dock:0 -6px 24px rgba(80,40,10,.10);
  --toast-bg:#2A1A0E; --toast-text:#FFF3E8;
  --backdrop:rgba(42,26,14,.38);
}

/* ── 2. Цвета: тёмная тема (две копии обязаны совпадать — сверяет проверка_системы.py) ──── */
@media (prefers-color-scheme: dark){
  /* @токены тёмная */
  :root:not([data-theme="light"]){
    color-scheme:dark;
    --bg:#15100B; --surface:#211811; --surface-2:#2A1F16; --line:#3A2B1E; --line-strong:#8A7560; --text:#F5E9DD; --muted:#C4AD95; --brand:#FF8A3D; --ok:#5CC48A; --ok-bg:#15291E; --ok-ink:#0E1F15; --danger:#FF8A80; --danger-bg:#35191C; --warn:#FFB866; --warn-bg:#2E2112;
    --common-accent:#FF8A3D; --common-accent-ink:#1A120B; --common-accent-text:#FF8A3D; --common-hero-a:#4E240A; --common-hero-b:#76380F; --common-hero-text:#FFE9D6; --common-hero-btn:#FF8A3D; --common-hero-btn-ink:#1A120B;
    --hotel-accent:#7CC3D2; --hotel-accent-ink:#08262E; --hotel-accent-text:#7CC3D2; --hotel-hero-a:#0A2A33; --hotel-hero-b:#0F4552; --hotel-hero-text:#E6F6F9; --hotel-hero-btn:#7CC3D2; --hotel-hero-btn-ink:#08262E;
    --hostel-accent:#FFA05A; --hostel-accent-ink:#1A120B; --hostel-accent-text:#FFA05A; --hostel-hero-a:#5A2A0A; --hostel-hero-b:#7E3C10; --hostel-hero-text:#FFEBD9; --hostel-hero-btn:#FFA05A; --hostel-hero-btn-ink:#1A120B;
    --parking-accent:#8DB8F0; --parking-accent-ink:#0B1A2E; --parking-accent-text:#8DB8F0; --parking-hero-a:#0C223F; --parking-hero-b:#153A6B; --parking-hero-text:#E8F0FC; --parking-hero-btn:#8DB8F0; --parking-hero-btn-ink:#0B1A2E;
    --t-amber:#3A2413; --i-amber:#FFA566; --t-sea:#12302C; --i-sea:#5EC4B6; --t-sky:#172638; --i-sky:#8DB8F0; --t-rose:#35191C; --i-rose:#F29AA3; --t-leaf:#1A2C18; --i-leaf:#93CF86; --t-sand:#2E2618; --i-sand:#D9C08A;
    --hero-soft:rgba(0,0,0,.22); --hero-line:rgba(255,220,190,.18); --hero-glow:rgba(255,200,140,.10);
    --shadow:0 1px 2px rgba(0,0,0,.4);
    --shadow-hero:0 10px 30px rgba(0,0,0,.45);
    --shadow-dock:0 -6px 24px rgba(0,0,0,.5);
    --toast-bg:#F5E9DD; --toast-text:#2A1A0E;
    --backdrop:rgba(0,0,0,.6);
  }
}
/* @токены тёмная */
[data-theme="dark"]{
    color-scheme:dark;
    --bg:#15100B; --surface:#211811; --surface-2:#2A1F16; --line:#3A2B1E; --line-strong:#8A7560; --text:#F5E9DD; --muted:#C4AD95; --brand:#FF8A3D; --ok:#5CC48A; --ok-bg:#15291E; --ok-ink:#0E1F15; --danger:#FF8A80; --danger-bg:#35191C; --warn:#FFB866; --warn-bg:#2E2112;
    --common-accent:#FF8A3D; --common-accent-ink:#1A120B; --common-accent-text:#FF8A3D; --common-hero-a:#4E240A; --common-hero-b:#76380F; --common-hero-text:#FFE9D6; --common-hero-btn:#FF8A3D; --common-hero-btn-ink:#1A120B;
    --hotel-accent:#7CC3D2; --hotel-accent-ink:#08262E; --hotel-accent-text:#7CC3D2; --hotel-hero-a:#0A2A33; --hotel-hero-b:#0F4552; --hotel-hero-text:#E6F6F9; --hotel-hero-btn:#7CC3D2; --hotel-hero-btn-ink:#08262E;
    --hostel-accent:#FFA05A; --hostel-accent-ink:#1A120B; --hostel-accent-text:#FFA05A; --hostel-hero-a:#5A2A0A; --hostel-hero-b:#7E3C10; --hostel-hero-text:#FFEBD9; --hostel-hero-btn:#FFA05A; --hostel-hero-btn-ink:#1A120B;
    --parking-accent:#8DB8F0; --parking-accent-ink:#0B1A2E; --parking-accent-text:#8DB8F0; --parking-hero-a:#0C223F; --parking-hero-b:#153A6B; --parking-hero-text:#E8F0FC; --parking-hero-btn:#8DB8F0; --parking-hero-btn-ink:#0B1A2E;
    --t-amber:#3A2413; --i-amber:#FFA566; --t-sea:#12302C; --i-sea:#5EC4B6; --t-sky:#172638; --i-sky:#8DB8F0; --t-rose:#35191C; --i-rose:#F29AA3; --t-leaf:#1A2C18; --i-leaf:#93CF86; --t-sand:#2E2618; --i-sand:#D9C08A;
    --hero-soft:rgba(0,0,0,.22); --hero-line:rgba(255,220,190,.18); --hero-glow:rgba(255,200,140,.10);
    --shadow:0 1px 2px rgba(0,0,0,.4);
    --shadow-hero:0 10px 30px rgba(0,0,0,.45);
    --shadow-dock:0 -6px 24px rgba(0,0,0,.5);
    --toast-bg:#F5E9DD; --toast-text:#2A1A0E;
    --backdrop:rgba(0,0,0,.6);
}

/* ── 3. Акцент объекта: --accent / --accent-ink / --accent-text и главная карточка ─────────
   --accent       заливка основной кнопки, полоса, знак
   --accent-ink   надпись и значок ПОВЕРХ --accent («чернила на акценте»)
   --accent-text  акцент как текст: ссылка, «Скопировать», значок в списке — на фоне и карточке
   --on-accent    старое имя из макета, то же самое, что --accent-ink                               */
:root, [data-theme], [data-object="common"]{
  --accent:var(--common-accent); --accent-ink:var(--common-accent-ink); --accent-text:var(--common-accent-text); --on-accent:var(--common-accent-ink);
  --hero-a:var(--common-hero-a); --hero-b:var(--common-hero-b); --hero-text:var(--common-hero-text);
  --hero-btn:var(--common-hero-btn); --hero-btn-ink:var(--common-hero-btn-ink);
}
[data-object="hotel"], [data-object="hotel"] [data-theme]{
  --accent:var(--hotel-accent); --accent-ink:var(--hotel-accent-ink); --accent-text:var(--hotel-accent-text); --on-accent:var(--hotel-accent-ink);
  --hero-a:var(--hotel-hero-a); --hero-b:var(--hotel-hero-b); --hero-text:var(--hotel-hero-text);
  --hero-btn:var(--hotel-hero-btn); --hero-btn-ink:var(--hotel-hero-btn-ink);
}
[data-object="hostel"], [data-object="hostel"] [data-theme]{
  --accent:var(--hostel-accent); --accent-ink:var(--hostel-accent-ink); --accent-text:var(--hostel-accent-text); --on-accent:var(--hostel-accent-ink);
  --hero-a:var(--hostel-hero-a); --hero-b:var(--hostel-hero-b); --hero-text:var(--hostel-hero-text);
  --hero-btn:var(--hostel-hero-btn); --hero-btn-ink:var(--hostel-hero-btn-ink);
}
[data-object="parking"], [data-object="parking"] [data-theme]{
  --accent:var(--parking-accent); --accent-ink:var(--parking-accent-ink); --accent-text:var(--parking-accent-text); --on-accent:var(--parking-accent-ink);
  --hero-a:var(--parking-hero-a); --hero-b:var(--parking-hero-b); --hero-text:var(--parking-hero-text);
  --hero-btn:var(--parking-hero-btn); --hero-btn-ink:var(--parking-hero-btn-ink);
}

/* ── 4. Форма, шрифт, отступы (от темы не зависят) ─────────────────────────────────────── */
:root{
  --font:"Golos Text",-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,"Noto Sans",Arial,sans-serif;
  --fs-xs:12.5px; --fs-sm:13.5px; --fs-md:16px; --fs-section:18px; --fs-h2:21px; --fs-h1:28px; --fs-place:27px; --fs-display:36px; --fs-code:38px;
  --fw-text:400; --fw-btn:700; --fw-head:750; --fw-place:800;
  --lh:1.45; --lh-tight:1.15;
  --r-field:12px; --r-btn:16px; --r-btn-lg:18px; --r-tile:18px; --r-card:22px; --r-hero:26px; --r-pill:999px; --r-ico:13px;
  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:20px; --s-6:24px; --s-7:32px; --s-8:48px;
  --tap:48px; --tap-lg:60px;
  --ease:cubic-bezier(.2,.8,.2,1);
}

/* ── 5. Основа ─────────────────────────────────────────────────────────────────────────── */
.nv, .nv *, .nv *::before, .nv *::after{box-sizing:border-box}
.nv{margin:0;background:var(--bg);color:var(--text);font:var(--fw-text) var(--fs-md)/var(--lh) var(--font);
  -webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}
[data-theme]{background:var(--bg);color:var(--text)}
/* :where() — нулевая сила: базовые правила не перебивают классы компонентов */
:where(.nv) button{font:inherit;color:inherit;cursor:pointer}
:where(.nv) svg{display:block}
.nv :focus-visible{outline:3px solid var(--accent-text);outline-offset:2px;border-radius:6px}
.nv-wrap{max-width:440px;margin:0 auto;padding:max(12px,env(safe-area-inset-top)) var(--s-4) calc(28px + env(safe-area-inset-bottom))}
.nv-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}

/* типографика */
.nv-h1{font-size:var(--fs-h1);line-height:var(--lh-tight);font-weight:var(--fw-head);letter-spacing:-.01em;margin:0 0 var(--s-2)}
.nv-h2{font-size:var(--fs-h2);line-height:1.2;font-weight:var(--fw-head);margin:0 0 var(--s-1)}
.nv-section{font-size:var(--fs-section);font-weight:var(--fw-head);margin:26px 2px 12px}
.nv-lead{font-size:15px;color:var(--muted);margin:0 0 14px}
.nv-small{font-size:var(--fs-sm)} .nv-muted{color:var(--muted)}
.nv-num{font-variant-numeric:tabular-nums}
.nv-link{color:var(--accent-text);font-weight:600;text-decoration:underline;text-underline-offset:3px}

/* знак-точка бренда (временная, пока знак не выбран) */
.nv-logo{display:flex;align-items:center;gap:8px;font-weight:800;letter-spacing:.06em;font-size:15px}
.nv-dot{width:10px;height:10px;border-radius:50%;background:var(--brand);box-shadow:0 0 0 4px color-mix(in srgb,var(--brand) 18%,transparent)}

/* ── 6. Кнопки ─────────────────────────────────────────────────────────────────────────── */
.nv-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:var(--tap);padding:0 18px;border:0;
  border-radius:var(--r-btn);font-weight:var(--fw-btn);font-size:16px;line-height:1.2;text-decoration:none;
  transition:transform .12s ease,background .2s}
.nv-btn svg{width:20px;height:20px;flex:none}
.nv-btn:active{transform:scale(.97)}
.nv-btn[disabled],.nv-btn[aria-disabled="true"]{opacity:.55;cursor:default;transform:none}
.nv-btn--block{display:flex;width:100%}
/* основная — одна на экран: главное действие */
.nv-btn--primary{background:var(--accent);color:var(--accent-ink);min-height:54px;font-size:16.5px;font-weight:var(--fw-head)}
/* вторая — спокойная, рядом с основной или парами («Позвонить» / «Написать») */
.nv-btn--secondary{background:var(--surface-2);color:var(--text);border:1px solid var(--line);font-weight:650}
/* тихая — ссылка-действие без подложки («Показать код», «Скопировать») */
.nv-btn--quiet{background:transparent;color:var(--accent-text);min-height:44px;padding:0 12px}
/* пилюля — компактная в карточке допродажи */
.nv-btn--chip{min-height:40px;padding:0 14px;border-radius:var(--r-pill);font-size:14.5px;background:var(--accent);color:var(--accent-ink)}
/* «готово» — после успешного действия */
.nv-btn--done{background:var(--ok);color:var(--ok-ink)}
.nv-spin{width:18px;height:18px;border:2.5px solid currentColor;border-right-color:transparent;border-radius:50%;animation:nv-sp .7s linear infinite}
@keyframes nv-sp{to{transform:rotate(360deg)}}

/* ── 7. Карточки ───────────────────────────────────────────────────────────────────────── */
.nv-card{background:var(--surface);border-radius:var(--r-card);padding:var(--s-4);box-shadow:var(--shadow)}
.nv-card + .nv-card{margin-top:14px}
.nv-kv{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:13px 14px;border-radius:14px;background:var(--surface-2);border:1px solid var(--line)}
.nv-kv small{display:block;color:var(--muted);font-size:13px}
.nv-kv b{font-size:17px;font-variant-numeric:tabular-nums;word-break:break-all}

/* главная карточка места («герой»): градиент объекта, тёплый блик, плашка дат, крупная кнопка */
.nv-hero{position:relative;overflow:hidden;border-radius:var(--r-hero);padding:20px 18px 18px;color:var(--hero-text);
  background:radial-gradient(120% 90% at 100% 0%,var(--hero-glow) 0,transparent 55%),linear-gradient(150deg,var(--hero-a),var(--hero-b));
  box-shadow:var(--shadow-hero)}
.nv-hero__deco{position:absolute;right:-34px;top:-40px;width:170px;height:170px;opacity:.10;pointer-events:none;transform:rotate(24deg)}
.nv-hero__label{font-size:13.5px;font-weight:600;display:flex;align-items:center;gap:6px}
.nv-hero__label svg{width:16px;height:16px;flex:none}
.nv-hero__place{font-size:var(--fs-place);font-weight:var(--fw-place);line-height:var(--lh-tight);margin:4px 0 2px;letter-spacing:-.01em}
.nv-hero__sub{font-size:15px}
.nv-dates{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:8px;margin:16px 0;padding:12px 14px;
  border-radius:16px;background:var(--hero-soft);border:1px solid var(--hero-line)}
.nv-dates small{display:block;font-size:12.5px}
.nv-dates b{display:block;font-size:17px;font-weight:var(--fw-head);white-space:nowrap}
.nv-dates span{display:block;font-size:14px;white-space:nowrap}
.nv-dates .r{text-align:right}
.nv-dates .n{font-size:12.5px;font-weight:700;padding:4px 9px;border-radius:var(--r-pill);background:var(--hero-soft);white-space:nowrap}
.nv-hero__btn{display:flex;width:100%;min-height:var(--tap-lg);border:0;border-radius:var(--r-btn-lg);background:var(--hero-btn);color:var(--hero-btn-ink);
  font-size:18px;font-weight:var(--fw-head);align-items:center;justify-content:center;gap:10px;box-shadow:0 4px 14px rgba(0,0,0,.18);transition:transform .12s ease}
.nv-hero__btn svg{width:24px;height:24px;flex:none}
.nv-hero__btn:active{transform:scale(.97)}
.nv-hero__link{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;min-height:44px;margin-top:6px;border:0;background:none;
  font-size:15px;font-weight:600;color:inherit}
.nv-hero__link svg{width:18px;height:18px;flex:none}

/* ── 8. Плитки и тинты ─────────────────────────────────────────────────────────────────── */
.nv-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.nv-tile{position:relative;text-align:left;background:var(--surface);border:0;border-radius:var(--r-tile);padding:14px;min-height:118px;color:var(--text);
  box-shadow:var(--shadow);display:flex;flex-direction:column;gap:10px;transition:transform .12s ease}
.nv-tile:active{transform:scale(.97)}
.nv-tile b{font-size:15.5px;font-weight:700;line-height:1.2}
.nv-tile span{font-size:var(--fs-sm);color:var(--muted);line-height:1.3;margin-top:-6px}
.nv-tile .nv-badge{position:absolute;top:12px;right:12px}
.nv-ico{width:42px;height:42px;border-radius:var(--r-ico);display:grid;place-items:center;flex:none}
.nv-ico svg{width:24px;height:24px}
.nv-tint--amber{background:var(--t-amber);color:var(--i-amber)} .nv-tint--sea{background:var(--t-sea);color:var(--i-sea)}
.nv-tint--sky{background:var(--t-sky);color:var(--i-sky)}       .nv-tint--rose{background:var(--t-rose);color:var(--i-rose)}
.nv-tint--leaf{background:var(--t-leaf);color:var(--i-leaf)}    .nv-tint--sand{background:var(--t-sand);color:var(--i-sand)}
.nv-offer{display:flex;gap:14px;align-items:center}
.nv-offer .nv-ico{width:64px;height:64px;border-radius:18px}
.nv-offer .nv-ico svg{width:36px;height:36px}
.nv-offer b{display:block;font-size:16px}
.nv-offer p{margin:2px 0 8px;color:var(--muted);font-size:14px}

/* ── 9. «Помощь»: карточка и закреплённая нижняя панель ────────────────────────────────── */
.nv-help .row{display:flex;align-items:center;gap:12px}
.nv-help .av{flex:none;width:44px;height:44px;border-radius:50%;background:var(--t-leaf);color:var(--i-leaf);display:grid;place-items:center;position:relative}
.nv-help .av::after{content:"";position:absolute;right:1px;bottom:1px;width:11px;height:11px;border-radius:50%;background:var(--ok);border:2px solid var(--surface)}
.nv-help .av svg{width:24px;height:24px}
.nv-help b{display:block;font-size:15.5px}
.nv-help small{color:var(--muted);font-size:var(--fs-sm)}
.nv-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:12px}
.nv-dock{position:sticky;bottom:0;z-index:10;margin:18px calc(-1 * var(--s-4)) 0;padding:10px var(--s-4) calc(10px + env(safe-area-inset-bottom));
  background:color-mix(in srgb,var(--surface) 92%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  box-shadow:var(--shadow-dock);border-top:1px solid var(--line);display:flex;align-items:center;gap:10px}
.nv-dock__text{flex:1;min-width:0;font-size:var(--fs-sm);color:var(--muted);line-height:1.3}
.nv-dock__text b{display:block;color:var(--text);font-size:15px}

/* ── 10. Поле ввода ────────────────────────────────────────────────────────────────────── */
.nv-field{display:flex;flex-direction:column;gap:6px;margin-top:14px}
.nv-label{font-size:14.5px;font-weight:600}
.nv-input{width:100%;min-height:var(--tap);padding:12px 14px;border-radius:var(--r-field);border:1.5px solid var(--line-strong);
  background:var(--surface);color:var(--text);font:inherit;font-size:16px}
.nv-input::placeholder{color:var(--muted);opacity:1}
.nv-input:focus{outline:3px solid color-mix(in srgb,var(--accent) 35%,transparent);outline-offset:0;border-color:var(--accent-text)}
.nv-hint{font-size:var(--fs-sm);color:var(--muted)}
.nv-field--error .nv-input{border-color:var(--danger)}
.nv-field--error .nv-hint{color:var(--danger);font-weight:600}

/* ── 11. Сообщения ok / error / warning ────────────────────────────────────────────────── */
.nv-msg{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:14px;font-size:15px;line-height:1.4}
.nv-msg svg{flex:none;width:20px;height:20px;margin-top:1px}
.nv-msg b{display:block}
.nv-msg--ok{background:var(--ok-bg);color:var(--ok)}
.nv-msg--error{background:var(--danger-bg);color:var(--danger)}
.nv-msg--warn{background:var(--warn-bg);color:var(--warn)}
.nv-msg + .nv-msg{margin-top:10px}

/* ── 12. Бейджи и статус ───────────────────────────────────────────────────────────────── */
.nv-badge{display:inline-flex;align-items:center;gap:4px;font-size:11.5px;font-weight:700;padding:3px 8px;border-radius:var(--r-pill);line-height:1.4;white-space:nowrap}
.nv-badge--ok{background:var(--ok-bg);color:var(--ok)}
.nv-badge--warn{background:var(--warn-bg);color:var(--warn)}
.nv-badge--danger{background:var(--danger-bg);color:var(--danger)}
.nv-badge--accent{background:var(--accent);color:var(--accent-ink)}
.nv-badge--neutral{background:var(--surface-2);color:var(--muted);border:1px solid var(--line)}
.nv-status{display:inline-flex;align-items:center;gap:8px;font-size:14.5px;font-weight:600;padding:6px 12px 6px 10px;border-radius:var(--r-pill);
  background:var(--ok-bg);color:var(--ok)}
.nv-status svg{width:18px;height:18px}
.nv-status--warn{background:var(--warn-bg);color:var(--warn)}

/* ── 13. Тост ──────────────────────────────────────────────────────────────────────────── */
.nv-toast svg{width:20px;height:20px;flex:none}
.nv-toast{display:inline-flex;gap:8px;align-items:center;padding:12px 16px;border-radius:14px;background:var(--toast-bg);color:var(--toast-text);
  font-weight:600;font-size:15px;box-shadow:0 8px 24px rgba(0,0,0,.25);max-width:calc(100% - 32px)}

@media (prefers-reduced-motion: reduce){.nv *,.nv *::before,.nv *::after{animation:none!important;transition:none!important}}