/* ===== Шрифт: JetBrains Mono на всём дашборде (как в терминале); @font-face — /assets/fonts/jbmono.css ===== */
@import url('/assets/fonts/jbmono.css');
/* Постеры фильмов во вкладке «Раздачи»: вертикальные 2:3 вместо 3:2 */
.posters .rss-detailed-thumbnail > * {
  aspect-ratio: 2 / 3;
  height: 8.7rem;
}

/* Раскрывающиеся карточки фильмов/сериалов */
.tmdb-card > summary::-webkit-details-marker { display: none; }
.tmdb-card > summary:hover .color-highlight { color: var(--color-primary); }
.tmdb-card[open] > summary .color-highlight { color: var(--color-primary); }
@media (max-width: 600px) { .tmdb-card > div { flex-direction: column; } }

/* Центр (Фильмы/Сериалы) по высоте боковых колонок, списки прокручиваются внутри */
@media (min-width: 1191px) {
  .page-column-full { display: flex; flex-direction: column; }
  .page-column-full > .widget-type-split-column { flex: 1 1 0; min-height: 0; display: flex; flex-direction: column; }
  .widget-type-split-column > .widget-content { flex: 1; min-height: 0; }
  .widget-type-split-column .masonry,
  .widget-type-split-column .masonry-column { height: 100%; min-height: 0; }
  .widget-type-split-column .masonry-column > .widget,
  .widget-type-split-column .masonry > .widget { flex: 1; min-height: 0; height: 100%; display: flex; flex-direction: column; }
  .widget-type-split-column .widget-type-custom-api > .widget-content { flex: 1; min-height: 0; overflow-y: auto; scrollbar-width: thin; }
}

/* Постер на весь экран */
.poster-lightbox { position: fixed; inset: 0; z-index: 9999; display: flex; align-items: center; justify-content: center;
  background: rgba(0,0,0,.88); cursor: zoom-out; animation: posterFade .15s ease-out; }
.poster-lightbox img { max-width: 95vw; max-height: 95vh; object-fit: contain; border-radius: 8px; box-shadow: 0 10px 40px rgba(0,0,0,.6); }
@keyframes posterFade { from { opacity: 0; } }

/* Кнопка «Свернуть» в раскрытой карточке */
.tmdb-collapse { margin-left: auto; padding: 0.2rem 0.7rem; border-radius: 4px; cursor: pointer; font: inherit; font-size: var(--font-size-h6);
  background: transparent; color: var(--color-text-subdue); border: 1px solid var(--color-separator); }
.tmdb-collapse:hover { color: var(--color-primary); border-color: var(--color-primary); }

/* Ссылки-значки в раскрытой карточке фильма/сериала */
.site-icons { display: flex; gap: 0.8rem; flex-wrap: wrap; align-items: center; }
.site-icon { display: inline-flex; opacity: 0.85; transition: opacity .15s, transform .15s; }
.site-icon:hover { opacity: 1; transform: scale(1.12); }
.site-icon img { width: 22px; height: 22px; border-radius: 5px; display: block; }
.site-icons .tmdb-collapse { margin-left: auto; }

/* Закладки в центре: группы-кнопки с выпадающим списком ссылок */
.bm-groups { display: grid; grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr)); gap: 0.6rem; }
.bm-group { position: relative; }
.bm-group > summary { list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 0.5rem;
  padding: 0.45rem 0.8rem; border-radius: var(--border-radius); cursor: pointer; user-select: none;
  background: var(--color-widget-background-highlight); color: var(--color-text-highlight);
  border: 1px solid var(--color-widget-content-border); transition: border-color .15s, color .15s; }
.bm-group > summary::-webkit-details-marker { display: none; }
.bm-group > summary::after { content: ""; width: 0.4rem; height: 0.4rem; margin-left: 0.2rem; flex-shrink: 0;
  border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg) translateY(-2px);
  opacity: 0.6; transition: transform .15s; }
