/* LXVNT Workspace – рамката на вътрешните екрани (редизайн, пилот: TECH-PLAN §2, docs/design/workspace/MASTER.md).
   Зарежда се СЛЕД theme.css само в обвивките на портала (index.php и неговите страници, catalog.php). Всички правила
   са под body.ws (класът е от PHP при вход и от navigation.js след вход без презареждане), затова публичните страници,
   поканите, сайтовете и темите не се променят. Цветовете са токените от style.css / theme.css; нови цветове няма.
   Рамка: #main-menu (и .catalog-main-menu) е страничното меню на компютър (248 px, „релса“ 72 px под 1024 px, при
   „Свий менюто“ и при широките изгледи – Маси, годишен календар), body > header е горната лента, #lux-tabbar –
   долното меню на телефон (≤ 760 px). Анимират се само transform/opacity (изключение: ширината на менюто при свиване). */
:root {
  --ws-surface-raised: #fff;
  --ws-danger-soft: #fbe9e7;
  --ws-warn: #8a5a00;
  /* BIZ-40: фокусът е в мастилото на акцента (≥ 4,6:1 – значи ≥ 3:1 за UI). */
  --ws-focus: 0 0 0 2px var(--paper), 0 0 0 4px var(--ws-accent-ink);
  --ws-scrim: rgba(41, 39, 37, 0.45);
  --ws-radius-sm: 8px;
  --ws-radius-md: 12px;
  --ws-radius-lg: 16px;
  --ws-radius-pill: 999px;
  --ws-shadow-1: 0 1px 2px rgba(41, 39, 37, 0.05), 0 4px 14px rgba(41, 39, 37, 0.04);
  --ws-shadow-2: var(--shadow-pop);
  --ws-sidebar-w: 256px;
  --ws-sidebar-w-collapsed: 72px;
  --ws-topbar-h: 64px;
  --ws-tabbar-h: 60px;
  --ws-content-max: 1440px;
  --ws-gap: 16px;
  --ws-pad: clamp(16px, 2.2vw, 32px);
  --ws-ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --ws-ease-in: cubic-bezier(0.4, 0, 1, 1);
  --ws-dur-1: 150ms;
  --ws-dur-2: 200ms;
  --ws-dur-3: 250ms;
  --ws-dur-4: 300ms;
  --ws-dur-5: 350ms;
  /* DESIGN-PASS-2 т. 7 (DP2-14): акцентът на работната среда – по подразбиране LXVNT. BIZ-40 („Моят стил в планера“,
     docs/design/event-style/EVENT-STYLE.md §2–3) ги сменя през CSSOM върху <body> (assets/planner-mine.js, с проверка
     на контраста; при неуспех – нищо, т.е. LXVNT). Логото, марката, известието (тъмен фон), златният бутон
     „Публикувай“ и семантиката остават на --gold* / своите цветове. Изисквания: --ws-accent ≥ 3:1 срещу #fff, --bg и
     --paper-sunk (графика); --ws-accent-ink ≥ 4.5:1 срещу #fff, --bg, --cream, soft и wash; бяло ≥ 4.5:1 върху
     --ws-accent-deep. */
  --ws-accent: var(--gold);
  --ws-accent-ink: var(--gold-ink);
  --ws-accent-deep: var(--gold-deep);
  --ws-accent-soft: var(--gold-soft);
  --ws-accent-line: var(--gold-line);
  --ws-on-accent: #fff;
  /* DP2-02: височината на KPI картата в прегледа на раздел и дебелината на мини лентата (телефон → таблет → компютър). */
  --ws-kpi-h: 76px;
  /* DESIGN-PASS-4 D4-06: най-малкият размер на текст в работната среда (UUPM readable-font-size). */
  --ws-fs-min: 12px;
  --ws-kpi-bar: 4px;
  /* Гости v2 (GUESTS-V2 т. 3): измит акцент (избран/нов ред, <mark>, масова лента), тих разделител на редовете,
     цветовете на отговорите (решение на собственика 1 + корекция 14.10: зелено – потвърди, злато – чака, приглушено
     червено (--rose, 5.7:1 върху бяло) – отказа), височини, икони. */
  --ws-accent-wash: #f7f1e5;
  --ws-divider: #ebe7e0;
  --ws-status-yes: var(--success);
  /* BIZ-40 (EVENT-STYLE.md §2.3, отклонение от DP2): „чака“ е заковано за златото при всяка тема – иначе при
     Blush Bloom (пепел от рози) се бърка с „Отказа“ (--rose). Статусът има и форма, и текст (UUPM color-not-only). */
  --ws-status-wait: var(--gold);
  --ws-status-wait-bar: var(--gold-line);
  --ws-status-wait-soft: var(--gold-soft);
  --ws-status-wait-ink: var(--gold-ink);
  --ws-status-no: var(--rose);
  /* BIZ-40: тънката линия под горната лента – --line, при „Моят стил“ – линията на акцента (planner-mine.js). */
  --ws-head-line: var(--line);
  /* BIZ-40: hero „Моят стил“ на таблото (.pdb-hero--mine). Стойностите по подразбиране са LXVNT; planner-mine.js ги
     сменя от темата: хартията (bg), текстът ≥ 7:1, имената ≥ 4.5:1 (скрипт), приглушеният ≥ 4.6:1, линията и мотивът. */
  --ws-hero-paper: var(--cream);
  --ws-hero-ink: var(--ink);
  --ws-hero-names: var(--ink);
  --ws-hero-muted: var(--ink-muted);
  --ws-hero-line: var(--gold-line);
  --ws-hero-motif: var(--gold);
  --ws-hero-script: var(--font-display);
  --ws-row-h: 56px;
  --ws-row-h-touch: 68px;
  --ws-subrow-h: 40px;
  --ws-ctl-h: 40px;
  --ws-bar-h: 4px;
  --ws-ico-sm: 16px;
  --ws-ico-md: 20px;
  --ws-ico-stroke-sm: 2.25;
  --ws-ico-stroke-md: 1.8;
  --ws-tb-h: 60px;
  /* Каталог v2 (CATALOG-V2.md §3.4): лепкавите ленти, мрежата, лентата „Моят избор“ и панелът. */
  --cat-tabs-h: 52px;
  --cat-chips-h: 56px;
  --cat-gap: 24px;
  --cat-img-ratio: 4 / 3;
  --cat-sel-h: 64px;
  --cat-panel-w: 520px;
  /* Каталог v2, Б3 (CATALOG-V2.md §3.4): редът и миниатюрата в таблицата на екипа, панелът за редакция. */
  --cat-row-h: 64px;
  --cat-thumb: 56px;
  --cat-drawer-w: 640px;
}
/* BIZ-40: смяната на стила (превключвателят, нова тема) – плавен преход на цветовете 300 ms. Регистрираните свойства
   браузърът може да интерполира; без @property – мигновено (нищо не се чупи). При „Намали движението“ – без преход. */
@property --ws-accent { syntax: '<color>'; inherits: true; initial-value: #8f6d23; }
@property --ws-accent-ink { syntax: '<color>'; inherits: true; initial-value: #725526; }
@property --ws-accent-soft { syntax: '<color>'; inherits: true; initial-value: #ede0c5; }
@property --ws-accent-line { syntax: '<color>'; inherits: true; initial-value: #d0c19e; }
@property --ws-accent-wash { syntax: '<color>'; inherits: true; initial-value: #f7f1e5; }
@property --ws-hero-paper { syntax: '<color>'; inherits: true; initial-value: #faf9f7; }
@media (prefers-reduced-motion: no-preference) {
  body.ws.ws-client,
  body.ws.ws-staff {
    transition:
      --ws-accent var(--ws-dur-4) var(--ws-ease),
      --ws-accent-ink var(--ws-dur-4) var(--ws-ease),
      --ws-accent-soft var(--ws-dur-4) var(--ws-ease),
      --ws-accent-line var(--ws-dur-4) var(--ws-ease),
      --ws-accent-wash var(--ws-dur-4) var(--ws-ease),
      --ws-hero-paper var(--ws-dur-4) var(--ws-ease);
  }
}
@media (pointer: coarse) {
  :root {
    --ws-ctl-h: 44px;
  }
}
@media (max-width: 760px) {
  :root {
    --ws-tb-h: 64px;
    --cat-gap: 12px;
    --cat-chips-h: 52px;
  }
}

/* ---------- Рамка: ширината на менюто ----------
   --ws-side е ширината, която заема менюто; „релсата“ сменя и няколко променливи на елементите (--ws-label и др.),
   за да не се повтарят правилата за двата случая (екран 761–1023 px и бутона „Свий менюто“ / широките изгледи). */
body.ws {
  --ws-side: var(--ws-sidebar-w);
  padding-left: var(--ws-side);
}
/* DESIGN-PASS-2 т. 5.1 (DP2-10): 761–1199 px – релса по подразбиране; превключвателят горе я разгъва над съдържанието. */
@media (min-width: 761px) and (max-width: 1199px) {
  body.ws {
    --ws-side: var(--ws-sidebar-w-collapsed);
    --ws-label: none;
    --ws-item-justify: center;
    --ws-item-pad: 0;
    --ws-mono: none;
    --ws-logo: block;
    --ws-logo-w: 52px; /* в свитото меню – знакът LXVNT, не буква (собственикът 19.10.2026) */
    --ws-tag: none;
    --ws-tag-gap: 0;
    --ws-rail: 1;
  }
}
@media (min-width: 761px) {
  body.ws.ws-rail,
  body.ws.pl-wide {
    --ws-side: var(--ws-sidebar-w-collapsed);
    --ws-label: none;
    --ws-item-justify: center;
    --ws-item-pad: 0;
    --ws-mono: none;
    --ws-logo: block;
    --ws-logo-w: 52px; /* в свитото меню – знакът LXVNT, не буква (собственикът 19.10.2026) */
    --ws-tag: none;
    --ws-tag-gap: 0;
  }
}
@media (max-width: 760px) {
  body.ws {
    --ws-side: 0px;
    padding-left: 0;
  }
}

/* „Към съдържанието“ – първата връзка на страницата, видима само на фокус. */
.ws-skip {
  position: fixed;
  top: 8px;
  left: 8px;
  z-index: 1100;
  padding: 10px 18px;
  border-radius: var(--ws-radius-pill);
  background: var(--ink);
  color: #fff;
  font-weight: 600;
  text-decoration: none;
  transform: translateY(-160%);
  transition: transform var(--ws-dur-2) var(--ws-ease);
}
.ws-skip:focus {
  transform: none;
  outline: none;
  box-shadow: var(--ws-focus);
}
body:not(.ws) .ws-skip {
  display: none;
}
body.ws main:focus {
  outline: none;
}

/* ---------- Горна лента (body > header) ---------- */
body.ws > header {
  display: flex;
  align-items: center;
  gap: 16px;
  box-sizing: border-box;
  height: var(--ws-topbar-h);
  min-height: 0;
  padding: 10px var(--ws-pad);
  background: var(--cream);
  border-bottom: 1px solid var(--ws-head-line);
}
body.ws > header .brand-home,
body.ws > header > span,
body.ws > header .header-back {
  display: none;
}
body.ws > header #header-intro {
  flex: 1 1 auto;
  min-width: 0;
  padding: 0;
  border: 0;
}
body.ws > header #header-intro > div:not(#ws-title),
body.ws > header #header-intro #workspace-help {
  display: none;
}
body.ws .ws-title {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  text-align: left;
  gap: 2px;
  min-width: 0;
  flex: 1 1 auto;
}
body.ws .ws-title-eyebrow {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
body.ws .ws-title-eyebrow {
  flex: 0 1 auto;
  min-width: 0;
}
body.ws .ws-title-eyebrow:empty {
  display: none;
}
body.ws .ws-title-text {
  /* UX-NTF-01: името на раздела не се реже – свива се надзаглавието (събитието). */
  flex: 0 0 auto;
  min-width: max-content;
  font: 500 22px/1.25 var(--font-display);
  color: var(--ink);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* DP2-17: от 761 px горната лента е пътека „Планиране › Гости“ (13/500), без Lora – заглавието е H1 на раздела. */
body.ws .ws-title-sep {
  display: none;
}
@media (min-width: 761px) {
  body.ws .ws-title,
  body.ws > header #header-intro > #ws-title {
    flex-direction: row;
    align-items: center;
    gap: 6px;
  }
  body.ws .ws-title-eyebrow,
  body.ws .ws-title-text,
  body.ws .ws-title-sep {
    font: 500 13px/1.4 var(--font-body);
    letter-spacing: 0;
    text-transform: none;
    color: var(--ink-muted);
  }
  body.ws .ws-title-text {
    color: var(--ink);
  }
  body.ws .ws-title-eyebrow:not(:empty) + .ws-title-sep {
    display: inline;
  }
}
body.ws > header > div {
  margin-left: auto;
}
/* „Настройки“ е в менюто на администратора – зъбното колело в горната лента се дублира. */
body.ws > header #settings-open {
  display: none;
}
body.ws .notification-drawer {
  top: calc(var(--ws-topbar-h) + 8px);
}

/* ---------- Странично меню ---------- */
body.ws #main-menu,
body.ws .catalog-main-menu {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  z-index: 700;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: stretch;
  justify-content: flex-start;
  gap: 0;
  width: var(--ws-side);
  margin: 0;
  padding: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  background: var(--cream);
  border: 0;
  border-right: 1px solid var(--line);
  box-shadow: none;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  /* D4-39: ширината се сменя без преход (layout-transition); движат се само transform и сянката. */
  transition:
    transform 220ms var(--ws-ease),
    box-shadow 220ms var(--ws-ease);
}
body.ws #main-menu[hidden] {
  display: none;
}
body.ws #main-menu .ws-brand {
  order: 0;
}
body.ws #main-menu .main-menu-actions {
  order: 1;
}
body.ws #main-menu .main-menu-links,
body.ws .catalog-main-menu .main-menu-links {
  order: 2;
}
body.ws #main-menu .ws-foot,
body.ws .catalog-main-menu .ws-foot {
  order: 3;
}
body.ws .ws-brand {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 24px 16px 16px;
  text-align: center;
  color: inherit;
}
body.ws .ws-brand-home,
body.ws .ws-brand-event {
  display: flex;
  flex-direction: column;
  align-items: center;
  max-width: 100%;
  border-radius: var(--ws-radius-sm);
  color: inherit;
  text-decoration: none;
}
body.ws .ws-brand-event {
  display: var(--ws-label, flex);
  padding: 2px 8px 4px;
}
body.ws .ws-brand-event[hidden] {
  display: none;
}
@media (hover: hover) and (pointer: fine) {
  body.ws a.ws-brand-event:hover .ws-brand-names {
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 4px;
  }
}
body.ws .ws-brand-home:focus-visible,
body.ws .ws-brand-event:focus-visible,
body.ws .ws-railbtn:focus-visible {
  outline: 2px solid var(--ws-accent-ink);
  outline-offset: 2px;
}
body.ws .ws-brand img {
  display: var(--ws-logo, block);
  width: var(--ws-logo-w, min(80px, 100%)); /* по-малко, редакционно (собственикът 19.10.2026): ~18 px височина */
  height: auto;
}
/* Знакът и подзаглавието вдясно, разделени с тънка линия (както в шапката на лендинга). */
body.ws .ws-brand-home:has(.ws-brand-tag) {
  flex-direction: row;
  gap: 9px;
  margin-right: var(--ws-tag-gap, 30px); /* място за бутона за свиване горе вдясно; 0 в свитата релса */
}
body.ws .ws-brand-tag {
  display: var(--ws-tag, flex);
  flex-direction: column;
  padding-left: 9px;
  border-left: 1px solid var(--gold-line);
  font: 500 8px/1.45 var(--font-body);
  letter-spacing: 0.16em;
  text-transform: uppercase;
  text-align: left;
  color: var(--gold-ink);
}
body.ws .ws-brand-tag span {
  white-space: nowrap;
}
/* D-05: в релсата (72 px) логото е нечетимо – монограм (буква от Lora в тънък кръг). */
body.ws .ws-brand-mono {
  display: var(--ws-mono, none);
  place-items: center;
  width: 40px;
  height: 40px;
  border: 1px solid var(--gold-line);
  border-radius: 50%;
  font: italic 500 22px/1 var(--font-display);
  color: var(--gold-ink);
}
/* Превключвателят на менюто (DP2-10): горе вдясно до логото; в свито състояние – под монограма. 44×44. */
body.ws .ws-railbtn {
  position: absolute;
  top: 10px;
  right: 6px;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: var(--ws-radius-sm);
  background: transparent;
  box-shadow: none;
  color: var(--ink-muted);
  transition:
    background-color var(--ws-dur-1) ease,
    color var(--ws-dur-1) ease;
}
body.ws .ws-railbtn svg {
  width: 20px;
  height: 20px;
  transition: transform var(--ws-dur-2) var(--ws-ease);
}
@media (hover: hover) and (pointer: fine) {
  body.ws .ws-railbtn:hover {
    background: var(--paper-sunk);
    color: var(--ink);
  }
}
body.ws .ws-railbtn:active {
  transform: scale(0.96);
}
body.ws .ws-railbtn[aria-expanded='false'] svg {
  transform: scaleX(-1);
}
@media (max-width: 760px) {
  body.ws .ws-railbtn {
    display: none;
  }
}
/* Релса (72 px): монограмът и под него бутонът. */
@media (min-width: 761px) and (max-width: 1199px) {
  body.ws .ws-brand {
    padding: 16px 0 8px;
  }
  body.ws .ws-railbtn {
    position: static;
    margin-top: 6px;
  }
}
@media (min-width: 761px) {
  body.ws.ws-rail .ws-brand,
  body.ws.pl-wide .ws-brand {
    padding: 16px 0 8px;
  }
  body.ws.ws-rail .ws-railbtn,
  body.ws.pl-wide .ws-railbtn {
    position: static;
    margin-top: 6px;
  }
}
/* Чекмеджето над съдържанието (761–1199 px и широките изгледи): пълното меню, без да мести страницата. */
@media (min-width: 761px) {
  body.ws.ws-rail-open #main-menu,
  body.ws.ws-rail-open .catalog-main-menu {
    --ws-label: initial;
    --ws-item-justify: initial;
    --ws-item-pad: initial;
    --ws-mono: initial;
    --ws-logo: initial;
    --ws-logo-w: min(80px, 100%);
    --ws-tag: flex;
    --ws-tag-gap: 30px;
    z-index: 900;
    width: var(--ws-sidebar-w);
    background: var(--cream);
    box-shadow: var(--ws-shadow-2);
    transition: none;
  }
  body.ws.ws-rail-open :is(#main-menu, .catalog-main-menu) .ws-brand {
    padding: 24px 16px 16px;
  }
  body.ws.ws-rail-open :is(#main-menu, .catalog-main-menu) .ws-railbtn {
    position: absolute;
    margin: 0;
  }
  body.ws.ws-rail-open :is(#main-menu, .catalog-main-menu) .ws-sec + .ws-sec {
    padding-top: 0;
    border-top: 0;
  }
  body.ws.ws-rail-open :is(#main-menu, .catalog-main-menu) > :is(.ws-brand, .main-menu-links) {
    animation: ws-drawer-in 200ms var(--ws-ease) both;
  }
  body.ws.ws-rail-closing :is(#main-menu, .catalog-main-menu) > :is(.ws-brand, .main-menu-links) {
    animation: ws-drawer-out 150ms var(--ws-ease-in) both;
  }
}
@keyframes ws-drawer-in {
  from {
    opacity: 0;
    transform: translateX(-8px);
  }
}
@keyframes ws-drawer-out {
  from {
    opacity: 0;
  }
}
/* Секцията „Събитие“ е само в чекмеджето на телефона. */
body.ws .ws-sec--drawer {
  display: none;
}
body.ws #mobile-drawer .ws-sec--drawer {
  display: block;
}
/* Подсказката в свитото меню (luxTipBind): вдясно на 8 px, тъмна; 150 ms. */
.ws-tip {
  position: fixed;
  z-index: 950;
  max-width: 240px;
  padding: 6px 10px;
  border-radius: 8px;
  background: var(--ink);
  box-shadow: var(--ws-shadow-2);
  color: #fff;
  font: 500 13px/1.3 var(--font-body);
  white-space: nowrap;
  pointer-events: none;
  opacity: 0;
  transform: translateY(-50%);
  transition: opacity 150ms var(--ws-ease);
}
.ws-tip.is-on {
  opacity: 1;
}
/* Таблет: задържането върху иконка в релсата показва подсказката (client-nav.js luxTipBind), без системното меню. */
@media (pointer: coarse) {
  body.ws [data-tip] {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    user-select: none;
  }
}
/* „Събитие“ и „Ново събитие“ в менюто на профила (булката). */
body > header .account-menu .account-pop .ws-acc-link {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 44px;
  padding: 10px 12px;
  border-radius: var(--radius-field);
  color: var(--ink);
  font-weight: 500;
  text-decoration: none;
}
body > header .account-menu .account-pop .ws-acc-link[hidden] {
  display: none;
}
body > header .account-menu .account-pop .ws-acc-link svg {
  width: 18px;
  height: 18px;
  flex: none;
  color: var(--ink-muted);
}
@media (hover: hover) and (pointer: fine) {
  body > header .account-menu .account-pop .ws-acc-link:hover {
    background: var(--paper-sunk);
  }
}
body > header .account-menu .account-pop .ws-acc-link:last-of-type {
  margin-bottom: 4px;
  padding-bottom: 10px;
}
body.ws .ws-brand-names {
  display: var(--ws-label, block);
  max-width: 100%;
  margin-top: 6px;
  font: italic 500 17px/1.3 var(--font-display);
  color: var(--ws-accent-ink);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body.ws .ws-brand-meta {
  display: var(--ws-label, block);
  font-size: 12px;
  color: var(--ink-muted);
}
body.ws .ws-brand-names:empty,
body.ws .ws-brand-meta:empty {
  display: none;
}
body.ws #main-menu .main-menu-links,
body.ws .catalog-main-menu .main-menu-links {
  display: block;
  flex: 1 0 auto;
  grid-column: auto;
  grid-row: auto;
  margin: 0;
  padding: 4px 12px 16px;
}
body.ws .ws-sec + .ws-sec {
  margin-top: 16px;
}
body.ws .ws-sec-title {
  display: var(--ws-label, block);
  transition: opacity 150ms var(--ws-ease);
  margin: 0 0 4px;
  padding: 0 12px;
  font: 600 11px/1.6 var(--font-body);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-muted);
}
body.ws .ws-sec[hidden] {
  display: none;
}
/* В „релса“ заглавието на секцията е тънка разделителна линия. */
@media (min-width: 761px) and (max-width: 1199px) {
  body.ws .ws-sec + .ws-sec {
    padding-top: 12px;
    border-top: 1px solid var(--line);
  }
}
@media (min-width: 761px) {
  body.ws.ws-rail .ws-sec + .ws-sec,
  body.ws.pl-wide .ws-sec + .ws-sec {
    padding-top: 12px;
    border-top: 1px solid var(--line);
  }
}
body.ws .ws-item {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: var(--ws-item-justify, flex-start);
  gap: 12px;
  min-height: 44px;
  margin: 2px 0;
  padding: 0 var(--ws-item-pad, 12px);
  border: 0;
  border-radius: var(--ws-radius-sm);
  background: transparent;
  color: var(--ink-muted);
  font: 500 14px/1.25 var(--font-body);
  text-align: left;
  text-decoration: none;
  white-space: nowrap;
  box-shadow: none;
  transition:
    background-color var(--ws-dur-1) ease,
    color var(--ws-dur-1) ease;
}
body.ws .ws-item[hidden] {
  display: none;
}
/* D-08: с мишка целите могат да са по-ниски (WCAG 24 px) – менюто на булката се събира по-добре на екрана. */
@media (pointer: fine) {
  body.ws .ws-item {
    min-height: 40px;
    margin: 1px 0;
  }
}
body.ws .ws-item svg {
  flex: none;
  width: 20px;
  height: 20px;
}
body.ws .ws-item-text {
  display: var(--ws-label, block);
  transition: opacity 150ms var(--ws-ease);
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}
body.ws .ws-item .ws-lock {
  display: var(--ws-label, block);
  width: 14px;
  height: 14px;
  color: var(--ink-muted);
}
@media (hover: hover) and (pointer: fine) {
  body.ws .ws-item:hover {
    background: var(--paper-sunk);
    color: var(--ink);
  }
}
body.ws .ws-item.active,
body.ws .ws-item[aria-current='page'] {
  background: var(--ws-accent-soft);
  color: var(--ws-accent-ink);
  font-weight: 600;
}
body.ws .ws-item:focus-visible,
body.ws #lux-tabbar .ws-tab:focus-visible,
body.ws #lux-subnav a:focus-visible {
  outline: 2px solid var(--ws-accent-ink);
  outline-offset: 2px;
}
/* Действията на екипа (+ Нова оферта, търсене на оферта) – под марката. */
body.ws #main-menu .main-menu-actions {
  display: var(--ws-label, flex);
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  grid-column: auto;
  grid-row: auto;
  margin: 0;
  padding: 0 16px 14px;
}
/* Булката няма поле за търсене (брифът §6: само работещи елементи; глобално търсене – бекълог UX-WS-01). */
body.ws-client #main-menu .main-menu-actions {
  display: none;
}
body.ws #main-menu .main-menu-actions > a.button {
  flex: 1 1 auto;
  justify-content: center;
  min-height: 40px;
  margin: 0;
  padding: 9px 14px;
  border-radius: var(--ws-radius-pill);
  background: var(--ink);
  border-color: var(--ink);
  color: #fff;
  font-size: 14px;
}
@media (hover: hover) and (pointer: fine) {
  body.ws #main-menu .main-menu-actions > a.button:hover {
    background: var(--ink-hover);
    border-color: var(--ink-hover);
  }
}
body.ws #main-menu .main-menu-actions #offer-search-bar {
  flex: 1 1 100%;
  width: 100%;
  max-width: none;
}
body.ws #main-menu .main-menu-actions #offer-search {
  width: 100%;
  height: 40px;
}
/* ---------- Под-меню (#lux-subnav): само на телефон – разделите на текущата секция като чипове ---------- */
body.ws #lux-subnav {
  display: none;
}
body.ws #lux-tabbar {
  display: none;
}

/* ---------- Телефон (≤ 760 px): горна лента, чипове, долно меню ---------- */
@media (max-width: 760px) {
  body.ws > header {
    display: flex !important;
    height: var(--ws-topbar-h);
    min-height: 0;
    padding: 8px 12px 8px 16px !important;
    gap: 8px;
  }
  body.ws > header > .brand-home {
    display: none !important;
  }
  body.ws > header #header-intro,
  body.ws > header #header-intro > #ws-title {
    display: flex !important;
  }
  body.ws .ws-title-eyebrow {
    display: none;
  }
  body.ws .ws-title-text {
    font-size: 19px;
  }
  body.ws .menu-toggle {
    display: none !important;
  }
  body.ws #lux-subnav:not([hidden]) {
    position: sticky;
    top: 0;
    z-index: 19;
    display: flex;
    justify-content: flex-start;
    gap: 8px;
    padding: 8px 12px;
    overflow-x: auto;
    background: var(--cream);
    border-bottom: 1px solid var(--line);
  }
  body.ws #lux-subnav a {
    min-height: 36px;
    padding: 7px 14px;
    border: 1px solid var(--line);
    border-radius: var(--ws-radius-pill);
    background: var(--paper);
    box-shadow: none;
    color: var(--ink);
    font-size: 13px;
  }
  body.ws #lux-subnav a.active {
    background: var(--ws-accent-soft);
    border-color: var(--ws-accent-line);
    color: var(--ws-accent-ink);
    box-shadow: none;
  }
  body.ws #lux-tabbar:not([hidden]) {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 800;
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(0, 1fr);
    margin: 0;
    padding: 4px 6px env(safe-area-inset-bottom);
    background: var(--cream);
    border-top: 1px solid var(--line);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
  body.ws.has-lux-tabbar {
    padding-bottom: calc(var(--ws-tabbar-h) + 8px + env(safe-area-inset-bottom));
  }
  body.ws #lux-tabbar .ws-tab {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    min-height: 52px;
    margin: 0;
    padding: 4px 2px;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    color: var(--ink-muted);
    font: 600 12px/1.2 var(--font-body);
    letter-spacing: 0.01em;
    text-decoration: none;
    white-space: nowrap;
  }
  body.ws #lux-tabbar .ws-tab svg {
    width: 22px;
    height: 22px;
  }
  body.ws #lux-tabbar .ws-tab::before {
    content: '';
    position: absolute;
    top: -4px;
    left: 22%;
    right: 22%;
    height: 2px;
    border-radius: 2px;
    background: var(--ws-accent);
    transform: scaleX(0);
    transition: transform var(--ws-dur-2) var(--ws-ease);
  }
  body.ws #lux-tabbar .ws-tab.active {
    color: var(--ws-accent-ink);
  }
  body.ws #lux-tabbar .ws-tab.active::before {
    transform: scaleX(1);
  }
  body.ws.drawer-open #lux-tabbar {
    display: none;
  }
  /* „Още“: чекмеджето показва цялото меню по секции + профила. */
  body.ws #mobile-drawer #main-menu,
  body.ws #mobile-drawer .catalog-main-menu {
    display: flex !important;
    width: auto;
    overflow: visible;
    border: 0;
    background: none;
  }
  body.ws #mobile-drawer .ws-brand img,
  body.ws #mobile-drawer .ws-foot,
  body.ws #mobile-drawer #header-intro {
    display: none !important;
  }
  body.ws #mobile-drawer .ws-brand {
    align-items: flex-start;
    padding: 0 4px 12px;
    text-align: left;
  }
  body.ws #mobile-drawer .ws-brand-home {
    display: none;
  }
  body.ws #mobile-drawer .ws-brand-event {
    align-items: flex-start;
    min-height: 44px;
    justify-content: center;
    padding: 0;
  }
  body.ws #mobile-drawer #main-menu .main-menu-links {
    padding: 0;
  }
  body.ws #mobile-drawer .ws-item {
    min-height: 48px;
    font-size: 15px;
    color: var(--ink);
  }
  body.ws-client #mobile-drawer #main-menu .main-menu-actions {
    display: none !important;
  }
  body.ws-staff #mobile-drawer #main-menu .main-menu-actions {
    display: flex !important;
    padding: 0;
  }
  body.ws.has-lux-tabbar .pli-savebar {
    bottom: calc(var(--ws-tabbar-h) + 8px + env(safe-area-inset-bottom));
  }
}

