/* 0.15.1 — «Настройки → Интерфейс» (договор 002-З-1437 v1): формы, плотность, шрифт, стекло, раскладки, панели, рука. */

/* ---------------------------------------------------------------- формы кнопок и полей (CSS-переменные) */
:root { --r-btn: 999px; --r-field: 10px; --r-chip: 999px; --r-card: 16px; --r-bubble: 10px; --r-avatar: 50%; --r-pop: 14px; }
:root[data-shape="round"] { --r-btn: 999px; --r-field: 999px; --r-chip: 999px; --r-card: 24px; --r-bubble: 20px; --r-avatar: 50%; --r-pop: 22px; }
:root[data-shape="rounded"] { --r-btn: 12px; --r-field: 10px; --r-chip: 10px; --r-card: 12px; --r-bubble: 12px; --r-avatar: 50%; --r-pop: 12px; }
:root[data-shape="squircle"] { --r-btn: 14px; --r-field: 14px; --r-chip: 12px; --r-card: 22px; --r-bubble: 18px; --r-avatar: 30%; --r-pop: 20px; }
:root[data-shape="square"] { --r-btn: 2px; --r-field: 2px; --r-chip: 2px; --r-card: 2px; --r-bubble: 2px; --r-avatar: 2px; --r-pop: 2px; }
/* суперэллипс: где браузер понимает corner-shape — настоящий, иначе скругление */
@supports (corner-shape: squircle) {
  :root[data-shape="squircle"] { --r-btn: 40%; --r-field: 40%; --r-chip: 40%; --r-card: 34px; --r-bubble: 30px; --r-avatar: 46%; --r-pop: 30px; }
  :root[data-shape="squircle"] :is(.primary, .outline, .danger-btn, .chip, input:not([type=checkbox]):not([type=radio]):not([type=color]), textarea, .set-card, .bubble, .avatar, .popup, .modal, .rail-btn, .tab-ic, .fab, .send-btn, .search, .w151-seg-btn, .w151-seg-handle) { corner-shape: squircle; }
}
:root[data-shape] :is(.primary, .outline, .danger-btn, button.pill, .w151-card, .info-actions button) { border-radius: var(--r-btn); }
:root[data-shape] :is(input:not([type=checkbox]):not([type=radio]):not([type=color]), textarea, .search, .comp-pill, .comp-row textarea) { border-radius: var(--r-field); }
:root[data-shape] .chip { border-radius: var(--r-chip); }
:root[data-shape] :is(.set-card, .modal, .login-card, .invite) { border-radius: var(--r-card); }
:root[data-shape] :is(.popup, .mention-pop) { border-radius: var(--r-pop); }
:root[data-shape] .bubble { border-radius: var(--r-bubble); }
:root[data-shape] :is(.avatar, .avatar img, .rail-me, .big-avatar, .group-photo) { border-radius: var(--r-avatar); }
:root[data-shape] :is(.rail-btn, .tab-ic, .fab, .send-btn, .icon, .voice-play) { border-radius: var(--r-btn); }
:root[data-shape="square"] :is(.rail-btn, .tab-ic, .fab, .send-btn, .icon, .voice-play, .switch) { border-radius: 2px; }
:root[data-shape="round"] .fab { border-radius: 50%; }

/* ---------------------------------------------------------------- плотность и шрифт */
:root[data-density="compact"] { --fs: 14px; }
:root[data-density="large"] { --fs: 17px; }
:root[data-density="compact"] .room { padding-block: 5px; }
:root[data-density="compact"] .set-row { padding-block: 8px; }
:root[data-density="large"] .room { padding-block: 13px; }
:root[data-density="large"] .set-row { padding-block: 16px; }
:root[data-ufont="noto_sans"] body { font-family: "Noto Sans", system-ui, sans-serif; }
:root[data-ufont="noto_serif"] body { font-family: "Noto Serif", Georgia, "Times New Roman", serif; }
:root[data-ufont="rounded"] body { font-family: ui-rounded, "SF Pro Rounded", "Nunito", "Varela Round", system-ui, sans-serif; }
:root[data-ufont="mono"] body { font-family: ui-monospace, "Noto Sans Mono", Consolas, monospace; }