.bm-group[open] > summary::after { transform: rotate(-135deg) translateY(-2px); }
.bm-group > summary:hover, .bm-group[open] > summary { border-color: var(--color-primary); color: var(--color-primary); }
.bm-group > summary > span:first-child { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bm-count { font-size: var(--font-size-h6); color: var(--color-text-subdue); }
.bm-menu { position: absolute; z-index: 20; top: calc(100% + 0.3rem); left: 0; min-width: 100%; width: max-content; max-width: 18rem;
  padding: 0.4rem; border-radius: var(--border-radius); background: var(--color-popover-background);
  border: 1px solid var(--color-popover-border); box-shadow: 0 10px 25px rgba(0,0,0,.35); animation: bmIn .12s ease-out; }
.bm-menu a { display: flex; align-items: center; gap: 0.6rem; padding: 0.4rem 0.6rem; border-radius: calc(var(--border-radius) * 0.7);
  color: var(--color-text-highlight); }
.bm-menu a:hover { background: var(--color-widget-background-highlight); color: var(--color-primary); }
.bm-menu img, .bm-noicon { width: 18px; height: 18px; flex-shrink: 0; border-radius: 4px; text-align: center; line-height: 18px; }
.bm-noicon { color: var(--color-text-subdue); }
@keyframes bmIn { from { opacity: 0; transform: translateY(-4px); } }
/* Раскрытое меню должно быть поверх «Фильмов/Сериалов» */
.widget-type-html:has(.bm-group[open]) { position: relative; z-index: 30; }

/* MyChooz: новости с обложками */
.mychooz-item { display: flex; gap: 1rem; align-items: center; }
.mychooz-item img { width: 7rem; aspect-ratio: 16/9; object-fit: cover; border-radius: 5px; flex-shrink: 0; }
.mychooz-text { min-width: 0; display: flex; flex-direction: column; gap: 0.2rem; }
.mychooz-title { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; line-height: 1.35; }
.mychooz-item:hover .mychooz-title { color: var(--color-primary); }

/* Вкладка «Новости»: крупнее обложки, кнопка-закладка читалки */
.mychooz-item img { width: 12rem; }
.reader-bookmarklet { display: inline-block; padding: 0.3rem 1.2rem; border-radius: 5px; border: 1px solid var(--color-primary); color: var(--color-primary); white-space: nowrap; }
.reader-bookmarklet:hover { background: var(--color-primary); color: var(--color-background); }

/* Лимиты Claude в верхней панели */
.claude-usage { flex: none; display: flex; align-items: center; gap: 1.2rem; margin-right: 1.5rem; font-size: 1.3rem; white-space: nowrap; color: var(--color-text-base); }
.claude-usage:hover .claude-usage-name { color: var(--color-primary); }
.claude-usage-name { color: var(--color-text-highlight); font-weight: 500; }
.claude-usage-item { display: flex; align-items: center; gap: 0.5rem; }
.claude-usage-label { color: var(--color-text-subdue); }
.claude-usage-bar { width: 4.5rem; height: 0.6rem; border-radius: 1rem; background: var(--color-widget-background-highlight); overflow: hidden; }
.claude-usage-bar > span { display: block; height: 100%; border-radius: 1rem; background: var(--color-primary); }
.claude-usage-mid .claude-usage-bar > span { background: hsl(43, 70%, 60%); }
.claude-usage-low .claude-usage-bar > span { background: var(--color-negative); }
.claude-usage-low .claude-usage-value { color: var(--color-negative); }
.claude-usage-value { min-width: 4ch; font-variant-numeric: tabular-nums; text-align: right; color: var(--color-text-highlight); }
@media (max-width: 1190px) { .claude-usage-bar { display: none; } .claude-usage { gap: 0.8rem; margin-right: 1rem; } }
@media (max-width: 700px) { .claude-usage { display: none; } }

/* Блок «Команды» с кнопками копирования */
.cmd-panel { position: relative; }
.cmd-panel > summary { cursor: pointer; list-style: none; }
.cmd-panel > summary::before { content: "▸ "; color: var(--color-text-subdue); }
.cmd-panel[open] > summary::before { content: "▾ "; }
.cmd-item + .cmd-item { margin-top: 1rem; }
.copy-block { display: flex; align-items: flex-start; gap: 1rem; margin-top: 0.4rem; padding: 0.8rem 1rem; border-radius: 6px; background: var(--color-widget-background-highlight); }
.copy-block code { flex: 1; min-width: 0; font-family: 'JetBrains Mono', monospace; font-size: 1.25rem; color: var(--color-text-highlight); white-space: pre-wrap; word-break: break-all; user-select: all; }
.copy-btn { flex-shrink: 0; padding: 0.3rem 1rem; border-radius: 5px; border: 1px solid var(--color-primary); color: var(--color-primary); background: none; cursor: pointer; font: inherit; font-size: 1.2rem; white-space: nowrap; }
.copy-btn:hover, .copy-btn.copied { background: var(--color-primary); color: var(--color-background); }

/* Терминал: консоль на всю оставшуюся высоту окна */
.term-bar { display: flex; align-items: center; gap: 2rem; flex-wrap: wrap; margin-bottom: 0.6rem; }
.term-bar > a { margin-left: auto; }
.cmd-menu { position: absolute; z-index: 20; top: calc(100% + 0.5rem); left: 0; width: min(50rem, 90vw); padding: 1rem; border-radius: 6px; background: var(--color-widget-background); border: 1px solid var(--color-widget-content-border); box-shadow: 0 6px 20px rgba(0,0,0,.4); }
.term-frame { display: block; width: 100%; height: calc(100dvh - 13rem); min-height: 30rem; border: 0; border-radius: 6px; background: #000; }
@media (max-width: 1190px) { .term-frame { height: calc(100dvh - 19rem); } }

/* Страница «Видео»: сетка карточек и плеер (video.js) */
.vid-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 1.6rem 1.2rem; }
.vid-card { display: flex; flex-direction: column; gap: 0.4rem; min-width: 0; }
.vid-open { display: flex; flex-direction: column; gap: 0.5rem; cursor: pointer; color: inherit; text-decoration: none; }
.vid-thumb { position: relative; aspect-ratio: 16/9; border-radius: 6px; overflow: hidden; background: var(--color-widget-background-highlight); }
.vid-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; opacity: 1; transition: transform .2s; }
.vid-open:hover .vid-thumb img { transform: scale(1.04); }
.vid-thumb::after { content: '▶'; position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  font-size: 2.6rem; color: #fff; background: rgba(0,0,0,.35); opacity: 0; transition: opacity .15s; }
.vid-open:hover .vid-thumb::after { opacity: 1; }
.vid-name { color: var(--color-text-highlight); line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.vid-open:hover .vid-name { color: var(--color-primary); }
.vid-overlay { position: fixed; inset: 0; z-index: 9999; display: flex; align-items: center; justify-content: center;
  background: rgba(0,0,0,.92); animation: posterFade .15s ease-out; padding: 1rem; }
.vid-box { width: min(1280px, 100%); display: flex; flex-direction: column; gap: 0.6rem; }
.vid-box video { width: 100%; max-height: calc(100dvh - 6rem); background: #000; border-radius: 6px; }
.vid-bar { display: flex; align-items: center; gap: 1.2rem; color: #ddd; }
.vid-title { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vid-bar a { color: #ddd; text-decoration: underline; }
.vid-bar button { background: transparent; border: 1px solid #666; color: #ddd; border-radius: 4px; padding: 0.2rem 0.7rem; cursor: pointer; font: inherit; }
.vid-bar a:hover, .vid-bar button:hover { color: #fff; border-color: #fff; }

/* Страница «Видео»: форма добавления ссылки и список загрузок (video.js → /yt/) */
.yt-add { display: flex; gap: 0.8rem; flex-wrap: wrap; align-items: center; margin-bottom: 1.2rem; }
.yt-add input { flex: 1; min-width: 220px; padding: 0.6rem 0.9rem; border-radius: 5px; font: inherit;
  background: var(--color-widget-background-highlight); color: var(--color-text-highlight); border: 1px solid var(--color-separator); }
.yt-add input:focus { outline: none; border-color: var(--color-primary); }
.yt-add button { padding: 0.6rem 1.2rem; border-radius: 5px; font: inherit; cursor: pointer;
  background: var(--color-primary); color: var(--color-widget-background); border: 0; }
.yt-add button:disabled { opacity: .5; cursor: wait; }
.yt-msg { flex-basis: 100%; color: var(--color-negative); }
.yt-msg:empty { display: none; }
.yt-jobs { display: flex; flex-direction: column; gap: 0.8rem; margin-bottom: 1.6rem; }
.yt-job-row { display: flex; gap: 1rem; align-items: baseline; }
.yt-job-title { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--color-text-highlight); }
.yt-job-state { color: var(--color-text-subdue); white-space: nowrap; font-size: var(--font-size-h6); }
.yt-done .yt-job-state { color: var(--color-positive); }
.yt-error .yt-job-state, .yt-job-err { color: var(--color-negative); }
.yt-job-err { font-size: var(--font-size-h6); overflow-wrap: anywhere; }
.yt-bar { height: 4px; margin-top: 0.4rem; border-radius: 2px; background: var(--color-widget-background-highlight); overflow: hidden; }
.yt-bar div { height: 100%; background: var(--color-primary); transition: width .4s; }

/* Строка под названием видео: размер · дата слева, кнопки «Скачать» и «Удалить» справа */
.vid-meta { display: flex; align-items: center; gap: 0.8rem; }
.vid-meta > .size-h6 { flex: 1; min-width: 0; }
.vid-actions { display: flex; gap: 0.4rem; flex-shrink: 0; }
.vid-act { width: 2.8rem; height: 2.8rem; display: inline-flex; align-items: center; justify-content: center; padding: 0;
  border-radius: 5px; border: 1px solid var(--color-separator); background: transparent; color: var(--color-text-subdue);
  cursor: pointer; transition: color .15s, border-color .15s, background .15s; }
.vid-act svg { display: block; flex-shrink: 0; }
.vid-act:hover { color: var(--color-primary); border-color: var(--color-primary); }
.vid-del:hover { color: var(--color-negative); border-color: var(--color-negative); }
.vid-act:disabled { opacity: .5; cursor: wait; }

/* Разрешение ролика в углу обложки */
.vid-res { position: absolute; right: 0.5rem; bottom: 0.5rem; z-index: 1; padding: 0.1rem 0.5rem; border-radius: 4px;
  background: rgba(0,0,0,.75); color: #fff; font-size: var(--font-size-h6); font-weight: 600; line-height: 1.5; letter-spacing: .02em; }

/* Страница «Видео»: лента «Подписки» (новые ролики с каналов) */
.yt-msg.ok { color: var(--color-positive); }
.yt-chans { margin-bottom: 1.4rem; }
.yt-chans summary { cursor: pointer; color: var(--color-text-subdue); width: fit-content; }
.yt-chans summary:hover { color: var(--color-primary); }
.yt-chans ul { display: flex; flex-wrap: wrap; gap: 0.6rem; margin-top: 0.8rem; }
.yt-chans li { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.3rem 0.4rem 0.3rem 0.9rem; border-radius: 999px;
  border: 1px solid var(--color-separator); }
.yt-chans li a { color: var(--color-text-highlight); text-decoration: none; }
.yt-chans li a:hover { color: var(--color-primary); }
.chan-del { width: 1.8rem; height: 1.8rem; border-radius: 50%; border: 0; padding: 0; cursor: pointer; font: inherit; font-size: 1rem;
  background: transparent; color: var(--color-text-subdue); }
.chan-del:hover { color: var(--color-negative); background: var(--color-widget-background-highlight); }
.sub-open { display: flex; flex-direction: column; gap: 0.5rem; }
.sub-have { position: absolute; left: 0.5rem; bottom: 0.5rem; z-index: 1; padding: 0.1rem 0.5rem; border-radius: 4px;
  background: rgba(0,0,0,.75); color: #fff; font-size: var(--font-size-h6); line-height: 1.5; }
.sub-dl.busy { width: auto; min-width: 2.8rem; padding: 0 0.5rem; font: inherit; font-size: var(--font-size-h6); color: var(--color-primary);
  border-color: var(--color-primary); cursor: default; opacity: 1; }
.sub-more { margin-top: 1.6rem; }
.sub-more > summary { cursor: pointer; color: var(--color-text-subdue); margin-bottom: 1.4rem; width: fit-content; }
.sub-more > summary:hover { color: var(--color-primary); }

/* iPhone/Safari увеличивает страницу при фокусе на поле со шрифтом < 16px — на сенсорных экранах делаем 16px
   (вход: логин, пароль, код; страница «Видео»: ссылка на ролик/канал). Селекторы с id — чтобы перебить login.css */
@media (pointer: coarse) {
  #username, #password, #totp-code, .yt-add input { font-size: 16px; }
  #password::placeholder { font-size: 16px; }
}

/* Страница входа: кнопка «Войти с Face ID» (totp.js → login-2fa.service) */
.passkey-block { margin-bottom: 2.5rem; }
.passkey-block .passkey-button { width: 100%; margin-top: 0; justify-content: center; }
.passkey-or { margin-top: 2rem; text-align: center; color: var(--color-text-subdue); font-size: var(--font-size-h6); text-transform: uppercase; letter-spacing: .05em; }
.passkey-or::before, .passkey-or::after { content: ''; display: inline-block; width: 3rem; height: 1px; background: var(--color-separator); vertical-align: middle; margin: 0 1rem; }

/* Окно выбора разрешения и кодека перед загрузкой (video.js → pick) */
.yt-pick { width: min(52rem, 100%); max-height: calc(100dvh - 2rem); display: flex; flex-direction: column; gap: 1.2rem;
  padding: 1.6rem; border-radius: 8px; background: var(--color-widget-background); border: 1px solid var(--color-widget-content-border);
  box-shadow: 0 10px 30px rgba(0,0,0,.5); }
.yt-pick-title { color: var(--color-text-highlight); font-weight: 500; line-height: 1.35; }
.yt-pick-legend { display: flex; flex-direction: column; gap: 0.2rem; font-size: var(--font-size-h6); color: var(--color-text-subdue); }
.yt-pick-legend b { color: var(--color-text-highlight); font-weight: 500; }
.yt-pick-list { overflow-y: auto; display: flex; flex-direction: column; gap: 0.6rem; min-height: 0; }
.yt-pick-row { display: flex; align-items: center; gap: 1rem; }
.yt-pick-res { flex: 0 0 5.5rem; color: var(--color-text-highlight); font-weight: 500; }
.yt-pick-opts { display: flex; flex-wrap: wrap; gap: 0.6rem; }
.yt-opt { display: inline-flex; align-items: baseline; gap: 0.6rem; padding: 0.5rem 1rem; border-radius: 5px; cursor: pointer; font: inherit;
  background: var(--color-widget-background-highlight); color: var(--color-text-base); border: 1px solid var(--color-separator); }
.yt-opt b { font-weight: 500; color: var(--color-text-highlight); }
.yt-opt span { font-size: var(--font-size-h6); color: var(--color-text-subdue); }
.yt-opt:hover { border-color: var(--color-primary); }
.yt-opt.on { border-color: var(--color-primary); background: var(--color-primary); }
.yt-opt.on, .yt-opt.on b, .yt-opt.on span { color: var(--color-widget-background); }
.yt-pick-btns { display: flex; justify-content: flex-end; gap: 0.8rem; flex-wrap: wrap; }
.yt-pick-btns button { padding: 0.6rem 1.2rem; border-radius: 5px; font: inherit; cursor: pointer; border: 1px solid var(--color-separator);
  background: transparent; color: var(--color-text-base); }
.yt-pick-btns .yt-pick-ok { background: var(--color-primary); color: var(--color-widget-background); border-color: var(--color-primary); }
@media (max-width: 500px) { .yt-pick-row { flex-direction: column; align-items: flex-start; gap: 0.4rem; } }
/* Подробности файла под названием в плеере (video.js → .vid-head) */
.vid-bar { align-items: flex-start; }
.vid-head { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 0.2rem; }
.vid-head .vid-title { color: #fff; }
.vid-info { font-size: var(--font-size-h6); color: #aaa; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.vid-info span { display: inline-block; min-width: 4.5rem; color: #777; }
.vid-box video { max-height: calc(100dvh - 11rem); }
/* длительность — справа внизу на превью, разрешение — слева */
.vid-res { right: auto; left: 0.5rem; }
.vid-res.vid-dur { left: auto; right: 0.5rem; font-variant-numeric: tabular-nums; }

/* Текст статьи (окно чтения на «Новостях») */
.news-content { line-height: 1.6; color: var(--color-text-base); overflow-wrap: anywhere; }
.news-content > * + * { margin-top: 0.9rem; }
.news-content img { display: block; max-width: 100%; max-height: 32rem; height: auto; border-radius: 5px; }
.news-content a { color: var(--color-primary); }
.news-content h2, .news-content h3, .news-content h4 { color: var(--color-text-highlight); font-size: var(--font-size-h3); }
.news-content blockquote { padding-left: 1rem; border-left: 2px solid var(--color-primary); }
.news-content ul, .news-content ol { padding-left: 1.6rem; list-style: disc; }
.news-content ol { list-style: decimal; }
.news-content figcaption { font-size: var(--font-size-h6); color: var(--color-text-subdue); }
.news-content pre { overflow-x: auto; }

/* ===== Шрифт: JetBrains Mono на всём дашборде и в терминале; @font-face — в начале файла (@import) ===== */
body, code, pre, kbd, .copy-block code { font-family: 'JetBrains Mono', ui-monospace, monospace; }
.news-content, .reader-body { font-size: 1.45rem; line-height: 1.7; }
/* Названия страниц в навигации — капсом, как заголовки виджетов */
.nav-item { text-transform: lowercase; letter-spacing: .03em; }

/* Без скруглений на всех элементах */
*, *::before, *::after { border-radius: 0 !important; }

/* Названия страниц — без рамок, только подчёркивание снизу */
.desktop-navigation { gap: 0; }
.desktop-navigation .nav-item { height: 100%; padding: 0 2.6rem; border: 0; border-bottom: 2px solid transparent; }
.desktop-navigation .nav-item-text { margin-top: 0; }
.desktop-navigation .nav-item:not(.nav-item-current):hover { border-bottom-color: var(--color-text-subdue); }
.desktop-navigation .nav-item.nav-item-current { border-bottom-color: var(--color-primary); }

/* Иконки страниц в правом верхнем углу ячейки навигации (mask → цвет текста ячейки) */
.desktop-navigation .nav-item { position: relative; justify-content: center; text-align: center; }
.desktop-navigation .nav-item::after { content: ''; position: absolute; top: 4px; right: 4px; width: 9px; height: 9px; background-color: currentColor; opacity: .7; -webkit-mask: var(--nav-icon) center / contain no-repeat; mask: var(--nav-icon) center / contain no-repeat; }
.desktop-navigation .nav-item[href="/%d0%b3%d0%bb%d0%b0%d0%b2%d0%bd%d0%b0%d1%8f" i] { --nav-icon: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27black%27 stroke-width=%272.2%27 stroke-linecap=%27square%27 stroke-linejoin=%27miter%27%3E%3Cpath d=%27M3 10.5 12 3l9 7.5%27/%3E%3Cpath d=%27M5 9v12h14V9%27/%3E%3Cpath d=%27M10 21v-6h4v6%27/%3E%3C/svg%3E"); }
.desktop-navigation .nav-item[href="/%d0%bd%d0%be%d0%b2%d0%be%d1%81%d1%82%d0%b8" i] { --nav-icon: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27black%27 stroke-width=%272.2%27 stroke-linecap=%27square%27 stroke-linejoin=%27miter%27%3E%3Cpath d=%27M4 4h13v16H6a2 2 0 0 1-2-2z%27/%3E%3Cpath d=%27M17 8h3v10a2 2 0 0 1-2 2%27/%3E%3Cpath d=%27M8 8h5M8 12h5M8 16h5%27/%3E%3C/svg%3E"); }
.desktop-navigation .nav-item[href="/%d0%b2%d0%b8%d0%b4%d0%b5%d0%be" i] { --nav-icon: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27black%27 stroke-width=%272.2%27 stroke-linecap=%27square%27 stroke-linejoin=%27miter%27%3E%3Crect x=%273%27 y=%275%27 width=%2718%27 height=%2714%27/%3E%3Cpath d=%27m10 9 5 3-5 3z%27/%3E%3C/svg%3E"); }
.desktop-navigation .nav-item[href="/%d0%b7%d0%b0%d0%b3%d1%80%d1%83%d0%b7%d0%ba%d0%b8" i] { --nav-icon: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27black%27 stroke-width=%272.5%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27%3E%3Cpath d=%27M12 3v12M7 10l5 5 5-5M5 21h14%27/%3E%3C/svg%3E"); }
.desktop-navigation .nav-item[href="/%d1%84%d0%b0%d0%b9%d0%bb%d1%8b" i] { --nav-icon: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27black%27 stroke-width=%272.2%27 stroke-linecap=%27square%27 stroke-linejoin=%27miter%27%3E%3Cpath d=%27M6 3h8l5 5v13H6z%27/%3E%3Cpath d=%27M14 3v5h5%27/%3E%3C/svg%3E"); }
.desktop-navigation .nav-item[href="/ai" i] { --nav-icon: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27black%27 stroke-width=%272.2%27 stroke-linecap=%27square%27 stroke-linejoin=%27miter%27%3E%3Cpath d=%27m5 7 5 5-5 5%27/%3E%3Cpath d=%27M12 18h7%27/%3E%3C/svg%3E"); }
.desktop-navigation .nav-item[href="/%d0%b7%d0%b0%d0%b4%d0%b0%d1%87%d0%b8" i] { --nav-icon: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27black%27 stroke-width=%272.2%27 stroke-linecap=%27square%27 stroke-linejoin=%27miter%27%3E%3Crect x=%274%27 y=%274%27 width=%2716%27 height=%2716%27/%3E%3Cpath d=%27m8 12 3 3 5-6%27/%3E%3C/svg%3E"); }
/* Одинаковая ширина ячеек: под самое длинное название (8 символов моноширинным, «Терминал»); при более длинном — растянется */
.desktop-navigation .nav-item { box-sizing: content-box; min-width: calc(8 * (1ch + .03em)); height: calc(100% - 2px); }

/* ===== Страница «Новости» (news.js → /news/): источники слева, лента справа, статья поверх страницы ===== */
.nf-side, .nf-main { min-height: 4rem; }
.nf-error { color: var(--color-negative); }
.nf-side [hidden], .nf-main [hidden] { display: none !important; }
/* левая колонка */
.nf-nav { display: flex; flex-direction: column; gap: 2px; padding-bottom: 1rem; margin-bottom: 1rem; border-bottom: 1px solid var(--color-separator); }
.nf-link { display: flex; align-items: center; gap: .7rem; width: 100%; min-width: 0; padding: .45rem .7rem; border: 0; background: none;
  font: inherit; color: var(--color-text-base); text-align: left; cursor: pointer; }
.nf-link:hover { background: var(--color-widget-background-highlight); color: var(--color-text-highlight); }
.nf-link.on { background: var(--color-widget-background-highlight); color: var(--color-primary); box-shadow: inset 2px 0 0 var(--color-primary); }
.nf-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nf-count { font-size: var(--font-size-h6); color: var(--color-text-subdue); }
.nf-link.on .nf-count { color: var(--color-primary); }
.nf-count-star { color: var(--color-primary); }
.nf-cat + .nf-cat { margin-top: 1rem; }
.nf-cat-head { display: flex; align-items: center; }
.nf-cat-link { text-transform: uppercase; font-size: var(--font-size-h6); letter-spacing: .05em; color: var(--color-text-subdue); }
.nf-feeds { display: flex; flex-direction: column; gap: 2px; }
.nf-cat-head + .nf-feeds .nf-link { padding-left: 1.4rem; }
.nf-feed-row { display: flex; align-items: center; gap: .3rem; }
.nf-empty-cat { padding: .3rem 1.4rem; font-size: var(--font-size-h6); color: var(--color-text-subdue); }
.nf-ico { width: 14px; height: 14px; flex-shrink: 0; object-fit: contain; }
.nf-ico-none { display: inline-block; background: var(--color-separator); }
.nf-bad .nf-name { color: var(--color-negative); }
.nf-warn { color: var(--color-negative); font-weight: 700; }
.nf-x { flex-shrink: 0; width: 2.2rem; height: 2.2rem; border: 0; background: none; color: var(--color-text-subdue); cursor: pointer; font: inherit; }
.nf-x:hover { color: var(--color-negative); background: var(--color-widget-background-highlight); }
.nf-move { max-width: 8rem; font: inherit; font-size: var(--font-size-h6); background: var(--color-widget-background); color: var(--color-text-base);
  border: 1px solid var(--color-widget-content-border); }
.nf-form { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: 1.4rem; }
.nf-form input, .nf-form select, .nf-q { flex: 1 1 100%; min-width: 0; padding: .6rem .8rem; font: inherit; color: var(--color-text-highlight);
  background: var(--color-widget-background-highlight); border: 1px solid var(--color-widget-content-border); outline: none; }
.nf-form input:focus, .nf-q:focus { border-color: var(--color-primary); }
.nf-form select { color: var(--color-text-base); }
.nf-form button, .nf-bar button, .nf-more { padding: .5rem 1.1rem; font: inherit; cursor: pointer; background: none;
  color: var(--color-text-base); border: 1px solid var(--color-widget-content-border); }
.nf-form button { flex: 1; color: var(--color-primary); border-color: var(--color-primary); }
.nf-form button:hover, .nf-bar button:hover, .nf-more:hover { color: var(--color-primary); border-color: var(--color-primary); }
.nf-form button:disabled, .nf-more:disabled { opacity: .6; cursor: default; }
.nf-msg { flex-basis: 100%; font-size: var(--font-size-h6); color: var(--color-negative); }
.nf-msg:empty { display: none; }
.nf-msg.ok { color: var(--color-positive); }
.nf-tools { display: flex; flex-wrap: wrap; gap: .4rem 1.2rem; margin-top: 1.4rem; font-size: var(--font-size-h6); }
.nf-tools button, .nf-tools a { padding: 0; border: 0; background: none; font: inherit; color: var(--color-text-subdue); cursor: pointer; }
.nf-tools button:hover, .nf-tools a:hover, .nf-tools .on { color: var(--color-primary); }
.nf-tools button:disabled { cursor: default; color: var(--color-text-subdue); }
/* правая колонка: панель */
.nf-bar { display: flex; flex-wrap: wrap; align-items: center; gap: .8rem; padding-bottom: 1.2rem; margin-bottom: .4rem; border-bottom: 1px solid var(--color-separator); }
.nf-title { flex: 1 1 auto; min-width: 0; margin-right: auto; font-size: var(--font-size-h2); color: var(--color-text-highlight);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nf-tabs { display: flex; }
.nf-tabs button + button { margin-left: -1px; }
.nf-tabs button.on { color: var(--color-primary); border-color: var(--color-primary); position: relative; }
.nf-q { flex: 0 1 18rem; }
.nf-busy .nf-list { opacity: .5; transition: opacity .2s; }
/* лента */
.nf-item { position: relative; border-bottom: 1px solid var(--color-separator); }
.nf-open { display: flex; gap: 1.4rem; padding: 1.2rem 3.4rem 1.2rem .6rem; color: inherit; }
.nf-open:hover { background: var(--color-widget-background-highlight); }
.nf-item.nf-cur > .nf-open { box-shadow: inset 2px 0 0 var(--color-primary); }
.nf-thumb { width: 14rem; aspect-ratio: 16/9; object-fit: cover; flex-shrink: 0; background: var(--color-widget-background-highlight); }
.nf-thumb-none { display: flex; align-items: center; justify-content: center; }
.nf-thumb-none img { width: 28px; height: 28px; opacity: .5; filter: grayscale(1); }
.nf-text { display: flex; flex-direction: column; gap: .4rem; min-width: 0; }
.nf-meta { display: flex; align-items: center; gap: .5rem; font-size: var(--font-size-h6); color: var(--color-text-subdue); min-width: 0; }
.nf-src { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nf-meta > span:not(.nf-src) { white-space: nowrap; flex-shrink: 0; }
.nf-h { color: var(--color-text-highlight); font-size: var(--font-size-h3); line-height: 1.35; font-weight: 600;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.nf-open:hover .nf-h { color: var(--color-primary); }
.nf-ex { color: var(--color-text-base); line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.nf-read .nf-h { color: var(--color-text-base); font-weight: 400; }
.nf-read .nf-ex, .nf-read .nf-thumb { opacity: .55; }
.nf-star { position: absolute; top: .9rem; right: .2rem; width: 2.8rem; height: 2.8rem; border: 0; background: none; cursor: pointer;
  font-size: 1.7rem; color: var(--color-text-subdue); opacity: .5; }
.nf-item:hover .nf-star, .nf-star.on { opacity: 1; }
.nf-star:hover, .nf-star.on { color: var(--color-primary); }
.nf-empty:not(:empty) { padding: 3rem 0; text-align: center; color: var(--color-text-subdue); }
.nf-linkbtn { border: 0; background: none; padding: 0; font: inherit; color: var(--color-primary); cursor: pointer; text-decoration: underline; }
.nf-more { display: block; width: 100%; margin-top: 1.2rem; }
@media (max-width: 700px) {
  .nf-open { gap: 1rem; }
  .nf-thumb { width: 9rem; }
  .nf-ex { display: none; }
  .nf-q { flex-basis: 100%; }
}
/* статья поверх страницы */
html.nf-lock { overflow: hidden; }
.nf-overlay { position: fixed; inset: 0; z-index: 9999; display: flex; justify-content: center; padding: 2rem 1rem;
  background: rgba(0,0,0,.6); animation: posterFade .15s ease-out; }
.nf-reader { width: min(820px, 100%); display: flex; flex-direction: column; background: var(--color-widget-background);
  border: 1px solid var(--color-widget-content-border); box-shadow: 0 10px 40px rgba(0,0,0,.4); }
.nf-r-bar, .nf-r-foot { display: flex; align-items: center; gap: 1rem; padding: .8rem 1.2rem; flex-shrink: 0; }
.nf-r-bar { border-bottom: 1px solid var(--color-separator); }
.nf-r-foot { border-top: 1px solid var(--color-separator); justify-content: space-between; }
.nf-r-src { display: flex; align-items: center; gap: .6rem; min-width: 0; flex: 1; font-size: var(--font-size-h6); color: var(--color-text-subdue); }
.nf-r-src span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nf-r-acts { display: flex; align-items: center; gap: .5rem; flex-shrink: 0; }
.nf-reader button, .nf-r-orig { padding: .4rem .9rem; font: inherit; font-size: var(--font-size-h6); cursor: pointer; background: none;
  color: var(--color-text-base); border: 1px solid var(--color-widget-content-border); }
.nf-reader button:hover, .nf-r-orig:hover, .nf-r-star.on { color: var(--color-primary); border-color: var(--color-primary); }
.nf-reader button:disabled { opacity: .35; cursor: default; color: var(--color-text-base); border-color: var(--color-widget-content-border); }
.nf-r-scroll { flex: 1; min-height: 0; overflow-y: auto; scrollbar-width: thin; }
.nf-r-inner { max-width: 68ch; margin: 0 auto; padding: 2.4rem 2rem 3rem; }
.nf-r-title { font-size: 2.2rem; line-height: 1.3; font-weight: 700; color: var(--color-text-highlight); }
.nf-r-sub { margin: .8rem 0 2rem; font-size: var(--font-size-h6); color: var(--color-text-subdue); }
.nf-r-body img { max-height: 60vh; margin-inline: auto; }
.nf-r-wait { color: var(--color-text-subdue); }
.nf-r-keys { font-size: var(--font-size-h6); color: var(--color-text-subdue); }
@media (max-width: 700px) {
  .nf-overlay { padding: 0; }
  .nf-reader { border: 0; }
  .nf-r-inner { padding: 1.6rem 1.2rem 2.4rem; }
  .nf-r-title { font-size: 1.8rem; }
  .nf-r-keys, .nf-r-unread { display: none; }
}

/* logo text (long) */
.header .logo { font-size: 1.6rem; white-space: nowrap; }
/* черта логотипа вплотную к первой вкладке: убираем gap между ними */
.header .logo { margin-right: calc(-1 * var(--header-items-gap)); }

/* Статус работы Claude (claude-status.js) */
.claude-status { flex: none; display: flex; align-items: center; gap: 0.6rem; margin-right: 1.5rem; font-size: 1.3rem; white-space: nowrap; color: var(--color-text-base); width: 24rem; cursor: default; }
.claude-status-text { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.claude-status-dot { flex: none; width: 0.6rem; height: 0.6rem; border-radius: 50%; background: var(--color-text-subdue); }
.claude-status[data-state="working"] .claude-status-dot { background: hsl(0, 75%, 58%); animation: claude-status-pulse 1.4s ease-in-out infinite; }
.claude-status[data-state="finishing"] .claude-status-dot { background: hsl(28, 90%, 55%); animation: claude-status-pulse 2.2s ease-in-out infinite; }
.claude-status[data-state="waiting"] .claude-status-dot { background: hsl(50, 90%, 55%); }
.claude-status[data-state="done"] .claude-status-dot { background: hsl(130, 55%, 48%); }
.claude-status[data-state="stale"] { color: var(--color-text-subdue); }
@keyframes claude-status-pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.35; } }
@media (prefers-reduced-motion: reduce) { .claude-status-dot { animation: none !important; } }
@media (max-width: 1400px) { .claude-status { width: 18rem; margin-right: 1rem; } }
@media (max-width: 700px) { .claude-status { max-width: 40vw; } }

/* Тема и выход справа от верхней панели (page-tools.js) */
@media (min-width: 1191px) {
  .header-container:has(.page-tools) { display: flex; align-items: center; gap: var(--widget-gap); }
  .header-container > .header { flex: 1; min-width: 0; }
}
.page-tools { flex: none; display: flex; align-items: center; gap: 1.5rem; height: var(--header-height); }
.page-tools .logout-button:hover { stroke: var(--color-primary); }
/* одинаковые квадраты 2rem: превью темы и выход */
.page-tools .current-theme-preview .theme-preset { width: 2rem; height: 2rem; padding: 0; gap: 0.2rem; }
.page-tools .current-theme-preview .theme-color { width: 0.4rem; height: 1.2rem; border-radius: 0.2rem; }
.page-tools .logout-button { display: block; width: 2rem; height: 2rem; }

/* Страница «Задачи»: виджет todo.js → /todo/ */
.todo-count { margin-left: auto; color: var(--color-text-subdue); font-size: var(--font-size-h6); }
.todo-add { display: flex; gap: 0.6rem; margin-bottom: 1rem; }
.todo-add input { flex: 1; min-width: 0; padding: 0.5rem 0.8rem; border-radius: 5px; font: inherit;
  background: var(--color-widget-background-highlight); color: var(--color-text-highlight); border: 1px solid var(--color-separator); }
.todo-add input:focus, .todo-edit:focus { outline: none; border-color: var(--color-primary); }
.todo-add button { padding: 0.5rem 0.9rem; border-radius: 5px; font: inherit; cursor: pointer;
  background: var(--color-primary); color: var(--color-widget-background); border: 0; }
.todo-add button:disabled { opacity: .5; cursor: wait; }
.todo-msg { color: var(--color-negative); margin-bottom: 0.8rem; font-size: var(--font-size-h6); }
.todo-msg:empty { display: none; }
/* карточки — квадратные стикеры, цвет и наклон чередуются */
.todo-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(22rem, 1fr)); gap: 2rem; padding: 0.4rem; }
.todo-item { --sticker: #fdf3a7; --tilt: -1.2deg; position: relative; aspect-ratio: 1; min-width: 0; overflow: hidden;
  display: grid; grid-template: "cb . edit del" auto "text text text text" 1fr / auto 1fr auto auto; gap: 0.8rem 0.4rem;
  padding: 1.1rem 1.1rem 1.3rem; background: var(--sticker); color: #3b3524; border-radius: 2px 2px 3px 18px;
  box-shadow: 0 1px 2px rgba(0,0,0,.25), 0 8px 18px -6px rgba(0,0,0,.45); transform: rotate(var(--tilt)); transition: transform .15s; }
.todo-item:nth-child(5n+2) { --sticker: #fcd5b0; }
.todo-item:nth-child(5n+3) { --sticker: #c8ecc2; }
.todo-item:nth-child(5n+4) { --sticker: #bfe0f7; }
.todo-item:nth-child(5n+5) { --sticker: #f5c6dc; }
.todo-item:nth-child(3n+2) { --tilt: 1deg; }
.todo-item:nth-child(3n+3) { --tilt: -0.5deg; }
.todo-item:hover, .todo-item:focus-within { transform: rotate(0) scale(1.02); z-index: 1; }
.todo-item input[type=checkbox] { grid-area: cb; width: 1.4rem; height: 1.4rem; margin: 0; accent-color: #3b3524; cursor: pointer; }
.todo-text { grid-area: text; min-height: 0; overflow-y: auto; color: #2b2618; font-size: var(--font-size-h3); line-height: 1.4;
  overflow-wrap: anywhere; white-space: pre-wrap; scrollbar-width: thin; }
.todo-item.is-done .todo-text { color: rgba(43,38,24,.6); text-decoration: line-through; }
.todo-edit { grid-area: text; min-height: 0; padding: 0.3rem 0.5rem; border-radius: 3px; font: inherit; font-size: var(--font-size-h3); resize: none;
  background: rgba(255,255,255,.5); color: #2b2618; border: 1px solid rgba(0,0,0,.2); }
.todo-item .todo-btn:nth-of-type(1) { grid-area: edit; }
.todo-item .todo-btn:nth-of-type(2) { grid-area: del; }
.todo-btn { background: none; border: 0; padding: 0 0.3rem; font: inherit; font-size: var(--font-size-h3); line-height: 1; cursor: pointer;
  color: #3b3524; opacity: .55; }
.todo-btn:hover { color: #000; opacity: 1; }
@media (hover: hover) { .todo-item:not(:hover) .todo-btn { opacity: 0; } .todo-btn:focus-visible { opacity: 1; } }
.todo-done .todo-list { grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); gap: 1.6rem; }
.todo-done .todo-item { opacity: .7; }
.todo-done .todo-text, .todo-done .todo-btn { font-size: var(--font-size-h5); }
@media (max-width: 600px) {
  .todo-list, .todo-done .todo-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; padding: 0.2rem; }
  .todo-item { padding: 0.8rem 0.8rem 1rem; gap: 0.5rem 0.2rem; }
  .todo-text, .todo-btn { font-size: var(--font-size-h5); }
}
.todo-empty { grid-column: 1 / -1; color: var(--color-text-subdue); }
.todo-done { margin-top: 1.2rem; }
.todo-done summary { cursor: pointer; color: var(--color-text-subdue); font-size: var(--font-size-h6); margin-bottom: 0.7rem; }
@media (pointer: coarse) { .todo-add input, .todo-edit { font-size: 16px; } }

/* Виджет «Claude» на Главной над «Сервером»: статус и лимиты (claude-panel.js) */
.claude-panel .widget-content { display: flex; flex-direction: column; gap: 1rem; }
.cp-status { display: flex; gap: 0.9rem; align-items: flex-start; }
.cp-status-dot { flex: none; width: 0.9rem; height: 0.9rem; margin-top: calc(0.45rem + 0.6rem + 1px); border-radius: 50%; background: var(--color-text-subdue); }
.cp-status[data-state="working"] .cp-status-dot { background: hsl(0, 75%, 58%); animation: claude-status-pulse 1.4s ease-in-out infinite; }
.cp-status[data-state="finishing"] .cp-status-dot { background: hsl(28, 90%, 55%); animation: claude-status-pulse 2.2s ease-in-out infinite; }
.cp-status[data-state="waiting"] .cp-status-dot { background: hsl(50, 90%, 55%); }
.cp-status[data-state="done"] .cp-status-dot { background: hsl(130, 55%, 48%); }
.cp-status-body { min-width: 0; flex: 1; display: flex; flex-direction: column; gap: 0.6rem; line-height: 1.4; }
/* Место под 2 строки статуса + время зарезервировано у блока целиком, чтобы виджет не прыгал, а строки шли без пустых промежутков */
.cp-status-info { display: flex; flex-direction: column; gap: 0.3rem; min-height: calc(1.3rem * 1.4 * 2 + 0.3rem + var(--font-size-h6) * 1.4); }
.cp-status-taskbox { padding: 0.6rem 0.8rem; border: 1px solid var(--color-separator); border-radius: var(--border-radius, 5px); background: var(--color-widget-background-highlight); }
.cp-status-task { color: var(--color-text-highlight); overflow-wrap: anywhere; line-height: 1.4; height: calc(1.4em * 2); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.cp-status[data-state="stale"] .cp-status-task, .cp-status[data-state="stale"] .cp-status-text { color: var(--color-text-subdue); }
.cp-status-text { font-size: 1.3rem; color: var(--color-text-base); overflow-wrap: anywhere; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; line-height: 1.4; }
.cp-status-meta, .cp-limit-reset { font-size: var(--font-size-h6); color: var(--color-text-subdue); }
/* время обновления статуса — прямо над линией перед лимитами */
.cp-updated { align-self: flex-end; margin: -0.4rem 0 -0.7rem; font-size: var(--font-size-h6); line-height: 1.4; color: var(--color-text-subdue); font-variant-numeric: tabular-nums; white-space: nowrap; }
.cp-updated:empty { display: none; }
.cp-limits { display: flex; flex-direction: column; gap: 0.7rem; padding-top: 1rem; border-top: 1px solid var(--color-separator); }
.cp-limit-head { display: flex; justify-content: space-between; margin-bottom: 0.3rem; }
.cp-limit-label { color: var(--color-text-base); }
.cp-limits:hover .cp-limit-label { color: var(--color-primary); }
.cp-limit-value { color: var(--color-text-highlight); font-variant-numeric: tabular-nums; }
.cp-limit-bar { height: 0.6rem; border-radius: 1rem; background: var(--color-widget-background-highlight); overflow: hidden; margin-bottom: 0.3rem; }
.cp-limit-bar > span { display: block; height: 100%; border-radius: 1rem; background: var(--color-primary); }
.cp-limit-mid .cp-limit-bar > span { background: hsl(43, 70%, 60%); }
.cp-limit-low .cp-limit-bar > span { background: var(--color-negative); }
.cp-limit-low .cp-limit-value { color: var(--color-negative); }
@media (prefers-reduced-motion: reduce) { .cp-status-dot { animation: none !important; } }

/* «Загрузки»: кнопка отмены в списке заданий и виджет «Файлы» (торренты, прямые ссылки) */
.yt-job-x { flex: none; padding: 0 0.4rem; border: 0; background: none; color: var(--color-text-subdue); cursor: pointer; font: inherit; line-height: 1; }
.yt-job-x:hover { color: var(--color-negative); }
.yt-job-x:disabled { opacity: .4; cursor: wait; }
.dl-files { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.dl-file { display: flex; align-items: center; gap: 1rem; padding: 0.8rem 0; border-top: 1px solid var(--color-separator); }
.dl-file:first-child { border-top: 0; padding-top: 0; }
.dl-ico { flex: none; color: var(--color-text-subdue); }
.dl-body { flex: 1; min-width: 0; }
.dl-name { display: block; color: var(--color-text-highlight); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dl-name:hover { color: var(--color-primary); }

/* «Файлы»: зона для перетаскивания файлов с компьютера */
.dl-drop { display: flex; align-items: center; justify-content: center; gap: 1rem; padding: 2rem 1.2rem; margin-bottom: 1.2rem;
  border: 2px dashed var(--color-separator); border-radius: 8px; color: var(--color-text-subdue); cursor: pointer; text-align: center;
  transition: border-color .15s, background-color .15s, color .15s; }
.dl-drop:hover, .dl-drop.over { border-color: var(--color-primary); color: var(--color-text-highlight); }
.dl-drop.over { background: color-mix(in srgb, var(--color-primary) 8%, transparent); }
.dl-drop * { pointer-events: none; }
.dl-ups { display: flex; flex-direction: column; gap: 0.8rem; margin-bottom: 1.6rem; }
/* Зона перетаскивания — треть ширины колонки (на телефоне — вся ширина) */
.dl-drop { width: calc(100% / 3); min-width: 24rem; box-sizing: border-box; }
@media (max-width: 600px) { .dl-drop { width: 100%; min-width: 0; } }
/* «Файлы» в две зоны: слева — куда перетаскивать (+ прогресс загрузок), справа — список файлов */
.dl-split { display: grid; grid-template-columns: minmax(24rem, 1fr) 2fr; gap: 2rem; align-items: start; }
.dl-left { position: sticky; top: 1rem; display: flex; flex-direction: column; }
.dl-drop { width: auto; min-width: 0; min-height: 16rem; flex-direction: column; margin-bottom: 1.2rem; }
.dl-right { min-width: 0; }
.dl-right > p { margin: 0; }
@media (max-width: 800px) { .dl-split { grid-template-columns: 1fr; } .dl-left { position: static; } .dl-drop { min-height: 10rem; } }
/* Общий виджет «Загрузки»: слева ссылка + перетаскивание + прогресс, справа общая сетка видео и файлов */
.dl-left .yt-add { flex-direction: column; align-items: stretch; }
.dl-left .yt-add input { min-width: 0; }
.dl-drop { min-height: 12rem; }
.dl-right > .vid-grid { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); }
.dl-thumb { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.6rem; color: var(--color-text-subdue); }
.dl-thumb:not(.dl-playable)::after { content: none; }
.dl-ext { font-size: var(--font-size-h6); letter-spacing: .05em; }
.vid-open-file { display: flex; flex-direction: column; gap: 0.5rem; color: inherit; text-decoration: none; }
.vid-open-file:hover .vid-name, .vid-open-file:hover .dl-thumb { color: var(--color-primary); }
/* «Загрузки»: переключатель вида (сетка / список / таблица) */
.dl-views { display: flex; gap: 0.4rem; justify-content: flex-end; margin-bottom: 1.2rem; }
.dl-views button { width: 2.8rem; height: 2.8rem; display: inline-flex; align-items: center; justify-content: center; padding: 0; cursor: pointer;
  border: 1px solid var(--color-separator); border-radius: 5px; background: none; color: var(--color-text-subdue); }
.dl-views button:hover { color: var(--color-text-highlight); }
.dl-views button.on { color: var(--color-primary); border-color: var(--color-primary); }
.dl-thead, .dl-col-type, .dl-col-date { display: none; }
.dl-col-type, .dl-col-date { color: var(--color-text-subdue); font-size: var(--font-size-h6); white-space: nowrap; }
/* Список: строка с маленьким превью */
.dl-right[data-view=list] > .vid-grid, .dl-right[data-view=table] > .vid-grid { display: flex; flex-direction: column; gap: 0; }
.dl-right[data-view=list] .vid-card { flex-direction: row; align-items: center; gap: 1.2rem; padding: 0.8rem 0; border-top: 1px solid var(--color-separator); }
.dl-right[data-view=list] .vid-card:first-child { border-top: 0; padding-top: 0; }
.dl-right[data-view=list] :is(.vid-open, .vid-open-file) { flex-direction: row; align-items: center; gap: 1.2rem; flex: 1; min-width: 0; }
.dl-right[data-view=list] .vid-thumb { width: 9.6rem; flex: none; }
.dl-right[data-view=list] .dl-thumb { gap: 0.2rem; }
.dl-right[data-view=list] .dl-thumb svg { width: 22px; height: 22px; }
.dl-right[data-view=list] .vid-name { -webkit-line-clamp: 1; }
.dl-right[data-view=list] .vid-meta { flex: none; gap: 1.2rem; }
.dl-right[data-view=list] .vid-meta > .size-h6 { flex: none; }
.dl-right[data-view=list] .dl-col-date { display: inline; }
/* Таблица: колонки Название · Тип · Размер · Добавлено */
.dl-right[data-view=table] :is(.dl-thead, .vid-card) { display: grid; grid-template-columns: 3.2rem minmax(0, 1fr) 6rem 9rem 10rem 6rem;
  align-items: center; gap: 1rem; padding: 0.5rem 0; border-top: 1px solid var(--color-separator); }
.dl-right[data-view=table] .dl-thead { border-top: 0; color: var(--color-text-subdue); font-size: var(--font-size-h6); text-transform: uppercase; letter-spacing: .04em; }
.dl-right[data-view=table] :is(.vid-open, .vid-open-file, .vid-meta) { display: contents; }
.dl-right[data-view=table] .vid-thumb { width: 3.2rem; border-radius: 3px; }
.dl-right[data-view=table] .vid-thumb::after, .dl-right[data-view=table] .dl-ext { display: none; }
.dl-right[data-view=table] .dl-thumb svg { width: 16px; height: 16px; }
.dl-right[data-view=table] .vid-name { -webkit-line-clamp: 1; }
.dl-right[data-view=table] .dl-col-type, .dl-right[data-view=table] .dl-col-date { display: block; }
.dl-right[data-view=table] .vid-actions { justify-self: end; }
@media (max-width: 600px) {
  .dl-right[data-view=table] :is(.dl-thead, .vid-card) { grid-template-columns: 3.2rem minmax(0, 1fr) 6rem 6rem; }
  .dl-right[data-view=table] :is(.dl-col-type, .dl-col-date), .dl-right[data-view=table] .dl-thead > :nth-child(3), .dl-right[data-view=table] .dl-thead > :nth-child(5) { display: none; }
  .dl-right[data-view=list] .dl-col-date { display: none; }
}

/* ===== «Загрузки» v2 (dl.js): .dx-* ===== */
.dx-app { --dx-video: #e5484d; --dx-audio: #8e4ec6; --dx-image: #30a46c; --dx-archive: #f5a524; --dx-app: #3e63dd;
  --dx-doc: #12a594; --dx-folder: #d6a35c; --dx-other: var(--color-text-subdue); position: relative; }
.dx-split { display: grid; grid-template-columns: minmax(24rem, 1fr) 2fr; gap: 2.4rem; align-items: start; }
.dx-left { position: sticky; top: 1rem; display: flex; flex-direction: column; gap: 1.2rem; }
.dx-right { min-width: 0; }
/* ссылка */
.dx-add { display: flex; flex-direction: column; gap: 0.8rem; }
.dx-add input, .dx-input { width: 100%; box-sizing: border-box; padding: 0.7rem 0.9rem; border-radius: 5px; font: inherit;
  border: 1px solid var(--color-separator); background: var(--color-widget-background-highlight); color: var(--color-text-highlight); }
.dx-add input:focus, .dx-input:focus { outline: none; border-color: var(--color-primary); }
.dx-add button, .dx-btn { padding: 0.7rem 1.2rem; border-radius: 5px; font: inherit; cursor: pointer; text-align: center; text-decoration: none;
  border: 1px solid var(--color-separator); background: none; color: var(--color-text-highlight); }
.dx-add button, .dx-btn.primary { background: var(--color-primary); border-color: var(--color-primary); color: var(--color-widget-background); font-weight: 600; }
.dx-add button:disabled { opacity: .6; cursor: wait; }
.dx-btn:hover { border-color: var(--color-primary); }
.dx-chips { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-top: -0.4rem; }
.dx-chips span { font-size: var(--font-size-h6); color: var(--color-text-subdue); padding: 0.1rem 0.6rem; border: 1px solid var(--color-separator); border-radius: 99px; }
.dx-msg { font-size: var(--font-size-h6); color: var(--color-negative); min-height: 0; overflow-wrap: anywhere; }
.dx-msg:empty { display: none; }
.dx-msg.ok { color: var(--color-positive); }
/* перетаскивание */
.dx-drop { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.8rem; min-height: 12rem; padding: 1.6rem;
  border: 2px dashed var(--color-separator); border-radius: 8px; color: var(--color-text-subdue); cursor: pointer; text-align: center; transition: border-color .15s, color .15s; }
.dx-drop:hover { border-color: var(--color-primary); color: var(--color-text-highlight); }
.dx-drop small { display: block; margin-top: 0.4rem; font-size: var(--font-size-h6); opacity: .8; }
.dx-drop-touch { display: none; }
@media (pointer: coarse) {
  .dx-drop { min-height: 0; flex-direction: row; padding: 1rem; border-style: solid; }
  .dx-drop-text { display: none; }
  .dx-drop-touch { display: inline; color: var(--color-text-highlight); }
  .dx-add input, .dx-search input { font-size: 16px; }
}
.dx-dropall { position: fixed; inset: 0; z-index: 1000; display: flex; align-items: center; justify-content: center; pointer-events: none;
  background: color-mix(in srgb, var(--color-widget-background) 80%, transparent); border: 3px dashed var(--color-primary); }
.dx-dropall[hidden] { display: none; }
.dx-dropall div { text-align: center; color: var(--color-text-highlight); font-size: var(--font-size-h3); }
/* диск */
.dx-disk { font-size: var(--font-size-h6); color: var(--color-text-subdue); }
.dx-disk-row { display: flex; justify-content: space-between; margin-bottom: 0.4rem; }
.dx-disk-row b { color: var(--color-text-highlight); font-weight: 600; }
.dx-disk-bar { height: 4px; border-radius: 2px; background: var(--color-widget-background-highlight); overflow: hidden; }
.dx-disk-bar div { height: 100%; background: var(--color-primary); }
.dx-disk.low .dx-disk-bar div { background: var(--color-negative); }
.dx-disk-warn { color: var(--color-negative); margin-top: 0.4rem; }
/* активные */
.dx-head { font-size: var(--font-size-h5); color: var(--color-text-highlight); margin: 0 0 -0.4rem; font-weight: 600; }
.dx-right > .dx-head { margin: 0 0 1rem; }
.dx-crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem; margin: 0 0 1.2rem; font-size: var(--font-size-h5); min-width: 0; }
.dx-crumbs button { font: inherit; background: none; border: 0; padding: 0.2rem 0.3rem; color: var(--color-primary); cursor: pointer; border-radius: var(--border-radius); }
.dx-crumbs button:hover { background: var(--color-widget-background-highlight); }
.dx-crumbs .dx-up { font-size: 1.15em; line-height: 1; padding: 0.2rem 0.6rem; border: 1px solid var(--color-separator); color: var(--color-text-base); margin-right: 0.4rem; }
.dx-crumbs .dx-sep { color: var(--color-text-subdue); }
.dx-crumbs .dx-cur { color: var(--color-text-highlight); font-weight: 600; overflow-wrap: anywhere; }
.dx-active h3 { font-size: var(--font-size-h5); color: var(--color-text-highlight); margin: 0.4rem 0 0.8rem; font-weight: 600; }
.dx-count { color: var(--color-text-subdue); font-weight: 400; margin-left: 0.3rem; }
.dx-jobs { display: flex; flex-direction: column; gap: 1rem; }
.dx-job-row { display: flex; align-items: center; gap: 0.6rem; }
.dx-job-title { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--color-text-highlight); }
.dx-job-btns { display: flex; gap: 0.2rem; flex: none; }
.dx-jbtn { width: 2.4rem; height: 2.4rem; display: inline-flex; align-items: center; justify-content: center; padding: 0; border: 0; border-radius: 4px;
  background: none; color: var(--color-text-subdue); cursor: pointer; }
.dx-jbtn:hover { color: var(--color-text-highlight); background: var(--color-widget-background-highlight); }
.dx-jbtn[data-jact=cancel]:hover, .dx-jbtn[data-jact=dismiss]:hover { color: var(--color-negative); }
.dx-jsel { font: inherit; font-size: var(--font-size-h6); padding: 0.2rem 0.7rem; border-radius: 4px; cursor: pointer;
  border: 1px solid var(--color-primary); background: none; color: var(--color-primary); }
.dx-job-state { font-size: var(--font-size-h6); color: var(--color-text-subdue); margin: 0.2rem 0 0.4rem; }
.dx-select .dx-job-state { color: var(--color-primary); }
.dx-error .dx-job-state, .dx-job-err { color: var(--color-negative); }
.dx-job-err { font-size: var(--font-size-h6); overflow-wrap: anywhere; }
.dx-paused .yt-bar div { opacity: .4; }
/* панель над списком */
.dx-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 0.8rem; margin-bottom: 1.4rem; }
.dx-search { position: relative; flex: 1 1 16rem; min-width: 12rem; display: flex; align-items: center; color: var(--color-text-subdue); }
.dx-search svg { position: absolute; left: 0.8rem; pointer-events: none; }
.dx-search input { width: 100%; padding: 0.55rem 0.8rem 0.55rem 3rem; border-radius: 5px; font: inherit; border: 1px solid var(--color-separator);
  background: var(--color-widget-background-highlight); color: var(--color-text-highlight); }
.dx-search input:focus { outline: none; border-color: var(--color-primary); }
.dx-filters { display: flex; gap: 0.2rem; padding: 0.2rem; border: 1px solid var(--color-separator); border-radius: 6px; }
.dx-filters button { font: inherit; padding: 0.3rem 0.8rem; border: 0; border-radius: 4px; background: none; color: var(--color-text-subdue); cursor: pointer; }
.dx-filters button span { opacity: .6; font-size: var(--font-size-h6); }
.dx-filters button.on { background: var(--color-widget-background-highlight); color: var(--color-text-highlight); }
.dx-filters button:disabled { opacity: .4; cursor: default; }
.dx-sort { font: inherit; padding: 0.5rem 0.6rem; border-radius: 5px; border: 1px solid var(--color-separator);
  background: var(--color-widget-background-highlight); color: var(--color-text-highlight); }
.dx-tbtn { display: inline-flex; align-items: center; gap: 0.5rem; font: inherit; padding: 0.5rem 0.9rem; border-radius: 5px; cursor: pointer;
  border: 1px solid var(--color-separator); background: none; color: var(--color-text-subdue); }
.dx-tbtn:hover, .dx-tbtn.on { color: var(--color-primary); border-color: var(--color-primary); }
.dx-views { display: flex; gap: 0.4rem; }
.dx-views button { width: 2.8rem; height: 2.8rem; display: inline-flex; align-items: center; justify-content: center; padding: 0; cursor: pointer;
  border: 1px solid var(--color-separator); border-radius: 5px; background: none; color: var(--color-text-subdue); }
.dx-views button:hover { color: var(--color-text-highlight); }
.dx-views button.on { color: var(--color-primary); border-color: var(--color-primary); }
.dx-bulk { display: flex; align-items: center; gap: 0.8rem; flex-wrap: wrap; padding: 0.7rem 1rem; margin-bottom: 1.2rem; border-radius: 6px;
  background: color-mix(in srgb, var(--color-primary) 10%, transparent); color: var(--color-text-highlight); }
.dx-bulk[hidden] { display: none; }
.dx-bulk-n { flex: 1; }
.dx-bulk button { font: inherit; padding: 0.3rem 0.9rem; border-radius: 4px; cursor: pointer; border: 1px solid var(--color-separator); background: var(--color-widget-background); color: var(--color-text-highlight); }
.dx-bulk button.dx-danger { border-color: var(--color-negative); color: var(--color-negative); }
.dx-bulk button:disabled { opacity: .4; cursor: default; }
/* карточки */
.dx-grid { grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); }
.dx-card { position: relative; }
.dx-open { display: flex; flex-direction: column; gap: 0.5rem; color: inherit; text-decoration: none; cursor: pointer; }
.dx-open:hover .vid-name { color: var(--color-primary); }
.dx-open:hover .vid-thumb img { transform: scale(1.04); }
.dx-thumb { display: flex; align-items: center; justify-content: center; --dx-c: var(--dx-other);
  background: color-mix(in srgb, var(--dx-c) 12%, var(--color-widget-background-highlight)); color: var(--dx-c); }
.dx-thumb img { position: absolute; inset: 0; }
.dx-thumb:not(.playable)::after { content: none; }
.dx-thumb.has-img .dx-ico { visibility: hidden; }
.dx-ico { display: flex; flex-direction: column; align-items: center; gap: 0.4rem; }
.dx-ico em { font-style: normal; font-size: var(--font-size-h6); letter-spacing: .05em; opacity: .9; }
.cat-video { --dx-c: var(--dx-video); } .cat-audio { --dx-c: var(--dx-audio); } .cat-image { --dx-c: var(--dx-image); }
.cat-archive { --dx-c: var(--dx-archive); } .cat-app { --dx-c: var(--dx-app); } .cat-doc { --dx-c: var(--dx-doc); }
.cat-folder { --dx-c: var(--dx-folder); } .cat-other { --dx-c: var(--dx-other); }
.dx-check { position: absolute; top: 0.6rem; left: 0.6rem; z-index: 2; width: 2.2rem; height: 2.2rem; display: flex; align-items: center; justify-content: center;
  border-radius: 4px; background: color-mix(in srgb, var(--color-widget-background) 85%, transparent); opacity: 0; transition: opacity .15s; cursor: pointer; }
.dx-check input { margin: 0; width: 1.5rem; height: 1.5rem; accent-color: var(--color-primary); cursor: pointer; }
.dx-card:hover .dx-check, .dx-selecting .dx-check, .dx-sel .dx-check { opacity: 1; }
@media (pointer: coarse) { .dx-check { opacity: .9; } .dx-right:not(.dx-selecting) .dx-check { display: none; } }
.dx-sel .vid-thumb { outline: 2px solid var(--color-primary); outline-offset: 2px; }
.dx-col-type, .dx-col-date { display: none; color: var(--color-text-subdue); font-size: var(--font-size-h6); white-space: nowrap; }
.dx-card .vid-meta > .dx-col-size { flex: 1; min-width: 0; }
/* меню «⋯» */
.dx-menu { position: absolute; z-index: 1100; min-width: 22rem; padding: 0.4rem; border-radius: 6px; border: 1px solid var(--color-separator);
  background: var(--color-widget-background); box-shadow: 0 8px 24px rgba(0,0,0,.25); display: flex; flex-direction: column; }
.dx-menu button { font: inherit; text-align: left; padding: 0.6rem 0.9rem; border: 0; border-radius: 4px; background: none; color: var(--color-text-highlight); cursor: pointer; }
.dx-menu button:hover, .dx-menu button:focus-visible { background: var(--color-widget-background-highlight); outline: none; }
.dx-menu .dx-danger { color: var(--color-negative); }
/* пусто */
.dx-empty { text-align: center; padding: 4rem 2rem; border: 1px dashed var(--color-separator); border-radius: 8px; color: var(--color-text-subdue); }
.dx-empty h4 { color: var(--color-text-highlight); font-size: var(--font-size-h3); margin: 1rem 0 1.6rem; font-weight: 600; }
.dx-empty ul { list-style: none; padding: 0; margin: 0 auto; max-width: 46rem; text-align: left; display: flex; flex-direction: column; gap: 0.8rem; }
.dx-empty b { color: var(--color-text-highlight); }
.dx-none, .dx-loading { padding: 2rem 0; color: var(--color-text-subdue); }
/* список */
.dx-right[data-view=list] .dx-grid, .dx-right[data-view=table] .dx-grid { display: flex; flex-direction: column; gap: 0; }
.dx-right[data-view=list] .dx-card { flex-direction: row; align-items: center; gap: 1.2rem; padding: 0.7rem 0; border-top: 1px solid var(--color-separator); }
.dx-right[data-view=list] .dx-card:first-child { border-top: 0; }
.dx-right[data-view=list] .dx-open { flex-direction: row; align-items: center; gap: 1.2rem; flex: 1; min-width: 0; }
.dx-right[data-view=list] .vid-thumb { width: 9.6rem; flex: none; }
.dx-right[data-view=list] .dx-ico svg { width: 22px; height: 22px; }
.dx-right[data-view=list] .dx-ico em { display: none; }
.dx-right[data-view=list] .vid-name { -webkit-line-clamp: 1; }
.dx-right[data-view=list] .vid-meta { flex: none; gap: 1.2rem; }
.dx-right[data-view=list] .vid-meta > .dx-col-size { flex: none; }
.dx-right[data-view=list] .dx-col-date { display: inline; }
.dx-right[data-view=list] .dx-check, .dx-right[data-view=table] .dx-check { position: static; opacity: 1; background: none; flex: none; }
.dx-right[data-view=list]:not(.dx-selecting) .dx-check, .dx-right[data-view=table]:not(.dx-selecting) .dx-check { display: none; }
/* таблица */
.dx-right[data-view=table] :is(.dx-thead, .dx-card) { display: grid; grid-template-columns: 3.2rem minmax(0, 1fr) 7rem 8rem 13rem 6.4rem;
  align-items: center; gap: 1rem; padding: 0.5rem 0; border-top: 1px solid var(--color-separator); }
.dx-right[data-view=table].dx-selecting :is(.dx-thead, .dx-card) { grid-template-columns: 2.2rem 3.2rem minmax(0, 1fr) 7rem 8rem 13rem 6.4rem; }
.dx-right[data-view=table].dx-selecting .dx-thead::before { content: ''; }
.dx-right[data-view=table] .dx-thead { border-top: 0; }
.dx-thead button { font: inherit; font-size: var(--font-size-h6); text-transform: uppercase; letter-spacing: .04em; text-align: left; padding: 0; border: 0;
  background: none; color: var(--color-text-subdue); cursor: pointer; }
.dx-thead button.on, .dx-thead button:hover { color: var(--color-text-highlight); }
.dx-right[data-view=table] :is(.dx-open, .vid-meta) { display: contents; }
.dx-right[data-view=table] .vid-thumb { width: 3.2rem; border-radius: 3px; }
.dx-right[data-view=table] .vid-thumb::after, .dx-right[data-view=table] .dx-ico em { display: none; }
.dx-right[data-view=table] .dx-ico svg { width: 16px; height: 16px; }
.dx-right[data-view=table] .vid-name { -webkit-line-clamp: 1; }
.dx-right[data-view=table] .dx-col-type, .dx-right[data-view=table] .dx-col-date { display: block; }
.dx-right[data-view=table] .vid-actions { justify-self: end; }
/* диалоги */
.dx-dlg-overlay { align-items: center; justify-content: center; }
.dx-dlg { width: min(46rem, calc(100vw - 3.2rem)); max-height: calc(100dvh - 4rem); display: flex; flex-direction: column; border-radius: 8px;
  background: var(--color-widget-background); border: 1px solid var(--color-separator); box-shadow: 0 16px 48px rgba(0,0,0,.35); }
.dx-dlg-wide { width: min(76rem, calc(100vw - 3.2rem)); }
.dx-dlg-title { padding: 1.4rem 1.6rem 0.8rem; font-size: var(--font-size-h4); color: var(--color-text-highlight); font-weight: 600; overflow-wrap: anywhere; }
.dx-dlg-title small { font-weight: 400; font-size: var(--font-size-h6); color: var(--color-text-subdue); margin-left: 0.6rem; }
.dx-dlg-body { padding: 0.4rem 1.6rem 1rem; overflow: auto; flex: 1; }
.dx-dlg-btns { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 0.8rem; padding: 1rem 1.6rem 1.4rem; border-top: 1px solid var(--color-separator); }
.dx-hint { font-size: var(--font-size-h6); color: var(--color-text-subdue); margin: 0.6rem 0; }
.dx-share-hours { display: flex; gap: 0.4rem; flex-wrap: wrap; margin: 1rem 0; }
.dx-share-hours button { font: inherit; padding: 0.4rem 1rem; border-radius: 4px; cursor: pointer; border: 1px solid var(--color-separator); background: none; color: var(--color-text-subdue); }
.dx-share-hours button.on { border-color: var(--color-primary); color: var(--color-primary); }
.dx-share-row { display: flex; gap: 0.8rem; }
.dx-share-row .dx-input { flex: 1; min-width: 0; }
.dx-pick-tools { display: flex; align-items: center; gap: 0.6rem; flex-wrap: wrap; margin-bottom: 1rem; }
.dx-pick-tools button { font: inherit; font-size: var(--font-size-h6); padding: 0.3rem 0.8rem; border-radius: 4px; cursor: pointer; border: 1px solid var(--color-separator); background: none; color: var(--color-text-highlight); }
.dx-pick-sum { margin-left: auto; color: var(--color-text-subdue); font-size: var(--font-size-h6); }
.dx-pick-row { display: flex; align-items: center; gap: 0.8rem; padding: 0.4rem 0; border-top: 1px solid var(--color-separator); cursor: pointer; }
.dx-pick-row input { accent-color: var(--color-primary); }
.dx-pick-row span { flex: 1; min-width: 0; overflow-wrap: anywhere; color: var(--color-text-highlight); }
.dx-pick-row em { font-style: normal; color: var(--color-text-subdue); font-size: var(--font-size-h6); white-space: nowrap; }
.dx-flist { display: flex; flex-direction: column; }
.dx-frow { display: flex; align-items: center; gap: 1rem; padding: 0.5rem 0; border-top: 1px solid var(--color-separator); }
.dx-frow:first-child { border-top: 0; }
.dx-fthumb { position: relative; width: 4.8rem; aspect-ratio: 16/9; flex: none; border-radius: 3px; overflow: hidden; display: flex; align-items: center; justify-content: center;
  --dx-c: var(--dx-other); background: color-mix(in srgb, var(--dx-c) 12%, var(--color-widget-background-highlight)); color: var(--dx-c); }
.dx-fthumb img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.dx-fname { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--color-text-highlight); }
.dx-fname:hover { color: var(--color-primary); }
.dx-fsize { color: var(--color-text-subdue); font-size: var(--font-size-h6); white-space: nowrap; }
.dx-fbtns { display: flex; gap: 0.4rem; flex: none; }
.dx-mp4 { width: auto !important; padding: 0 0.6rem !important; font: inherit; font-size: var(--font-size-h6); }
.dx-lightbox { align-items: center; justify-content: center; cursor: zoom-out; }
.dx-lightbox img { max-width: calc(100vw - 4rem); max-height: calc(100dvh - 4rem); object-fit: contain; border-radius: 4px; }
.dx-lightbox button { position: absolute; top: 1.2rem; right: 1.2rem; border: 0; background: none; color: #fff; cursor: pointer; }
@media (max-width: 900px) {
  .dx-split { grid-template-columns: 1fr; }
  .dx-left { position: static; }
}
@media (max-width: 600px) {
  .dx-grid { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
  .dx-right[data-view=table] :is(.dx-thead, .dx-card) { grid-template-columns: 3.2rem minmax(0, 1fr) 6rem 6.4rem; }
  .dx-right[data-view=table].dx-selecting :is(.dx-thead, .dx-card) { grid-template-columns: 2.2rem 3.2rem minmax(0, 1fr) 6rem 6.4rem; }
  .dx-right[data-view=table] :is(.dx-col-type, .dx-col-date), .dx-right[data-view=table] .dx-thead > :nth-child(3), .dx-right[data-view=table] .dx-thead > :nth-child(5) { display: none; }
  .dx-right[data-view=list] .dx-col-date { display: none; }
  .dx-right[data-view=list] .vid-thumb { width: 6.4rem; }
  .dx-toolbar .dx-tbtn span { display: none; }
}
.dx-open:hover .dx-thumb.playable::after { opacity: 1; }
/* Выбор нескольких: без плашки поверх превью — круглый значок только в режиме «Выбрать», выбранная карточка в рамке */
.dx-check { top: 0.5rem; left: auto; right: 0.5rem; width: auto; height: auto; background: none; opacity: 1; display: none; }
.dx-selecting .dx-check { display: flex; }
.dx-card:hover .dx-check { opacity: 1; }
.dx-check input { -webkit-appearance: none; appearance: none; width: 2rem; height: 2rem; margin: 0; border-radius: 50%; cursor: pointer;
  border: 2px solid #fff; background: rgba(0, 0, 0, .35); box-shadow: 0 1px 4px rgba(0, 0, 0, .4); display: grid; place-content: center; }
.dx-check input::after { content: ''; width: 0.9rem; height: 0.5rem; margin-top: -0.2rem; border: solid var(--color-widget-background);
  border-width: 0 0 2px 2px; transform: rotate(-45deg); opacity: 0; }
.dx-check input:checked { background: var(--color-primary); border-color: var(--color-primary); }
.dx-check input:checked::after { opacity: 1; }
.dx-check input:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; }
.dx-sel .vid-thumb { outline: 2px solid var(--color-primary); outline-offset: 2px; }
/* в списке и таблице значок стоит отдельной колонкой, не на превью */
.dx-right[data-view=list] .dx-check input, .dx-right[data-view=table] .dx-check input { border-color: var(--color-text-subdue); background: none; box-shadow: none; }
.dx-right[data-view=list] .dx-check input:checked, .dx-right[data-view=table] .dx-check input:checked { background: var(--color-primary); border-color: var(--color-primary); }
@media (pointer: coarse) { .dx-check { opacity: 1; } }