/* ---------- Компоненти (docs/design/workspace/components.md) ---------- */
body.ws .ws-card {
  display: flex;
  flex-direction: column;
  gap: 16px;
  min-width: 0;
  margin: 0;
  padding: 20px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--ws-radius-md);
  box-shadow: none;
}
body.ws .ws-card-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 4px 12px;
  min-width: 0;
}
/* D-12: заглавието остава на един ред, когато се побира; връзката минава отдолу вдясно, когато няма място. */
body.ws .ws-card-head h2 {
  flex: 1 0 auto;
  max-width: 100%;
  text-wrap: balance;
  margin: 0;
  font: 500 20px/1.3 var(--font-display);
  color: var(--ink);
}
/* KPI карта – цялата е връзка към модула. */
body.ws .ws-stat {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
  min-width: 0;
  min-height: 150px;
  margin: 0;
  padding: 20px;
  container-type: inline-size;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--ws-radius-md);
  box-shadow: none;
  color: var(--ink);
  font: inherit;
  text-align: left;
  text-decoration: none;
  white-space: normal;
  transition:
    transform var(--ws-dur-2) var(--ws-ease),
    box-shadow var(--ws-dur-2) var(--ws-ease),
    border-color var(--ws-dur-2) var(--ws-ease);
}
@media (hover: hover) and (pointer: fine) {
  body.ws .ws-stat:hover {
    transform: translateY(-1px);
    border-color: var(--ws-accent-line);
    box-shadow: var(--ws-shadow-1);
    background: var(--paper);
    color: var(--ink);
  }
}
body.ws .ws-stat:active {
  transform: scale(0.99);
}
body.ws .ws-stat:focus-visible,
body.ws .ws-btn:focus-visible,
body.ws .ws-link:focus-visible {
  outline: none;
  box-shadow: var(--ws-focus);
}
body.ws .ws-stat-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
/* D4-06: без главни и разредка – като етикета на KPI в разделите. */
body.ws .ws-stat-label {
  font: 500 13px/18px var(--font-body);
  letter-spacing: 0;
  text-transform: none;
  color: var(--ink-muted);
}
body.ws .ws-stat-icon {
  display: grid;
  place-items: center;
  flex: none;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--ws-accent-soft);
  color: var(--ws-accent-ink);
}
body.ws .ws-stat-icon svg {
  width: 18px;
  height: 18px;
}
body.ws .ws-stat-value {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 6px;
  font: 600 28px/1.1 var(--font-body);
  /* D-02: стойността се мащабира по ширината на картата (на 375 px „5 200 €“ се събира). */
  font-size: clamp(20px, 13cqi, 28px);
  min-width: 0;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
  color: var(--ink);
}
body.ws .ws-stat-value small {
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0;
  color: var(--ink-muted);
}
body.ws .ws-stat-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  line-height: 1.45;
  color: var(--ink-muted);
}
body.ws .ws-stat-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: auto;
  font-size: 12px;
  color: var(--ink-muted);
}
body.ws .ws-stat-foot strong {
  color: var(--ink);
  font-variant-numeric: tabular-nums;
}
body.ws .ws-stat-locked {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: auto;
  font-size: 13px;
  color: var(--ink-muted);
}
body.ws .ws-stat-locked svg {
  width: 16px;
  height: 16px;
}
/* Лента на напредъка: пълненето е transform: scaleX (CSSOM, data-scale). */
body.ws .ws-progress {
  position: relative;
  display: block;
  height: 6px;
  overflow: hidden;
  border-radius: var(--ws-radius-pill);
  background: var(--paper-sunk);
}
body.ws .ws-progress-fill {
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: var(--ws-accent);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 400ms var(--ws-ease);
}
body.ws .ws-progress.is-over .ws-progress-fill {
  background: var(--danger);
}
/* Етикет със статус – винаги с текст (и иконка при предупреждение), не само цвят. */
body.ws .ws-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-height: 24px;
  padding: 2px 10px;
  border-radius: var(--ws-radius-pill);
  background: var(--paper-sunk);
  color: var(--ink-muted);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.3;
  white-space: nowrap;
}
body.ws .ws-chip svg {
  width: 13px;
  height: 13px;
  flex: none;
}
body.ws .ws-chip--ok {
  background: var(--mint);
  color: var(--success);
}
body.ws .ws-chip--wait {
  background: var(--ws-status-wait-soft);
  color: var(--ws-status-wait-ink);
}
body.ws .ws-chip--warn {
  background: var(--blush);
  color: var(--ink-on-blush);
}
body.ws .ws-chip--warn svg {
  color: var(--rose);
}
/* Бутони и текстови връзки на работната среда. */
body.ws .ws-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  margin: 0;
  padding: 0 22px;
  border: 1px solid var(--line-strong);
  border-radius: var(--ws-radius-pill);
  background: var(--paper);
  box-shadow: none;
  color: var(--ink);
  font: 600 14px/1.2 var(--font-body);
  text-decoration: none;
  white-space: nowrap;
  transition:
    background-color var(--ws-dur-1) ease,
    border-color var(--ws-dur-1) ease,
    color var(--ws-dur-1) ease,
    transform 100ms var(--ws-ease);
}
body.ws .ws-btn svg {
  width: 16px;
  height: 16px;
}
body.ws .ws-btn--primary {
  background: var(--ink);
  border-color: var(--ink);
  color: #fff;
}
@media (hover: hover) and (pointer: fine) {
  body.ws .ws-btn:hover {
    background: var(--paper-sunk);
    color: var(--ink);
  }
  body.ws .ws-btn--primary:hover {
    background: var(--ink-hover);
    border-color: var(--ink-hover);
    color: #fff;
  }
}
body.ws .ws-btn:active {
  transform: scale(0.98);
}
body.ws .ws-link {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-height: 0;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 4px;
  background: none;
  box-shadow: none;
  color: var(--ws-accent-ink);
  font: 600 13px/1.4 var(--font-body);
  text-decoration: none;
  white-space: nowrap;
}
/* Връзка-бутон в #planner: без общото оформление на бутоните на планера (#planner button). */
body.ws #planner button.ws-link {
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 4px;
  background: none;
  font-weight: 600;
}
/* D-04: невидимо разширение на целта – 26 px с мишка, 44 px на тъч (видът не се променя). */
body.ws .ws-link::after {
  content: '';
  position: absolute;
  inset: -4px;
}
@media (pointer: coarse), (max-width: 760px) {
  body.ws .ws-link::after {
    inset: -13px -8px;
  }
}
body.ws .ws-link svg {
  width: 14px;
  height: 14px;
  transition: transform var(--ws-dur-1) ease;
}
@media (hover: hover) and (pointer: fine) {
  body.ws .ws-link:hover {
    background: none;
    color: var(--ws-accent-deep);
    text-decoration: underline;
    text-underline-offset: 3px;
  }
  body.ws .ws-link:hover svg {
    transform: translateX(2px);
  }
}
/* Празно състояние: иконка, едно-две изречения, едно действие. */
body.ws .ws-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  flex: 1;
  padding: 20px 12px;
  text-align: center;
}
body.ws .ws-empty > svg {
  width: 32px;
  height: 32px;
  color: var(--ws-accent);
}
body.ws .ws-empty p {
  max-width: 34ch;
  margin: 0;
  color: var(--ink-muted);
  font-size: 14px;
}
/* Времева линия: час (24 ч) | точка | текст. */
body.ws .ws-timeline {
  margin: 0;
  padding: 0;
  list-style: none;
}
body.ws .ws-timeline li {
  position: relative;
  display: grid;
  grid-template-columns: 48px 14px minmax(0, 1fr);
  gap: 12px;
  padding: 0 0 16px;
}
body.ws .ws-timeline li::before {
  content: '';
  position: absolute;
  top: 16px;
  bottom: 0;
  left: 66px;
  width: 1px;
  background: var(--ws-accent-line);
}
body.ws .ws-timeline li:last-child {
  padding-bottom: 0;
}
body.ws .ws-timeline li:last-child::before {
  display: none;
}
body.ws .ws-timeline time {
  font-size: 13px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  color: var(--ws-accent-ink);
  line-height: 1.5;
}
body.ws .ws-timeline-dot {
  width: 10px;
  height: 10px;
  margin-top: 5px;
  border: 1.5px solid var(--ws-accent);
  border-radius: 50%;
  background: var(--paper);
}
body.ws .ws-timeline-text {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
body.ws .ws-timeline-text strong {
  font-size: 14px;
  font-weight: 600;
}
body.ws .ws-timeline-text small {
  font-size: 12px;
  color: var(--ink-muted);
}

/* ---------- Пространство на разделите (DESIGN-PASS-1 S-00) ----------
   Един контейнер за всички екрани на работната среда: main е на цялата ширина вдясно от менюто, съдържанието е до
   --ws-content-max и е центрирано (1440 → 1128 px, 1280 → 968 px, 1920 → 1440 px). */
body.ws > main {
  max-width: none;
  padding: 32px var(--ws-pad) 48px;
}
body.ws #planner,
body.ws #workspace {
  width: 100%;
  max-width: var(--ws-content-max);
  margin-inline: auto;
}
/* Изключенията по раздели следват реалната ширина на съдържанието (меню / релса), не прозореца. Само над 760 px:
   на телефона всичко остава една колона, а залепените ленти (position: fixed) – спрямо екрана. */
@media (min-width: 761px) {
  body.ws #planner {
    container: pl / inline-size;
  }
  /* Заглавие на раздел: секцията вече е в горната лента – без надзаглавието, H1 32 px. */
  body.ws #pl-body > .pl-page-head .pl-eyebrow {
    display: none;
  }
  body.ws #pl-body > .pl-page-head .pl-title {
    font-size: 32px;
    line-height: 40px;
  }
}
/* Панелите: 12-колонна мрежа; по подразбиране всичко е на цяла ширина (както досега). data-tab е от plRender(). */
body.ws #pl-body {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 24px;
  align-items: start;
}
body.ws #pl-body > * {
  grid-column: 1 / -1;
  min-width: 0;
}
body.ws .ws-cols {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr));
}
body.ws .ws-sticky {
  position: sticky;
  top: 24px;
}
/* Ред от 45–75 знака в текстовете на разделите (без прегледите на поканата и сайта). */
body.ws #pl-body :is(.pl-section, .pl-card, .ws-card) > p:not([class*='actions']),
body.ws #pl-body .pl-lead {
  max-width: 72ch;
}

/* Заглавната част на страниците на портала (.page-intro: „Оферти и заявки“, „График на деня“, „Планери“, …):
   надзаглавието повтаря горната лента, H1 32 px, без линията отдолу. */
@media (min-width: 761px) {
  body.ws .page-intro {
    padding: 0 0 8px;
    margin-bottom: 16px;
    border-bottom: 0;
  }
  body.ws .page-intro > small {
    display: none;
  }
  body.ws .page-intro h1 {
    margin: 0 0 8px;
    font-size: 32px;
    line-height: 40px;
  }
}
/* Заглавията на „Оферти и документи“ и „Въпросници“ – по същото правило като .pl-page-head. */
@media (min-width: 761px) {
  body.ws #planner :is(.plo-page-head, .plq-head) .pl-eyebrow {
    display: none;
  }
  body.ws #planner :is(.plo-page-head, .plq-head) .pl-title {
    font-size: 32px;
    line-height: 40px;
  }
}

/* ---------- Раздели: оптимално пространство (DESIGN-PASS-1, т. 4) ----------
   Общите части важат на всички ширини; подредбите в колони – само когато съдържанието е поне 900 px (@container pl). */
/* Задачи: обобщението и филтрите отстрани, групите вдясно. */
body.ws #planner .pl-task-aside,
body.ws #planner .pl-task-groups {
  display: grid;
  gap: 24px;
  align-content: start;
  min-width: 0;
}
/* Доставчици (DESIGN-PASS-2 т. 3.2, DP2-15): таблица на компютър; на телефон и в тясна колона – карти от същия DOM с
   „Обади се“ и „Имейл“ (44 px) отдолу на цяла ширина. Целият ред/карта отваря редакцията. */
body.ws #planner .plp-vcard {
  gap: 0;
  padding: 4px 16px 12px;
  container: plpv / inline-size;
}
body.ws #planner .plp-vtable tbody tr {
  cursor: pointer;
}
@media (hover: hover) and (pointer: fine) {
  body.ws #planner .plp-vtable tbody tr:hover > * {
    background: var(--cream);
  }
}
body.ws #planner .plp-vtable tbody :is(th, td) {
  vertical-align: middle;
}
body.ws #planner .plp-v-open {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  width: 100%;
  min-height: 44px;
  margin: 0;
  padding: 4px 0;
  border: 0;
  border-radius: var(--ws-radius-sm);
  background: none;
  box-shadow: none;
  color: var(--ink);
  font: inherit;
  text-align: left;
}
body.ws #planner .plp-v-open strong {
  font-size: 15px;
  font-weight: 600;
}
body.ws #planner .plp-v-open small {
  display: block;
  font-size: 13px;
  line-height: 1.4;
  color: var(--ink-muted);
}
body.ws #planner .plp-v-open .plp-v-offer {
  color: var(--ws-accent-ink);
  font-weight: 600;
}
body.ws #planner .plp-v-open:focus-visible {
  outline: none;
  box-shadow: var(--ws-focus);
}
body.ws #planner .plp-v-cat,
body.ws #planner .plp-v-arr {
  font-size: 13px;
  color: var(--ink-muted);
  white-space: nowrap;
}
body.ws #planner .plp-v-sum small {
  display: block;
  font-size: 12px;
  color: var(--ink-muted);
}
body.ws #planner .plp-c-btns {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
body.ws #planner .plp-c-btn {
  min-height: 40px;
  padding: 0 14px;
  font-size: 13px;
}
body.ws #planner .plp-c-btn .ws-ico {
  width: 16px;
  height: 16px;
}
@container plpv (max-width: 760px) {
  body.ws #planner .plp-vtable,
  body.ws #planner .plp-vtable tbody {
    display: block;
  }
  body.ws #planner .plp-vtable thead {
    display: none;
  }
  body.ws #planner .plp-vtable tbody tr {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 4px 12px;
    padding: 12px 0;
    border-bottom: 1px solid var(--line);
  }
  body.ws #planner .plp-vtable tbody tr:last-child {
    border-bottom: 0;
  }
  body.ws #planner .plp-vtable.ws-table tbody tr > * {
    display: block;
    padding: 0;
    border: 0;
  }
  body.ws #planner .plp-v-name {
    grid-column: 1;
    grid-row: 1;
  }
  body.ws #planner .plp-v-sum {
    grid-column: 2;
    grid-row: 1;
    align-self: center;
  }
  body.ws #planner .plp-v-cat {
    grid-column: 1;
    grid-row: 2;
  }
  body.ws #planner .plp-v-arr {
    grid-column: 1 / -1;
    grid-row: 4;
  }
  body.ws #planner .plp-v-contract {
    grid-column: 2;
    grid-row: 2;
    justify-self: end;
  }
  body.ws #planner .plp-v-arr:has(> span[aria-hidden]) {
    display: none;
  }
  body.ws #planner .plp-v-contact {
    grid-column: 1 / -1;
    grid-row: 5;
  }
  body.ws #planner .plp-v-contact:not(:has(a)) {
    display: none;
  }
  body.ws #planner .plp-c-btns > .plp-c-btn {
    flex: 1 1 0;
    min-height: 44px;
  }
}
/* Календар: картата „До сватбата“ – плосък фон от токените (без градиент със сурови цветове). */
body.ws .plc-count {
  background: var(--cream);
  border: 1px solid var(--ws-accent-line);
}
/* Покана / Сайт: лентата за запис се пренася и не излиза от картата. */
body.ws .pli-savebar {
  flex-wrap: wrap;
}
body.ws .pli-savebar > .muted,
body.ws .pli-savebar > .pls-savebar-info {
  flex: 1 1 220px;
  max-width: none;
  min-width: 0;
}
/* DP2-08: в колоната на сайта (.pls-savebar-info е flex колона) flex-basis ставаше височина – 220 px празно. */
body.ws .pli-savebar .pls-savebar-info .muted {
  flex: none;
}
body.ws .pli-savebar .pl-invite-save {
  flex: 1 1 auto;
  flex-wrap: wrap;
  justify-content: flex-end;
  min-width: 0;
}
/* Меню: таваните от 720 / 460 px отпадат в работната среда. */
body.ws #planner .plmn-empty,
body.ws #planner .plmn-empty p {
  max-width: none;
}
/* Вдъхновение: празното състояние с трите действия. */
body.ws #planner .pli-empty .ws-empty p {
  max-width: 48ch;
}
body.ws #planner .pli-empty-actions {
  justify-content: center;
  margin-top: 8px;
}
/* Съобщения: картата на координатора до разговора. */
body.ws #planner .plm-side {
  display: grid;
  gap: 16px;
  align-content: start;
  min-width: 0;
}
body.ws #planner .plm-coord {
  background: var(--cream);
}
body.ws #planner .plm-coord .ws-link {
  white-space: normal;
  overflow-wrap: anywhere;
}
body.ws #planner .plq-aside,
body.ws #planner .plq-main {
  display: flex;
  flex-direction: column;
  gap: 16px;
  min-width: 0;
}

@container pl (min-width: 900px) {
  body.ws #pl-body[data-tab='tasks'] > .pl-task-aside {
    grid-column: span 4;
    position: sticky;
    top: 24px;
  }
  body.ws #pl-body[data-tab='tasks'] > .pl-task-groups {
    grid-column: span 8;
  }
  body.ws #pl-body[data-tab='tasks']:not(:has(> .pl-task-aside)) > .pl-task-groups {
    grid-column: 1 / -1;
  }
  /* Гости: филтрите на един ред. */
  body.ws #pl-body[data-tab='guests'] .pl-guest-tools {
    display: grid;
    grid-template-columns: minmax(180px, 1.5fr) repeat(auto-fit, minmax(120px, 1fr));
    gap: 12px;
    align-items: end;
  }
  /* Меню: празното състояние вляво (7/12), „Колко души“ и „За ресторанта“ вдясно (5/12). */
  body.ws #pl-body[data-tab='menus'] .plmn:has(> .plmn-empty) {
    display: grid;
    grid-template-columns: minmax(0, 7fr) minmax(300px, 5fr);
    gap: 24px;
    align-items: start;
  }
  body.ws #pl-body[data-tab='menus'] .plmn:has(> .plmn-empty) > :not(.plmn-empty, .plmn-layout) {
    grid-column: 1 / -1;
  }
  body.ws #pl-body[data-tab='menus'] .plmn:has(> .plmn-empty) > .plmn-layout {
    grid-template-columns: minmax(0, 1fr);
  }
  /* Денят: „Сега“, напредъкът, местата и споделянето вляво; графикът вдясно (само тук – публичният day.php не се пипа). */
  body.ws #pl-body[data-tab='dayof'] .plp-dayof {
    display: grid;
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
    gap: 16px 24px;
    align-items: start;
  }
  body.ws #pl-body[data-tab='dayof'] .plp-dayof > #plp-dayof-view,
  body.ws #pl-body[data-tab='dayof'] .plp-dayof .do {
    display: contents;
  }
  body.ws #pl-body[data-tab='dayof'] .plp-dayof .do > *,
  body.ws #pl-body[data-tab='dayof'] .plp-dayof > .do-share {
    grid-column: 1;
    max-width: none;
    margin: 0;
  }
  body.ws #pl-body[data-tab='dayof'] .plp-dayof .do > .do-progress + .do-card {
    grid-column: 2;
    grid-row: 1 / span 8;
  }
  body.ws #pl-body[data-tab='dayof'] .plp-dayof .do-empty {
    grid-column: 1 / -1;
  }
  /* Спомени: „Общ албум“ на цял ред, останалите по две. */
  body.ws #pl-body[data-tab='memories'] > .pl-section {
    grid-column: span 6;
  }
  body.ws #pl-body[data-tab='memories'] > .pl-section:first-of-type {
    grid-column: 1 / -1;
  }
  /* Оферти и документи: „Запитвания“ и „Оферти“ една до друга, „Документи“ на цял ред. */
  body.ws #planner .plo-page:has(> #plr-host):has(> #plo-host) {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 32px 24px;
    align-items: start;
  }
  body.ws #planner .plo-page:has(> #plr-host):has(> #plo-host) > :is(.plo-page-head, #plm-docs-host) {
    grid-column: 1 / -1;
  }
  /* Съобщения: разговорът 8/12, координаторът и срещите 4/12. */
  body.ws #pl-body[data-tab='messages'] > .plm-chat:has(+ .plm-side) {
    grid-column: span 8;
  }
  body.ws #pl-body[data-tab='messages'] > .plm-side {
    grid-column: span 4;
    position: sticky;
    top: 24px;
  }
  body.ws #planner .plm-msg {
    max-width: 65ch;
  }
  /* Въпросници: въведението и превключвателят в залепена колона (4/12), списъкът 8/12. */
  body.ws #planner .plq-page {
    max-width: none;
    display: grid;
    grid-template-columns: minmax(260px, 4fr) minmax(0, 8fr);
    gap: 24px;
    align-items: start;
  }
  body.ws #planner .plq-aside {
    position: sticky;
    top: 24px;
  }
  /* Събитие: „Основни данни“ 7/12 вляво; „Хора“, „Връзки“, „Език“ вдясно 5/12; останалите на цял ред.
     Редът 5 е 1fr – височината на „Основни данни“ отива само в него, не раздалечава картите вдясно. */
  body.ws #pl-body[data-tab='profile'] {
    grid-template-rows: auto auto auto auto 1fr;
  }
  body.ws #pl-body[data-tab='profile'] > .pl-section:first-of-type {
    grid-column: 1 / span 7;
    grid-row: 2 / span 4;
  }
  body.ws #pl-body[data-tab='profile'] > :is(#pl-members, #pl-links, #pll-card) {
    grid-column: 8 / -1;
  }
  /* „Език за гостите“ в тясната колона: вариантите един под друг. */
  body.ws #pl-body[data-tab='profile'] > #pll-card .pl-langmode {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* Чекмеджето на телефона: фонът е от токените (style.css има суров цвят). */
body.ws .drawer-backdrop:not([hidden]) {
  background: var(--ws-scrim);
}

/* ---------- Фаза 3: общи компоненти (Задачи, Бюджет, Гости; components.md) ----------
   В #planner общото правило за бутони (#planner button – тежест на id) се надвива с body.ws #planner …; диалозите и
   известията са извън #planner (в body). */
.ws-sr {
  position: absolute !important;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}
