/* Self-hosted web fonts (Lora + Golos Text) — replaces Google Fonts (152-FZ /
   RU-availability). Subsets: cyrillic, cyrillic-ext, latin, latin-ext. Generated. */
@font-face{font-family:'Lora';font-style:italic;font-weight:400;font-display:swap;src:url("../fonts/lora-400i-cyrillic-ext.890c0a6df4b7.woff2") format('woff2');unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;}
@font-face{font-family:'Lora';font-style:italic;font-weight:400;font-display:swap;src:url("../fonts/lora-400i-cyrillic.e18c86823e79.woff2") format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;}
@font-face{font-family:'Lora';font-style:italic;font-weight:400;font-display:swap;src:url("../fonts/lora-400i-latin-ext.059c98dd80a1.woff2") format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Lora';font-style:italic;font-weight:400;font-display:swap;src:url("../fonts/lora-400i-latin.e7ae818b8c7b.woff2") format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Lora';font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/lora-400-cyrillic-ext.41a70def08d9.woff2") format('woff2');unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;}
@font-face{font-family:'Lora';font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/lora-400-cyrillic.f617fd584ca5.woff2") format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;}
@font-face{font-family:'Lora';font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/lora-400-latin-ext.1d361631357e.woff2") format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Lora';font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/lora-400-latin.9577af3ccda5.woff2") format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Lora';font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/lora-500-cyrillic-ext.41a70def08d9.woff2") format('woff2');unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;}
@font-face{font-family:'Lora';font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/lora-500-cyrillic.f617fd584ca5.woff2") format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;}
@font-face{font-family:'Lora';font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/lora-500-latin-ext.1d361631357e.woff2") format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Lora';font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/lora-500-latin.9577af3ccda5.woff2") format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Lora';font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/lora-600-cyrillic-ext.41a70def08d9.woff2") format('woff2');unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;}
@font-face{font-family:'Lora';font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/lora-600-cyrillic.f617fd584ca5.woff2") format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;}
@font-face{font-family:'Lora';font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/lora-600-latin-ext.1d361631357e.woff2") format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Lora';font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/lora-600-latin.9577af3ccda5.woff2") format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Golos Text';font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/golos-text-400-cyrillic-ext.c7635a080bad.woff2") format('woff2');unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;}
@font-face{font-family:'Golos Text';font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/golos-text-400-cyrillic.2b8fbbb33a14.woff2") format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;}
@font-face{font-family:'Golos Text';font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/golos-text-400-latin-ext.b0503aa2cc13.woff2") format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Golos Text';font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/golos-text-400-latin.f57df9832ab8.woff2") format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Golos Text';font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/golos-text-500-cyrillic-ext.c7635a080bad.woff2") format('woff2');unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;}
@font-face{font-family:'Golos Text';font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/golos-text-500-cyrillic.2b8fbbb33a14.woff2") format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;}
@font-face{font-family:'Golos Text';font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/golos-text-500-latin-ext.b0503aa2cc13.woff2") format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Golos Text';font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/golos-text-500-latin.f57df9832ab8.woff2") format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Golos Text';font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/golos-text-600-cyrillic-ext.c7635a080bad.woff2") format('woff2');unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;}
@font-face{font-family:'Golos Text';font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/golos-text-600-cyrillic.2b8fbbb33a14.woff2") format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;}
@font-face{font-family:'Golos Text';font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/golos-text-600-latin-ext.b0503aa2cc13.woff2") format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Golos Text';font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/golos-text-600-latin.f57df9832ab8.woff2") format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
/* =====================================================================
   Правовая Экосистема — светлая монохромная «издательская» тема.
   Полный редизайн (вдохновлён Aira): тёплый бумажный фон, графитовый
   акцент, тонкие волосяные линии вместо теней, шрифты Lora + Golos Text.
   Drop-in замена прежней тёмной темы: перекрывает те же переменные и
   те же .ll-* / .btn-* / .badge / .card классы — разметку менять не нужно.
   Подключать в base.html ПОСЛЕ bootstrap.min.css.
   ===================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400;0,500;0,600;1,400&family=Golos+Text:wght@400;500;600&display=swap');

:root{
  /* Поверхности — тёплая бумага */
  --bg:#F9F8F6;
  --surface:#F1F0EC;
  --panel:#FEFEFE;
  --input:#FEFEFE;
  --surface2:#FEFEFE;
  /* Текст */
  --text:#141414;
  --text-muted:#6B6B68;
  --text-faint:#737371;
  /* Линии — тонкий hairline вместо теней */
  --hairline:rgba(0,0,0,.10);
  /* Акцент — графит (монохром). Цветом остаются только статусы. */
  --accent:#141414;
  --accent-soft:#ECEBE6;
  --ink:#141414;
  --success:#10B981;
  --success-ink:#0B7A5A;
  --warning:#F59E0B;
  --warning-ink:#9A6206;
  --danger:#E11D48;
  --danger-ink:#B0173A;
  /* Bootstrap: глобальные переменные, чтобы дефолтный синий не проступал нигде */
  --bs-body-bg:#F9F8F6;
  --bs-body-color:#141414;
  --bs-border-color:rgba(0,0,0,.12);
  --bs-primary:#141414;
  --bs-primary-rgb:20,20,20;
  --bs-secondary-rgb:107,107,104;
  --bs-link-color:#141414;
  --bs-link-hover-color:#000000;
  --bs-link-color-rgb:20,20,20;
  --bs-link-hover-color-rgb:0,0,0;
  --bs-focus-ring-color:rgba(20,20,20,.16);
  /* Типографика (ТЗ §2.4) */
  --font-serif:'Lora',Georgia,serif;
  --font-sans:'Golos Text',system-ui,-apple-system,"Segoe UI",sans-serif;
  color-scheme:light;
}

/* ── Fonts & base ──────────────────────────────────────────────── */
/* K2 (дефект G1, ТЗ §F.1): «все экраны жёстко зафиксированы сверху и снизу, без bounce».
   Гасит резиновую прокрутку на краях — глобально, а не в медиа-квери, иначе требование
   выполнялось бы не на КАЖДОМ экране. На десктопе обычную прокрутку не меняет (свойство
   влияет только на overscroll-эффект). iOS Safari <16 свойство не поддерживает — там
   резинка останется, средствами CSS это не чинится. */
html,body{background:var(--bg);overscroll-behavior:none;}
/* UX-28: fluid root so the whole rem-based type scale responds to viewport width — the
   root was a fixed 16px, so 34 of 35 font sizes were identical px on a 390px phone and a
   1440px desktop. Gentle range (16px small screens → 17px wide) keeps layouts stable. */
html{font-size:clamp(16px, 0.2vw + 15.2px, 17px);}
body{
  color:var(--text);
  font-family:'Golos Text',system-ui,-apple-system,"Segoe UI",sans-serif;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  min-height:100vh;
  position:relative;
}
body.bg-light{background:var(--bg)!important;}

/* Фон плоский и бумажный: гасим прежние тёмные аврора-слои */
.ll-bg-fx{position:fixed;inset:0;z-index:-2;pointer-events:none;background:var(--bg);}
.ll-aurora{display:none!important;}
@keyframes ll-fade-up{0%{opacity:0;transform:translateY(14px)}100%{opacity:1;transform:translateY(0)}}
@media (prefers-reduced-motion:reduce){*{animation-duration:.001ms!important;transition-duration:.001ms!important}}

main.container,main.container-fluid{position:relative;}

/* ── Typography ────────────────────────────────────────────────── */
h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6{
  font-family:'Lora',Georgia,serif;font-weight:400;letter-spacing:-.01em;color:var(--text);
}
.navbar-brand{font-family:'Lora',serif;font-weight:500;}
.display-1,.display-2,.display-3,.display-4,.display-5,.display-6{font-family:'Lora',serif;font-weight:400;letter-spacing:-.02em;}
a{color:var(--accent);text-decoration:none;}
a:hover{color:#000;text-decoration:underline;}
hr{border-color:var(--hairline);opacity:1;}
small,.small{color:inherit;}
.lead{color:var(--text-muted);}

/* ── Text / bg utility remaps ──────────────────────────────────── */
.text-muted,.text-secondary,.text-body-secondary{color:var(--text-muted)!important;}
.text-dark,.text-black,.text-body{color:var(--text)!important;}
.text-primary{color:var(--text)!important;}
.text-success{color:var(--success-ink)!important;}
.text-danger{color:var(--danger-ink)!important;}
.text-warning{color:var(--warning-ink)!important;}
.text-info{color:var(--text)!important;}
.bg-light{background:var(--surface)!important;color:var(--text)!important;}
.bg-white{background:var(--panel)!important;color:var(--text)!important;}
.bg-body,.bg-body-tertiary{background:var(--bg)!important;}
.bg-dark{background:var(--ink)!important;}
.border,.border-top,.border-bottom,.border-start,.border-end{border-color:var(--hairline)!important;}
.border-secondary{border-color:var(--hairline)!important;}

/* ── Cards (flat, hairline — без теней/блюра) ──────────────────── */
.card{
  background:var(--panel);
  border:1px solid var(--hairline);
  border-radius:16px;
  color:var(--text);
  box-shadow:none;
}
.card-header,.card-footer{background:transparent;border-color:var(--hairline);color:var(--text);}
.card-header{font-family:'Lora',serif;font-weight:500;border-top-left-radius:16px;border-top-right-radius:16px;}
.card .card{box-shadow:none;}
.shadow-sm,.shadow{box-shadow:none!important;}
/* Полировка UX-аудита: без «подпрыгивания» — только смена рамки. */
.card-hover{transition:border-color .15s ease;}
.card-hover:hover{border-color:rgba(0,0,0,.28)!important;box-shadow:none!important;}

/* ── Buttons (pill, монохром) ──────────────────────────────────────
   Все состояния задаются через переменные --bs-btn-* — так Bootstrap
   не подставит свой синий ни на :hover, ни на :active/.show, ни на
   :focus-visible, ни у .btn-check:checked+.btn. ────────────────── */
.btn{
  --bs-btn-border-radius:999px;
  --bs-btn-focus-box-shadow:0 0 0 3px rgba(20,20,20,.14);
  border-radius:999px;font-weight:500;
  transition:background-color .15s ease,color .15s ease,border-color .15s ease,box-shadow .15s ease;
}
.btn-xs{padding:.12rem .55rem;font-size:.72rem;border-radius:999px;line-height:1.4;}
/* Сплошной графит: primary/info/dark — один язык */
.btn-primary,.btn-info,.btn-dark{
  --bs-btn-color:#fff;--bs-btn-bg:var(--ink);--bs-btn-border-color:var(--ink);
  --bs-btn-hover-color:#fff;--bs-btn-hover-bg:#3D3D3B;--bs-btn-hover-border-color:#3D3D3B;
  --bs-btn-active-color:#fff;--bs-btn-active-bg:#000;--bs-btn-active-border-color:#000;
  --bs-btn-disabled-color:#fff;--bs-btn-disabled-bg:#9B9B97;--bs-btn-disabled-border-color:#9B9B97;
}
.btn-success{
  --bs-btn-color:#fff;--bs-btn-bg:#0B7A5A;--bs-btn-border-color:#0B7A5A;
  --bs-btn-hover-color:#fff;--bs-btn-hover-bg:#096A4E;--bs-btn-hover-border-color:#096A4E;
  --bs-btn-active-color:#fff;--bs-btn-active-bg:#085C44;--bs-btn-active-border-color:#085C44;
  --bs-btn-disabled-color:#fff;--bs-btn-disabled-bg:#87BCA9;--bs-btn-disabled-border-color:#87BCA9;
}
.btn-danger{
  --bs-btn-color:#fff;--bs-btn-bg:var(--danger);--bs-btn-border-color:var(--danger);
  --bs-btn-hover-color:#fff;--bs-btn-hover-bg:#C21841;--bs-btn-hover-border-color:#C21841;
  --bs-btn-active-color:#fff;--bs-btn-active-bg:#A9143A;--bs-btn-active-border-color:#A9143A;
  --bs-btn-disabled-color:#fff;--bs-btn-disabled-bg:#E58BA0;--bs-btn-disabled-border-color:#E58BA0;
}
.btn-warning{
  --bs-btn-color:#1A1206;--bs-btn-bg:#E9A21B;--bs-btn-border-color:#E9A21B;
  --bs-btn-hover-color:#1A1206;--bs-btn-hover-bg:#D69012;--bs-btn-hover-border-color:#D69012;
  --bs-btn-active-color:#1A1206;--bs-btn-active-bg:#C4820D;--bs-btn-active-border-color:#C4820D;
  --bs-btn-disabled-color:#5A4A28;--bs-btn-disabled-bg:#F2CE8C;--bs-btn-disabled-border-color:#F2CE8C;
}
/* Ghost-кнопки: контурная пилюля; на hover — тёплая подложка и текст
   ТЕМНЕЕ (полный графит), на active — инверсия в сплошной графит */
.btn-secondary,.btn-outline-secondary,.btn-outline-dark,.btn-outline-light{
  --bs-btn-color:var(--text);--bs-btn-bg:transparent;--bs-btn-border-color:rgba(0,0,0,.18);
  --bs-btn-hover-color:#000;--bs-btn-hover-bg:var(--accent-soft);--bs-btn-hover-border-color:rgba(0,0,0,.34);
  --bs-btn-active-color:#fff;--bs-btn-active-bg:var(--ink);--bs-btn-active-border-color:var(--ink);
  --bs-btn-disabled-color:var(--text-faint);--bs-btn-disabled-bg:transparent;--bs-btn-disabled-border-color:var(--hairline);
}
/* outline-primary — контур, инвертирующийся в графит уже на hover */
.btn-outline-primary{
  --bs-btn-color:var(--text);--bs-btn-bg:transparent;--bs-btn-border-color:rgba(0,0,0,.24);
  --bs-btn-hover-color:#fff;--bs-btn-hover-bg:var(--ink);--bs-btn-hover-border-color:var(--ink);
  --bs-btn-active-color:#fff;--bs-btn-active-bg:#000;--bs-btn-active-border-color:#000;
  --bs-btn-disabled-color:var(--text-faint);--bs-btn-disabled-bg:transparent;--bs-btn-disabled-border-color:var(--hairline);
}
.btn-outline-success{
  --bs-btn-color:var(--success-ink);--bs-btn-bg:transparent;--bs-btn-border-color:rgba(16,185,129,.5);
  --bs-btn-hover-color:var(--success-ink);--bs-btn-hover-bg:rgba(16,185,129,.12);--bs-btn-hover-border-color:rgba(11,122,90,.7);
  --bs-btn-active-color:#fff;--bs-btn-active-bg:#0B7A5A;--bs-btn-active-border-color:#0B7A5A;
  --bs-btn-disabled-color:var(--text-faint);--bs-btn-disabled-bg:transparent;--bs-btn-disabled-border-color:var(--hairline);
}
.btn-outline-danger{
  --bs-btn-color:var(--danger-ink);--bs-btn-bg:transparent;--bs-btn-border-color:rgba(225,29,72,.45);
  --bs-btn-hover-color:var(--danger-ink);--bs-btn-hover-bg:rgba(225,29,72,.10);--bs-btn-hover-border-color:rgba(176,23,58,.7);
  --bs-btn-active-color:#fff;--bs-btn-active-bg:var(--danger);--bs-btn-active-border-color:var(--danger);
  --bs-btn-disabled-color:var(--text-faint);--bs-btn-disabled-bg:transparent;--bs-btn-disabled-border-color:var(--hairline);
}
.btn-outline-warning{
  --bs-btn-color:var(--warning-ink);--bs-btn-bg:transparent;--bs-btn-border-color:rgba(245,158,11,.5);
  --bs-btn-hover-color:var(--warning-ink);--bs-btn-hover-bg:rgba(245,158,11,.12);--bs-btn-hover-border-color:rgba(154,98,6,.7);
  --bs-btn-active-color:#1A1206;--bs-btn-active-bg:#E9A21B;--bs-btn-active-border-color:#E9A21B;
  --bs-btn-disabled-color:var(--text-faint);--bs-btn-disabled-bg:transparent;--bs-btn-disabled-border-color:var(--hairline);
}
.btn-light{
  --bs-btn-color:var(--text);--bs-btn-bg:var(--accent-soft);--bs-btn-border-color:var(--accent-soft);
  --bs-btn-hover-color:#000;--bs-btn-hover-bg:#E2E0DA;--bs-btn-hover-border-color:#E2E0DA;
  --bs-btn-active-color:#000;--bs-btn-active-bg:#D8D6CF;--bs-btn-active-border-color:#D8D6CF;
  --bs-btn-disabled-color:var(--text-faint);--bs-btn-disabled-bg:var(--surface);--bs-btn-disabled-border-color:var(--surface);
}
.btn-link{
  --bs-btn-color:var(--text);--bs-btn-hover-color:#000;--bs-btn-active-color:#000;
  --bs-btn-disabled-color:var(--text-faint);text-decoration-color:rgba(0,0,0,.3);
}

/* ── Forms ─────────────────────────────────────────────────────── */
.form-control,.form-select,textarea.form-control,.input-group-text{
  background:var(--input);border:1px solid rgba(0,0,0,.45);color:var(--text);border-radius:12px;
}
.form-control:focus,.form-select:focus{
  background:var(--input);border-color:var(--ink);color:var(--text);box-shadow:0 0 0 3px rgba(20,20,20,.10);
}
.form-control::placeholder,textarea::placeholder{color:var(--text-faint);opacity:1;}
.form-control:disabled,.form-control[readonly]{background:var(--surface);color:var(--text-muted);}
.form-select option{background:var(--panel);color:var(--text);}
.input-group-text{background:var(--surface);}
.form-label,.col-form-label{color:var(--text);font-weight:500;}
.form-text{color:var(--text-muted);}
.form-check-input{background-color:var(--input);border-color:rgba(0,0,0,.28);}
.form-check-input:checked{background-color:var(--ink);border-color:var(--ink);}
.form-control-plaintext{color:var(--text);}
input[type=number]{-moz-appearance:textfield;appearance:textfield;}
input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}

/* ── Tables ────────────────────────────────────────────────────── */
.table{--bs-table-bg:transparent;--bs-table-color:var(--text);color:var(--text);border-color:var(--hairline);}
.table>:not(caption)>*>*{background:transparent;color:var(--text);border-bottom-color:var(--hairline);box-shadow:none;}
.table thead th,.table>thead{color:var(--text-muted);font-family:'Golos Text',sans-serif;font-weight:600;font-size:.72rem;letter-spacing:.05em;text-transform:uppercase;border-bottom:1px solid var(--hairline);}
.table-light,.table-light>th,.table-light>td,thead.table-light th{background:var(--surface)!important;color:var(--text-muted)!important;border-color:var(--hairline)!important;}
.table-hover>tbody>tr:hover>*{background:rgba(0,0,0,.025)!important;color:var(--text);}
.table-bordered,.table-bordered td,.table-bordered th{border-color:var(--hairline)!important;}
.table-responsive{border-radius:14px;}

/* ── Badges (контурные пилюли со статус-точкой) ────────────────── */
.badge{font-weight:500;border-radius:999px;padding:.42em .8em;font-size:.72rem;letter-spacing:.04em;text-transform:uppercase;}
.badge.bg-primary,.bg-primary{background:transparent!important;color:var(--text)!important;border:1px solid rgba(0,0,0,.18);}
.badge.bg-success,.badge.bg-green{background:transparent!important;color:var(--success-ink)!important;border:1px solid rgba(16,185,129,.35);}
.badge.bg-danger{background:transparent!important;color:var(--danger-ink)!important;border:1px solid rgba(225,29,72,.35);}
.badge.bg-warning{background:transparent!important;color:var(--warning-ink)!important;border:1px solid rgba(245,158,11,.4);}
.badge.bg-info{background:transparent!important;color:var(--text)!important;border:1px solid rgba(0,0,0,.18);}
.badge.bg-secondary{background:transparent!important;color:var(--text-muted)!important;border:1px solid var(--hairline);}
.badge.bg-dark{background:var(--ink)!important;color:#fff!important;}
.badge.bg-light{background:var(--surface)!important;color:var(--text)!important;}
.btn.bg-primary{background:var(--ink)!important;color:#fff!important;border:none;}

/* ── Добить синий Bootstrap во всех остальных местах ───────────── */
.text-bg-primary,.text-bg-dark{background:var(--ink)!important;color:#fff!important;}
.text-bg-secondary,.text-bg-info{background:var(--accent-soft)!important;color:var(--text)!important;}
.link-primary,.link-info{color:var(--text)!important;}
.link-primary:hover,.link-info:hover{color:#000!important;}
.alert-primary{border-color:var(--hairline);background:var(--surface);color:var(--text);}
.table-primary,.table-primary>th,.table-primary>td,
.table-info,.table-info>th,.table-info>td{background:var(--surface)!important;color:var(--text)!important;border-color:var(--hairline)!important;}
.dropdown-item.active,.dropdown-item:active{background:var(--accent-soft);color:var(--text);}
.form-check-input:focus{border-color:rgba(0,0,0,.4);box-shadow:0 0 0 3px rgba(20,20,20,.10);}
.form-check-input:indeterminate{background-color:var(--ink);border-color:var(--ink);}
.toast{background:var(--panel);border:1px solid var(--hairline);border-radius:14px;color:var(--text);}
.toast-header{background:transparent;border-bottom-color:var(--hairline);color:var(--text-muted);}
.form-switch .form-check-input:focus:not(:checked){background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba(0,0,0,0.35)'/%3e%3c/svg%3e");}
.accordion-button:focus{border-color:var(--hairline);box-shadow:0 0 0 3px rgba(20,20,20,.10);}
.accordion-button::after{filter:grayscale(1);}
.btn-close:focus{box-shadow:0 0 0 3px rgba(20,20,20,.14);}
.navbar-toggler:focus{box-shadow:0 0 0 3px rgba(20,20,20,.14);}
.page-link:focus{background:var(--accent-soft);color:var(--text);box-shadow:0 0 0 3px rgba(20,20,20,.10);}
.form-range::-webkit-slider-thumb{background:var(--ink);}
.form-range::-moz-range-thumb{background:var(--ink);}
.form-range::-webkit-slider-thumb:active{background:#3D3D3B;}
.form-range:focus::-webkit-slider-thumb{box-shadow:0 0 0 3px rgba(20,20,20,.14);}
.nav-link{--bs-nav-link-color:var(--text-muted);--bs-nav-link-hover-color:var(--text);}
.nav-link:focus-visible{box-shadow:0 0 0 3px rgba(20,20,20,.14);}

/* ── Alerts ────────────────────────────────────────────────────── */
.alert{border-radius:14px;border:1px solid var(--hairline);background:var(--panel);color:var(--text);}
.alert-success{border-color:rgba(16,185,129,.35);background:rgba(16,185,129,.08);color:var(--success-ink);}
.alert-danger{border-color:rgba(225,29,72,.35);background:rgba(225,29,72,.07);color:var(--danger-ink);}
.alert-warning{border-color:rgba(245,158,11,.4);background:rgba(245,158,11,.09);color:var(--warning-ink);}
.alert-info{border-color:var(--hairline);background:var(--surface);color:var(--text);}
.alert-secondary{border-color:var(--hairline);background:var(--surface);}
.alert .btn-close{filter:none;}

/* ── List groups ───────────────────────────────────────────────── */
.list-group{border-radius:14px;}
.list-group-item{background:var(--panel);border-color:var(--hairline);color:var(--text);}
.list-group-item-action:hover{background:rgba(0,0,0,.03);color:var(--text);}
.list-group-item.active{background:var(--accent-soft);border-color:rgba(0,0,0,.14);color:var(--text);}
.list-group-item-success{background:rgba(16,185,129,.10)!important;color:var(--text)!important;border-color:rgba(16,185,129,.28)!important;}
.list-group-item-warning{background:rgba(245,158,11,.10)!important;color:var(--text)!important;border-color:rgba(245,158,11,.28)!important;}
.list-group-item-danger{background:rgba(225,29,72,.09)!important;color:var(--text)!important;border-color:rgba(225,29,72,.28)!important;}
.list-group-item-info{background:var(--surface)!important;color:var(--text)!important;border-color:var(--hairline)!important;}

/* ── Modals / offcanvas ────────────────────────────────────────── */
.modal-content,.offcanvas{background:var(--panel);border:1px solid var(--hairline);border-radius:20px;color:var(--text);box-shadow:0 40px 90px rgba(0,0,0,.18);}
.modal-header,.modal-footer,.offcanvas-header{border-color:var(--hairline);}
.modal-title,.offcanvas-title{font-family:'Lora',serif;font-weight:400;}
.modal .btn-close,.offcanvas .btn-close{filter:none;}
.modal-backdrop.show{opacity:.5;background:#0A0A0A;}

/* ── Dropdowns ─────────────────────────────────────────────────── */
.dropdown-menu{background:var(--panel);border:1px solid var(--hairline);border-radius:14px;box-shadow:0 20px 50px rgba(0,0,0,.14);}
.dropdown-item{color:var(--text);}
.dropdown-item:hover,.dropdown-item:focus{background:var(--accent-soft);color:var(--text);}
.dropdown-divider{border-color:var(--hairline);}

/* ── Nav tabs / pills ──────────────────────────────────────────── */
.nav-tabs{border-bottom-color:var(--hairline);}
.nav-tabs .nav-link{color:var(--text-muted);border:none;border-bottom:2px solid transparent;border-radius:0;transition:color .15s,border-color .15s;}
.nav-tabs .nav-link:hover{color:var(--text);border-bottom-color:var(--hairline);}
.nav-tabs .nav-link.active{color:var(--text);background:transparent;border-bottom:2px solid var(--ink);}
.nav-pills .nav-link{color:var(--text-muted);border-radius:999px;transition:background .15s,color .15s;}
.nav-pills .nav-link.active{background:var(--ink);color:#fff;}

/* ── Pagination ────────────────────────────────────────────────── */
.page-link{background:var(--panel);border-color:var(--hairline);color:var(--text);}
.page-link:hover{background:var(--accent-soft);color:var(--text);}
.page-item.active .page-link{background:var(--ink);border-color:var(--ink);color:#fff;}
.page-item.disabled .page-link{background:transparent;color:var(--text-muted);}

/* ── Progress ──────────────────────────────────────────────────── */
.progress{background:var(--accent-soft);border-radius:999px;}
.progress-bar{background:var(--ink);}
/* Bootstrap-утилиты .bg-info/.bg-primary красят полосу в неоновый циан/синий
   через !important — возвращаем монохром/семантику на самих полосах. */
.progress-bar.bg-info,.progress-bar.bg-primary,.progress-bar.bg-secondary{background:var(--ink)!important;}
.progress-bar.bg-success{background:var(--success)!important;}
.progress-bar.bg-warning{background:#E9A21B!important;}
.progress-bar.bg-danger{background:var(--danger)!important;}

/* ── Navbar (top) ──────────────────────────────────────────────── */
.navbar.bg-primary,.navbar.navbar-dark.bg-primary{
  background:rgba(254,254,254,.86)!important;
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  border-bottom:1px solid var(--hairline);
  position:relative;z-index:1031;
}
.navbar .dropdown-menu{z-index:1032;}
.navbar .navbar-text{color:var(--text-muted)!important;}
.navbar-brand{color:var(--text)!important;display:inline-flex;align-items:center;gap:9px;font-size:1.15rem;}
.ll-brand-bar{display:inline-block;width:3px;height:22px;border-radius:3px;background:var(--ink);box-shadow:none;flex:none;}

/* ── Строки диалогов «как в WhatsApp» (список /chat/ на телефоне и левая панель
   десктопа): название дела · время → юрист → последнее сообщение + непрочитанные. ── */
.ll-dlg-row{display:flex;align-items:center;gap:12px;padding:12px 14px;border-bottom:1px solid var(--hairline);color:inherit;text-decoration:none;position:relative;transition:background .12s;}
.ll-dlg-row:hover{background:var(--surface);color:inherit;text-decoration:none;}
.ll-dlg-row.active{background:var(--surface);}
.ll-dlg-row.active::before{content:"";position:absolute;left:0;top:8px;bottom:8px;width:3px;border-radius:0 3px 3px 0;background:var(--ink);}
.ll-dlg-row .ll-avatar{width:46px;height:46px;font-size:16px;}
.ll-dlg-row .ll-avatar-img{width:46px;height:46px;border-radius:50%;object-fit:cover;flex:none;}
.ll-dlg-row-body{display:block;flex:1 1 auto;min-width:0;}
.ll-dlg-row-top{display:flex;align-items:baseline;justify-content:space-between;gap:8px;}
.ll-dlg-row-name{font-size:15px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ll-dlg-row-time{font-size:11.5px;color:var(--text-faint);white-space:nowrap;flex:none;}
.ll-dlg-row.unread .ll-dlg-row-time{color:var(--text);font-weight:600;}
.ll-dlg-row-case{display:block;font-size:12.5px;color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px;}
.ll-dlg-row-last{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:13px;color:var(--text-muted);margin-top:2px;}
.ll-dlg-row-last span:first-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;}
.ll-dlg-row.unread .ll-dlg-row-last span:first-child{color:var(--text);font-weight:500;}
.ll-unread-pill{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:22px;padding:0 7px;border-radius:999px;background:var(--ink);color:#F5F5F2;font-size:11.5px;font-weight:600;line-height:1;}
.ll-dlg-mobile{border:1px solid var(--hairline);border-radius:16px;background:var(--panel);overflow:hidden;}
.ll-dlg-mobile .ll-dlg-row:last-child{border-bottom:none;}
@media (min-width:992px){
  .ll-dlg-row{gap:10px;padding:10px 14px;}
  .ll-dlg-row .ll-avatar,.ll-dlg-row .ll-avatar-img{width:38px;height:38px;font-size:14px;}
  .ll-dlg-row-name{font-size:13.5px;}
  .ll-dlg-row-case{font-size:11.5px;}
  .ll-dlg-row-last{font-size:12.5px;}
}

/* ── Sidebar links (cabinets) ──────────────────────────────────── */
.sidebar-link{
  display:flex;align-items:center;gap:.65rem;padding:.5rem .8rem;border-radius:11px;
  font-family:var(--font-serif);font-size:1.02rem;font-weight:400;letter-spacing:.005em;line-height:1.3;
  color:var(--text-muted);text-decoration:none;transition:background .15s, color .15s;
}
.sidebar-link:hover{background:rgba(0,0,0,.04);color:var(--text);text-decoration:none;}
.sidebar-link.active{background:var(--accent-soft);color:var(--text);font-weight:500;box-shadow:inset 0 0 0 1px rgba(0,0,0,.10);}
.sidebar-link .ll-nav-count{font-family:var(--font-sans);}
/* Шапка сайдбара (имя, роль · изменить) и заголовки секций — тем же Lora, что и пункты. */
.ll-cabinet-aside .card-body>a .fw-semibold{font-family:var(--font-serif);font-weight:500;font-size:1.02rem;letter-spacing:.005em;}
.ll-cabinet-aside .card-body>a small{font-family:var(--font-serif);font-size:.86rem;}
.ll-cabinet-aside .ll-section-tag{font-family:var(--font-serif);font-weight:500;font-size:.8rem;letter-spacing:.08em;}
.sidebar-link svg{flex-shrink:0;opacity:.9;}
button.sidebar-link{font-family:inherit;cursor:pointer;text-align:left;}
/* Список дел клиента: вся строка таблицы (десктоп, JS-делегирование по data-href) и вся
   карточка (мобильный, <a>) — тач-цель; бейдж непрочитанных сообщений по делу. */
.ll-unread-badge{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--ink);color:#fff;font-size:.72rem;font-weight:600;line-height:1;}

/* ── Плитки дел (клиент) ────────────────────────────────────────────────────
   Дело = вертикальный прямоугольник со скруглением: статус сверху, название
   крупно, внизу дата создания и юрист. Одна и та же сетка на телефоне и на
   десктопе, меняется только число колонок.

   РИТМ ЧЁРНЫХ И БЕЛЫХ — правило одно и задаётся ТОЛЬКО позицией в сетке:
     период акцента = число колонок + 1.
   Отсюда: тёмная плитка открывает сетку (самое свежее дело — акцент), затем
   ровно одна тёмная на ряд, каждый раз на столбец правее — акцент идёт по
   диагонали, после последнего столбца ряд пропускается и диагональ начинается
   заново. Две тёмные плитки никогда не оказываются рядом ни по горизонтали,
   ни по вертикали. В разметке акцент не хранится: он зависит от места, а не
   от дела, поэтому ритм не ломается при фильтрах, поиске и пагинации.
   Колонки: 2 (<992px) · 3 (≥992px) · 4 (≥1400px, кроме --narrow). */
.ll-case-tiles{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;}
.ll-case-tile{
  --tile-bg:var(--panel);--tile-fg:var(--text);--tile-muted:var(--text-muted);
  --tile-line:var(--hairline);--tile-soft:var(--accent-soft);--tile-hover:rgba(0,0,0,.28);
  position:relative;display:flex;flex-direction:column;gap:10px;aspect-ratio:3/4;
  padding:14px;border-radius:18px;text-decoration:none;overflow:hidden;
  background:var(--tile-bg);color:var(--tile-fg);border:1px solid var(--tile-line);
  transition:border-color .15s ease;
}
.ll-case-tile:hover,.ll-case-tile:focus-visible{color:var(--tile-fg);border-color:var(--tile-hover);}
/* Акцентная (тёмная) плитка — тот же компонент, другой набор токенов. */
.ll-case-tile:nth-child(3n+1){
  --tile-bg:var(--ink);--tile-fg:#F5F5F2;--tile-muted:rgba(245,245,242,.68);
  --tile-line:var(--ink);--tile-soft:rgba(255,255,255,.14);--tile-hover:rgba(255,255,255,.4);
}
.ll-case-tile-top{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;min-height:22px;}
.ll-case-tile .badge{font-size:.64rem;padding:.34em .7em;
  background:var(--tile-soft)!important;color:var(--tile-fg)!important;border:1px solid var(--tile-line);}
/* Цвет статуса несёт точка (фон пилюли подчинён плитке): на чёрной плитке цветная
   заливка Bootstrap не читалась. Оттенки выбраны так, чтобы различаться и на белом,
   и на графите; «в работе» — контрастная точка цвета текста плитки. */
.ll-case-tile .badge.ll-badge-status::before{background:var(--st,var(--tile-muted));opacity:1;}
.ll-case-tile .badge.bg-primary{--st:var(--tile-fg);}
.ll-case-tile .badge.bg-success{--st:#34D399;}
.ll-case-tile .badge.bg-warning{--st:#F59E0B;}
.ll-case-tile .badge.bg-danger{--st:#F43F5E;}
.ll-case-tile .badge.bg-info{--st:#38BDF8;}
.ll-case-tile-unread{background:var(--tile-fg);color:var(--tile-bg);}
.ll-case-tile-title{font-family:var(--font-serif);font-weight:500;font-size:1.02rem;line-height:1.25;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;word-break:break-word;}
.ll-case-tile-meta{display:flex;flex-direction:column;gap:7px;margin-top:auto;font-size:.76rem;color:var(--tile-muted);}
.ll-case-tile-date{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ll-case-tile-lawyer{display:flex;align-items:center;gap:7px;min-width:0;}
.ll-case-tile-av{width:22px;height:22px;font-size:.64rem;background:var(--tile-soft);color:var(--tile-fg);}
.ll-case-tile-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.ll-case-tile-name--none{opacity:.8;}
@media (min-width:992px){
  /* 3 колонки → акцент каждые 4 плитки (диагональ на три ряда). */
  .ll-case-tiles{grid-template-columns:repeat(3,1fr);gap:14px;}
  .ll-case-tile{aspect-ratio:auto;height:288px;padding:16px;border-radius:20px;}
  /* :nth-child(n) — та же специфичность, что у правила акцента предыдущей сетки,
     иначе тёмные плитки 2-колоночного ритма «протекли» бы в 3-колоночный. */
  .ll-case-tile:nth-child(n){--tile-bg:var(--panel);--tile-fg:var(--text);--tile-muted:var(--text-muted);
    --tile-line:var(--hairline);--tile-soft:var(--accent-soft);--tile-hover:rgba(0,0,0,.28);}
  .ll-case-tile:nth-child(4n+1){--tile-bg:var(--ink);--tile-fg:#F5F5F2;--tile-muted:rgba(245,245,242,.68);
    --tile-line:var(--ink);--tile-soft:rgba(255,255,255,.14);--tile-hover:rgba(255,255,255,.4);}
  .ll-case-tile-title{font-size:1.1rem;}
}
@media (min-width:1400px){
  /* Широкий экран: 4 колонки → акцент каждые 5 плиток. Узкий вариант
     (--narrow, колонка дашборда) остаётся на трёх. */
  .ll-case-tiles:not(.ll-case-tiles--narrow){grid-template-columns:repeat(4,1fr);}
  .ll-case-tiles:not(.ll-case-tiles--narrow) .ll-case-tile:nth-child(n){
    --tile-bg:var(--panel);--tile-fg:var(--text);--tile-muted:var(--text-muted);
    --tile-line:var(--hairline);--tile-soft:var(--accent-soft);--tile-hover:rgba(0,0,0,.28);}
  .ll-case-tiles:not(.ll-case-tiles--narrow) .ll-case-tile:nth-child(5n+1){
    --tile-bg:var(--ink);--tile-fg:#F5F5F2;--tile-muted:rgba(245,245,242,.68);
    --tile-line:var(--ink);--tile-soft:rgba(255,255,255,.14);--tile-hover:rgba(255,255,255,.4);}
}

/* ── Reusable components ───────────────────────────────────────── */
.ll-chip{display:inline-flex;align-items:center;gap:7px;padding:6px 12px;border-radius:999px;border:1px solid var(--hairline);background:var(--panel);font-size:.8rem;color:var(--text-muted);}
button.ll-chip{cursor:pointer;font-family:inherit;transition:color .15s,border-color .15s,background .15s;}
button.ll-chip:hover{color:var(--text);border-color:rgba(0,0,0,.28);}
.ll-chip.active{color:#fff;background:var(--ink);border-color:var(--ink);}
.ll-dot{position:relative;display:inline-flex;width:8px;height:8px;flex:none;}
.ll-dot::after{content:"";position:absolute;inset:0;border-radius:50%;background:var(--success);}
.grad-text{background:none;-webkit-text-fill-color:currentColor;color:var(--text);}
.ll-section-tag{display:inline-flex;align-items:center;gap:8px;font-size:.72rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);}
.ll-stat-num{font-family:'Lora',serif;font-weight:400;font-size:2rem;line-height:1.05;color:var(--text);}
.ll-avatar{display:flex;align-items:center;justify-content:center;border-radius:50%;color:var(--text);font-weight:600;flex:none;}
.ll-icon-box{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:12px;border:1px solid var(--hairline);}
/* Появление секций — ТОЛЬКО публичные страницы (templates/public/**); в кабинетах
   класс не используется (страж tests/test_ux_polish.py). */
.ll-fade-up{animation:ll-fade-up .5s ease both;}
/* Каскадное появление секций при прокрутке (ТЗ §19): класс вешает JS
   base_public.html ТОЛЬКО при поддержке IntersectionObserver и без
   prefers-reduced-motion — без JS контент всегда видим. */
.ll-reveal{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s ease;}
.ll-reveal.is-in{opacity:1;transform:none;}
@media (prefers-reduced-motion:reduce){.ll-reveal{opacity:1;transform:none;transition:none;}}

/* Аватары ролей — тёплый серый кружок (монохром), инициал графитом */
.ll-av-client,.ll-av-staff,.ll-av-director{background:var(--accent-soft);color:var(--text);}

/* ── Misc ──────────────────────────────────────────────────────── */
::selection{background:rgba(20,20,20,.14);}
::-webkit-scrollbar{width:11px;height:11px;}
::-webkit-scrollbar-track{background:transparent;}
::-webkit-scrollbar-thumb{background:rgba(0,0,0,.16);border-radius:10px;border:3px solid transparent;background-clip:content-box;}
::-webkit-scrollbar-thumb:hover{background:rgba(0,0,0,.28);background-clip:content-box;}
.text-bg-light,.text-bg-white{background:var(--panel)!important;color:var(--text)!important;}
code,kbd,pre{color:var(--text);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;}
.spinner-border{color:var(--ink);}
.accordion-item{background:var(--panel);border-color:var(--hairline);}
.accordion-button{background:transparent;color:var(--text);font-family:'Lora',serif;}
.accordion-button:not(.collapsed){background:var(--surface);color:var(--text);}
.accordion-button::after{filter:none;}
.tooltip-inner{background:var(--ink);color:#fff;}

/* =====================================================================
   Единый словарь компонентов (иконки, навигация, чат, документы, видео,
   KPI, таймлайн и т.д.) — тот же контракт классов, светлая палитра.
   ===================================================================== */

/* ── Иконки (инлайн-SVG, stroke ~1.7) ──────────────────────────── */
.ll-ic,.ll-ic-sm,.ll-ic-lg,.ll-ic-xl{
  flex:none;display:inline-block;fill:none;stroke:currentColor;stroke-width:1.7;
  stroke-linecap:round;stroke-linejoin:round;color:inherit;}
.ll-ic{width:18px;height:18px;vertical-align:-3px;}
.ll-ic-sm{width:16px;height:16px;vertical-align:-2px;}
.ll-ic-lg{width:22px;height:22px;vertical-align:-4px;}
.ll-ic-xl{width:28px;height:28px;vertical-align:-5px;}
.ll-ic-fill,.ll-ic.ll-ic-fill,.ll-ic-sm.ll-ic-fill{fill:currentColor;stroke:none;}
.ll-ic use,.ll-ic-sm use,.ll-ic-lg use,.ll-ic-xl use{fill:inherit;stroke:inherit;}

/* ── Доступность ───────────────────────────────────────────────── */
.ll-skip{position:fixed;top:-60px;left:12px;z-index:1080;padding:10px 16px;border-radius:0 0 12px 12px;
  background:var(--ink);color:#fff;font-weight:600;transition:top .15s;}
.ll-skip:focus{top:0;color:#fff;text-decoration:none;}
a:focus-visible,button:focus-visible,.btn:focus-visible,.sidebar-link:focus-visible,
.form-control:focus-visible,.form-select:focus-visible,[tabindex]:focus-visible{
  outline:2px solid var(--ink);outline-offset:2px;}
/* On the dark auth scene (#0B0B0B) the graphite --ink ring is invisible (1.07:1). Give it a
   light outline so keyboard focus is visible there (UX-2). #F5F5F2 on #0B0B0B ≈ 17:1. */
.auth-dark a:focus-visible,.auth-dark button:focus-visible,.auth-dark .btn:focus-visible,
.auth-dark .form-control:focus-visible,.auth-dark .form-select:focus-visible,
.auth-dark [tabindex]:focus-visible{outline-color:#F5F5F2;}

/* ── Бейдж шифрования ──────────────────────────────────────────── */
.ll-enc-badge{display:inline-flex;align-items:center;gap:7px;padding:5px 11px;border-radius:999px;
  font-size:.78rem;font-weight:500;color:var(--text-muted);background:transparent;border:1px solid var(--hairline);}
.ll-enc-badge .ll-ic{width:14px;height:14px;}

.ll-trust-strip{display:flex;flex-wrap:wrap;gap:10px;}
.ll-trust-strip .ll-chip{font-size:.82rem;color:var(--text);}

/* ── KPI-плитки ────────────────────────────────────────────────── */
.ll-kpi{display:flex;flex-direction:column;gap:6px;padding:18px 20px;border-radius:14px;
  background:var(--panel);border:1px solid var(--hairline);}
.ll-kpi-label{font-size:.72rem;letter-spacing:.05em;text-transform:uppercase;color:var(--text-muted);font-weight:500;display:flex;align-items:center;gap:7px;}
.ll-kpi-num{font-family:'Lora',serif;font-weight:400;font-size:1.9rem;line-height:1.05;color:var(--text);}
.ll-kpi-accent .ll-kpi-num{color:var(--text);}

/* ── Чеклист онбординга ────────────────────────────────────────── */
.ll-checklist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;}
.ll-step{display:flex;align-items:center;gap:11px;}
.ll-step-mark{flex:none;width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-size:.8rem;font-weight:600;border:1.5px solid var(--hairline);color:var(--text-muted);background:transparent;}
.ll-step.done .ll-step-mark{background:rgba(16,185,129,.14);border-color:rgba(16,185,129,.5);color:var(--success-ink);}
.ll-step.active .ll-step-mark{border-color:var(--ink);color:var(--text);box-shadow:0 0 0 3px rgba(20,20,20,.08);}
.ll-step.done .ll-step-text{color:var(--text-muted);}

/* ── Блок действий кейса ───────────────────────────────────────── */
.ll-action-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(96px,1fr));gap:12px;}
.ll-action{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:84px;padding:14px 8px;
  border-radius:14px;text-decoration:none;text-align:center;background:var(--panel);border:1px solid var(--hairline);
  color:var(--text);font-size:.85rem;font-weight:500;transition:transform .15s,border-color .15s,background .15s;}
.ll-action:hover{border-color:rgba(0,0,0,.28);color:var(--text);text-decoration:none;background:var(--surface);}
.ll-action .ll-ic{width:24px;height:24px;}
.ll-action.ll-action-danger:hover{border-color:rgba(225,29,72,.45);}
.ll-action.ll-action-danger .ll-ic{color:var(--danger-ink);}

/* ── Резерв средств (escrow) ───────────────────────────────────── */
.ll-escrow{display:flex;align-items:flex-start;gap:13px;padding:16px 18px;border-radius:14px;
  background:rgba(16,185,129,.07);border:1px solid rgba(16,185,129,.28);}
.ll-escrow .ll-ic{color:var(--success-ink);width:24px;height:24px;}
.ll-escrow-amount{font-family:'Lora',serif;font-weight:400;font-size:1.5rem;color:var(--success-ink);line-height:1.1;}

/* ── Таймлайн статусов ─────────────────────────────────────────── */
.ll-timeline{list-style:none;margin:0;padding:0 0 0 6px;position:relative;}
.ll-tl-item{position:relative;padding:0 0 18px 24px;}
.ll-tl-item::before{content:"";position:absolute;left:0;top:4px;width:11px;height:11px;border-radius:50%;
  background:var(--panel);border:2px solid var(--ink);z-index:1;}
.ll-tl-item:not(:last-child)::after{content:"";position:absolute;left:5px;top:13px;bottom:-2px;width:2px;background:var(--hairline);}
.ll-tl-item.muted::before{border-color:var(--text-faint);}
.ll-tl-title{font-weight:500;color:var(--text);font-size:.92rem;}
.ll-tl-time{font-size:.78rem;color:var(--text-muted);}

/* ── «Требует внимания» ────────────────────────────────────────── */
.ll-attention{display:flex;align-items:flex-start;gap:13px;padding:16px 18px;border-radius:14px;text-decoration:none;
  border:1px solid var(--hairline);background:var(--panel);transition:transform .15s,border-color .15s;}
.ll-attention:hover{border-color:rgba(0,0,0,.28);text-decoration:none;}
.ll-attention .ll-icon-box{flex:none;}
.ll-attention-num{font-family:'Lora',serif;font-weight:400;font-size:1.6rem;line-height:1;color:var(--text);}
.ll-att-red{border-color:rgba(225,29,72,.30);}.ll-att-red:hover{border-color:rgba(225,29,72,.5);}
.ll-att-red .ll-icon-box{background:rgba(225,29,72,.10);color:var(--danger-ink);border-color:rgba(225,29,72,.28);}
.ll-att-amber{border-color:rgba(245,158,11,.30);}.ll-att-amber:hover{border-color:rgba(245,158,11,.5);}
.ll-att-amber .ll-icon-box{background:rgba(245,158,11,.10);color:var(--warning-ink);border-color:rgba(245,158,11,.28);}
.ll-att-blue{border-color:var(--hairline);}.ll-att-blue:hover{border-color:rgba(0,0,0,.28);}
.ll-att-blue .ll-icon-box{background:var(--accent-soft);color:var(--text);}

.ll-side-count{margin-left:auto;min-width:20px;height:20px;padding:0 6px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;
  font-size:.72rem;font-weight:600;background:var(--ink);color:#fff;border:1px solid var(--ink);}
.ll-side-count.amber{background:transparent;color:var(--warning-ink);border-color:rgba(245,158,11,.4);}

/* ── Обратный отсчёт арбитража ─────────────────────────────────── */
.ll-countdown{display:inline-flex;align-items:baseline;gap:8px;padding:14px 22px;border-radius:14px;
  background:rgba(225,29,72,.07);border:1px solid rgba(225,29,72,.30);}
.ll-countdown-num{font-family:'Lora',serif;font-weight:400;font-size:2.1rem;line-height:1;color:var(--danger-ink);
  font-variant-numeric:tabular-nums;letter-spacing:.01em;}
.ll-countdown.calm{background:rgba(245,158,11,.07);border-color:rgba(245,158,11,.30);}
.ll-countdown.calm .ll-countdown-num{color:var(--warning-ink);}

.ll-stance{padding:16px 18px;border-radius:14px;background:var(--panel);border:1px solid var(--hairline);height:100%;}
.ll-stance.client{border-left:3px solid var(--ink);}
.ll-stance.executor{border-left:3px solid var(--success);}

/* ── Чат ───────────────────────────────────────────────────────── */
.ll-chat-shell{display:flex;flex-direction:column;height:calc(100vh - 150px);min-height:420px;border-radius:18px;overflow:hidden;
  background:var(--panel);border:1px solid var(--hairline);}
.ll-chat-head{flex:none;padding:13px 18px;border-bottom:1px solid var(--hairline);display:flex;align-items:center;gap:12px;background:var(--panel);}
.ll-chat-scroll{flex:1 1 auto;overflow-y:auto;padding:18px;display:flex;flex-direction:column;gap:4px;background:var(--bg);}
.ll-chat-foot{flex:none;padding:12px 14px;border-top:1px solid var(--hairline);display:flex;align-items:flex-end;gap:10px;background:var(--panel);}
.ll-chat-foot .form-control{resize:none;}
.ll-send-btn{flex:none;width:46px;height:46px;border-radius:50%;border:none;display:flex;align-items:center;justify-content:center;
  background:var(--ink);color:#fff;box-shadow:none;cursor:pointer;transition:background .15s;}
.ll-send-btn:hover{background:#000;color:#fff;}
.ll-date-sep{align-self:center;margin:10px 0;padding:3px 13px;border-radius:999px;font-size:.74rem;color:var(--text-muted);
  background:var(--surface);border:1px solid var(--hairline);}
.ll-msg{max-width:78%;padding:10px 14px;border-radius:16px;font-size:.93rem;line-height:1.45;margin:3px 0;
  background:var(--panel);border:1px solid var(--hairline);color:var(--text);align-self:flex-start;border-bottom-left-radius:5px;}
.ll-msg.mine{align-self:flex-end;background:var(--ink);border:none;color:#fff;border-bottom-left-radius:16px;border-bottom-right-radius:5px;}
.ll-msg-meta{font-size:.7rem;color:var(--text-muted);margin-top:3px;display:flex;align-items:center;gap:5px;}
.ll-msg.mine .ll-msg-meta{color:rgba(255,255,255,.75);justify-content:flex-end;}
.ll-msg-read{width:14px;height:14px;color:rgba(255,255,255,.85);}

/* ── Рабочее место: чат + AI ───────────────────────────────────── */
.ll-workspace{display:grid;grid-template-columns:1.15fr .85fr;gap:18px;align-items:stretch;}
.ll-ai-pane{display:flex;flex-direction:column;gap:12px;border-radius:18px;padding:16px;background:var(--surface);border:1px solid var(--hairline);}
.ll-ai-quick{display:flex;flex-wrap:wrap;gap:8px;}
.ll-ai-prompt{padding:7px 13px;border-radius:999px;font-size:.82rem;font-weight:500;cursor:pointer;background:var(--panel);border:1px solid var(--hairline);color:var(--text);}
.ll-ai-prompt:hover{background:var(--accent-soft);}
.ll-ai-answer{flex:1 1 auto;overflow-y:auto;padding:14px;border-radius:14px;background:var(--panel);border:1px solid var(--hairline);color:var(--text);font-size:.92rem;line-height:1.55;min-height:120px;}
.ll-norm-ok{display:inline-flex;align-items:center;gap:6px;margin-top:10px;padding:5px 11px;border-radius:999px;font-size:.8rem;font-weight:500;
  color:var(--success-ink);background:rgba(16,185,129,.10);border:1px solid rgba(16,185,129,.28);}
.ll-norm-bad{color:var(--warning-ink);background:rgba(245,158,11,.10);border-color:rgba(245,158,11,.28);}

/* ── Видео ─────────────────────────────────────────────────────── */
.ll-video-stage{position:relative;border-radius:18px;overflow:hidden;background:#0A0A0A;border:1px solid var(--hairline);min-height:360px;}
.ll-video-side{display:flex;flex-direction:column;border-radius:18px;overflow:hidden;background:var(--panel);border:1px solid var(--hairline);min-height:360px;}
.ll-video-ctrl{display:inline-flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:50%;
  border:1px solid var(--hairline);background:var(--panel);color:var(--text);cursor:pointer;transition:background .15s;}
.ll-video-ctrl:hover{background:var(--accent-soft);color:var(--text);}
.ll-video-ctrl.danger{background:var(--danger);border:none;color:#fff;}

/* ── Профиль ───────────────────────────────────────────────────── */
/* «Новое дело» (клиент): узкая центрированная колонка, нумерованные секции, чипы категорий. */
.ll-nc{max-width:680px;margin:0 auto;}
.ll-nc-back{display:inline-flex;align-items:center;gap:4px;font-size:.88rem;color:var(--text-muted);text-decoration:none;}
.ll-nc-back:hover{color:var(--text);}
.ll-nc-title{font-family:var(--font-serif);font-weight:400;font-size:clamp(1.9rem,4vw,2.5rem);text-align:center;margin:10px 0 6px;letter-spacing:-.005em;}
.ll-nc-lead{text-align:center;color:var(--text-muted);max-width:52ch;margin:0 auto 22px;font-size:.97rem;line-height:1.5;}
.ll-nc-card{padding:clamp(18px,3vw,32px);border-radius:20px;}
.ll-nc-section{padding:0 0 22px;margin-bottom:22px;border-bottom:1px solid var(--hairline);}
.ll-nc-section:last-of-type{border-bottom:none;margin-bottom:0;padding-bottom:0;}
.ll-nc-label{display:flex;align-items:center;gap:10px;font-family:var(--font-serif);font-size:1.12rem;margin-bottom:10px;color:var(--text);}
.ll-nc-num{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;background:var(--ink);color:#F5F5F2;font-family:var(--font-sans);font-size:.78rem;font-weight:600;flex:none;}
.ll-nc-req{color:var(--danger-ink);font-family:var(--font-sans);font-size:.9rem;}
.ll-nc-opt{font-family:var(--font-sans);font-size:.78rem;color:var(--text-faint);margin-left:auto;font-weight:400;}
.ll-nc-hint{font-size:.8rem;color:var(--text-muted);margin-top:6px;}
.ll-nc-count{color:var(--text-faint);white-space:nowrap;}
.ll-nc-input-title{font-family:var(--font-serif);font-size:1.15rem;padding:.7rem .95rem;}
.ll-nc-textarea{line-height:1.5;resize:none;overflow:hidden;min-height:168px;}
.ll-nc-chips{display:flex;flex-wrap:wrap;gap:8px;}
.ll-nc-chip{position:relative;margin:0;cursor:pointer;}
.ll-nc-chip input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none;}
.ll-nc-chip span{display:inline-flex;align-items:center;min-height:38px;padding:6px 14px;border-radius:999px;border:1px solid rgba(0,0,0,.18);background:var(--panel);font-size:.9rem;color:var(--text);transition:background .12s,border-color .12s,color .12s;}
.ll-nc-chip:hover span{border-color:rgba(0,0,0,.4);}
.ll-nc-chip input:checked+span{background:var(--ink);border-color:var(--ink);color:#F5F5F2;}
.ll-nc-chip input:focus-visible+span{outline:2px solid var(--ink);outline-offset:2px;}
.ll-nc-amount{max-width:260px;}
.ll-nc-amount .input-group-text{background:var(--surface);font-family:var(--font-serif);}
.ll-nc-docs{display:flex;align-items:flex-start;gap:10px;margin:22px 0 0;padding:12px 14px;border-radius:12px;background:var(--surface);font-size:.85rem;color:var(--text-muted);}
.ll-nc-docs .ll-ic{flex:none;color:var(--text);}
.ll-nc-actions{display:flex;justify-content:center;margin-top:26px;}
.ll-nc-submit{padding-left:26px;padding-right:22px;display:inline-flex;align-items:center;gap:8px;opacity:.72;transition:opacity .15s,transform .15s;}
.ll-nc-submit.is-ready{opacity:1;}
.ll-nc-submit.is-ready:hover{transform:translateY(-1px);}
.ll-nc-next{margin-top:26px;padding:20px 22px 6px;border-radius:16px;background:var(--ink);color:#F5F5F2;}
.ll-nc-next-title{font-family:var(--font-serif);font-size:1.15rem;margin-bottom:16px;}
.ll-nc-timeline{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;position:relative;}
.ll-nc-timeline::before{content:"";position:absolute;left:14px;right:14px;top:14px;height:1px;background:rgba(255,255,255,.22);}
.ll-nc-timeline li{position:relative;padding-bottom:14px;}
.ll-nc-tl-num{position:relative;z-index:1;display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background:#F5F5F2;color:var(--ink);font-family:var(--font-sans);font-size:.82rem;font-weight:600;line-height:1;margin-bottom:10px;box-shadow:0 0 0 4px var(--ink);}
.ll-nc-timeline b{display:block;font-weight:600;font-size:.9rem;margin-bottom:3px;}
.ll-nc-timeline li>span:last-child{display:block;font-size:.8rem;color:rgba(255,255,255,.66);line-height:1.45;}
.ll-nc-secure{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:16px;font-size:.8rem;color:var(--text-faint);text-align:center;}
@media (max-width:767.98px){
  .ll-nc-timeline{grid-template-columns:1fr;gap:14px;}
  .ll-nc-timeline::before{left:14px;right:auto;top:14px;bottom:14px;width:1px;height:auto;}
  .ll-nc-timeline li{display:grid;grid-template-columns:28px 1fr;column-gap:12px;padding-bottom:0;}
  .ll-nc-timeline li:last-child{padding-bottom:14px;}
  .ll-nc-tl-num{margin-bottom:0;}
  .ll-nc-timeline b,.ll-nc-timeline li>span:last-child{grid-column:2;}
  .ll-nc-submit{width:100%;justify-content:center;}
  .ll-nc-amount{max-width:none;}
}

/* Профиль: карточки по центру колонки, шапка — аватар по центру, имя под ним (Lora). */
.ll-profile-card{max-width:640px;margin-left:auto;margin-right:auto;}
.ll-profile-title{text-align:center;}
.ll-profile-title+p{margin-left:auto;margin-right:auto;text-align:center;}
.ll-profile-hero{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;padding:8px 0 24px;margin-bottom:24px;border-bottom:1px solid var(--hairline);}
.ll-profile-avatar{position:relative;width:112px;height:112px;margin-bottom:8px;cursor:pointer;border-radius:50%;}
.ll-profile-avatar .ll-avatar-img,.ll-profile-avatar .ll-avatar{width:112px;height:112px;border-radius:50%;object-fit:cover;font-size:2.6rem;font-family:var(--font-serif);font-weight:400;box-shadow:0 0 0 4px var(--panel),0 0 0 5px var(--hairline);}
.ll-profile-avatar-edit{position:absolute;right:2px;bottom:2px;width:32px;height:32px;border-radius:50%;background:var(--ink);color:#F5F5F2;display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 3px var(--panel);}
.ll-profile-avatar:hover .ll-profile-avatar-edit{background:#000;}
.ll-profile-name{font-family:var(--font-serif);font-size:1.55rem;font-weight:400;line-height:1.2;color:var(--text);letter-spacing:.005em;}
.ll-profile-role{font-size:.9rem;color:var(--text-muted);}
.ll-profile-hint{font-size:.8rem;color:var(--text-muted);max-width:40ch;}
.ll-profile-hint:empty{display:none;}
.ll-profile-card .form-label{font-weight:400;color:var(--text-muted);font-size:.86rem;margin-bottom:.3rem;}
.ll-profile-card .form-control,.ll-profile-card .form-select{font-weight:400;}
.ll-profile-card .fw-semibold{font-weight:500;}
.ll-profile-card .form-text{font-weight:400;}
.ll-profile-meter{display:flex;align-items:center;gap:12px;}
.ll-profile-meter .progress{flex:1 1 auto;height:8px;}
.ll-avatar-upload{position:relative;display:inline-flex;}
.ll-avatar-img{width:72px;height:72px;border-radius:50%;object-fit:cover;border:1px solid var(--hairline);}

/* ── Документы: папки + таблица ────────────────────────────────── */
.ll-docs{display:grid;grid-template-columns:236px minmax(0,1fr);gap:16px;align-items:start;}
.ll-docs-aside{border-radius:14px;border:1px solid var(--hairline);background:var(--panel);padding:12px;}
.ll-folder-list{list-style:none;margin:8px 0;padding:0;display:flex;flex-direction:column;gap:2px;max-height:360px;overflow:auto;}
.ll-folder{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:10px;cursor:pointer;color:var(--text-muted);
  font-size:.88rem;border:1px solid transparent;transition:background .15s,color .15s,border-color .15s;}
.ll-folder:hover{background:rgba(0,0,0,.04);color:var(--text);}
.ll-folder.active{background:var(--accent-soft);color:var(--text);border-color:rgba(0,0,0,.10);}
.ll-folder .ll-ic{opacity:.85;}
.ll-folder-count{margin-left:auto;font-size:.74rem;color:var(--text-muted);background:var(--surface);border-radius:999px;padding:1px 8px;min-width:22px;text-align:center;}
.ll-folder.drop{border-color:var(--ink);border-style:dashed;background:var(--surface);color:var(--text);}
.ll-folder.drop .ll-folder-count{display:none;}
.ll-folder-droplabel{margin-left:auto;font-size:.7rem;color:var(--text-muted);}
.ll-docs-table{width:100%;border-collapse:separate;border-spacing:0;}
.ll-docs-table thead th{font-family:'Golos Text',sans-serif;font-weight:600;font-size:.72rem;letter-spacing:.05em;text-transform:uppercase;
  color:var(--text-muted);text-align:left;padding:8px 12px;border-bottom:1px solid var(--hairline);}
.ll-docs-table tbody td{padding:11px 12px;border-bottom:1px solid var(--hairline);vertical-align:middle;font-size:.9rem;}
.ll-docs-table tbody tr:hover td{background:rgba(0,0,0,.025);}
.ll-docs-table tbody tr[draggable="true"]{cursor:grab;}
.ll-docs-row-name{display:flex;align-items:center;gap:9px;color:var(--text);}
.ll-docs-row-name .ll-ic{color:var(--text-muted);}
.ll-docs-toolbar{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;margin-bottom:10px;background:var(--surface);border:1px solid var(--hairline);}
.ll-enc-note{display:flex;align-items:flex-start;gap:7px;margin-top:10px;font-size:.74rem;color:var(--text-muted);line-height:1.4;}
.ll-enc-note .ll-ic{color:var(--success-ink);flex:none;margin-top:1px;}
@media (max-width:680px){ .ll-docs{grid-template-columns:1fr;} .ll-folder-list{max-height:200px;} }

/* ── Мобильная нижняя навигация ────────────────────────────────── */
.ll-bottomnav{display:none;}
@media (max-width:991.98px){
  /* Блюр/полупрозрачность (60%) — решение владельца, НЕ переносим «непрозрачное меню»
     из макета (ТЗ §B); гард test_g2b_bottomnav_keeps_blur. Геометрия — по ТЗ §D 0.3. */
  .ll-bottomnav{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:1030;justify-content:space-around;align-items:stretch;
    padding:7px 4px calc(7px + env(safe-area-inset-bottom));
    background:rgba(254,254,254,.94);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-top:1px solid var(--hairline);}
  .ll-bn-item{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:52px;padding:4px 2px;border-radius:14px;
    text-decoration:none;color:var(--text-muted);font-size:10px;font-weight:500;line-height:1.15;text-align:center;
    transition:background .15s ease,color .15s ease;}
  /* Активная вкладка — сплошная тёмная плашка на всю вкладку (ТЗ §D 0.3), а не подсветка
     иконки. Наружный нижний угол крайних вкладок скруглён сильнее — подгонка под корпус. */
  .ll-bn-item.active{background:var(--ink);color:#fff;margin:0 2px;padding:7px 2px;}
  .ll-bn-item.active:first-child{border-radius:14px 14px 14px 22px;}
  .ll-bn-item.active:last-child{border-radius:14px 14px 22px 14px;}
  .ll-bn-item .ll-ic{width:22px;height:22px;padding:2px;flex:none;}
  .ll-bn-item:active{background:rgba(0,0,0,.04);}
  .ll-bn-item.active:active{background:var(--ink);}
  /* UX-11: Bootstrap's .py-4 puts padding-bottom:1.5rem !important on <main>, which beats
     this rule unless it is also !important — without it the fixed bottom nav (66px) covers
     the last buttons («Сохранить», «Оставить заявку»).
     Резерв ДОЛЖЕН включать env(safe-area-inset-bottom): само меню (.ll-bottomnav выше)
     резервирует инсет в своём padding, поэтому на iOS его высота вырастает на ~34px, когда
     адресная строка браузера сворачивается (Яндекс.Браузер iOS: тулбар и home-индикатор
     взаимоисключающи → env со свёрнутым тулбаром = ~34px, а не 0). Статичные 78px тогда НЕ
     докрывали меню, и последняя карточка застревала под ним (страница «не доскролливалась»).
     calc(78px + env) растёт синхронно с меню: при видимой строке env=0 → те же 78px. */
  body.has-bottomnav main.container,body.has-bottomnav main.container-fluid{padding-bottom:calc(78px + env(safe-area-inset-bottom))!important;}
}

/* ── Адаптив ───────────────────────────────────────────────────── */
@media (max-width:991.98px){
  .card{background:var(--panel);}
  .ll-cabinet-row{display:flex;flex-direction:column;}
  .ll-cabinet-row .ll-cabinet-aside{order:2;}
  .ll-cabinet-row .ll-cabinet-main{order:1;}
  /* UX-12: the touch-target floor must reach .btn-sm too — the public hamburger, the
     notification bell and every filter chip were 31px tall (WCAG 2.5.5 asks 44). */
  .btn:not(.ll-send-btn){min-height:44px;}
  .form-control,.form-select{min-height:44px;}
  /* UX-29: a control with font-size < 16px makes iOS Safari zoom the page on focus and
     never zoom back. Lift the small variants (search, video chat) to the no-zoom floor. */
  .form-control-sm,.form-select-sm{font-size:16px;}
  /* UX-13: the mandatory 152-FZ consent box was a 16×16 target (13% of a 44×44 area).
     Lift every checkbox/radio to the floor and lay its row out as flex so the enlarged
     control aligns with the label instead of colliding with Bootstrap's negative float. */
  .form-check-input{min-width:44px;min-height:44px;}
  .form-check:not(.form-switch){display:flex;align-items:flex-start;gap:.6rem;padding-left:0;}
  .form-check:not(.form-switch) .form-check-input{flex:none;float:none;margin:0;}
  /* UX-17: subtract the fixed bottom nav (~66px) as well as the header (132px), or the
     chat composer renders under the nav and taps land on «Профиль». dvh + vh fallback. */
  .ll-chat-shell{height:calc(100vh - 210px);height:calc(100dvh - 210px);}
  .ll-workspace{grid-template-columns:1fr;}
}
@media (max-width:575.98px){
  .ll-action-grid{grid-template-columns:repeat(4,1fr);}
  .ll-action{min-height:74px;font-size:.74rem;padding:10px 4px;}
}
/* Пиксель-сверка с макетом (артефакт, экраны 1/4/8): статус-пилюли там набраны
   обычным регистром («В работе», «Новое», «Ожидает»), а не капслоком. Десктопный
   .badge{text-transform:uppercase} — более старая (Aira) договорённость, её не
   трогаем; переопределяем только в мобильном скоупе, как и весь остальной v3. */
@media (max-width:991.98px){
  .badge{text-transform:none;letter-spacing:normal;}
}
@media (prefers-reduced-motion:reduce){ .ll-step.active .ll-step-mark{box-shadow:none;} }

/* ── Вложения в чате ───────────────────────────────────────────── */
.ll-att-thumb{display:inline-block;border-radius:12px;overflow:hidden;border:1px solid var(--hairline);max-width:220px;line-height:0}
.ll-att-thumb img{display:block;max-width:220px;max-height:200px;width:auto;height:auto;object-fit:cover}
.ll-att-file{display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:12px;border:1px solid var(--hairline);background:var(--panel);text-decoration:none;color:inherit;max-width:280px}
.ll-att-file:hover{border-color:rgba(0,0,0,.28);background:var(--surface)}
.ll-att-file .ll-att-file-meta{display:flex;flex-direction:column;min-width:0;flex:1}
.ll-att-file .ll-att-file-name{font-size:.85rem;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ll-att-file .ll-att-file-size{font-size:.72rem;color:var(--text-muted)}

/* Группа вложений одного сообщения (несколько фото/документов — как в WhatsApp). */
.ll-att-group{display:flex;flex-wrap:wrap;gap:5px;max-width:260px}
.ll-att-group .ll-att-file{max-width:100%;flex:1 1 100%}
/* Плитка-миниатюра (фото или «миникопия» документа). Тап открывает просмотр. */
.ll-att-media{position:relative;display:block;border-radius:12px;overflow:hidden;border:1px solid var(--hairline);
  line-height:0;background:var(--surface);cursor:pointer;text-decoration:none}
.ll-att-media img{display:block;width:100%;height:100%;object-fit:cover}
/* Один элемент — крупно; два и более — квадратная сетка 2 колонки. */
.ll-att-group[data-count="1"]{max-width:240px}
.ll-att-group[data-count="1"] .ll-att-media{max-width:240px}
.ll-att-group[data-count="1"] .ll-att-media img{max-height:280px;height:auto}
.ll-att-group:not([data-count="1"]) .ll-att-media{flex:1 1 calc(50% - 3px);aspect-ratio:1/1}
/* Бейдж типа документа поверх миникопии (PDF / DOCX …). */
.ll-att-doc-badge{position:absolute;left:6px;bottom:6px;padding:2px 7px;border-radius:6px;
  font-size:10px;font-weight:600;letter-spacing:.03em;color:#fff;background:rgba(20,20,20,.82);line-height:1.3}

/* Плитки вложений в поле ввода (перед отправкой): миникопия + прогресс + крестик. */
#attachment-preview{display:none;flex-wrap:wrap;gap:8px}
.ll-att-tile{position:relative;width:66px;height:66px;border-radius:12px;overflow:hidden;
  border:1px solid var(--hairline);background:var(--surface);flex:none}
.ll-att-tile-img{width:100%;height:100%;object-fit:cover;display:block}
.ll-att-tile-doc{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding:5px;text-align:center}
.ll-att-tile-doc .ll-att-tile-name{font-size:9px;line-height:1.15;max-height:2.3em;overflow:hidden;color:var(--text-muted);word-break:break-word}
.ll-att-tile-bar{position:absolute;left:0;right:0;bottom:0;height:3px;background:rgba(0,0,0,.12)}
.ll-att-tile-bar-fill{height:100%;width:0;background:var(--ink);transition:width .15s ease}
.ll-att-tile-x{position:absolute;top:2px;right:2px;width:20px;height:20px;padding:0;display:flex;align-items:center;justify-content:center;
  border:0;border-radius:50%;background:rgba(20,20,20,.72);color:#fff;cursor:pointer}
.ll-att-tile-x .ll-ic-sm{width:13px;height:13px}
.ll-att-tile.done .ll-att-tile-bar{display:none}
/* Пока идёт загрузка вложений — кнопка-скрепка превращается в крутящийся круг. */
#chat-file-btn.is-uploading .ll-ic{display:none}
/* display:block обязателен: у inline-псевдоэлемента width/height/transform не применяются —
   без него вместо круга рисовалась вертикальная «щепка» (проверено скриншотом 2026-09-22). */
#chat-file-btn.is-uploading::after{content:"";display:block;box-sizing:border-box;margin:0 auto;
  width:20px;height:20px;border-radius:50%;
  border:2.5px solid var(--hairline);border-top-color:var(--ink);animation:ll-spin .7s linear infinite}
@keyframes ll-spin{to{transform:rotate(360deg)}}

/* Внутренний просмотрщик фото (лайтбокс). */
.ll-lightbox{position:fixed;inset:0;z-index:2000;display:flex;align-items:center;justify-content:center;
  background:rgba(8,8,8,.92);padding:env(safe-area-inset-top) 12px env(safe-area-inset-bottom)}
.ll-lightbox[hidden]{display:none}
.ll-lightbox-img{max-width:100%;max-height:100%;object-fit:contain;border-radius:6px}
.ll-lightbox-close{position:absolute;top:calc(env(safe-area-inset-top) + 12px);right:14px;width:42px;height:42px}
.ll-lightbox-close,.ll-lightbox-nav{display:flex;align-items:center;justify-content:center;border:0;border-radius:50%;
  background:rgba(255,255,255,.14);color:#fff;cursor:pointer}
.ll-lightbox-nav{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px}
.ll-lightbox-nav[hidden]{display:none}
.ll-lightbox-prev{left:10px}
.ll-lightbox-next{right:10px}
.ll-lightbox-close .ll-ic,.ll-lightbox-nav .ll-ic{width:22px;height:22px}
body.ll-lightbox-open{overflow:hidden}

.ll-balance-fit{display:inline-block;max-width:100%;white-space:nowrap;transform-origin:left center}

/* ── Sticky-хедер: плавно сжимается при скролле (ТЗ §7.2 / §18.2) ── */
.lp-header{position:sticky;top:0;z-index:1031;background:rgba(254,254,254,.86);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid var(--hairline);
  transition:box-shadow .15s ease,background .15s ease;}
.lp-header .container,.lp-header .container-fluid{transition:height .15s ease;}
.lp-header.is-compact{box-shadow:0 6px 20px rgba(0,0,0,.06);}
.lp-header.is-compact .container,.lp-header.is-compact .container-fluid{height:56px!important;}
.lp-hair{border-top:1px solid var(--hairline);}

/* =====================================================================
   Централизованные утилиты (собраны из theme_requests поэкранной
   полировки кабинетов — единый источник вместо локальных инлайнов).
   ===================================================================== */

/* Тихая ссылка в KPI-плитках («Пополнить →», «Все дела →») — графит,
   без подчёркивания, темнеет на hover (был инлайн style в 3+ местах). */
.ll-kpi-link{color:var(--text);text-decoration:none;font-weight:500;transition:color .15s;}
.ll-kpi-link:hover{color:#000;text-decoration:none;}

/* Приглушённый текст (таймстемпы уведомлений, даты блога). */
.text-faint{color:var(--text-faint)!important;}

/* Бейдж-счётчик у пунктов сайдбара (тёмная пилюля с числом, эталон §04). */
.ll-nav-count{margin-left:auto;min-width:20px;height:20px;padding:0 6px;border-radius:999px;
  display:inline-flex;align-items:center;justify-content:center;font-size:.7rem;font-weight:600;
  background:var(--ink);color:#fff;border:1px solid var(--ink);}
.sidebar-link.active .ll-nav-count{background:#fff;color:var(--ink);border-color:transparent;}

/* Ведущая статус-точка в семантических пилюлях статуса дела (эталон §04/§18).
   Применяется ТОЛЬКО к пилюлям статуса (через класс в _case_status_badge),
   счётчики-бейджи (nav-pills) её не получают. */
.badge.ll-badge-status{display:inline-flex;align-items:center;gap:6px;}
.badge.ll-badge-status::before{content:"";width:6px;height:6px;border-radius:50%;
  background:currentColor;flex:none;opacity:.85;}

/* Оверлейная пилюля поверх тёмной видео-сцены (light-on-dark, эталон §11). */
.ll-video-overlay-pill{display:inline-flex;align-items:center;gap:7px;padding:7px 14px;border-radius:999px;
  color:#F5F5F2;font-size:.82rem;font-weight:500;background:rgba(10,10,10,.62);
  border:1px solid rgba(255,255,255,.18);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);}
.ll-video-overlay-pill .ll-dot::after{background:#10B981;}

/* Обложка карточки блога — единый формат 16/10 с плейсхолдером. */
.ll-blog-cover{display:block;width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:16px;
  border:1px solid var(--hairline);background:var(--surface);}

/* ── Круглые икон-кнопки (K1 = дефекты G4/BAL6, ТЗ §D 0.2) ────────
   Иконка строго по центру круга; 44px — проектный тач-минимум (UX-12).
   Применяется к #notif-btn (верхний бар) и к сбросу фильтра истории платежей. */
.ll-ic-btn{position:relative;flex:none;width:44px;height:44px;padding:0;
  display:inline-flex;align-items:center;justify-content:center;
  border-radius:50%;border:1px solid rgba(0,0,0,.12);
  background:var(--panel);color:var(--text);text-decoration:none;
  transition:background .15s ease,color .15s ease;}
.ll-ic-btn:hover{background:var(--surface);color:var(--text);}
.ll-ic-btn:focus-visible{outline:2px solid var(--text);outline-offset:2px;}
.ll-ic-btn>.ll-ic,.ll-ic-btn>.ll-ic-sm{display:block;flex:none;}
/* Бейдж непрочитанных — «выкус» внутри круга (ТЗ §D 0.2), а не Bootstrap-снос за край. */
.ll-ic-btn>.ll-ic-badge{position:absolute;top:5px;right:5px;
  min-width:16px;height:16px;padding:0 4px;
  display:inline-flex;align-items:center;justify-content:center;
  border-radius:999px;background:var(--danger);border:2px solid var(--panel);
  color:#fff;font-size:10px;font-weight:600;line-height:1;}
.ll-ic-btn>.ll-ic-badge.d-none{display:none;}

/* ── K2b: клавиатура (visualViewport, ТЗ §A) ──────────────────────
   --vvb выставляет static/js/viewport-fix.js; без JS var(--vvb,0px) = 0 → прежнее
   поведение. Правило намеренно живёт внутри мобильного медиа-квери: на десктопе
   --vvb почти всегда 0, но даже ненулевое значение туда не дотянется.
   ВАЖНО (владелец, живой Яндекс.Браузер iOS, 2026-07-18): раньше здесь ещё был
   безусловный transform:translateY(-var(--vvb)) — компенсация «на глаз» под
   адресную строку. В Safari/Chrome эмуляции выглядело нормально, но на реальном
   Яндекс.Браузере (своя, не-системная адресная строка/тулбар поверх WKWebView)
   visualViewport после её сворачивания не всегда обнуляется до 0 — --vvb застревал
   ненулевым, и меню оказывалось сдвинуто ВВЕРХ от истинного края, оставляя под
   собой пустую полосу — то есть НАШ ЖЕ фикс воспроизводил баг, который должен был
   чинить. position:fixed;bottom:0 (см. .ll-bottomnav ниже) сам по себе корректно
   следует за реальным вьюпортом при сворачивании/разворачивании браузерного хрома
   в любом современном движке — без JS-компенсации это просто работает. Клавиатуру
   компенсировать по-прежнему нужно (её открытие — надёжный бинарный сигнал через
   body.kb-open, а не хрупкая непрерывная дельта), поэтому translateY(100%) остаётся. */
@media (max-width:991.98px){
  .ll-bottomnav{transition:transform .15s ease;will-change:transform;}
  /* Клавиатура открыта — меню уходит вниз, чтобы не перекрывать поле ввода. */
  body.kb-open .ll-bottomnav{transform:translateY(100%);}
}
@media (prefers-reduced-motion:reduce){
  .ll-bottomnav{transition:none;}
}

/* K2c: пока меню уехало под открытой клавиатурой, нужен видимый способ её закрыть.
   Кнопка живёт НАД клавиатурой — --vvb здесь безопасен (это уже подтверждённый бинарный
   сигнал body.kb-open, а не хрупкая непрерывная дельта адресной строки — см. K2b выше). */
.ll-kb-dismiss{display:none;}
@media (max-width:991.98px){
  body.kb-open .ll-kb-dismiss{
    display:inline-flex;position:fixed;z-index:1031;right:16px;
    bottom:calc(env(safe-area-inset-bottom) + var(--vvb, 0px) + 12px);
    box-shadow:0 6px 18px rgba(0,0,0,.14);
  }
}

/* Мелочи мобильного хрома (ТЗ §D 0.6/0.7). Полировка UX-аудита: «поп» иконки
   активной вкладки и бегущая строка шапки чата убраны — в рабочих кабинетах
   анимации-шум. Активная вкладка меняется мгновенно, длинный заголовок режется
   многоточием (.ll-chat-title-marquee ниже). */
@media (prefers-reduced-motion:reduce){
  .ll-bn-item{transition:none!important;}
}
@media (max-width:991.98px){
  /* Скроллбары страничной прокрутки на мобильном скрыты (в макете их нет; на тач-устройствах
     они и так оверлейные). Десктопная стилизация ползунка (11px) не затрагивается. */
  html,body{scrollbar-width:none;-ms-overflow-style:none;}
  html::-webkit-scrollbar,body::-webkit-scrollbar{display:none;width:0;height:0;}
}

/* ── Календарь клиента (read-only, K5 · ТЗ Экран 7) ───────────────
   Серверная месячная сетка: без FullCalendar, без интерактива.
   Дни недели и выходные — var(--text-faint) #737371 (проектный контраст UX-3),
   а не макетный #9A9A96. Размеры сетки — относительные (1fr), см. ТЗ §E. */
.ll-cal-h1{font-family:'Lora',serif;font-weight:400;font-size:24px;color:var(--text);}
.ll-cal-title{font-family:'Lora',serif;font-weight:400;font-size:17px;color:var(--text);}
.ll-cal-dow{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;margin-bottom:6px;
  text-align:center;font-size:10.5px;letter-spacing:.03em;text-transform:uppercase;color:var(--text-faint);}
.ll-cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;text-align:center;font-size:13px;}
.ll-cal-cell{display:flex;align-items:center;justify-content:center;padding:7px 0;}
.ll-cal-day{display:inline-flex;align-items:center;justify-content:center;
  min-width:30px;height:30px;border-radius:50%;color:var(--text);}
.ll-cal-day--faint{color:var(--text-faint);}
.ll-cal-day--other{color:var(--text-faint);opacity:.45;}
/* Сегодня — контур; день с событиями — заливка (заливка приоритетнее). */
.ll-cal-day--today{border:1.5px solid var(--ink);}
.ll-cal-day--event{background:var(--ink);color:#fff;font-weight:500;}
.ll-cal-sub{font-size:14px;font-weight:600;color:var(--text);margin:0 2px 10px;}
.ll-cal-ev-title{font-size:14px;font-weight:500;color:var(--text);}
.ll-cal-ev-meta{font-size:12.5px;color:var(--text-muted);}
/* Амбер-тинт икон-бокса вне контекста .ll-attention (те же значения, что у .ll-att-amber). */
.ll-icon-box--warning{background:rgba(245,158,11,.10);color:var(--warning-ink);border-color:rgba(245,158,11,.28);}

/* ── Аватар-пилюля меню пользователя (K1 · ТЗ §D 0.2) ─────────────
   На мобильном — только аватар + шеврон (эталон); на десктопе внутри пилюли
   остаётся имя. Высота 44px = тач-минимум (UX-12). */
.ll-user-pill{display:inline-flex;align-items:center;gap:3px;height:44px;padding:0 8px 0 5px;
  border-radius:999px;border:1px solid rgba(0,0,0,.12);background:var(--panel);color:var(--text);
  font-family:inherit;font-size:.9rem;transition:background .15s ease;}
.ll-user-pill:hover{background:var(--surface);}
.ll-user-pill:focus-visible{outline:2px solid var(--text);outline-offset:2px;}
.ll-user-pill-av{width:34px;height:34px;border-radius:50%;object-fit:cover;font-size:13px;flex:none;}
.ll-user-pill>.ll-ic-sm{flex:none;}
@media (min-width:992px){ .ll-user-pill{padding-right:12px;gap:7px;} }

@media (max-width:991.98px){
  /* ТЗ §D 0.2: высота верхнего бара 50px (44px кнопки + 3px воздуха сверху/снизу).
     Дефолтный Bootstrap-паддинг давал 101px — бар съедал ~12% высоты экрана. */
  nav.navbar{min-height:50px;padding-top:3px;padding-bottom:3px;}
  nav.navbar .navbar-brand{font-size:15px;padding-top:0;padding-bottom:0;}
}

/* ── Плитки быстрых действий и строки-ссылки дашборда (ТЗ Экран 1, §2.5/2.6) ──
   Сетка на 1fr — на планшете 768px плитки растягиваются, а не остаются полосой. */
.ll-quick-tiles{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px;}
.ll-tile{display:flex;flex-direction:column;justify-content:space-between;gap:12px;
  min-height:124px;padding:16px;border-radius:16px;text-decoration:none;overflow:hidden;}
.ll-tile-dark{background:var(--ink);color:#F5F5F2;}
.ll-tile-dark:hover,.ll-tile-dark:focus{color:#F5F5F2;background:#000;}
.ll-tile-ic{display:inline-flex;align-items:center;justify-content:center;flex:none;
  width:40px;height:40px;border-radius:12px;background:rgba(255,255,255,.14);color:#F5F5F2;}
.ll-tile-title{font-family:'Lora',serif;font-size:18px;line-height:1.12;}
.ll-tile-light{background:var(--panel);border:1px solid var(--hairline);color:var(--text);}
.ll-tile-light:hover,.ll-tile-light:focus{color:var(--text);background:var(--surface);}
.ll-tile-cap{font-size:10px;letter-spacing:.04em;text-transform:uppercase;color:var(--text-faint);}
.ll-tile-name{font-size:14px;font-weight:600;margin-top:1px;}
.ll-tile-go{display:inline-flex;align-items:center;gap:4px;font-size:12.5px;color:var(--text-muted);margin-top:3px;}

/* Мобильный список операций (эталон Экран 3 «История платежей») — карточка-строка
   вместо десктопной таблицы, которая на 390px уходила в горизонтальный скролл. */
.ll-tx-row{display:flex;align-items:center;gap:12px;padding:14px 16px;}
.ll-tx-row+.ll-tx-row{border-top:1px solid var(--hairline);}

/* ── Контекстное нижнее меню «только Назад» (ТЗ §D 0.4) ───────────
   Экран объявляет body.nav-back — генерическое меню на нём скрыто, вместо него
   одна центральная пилюля возврата. Отступ контента под меню (UX-11) общий. */
@media (max-width:991.98px){
  body.nav-back .ll-bottomnav:not(.ll-bottomnav-back){display:none;}
  .ll-bottomnav-back{justify-content:center;align-items:center;
    padding:12px 4px calc(12px + env(safe-area-inset-bottom));}
  .ll-bn-back{display:inline-flex;align-items:center;gap:9px;padding:13px 32px;border-radius:999px;
    background:var(--accent-soft);color:var(--text);font-size:14px;font-weight:500;text-decoration:none;}
  .ll-bn-back:hover{background:var(--surface);color:var(--text);}
}

/* Строка ленты событий: разделители между строками, у последней — нет (ТЗ Экран 9 §2.4). */
.ll-feed-row{padding:14px 0;border-bottom:1px solid var(--hairline);}
.ll-feed-row:last-child{border-bottom:0;}

/* Колонка кнопок выбора способа оплаты (ТЗ Экран 2 §2.4.5). */
.ll-pay-methods{display:flex;flex-direction:column;gap:10px;}
.ll-pay-methods .btn{display:flex;align-items:center;justify-content:center;gap:10px;padding:12px;}

/* ── Стороны дела рядом (K14 · ТЗ Экран 4 §2.6) ───────────────────
   Две кликабельные карточки-ссылки в ряд; сетка на 1fr — тянется по ширине. */
.ll-parties{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.ll-party{display:flex;flex-direction:column;align-items:center;text-align:center;gap:7px;
  padding:16px 10px;border-radius:16px;background:var(--panel);border:1px solid var(--hairline);
  text-decoration:none;color:inherit;}
.ll-party:hover{color:inherit;background:var(--surface);}
.ll-party-role{font-size:10.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--text-faint);}
.ll-party-name{font-size:14px;font-weight:600;}
.ll-party-go{display:inline-flex;align-items:center;gap:4px;font-size:12.5px;font-weight:500;color:var(--text);}

/* ── Контекстное меню карточки дела (K17 · ТЗ §D 0.5) ─────────────
   Пункты — действия, а не вкладки: без active-плашки, полным цветом текста. */
@media (max-width:991.98px){
  body.nav-case .ll-bottomnav:not(.ll-bottomnav-case){display:none;}
  .ll-bn-item--action{color:var(--text);background:none;border:0;font-family:inherit;}
  .ll-bn-item--action:hover{color:var(--text);}
}

/* ── Чат на весь экран (K18–K20 · ТЗ Экран 5) ─────────────────────
   Требование владельца: шелл от 0 до нижней кромки (844px при экране 844),
   меню и навбар кабинета на этом экране не показываются, композер прижат к низу.
   Всё строго под body.chat-fullscreen и только на мобильном — базовое правило
   .ll-chat-shell{height:calc(100dvh - 210px)} (UX-17) не трогается. */
@media (max-width:991.98px){
  body.chat-fullscreen{overflow:hidden;}
  body.chat-fullscreen nav.navbar,
  body.chat-fullscreen .ll-bottomnav{display:none;}
  body.chat-fullscreen main.container,
  body.chat-fullscreen main.container-fluid{padding:0!important;max-width:none;}
  body.chat-fullscreen .ll-cabinet-row,
  body.chat-fullscreen .ll-cabinet-main{margin:0;padding:0;}
  body.chat-fullscreen .ll-chat-page{max-width:none;padding:0;}
  body.chat-fullscreen .ll-chat-shell{position:fixed;inset:0;
    height:100dvh;min-height:0;max-height:none;
    border:0;border-radius:0;margin:0;
    display:flex;flex-direction:column;}
  /* Скроллится только лента. */
  body.chat-fullscreen .ll-chat-scroll{flex:1 1 auto;min-height:0;overflow-y:auto;
    padding:14px;gap:5px;}
  body.chat-fullscreen .ll-chat-head,
  body.chat-fullscreen .ll-chat-foot{flex:none;}
  body.chat-fullscreen .ll-chat-foot{padding-bottom:max(6px, env(safe-area-inset-bottom));}
  /* Клавиатура: шелл ужимается на видимую часть вьюпорта (K2b). */
  body.chat-fullscreen .ll-chat-shell{height:calc(100dvh - var(--vvb, 0px));}
}

/* Шапка собеседника: аватар, имя, бегущая строка дела. */
.ll-chat-peer{flex:1;min-width:0;}
.ll-chat-peer-name{font-size:15px;font-weight:600;line-height:1.2;color:var(--text);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.ll-chat-peer-sub{font-size:12px;color:var(--text-muted);}
.ll-chat-peer-av{width:40px;height:40px;border-radius:50%;object-fit:cover;font-size:15px;flex:none;}
/* Заголовок дела в шапке чата — статичный срез многоточием на любой ширине
   (класс исторически зовётся «marquee», но бегущей строки больше нет — UX-аудит). */
.ll-chat-title-marquee{height:16px;overflow:hidden;}
.ll-chat-title-marquee>span{display:block;white-space:nowrap;font-size:12px;color:var(--text-muted);
  overflow:hidden;text-overflow:ellipsis;}

/* ── Видеозвонок на весь экран (K21 · ТЗ Экран 6) ─────────────────
   По образцу чата: сцена от 0 до нижней кромки, кабинетный хром скрыт,
   свой верхний бар поверх сцены, снизу — кнопка «Открыть чат и документы».
   Всё под body.video-fullscreen и только на мобильном. */
@media (max-width:991.98px){
  body.video-fullscreen{overflow:hidden;}
  body.video-fullscreen nav.navbar,
  body.video-fullscreen .ll-bottomnav{display:none;}
  body.video-fullscreen main.container,
  body.video-fullscreen main.container-fluid{padding:0!important;max-width:none;}
  body.video-fullscreen .ll-cabinet-row,
  body.video-fullscreen .ll-cabinet-main{margin:0;padding:0;}
  /* Саму сцену растягивает scoped-правило в session.html: там высота задана через
     #call-stage (ID сильнее класса), поэтому переопределять её отсюда бессмысленно. */
  /* Верхний бар — оверлей поверх видео, как в эталоне. */
  body.video-fullscreen .video-topbar{position:fixed;top:0;left:0;right:0;z-index:3;
    margin:0;padding:8px 12px calc(8px + env(safe-area-inset-top));
    background:rgba(254,254,254,.9);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
    border-bottom:1px solid var(--hairline);}
  /* Единственный нижний элемент — вход в чат и документы. */
  body.video-fullscreen .video-open-side{position:fixed;z-index:3;
    left:12px;right:12px;width:auto;margin:0;
    bottom:calc(12px + env(safe-area-inset-bottom) + var(--vvb, 0px));}
  body.video-fullscreen .video-side-wrap{position:static;}
}

/* ── Минимум текста на телефоне (owner, 2026-09-23) ─────────────────
   Второстепенные подписи и пояснения на <992px не показываются; то, что может
   понадобиться, прячется за кнопкой «Подробнее» (.ll-m-collapsed + [data-ll-more],
   см. static/js/mobile-more.js). Десктоп не меняется: там .ll-m-collapsed всегда
   раскрыт, а кнопка скрыта. */
.ll-more-btn{display:inline-flex;align-items:center;gap:4px;background:none;border:0;padding:0;
  font-size:12.5px;font-weight:500;color:var(--text-muted);font-family:inherit;}
.ll-more-btn:hover{color:var(--text);}
@media (min-width:992px){
  .ll-more-btn{display:none;}
}
@media (max-width:991.98px){
  .ll-m-hide{display:none!important;}
  .ll-m-collapsed{display:none;}
  .ll-m-collapsed.is-open{display:block;}
  li.ll-m-collapsed.is-open{display:list-item;}
  /* Плитки дел: подпись «Юрист не назначен» и слово «Создано» лишние — остаётся дата. */
  .ll-case-tile-name--none{display:none;}
  /* Подсказки-ссылки «перейти в чат» / «Написать в чат дела» — вся карточка и так ссылка. */
  .ll-tile-go,.ll-party-go{display:none;}
  .ll-kv-grid{gap:12px 20px;}
  /* Пилюля тарифа под приветствием на главной клиента. */
  .ll-tariff-chip{display:inline-flex;align-items:center;gap:6px;margin-top:6px;padding:5px 12px;
    border-radius:999px;border:1px solid var(--hairline);background:var(--panel);
    font-size:12.5px;font-weight:500;color:var(--text-muted);text-decoration:none;}
  .ll-tariff-chip:hover{color:var(--text);}
}
