:root{
    --bg:#FAF7F0; --card:#FFFFFF; --bg2:#F5F1E6;
    --line:#E9E2D2; --line2:#E2DBC9; --line3:#F1ECDF; --line4:#E4DCC8;
    --accent:#2F5BFF; --accent-dark:#1E3FCC; --accent-bg:#EDF1FF;
    --dark:#20242B; --yellow:#FFD34D;
    --ok:#1F8A4C; --ok-text:#166A3A; --ok-bg:#E8F4EC;
    --warn:#B36B00; --warn-text:#8A6400; --warn-bg:#FFF3D6;
    --err:#D4562B; --err-text:#A83E1C; --err-bg:#FFEDE4;
    --teal:#0E7C86; --teal-bg:#DDF1F2; --violet:#5B3AC4; --violet-bg:#ECE6FB;
    --text:#20242B; --text-soft:#5C6270; --text-faint:#6F6752; --text-faint2:#666048;
    /* faint/faint2 калібровані під WCAG AA 4,5:1 проти bg/card/bg2/card2 (аудит 08-22 UX-14,
       було 2,93:1) — не світлішати назад без перерахунку контрасту. */
    --f-head:'Unbounded',sans-serif; --f-body:'Golos Text',sans-serif; --f-mono:'JetBrains Mono',monospace;
    /* поверхні, що раніше були захардкоджені інлайном: --card2 = світліше поле вводу (#FCFAF4),
       --on-dark = текст на темних плашках, --hdr-bg = напівпрозоре тло шапки */
    --card2:#FCFAF4; --on-dark:#F5F1E6; --hdr-bg:rgba(250,247,240,.94);
    --bg-soft:#F5F1E6;   /* м'який фон плашок (біз-трек: чипи CAPEX/окупність), = --bg2 у палітрі */
  }
  /* ── ТЕМНА ТЕМА. Перемикається атрибутом data-theme на <html> (VX.cycleTheme).
     Кольори БЛОКІВ конструктора (сині/бурштинові/фіолетові) навмисно НЕ чіпаємо:
     це кольори-ідентичність даних, а не поверхні — вони мають лишатись впізнаваними. */
  :root[data-theme="dark"]{
    --bg:#15171C; --card:#1D2027; --bg2:#232730; --card2:#22262E;
    --line:#2E333D; --line2:#39404C; --line3:#262B33; --line4:#353C48;
    --accent:#5B82FF; --accent-dark:#93ACFF; --accent-bg:#1C2540;
    --dark:#2B303A; --yellow:#FFD34D; --on-dark:#F0ECE0;
    --ok:#3FB871; --ok-text:#74D69C; --ok-bg:#15301F;
    --warn:#E0A22E; --warn-text:#F1C86B; --warn-bg:#33270E;
    --err:#F0724A; --err-text:#FF9C7A; --err-bg:#3A1E15;
    --teal:#48B7C0; --teal-bg:#12262A; --violet:#9B84E8; --violet-bg:#221A33;
    --text:#ECE8DC; --text-soft:#AAB1BF; --text-faint:#9AA1AF; --text-faint2:#8B92A0;
    --hdr-bg:rgba(21,23,28,.94);
    --bg-soft:#22262E;   /* м'який фон плашок у темній темі — не білий (=--card2) */
    color-scheme:dark;
  }
  /* Тіні на темному тлі нечитні — глушимо разом із занадто яскравим білим у SVG-планах. */
  :root[data-theme="dark"] img,:root[data-theme="dark"] .vxp-card{filter:brightness(.94);}
  html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:var(--f-body);}
  /* Аудит 08-22 п.9 (UX-14): 0 правил :focus-visible в усьому файлі — клавіатурний фокус
     ніде не було видно. Одне глобальне правило покриває все, крім елементів, що самі
     глушать outline (лише .v2sin input — компенсовано нижче біля свого селектора). */
  :focus-visible{outline:2px solid var(--accent);outline-offset:2px;}
  a{color:var(--accent);text-decoration:none;} a:hover{color:var(--accent-dark);text-decoration:underline;}
  input[type=range]{accent-color:var(--accent);}
  ::selection{background:#FFE9B8;}
  button{font-family:var(--f-body);}
  @keyframes vxFade{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:translateY(0);}}
  @keyframes vxPulse{0%{box-shadow:0 0 0 0 rgba(31,138,76,.35);}70%{box-shadow:0 0 0 9px rgba(31,138,76,0);}100%{box-shadow:0 0 0 0 rgba(31,138,76,0);}}
  @keyframes vxScan{0%{top:0;}100%{top:calc(100% - 3px);}}
  @keyframes vxSpin{to{transform:rotate(360deg);}}   /* «Зберігаємо…» у кнопці збереження */
  @keyframes vxSkelPulse{0%,100%{opacity:.5;}50%{opacity:1;}}
  .vx-skel-bar{background:var(--line3);border-radius:8px;animation:vxSkelPulse 1.1s ease-in-out infinite;}
  /* 🎯 Клік по предмету на кресленні (2D-план/3D-перегляд) → шлях у «Конструкторі»:
     розгорнули дерево, проскролили — короткий спалах, щоб очі знайшли рядок. Клас
     сам собою нічого не запускає (transition чекає зміни background-color), тому
     ctorFlash додає й ЗНІМАЄ клас vx-flash-on через requestAnimationFrame — саме
     ця зміна і грає перехід «яскраве тло → назад». */
  .vx-ctor-flash{transition:background-color 1.5s ease, border-left-color 1.5s ease;}
  .vx-ctor-flash.vx-flash-on{background-color:var(--accent-bg)!important;border-left-color:var(--accent)!important;}
  /* ── ГЕНПЛАН: підписи споруд не закривають підоснову ──────────────────────────
     Постійні назви поверх супутникового знімка ховали саме те, заради чого знімок
     і вмикають. Тепер підпис і ручка повороту проявляються на наведення; кнопка
     «Підписи» на канві вмикає всі підписи разом (.gen-lbl-on) — для тач-екранів,
     де наведення не існує, і для друку/скріншотів. Сама пляма споруди видима
     завжди, тож клікати й тягнути можна так само.
     🔴 Схована ручка мусить мати `pointer-events:none`: сама лише opacity:0 лишає її
     клікабельною, і хват біля верхньої грані плями крутив би споруду замість тягти. */
  /* Обертається ЛИШЕ пляма (.gen-b-shape); підпис і ручка живуть у необернутому
     .gen-b, тож підпис завжди горизонтальний, а хват повороту — на місці. */
  .gen-b .gen-b-shape{transition:opacity .12s ease,filter .12s ease;}
  .gen-b .gen-b-lbl{opacity:0;transition:opacity .12s ease;}
  /* Підпис видно: на наведення, коли увімкнено «Підписи», або коли споруду ОБРАНО. */
  .gen-b:hover .gen-b-lbl,.gen-lbl-on .gen-b .gen-b-lbl,.gen-b.gen-b-on .gen-b-lbl{opacity:1;}
  /* Ручку повороту рендеримо лише для обраної споруди (див. vx-render), тож вона
     просто видима — окремий hover-тригер більше не потрібен. */
  .gen-b .gen-b-rot{z-index:6;}
  /* Підпис — СПЛИВАЮЧА підказка ЗА межами плями (над нею або під нею), а не напис
     усередині: напис усередині закривав саме ту забудову, яку показує знімок, і на
     малій плямі ще й не вміщався. Темна плашка читається і на полі, і на даху. */
  .gen-b .gen-b-lbl{position:absolute;left:50%;z-index:5;white-space:nowrap;background:rgba(32,36,43,.92);color:#F5F1E6;border-radius:7px;padding:3px 8px;box-shadow:0 3px 10px rgba(32,36,43,.28);}
  /* ВИДІЛЕННЯ ОБРАНОЇ СПОРУДИ = ГАСИМО РЕШТУ. Обрану НЕ фарбуємо й не світимо (вимога
     власника): вона лишається точно такою, як без вибору, лише лежить зверху й має
     акцентну рамку — хват для повороту. Решта плям сіріє (grayscale) і притлумлюється.
     Клікати притлумлені все одно можна (opacity кліки не блокує) — так перемикаєшся
     між спорудами. Те саме правило в 3D (highlightGen у vx-actions.js). */
  .gen-b.gen-b-on{z-index:4;}
  .gen-has-sel .gen-b:not(.gen-b-on) .gen-b-shape{opacity:.45;filter:grayscale(.92);}
  /* ── ЗУМ 2D-ПОЛОТНА ──────────────────────────────────────────────────────────
     Масштаб міняє РЕАЛЬНИЙ розмір полотна у скрол-порті, а не CSS transform: уся
     вказівникова математика (перетягування кімнат і споруд, ручки повороту,
     обведення) рахується від getBoundingClientRect() самого полотна, тож при зміні
     його власного розміру координати сходяться самі. З transform:scale() довелось
     би ділити на масштаб у КОЖНОМУ обробнику, і перший забутий давав би класичне
     «тягну тут — рухається там». */
  /* Ліве полотно = flex-колонка: тулбар/панелі беруть природну висоту зверху, а
     скрол-порт полотна (#vx-zoomvp) забирає ВСЮ решту місця й ширину. Так порт має
     СТАЛИЙ розмір незалежно від зуму — тулбар і навігація над ним не рухаються й не
     «зумляться», а полотно розгортається на всю ширину панелі (а не на 620px). */
  .vx-cv-left{display:flex;flex-direction:column;}
  .vx-cv-left>*:not(.vx-zoomwrap){flex:0 0 auto;}
  .vx-cv-left>.vx-zoomwrap{flex:1 1 0;min-height:320px;}
  /* Обгортка полотна: скрол-порт заповнює її абсолютно (тому має СТАЛИЙ розмір), а
     закріплений шар контролів (кнопки «Підписи»/«Супутник», компас-орієнтація) лежить
     ПОВЕРХ порту й НЕ скролиться — саме тому вони не зникають при зумі/прокрутці. */
  .vx-zoomwrap{position:relative;}
  .vx-zoomwrap>#vx-zoomvp{position:absolute;inset:0;}
  /* Зум міняє РОЗМІР ВМІСТУ (.vx-zoomin = z×ширина порту), а не розмір порту: порт
     лишається сталою рамкою, вміст скролиться всередині. overflow на обидві осі. */
  .vx-zoomvp{overflow:auto;overscroll-behavior:contain;border-radius:12px;}
  .vx-zoomvp.vx-can-pan{cursor:grab;}
  .vx-zoomvp.vx-panning{cursor:grabbing;}
  /* 2D дрил-іну й креслення-порти: щипок і тягнення — наші (VX._pinchTouch / panStart),
     браузер не масштабує сторінку замість креслення. */
  .vx-zoomvp.vx-pinch{touch-action:none;}
  .vx-schz-vp.vx-can-pan{cursor:grab;}
  .vx-schz-vp.vx-panning{cursor:grabbing;}
  .vx-zoomin{margin:0 auto;}
  /* 🔍 «люфт» генплану (власник 2026-10-04: «зум з більшим люфтом, не можу віддалитись»): при збільшенні навколо полотна
     лишається порожнє поле — край плану можна підтягнути до центру. Прозора рамка, а не padding: усю вказівникову математику
     тримає getBoundingClientRect самого #gen-canvas, її це не чіпає. */
  .vx-zoomvp.vx-slack .vx-zoomin{box-sizing:content-box;border:solid transparent;border-width:14vh 14vw;}
  /* Полотно (svg-план / div-генплан) заповнює всю ширину порту; 620px-стелю знімаємо. */
  .vx-zoomin>svg,.vx-zoomin>div{max-width:none!important;width:100%!important;}
  /* Закріплений шар контролів: сам прозорий для кліків (щоб пан/клік по полотну
     проходили крізь нього), а самі контроли — клікабельні. */
  .vx-zoomovl{position:absolute;inset:0;pointer-events:none;z-index:6;}
  .vx-zoomovl>*{pointer-events:auto;}
  /* ── РОЗГОРНУТИ НА ВЕСЬ ЕКРАН ────────────────────────────────────────────────
     Сітка «полотно + панель» стає одноколонковим оверлеєм; невидиму половину не
     викидаємо з DOM, а ховаємо — так переживають монтування 3D-канва, мапи й скрол
     панелі (їх повертає V3D.sync/PMAP.sync після кожного рендера).
     z-index нижчий за модалки (100+): каталог і опитники мусять лягати ЗВЕРХУ. */
  /* box-sizing обовʼязково: сітка НЕ має глобального border-box, тож 100vh + падінги
     давали б 744 px у вікні 720 — низ панелі ховався б за краєм екрана. */
  .vx-fs{position:fixed!important;inset:0!important;z-index:64;box-sizing:border-box;background:var(--bg);padding:12px!important;margin:0!important;gap:0!important;height:100vh!important;min-height:0!important;grid-template-columns:minmax(0,1fr)!important;}
  body.vx-fs-on{overflow:hidden;}
  /* ── ЗСУВНА МЕЖА між полотном (візуалізація) і конструктором ─────────────────
     Сидить у середній 14px-доріжці сітки .vx-canvas (ліва fr · ця смуга · права fr).
     Тонка вертикальна риска (::before) — сама межа; по центру — «ручка» з крапок.
     Курсор col-resize по всій смузі; тягне JS (VX.splitStart), не CSS. touch-action:none
     — щоб на тачі жест не крутив сторінку. */
  .vx-split{align-self:stretch;position:relative;display:flex;align-items:center;justify-content:center;cursor:col-resize;touch-action:none;user-select:none;-webkit-user-select:none;}
  .vx-split::before{content:"";position:absolute;top:8px;bottom:8px;left:50%;width:2px;transform:translateX(-50%);background:var(--line3);border-radius:2px;transition:background .14s,width .14s;}
  .vx-split:hover::before,.vx-split.vx-split-on::before{background:var(--accent);width:3px;}
  .vx-split-grip{position:relative;z-index:1;width:8px;height:46px;border-radius:6px;background:var(--card);border:1.5px solid var(--line2);box-shadow:0 2px 6px rgba(32,36,43,.12);background-image:radial-gradient(var(--text-faint2) 1.1px,transparent 1.4px);background-size:100% 7px;background-position:center;transition:border-color .14s;}
  .vx-split:hover .vx-split-grip,.vx-split.vx-split-on .vx-split-grip{border-color:var(--accent);}
  /* Ручка регулювання ширини колонки таблиці (VX.colResizeStart) — той самий col-resize
     патерн, що vx-split, лише в шапці <th>: тонка смужка, підсвічується під курсором/тягом. */
  .vx-colrs{touch-action:none;user-select:none;-webkit-user-select:none;}
  .vx-colrs::after{content:"";position:absolute;top:4px;bottom:4px;right:3px;width:2px;background:transparent;border-radius:2px;transition:background .14s;}
  .vx-colrs:hover::after,.vx-colrs.vx-colrs-on::after{background:var(--accent);}
  .vx-fs-canvas #ctor-panel-scroll,.vx-fs-canvas #design-panel-scroll,.vx-fs-canvas #gen-panel-scroll{display:none;}
  .vx-fs-panel .vx-cv-left{display:none;}
  .hov-line:hover{border-color:var(--accent)!important;}
  .hov-link:hover{border-color:var(--accent)!important;color:var(--accent)!important;}
  .hov-bright:hover{filter:brightness(1.07);}
  .hov-bright5:hover{filter:brightness(1.05);}
  /* нав-кроки: чіпи ПЕРЕНОСЯТЬСЯ на новий рядок (усі читаються), а не клипаються/розпихають шапку.
     Права група (дзвінок/вхід/мова) не стискається й лишається видимою. */
  .vx-nav{min-width:0;}
  .hdr-actions{flex-shrink:0;}
  /* 🔴 overflow-x:hidden на ОБОХ html і body робив body власним контейнером прокрутки — position:sticky
     усередині сторінки (рейка розділів і 3D-колонка Атласу) переставав липнути. clip не створює контейнера. */
  html{overflow-x:hidden;}
  body{overflow-x:clip;}
  /* 📱 Обгортка екрана «max-width + margin:0 auto» — пряма дитина колонкового flex-кореня (#app>div).
     Авто-поля в поперечній осі вимикають stretch → ширина = fit-content, тобто НЕ менша за
     найширший нерозривний вміст (таблиця кошторису, рядок кнопок): на телефоні 375 px відкритий
     лід був 1151 px завширшки, а overflow-x:hidden мовчки різав праву частину (2026-10-07). */
  #app>div>[style*="margin:0 auto"],#app>div>[style*="px auto"]{width:100%;box-sizing:border-box;}
  @media (max-width:960px){
    .vx-hero{grid-template-columns:1fr!important;gap:28px!important;padding-top:36px!important;}
    .vx-steps{grid-template-columns:repeat(2,1fr)!important;}
    .vx-canvas{grid-template-columns:1fr!important;grid-template-rows:auto!important;height:auto!important;flex:0 0 auto!important;}
    .vx-entry{grid-template-columns:1fr!important;}
    .vx-pillars{grid-template-columns:1fr!important;}
    .vx-how{grid-template-columns:repeat(2,1fr)!important;}
  }
  @media (max-width:560px){ .vx-how{grid-template-columns:1fr!important;} }
  /* Телефон: шапка двома чистими смугами замість каші. Рядок 1 — лого(іконка)+дії;
     рядок 2 — степер ОДНІЄЮ горизонтально-прокручуваною стрічкою (без переносу/накладань). */
  @media (max-width:720px){
    .vx-hdr{flex-wrap:wrap;row-gap:8px;padding-left:12px;padding-right:12px;}
    .vx-nav{order:10!important;flex:1 1 100%!important;justify-content:flex-start!important;flex-wrap:nowrap!important;overflow-x:auto!important;scrollbar-width:none;margin:2px -12px -2px;padding:0 12px;}
    .vx-nav::-webkit-scrollbar{display:none;}
    .vx-nav>*{flex-shrink:0;}
    .vx-logo-text{display:none;}
    .vx-acct-name{display:none!important;}
    .hdr-pick-min{display:none!important;}
  }
  @media print{
    body *{visibility:hidden;}
    [data-print-area],[data-print-area] *{visibility:visible;}
    /* max-height/overflow (липкий скрол-контейнер таблиці) НЕ повинні обрізати друк */
    [data-print-area]{position:absolute;left:0;top:0;width:100%;max-height:none !important;overflow:visible !important;}
    [data-print-area] thead th{position:static !important;}
  }
  /* Пошук елементів у пілюлі «Елементи» (темний фон) — читабельний плейсхолдер-фон */
  #block-search::placeholder{color:var(--bg2);opacity:.6;letter-spacing:.05em;}
  #block-search:focus::placeholder{opacity:.35;}
  /* Липка шапка таблиць: контейнер скролиться, thead лишається вгорі (усі таблиці ERP/адмін/нормативи) */
  .vx-tbl-scroll{max-height:72vh;overflow:auto;}
  .vx-tbl-scroll thead th{position:sticky;top:0;z-index:5;background:var(--bg2);box-shadow:0 1px 0 var(--line3);}
  @media print{ .vx-tbl-scroll{max-height:none !important;overflow:visible !important;} .vx-tbl-scroll thead th{position:static !important;} }
  /* Документ акта (erpActPrintHTML) живе в накладці position:fixed + overflow:auto. Такий
     предок у друці обрізає вміст до ПЕРШОЇ сторінки — фото-додаток зник би. У друці
     накладка стає звичайним блоком, а документ тече сторінками. */
  @media print{
    #plan-print-overlay{position:static !important;overflow:visible !important;background:none !important;inset:auto !important;}
    #plan-print-overlay > div{margin:0 !important;max-width:none !important;box-shadow:none !important;border-radius:0 !important;overflow:visible !important;}
    #act-print-overlay{position:static !important;overflow:visible !important;background:none !important;inset:auto !important;}
    #act-print-overlay > div{margin:0 !important;max-width:none !important;box-shadow:none !important;border-radius:0 !important;overflow:visible !important;}
    /* договір і рахунок на оплату (vx-contracts.js) — та сама накладка, що в акта */
    #ctr-print-overlay{position:static !important;overflow:visible !important;background:none !important;inset:auto !important;}
    #ctr-print-overlay > div{margin:0 !important;max-width:none !important;box-shadow:none !important;border-radius:0 !important;overflow:visible !important;}
    /* табель місяця (vx-people.js) — та сама накладка; сторінка альбомна (31 день не влазить у книжкову) */
    #ppl-print-overlay{position:static !important;overflow:visible !important;background:none !important;inset:auto !important;}
    #ppl-print-overlay > div{margin:0 !important;max-width:none !important;box-shadow:none !important;border-radius:0 !important;overflow:visible !important;}
    #ppl-print-overlay [data-print-area]{page:vxppl;}
    /* звіт (vx-reports.js) — та сама накладка; альбомна сторінка (широкі таблиці) */
    #rpt-print-overlay{position:static !important;overflow:visible !important;background:none !important;inset:auto !important;}
    #rpt-print-overlay > div{margin:0 !important;max-width:none !important;box-shadow:none !important;border-radius:0 !important;overflow:visible !important;}
    #rpt-print-overlay [data-print-area]{page:vxrpt;}
  }
  @page vxppl{size:A4 landscape;margin:8mm;}
  @page vxrpt{size:A4 landscape;margin:8mm;}
  /* Межа колонки видно на КОЖНОМУ рядку (не лише в шапці) — тягнеться вздовж усієї
     таблиці «Товари» постачальника, де колонки регулюються (VX.colResizeStart). */
  .vx-nomen-tbl th:not(:last-child),.vx-nomen-tbl td:not(:last-child){border-right:1px solid var(--line3);}
  /* ── «Атлас об’єктів» (каталог) — 1:1 з design_handoff_atlas_objektiv («Каталог Vixiv v3», 2026-09-17).
     Кольори макета — токенами --atl-*, з темною темою (інакше світлі плашки макета сліпили б на темному тлі). ── */
  :root{ --atl-slot:#EEF2F7; --atl-b:#E3ECFD; --atl-bt:#2F6DF6; --atl-p:#EFE2FB; --atl-pt:#7433B8; --atl-price:#166A3A; --atl-sel:#F5F8FF; --atl-selb:#DCE6FB; --atl-seg:#F3EFE6; --atl-rail:#F3EFE6; --atl-line:#ECE6D8; --atl-faint:#6F6752; --atl-gh:#6A6457; --atl-fav:#DD8418; --atl-favbg:#FCE9D4; --atl-hov:#B9CDFA; --atl-btt:#1E4FD0; --atl-on-bt:#fff; }
  /* --atl-faint = --text-faint (AA 4,5:1, аудит UX-14) — не світлішати до #A9A395 з макета; --atl-btt — синій ТЕКСТ (#2F6DF6 на #E3ECFD дає лише 3,8:1). */
  :root[data-theme="dark"]{ --atl-slot:#1F2530; --atl-b:#1C2540; --atl-bt:#7FA2FF; --atl-p:#2A1D3A; --atl-pt:#C49BF0; --atl-price:#3FB871; --atl-sel:#1A2133; --atl-selb:#2C3A5C; --atl-seg:#232730; --atl-rail:#1A1D23; --atl-line:#2E333D; --atl-faint:#8B92A0; --atl-gh:#AAB1BF; --atl-fav:#F1B45A; --atl-favbg:#3A2A14; --atl-hov:#3B5494; --atl-btt:#7FA2FF; --atl-on-bt:#0F1830; }
  .vx-atlas-wrap{max-width:1440px;margin:0 auto;padding:18px 20px 60px;}
  .vx-atlas-head{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;margin-bottom:14px;}
  .vx-atlas-head h1{font-family:var(--f-head);font-weight:700;font-size:20px;letter-spacing:-.01em;line-height:1.1;margin:0;white-space:nowrap;}
  .vx-atlas-head .sub{color:var(--text-faint);font-size:12px;margin-top:3px;}
  .vx-atlas-search{flex:1 1 320px;display:flex;align-items:center;gap:8px;height:40px;padding:0 10px 0 12px;background:var(--card);border:1px solid var(--line2);border-radius:11px;}
  .vx-atlas-search:focus-within{border-color:var(--atl-bt);}
  .vx-atlas-search input{flex:1;min-width:0;border:0;outline:0;background:transparent;font-size:14px;color:var(--text);font-family:var(--f-body);}
  .vx-atlas-search input:focus-visible{outline:0;}
  .vx-atlas-kbd{font-size:11px;color:var(--atl-faint);background:var(--atl-seg);border-radius:6px;padding:3px 7px;font-family:var(--f-mono);white-space:nowrap;}
  .vx-atlas-clear{height:28px;padding:0 10px;border:0;border-radius:8px;background:var(--atl-seg);color:var(--text-soft);font-size:12px;font-weight:700;cursor:pointer;font-family:inherit;}
  /* Права колонка СТАТИЧНА (макет): завжди третя колонка сітки, ніколи не спливає поверх
     карток. Ширини — брейкпоінти макета (≥1280: 360–460, 1000–1279: 300–340, <1000: 280–300 +
     рейка іконками 56 px). Лише на телефоні (<760) колонки стають стосом. */
  .vx-atlas-layout{display:grid;grid-template-columns:var(--atl-rw,minmax(196px,228px)) 12px minmax(280px,1fr) 12px var(--atl-cw,minmax(360px,460px));gap:0;align-items:start;}
  /* роздільник колонки: смуга на всю висоту сітки, ручка липне до видимої середини */
  .vx-atlas-gut{align-items:flex-start;}
  .vx-atlas-gut::after{content:"";position:absolute;top:0;bottom:0;left:-6px;right:-6px;}
  .vx-atlas-gut .vx-split-grip{position:sticky;top:calc(50vh - 23px);margin-top:120px;}
  .vx-atlas-rail{position:sticky;top:72px;max-height:calc(100vh - 90px);overflow:auto;background:var(--atl-rail);border:1px solid var(--line);border-radius:20px;padding:6px;display:flex;flex-direction:column;gap:2px;min-width:0;}
  .vx-atlas-rhead{padding:6px 8px 8px;font-size:10.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--text-faint);display:flex;justify-content:space-between;}
  .vx-atlas-rsec{display:flex;align-items:center;gap:9px;width:100%;border:0;background:transparent;cursor:pointer;padding:8px;border-radius:12px;text-align:left;font-family:inherit;color:var(--text);font-size:13px;font-weight:700;line-height:1.2;}
  .vx-atlas-rsec:hover{background:var(--card);}
  .vx-atlas-rsec.on{background:var(--card);box-shadow:0 1px 2px rgba(27,27,31,.06);}
  .vx-atlas-rico{flex:none;width:26px;height:26px;border-radius:8px;display:grid;place-items:center;font-size:14px;}
  .vx-atlas-rcnt{font-size:11px;font-weight:700;color:var(--atl-faint);}
  .vx-atlas-rchev{width:10px;text-align:center;color:var(--atl-faint);font-size:12px;}
  .vx-atlas-rsub{display:flex;flex-direction:column;gap:1px;padding:2px 0 6px;}
  .vx-atlas-rgrp{display:flex;align-items:center;gap:8px;border:0;background:transparent;cursor:pointer;text-align:left;padding:7px 10px 7px 43px;border-radius:10px;font-family:inherit;font-size:12.5px;font-weight:600;color:var(--text-soft);line-height:1.25;}
  .vx-atlas-rgrp:hover{background:var(--card);}
  .vx-atlas-rgrp.on{background:var(--atl-b);color:var(--atl-btt);font-weight:700;}
  .vx-atlas-rgrp span{margin-left:auto;font-size:11px;font-weight:700;opacity:.55;}
  .vx-atlas-rdiv{height:1px;background:var(--line2);margin:8px 6px;}
  .vx-atlas-mode{font-size:12px;font-weight:700;color:var(--text-faint);margin:2px 0 8px 4px;}
  .vx-atlas-sec{background:var(--card);border:1px solid var(--atl-line);border-radius:18px;padding:16px 16px 6px;margin-bottom:12px;box-shadow:0 1px 2px rgba(27,27,31,.03);}
  .vx-atlas-sech{display:flex;align-items:center;gap:12px;margin-bottom:6px;}
  .vx-atlas-sech .ic{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;font-size:19px;flex:none;}
  .vx-atlas-sech b{display:block;font-weight:800;font-size:17px;letter-spacing:-.01em;line-height:1.2;}
  .vx-atlas-sech small{display:block;color:var(--text-faint);font-size:12px;margin-top:1px;}
  .vx-atlas-grp{padding:4px 0 8px;}
  .vx-atlas-gh{display:flex;align-items:center;gap:8px;height:28px;padding:0 6px 0 2px;border:0;background:transparent;cursor:pointer;color:var(--atl-gh);font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;border-radius:8px;font-family:inherit;}
  .vx-atlas-gh:hover{color:var(--atl-btt);}
  .vx-atlas-gh span{color:var(--atl-faint);font-weight:700;letter-spacing:0;}
  .vx-atlas-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(220px,100%),1fr));gap:8px;padding-top:4px;}
  .vx-atlas-card{position:relative;display:flex;gap:10px;align-items:flex-start;padding:12px;border:1px solid var(--atl-line);border-radius:12px;background:var(--card);cursor:pointer;text-align:left;transition:border-color .15s,box-shadow .15s,transform .15s;}
  .vx-atlas-card:hover{border-color:var(--atl-hov);box-shadow:0 6px 18px rgba(47,109,246,.10);transform:translateY(-1px);}
  .vx-atlas-card.on{border-color:var(--atl-bt);box-shadow:0 0 0 1px var(--atl-bt);}
  .vx-atlas-cico{flex:none;width:36px;height:36px;border-radius:10px;display:grid;place-items:center;font-size:19px;}
  .vx-atlas-cbody{flex:1;min-width:0;padding-right:22px;}
  .vx-atlas-name{font-weight:700;font-size:14px;line-height:1.25;overflow-wrap:anywhere;color:var(--text);}
  .vx-atlas-desc{color:var(--text-soft);font-size:12px;line-height:1.4;margin-top:3px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
  .vx-atlas-desc.stub{color:var(--atl-faint);font-style:italic;}
  .vx-atlas-chips{display:flex;flex-wrap:wrap;align-items:center;gap:5px;margin-top:7px;}
  .vx-atlas-chip{font-size:11.5px;font-weight:600;color:var(--atl-gh);background:var(--atl-seg);border-radius:6px;padding:3px 7px;}
  .vx-atlas-chip.b{font-weight:700;color:var(--atl-btt);background:var(--atl-b);}
  .vx-atlas-chip.p{font-weight:700;color:var(--atl-pt);background:var(--atl-p);}
  .vx-atlas-price{font-size:11.5px;font-weight:800;color:var(--atl-price);}
  .vx-atlas-more{margin-left:auto;height:28px;padding:0 10px;border:1px solid var(--atl-selb);border-radius:8px;background:var(--atl-sel);color:var(--atl-btt);font-size:12.5px;font-weight:800;cursor:pointer;white-space:nowrap;font-family:inherit;}
  .vx-atlas-more:hover{background:var(--atl-bt);color:var(--atl-on-bt);border-color:var(--atl-bt);}
  .vx-atlas-fav{position:absolute;top:10px;right:10px;width:28px;height:28px;border:0;border-radius:8px;background:transparent;color:var(--atl-faint);font-size:15px;cursor:pointer;display:grid;place-items:center;}
  .vx-atlas-fav:hover{background:var(--atl-seg);}
  .vx-atlas-fav.on{color:var(--atl-fav);}
  .vx-atlas-empty{padding:56px 24px;text-align:center;background:var(--card);border:1px dashed var(--line2);border-radius:20px;}
  .vx-atlas-ctx{position:sticky;top:72px;height:calc(100vh - 88px);min-height:0;background:var(--card);border:1px solid var(--atl-line);border-radius:22px;display:flex;flex-direction:column;overflow-x:hidden;overflow-y:auto;}
  .vx-atlas-ctx.anim{animation:vxFade .22s ease both;}
  .vx-atlas-body{flex:1 1 auto;min-height:160px;overflow:auto;padding-bottom:12px;}
  .vx-atlas-slot{position:relative;flex:none;height:300px;background:var(--atl-slot);border-radius:22px 22px 0 0;overflow:hidden;}
  @media(max-height:799px){ .vx-atlas-slot{height:225px;} }
  @media(max-height:639px){ .vx-atlas-slot{height:144px;} }
  /* 3D-сцена Атласу (SHOP3D plain): канва прозора — «студійне» тло дає маунт: світла пляма
     під моделлю тане в --atl-slot (туман сцени — того ж кольору, край підкладки не ріже тло). */
  #shop3d-mount[data-plain]{background:var(--atl-slot);background:radial-gradient(120% 95% at 50% 42%,color-mix(in srgb,var(--atl-slot) 45%,#fff) 0%,var(--atl-slot) 72%);}
  :root[data-theme="dark"] #shop3d-mount[data-plain]{background:radial-gradient(120% 95% at 50% 42%,color-mix(in srgb,var(--atl-slot) 78%,#fff) 0%,var(--atl-slot) 72%);}
  .vx-atlas-ctx.empty{justify-content:center;align-items:center;text-align:center;padding:24px;gap:10px;color:var(--text-soft);font-size:13px;line-height:1.45;}
  .vx-atlas-slotlbl{position:absolute;top:10px;left:12px;z-index:2;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#586274;background:rgba(255,255,255,.85);border-radius:6px;padding:4px 8px;pointer-events:none;max-width:calc(100% - 70px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .vx-atlas-x{position:absolute;top:8px;right:8px;z-index:2;width:30px;height:30px;border:0;border-radius:9px;background:rgba(255,255,255,.9);color:#5A554B;font-size:16px;cursor:pointer;display:grid;place-items:center;}
  .vx-atlas-seg{flex:1;display:grid;grid-template-columns:1fr 1fr;gap:3px;padding:3px;background:var(--atl-seg);border-radius:11px;}
  .vx-atlas-seg button{height:30px;border:0;border-radius:9px;background:transparent;color:var(--text-soft);font-size:12.5px;font-weight:800;cursor:pointer;font-family:inherit;}
  .vx-atlas-seg button.on{background:var(--card);color:var(--text);font-weight:800;box-shadow:0 1px 3px rgba(27,27,31,.08);}
  .vx-atlas-seg button span{opacity:.6;font-weight:700;margin-left:4px;}
  .vx-atlas-star{flex:none;width:34px;height:34px;border:1px solid var(--line2);border-radius:10px;background:var(--card);cursor:pointer;display:grid;place-items:center;color:var(--atl-faint);font-size:15px;}
  .vx-atlas-star.on{color:var(--atl-fav);}
  .vx-atlas-h{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--atl-gh);}
  .vx-atlas-arr{width:26px;height:26px;border:1px solid var(--line2);border-radius:8px;background:var(--card);color:var(--text-soft);cursor:pointer;font-size:13px;display:grid;place-items:center;}
  .vx-atlas-sch{flex:none;height:24px;padding:0 9px;border:1px solid var(--line2);border-radius:99px;background:var(--card);color:var(--text-soft);font-size:11px;font-weight:700;cursor:pointer;white-space:nowrap;font-family:inherit;}
  .vx-atlas-sch.on{background:var(--atl-bt);border-color:var(--atl-bt);color:var(--atl-on-bt);}
  .vx-atlas-car{display:flex;gap:8px;overflow-x:auto;scroll-snap-type:x mandatory;padding:2px 2px 6px;scrollbar-width:thin;}
  .vx-atlas-arch{flex:none;width:148px;scroll-snap-align:start;display:flex;flex-direction:column;gap:5px;padding:6px;border:1px solid var(--atl-line);border-radius:11px;background:var(--card);cursor:pointer;text-align:left;font-family:inherit;}
  .vx-atlas-arch:hover{border-color:var(--atl-hov);}
  .vx-atlas-arch.on{border-color:var(--atl-bt);box-shadow:0 0 0 1px var(--atl-bt);}
  .vx-atlas-thumb{position:relative;height:74px;border-radius:8px;overflow:hidden;background:var(--atl-slot);display:grid;place-items:center;}
  .vx-atlas-thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .2s;}
  .vx-atlas-arch .st{font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--atl-pt);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .vx-atlas-arch .nm{font-weight:800;font-size:12px;color:var(--text);line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .vx-atlas-arch .pr{font-size:11px;font-weight:800;color:var(--atl-btt);font-family:var(--f-mono);}
  .vx-atlas-selbox{margin:10px 14px 0;padding:12px 14px;border:1px solid var(--atl-selb);background:var(--atl-sel);border-radius:14px;}
  .vx-atlas-dash{margin:12px 14px 0;padding:14px;border:1px dashed var(--line2);border-radius:14px;font-size:12.5px;color:var(--text-soft);line-height:1.45;}
  .vx-atlas-opt{display:flex;flex-direction:column;gap:2px;padding:9px 12px;border:1px solid var(--atl-line);border-radius:11px;background:var(--card);cursor:pointer;text-align:left;font-family:inherit;}
  .vx-atlas-opt:hover{border-color:var(--atl-hov);}
  .vx-atlas-opt.on{border-color:var(--atl-bt);background:var(--atl-sel);box-shadow:0 0 0 1px var(--atl-bt);}
  .vx-atlas-foot{flex:none;position:sticky;bottom:0;z-index:2;padding:10px 14px 14px;background:var(--card);border-top:1px solid var(--atl-line);}
  .vx-atlas-cta{width:100%;height:40px;border:0;border-radius:12px;background:#2F6DF6;color:#fff;font-size:14px;font-weight:800;cursor:pointer;font-family:inherit;}
  .vx-atlas-cta:hover{filter:brightness(.92);}
  @media(max-width:1279px){ .vx-atlas-layout{grid-template-columns:var(--atl-rw,minmax(196px,228px)) 12px minmax(280px,1fr) 12px var(--atl-cw,minmax(300px,340px));} }
  /* <1000: рейка — стовпчик іконок (макет railMode), підрозділи ховаються, назва — у title */
  @media(max-width:999px){ .vx-atlas-layout{grid-template-columns:56px 12px minmax(240px,1fr) 12px var(--atl-cw,minmax(280px,300px));} .vx-atlas-gut-rail{visibility:hidden;pointer-events:none;}
    .vx-atlas-rail .vx-atlas-rhead,.vx-atlas-rail .vx-atlas-rsub,.vx-atlas-rail .vx-atlas-rtxt,.vx-atlas-rail .vx-atlas-rcnt,.vx-atlas-rail .vx-atlas-rchev{display:none;}
    .vx-atlas-rsec{justify-content:center;padding:8px 0;} .vx-atlas-rdiv{margin:6px 4px;} }
  @media(max-width:759px){ .vx-atlas-layout{grid-template-columns:1fr;gap:12px;} .vx-atlas-gut{display:none;} .vx-atlas-rail{position:static;max-height:none;flex-direction:row;flex-wrap:wrap;} .vx-atlas-rdiv{display:none;}
    .vx-atlas-ctx{position:static;height:auto;max-height:none;} .vx-atlas-ctx.empty{display:none;} .vx-atlas-head h1{white-space:normal;} }
  /* ── Головна 2.0: персони-входи (redesign, рендериться лише за прапорцем v2on) ── */
  .vxp-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:15px;}
  .vxp-card{grid-column:span 2;position:relative;text-align:left;background:var(--card);border:1px solid var(--line);border-radius:17px;padding:20px;cursor:pointer;overflow:hidden;display:flex;flex-direction:column;font-family:inherit;transition:transform .16s,box-shadow .16s,border-color .16s;}
  .vxp-card.vxp-big{grid-column:span 3;}
  .vxp-card::before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:var(--pf);}
  .vxp-card:hover{transform:translateY(-3px);border-color:var(--pf);box-shadow:0 20px 40px -22px rgba(32,36,43,.4);}
  .vxp-t{display:flex;align-items:center;gap:12px;margin-bottom:11px;}
  .vxp-ic{width:47px;height:47px;border-radius:13px;background:var(--pb);color:var(--pf);display:grid;place-items:center;font-size:23px;}
  .vxp-tag{margin-left:auto;font-family:var(--f-mono);font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--pf);background:var(--pb);border-radius:99px;padding:4px 9px;}
  .vxp-card h3{font-family:var(--f-head);font-size:18px;font-weight:650;line-height:1.15;margin:0;}
  .vxp-card.vxp-big h3{font-size:20px;}
  .vxp-card p{font-size:13px;color:var(--text-soft);line-height:1.5;margin:9px 0 0;}
  .vxp-go{margin-top:auto;padding-top:14px;display:flex;align-items:center;gap:6px;font-size:12.5px;font-weight:800;color:var(--pf);}
  @media(max-width:900px){ .vxp-grid{grid-template-columns:1fr 1fr;} .vxp-card,.vxp-card.vxp-big{grid-column:span 1;} .vxp-band{grid-template-columns:1fr !important;} }
  /* ── Головна 2.0 · «обʼєкт у центрі, 7 розділів навколо» (homeHTMLV2, 2026-09-24) ──
     --nf/--nb — колір вузла (токени теми). Текст вузла змішуємо з --text, щоб і світла,
     і темна тема тримали контраст (сирий --warn на білому — 3,9:1 при 11 px). */
  .vxh{max-width:1440px;margin:0 auto;padding:20px 32px 0;box-sizing:border-box;}
  .vxh button{font-family:inherit;cursor:pointer;}
  .vxh-main{display:grid;grid-template-columns:320px 700px 308px;justify-content:space-between;align-items:start;gap:24px;}
  .vxh-left{align-self:center;padding-bottom:24px;}
  .vxh-left h1{font-family:var(--f-head);font-weight:700;font-size:34px;line-height:1.1;letter-spacing:-.02em;margin:0 0 12px;}
  .vxh-left h1 span{color:var(--accent);}
  .vxh-lead{margin:0 0 18px;font-size:15px;line-height:1.5;color:var(--text-soft);text-wrap:pretty;}
  .vxh-quicks{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:24px;}
  .vxh-quick{display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 12px;border-radius:99px;border:1px solid var(--line);background:var(--card);color:var(--text);font-size:12.5px;font-weight:700;transition:border-color .15s,color .15s;}
  .vxh-quick i{color:var(--accent);font-size:15px;}
  .vxh-quick:hover{border-color:var(--accent);color:var(--accent-dark);}
  .vxh-cap{font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--text-faint);margin-bottom:10px;}
  .vxh-trusts{display:flex;flex-direction:column;gap:10px;}
  .vxh-trust{display:flex;align-items:center;gap:12px;padding:12px;border-radius:14px;background:var(--card);border:1px solid var(--line);}
  .vxh-trust>span{width:48px;height:48px;border-radius:12px;display:grid;place-items:center;font-size:26px;flex-shrink:0;}
  .vxh-trust b{display:block;font-size:13px;font-weight:800;line-height:1.35;}
  .vxh-trust small{display:block;font-size:12px;color:var(--text-soft);line-height:1.35;margin-top:2px;}
  /* хаб на кресленні */
  .vxh-hub{position:relative;width:700px;height:640px;border-radius:28px;background-color:var(--bg2);background-image:radial-gradient(var(--line4) 1px,transparent 1px);background-size:20px 20px;background-position:10px 10px;}
  .vxh-lines{position:absolute;inset:0;width:700px;height:640px;}
  .vxh-core{position:absolute;left:275px;top:255px;width:150px;height:150px;border-radius:50%;border:0;background:var(--dark);color:var(--on-dark);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;box-shadow:0 10px 28px rgba(60,48,30,.22),0 0 0 8px var(--bg2),0 0 0 9px var(--line4);transition:transform .18s,box-shadow .18s;}
  .vxh-core>i{font-size:40px;color:var(--yellow);}
  .vxh-core b{font-family:var(--f-head);font-size:13px;font-weight:700;}
  .vxh-core span{display:flex;align-items:center;gap:4px;font-size:12px;font-weight:700;color:var(--yellow);}
  .vxh-core:hover{transform:translateY(-2px);box-shadow:0 14px 36px rgba(60,48,30,.28),0 0 0 8px var(--bg2),0 0 0 9px var(--line4);}
  .vxh-node{position:absolute;width:180px;height:140px;box-sizing:border-box;padding:12px;border-radius:16px;background:var(--card);border:1px solid var(--line);display:flex;flex-direction:column;gap:8px;text-align:left;color:var(--text);box-shadow:0 1px 2px rgba(60,48,30,.06),0 4px 12px rgba(60,48,30,.06);transition:transform .18s,box-shadow .18s,border-color .18s;}
  .vxh-node.vxh-entry{border-style:dashed;border-color:var(--line4);}
  .vxh-node:hover{transform:translateY(-3px);border-color:var(--nf);box-shadow:0 12px 30px rgba(60,48,30,.18);}
  .vxh-node:active{transform:scale(.99);}
  .vxh-nh{display:flex;align-items:center;gap:10px;}
  .vxh-ni{width:48px;height:48px;border-radius:12px;background:var(--nb);color:var(--nf);display:grid;place-items:center;font-size:27px;flex-shrink:0;}
  .vxh-nt{display:flex;flex-direction:column;gap:3px;min-width:0;}
  .vxh-nt b{font-size:14px;font-weight:800;line-height:1.2;}
  .vxh-nt em{font-style:normal;font-size:11px;font-weight:800;color:color-mix(in srgb,var(--nf) 72%,var(--text));}
  .vxh-entry .vxh-nt em{letter-spacing:.06em;text-transform:uppercase;color:var(--text-faint);}
  .vxh-nl{font-size:12px;line-height:1.4;color:var(--text-soft);}
  .vxh-ng{font-size:11px;font-weight:700;color:color-mix(in srgb,var(--nf) 72%,var(--text));white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-right:16px;}
  .vxh-entry .vxh-ng{color:var(--text-soft);}
  .vxh-go{position:absolute;right:10px;bottom:10px;font-size:14px;color:var(--nf);opacity:.45;transition:opacity .15s;}
  .vxh-entry .vxh-go{color:var(--text);}
  .vxh-node:hover .vxh-go{opacity:1;}
  /* права колонка */
  .vxh-right{display:flex;flex-direction:column;gap:14px;}
  .vxh-est{display:flex;flex-direction:column;padding:0;text-align:left;border-radius:16px;background:var(--card);border:1px solid var(--line);overflow:hidden;color:var(--text);box-shadow:0 1px 2px rgba(60,48,30,.06),0 4px 12px rgba(60,48,30,.06);transition:transform .18s,box-shadow .18s;}
  .vxh-est:hover{transform:translateY(-2px);box-shadow:0 10px 28px rgba(60,48,30,.14);}
  .vxh-est>span{display:flex;}
  .vxh-eh{align-items:center;gap:8px;padding:12px 16px;border-bottom:1px solid var(--line3);}
  .vxh-eh b{font-family:var(--f-head);font-size:13px;font-weight:700;flex:1;}
  .vxh-ei{width:28px;height:28px;border-radius:8px;background:var(--accent-bg);color:var(--accent);display:grid;place-items:center;font-size:16px;}
  .vxh-live{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;color:var(--ok-text);background:var(--ok-bg);border-radius:99px;padding:3px 9px;}
  .vxh-live span{width:6px;height:6px;border-radius:50%;background:var(--ok);animation:vxPulse 2s infinite;}
  .vxh-tot{align-items:flex-end;justify-content:space-between;gap:10px;padding:12px 16px 8px;}
  .vxh-tot small{font-size:11px;color:var(--text-soft);line-height:1.3;text-align:right;}
  .vxh-tot span small{display:block;text-align:left;font-size:12px;font-weight:700;}
  .vxh-tot b{display:block;font-family:var(--f-head);font-size:22px;font-weight:700;color:var(--accent);line-height:1.15;font-variant-numeric:tabular-nums;}
  .vxh-empty{align-items:flex-start;gap:10px;padding:14px 16px;font-size:12.5px;line-height:1.45;color:var(--text-soft);}
  .vxh-empty i{font-size:22px;color:var(--accent);flex-shrink:0;}
  .vxh-bars{flex-direction:column;gap:5px;padding:4px 16px 12px;}
  .vxh-bar{display:flex;align-items:center;gap:8px;height:18px;font-size:11px;}
  .vxh-bn{width:96px;flex-shrink:0;color:var(--text-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .vxh-bt{flex:1;height:6px;border-radius:3px;background:var(--line3);overflow:hidden;}
  .vxh-bt span{display:block;height:100%;border-radius:3px;}
  .vxh-bv{width:78px;flex-shrink:0;text-align:right;font-family:var(--f-mono);font-size:10.5px;color:var(--text-soft);white-space:nowrap;}
  .vxh-leg{flex-direction:column;gap:6px;padding:10px 16px 12px;border-top:1px solid var(--line3);}
  .vxh-leg span{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--text-soft);}
  .vxh-leg i{width:8px;height:8px;border-radius:2px;flex-shrink:0;}
  .vxh-open{align-items:center;justify-content:space-between;padding:10px 16px;background:var(--card2);border-top:1px solid var(--line3);font-size:13px;font-weight:700;color:var(--accent);}
  .vxh-roles{padding:14px 16px;border-radius:16px;background:var(--card);border:1px solid var(--line);}
  .vxh-roles>b{display:block;font-family:var(--f-head);font-size:13px;font-weight:700;}
  .vxh-roles>small{display:block;font-size:12px;color:var(--text-soft);line-height:1.4;margin:2px 0 10px;}
  .vxh-roles>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;}
  .vxh-role{display:flex;align-items:center;gap:8px;height:44px;padding:0 10px;border-radius:10px;background:var(--bg);border:1px solid var(--line);color:var(--text);font-size:12px;font-weight:700;transition:border-color .15s;}
  .vxh-role i{font-size:18px;}
  .vxh-role:hover{border-color:var(--accent);}
  /* стрічка циклу */
  .vxh-band{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:16px;padding:18px 24px;border-radius:16px;background:var(--dark);color:var(--on-dark);}
  .vxh-bh{display:flex;align-items:center;gap:14px;flex:0 1 330px;min-width:260px;}
  .vxh-bh>span{width:40px;height:40px;border-radius:12px;background:rgba(255,255,255,.08);color:var(--yellow);display:grid;place-items:center;font-size:22px;flex-shrink:0;}
  .vxh-bh b{display:block;font-family:var(--f-head);font-size:14px;font-weight:700;}
  .vxh-bh small{display:block;font-size:12px;line-height:1.4;color:#B9BCC6;margin-top:3px;}
  .vxh-chips{display:flex;align-items:center;gap:5px;flex-wrap:wrap;}
  .vxh-arr{color:#8A8F9C;font-size:15px;}
  .vxh-chip{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 10px 0 6px;border-radius:10px;border:0;background:var(--nb);color:color-mix(in srgb,var(--nf) 72%,var(--text));font-size:13px;font-weight:700;}
  .vxh-chip span{width:26px;height:26px;border-radius:7px;background:var(--card);display:grid;place-items:center;font-size:11px;font-weight:800;font-variant-numeric:tabular-nums;}
  .vxh-chip:hover{filter:brightness(1.06);}
  .vxh-ents{display:flex;gap:8px;flex-shrink:0;}
  .vxh-ents button{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 10px;border-radius:8px;border:1px dashed #4B5060;background:none;color:#C9CCD4;font-size:12px;font-weight:700;}
  .vxh-ents button:hover{color:#fff;border-color:#8A8F9C;}
  .vxh-ents i{width:8px;height:8px;border-radius:50%;}
  /* футер */
  .vxh-foot{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 24px;padding:16px 0 20px;font-size:13px;color:var(--text-soft);}
  .vxh-foot b{color:var(--text);}
  .vxh-foot>div{display:flex;align-items:center;flex-wrap:wrap;gap:6px 20px;}
  .vxh-foot a,.vxh-foot button{color:var(--text-soft);font-weight:600;text-decoration:none;background:none;border:0;padding:0;font-size:13px;}
  .vxh-foot a:hover,.vxh-foot button:hover{color:var(--text);}
  .vxh-foot>div>span{color:var(--text-faint);}
  @media(prefers-reduced-motion:reduce){ .vxh-node,.vxh-core,.vxh-est{transition:none;} .vxh-node:hover,.vxh-core:hover,.vxh-est:hover{transform:none;} }
  /* Вписування в екран (vxhFit, десктоп і горизонтальний планшет): сторінка верстається рівно 1440 px і
     масштабується zoom'ом під вікно — без прокрутки. zoom (не transform) — щоб
     масштабована висота справді займала менше місця в потоці. */
  .vxh.vxh-fit{width:1440px;max-width:none;margin:0;padding-bottom:0;}
  .vxh.vxh-fit .vxh-foot{padding:12px 0 14px;}
  /* ── Компактна версія .vxh-m (клас .vxh-compact, ставить vxhCompact()): смартфон ≤760 і
     вертикальний планшет ≤1100 — коло в мініатюрі на один екран. vxhFit стискає/збільшує
     її zoom'ом під висоту, ширина підганяється під екран. Решта ширин — .vxh-fit
     (1440-розкладка під вікно), тож окремих адаптивних сіток більше немає. ── */
  .vxh-m{display:none;}
    .vxh.vxh-compact{padding:10px 14px 0;max-width:none;margin:0;}
    .vxh-compact .vxh-main,.vxh-compact .vxh-band,.vxh-compact .vxh-foot{display:none !important;}
    .vxh-compact .vxh-m{display:flex;flex-direction:column;gap:10px;}
    .vxh-m h1{font-family:var(--f-head);font-weight:700;font-size:24px;line-height:1.1;letter-spacing:-.02em;margin:0;}
    .vxh-m h1 span{color:var(--accent);}
    .vxh-m>p{margin:0;font-size:13px;line-height:1.45;color:var(--text-soft);}
    .vxh-ring{position:relative;width:min(100%,360px);aspect-ratio:1;margin:0 auto 14px;border-radius:50%;background-color:var(--bg2);background-image:radial-gradient(var(--line4) 1px,transparent 1px);background-size:14px 14px;}
    .vxh-ring svg{position:absolute;inset:0;width:100%;height:100%;}
    .vxh-mcore{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:31%;aspect-ratio:1;border-radius:50%;border:0;background:var(--dark);color:var(--on-dark);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;box-shadow:0 8px 20px rgba(60,48,30,.22),0 0 0 6px var(--bg2),0 0 0 7px var(--line4);}
    .vxh-mcore>i{font-size:26px;color:var(--yellow);}
    .vxh-mcore b{font-family:var(--f-head);font-size:11px;font-weight:700;}
    .vxh-mcore span{display:flex;align-items:center;gap:3px;font-size:10.5px;font-weight:700;color:var(--yellow);}
    .vxh-mn{position:absolute;transform:translate(-50%,-26px);width:84px;display:flex;flex-direction:column;align-items:center;gap:3px;padding:0;border:0;background:none;color:var(--text);}
    .vxh-mn>span{width:52px;height:52px;border-radius:16px;background:var(--nb);color:var(--nf);display:grid;place-items:center;font-size:26px;border:1px solid var(--line);box-shadow:0 4px 12px rgba(60,48,30,.12);}
    .vxh-mn.vxh-entry>span{border:1.5px dashed var(--line4);}
    .vxh-mn b{font-size:11px;font-weight:800;line-height:1.1;text-align:center;background:var(--bg2);border-radius:6px;padding:1px 4px;}
    .vxh-mn:active>span{transform:scale(.94);}
    .vxh-mrow{display:flex;flex-direction:column;gap:6px;}
    .vxh-mrow>small{font-size:10.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--text-faint);}
    .vxh-mrow>div{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;}
    .vxh-mrow button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:52px;padding:6px 2px;border-radius:12px;border:1px solid var(--line);background:var(--card);color:var(--text);font-size:10.5px;font-weight:700;line-height:1.15;text-align:center;}
    .vxh-mrow button i{font-size:19px;}
    .vxh-mtrust{display:flex;justify-content:space-between;gap:6px;font-size:10.5px;font-weight:700;color:var(--text-soft);}
    .vxh-mtrust span{display:flex;align-items:center;gap:4px;}
    .vxh-mtrust i{font-size:14px;}
    .vxh-mfoot{display:flex;flex-wrap:wrap;justify-content:center;gap:2px 12px;padding-bottom:10px;font-size:10.5px;color:var(--text-faint);}
    .vxh-mfoot a{color:var(--text-soft);font-weight:600;text-decoration:none;}
  /* ── Шапка 2.0 (єдина шапка прода) ── */
  .v2hdr{position:sticky;top:0;z-index:60;background:var(--hdr-bg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--line);}
  .v2hdr-in{max-width:1440px;margin:0 auto;padding:9px 22px;min-height:48px;display:flex;align-items:center;gap:12px;}
  .v2hdr-in.v2hdr-wide{max-width:none;}   /* товари постачальника: шапка йде врівень з широкою таблицею нижче */
  .v2brand{display:flex;align-items:center;gap:9px;background:none;border:0;cursor:pointer;padding:0;flex-shrink:0;}
  .v2v{width:30px;height:30px;border-radius:9px;background:var(--accent);color:var(--yellow);display:grid;place-items:center;font-family:var(--f-head);font-weight:700;font-size:14px;}
  .v2brand b{font-family:var(--f-head);font-weight:700;font-size:15px;letter-spacing:-.02em;color:var(--text);white-space:nowrap;}
  .v2brand b i{color:var(--accent);font-style:normal;}
  .v220{font-family:var(--f-mono);font-size:10px;font-weight:800;color:var(--accent);background:var(--accent-bg);border-radius:6px;padding:2px 5px;}
  .v2demo{flex-shrink:0;display:inline-flex;align-items:center;gap:4px;background:#FEF3C7;color:#92600A;border:1px solid #F5D98B;border-radius:99px;padding:3px 9px;font-size:10.5px;font-weight:800;letter-spacing:.03em;text-transform:uppercase;white-space:nowrap;}
  .v2nav{display:flex;align-items:center;gap:4px;flex:1 1 0;min-width:0;justify-content:center;flex-wrap:wrap;}
  .v2np{display:inline-flex;align-items:center;gap:7px;border:1.5px solid var(--line4);background:var(--card);color:var(--text-soft);border-radius:99px;padding:8px 15px;font-size:13.5px;font-weight:650;cursor:pointer;white-space:nowrap;font-family:inherit;transition:background .14s,color .14s,border-color .14s;}
  .v2np:hover{background:var(--card);color:var(--accent-dark);border-color:var(--accent);}
  .v2np.on{background:var(--dark);color:var(--on-dark);border-color:var(--text);}
  .v2np i{font-size:16px;}
  .v2right{display:flex;align-items:center;gap:9px;flex-shrink:0;}
  .v2ico{position:relative;width:38px;height:38px;border-radius:50%;border:1.5px solid var(--line4);background:var(--card);color:var(--text-soft);cursor:pointer;font-size:16px;display:grid;place-items:center;}
  .v2ico:hover{border-color:var(--accent);color:var(--accent);}
  .v2dot{position:absolute;top:-3px;right:-3px;min-width:16px;height:16px;border-radius:99px;background:var(--err);color:#fff;font-size:9.5px;font-weight:800;display:grid;place-items:center;padding:0 4px;}
  .v2bell{position:absolute;right:0;top:46px;width:330px;background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:0 20px 48px rgba(0,0,0,.18);z-index:80;overflow:hidden;}
  .v2ico.on{border-color:var(--accent);color:var(--accent);background:var(--accent-bg);}
  /* кнопка пошуку в шапці */
  .v2search{display:inline-flex;align-items:center;gap:8px;border:1.5px solid var(--line4);background:var(--card);color:var(--text-faint);border-radius:99px;padding:8px 13px;font-family:inherit;font-size:12.5px;font-weight:600;cursor:pointer;flex-shrink:0;}
  .v2search:hover{border-color:var(--accent);color:var(--accent);}
  .v2search i{font-size:15px;}
  .v2search kbd{font-family:var(--f-mono);font-size:10px;background:var(--bg2);border:1px solid var(--line4);border-radius:5px;padding:1px 5px;color:var(--text-soft);}
  /* ⚙ панель налаштувань: одиниці · валюта · мова · тема */
  .v2setp{position:absolute;right:0;top:46px;width:262px;background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:0 20px 48px rgba(0,0,0,.18);z-index:80;padding:6px 12px;}
  .v2setrow{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 0;border-bottom:1px solid var(--line3);}
  .v2setrow>span{font-size:11.5px;font-weight:700;color:var(--text-soft);}
  .v2seg{display:inline-flex;gap:2px;background:var(--bg2);border:1px solid var(--line4);border-radius:9px;padding:2px;flex-shrink:0;}
  .v2seg button{border:0;background:transparent;border-radius:7px;padding:5px 9px;font-family:inherit;font-size:11.5px;font-weight:800;color:var(--text-soft);cursor:pointer;white-space:nowrap;}
  .v2seg button.on{background:var(--card);color:var(--accent-dark);box-shadow:0 1px 4px rgba(0,0,0,.12);}
  /* ── КОНСОЛІДОВАНЕ МЕНЮ КОРИСТУВАЧА (не-Головні екрани, 2026-08-16) ── */
  .v2um-trig{display:inline-flex;align-items:center;gap:7px;border:1.5px solid var(--line4);background:var(--card);border-radius:99px;padding:3px 9px 3px 3px;cursor:pointer;position:relative;}
  .v2um-trig:hover{border-color:var(--accent);}
  .v2um-trig.on{border-color:var(--accent);background:var(--accent-bg);}
  .v2um-av{width:30px;height:30px;border-radius:50%;background:var(--accent);color:#fff;display:grid;place-items:center;font-size:13px;font-weight:800;flex-shrink:0;}
  .v2um-av.lg{width:36px;height:36px;font-size:15px;}
  .v2um-panel{position:absolute;right:0;top:48px;width:300px;max-width:calc(100vw - 24px);background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:0 20px 48px rgba(0,0,0,.18);z-index:80;padding:10px 12px;max-height:min(78vh,640px);overflow-y:auto;}
  .v2um-brand{display:flex;align-items:center;gap:9px;background:none;border:0;cursor:pointer;padding:6px 4px 12px;width:100%;border-bottom:1px solid var(--line3);margin-bottom:8px;}
  .v2um-brand b{font-family:var(--f-head);font-weight:700;font-size:15px;letter-spacing:-.02em;color:var(--text);white-space:nowrap;}
  .v2um-brand b i{color:var(--accent);font-style:normal;}
  .v2um-acts{display:flex;gap:8px;margin-bottom:6px;}
  .v2um-act{flex:1;display:flex;flex-direction:column;align-items:center;gap:5px;border:1.5px solid var(--line4);background:var(--card);border-radius:11px;padding:11px 6px;font-family:inherit;font-size:11.5px;font-weight:700;color:var(--text-soft);cursor:pointer;}
  .v2um-act:hover{border-color:var(--accent);color:var(--accent-dark);}
  .v2um-act i{font-size:18px;}
  .v2um-sect{font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--text-faint);padding:10px 4px 4px;}
  .v2um-notif{display:flex;flex-direction:column;max-height:190px;overflow-y:auto;}
  .v2um-nrow{display:flex;gap:9px;align-items:flex-start;text-align:left;border:0;background:none;padding:8px 6px;border-radius:9px;cursor:pointer;width:100%;font-family:inherit;}
  .v2um-nrow:hover{background:var(--bg2);}
  .v2um-nic{width:26px;height:26px;border-radius:8px;display:grid;place-items:center;font-size:13px;flex-shrink:0;}
  .v2um-ntx{flex:1;font-size:12px;line-height:1.4;color:var(--text);}
  .v2um-ntx small{display:block;font-size:10px;color:var(--text-faint);font-weight:700;margin-top:2px;}
  .v2um-empty{font-size:11.5px;color:var(--text-faint);font-weight:600;padding:8px 6px;}
  .v2um-set{padding:0 4px;}
  .v2um-divider{height:1px;background:var(--line3);margin:10px 0 8px;}
  .v2um-id{display:flex;align-items:center;gap:10px;padding:4px 4px 10px;}
  .v2um-row{display:flex;align-items:center;gap:10px;width:100%;text-align:left;border:0;background:none;padding:11px 8px;border-radius:9px;font-family:inherit;font-size:13px;font-weight:700;color:var(--text);cursor:pointer;}
  .v2um-row:hover{background:var(--bg2);}
  .v2um-row i{font-size:17px;color:var(--text-soft);}
  .v2um-danger{color:var(--err-text);}
  .v2um-danger i{color:var(--err-text);}
  /* ── Оверлей пошуку (⌘K) + модалка довідки ── */
  .v2sov{position:fixed;inset:0;z-index:120;background:rgba(18,20,25,.5);backdrop-filter:blur(3px);display:flex;justify-content:center;align-items:flex-start;padding:12vh 18px 18px;}
  .v2sbox{width:100%;max-width:600px;background:var(--card);border:1px solid var(--line);border-radius:18px;box-shadow:0 30px 70px rgba(0,0,0,.35);overflow:hidden;display:flex;flex-direction:column;max-height:70vh;}
  .v2sin{display:flex;align-items:center;gap:11px;padding:15px 18px;border-bottom:1px solid var(--line3);flex-shrink:0;}
  .v2sin>i{font-size:19px;color:var(--text-faint);}
  .v2sin input{flex:1;border:0;outline:0;background:none;font-family:inherit;font-size:15px;color:var(--text);min-width:0;}
  /* .v2sin input навмисно без рамки (безрамковий пошук у картці) — global :focus-visible
     тут не спрацював би (нижча специфічність за outline:0 вище), тож фокус повертаємо тут. */
  .v2sin input:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}
  .v2sesc{border:1px solid var(--line4);background:var(--bg2);border-radius:6px;padding:3px 8px;font-family:var(--f-mono);font-size:10.5px;color:var(--text-soft);cursor:pointer;}
  .v2sres{overflow-y:auto;padding:8px;}
  .v2sgrp{font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--text-faint);padding:9px 10px 5px;}
  .v2srow{display:flex;align-items:center;gap:11px;width:100%;border:0;background:none;border-radius:10px;padding:9px 11px;font-family:inherit;font-size:13.5px;color:var(--text);cursor:pointer;text-align:left;}
  .v2srow:hover,.v2srow.on{background:var(--accent-bg);color:var(--accent-dark);}
  .v2srow i{font-size:17px;color:var(--text-faint);flex-shrink:0;}
  .v2srow.on i,.v2srow:hover i{color:var(--accent);}
  .v2sl{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600;}
  .v2sm{font-size:11px;color:var(--text-faint);flex-shrink:0;max-width:40%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  .v2sempty{text-align:center;padding:34px 20px;color:var(--text-faint);}
  .v2sempty i{font-size:28px;}
  .v2sempty div{font-size:13.5px;font-weight:700;margin:9px 0 4px;color:var(--text-soft);}
  .v2sempty small{font-size:11.5px;line-height:1.5;display:block;max-width:330px;margin:0 auto;}
  .v2hbox{width:100%;max-width:540px;background:var(--card);border:1px solid var(--line);border-radius:18px;box-shadow:0 30px 70px rgba(0,0,0,.35);overflow:hidden;max-height:76vh;display:flex;flex-direction:column;}
  .v2hh{display:flex;align-items:center;justify-content:space-between;padding:15px 18px;border-bottom:1px solid var(--line3);flex-shrink:0;}
  .v2hh b{font-family:var(--f-head);font-size:16px;}
  .v2hb{padding:16px 18px 20px;overflow-y:auto;}
  .v2hsecs{display:flex;flex-direction:column;gap:12px;margin-bottom:20px;}
  .v2hsec{display:flex;gap:12px;align-items:flex-start;}
  .v2hsec>i{font-size:20px;color:var(--accent);flex-shrink:0;margin-top:1px;}
  .v2hsec b{font-size:13.5px;display:block;margin-bottom:2px;}
  .v2hsec span{font-size:12.5px;color:var(--text-soft);line-height:1.5;}
  .v2hkt{font-size:10.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--text-faint);margin-bottom:9px;}
  .v2hkeys{display:grid;grid-template-columns:1fr 1fr;gap:8px 18px;}
  .v2hk{display:flex;align-items:center;gap:10px;font-size:12.5px;color:var(--text-soft);}
  .v2hk kbd{font-family:var(--f-mono);font-size:10.5px;background:var(--bg2);border:1px solid var(--line4);border-radius:5px;padding:2px 7px;color:var(--text-soft);white-space:nowrap;}
  .v2sethelp{display:flex;align-items:center;gap:9px;width:100%;border:0;background:none;border-radius:9px;padding:10px 8px;margin:4px 0 2px;font-family:inherit;font-size:12.5px;font-weight:700;color:var(--text-soft);cursor:pointer;text-align:left;}
  .v2sethelp:hover{background:var(--accent-bg);color:var(--accent-dark);}
  .v2sethelp i{font-size:16px;}
  @media(max-width:1150px){ .v2np span{display:none;} .v2np{padding:8px 11px;} .v2search .stxt,.v2search kbd{display:none;} .v2search{padding:9px;} }
  /* Телефон: шапка двома смугами. Рядок 1 — бренд + дії, рядок 2 — навігація ОДНІЄЮ
     горизонтальною стрічкою (без переносу). Тему й довідку прибираємо з рейки —
     обидві лишаються доступними в ⚙-панелі, тож нічого не втрачено. */
  @media(max-width:760px){
    .v2brand b i{display:none;}
    .v2hdr-in{gap:8px;padding:8px 12px;flex-wrap:wrap;row-gap:6px;}
    .v2nav{order:10;flex:1 1 100%;justify-content:flex-start;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;gap:2px;margin:0 -12px -2px;padding:0 12px;}
    .v2nav::-webkit-scrollbar{display:none;}
    .v2nav>*{flex-shrink:0;}
    .v2right{margin-left:auto;gap:6px;}
    .v2-opt{display:none;}
    .v2ico{width:34px;height:34px;font-size:15px;}
    .v2hkeys{grid-template-columns:1fr;}
    .v2sov{padding:8vh 12px 12px;}
    .v2setp{width:min(262px,calc(100vw - 24px));}
  }
  /* ── Кабінет 2.0: рейка + таби (redesign, лише за v2on) ── */
  .cabv2-in{max-width:1240px;margin:0 auto;padding:22px 24px 70px;display:flex;gap:22px;align-items:flex-start;}
  .cabv2-in.cabv2-wide{max-width:none;}   /* товари постачальника: широка таблиця на весь екран */
  .cabv2-rail{position:sticky;top:70px;width:236px;flex-shrink:0;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:14px;display:flex;flex-direction:column;gap:14px;}
  .cabv2-ctx{display:flex;align-items:center;gap:11px;padding:6px 4px 12px;border-bottom:1px solid var(--line3);}
  .cabv2-av{width:40px;height:40px;border-radius:12px;background:var(--accent);color:#fff;display:grid;place-items:center;font-family:var(--f-head);font-weight:700;font-size:16px;flex-shrink:0;}
  .cabv2-who b{font-size:14px;display:block;}.cabv2-who small{font-size:11px;color:var(--text-faint);}
  .cabv2-sw{display:flex;gap:3px;background:var(--line3);border:1px solid var(--line4);border-radius:10px;padding:3px;margin-bottom:4px;}
  .cabv2-swb{flex:1;border:0;background:transparent;border-radius:8px;padding:7px 4px;font-size:11.5px;font-weight:700;cursor:pointer;color:var(--text-soft);font-family:inherit;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .cabv2-swb.on{background:var(--card);box-shadow:0 1px 4px rgba(32,36,43,.12);color:var(--accent-dark);}
  .cabv2-nav{display:flex;flex-direction:column;gap:3px;}
  .cabv2-ri{display:flex;align-items:center;gap:11px;border:0;background:none;border-radius:11px;padding:10px 12px;cursor:pointer;font-family:inherit;font-size:13.5px;font-weight:650;color:var(--text-soft);text-align:left;width:100%;transition:background .14s,color .14s;}
  .cabv2-ri i{font-size:18px;}.cabv2-ri span{flex:1;}
  .cabv2-ri:hover{background:var(--bg2);color:var(--text);}
  .cabv2-ri.on{background:var(--accent-bg);color:var(--accent-dark);font-weight:750;}
  .cabv2-rc{font-family:var(--f-mono);font-size:11px;font-weight:800;background:var(--line3);color:var(--text-soft);border-radius:99px;min-width:20px;height:20px;display:inline-grid;place-items:center;padding:0 6px;}
  .cabv2-ri.on .cabv2-rc{background:var(--accent);color:#fff;}
  .cabv2-foot{margin-top:auto;padding-top:12px;border-top:1px solid var(--line3);display:flex;flex-direction:column;gap:6px;}
  /* «Вийти» — єдина деструктивна дія акаунта, тому червона; решта пунктів
     рейки лишаються нейтральними. Живе всередині рядка «Профіль» (крок 15.1):
     сам «Профіль» тягнеться на решту ширини, «Вийти» тулиться праворуч. */
  .cabv2-out{color:var(--err-text);}
  .cabv2-out:hover{background:var(--err-bg);color:var(--err-text);}
  .cabv2-profrow{display:flex;align-items:center;gap:4px;}
  .cabv2-profrow>.cabv2-ri{flex:1;min-width:0;}
  .cabv2-profrow>.cabv2-ri span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  /* width:auto обов'язковий: .cabv2-ri несе width:100%, і з flex-basis:auto
     «Вийти» забирало б увесь рядок, лишаючи «Профілю» самі відступи. */
  .cabv2-outmini{flex:none !important;width:auto !important;gap:6px;padding:10px 11px;font-size:12.5px;}
  .cabv2-outmini i{font-size:17px;}
  .cabv2-new{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--accent);color:#fff;border:0;border-radius:12px;padding:11px 16px;font-size:13px;font-weight:800;cursor:pointer;}
  .cabv2-main{flex:1;min-width:0;}
  .cabv2-mh{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:18px;flex-wrap:wrap;}
  .cabv2-mh h2{font-family:var(--f-head);font-size:23px;font-weight:700;margin:0;}
  .cabv2-newtop{display:inline-flex;align-items:center;gap:8px;background:var(--accent);color:#fff;border:0;border-radius:12px;padding:10px 18px;font-size:13.5px;font-weight:800;cursor:pointer;}
  .cabv2-kpis{display:grid;grid-template-columns:repeat(4,minmax(120px,1fr));gap:12px;margin-bottom:18px;}
  .cabv2-kpi{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:14px 16px;}
  .cabv2-kpi span{font-size:11px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--text-faint);display:block;margin-bottom:6px;}
  .cabv2-kpi b{font-family:var(--f-mono);font-size:19px;}
  .cabv2-card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:17px 19px;margin-bottom:16px;}
  .cabv2-ch{display:flex;align-items:center;gap:9px;margin-bottom:12px;}
  .cabv2-chi{width:27px;height:27px;border-radius:8px;display:grid;place-items:center;font-size:15px;}
  .cabv2-badge{font-size:11px;font-weight:800;color:var(--warn-text);background:var(--warn-bg);border-radius:99px;padding:2px 9px;}
  .cabv2-ct{font-size:13.5px;display:block;margin-bottom:12px;}
  /* Порожній стан «повний каркас»: підписи-поля + плашка «Інформація поки відсутня».
     Мета — жодних порожніх зон; видно, ЩО зʼявиться, коли дані будуть. */
  .cabv2-skel{display:flex;flex-direction:column;gap:9px;margin:2px 0 14px;}
  .cabv2-skel-row{display:flex;align-items:center;gap:12px;}
  .cabv2-skel-l{flex:0 0 38%;max-width:210px;font-size:12px;font-weight:700;color:var(--text-soft);}
  .cabv2-skel-b{flex:1;height:32px;border-radius:9px;border:1.5px dashed var(--line4);background:var(--card2);}
  .cabv2-emp{display:flex;align-items:flex-start;gap:11px;background:var(--accent-bg);border:1px dashed var(--line4);border-radius:12px;padding:12px 14px;}
  .cabv2-emp-ic{width:30px;height:30px;flex-shrink:0;border-radius:9px;background:var(--card);color:var(--accent-dark);display:grid;place-items:center;font-size:16px;}
  .cabv2-emp b{display:block;font-size:12.5px;color:var(--accent-dark);}
  .cabv2-emp small{display:block;font-size:11.5px;color:var(--text-soft);margin-top:2px;line-height:1.4;}
  .cabv2-al{display:flex;align-items:center;gap:12px;border:1px solid var(--line3);border-radius:12px;padding:10px 13px;}
  .cabv2-ali{width:34px;height:34px;flex-shrink:0;border-radius:9px;display:grid;place-items:center;font-size:16px;}
  .cabv2-albtn{flex-shrink:0;border:1.5px solid var(--line2);background:var(--card2);border-radius:10px;padding:8px 13px;font-size:12px;font-weight:800;cursor:pointer;color:var(--text);white-space:nowrap;}
  .cabv2-2col{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
  /* Кошик у табі «Оплати»: список ліворуч, картка оплати вузькою колонкою праворуч.
     Окремий клас, бо .cabv2-2col (1fr 1fr) тут дає надто широку праву колонку. */
  .cabv2-pay{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:16px;align-items:start;}
  .cabv2-pay .cabv2-card{margin-bottom:0;}
  /* box-sizing: на телефоні рейка стає width:100%, а вона content-box — padding 14
     і рамка додавались ЗВЕРХУ, даючи 6px горизонтального оверфлоу на 375px
     (пре-існуюче з кроку 3, знайдено при перекомпонуванні «Вийти»). */
  /* align-items:stretch обов'язковий: .cabv2-in несе align-items:flex-start (для
     sticky-рейки на десктопі), а в колонці (мобільний) це лишає .cabv2-main
     (flex:1) без розтягування на всю ширину — він бере власну min-content
     ширину замість ширини контейнера. Симптом: оверфлоу 375→398 на кабінеті
     замовника (KPI-рядок), 375→2214 на ERP-канбані «Ліди», 375→566 на
     pro-nomen (таблиця) — усі три мали ОДНУ причину, знайдено в сесії 18. */
  @media(max-width:900px){ .cabv2-in{flex-direction:column;align-items:stretch;} .cabv2-rail{position:static;width:100%;box-sizing:border-box;} .cabv2-kpis{grid-template-columns:1fr 1fr;} .cabv2-2col{grid-template-columns:1fr;} .cabv2-pay{grid-template-columns:1fr;} }
  /* ── «Товари та склади» постачальника: єдина зона скролу — сторінка НЕ гортається,
     скролиться лише сама таблиця (як у Notion/Airtable). До цього тут було ДВА скролу
     одразу: сторінка (щоб дістатись таблиці під шапкою/рейкою/фільтрами) + сама таблиця
     (max-height:72vh, бо 2785 товарів). body.vx-nomen-lock фіксує viewport; .cabv2-main
     стає flex-колонкою, де все, КРІМ .vx-tbl-scroll, лишає свою природну висоту, а
     таблиця забирає весь залишок і скролиться сама. Скоуп — лише цей екран (клас
     на body ставить render() лише для pro-nomen/supplier/tab≠wh), інші кабінети без змін.
     Висоту .cabv2-in.cabv2-wide НЕ рахуємо тут фіксованим calc(100vh−N) — N «пливе»
     (demo-банер/roleBar/повідомлення можуть додати рядок над контентом) — її виставляє
     vxNomenLockSync() у vx-erp.js інлайн-стилем за реальним offsetTop елемента. */
  body.vx-nomen-lock{overflow:hidden;}
  /* align-items:stretch обов'язковий: базовий .cabv2-in несе flex-start, тож рейка й
     .cabv2-main просто беруть свою природну (контентну) висоту й ПЕРЕЛИВАЮТЬСЯ за межі
     фіксованої висоти — stretch змушує обидва зайняти всю висоту ряду, а вже
     min-height:0 на .cabv2-main дозволяє flex-колонці всередині стиснутись і віддати
     залишок таблиці (без min-height:0 flex-item не стискається нижче контенту). */
  body.vx-nomen-lock .cabv2-in.cabv2-wide{overflow:hidden;padding-top:14px;padding-bottom:10px;box-sizing:border-box;align-items:stretch;}
  /* align-self:flex-start повертає рейці КОНТЕНТНУ висоту: stretch на .cabv2-in вище
     потрібен лише .cabv2-main (щоб таблиця забрала залишок), а рейку він розтягував на
     весь viewport — картка меню виглядала інакше, ніж у решті кабінетів. */
  /* position:static: сторінка тут не гортається, а .cabv2-in із overflow:hidden стає
     скролпортом для sticky — top:70px зсував рейку на 70px нижче за панель праворуч. */
  body.vx-nomen-lock .cabv2-rail{position:static;align-self:flex-start;max-height:100%;overflow-y:auto;flex-shrink:0;}
  /* .cabv2-main огортає ГОТОВИЙ HTML з secWrap() — <section><div style="max-width…">…
     — обидві ці безкласові обгортки теж мусять стати ланками flex-колонки, інакше
     flex:1 на .vx-tbl-scroll ігнорується (він не прямий flex-item жодного flex-контейнера).
     nomenGoodsPanel не огортає СВІЙ вивід власним div — усі шматки (шапка/kpi/фільтри/
     таблиця) лежать прямими siblings усередині div secWrap, тож `>div>*` дістає їх усі. */
  body.vx-nomen-lock .cabv2-main{display:flex;flex-direction:column;overflow:hidden;min-height:0;}
  body.vx-nomen-lock .cabv2-main>section{display:flex;flex-direction:column;flex:1;min-height:0;overflow:hidden;}
  body.vx-nomen-lock .cabv2-main>section>div{display:flex;flex-direction:column;flex:1;min-height:0;overflow:hidden;}
  body.vx-nomen-lock .cabv2-main>section>div>*{flex:0 0 auto;}
  body.vx-nomen-lock .cabv2-main>section>div>.vx-tbl-scroll{flex:1 1 auto;min-height:0;max-height:none;overflow:auto;}
  /* Мобільний варіант: рейка теж не має «зʼїдати» весь фіксований viewport під
     себе — вертикальний список пунктів згортаємо у горизонтальну прокрутну стрічку
     (як таб-бар), звільняючи місце під таблицю. Скоуп — лише під vx-nomen-lock,
     інші мобільні екрани лишає без змін (їм вертикальний список нормальний). */
  @media(max-width:900px){
    body.vx-nomen-lock .cabv2-rail{align-self:stretch;max-height:none;overflow:visible;flex-shrink:0;}
    body.vx-nomen-lock .cabv2-nav{flex-direction:row;overflow-x:auto;-webkit-overflow-scrolling:touch;gap:6px;padding-bottom:2px;}
    body.vx-nomen-lock .cabv2-nav .cabv2-ri{flex:0 0 auto;white-space:nowrap;padding:8px 12px;width:auto;}
    body.vx-nomen-lock .cabv2-nav .cabv2-profrow{flex:0 0 auto;}
  }
  /* ERP «Будівельник» на телефоні (2026-10-05): меню — горизонтальна прокрутна стрічка під
     назвою компанії, а не вертикальний список на весь перший екран (прораб відкриває «Моя
     зміна» й бачив лише меню). Скоуп — лише рейка ERP (.erpv2-rail). */
  @media(max-width:900px){
    .erpv2-rail{padding:10px 12px;}
    .erpv2-rail .cabv2-nav{flex-direction:row;overflow-x:auto;-webkit-overflow-scrolling:touch;gap:6px;padding-bottom:2px;}
    .erpv2-rail .cabv2-nav .cabv2-ri{flex:0 0 auto;white-space:nowrap;padding:8px 12px;width:auto;}
    .erpv2-rail .cabv2-nav .cabv2-profrow{flex:0 0 auto;}
  }
  /* Соло-кабінет виконавця (крок 11): екрани приходять у своїй обгортці secWrap
     (max-width+padding). Усередині рейки ці відступи подвоюються — гасимо їх тут,
     щоб не правити 6 proXxxHTML(). Скоуп — лише .prov2-main, решта рейок не зачеплена.
     !important обов'язковий:
     secWrap ставить max-width/padding ІНЛАЙНОМ, а інлайн б'є клас без нього. */
  .prov2-main>section{flex:none;}
  .prov2-main>section>div{max-width:none !important;padding:0 !important;}
  /* ── Нерухомість 2.0: горизонт. фільтри + сітка (redesign, лише за v2on) ── */
  .estv2-filters{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:14px 16px;display:flex;flex-direction:column;gap:12px;}
  .estv2-frow{display:flex;gap:12px;flex-wrap:wrap;align-items:center;}
  .estv2-seg{display:inline-flex;gap:3px;background:var(--line3);border:1px solid var(--line4);border-radius:11px;padding:3px;flex-shrink:0;}
  .estv2-seg .estv2-chip{border:0;background:transparent;padding:7px 14px;}
  .estv2-seg .estv2-chip.on{background:var(--card);box-shadow:0 1px 4px rgba(32,36,43,.12);color:var(--accent-dark);}
  .estv2-chip{display:inline-flex;align-items:center;gap:6px;border:1.5px solid var(--line2);background:var(--card);color:var(--text-soft);border-radius:99px;padding:8px 14px;font-size:12.5px;font-weight:700;cursor:pointer;font-family:inherit;white-space:nowrap;}
  .estv2-chip i{font-size:14px;}
  .estv2-chip:hover{border-color:var(--accent);color:var(--accent-dark);}
  .estv2-chip.on{border-color:var(--accent);background:var(--accent-bg);color:var(--accent-dark);}
  .estv2-cc{font-family:var(--f-mono);font-size:10.5px;font-weight:800;color:var(--text-faint);}
  .estv2-chip.on .estv2-cc{color:var(--accent);}
  .estv2-kinds{display:flex;gap:8px;flex-wrap:wrap;flex:1;min-width:0;}
  .estv2-inputs{display:flex;gap:8px;flex-wrap:wrap;flex:1;justify-content:flex-end;min-width:0;}
  .estv2-inp{box-sizing:border-box;border:1.5px solid var(--line2);border-radius:10px;padding:9px 12px;font-size:13px;background:var(--card2);color:var(--text);font-family:inherit;}
  .estv2-rooms{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap;}
  .estv2-rooms>span{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--text-faint);}
  .estv2-room{border:1.5px solid var(--line2);background:var(--card);color:var(--text-soft);border-radius:9px;width:40px;padding:8px 0;font-size:12.5px;font-weight:700;cursor:pointer;}
  .estv2-room.on{border-color:var(--accent);background:var(--accent-bg);color:var(--accent-dark);}
  .estv2-reset{display:inline-flex;align-items:center;gap:5px;border:1.5px solid var(--line2);background:var(--card);border-radius:10px;padding:8px 13px;font-size:12px;font-weight:700;cursor:pointer;color:var(--text-soft);margin-left:auto;}
  .estv2-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px;}
  /* Перемикач «Сітка/Список» на біржі + режим списку (OLX-рядок estListRow). */
  .estv2-view{width:34px;height:34px;flex-shrink:0;border:1.5px solid var(--line2);background:var(--card);color:var(--text-faint);border-radius:9px;cursor:pointer;display:grid;place-items:center;font-size:15px;}
  .estv2-view:hover{border-color:var(--accent);color:var(--accent);}
  .estv2-view.on{border-color:var(--accent);background:var(--accent-bg);color:var(--accent);}
  .estv2-list{display:flex;flex-direction:column;gap:12px;}
  /* Вузький екран: фото 190px зʼїдає рядок — рядок стає вертикальним (фото зверху). */
  @media(max-width:560px){ .estv2-list>button{flex-direction:column;} .estv2-lrimg{width:100% !important;height:160px;} }
  @media(max-width:760px){ .estv2-inputs{justify-content:flex-start;} .estv2-reset{margin-left:0;} }
  /* поля фільтра мають захардкоджені інлайн-ширини (200/130/110/90/130px, сума
     660px) — на вузькому екрані вони не стискаються й не переносяться по одному
     в рядок, даючи оверфлоу 375→448 (знайдено в сесії 18). Стек у колонку на
     повну ширину картки — width:100% !important бʼє інлайн (правило 2). */
  @media(max-width:480px){ .estv2-inputs{flex-direction:column;align-items:stretch;} .estv2-inp{width:100% !important;} }
  /* Картка оголошення 2.0: галерея+інфо ліворуч, липка колонка дії праворуч. */
  .estv2-back{display:inline-flex;align-items:center;gap:7px;border:1.5px solid var(--line2);background:var(--card);border-radius:11px;padding:9px 14px;font-size:12.5px;font-weight:700;cursor:pointer;color:var(--text-soft);margin-bottom:16px;font-family:inherit;}
  .estv2-det{display:grid;grid-template-columns:1.05fr .95fr;gap:26px;align-items:start;}
  /* grid-item min-width:auto дає лівій колонці розпливтись під фіксовану ширину
     SVG-плану героя (він у боксі з overflow:hidden, але сам трек тягнеться) —
     min-width:0 тримає колонку в межах треку, а не контенту. */
  .estv2-det>*{min-width:0;}
  .estv2-side{position:sticky;top:70px;display:flex;flex-direction:column;gap:16px;}
  @media(max-width:900px){ .estv2-det{grid-template-columns:1fr;} .estv2-side{position:static;} }
  /* ── Магазин 2.0: каталог + картка товару (redesign, лише за v2on) ──
     Форма «рейка+сітка» в магазині вже була — цей набір лише переводить її на
     токени тем. У v1 тут були захардкоджені світлі поверхні (#FBFAF5 під
     категоріями, градієнт #F6F2E8→#EEF3EE у фото-боксі), які в темній темі
     світились білими плямами. */
  .shopv2-wrap{display:grid;grid-template-columns:252px minmax(0,1fr);gap:20px;align-items:start;}
  .shopv2-rail{align-self:start;position:sticky;top:70px;display:flex;flex-direction:column;gap:14px;min-width:0;}
  .shopv2-box{background:var(--card);border:1px solid var(--line);border-radius:16px;overflow:hidden;}
  .shopv2-bt{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:11px 14px;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--text-faint);border-bottom:1px solid var(--line3);}
  .shopv2-reset{border:0;background:none;cursor:pointer;font-family:inherit;font-size:11px;font-weight:700;color:var(--accent-dark);text-transform:none;letter-spacing:0;}
  .shopv2-dept{display:flex;align-items:center;gap:9px;width:100%;border:0;background:none;padding:10px 14px;cursor:pointer;font-family:inherit;font-size:13px;font-weight:650;color:var(--text);text-align:left;border-bottom:1px solid var(--line3);}
  .shopv2-dept i:first-child{font-size:15px;width:16px;color:var(--text-faint);}
  .shopv2-dept:hover{background:var(--bg2);}
  .shopv2-dept.on{background:var(--accent-bg);color:var(--accent-dark);font-weight:800;}
  .shopv2-dept.on i:first-child{color:var(--accent);}
  .shopv2-subs{background:var(--bg2);border-bottom:1px solid var(--line3);padding:4px 0;}
  .shopv2-sub{width:100%;text-align:left;border:0;background:none;padding:7px 14px 7px 39px;cursor:pointer;font-family:inherit;font-size:12.5px;font-weight:600;color:var(--text-soft);}
  .shopv2-sub:hover{color:var(--text);}
  .shopv2-sub.on{font-weight:800;color:var(--accent-dark);}
  .shopv2-fx{display:flex;flex-direction:column;gap:1px;max-height:236px;overflow:auto;padding:8px 12px 12px;}
  .shopv2-fo{display:flex;align-items:center;gap:9px;border:0;background:none;padding:6px 3px;cursor:pointer;font-family:inherit;font-size:12.5px;text-align:left;color:var(--text);}
  .shopv2-cb{width:17px;height:17px;border-radius:5px;border:1.5px solid var(--line2);background:var(--card2);display:grid;place-items:center;flex-shrink:0;}
  .shopv2-fo.on .shopv2-cb{border-color:var(--accent);background:var(--accent);}
  .shopv2-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(206px,1fr));gap:14px;}
  .shopv2-card{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:16px;background:var(--card);overflow:hidden;transition:border-color .14s,box-shadow .14s;}
  .shopv2-card:hover{border-color:var(--line2);box-shadow:0 6px 20px rgba(32,36,43,.08);}
  .shopv2-img{width:100%;border:0;background:var(--bg2);height:142px;display:grid;place-items:center;font-size:54px;cursor:pointer;padding:0;overflow:hidden;}
  .shopv2-body{display:flex;flex-direction:column;gap:7px;flex:1;padding:12px 13px 13px;}
  .shopv2-brand{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.03em;color:var(--text-faint);}
  .shopv2-name{text-align:left;border:0;background:none;padding:0;cursor:pointer;font-family:inherit;font-size:13px;line-height:1.35;color:var(--text);min-height:35px;font-weight:600;}
  .shopv2-pr{display:flex;align-items:baseline;justify-content:space-between;gap:6px;margin-top:auto;}
  .shopv2-pr b{font-family:var(--f-mono);font-size:17px;color:var(--accent);}
  .shopv2-pr span{font-size:11px;color:var(--text-faint);font-weight:600;}
  .shopv2-add{background:var(--accent);color:#fff;border:0;border-radius:11px;padding:10px;font-size:13px;font-weight:800;cursor:pointer;font-family:inherit;}
  .shopv2-step{display:flex;align-items:center;justify-content:center;gap:8px;background:var(--accent-bg);border-radius:11px;padding:5px;}
  .shopv2-sb{width:30px;height:30px;border:1px solid var(--line3);background:var(--card);border-radius:8px;cursor:pointer;font-size:16px;font-weight:700;color:var(--text-soft);}
  .shopv2-sb.plus{color:var(--accent);}
  .shopv2-qty{font-family:var(--f-mono);font-weight:800;min-width:26px;text-align:center;color:var(--text);}
  .shopv2-crumb{display:flex;align-items:center;gap:7px;flex-wrap:wrap;font-size:12px;color:var(--text-faint);font-weight:600;margin-bottom:12px;}
  .shopv2-crumb button{border:0;background:none;padding:0;cursor:pointer;font-family:inherit;font-size:12px;font-weight:600;color:var(--text-faint);}
  .shopv2-crumb button:hover{color:var(--accent-dark);}
  .shopv2-crumb b{color:var(--accent-dark);font-weight:800;}
  .shopv2-rate{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;color:var(--text-faint);font-weight:600;}
  .shopv2-rate b{font-family:var(--f-mono);font-size:11.5px;color:var(--text-soft);font-weight:800;}
  /* Пагінатор каталогу — токени тем, тож живе в обох. Лічильник «X–Y з N» іде
     праворуч і на вузькому переноситься під ряд кнопок (flex-wrap на контейнері). */
  .shopv2-pager{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:20px;}
  .shopv2-pg{min-width:34px;height:34px;padding:0 9px;border:1.5px solid var(--line2);background:var(--card);color:var(--text-soft);border-radius:10px;font-family:var(--f-mono);font-size:12.5px;font-weight:700;cursor:pointer;display:grid;place-items:center;}
  .shopv2-pg:hover:not(:disabled){border-color:var(--accent);color:var(--accent-dark);}
  .shopv2-pg.on{border-color:var(--accent);background:var(--accent);color:#fff;}
  .shopv2-pg:disabled{opacity:.4;cursor:default;}
  .shopv2-pgdots{color:var(--text-faint);font-weight:800;padding:0 2px;}
  .shopv2-pgcnt{margin-left:auto;font-size:12px;color:var(--text-faint);font-weight:600;}
  .shopv2-hero{display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:start;margin-bottom:24px;}
  .shopv2-heroimg{border:1px solid var(--line);border-radius:20px;background:var(--bg2);height:360px;display:grid;place-items:center;font-size:150px;position:sticky;top:70px;overflow:hidden;}
  @media(max-width:900px){ .shopv2-wrap{grid-template-columns:1fr;} .shopv2-rail{position:static;} .shopv2-hero{grid-template-columns:1fr;gap:18px;} .shopv2-heroimg{position:static;height:220px;font-size:92px;} }

  /* ═══ Огляд 2.0: багаті KPI-картки (іконка+назва / велике число / підпис) ═══ */
  .cabv2-okpi{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:15px 17px;}
  .cabv2-okl{display:flex;align-items:center;gap:7px;font-size:11px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--text-faint);margin-bottom:8px;}
  .cabv2-okl i{font-size:15px;}
  .cabv2-okv{display:block;font-family:var(--f-mono);font-size:22px;line-height:1;}
  .cabv2-okd{font-size:11px;color:var(--text-faint);margin-top:6px;}
  .cabv2-attn{border-left:4px solid var(--warn);}
  .cabv2-2wide{grid-template-columns:1.4fr 1fr;}
  @media(max-width:900px){ .cabv2-2wide{grid-template-columns:1fr;} }
  /* підзаголовок під h2 у шапці кабінету (сторінка «Мої проєкти») */
  .cabv2-mh-tt{min-width:0;}
  .cabv2-mh-sub{font-size:12.5px;color:var(--text-soft);margin-top:4px;line-height:1.45;}

  /* ═══ «Мої проєкти»: панель «Список обʼєктів» + рядки об'єктів ═══ */
  .pjlist-h{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 18px;border-bottom:1px solid var(--line3);}
  .pjlist-h b{font-size:14px;font-family:var(--f-head);}
  .pjlist-add{border:0;background:none;cursor:pointer;font-family:inherit;font-size:12.5px;font-weight:800;color:var(--accent-dark);display:inline-flex;align-items:center;gap:5px;}
  .pjlist-add i{font-size:14px;}
  .pjlist-filt{padding:12px 18px;border-bottom:1px solid var(--line3);}
  .pjlist{display:flex;flex-direction:column;}
  .pjrow{display:flex;align-items:center;gap:14px;padding:15px 18px;border-bottom:1px solid var(--line3);}
  .pjrow:last-child{border-bottom:0;}
  .pjrow:hover{background:var(--bg2);}
  .pjrow-ic{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;flex-shrink:0;font-size:19px;}
  .pjrow-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:5px;}
  .pjrow-top{display:flex;align-items:center;gap:9px;flex-wrap:wrap;}
  .pjrow-top b{font-size:14px;color:var(--text);}
  .pjrow-chip{font-size:10.5px;font-weight:800;border-radius:99px;padding:2px 9px;white-space:nowrap;}
  .pjrow-sub{font-size:11.5px;color:var(--text-faint);display:flex;align-items:center;gap:5px;flex-wrap:wrap;}
  .pjrow-sub i{font-size:13px;}
  .pjrow-dot{opacity:.6;}
  .pjrow-bar{height:6px;border-radius:99px;background:var(--line3);overflow:hidden;max-width:320px;}
  .pjrow-bar span{display:block;height:100%;border-radius:99px;}
  .pjrow-right{display:flex;flex-direction:column;align-items:flex-end;gap:8px;flex-shrink:0;}
  .pjrow-sum{font-family:var(--f-mono);font-size:14.5px;color:var(--text);white-space:nowrap;}
  .pjrow-acts{display:inline-flex;align-items:center;gap:7px;}
  .pjrow-open{display:inline-flex;align-items:center;gap:5px;border:1.5px solid var(--line2);background:var(--card2);border-radius:11px;padding:9px 14px;font-family:inherit;font-size:12.5px;font-weight:700;cursor:pointer;color:var(--text);white-space:nowrap;}
  .pjrow-open:hover{border-color:var(--accent);color:var(--accent-dark);}
  .pjrow-open i{font-size:14px;}
  @media(max-width:640px){ .pjrow{flex-wrap:wrap;} .pjrow-right{align-items:flex-start;width:100%;flex-direction:row;justify-content:space-between;} }
  /* масовий вибір проєктів (2026-10-04) */
  .pjrow-sel{display:inline-grid;place-items:center;width:26px;height:26px;flex-shrink:0;border-radius:7px;cursor:pointer;color:var(--text-faint);font-size:21px;user-select:none;}
  .pjrow-sel:hover{color:var(--accent);background:var(--accent-bg);}
  .pjrow-sel.on{color:var(--accent);}
  .pjrow-on{background:var(--accent-bg);}
  .pjrow-on:hover{background:var(--accent-bg);}
  .pjbulk{display:flex;align-items:center;gap:9px;flex-wrap:wrap;padding:9px 18px;border-bottom:1px solid var(--line3);font-size:12.5px;}
  .pjbulk.on{background:var(--accent-bg);}
  .pjbulk-n{color:var(--text-soft);font-weight:600;}
  .pjbulk-n b{color:var(--accent-dark);}
  .pjbulk-hint{color:var(--text-faint);font-size:11.5px;}
  .pjbulk-btn{display:inline-flex;align-items:center;gap:6px;border:1.5px solid var(--line2);background:var(--card);border-radius:9px;padding:6px 12px;font-family:inherit;font-size:12px;font-weight:700;cursor:pointer;color:var(--text);}
  .pjbulk-btn:hover{border-color:var(--accent);color:var(--accent-dark);}
  .pjbulk-btn.danger{color:var(--err-text);}
  .pjbulk-btn.danger:hover{border-color:var(--err);color:var(--err-text);}
  .pjbulk-btn[disabled]{opacity:.55;cursor:default;}
  .pjbulk-x{border:0;background:none;cursor:pointer;color:var(--text-faint);font-size:16px;padding:4px;}
  .pjbulk-arch{margin-left:auto;display:inline-flex;align-items:center;gap:6px;border:0;background:none;cursor:pointer;font-family:inherit;font-size:12px;font-weight:700;color:var(--text-soft);}
  .pjbulk-arch:hover{color:var(--accent-dark);}

  /* ═══ Профіль замовника: картка даних + кнопка «Вийти» ═══ */
  .cabv2-logout{display:inline-flex;align-items:center;gap:7px;border:1.5px solid var(--line2);background:var(--card2);border-radius:11px;padding:9px 16px;font-family:inherit;font-size:13px;font-weight:700;cursor:pointer;color:var(--err-text);white-space:nowrap;}
  .cabv2-logout:hover{border-color:var(--err);background:var(--err-bg);}
  .cabv2-logout i{font-size:16px;}
  .cabv2-pf{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px;}
  .cabv2-pf-row{display:flex;align-items:center;gap:12px;border:1px solid var(--line3);border-radius:13px;padding:12px 14px;background:var(--card2);}
  .cabv2-pf-ic{width:38px;height:38px;border-radius:11px;flex-shrink:0;background:var(--accent-bg);color:var(--accent-dark);display:grid;place-items:center;font-size:18px;}
  .cabv2-pf-txt{min-width:0;}
  .cabv2-pf-l{font-size:11px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--text-faint);display:block;margin-bottom:3px;}
  .cabv2-pf-v{font-size:14px;color:var(--text);word-break:break-word;}
  @media(max-width:640px){ .cabv2-pf{grid-template-columns:1fr;} }

  /* ═══ Двоколонкові інлайн-грід-екрани (майстер «Новий проєкт», Лего-конструктив,
     кошторис): фіксована/мінімальна ширина колонки на вузькому екрані не стискається —
     друга колонка йде за межі viewport (немає горизонтального скролу сторінки, тож
     вона просто клипається/ховається за краєм, як «Локація об'єкта» на мобільному
     майстрі). Одна колонка на телефоні для всіх трьох. */
  @media(max-width:760px){
    .vx-wiz2col,.vx-side350,.vx-side330{grid-template-columns:1fr!important;gap:18px!important;}
  }

  /* ═══ Шапка групи «Елементи конструкцій» (genCtorElemsHTML): flex-рядок без
     grid-template-columns — назва мала лише `min-width:0` без реальної підлоги,
     тож на вузькому екрані сусіди («N поз.», сума, тумблер), яким нема куди
     стискатись (немає overflow:hidden), забирали всю ширину, а назва стискалась
     до 0 і зникала повністю (не обрізана — саме невидима). Бейдж «N поз.»
     дублює число, яке видно й розгорнувши групу, тож на телефоні він ховається
     першим; назві повертається реальна мінімальна ширина замість 0. */
  @media(max-width:520px){
    .ctorgrp-cnt{display:none;}
    .ctorgrp-l{min-width:72px!important;}
  }

  /* 📍 AR на місцевості (SiteAR, 2026-10-10): кадр камери ARCore — ПІД прозорим WebView. Поки AR відкрито,
     сторінка під оверлеєм не сміє бути непрозорою (фон html/body/#app затулив би камеру), а решта
     застосунку — видимою крізь прозорий #ar-root. */
  html.vx-sar,html.vx-sar body,html.vx-sar #app{background:transparent!important;}
  html.vx-sar #app>*:not(#ar-root):not([data-toast]){visibility:hidden!important;}
  /* 📄 АЛЬБОМ КРЕСЛЕНЬ У PDF (VX.drawingsPdf, 2026-10-10): сторінки A3 альбомні з рамкою (поле підшивки 20 мм) і штампом.
     На екрані альбом зібрано за межами вікна (лише щоб виміряти й вписати аркуші); на друк — лише він. */
  #vx-album{position:fixed;left:-40000px;top:0;width:420mm;background:#fff;color:#1C1D20;pointer-events:none;font-family:var(--f-body);-webkit-print-color-adjust:exact;print-color-adjust:exact;}
  #vx-album .alb-page{page:vxalb;width:420mm;height:297mm;box-sizing:border-box;padding:5mm 5mm 5mm 20mm;background:#fff;overflow:hidden;break-after:page;page-break-after:always;}
  #vx-album .alb-page:last-child{break-after:auto;page-break-after:auto;}
  #vx-album .alb-frame{height:100%;box-sizing:border-box;border:.5mm solid #1C1D20;display:flex;flex-direction:column;}
  #vx-album .alb-body{flex:1 1 auto;min-height:0;overflow:hidden;box-sizing:border-box;padding:4mm 5mm 3mm;}
  #vx-album .alb-fit{margin:0 auto;}
  #vx-album .alb-fit>div{background:#fff!important;border:0!important;border-radius:0!important;padding:0!important;margin:0!important;box-shadow:none!important;}
  #vx-album button,#vx-album .vx-rotdial,#vx-album input,#vx-album select,#vx-album textarea{display:none!important;}
  #vx-album .vx-schz{container-type:normal!important;}
  #vx-album .vx-schz-vp{height:auto!important;max-height:none!important;overflow:visible!important;aspect-ratio:auto!important;}
  #vx-album .vx-schz-vp>div{width:100%!important;}
  #vx-album .vx-schz>div[title]{display:none!important;}
  #vx-album details>summary{list-style:none;}
  #vx-album .alb-stamp{flex:0 0 auto;align-self:flex-end;width:185mm;border-collapse:collapse;font-size:9pt;line-height:1.25;table-layout:fixed;}
  #vx-album .alb-stamp td{border:.35mm solid #1C1D20;padding:1.1mm 2mm;height:6mm;vertical-align:middle;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  #vx-album .alb-stamp td.k{width:20mm;color:#5A5D63;font-size:8pt;}
  #vx-album .alb-stamp td.v{color:#5A5D63;font-size:8pt;text-align:center;}
  #vx-album .alb-cover{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:3mm;}
  #vx-album .alb-cv-kind{font-size:13pt;letter-spacing:.22em;text-transform:uppercase;color:#5A5D63;font-weight:700;}
  #vx-album .alb-cv-obj{font-size:30pt;font-weight:800;}
  #vx-album .alb-cv-proj{font-size:15pt;color:#33363C;font-weight:600;}
  #vx-album .alb-toc{margin-top:8mm;border-collapse:collapse;font-size:11pt;min-width:170mm;text-align:left;}
  #vx-album .alb-toc th,#vx-album .alb-toc td{border-bottom:.3mm solid #9A9DA3;padding:1.4mm 4mm;}
  #vx-album .alb-toc th{font-size:9pt;color:#5A5D63;text-transform:uppercase;letter-spacing:.06em;}
  #vx-album .alb-toc td:first-child{width:18mm;text-align:center;font-weight:700;}
  #vx-album .alb-cv-date{margin-top:8mm;color:#5A5D63;font-size:10pt;}
  @media print{
    @page vxalb{size:A3 landscape;margin:0;}
    html.vx-alb-print,html.vx-alb-print body{height:auto!important;overflow:visible!important;background:#fff!important;margin:0!important;}
    html.vx-alb-print body>*:not(#vx-album){display:none!important;}
    html.vx-alb-print #vx-album,html.vx-alb-print #vx-album *{visibility:visible!important;}
    html.vx-alb-print #vx-album{position:static!important;left:auto!important;}
  }