/* Поле: етикетът винаги видим над него; 44 px; 16 px на телефон (без увеличение в iOS). */
body.ws .ws-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
  margin: 0;
  font-size: 13px;
  font-weight: 600;
  color: var(--ink);
}
body.ws .ws-field-label {
  font-size: 13px;
  font-weight: 600;
  line-height: 1.3;
  color: var(--ink);
}
body.ws .ws-field-control,
body.ws #planner .ws-field-control {
  width: 100%;
  min-height: 44px;
  margin: 0;
  padding: 8px 12px;
  border: 1px solid var(--line-strong);
  border-radius: var(--ws-radius-sm);
  background: var(--paper);
  color: var(--ink);
  font: 400 15px/1.4 var(--font-body);
  transition:
    border-color var(--ws-dur-1) ease,
    box-shadow var(--ws-dur-1) ease;
}
@media (hover: hover) and (pointer: fine) {
  body.ws .ws-field-control:hover {
    border-color: var(--ink-muted);
  }
}
body.ws .ws-field-control:focus-visible,
body.ws #planner .ws-field-control:focus-visible {
  outline: none;
  border-color: var(--ws-accent);
  box-shadow: var(--ws-focus);
}
body.ws .ws-field--sm .ws-field-label {
  font-size: 12px;
  color: var(--ink-muted);
}
@media (max-width: 760px) {
  body.ws .ws-field-control,
  body.ws #planner .ws-field-control {
    font-size: 16px;
  }
}
/* Търсене с иконка в полето. */
body.ws .ws-search-box {
  position: relative;
  display: block;
}
body.ws .ws-search-box > svg {
  position: absolute;
  top: 50%;
  left: 12px;
  width: 16px;
  height: 16px;
  transform: translateY(-50%);
  fill: none;
  stroke: var(--ink-muted);
  stroke-width: 1.75;
  stroke-linecap: round;
  pointer-events: none;
}
body.ws .ws-search-box .ws-field-control,
body.ws #planner .ws-search-box .ws-field-control {
  padding-left: 38px;
}
/* Общите иконки на работната среда (wsIcon): линейни, дебелина 1.75. */
body.ws svg.ws-ico,
.ws-toast svg.ws-ico {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.75;
  stroke-linecap: round;
  stroke-linejoin: round;
}
/* Сегментен избор (чипове-филтри): role=group + aria-pressed; броят до етикета. */
body.ws .ws-segmented {
  display: inline-flex;
  flex-wrap: nowrap;
  gap: 4px;
  max-width: 100%;
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: var(--ws-radius-pill);
  background: var(--paper-sunk);
}
body.ws .ws-segmented--wrap {
  flex-wrap: wrap;
  border-radius: var(--ws-radius-md);
}
body.ws .ws-segmented button,
body.ws #planner .ws-segmented button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  flex: 1 1 auto;
  min-height: 36px;
  margin: 0;
  padding: 6px 14px;
  border: 1px solid transparent;
  border-radius: var(--ws-radius-pill);
  background: none;
  box-shadow: none;
  color: var(--ink-muted);
  font: 600 13px/1.2 var(--font-body);
  white-space: nowrap;
  transition:
    background-color var(--ws-dur-1) ease,
    color var(--ws-dur-1) ease,
    transform 100ms var(--ws-ease);
}
body.ws .ws-segmented button[aria-pressed='true'],
body.ws #planner .ws-segmented button[aria-pressed='true'] {
  background: var(--paper);
  border-color: var(--ws-accent-line);
  color: var(--ws-accent-ink);
  box-shadow: 0 1px 2px rgba(41, 39, 37, 0.06);
}
@media (hover: hover) and (pointer: fine) {
  body.ws .ws-segmented button:hover,
  body.ws #planner .ws-segmented button:hover {
    background: var(--paper);
    color: var(--ink);
  }
}
body.ws .ws-segmented button:active {
  transform: scale(0.98);
}
body.ws .ws-segmented button:focus-visible {
  outline: none;
  box-shadow: var(--ws-focus);
}
@media (pointer: coarse), (max-width: 760px) {
  body.ws .ws-segmented button,
  body.ws #planner .ws-segmented button {
    min-height: 44px;
  }
}
body.ws .ws-count {
  font-variant-numeric: tabular-nums;
  font-weight: 500;
  color: var(--ink-muted);
}
body.ws .ws-num {
  font-variant-numeric: tabular-nums;
}
/* Чип като бутон (напр. „3 закъсняват“): целта е 44 px на тъч. */
body.ws .ws-chip-btn,
body.ws #planner .ws-chip-btn {
  position: relative;
  min-height: 28px;
  margin: 0;
  padding: 2px 12px;
  border: 1px solid transparent;
  box-shadow: none;
  font: 600 12px/1.3 var(--font-body);
  cursor: pointer;
}
body.ws .ws-chip-btn::after {
  content: '';
  position: absolute;
  inset: -4px;
}
@media (pointer: coarse), (max-width: 760px) {
  body.ws .ws-chip-btn::after {
    inset: -9px -4px;
  }
}
body.ws .ws-chip-btn[aria-pressed='true'] {
  border-color: var(--ws-accent-ink);
  background: var(--ws-accent-soft);
  color: var(--ws-accent-ink);
}
body.ws .ws-chip-btn:focus-visible {
  outline: none;
  box-shadow: var(--ws-focus);
}
body.ws .ws-chiprow {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 8px;
}
/* Варианти на бутона (secondary = основният .ws-btn). */
body.ws .ws-btn--ghost,
body.ws #planner .ws-btn--ghost {
  border-color: transparent;
  background: none;
  color: var(--ws-accent-ink);
}
body.ws .ws-btn--danger,
body.ws #planner .ws-btn--danger,
body.ws .pl-dialog .ws-btn--danger {
  border-color: var(--danger);
  background: var(--paper);
  color: var(--danger);
}
body.ws .ws-btn--danger-fill,
body.ws .pl-dialog .ws-btn--danger-fill {
  border-color: var(--danger);
  background: var(--danger);
  color: #fff;
}
@media (hover: hover) and (pointer: fine) {
  body.ws .ws-btn--ghost:hover,
  body.ws #planner .ws-btn--ghost:hover {
    background: var(--ws-accent-soft);
    color: var(--ws-accent-deep);
  }
  body.ws .ws-btn--danger:hover,
  body.ws .pl-dialog .ws-btn--danger:hover {
    background: var(--ws-danger-soft);
    border-color: var(--danger);
    color: var(--danger);
  }
  body.ws .ws-btn--danger-fill:hover {
    background: var(--danger);
    border-color: var(--danger);
    color: #fff;
    filter: brightness(0.92);
  }
}
/* Иконен бутон 44×44 (aria-label е задължителен). */
body.ws .ws-icon-btn,
body.ws #planner .ws-icon-btn {
  display: inline-grid;
  place-items: center;
  flex: none;
  width: 44px;
  height: 44px;
  min-height: 44px;
  margin: 0;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 50%;
  background: none;
  box-shadow: none;
  color: var(--ink-muted);
}
body.ws .ws-icon-btn svg {
  width: 20px;
  height: 20px;
}
@media (hover: hover) and (pointer: fine) {
  body.ws .ws-icon-btn:hover,
  body.ws #planner .ws-icon-btn:hover {
    background: var(--paper-sunk);
    color: var(--ink);
  }
}
body.ws .ws-icon-btn:focus-visible,
body.ws .ws-icon-btn[aria-expanded='true'] {
  outline: none;
  background: var(--paper-sunk);
  color: var(--ink);
}
body.ws .ws-icon-btn:focus-visible {
  box-shadow: var(--ws-focus);
}
/* Меню „Още“ (popover): под бутона, вдясно; ред 44 px. */
body.ws .ws-menu-wrap {
  position: relative;
  display: inline-flex;
  flex: none;
}
body.ws .ws-menu {
  position: absolute;
  top: calc(100% + 4px);
  right: 0;
  z-index: 30;
  display: flex;
  flex-direction: column;
  min-width: 240px;
  max-width: min(320px, calc(100vw - 32px));
  padding: 6px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--ws-radius-md);
  box-shadow: var(--ws-shadow-2);
  animation: ws-pop var(--ws-dur-2) var(--ws-ease);
}
body.ws .ws-menu[hidden] {
  display: none;
}
body.ws .ws-menu [role='menuitem'],
body.ws #planner .ws-menu [role='menuitem'] {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 44px;
  margin: 0;
  padding: 8px 12px;
  border: 0;
  border-radius: var(--ws-radius-sm);
  background: none;
  box-shadow: none;
  color: var(--ink);
  font: 500 14px/1.3 var(--font-body);
  text-align: left;
  white-space: normal;
}
body.ws .ws-menu [role='menuitem']:focus-visible,
body.ws #planner .ws-menu [role='menuitem']:focus-visible {
  outline: none;
  background: var(--paper-sunk);
}
@media (hover: hover) and (pointer: fine) {
  body.ws .ws-menu [role='menuitem']:hover,
  body.ws #planner .ws-menu [role='menuitem']:hover {
    background: var(--paper-sunk);
  }
}
body.ws .ws-menu [role='menuitem'].is-danger {
  color: var(--danger);
}
body.ws .ws-menu [role='menuitem'] svg {
  width: 18px;
  height: 18px;
  flex: none;
}
@keyframes ws-pop {
  from {
    opacity: 0;
    transform: translateY(-4px);
  }
}
/* Известия (Toast): долу вляво на компютър (до менюто), горе на телефон; над всичко освен модалните диалози. */
.ws-toasts {
  position: fixed;
  left: calc(var(--ws-side, 0px) + 24px);
  bottom: 24px;
  z-index: 70;
  display: flex;
  flex-direction: column;
  gap: 8px;
  width: min(420px, calc(100vw - 32px));
  pointer-events: none;
}
.ws-toast {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 52px;
  padding: 8px 8px 8px 16px;
  background: var(--ink);
  border-radius: var(--ws-radius-md);
  box-shadow: var(--ws-shadow-2);
  color: #fff;
  font: 500 14px/1.4 var(--font-body);
  pointer-events: auto;
  animation: ws-toast-in var(--ws-dur-3) var(--ws-ease);
  transition:
    opacity 150ms var(--ws-ease-in),
    transform 150ms var(--ws-ease-in);
}
.ws-toast.is-leaving {
  opacity: 0;
  transform: translateY(8px);
}
.ws-toast svg {
  width: 18px;
  height: 18px;
  flex: none;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.75;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.ws-toast-icon {
  color: var(--mint);
}
.ws-toast.is-error .ws-toast-icon {
  color: var(--blush);
}
.ws-toast-text {
  flex: 1;
  min-width: 0;
}
body .ws-toast button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  min-height: 36px;
  margin: 0;
  padding: 0 12px;
  border: 0;
  border-radius: var(--ws-radius-pill);
  background: none;
  box-shadow: none;
  color: #fff;
  font: 600 14px/1.2 var(--font-body);
}
body .ws-toast .ws-toast-action {
  color: var(--gold-soft);
  text-decoration: underline;
  text-underline-offset: 3px;
}
body .ws-toast .ws-toast-close {
  width: 36px;
  padding: 0;
  color: rgba(255, 255, 255, 0.8);
}
@media (hover: hover) and (pointer: fine) {
  body .ws-toast button:hover {
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
  }
}
body .ws-toast button:focus-visible {
  outline: 2px solid var(--gold-soft);
  outline-offset: 1px;
}
@media (max-width: 760px) {
  .ws-toasts {
    left: 16px;
    right: 16px;
    top: calc(12px + env(safe-area-inset-top));
    bottom: auto;
    width: auto;
  }
  body .ws-toast button {
    min-height: 44px;
  }
  body .ws-toast .ws-toast-close {
    width: 44px;
  }
}
@keyframes ws-toast-in {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
}
/* Диалог (Modal) и лист отдолу на телефон: класът ws-dialog се слага от wsSheet() / wsConfirm(). */
body.ws dialog.ws-dialog {
  width: min(560px, calc(100vw - 32px));
  max-height: min(92dvh, calc(100vh - 32px));
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: var(--ws-radius-lg);
  background: var(--paper);
  box-shadow: var(--ws-shadow-2);
  color: var(--ink);
  font-family: var(--font-body);
  overscroll-behavior: contain;
}
body.ws dialog.ws-dialog[open] {
  animation: ws-modal-in 280ms var(--ws-ease);
}
body.ws dialog.ws-dialog::backdrop {
  background: var(--ws-scrim);
}
body.ws dialog.ws-dialog h2 {
  margin: 0 0 16px;
  font: 500 22px/1.3 var(--font-display);
  color: var(--ink);
  text-wrap: balance;
}
body.ws dialog.ws-dialog label {
  font-size: 13px;
  font-weight: 600;
}
body.ws dialog.ws-dialog :is(input:not([type='checkbox'], [type='radio'], [type='hidden']), select, textarea) {
  min-height: 44px;
  border-color: var(--line-strong);
  border-radius: var(--ws-radius-sm);
}
body.ws dialog.ws-dialog :is(input, select, textarea):focus-visible {
  outline: none;
  border-color: var(--ws-accent);
  box-shadow: var(--ws-focus);
}
/* Бутоните долу: основният последен, вдясно; залепени за долния ръб при превъртане. */
body.ws dialog.ws-dialog .ws-dialog-foot {
  position: sticky;
  bottom: -24px;
  z-index: 1;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  margin: 16px -24px -24px;
  padding: 12px 24px 24px;
  background: var(--paper);
  border-top: 1px solid var(--line);
}
body.ws dialog.ws-dialog .ws-dialog-foot .ws-btn--danger {
  margin-right: auto;
}
body.ws dialog.ws-dialog .ws-dialog-foot .pl-push-right {
  margin-left: auto;
}
body.ws dialog.ws-dialog .ws-dialog-foot .ws-btn--danger + .pl-push-right {
  margin-left: 0;
}
/* „Още полета“ в диалога (прогресивно разкриване). */
body.ws .ws-more {
  margin: 12px 0 0;
  border-top: 1px solid var(--line);
}
body.ws .ws-more > summary {
  display: flex;
  align-items: center;
  min-height: 44px;
  color: var(--ws-accent-ink);
  font-weight: 600;
  font-size: 14px;
  cursor: pointer;
}
body.ws .ws-more > summary:focus-visible {
  outline: none;
  box-shadow: var(--ws-focus);
  border-radius: var(--ws-radius-sm);
}
body.ws .ws-chiprow .ws-chip-btn[aria-pressed='true'] {
  border-color: var(--ws-accent-ink);
}
@keyframes ws-modal-in {
  from {
    opacity: 0;
    transform: translateY(8px) scale(0.98);
  }
}
@media (max-width: 760px) {
  body.ws dialog.ws-dialog {
    width: 100%;
    max-width: none;
    max-height: 92dvh;
    margin: auto 0 0;
    padding: 12px 16px 16px;
    border-radius: var(--ws-radius-lg) var(--ws-radius-lg) 0 0;
    border-bottom: 0;
  }
  body.ws dialog.ws-dialog::before {
    content: '';
    display: block;
    width: 40px;
    height: 4px;
    margin: 0 auto 12px;
    border-radius: var(--ws-radius-pill);
    background: var(--line);
  }
  body.ws dialog.ws-dialog[open] {
    animation: ws-sheet-in 300ms var(--ws-ease);
  }
  body.ws dialog.ws-dialog h2 {
    font-size: 20px;
  }
  body.ws dialog.ws-dialog :is(input:not([type='checkbox'], [type='radio']), select, textarea) {
    font-size: 16px;
  }
  body.ws dialog.ws-dialog .ws-dialog-foot {
    bottom: -16px;
    margin: 16px -16px -16px;
    padding: 12px 16px calc(16px + env(safe-area-inset-bottom));
  }
  body.ws dialog.ws-dialog .ws-dialog-foot button {
    flex: 1 1 auto;
  }
}
@keyframes ws-sheet-in {
  from {
    transform: translateY(100%);
  }
}
/* Потвърждение: малък диалог 400 px, бутоните един до друг. */
body.ws dialog.ws-confirm {
  width: min(400px, calc(100vw - 32px));
}
body.ws dialog.ws-confirm p {
  margin: 0;
  color: var(--ink-muted);
  font-size: 15px;
  line-height: 1.55;
}
body.ws dialog.ws-confirm .ws-dialog-foot {
  position: static;
  margin: 24px 0 0;
  padding: 0;
  border: 0;
}
@media (max-width: 760px) {
  body.ws dialog.ws-confirm {
    width: 100%;
  }
  body.ws dialog.ws-confirm .ws-dialog-foot {
    padding-bottom: env(safe-area-inset-bottom);
  }
}
/* Алерт: иконка + текст (+ действие); без лява цветна рамка. */
body.ws .ws-alert {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  margin: 0;
  padding: 14px 16px;
  border-radius: var(--ws-radius-md);
  background: var(--ws-accent-soft);
  color: var(--ink);
  font-size: 14px;
}
body.ws .ws-alert > svg {
  width: 20px;
  height: 20px;
  flex: none;
  color: var(--ws-accent-ink);
}
body.ws .ws-alert > p {
  flex: 1 1 220px;
  margin: 0;
}
body.ws .ws-alert--error {
  background: var(--ws-danger-soft);
}
body.ws .ws-alert--error > svg {
  color: var(--danger);
}
body.ws .ws-alert--ok {
  background: var(--mint);
}
body.ws .ws-alert--ok > svg {
  color: var(--success);
}
body.ws .ws-alert--warn {
  background: var(--blush);
}
body.ws .ws-alert--warn > svg {
  color: var(--rose);
}
body.ws #pl-body > .ws-alert {
  grid-column: 1 / -1;
}
/* Скелет при зареждане: формата на бъдещото съдържание; блясък с transform само докато зарежда. */
body.ws .ws-skel-wrap {
  display: grid;
  gap: 12px;
}
body.ws .ws-skel {
  position: relative;
  overflow: hidden;
  border-radius: var(--ws-radius-sm);
  background: var(--paper-sunk);
}
body.ws .ws-skel--block {
  height: 120px;
  border-radius: var(--ws-radius-md);
}
body.ws .ws-skel--row {
  height: 52px;
}
body.ws .ws-skel::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent, var(--cream), transparent);
  transform: translateX(-100%);
  animation: ws-skel 1.4s ease-in-out infinite;
}
@keyframes ws-skel {
  to {
    transform: translateX(100%);
  }
}
/* По-голямото празно състояние на раздел (заглавие Lora 18, едно-две изречения, действия). */
body.ws .ws-empty--lg {
  gap: 12px;
  padding: 32px 16px;
}
body.ws .ws-empty--lg > svg {
  width: 40px;
  height: 40px;
}
body.ws .ws-empty h2,
body.ws #planner .ws-empty h2 {
  margin: 0;
  font: 500 18px/1.3 var(--font-display);
  color: var(--ink);
}
body.ws .ws-empty-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  margin-top: 4px;
}
/* Плаващ бутон (FAB) – само на телефон, над долното меню, вдясно; скрива се, докато се пише в поле. */
body.ws .ws-fab,
body.ws #planner .ws-fab {
  position: fixed;
  right: 16px;
  bottom: calc(16px + env(safe-area-inset-bottom));
  z-index: 35;
  display: none;
  align-items: center;
  gap: 8px;
  min-height: 56px;
  margin: 0;
  padding: 0 22px 0 18px;
  border: 0;
  border-radius: var(--ws-radius-pill);
  background: var(--ink);
  box-shadow: var(--ws-shadow-2);
  color: #fff;
  font: 600 15px/1 var(--font-body);
  transition:
    opacity var(--ws-dur-2) var(--ws-ease),
    transform var(--ws-dur-2) var(--ws-ease);
}
body.ws .ws-fab svg {
  width: 20px;
  height: 20px;
}
body.ws .ws-fab:active {
  transform: scale(0.96);
}
body.ws .ws-fab:focus-visible {
  outline: none;
  box-shadow: var(--ws-focus);
}
@media (max-width: 760px) {
  body.ws .ws-fab,
  body.ws #planner .ws-fab {
    display: inline-flex;
  }
  body.ws.has-lux-tabbar .ws-fab,
  body.ws.has-lux-tabbar #planner .ws-fab {
    bottom: calc(var(--ws-tabbar-h) + 16px + env(safe-area-inset-bottom));
  }
  body.ws:has(#pl-body :is(input:not([type='checkbox']), select, textarea):focus) .ws-fab,
  body.ws:has(#pl-body :is(input:not([type='checkbox']), select, textarea):focus) #planner .ws-fab {
    opacity: 0;
    transform: translateY(8px);
    pointer-events: none;
  }
  /* Последният ред не остава под плаващия бутон. */
  body.ws #pl-body:has(> .ws-fab) {
    padding-bottom: 72px;
  }
}

/* ---------- Задачи (docs/design/workspace/pages/tasks.md) ---------- */
body.ws #planner .ws-tasktools {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
body.ws #planner .ws-tasktools > * {
  flex: none;
}
body.ws #planner .ws-tasktools .ws-segmented {
  align-self: flex-start;
}
/* Търсене + „Филтри“ (телефон) в един ред. */
body.ws #planner .plt-searchrow {
  display: flex;
  align-items: flex-end;
  gap: 8px;
}
body.ws #planner .plt-searchrow > .ws-field {
  flex: 1 1 auto;
  min-width: 0;
}
body.ws #planner .plt-more-filters {
  display: grid;
  gap: 16px;
}
body.ws #planner .plt-filters-btn {
  width: 44px;
  min-width: 44px;
  padding: 0;
}
body.ws #planner .plt-filters-btn svg {
  width: 18px;
  height: 18px;
}
body.ws .plt-filter-sheet {
  display: grid;
  gap: 16px;
}
/* Мини линия (задачи по седмици). */
body.ws :is(#planner, main) .ws-spark--line {
  fill: none;
  stroke: var(--ws-accent);
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}
/* Бързо добавяне. */
body.ws #planner .ws-quickadd {
  gap: 12px;
  padding: 16px;
}
body.ws .ws-quickadd-title {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  padding: 0 14px;
  border: 1px solid var(--line-strong);
  border-radius: var(--ws-radius-sm);
  background: var(--paper);
  transition:
    border-color var(--ws-dur-1) ease,
    box-shadow var(--ws-dur-1) ease;
}
body.ws .ws-quickadd-title:focus-within {
  border-color: var(--ws-accent);
  box-shadow: var(--ws-focus);
}
body.ws .ws-quickadd-title > svg {
  width: 18px;
  height: 18px;
  flex: none;
  color: var(--ws-accent-ink);
}
body.ws #planner .ws-quickadd-title input {
  flex: 1;
  min-width: 0;
  min-height: 44px;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  box-shadow: none;
  color: var(--ink);
  font: 500 15px/1.4 var(--font-body);
}
body.ws #planner .ws-quickadd-title input:focus {
  outline: none;
}
body.ws .ws-quickadd-row {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 12px 16px;
}
body.ws .ws-quickadd-row .ws-field {
  flex: 1 1 160px;
  max-width: 240px;
}
body.ws .ws-quickadd-row .ws-link {
  align-self: center;
  margin-bottom: 0;
}
body.ws .ws-quickadd-cat {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 12px;
  margin: 0;
  font-size: 13px;
  color: var(--ink-muted);
}
/* Група (категория): заглавието е бутон за свиване (aria-expanded), ⋯ – менюто на групата. */
body.ws #planner .ws-group {
  gap: 0;
  padding: 8px 16px 8px 20px;
}
body.ws .ws-group-head {
  display: flex;
  align-items: center;
  gap: 4px;
}
body.ws #planner .ws-group-title {
  flex: 1;
  min-width: 0;
  margin: 0;
  font: inherit;
}
body.ws #planner .ws-group-toggle {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-height: 56px;
  margin: 0;
  padding: 6px 4px;
  border: 0;
  border-radius: var(--ws-radius-sm);
  background: none;
  box-shadow: none;
  color: var(--ink);
  text-align: left;
}
body.ws #planner .ws-group-toggle:focus-visible {
  outline: none;
  box-shadow: var(--ws-focus);
}
body.ws .ws-group-name {
  flex: 0 1 auto;
  min-width: 0;
  font: 500 19px/1.3 var(--font-display);
  overflow-wrap: anywhere;
}
body.ws .ws-group-toggle .pl-cat-count {
  font-variant-numeric: tabular-nums;
}
body.ws .ws-group-done {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  font-weight: 600;
  color: var(--success);
}
body.ws .ws-group-done svg {
  width: 14px;
  height: 14px;
}
body.ws .ws-group-chev {
  width: 18px;
  height: 18px;
  margin-left: auto;
  flex: none;
  color: var(--ink-muted);
  transition: transform var(--ws-dur-2) var(--ws-ease);
}
body.ws .ws-group-toggle[aria-expanded='false'] .ws-group-chev {
  transform: rotate(-90deg);
}
body.ws #planner .ws-group .pl-task-list {
  margin: 0 0 8px;
}
/* Ред на задача: отметка (24 в цел 44) | заглавие + мета | отговорник + „Редактирай“. */
body.ws #planner .ws-task {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) auto;
  align-items: center;
  gap: 4px 8px;
  padding: 6px 0;
  transition:
    opacity 200ms var(--ws-ease),
    background-color 600ms var(--ws-ease);
}
body.ws #planner .ws-task.is-new {
  background: var(--ws-accent-soft);
}
body.ws .ws-task-check {
  position: relative;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  margin: 0;
  cursor: pointer;
}
body.ws #planner .ws-task-check input {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  opacity: 0;
  cursor: pointer;
}
body.ws .ws-task-box {
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border: 1.5px solid var(--line-strong);
  border-radius: 7px;
  background: var(--paper);
  color: transparent;
  transition:
    background-color var(--ws-dur-1) ease,
    border-color var(--ws-dur-1) ease,
    transform 100ms var(--ws-ease);
}
body.ws .ws-task-box svg {
  width: 15px;
  height: 15px;
  stroke-width: 2.25;
  opacity: 0;
  transform: scale(0.6);
  transition:
    opacity var(--ws-dur-2) var(--ws-ease),
    transform var(--ws-dur-2) var(--ws-ease);
}
body.ws .ws-task-check input:checked + .ws-task-box {
  background: var(--ws-accent-ink);
  border-color: var(--ws-accent-ink);
  color: #fff;
}
body.ws .ws-task-check input:checked + .ws-task-box svg {
  opacity: 1;
  transform: none;
}
body.ws .ws-task-check input:focus-visible + .ws-task-box {
  box-shadow: var(--ws-focus);
}
body.ws .ws-task-check input:disabled + .ws-task-box {
  opacity: 0.6;
}
body.ws .ws-task-check:active .ws-task-box {
  transform: scale(0.92);
}
@media (hover: hover) and (pointer: fine) {
  body.ws .ws-task-check:hover .ws-task-box {
    border-color: var(--ws-accent);
  }
}
body.ws #planner .ws-task-main {
  min-height: 44px;
  padding: 6px 8px;
  gap: 2px;
}
body.ws #planner .ws-task-main strong {
  font-size: 15px;
  font-weight: 600;
  line-height: 1.4;
  transition: color var(--ws-dur-2) ease;
}
body.ws #planner .ws-task-main:focus-visible {
  outline: none;
  box-shadow: var(--ws-focus);
}
body.ws .ws-task-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 2px 6px;
  font-size: 13px;
  line-height: 1.45;
  color: var(--ink-muted);
}
body.ws .ws-task-meta .ws-dot {
  color: var(--line-strong);
}
body.ws .ws-task-meta .pl-due-overdue {
  color: var(--ink);
  font-weight: 600;
}
body.ws .ws-task-meta .ws-chip {
  min-height: 22px;
  padding: 1px 8px;
}
body.ws #planner .ws-task.is-done .ws-task-main strong {
  color: var(--ink-muted);
  text-decoration: line-through;
  text-decoration-color: var(--line-strong);
}
body.ws #planner .ws-task.is-done {
  opacity: 0.78;
}
body.ws .ws-task-side {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}
body.ws #planner .ws-task-edit {
  min-height: 44px;
  padding: 0 14px;
  border-color: var(--line);
  color: var(--ink-muted);
}
@media (hover: hover) and (pointer: fine) {
  body.ws #planner .ws-task-edit:hover {
    background: var(--paper-sunk);
    border-color: var(--line-strong);
    color: var(--ink);
  }
}
body.ws #planner .ws-task-edit:focus-visible,
body.ws #planner .ws-task .pl-chip-button:focus-visible {
  outline: none;
  box-shadow: var(--ws-focus);
}
/* Телефон и тясна колона: отговорникът и „Редактирай“ слизат под заглавието (подравнени с текста). */
@container pl (max-width: 899px) {
  body.ws #planner .ws-task {
    grid-template-columns: 44px minmax(0, 1fr);
  }
  body.ws #planner .ws-task-side {
    grid-column: 2;
    justify-content: flex-start;
    padding-left: 8px;
  }
}
@media (max-width: 760px) {
  body.ws #planner .ws-group {
    padding: 4px 12px 4px 14px;
  }
  body.ws #planner .ws-task {
    grid-template-columns: 44px minmax(0, 1fr);
    padding: 4px 0 8px;
  }
  body.ws #planner .ws-task-side {
    grid-column: 2;
    justify-content: space-between;
    padding-left: 8px;
  }
  body.ws #planner .ws-task .pl-chip-button,
  body.ws #planner .pl-task > .pl-chip-button {
    margin-left: 0;
  }
  body.ws .ws-group-name {
    font-size: 17px;
  }
  /* На телефон бързото добавяне е плаващият бутон „+ Задача“ (лист отдолу). */
  body.ws #planner .ws-quickadd {
    display: none;
  }
  body.ws #planner .ws-tasktools .ws-segmented {
    align-self: stretch;
  }
  /* Телефон: страничната колона е лента – търсене + „Филтри“ (без картата около тях). */
  body.ws #planner .ws-tasktools {
    padding: 0;
    border: 0;
    background: none;
  }
  body.ws #planner .ws-tasktools .ws-field-label {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
  }
}

/* ---------- Бюджет (docs/design/workspace/pages/budget.md) ---------- */
body.ws .ws-muted,
body.ws #planner .ws-muted {
  margin: 0;
  color: var(--ink-muted);
  font-size: 13px;
  line-height: 1.5;
}
body.ws .ws-field-hint {
  font-size: 12px;
  font-weight: 400;
  color: var(--ink-muted);
}
/* Малък бутон (36 px) – само при мишка; на тъч и телефон 44 px. */
body.ws #planner .ws-btn--sm {
  min-height: 36px;
  padding: 0 14px;
  font-size: 13px;
}
@media (pointer: coarse), (max-width: 760px) {
  body.ws #planner .ws-btn--sm {
    min-height: 44px;
  }
}
/* Предстоящи плащания. */
body.ws .ws-due-list {
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 0;
  list-style: none;
}
body.ws .ws-due-list li {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 4px 12px;
  padding: 12px 0;
  border-top: 1px solid var(--line);
}
body.ws .ws-due-list li:first-child {
  border-top: 0;
  padding-top: 0;
}
body.ws .ws-due-when {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  grid-column: 1 / -1;
  font-size: 13px;
  font-weight: 600;
  color: var(--ws-accent-ink);
  font-variant-numeric: tabular-nums;
}
body.ws .ws-due-list li.is-late .ws-due-when time {
  color: var(--ink);
}
body.ws .ws-due-what {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
body.ws .ws-due-what strong {
  font-size: 14px;
  font-weight: 600;
  overflow-wrap: anywhere;
}
body.ws .ws-due-what .ws-num {
  font-size: 14px;
  color: var(--ink-muted);
}
/* Таблица по категории (на телефон – карти от същия DOM). */
body.ws .ws-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
}
body.ws .ws-table thead th {
  padding: 10px 12px;
  background: var(--cream);
  border-bottom: 1px solid var(--line);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  text-align: left;
  color: var(--ink-muted);
  white-space: nowrap;
}
body.ws .ws-table thead th:first-child {
  border-radius: var(--ws-radius-sm) 0 0 var(--ws-radius-sm);
}
body.ws .ws-table thead th:last-child {
  border-radius: 0 var(--ws-radius-sm) var(--ws-radius-sm) 0;
}
body.ws .ws-table .ws-num {
  text-align: right;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
body.ws .ws-table tbody th,
body.ws .ws-table tbody td,
body.ws #planner .ws-table tbody th {
  text-transform: none;
  letter-spacing: 0;
  padding: 10px 12px;
  border-bottom: 1px solid var(--line);
  vertical-align: top;
  font-weight: 400;
  text-align: left;
}
body.ws .ws-budget-table tbody td.ws-num {
  text-align: right;
  padding-top: 20px;
}
body.ws .ws-cat-row.is-open > * {
  border-bottom-color: transparent;
}
body.ws #planner .ws-cat-toggle {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 44px;
  margin: 0;
  padding: 0 4px;
  border: 0;
  border-radius: var(--ws-radius-sm);
  background: none;
  box-shadow: none;
  color: var(--ink);
  font: 600 15px/1.3 var(--font-body);
  text-align: left;
}
body.ws #planner .ws-cat-toggle:focus-visible {
  outline: none;
  box-shadow: var(--ws-focus);
}
@media (hover: hover) and (pointer: fine) {
  body.ws #planner .ws-cat-toggle:hover {
    background: var(--paper-sunk);
  }
}
body.ws .ws-cat-toggle .pl-cat-icon {
  width: 32px;
  height: 32px;
}
body.ws .ws-cat-toggle .pl-cat-icon svg {
  width: 17px;
  height: 17px;
}
body.ws .ws-cat-chev {
  width: 16px;
  height: 16px;
  flex: none;
  color: var(--ink-muted);
  transform: rotate(-90deg);
  transition: transform var(--ws-dur-2) var(--ws-ease);
}
body.ws .ws-cat-toggle[aria-expanded='true'] .ws-cat-chev {
  transform: none;
}
body.ws .ws-cat-name {
  min-width: 0;
  overflow-wrap: anywhere;
}
body.ws .ws-cat-meta {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 2px 4px 0 72px;
}
body.ws .ws-cat-bar {
  flex: 1 1 120px;
  min-width: 80px;
  max-width: 220px;
  height: 4px;
}
body.ws .ws-cat-bar.is-share .ws-progress-fill {
  background: var(--ws-accent-line);
}
body.ws .ws-cat-sub {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  color: var(--ink-muted);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
body.ws .ws-cat-row.is-over .ws-cat-sub {
  color: var(--danger);
  font-weight: 600;
}
body.ws .ws-cat-sub svg {
  width: 13px;
  height: 13px;
}
body.ws .ws-cat-mob {
  display: none;
}
body.ws .ws-cat-lines > td {
  padding: 0 12px 12px 56px;
  border-bottom: 1px solid var(--line);
}
body.ws .ws-lines {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}
body.ws .ws-line {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 4px 16px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: var(--ws-radius-sm);
  background: var(--paper);
}
body.ws .ws-line.is-pending {
  background: var(--cream);
}
body.ws .ws-line-main {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
body.ws .ws-line-main strong {
  font-size: 14px;
  font-weight: 600;
  overflow-wrap: anywhere;
}
body.ws .ws-line-main strong small {
  font-weight: 400;
  color: var(--ink-muted);
}
body.ws .ws-line-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 8px;
  font-size: 12px;
  color: var(--ink-muted);
}
body.ws .ws-line-num {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  font-size: 14px;
  font-weight: 600;
}
body.ws .ws-line-num small {
  font-size: 12px;
  font-weight: 400;
  color: var(--ink-muted);
  font-variant-numeric: tabular-nums;
}
body.ws .ws-line-act:empty {
  display: none;
}
/* Сгъваем раздел (<details>): „Разпредели бюджета“. */
body.ws #planner .ws-disclosure > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 44px;
  margin: -8px 0;
  list-style: none;
  cursor: pointer;
  border-radius: var(--ws-radius-sm);
}
body.ws .ws-disclosure > summary::-webkit-details-marker {
  display: none;
}
body.ws .ws-disclosure > summary:focus-visible {
  outline: none;
  box-shadow: var(--ws-focus);
}
body.ws #planner .ws-disclosure > summary h2 {
  margin: 0;
  font: 500 20px/1.3 var(--font-display);
}
body.ws .ws-disclosure-chev {
  width: 20px;
  height: 20px;
  color: var(--ink-muted);
  transform: rotate(-90deg);
  transition: transform var(--ws-dur-2) var(--ws-ease);
}
body.ws .ws-disclosure[open] .ws-disclosure-chev {
  transform: none;
}
body.ws .ws-disclosure[open] > summary {
  margin-bottom: 8px;
}
body.ws .ws-plan-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr));
  gap: 16px;
}
body.ws .ws-plan-foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 8px 12px;
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
}
body.ws .ws-plan-sum {
  flex: 1 1 260px;
  margin: 0;
  font-size: 14px;
  font-variant-numeric: tabular-nums;
  color: var(--ink-muted);
}
body.ws .ws-plan-sum.is-over {
  color: var(--danger);
  font-weight: 600;
}
@container pl (min-width: 900px) {
  body.ws #pl-body[data-tab='budget'] > .plb-cats {
    grid-column: 1 / span 8;
    grid-row: 2;
  }
  body.ws #pl-body[data-tab='budget']:has(> .ws-empty--section) > :is(.plb-cats, .plb-upcoming) {
    grid-row: 3;
  }
  body.ws #pl-body[data-tab='budget'] > .plb-upcoming {
    grid-column: 9 / -1;
    grid-row: 2;
    position: sticky;
    top: 24px;
  }
}
/* В тясна карта таблицата не събира 5 колони: „Планирано“ отпада (то е в реда под името: „48% от 5 000 €“). */
body.ws #planner .plb-cats {
  container: plbc / inline-size;
}
@container plbc (max-width: 819px) {
  body.ws .ws-budget-table :is(thead th:nth-child(2), .ws-cat-planned) {
    display: none;
  }
  body.ws .ws-cat-meta {
    margin-left: 4px;
  }
}
@media (max-width: 760px) {
  /* Таблицата като карти: ред 1 – име + договорено; ред 2 – лента и „96% от 5 000 €“; ред 3 – „Платено · Остава“. */
  body.ws .ws-budget-table thead {
    display: none;
  }
  body.ws .ws-budget-table,
  body.ws .ws-budget-table tbody {
    display: block;
  }
  body.ws .ws-budget-table tr.ws-cat-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0 8px;
    padding: 8px 0 12px;
    border-bottom: 1px solid var(--line);
  }
  body.ws .ws-budget-table tr.ws-cat-row.is-open {
    border-bottom: 0;
  }
  body.ws .ws-budget-table tr.ws-cat-row > * {
    padding: 0;
    border: 0;
  }
  body.ws .ws-budget-table tr.ws-cat-row > th {
    display: contents;
  }
  body.ws .ws-budget-table .ws-cat-toggle {
    grid-column: 1;
    grid-row: 1;
  }
  body.ws .ws-budget-table td.ws-cat-agreed {
    grid-column: 2;
    grid-row: 1;
    align-self: center;
    padding: 0;
    font-size: 16px;
    font-weight: 600;
  }
  body.ws .ws-budget-table :is(.ws-cat-planned, .ws-cat-paid, .ws-cat-left) {
    display: none;
  }
  body.ws .ws-cat-meta {
    grid-column: 1 / -1;
    margin: 6px 0 0 4px;
  }
  body.ws .ws-cat-bar {
    max-width: none;
  }
  body.ws .ws-cat-mob {
    display: block;
    grid-column: 1 / -1;
    margin: 4px 0 0 4px;
    font-size: 13px;
    color: var(--ink-muted);
    font-variant-numeric: tabular-nums;
  }
  body.ws .ws-budget-table tr.ws-cat-lines {
    display: block;
  }
  body.ws .ws-cat-lines > td {
    display: block;
    padding: 0 0 12px;
  }
  body.ws .ws-line {
    grid-template-columns: minmax(0, 1fr) auto;
  }
  body.ws .ws-line-act {
    grid-column: 1 / -1;
  }
  body.ws .ws-line-act .ws-btn {
    width: 100%;
  }
  body.ws .ws-plan-foot {
    position: sticky;
    bottom: calc(var(--ws-tabbar-h) + env(safe-area-inset-bottom));
    margin: 16px -16px -16px;
    padding: 12px 16px;
    background: var(--paper);
    border-radius: 0 0 var(--ws-radius-md) var(--ws-radius-md);
  }
  body.ws .ws-plan-foot .ws-btn {
    flex: 1 1 auto;
  }
}