/* ---------------------------------------------------------------- «Жидкое стекло»: полупрозрачные слои с размытием */
:root[data-glass="1"] body { background: radial-gradient(1200px 700px at 10% 0%, color-mix(in srgb, var(--brand) 22%, var(--bg)), transparent 60%),
  radial-gradient(900px 600px at 100% 100%, color-mix(in srgb, #ff7ab8 18%, var(--bg)), transparent 60%), var(--bg-2); }
:root[data-glass="1"] .app { background: transparent; }
:root[data-glass="1"] :is(.side, .rail, .tabs, .chat-head, .composer, .panel-head, .popup, .modal, .w151-drawer, .set-card, .info) {
  background: color-mix(in srgb, var(--bg) 70%, transparent);
  -webkit-backdrop-filter: blur(22px) saturate(180%); backdrop-filter: blur(22px) saturate(180%);
}
:root[data-glass="1"] .bubble { -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }

/* ---------------------------------------------------------------- AMOLED: чёрный фон без серых подложек */
:root[data-amoled="1"] body { background: #000; }

/* ---------------------------------------------------------------- без полосы слева (раскладки, панели, рука) */
:root:is([data-layout="telegram"], [data-bars="top"], [data-bars="bottom"], [data-hand]) .rail { display: none; }
:root:is([data-layout="telegram"], [data-bars="top"], [data-bars="bottom"], [data-hand]) .app { grid-template-columns: minmax(320px, 420px) 1fr; }
:root:is([data-layout="telegram"], [data-bars="top"], [data-bars="bottom"], [data-hand]) .app.has-info { grid-template-columns: minmax(320px, 420px) 1fr minmax(320px, 380px); }
@media (max-width: 1180px) {
  :root:is([data-layout="telegram"], [data-bars="top"], [data-bars="bottom"], [data-hand]) .app.has-info { grid-template-columns: minmax(300px, 360px) 1fr; }
}
@media (max-width: 760px) {
  :root:is([data-layout="telegram"], [data-bars="top"], [data-bars="bottom"], [data-hand]) .app,
  :root:is([data-layout="telegram"], [data-bars="top"], [data-bars="bottom"], [data-hand]) .app.has-info { grid-template-columns: 1fr; }
}

/* ---------------------------------------------------------------- «Список на весь экран» */
:root[data-layout="telegram"]:not([data-bars]) .tabs { display: none; }
:root[data-layout="telegram"] .tab-head .menu-left { order: 0; }
:root[data-layout="telegram"] .tab-head h1 { font-size: 19px; }
:root[data-layout="telegram"] .tab-head .plus-btn { display: none; }
:root[data-layout="telegram"] .side .filters { gap: 0; padding: 0 4px; border-bottom: 1px solid var(--line); }
:root[data-layout="telegram"] .side .filters .chip { border: 0; border-radius: 0; padding: 10px 12px 9px; border-bottom: 2.5px solid transparent; background: none; font-weight: 600; color: var(--ink-2); }
:root[data-layout="telegram"] .side .filters .chip.on { color: var(--brand); border-bottom-color: var(--brand); background: none; }
:root[data-layout="telegram"] .side .search { margin-top: 0; }
.w151-fab { position: absolute; inset-inline-end: 18px; bottom: 18px; }
:root[data-layout="telegram"] .side { position: relative; }
.w151-drawer-back { position: fixed; inset: 0; background: rgb(0 0 0 / 38%); z-index: 60; }
.w151-drawer { position: absolute; inset-block: 0; inset-inline-start: 0; width: min(320px, 86vw); background: var(--bg); box-shadow: var(--shadow); display: flex; flex-direction: column; overflow-y: auto; animation: w151-slide .18s ease-out; }
.w151-drawer-me { display: flex; flex-direction: column; gap: 4px; padding: 22px 18px 16px; background: var(--brand); color: var(--brand-ink); }
.w151-drawer-me small { opacity: .9; }
.w151-drawer-item { display: flex; align-items: center; gap: 22px; padding: 13px 20px; min-height: 48px; text-align: start; color: var(--ink); }
.w151-drawer-item:hover { background: var(--bg-2); }
.w151-drawer-item .ic { color: var(--ink-2); }
@keyframes w151-slide { from { transform: translateX(-30px); opacity: .4; } }
:root[data-noanim] .w151-drawer { animation: none; }

/* ---------------------------------------------------------------- «Четыре раздела» */
:root[data-layout="wechat"] .tab-head { justify-content: center; }
:root[data-layout="wechat"] .tab-head h1 { position: absolute; left: 50%; transform: translateX(-50%); font-size: 17px; }
:root[data-layout="wechat"] .side .room + .room { border-top: 1px solid color-mix(in srgb, var(--line) 60%, transparent); }
.w151-letter { padding: 4px 16px; font-size: 12px; font-weight: 700; color: var(--ink-2); background: var(--bg-2); }

/* ---------------------------------------------------------------- панели: сверху / снизу */
@media (max-width: 760px) {
  :root[data-bars="top"] .side .tabs { order: -1; border-top: 0; border-bottom: 1px solid var(--line); }
  :root[data-bars="bottom"] .side .panel > .panel-head.tab-head { order: 50; border-top: 1px solid var(--line); min-height: 52px; }
  :root[data-bars="bottom"] .side .panel > .rooms, :root[data-bars="bottom"] .side .panel > .settings-scroll { order: 10; }
  :root[data-bars="bottom"] .side .panel > :is(.search, .filters, .banner) { order: 40; }
  :root[data-bars="bottom"] .chat .chat-head { order: 50; }
}
@media (min-width: 761px) {
  :root:is([data-bars="top"], [data-bars="bottom"]) .tabs { display: flex; background: var(--bg-2); }
  :root:is([data-bars="top"], [data-bars="bottom"]) .tab { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 6px 0 8px; font-size: 12px; color: var(--ink-2); }
  :root:is([data-bars="top"], [data-bars="bottom"]) .tab-ic { position: relative; width: 52px; height: 30px; border-radius: 999px; display: grid; place-items: center; }
  :root:is([data-bars="top"], [data-bars="bottom"]) .tab.on .tab-ic { background: var(--brand-soft); color: var(--brand); }
  :root[data-bars="top"] .side .tabs { order: -1; border-bottom: 1px solid var(--line); }
  :root[data-bars="bottom"] .side .tabs { border-top: 1px solid var(--line); }
  :root[data-bars="bottom"] .side .panel > .panel-head.tab-head { order: 50; border-top: 1px solid var(--line); }
  :root[data-bars="bottom"] .side .panel > :is(.rooms, .settings-scroll) { order: 10; }
  :root[data-bars="bottom"] .side .panel > :is(.search, .filters, .banner) { order: 40; }
}
:root[data-hand] .tabs { display: none !important; }

/* ---------------------------------------------------------------- сегмент у большого пальца (правша / левша) */
.w151-seg { position: fixed; bottom: 0; z-index: 45; pointer-events: none; }
.w151-seg.right { right: 0; } /* рука не зависит от языка — не зеркалить (0.16, T-16-11) */
.w151-seg.left { left: 0; }
.w151-seg-bg { position: absolute; inset: 0; pointer-events: auto; }
.w151-seg-bg path { fill: color-mix(in srgb, var(--bg) 88%, transparent); stroke: var(--line); stroke-width: 1; filter: drop-shadow(0 -2px 10px rgb(0 0 0 / 16%)); }
.w151-seg-menu { position: absolute; inset: 0; }
.w151-seg-btn, .w151-seg-handle { position: absolute; pointer-events: auto; display: grid; place-items: center; border-radius: 50%; min-width: 48px; min-height: 48px; }
.w151-seg-btn { background: var(--bg); color: var(--ink); border: 1px solid var(--line); box-shadow: 0 2px 8px rgb(0 0 0 / 14%); animation: w151-pop .16s ease-out; }
.w151-seg-btn.on { background: var(--brand-soft); color: var(--brand); border-color: var(--brand); }
.w151-seg-btn:hover { border-color: var(--brand); }
.w151-seg-handle { width: 60px; height: 60px; bottom: 14px; background: var(--brand); color: var(--brand-ink); box-shadow: 0 4px 14px rgb(0 0 0 / 26%); }
.w151-seg.right .w151-seg-handle { right: 14px; }
.w151-seg.left .w151-seg-handle { left: 14px; }
@keyframes w151-pop { from { transform: scale(.6); opacity: 0; } }
:root[data-noanim] .w151-seg-btn { animation: none; }
@media (prefers-reduced-motion: reduce) { .w151-seg-btn { animation: none; } }
/* сегмент не закрывает поле ввода чата: поле сдвигается от угла */
:root[data-hand="right"] .chat footer.composer { padding-inline-end: 82px; }
:root[data-hand="left"] .chat footer.composer { padding-inline-start: 82px; }
:root[data-hand] .w151-fab { display: none; }

/* ---------------------------------------------------------------- логотип компании рядом с Alibry */
.w151-brand { display: flex; align-items: center; gap: 10px; padding: 8px 16px; border-bottom: 1px solid var(--line); background: var(--bg); min-height: 48px; }
.login-card .w151-brand { border: 0; background: none; padding: 0; }
.w151-brand-sep { width: 1px; align-self: stretch; background: var(--line); }
.w151-brand-logo { max-width: 120px; object-fit: contain; }
.w151-brand-letter { width: 28px; height: 28px; border-radius: 8px; background: var(--brand); color: var(--brand-ink); display: grid; place-items: center; font-weight: 700; }
.w151-brand-name { font-size: 14px; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ---------------------------------------------------------------- «Отменить» 10 с */
.w151-undo { position: fixed; left: 50%; bottom: 84px; transform: translateX(-50%); z-index: 70; display: flex; align-items: center; gap: 14px;
  background: #1f2a36; color: #fff; border-radius: 12px; padding-block: 8px 8px; padding-inline: 16px 10px; box-shadow: var(--shadow); }
.w151-undo .link { color: #9fd0ff; min-height: 40px; }

/* ---------------------------------------------------------------- экран «Интерфейс» */
.w151-page { padding-bottom: 20px; }
.w151-page .set-card { padding-bottom: 10px; }
.w151-h { margin: 0; padding: 14px 16px 8px; font-size: 15px; }
.w151-page .label { margin-top: 6px; }
.w151-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 10px; padding: 0 12px; }
.w151-card { display: flex; flex-direction: column; gap: 4px; padding: 8px; border: 2px solid var(--line); border-radius: 14px; text-align: start; background: var(--bg); min-height: 48px; }
.w151-card.on { border-color: var(--brand); background: var(--brand-soft); }
.w151-card b { font-size: 14px; }
.w151-card small { color: var(--ink-2); font-size: 12px; line-height: 1.3; }
/* превью раскладок: только блоки */
.w151-pv { position: relative; height: 84px; border-radius: 8px; background: var(--bg-2); border: 1px solid var(--line); overflow: hidden; }
.w151-pv i { position: absolute; display: block; background: var(--line); border-radius: 3px; }
.w151-pv .pv-top { inset-inline-start: 0; inset-inline-end: 0; top: 0; height: 12px; background: var(--bg-3); border-radius: 0; }
.w151-pv .pv-side { inset-inline-start: 0; top: 12px; bottom: 0; width: 10px; background: var(--bg-3); border-radius: 0; }
.w151-pv .pv-main { inset-inline-start: 14px; inset-inline-end: 6px; top: 16px; bottom: 6px; background: var(--bg); }
.w151-pv .pv-bar, .w151-pv .pv-fab, .w151-pv .pv-r1, .w151-pv .pv-r2, .w151-pv .pv-r3 { display: none; }
.w151-pv .pv-r1, .w151-pv .pv-r2, .w151-pv .pv-r3 { inset-inline-start: 18px; inset-inline-end: 50%; height: 7px; background: var(--ink-3); opacity: .5; }
.w151-pv .pv-r1 { top: 22px; } .w151-pv .pv-r2 { top: 34px; } .w151-pv .pv-r3 { top: 46px; }
.w151-pv-alibry .pv-r1, .w151-pv-alibry .pv-r2, .w151-pv-alibry .pv-r3 { display: block; }
.w151-pv-telegram .pv-side { display: none; }
.w151-pv-telegram .pv-main { inset-inline-start: 6px; }
.w151-pv-telegram .pv-bar { display: block; inset-inline-start: 6px; inset-inline-end: 6px; top: 16px; height: 6px; background: var(--brand); opacity: .6; }
.w151-pv-telegram .pv-r1, .w151-pv-telegram .pv-r2, .w151-pv-telegram .pv-r3 { display: block; inset-inline-start: 10px; inset-inline-end: 10px; }
.w151-pv-telegram .pv-fab { display: block; inset-inline-end: 8px; bottom: 8px; width: 16px; height: 16px; border-radius: 50%; background: var(--brand); }
.w151-pv-wechat .pv-side { display: none; }
.w151-pv-wechat .pv-main { inset-inline-start: 6px; bottom: 18px; }
.w151-pv-wechat .pv-bar { display: block; inset-inline-start: 0; inset-inline-end: 0; bottom: 0; height: 14px; background: repeating-linear-gradient(90deg, var(--bg-3) 0 22%, var(--line) 22% 25%); border-radius: 0; }
.w151-pv-wechat .pv-r1, .w151-pv-wechat .pv-r2, .w151-pv-wechat .pv-r3 { display: block; inset-inline-start: 10px; inset-inline-end: 10px; }
.w151-pv-wechat .pv-fab { display: block; inset-inline-end: 4px; top: 2px; width: 8px; height: 8px; background: var(--brand); }
.w151-pv-a1 { background: #F2E4E3; }
.w151-pv-a1 .pv-top, .w151-pv-a1 .pv-side { background: #990101; }
.w151-pv-a1 .pv-r1, .w151-pv-a1 .pv-r2, .w151-pv-a1 .pv-r3 { display: block; background: #AF5354; opacity: .8; border-radius: 6px; }
.w151-pv-company .pv-top { background: var(--brand); }
.w151-pv-company .pv-r1, .w151-pv-company .pv-r2, .w151-pv-company .pv-r3 { display: block; }
.w151-pv-company .pv-fab { display: block; inset-inline-start: 4px; top: 2px; width: 22px; height: 8px; background: var(--brand-ink); }

.w151-shapes { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; padding: 0 12px; }
.w151-shape { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 10px 4px; border: 2px solid var(--line); border-radius: 12px; font-size: 13px; min-height: 48px; }
.w151-shape.on { border-color: var(--brand); background: var(--brand-soft); }
.w151-shape-btn { width: 54px; height: 22px; background: var(--brand); }
.w151-shape-field { width: 64px; height: 18px; border: 1.5px solid var(--ink-3); }
.w151-shape[data-s="round"] :is(.w151-shape-btn, .w151-shape-field) { border-radius: 999px; }
.w151-shape[data-s="squircle"] :is(.w151-shape-btn, .w151-shape-field) { border-radius: 9px; corner-shape: squircle; }
.w151-shape[data-s="rounded"] :is(.w151-shape-btn, .w151-shape-field) { border-radius: 6px; }
.w151-shape[data-s="square"] :is(.w151-shape-btn, .w151-shape-field) { border-radius: 1px; }
@media (max-width: 420px) { .w151-shapes { grid-template-columns: repeat(2, 1fr); } }

.w151-palettes { display: grid; grid-template-columns: repeat(auto-fill, minmax(118px, 1fr)); gap: 8px; }
.w151-pal { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border: 2px solid var(--line); border-radius: 12px; font-size: 13px; text-align: start; min-height: 48px; }
.w151-pal.on { border-color: var(--brand); }
.w151-sw { flex: none; width: 34px; height: 34px; border-radius: 8px; border: 1px solid; display: grid; grid-template-columns: 1fr 1fr; padding: 3px; gap: 2px; }
.w151-sw i { border-radius: 3px; }
.w151-sw i:first-child { grid-row: span 2; }
.w151-accents { align-items: center; }
.w151-dot { width: 32px; height: 32px; border-radius: 50%; border: 2px solid var(--bg); box-shadow: 0 0 0 1px var(--line); }
.w151-dot.on { box-shadow: 0 0 0 3px var(--brand); }
.w151-accent-pick { position: relative; cursor: pointer; }
.w151-accent-pick input { width: 22px; height: 22px; padding: 0; border: 0; background: none; }
.w151-hand-pv { align-items: center; }
.w151-hand-svg .frame { fill: var(--bg-2); stroke: var(--line); }
.w151-hand-svg .seg { fill: color-mix(in srgb, var(--brand) 22%, transparent); stroke: var(--brand); }
.w151-hand-svg .dot { fill: var(--brand); }
.w151-vote-row { gap: 12px; min-height: 48px; }
.w151-vote-n { color: var(--ink-2); white-space: nowrap; }

/* «Список на весь экран»: на вкладках, кроме «Чатов», — кнопка меню и переход к чатам */
.w151-tgbar { display: flex; align-items: center; gap: 6px; padding: 6px 10px; border-bottom: 1px solid var(--line); min-height: 48px; }

/* ---------------------------------------------------------------- раскладка A1 (брендбук A1, решение 002-З-1437; шрифты OFL — fonts/a1) */
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 400; font-display: swap; src: url("fonts/a1/montserrat-cyrillic-400-normal.woff2") format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 400; font-display: swap; src: url("fonts/a1/montserrat-latin-400-normal.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: "Montserrat"; font-style: normal; font-weight: 500; font-display: swap; src: url("fonts/a1/montserrat-cyrillic-500-normal.woff2") format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 500; font-display: swap; src: url("fonts/a1/montserrat-latin-500-normal.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: "Montserrat"; font-style: normal; font-weight: 600; font-display: swap; src: url("fonts/a1/montserrat-cyrillic-600-normal.woff2") format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 600; font-display: swap; src: url("fonts/a1/montserrat-latin-600-normal.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: "Montserrat"; font-style: normal; font-weight: 700; font-display: swap; src: url("fonts/a1/montserrat-cyrillic-700-normal.woff2") format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 700; font-display: swap; src: url("fonts/a1/montserrat-latin-700-normal.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: "IBM Plex Mono"; font-style: normal; font-weight: 400; font-display: swap; src: url("fonts/a1/ibm-plex-mono-cyrillic-400-normal.woff2") format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "IBM Plex Mono"; font-style: normal; font-weight: 400; font-display: swap; src: url("fonts/a1/ibm-plex-mono-latin-400-normal.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: "IBM Plex Mono"; font-style: normal; font-weight: 600; font-display: swap; src: url("fonts/a1/ibm-plex-mono-cyrillic-600-normal.woff2") format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "IBM Plex Mono"; font-style: normal; font-weight: 600; font-display: swap; src: url("fonts/a1/ibm-plex-mono-latin-600-normal.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; }
:root[data-ufont="montserrat"] body { font-family: "Montserrat", system-ui, sans-serif; }
:root[data-ufont="montserrat"] :is(code, pre, .mono, .w151-id) { font-family: "IBM Plex Mono", ui-monospace, monospace; }
/* формы брендбука: кнопки-пилюли (24), карточки 18; активный пункт меню — основной красный с белым текстом */
:root[data-ui-layout="a1"] { --r-btn: 24px; --r-chip: 24px; --r-card: 18px; --r-pop: 16px; }
:root[data-ui-layout="a1"][data-palette="a1"] :is(.rail-btn.on, .tab.on .tab-ic, .chip.on, .w151-card.on) { background: var(--brand); color: var(--brand-ink); border-color: var(--brand); }
:root[data-ui-layout="a1"][data-palette="a1"] .tab.on { color: var(--ink); }
.w151-a1bar { display: flex; align-items: center; gap: 10px; padding: 8px 16px; border-bottom: 1px solid var(--line); background: var(--bg); min-height: 48px; }
.w151-a1mark { flex: none; }