/* ---------- Гости (docs/design/workspace/pages/guests.md) ---------- */
/* Видимост по ширина: на телефон някои действия са в „Още ⋯“. */
@media (max-width: 760px) {
  body.ws .ws-wide-only,
  body.ws #planner .ws-wide-only {
    display: none;
  }
}
@media (min-width: 761px) {
  body.ws .ws-phone-only,
  body.ws #planner .ws-phone-only {
    display: none;
  }
}
body.ws dialog.ws-dialog--wide {
  width: min(680px, calc(100vw - 32px));
}
@media (max-width: 760px) {
  body.ws dialog.ws-dialog--wide {
    width: 100%;
  }
}
/* Меню, което се отваря нагоре (в лентата за масови действия долу на телефон). */
body.ws .ws-menu--up {
  top: auto;
  bottom: calc(100% + 4px);
}
body.ws .plg-details-btn .ws-disclosure-chev {
  width: 14px;
  height: 14px;
}
body.ws .plg-details-btn[aria-expanded='true'] .ws-disclosure-chev {
  transform: none;
}
/* „Подробно“ под KPI картите (DESIGN-PASS-2 т. 4.1). */
body.ws #planner .ws-gstat-details {
  gap: 0;
  padding: 16px 20px;
}
body.ws #planner .ws-gstat-details[hidden] {
  display: none;
}
body.ws .ws-gstat-details dl {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 12px 24px;
  margin: 0;
}
body.ws .ws-gstat-details dt {
  font-size: 12px;
  color: var(--ink-muted);
}
body.ws .ws-gstat-details dd {
  margin: 2px 0 0;
  font-size: 15px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
body.ws .ws-gstat-details .pl-menus {
  margin: 12px 0 0;
  font-size: 14px;
}
/* ========== Гости v2 (docs/design/redesign/GUESTS-V2.md, одобрено 14.10.2026; корекции на собственика 14.10) ==========
   Един лепкав ред: статусите като филтър + търсене + „Филтри“ (без отделна карта); под него лентата от три части.
   При избрани гости на мястото на реда е масовата лента. Списъкът е една карта: заглавия на колоните (лепкави),
   „Бързо добавяне“ като първи ред, редове 56 px. На телефон (≤ 760 px) същият DOM става редове-карти 68–72 px.
   Анимират се само transform/opacity/цвят; всички :hover – зад (hover: hover) and (pointer: fine). */
/* Заглавната зона е в горната лента – празната клетка на мрежата не взема ред (без 24 px празно място отгоре). */
body.ws #pl-body[data-tab='guests'] > .ws-stop:has(> .ws-shead:only-child) {
  display: contents;
}
body.ws #planner .plg-main {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 0;
}
/* --- „Следваща стъпка“: тънък ред с „ד --- */
body.ws #pl-body > .plg-next {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) auto auto;
  align-items: center;
  column-gap: 12px;
  min-height: 52px;
  padding: 4px 4px 4px 12px;
  border: 1px solid var(--line);
  border-radius: var(--ws-radius-md);
  background: var(--paper);
  transition:
    opacity var(--ws-dur-2) var(--ws-ease),
    transform var(--ws-dur-2) var(--ws-ease);
}
body.ws #pl-body > .plg-next.is-out {
  opacity: 0;
  transform: translateY(-4px);
}
body.ws .plg-next-ico {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--ws-accent-soft);
  color: var(--ws-accent-ink);
}
body.ws .plg-next-ico svg {
  width: var(--ws-ico-sm);
  height: var(--ws-ico-sm);
  fill: none;
  stroke: currentColor;
  stroke-width: var(--ws-ico-stroke-sm);
  stroke-linecap: round;
  stroke-linejoin: round;
}
body.ws #pl-body > .plg-next .plg-next-t {
  max-width: none;
  margin: 0;
  overflow: hidden;
  font: 400 14px/20px var(--font-body);
  color: var(--ink-muted);
  white-space: nowrap;
  text-overflow: ellipsis;
}
body.ws .plg-next-t strong {
  font-weight: 600;
  color: var(--ink);
}
body.ws #planner .plg-next-act {
  min-height: var(--ws-ctl-h);
  padding: 0 8px;
}
body.ws .plg-next-chev {
  width: 14px;
  height: 14px;
  transform: rotate(-90deg);
}
body.ws #planner .plg-next-x {
  width: 40px;
  height: 40px;
  min-height: 40px;
}
body.ws #planner .plg-next-x svg {
  width: var(--ws-ico-sm);
  height: var(--ws-ico-sm);
}
@container pl (max-width: 959px) {
  body.ws .plg-next-t span {
    display: none;
  }
}

/* --- Лентата: статуси · търсене · „Филтри“ (лепкава) --- */
body.ws #planner .plg-bar {
  position: sticky;
  top: var(--plg-top, 0px);
  z-index: 18;
  margin: -8px 0 0;
  padding: 8px 0 0;
  background: var(--bg);
}
body.ws .plg-strip {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 48px;
}
body.ws #planner .plg-main.has-selection .plg-strip {
  display: none;
}
body.ws .plg-seg {
  display: flex;
  flex: 0 1 auto;
  gap: 4px;
  min-width: 0;
  padding: 4px;
  border-radius: var(--ws-radius-pill);
  background: var(--paper-sunk);
}
body.ws #planner .plg-seg-b {
  display: inline-flex;
  flex: none;
  align-items: center;
  gap: 8px;
  height: 36px;
  min-height: 36px;
  margin: 0;
  padding: 0 14px;
  border: 1px solid transparent;
  border-radius: var(--ws-radius-pill);
  background: transparent;
  box-shadow: none;
  color: var(--ink-muted);
  font: 500 13px/1 var(--font-body);
  white-space: nowrap;
  -webkit-user-select: none;
  user-select: none;
  transition:
    background-color var(--ws-dur-1) ease,
    color var(--ws-dur-1) ease,
    box-shadow var(--ws-dur-2) var(--ws-ease);
}
body.ws .plg-seg-n {
  font: 500 17px/1 var(--font-display);
  color: var(--ink);
  font-variant-numeric: tabular-nums lining-nums;
}
body.ws #planner .plg-seg-b[aria-pressed='true'] {
  border-color: var(--line);
  background: var(--paper);
  color: var(--ink);
  font-weight: 600;
  box-shadow: 0 1px 2px rgba(41, 39, 37, 0.06);
}
body.ws #planner .plg-seg-b:active {
  transform: scale(0.98);
}
body.ws #planner .plg-seg-b:focus-visible {
  outline: none;
  box-shadow: var(--ws-focus);
}
@media (hover: hover) and (pointer: fine) {
  body.ws #planner .plg-seg-b:not([aria-pressed='true']):hover {
    background: rgba(255, 255, 255, 0.6);
    color: var(--ink);
  }
}
body.ws .plg-tools {
  display: flex;
  flex: 0 1 auto;
  align-items: center;
  gap: 8px;
  min-width: 0;
  margin-left: auto;
}
body.ws .plg-find {
  display: flex;
  align-items: center;
  min-width: 0;
}
body.ws #planner .plg-find-btn {
  display: none;
  width: var(--ws-ctl-h);
  height: var(--ws-ctl-h);
  min-height: var(--ws-ctl-h);
}
body.ws .plg-search {
  position: relative;
  display: flex;
  align-items: center;
  width: 240px;
  min-width: 0;
  margin: 0;
}
body.ws .plg-search > .ws-ico {
  position: absolute;
  left: 12px;
  width: var(--ws-ico-sm);
  height: var(--ws-ico-sm);
  color: var(--ink-muted);
  pointer-events: none;
}
body.ws #planner .plg-search input {
  width: 100%;
  height: var(--ws-ctl-h);
  min-height: var(--ws-ctl-h);
  padding: 0 36px 0 36px;
  border: 1px solid var(--line);
  border-radius: var(--ws-radius-sm);
  background: var(--paper);
  font: 400 14px/1 var(--font-body);
  color: var(--ink);
  transition: border-color var(--ws-dur-1) ease;
}
body.ws #planner .plg-search input::placeholder {
  color: var(--ink-muted);
}
body.ws #planner .plg-search input::-webkit-search-cancel-button {
  display: none;
}
body.ws #planner .plg-search input:focus-visible {
  outline: none;
  border-color: var(--ws-accent);
  box-shadow: 0 0 0 3px var(--ws-accent-wash);
}
@media (hover: hover) and (pointer: fine) {
  body.ws #planner .plg-search input:hover {
    border-color: var(--line-strong);
  }
}
body.ws #planner .plg-q-clear {
  position: absolute;
  right: 2px;
  width: 36px;
  height: 36px;
  min-height: 36px;
}
body.ws #planner .plg-q-clear svg {
  width: var(--ws-ico-sm);
  height: var(--ws-ico-sm);
}
body.ws .plg-filters-wrap {
  position: relative;
}
body.ws #planner .plg-filters-btn {
  position: relative;
  min-height: var(--ws-ctl-h);
  padding: 0 14px;
  font-weight: 500;
}
body.ws #planner .plg-filters-btn.is-on {
  border-color: var(--ws-accent-line);
  background: var(--ws-accent-wash);
}
body.ws #planner .plg-filters-btn[aria-expanded='true'] {
  border-color: var(--ws-accent-ink);
}
body.ws .plg-filters-n {
  display: inline-grid;
  place-items: center;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 9px;
  background: var(--ink);
  color: #fff;
  font: 600 11px/1 var(--font-body);
}
body.ws #planner .plg-filter-panel {
  left: auto;
  right: 0;
  transform-origin: top right;
}
body.ws .plg-filter-fields {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 12px 16px;
}
body.ws .plg-filter-foot {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  margin-top: 16px;
  padding-top: 12px;
  border-top: 1px solid var(--ws-divider);
}
body.ws .plg-filter-sheet .plg-filter-fields {
  grid-template-columns: minmax(0, 1fr);
}
body.ws .ws-popover {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  z-index: 30;
  width: min(520px, calc(100vw - 48px));
  padding: 16px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--ws-radius-md);
  box-shadow: var(--ws-shadow-2);
  animation: ws-pop 160ms var(--ws-ease);
}
body.ws .ws-popover[hidden] {
  display: none;
}
/* Лентата от три части. */
body.ws .plg-meter {
  display: flex;
  gap: 2px;
  height: var(--ws-bar-h);
  margin-top: 8px;
  overflow: hidden;
  border-radius: var(--ws-bar-h);
}
body.ws .plg-meter i {
  display: block;
  flex: 0 1 0;
  min-width: 0;
  transition: flex-grow var(--ws-dur-4) var(--ws-ease);
}
body.ws .plg-meter .is-yes {
  background: var(--ws-status-yes);
}
body.ws .plg-meter .is-wait {
  background: var(--ws-status-wait-bar);
}
body.ws .plg-meter .is-no {
  background: var(--ws-status-no);
}
/* Търсенето като лупа: по-тясно съдържание (таблет, свито меню) и телефон – полето се разгъва на мястото на статусите. */
@container pl (max-width: 859px) {
  body.ws #planner .plg-find-btn {
    display: inline-grid;
  }
  body.ws .plg-search {
    display: none;
  }
  body.ws .plg-bar.is-finding .plg-seg,
  body.ws #planner .plg-bar.is-finding .plg-find-btn {
    display: none;
  }
  body.ws .plg-bar.is-finding :is(.plg-tools, .plg-find, .plg-search) {
    display: flex;
    flex: 1 1 auto;
    width: auto;
  }
  body.ws .plg-bar.is-finding .plg-search {
    animation: plg-find-in var(--ws-dur-2) var(--ws-ease);
  }
}
@keyframes plg-find-in {
  from {
    opacity: 0;
    transform: translateX(8px);
  }
}
/* Масовите действия на мястото на реда (компютър). */
body.ws .plg-bulk-wrap:not(:has(> :not([hidden]))) {
  display: none;
}
body.ws .ws-bulkbar {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 8px;
  min-height: 48px;
  padding: 4px 8px 4px 4px;
  border: 1px solid var(--ws-accent-line);
  border-radius: var(--ws-radius-md);
  background: var(--ws-accent-wash);
  animation: ws-pop 160ms var(--ws-ease);
}
body.ws .ws-bulkbar[hidden] {
  display: none;
}
body.ws #planner .ws-bulkbar > .ws-icon-btn {
  width: 40px;
  height: 40px;
  min-height: 40px;
}
body.ws .ws-bulkbar-count {
  display: flex;
  flex: none;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 12px;
  margin: 0 8px 0 0;
  font-size: 14px;
  white-space: nowrap;
}
body.ws .ws-bulkbar-count span {
  font-size: 13px;
  color: var(--ink-muted);
}
body.ws .ws-bulkbar-actions {
  display: flex;
  flex: 1 1 auto;
  flex-wrap: nowrap;
  min-width: 0;
  align-items: center;
  gap: 8px;
}
body.ws .ws-bulkbar-wide {
  display: contents;
}
body.ws .plg-bl-short {
  display: none;
}
body.ws .ws-bulkbar-narrow {
  display: none;
}
body.ws #planner .ws-bulkbar .ws-btn--danger {
  margin-left: auto;
}
body.ws .plg-bulk-wrap .plg-trial-count {
  margin: 8px 4px 0;
}
body.ws .ws-menu-sep {
  display: block;
  height: 1px;
  margin: 6px 8px;
  background: var(--ws-divider);
}
body.ws .ws-menu [role='menuitem'] > .ws-ico {
  width: var(--ws-ico-sm);
  height: var(--ws-ico-sm);
  color: var(--ink-muted);
}
body.ws .ws-menu [role='menuitem'].is-danger,
body.ws .ws-menu [role='menuitem'].is-danger > .ws-ico {
  color: var(--danger);
}
body.ws .ws-menu .plg-mi-ok {
  margin-left: auto;
  color: var(--ink);
}
body.ws .ws-menu [aria-current='true'] {
  font-weight: 600;
}
body.ws .plg-active-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
}
body.ws #planner .plg-filter-chip {
  gap: 6px;
  padding-right: 8px;
  border-color: var(--ws-accent-line);
  background: var(--ws-accent-wash);
  color: var(--ws-accent-ink);
}
body.ws .plg-filter-chip svg {
  width: 12px;
  height: 12px;
}
body.ws .plg-lang-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
}

/* --- Картата на списъка --- */
body.ws #planner .plg-table-card {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: var(--ws-radius-md);
  background: var(--paper);
}
body.ws #planner .plg-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
  font-size: 14px;
}
body.ws .plg-w-ck {
  width: 48px;
}
body.ws .plg-w-ppl {
  width: 72px;
}
body.ws .plg-w-rs {
  width: 156px;
}
body.ws .plg-w-iv {
  width: 184px;
}
body.ws .plg-w-tb {
  width: 72px;
}
body.ws .plg-w-mo {
  width: 92px;
}
body.ws #planner .plg-table thead th {
  position: sticky;
  top: calc(var(--plg-top, 0px) + var(--plg-bar-h, 60px));
  z-index: 5;
  height: 40px;
  padding: 0 12px;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  background: var(--cream);
  font: 600 11px/16px var(--font-body);
  letter-spacing: 0.12em;
}
body.ws #planner .plg-table thead th:first-child {
  border-top-left-radius: calc(var(--ws-radius-md) - 1px);
}
body.ws #planner .plg-table thead th:last-child {
  border-top-right-radius: calc(var(--ws-radius-md) - 1px);
}
body.ws #planner .plg-table thead th[aria-sort] .ws-sort {
  color: var(--ink);
}
body.ws #planner .plg-table :is(th, td).ws-check-cell {
  padding: 0 0 0 12px;
}
body.ws #planner .plg-table tbody :is(th, td) {
  height: var(--ws-row-h);
  padding: 0 12px;
  border-bottom: 1px solid var(--ws-divider);
  vertical-align: middle;
  font-weight: 400;
}
body.ws #planner .plg-table .ws-num {
  text-align: right;
}
body.ws #planner tr.pl-guest-row {
  display: table-row;
  padding: 0;
  border: 0;
  cursor: pointer;
  transition: background-color var(--ws-dur-1) ease;
}
body.ws #planner .plg-table tr.pl-guest-row > * {
  transition: background-color var(--ws-dur-1) ease;
}
/* Фонът на реда е една променлива (--plg-row-bg) – цветът по отговор, избраният, посочването и маркирането се смесват
   от нея, без да се скриват един друг. Цвят по отговор (корекция на собственика 14.10, същите три цвята като точките):
   потвърдил – ~7 % от зеленото върху хартията (#f1f6f5; --ink-muted 5.2:1, --ws-accent-ink 6.4:1 – AA); отказал – ~6 %
   от --rose (#faf2f3), текстът – с нормален контраст; чака – неутрален. BIZ-40 (EVENT-STYLE.md §10): цветната черта 3 px
   вляво отпадна – impeccable craft-floor забранява цветна лява рамка > 1 px; смисълът е в точката и текста на отговора. */
body.ws #planner .plg-table tr.pl-guest-row {
  --plg-row-bg: var(--paper);
}
body.ws #planner .plg-table tr.plg-person-row {
  --plg-row-bg: var(--cream);
}
body.ws #planner .plg-table tr.plg-st-yes {
  --plg-row-bg: color-mix(in srgb, var(--ws-status-yes) 7%, var(--paper));
}
body.ws #planner .plg-table tr.plg-st-no {
  --plg-row-bg: color-mix(in srgb, var(--ws-status-no) 6%, var(--paper));
}
body.ws #planner .plg-table tr.pl-guest-row.is-selected {
  --plg-row-bg: var(--ws-accent-wash);
}
body.ws #planner .plg-table tr.pl-guest-row > * {
  background: var(--plg-row-bg);
}
body.ws .ws-rdot--no + .ws-rsvp-l,
body.ws .ws-rdot--no ~ .ws-rsvp-s {
  color: var(--ws-status-no);
}
/* Посочване (мишка) – едва забележимо; маркиран ред (клик, само един) – съвсем малко по-тъмен (~5 % мастило), без рамка
   и без промяна на размерите; цветовете по отговор остават видими. */
@media (hover: hover) and (pointer: fine) {
  body.ws #planner .plg-table tr.pl-guest-row:not(.is-marked):hover > * {
    background: color-mix(in oklab, var(--plg-row-bg) 97.5%, var(--ink));
  }
}
body.ws #planner .plg-table tr.pl-guest-row.is-marked > * {
  background: color-mix(in oklab, var(--plg-row-bg) 95%, var(--ink));
}
@media (forced-colors: active) {
  body.ws #planner .plg-table tr.is-marked {
    outline: 2px solid Highlight;
    outline-offset: -2px;
  }
}
body.ws .plg-act {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 4px;
}
body.ws #planner .plg-edit-btn {
  width: 36px;
  height: 36px;
  min-height: 36px;
  color: var(--ink-muted);
}
body.ws #planner .plg-edit-btn svg {
  width: var(--ws-ico-sm);
  height: var(--ws-ico-sm);
  stroke-width: var(--ws-ico-stroke-sm);
}
body.ws #planner .plg-table tr.plg-row-new > * {
  animation: plg-row-new-v2 1600ms var(--ws-ease) both;
}
@keyframes plg-row-new-v2 {
  0%,
  35% {
    background: var(--ws-accent-soft);
  }
  100% {
    background: transparent;
  }
}
/* Името води; подредът „Булката · Приятели“, „+1 човек ▾“, етикетите. */
body.ws #planner .plg-table .plg-c-name {
  min-width: 0;
  overflow: hidden;
}
body.ws #planner .plg-table .pl-guest-name {
  display: block;
  max-width: 100%;
  min-height: 0;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
  text-align: left;
  font: 600 15px/20px var(--font-body);
  color: var(--ink);
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
body.ws #planner .plg-table .pl-guest-name strong {
  font: inherit;
}
body.ws #planner .plg-table .pl-guest-name:focus-visible {
  outline: none;
  box-shadow: none;
  text-decoration: underline;
  text-decoration-color: var(--ws-accent);
  text-decoration-thickness: 2px;
  text-underline-offset: 4px;
}
body.ws .plg-meta {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  margin-top: 2px;
  font: 400 13px/18px var(--font-body);
  color: var(--ink-muted);
  white-space: nowrap;
}
body.ws .plg-meta-t {
  min-width: 0;
  overflow: hidden;
  font: inherit;
  text-overflow: ellipsis;
}
body.ws #planner .plg-party-btn {
  display: inline-flex;
  flex: none;
  align-items: center;
  gap: 2px;
  height: 22px;
  min-height: 22px;
  margin: -2px 0;
  padding: 0 6px 0 8px;
  border: 0;
  border-radius: var(--ws-radius-pill);
  background: transparent;
  box-shadow: none;
  color: var(--ws-accent-ink);
  font: 600 12px/1 var(--font-body);
}
@media (hover: hover) and (pointer: fine) {
  body.ws #planner .plg-party-btn:hover {
    background: var(--ws-accent-wash);
  }
}
body.ws .plg-party-chev {
  width: 14px;
  height: 14px;
  transform: rotate(-90deg);
  transition: transform var(--ws-dur-2) var(--ws-ease);
}
body.ws .plg-party-btn[aria-expanded='true'] .plg-party-chev {
  transform: none;
}
body.ws .plg-tag {
  display: inline-flex;
  flex: none;
  align-items: center;
  height: 20px;
  padding: 0 8px;
  border-radius: var(--ws-radius-pill);
  background: var(--paper-sunk);
  color: var(--ink-muted);
  font: 600 11px/1 var(--font-body);
}
body.ws .plg-tag--warn {
  background: var(--blush);
  color: var(--ink-on-blush);
}
body.ws #planner .plg-table mark {
  border-radius: 2px;
  background: var(--ws-accent-wash);
  box-shadow: inset 0 -2px 0 var(--ws-accent-line);
  color: inherit;
}
/* Хора. */
body.ws #planner .plg-table tbody .plg-c-people {
  font: 500 15px/20px var(--font-body);
  font-variant-numeric: tabular-nums;
}
body.ws .plg-c-people small {
  display: block;
  font: 400 12px/16px var(--font-body);
  color: var(--ink-muted);
}
body.ws .plg-ppl-ico {
  display: none;
}
body.ws .plg-ppl-ico svg {
  width: 14px;
  height: 14px;
}
/* Отговор: точка + текст (+ шеврон при посочване). */
body.ws .ws-rsvp {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font: 500 13px/1 var(--font-body);
  color: var(--ink);
  white-space: nowrap;
}
body.ws .ws-rsvp-s {
  display: none;
}
body.ws .plg-chip-kind {
  color: var(--ink-muted);
  font-style: italic;
}
body.ws .ws-rdot {
  display: inline-block;
  flex: none;
  width: 8px;
  height: 8px;
  border-radius: 50%;
}
body.ws .ws-rdot--yes {
  background: var(--ws-status-yes);
}
body.ws .ws-rdot--pending {
  box-shadow: inset 0 0 0 1.5px var(--ws-status-wait);
}
body.ws .ws-rdot--no {
  height: 2px;
  border-radius: 1px;
  background: var(--ws-status-no);
}
body.ws #planner .plg-status-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  height: 32px;
  min-height: 32px;
  margin: 0 0 0 -10px;
  padding: 0 6px 0 10px;
  border: 0;
  border-radius: var(--ws-radius-pill);
  background: transparent;
  box-shadow: none;
}
body.ws #planner .plg-status-btn:focus-visible {
  outline: none;
  box-shadow: var(--ws-focus);
}
body.ws .plg-status-chev {
  width: 14px;
  height: 14px;
  color: var(--ink-muted);
  opacity: 0;
  transition: opacity var(--ws-dur-1) ease;
}
body.ws .plg-status-btn:is(:focus-visible, [aria-expanded='true']) .plg-status-chev {
  opacity: 1;
}
@media (pointer: coarse) {
  body.ws .plg-status-chev {
    opacity: 1;
  }
}
@media (hover: hover) and (pointer: fine) {
  body.ws #planner .plg-status-btn:hover {
    background: var(--paper-sunk);
  }
  body.ws #planner tr.pl-guest-row:hover .plg-status-chev {
    opacity: 1;
  }
}
/* Покана: иконка + кратък статус; неизпратената – „Покани“ в акцентен цвят. */
body.ws #planner .plg-inv {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  max-width: 100%;
  height: 32px;
  min-height: 32px;
  margin: 0 0 0 -10px;
  padding: 0 10px;
  border: 0;
  border-radius: var(--ws-radius-pill);
  background: transparent;
  box-shadow: none;
  font: 400 13px/1 var(--font-body);
  color: var(--ink-muted);
  white-space: nowrap;
}
body.ws .plg-inv .ws-ico {
  width: var(--ws-ico-sm);
  height: var(--ws-ico-sm);
  flex: none;
  stroke-width: var(--ws-ico-stroke-sm);
}
body.ws .plg-inv-l {
  overflow: hidden;
  text-overflow: ellipsis;
}
body.ws #planner .plg-inv--none {
  color: var(--ws-accent-ink);
  font-weight: 600;
}
body.ws #planner .plg-inv--opened,
body.ws #planner .plg-inv--responded {
  color: var(--ink);
}
body.ws .plg-inv--opened .ws-ico {
  color: var(--ws-accent);
}
body.ws .plg-inv--responded .ws-ico {
  color: var(--ws-status-yes);
}
body.ws .plg-inv--host {
  margin: 0;
  padding: 0;
  font-style: italic;
}
body.ws #planner .plg-inv:focus-visible {
  outline: none;
  box-shadow: var(--ws-focus);
}
@media (hover: hover) and (pointer: fine) {
  body.ws #planner button.plg-inv:hover {
    background: var(--paper-sunk);
  }
  body.ws #planner button.plg-inv--none:hover {
    background: var(--ws-accent-wash);
  }
}
/* Маса: номер в Lora в кръг; пунктирен кръг – потвърден без маса. */
body.ws .plg-tbl {
  display: inline-grid;
  place-items: center;
  width: 26px;
  height: 26px;
  border: 1px solid var(--ws-accent-line);
  border-radius: 50%;
  background: var(--cream);
  font: 500 13px/1 var(--font-display);
  color: var(--ink);
}
body.ws .plg-tbl--none {
  border: 1px dashed var(--line-strong);
  background: transparent;
}
/* „⋯“ на реда. */
body.ws #planner .plg-more-btn {
  width: 36px;
  height: 36px;
  min-height: 36px;
  opacity: 0.7;
  transition:
    opacity var(--ws-dur-1) ease,
    background-color var(--ws-dur-1) ease;
}
body.ws #planner .plg-more-btn:is(:focus-visible, [aria-expanded='true']) {
  opacity: 1;
}
@media (hover: hover) and (pointer: fine) {
  body.ws #planner tr.pl-guest-row:hover .plg-more-btn {
    opacity: 1;
  }
}
body.ws .plg-c-act .ws-menu {
  min-width: 232px;
  text-align: left;
}
body.ws .plg-status-wrap .ws-menu {
  right: auto;
  left: -10px;
  min-width: 200px;
}
/* Хората към госта: подред 40 px на крем. */
body.ws #planner .plg-table tr.plg-person-row > * {
  height: var(--ws-subrow-h);
  font-size: 13px;
}
body.ws #planner .plg-table tr.plg-person-row .plg-c-name {
  display: table-cell;
  padding-left: 32px;
}
body.ws #planner .plg-table tr.plg-person-row .pl-guest-name {
  display: inline;
  font: 500 13px/18px var(--font-body);
}
body.ws #planner .plg-table tr.plg-person-row .plg-meta {
  display: inline;
  margin-left: 10px;
}
/* Групи. */
body.ws #planner .plg-table tr.plg-gh > th {
  height: 48px;
  padding: 0 12px;
  border-bottom: 1px solid var(--line);
  background: var(--paper);
}
body.ws #planner tbody.plg-grp + tbody.plg-grp tr.plg-gh > th {
  border-top: 8px solid var(--bg);
}
body.ws #planner .plg-gh-b {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 44px;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  box-shadow: none;
  text-align: left;
}
body.ws .plg-gh-t {
  font: 500 16px/1.2 var(--font-display);
  color: var(--ink);
}
body.ws .plg-gh-m {
  font: 400 13px/1 var(--font-body);
  color: var(--ink-muted);
  font-variant-numeric: tabular-nums;
}
body.ws .plg-gh-chev {
  width: 16px;
  height: 16px;
  margin-left: auto;
  color: var(--ink-muted);
  transform: rotate(-90deg);
  transition: transform var(--ws-dur-2) var(--ws-ease);
}
body.ws .plg-gh-b[aria-expanded='true'] .plg-gh-chev {
  transform: none;
}
body.ws #planner .plg-gh-b:focus-visible {
  outline: none;
  box-shadow: var(--ws-focus);
}
/* „Бързо добавяне“ – първият ред на списъка. */
body.ws #planner .plg-table tr.plg-qa > td {
  height: auto;
  min-height: var(--ws-row-h);
  padding: 8px 12px;
  border-bottom: 1px solid var(--line);
  background: var(--paper);
  cursor: auto;
}
body.ws .plg-qa-f {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  min-height: 40px;
}
body.ws .plg-qa-plus {
  display: grid;
  flex: none;
  place-items: center;
  width: 28px;
  height: 28px;
  border: 1px dashed var(--ws-accent-line);
  border-radius: 50%;
  color: var(--ws-accent-ink);
  transition:
    background-color var(--ws-dur-1) ease,
    border-color var(--ws-dur-1) ease;
}
body.ws .plg-qa-plus svg {
  width: var(--ws-ico-sm);
  height: var(--ws-ico-sm);
}
body.ws .plg-qa-f:focus-within .plg-qa-plus {
  border-style: solid;
  border-color: var(--ws-accent);
  background: var(--ws-accent-wash);
}
body.ws #planner .plg-qa-in {
  flex: 1 1 220px;
  min-width: 180px;
  height: 40px;
  min-height: 40px;
  padding: 0 4px;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  font: 500 15px/1 var(--font-body);
  color: var(--ink);
}
body.ws #planner .plg-qa-in::placeholder {
  color: var(--ink-muted);
  font-weight: 400;
}
body.ws #planner .plg-qa-in:focus-visible {
  outline: none;
  box-shadow: inset 0 -2px 0 var(--ws-accent-line);
}
body.ws #planner .plg-qa-in[aria-invalid='true'] {
  box-shadow: inset 0 -2px 0 var(--danger);
}
body.ws .plg-qa-x {
  position: absolute;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(2px);
  transition:
    opacity var(--ws-dur-2) var(--ws-ease),
    transform var(--ws-dur-2) var(--ws-ease),
    visibility 0s linear var(--ws-dur-2);
}
body.ws .plg-qa.is-on .plg-qa-x {
  position: static;
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: none;
  transition-delay: 0s;
}
body.ws #planner .plg-qa .ws-segmented {
  gap: 2px;
  padding: 2px;
  border: 0;
}
body.ws #planner .plg-qa .ws-segmented button {
  min-height: 32px;
  padding: 0 12px;
  font-weight: 500;
}
body.ws #planner .plg-qa .ws-segmented button[aria-pressed='true'] {
  border-color: var(--line);
  color: var(--ink);
  font-weight: 600;
}
body.ws #planner .plg-qa .ws-stepper {
  min-height: 36px;
  height: 36px;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: var(--ws-radius-pill);
}
body.ws #planner .plg-qa .ws-stepper .ws-icon-btn {
  width: 32px;
  height: 34px;
  min-height: 34px;
}
body.ws #planner .plg-qa .ws-stepper .ws-icon-btn svg {
  width: var(--ws-ico-sm);
  height: var(--ws-ico-sm);
}
body.ws #planner .plg-qa .ws-stepper .ws-field-control {
  width: 36px;
  min-height: 32px;
  height: 32px;
  padding: 0;
  border: 0;
  background: none;
  text-align: center;
  font: 500 13px/1 var(--font-body);
}
body.ws #planner .plg-qa .plg-qa-menu {
  width: auto;
  min-height: 36px;
  height: 36px;
  padding: 0 28px 0 12px;
  border-radius: var(--ws-radius-sm);
  font-size: 13px;
}
body.ws .plg-qa-actions {
  display: flex;
  align-items: center;
  gap: 12px;
}
/* Степер (общ за реда и листа). */
body.ws .ws-stepper {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-height: 44px;
  padding: 0 2px;
  border: 1px solid var(--line-strong);
  border-radius: var(--ws-radius-sm);
  background: var(--paper);
}
body.ws #planner .ws-stepper .ws-field-control,
body.ws dialog .ws-stepper .ws-field-control {
  width: 48px;
  min-height: 40px;
  padding: 0;
  border: 0;
  text-align: center;
  font-variant-numeric: tabular-nums;
  -moz-appearance: textfield;
}
body.ws .ws-stepper input::-webkit-outer-spin-button,
body.ws .ws-stepper input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
body.ws .ws-field-control[aria-invalid='true'] {
  border-color: var(--danger);
}
/* Празно при търсене / филтър – с път напред. */
body.ws #planner .plg-table tr.plg-empty-f > td {
  height: auto;
  padding: 40px 16px;
  text-align: center;
  cursor: auto;
}
body.ws .plg-empty-f p {
  margin: 0 0 16px;
  font-size: 15px;
  color: var(--ink);
}
body.ws .plg-empty-acts {
  display: inline-flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
}
body.ws .plg-pager {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 16px;
  min-height: 48px;
  padding: 4px 16px;
}
body.ws .plg-pager p {
  margin: 0;
  font-size: 13px;
  color: var(--ink-muted);
  font-variant-numeric: tabular-nums;
}
/* Подредба по колона. */
body.ws #planner .ws-sort {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-height: 32px;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  box-shadow: none;
  color: inherit;
  font: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
}
body.ws #planner .ws-sort:focus-visible {
  outline: none;
  box-shadow: var(--ws-focus);
}
body.ws .ws-sort-ico {
  width: 12px;
  height: 12px;
  opacity: 0;
  transition: opacity var(--ws-dur-1) ease;
}
body.ws .ws-sort-ico.is-asc {
  opacity: 1;
  transform: rotate(180deg);
}
body.ws .ws-sort-ico.is-desc {
  opacity: 1;
}
/* „Импорт“: шаблонът за попълване (основен бутон) и „или .csv/.txt“ над избора на файл. */
body.ws .plg-imp-sample {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 16px;
  margin: 12px 0 16px;
  padding: 16px;
  border-radius: var(--ws-radius-md);
  background: var(--cream);
  border: 1px solid var(--line);
}
body.ws .plg-imp-sample p {
  flex: 1 1 100%;
  margin: 0;
  font-size: 13px;
}
body.ws .plg-imp-sample .ws-btn svg {
  width: 16px;
  height: 16px;
}
/* „Импорт“ – три стъпки, шаблонът най-отгоре. */
body.ws .plg-imp-steps {
  display: grid;
  gap: 16px;
  margin: 8px 0 16px;
  padding: 0;
  list-style: none;
}
body.ws .plg-imp-steps > li {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
}
body.ws .plg-imp-n {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border: 1px solid var(--ws-accent-line);
  border-radius: 50%;
  background: var(--cream);
  font: 500 15px/1 var(--font-display);
  color: var(--ws-accent-ink);
}
body.ws .plg-imp-steps strong {
  display: block;
  margin: 5px 0 4px;
  font-weight: 600;
}
body.ws .plg-imp-steps p {
  margin: 0 0 8px;
  font-size: 13px;
}
body.ws .plg-imp-dl {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 16px;
}
body.ws .plg-imp-dl .ws-btn svg,
body.ws .plg-tpl-link svg,
body.ws .ws-empty-actions .ws-btn svg {
  width: var(--ws-ico-sm);
  height: var(--ws-ico-sm);
  stroke-width: var(--ws-ico-stroke-sm);
}
body.ws .plg-tpl-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
@media (min-width: 761px) {
  body.ws #planner .ws-menu [role='menuitem'].ws-phone-only {
    display: none;
  }
}
body.ws .ws-menu a[role='menuitem'] {
  color: var(--ink);
  text-decoration: none;
}
/* Листове на телефон: „Нов гост“, редът („⋯“), филтрите. */
body.ws .plg-qs-sub {
  margin: 0 0 16px;
  font-size: 13px;
  color: var(--ink-muted);
}
body.ws .plg-qs .plg-qs-field {
  display: grid;
  gap: 6px;
  margin: 0 0 16px;
}
body.ws .plg-qs .ws-segmented {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(0, 1fr);
  width: 100%;
  border-radius: var(--ws-radius-md);
}
body.ws .plg-qs .ws-segmented button {
  border-radius: var(--ws-radius-sm);
}
body.ws .plg-qs .ws-stepper {
  justify-self: start;
  min-height: 48px;
}
body.ws .plg-qs .ws-stepper .ws-icon-btn {
  width: 48px;
  height: 46px;
}
body.ws .plg-qs .plg-qa-actions {
  display: grid;
  gap: 8px;
}
body.ws .plg-qs .plg-qa-actions .ws-btn {
  min-height: 48px;
}
body.ws .plg-sheet .ws-segmented {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(0, 1fr);
  width: 100%;
  margin: 0 0 12px;
  border-radius: var(--ws-radius-md);
}
body.ws .plg-sheet .ws-segmented button {
  border-radius: var(--ws-radius-sm);
}
body.ws dialog .plg-sheet-mi {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-height: 48px;
  margin: 0;
  padding: 0 8px;
  border: 0;
  border-radius: var(--ws-radius-sm);
  background: none;
  box-shadow: none;
  text-align: left;
  font: 500 15px/1.3 var(--font-body);
  color: var(--ink);
}
body.ws dialog .plg-sheet-mi .ws-ico {
  width: var(--ws-ico-md);
  height: var(--ws-ico-md);
  color: var(--ink-muted);
}
body.ws dialog .plg-sheet-mi.is-danger,
body.ws dialog .plg-sheet-mi.is-danger .ws-ico {
  color: var(--danger);
}
body.ws dialog .plg-sheet-mi:active {
  background: var(--paper-sunk);
}

/* Масовата лента по-тясно: вторичните действия – в „Още“ (един ред, без да се пренася). */
@container pl (max-width: 1099px) {
  body.ws .ws-bulkbar-wide {
    display: none;
  }
  body.ws .ws-bulkbar-narrow {
    display: inline-flex;
    margin-left: auto;
  }
  body.ws .ws-bulkbar .ws-menu--up {
    top: calc(100% + 4px);
    bottom: auto;
  }
}
/* --- По-тясно съдържание (таблет / свито меню): поканата – само иконка (текстът за екранните четци) --- */
@container pl (max-width: 959px) {
  body.ws .plg-w-iv {
    width: 88px;
  }
  body.ws .plg-w-rs {
    width: 148px;
  }
  body.ws .plg-w-ppl,
  body.ws .plg-w-tb {
    width: 64px;
  }
  body.ws .plg-w-mo {
    width: 88px;
  }
  body.ws .plg-inv-l {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
  }
  body.ws #planner .plg-inv {
    justify-content: center;
    width: 36px;
    margin-left: -4px;
    padding: 0;
  }
}

/* --- Телефон: един лепкав ред, редове-карти, лист „Нов гост“, масова лента долу, „+ Гост“ --- */
@media (max-width: 760px) {
  body.ws #planner .plg-bar {
    margin: -8px -16px 0;
    padding: 8px 8px 0 16px;
  }
  body.ws .plg-strip {
    gap: 4px;
    min-height: 52px;
  }
  body.ws #planner .plg-main.has-selection .plg-strip {
    display: flex;
  }
  body.ws .plg-seg {
    flex: 1 1 auto;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scrollbar-width: none;
    padding: 2px;
  }
  body.ws .plg-seg::-webkit-scrollbar {
    display: none;
  }
  /* Подсказка, че сегментите продължават вдясно (превъртат се хоризонтално). */
  body.ws .plg-seg:not(.is-end) {
    -webkit-mask-image: linear-gradient(to right, black calc(100% - 28px), transparent);
    mask-image: linear-gradient(to right, black calc(100% - 28px), transparent);
  }
  body.ws #planner .plg-seg-b {
    height: 40px;
    min-height: 40px;
    padding: 0 12px;
    gap: 6px;
  }
  body.ws #planner .plg-find-btn {
    display: inline-grid;
    width: 44px;
    height: 44px;
    min-height: 44px;
  }
  body.ws .plg-search {
    display: none;
  }
  body.ws .plg-tools {
    flex: none;
    gap: 0;
  }
  body.ws .plg-bar.is-finding .plg-seg,
  body.ws #planner .plg-bar.is-finding .plg-find-btn {
    display: none;
  }
  body.ws .plg-bar.is-finding :is(.plg-tools, .plg-find, .plg-search) {
    display: flex;
    flex: 1 1 auto;
    width: auto;
  }
  body.ws .plg-bar.is-finding .plg-search {
    animation: plg-find-in var(--ws-dur-2) var(--ws-ease);
  }
  body.ws #planner .plg-search input {
    height: 44px;
    min-height: 44px;
    font-size: 16px;
  }
  body.ws #planner .plg-filters-btn {
    width: 44px;
    min-width: 44px;
    min-height: 44px;
    padding: 0;
    border-color: transparent;
    background: transparent;
  }
  body.ws #planner .plg-filters-btn.is-on {
    border-color: transparent;
    background: var(--ws-accent-wash);
  }
  body.ws #planner .plg-filters-btn svg {
    width: var(--ws-ico-md);
    height: var(--ws-ico-md);
  }
  body.ws .plg-filters-l {
    display: none;
  }
  body.ws .plg-filters-n {
    position: absolute;
    top: 4px;
    right: 2px;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    background: var(--ws-accent-deep);
    font-size: 10px;
  }
  body.ws #planner .plg-filter-panel {
    display: none;
  }
  body.ws .plg-meter {
    margin-right: 8px;
  }
  body.ws #pl-body > .plg-next {
    grid-template-columns: 28px minmax(0, 1fr) 44px;
    grid-template-areas:
      'i t x'
      'i a x';
    align-items: start;
    padding: 8px 0 8px 12px;
  }
  body.ws .plg-next-ico {
    grid-area: i;
    margin-top: 2px;
  }
  body.ws #pl-body > .plg-next .plg-next-t {
    grid-area: t;
    font-size: 13px;
    line-height: 18px;
    white-space: normal;
  }
  body.ws .plg-next-t span {
    display: none;
  }
  body.ws #planner .plg-next-act {
    grid-area: a;
    justify-self: start;
    min-height: 32px;
    padding: 0;
  }
  body.ws #planner .plg-next-x {
    grid-area: x;
    align-self: center;
    width: 44px;
    height: 44px;
    min-height: 44px;
  }
  /* Картата на цяла ширина; таблицата – редове-карти (същият DOM, преоформен). */
  body.ws #planner .plg-table-card {
    margin: 0 -16px;
    border-width: 1px 0;
    border-radius: 0;
  }
  body.ws #planner .plg-table,
  body.ws #planner .plg-table tbody {
    display: block;
  }
  body.ws #planner .plg-table :is(thead, colgroup, .plg-qa-body) {
    display: none;
  }
  body.ws #planner .plg-table tr.pl-guest-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto auto 88px;
    grid-template-rows: auto auto;
    align-items: center;
    column-gap: 10px;
    row-gap: 2px;
    min-height: var(--ws-row-h-touch);
    padding: 12px 0 12px 16px;
    border-bottom: 1px solid var(--ws-divider);
  }
  body.ws #planner .plg-table tr.pl-guest-row {
    background: var(--plg-row-bg);
  }
  body.ws #planner .plg-table tr.pl-guest-row > *,
  body.ws #planner .plg-table tr.pl-guest-row.is-marked > * {
    background: none;
  }
  body.ws #planner .plg-table tr.pl-guest-row.is-marked {
    background: color-mix(in oklab, var(--plg-row-bg) 95%, var(--ink));
  }
  body.ws #planner .plg-table tr.pl-guest-row > * {
    display: block;
    height: auto;
    padding: 0;
    border: 0;
  }
  body.ws #planner .plg-table tr.pl-guest-row > .ws-check-cell {
    display: none;
  }
  body.ws #planner .plg-table.is-selecting tr.pl-guest-row {
    grid-template-columns: 36px minmax(0, 1fr) auto auto auto 88px;
    padding-left: 8px;
  }
  body.ws #planner .plg-table.is-selecting tr.pl-guest-row:not(.plg-person-row) > .ws-check-cell {
    display: block;
    grid-column: 1;
    grid-row: 1 / 3;
    padding: 0;
  }
  body.ws #planner .plg-table tr.pl-guest-row > .plg-c-name {
    grid-column: -6 / -2;
    grid-row: 1 / 3;
  }
  body.ws #planner .plg-table tr.pl-guest-row:not(.plg-person-row) .pl-guest-name {
    padding-right: 48px;
  }
  body.ws #planner .plg-table tr.pl-guest-row:not(.plg-person-row) .plg-meta {
    padding-right: var(--plg-cluster, 156px);
  }
  body.ws #planner .plg-table tr.pl-guest-row > :is(.plg-c-people, .plg-c-status, .plg-c-invite, .plg-c-table) {
    pointer-events: none;
  }
  body.ws #planner .plg-table tr.pl-guest-row > .plg-c-people {
    display: inline-flex;
    grid-column: -5 / -2;
    grid-row: 1;
    justify-self: end;
    align-items: center;
    gap: 3px;
    font: 500 13px/20px var(--font-body);
    color: var(--ink-muted);
  }
  body.ws .plg-c-people small {
    display: none;
  }
  body.ws .plg-ppl-ico {
    display: inline-flex;
  }
  body.ws #planner .plg-table tr.pl-guest-row > .plg-c-status {
    grid-column: -5;
    grid-row: 2;
    justify-self: end;
  }
  body.ws #planner .plg-table tr.pl-guest-row > .plg-c-invite {
    grid-column: -4;
    grid-row: 2;
    justify-self: end;
  }
  body.ws #planner .plg-table tr.pl-guest-row > .plg-c-table {
    grid-column: -3;
    grid-row: 2;
    justify-self: end;
  }
  body.ws #planner .plg-table tr.pl-guest-row > .plg-c-act {
    display: grid;
    grid-column: -2;
    grid-row: 1 / 3;
    align-self: stretch;
    place-items: center;
  }
  body.ws #planner :is(.plg-more-btn, .plg-edit-btn) {
    width: 44px;
    height: 44px;
    min-height: 44px;
    opacity: 1;
  }
  body.ws .plg-act {
    gap: 0;
  }
  body.ws #planner :is(.plg-status-btn, .plg-inv) {
    width: auto;
    height: auto;
    min-height: 0;
    margin: 0;
    padding: 0;
  }
  body.ws .plg-status-chev,
  body.ws .ws-rsvp-l,
  body.ws .plg-inv-l {
    display: none;
  }
  body.ws .ws-rsvp-s {
    display: inline;
  }
  body.ws .plg-tbl {
    width: 20px;
    height: 20px;
    font-size: 12px;
  }
  body.ws .plg-meta {
    gap: 8px;
  }
  body.ws #planner .plg-party-btn {
    display: none;
  }
  body.ws #planner .plg-table tr.plg-person-row {
    display: block;
    min-height: var(--ws-subrow-h);
    padding: 10px 16px 10px 32px;
    background: var(--cream);
    border-bottom: 1px solid var(--ws-divider);
  }
  body.ws #planner .plg-table tr.plg-person-row > :is(.ws-check-cell, .plg-c-sub) {
    display: none;
  }
  body.ws #planner .plg-table tr.plg-person-row > .plg-c-name {
    display: block;
    padding: 0;
  }
  body.ws #planner .plg-table tr.plg-gh {
    display: block;
  }
  body.ws #planner .plg-table tr.plg-gh > th {
    display: block;
    height: auto;
    padding: 4px 16px;
  }
  body.ws #planner .plg-table tr.plg-empty-f,
  body.ws #planner .plg-table tr.plg-empty-f > td {
    display: block;
  }
  body.ws .plg-pager {
    min-height: 56px;
  }
  /* Масовата лента – закрепена над долното меню (в зоната на палеца), тъмна, както в прототипа. */
  body.ws #planner .plg-bulk-wrap .ws-bulkbar {
    position: fixed;
    left: 8px;
    right: 8px;
    bottom: calc(8px + env(safe-area-inset-bottom, 0px));
    z-index: 36;
    flex-wrap: nowrap;
    padding: 8px;
    border-color: var(--ink);
    border-radius: var(--ws-radius-lg);
    background: var(--ink);
    box-shadow: var(--ws-shadow-2);
    color: #fff;
  }
  body.ws.has-lux-tabbar #planner .plg-bulk-wrap .ws-bulkbar {
    bottom: calc(var(--ws-tabbar-h) + 8px + env(safe-area-inset-bottom, 0px));
  }
  body.ws #planner .ws-bulkbar > .ws-icon-btn {
    width: 44px;
    height: 44px;
    min-height: 44px;
    color: #fff;
  }
  body.ws .ws-bulkbar-count {
    flex: 1 1 auto;
  }
  body.ws #planner .ws-bulkbar-count :is(span, .ws-link) {
    display: none;
  }
  body.ws .plg-bl-long {
    display: none;
  }
  body.ws .plg-bl-short {
    display: inline;
  }
  body.ws .ws-bulkbar-actions {
    flex: none;
    flex-wrap: nowrap;
  }
  body.ws .ws-bulkbar-wide {
    display: none;
  }
  body.ws .ws-bulkbar-narrow {
    display: inline-flex;
  }
  body.ws #planner .ws-bulkbar .ws-btn {
    min-height: 44px;
    padding: 0 14px;
    border-color: rgba(255, 255, 255, 0.35);
    background: transparent;
    color: #fff;
  }
  body.ws #planner .ws-bulkbar .ws-btn--primary {
    border-color: var(--paper);
    background: var(--paper);
    color: var(--ink);
  }
  body.ws #planner .ws-bulkbar .ws-btn:disabled {
    opacity: 0.5;
  }
  body.ws #planner .ws-bulkbar .ws-menu {
    color: var(--ink);
  }
  body.ws #pl-body:has(.ws-bulkbar:not([hidden])) {
    padding-bottom: 96px;
  }
  /* „+ Гост“ (плаващият бутон) вместо „+“ в горната лента – в зоната на палеца; скрива се при писане и в „Избери“. */
  body.ws #pl-body[data-tab='guests'] .ws-shead-actions #plg-add {
    display: none;
  }
  body.ws #planner #pl-body > #plg-fab.ws-fab {
    display: inline-flex;
  }
  body.ws.plg-selecting #planner #pl-body > #plg-fab.ws-fab,
  body.ws #planner #pl-body:has(.ws-bulkbar:not([hidden])) > #plg-fab.ws-fab {
    opacity: 0;
    transform: translateY(12px);
    pointer-events: none;
  }
}
@media (prefers-reduced-motion: reduce) {
  body.ws #pl-body > .plg-next,
  body.ws .plg-meter i,
  body.ws .plg-qa-x,
  body.ws #planner .plg-seg-b,
  body.ws .plg-gh-chev,
  body.ws .plg-status-chev,
  body.ws #planner .plg-more-btn {
    transition: none;
  }
  body.ws .ws-bulkbar,
  body.ws .plg-bar.is-finding .plg-search {
    animation: none;
  }
  body.ws #planner .plg-table tr.plg-row-new > * {
    animation: none;
    background: var(--ws-accent-wash);
  }
}

/* ---------- Движение и печат ---------- */
@media (prefers-reduced-motion: reduce) {
  body.ws #main-menu,
  body.ws .catalog-main-menu,
  body.ws .ws-item-text,
  body.ws .ws-sec-title,
  body.ws .ws-collapse svg,
  body.ws #lux-tabbar .ws-tab::before,
  body.ws .ws-stat,
  body.ws .ws-btn,
  body.ws .ws-link svg,
  body.ws .ws-progress-fill,
  body.ws .ws-segmented button,
  body.ws .ws-field-control,
  body.ws .ws-fab,
  body.ws .ws-task,
  body.ws .ws-task-box,
  body.ws .ws-task-box svg,
  body.ws .ws-group-chev,
  body.ws .ws-cat-chev,
  body.ws .ws-disclosure-chev,
  body.ws .plg-party-chev,
  .ws-toast,
  .ws-skip {
    transition: none;
  }
  body.ws .ws-menu,
  body.ws .ws-popover,
  .ws-toast,
  body.ws dialog.ws-dialog[open],
  body.ws .plg-table tr.plg-row-new > * {
    animation: none;
  }
  body.ws .ws-skel::after {
    animation: none;
  }
  body.ws .ws-segmented button:active,
  body.ws .ws-fab:active,
  body.ws .ws-task-check:active .ws-task-box {
    transform: none;
  }
  body.ws .ws-stat:hover,
  body.ws .ws-stat:active,
  body.ws .ws-btn:active {
    transform: none;
  }
}
@media print {
  body.ws {
    padding: 0 !important;
  }
  body.ws #main-menu,
  body.ws .catalog-main-menu,
  body.ws #lux-tabbar,
  body.ws #lux-subnav,
  body.ws > header,
  body.ws .ws-fab,
  .ws-toasts,
  .ws-skip {
    display: none !important;
  }
}

/* =====================================================================================================================
   DESIGN-PASS-2 (14.10.2026): шаблон на раздел ws-section – мобилно първо (т. 2), KPI (т. 4), следващи стъпки,
   празно състояние, полета 16 px и цели 44 px на тъч (DP2-06/07), база за телефон (DP2-26), лентата за запис (DP2-08).
   Селекторите са през :is(#planner, main) – по-силни от общите „#planner button / small“ в planner.css.
   ===================================================================================================================== */
/* DP2-26: без сиво/синьо петно при докосване; бърз отклик (без 300 ms) и без избор на текста на контролите. */
html:has(body.ws) {
  -webkit-tap-highlight-color: transparent;
  -webkit-text-size-adjust: 100%;
}
body.ws :is(button, a, [role='button'], summary, label) {
  touch-action: manipulation;
}
body.ws :is(.ws-kpi, .ws-btn, .ws-chip-btn, .ws-tab, .ws-item, .ws-icon-btn, .ws-railbtn, .ws-fab) {
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
}
@media (max-width: 760px) {
  body.ws > main {
    padding-top: 16px;
  }
  body.ws #pl-body {
    gap: 16px;
  }
}
/* Раздел: една колона на телефон (#pl-body е мрежата; .ws-stop е горната част в една клетка; не е position: relative –
   заглавната зона е позиционирана спрямо страницата). */
/* Заглавна зона (14.10): живее в ГОРНАТА ЛЕНТА на портала – вляво надзаглавие (групата/събитието), H1 (Lora) и статус в
   един ред, вдясно главните действия до известията. DOM остава в раздела (модулите търсят по body), затова блокът е
   позициониран спрямо страницата: започва от менюто, свършва преди известията (--ws-bar-r, workspace.js wsSyncBar).
   Лентата е с постоянна височина – смяната на раздел не мести нищо. Съдържанието започва направо с прегледа. */
body.ws :is(#planner, main) .ws-stop {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
  grid-column: 1 / -1;
  min-width: 0;
}
body.ws :is(#planner, main) .ws-shead {
  position: absolute;
  z-index: 24;
  top: 0;
  left: calc(var(--ws-side) + var(--ws-pad));
  right: calc(var(--ws-bar-r, 120px) + 12px);
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px 12px;
  height: var(--ws-topbar-h);
  margin: 0;
  padding: 0;
  border: 0;
  pointer-events: none;
}
body.ws :is(#planner, main) .ws-shead > * {
  pointer-events: auto;
}
body.ws :is(#planner, main) .ws-shead.is-enter {
  animation: ws-shead-in var(--ws-dur-3) var(--ws-ease) both;
}
@keyframes ws-shead-in {
  from {
    opacity: 0;
    transform: translateY(4px);
  }
}
body.ws :is(#planner, main) .ws-shead-text {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
}
body.ws :is(#planner, main) .ws-shead-eyebrow {
  display: none;
  overflow: hidden;
  font: 600 11px/14px var(--font-body);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-muted);
  white-space: nowrap;
  text-overflow: ellipsis;
}
body.ws :is(#planner, main) .ws-shead-line {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
body.ws :is(#planner, main) .ws-shead-title {
  margin: 0;
  overflow: hidden;
  font: 500 19px/24px var(--font-display);
  color: var(--ink);
  white-space: nowrap;
  text-overflow: ellipsis;
}
/* Заглавието получава фокус от скрипта (tabindex="-1") при смяна на екрана – за екранните четци. С Tab не се стига до
   него, затова рамка не трябва: Chrome я показваше като :focus-visible след презареждане (златна рамка около „Планери“,
   собственикът 21.10.2026). */
body.ws :is(#planner, main) .ws-shead-title:is(:focus, :focus-visible) {
  outline: none;
  box-shadow: none;
}
body.ws :is(#planner, main) .ws-shead-sub {
  max-width: none;
  margin: 0;
  overflow: hidden;
  font: 500 12px/16px var(--font-body);
  color: var(--ink-muted);
  white-space: nowrap;
  text-overflow: ellipsis;
}
body.ws :is(#planner, main) .ws-shead-sub strong {
  color: var(--ink);
  font-weight: 600;
}
body.ws :is(#planner, main) .ws-shead-sub .ws-sub-warn {
  color: var(--danger);
  font-weight: 600;
}
body.ws :is(#planner, main) .ws-shead-sub .ws-ico {
  width: 14px;
  height: 14px;
  margin-right: 4px;
  vertical-align: -2px;
}
body.ws :is(#planner, main) .ws-shead-date {
  display: none;
  font: 500 13px/18px var(--font-body);
  color: var(--ink-muted);
  white-space: nowrap;
}
body.ws :is(#planner, main) .ws-shead-actions {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  min-width: 0;
}
body.ws :is(#planner, main) .ws-shead-actions > * {
  flex: none;
}
/* Празна заглавна зона без статус и действия – само H1, но пак в лентата. Без нея (празна клетка) редът не заема място. */
body.ws :is(#planner, main) .ws-stop:has(> .ws-shead:only-child) {
  display: block;
  height: 0;
  margin-bottom: -24px; /* колкото е разстоянието между редовете на #pl-body (24 px; 16 px на телефон) */
}
@media (max-width: 760px) {
  body.ws :is(#planner, main) .ws-stop:has(> .ws-shead:only-child) {
    margin-bottom: -16px;
  }
}
/* Телефон: най-важното действие е иконка в лентата (текстът остава за екранните четци), „⋯“ – за останалите. Плаващият
   бутон се скрива, когато лентата вече има главно действие. */
@media (max-width: 760px) {
  body.ws {
    --ws-topbar-h: 60px;
  }
  body.ws :is(#planner, main) .ws-shead {
    left: 16px;
    right: calc(var(--ws-bar-r, 64px) + 4px);
    gap: 4px;
  }
  body.ws :is(#planner, main) .ws-shead-actions .ws-btn--primary.ws-wide-only {
    display: inline-flex;
    flex: none;
    width: 44px;
    min-width: 44px;
    height: 44px;
    padding: 0;
    justify-content: center;
    font-size: 0;
    gap: 0;
  }
  body.ws :is(#planner, main) .ws-shead-actions .ws-btn--primary.ws-wide-only:has(> svg) svg {
    width: 20px;
    height: 20px;
  }
  /* Главно действие без иконка (напр. „Сподели“) – остава текст, но по-компактен. */
  body.ws :is(#planner, main) .ws-shead-actions .ws-btn--primary.ws-wide-only:not(:has(> svg)) {
    width: auto;
    padding: 0 14px;
    font-size: 14px;
  }
  /* Заглавието в лентата замества пътеката („Табло“, „Гости“ …) – без двойно показване. */
  body.ws:has(:is(#pl-body, #plan-page) .ws-shead) #ws-title {
    visibility: hidden;
  }
}
@media (min-width: 761px) {
  body.ws :is(#planner, main) .ws-stop {
    gap: 16px;
  }
  body.ws :is(#planner, main) .ws-shead {
    gap: 8px 24px;
  }
  body.ws :is(#planner, main) .ws-shead-eyebrow {
    display: block;
  }
  body.ws :is(#planner, main) .ws-shead-line {
    flex-direction: row;
    align-items: baseline;
    gap: 12px;
  }
  body.ws :is(#planner, main) .ws-shead-title {
    flex: 0 1 auto;
    font-size: 22px;
    line-height: 28px;
  }
  body.ws :is(#planner, main) .ws-shead-sub {
    flex: 1 1 0;
    min-width: 0;
    font-size: 13px;
    line-height: 18px;
  }
  body.ws :is(#planner, main) .ws-shead-date {
    display: block;
  }
  /* Планерът заменя пътеката в лентата със собствената си заглавна зона (виж по-горе); докато се зарежда – празно. */
  body.ws:has(:is(#pl-body, #plan-page)) #ws-title {
    visibility: hidden;
  }
}
@media (prefers-reduced-motion: reduce) {
  body.ws :is(#planner, main) .ws-shead.is-enter {
    animation: none;
  }
}

/* Преглед (KPI): 2×2 на телефон – 4 цели на един поглед, без жест встрани; 4 в ред от 761; до 6 от 1280. */
body.ws :is(#planner, main) .ws-overview {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
  padding: 0;
}
body.ws :is(#planner, main) .ws-kpi {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-rows: auto auto 1fr;
  align-content: start;
  column-gap: 8px;
  min-width: 0;
  min-height: var(--ws-kpi-h);
  margin: 0;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: var(--ws-radius-md);
  background: var(--paper);
  box-shadow: none;
  color: var(--ink);
  font: inherit;
  text-align: left;
  text-decoration: none;
  white-space: normal;
  cursor: pointer;
  transition:
    background-color var(--ws-dur-1) ease,
    border-color var(--ws-dur-1) ease,
    box-shadow var(--ws-dur-2) var(--ws-ease),
    transform 100ms ease;
}
body.ws :is(#planner, main) .ws-kpi.is-static {
  cursor: default;
}
body.ws :is(#planner, main) .ws-kpi--desk {
  display: none;
}
/* Широката карта (Бюджет „Остава“) – на цял ред на телефон и при 3 карти на таблет – в своя ред. */
body.ws :is(#planner, main) .ws-kpi--wide {
  grid-column: 1 / -1;
}
body.ws :is(#planner, main) .ws-kpi-value {
  grid-row: 1;
  grid-column: 1;
  min-width: 0;
  font: 600 22px/26px var(--font-body);
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
  color: var(--ink);
  overflow-wrap: anywhere;
}
body.ws :is(#planner, main) .ws-kpi-value small {
  display: inline;
  margin-left: 4px;
  font-size: 13px;
  font-weight: 500;
  line-height: inherit;
  letter-spacing: 0;
  color: var(--ink-muted);
}
body.ws :is(#planner, main) .ws-kpi-pct {
  grid-row: 1;
  grid-column: 2;
  align-self: center;
  font: 600 12px/1 var(--font-body);
  font-variant-numeric: tabular-nums;
  color: var(--ws-accent-ink);
}
body.ws :is(#planner, main) .ws-kpi-label {
  grid-row: 2;
  grid-column: 1 / -1;
  min-width: 0;
  font: 500 13px/18px var(--font-body);
  color: var(--ink);
}
body.ws :is(#planner, main) .ws-kpi-meta {
  display: none;
}
body.ws :is(#planner, main) .ws-kpi-viz {
  grid-row: 3;
  grid-column: 1 / -1;
  align-self: end;
  margin-top: 8px;
}
body.ws :is(#planner, main) .ws-kpi:active:not(.is-static) {
  transform: scale(0.98);
}
/* DESIGN-PASS-4 D4-05: избраната карта – светъл фон, златна рамка 2 px (inset) и етикет в --gold-ink (6.1:1); без
   ромба (Unicode/декоративен знак вместо икона). Състоянието е и в aria-pressed. */
body.ws :is(#planner, main) .ws-kpi[aria-pressed='true'] {
  background: var(--ws-accent-wash);
  border-color: var(--ws-accent);
  box-shadow: inset 0 0 0 1px var(--ws-accent);
}
body.ws :is(#planner, main) .ws-kpi[aria-pressed='true'] :is(.ws-kpi-label, .ws-kpi-meta) {
  color: var(--ws-accent-ink);
}
body.ws :is(#planner, main) .ws-kpi--warn .ws-kpi-value {
  color: var(--rose);
}
body.ws :is(#planner, main) .ws-kpi:focus-visible {
  outline: none;
  box-shadow: var(--ws-focus);
}
@media (hover: hover) and (pointer: fine) {
  body.ws :is(#planner, main) .ws-kpi:not(.is-static):hover {
    border-color: var(--ws-accent-line);
    box-shadow: var(--ws-shadow-1);
    background: var(--paper);
    color: var(--ink);
  }
  body.ws :is(#planner, main) .ws-kpi[aria-pressed='true']:hover {
    background: var(--ws-accent-wash);
    box-shadow: inset 0 0 0 1px var(--ws-accent);
  }
}
/* Мини визуализации: лента (scaleX през CSSOM) и сегментна лента (flex-grow през CSSOM). */
body.ws :is(#planner, main) .ws-bar {
  display: block;
  height: var(--ws-kpi-bar);
  overflow: hidden;
  border-radius: var(--ws-radius-pill);
  background: var(--paper-sunk);
}
body.ws :is(#planner, main) .ws-bar > i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--ws-accent);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 400ms var(--ws-ease);
}
body.ws :is(#planner, main) .ws-kpi--warn .ws-bar > i {
  background: var(--rose);
}
body.ws :is(#planner, main) .ws-seg {
  display: flex;
  gap: 2px;
  height: var(--ws-kpi-bar);
  overflow: hidden;
  border-radius: var(--ws-radius-pill);
  background: var(--paper-sunk);
}
body.ws :is(#planner, main) .ws-seg > i {
  display: block;
  flex: 0 1 0;
  height: 100%;
  min-width: 2px;
}
body.ws :is(#planner, main) .ws-seg .is-yes,
body.ws :is(#planner, main) .ws-seg .is-paid {
  background: var(--ws-accent);
}
body.ws :is(#planner, main) .ws-seg .is-wait,
body.ws :is(#planner, main) .ws-seg .is-agreed {
  background: var(--ws-accent-line);
}
body.ws :is(#planner, main) .ws-seg .is-no {
  background: var(--line-strong);
}
body.ws :is(#planner, main) .ws-seg .is-free {
  background: var(--paper-sunk);
}
body.ws :is(#planner, main) .ws-overview-more {
  display: flex;
  justify-content: flex-end;
  margin-top: -4px;
}
@media (min-width: 761px) {
  :root {
    --ws-kpi-h: 104px;
    --ws-kpi-bar: 6px;
  }
  body.ws :is(#planner, main) .ws-overview {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
  }
  body.ws :is(#planner, main) .ws-overview:has(> .ws-kpi:nth-child(3):last-child) {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  body.ws :is(#planner, main) .ws-overview:has(> .ws-kpi--wide) {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  body.ws :is(#planner, main) .ws-kpi--wide {
    grid-column: span 2;
  }
  body.ws :is(#planner, main) .ws-overview:has(> .ws-kpi:nth-child(2):last-child) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  body.ws :is(#planner, main) .ws-kpi {
    grid-template-rows: auto auto auto 1fr;
    padding: 16px 18px;
  }
  /* D4-06: етикетът 13 px без главни и разредка (EYEBROW RESTRAINT) – не се пренася посред думата. */
  body.ws :is(#planner, main) .ws-kpi-label {
    grid-row: 1;
    grid-column: 1;
    font: 500 13px/18px var(--font-body);
    letter-spacing: 0;
    text-transform: none;
    color: var(--ink-muted);
  }
  body.ws :is(#planner, main) .ws-kpi-value {
    grid-row: 2;
    grid-column: 1;
    margin-top: 6px;
    font-size: 28px;
    line-height: 32px;
  }
  /* Процентът – до стойността (в тясна карта не се застъпва с етикета). */
  body.ws :is(#planner, main) .ws-kpi-pct {
    grid-row: 2;
    align-self: end;
    margin-bottom: 4px;
  }
  body.ws :is(#planner, main) .ws-kpi-label {
    grid-column: 1 / -1;
    overflow-wrap: normal;
    hyphens: manual;
  }
  body.ws :is(#planner, main) .ws-kpi-meta {
    display: block;
    grid-row: 3;
    grid-column: 1 / -1;
    min-width: 0;
    font: 400 13px/18px var(--font-body);
    color: var(--ink-muted);
  }
  body.ws :is(#planner, main) .ws-kpi-viz {
    grid-row: 4;
  }
}
/* Тясно съдържание (меню + 761–1023): KPI на два реда по две, за да не се режат числата. */
@container pl (max-width: 640px) {
  body.ws #planner .ws-overview {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (min-width: 1280px) {
  :root {
    --ws-kpi-h: 112px;
  }
  body.ws :is(#planner, main) .ws-overview {
    grid-template-columns: repeat(auto-fit, minmax(176px, 1fr));
    gap: 16px;
  }
  body.ws :is(#planner, main) .ws-overview:has(> .ws-kpi:nth-child(3):last-child),
  body.ws :is(#planner, main) .ws-overview:has(> .ws-kpi:nth-child(2):last-child) {
    grid-template-columns: repeat(auto-fit, minmax(176px, 1fr));
  }
  body.ws :is(#planner, main) .ws-kpi {
    padding: 16px 20px;
  }
  body.ws :is(#planner, main) .ws-kpi--wide {
    grid-column: span 2;
  }
}
/* Пета и шеста карта (ws-kpi--desk) – само когато съдържанието е поне 1100 px (1440 с меню, 1280 със свито меню);
   тогава всички карти са в един ред (без празни клетки и без пренесена карта). */
@container pl (min-width: 1100px) {
  body.ws #planner .ws-kpi--desk {
    display: grid;
  }
  body.ws #planner .ws-overview:has(> .ws-kpi--desk) {
    grid-template-columns: none;
    grid-auto-flow: column;
    grid-auto-columns: minmax(0, 1fr);
  }
}

/* Мини графика (DP2-21): колонки 24 px, само при съдържание ≥ 1100 px; стойностите са в текста на картата. */
body.ws :is(#planner, main) .ws-kpi-sparkwrap {
  display: none;
}
body.ws :is(#planner, main) .ws-spark {
  display: block;
  width: 100%;
  height: 24px;
  fill: var(--ws-accent);
  opacity: 0.85;
}
@container pl (min-width: 1100px) {
  body.ws #planner .ws-kpi-sparkwrap {
    display: block;
  }
}
/* Следваща стъпка: текст + едно действие; телефон – само най-важната и „Още N стъпки“. Без цветна лява рамка. */
body.ws :is(#planner, main) .ws-nextlist {
  display: grid;
  gap: 8px;
  margin: 0;
}
body.ws :is(#planner, main) .ws-next {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  min-height: 56px;
  padding: 10px 12px 10px 14px;
  border: 1px solid var(--line);
  border-radius: var(--ws-radius-md);
  background: var(--paper);
}
body.ws :is(#planner, main) .ws-next-ico {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--ws-accent-soft);
  color: var(--ws-accent-ink);
}
body.ws :is(#planner, main) .ws-next-ico .ws-ico {
  width: 18px;
  height: 18px;
}
body.ws :is(#planner, main) .ws-next--warn .ws-next-ico {
  background: var(--blush);
  color: var(--rose);
}
body.ws :is(#planner, main) .ws-next-text {
  max-width: none;
  min-width: 0;
  margin: 0;
  font: 600 14px/20px var(--font-body);
  color: var(--ink);
}
body.ws :is(#planner, main) .ws-next-text span {
  display: none;
  font: 400 13px/18px var(--font-body);
  color: var(--ink-muted);
}
body.ws :is(#planner, main) .ws-next-act {
  min-height: 44px;
  padding: 0 14px;
  font-size: 13px;
}
body.ws :is(#planner, main) .ws-nextlist:not(.is-open) > .ws-next:nth-child(n + 2) {
  display: none;
}
body.ws :is(#planner, main) .ws-nextlist.is-open > .ws-next:nth-child(n + 2) {
  animation: ws-next-in 200ms var(--ws-ease) both;
}
body.ws :is(#planner, main) .ws-nextlist-more {
  justify-self: end;
  min-height: 44px;
}
@keyframes ws-next-in {
  from {
    opacity: 0;
    transform: translateY(-4px);
  }
}
@media (min-width: 761px) {
  body.ws :is(#planner, main) .ws-nextlist {
    gap: 0;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: var(--ws-radius-md);
    background: var(--paper);
  }
  body.ws :is(#planner, main) .ws-nextlist > .ws-next,
  body.ws :is(#planner, main) .ws-nextlist:not(.is-open) > .ws-next:nth-child(n + 2) {
    display: grid;
    border: 0;
    border-top: 1px solid var(--line);
    border-radius: 0;
  }
  body.ws :is(#planner, main) .ws-nextlist > .ws-next:first-child {
    border-top: 0;
  }
  body.ws :is(#planner, main) .ws-next-text span {
    display: block;
  }
  body.ws :is(#planner, main) .ws-nextlist-more {
    display: none;
  }
}

/* Празно състояние на раздел: орнамент „линия – ромб – линия“, иконка в кръг, Lora заглавие, действия. */
body.ws :is(#planner, main) .ws-empty--section {
  align-items: center;
  gap: 12px;
  padding: 32px 16px;
  text-align: center;
}
body.ws :is(#planner, main) .ws-ornament {
  display: flex;
  align-items: center;
  gap: 10px;
}
body.ws :is(#planner, main) .ws-ornament i {
  display: block;
  width: 40px;
  height: 1px;
  background: var(--ws-accent-line);
}
body.ws :is(#planner, main) .ws-ornament b {
  display: block;
  width: 8px;
  height: 8px;
  border: 1px solid var(--ws-accent-line);
  transform: rotate(45deg);
}
body.ws :is(#planner, main) .ws-empty-ico {
  display: grid;
  place-items: center;
  width: 64px;
  height: 64px;
  border: 1px solid var(--ws-accent-line);
  border-radius: 50%;
  background: var(--cream);
  color: var(--ws-accent-ink);
}
body.ws :is(#planner, main) .ws-empty-ico .ws-ico {
  width: 28px;
  height: 28px;
  stroke-width: 1.5;
}
body.ws :is(#planner, main) .ws-empty--section h2 {
  margin: 4px 0 0;
  text-wrap: balance;
  font: 500 20px/28px var(--font-display);
  color: var(--ink);
}
body.ws :is(#planner, main) .ws-empty--section p {
  max-width: 46ch;
  margin: 0;
  font-size: 15px;
  line-height: 24px;
  color: var(--ink-muted);
}
body.ws :is(#planner, main) .ws-empty-actions {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
  width: 100%;
  margin-top: 4px;
}
body.ws :is(#planner, main) .ws-empty-chips {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
}
@media (min-width: 761px) {
  body.ws :is(#planner, main) .ws-empty--section {
    padding: 48px 24px;
  }
  body.ws :is(#planner, main) .ws-empty--section h2 {
    font-size: 22px;
    line-height: 30px;
  }
  body.ws :is(#planner, main) .ws-empty-actions {
    flex-direction: row;
    justify-content: center;
    width: auto;
  }
}

/* Бележката в разделите „компютър първо“ на телефон (затваря се и се помни). */
body.ws :is(#planner, main) .ws-deskhint {
  grid-template-columns: auto minmax(0, 1fr) auto;
}

/* Влизане на прегледа (DP2-22): opacity + translateY, само при първо отваряне на раздела. */
body.ws :is(#planner, main) .ws-kpi.ws-enter {
  animation: ws-kpi-in 240ms var(--ws-ease) both;
}
@keyframes ws-kpi-in {
  from {
    opacity: 0;
    transform: translateY(6px);
  }
}
/* Списъкът след филтър: кратко изсветляване на контейнера (без движение на редовете). */
body.ws :is(#planner, main) .ws-refresh {
  animation: ws-fade-in 150ms var(--ws-ease);
}
@keyframes ws-fade-in {
  from {
    opacity: 0.5;
  }
}

/* DP2-06: полетата 16 px на телефон и на тъч – iOS не приближава страницата (без maximum-scale). */
@media (max-width: 760px), (pointer: coarse) {
  body.ws :is(input:not([type='checkbox']):not([type='radio']):not([type='range']):not([type='color']):not([type='file']), select, textarea) {
    font-size: 16px !important;
  }
}
/* DP2-07: цели ≥ 44 px на тъч, без да се мени видът с мишка. */
@media (pointer: coarse), (max-width: 760px) {
  body.ws :is(#planner, main) :is(.ws-link, .pl-link-button),
  body.ws #planner button.ws-link {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
  }
  body.ws :is(#planner, main) :is(.ws-segmented, .pl-segment, .pli-themes, .plc-views) > button {
    min-height: 44px;
  }
  body.ws #planner input:is([type='checkbox'], [type='radio']) {
    width: 20px;
    height: 20px;
  }
  body.ws #planner label:has(> input:is([type='checkbox'], [type='radio'])):not(.ws-task-check) {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-height: 44px;
  }
  body.ws #planner .plc-day {
    min-height: 44px;
  }
}

/* DP2-08: лентата за запис в Покана/Сайт на 761–1279 – редът остава ред (в planner.css ≤ 1100 беше колона и
   flex-basis 220 px ставаше височина: празен блок 250–420 px). */
body.ws .pli-savebar {
  flex-direction: row;
  align-items: center;
  gap: 8px 12px;
  height: auto;
  min-height: 0;
}
body.ws .pli-savebar > button {
  flex: 0 0 auto;
}

/* Плаващият бутон не закрива последния ред (над долното меню + safe-area). */
@media (max-width: 760px) {
  body.ws #pl-body:has(> .ws-fab) {
    padding-bottom: calc(56px + 40px + env(safe-area-inset-bottom));
  }
}
@media (prefers-reduced-motion: reduce) {
  body.ws :is(#planner, main) .ws-kpi.ws-enter,
  body.ws :is(#planner, main) .ws-nextlist.is-open > .ws-next,
  body.ws :is(#planner, main) .ws-refresh {
    animation: none;
  }
  body.ws :is(#planner, main) .ws-kpi,
  body.ws :is(#planner, main) .ws-bar > i {
    transition-duration: 0.01ms;
  }
  body.ws :is(#planner, main) .ws-kpi:active {
    transform: none;
  }
}

/* Меню „Още ⋯“: връзките като бутоните. */
@media (min-width: 761px) {
  body.ws #planner .ws-menu [role='menuitem'].ws-phone-only {
    display: none;
  }
}
body.ws .ws-menu a[role='menuitem'] {
  text-decoration: none;
}
/* Календар на телефон (DP2-19): „Предстоящи“ над месеца. */
@media (max-width: 760px) {
  body.ws #planner .plc-layout:not(.plc-layout-year) {
    display: flex;
    flex-direction: column;
  }
  body.ws #planner .plc-layout:not(.plc-layout-year) > .plc-side {
    order: -1;
  }
}
/* Нечетен брой KPI на телефон (2 колони): последната карта е на цял ред – без празна клетка (TASTE: BENTO CELL COUNT). */
@media (max-width: 760px) {
  /* QA-RD-06: броят се само видимите карти (без .ws-kpi--desk, скрити на телефон) – иначе в „Задачи“ скритата карта по
     средата оставяше празна клетка и последната беше сама на ред. */
  body.ws :is(#planner, main) .ws-overview:not(:has(> .ws-kpi--wide)):not(:has(> .ws-kpi:nth-child(3):last-child)) > .ws-kpi:not(.ws-kpi--desk):nth-last-child(1 of .ws-kpi:not(.ws-kpi--desk)):nth-child(odd of .ws-kpi:not(.ws-kpi--desk)) {
    grid-column: 1 / -1;
  }
}

/* DP2-08: лентата за запис в Покана/Сайт е ниска – „Преглед“ е в заглавната зона (в лентата се крие, когато го има
   горе), подсказката е на един ред под 1280 px; „Запази чернова“ и „Публикувай“ на един ред, основното вдясно. */
body.ws #pl-body:has(.pli-peek-head) .pli-savebar .pli-peek-bar {
  display: none;
}
@media (max-width: 1279px) {
  body.ws .pli-savebar > .muted,
  body.ws .pli-savebar .pls-savebar-info .muted {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
  }
  body.ws .pli-savebar .pl-invite-save {
    flex-wrap: nowrap;
  }
  body.ws .pli-savebar .pl-invite-save > button {
    flex: 0 1 auto;
  }
}
/* Бутоните в лентата за запис не се пренасят на два реда (TASTE: CTA wrap). */
body.ws .pli-savebar .pl-invite-save > button {
  white-space: nowrap;
}

/* DP2-11: надзаглавията в разделите (малки главни с разреждане) стават тихи заглавия – Montserrat 15/600, без главни
   (≤ 1 надзаглавие на 3 карти; TASTE: EYEBROW RESTRAINT). Изключение: „Преглед“ над рамката на поканата/стила. */
body.ws #pl-body .pl-eyebrow:not(.pl-preview-wrap > .pl-eyebrow),
body.ws #pl-body .pl-invite-controls .pli-sub {
  display: block;
  font: 600 15px/1.4 var(--font-body);
  letter-spacing: 0;
  text-transform: none;
  color: var(--ink);
}
/* DP2-24: Съобщения на телефон – полето за писане е закрепено над долното меню; разговорът не дърпа страницата. */
body.ws #planner .plm-thread {
  overscroll-behavior: contain;
}
@media (max-width: 760px) {
  body.ws #planner .plm-compose {
    position: sticky;
    bottom: calc(var(--ws-tabbar-h) + env(safe-area-inset-bottom));
    z-index: 5;
    padding-top: 12px;
    background: var(--paper);
    border-top: 1px solid var(--line);
  }
}
/* График на деня (DP2-23): прегледът над картата на графика. */
body.ws #plan-page > #plan-kpis {
  margin-bottom: 24px;
}
/* Телефон: заглавната част на страниците на портала без повторение (F-1) – името е в горната лента, H1 остава за
   екранните четци, надзаглавието и линията отпадат, въведението/статусът е малък текст. */
@media (max-width: 760px) {
  body.ws .page-intro {
    margin: 0 0 12px;
    padding: 0;
    border: 0;
  }
  body.ws .page-intro > small {
    display: none;
  }
  body.ws .page-intro h1 {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
  }
  body.ws .page-intro p {
    margin: 0;
    font-size: 13px;
    line-height: 18px;
    color: var(--ink-muted);
  }
}

/* Маси (след редактора на цял екран): заглавната зона на DESIGN-PASS-2 е над редактора; тънкият ред на редактора
   пази само „Печат / PDF“ и „Финализирай“ (заглавието и числата са горе). В „Цял екран“ заглавната зона се крие, а
   редът е пак пълен – редакторът заема прозореца. */
body.ws:not(.sl-fs) #pl-body[data-tab='seating'] > .ws-stop ~ .sl-editor .sl-head :is(.sl-title, .sl-head-venue, .sl-stats) {
  display: none;
}
body.ws:not(.sl-fs) #pl-body[data-tab='seating'] > .ws-stop ~ .sl-editor .sl-head:not(:has(.sl-head-actions > *)) {
  display: none;
}
body.ws.sl-fs #pl-body[data-tab='seating'] > :is(.ws-stop, .ws-deskhint) {
  display: none;
}
/* Маси – платното на цялото свободно място (fix/seat-canvas, 15.10.2026): от страничното меню до десния край и от
   горната лента до дъното на прозореца, без отстъпите и максималната ширина на разделите и без рамката на сцената.
   Редовете над сцената (бележки, „ключът“, подсказката) пазят страничния отстъп на раздела. И на „Цял екран“. */
body.ws.pl-wide > main.portal {
  max-width: none;
  margin: 0;
  padding: 0;
}
body.ws.pl-wide :is(#workspace, #planner) {
  max-width: none;
}
body.ws.pl-wide #planner {
  padding: 0;
}
/* „Цял екран“: менюто е скрито – и мястото му е за платното. */
body.ws.pl-wide.sl-fs {
  padding-left: 0;
}
/* Телефон: сцената свършва над лентата с разделите (--sl-bottom) – без долния отстъп страницата не се превърта. */
@media (max-width: 760px) {
  body.ws.pl-wide.has-lux-tabbar {
    padding-bottom: 0;
  }
}
body.ws #pl-body[data-tab='seating'],
body.ws #pl-body[data-tab='seating'] > .sl-editor {
  gap: 0;
}
body.ws #pl-body[data-tab='seating'] > :not(.sl-editor),
body.ws #pl-body[data-tab='seating'] > .sl-editor > :not(.sl-stage) {
  margin: 10px var(--ws-pad);
}
body.ws #pl-body[data-tab='seating'] > .ws-stop:not(:has(*)) {
  display: none;
}
body.ws #pl-body[data-tab='seating'] .sl-stage {
  height: max(360px, calc(100dvh - var(--sl-top, 64px) - var(--sl-bottom, 0px)));
  border: 0;
  border-radius: 0;
}

/* DP2-07 (проверка на 390/375): останалите цели под 44 px на тъч. .pl-link-button е с min-height: 0 !important в
   planner.css – тук целта се разширява невидимо (видът не се променя); полетата, стрелките и малките бутони – 44. */
@media (pointer: coarse), (max-width: 760px) {
  body.ws #planner .pl-link-button {
    position: relative;
  }
  body.ws #planner .pl-link-button::after {
    content: '';
    position: absolute;
    inset: -14px -6px;
  }
  body.ws :is(#planner, main) :is(input:not([type='checkbox']):not([type='radio']):not([type='range']):not([type='color']):not([type='file']):not([type='hidden']), select) {
    min-height: 44px;
  }
  body.ws #planner :is(.plc-arrow, .plc-today-btn, .pl-icon-button),
  body.ws main :is(.dp-print, .dp-reset) {
    min-width: 44px;
    min-height: 44px;
  }
  body.ws :is(#planner, main) .ws-chip.ws-chip-btn {
    min-height: 44px;
  }
  body.ws #planner .pls-sec-name {
    min-height: 44px;
  }
}
@media (pointer: coarse), (max-width: 760px) {
  body.ws main .dp-step-tools > button {
    min-width: 44px;
    min-height: 44px;
  }
  body.ws main .dp-step-tools {
    gap: 4px;
  }
}
/* Доставчици в средна ширина (1024 със свито меню): без колоната „Категория“ (тя е и в чипа на реда в картите),
   заглавията се пренасят – таблицата не излиза от картата. */
body.ws #planner .plp-vtable thead th {
  white-space: normal;
}
@container plpv (min-width: 761px) and (max-width: 1000px) {
  body.ws #planner .plp-vtable thead th:first-child,
  body.ws #planner .plp-vtable .plp-v-cat {
    display: none;
  }
}

/* Общите малки компоненти (етап 6, S6-08): ползват ги и планерът на булката, затова са тук, не в staff.css. */
body.ws .ws-chip--off {
  background: var(--paper-sunk);
  color: var(--ink-muted);
}
/* Значка с брой (меню, долно меню, редове). */
body.ws .ws-badge {
  display: inline-grid;
  place-items: center;
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  box-sizing: border-box;
  border-radius: var(--ws-radius-pill);
  background: var(--ink);
  color: var(--paper);
  font: 600 11px/1 var(--font-body);
  font-variant-numeric: tabular-nums;
}
body.ws #lux-tabbar .ws-tab {
  position: relative;
}
body.ws #lux-tabbar .ws-tab .ws-badge {
  position: absolute;
  top: 6px;
  left: calc(50% + 6px);
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  font-size: 10px;
}
body.ws .ws-btn--sm {
  min-height: 36px;
  padding: 0 14px;
  font-size: 13px;
}
body.ws .ws-btn--secondary {
  background: var(--paper);
  border-color: var(--line-strong);
  color: var(--ink);
}
@media (pointer: coarse) {
  body.ws .ws-btn--sm {
    min-height: 44px;
  }
}

/* =====================================================================================================================
   DESIGN-PASS-4 (14.10.2026) – клиентската страна, пакет A: обща рамка и компоненти.
   ===================================================================================================================== */

/* D4-06: без надзаглавие над заглавието в лентата на планера (активният раздел е в менюто). TASTE EYEBROW RESTRAINT,
   IMP craft-floor „kicker above a heading“. Страниците на екипа (DESIGN-PASS-3) не се пипат. */
body.ws :is(#planner, #plan-page) .ws-shead-eyebrow {
  display: none;
}

/* D4-01 / D4-02: телефон – в лентата остават иконни бутони и „⋯“; главното действие е плаващият бутон в обсега на
   палеца, когато разделът има такъв (UUPM primary-action, truncation-strategy; MN §7). */
@media (max-width: 760px) {
  body.ws :is(#pl-body, #plan-page) .ws-shead-actions {
    flex: none;
  }
  /* Статусът се реже последен: не участва в ширината на текстовата колона. */
  body.ws :is(#pl-body, #plan-page) .ws-shead-sub {
    width: 0;
    min-width: 100%;
  }
  body.ws :is(#pl-body, #plan-page) .ws-shead-actions .ws-btn:not(.ws-icon-btn):not(:has(> svg)):not(.ws-btn--primary) {
    display: none;
  }
  body.ws :is(#pl-body, #plan-page) .ws-shead-actions .ws-btn:not(.ws-icon-btn):has(> svg) {
    flex: none;
    width: 44px;
    min-width: 44px;
    height: 44px;
    padding: 0;
    justify-content: center;
    gap: 0;
    font-size: 0;
  }
  body.ws :is(#pl-body, #plan-page) .ws-shead-actions .ws-btn:not(.ws-icon-btn):has(> svg) > span {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
  }
  body.ws :is(#pl-body, #plan-page) .ws-shead-actions .ws-btn:not(.ws-icon-btn):has(> svg) > svg {
    width: 20px;
    height: 20px;
  }
  body.ws:has(:is(#pl-body, #plan-page) .ws-fab) :is(#pl-body, #plan-page) .ws-shead-actions .ws-btn--primary {
    display: none;
  }
  body.ws #plan-page .ws-fab,
  body.ws.has-lux-tabbar #plan-page .ws-fab {
    display: inline-flex;
  }
  body.ws:not(.has-lux-tabbar) #plan-page .ws-fab {
    bottom: calc(16px + env(safe-area-inset-bottom));
  }
  body.ws #plan-page:has(.ws-fab) {
    padding-bottom: calc(56px + 40px + env(safe-area-inset-bottom));
  }
}

/* D4-03: бележката „компютър първо“ – тих ред от 44 px, без жълто поле. */
body.ws :is(#planner, main) .ws-deskhint {
  display: grid;
  grid-template-columns: 16px minmax(0, 1fr) 44px;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  margin: 0;
  padding: 0 0 0 12px;
  border: 1px solid var(--line);
  border-radius: var(--ws-radius-md);
  background: none;
  color: var(--ink-muted);
  font: 500 13px/18px var(--font-body);
}
body.ws :is(#planner, main) .ws-deskhint > svg {
  width: 16px;
  height: 16px;
  color: var(--ws-accent-ink);
}
body.ws :is(#planner, main) .ws-deskhint p {
  max-width: none;
  margin: 0;
  padding: 6px 0;
  font: inherit;
  color: inherit;
}
body.ws :is(#planner, main) .ws-deskhint .ws-icon-btn {
  width: 44px;
  height: 44px;
  min-height: 44px;
  border: 0;
  background: none;
}
body.ws #pl-body > .ws-deskhint {
  grid-column: 1 / -1;
}

/* D4-04 (б): три KPI – три колони на всички ширини (BENTO CELL COUNT); на телефон по-компактни, без мета текста. */
body.ws :is(#planner, main) .ws-overview:has(> .ws-kpi:nth-child(3):last-child):not(:has(> .ws-kpi--wide)) {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
@media (max-width: 760px) {
  body.ws :is(#planner, main) .ws-overview:has(> .ws-kpi:nth-child(3):last-child):not(:has(> .ws-kpi--wide)) > .ws-kpi {
    padding: 10px;
  }
  body.ws :is(#planner, main) .ws-overview:has(> .ws-kpi:nth-child(3):last-child):not(:has(> .ws-kpi--wide)) .ws-kpi:not(.ws-kpi--word) .ws-kpi-value {
    font-size: 20px;
    line-height: 24px;
  }
  body.ws :is(#planner, main) .ws-overview:has(> .ws-kpi:nth-child(3):last-child):not(:has(> .ws-kpi--wide)) .ws-kpi-label {
    font-size: 12px;
    line-height: 16px;
  }
  body.ws :is(#planner, main) .ws-overview:has(> .ws-kpi:nth-child(3):last-child):not(:has(> .ws-kpi--wide)) .ws-kpi-pct {
    display: none;
  }
}

/* D4-08: едно празно състояние – иконка 20 px в кръг 40 px, заглавие Lora 20/28, текст 14/20 до 2 реда (44ch),
   отстъп 24 / 32. Без пунктир, ромб и курсив (UUPM empty-states, TASTE 4.5, IMP operate). */
body.ws :is(#planner, main) .ws-empty--section {
  gap: 8px;
  padding: 24px 16px;
}
body.ws :is(#planner, main) .ws-ornament {
  display: none;
}
body.ws :is(#planner, main) .ws-empty-ico,
body.ws .notification-drawer .ws-empty-ico {
  display: grid;
  place-items: center;
  flex: none;
  width: 40px;
  height: 40px;
  border: 0;
  border-radius: 50%;
  background: var(--gold-soft);
  color: var(--gold-ink);
}
body.ws :is(#planner, main) .ws-empty-ico .ws-ico,
body.ws .notification-drawer .ws-empty-ico .ws-ico {
  width: 20px;
  height: 20px;
  stroke-width: 1.6;
}
body.ws :is(#planner, main) .ws-empty--section :is(h2, h3) {
  margin: 4px 0 0;
  text-wrap: balance;
  font: 500 20px/28px var(--font-display);
  color: var(--ink);
}
body.ws :is(#planner, main) .ws-empty--section p {
  max-width: 44ch;
  margin: 0;
  font: 400 14px/20px var(--font-body);
  font-style: normal;
  color: var(--ink-muted);
}
@media (min-width: 761px) {
  body.ws :is(#planner, main) .ws-empty--section {
    padding: 32px 24px;
  }
  body.ws :is(#planner, main) .ws-empty--section :is(h2, h3) {
    font-size: 20px;
    line-height: 28px;
  }
}
/* Празен панел / списък: ред от 48 px – иконка, текст, връзка. */
body.ws .ws-empty--inline {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  min-height: 48px;
  margin: 0;
  padding: 4px 0;
  text-align: left;
}
body.ws .ws-empty--inline p {
  max-width: none;
  margin: 0;
  font: 400 14px/20px var(--font-body);
  color: var(--ink-muted);
}

/* D4-11: известията – „Маркирай всички“ е тиха връзка на един ред, бутоните на тъч са ≥ 44 px. */
body.ws .notification-heading h2:focus {
  outline: none;
}
body.ws .notification-heading h2:focus-visible {
  border-radius: 4px;
  box-shadow: var(--ws-focus);
}
body.ws .notification-heading > div {
  display: flex;
  align-items: center;
  gap: 4px;
}
body.ws .notification-heading #notifications-read-all {
  min-height: 36px;
  padding: 0 8px;
  border: 0;
  background: none;
  box-shadow: none;
  color: var(--gold-ink);
  font: 600 13px/18px var(--font-body);
  white-space: nowrap;
}
body.ws .notification-heading #notifications-close {
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  padding: 0;
  font-size: 14px;
}
@media (pointer: coarse), (max-width: 760px) {
  body.ws .notification-heading #notifications-read-all,
  body.ws .notification-heading #notifications-close {
    min-height: 44px;
  }
  body.ws .notification-heading #notifications-close {
    width: 44px;
    height: 44px;
  }
}

/* D4-12: чиповете на телефон – цел 44 px без промяна на вида; избледняване вдясно, докато има още (MN §9). */
@media (max-width: 760px) {
  body.ws #lux-subnav a {
    position: relative;
    flex: none;
  }
  body.ws #lux-subnav a::after {
    content: '';
    position: absolute;
    inset: -4px 0;
  }
  body.ws #lux-subnav.is-more {
    -webkit-mask-image: linear-gradient(90deg, #000 88%, transparent);
    mask-image: linear-gradient(90deg, #000 88%, transparent);
  }
}

/* D4-13: „Още N стъпки“ – последният ред в рамката на следващите стъпки (без празно място отдолу). */
@media (max-width: 760px) {
  body.ws :is(#planner, main) .ws-nextbox {
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: var(--ws-radius-md);
    background: var(--paper);
  }
  body.ws :is(#planner, main) .ws-nextbox .ws-nextlist {
    gap: 0;
  }
  body.ws :is(#planner, main) .ws-nextbox .ws-next {
    border: 0;
    border-radius: 0;
  }
  body.ws :is(#planner, main) .ws-nextbox .ws-next + .ws-next {
    border-top: 1px solid var(--ws-divider);
  }
  body.ws :is(#planner, main) .ws-nextbox .ws-nextlist-more {
    display: flex;
    justify-self: stretch;
    justify-content: flex-start;
    gap: 6px;
    width: 100%;
    min-height: 44px;
    margin: 0;
    padding: 0 14px 0 58px;
    border: 0;
    border-top: 1px solid var(--ws-divider);
    border-radius: 0;
    background: none;
    font-size: 13px;
  }
  body.ws :is(#planner, main) .ws-nextbox .ws-nextlist-more[hidden] {
    display: none;
  }
}
@media (max-width: 760px) {
  /* Главно действие без иконка (Спомени „Сподели албума“) – на телефон е в „⋯“ (ws-phone-only), лентата не се реже. */
  body.ws :is(#pl-body, #plan-page) .ws-shead-actions .ws-btn--primary.ws-wide-only:not(:has(> svg)) {
    display: none;
  }
}

/* D4-08: „Запитвания“ без запитвания – същото тихо празно състояние (без пунктир и курсив). */
body.ws #planner #plr-host .mine-empty {
  padding: 24px 16px;
  border: 1px solid var(--line);
  border-radius: var(--ws-radius-md);
  background: var(--paper);
}
body.ws #planner #plr-host .mine-empty p {
  max-width: 44ch;
  font: 400 14px/20px var(--font-body);
  font-style: normal;
  color: var(--ink-muted);
}

/* D4-22: Маси – компактна лента вместо KPI + стъпка; платното започва веднага (TASTE Operate – работната площ първо;
   UUPM content-priority; Dashboard – филтрите в заглавката). */
body.ws #pl-body[data-tab='seating'] .ws-seatbar-in,
body.ws #pl-body[data-tab='seating'] .ws-seatbar {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  gap: 6px;
  min-width: 0;
}
body.ws #pl-body[data-tab='seating'] .ws-seatbar {
  min-height: 48px;
  overflow-x: auto;
  scrollbar-width: none;
}
body.ws #pl-body[data-tab='seating'] .ws-seatchip {
  position: relative;
  display: inline-flex;
  flex: none;
  align-items: center;
  min-height: 32px;
  margin: 0;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: var(--ws-radius-pill);
  background: var(--paper);
  box-shadow: none;
  color: var(--ink);
  font: 600 13px/18px var(--font-body);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
body.ws #pl-body[data-tab='seating'] .ws-seatchip--bar > i {
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 5px;
  height: 2px;
  overflow: hidden;
  border-radius: 2px;
  background: var(--paper-sunk);
}
body.ws #pl-body[data-tab='seating'] .ws-seatchip--bar > i > b {
  display: block;
  height: 100%;
  background: var(--ws-accent);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform var(--ws-dur-2) var(--ws-ease);
}
body.ws #pl-body[data-tab='seating'] .ws-seatchip--btn {
  cursor: pointer;
  border-color: var(--line-strong);
}
body.ws #pl-body[data-tab='seating'] .ws-seatchip--btn.is-warn {
  border-color: var(--rose);
  background: var(--blush);
  color: var(--rose);
}
body.ws #pl-body[data-tab='seating'] .ws-seatchip--btn::after {
  content: '';
  position: absolute;
  inset: -6px 0;
}
body.ws #pl-body[data-tab='seating'] .ws-seatchip--btn:focus-visible {
  outline: none;
  box-shadow: var(--ws-focus);
}
@media (hover: hover) and (pointer: fine) {
  body.ws #pl-body[data-tab='seating'] .ws-seatchip--btn:hover {
    border-color: var(--ws-accent);
  }
}
/* В лентата на компютър чиповете са статусът; отделният ред е само на телефон. */
body.ws #pl-body[data-tab='seating'] .ws-shead-sub:has(.ws-seatbar-in) {
  overflow: visible;
}
/* „Печат / PDF“ е в лентата – в тънкия ред на редактора само извън „Цял екран“ не се повтаря. */
body.ws:not(.sl-fs) #pl-body[data-tab='seating'] > .ws-stop ~ .sl-editor .sl-head .sl-print {
  display: none;
}
@media (max-width: 760px) {
  body.ws #pl-body[data-tab='seating'] .ws-shead-sub:has(.ws-seatbar-in) {
    overflow-x: auto;
    scrollbar-width: none;
    min-height: 44px;
  }
  body.ws #pl-body[data-tab='seating'] .ws-seatbar-in {
    flex-wrap: nowrap;
  }
}
body.ws:not(.sl-fs) #pl-body[data-tab='seating'] > .ws-stop ~ .sl-editor .sl-head:not(:has(.sl-head-actions > :not(.sl-print))) {
  display: none;
}

/* D4-25: Сайт на телефон – „Запази чернова“ и „Публикувай“ по 50 % в един ред (TASTE CTA BUTTON WRAP BAN); лентата
   е залепена над долното меню, както в Покана; подсказката е в раздела, тук остава само състоянието на достъпа. */
@media (max-width: 760px) {
  body.ws .pls-savebar {
    flex-wrap: wrap;
    gap: 8px;
  }
  body.ws .pls-savebar > .pls-savebar-info {
    flex: 1 1 100%;
  }
  body.ws .pls-savebar .pls-savebar-info > .muted {
    display: none;
  }
  body.ws .pls-savebar .pls-access-state {
    display: flex;
    flex-wrap: wrap;
    gap: 2px 12px;
    margin: 0;
    font-size: 12px;
  }
  body.ws .pls-savebar .pl-invite-save {
    display: flex;
    flex: 1 1 100%;
    flex-wrap: nowrap;
    gap: 8px;
  }
  body.ws .pls-savebar .pl-invite-save > button,
  body.ws .pls-savebar .pl-invite-save > #pls-publish {
    flex: 1 1 0;
    min-width: 0;
    justify-content: center;
  }
  body.ws .pls-savebar .pl-invite-save > .pli-peek-bar:not([hidden]) {
    flex: 0 0 44px;
  }
  /* Секциите: превключвател + етикет на цялата ширина, „⋯“ вдясно. */
  body.ws #planner .pls-move-more .ws-menu {
    right: 0;
    left: auto;
  }
}

/* D4-27 / D4-07: График на деня – етикетите на полетата без главни и разредка (EYEBROW RESTRAINT), стъпката без
   златната черта вляво (craft-floor: цветна лява рамка над 1 px), радиус 12 като останалите карти. */
body.ws .dp-field > span {
  font: 500 13px/18px var(--font-body);
  letter-spacing: 0;
  text-transform: none;
  color: var(--ink-muted);
}
body.ws .dp-step,
body.ws .dp-step.is-fixed,
body.ws .dp-step.is-par {
  border: 1px solid var(--line);
  border-radius: var(--ws-radius-md);
}
body.ws .dp-step.is-par {
  border-style: dashed;
}
body.ws .dp-step-sum,
body.ws .dp-step-expand {
  display: none;
}
/* Телефон: стъпката е ред от ~64 px (час · име · времетраене и място · вкл./изкл. · разгъване); полетата – при
   разгъване на място (UUPM progressive-disclosure; TASTE 4.9 дълги списъци). Пътуванията – също. */
@media (max-width: 760px) {
  body.ws .dp-step {
    margin-bottom: 8px;
    padding: 8px 4px 8px 10px;
  }
  body.ws .dp-step-main {
    grid-template-columns: 52px minmax(0, 1fr) auto 44px;
    grid-template-areas:
      'time label switch exp'
      'time sum switch exp';
    column-gap: 8px;
    row-gap: 0;
  }
  body.ws .dp-step-main > .dp-step-time {
    grid-area: time;
    align-self: center;
    min-width: 0;
    padding: 4px 0;
    font-size: 14px;
  }
  body.ws .dp-step-main > .dp-step-label {
    grid-area: label;
    order: 0;
    min-height: 28px !important;
    padding: 2px 4px;
    font-size: 16px;
    line-height: 22px;
    text-overflow: ellipsis;
  }
  body.ws .dp-step-main > .dp-step-sum {
    display: block;
    grid-area: sum;
    overflow: hidden;
    padding: 0 4px;
    font: 500 12px/16px var(--font-body);
    color: var(--ink-muted);
    white-space: nowrap;
    text-overflow: ellipsis;
  }
  body.ws .dp-step-main > .dp-switch {
    grid-area: switch;
    grid-column: auto;
    align-self: center;
  }
  body.ws .dp-step-expand,
  body.ws #planner .dp-step-expand,
  body.ws main .dp-step-expand {
    display: grid;
    grid-area: exp;
    place-items: center;
    width: 44px;
    height: 44px;
    min-height: 44px;
    margin: 0;
    padding: 0;
    border: 0;
    background: none;
    box-shadow: none;
    color: var(--ink-muted);
  }
  body.ws .dp-step-expand svg {
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
    transition: transform var(--ws-dur-2) var(--ws-ease);
  }
  body.ws .dp-step-expand[aria-expanded='true'] svg {
    transform: rotate(180deg);
  }
  body.ws .dp-step.is-open .dp-step-sum {
    display: none;
  }
  body.ws .dp-step.is-open .dp-step-main {
    grid-template-areas: 'time label switch exp';
  }
  body.ws .dp-step:not(.is-open) > :is(.dp-step-opts, .dp-step-place, .dp-step-note) {
    display: none;
  }
  body.ws .dp-travel-main {
    grid-template-columns: auto auto minmax(0, 1fr) auto 44px;
  }
  body.ws .dp-travel:not(.is-open) > :is(.dp-step-opts, .dp-travel-info) {
    display: none;
  }
  /* Планът вдясно повтаря стъпките – на телефон остават заглавието с началото и края и предупрежденията. */
  body.ws .dp-plan .dp-timeline {
    display: none;
  }
}
@media (prefers-reduced-motion: reduce) {
  body.ws .dp-step-expand svg {
    transition: none;
  }
}
@media (max-width: 760px) {
  body.ws .dp-step-main > .dp-step-time:empty {
    visibility: hidden;
  }
  /* „+ Точка“ е плаващият бутон – бутонът в края на списъка не се повтаря (TASTE NO DUPLICATE CTA INTENT). */
  body.ws:has(#plan-page .ws-fab) #client-planner .dp-add {
    display: none;
  }
  body.ws #plan-page .ws-kpi--wide .ws-kpi-value {
    white-space: nowrap;
  }
}

/* D4-30: Традиции – по-къса страница: описанието до 3 реда + „Още“, етапът е малък чип, етапите в един ред с
   превъртане и избледняване, картите без сянка (D4-07). Поведението на „Добави към моите“ не е променено. */
body.ws #planner .plt-card {
  box-shadow: none;
}
body.ws #planner .plt-stage-chip {
  display: inline-flex;
  justify-self: start;
  align-self: flex-start;
  width: auto;
}
body.ws #planner .plt-desc:not(.is-open) {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}
body.ws #planner .plt-more {
  align-self: flex-start;
  min-height: 32px;
  margin-top: -4px;
  padding: 0;
  font-size: 13px;
}
body.ws #planner .plt-more[hidden] {
  display: none;
}
@media (max-width: 760px) {
  body.ws #planner .plt-stages {
    flex-wrap: nowrap;
    margin: 0 -16px;
    padding: 0 16px;
    overflow-x: auto;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
    -webkit-mask-image: linear-gradient(90deg, #000 88%, transparent);
    mask-image: linear-gradient(90deg, #000 88%, transparent);
  }
  body.ws #planner .plt-stages > button {
    flex: none;
    scroll-snap-align: start;
  }
  body.ws #planner .plt-grid {
    gap: 12px;
  }
  body.ws #planner .plt-card {
    padding: 16px;
  }
  body.ws #planner .plt-add {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px 12px;
  }
}
body.ws #planner .plt-task-short {
  display: none;
}
/* Телефон: картата е ~170 px – етапът като тих ред (скрит, когато е избран етап), описание до 2 реда, а „Още“,
   „Със задача“ (същата отметка, включена по подразбиране; пълният текст е за екранните четци) и „Добави към моите“
   в един ред. */
@media (max-width: 760px) {
  body.ws #planner .plt-card {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px 8px;
    padding: 12px 16px;
  }
  body.ws #planner .plt-card > :is(.plt-stage-chip, h3, .plt-desc, .pl-chip) {
    flex: 1 1 100%;
  }
  body.ws #planner .plt-card .plt-stage-chip {
    min-height: 0;
    padding: 0;
    border: 0;
    background: none;
    font: 500 12px/16px var(--font-body);
    color: var(--ink-muted);
  }
  body.ws #planner .plt-card.is-staged .plt-stage-chip {
    display: none;
  }
  body.ws #planner .plt-card h3 {
    font-size: 17px;
    line-height: 22px;
  }
  body.ws #planner .plt-desc:not(.is-open) {
    -webkit-line-clamp: 2;
  }
  body.ws #planner .plt-card .plt-desc {
    font-size: 14px;
    line-height: 20px;
  }
  body.ws #planner .plt-more {
    flex: none;
    min-height: 44px;
    margin: 0;
  }
  body.ws #planner .plt-card .plt-add {
    flex: 1 1 auto;
    flex-wrap: nowrap;
    justify-content: flex-end;
    margin: 0 0 0 auto;
  }
  body.ws #planner .plt-card .plt-add .check {
    flex: none;
    font-size: 13px;
    white-space: nowrap;
  }
  body.ws #planner .plt-task-long {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
  }
  body.ws #planner .plt-task-short {
    display: inline;
  }
  body.ws #planner .plt-card .plt-add > button {
    flex: none;
    min-height: 44px;
    padding: 0 14px;
    font-size: 13px;
    white-space: nowrap;
  }
}
body.ws #planner .plt-group {
  display: none;
}
@media (max-width: 760px) {
  body.ws #planner .plt-group {
    display: block;
    margin: 12px 0 0;
    font: 600 15px/20px var(--font-body);
    color: var(--ink);
  }
  body.ws #planner .plt-card .plt-stage-chip {
    display: none;
  }
  body.ws #planner .plt-card .plt-add {
    gap: 8px;
  }
  body.ws #planner .plt-card .plt-add .check {
    gap: 6px;
  }
  body.ws #planner .plt-card .plt-add > button {
    padding: 0 12px;
  }
}
@media (max-width: 400px) {
  body.ws #planner .plt-card {
    padding: 12px 14px;
  }
  body.ws #planner .plt-card .plt-add > button {
    padding: 0 10px;
  }
}

/* D4-34: Календар – числото на деня в „Предстоящи“ е по-тъмно (sage върху mint беше 4.03:1; Lora 22 px не е „голям
   текст“) – смес 45 % цвят / 55 % мастило дава ≥ 7:1 за всички видове; месецът и дните от седмицата – 12 px
   (--ws-fs-min, D4-06). UUPM color-contrast, readable-font-size. */
body.ws #planner .plc-upcoming .plc-date strong {
  color: color-mix(in srgb, var(--k, var(--gold)) 45%, var(--ink));
}
body.ws #planner .plc-upcoming .plc-k-task .plc-date strong {
  color: var(--success);
}
body.ws #planner .plc-date span,
body.ws #planner .plc-dow {
  font-size: var(--ws-fs-min);
  letter-spacing: 0.04em;
}

/* D4-18: Задачи – редът ~64 px: „Редактирай“ е иконка „⋯“ 44×44 вдясно на реда (не отделен ред); на компютър –
   текстов бутон, както досега. Завършените на телефон са свити зад „Завършени (N)“. Клик върху заглавието отмята
   задачата (решение на собственика, 14.10) – не е променено. UUPM progressive-disclosure, touch-density. */
body.ws #planner .ws-task-edit .ws-task-edit-ico {
  display: none;
}
body.ws #planner .ws-task-donerow {
  display: none;
}
@media (max-width: 760px) {
  body.ws #planner .ws-task {
    grid-template-columns: 44px minmax(0, 1fr) auto;
    padding: 4px 0;
  }
  body.ws #planner .ws-task-side {
    grid-column: 3;
    grid-row: 1;
    justify-content: flex-end;
    gap: 4px;
    padding-left: 0;
  }
  body.ws #planner .ws-task-edit {
    display: grid;
    place-items: center;
    width: 44px;
    min-width: 44px;
    height: 44px;
    padding: 0;
    border: 0;
    background: none;
    box-shadow: none;
  }
  body.ws #planner .ws-task-edit .ws-task-edit-ico {
    display: block;
    width: 20px;
    height: 20px;
  }
  body.ws #planner .ws-task-edit .ws-task-edit-l {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
  }
  body.ws #planner .ws-task-donerow {
    display: block;
    border-top: 1px solid var(--ws-divider);
  }
  body.ws #planner .ws-task-donerow .ws-link {
    gap: 6px;
    padding-left: 52px;
    font-size: 13px;
  }
  body.ws #planner .ws-task-donerow .ws-link svg {
    width: 16px;
    height: 16px;
    transition: transform var(--ws-dur-2) var(--ws-ease);
  }
  body.ws #planner .ws-task-donerow [aria-expanded='true'] svg {
    transform: rotate(180deg);
  }
  body.ws #planner .pl-task-list:not(.is-done-open) > .ws-task-donerow ~ .ws-task {
    display: none;
  }
}
/* D4-19: търсенето в Задачи – на цялата ширина на колоната, етикетът вляво. */
body.ws #planner .ws-tasktools .ws-field {
  text-align: start;
}
body.ws #planner .ws-tasktools .ws-field :is(input[type='search'], .ws-field-control) {
  width: 100%;
}
body.ws #planner .plt-searchrow {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: end;
}
body.ws #planner .plt-searchrow:has(> .plt-filters-btn:not([hidden])) {
  grid-template-columns: minmax(0, 1fr) auto;
}
body.ws #planner .plt-searchrow > .ws-field {
  justify-items: stretch;
  align-items: stretch;
  text-align: start;
}
body.ws #planner .plt-searchrow .ws-search-box {
  width: 100%;
}
@media (min-width: 761px) {
  body.ws #planner .plt-searchrow {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* D4-23: Гости на 761–1023 – „Импорт“ и „Експорт“ са в „⋯“ (заглавието не се реже), сегментът се превърта
   хоризонтално с избледняване и не застъпва лупата, името има място (UUPM truncation-strategy, horizontal-scroll). */
@media (max-width: 1023px) {
  body.ws .ws-from-1024,
  body.ws #planner .ws-from-1024 {
    display: none;
  }
}
@media (min-width: 1024px) {
  body.ws .ws-below-1024,
  body.ws #planner .ws-below-1024 {
    display: none;
  }
}
@media (min-width: 761px) and (max-width: 1023px) {
  body.ws .plg-seg {
    flex: 1 1 auto;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scrollbar-width: none;
  }
  body.ws .plg-seg::-webkit-scrollbar {
    display: none;
  }
  body.ws .plg-seg:not(.is-end) {
    -webkit-mask-image: linear-gradient(to right, black calc(100% - 28px), transparent);
    mask-image: linear-gradient(to right, black calc(100% - 28px), transparent);
  }
  /* Колоната „Покана“ е само иконка – мястото отива за името (таблицата е table-layout: fixed). */
  body.ws .plg-w-iv {
    width: 72px;
  }
  body.ws .plg-w-ppl {
    width: 56px;
  }
}
/* D4-24: състоянието и поканата в Гости на телефон – цел ≥ 44 px без промяна на вида. */
@media (pointer: coarse), (max-width: 760px) {
  body.ws #planner :is(.plg-status-btn, .plg-inv) {
    position: relative;
  }
  body.ws #planner :is(.plg-status-btn, .plg-inv)::after {
    content: '';
    position: absolute;
    inset: -14px -6px;
  }
}

/* D4-33: Съобщения – полето за писане е част от картата (долните ъгли закръглени, без изтичане), празният разговор
   е ред „ws-empty--inline“ (≥ 120 px, не сиво поле от 240 px), имейлът на координатора е бутон 44 px. */
body.ws #planner .plm-chat {
  overflow: clip;
}
body.ws #planner .plm-compose {
  border-radius: 0 0 var(--ws-radius-md) var(--ws-radius-md);
  background: var(--paper);
}
body.ws #planner .plm-thread.is-empty {
  justify-content: center;
  min-height: 120px;
  background: none;
}
body.ws #planner .plm-coord-mail {
  align-self: flex-start;
  gap: 8px;
  margin-top: 8px;
}
body.ws #planner .plm-coord-mail svg {
  width: 18px;
  height: 18px;
}
@media (max-width: 760px) {
  body.ws #planner .plm-chat {
    overflow: visible;
  }
}

/* D4-36 / D4-14: Доставчици на телефон – без „—“ за празни стойности (празната клетка е „няма“ за екранните
   четци и не се рисува), чипът на договора е под категорията (не долепен), „Обади се“/„Имейл“ по 50 % само с данни. */
@media (max-width: 760px) {
  body.ws #planner .plp-vtable.ws-table tbody tr > td:is(.plp-v-arr, .plp-v-sum):has(> .plp-none),
  body.ws #planner .plp-vtable.ws-table tbody tr > td.plp-v-contact:not(:has(a)) {
    display: none;
  }
  body.ws #planner .plp-vtable.ws-table tbody tr > .plp-v-contract {
    grid-column: 1 / -1;
    grid-row: 3;
    justify-self: start;
    margin-top: 4px;
  }
  body.ws #planner .plp-vtable.ws-table tbody tr > .plp-v-cat {
    grid-column: 1 / -1;
  }
  body.ws #planner .plp-c-btns {
    display: flex;
    gap: 8px;
    margin-top: 4px;
  }
}

/* D4-39: лентата на напредъка в „Денят“ – transform: scaleX вместо width (само в портала; публичната страница на
   линка за деня не се променя). MOTION: само transform/opacity, 140–220 ms. */
body.ws .do-bar i {
  width: 100% !important;
  transform: scaleX(var(--do-p, 0));
  transform-origin: left center;
  transition: transform 220ms var(--ws-ease);
}
@media (prefers-reduced-motion: reduce) {
  body.ws .do-bar i {
    transition: none;
  }
}

/* D4-07: една форма на повърхностите – карти 12 px (hero на Таблото остава 16), без сенки на картите в разделите и без
   цветна лява рамка над 1 px в клиентските бележки (TASTE SHAPE CONSISTENCY LOCK; UUPM elevation-consistent;
   IMP craft-floor). Редовете в Гости с черта по отговор са решение на собственика – не се пипат. */
body.ws #planner :is(.do-card, .do-share, .do-empty, .plc-main, .plc-count, .plc-upcoming, .pls-share, .pls-sections) {
  border-radius: var(--ws-radius-md);
}
body.ws #planner .pl-template {
  border-radius: var(--ws-radius-md);
}
body.ws #planner :is(.plmn-sec, .pli-comment, .plq-note-ro, .pl-trust-note, .pl-partner-prompt, .psr-msg) {
  border: 1px solid var(--line);
  border-left-width: 1px;
  border-left-color: var(--line);
}
body.ws #planner :is(.pli-comment, .plq-note-ro, .pl-trust-note, .pl-partner-prompt, .psr-msg) {
  background: var(--ws-accent-wash);
}
body.ws #planner .pl-count {
  border-top: 1px solid var(--line);
  border-radius: var(--ws-radius-md);
}

/* D4-10: един ред бутони във всички диалози – „Отказ“ първи и вляво, второстепенните в средата, главното най-вдясно;
   на телефон 50/50 (както в „Нова задача“). UUPM navigation-consistency. */
body.ws dialog.ws-dialog .pl-actions:has(> [id$='-cancel']) > [id$='-cancel'] {
  order: -1;
}
body.ws dialog.ws-dialog .pl-actions:has(> [id$='-cancel']) > :is(.primary, .ws-btn--primary) {
  order: 9;
}
@media (min-width: 761px) {
  body.ws dialog.ws-dialog .pl-actions:has(> [id$='-cancel']) {
    justify-content: flex-end;
  }
}

/* D4-31: Вдъхновение без идеи – на цял ред, вътрешно до 560 px; „+ Снимка“ главно, „+ Линк“ и „+ Бележка“ в един ред. */
body.ws #pl-body > .pli-empty-ws {
  grid-column: 1 / -1;
}
body.ws #planner .pli-empty-ws > * {
  max-width: 560px;
}
body.ws #planner .pli-empty-ws .ws-empty-chips {
  flex-wrap: nowrap;
}
body.ws #planner .pli-empty-ws .ws-empty-chips .ws-btn svg {
  width: 16px;
  height: 16px;
}

/* D4-06: под 12 px няма текст (--ws-fs-min): заглавията на таблиците, групите в менюто, етикетите в Гости, надписът
   в hero на Таблото, датите в срещите и „фиксиран“ в График на деня. Броячите-значки остават. UUPM readable-font-size. */
body.ws .ws-table thead th,
body.ws #planner .plg-table thead th,
body.ws .ws-sec-title,
body.ws .plg-tag,
body.ws .pdb-eyebrow,
body.ws .pdb-meet-date span,
body.ws .dp-row strong em,
body.ws :is(.plan-event small, .plan-event-head small) {
  font-size: var(--ws-fs-min);
}

/* D4-37: Събитие – „Избери снимка“ и „Премахни“ в един ред с 8 px; премахването е червена иконка 44 px с
   потвърждение (UUPM touch-spacing, destructive-emphasis). */
body.ws #planner .pl-photo-acts {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 8px;
}
body.ws #planner .pl-photo-acts > .button {
  margin: 0;
}
body.ws #planner .pl-photo-del {
  width: 44px;
  height: 44px;
  min-height: 44px;
  color: var(--danger);
}
body.ws #planner .pl-photo-del svg {
  width: 20px;
  height: 20px;
}

/* D4-32: Стил на телефон – „Запази стила“ е в лента, залепена над долното меню (както в Покана и Сайт). */
@media (max-width: 760px) {
  body.ws #planner .pl-style .pl-actions:has(> #pl-style-save) {
    position: sticky;
    bottom: calc(var(--ws-tabbar-h) + env(safe-area-inset-bottom));
    z-index: 5;
    margin: 16px -16px -16px;
    padding: 12px 16px;
    border-top: 1px solid var(--line);
    background: var(--paper);
  }
  body.ws #planner .pl-style .pl-actions > #pl-style-save {
    flex: 1 1 auto;
  }
}

/* D4-26: Покана и Сайт на телефон – рамката с прегледа долу не се рисува; прегледът е в листа от „Преглед“ (окото в
   лентата), т.е. само когато редакторът е в режим „преглед на цял екран“. */
@media (max-width: 760px) {
  body.ws #pl-body[data-tab='site'] .pl-invite-editor:not(.pli-full) .pl-invite-preview-wrap {
    display: none;
  }
}
body.ws #planner :is(.pls-broadcast, .plmem-bc)[hidden] {
  display: none;
}

/* D4-35: Оферти и документи – всеки раздел е карта като в останалите раздели (заглавие Lora 20/24, без линия под
   него); празните вътре са по D4-08 без собствена рамка. UUPM consistency. */
body.ws #planner .plo-block {
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: var(--ws-radius-md);
  background: var(--paper);
}
body.ws #planner .plo-sec-head {
  padding-bottom: 0;
  border-bottom: 0;
}
body.ws #planner .plo-sec-head h2 {
  font: 500 20px/24px var(--font-display);
}
body.ws #planner .plo-block :is(.ws-empty--section, .mine-empty) {
  border: 0;
  background: none;
  box-shadow: none;
}
@media (max-width: 760px) {
  body.ws #planner .plo-block {
    padding: 16px;
  }
}
body.ws #planner #plr-host.plo-block .mine-empty {
  border: 0;
  background: none;
}

/* ===== Поправки след QA (qa-redesign-final, usability-redesign-final) ===== */
/* QA-RD-01: Покана/Сайт на телефон – бутоните в лентата за запис са по съдържанието си („Публикувай промените“ не се
   реже) и при голям шрифт „Публикувай“ отива на свой ред, вместо да излиза от лентата. */
@media (max-width: 760px) {
  body.ws .pli-savebar .pl-invite-save {
    flex-wrap: wrap;
  }
  body.ws .pli-savebar .pl-invite-save > button:not(.pli-peek-bar),
  body.ws .pls-savebar .pl-invite-save > #pls-publish {
    flex: 1 0 auto;
    width: auto;
    min-width: 0;
    max-width: 100%;
    padding-inline: 14px;
  }
}
.pli-pub-short {
  display: none;
}
@media (max-width: 600px) {
  .pli-pub-long {
    display: none;
  }
  .pli-pub-short {
    display: inline;
  }
}
/* QA-RD-01: KPI със стойност-дума – без пренасяне посред думата; на телефон размерът следва ширината на картата. */
body.ws :is(#planner, main) .ws-kpi--word .ws-kpi-value {
  overflow-wrap: normal;
  word-break: normal;
  hyphens: none;
}
@media (max-width: 760px) {
  body.ws :is(#planner, main) .ws-kpi--word {
    container-type: inline-size;
  }
  body.ws :is(#planner, main) .ws-overview .ws-kpi--word .ws-kpi-value {
    font-size: clamp(12px, 14cqi, 20px);
    line-height: 1.25;
    white-space: nowrap;
  }
}
/* QA-RD-02: „Отговор от сайта“ на телефон – плъзгачът остава 52×30 (общото правило за отметките на тъч го правеше
   20×20, а флексът го свиваше), редът е на цялата ширина. */
@media (pointer: coarse), (max-width: 760px) {
  body.ws #planner .psr-setting label.psr-switch:has(> input) {
    display: flex;
    width: 100%;
  }
  body.ws #planner .psr-switch > input[role='switch'] {
    flex: 0 0 auto;
    width: 52px;
    height: 30px;
  }
}
/* UT-RD-01: „Гости“ на телефон – отговорът в реда („Чака“) е истинска цел ≥ 44×44 над името, отваря избора
   „Потвърди / Чака / Откажи“; менюто се отваря надясно-подравнено и не излиза от екрана. */
@media (max-width: 760px) {
  body.ws #planner .plg-table tr.pl-guest-row > .plg-c-status {
    position: relative;
    z-index: 1;
    pointer-events: auto;
  }
  body.ws #planner .plg-table tr.pl-guest-row .plg-status-btn::after {
    inset: -16px -10px;
  }
  body.ws #planner .plg-table tr.pl-guest-row > .plg-c-status:has(.ws-menu:not([hidden])) {
    z-index: 5;
  }
  body.ws #planner .plg-table tr.pl-guest-row .plg-status-wrap > .ws-menu {
    right: -40px;
    left: auto;
  }
}
/* UT-RD-03: менюто на госта – малък етикет в подреда (вижда се и на телефон, преди многоточието). */
body.ws .plg-tag--menu {
  display: inline-block;
  flex: 0 0 auto;
  max-width: 60%;
  overflow: hidden;
  background: var(--mint);
  color: var(--ink);
  line-height: 20px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
@media (max-width: 760px) {
  /* На телефон подредът с меню се пренася: страната до отговора (както досега), менюто – на свой ред отдолу, на
     цялата ширина (под отговора няма нищо), а не „Вегет…“ до „На б…“. */
  body.ws #planner .plg-table .plg-meta:has(> .plg-tag--menu) {
    flex-wrap: wrap;
    row-gap: 4px;
  }
  body.ws #planner .plg-table .plg-meta:has(> .plg-tag--menu) > .plg-meta-t {
    flex: 1 0 100%;
  }
  body.ws #planner .plg-table .plg-meta > .plg-tag--menu {
    order: 1;
    max-width: 100%;
  }
  body.ws #planner .plg-table tr.pl-guest-row:not(.plg-person-row) .plg-meta:has(> .plg-meta-t) > .plg-tag--menu {
    max-width: calc(100% + var(--plg-cluster, 156px));
  }
}
body.ws .ws-menu {
  max-width: calc(100vw - 16px);
}
/* UT-RD-06: известията в горния слой (popover) – без стиловете на браузъра за popover; #portal-status в работната
   среда е само носител на текста (известието е тостът). */
#ws-toasts[popover] {
  inset: auto;
  margin: 0;
  padding: 0;
  overflow: visible;
  border: 0;
  background: transparent;
  color: inherit;
}
#ws-toasts.ws-toasts[popover] {
  left: calc(var(--ws-side, 0px) + 24px);
  bottom: 24px;
}
@media (max-width: 760px) {
  #ws-toasts.ws-toasts[popover] {
    left: 16px;
    right: 16px;
    top: calc(12px + env(safe-area-inset-top));
    bottom: auto;
  }
}
body.ws #portal-status {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}
/* Импорт на гости: долната лента („Импортирай“) е залепена за долния ръб на диалога в работната среда (отстъпите
   на диалога тук са 24 px, на телефон 16 px – старите -28 px я избутваха извън екрана и встрани). */
body.ws dialog.ws-dialog .plg-imp-bar {
  bottom: -24px;
  z-index: 1;
  margin: 8px -24px 0;
  padding: 12px 24px 24px;
  background: var(--paper);
}
@media (max-width: 760px) {
  body.ws dialog.ws-dialog .plg-imp-bar {
    bottom: -16px;
    margin: 8px -16px 0;
    padding: 8px 16px calc(16px + env(safe-area-inset-bottom));
  }
  /* Помощникът: при избрани гости лентата за избраните е отдолу – „+ Гост / Импорт“ се крие (иначе я закрива). */
  body.ws #planner:has(.plg-bulk-wrap .ws-bulkbar:not([hidden])) .plg-helper-bar {
    display: none;
  }
}
/* QA-RD-05: новата точка в „График на деня“ светва за миг (както новата задача). */
body.ws .dp-step {
  transition: background-color 600ms var(--ws-ease);
}
body.ws .dp-step.is-new {
  background: var(--ws-accent-soft);
}
/* UT-RD-05: плочката „Бюджет“ на таблото е <button> (отваря „Събитие“ на полето за бюджет) – общите правила за
   бутоните в планера ѝ даваха капсулен радиус; всички плочки са с един радиус. */
body.ws #planner button.ws-stat {
  border-radius: var(--ws-radius-md);
}
/* UT-RD-07: под последния ред има място за плаващия бутон И долното меню (56 + 56 + отстъпи) – FAB не закрива текст. */
@media (max-width: 760px) {
  body.ws #pl-body:has(> .ws-fab) {
    padding-bottom: calc(56px + 104px + env(safe-area-inset-bottom));
  }
}

/* ===== fix/small-planner (15.10.2026) – UT-RD-10 Задачи на телефон =====
   – KPI картите (2×2, ~240 px преди първата задача) са един ред таблетки с превъртане: число + етикет, без подреда;
   – отговорникът по подразбиране („Заедно“) не стои до заглавието (то вече не се пренася на 3–4 реда); друг отговорник –
     под заглавието; „⋯“ остава вдясно;
   – току-що отметнатата задача остава видима (зачертана) под „Завършени (N)“ до следващото отваряне.
   UUPM content-priority, touch-target 44; Taste – плътност; mobile-native – хоризонтален ред с scroll-snap. */
@media (max-width: 760px) {
  body.ws #pl-body[data-tab='tasks'] .ws-overview {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
    padding-bottom: 2px;
  }
  body.ws #pl-body[data-tab='tasks'] .ws-overview::-webkit-scrollbar {
    display: none;
  }
  body.ws #pl-body[data-tab='tasks'] .ws-overview > .ws-kpi {
    flex: none;
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
    min-height: 44px;
    padding: 10px 14px;
    border-radius: 999px;
    scroll-snap-align: start;
  }
  body.ws #pl-body[data-tab='tasks'] .ws-overview > .ws-kpi :is(.ws-kpi-meta, .ws-kpi-viz, .ws-kpi-pct) {
    display: none;
  }
  body.ws #pl-body[data-tab='tasks'] .ws-overview > .ws-kpi .ws-kpi-value {
    order: -1;
    font-size: 17px;
    line-height: 1;
  }
  body.ws #pl-body[data-tab='tasks'] .ws-overview > .ws-kpi .ws-kpi-label {
    font-size: 13px;
    line-height: 1;
    white-space: nowrap;
  }
  body.ws #planner .ws-task-side {
    display: contents;
  }
  body.ws #planner .ws-task .ws-task-edit {
    grid-column: 3;
    grid-row: 1;
    align-self: start;
  }
  body.ws #planner .ws-task :is(.pl-chip-button, .ws-task-side > .pl-chip) {
    grid-column: 2;
    grid-row: 2;
    justify-self: start;
    margin: -6px 0 2px 8px;
  }
  body.ws #planner .ws-task .pl-chip-button.is-together {
    display: none;
  }
  body.ws #planner .pl-task-list:not(.is-done-open) > .ws-task-donerow ~ .ws-task.is-just-done {
    display: grid;
  }
}

/* fix/small-planner – UT-RD-11: значката на масата в реда на госта – и за дълго име (до 40 знака) остава в реда:
   кръг за 1–2 знака, иначе „хапче“ до 8 em със „…“ (пълното име е в title). */
body.ws .plg-tbl {
  display: inline-block;
  width: auto;
  min-width: 26px;
  max-width: 8em;
  padding: 0 6px;
  border-radius: 999px;
  overflow: hidden;
  line-height: 24px;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
  vertical-align: middle;
}
@media (max-width: 760px) {
  body.ws .plg-tbl {
    width: auto;
    min-width: 20px;
    max-width: 6em;
    padding: 0 5px;
    line-height: 18px;
  }
}
/* UT-RD-15: помощникът на телефон – „Импорт“ е второстепенен (текстова връзка с иконка, ~1/3 от ширината), „+ Гост“ е
   главното действие; заглавието и подзаглавието се пренасят на два реда вместо „Гостите за „Ма…“. */
@media (max-width: 760px) {
  body.ws #planner .plg-helper-bar #plg-import {
    flex: 0 1 auto;
    min-width: 96px;
    border-color: transparent;
    background: none;
    box-shadow: none;
    color: var(--ws-accent-ink);
    font-weight: 500;
    text-decoration: underline;
    text-underline-offset: 3px;
  }
  body.ws #planner .plg-helper-bar #plg-add {
    flex: 1 1 auto;
  }
}
@media (max-width: 760px) {
  body.ws.pl-helper-mode #pl-body .ws-shead-title {
    display: -webkit-box;
    white-space: normal;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  }
  body.ws.pl-helper-mode #pl-body .ws-shead-title {
    font-size: 18px;
    line-height: 22px;
  }
}

/* UT-RD-14: малки визуални неточности.
   – Родното синьо „×“ в полетата за търсене (Задачи и др.) – в цвета на текста, 18 px, с цел в полето (Гостите имат свой
     бутон и там родното остава скрито).
   – Етапите в „Традиции“ на телефон започваха от ръба на екрана: прилепването (scroll-snap) пренебрегва отстъпа без
     scroll-padding. */
body.ws :is(#planner, main) input[type='search']::-webkit-search-cancel-button {
  -webkit-appearance: none;
  appearance: none;
  width: 18px;
  height: 18px;
  margin-left: 6px;
  background-color: var(--ink-muted);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M18 6 6 18M6 6l12 12'/%3E%3C/svg%3E") center / 16px no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M18 6 6 18M6 6l12 12'/%3E%3C/svg%3E") center / 16px no-repeat;
  cursor: pointer;
}
body.ws #planner .plg-search input::-webkit-search-cancel-button {
  display: none;
}
@media (max-width: 760px) {
  body.ws #planner .plt-stages {
    scroll-padding-inline: 16px;
  }
}

/* ===== fix/small-planner – UT-RD-13: „График на деня“ (клиентската страница) в новия стил =====
   – полетата: 44 px, рамка --line, радиус 8, 15 px текст, златен фокус; падащите менюта без родната стрелка (линейна
     стрелка в цвета на текста) – UUPM form-controls, touch-target; Taste – един език на полетата с другите раздели;
   – празното състояние – като wsEmptySection (без пунктирната кутия), бутонът до избора на вида;
   – и на компютър стъпката е ред (час · име · обобщение · вкл. · разгъване), полетата – при разгъване на място
     (както на телефон, D4-27): 15 точки ~5600 → ~2000 px. */
body.ws #client-planner :is(select, input[type='text'], input[type='number'], input[type='time'], input:not([type])):not(.dp-step-label) {
  min-height: 44px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: var(--ws-radius-sm);
  background-color: var(--paper);
  box-shadow: none;
  font: 400 15px/1.3 var(--font-body);
  color: var(--ink);
}
body.ws #client-planner select {
  -webkit-appearance: none;
  appearance: none;
  padding-right: 36px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23292725' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  background-size: 16px;
  cursor: pointer;
}
body.ws #client-planner :is(select, input):not(.dp-step-label):focus-visible {
  outline: none;
  border-color: var(--ws-accent);
  box-shadow: 0 0 0 3px var(--ws-accent-wash);
}
@media (hover: hover) and (pointer: fine) {
  body.ws #client-planner :is(select, input[type='text'], input[type='number'], input[type='time'], input:not([type])):not(.dp-step-label):hover {
    border-color: var(--line-strong);
  }
}
body.ws #client-planner label {
  font: 500 13px/1.4 var(--font-body);
  color: var(--ink-muted);
}
body.ws #client-planner .dp-start {
  display: grid;
  justify-items: center;
  gap: 8px;
  padding: 32px 16px;
  border: 0;
  background: none;
  text-align: center;
}
body.ws #client-planner .dp-start strong {
  font: 500 20px/28px var(--font-display);
  color: var(--ink);
}
body.ws #client-planner .dp-start p {
  max-width: 44ch;
  margin: 0;
  font: 400 14px/1.5 var(--font-body);
  color: var(--ink-muted);
}
body.ws #client-planner .dp-start-row {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  margin-top: 8px;
}
body.ws #client-planner .dp-start-row select {
  min-width: 180px;
}
@media (min-width: 761px) {
  body.ws #client-planner .dp-step-main {
    grid-template-columns: 64px minmax(0, 1fr) auto auto 44px;
    column-gap: 12px;
  }
  body.ws #client-planner .dp-step-main > .dp-step-sum {
    display: block;
    max-width: 320px;
    overflow: hidden;
    font: 500 13px/18px var(--font-body);
    color: var(--ink-muted);
    white-space: nowrap;
    text-overflow: ellipsis;
  }
  body.ws #client-planner .dp-step.is-open .dp-step-sum {
    visibility: hidden;
  }
  body.ws #client-planner .dp-step-expand {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    min-height: 44px;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: var(--ws-radius-sm);
    background: none;
    box-shadow: none;
    color: var(--ink-muted);
  }
  body.ws #client-planner .dp-step-expand svg {
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
    transition: transform var(--ws-dur-2) var(--ws-ease);
  }
  body.ws #client-planner .dp-step-expand[aria-expanded='true'] svg {
    transform: rotate(180deg);
  }
  body.ws #client-planner .dp-step:not(.is-open) > :is(.dp-step-opts, .dp-step-place, .dp-step-note) {
    display: none;
  }
  body.ws #client-planner .dp-travel-main {
    grid-template-columns: auto auto minmax(0, 1fr) auto 44px;
  }
  body.ws #client-planner .dp-travel:not(.is-open) > :is(.dp-step-opts, .dp-travel-info) {
    display: none;
  }
  @media (hover: hover) and (pointer: fine) {
    body.ws #client-planner .dp-step-expand:hover {
      background: var(--paper-sunk);
      color: var(--ink);
    }
  }
}

/* ---------- BIZ-40 „Моят стил в планера“: картата в „Стил“ и известието на таблото (EVENT-STYLE.md §6) ----------
   Превключвател 48×28 (цел ≥ 44 px с надписа), две мостри, които също превключват; цветовете на мострата „В моя
   стил“ – през CSSOM (--wsm-*). Включеният превключвател е в --ws-accent-deep (бяло ≥ 4.6:1). */
body.ws .wsm-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px 24px;
  align-items: start;
  max-width: 880px;
  margin-bottom: var(--ws-gap);
  padding: 24px;
}
body.ws #planner .wsm-card h2 {
  margin: 0;
  font: 500 24px/1.25 var(--font-display);
}
body.ws .wsm-card-text p {
  max-width: 60ch;
  margin: 8px 0 0;
  font-size: 14px;
  color: var(--ink-muted);
}
body.ws .wsm-card-text .wsm-who {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
  font-size: 13px;
  color: var(--ink);
}
body.ws .wsm-who svg {
  width: 16px;
  height: 16px;
  flex: none;
  color: var(--ws-accent-ink);
}
body.ws .wsm-card-text .wsm-note {
  color: var(--ink);
  font-weight: 500;
}
body.ws #planner .wsm-switch {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  min-height: 44px;
  padding: 0;
  border: 0;
  background: none;
  color: var(--ink);
  font: 600 14px/1.3 var(--font-body);
  cursor: pointer;
  touch-action: manipulation;
}
body.ws .wsm-track {
  position: relative;
  flex: none;
  width: 48px;
  height: 28px;
  border: 1.5px solid var(--line-strong);
  border-radius: var(--ws-radius-pill);
  background: var(--paper-sunk);
  transition:
    background-color var(--ws-dur-2) var(--ws-ease),
    border-color var(--ws-dur-2) var(--ws-ease);
}
body.ws .wsm-track::after {
  content: '';
  position: absolute;
  top: 3px;
  left: 3px;
  width: 19px;
  height: 19px;
  border-radius: 50%;
  background: var(--paper);
  box-shadow: 0 1px 3px rgba(41, 39, 37, 0.25);
  transition: transform var(--ws-dur-2) var(--ws-ease);
}
body.ws .wsm-switch[aria-checked='true'] .wsm-track {
  border-color: var(--ws-accent-deep);
  background: var(--ws-accent-deep);
}
body.ws .wsm-switch[aria-checked='true'] .wsm-track::after {
  transform: translateX(20px);
}
body.ws #planner :is(.wsm-switch, .wsm-thumb):disabled {
  cursor: default;
  opacity: 0.6;
}
body.ws #planner :is(.wsm-switch, .wsm-thumb):focus-visible {
  outline: none;
  border-radius: var(--ws-radius-sm);
  box-shadow: var(--ws-focus);
}
body.ws .wsm-compare {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
body.ws #planner .wsm-thumb {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
  min-width: 0;
  margin: 0;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: var(--ws-radius-md);
  background: var(--bg);
  color: var(--ink);
  text-align: left;
  cursor: pointer;
  touch-action: manipulation;
  transition: border-color var(--ws-dur-2) var(--ws-ease);
}
body.ws #planner .wsm-thumb[aria-pressed='true'] {
  border-color: var(--ws-accent);
  box-shadow: inset 0 0 0 1px var(--ws-accent);
}
body.ws .wsm-thumb-art {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  min-width: 0;
  gap: 6px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--paper);
}
body.ws .wsm-thumb-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-content: center;
  height: 64px;
  padding: 0 12px;
  overflow: hidden;
  border-radius: 8px;
}
body.ws .wsm-thumb-hero b {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body.ws .wsm-thumb-hero--mine {
  border: 1px solid var(--wsm-line, var(--gold-line));
  background: var(--wsm-paper, var(--cream));
}
body.ws .wsm-thumb-hero--mine b {
  padding-bottom: 2px;
  font: 400 22px/1.2 'Great Vibes', 'Lora', cursive;
  color: var(--wsm-names, var(--ink));
}
body.ws .wsm-thumb-hero--mine[data-wsm-script='serif'] b {
  font: italic 500 17px/1.2 var(--font-display);
}
body.ws .wsm-thumb-hero--lx {
  border: 1px solid var(--gold-line);
  background: var(--cream);
}
body.ws .wsm-thumb-hero--lx b {
  font: italic 500 15px/1.2 var(--font-display);
  color: var(--ink);
}
body.ws .wsm-thumb-bars {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 6px;
}
body.ws .wsm-thumb-bars span {
  position: relative;
  height: 26px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--paper);
}
body.ws .wsm-thumb-bars span::after {
  content: '';
  position: absolute;
  left: 6px;
  right: 40%;
  bottom: 6px;
  height: 3px;
  border-radius: 2px;
  background: var(--wsm-bar, var(--gold));
}
body.ws .wsm-thumb-cap {
  font-size: 13px;
  font-weight: 600;
}
body.ws .wsm-thumb-cap small {
  display: block;
  overflow: hidden;
  font-weight: 400;
  color: var(--ink-muted);
  text-overflow: ellipsis;
  white-space: nowrap;
}
body.ws .wsm-theme {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 12px;
  padding-top: 16px;
  border-top: 1px solid var(--ws-divider);
  font: 500 16px/1.3 var(--font-display);
}
body.ws .wsm-sw {
  display: flex;
  flex: none;
}
body.ws .wsm-sw span {
  width: 24px;
  height: 24px;
  margin-left: -7px;
  border: 2px solid var(--paper);
  border-radius: 50%;
  box-shadow: 0 0 0 1px var(--line);
}
body.ws .wsm-sw span:first-child {
  margin-left: 0;
}
@media (hover: hover) and (pointer: fine) {
  body.ws #planner .wsm-thumb:not(:disabled):not([aria-pressed='true']):hover {
    border-color: var(--ws-accent-line);
  }
}
@media (max-width: 760px) {
  body.ws .wsm-card {
    grid-template-columns: minmax(0, 1fr);
    padding: 20px;
  }
  body.ws #planner .wsm-switch {
    order: -1;
    justify-self: start;
  }
  body.ws .wsm-compare {
    gap: 8px;
  }
  body.ws #planner .wsm-thumb,
  body.ws .wsm-thumb-art {
    padding: 8px;
  }
  body.ws .wsm-thumb-hero--mine b {
    font-size: 18px;
  }
}
/* Известието на таблото: тихо, в картата на работната среда, с иконата в кръг на акцента. */
body.ws .wsm-banner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  padding: 10px 12px 10px 16px;
  border: 1px solid var(--ws-accent-line);
  border-radius: var(--ws-radius-md);
  background: var(--paper);
  font-size: 14px;
}
body.ws .wsm-banner-ico {
  display: grid;
  place-items: center;
  flex: none;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--ws-accent-soft);
  color: var(--ws-accent-ink);
}
body.ws .wsm-banner-ico svg {
  width: 16px;
  height: 16px;
}
body.ws #planner .wsm-banner p {
  flex: 1 1 220px;
  margin: 0;
}
body.ws .wsm-banner-acts {
  display: flex;
  align-items: center;
  gap: 4px 16px;
}
body.ws #planner .wsm-banner .ws-link {
  min-height: 44px;
  color: var(--ws-accent-ink);
}
body.ws #planner .wsm-banner-x {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: none;
  color: var(--ink-muted);
  cursor: pointer;
  touch-action: manipulation;
}
body.ws #planner .wsm-banner-x svg {
  width: 18px;
  height: 18px;
}
@media (max-width: 760px) {
  body.ws .wsm-banner-acts {
    width: 100%;
    padding-left: 44px;
  }
  body.ws .wsm-banner-x {
    margin-left: auto;
  }
}

/* ---------- fix/persona-ux (тест с персони, 19.10.2026) ----------
   Задачи: превключвателят „чии“ най-горе, „Вашите 3 следващи стъпки“, свитият „Целият списък (N)“, „Кой поема?“ с бързите
   бутони; помощникът – „Моите задачи“; гостите на помощника – броячите „Кой идва“ и голямото „Добави гост“. */
body.ws #planner .plt-who {
  display: flex;
  min-width: 0;
}
body.ws #planner .plt-who-seg {
  width: 100%;
}
body.ws #planner .plt-who-seg button {
  flex: 1 1 0;
  min-width: max-content;
}
body.ws .plt-who-n {
  min-width: 22px;
  padding: 0 6px;
  border-radius: var(--ws-radius-pill);
  background: var(--paper);
  color: var(--ink-muted);
  font-size: 12px;
  font-weight: 600;
  line-height: 20px;
  text-align: center;
}
body.ws #planner .plt-who-seg button[aria-pressed='true'] .plt-who-n {
  background: var(--ws-accent-soft);
  color: var(--ws-accent-ink);
}
body.ws #planner .plt-steps {
  gap: 8px;
  padding: 18px 20px 12px;
  border-color: var(--ws-accent-line);
  background: var(--ws-accent-wash);
}
body.ws #planner .plt-steps-title {
  margin: 0;
  font: 600 20px/28px var(--font-display);
  color: var(--ink);
}
body.ws #planner .plt-steps-list {
  display: grid;
  margin: 0;
  padding: 0;
  list-style: none;
}
body.ws #planner .plt-steps-list > .plt-step + .plt-step {
  border-top: 1px solid var(--ws-divider);
}
body.ws #planner .plt-step {
  grid-template-columns: 44px minmax(0, 1fr);
  padding: 8px 0;
}
body.ws #planner .plt-step-main {
  display: grid;
  gap: 2px;
  min-width: 0;
  padding: 2px 8px;
}
body.ws #planner .plt-step-main strong {
  font-size: 16px;
  font-weight: 600;
  line-height: 1.4;
  overflow-wrap: anywhere;
}
body.ws .plt-when {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
  font-size: 14px;
  line-height: 1.45;
  color: var(--ink-muted);
}
body.ws .plt-when .ws-ico {
  width: 15px;
  height: 15px;
}
body.ws #planner .is-late .plt-when {
  color: var(--ws-warn);
  font-weight: 600;
}
body.ws #planner .plt-step.is-done .plt-step-main strong {
  color: var(--ink-muted);
  text-decoration: line-through;
  text-decoration-color: var(--line-strong);
}
/* „Кой поема?“: под заглавието (втората колона), бутоните се пренасят. */
body.ws #planner .plt-take {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  grid-column: 2 / -1;
  padding: 0 8px 4px;
}
body.ws .plt-take-q {
  margin-right: 2px;
  font-size: 13px;
  font-weight: 600;
  color: var(--ws-accent-ink);
}
body.ws #planner .plt-take-btn {
  min-height: 36px;
  margin: 0;
  padding: 4px 14px;
  border: 1px solid var(--line);
  border-radius: var(--ws-radius-pill);
  background: var(--paper);
  box-shadow: none;
  color: var(--ink);
  font: 600 13px/1.2 var(--font-body);
}
@media (hover: hover) and (pointer: fine) {
  body.ws #planner .plt-take-btn:hover {
    border-color: var(--ws-accent-line);
    background: var(--ws-accent-soft);
  }
}
body.ws #planner .plt-take-btn:focus-visible {
  outline: none;
  box-shadow: var(--ws-focus);
}
@media (pointer: coarse), (max-width: 760px) {
  body.ws #planner .plt-take-btn {
    min-height: 44px;
  }
}
body.ws #planner .pl-chip-none {
  border-style: dashed;
}
/* „Целият списък (N)“ – свит под следващите стъпки; изборът се помни на устройството. */
body.ws #planner .plt-all {
  display: grid;
  gap: 16px;
  min-width: 0;
}
body.ws #planner .plt-all-toggle {
  justify-content: space-between;
  width: 100%;
  min-height: 52px;
  font-size: 15px;
}
body.ws #planner .plt-all-toggle .plt-all-chev {
  transform: rotate(90deg);
  transition: transform var(--ws-dur-2) var(--ws-ease);
}
body.ws #planner .plt-all-toggle[aria-expanded='true'] .plt-all-chev {
  transform: rotate(-90deg);
}
body.ws #planner .plt-all-list {
  display: grid;
  gap: 16px;
  min-width: 0;
}
body.ws #planner .plt-all-list[hidden] {
  display: none;
}
body.ws #planner .plt-month.is-late .ws-group-name {
  color: var(--ws-warn);
}
@media (prefers-reduced-motion: reduce) {
  body.ws #planner .plt-all-toggle .plt-all-chev {
    transition: none;
  }
}
/* Помощникът: „Моите задачи“ – бележката под заглавието. */
body.ws #planner .plt-hnote {
  grid-column: 2 / -1;
  display: grid;
  gap: 4px;
  padding: 0 8px 4px;
}
body.ws #planner .plt-hnote p {
  margin: 0;
  font-size: 14px;
  line-height: 1.5;
  color: var(--ink-muted);
  white-space: pre-line;
}
body.ws #planner .plt-hnote .ws-link {
  justify-self: start;
  min-height: 44px;
}
/* Гостите на помощника: броячите под заглавието и голямото „Добави гост“. */
body.ws #planner .plg-hcount {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 24px;
  margin: 4px 0 0;
}
body.ws #planner .plg-hcount-item {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin: 0;
}
body.ws .plg-hcount-n {
  font: 600 28px/1 var(--font-display);
  color: var(--ink);
}
body.ws .plg-hcount-l {
  font-size: 14px;
  color: var(--ink-muted);
}
body.ws .plg-hcount-yes .plg-hcount-l {
  font-weight: 600;
  color: var(--ink);
}
body.ws .plg-hcount-v {
  font-size: 15px;
  font-weight: 600;
  color: var(--ws-accent-ink);
}
body.ws #planner .plg-helper-bar .plg-helper-add {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 52px;
  padding: 0 28px;
  font-size: 16px;
}
body.ws #planner .plg-helper-bar .plg-helper-add {
  flex: 1 1 auto;
  white-space: nowrap;
}
body.ws #planner .plg-helper-add .ws-ico {
  width: 20px;
  height: 20px;
}
@media (max-width: 760px) {
  body.ws #planner .plg-helper-bar .plg-helper-add {
    min-height: 56px;
    font-size: 17px;
  }
}
body.ws #planner .plt-steps-list > .plt-step:first-child {
  border-top: 0;
}
/* Телефон: превключвателят 2 × 2 (не три реда); „Вашите 3 следващи стъпки“ – преди търсенето. */
@media (max-width: 760px) {
  body.ws #planner .plt-who-seg {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  body.ws #planner .plt-who-seg button {
    min-width: 0;
    padding: 6px 10px;
  }
}
/* (На телефон контейнерът pl не е включен – затова и медийна заявка.) */
@media (max-width: 760px) {
  body.ws #pl-body[data-tab='tasks'] > .pl-task-aside {
    order: 1;
  }
  body.ws #pl-body[data-tab='tasks'] > .pl-task-groups {
    order: 2;
  }
}
@container pl (max-width: 899px) {
  body.ws #pl-body[data-tab='tasks'] > .pl-task-aside {
    order: 1;
  }
  body.ws #pl-body[data-tab='tasks'] > .pl-task-groups {
    order: 2;
  }
}
/* Компютър: следващите стъпки са в дясната колона над бързото добавяне; филтрите вляво – в два реда. */
@container pl (min-width: 900px) {
  body.ws #pl-body[data-tab='tasks']:has(> .plt-steps) > .pl-task-aside {
    grid-column: 1 / span 4;
    grid-row: span 2;
  }
  body.ws #pl-body[data-tab='tasks'] > .plt-steps,
  body.ws #pl-body[data-tab='tasks']:has(> .plt-steps) > .pl-task-groups {
    grid-column: 5 / span 8;
  }
}
/* Помощникът на телефон с долното меню: „Добави гост“ е над него (иначе лентата го закрива). */
@media (max-width: 760px) {
  body.ws.has-lux-tabbar.pl-helper-mode .plg-helper-bar {
    bottom: calc(var(--ws-tabbar-h) + env(safe-area-inset-bottom));
    padding-bottom: 10px;
    border-bottom: 1px solid var(--line);
  }
  body.ws.has-lux-tabbar.pl-helper-mode {
    padding-bottom: calc(var(--ws-tabbar-h) + 84px + env(safe-area-inset-bottom));
  }
}
@media (max-width: 760px) {
  body.ws #planner .plt-take .plt-take-q {
    flex-basis: 100%;
  }
  body.ws #planner .plt-take-btn {
    padding: 4px 12px;
  }
}
/* Помощникът на телефон: до голямото „Добави гост“ – само „Импорт“ (без да се чупи на три реда). */
@media (max-width: 760px) {
  body.ws #planner .plg-helper-bar .plg-imp-long {
    display: none;
  }
  body.ws #planner .plg-helper-bar .plg-imp-short {
    display: inline;
  }
}