/* ============================================================================
   ArtStudio CMS — админ-панель без внешних UI-фреймворков. Навигация и
   рабочая область используют знакомые паттерны зрелых CMS, сохраняя фирменные
   настройки ArtStudio CMS.
   ============================================================================ */

:root {
    --admin-topbar-bg: #1d2327;
    --admin-topbar-text: #f0f0f1;
    --admin-sidebar-bg: #f6f7f7;
    --admin-sidebar-text: #2c3338;
    --admin-sidebar-muted: #646970;
    --admin-sidebar-hover: #e8f2fa;
    --admin-sidebar-active: #dcecf7;
    --admin-bg: #f0f0f1;
    --admin-surface: #ffffff;
    --admin-accent: #2271b1;
    --admin-accent-hover: #135e96;
    --admin-accent-soft: #eaf3fa;
    --admin-primary: var(--admin-accent); /* совместимый алиас для старых компонентов */
    --admin-text: #1d2327;
    --admin-ink: var(--admin-text);
    --admin-muted: #646970;
    --admin-border: #dcdcde;
    --admin-border-strong: #8c8f94;
    --admin-card-bg: var(--admin-surface);
    --admin-danger: #b32d2e;
    --admin-danger-soft: #fdecee;
    --admin-danger-border: #f1b6c1;
    --admin-success: #008a20;
    --admin-warning: #9a6700;
    --admin-warning-soft: #fff8c5;
    --admin-warning-border: #d4a72c;
    --admin-info: #0284c7;
    --admin-violet: #7c3aed;
    --admin-neutral: #64748b;
    --admin-surface-hover: #f6f7f7;  /* фон ховера кнопок/строк */
    --admin-surface-soft: #fafbfc;   /* подложки групп/тулбаров */
    --admin-radius-sm: 4px;
    --admin-radius: 5px;
    --admin-radius-lg: 6px;
    --admin-shadow: 0 1px 1px rgba(0, 0, 0, .04);
    --admin-shadow-md: 0 2px 8px rgba(0, 0, 0, .07);
    --admin-shadow-lg: 0 16px 40px rgba(0, 0, 0, .18);
    --admin-topbar-h: 46px;
    --admin-sidebar-w: 240px;
}

/* ============================================================================
   Цветовые темы админ-панели (User Custom Admin Color Schemes)
   ============================================================================ */

/* 1. По умолчанию (Лазурный Сапфир / Modern Slate) */
html[data-admin-theme="default"],
body[data-admin-theme="default"] {
    --admin-primary: #2563eb;
    --admin-primary-dark: #1d4ed8;
    --admin-accent: #2563eb;
    --admin-info: #0284c7;
    --admin-topbar-bg: #0f172a;
    --admin-sidebar-bg: #0f172a;
    --admin-sidebar-text: #94a3b8;
    --admin-sidebar-muted: #64748b;
    --admin-sidebar-hover: #1e293b;
    --admin-sidebar-active-bg: #2563eb;
    --admin-sidebar-active-text: #ffffff;
    --admin-sidebar-active-border: #60a5fa;
}

/* 2. Классический тёмный (CMS Style) */
html[data-admin-theme="wp_classic"],
body[data-admin-theme="wp_classic"] {
    --admin-primary: #2563eb;
    --admin-primary-dark: #1d4ed8;
    --admin-accent: #2563eb;
    --admin-info: #2563eb;
    --admin-topbar-bg: #0f172a;
    --admin-topbar-text: #f8fafc;
    --admin-sidebar-bg: #0f172a;
    --admin-sidebar-text: #94a3b8;
    --admin-sidebar-muted: #64748b;
    --admin-sidebar-hover: #1e293b;
    --admin-sidebar-active-bg: #2563eb;
    --admin-sidebar-active-text: #ffffff;
    --admin-sidebar-active-border: #60a5fa;
}

/* 3. Глубокий океан (Navy & Teal) */
html[data-admin-theme="navy_teal"],
body[data-admin-theme="navy_teal"] {
    --admin-primary: #0d9488;
    --admin-primary-dark: #0f766e;
    --admin-accent: #0d9488;
    --admin-info: #0d9488;
    --admin-topbar-bg: #0b1329;
    --admin-topbar-text: #f8fafc;
    --admin-sidebar-bg: #0b1329;
    --admin-sidebar-text: #94a3b8;
    --admin-sidebar-muted: #64748b;
    --admin-sidebar-hover: #16203d;
    --admin-sidebar-active-bg: #0d9488;
    --admin-sidebar-active-text: #ffffff;
    --admin-sidebar-active-border: #2dd4bf;
}

/* 4. Премиум Пурпур (Royal Purple) */
html[data-admin-theme="royal_purple"],
body[data-admin-theme="royal_purple"] {
    --admin-primary: #7c3aed;
    --admin-primary-dark: #6d28d9;
    --admin-accent: #7c3aed;
    --admin-info: #7c3aed;
    --admin-topbar-bg: #111827;
    --admin-topbar-text: #f9fafb;
    --admin-sidebar-bg: #111827;
    --admin-sidebar-text: #9ca3af;
    --admin-sidebar-muted: #6b7280;
    --admin-sidebar-hover: #1f2937;
    --admin-sidebar-active-bg: #7c3aed;
    --admin-sidebar-active-text: #ffffff;
    --admin-sidebar-active-border: #c4b5fd;
}

/* 5. Ночной изумруд (Full Dark Emerald) */
html[data-admin-theme="dark_emerald"],
body[data-admin-theme="dark_emerald"] {
    --admin-primary: #10b981;
    --admin-primary-dark: #059669;
    --admin-accent: #10b981;
    --admin-info: #10b981;
    --admin-bg: #0f172a;
    --admin-surface: #1e293b;
    --admin-card-bg: #1e293b;
    --admin-topbar-bg: #020617;
    --admin-topbar-text: #f8fafc;
    --admin-sidebar-bg: #0f172a;
    --admin-sidebar-text: #f8fafc;
    --admin-sidebar-muted: #64748b;
    --admin-sidebar-hover: #1e293b;
    --admin-sidebar-active-bg: #1e293b;
    --admin-sidebar-active-text: #34d399;
    --admin-sidebar-active-border: #10b981;
    --admin-text: #f8fafc;
    --admin-muted: #94a3b8;
    --admin-border: #334155;
    --admin-surface-soft: #1e293b;
    --admin-input-bg: #0f172a;
    --admin-input-border: #334155;
    --admin-input-text: #f8fafc;
    color-scheme: dark;
}

[data-admin-theme="dark_emerald"] .admin-card,
[data-admin-theme="dark_emerald"] .admin-box,
[data-admin-theme="dark_emerald"] .admin-panel,
[data-admin-theme="dark_emerald"] .admin-cmd-palette-modal,
[data-admin-theme="dark_emerald"] .admin-table-wrap,
[data-admin-theme="dark_emerald"] .admin-filter-bar,
[data-admin-theme="dark_emerald"] .admin-modal__content {
    background-color: var(--admin-card-bg, #1e293b);
    color: var(--admin-text, #f8fafc);
    border-color: var(--admin-border, #334155);
}

[data-admin-theme="dark_emerald"] input[type="text"],
[data-admin-theme="dark_emerald"] input[type="search"],
[data-admin-theme="dark_emerald"] input[type="email"],
[data-admin-theme="dark_emerald"] input[type="password"],
[data-admin-theme="dark_emerald"] input[type="url"],
[data-admin-theme="dark_emerald"] input[type="number"],
[data-admin-theme="dark_emerald"] textarea,
[data-admin-theme="dark_emerald"] select {
    background-color: #0f172a;
    color: #f8fafc;
    border-color: #334155;
}

[data-admin-theme="dark_emerald"] .admin-cmd-item {
    color: #f8fafc;
}

[data-admin-theme="dark_emerald"] .admin-cmd-item.is-selected,
[data-admin-theme="dark_emerald"] .admin-cmd-item:hover {
    background-color: #334155;
    color: #34d399;
}


* { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }

body {
    margin: 0;
    font-family: ui-sans-serif, system-ui, 'Segoe UI', Roboto, Arial, sans-serif;
    font-size: 14px;
    line-height: 1.55;
    background: var(--admin-bg);
    color: var(--admin-text);
    -webkit-font-smoothing: antialiased;
}

/* --- Базовая типографика (замена того, что давал Pico) --- */
h1, h2, h3, h4 { margin: 0 0 .5em; font-weight: 700; line-height: 1.25; color: var(--admin-text); }
h1 { font-size: 24px; }
h2 { font-size: 19px; }
h3 { font-size: 16px; }
h4 { font-size: 14px; }
p { margin: 0 0 1em; }
a { color: var(--admin-accent); text-decoration: none; }
a:hover { text-decoration: underline; }
small { font-size: 12px; }
code, kbd, pre { font-family: ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; }
code { background: #f1f2f4; padding: 1px 5px; border-radius: 4px; font-size: .92em; }
hr { border: 0; border-top: 1px solid var(--admin-border); margin: 20px 0; }
ul, ol { margin: 0 0 1em; padding-left: 1.3em; }
img { max-width: 100%; }

/* --- Базовые поля форм (нужны там, где нет .form-field) --- */
input, select, textarea {
    font-family: inherit;
    font-size: 14px;
    color: var(--admin-text);
    background: #fff;
    border: 1px solid var(--admin-border-strong);
    border-radius: var(--admin-radius);
    padding: 8px 10px;
    width: 100%;
    max-width: 100%;
}
input[type="checkbox"], input[type="radio"] { width: auto; accent-color: var(--admin-accent); }
/* Нативный выбор файла под общий стиль кнопок */
input[type="file"] { padding: 7px 12px; font-size: 13px; color: var(--admin-muted); cursor: pointer; }
input[type="file"]::file-selector-button {
    margin-right: 12px; padding: 7px 14px; border-radius: var(--admin-radius-sm);
    border: 1px solid var(--admin-border-strong); background: #fff; color: var(--admin-text);
    font-family: inherit; font-size: 13px; font-weight: 600; cursor: pointer;
}
input[type="file"]::file-selector-button:hover { background: #f6f7f9; }
/* Нативный fallback выбора цвета. При JavaScript поле улучшает локальный Coloris. */
input[type="color"] { width: 60px; min-width: 60px; height: 40px; padding: 3px; cursor: pointer; vertical-align: middle; }
.clr-field {
    width: min(100%, 240px);
    max-width: 100%;
    color: var(--admin-accent, #214d84);
}
.clr-field input[data-coloris] {
    width: 100%;
    min-height: 40px;
    padding-right: 52px;
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 13px;
    letter-spacing: .03em;
    text-transform: uppercase;
}
.clr-field button {
    width: 42px;
    height: calc(100% - 8px);
    right: 4px;
    border-radius: 7px;
}
.clr-field button::after {
    border-radius: 7px;
    box-shadow: inset 0 0 0 1px rgba(15, 23, 42, .16);
}
.clr-picker {
    z-index: 10050;
    border: 1px solid var(--admin-border, #dce2ea);
    box-shadow: 0 18px 46px rgba(15, 31, 55, .22);
}
.clr-picker.clr-large {
    width: min(350px, calc(100vw - 24px));
}
.clr-picker .clr-close {
    background: var(--admin-accent, #214d84);
}
.clr-picker .clr-swatches button {
    width: 24px;
    height: 24px;
}
[data-admin-theme="dark_emerald"] .clr-picker {
    color: #f8fafc;
    border-color: #334155;
    background: #172033;
}
[data-admin-theme="dark_emerald"] .clr-picker input.clr-color {
    color: #f8fafc;
    border-color: #475569;
    background: #0f172a;
}
input:focus, select:focus, textarea:focus {
    outline: none;
    border-color: var(--admin-accent);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--admin-accent) 15%, transparent);
}
textarea { resize: vertical; min-height: 90px; line-height: 1.6; }
label { font-weight: 600; font-size: 13px; }
fieldset { border: 1px solid var(--admin-border); border-radius: var(--admin-radius); padding: 16px; margin: 0 0 16px; }
legend { padding: 0 8px; font-weight: 700; }
table { border-collapse: collapse; width: 100%; }

button { font-family: inherit; }

/* Выделение текста — в тон акценту панели. */
::selection { background: color-mix(in srgb, var(--admin-accent) 85%, #000); color: #fff; }

/* ============================================================================
   Страница авторизации (UI/UX Pro Max)
   ============================================================================ */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible {
    outline: 2px solid var(--admin-accent, #2563eb);
    outline-offset: 2px;
}

body.auth-page {
    position: relative;
    min-height: 100vh;
    min-height: 100dvh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #0b1120;
    color: #e2e8f0;
    padding: 32px 20px;
    font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    overflow-x: hidden;
    isolation: isolate;
}

/* Фоновый декор (Мягкие свечения — тёмный вариант) */
.auth-decor {
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: -1;
    overflow: hidden;
}
.auth-decor__blob {
    position: absolute;
    border-radius: 50%;
    filter: blur(120px);
    opacity: 0.5;
    will-change: transform;
}
.auth-decor__blob--1 {
    top: -15%;
    left: 20%;
    width: 50vw;
    height: 50vw;
    max-width: 600px;
    max-height: 600px;
    background: radial-gradient(circle, rgba(37, 99, 235, 0.25) 0%, rgba(59, 130, 246, 0.08) 70%, transparent 100%);
}
.auth-decor__blob--2 {
    bottom: -15%;
    right: 20%;
    width: 55vw;
    height: 55vw;
    max-width: 650px;
    max-height: 650px;
    background: radial-gradient(circle, rgba(16, 185, 129, 0.18) 0%, rgba(13, 148, 136, 0.06) 70%, transparent 100%);
}
.auth-decor__grid {
    position: absolute;
    inset: 0;
    background-image: radial-gradient(rgba(148, 163, 184, 0.07) 1px, transparent 1px);
    background-size: 24px 24px;
    opacity: 0.6;
    mask-image: radial-gradient(circle at 50% 50%, black 40%, transparent 90%);
    -webkit-mask-image: radial-gradient(circle at 50% 50%, black 40%, transparent 90%);
}

/* Шапка над карточкой: Ссылка на сайт и Языки */
.auth-site-link {
    position: fixed;
    top: 24px;
    left: 28px;
    z-index: 100;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px;
    border-radius: 9999px;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: #94a3b8;
    font-size: 0.8125rem;
    font-weight: 600;
    text-decoration: none;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
    backdrop-filter: blur(12px);
    transition: all 0.2s ease;
}
.auth-site-link:hover {
    background: rgba(255, 255, 255, 0.1);
    border-color: rgba(255, 255, 255, 0.18);
    color: #60a5fa;
    transform: translateX(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}

.auth-lang-switcher {
    position: fixed;
    top: 24px;
    right: 28px;
    z-index: 100;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px;
    border-radius: 9999px;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
    backdrop-filter: blur(12px);
}
.auth-lang-btn {
    padding: 5px 12px;
    border-radius: 9999px;
    border: 0;
    background: transparent;
    color: #94a3b8;
    font-size: 0.78rem;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.2s ease;
}
.auth-lang-btn:hover {
    color: #e2e8f0;
    background: rgba(255, 255, 255, 0.08);
}
.auth-lang-btn.is-active {
    background: #2563eb;
    color: #ffffff;
    box-shadow: 0 2px 6px rgba(37, 99, 235, 0.35);
}

/* Карточка авторизации */
.auth-card {
    position: relative;
    width: 100%;
    max-width: 420px;
    padding: 40px 36px;
    border-radius: 24px;
    background: rgba(15, 23, 42, 0.7);
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 20px 45px -10px rgba(0, 0, 0, 0.4), 0 0 0 1px rgba(255, 255, 255, 0.04), inset 0 1px 0 rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(20px);
    animation: authCardEnter 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}
.auth-card::before {
    display: none;
}
.auth-card--wide { max-width: 520px; }
.install-card,
.auth-card--wide.install-card {
    max-width: 100% !important;
    width: 100% !important;
}
@keyframes authCardEnter {
    from { opacity: 0; transform: translateY(16px) scale(0.98); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

.auth-brand {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin-bottom: 24px;
}
.auth-brand__logo {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 14px;
    font-size: 20px;
    font-weight: 800;
    background: rgba(37, 99, 235, 0.15);
    color: #60a5fa;
    border: 1px solid rgba(37, 99, 235, 0.25);
}
.auth-brand__logoimg {
    height: 42px;
    max-width: 220px;
    object-fit: contain;
}
.auth-brand__name {
    font-size: 1.25rem;
    font-weight: 800;
    color: #f1f5f9;
    letter-spacing: -0.02em;
}

.auth-head {
    text-align: center;
    margin-bottom: 28px;
}
.auth-head h1 {
    font-size: 1.4rem;
    font-weight: 800;
    color: #f1f5f9;
    margin: 0 0 6px;
    letter-spacing: -0.02em;
}
.auth-sub {
    font-size: 0.88rem;
    color: #94a3b8;
    margin: 0;
    line-height: 1.45;
}

.auth-card .alert {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border-radius: 12px;
    font-size: 0.85rem;
    font-weight: 600;
    margin-bottom: 22px;
    border: 1px solid transparent;
}
.auth-card .alert--error {
    background: rgba(239, 68, 68, 0.12);
    border-color: rgba(239, 68, 68, 0.25);
    color: #fca5a5;
}
.auth-card .alert--success {
    background: rgba(16, 185, 129, 0.12);
    border-color: rgba(16, 185, 129, 0.25);
    color: #6ee7b7;
}

/* Форма и Инпуты */
.auth-form {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.auth-field {
    display: flex;
    flex-direction: column;
    gap: 7px;
}
.auth-field__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.auth-field label {
    font-size: 0.82rem;
    font-weight: 700;
    color: #cbd5e1;
    margin: 0;
    letter-spacing: -0.01em;
}
.auth-forgot-link {
    font-size: 0.8rem;
    font-weight: 600;
    color: #60a5fa;
    text-decoration: none;
    transition: color 0.15s ease;
}
.auth-forgot-link:hover {
    color: #93bbfd;
    text-decoration: underline;
}

.auth-input-wrap {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
}
.auth-input-icon {
    position: absolute;
    left: 15px;
    z-index: 2;
    color: #64748b;
    pointer-events: none;
    transition: color 0.2s ease, transform 0.2s ease;
}
.auth-card input[type="text"],
.auth-card input[type="password"],
.auth-card input[type="email"] {
    width: 100%;
    box-sizing: border-box;
    padding: 12px 44px 12px 44px !important;
    font-size: 0.95rem;
    font-weight: 500;
    color: #f1f5f9;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 12px;
    outline: none;
    transition: all 0.2s ease;
}
.auth-card input::placeholder {
    color: #64748b;
    font-weight: 400;
}
.auth-card input:focus {
    background: rgba(255, 255, 255, 0.08);
    border-color: #2563eb;
    box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.2);
}
.auth-input-wrap:focus-within .auth-input-icon {
    color: #60a5fa;
    transform: scale(1.05);
}

.auth-eye-btn {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
    padding: 6px !important;
    border: 0 !important;
    background: transparent !important;
    color: #64748b;
    cursor: pointer;
    border-radius: 8px;
    transition: all 0.15s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 !important;
    width: 34px !important;
    height: 34px !important;
    min-width: auto !important;
    box-shadow: none !important;
}
.auth-eye-btn:hover {
    color: #60a5fa;
    background: rgba(255, 255, 255, 0.08) !important;
}
.auth-eye-icon--hide { display: none; }

.auth-caps-warning {
    display: none;
    align-items: center;
    gap: 8px;
    margin-top: 6px;
    font-size: 0.78rem;
    font-weight: 600;
    color: #fbbf24;
    background: rgba(251, 191, 36, 0.1);
    padding: 7px 12px;
    border-radius: 8px;
    border: 1px solid rgba(251, 191, 36, 0.2);
}

/* Главная кнопка отправки */
.auth-submit-btn {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    margin-top: 8px;
    padding: 13px 22px;
    border: 0;
    border-radius: 12px;
    background: #2563eb;
    color: #ffffff;
    font-size: 0.95rem;
    font-weight: 700;
    cursor: pointer;
    box-shadow: 0 4px 14px rgba(37, 99, 235, 0.3);
    transition: all 0.2s ease;
}
.auth-submit-btn:hover {
    background: #3b82f6;
    transform: translateY(-1px);
    box-shadow: 0 6px 22px rgba(37, 99, 235, 0.45);
}
.auth-submit-btn:active {
    transform: translateY(1px);
    box-shadow: none;
}
.auth-submit-btn svg {
    transition: transform 0.2s ease;
}
.auth-submit-btn:hover svg {
    transform: translateX(4px);
}

.auth-security-badge {
    margin-top: 28px;
    padding-top: 18px;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-size: 0.78rem;
    font-weight: 600;
    color: #64748b;
    text-align: center;
}
.auth-security-badge svg {
    color: #2dd4bf;
}

.totp-secret { background: rgba(255, 255, 255, 0.05); border: 1px dashed rgba(255, 255, 255, 0.15); border-radius: 8px; padding: 12px; margin-bottom: 10px; text-align: center; word-break: break-all; color: #e2e8f0; }
.totp-secret code { font-size: 16px; letter-spacing: 1px; background: none; color: #f1f5f9; }
.totp-qr { display: flex; justify-content: center; margin-bottom: 16px; }
.totp-qr svg { width: 220px; height: 220px; border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 8px; background: #ffffff; }


/* ============================================================================
   Улучшенные уведомления и всплывающие сообщения (Flash Alerts)
   ============================================================================ */
.alert {
    position: relative;
    padding: 14px 20px 14px 48px;
    border-radius: 12px;
    font-size: 0.9375rem;
    font-weight: 600;
    line-height: 1.45;
    margin-bottom: 22px;
    background: var(--admin-surface, #ffffff);
    border: 1.5px solid var(--admin-border, #cbd5e1);
    border-left-width: 6px;
    box-shadow: 0 6px 20px -4px rgba(15, 23, 42, 0.12), 0 2px 6px rgba(0, 0, 0, 0.04);
    animation: alertSlideIn 0.35s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

@keyframes alertSlideIn {
    from { opacity: 0; transform: translateY(-10px) scale(0.98); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

.alert::before {
    content: '';
    position: absolute; left: 16px; top: 50%; transform: translateY(-50%);
    width: 22px; height: 22px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.alert--success {
    background: color-mix(in srgb, var(--admin-success, #10b981) 12%, var(--admin-surface, #ffffff));
    border-color: color-mix(in srgb, var(--admin-success, #10b981) 40%, var(--admin-border, #cbd5e1));
    border-left-color: var(--admin-success, #10b981);
    color: #064e3b;
}

::root[data-theme="dark"] .alert--success,
body.theme-dark .alert--success,
[data-admin-theme="dark_emerald"] .alert--success {
    background: rgba(16, 185, 129, 0.15);
    border-color: rgba(16, 185, 129, 0.4);
    color: #6ee7b7;
}

.alert--success::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23059669' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 11.08V12a10 10 0 1 1-5.93-9.14'/%3E%3Cpolyline points='22 4 12 14.01 9 11.01'/%3E%3C/svg%3E");
}

.alert--error,
.alert--danger {
    background: color-mix(in srgb, var(--admin-danger, #ef4444) 12%, var(--admin-surface, #ffffff));
    border-color: color-mix(in srgb, var(--admin-danger, #ef4444) 40%, var(--admin-border, #cbd5e1));
    border-left-color: var(--admin-danger, #ef4444);
    color: #7f1d1d;
}

.alert--error::before,
.alert--danger::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23dc2626' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cline x1='15' y1='9' x2='9' y2='15'/%3E%3Cline x1='9' y1='9' x2='15' y2='15'/%3E%3C/svg%3E");
}

.alert--info {
    background: color-mix(in srgb, var(--admin-primary, #0284c7) 12%, var(--admin-surface, #ffffff));
    border-color: color-mix(in srgb, var(--admin-primary, #0284c7) 40%, var(--admin-border, #cbd5e1));
    border-left-color: var(--admin-primary, #0284c7);
    color: #0c4a6e;
}

.alert--info::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230284c7' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cline x1='12' y1='16' x2='12' y2='12'/%3E%3Cline x1='12' y1='8' x2='12.01' y2='8'/%3E%3C/svg%3E");
}

/* ============================================================================
   Верхняя панель (тёмная)
   ============================================================================ */
.admin-topbar {
    position: sticky; top: 0; z-index: 100;
    height: 52px;
    background: var(--admin-topbar-bg); color: var(--admin-topbar-text);
    display: flex; align-items: center; gap: 12px; padding: 0 16px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.admin-topbar__toggle { display: none; background: none; border: 0; color: inherit; cursor: pointer; padding: 6px; border-radius: 6px; }
.admin-topbar__toggle:hover { background: rgba(255,255,255,.1); }
.admin-topbar__brand { display: flex; align-items: center; gap: 10px; color: #fff; font-weight: 700; text-decoration: none; }
.admin-topbar__brand:hover { text-decoration: none; }
.admin-topbar__logo {
    display: inline-flex; align-items: center; justify-content: center;
    width: 30px; height: 30px; border-radius: 8px; font-size: 14px; font-weight: 800;
    background: var(--admin-accent); color: #fff;
    box-shadow: 0 2px 8px rgba(37, 99, 235, 0.3);
}
.admin-topbar__logoimg { height: 28px; max-width: 150px; object-fit: contain; border-radius: 6px; }
.admin-topbar__name { font-size: 15px; font-weight: 700; letter-spacing: -0.01em; }
.admin-topbar__crumb { color: #94a3b8; font-size: 13px; font-weight: 500; padding-left: 14px; border-left: 1px solid rgba(255,255,255,.12); }
.admin-topbar__spacer { flex: 1; }

/* Инструменты в топбаре: быстрые действия, сброс кэша, открыть сайт */
.admin-tools { display: flex; align-items: center; gap: 8px; }
.admin-tools__form { margin: 0; }
.admin-tbtn {
    display: inline-flex; align-items: center; gap: 7px;
    padding: 7px 12px; border-radius: 8px;
    background: rgba(255, 255, 255, 0.06); border: 1px solid rgba(255, 255, 255, 0.12);
    color: var(--admin-topbar-text); font-size: 13px; font-weight: 600;
    cursor: pointer; text-decoration: none; white-space: nowrap; line-height: 1;
    list-style: none; transition: all 0.15s ease;
}
.admin-tbtn:hover { background: rgba(255, 255, 255, 0.14); border-color: rgba(255, 255, 255, 0.22); text-decoration: none; color: #fff; }
.admin-tbtn::-webkit-details-marker { display: none; }
.admin-tbtn--primary { background: var(--admin-accent); border-color: var(--admin-accent); color: #fff; box-shadow: 0 2px 8px rgba(37, 99, 235, 0.25); }
.admin-tbtn--primary:hover { background: var(--admin-primary-dark); border-color: var(--admin-primary-dark); color: #fff; transform: translateY(-1px); }
.admin-tbtn svg { flex: none; }

/* Универсальный выпадающий список в топбаре (native <details>) */
.admin-menu { position: relative; }
.admin-menu__list {
    position: absolute; right: 0; top: calc(100% + 8px); min-width: 200px;
    background: #ffffff; color: var(--admin-text); border: 1px solid #e2e8f0;
    border-radius: 12px; box-shadow: 0 12px 32px rgba(15, 23, 42, 0.12); padding: 8px; z-index: 120;
}
.admin-menu__label { padding: 6px 10px 4px; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--admin-muted); }

.admin-user { position: relative; }
.admin-user__btn { list-style: none; cursor: pointer; display: inline-flex; }
.admin-user__btn::-webkit-details-marker { display: none; }
.admin-user__avatar {
    display: inline-flex; align-items: center; justify-content: center;
    width: 34px; height: 34px; border-radius: 9px; font-weight: 700; font-size: 13px;
    background: #2563eb; color: #ffffff;
    box-shadow: 0 2px 6px rgba(37, 99, 235, 0.25);
    transition: transform 0.15s ease;
}
.admin-user__avatar:hover { transform: scale(1.05); }
.admin-user__menu {
    position: absolute; right: 0; top: calc(100% + 8px); min-width: 190px;
    background: #ffffff; color: var(--admin-text); border: 1px solid #e2e8f0;
    border-radius: 12px; box-shadow: 0 12px 32px rgba(15, 23, 42, 0.12); padding: 8px; z-index: 120;
}
.admin-user__name { padding: 8px 10px; font-weight: 700; font-size: 13px; border-bottom: 1px solid #f1f5f9; margin-bottom: 4px; color: #0f172a; }
.admin-user__link { display: block; width: 100%; text-align: left; padding: 8px 12px; border-radius: 8px; background: none; border: 0; color: #334155; font-size: 13px; font-weight: 500; cursor: pointer; text-decoration: none; transition: background 0.12s ease; }
.admin-user__link:hover { background: #f1f5f9; color: #0f172a; text-decoration: none; }
.admin-user__logout { color: #dc2626; }
.admin-user__logout:hover { background: #fef2f2; color: #b91c1c; }
.admin-user__menu form { margin: 0; }

/* ============================================================================
   Оболочка: сплошная (solid) боковая навигация + основная область
   ============================================================================ */
.admin-shell { display: flex; min-height: calc(100vh - 52px); }

.admin-sidebar {
    width: var(--admin-sidebar-w); flex-shrink: 0;
    background: var(--admin-sidebar-bg); border-right: 1px solid rgba(255, 255, 255, 0.08);
    padding: 12px 0; display: flex; flex-direction: column; gap: 2px;
    position: sticky; top: 52px; align-self: flex-start;
    height: calc(100vh - 52px); overflow-y: auto;
    transition: width .18s ease, transform .2s ease;
    scrollbar-color: rgba(255,255,255,0.2) var(--admin-sidebar-bg);
    scrollbar-width: thin;
}
.admin-sidebar__label {
    font-size: 11px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase;
    color: var(--admin-sidebar-muted); padding: 14px 16px 6px;
}
/* Заголовок группы как кнопка-переключатель (сворачивание раздела). */
.admin-sidebar__label--toggle {
    display: flex; align-items: center; justify-content: space-between; gap: 8px;
    width: 100%; background: none; border: 0; text-align: left; cursor: pointer;
    font: inherit; font-size: 11px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase;
    color: var(--admin-sidebar-muted); transition: color 0.15s ease;
}
.admin-sidebar__label--toggle:hover { color: #f8fafc; }
.admin-sidebar__chevron { flex: none; opacity: .7; transition: transform .18s ease; }
.admin-nav-group.is-collapsed .admin-sidebar__chevron { transform: rotate(-90deg); }
.admin-nav-group.is-collapsed .admin-nav-group__items { display: none; }
.admin-nav-group__items { display: flex; flex-direction: column; gap: 2px; }
.admin-nav-item {
    display: flex; align-items: center; gap: 10px;
    min-height: 38px; padding: 8px 12px; margin: 1px 8px; border-radius: 8px;
    color: var(--admin-sidebar-text); text-decoration: none;
    font-size: 14px; font-weight: 500; border-left: 0;
    transition: all 0.15s ease;
}
.admin-nav-item:hover { background: var(--admin-sidebar-hover); color: #f8fafc; text-decoration: none; }
.admin-nav-item.is-active {
    background: var(--admin-sidebar-active-bg);
    color: var(--admin-sidebar-active-text);
    font-weight: 600;
    box-shadow: 0 2px 8px rgba(37, 99, 235, 0.3);
}
.admin-nav-item__icon { flex-shrink: 0; color: currentColor; opacity: .85; }
.admin-nav-item.is-active .admin-nav-item__icon { opacity: 1; color: var(--admin-sidebar-active-text, currentColor); }
.admin-sidebar__collapse {
    position: sticky; bottom: 0; margin-top: auto; width: calc(100% - 16px); min-height: 40px; margin-inline: 8px;
    display: flex; align-items: center; gap: 10px; padding: 8px 12px; border-radius: 8px;
    color: var(--admin-sidebar-muted); background: var(--admin-sidebar-bg); border: 1px solid rgba(255, 255, 255, 0.08);
    cursor: pointer; font-size: 13px; font-weight: 500; text-align: left; transition: all 0.15s ease;
}
.admin-sidebar__collapse:hover { color: #f8fafc; background: var(--admin-sidebar-hover); }
.admin-sidebar__collapse svg { flex: none; transition: transform .18s ease; }
.admin-sidebar-backdrop { display: none; }

/* Единая ширина контента во всех разделах: не на всю ширину экрана и не узкие
   760px — максимум 1400px. На широких мониторах контент центрируется в области
   справа от сайдбара (margin:auto), на узких — заполняет всё доступное. */
.admin-main { flex: 1; min-width: 0; max-width: 1600px; margin-inline: auto; padding: 28px 36px 48px; }
.admin-main__header { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 18px; flex-wrap: wrap; }
.admin-main__header h1 { margin: 0; font-size: 23px; font-weight: 500; }
.admin-main__actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }

.admin-skip-link {
    position: fixed; left: 8px; top: -100px; z-index: 1000; padding: 10px 14px;
    background: #fff; color: var(--admin-accent); border: 2px solid var(--admin-accent);
}
.admin-skip-link:focus { top: 8px; }

/* Тулбар действий страницы (устаревшая обёртка — действия теперь в шапке страницы) */
.page-toolbar { display: flex; justify-content: flex-end; gap: 10px; margin-bottom: 18px; flex-wrap: wrap; }

/* ============================================================================
   Быстрый поиск (в топбаре)
   ============================================================================ */
.admin-search { position: relative; display: flex; align-items: center; min-width: 260px; }
.admin-search__icon { position: absolute; left: 11px; color: #9aa0ac; pointer-events: none; }
.admin-search__input {
    width: 100%; padding: 8px 12px 8px 34px; border-radius: 9px;
    background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.14); color: #fff; font-size: 13px;
}
.admin-search__input::placeholder { color: #9aa0ac; }
.admin-search__input:focus { background: rgba(255,255,255,.14); border-color: rgba(255,255,255,.3); box-shadow: none; }
.admin-search__kbd {
    position: absolute; right: 8px; font-size: 10px; color: #b9bcc7;
    background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.14); border-radius: 5px; padding: 2px 6px;
}
.admin-search__results {
    position: absolute; top: calc(100% + 8px); left: 0; right: 0; z-index: 130;
    background: #fff; color: var(--admin-text); border: 1px solid var(--admin-border); border-radius: 10px;
    box-shadow: var(--admin-shadow-lg); max-height: 380px; overflow-y: auto; min-width: 320px;
}
.admin-search__item { display: flex; align-items: baseline; gap: 10px; padding: 10px 14px; text-decoration: none; color: var(--admin-text); border-bottom: 1px solid #f0f1f4; }
.admin-search__item:hover { background: var(--admin-bg); text-decoration: none; }
.admin-search__type { font-size: 11px; text-transform: uppercase; color: #9aa0ac; flex-shrink: 0; min-width: 64px; }
.admin-search__title { font-weight: 600; }
.admin-search__empty { padding: 14px; color: #9aa0ac; font-size: 14px; }

/* ============================================================================
   Кнопки
   ============================================================================ */
.btn {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 8px 14px; border-radius: var(--admin-radius-sm); border: 1px solid var(--admin-border-strong);
    background: #fff; color: var(--admin-text); text-decoration: none;
    font-size: 14px; font-weight: 600; cursor: pointer; line-height: 1.2; white-space: nowrap;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease, transform .08s ease;
}
.btn:hover { background: var(--admin-surface-hover); border-color: var(--admin-accent); color: var(--admin-accent-hover); text-decoration: none; }
.btn:active { transform: translateY(1px); }
.btn--primary { background: var(--admin-accent); border-color: var(--admin-accent); color: #fff; box-shadow: 0 1px 2px color-mix(in srgb, var(--admin-accent) 30%, transparent); }
.btn--primary:hover { background: var(--admin-accent-hover); color: #fff; box-shadow: 0 2px 6px color-mix(in srgb, var(--admin-accent) 40%, transparent); }
.btn--secondary { background: var(--admin-surface-soft); border-color: var(--admin-border); color: var(--admin-text); }
.btn--secondary:hover { background: var(--admin-accent-soft); border-color: var(--admin-accent); color: var(--admin-accent-hover); }
.btn--warning { background: var(--admin-warning-soft); border-color: var(--admin-warning-border); color: var(--admin-warning); }
.btn--warning:hover { background: color-mix(in srgb, var(--admin-warning-soft) 70%, var(--admin-warning-border)); border-color: var(--admin-warning); color: var(--admin-warning); }
.btn--danger { background: #fff; border-color: var(--admin-danger-border); color: var(--admin-danger); }
.btn--danger:hover { background: var(--admin-danger-soft); }
.btn--small, .btn--sm { padding: 5px 9px; font-size: 13px; border-radius: var(--admin-radius-sm); }
.btn__icon { flex-shrink: 0; opacity: .85; }
.btn--primary .btn__icon, .btn--danger .btn__icon { opacity: 1; }
.btn:disabled, .btn[aria-disabled="true"] { opacity: .5; cursor: not-allowed; transform: none; }
.btn--social {
    display: inline-flex; align-items: center; justify-content: center; gap: 7px;
    min-width: max-content; height: 34px; padding: 0 12px; border-radius: 6px;
    background: var(--admin-surface-soft, #f8fafc);
    border: 1px solid var(--admin-border, #cbd5e1);
    color: var(--admin-muted, #475569);
    box-shadow: none;
    transition: all .18s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative; flex-shrink: 0;
    font-size: 13px; font-weight: 600; white-space: nowrap;
}
.btn--social--icon-only {
    width: 34px;
    min-width: 34px;
    padding: 0;
}
.btn--social svg { width: 16px; height: 16px; flex-shrink: 0; display: inline-block; }

/* Ховер на непубликовавшуюся кнопку — предпросмотр яркого бренда */
.btn--social:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(0, 0, 0, .14); }
.btn--social-telegram:hover { background: #2ca5e0; border-color: #2ca5e0; color: #fff; }
.btn--social-facebook:hover { background: #1877f2; border-color: #1877f2; color: #fff; }
.btn--social-linkedin:hover { background: #0a66c2; border-color: #0a66c2; color: #fff; }
.btn--social-instagram:hover { background: linear-gradient(45deg, #f09433, #e6683c 30%, #dc2743 55%, #cc2366 75%, #bc1888); border-color: #cc2366; color: #fff; }

/* Опубликовано в данную соцсеть — закрашена в яркий цвет с изумрудной точкой успеха */
.btn--social.is-published { color: #fff; box-shadow: 0 2px 8px rgba(0, 0, 0, .15); }
.btn--social-telegram.is-published { background: #2ca5e0; border-color: #2ca5e0; }
.btn--social-facebook.is-published { background: #1877f2; border-color: #1877f2; }
.btn--social-linkedin.is-published { background: #0a66c2; border-color: #0a66c2; }
.btn--social-instagram.is-published { background: linear-gradient(45deg, #f09433, #e6683c 30%, #dc2743 55%, #cc2366 75%, #bc1888); border-color: #cc2366; }
.btn--social.is-published::after {
    content: ''; position: absolute; top: -3px; right: -3px; width: 8px; height: 8px;
    background: #10b981; border: 2px solid #fff; border-radius: 50%;
}
.btn--social.is-published:hover { filter: brightness(0.92); transform: translateY(-1px); }

/* Колонка «Соцсети» в списке новостей. */
.data-table__flex { width: 100%; }
.news-social { white-space: nowrap; }
.news-social__btns { display: flex; align-items: center; gap: 6px; }
.news-social__btns form { margin: 0; }
.news-social__state { display: flex; flex-direction: column; gap: 3px; margin-bottom: 6px; }
.news-social__meta { font-size: 12px; color: var(--admin-muted); }

/* ============================================================================
   Карточки статистики (дашборд)
   ============================================================================ */
.admin-welcome {
    display: flex; align-items: center; justify-content: space-between; gap: 20px;
    margin-bottom: 24px; padding: 22px 26px; background: #ffffff;
    border: 1px solid #e2e8f0; border-left: 5px solid var(--admin-accent);
    border-radius: 16px;
    box-shadow: 0 4px 20px -2px rgba(15, 23, 42, 0.05), 0 2px 6px rgba(0, 0, 0, 0.02);
}
.admin-welcome h2 { margin: 0 0 4px; font-size: 20px; font-weight: 700; color: #0f172a; letter-spacing: -0.01em; }
.admin-welcome p { margin: 0; color: #64748b; font-size: 14px; }
.admin-welcome__actions { display: flex; gap: 10px; flex-wrap: wrap; }
.admin-welcome__actions .btn { border-radius: 10px; }

.stat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 14px; margin-top: 12px; margin-bottom: 24px; }
.stat-card {
    background: #ffffff; display: flex; flex-direction: column; gap: 6px; position: relative;
    border: 1px solid #e2e8f0; border-radius: 14px; padding: 18px 20px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 6px 16px -4px rgba(15, 23, 42, 0.03);
    transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}
.stat-card:hover { border-color: var(--admin-accent); box-shadow: 0 10px 25px -5px rgba(15, 23, 42, 0.08); transform: translateY(-3px); text-decoration: none; }
.stat-card--highlight { border-color: #fca5a5; background: #fef2f2; }
.stat-card__value { font-size: 26px; font-weight: 800; color: #0f172a; line-height: 1.1; letter-spacing: -0.02em; }
.stat-card__label { font-size: 13px; font-weight: 600; color: #64748b; }

/* ============================================================================
   Таблицы списков
   ============================================================================ */
.data-table {
    width: 100%; border-collapse: separate; border-spacing: 0; background: var(--admin-surface);
    border: 1px solid var(--admin-border); border-radius: 14px; overflow: hidden; box-shadow: var(--admin-shadow);
}
.data-table th, .data-table td { padding: 12px 16px; text-align: left; border-bottom: 1px solid var(--admin-border); font-size: 16px; vertical-align: middle; }
.data-table th { background: var(--admin-surface-soft, #f8fafc); font-weight: 700; color: #1e293b; font-size: 12px; text-transform: uppercase; letter-spacing: 0.04em; }
.news-social, .data-table td.news-social { min-width: 140px; }
.data-table tbody tr:nth-child(even) { background: #fdfdfd; }
.data-table tbody tr:hover { background: #f1f5f9; }
.data-table tr:last-child td { border-bottom: none; }
.data-table__action-cell { min-width: 110px; text-align: right !important; white-space: nowrap; }
.data-table__actions { display: flex; flex-wrap: nowrap; gap: 4px; justify-content: flex-end; align-items: center; white-space: nowrap; }
.data-table__actions form { display: inline-flex; margin: 0; }
/* Кнопка-иконка без текста (UI/UX Pro Max) */
.btn--icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px;
    min-width: 32px;
    height: 32px;
    line-height: 1;
    border-radius: 8px;
    box-sizing: border-box;
}
.btn--small.btn--icon {
    padding: 5px;
    min-width: 30px;
    height: 30px;
}
.btn--icon svg, .btn--small.btn--icon svg {
    margin: 0 !important;
    display: block;
}
.data-table td.data-table__actions { display: table-cell; width: 1%; text-align: right; white-space: nowrap; }
.data-table td.data-table__actions > form { display: inline-flex; margin: 0 0 0 4px; vertical-align: middle; }
.data-table td.data-table__actions > .btn { margin: 0 0 0 4px; vertical-align: middle; }
.data-table__empty { padding: 32px; text-align: center; color: var(--admin-muted); }
.data-table__empty .btn { margin-top: 12px; }

/* Визуальный интерактивный выбор фокальной точки (UI/UX Pro Max) */
.focal-field__container { display: flex; gap: 16px; align-items: flex-start; flex-wrap: wrap; margin-top: 6px; }
.focal-field__preview {
    position: relative;
    width: 220px;
    height: 140px;
    border-radius: 8px;
    overflow: hidden;
    background: #1e293b;
    border: 2px solid var(--admin-border, #cbd5e1);
    cursor: crosshair;
    user-select: none;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}
.focal-field__preview img { width: 100%; height: 100%; object-fit: cover; pointer-events: none; }
.focal-field__placeholder {
    position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
    padding: 12px; text-align: center; font-size: 11px; color: #94a3b8; line-height: 1.3;
}
.focal-field__pin {
    position: absolute;
    transform: translate(-50%, -50%);
    font-size: 20px;
    line-height: 1;
    pointer-events: none;
    transition: left 0.15s ease, top 0.15s ease;
    filter: drop-shadow(0 2px 4px rgba(0,0,0,0.6));
    z-index: 5;
}
.focal-field__controls { display: flex; flex-direction: column; gap: 10px; }
.focal-field__grid { display: grid; grid-template-columns: repeat(3, 34px); gap: 4px; }
.focal-field__grid .btn { min-width: 34px; height: 34px; padding: 0; justify-content: center; font-size: 13px; }
.focal-field__grid .btn.is-active { background: var(--admin-accent, #2563eb); color: #fff; border-color: var(--admin-accent, #2563eb); }
.focal-field__inputs { display: flex; align-items: flex-end; gap: 8px; }
.focal-field__input-wrap { display: flex; flex-direction: column; gap: 2px; }
.focal-field__input-wrap label { font-size: 11px; color: var(--admin-muted); margin: 0; }
.focal-field__input-wrap input { width: 65px; height: 32px; padding: 4px 6px; font-size: 13px; text-align: center; }

.file-cell { display: flex; align-items: center; gap: 12px; }
.file-thumbnail { width: 44px; height: 44px; border-radius: 8px; background: #f1f5f9; border: 1px solid #e2e8f0; overflow: hidden; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.file-thumbnail img { width: 100%; height: 100%; object-fit: cover; display: block; }
.file-thumbnail--icon { color: var(--admin-muted); }
.file-name { font-weight: 500; color: #0f172a; word-break: break-all; }

.badge { display: inline-flex; align-items: center; gap: 6px; padding: 4px 12px; border-radius: 9999px; font-size: 12px; font-weight: 600; line-height: 1.2; }
.badge--published, .badge--success { background: #dcfce7; color: #15803d; }
.badge--draft { background: #f1f5f9; color: #475569; }
.badge--danger { background: #fee2e2; color: #991b1b; }
.badge--accent { background: #eff6ff; color: #1d4ed8; }
.badge--home { margin-left: 8px; vertical-align: middle; }
.badge svg { flex-shrink: 0; }
.status-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #94a3b8; margin-right: 8px; vertical-align: middle; }
.status-dot--published { background: #10b981; }

/* ============================================================================
   Карточки-формы и поля
   ============================================================================ */
.form-card { background: #ffffff; border: 1px solid #e2e8f0; border-radius: 16px; padding: 24px; box-shadow: 0 2px 10px rgba(15, 23, 42, 0.03); }
.entry-main > .form-card { margin-bottom: 24px; }
.admin-card-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 20px; padding-bottom: 12px; border-bottom: 1px solid var(--admin-border); }
.admin-card-header__title { display: flex; align-items: center; gap: 10px; min-width: 0; }
.admin-card-header__icon { display: inline-flex; align-items: center; color: var(--admin-card-header-color, var(--admin-accent)); }
.admin-card-header__icon .btn__icon { opacity: 1; }
.admin-card-header h3 { margin: 0; font-size: 1.15rem; font-weight: 700; }
.admin-section-icon { display: inline-flex; align-items: center; color: var(--admin-section-icon-color, var(--admin-accent)); }
.admin-section-icon .btn__icon { opacity: 1; }
.admin-section-icon--success { --admin-section-icon-color: var(--admin-success); }
.admin-section-icon--info { --admin-section-icon-color: var(--admin-info); }
.admin-section-icon--violet { --admin-section-icon-color: var(--admin-violet); }
.admin-section-icon--warning { --admin-section-icon-color: var(--admin-warning); }
.admin-section-icon--neutral { --admin-section-icon-color: var(--admin-neutral); }
.admin-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 20px; padding-bottom: 12px; border-bottom: 1px solid var(--admin-border); }
.admin-section-heading__title { display: flex; align-items: center; gap: 10px; min-width: 0; }
.admin-section-heading h3, .admin-section-heading h4 { margin: 0; font-size: 1.15rem; font-weight: 700; }
.admin-grid-auto { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 20px; }
.admin-card-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 20px; margin-top: 16px; }
.admin-status-grid { margin-bottom: 28px; }
.admin-status-card { background: var(--admin-surface); padding: 20px; border-radius: var(--admin-radius-lg); border: 1px solid var(--admin-border); }
.admin-status-card__label { margin: 0 0 8px; font-size: .9rem; color: var(--admin-muted); }
.admin-status-card__value { font-size: 1.1rem; font-weight: 700; color: var(--admin-text); display: flex; align-items: center; gap: 8px; }
.admin-status--success, .admin-status--warning { display: inline-flex; align-items: center; gap: 6px; }
.admin-status--success { color: var(--admin-success); }
.admin-status--warning { color: var(--admin-warning); }
.admin-empty { padding: 24px; text-align: center; color: var(--admin-muted); }
.admin-code-panel { background: #1e293b; color: #f8fafc; padding: 16px; border-radius: 10px; font-family: ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; font-size: .875rem; max-height: 360px; overflow-y: auto; }
.admin-code-panel__empty { color: #94a3b8; }
.admin-code-panel__row { margin-bottom: 4px; border-bottom: 1px solid #334155; padding-bottom: 4px; }
.admin-demo-card { padding: 18px; border-radius: 10px; border: 1px solid var(--admin-border); background: var(--admin-surface-soft); }
.admin-demo-card--danger { background: var(--admin-danger-soft); border-color: var(--admin-danger-border); }
.admin-demo-card--danger h4, .admin-demo-card--danger label { color: var(--admin-danger); }
.admin-demo-card--danger input { border-color: var(--admin-danger-border); }
.admin-demo-card .btn { width: 100%; }
.admin-mt-24 { margin-top: 24px; }
.admin-code-input { font-family: ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; }
.admin-poll-results { grid-column: 1 / -1; background: color-mix(in srgb, var(--admin-accent) 6%, var(--admin-surface)); border: 1px solid var(--admin-border); border-radius: var(--admin-radius); padding: 14px 16px; }
.admin-poll-results__title { display: flex; align-items: center; gap: 7px; margin-bottom: 10px; font-size: .92rem; color: var(--admin-text); }
.admin-progress { height: 8px; background: color-mix(in srgb, var(--admin-border) 60%, transparent); border-radius: 4px; overflow: hidden; }
.admin-progress__bar { height: 100%; background: var(--admin-accent); border-radius: 4px; }
/* Карточка формы больше не режется до 760 (тянется до ширины контента, 1400),
   но одиночные поля ввода держим читаемой ширины — иначе на широкой карточке
   поле под «Название сайта» растянулось бы на весь экран. Редактор (wysiwyg)
   и служебные поля (color/checkbox/radio/range) не трогаем. */
.form-grid input[type="text"],
.form-grid input[type="url"],
.form-grid input[type="email"],
.form-grid input[type="tel"],
.form-grid input[type="password"],
.form-grid input[type="number"],
.form-grid input[type="search"],
.form-grid input[type="date"],
.form-grid input[type="datetime-local"],
.form-grid input:not([type]),
.form-grid select,
.form-grid textarea:not([data-wysiwyg]) { max-width: 640px; }
.admin-builder-workspace { width: 100%; }
.admin-builder-workspace > .form-grid { gap: 0; }
.form-grid { display: flex; flex-direction: column; gap: 18px; }
.form-field { display: flex; flex-direction: column; gap: 6px; }
.form-field label { font-size: 13px; font-weight: 600; }
.form-field input, .form-field select, .form-field textarea { width: 100%; }
.form-field--checkbox { flex-direction: row; align-items: center; gap: 10px; }
.form-field--checkbox input { width: auto; }
.form-hint { font-size: 12px; color: var(--admin-muted); }
/* Переключатель языка стека блоков: у каждого языка свой набор блоков. */
.block-lang-switch {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 10px;
    flex-wrap: wrap;
}
.form-actions { display: flex; gap: 10px; margin-top: 6px; flex-wrap: wrap; }
.form-actions--sticky {
    position: fixed; bottom: 0;
    left: var(--admin-sidebar-w, 240px);
    right: 0;
    z-index: 999999 !important;
    display: flex; align-items: center; justify-content: space-between; gap: 16px; margin: 0; padding: 16px 32px;
    min-height: 64px;
    background: rgba(255, 255, 255, 0.98);
    border: 0;
    border-top: 1px solid var(--admin-border, #cbd5e1);
    border-radius: 0 !important;
    box-shadow: 0 -6px 24px rgba(15, 23, 42, 0.08);
    backdrop-filter: blur(20px) saturate(190%); -webkit-backdrop-filter: blur(20px) saturate(190%);
    transition: opacity .15s ease, transform .15s ease, visibility .15s ease;
}

.form-actions-left {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-right: auto;
}

.form-actions-right {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-left: auto;
}

::root[data-theme="dark"] .form-actions--sticky,
body.theme-dark .form-actions--sticky {
    background: rgba(15, 23, 42, 0.97);
    border-color: rgba(56, 189, 248, 0.4);
    border-top-color: #38bdf8;
    box-shadow: 0 -12px 40px -4px rgba(0, 0, 0, 0.65), 0 -4px 12px rgba(56, 189, 248, 0.15);
}

.form-actions--sticky.is-context-hidden { opacity: 1 !important; visibility: visible !important; transform: none !important; pointer-events: auto !important; }
body:has(.form-actions--sticky) .admin-main,
body.has-sticky-actions .admin-main { padding-bottom: 120px; }

.form-actions--sticky .btn {
    padding: 10px 22px;
    font-size: 0.9375rem;
    font-weight: 600;
    min-height: 44px;
    border-radius: 9px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.form-actions--sticky .btn--primary {
    min-width: 160px;
    justify-content: center;
    padding: 11px 26px;
    font-size: 0.95rem;
    font-weight: 700;
    background: var(--admin-primary, #0284c7);
    border-color: var(--admin-primary, #0284c7);
    color: #ffffff;
    box-shadow: 0 4px 14px rgba(2, 132, 199, 0.35);
    transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.form-actions--sticky .btn--primary:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 18px rgba(2, 132, 199, 0.45);
    background: var(--admin-primary-dark, #0369a1);
}

/* Кнопка «Отмена» на плавающей панели */
.form-actions--sticky a.btn,
.form-actions--sticky .btn--outline,
.form-actions--sticky .btn--secondary,
.form-actions--sticky .btn--cancel {
    background: var(--admin-surface-soft, #f8fafc);
    border: 1.5px solid var(--admin-border, #cbd5e1);
    color: var(--admin-text-muted, #475569);
    font-weight: 500;
}

.form-actions--sticky a.btn:hover,
.form-actions--sticky .btn--outline:hover,
.form-actions--sticky .btn--secondary:hover,
.form-actions--sticky .btn--cancel:hover {
    background: #fef2f2;
    border-color: #fca5a5;
    color: #dc2626;
}

/* Сворачиваемая секция формы (details): второстепенные поля не шумят,
   пока не понадобятся. Значения внутри закрытой секции отправляются как обычно. */
.form-section { border: 1px solid var(--admin-border); border-radius: var(--admin-radius); background: var(--admin-surface-soft); }
.form-section > summary {
    display: flex; align-items: center; gap: 10px; padding: 12px 16px;
    cursor: pointer; font-weight: 600; font-size: 13px; list-style: none; user-select: none;
}
.form-section > summary::-webkit-details-marker { display: none; }
.form-section > summary::before {
    content: ''; flex-shrink: 0; width: 7px; height: 7px; margin-top: -3px;
    border-right: 2px solid var(--admin-muted); border-bottom: 2px solid var(--admin-muted);
    transform: rotate(-45deg); transition: transform .15s ease;
}
.form-section[open] > summary::before { transform: rotate(45deg); margin-top: -5px; }
.form-section > summary:hover { color: var(--admin-accent); }
.form-section__hint { font-weight: 400; font-size: 12px; color: var(--admin-muted); }
.form-section__body { display: flex; flex-direction: column; gap: 18px; padding: 6px 16px 16px; }

/* 12-колоночная адаптивная сетка форм */
.form-grid-12 {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 20px 24px;
    width: 100%;
    align-items: start;
}
.col-12 { grid-column: span 12; }
.col-8  { grid-column: span 8; }
.col-6  { grid-column: span 6; }
.col-4  { grid-column: span 4; }
.col-3  { grid-column: span 3; }
.col-2  { grid-column: span 2; }

.form-grid-12 input[type="text"],
.form-grid-12 input[type="url"],
.form-grid-12 input[type="email"],
.form-grid-12 input[type="tel"],
.form-grid-12 input[type="password"],
.form-grid-12 input[type="number"],
.form-grid-12 input[type="search"],
.form-grid-12 input[type="date"],
.form-grid-12 input[type="datetime-local"],
.form-grid-12 input:not([type]),
.form-grid-12 select,
.form-grid-12 textarea {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
}

@media (max-width: 900px) {
    .col-8, .col-4 { grid-column: span 12; }
}
@media (max-width: 768px) {
    .col-6, .col-3, .col-2 { grid-column: span 12; }
    .form-grid-12 { gap: 16px; }
}

/* Современные карточки настроек */
.settings-card, .settings-group {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 28px;
    margin: 0 0 24px 0;
    box-shadow: 0 1px 4px rgba(15, 23, 42, 0.03);
}
.settings-card__header {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    margin-bottom: 22px;
    padding-bottom: 16px;
    border-bottom: 1px solid #f1f5f9;
}
.settings-card__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: #eff6ff;
    color: #2563eb;
    flex-shrink: 0;
}
.settings-card__title {
    font-size: 17px !important;
    font-weight: 700 !important;
    color: #0f172a !important;
    margin: 0 0 4px 0 !important;
    line-height: 1.3 !important;
}
.settings-card__subtitle {
    font-size: 13.5px !important;
    color: #64748b !important;
    margin: 0 !important;
    line-height: 1.45 !important;
}
.settings-group > legend { display: none; }
.admin-section-intro { margin: -4px 0 16px; max-width: 900px; }
.settings-jump-nav {
    position: sticky;
    top: calc(var(--admin-topbar-h) + 8px);
    z-index: 18;
    display: flex;
    gap: 6px;
    margin: 0 0 22px;
    padding: 7px;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-width: thin;
    border: 1px solid var(--admin-border);
    border-radius: 12px;
    background: color-mix(in srgb, var(--admin-surface) 94%, transparent);
    box-shadow: var(--admin-shadow);
    backdrop-filter: blur(12px);
}
.settings-jump-nav a {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 7px;
    min-height: 36px;
    padding: 7px 11px;
    border-radius: 8px;
    color: var(--admin-muted);
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
}
.settings-jump-nav a:hover,
.settings-jump-nav a:focus-visible {
    background: var(--admin-accent-soft);
    color: var(--admin-accent);
    text-decoration: none;
}
.settings-group[id],
.tg-step[id],
.performance-section[id],
.social-section[id],
.webhook-section[id],
#demo-section,
#backup-section { scroll-margin-top: calc(var(--admin-topbar-h) + 64px); }
.performance-settings-card > .form-grid { gap: 22px; }
.performance-settings-card .header-builder__group { margin: 0; }
.social-section.settings-group { margin: 0; }
#social-queue td form { margin: 0; }
.webhook-flow {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin-top: 18px;
}
.webhook-flow__step {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    padding: 16px;
    border: 1px solid var(--admin-border);
    border-radius: var(--admin-radius-md);
    background: var(--admin-surface-soft);
}
.webhook-flow__step p { margin: 5px 0 0; }
.webhook-flow__number {
    display: grid;
    place-items: center;
    flex: 0 0 28px;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    color: #fff;
    background: var(--admin-primary);
    font-size: 13px;
    font-weight: 800;
}
.webhook-tech-details {
    margin-top: 16px;
    border-top: 1px solid var(--admin-border);
    padding-top: 14px;
}
.webhook-tech-details summary,
.webhook-delivery-details summary,
.webhook-edit > summary { cursor: pointer; font-weight: 700; }
.webhook-tech-details__body { margin-top: 12px; }
.webhook-tech-details pre,
.webhook-delivery-details pre {
    max-width: 100%;
    overflow: auto;
    padding: 12px;
    border-radius: var(--admin-radius-md);
    background: var(--admin-surface-soft);
    white-space: pre-wrap;
    word-break: break-word;
}
.webhook-section__heading,
.webhook-endpoint,
.webhook-endpoint__actions,
.webhook-endpoint__meta {
    display: flex;
    align-items: center;
    gap: 10px;
}
.webhook-section__heading { justify-content: space-between; align-items: flex-start; }
.webhook-endpoint-list { display: grid; gap: 12px; margin-top: 16px; }
.webhook-endpoint {
    justify-content: space-between;
    align-items: flex-start;
    padding: 16px;
    border: 1px solid var(--admin-border);
    border-radius: var(--admin-radius-md);
}
.webhook-endpoint__main { min-width: 0; }
.webhook-endpoint__title { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.webhook-endpoint__url {
    margin: 7px 0 10px;
    color: var(--admin-muted);
    overflow-wrap: anywhere;
}
.webhook-endpoint__actions { flex-wrap: wrap; justify-content: flex-end; }
.webhook-endpoint__actions form { margin: 0; }
.webhook-edit { position: relative; }
.webhook-edit > summary { list-style: none; }
.webhook-edit > summary::-webkit-details-marker { display: none; }
.webhook-edit[open] > form {
    position: absolute;
    z-index: 20;
    top: calc(100% + 8px);
    right: 0;
    width: min(560px, calc(100vw - 48px));
    padding: 18px;
    border: 1px solid var(--admin-border);
    border-radius: var(--admin-radius-lg);
    background: var(--admin-surface);
    box-shadow: var(--admin-shadow-lg);
}
.webhook-status-grid {
    display: grid;
    grid-template-columns: 2fr repeat(3, minmax(110px, 1fr));
    gap: 12px;
    margin: 18px 0;
}
.webhook-status-grid > div {
    display: grid;
    gap: 5px;
    padding: 14px;
    border: 1px solid var(--admin-border);
    border-radius: var(--admin-radius-md);
    background: var(--admin-surface-soft);
}
.webhook-status-grid strong { font-size: 18px; }
.webhook-delivery-details { min-width: 90px; }
.webhook-delivery-details[open] { min-width: 320px; }
.webhook-error { color: var(--admin-danger); font-weight: 600; }
#webhook-log td form { margin: 0; }
.submission-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 18px;
}
.submission-summary__card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 16px 18px;
    color: var(--admin-text);
    text-decoration: none;
    border: 1px solid var(--admin-border);
    border-radius: var(--admin-radius-lg);
    background: var(--admin-surface);
    box-shadow: var(--admin-shadow);
}
.submission-summary__card:hover {
    border-color: var(--admin-accent);
    transform: translateY(-1px);
}
.submission-summary__card span { color: var(--admin-muted); font-weight: 600; }
.submission-summary__card strong { font-size: 24px; }
.submission-summary__card--new {
    border-color: color-mix(in srgb, var(--admin-danger) 32%, var(--admin-border));
    background: color-mix(in srgb, var(--admin-danger) 5%, var(--admin-surface));
}
.forms-list-heading {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 16px;
}
.submission-count-link {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: var(--admin-text);
    text-decoration: none;
}
.submission-count-link > span:not(.badge) { color: var(--admin-muted); font-size: 13px; }
.admin-filter-bar {
    display: grid;
    grid-template-columns: minmax(160px, .7fr) minmax(150px, .6fr) minmax(240px, 1.5fr) auto;
    align-items: end;
    gap: 14px;
    margin-bottom: 18px;
}
.admin-filter-bar .form-field { margin: 0; }
.admin-filter-bar .form-actions { margin: 0; align-self: end; }
.submission-row--unread td {
    background: color-mix(in srgb, var(--admin-accent) 5%, var(--admin-surface));
}
.submission-row--unread td:first-child {
    box-shadow: inset 3px 0 0 var(--admin-accent);
}
.submission-preview { max-width: 460px; color: var(--admin-muted); }
.submission-detail-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 340px);
    gap: 18px;
    align-items: start;
}
.submission-fields,
.submission-meta dl { display: grid; gap: 0; margin: 0; }
.submission-fields > div,
.submission-meta dl > div {
    display: grid;
    grid-template-columns: minmax(150px, 32%) minmax(0, 1fr);
    gap: 18px;
    padding: 14px 0;
    border-bottom: 1px solid var(--admin-border);
}
.submission-fields > div:last-child,
.submission-meta dl > div:last-child { border-bottom: 0; }
.submission-fields dt,
.submission-meta dt { color: var(--admin-muted); font-size: 13px; font-weight: 700; }
.submission-fields dd,
.submission-meta dd { margin: 0; overflow-wrap: anywhere; }
.submission-meta form { margin-top: 20px; }
@media (max-width: 720px) {
    .settings-group { padding: 16px; }
    .settings-jump-nav { top: calc(var(--admin-topbar-h) + 6px); margin-inline: -4px; }
    .performance-settings-card { padding: 16px; }
    .webhook-flow,
    .webhook-status-grid { grid-template-columns: 1fr; }
    .webhook-section__heading,
    .webhook-endpoint { flex-direction: column; align-items: stretch; }
    .webhook-endpoint__actions { justify-content: flex-start; }
    .webhook-edit[open] > form {
        position: fixed;
        top: calc(var(--admin-topbar-h) + 12px);
        right: 12px;
        left: 12px;
        width: auto;
        max-height: calc(100vh - var(--admin-topbar-h) - 24px);
        overflow: auto;
    }
    .submission-summary,
    .admin-filter-bar,
    .submission-detail-layout { grid-template-columns: 1fr; }
    .forms-list-heading { flex-direction: column; align-items: stretch; }
    .submission-fields > div,
    .submission-meta dl > div { grid-template-columns: 1fr; gap: 5px; }
}

/* ============================================================================
   Фильтры, вкладки и массовые действия (UI/UX Pro Max)
   ============================================================================ */
.list-filters { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 20px; }
.list-filters--panel { display: flex; flex-wrap: wrap; align-items: flex-end; width: 100%; max-width: 100%; padding: 18px 22px; background: #ffffff; border: 1px solid #e2e8f0; border-radius: 16px; box-shadow: 0 4px 16px -2px rgba(15, 23, 42, 0.04), 0 2px 4px rgba(0, 0, 0, 0.02); gap: 14px; margin-bottom: 20px; }
.list-filter { display: flex; flex: 1 1 160px; min-width: min(140px, 100%); flex-direction: column; gap: 6px; }
.list-filter label { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: #64748b; margin: 0; }
.list-filter input, .list-filter select { height: 38px; padding: 7px 12px; border-radius: 10px; border: 1px solid #cbd5e1; background: #f8fafc; font-size: 13px; transition: all 0.15s ease; }
.list-filter input:focus, .list-filter select:focus { background: #ffffff; border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15); }
.list-filter--search { flex: 2 1 280px; min-width: min(220px, 100%); }
.list-filter--compact { flex: 0 1 130px; min-width: 100px; max-width: 130px; }
.list-filters__actions { display: flex; flex: 0 0 auto; gap: 8px; align-items: center; justify-content: flex-end; flex-wrap: wrap; margin-left: auto; }
@media (max-width: 768px) {
    .list-filters__actions { width: 100%; margin-left: 0; }
}
.list-filters__actions .btn { height: 38px; border-radius: 10px; padding: 0 18px; font-weight: 600; white-space: nowrap; }

/* Сегментированные вкладки переключения (Segmented Control) */
.filter-tabs {
    display: inline-flex; align-items: center; gap: 4px; padding: 4px;
    background: #f1f5f9; border: 1px solid #e2e8f0; border-radius: 12px;
    margin-bottom: 20px;
}
.filter-tabs a, .filter-tabs .btn {
    padding: 6px 14px; border-radius: 8px; border: 0; background: transparent;
    color: #64748b; font-size: 13px; font-weight: 600; text-decoration: none;
    transition: all 0.15s ease; box-shadow: none;
}
.filter-tabs a:hover, .filter-tabs .btn:hover { color: #0f172a; background: rgba(255, 255, 255, 0.6); }
.filter-tabs a.is-active, .filter-tabs .btn.is-active {
    background: #ffffff; color: #2563eb; font-weight: 700;
    box-shadow: 0 2px 6px rgba(15, 23, 42, 0.08);
}

.list-results { margin: -4px 0 16px; color: #64748b; font-size: 13px; font-weight: 600; }
.bulk-bar {
    display: flex; gap: 12px; align-items: center; flex-wrap: wrap; margin-bottom: 16px;
    padding: 10px 16px; background: #f8fafc; border: 1px solid #e2e8f0;
    border-radius: 12px; box-shadow: 0 1px 3px rgba(0,0,0,0.03);
}
.bulk-bar select { height: 36px; padding: 4px 10px; border-radius: 8px; font-weight: 500; }
.bulk-bar__count { color: #64748b; font-size: 13px; margin-left: auto; font-weight: 600; }

/* Компактный квадрат применяется только к кнопкам-иконкам. Текстовые действия
   вроде «Сохранить» должны сохранять естественную ширину и не обрезаться. */
.data-table__actions .btn--icon {
    width: 32px; height: 32px; min-width: 32px; padding: 0;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 8px; background: #f8fafc; border: 1px solid #e2e8f0;
    color: #475569; transition: all 0.15s ease;
}
.data-table__actions .btn:not(.btn--icon) { width: auto; min-width: max-content; }
.data-table__actions .btn--icon:hover { background: #eff6ff; border-color: #bfdbfe; color: #2563eb; transform: translateY(-1px); }
.data-table__actions .btn--danger:hover,
.data-table__actions form .btn--danger:hover { background: #fef2f2; border-color: #fca5a5; color: #dc2626; }

.language-settings-table { min-width: 940px; }
.language-settings-table__actions-head { min-width: 190px; text-align: right !important; }
.data-table td.language-settings-table__actions { width: auto; min-width: 190px; }
.language-settings-table__actions .btn { gap: 6px; }

/* Языковые бейджи в таблицах (`RU`, `UZ`) */
.badge--lang {
    display: inline-flex; align-items: center; justify-content: center;
    padding: 2px 7px; border-radius: 6px; font-size: 11px; font-weight: 700;
    background: #eff6ff; color: #1d4ed8; border: 1px solid #dbeafe;
}

.data-table__primary { color: #2563eb; font-weight: 600; text-decoration: none; }
.data-table__primary:hover { text-decoration: underline; }
.admin-pagination { display: flex; align-items: center; justify-content: flex-end; gap: 6px; margin-top: 20px; flex-wrap: wrap; }
.admin-pagination__summary { margin-right: 12px; color: #64748b; font-size: 13px; font-weight: 500; }
.admin-pagination__gap { padding: 0 4px; color: #64748b; }

/* Двухколоночный макет редактирования UI/UX Pro Max с фиксированным боковым блоком */
.entry-grid {
    display: grid;
    grid-template-columns: 1fr 340px;
    gap: 28px;
    align-items: start;
}
.entry-main { display: flex; flex-direction: column; gap: 24px; min-width: 0; }
.entry-side { display: flex; flex-direction: column; gap: 20px; position: sticky; top: 68px; z-index: 10; }

/* Чек-лист качества контента */
.content-checklist {
    background: #eff6ff; border: 1px solid #bfdbfe;
    border-radius: 14px; padding: 14px 20px; margin-bottom: 24px;
    box-shadow: 0 2px 8px rgba(37, 99, 235, 0.06);
}
.content-checklist__head { display: flex; align-items: center; gap: 10px; color: #1d4ed8; font-weight: 700; font-size: 14px; }
.content-checklist__toggle { background: none; border: 0; color: #2563eb; font-size: 13px; font-weight: 600; cursor: pointer; margin-left: auto; text-decoration: underline; }
.content-checklist__list { margin: 12px 0 0; padding-left: 20px; list-style: disc; }
.content-checklist__item { margin-bottom: 6px; font-size: 13px; color: #1e3a8a; }

/* Виджет обложки в правой панели редактирования */
.sidebar-cover-widget { display: flex; flex-direction: column; gap: 12px; }
.sidebar-cover-preview {
    position: relative; width: 100%; aspect-ratio: 16 / 9;
    border-radius: 12px; overflow: hidden; background: #f8fafc;
    border: 2px dashed #cbd5e1; display: flex; align-items: center; justify-content: center;
    transition: all 0.15s ease;
}
.sidebar-cover-preview:hover { border-color: #2563eb; background: #eff6ff; }
.sidebar-cover-image { width: 100%; height: 100%; object-fit: cover; display: block; }
.sidebar-cover-placeholder { display: flex; flex-direction: column; align-items: center; gap: 6px; color: #64748b; font-size: 12px; font-weight: 600; text-align: center; padding: 12px; }

@media (max-width: 1100px) {
    .entry-grid {
        grid-template-columns: 1fr;
    }
    .entry-side { position: static; }
}

/* ============================================================================
   Автономный WYSIWYG
   ============================================================================ */
.art-editor { border: 1px solid var(--admin-border-strong); border-radius: 10px; overflow: hidden; background: #fff; }
.art-editor__toolbar { display: flex; flex-wrap: wrap; gap: 2px; padding: 6px; border-bottom: 1px solid var(--admin-border); background: var(--admin-surface-soft); }
.art-editor__btn { min-width: 30px; height: 30px; border: 1px solid transparent; border-radius: 6px; background: transparent; cursor: pointer; font-size: 14px; }
.art-editor__btn:hover { background: #eef0f4; border-color: var(--admin-border); }
.art-editor__area { min-height: 200px; padding: 12px 14px; outline: none; line-height: 1.6; }
.art-editor__area:focus { box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--admin-accent) 15%, transparent); }
.art-editor__area h2 { font-size: 22px; margin: 12px 0 6px; }
.art-editor__area h3 { font-size: 18px; margin: 10px 0 6px; }

/* ============================================================================
   Модальная медиабиблиотека
   ============================================================================ */
.media-modal { position: fixed; inset: 0; background: rgba(15,23,42,.65); backdrop-filter: blur(8px); display: flex; align-items: center; justify-content: center; z-index: 1000; padding: 20px; color: #1e293b; }
.media-modal[hidden] { display: none; }
.media-modal__dialog { background: #fff; border-radius: 16px; width: min(880px, 100%); max-height: 86vh; display: flex; flex-direction: column; overflow: hidden; box-shadow: 0 24px 60px rgba(0,0,0,.35); color: #1e293b; }
.media-modal__head { display: flex; align-items: center; justify-content: space-between; padding: 12px 18px; border-bottom: 1px solid #e2e8f0; background: #f8fafc; }
.media-modal__tabs { display: flex; gap: 6px; }
.media-modal__tab { padding: 8px 14px; border: 1px solid transparent; background: transparent; border-radius: 8px; font-size: 13px; font-weight: 600; color: #64748b; cursor: pointer; transition: all 0.2s ease; }
.media-modal__tab:hover { color: #0f172a; background: rgba(0,0,0,0.04); }
.media-modal__tab.is-active { background: #ffffff; color: #0f2756; border-color: #cbd5e1; box-shadow: 0 1px 3px rgba(0,0,0,0.05); }
.media-modal__close { border: none; background: none; font-size: 24px; line-height: 1; cursor: pointer; color: #64748b; width: 32px; height: 32px; border-radius: 50%; display: flex; align-items: center; justify-content: center; transition: background 0.2s ease; }
.media-modal__close:hover { background: rgba(0,0,0,0.06); color: #0f172a; }
.media-modal__toolbar { padding: 10px 18px; border-bottom: 1px solid #e2e8f0; background: #ffffff; }
.media-modal__search { width: 100%; padding: 8px 12px; font-size: 13px; border-radius: 8px; border: 1px solid #cbd5e1; background: #f8fafc; outline: none; color: #1e293b; }
.media-modal__search:focus { background: #ffffff; border-color: var(--admin-accent, #0f2756); box-shadow: 0 0 0 3px color-mix(in srgb, var(--admin-accent, #0f2756) 15%, transparent); }
.media-modal__upload { padding: 24px; background: #f8fafc; border-bottom: 1px solid #e2e8f0; text-align: center; }
.media-modal__dropzone { padding: 20px; border: 2px dashed var(--admin-accent, #0f2756); border-radius: 12px; background: #ffffff; color: #1e293b; }
.media-modal__upload-status { min-height: 18px; font-size: 12px; font-weight: 500; }
.media-modal__upload-status.is-error { color: #b42318; }
.media-modal__upload-status.is-success { color: #067647; }
.media-modal__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 14px; padding: 18px; overflow-y: auto; flex: 1; background: #ffffff; }
.media-modal__item { position: relative; border: 2px solid transparent; border-radius: 10px; padding: 0; cursor: pointer; overflow: hidden; background: #f1f5f9; aspect-ratio: 16 / 10; transition: all 0.2s ease; box-shadow: 0 1px 3px rgba(0,0,0,0.05); }
.media-modal__item:hover { transform: translateY(-2px); box-shadow: 0 6px 16px rgba(0,0,0,0.12); }
.media-modal__item.is-selected { border-color: #0284c7 !important; box-shadow: 0 0 0 3px rgba(2,132,199,0.3) !important; }
.media-modal__item img { width: 100%; height: 100%; object-fit: cover; display: block; }
.media-modal__item--file { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; padding: 12px; text-align: center; background: #e2e8f0; color: #1e293b; }
.media-modal__fileicon { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; background: #ffffff; color: var(--admin-accent, #0f2756); font-size: 16px; box-shadow: 0 2px 6px rgba(0,0,0,0.08); }
.media-modal__filename { font-size: 11px; font-weight: 600; color: #1f2b3d; word-break: break-word; line-height: 1.3; }
.media-modal__empty { grid-column: 1 / -1; padding: 40px 20px; text-align: center; color: #64748b; font-size: 14px; }
.media-modal__footer { display: flex; align-items: center; justify-content: space-between; padding: 12px 18px; border-top: 1px solid #e2e8f0; background: #f8fafc; }
.media-modal__selected-info { font-size: 13px; font-weight: 600; color: #0f172a; max-width: 60%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.media-modal__footer-actions { display: flex; gap: 8px; }

/* Кнопки внутри модала — всегда «светлая тема», независимо от admin-theme */
.media-modal .btn--primary {
    background: #2563eb !important;
    border-color: #2563eb !important;
    color: #ffffff !important;
}
.media-modal .btn--primary:hover {
    background: #1d4ed8 !important;
    border-color: #1d4ed8 !important;
}
.media-modal .btn {
    color: #1e293b;
    background: #ffffff;
    border-color: #cbd5e1;
}
.media-modal .btn:hover {
    background: #f1f5f9;
    border-color: #94a3b8;
    color: #0f172a;
}
@media (max-width: 640px) {
    .media-modal { padding: 8px; }
    .media-modal__dialog { max-height: 94vh; }
}

/* ============================================================================
   Репитеры, список блоков, дерево меню, колонки, вкладки, шапка, виджеты
   ============================================================================ */
.repeater-row { border: 1px solid var(--admin-border); border-radius: 10px; padding: 16px; margin-bottom: 10px; display: flex; flex-direction: column; gap: 12px; position: relative; background: #fff; }
.repeater-row__remove { align-self: flex-end; }
.repeater-actions { margin-bottom: 20px; }

.bio-widget-slots { display: grid; gap: 20px; padding-top: 8px; }
.bio-widget-slots > h3, .bio-widget-slot > h4 { margin: 0; }
.bio-widget-slot { display: grid; gap: 10px; padding: 16px; border: 1px solid var(--admin-border); border-radius: 10px; background: var(--admin-bg-soft, #f8fafc); }
.widget-slot-row__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; font-weight: 600; }
.widget-slot-row__tools { display: inline-flex; gap: 6px; }
.widget-slot-row__tools .btn { min-width: 36px; padding-inline: 8px; }

.block-list-item {
    display: flex; align-items: center; justify-content: space-between; gap: 16px;
    background: var(--admin-card-bg, #ffffff);
    border: 1px solid var(--admin-border, #cbd5e1);
    border-radius: 14px; padding: 14px 20px; margin-bottom: 12px;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04), 0 1px 2px rgba(15, 23, 42, 0.02);
    transition: border-color .15s ease, box-shadow .15s ease;
}
.block-list-item:hover { border-color: #94a3b8; box-shadow: 0 6px 16px rgba(15, 23, 42, 0.08); }
.block-list-item--off { opacity: .75; background: repeating-linear-gradient(45deg, #ffffff, #ffffff 10px, #f8fafc 10px, #f8fafc 20px); border-style: dashed; }
.block-list-item__handle { cursor: grab; color: #94a3b8; font-size: 18px; user-select: none; padding: 4px; border-radius: 6px; flex-shrink: 0; transition: color .15s ease, background .15s ease; }
.block-list-item__handle:hover { color: #334155; background: #f1f5f9; }
.block-list-item.is-dragging { opacity: .5; outline: 2px dashed var(--admin-accent); }
.block-list-item__icon { width: 40px; height: 40px; border-radius: 11px; background: linear-gradient(135deg, rgba(37, 99, 235, 0.09) 0%, rgba(37, 99, 235, 0.04) 100%); color: var(--admin-primary, #2563eb); display: flex; align-items: center; justify-content: center; flex-shrink: 0; border: 1px solid rgba(37, 99, 235, 0.16); box-shadow: 0 1px 2px rgba(37, 99, 235, 0.05); }
.block-list-item__meta { display: flex; flex-direction: column; gap: 4px; flex: 1; min-width: 0; text-align: left; align-items: flex-start; }
.block-list-item__head { display: flex; align-items: center; gap: 8px; }
.block-list-item__head strong { font-size: 14.5px; font-weight: 700; color: var(--admin-text, #0f172a); line-height: 1.3; }
.block-list-item__num { font-size: 12px; font-weight: 600; color: #94a3b8; }
.block-list-item__sub { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.block-list-item__type { font-size: 11px; font-weight: 600; color: #475569; background: #f1f5f9; padding: 2px 8px; border-radius: 6px; border: 1px solid #e2e8f0; text-transform: uppercase; letter-spacing: .03em; }
.block-list-item__badge { display: inline-flex; align-items: center; padding: 2px 8px; border-radius: 6px; font-size: 11px; font-weight: 600; line-height: 1.2; }
.block-list-item__badge--off { background: #fef3c7; color: #92400e; border: 1px solid #fde68a; }
.block-list-item__badge--vis { background: #e0e7ff; color: #3730a3; border: 1px solid #c7d2fe; }
.block-list-item__actions { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; flex-shrink: 0; }
.btn--icon-only { padding: 6px 8px !important; min-width: 32px; justify-content: center; }

.snippet-tools { display: flex; flex-direction: column; gap: 10px; }
.snippet-tools__row { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.snippet-tools__row input[type="text"], .snippet-tools__row select { width: auto; }

.admin-hint { color: var(--admin-muted); font-size: 14px; margin: 0 0 14px; }
.menu-builder {
    overflow: visible;
    border: 1px solid var(--admin-border);
    border-radius: 16px;
    background: #f8fafc;
    box-shadow: 0 10px 30px rgba(15, 23, 42, .06);
}
.menu-builder__toolbar {
    position: relative;
    z-index: 4;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    min-height: 66px;
    padding: 10px 14px 0;
    border-bottom: 1px solid var(--admin-border);
    border-radius: 16px 16px 0 0;
    background: #fff;
}
.menu-lang-tabs { display: flex; align-self: stretch; gap: 5px; overflow-x: auto; }
.menu-lang-tab {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 11px 15px;
    border: 0;
    border-bottom: 3px solid transparent;
    background: transparent;
    color: var(--admin-muted);
    font: inherit;
    font-weight: 700;
    cursor: pointer;
}
.menu-lang-tab span {
    display: inline-grid;
    min-width: 22px;
    height: 22px;
    padding: 0 6px;
    place-items: center;
    border-radius: 999px;
    background: #e2e8f0;
    color: #475569;
    font-size: 11px;
}
.menu-lang-tab:hover { color: var(--admin-accent); }
.menu-lang-tab.is-active { color: var(--admin-accent); border-bottom-color: var(--admin-accent); }
.menu-lang-tab.is-active span { background: #dbeafe; color: #1d4ed8; }
.menu-sync { position: relative; flex: none; margin-bottom: 9px; }
.menu-sync > summary { list-style: none; cursor: pointer; }
.menu-sync > summary::-webkit-details-marker { display: none; }
.menu-sync[open] > summary { border-color: var(--admin-accent); color: var(--admin-accent); }
.menu-sync form {
    position: absolute;
    top: calc(100% + 9px);
    right: 0;
    z-index: 20;
    width: min(440px, calc(100vw - 40px));
    padding: 18px;
    border: 1px solid var(--admin-border);
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 18px 45px rgba(15, 23, 42, .18);
}
.menu-sync form > p { margin: 0 0 15px; color: var(--admin-muted); font-size: 13px; line-height: 1.5; }
.menu-workspace {
    display: grid;
    grid-template-columns: minmax(245px, .78fr) minmax(420px, 1.45fr) minmax(290px, 1fr);
    align-items: start;
    min-height: 650px;
}
.menu-library,
.menu-inspector {
    position: sticky;
    top: calc(var(--admin-topbar-h) + 16px);
    max-height: calc(100vh - var(--admin-topbar-h) - 32px);
    overflow-y: auto;
    background: #fff;
}
.menu-library { border-right: 1px solid var(--admin-border); border-radius: 0 0 0 16px; }
.menu-inspector { border-left: 1px solid var(--admin-border); border-radius: 0 0 16px; }
.menu-panel__head { position: relative; padding: 20px 20px 16px; border-bottom: 1px solid var(--admin-border); }
.menu-panel__head h2,
.menu-canvas__head h2,
.menu-inspector__empty h2 { margin: 3px 0 5px; color: var(--admin-text); font-size: 18px; line-height: 1.3; }
.menu-panel__head p,
.menu-canvas__head p,
.menu-inspector__empty p { margin: 0; color: var(--admin-muted); font-size: 12.5px; line-height: 1.5; }
.menu-panel__eyebrow {
    color: var(--admin-accent);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .09em;
    text-transform: uppercase;
}
.menu-panel__body { display: block; padding: 18px 20px 22px; }
.menu-form-fields { display: flex; flex-direction: column; gap: 14px; }
.menu-form-fields [hidden] { display: none; }
.menu-form-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.menu-primary-toggle { margin: -2px 0; padding: 9px 11px; border: 1px solid var(--admin-border); border-radius: 9px; background: #f8fafc; }
.menu-submit-wide { width: 100%; justify-content: center; margin-top: 18px; }
.menu-advanced { border: 1px solid var(--admin-border); border-radius: 10px; background: #f8fafc; }
.menu-advanced > summary {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 11px 12px;
    color: #334155;
    font-size: 12.5px;
    font-weight: 700;
    cursor: pointer;
    list-style: none;
}
.menu-advanced > summary::-webkit-details-marker { display: none; }
.menu-advanced > summary svg { flex: none; }
.menu-advanced[open] > summary { border-bottom: 1px solid var(--admin-border); color: var(--admin-accent); }
.menu-advanced__body { display: flex; flex-direction: column; gap: 14px; padding: 14px 12px; }
.menu-canvas { min-width: 0; background: #f8fafc; }
.menu-canvas__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 20px 20px 14px;
}
.menu-save-status {
    flex: none;
    margin-top: 4px;
    color: #15803d;
    font-size: 11px;
    font-weight: 700;
}
.menu-save-status.is-saving { color: #a16207; }
.menu-save-status.is-error { color: var(--admin-danger); }
.menu-lang-panel { padding: 0 14px 18px; }
.menu-tree,
.menu-node__children { list-style: none; margin: 0; padding: 0; }
.menu-tree__empty {
    display: grid;
    min-height: 210px;
    padding: 30px 18px;
    place-items: center;
    align-content: center;
    gap: 7px;
    border: 1px dashed #94a3b8;
    border-radius: 12px;
    background: rgba(255, 255, 255, .75);
    color: var(--admin-muted);
    text-align: center;
}
.menu-tree__empty svg { color: #94a3b8; }
.menu-tree__empty strong { color: #334155; font-size: 14px; }
.menu-tree__empty span { font-size: 12px; }
.menu-node {
    overflow: visible;
    margin: 7px 0;
    border: 1px solid #d7dee8;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 1px 3px rgba(15, 23, 42, .045);
    transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}
.menu-node:hover { border-color: #94a3b8; box-shadow: 0 5px 14px rgba(15, 23, 42, .07); }
.menu-node.is-selected { border-color: var(--admin-accent); box-shadow: 0 0 0 2px rgba(37, 99, 235, .12); }
.menu-node.is-dragging { z-index: 5; opacity: .45; outline: 2px dashed var(--admin-accent); transform: scale(.99); }
.menu-node__row { display: flex; min-height: 58px; align-items: stretch; }
.menu-node__handle {
    display: grid;
    width: 38px;
    flex: none;
    padding: 0;
    place-items: center;
    border: 0;
    border-right: 1px solid #eef2f7;
    border-radius: 10px 0 0 10px;
    background: transparent;
    color: #94a3b8;
    cursor: grab;
}
.menu-node__handle:hover { background: #f1f5f9; color: #475569; }
.menu-node__handle:active { cursor: grabbing; }
.menu-node__select {
    display: flex;
    min-width: 0;
    flex: 1;
    align-items: center;
    gap: 10px;
    padding: 8px 11px;
    border: 0;
    border-radius: 0 10px 10px 0;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
}
.menu-node__select:hover { background: #f8fafc; }
.menu-node__type-icon {
    display: inline-grid;
    width: 34px;
    height: 34px;
    flex: none;
    place-items: center;
    border-radius: 8px;
    background: #eff6ff;
    color: #2563eb;
}
.menu-node__type-icon svg { width: 17px; height: 17px; }
.menu-node__content { display: flex; min-width: 90px; flex: 1; flex-direction: column; gap: 2px; }
.menu-node__title { overflow: hidden; color: #1e293b; font-size: 13px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.menu-node__meta { overflow: hidden; color: var(--admin-muted); font-size: 10.5px; text-overflow: ellipsis; white-space: nowrap; }
.menu-node__badges { display: flex; flex: none; align-items: center; gap: 5px; }
.menu-node__badges:empty { display: none; }
.menu-node__chevron { flex: none; color: #94a3b8; }
.menu-node__mobile-actions { display: none; align-items: center; gap: 4px; padding: 5px; }
.menu-node__mobile-actions form { margin: 0; }
.menu-node__children {
    min-height: 14px;
    margin: 0 8px 8px 30px;
    padding: 2px 0 1px 12px;
    border-left: 2px solid #bfdbfe;
    border-radius: 0 0 0 8px;
}
.menu-node__children:empty {
    min-height: 27px;
    border-left-style: dashed;
}
.menu-node__children:empty::after {
    display: block;
    padding: 5px 9px;
    color: #94a3b8;
    font-size: 10px;
    content: "Перетащите сюда для создания подменю";
}
.menu-node--child { margin: 5px 0; border-radius: 8px; box-shadow: none; }
.menu-node--child .menu-node__row { min-height: 51px; }
.menu-node--child .menu-node__type-icon { width: 29px; height: 29px; background: #f1f5f9; color: #64748b; }
.menu-node--divider > .menu-node__row { background: repeating-linear-gradient(135deg, #fff, #fff 8px, #f8fafc 8px, #f8fafc 16px); }
.menu-node--divider .menu-node__title { color: #64748b; font-style: italic; }
.menu-node--language-error { border-color: var(--admin-danger); }
.menu-preview {
    margin-top: 14px;
    border: 1px solid var(--admin-border);
    border-radius: 10px;
    background: #fff;
}
.menu-preview > summary {
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 10px 13px;
    color: #475569;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
    list-style: none;
}
.menu-preview > summary::-webkit-details-marker { display: none; }
.menu-preview__toolbar { display: flex; gap: 4px; padding: 8px 12px; border-top: 1px solid var(--admin-border); background: #f8fafc; }
.menu-preview__toolbar button { padding: 5px 9px; border: 0; border-radius: 6px; background: transparent; color: #64748b; font-size: 11px; cursor: pointer; }
.menu-preview__toolbar button.is-active { background: #fff; color: var(--admin-accent); box-shadow: 0 1px 4px rgba(15, 23, 42, .12); }
.menu-preview__viewport { display: flex; align-items: flex-start; gap: 6px; min-height: 105px; padding: 20px 14px 35px; background: #fff; }
.menu-preview__item { position: relative; padding: 7px 9px; color: #1e293b; font-size: 10px; font-weight: 700; white-space: nowrap; }
.menu-preview__submenu {
    position: absolute;
    z-index: 1;
    top: 100%;
    left: 0;
    display: none;
    min-width: 130px;
    padding: 7px;
    border: 1px solid #e2e8f0;
    border-radius: 7px;
    background: #fff;
    box-shadow: 0 8px 20px rgba(15, 23, 42, .12);
}
.menu-preview__item:first-child .menu-preview__submenu { display: grid; gap: 4px; }
.menu-preview__submenu span { padding: 4px 6px; border-radius: 4px; color: #475569; font-size: 9px; font-weight: 600; }
.menu-preview__viewport.is-mobile { display: grid; gap: 1px; width: min(240px, 100%); margin: 12px auto; padding: 8px; border: 5px solid #1e293b; border-radius: 20px; background: #fff; }
.menu-preview__viewport.is-mobile .menu-preview__item { display: grid; gap: 3px; padding: 7px 8px; border-bottom: 1px solid #eef2f7; }
.menu-preview__viewport.is-mobile .menu-preview__submenu { position: static; display: grid; gap: 2px; padding: 2px 0 0 10px; border: 0; box-shadow: none; }
.menu-inspector__empty {
    display: grid;
    min-height: 360px;
    padding: 35px 24px;
    place-items: center;
    align-content: center;
    color: #94a3b8;
    text-align: center;
}
.menu-inspector__empty svg { margin-bottom: 4px; }
.menu-inspector__panel[hidden],
.menu-inspector__empty[hidden] { display: none; }
.menu-inspector__actions { position: sticky; bottom: 0; padding-top: 4px; background: #fff; }
.menu-inspector__close {
    position: absolute;
    top: 13px;
    right: 13px;
    display: grid;
    width: 32px;
    height: 32px;
    padding: 0;
    place-items: center;
    border: 0;
    border-radius: 8px;
    background: #f1f5f9;
    color: #64748b;
    cursor: pointer;
}
.menu-inspector__close:hover { background: #e2e8f0; color: #1e293b; }
.menu-inspector__delete { margin: 0 20px 22px; padding-top: 16px; border-top: 1px solid var(--admin-border); }
.menu-inspector__delete .btn { width: 100%; justify-content: center; }

@media (max-width: 1280px) {
    .menu-workspace { grid-template-columns: minmax(240px, .8fr) minmax(430px, 1.4fr); }
    .menu-inspector {
        position: fixed;
        z-index: 50;
        top: var(--admin-topbar-h);
        right: 0;
        bottom: 0;
        width: min(390px, 92vw);
        max-height: none;
        border-left: 1px solid var(--admin-border);
        border-radius: 0;
        box-shadow: -18px 0 45px rgba(15, 23, 42, .18);
        transform: translateX(102%);
        transition: transform .2s ease;
    }
    .menu-inspector.has-selection { transform: translateX(0); }
}
@media (max-width: 820px) {
    .menu-builder__toolbar { align-items: flex-end; }
    .menu-sync > summary { padding-left: 9px; padding-right: 9px; font-size: 0; }
    .menu-workspace { grid-template-columns: 1fr; }
    .menu-library { position: static; order: 2; max-height: none; border-top: 1px solid var(--admin-border); border-right: 0; border-bottom: 0; border-radius: 0; }
    .menu-canvas { order: 1; }
    .menu-canvas__head { flex-direction: column; }
    .menu-node__badges { display: none; }
    .menu-node__mobile-actions { display: flex; }
    .menu-node__select { padding-left: 8px; padding-right: 7px; }
}
@media (max-width: 520px) {
    .menu-builder { border-radius: 10px; }
    .menu-builder__toolbar { padding-left: 7px; padding-right: 7px; border-radius: 10px 10px 0 0; }
    .menu-lang-tab { padding: 9px 8px; font-size: 12px; }
    .menu-lang-tab span { display: none; }
    .menu-form-row { grid-template-columns: 1fr; }
    .menu-lang-panel { padding-left: 8px; padding-right: 8px; }
    .menu-node__handle { width: 32px; }
    .menu-node__type-icon { display: none; }
    .menu-node__children { margin-left: 18px; padding-left: 8px; }
    .menu-node__meta { max-width: 170px; }
}

.columns-editor__grid { display: grid; gap: 12px; }
.columns-editor__grid--2 { grid-template-columns: repeat(2, 1fr); }
.columns-editor__grid--3 { grid-template-columns: repeat(3, 1fr); }
.columns-editor__grid--4 { grid-template-columns: repeat(4, 1fr); }
.columns-editor__col { border: 1px dashed var(--admin-border-strong); border-radius: 10px; padding: 10px; }
.columns-editor__col-title { font-size: 12px; font-weight: 700; color: var(--admin-muted); margin-bottom: 8px; text-transform: uppercase; }
.columns-editor__child { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 6px 8px; margin-bottom: 6px; background: var(--admin-bg); border-radius: 6px; font-size: 14px; }
.columns-editor__child-actions { display: flex; gap: 4px; }
.columns-editor__child-actions form { margin: 0; }
.columns-editor__add { display: flex; gap: 6px; margin-top: 6px; }
.columns-editor__add select { flex: 1; min-width: 0; }

/* Языковые вкладки редактора контента */
.lang-tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--admin-border); margin-bottom: 20px; flex-wrap: wrap; }
.lang-tab-btn { padding: 9px 16px; border: none; background: transparent; border-bottom: 2px solid transparent; margin-bottom: -1px; cursor: pointer; font-size: 14px; font-weight: 600; color: var(--admin-muted); }
.lang-tab-btn.is-active { color: var(--admin-accent); border-bottom-color: var(--admin-accent); }
.lang-tab-btn__badge { font-size: 11px; color: #aaa; font-weight: 400; }
.lang-tab-panel { display: none; }
.lang-tab-panel.is-active { display: block; }

/* Header mini-app конструктор */
.header-builder__group { border: 1px solid var(--admin-border); border-radius: 12px; padding: 18px; margin-bottom: 16px; background: var(--admin-surface); }
.header-builder__group h3 { margin: 0 0 12px; font-size: 15px; }
.header-preview { background: var(--admin-surface); border: 1px dashed var(--admin-border-strong); border-radius: 12px; padding: 14px 18px; margin-bottom: 20px; display: flex; align-items: center; gap: 16px; }

/* Виджеты */
.sidebar-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.sidebar-column h2 { font-size: 16px; }

/* ============================================================================
   Адаптив
   ============================================================================ */
@media (min-width: 961px) {
    .admin-nav-collapsed { --admin-sidebar-w: 56px; }
    .admin-nav-collapsed .admin-sidebar__label,
    .admin-nav-collapsed .admin-nav-item span,
    .admin-nav-collapsed .admin-sidebar__collapse span { display: none; }
    /* В иконочном режиме заголовки-переключатели скрыты, а пункты видны всегда. */
    .admin-nav-collapsed .admin-nav-group.is-collapsed .admin-nav-group__items { display: block; }
    .admin-nav-collapsed .admin-nav-item,
    .admin-nav-collapsed .admin-sidebar__collapse { justify-content: center; padding-left: 8px; padding-right: 8px; }
    .admin-nav-collapsed .admin-nav-item { border-left-width: 3px; }
    .admin-nav-collapsed .admin-sidebar__collapse svg { transform: rotate(180deg); }
}
@media (max-width: 960px) {
    .admin-topbar__toggle { display: inline-flex; }
    .admin-topbar__name, .admin-topbar__crumb { display: none; }
    .admin-sidebar {
        position: fixed; top: var(--admin-topbar-h); left: 0; bottom: 0; z-index: 90;
        width: min(var(--admin-sidebar-w), 86vw); transform: translateX(-100%);
        transition: transform .2s ease; box-shadow: 0 10px 40px rgba(0,0,0,.28);
    }
    body.sidebar-open .admin-sidebar { transform: translateX(0); }
    .admin-sidebar__collapse { display: none; }
    .admin-sidebar-backdrop {
        position: fixed; inset: var(--admin-topbar-h) 0 0; z-index: 80; display: block;
        padding: 0; border: 0; background: rgba(0,0,0,.46); opacity: 0;
        visibility: hidden; pointer-events: none; transition: opacity .2s ease, visibility .2s ease;
    }
    body.sidebar-open { overflow: hidden; }
    body.sidebar-open .admin-sidebar-backdrop { opacity: 1; visibility: visible; pointer-events: auto; }
    .admin-main { padding: 20px 16px; }
    .admin-search { min-width: 0; flex: 1; }
    .admin-search__kbd { display: none; }
    /* Компактные кнопки-инструменты: только иконки */
    .admin-tbtn__label { display: none; }
    .admin-tbtn { padding: 8px; }
    .admin-tools { gap: 6px; }
    .form-actions--sticky { left: 0; right: 0; padding: 12px 16px; border-left: 0; border-right: 0; }
}
@media (max-width: 560px) {
    /* На самых узких прячем поиск, оставляя быстрые действия и открыть сайт */
    .admin-search { display: none; }
    .admin-topbar { gap: 8px; padding: 0 8px; }
    .admin-tools__quick { display: none; }
    .admin-user__avatar { width: 28px; height: 28px; }
}
@media (max-width: 720px) {
    .sidebar-columns { grid-template-columns: 1fr; }
    .columns-editor__grid--2, .columns-editor__grid--3, .columns-editor__grid--4 { grid-template-columns: 1fr; }
    .form-card { padding: 20px; }
    .admin-welcome { align-items: flex-start; flex-direction: column; }
    .admin-welcome__actions { width: 100%; }
}
@media (max-width: 640px) {
    .data-table { display: block; overflow-x: auto; white-space: nowrap; }
    .admin-main__header { align-items: flex-start; }
    .admin-main__actions { width: 100%; }
    .admin-main__actions .btn { flex: 1; justify-content: center; }
    .list-filters--panel { align-items: stretch; flex-direction: column; }
    .list-filter--search, .list-filter--compact { min-width: 0; max-width: none; }
    .list-filters__actions { width: 100%; margin-left: 0; }
    .list-filters__actions .btn { flex: 1; justify-content: center; }
    .bulk-bar select { width: 100%; }
    .bulk-bar .btn { flex: 1; justify-content: center; }
    .bulk-bar__count { width: 100%; margin-left: 0; text-align: center; }
    .admin-pagination { justify-content: center; }
    .admin-pagination__summary { width: 100%; margin: 0 0 4px; text-align: center; }
    .form-actions--sticky .btn { flex: 1 1 auto; justify-content: center; }
}

@media (prefers-reduced-motion: reduce) {
    .admin-sidebar, .admin-sidebar-backdrop, .admin-sidebar__collapse svg, .form-actions--sticky, .btn, .stat-card, .form-section > summary::before { transition: none; }
    .stat-card:hover { transform: none; }
}

/* ============================================================================
   Поле изображения с превью (медиабиблиотека)
   ============================================================================ */
.image-field {
    background: #ffffff;
    border: 1px solid var(--admin-border, #cbd5e1);
    border-radius: 4px;
    padding: 14px 16px;
    margin-bottom: 12px;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.03);
    width: 100%;
}
.image-field label {
    font-size: 13.5px;
    font-weight: 700;
    color: #0f172a;
    margin-bottom: 10px;
    display: block;
}
.image-field__row {
    display: flex;
    gap: 16px;
    align-items: center;
}
.image-field__preview {
    flex-shrink: 0;
    width: 180px;
    height: 110px;
    border-radius: 4px;
    border: 1px solid var(--admin-border, #cbd5e1);
    background: var(--admin-surface-soft, #f8fafc);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.04);
}
.image-field__preview img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.image-field__placeholder {
    color: #94a3b8;
}
.image-field__main {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.image-field__controls {
    display: flex;
    gap: 8px;
    align-items: center;
}
.image-field__controls input[type="text"] {
    flex: 1;
    min-width: 0;
    height: 38px;
    font-size: 13.5px;
    border-radius: 6px;
    border: 1px solid var(--admin-border, #cbd5e1);
    padding: 0 12px;
    background: #ffffff;
}
.image-field__controls .btn {
    height: 38px;
    font-size: 13px;
    font-weight: 600;
    border-radius: 6px;
    padding: 0 14px;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.image-field__upload {
    margin-top: 6px;
    padding-top: 8px;
    border-top: 1px dashed #e2e8f0;
    display: flex;
    align-items: center;
    gap: 10px;
}
.image-field__upload input[type="file"] {
    font-size: 12.5px;
    color: #475569;
}
.image-field__upload .form-hint {
    font-size: 12px;
    color: #64748b;
    margin: 0;
}
@media (max-width: 560px) {
    .image-field__row { flex-direction: column; align-items: stretch; }
    .image-field__preview { width: 100%; height: 140px; }
}

.sidebar-cover-preview {
    width: 100% !important;
    min-height: 175px !important;
    aspect-ratio: 16 / 9;
    border-radius: 10px !important;
    overflow: hidden !important;
    background: var(--admin-surface-soft, #f8fafc) !important;
    border: 1.5px solid var(--admin-border, #cbd5e1) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: relative;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.03);
}

.sidebar-cover-preview img {
    width: 100% !important;
    height: 100% !important;
    max-height: 220px !important;
    object-fit: cover !important;
}

/* ============================================================================
   Двухколоночная раскладка редактора (в духе Statamic)
   ============================================================================ */
/* Действующая декларация: выше в файле есть ещё одна, она перекрыта этой. */
/* Ширина боковой колонки тянется вместе с окном: при 340px три кнопки обложки
   не помещались в строку и «Удалить» вылезала за карточку на 138px, а на
   широком мониторе колонка зря оставалась узкой. Нижняя граница — прежние
   340px, так что на 1280px ничего не меняется. */
.entry-grid { display: grid; grid-template-columns: minmax(0, 1fr) clamp(340px, 24vw, 460px); gap: 20px; align-items: start; }
.entry-main { display: flex; flex-direction: column; gap: 20px; min-width: 0; }
.entry-main .form-card { max-width: none; }
.entry-side { display: flex; flex-direction: column; gap: 20px; position: sticky; top: calc(var(--admin-topbar-h) + 20px); min-width: 0; }
.entry-side .form-card { max-width: none; }
.news-detail-sidebar h2 { margin: 0; }
.news-detail-sidebar__pick { align-self: flex-start; }
.news-detail-sidebar__docs > h3 { margin: 0 0 12px; font-size: 14px; }
.news-detail-sidebar .repeater-row { padding: 12px; }
.news-detail-sidebar .repeater-actions { margin: 4px 0 0; }
.page-settings-sidebar h2 { margin: 0; }
.page-settings-sidebar__options { display: flex; flex-direction: column; gap: 12px; padding-top: 4px; border-top: 1px solid var(--admin-border); }
.page-settings-sidebar__options .form-field--checkbox { align-items: flex-start; }
.page-settings-sidebar__options .form-field--checkbox input { margin-top: 3px; }
.page-settings-sidebar__options .form-hint { margin: -2px 0 0 28px; }
/* Поля внутри языковых панелей получают вертикальный ритм. */
.lang-tab-panel.is-active { display: flex; flex-direction: column; gap: 16px; }
@media (max-width: 900px) {
    .entry-grid { grid-template-columns: 1fr; }
    .entry-side { position: static; }
}

/* Отключённый (скрытый на сайте) блок в конструкторе страниц */
.block-list-item--off { opacity: .6; background: repeating-linear-gradient(45deg, transparent, transparent 8px, rgba(0,0,0,.03) 8px, rgba(0,0,0,.03) 16px); }
.block-list-item__badge { display: inline-block; margin-left: 8px; padding: 1px 8px; border-radius: 999px; background: #eef0f3; color: #66707c; font-size: 11px; font-weight: 600; vertical-align: middle; }

/* ===== Тема-билдер: управление дизайном ===== */
/* Липкая панель навигации по разделам дизайна: якоря + «развернуть всё». */
.design-nav {
    position: sticky; top: var(--admin-topbar-h); z-index: 60;
    display: flex; align-items: center; gap: 12px;
    margin: 0 0 20px; padding: 10px 2px;
    background: color-mix(in srgb, var(--admin-bg) 92%, transparent);
    backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
}
.design-nav > .btn { flex-shrink: 0; }
.design-anchors {
    display: flex; gap: 6px; overflow-x: auto; scrollbar-width: thin;
    flex: 1 1 auto; min-width: 0; margin: 0; padding: 2px;
}
.design-anchors a {
    flex-shrink: 0; padding: 6px 12px; border: 1px solid var(--admin-border);
    border-radius: 999px; background: var(--admin-surface);
    color: var(--admin-text); font-size: 13px; font-weight: 600; text-decoration: none;
    transition: border-color .15s ease, color .15s ease, background-color .15s ease;
}
.design-anchors a:hover { border-color: var(--admin-accent); color: var(--admin-accent-hover); text-decoration: none; }

.design-section { margin-bottom: 34px; scroll-margin-top: calc(var(--admin-topbar-h) + 56px); }
.design-section__title { font-size: 15px; text-transform: uppercase; letter-spacing: .05em; color: #66707c; margin: 0 0 16px; font-weight: 700; }

/* Сворачиваемые секции точной настройки: каждая — аккуратная карточка-строка. */
.design-section--collapsible {
    margin-bottom: 12px; padding: 0 20px;
    border: 1px solid var(--admin-border); border-radius: var(--admin-radius);
    background: var(--admin-surface); box-shadow: var(--admin-shadow);
}
.design-section--collapsible > summary {
    display: flex; align-items: center; gap: 10px;
    margin: 0; padding: 16px 0; cursor: pointer; list-style: none;
    user-select: none;
}
.design-section--collapsible > summary::-webkit-details-marker { display: none; }
.design-section--collapsible > summary::before {
    content: ''; flex-shrink: 0; width: 8px; height: 8px;
    border-right: 2px solid var(--admin-muted); border-bottom: 2px solid var(--admin-muted);
    transform: rotate(-45deg); transition: transform .15s ease; margin-right: 2px;
}
.design-section--collapsible[open] > summary::before { transform: rotate(45deg); }
.design-section--collapsible > summary:hover { color: var(--admin-accent); }
.design-section--collapsible[open] > summary { border-bottom: 1px solid var(--admin-border); margin-bottom: 4px; }
.design-section--collapsible > .design-opt:last-of-type,
.design-section--collapsible > .design-manual:last-child { margin-bottom: 18px; }

.design-presets { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 16px; }
.design-preset { border: 2px solid var(--admin-border, #e6e8ec); border-radius: 12px; padding: 18px; background: var(--admin-surface, #fff); margin: 0; transition: border-color .15s, box-shadow .15s; }
.design-preset:hover { box-shadow: 0 6px 20px rgba(20,33,51,.08); }
.design-preset.is-active { border-color: var(--admin-accent, #5b52e5); background: var(--admin-accent-soft, #eef0fe); }
.design-preset__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; }
.design-preset__head strong { font-size: 16px; }
.design-preset__badge { font-size: 11px; font-weight: 700; color: var(--admin-accent, #5b52e5); background: var(--admin-surface, #fff); border: 1px solid var(--admin-accent, #5b52e5); border-radius: 999px; padding: 1px 8px; }
.design-preset__desc { color: #66707c; font-size: 13px; margin: 0 0 14px; line-height: 1.5; }

.design-opt { display: grid; grid-template-columns: 220px 1fr; gap: 20px; align-items: start; padding: 18px 0; border-bottom: 1px solid var(--admin-border, #e6e8ec); }
.design-opt:last-child { border-bottom: 0; }
.design-opt__label span { display: block; font-weight: 600; }
.design-opt__label small { display: block; color: #8a929c; font-size: 12px; margin-top: 4px; line-height: 1.45; }
.design-opt__choices { display: flex; flex-wrap: wrap; gap: 12px; }

.design-manual { margin-top: 18px; padding: 18px; border: 1px solid var(--admin-border); border-radius: 10px; background: var(--admin-surface-soft, #f8f9fa); }
.design-manual__head { display: flex; flex-direction: column; gap: 3px; margin-bottom: 16px; }
.design-manual__head span { color: var(--admin-muted); font-size: 13px; }
.design-manual__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.design-manual__grid .form-field { margin: 0; }
.design-manual__grid input[type="color"] { width: 72px; min-height: 42px; padding: 4px; cursor: pointer; }
.design-manual__wide { grid-column: 1 / -1; }
.design-manual__wide > select { width: min(100%, 520px); }
.design-manual__custom-font {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px;
    padding: 16px; border: 1px dashed var(--admin-border-strong); background: var(--admin-surface, #fff);
}
.design-manual__custom-font[hidden] { display: none; }
.settings-design-link { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 14px 16px; border: 1px solid var(--admin-border); border-left: 4px solid var(--admin-accent); border-radius: var(--admin-radius); background: var(--admin-accent-soft); }
.settings-design-link span { color: var(--admin-muted); }
.settings-design-link .btn { margin-left: auto; }

.design-card { position: relative; display: flex; flex-direction: column; align-items: center; gap: 8px; flex: 1 1 108px; min-width: 96px; max-width: 168px; padding: 14px 12px; border: 2px solid var(--admin-border, #e6e8ec); border-radius: 12px; cursor: pointer; background: var(--admin-surface, #fbfbfd); transition: border-color .15s, box-shadow .15s, background .15s; }
.design-card:hover { border-color: #c7cbe8; }
.design-card input { position: absolute; opacity: 0; pointer-events: none; }
.design-card:has(input:checked) { border-color: var(--admin-accent, #5b52e5); background: var(--admin-accent-soft, #eef0fe); box-shadow: 0 0 0 3px color-mix(in srgb, var(--admin-accent) 12%, transparent); }
.design-card:has(input:focus-visible) { outline: 3px solid color-mix(in srgb, var(--admin-accent, #5b52e5) 28%, transparent); outline-offset: 2px; }
.design-card__label { font-size: 13px; font-weight: 600; color: var(--admin-text, #1c2531); }
.design-card__preview { width: 100%; height: 52px; border-radius: 8px; background: #fff; border: 1px solid #e6e8ec; position: relative; overflow: hidden; }
.design-card__preview::before { content: ''; position: absolute; inset: 10px; background: linear-gradient(#eceff3 0 0) no-repeat, linear-gradient(#eceff3 0 0) no-repeat, linear-gradient(#eceff3 0 0) no-repeat; background-size: 60% 8px, 90% 6px, 40% 6px; background-position: 0 0, 0 16px, 0 28px; }

/* Мини-превью для наглядности (приближённо к макетам) */
.design-card__preview--radius-none { border-radius: 0; }
.design-card__preview--radius-large { border-radius: 16px; }
.design-card__preview--catalog_layout-cards_lg::after,
.design-card__preview--catalog_layout-cards_sm::after { content:''; position:absolute; inset:8px; background: repeating-linear-gradient(90deg,#dfe3ea 0 30%,transparent 30% 34%); }
.design-card__preview--catalog_layout-list::after { content:''; position:absolute; inset:8px; background: repeating-linear-gradient(#dfe3ea 0 30%,transparent 30% 50%); }
.design-card__preview--button-pill::after { content:''; position:absolute; left:16px; top:18px; width:52px; height:16px; border-radius:999px; background: var(--admin-accent,#5b52e5); }
.design-card__preview--button-rounded::after { content:''; position:absolute; left:16px; top:18px; width:52px; height:16px; border-radius:6px; background: var(--admin-accent,#5b52e5); }
.design-card__preview--button-square::after { content:''; position:absolute; left:16px; top:18px; width:52px; height:16px; border-radius:0; background: var(--admin-accent,#5b52e5); }

.design-actions { position: sticky; bottom: 0; background: linear-gradient(transparent, var(--admin-bg, #f6f7f9) 40%); padding: 16px 0; z-index: 5; }
.design-fine { padding-bottom: 8px; }

/* --- Мобильная версия панели дизайна --- */
@media (max-width: 720px) {
    .design-opt { grid-template-columns: 1fr; gap: 10px; }
    .design-presets { grid-template-columns: 1fr; }
    .design-section__title { font-size: 13px; }
    /* Кнопка сохранения — сплошная нижняя панель во всю ширину. */
    .design-actions {
        position: sticky; bottom: 0; margin: 0 -16px; padding: 12px 16px;
        background: var(--admin-sidebar-bg, #fff); border-top: 1px solid var(--admin-border, #e6e8ec);
        box-shadow: 0 -4px 16px rgba(20,33,51,.06);
    }
    .design-actions .btn { width: 100%; justify-content: center; }
    .design-manual__grid { grid-template-columns: 1fr; }
    .design-manual__wide { grid-column: auto; }
    .design-manual__custom-font { grid-template-columns: 1fr; }
    .settings-design-link { align-items: stretch; flex-direction: column; }
    .settings-design-link .btn { margin-left: 0; justify-content: center; }
}
@media (max-width: 420px) {
    .design-card { flex-basis: calc(50% - 6px); max-width: none; padding: 10px 8px; }
    .design-card__preview { height: 44px; }
}

/* ArtEditor: расширенный тулбар, HTML-режим, полноэкранный режим */
.art-editor__sep { width: 1px; align-self: stretch; margin: 2px 4px; background: var(--admin-border, #e6e8ec); }
.art-editor__btn:disabled { opacity: .35; cursor: default; }
.art-editor__btn.is-active { background: var(--admin-accent-soft, #eef0fe); border-color: var(--admin-accent, #5b52e5); color: var(--admin-accent, #5b52e5); }
.art-editor__source { display: block; width: 100%; min-height: 240px; border: 0; padding: 12px 14px; font-family: ui-monospace, monospace; font-size: 13px; line-height: 1.5; resize: vertical; outline: none; }
.art-editor--full { position: fixed; inset: 12px; z-index: 300; display: flex; flex-direction: column; box-shadow: 0 24px 80px rgba(0,0,0,.35); }
.art-editor--full .art-editor__area, .art-editor--full .art-editor__source { flex: 1; overflow: auto; }
.art-editor__area blockquote { margin: 10px 0; padding: 8px 14px; border-left: 3px solid var(--admin-accent, #5b52e5); background: #f8f9fb; color: #444; }
.art-editor__area pre { background: #16161d; color: #e8e8ef; padding: 12px 14px; border-radius: 8px; overflow-x: auto; font-size: 13px; }
.art-editor__area table { border-collapse: collapse; width: 100%; margin: 10px 0; }
.art-editor__area th, .art-editor__area td { border: 1px solid var(--admin-border-strong, #d5d9e0); padding: 6px 10px; min-width: 40px; }
.art-editor__area th { background: #f2f4f8; }
.art-editor__area img { max-width: 100%; height: auto; }

/* Превью палитр: две цветовые плашки (основной + акцент) */
.design-card__preview--palette-gov_blue::before,
.design-card__preview--palette-classic_red::before,
.design-card__preview--palette-emerald::before,
.design-card__preview--palette-graphite::before,
.design-card__preview--palette-violet::before,
.design-card__preview--palette-custom::before { background: none; }
.design-card__preview--palette-gov_blue { background: linear-gradient(90deg, #1f4b8e 60%, #0f766e 60%); }
.design-card__preview--palette-classic_red { background: linear-gradient(90deg, #1a1a1a 60%, #e63946 60%); }
.design-card__preview--palette-emerald { background: linear-gradient(90deg, #14532d 60%, #059669 60%); }
.design-card__preview--palette-graphite { background: linear-gradient(90deg, #111827 60%, #374151 60%); }
.design-card__preview--palette-violet { background: linear-gradient(90deg, #312e81 60%, #6d28d9 60%); }
.design-card__preview--palette-custom { background: repeating-conic-gradient(#e8eaf0 0 25%, #f7f8fa 0 50%) 0 0 / 16px 16px; }

/* Превью шаблонов */

/* Превью шрифтов: образец «Аа» нужным стеком */
.design-card__preview--font_style-noto::before,
.design-card__preview--font_style-system::before,
.design-card__preview--font_style-serif::before,
.design-card__preview--font_style-custom::before { background: none; }
.design-card__preview--font_style-noto::after,
.design-card__preview--font_style-system::after,
.design-card__preview--font_style-serif::after,
.design-card__preview--font_style-custom::after {
    content: 'Аа'; position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
    font-size: 24px; font-weight: 700; color: #1c2531;
}
.design-card__preview--font_style-noto::after { font-family: 'Noto Sans', 'Noto Sans Fallback', system-ui, sans-serif; }
.design-card__preview--font_style-system::after { font-family: system-ui, Arial, sans-serif; }
.design-card__preview--font_style-serif::after { font-family: Georgia, 'Times New Roman', serif; }
.design-card__preview--font_style-custom::after { content: 'Аа?'; font-family: inherit; color: #66707c; }

/* Мои конфигурации: форма сохранения */
.design-save-preset { display: flex; gap: 10px; max-width: 560px; }
.design-save-preset input { flex: 1; }
@media (max-width: 560px) { .design-save-preset { flex-direction: column; } .design-save-preset .btn { width: 100%; } }
.design-preset--user { background: var(--admin-surface, #fff); }

/* Живое превью в панели «Дизайн» */
.design-page-preview {
    margin: 0 0 24px;
    border: 1px solid var(--admin-border);
    border-radius: 12px;
    background: var(--admin-surface);
    overflow: clip;
}
.design-page-preview > summary {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    cursor: pointer;
    list-style: none;
}
.design-page-preview > summary::-webkit-details-marker { display: none; }
.design-page-preview > summary > span { display: flex; flex-direction: column; min-width: 0; }
.design-page-preview > summary small { margin-top: 2px; color: var(--admin-muted); font-size: 12px; font-weight: 400; }
.design-page-preview > summary::after {
    content: '';
    width: 8px;
    height: 8px;
    margin-left: auto;
    border-right: 2px solid var(--admin-muted);
    border-bottom: 2px solid var(--admin-muted);
    transform: rotate(45deg);
    transition: transform .18s ease;
}
.design-page-preview[open] > summary::after { transform: rotate(225deg); }
.design-page-preview[open] > summary { border-bottom: 1px solid var(--admin-border); }
.design-preview { border: 1px solid var(--admin-border, #e6e8ec); border-radius: 12px; overflow: hidden; background: #fff; }
.design-page-preview .design-preview { border: 0; border-radius: 0; }
.design-preview__bar { display: flex; align-items: center; gap: 8px; padding: 10px 12px; border-bottom: 1px solid var(--admin-border, #e6e8ec); background: var(--admin-surface-soft); flex-wrap: wrap; }
.design-preview__sizes { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.design-preview__refresh { margin-left: auto; }
.design-preview__bar .btn.is-active { background: var(--admin-accent, #5b52e5); color: #fff; border-color: var(--admin-accent, #5b52e5); }
.design-preview__stage { background: #eceef2; padding: 14px; display: flex; justify-content: center; }
.design-preview__frame { width: 100%; max-width: 100%; height: 540px; border: 0; border-radius: 8px; background: #fff; box-shadow: 0 6px 24px rgba(16,24,40,.12); transition: width .25s ease; }

.design-destination-links {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 18px;
}
.design-destination-link {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    border: 1px solid var(--admin-border);
    border-radius: 12px;
    background: var(--admin-surface);
    color: var(--admin-text);
    text-decoration: none;
    transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}
.design-destination-link:hover {
    border-color: var(--admin-accent);
    box-shadow: 0 8px 22px color-mix(in srgb, var(--admin-accent) 10%, transparent);
    transform: translateY(-1px);
    text-decoration: none;
}
.design-destination-link > span { display: flex; min-width: 0; flex-direction: column; }
.design-destination-link small { margin-top: 3px; color: var(--admin-muted); font-size: 12px; line-height: 1.35; }
@media (max-width: 720px) {
    .design-page-preview > summary { align-items: flex-start; }
    .design-preview__refresh { width: 100%; margin-left: 0; justify-content: center; }
    .design-preview__stage { padding: 8px; overflow-x: auto; justify-content: flex-start; }
    .design-preview__frame { height: 480px; }
    .design-destination-links { grid-template-columns: 1fr; }
}

.hb-divider-field { max-width: 360px; margin-top: 20px; }
.hb-behavior { display: flex; flex-direction: column; gap: 16px; margin-top: 22px; padding-top: 20px; border-top: 1px solid var(--admin-border); }
.hb-behavior__options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.hb-behavior-card { display: block; min-width: 0; padding: 15px 16px; border: 1px solid var(--admin-border); border-radius: 10px; background: #f8f9fa; cursor: pointer; }
.hb-behavior-card:hover { border-color: color-mix(in srgb, var(--admin-accent) 45%, var(--admin-border)); background: #fff; }
.hb-behavior-card .hb-switch { width: 100%; font-weight: 700; }
.hb-behavior-card__title { min-width: 0; }
.hb-behavior-card__hint { display: block; margin: 9px 0 0 42px; color: var(--admin-muted); font-size: 12px; font-weight: 400; line-height: 1.5; }
.hb-behavior__note { margin: 0; padding: 12px 14px; border-left: 3px solid var(--admin-accent); background: var(--admin-accent-soft); color: var(--admin-muted); font-size: 13px; line-height: 1.55; }
.hb-behavior__media { padding: 16px; border: 1px solid var(--admin-border); border-radius: 10px; background: #fff; }
.hb-behavior__media .image-field__controls { flex-wrap: wrap; }
.hb-behavior__media .image-field__controls input[type="text"] { flex: 1 1 280px; }

/* Меню в админке: превью иконки пункта и вид разделителя. */
.menu-node__icon { display: inline-flex; align-items: center; }
.menu-node__icon svg { width: 16px; height: 16px; }
.menu-node--divider .menu-node__title { color: var(--admin-muted, #889); font-style: italic; }

/* Конструктор шапки: палитра, зоны и чипы микро-виджетов. */
.hdr-builder { display: grid; grid-template-columns: 220px 1fr; gap: 16px; margin-top: 8px; }
@media (max-width: 720px) { .hdr-builder { grid-template-columns: 1fr; } }
/* В новом конструкторе (.hb-section) шапка секции и зоны идут в столбик на всю ширину —
   легаси-грид .hdr-builder не должен зажимать зоны в узкую правую колонку. */
.hb-section.hdr-builder { display: block; gap: 0; margin-top: 0; }
.hdr-builder__palette-label,
.hdr-builder__zone-label { font-size: 12px; font-weight: 600; color: var(--admin-muted, #667); text-transform: uppercase; letter-spacing: .04em; margin-bottom: 6px; }
.hdr-builder__dropzone {
    display: flex; flex-wrap: wrap; gap: 8px; align-content: flex-start;
    min-height: 56px; padding: 10px; border: 2px dashed var(--admin-border); border-radius: 10px;
    background: var(--admin-surface); transition: border-color .15s ease, background .15s ease;
}
.hdr-builder__dropzone.is-over { border-color: var(--admin-accent, #5b52e5); background: color-mix(in srgb, var(--admin-accent, #5b52e5) 8%, var(--admin-surface)); }
.hdr-builder__dropzone--palette { min-height: 120px; }
.hdr-builder__zones { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
@media (max-width: 720px) { .hdr-builder__zones { grid-template-columns: 1fr; } }
.hdr-chip {
    display: inline-flex; align-items: center; gap: 6px; min-height: 32px; padding: 4px 8px 4px 6px;
    background: #fff; border: 1px solid var(--admin-border); border-radius: 8px;
    font-size: 13px; font-weight: 500; cursor: grab; user-select: none;
    max-width: 100%; min-width: 0;
    box-shadow: 0 1px 2px rgba(16,24,40,.06);
}
.hdr-chip:active { cursor: grabbing; }
.hdr-chip.is-dragging { opacity: .4; }
.hdr-chip__grip { color: var(--admin-muted, #99a); font-size: 12px; line-height: 1; }
.hdr-chip__remove { border: 0; background: transparent; color: var(--admin-muted, #99a); font-size: 16px; line-height: 1; cursor: pointer; padding: 0 2px; }
.hdr-chip__remove:hover { color: #d33; }

/* Вкладки конструктора шапки (Десктоп / Мобильный). */
.hdr-tabs { display: inline-flex; gap: 4px; padding: 4px; background: var(--admin-surface); border: 1px solid var(--admin-border); border-radius: 10px; margin-bottom: 14px; }
.hdr-tabs__tab { border: 0; background: transparent; padding: 7px 16px; border-radius: 7px; font-size: 13px; font-weight: 600; cursor: pointer; color: var(--admin-muted, #667); }
.hdr-tabs__tab.is-active { background: #fff; color: var(--admin-accent, #5b52e5); box-shadow: 0 1px 3px rgba(16,24,40,.1); }
.hdr-tabs__panel { display: none; }
.hdr-tabs__panel.is-active { display: block; }

/* ==========================================================================
   Конструктор шапки Pro Max: секции Top/Middle/Bottom, палитра, чипы-элементы.
   ========================================================================== */
.hb-palette { background: linear-gradient(180deg, #f7f9fc, #eef2f8); border: 1px solid var(--admin-border, #e1e3e8); border-radius: 12px; padding: 14px 16px; margin-bottom: 18px; }
.hb-palette__label { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; color: #6b7789; margin-bottom: 10px; }
.hb-palette__items { display: flex; flex-wrap: wrap; gap: 8px; min-height: 46px; }
.hb-palette .hb-el__remove { display: none; }
.hb-palette .hb-el { cursor: grab; }

.hb-section { border: 1px solid var(--admin-border, #e1e3e8); border-radius: 12px; margin-bottom: 14px; overflow: hidden; background: #fff; }
.hb-section__head { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 12px 16px; background: #f7f9fc; border-bottom: 1px solid var(--admin-border, #e1e3e8); }
.hb-section__badge { padding: 3px 10px; border-radius: 999px; background: #173a63; color: #fff; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }
.hb-section__badge--middle { background: #17999b; }
.hb-section__badge--bottom { background: #4a5a74; }
.hb-section__title { font-weight: 700; color: #1f2b3d; }
.hb-section__controls { margin-left: auto; display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.hb-section__controls > label,
.hb-color-control { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; color: #4b5563; }
.hb-section__controls input[type="color"] {
    width: 34px;
    height: 30px;
    padding: 2px;
    border: 1px solid var(--admin-border, #e1e3e8);
    border-radius: 7px;
    background: #fff;
}
.hb-note { color: #6b7789; font-size: 12.5px; }
.hb-select { padding: 6px 10px; border: 1px solid var(--admin-border, #e1e3e8); border-radius: 8px; font-size: 13px; }

.hb-switch { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; color: #1f2b3d; cursor: pointer; user-select: none; }
.hb-switch input { position: absolute; opacity: 0; pointer-events: none; }
.hb-switch__track { width: 34px; height: 20px; border-radius: 999px; background: #cfd6e0; position: relative; transition: background .15s ease; flex: 0 0 auto; }
.hb-switch__track::after { content: ''; position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.25); transition: left .15s ease; }
.hb-switch input:checked + .hb-switch__track { background: #17999b; }
.hb-switch input:checked + .hb-switch__track::after { left: 16px; }
.hb-switch input:focus-visible + .hb-switch__track { outline: 3px solid #17999b; outline-offset: 2px; }

@media (max-width: 720px) {
    .hb-behavior__options { grid-template-columns: 1fr; }
    .hb-behavior__media { padding: 14px; }
}

.hb-zones { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; padding: 14px 16px; }
@media (max-width: 900px) { .hb-zones { grid-template-columns: 1fr; } }
.hb-zone__label { font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; color: #8a94a6; margin-bottom: 7px; }
.hb-zone__drop { display: flex; flex-wrap: wrap; align-content: flex-start; gap: 8px; min-height: 56px; padding: 9px; border: 2px dashed #d6dce6; border-radius: 10px; background: #fbfcfe; transition: border-color .15s ease, background .15s ease; }
.hb-zone__drop.is-over { border-color: #17999b; background: #f0fafa; }
.hb-zone__drop.is-selected {
    border-color: #17999b;
    background: #f0fafa;
    box-shadow: 0 0 0 3px rgba(23, 153, 155, .12);
}
.hb-zone__drop:focus-visible { outline: 3px solid rgba(23, 153, 155, .35); outline-offset: 2px; }

.hb-el { display: inline-flex; align-items: center; gap: 8px; padding: 8px 10px; background: #fff; border: 1px solid #dde3ec; border-radius: 9px; box-shadow: 0 1px 2px rgba(19,42,92,.07); font-size: 13px; font-weight: 600; color: #1f2b3d; cursor: grab; transition: box-shadow .15s ease, border-color .15s ease, transform .12s ease; max-width: 100%; min-width: 0; }
.hb-el__label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
/* В узких зонах (Слева/Центр/Справа) чипы стоят в столбик во всю ширину; подпись — в одну строку. */
.hb-zone__drop .hdr-chip { width: 100%; }
.hb-palette__items .hdr-chip { width: auto; }
.hb-el:hover { border-color: #17999b; box-shadow: 0 4px 12px rgba(19,42,92,.12); }
.hb-el:active { cursor: grabbing; }
.hb-el.is-dragging { opacity: .45; transform: scale(.97); }
.hb-el__grip { color: #b6bfcd; display: inline-flex; }
.hb-el__icon { display: inline-flex; color: #17999b; }
.hb-el__icon svg { width: 16px; height: 16px; }
.hb-el__remove { border: 0; background: transparent; color: #98a3b5; font-size: 15px; line-height: 1; cursor: pointer; padding: 2px 3px; border-radius: 5px; }
.hb-el__remove:hover { color: #d33; background: #fdeaea; }

.hb-tabs { display: inline-flex; background: #eef2f8; border-radius: 9px; padding: 3px; gap: 2px; }
.hb-tabs .hdr-tabs__tab { border: 0; background: transparent; padding: 6px 14px; border-radius: 7px; font-size: 13px; font-weight: 700; color: #6b7789; cursor: pointer; }
.hb-tabs .hdr-tabs__tab.is-active { background: #fff; color: #173a63; box-shadow: 0 1px 3px rgba(19,42,92,.12); }

.hb-social-list { display: grid; gap: 10px; margin: 12px 0; }
.hb-social-list > .repeater-row {
    display: grid;
    grid-template-columns: minmax(170px, .55fr) minmax(260px, 1.45fr) auto;
    gap: 12px;
    align-items: end;
    padding: 12px;
    border: 1px solid var(--admin-border, #e1e3e8);
    border-radius: 10px;
    background: #f8fafc;
}
.hb-social-list .form-field { margin: 0; }
.hb-social-list .btn { margin-bottom: 2px; }
@media (max-width: 760px) {
    .hb-social-list > .repeater-row { grid-template-columns: 1fr; align-items: stretch; }
    .hb-social-list .btn { justify-self: start; }
}

/* Колонки не растягиваем до 1fr (иначе на широком экране поля раздуваются
   на пол-экрана) — фиксируем разумную ширину и пакуем влево. */
.hb-inline-fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 300px)); gap: 14px 20px; justify-content: start; }
/* Строка базовых настроек: поля уже, числовые «px» — совсем компактные. */
.hb-inline-fields--settings { grid-template-columns: repeat(auto-fit, minmax(180px, 230px)); }
.hb-inline-fields--settings input[type="number"] { max-width: 130px; }
/* Поля логотипов (превью + URL + кнопки) требуют места — широкие колонки,
   контролы переносятся, чтобы «Файл не выбран» не обрезался до «Ф...н». */
.hb-inline-fields--logos { grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); }
.hb-inline-fields--logos .image-field__preview { width: 170px; height: 75px; padding: 6px; background: #f8fafc; border-radius: 8px; }
.hb-inline-fields--logos .image-field__preview img { object-fit: contain; }
.hb-inline-fields--logos .image-field__controls { flex-wrap: wrap; }
.hb-inline-fields--logos .image-field__controls input[type="text"] { flex: 1 1 170px; }
.hb-inline-fields--logos .image-field__upload { min-width: 0; }

/* Конструктор футера Pro Max: колонки-карточки с перестановкой. */
.fb-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 14px; }
.fb-grid > .repeater-row, .fb-card { border: 1px solid var(--admin-border, #e1e3e8); border-radius: 12px; background: #fff; padding: 14px 16px; box-shadow: 0 1px 3px rgba(19,42,92,.06); }
.fb-card__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.fb-card__badge { padding: 3px 10px; border-radius: 999px; background: #4a5a74; color: #fff; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }
.fb-card__tools { display: inline-flex; gap: 4px; }
.fb-move { width: 30px; height: 30px; border: 1px solid var(--admin-border, #e1e3e8); border-radius: 8px; background: #f7f9fc; color: #173a63; cursor: pointer; font-size: 14px; line-height: 1; }
.fb-move:hover { background: #173a63; color: #fff; border-color: #173a63; }

/* --- Панель явного сохранения порядка (перетаскивание блоков/меню) --- */
/* Копит несохранённые изменения перетаскивания и применяет их по кнопке —
   вместо прежнего мгновенного автосохранения на каждый drop. */
.reorder-bar {
    position: fixed; left: 50%; bottom: 22px; transform: translateX(-50%);
    z-index: 400; display: flex; align-items: center; gap: 12px;
    padding: 10px 12px 10px 18px; background: #fff;
    border: 1px solid var(--admin-border, #e1e3e8); border-radius: 12px;
    box-shadow: 0 12px 34px rgba(19, 42, 92, .22);
    max-width: calc(100vw - 32px);
}
.reorder-bar[hidden] { display: none; }
.reorder-bar__text { font-size: 14px; font-weight: 600; color: var(--admin-text, #1f2b3d); }

/* Панель под полем SVG-иконки: выбрать файл из медиа / очистить. */

/* Ряд полей выбора цвета (фон/текст/кнопка) в конструкторе блоков. */
.colorfield-row { display: flex; flex-wrap: wrap; gap: 16px; margin: 6px 0 14px; }
.hero-visual-settings {
    margin: -4px 0 18px;
    padding: 16px 18px 2px;
    border: 1px solid var(--admin-border, #dce2ea);
    border-left: 3px solid var(--admin-accent, #2271b1);
    border-radius: var(--admin-radius-sm, 8px);
    background: var(--admin-surface-soft, #f8fafc);
}
.colorfield { min-width: 150px; }
.colorfield input[type="color"] { width: 100%; height: 38px; padding: 2px; cursor: pointer; }
.colorfield .clr-field { width: 100%; }
.colorfield.is-default .clr-field { opacity: .5; }
.colorfield__off { display: flex; align-items: center; gap: 6px; margin-top: 6px; font-weight: 400; font-size: 12px; color: var(--admin-muted); }
.colorfield__off input { width: auto; }
.hero-overlay-mode {
    margin-bottom: 16px;
    padding: 0;
    border: 0;
}
.hero-overlay-mode legend {
    padding: 0;
    margin-bottom: 8px;
    font-size: 13px;
}
.hero-overlay-mode__options {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}
.hero-overlay-mode__option {
    position: relative;
    display: block;
    cursor: pointer;
}
.hero-overlay-mode__option input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
}
.hero-overlay-mode__option span {
    display: grid;
    gap: 4px;
    height: 100%;
    padding: 12px 14px;
    border: 1px solid var(--admin-border, #dce2ea);
    border-radius: var(--admin-radius-sm, 8px);
    background: var(--admin-surface, #fff);
    transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
.hero-overlay-mode__option strong { font-size: 13px; color: var(--admin-text, #1f2b3d); }
.hero-overlay-mode__option small { font-size: 12px; line-height: 1.4; color: var(--admin-muted, #64748b); }
.hero-overlay-mode__option input:checked + span {
    border-color: var(--admin-accent, #214d84);
    background: color-mix(in srgb, var(--admin-accent, #214d84) 8%, #fff);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--admin-accent, #214d84) 18%, transparent);
}
.hero-overlay-mode__option input:focus-visible + span {
    outline: 2px solid var(--admin-accent, #214d84);
    outline-offset: 2px;
}
@media (max-width: 640px) {
    .hero-overlay-mode__options { grid-template-columns: 1fr; }
}

/* ============================================================================
   Dark Mode Support (Автоматический темный режим под тему ОС)
   ============================================================================ */
@media (prefers-color-scheme: dark) {
    :root {
        --admin-topbar-bg: #0f172a;
        --admin-topbar-text: #f8fafc;
        --admin-sidebar-bg: #1e293b;
        --admin-sidebar-text: #cbd5e1;
        --admin-sidebar-muted: #64748b;
        --admin-sidebar-hover: #334155;
        --admin-sidebar-active: #475569;
        --admin-bg: #0f172a;
        --admin-surface: #1e293b;
        --admin-text: #f1f5f9;
        --admin-muted: #94a3b8;
        --admin-border: #334155;
        --admin-border-strong: #475569;
        --admin-accent-soft: rgba(59, 130, 246, 0.12);
    }
    body {
        background-color: var(--admin-bg) !important;
        color: var(--admin-text) !important;
    }
    input, select, textarea {
        background-color: #1e293b !important;
        color: var(--admin-text) !important;
        border-color: var(--admin-border-strong) !important;
    }
    input[type="file"]::file-selector-button {
        background: #0f172a !important;
        color: var(--admin-text) !important;
        border-color: var(--admin-border-strong) !important;
    }
    input[type="file"]::file-selector-button:hover {
        background: #1e293b !important;
    }
    input::placeholder, textarea::placeholder {
        color: #64748b !important;
    }
    code {
        background: #334155 !important;
        color: #f8fafc !important;
    }
    .btn {
        background: #1e293b !important;
        color: var(--admin-text) !important;
        border-color: var(--admin-border-strong) !important;
    }
    .btn:hover {
        background: #334155 !important;
        border-color: var(--admin-accent) !important;
        color: #fff !important;
        text-decoration: none !important;
    }
    .btn--primary {
        background: var(--admin-accent) !important;
        color: #fff !important;
        border-color: var(--admin-accent) !important;
    }
    .btn--primary:hover {
        background: var(--admin-accent-hover) !important;
    }
    .admin-search__results {
        background: #1e293b !important;
        border-color: var(--admin-border) !important;
        box-shadow: 0 16px 40px rgba(0,0,0,.5) !important;
    }
    .admin-search__item {
        color: var(--admin-text) !important;
        border-bottom-color: var(--admin-border) !important;
    }
    .admin-search__item:hover {
        background: var(--admin-sidebar-hover) !important;
    }
    /* Lists, tables, cards */
    .admin-table th {
        background-color: #1e293b !important;
        border-bottom-color: var(--admin-border) !important;
        color: var(--admin-text) !important;
    }
    .admin-table td {
        border-bottom-color: var(--admin-border) !important;
    }
    .admin-table tr:hover td {
        background-color: var(--admin-sidebar-hover) !important;
    }
    /* Stat cards */
    .stat-grid a.stat-card {
        background-color: #1e293b !important;
        border: 1px solid var(--admin-border) !important;
        color: var(--admin-text) !important;
    }
    .stat-grid a.stat-card:hover {
        background-color: var(--admin-sidebar-hover) !important;
        border-color: var(--admin-accent) !important;
        text-decoration: none !important;
    }
    .stat-card__value {
        color: var(--admin-accent) !important;
    }
    /* Forms, cards, blocks editor */
    .form-card, .design-preset, .revision-item, .audit-item, .block-list-item, .menu-node__inner {
        background-color: #1e293b !important;
        border-color: var(--admin-border) !important;
        color: var(--admin-text) !important;
    }
    .design-preset:hover, .block-list-item:hover, .menu-node__inner:hover {
        border-color: var(--admin-border-strong) !important;
    }
    .design-preset.is-active, .menu-node.is-active > .menu-node__inner {
        border-color: var(--admin-accent) !important;
        background-color: var(--admin-accent-soft) !important;
    }
    /* Block editor fields */
    .block-list-item__body {
        border-top-color: var(--admin-border) !important;
    }
    .art-editor__area {
        background-color: #1e293b !important;
        border-color: var(--admin-border) !important;
    }
    .hb-switch__track {
        background: #334155 !important;
    }
    .hb-switch {
        color: var(--admin-text) !important;
    }
    /* WYSIWYG editor */
    trix-editor, .trix-content, .editor-statusbar {
        background-color: #1e293b !important;
        color: var(--admin-text) !important;
        border-color: var(--admin-border) !important;
    }
    trix-toolbar {
        background-color: #0f172a !important;
        border-color: var(--admin-border) !important;
    }
    trix-toolbar button {
        background-color: #1e293b !important;
        border-color: var(--admin-border-strong) !important;
        color: var(--admin-text) !important;
    }
    /* Modals, alerts, flash messages */
    .flash-message {
        background-color: #1e293b !important;
        border-color: var(--admin-border) !important;
        color: var(--admin-text) !important;
    }
    .flash-message--success {
        border-left-color: var(--admin-success) !important;
    }
    .flash-message--error {
        border-left-color: var(--admin-danger) !important;
    }
    .fb-move {
        background: #1e293b !important;
        color: #fff !important;
        border-color: var(--admin-border) !important;
    }
    .fb-move:hover {
        background: var(--admin-accent) !important;
        border-color: var(--admin-accent) !important;
    }
    .reorder-bar {
        background: #1e293b !important;
        border-color: var(--admin-border) !important;
        box-shadow: 0 12px 34px rgba(0,0,0,.4) !important;
    }
    .reorder-bar__text {
        color: var(--admin-text) !important;
    }
    .badge--published, .badge--success { background: rgba(16, 185, 129, 0.12) !important; color: #10b981 !important; }
    .badge--draft { background: rgba(148, 163, 184, 0.12) !important; color: #94a3b8 !important; }
    .badge--danger { background: rgba(239, 68, 68, 0.12) !important; color: #ef4444 !important; }
    .badge { background: rgba(148, 163, 184, 0.12) !important; color: #94a3b8 !important; }
    .badge--accent { background: rgba(96, 165, 250, 0.15) !important; color: #60a5fa !important; }
}

/* --- Сетка дашборда и лог действий --- */
.dashboard-grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: 24px; margin-top: 24px; }
@media (max-width: 960px) { .dashboard-grid { grid-template-columns: 1fr; } }

/* «Продолжить работу»: последние редактированные материалы. */
.continue-card { max-width: none; margin-top: 24px; }
.continue-list { display: flex; flex-direction: column; margin-top: 12px; }
.continue-item {
    display: flex; align-items: center; gap: 12px; padding: 10px 12px; margin: 0 -12px;
    border-radius: var(--admin-radius-sm); color: var(--admin-text); text-decoration: none;
}
.continue-item:hover { background: var(--admin-accent-soft); text-decoration: none; }
.continue-item + .continue-item { border-top: 1px solid var(--admin-border); }
.continue-item__kind { flex-shrink: 0; min-width: 76px; font-size: 12px; color: var(--admin-muted); }
.continue-item__title { flex: 1; min-width: 0; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.continue-item:hover .continue-item__title { color: var(--admin-accent-hover); }
.continue-item__time { flex-shrink: 0; font-size: 12px; color: var(--admin-muted); font-variant-numeric: tabular-nums; }
@media (max-width: 640px) {
    .continue-item { flex-wrap: wrap; gap: 6px 10px; }
    .continue-item__title { flex-basis: 100%; white-space: normal; }
}

.activity-feed { display: flex; flex-direction: column; gap: 14px; }
.activity-item { padding: 10px 0; }
.activity-item:not(:last-child) { border-bottom: 1px solid var(--admin-border); }
.activity-item__meta { display: flex; justify-content: space-between; margin-bottom: 6px; font-size: 13px; }
.activity-item__time { color: var(--admin-muted); font-size: 12px; }
.activity-item__desc { display: flex; align-items: center; gap: 8px; font-size: 13px; }
.activity-item__badge {
    display: inline-block; padding: 2px 6px; border-radius: 4px; font-size: 10px; font-weight: 700;
    text-transform: uppercase; letter-spacing: 0.04em; color: #fff; line-height: 1.2;
}
.activity-item__badge--post { background: var(--admin-success, #008a20); }
.activity-item__badge--put, .activity-item__badge--patch { background: var(--admin-accent, #2271b1); }
.activity-item__badge--delete { background: var(--admin-danger, #b32d2e); }
.activity-item__badge--auth { background: #64748b; }

/* Бейджи статусов для списков и таблиц */
.status-badge {
    display: inline-flex; align-items: center; gap: 5px;
    padding: 3px 10px; border-radius: 999px; font-size: 12px; font-weight: 600;
    line-height: 1.2; width: max-content;
}
.status-badge--success { background: rgba(16, 185, 129, 0.12); color: #10b981; }
.status-badge--warning { background: rgba(245, 158, 11, 0.12); color: #f59e0b; }
.status-badge--danger { background: rgba(239, 68, 68, 0.12); color: #ef4444; }
.status-badge--info { background: rgba(59, 130, 246, 0.12); color: #3b82f6; }
.status-badge--neutral { background: rgba(148, 163, 184, 0.12); color: #94a3b8; }

/* Drag and Drop Uploader */
.dropzone {
    border: 2px dashed var(--admin-border-strong);
    border-radius: 8px;
    padding: 24px;
    text-align: center;
    background: var(--admin-surface);
    transition: all 0.2s ease;
    cursor: pointer;
    position: relative;
    margin-top: 6px;
}
.dropzone:hover, .dropzone.is-dragover {
    border-color: var(--admin-accent);
    background: var(--admin-accent-soft);
}
.dropzone input[type="file"] {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    opacity: 0; cursor: pointer;
}
.dropzone__text {
    font-size: 14px;
    color: var(--admin-muted);
}
.dropzone__text strong {
    color: var(--admin-accent);
}

/* --- Модальное подтверждение (замена нативного window.confirm) --- */
.admin-modal-overlay {
    position: fixed;
    inset: 0;
    z-index: 2000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: color-mix(in srgb, #1d2327 55%, transparent);
    opacity: 0;
    transition: opacity .15s ease;
}
.admin-modal-overlay.is-open { opacity: 1; }
.admin-modal {
    width: 100%;
    max-width: 440px;
    background: var(--admin-surface);
    border: 1px solid var(--admin-border);
    border-radius: var(--admin-radius-lg);
    box-shadow: var(--admin-shadow-lg);
    transform: translateY(10px) scale(.98);
    transition: transform .15s ease;
    overflow: hidden;
}
.admin-modal-overlay.is-open .admin-modal { transform: none; }
.admin-modal__body { display: flex; gap: 14px; padding: 24px 24px 4px; }
.admin-modal__icon {
    flex: 0 0 auto;
    width: 40px; height: 40px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 22px; font-weight: 700;
    background: var(--admin-accent-soft);
    color: var(--admin-accent);
}
.admin-modal__msg {
    margin: 7px 0 0;
    font-size: 15px;
    line-height: 1.5;
    color: var(--admin-text);
}
.admin-modal__actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding: 18px 24px 20px;
}
@media (prefers-reduced-motion: reduce) {
    .admin-modal-overlay, .admin-modal { transition: none; }
}



/* --- Готовые сборки страниц --- */
.preset-picker > summary { cursor: pointer; list-style: none; }
.preset-picker > summary::-webkit-details-marker { display: none; }
.preset-picker > summary::before { content: '▸'; display: inline-block; margin-right: 8px; color: var(--admin-muted); transition: transform .15s ease; }
.preset-picker[open] > summary::before { transform: rotate(90deg); }
.preset-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 12px;
}
.preset-card {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 16px;
    border: 1px solid var(--admin-border);
    border-radius: var(--admin-radius);
    background: #fff;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.preset-card:hover { border-color: var(--admin-accent); box-shadow: 0 2px 10px rgba(16,24,40,.06); }
.preset-card__title { margin: 0; font-size: .98rem; }
.preset-card__desc { margin: 0; font-size: .84rem; color: var(--admin-muted); line-height: 1.45; }
/* Состав сборки — служебный список, поэтому мельче и приглушённее описания. */
.preset-card__outline { margin: 0; padding-left: 18px; font-size: .8rem; color: var(--admin-muted); line-height: 1.7; }
.preset-card__foot { display: flex; gap: 8px; align-items: center; margin-top: auto; padding-top: 6px; }
.preset-card__foot select { flex: 1; min-width: 0; }

/* --- Типографика: шкала и предпросмотр --- */
.typo-scale { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 8px; }
.typo-scale__opt {
    display: grid;
    grid-template-columns: auto auto;
    align-items: baseline;
    gap: 2px 8px;
    padding: 12px 14px;
    border: 1px solid var(--admin-border);
    border-radius: var(--admin-radius);
    cursor: pointer;
    transition: border-color .15s ease, background .15s ease;
}
.typo-scale__opt:hover { border-color: var(--admin-accent); }
.typo-scale__opt:has(input:checked) { border-color: var(--admin-accent); background: var(--admin-accent-soft); }
.typo-scale__opt input { grid-row: 1; margin: 0; }
.typo-scale__name { font-weight: 600; }
.typo-scale__ratio { color: var(--admin-muted); font-variant-numeric: tabular-nums; }
/* Пояснение занимает всю ширину карточки под названием. */
.typo-scale__hint { grid-column: 1 / -1; font-size: .82rem; color: var(--admin-muted); line-height: 1.4; }

.typo-preview { margin: 4px 0 8px; padding: 14px 16px; border: 1px solid var(--admin-border); border-radius: var(--admin-radius); background: var(--admin-surface, #fff); }
.typo-preview__head { font-size: .82rem; color: var(--admin-muted); margin-bottom: 10px; }
.typo-preview__row { display: flex; align-items: baseline; gap: 20px; flex-wrap: wrap; }
.typo-preview__item { display: flex; flex-direction: column; gap: 2px; }
.typo-preview__sample { font-weight: 700; color: var(--admin-accent); }
.typo-preview__size { font-size: .75rem; color: var(--admin-muted); font-variant-numeric: tabular-nums; }

details.design-manual > summary { cursor: pointer; list-style: none; }
details.design-manual > summary::-webkit-details-marker { display: none; }
details.design-manual > summary::before { content: '▸'; display: inline-block; margin-right: 8px; color: var(--admin-muted); transition: transform .15s ease; }
details.design-manual[open] > summary::before { transform: rotate(90deg); }

/* Поле картинки в строке повторителя: input + кнопка медиабиблиотеки. */
.repeater-media { display: flex; gap: 8px; align-items: center; }
.repeater-media input[type="text"] { flex: 1; min-width: 0; }
.repeater-media .btn { white-space: nowrap; }

/* Прожектор в админке снят целиком: карточки, кнопки и поля ввода. Эффект
   декоративный, а платили за него дважды — псевдоэлемент с радиальным
   градиентом на каждой карточке и обработчик mousemove без throttle, который
   писал две CSS-переменные на каждое событие мыши. Позиционирование и
   overflow, добавленные вместе с эффектом, сняты тем же движением: до него их
   здесь не было. На публичной части прожектор у карточек и кнопок остаётся. */

/* --- Уведомления о пропущенных обязательных полях (Form Validation Toast) --- */
.is-invalid {
    border-color: #ef4444 !important;
    background-color: #fef2f2 !important;
    box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.2) !important;
    animation: adminShake 0.3s ease-in-out;
}

@keyframes adminShake {
    0%, 100% { transform: translateX(0); }
    20%, 60% { transform: translateX(-4px); }
    40%, 80% { transform: translateX(4px); }
}

/* Тост висит сверху по центру, а не в нижнем правом углу. Внизу справа он
   оказывался вне поля зрения: нажимают кнопку в середине длинной формы, а
   сообщение появляется в противоположном углу и через пять секунд исчезает.
   Сверху по центру оно попадает в ту же зону, куда человек смотрит после
   перезагрузки страницы. */
.admin-toast-notification {
    position: fixed;
    top: 76px;
    left: 50%;
    z-index: 999999;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 20px;
    border-radius: 10px;
    background: #1e293b;
    color: #ffffff;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25);
    opacity: 0;
    transform: translate(-50%, -12px);
    transition: opacity 0.3s cubic-bezier(0.16, 1, 0.3, 1), transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    max-width: min(560px, calc(100vw - 32px));
    font-family: inherit;
}

.admin-toast-notification.is-visible {
    opacity: 1;
    transform: translate(-50%, 0);
}

.admin-toast--warning {
    background: #7c2d12;
    border-left: 5px solid #f97316;
}

.admin-toast--error {
    background: #7f1d1d;
    border-left: 5px solid #ef4444;
}

.admin-toast--success {
    background: #064e3b;
    border-left: 5px solid #10b981;
}

/* --- Modern Tabbed Admin Controls & Design Live Deck --- */
.admin-tab-nav {
    display: flex;
    gap: 6px;
    border-bottom: 2px solid var(--admin-border, #e2e8f0);
    margin-bottom: 24px;
    background: var(--admin-surface, #ffffff);
    padding: 6px 6px 0 6px;
    border-radius: 12px 12px 0 0;
    overflow-x: auto;
    /* Вкладки выходят за нижний край контейнера на 2px (у .admin-tab-btn
       margin-bottom: -2px, чтобы подчёркивание накрывало общую линию). При
       overflow-x: auto вторая ось по спецификации тоже становится auto — и
       из-за этих 2px появлялась крошечная вертикальная полоса прокрутки. */
    overflow-y: hidden;
    overscroll-behavior-inline: contain;
    scrollbar-width: thin;
}
.admin-tab-btn {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    font-size: 14px;
    font-weight: 600;
    color: var(--admin-muted, #64748b);
    background: transparent;
    border: none;
    border-bottom: 3px solid transparent;
    margin-bottom: -2px;
    cursor: pointer;
    transition: all 0.2s ease;
    border-radius: 6px 6px 0 0;
}
.admin-tab-btn:hover {
    color: var(--admin-text, #1e293b);
    background: var(--admin-surface-soft, #f8fafc);
}
.admin-tab-btn.is-active {
    color: var(--admin-accent, #0284c7);
    border-bottom-color: var(--admin-accent, #0284c7);
    background: var(--admin-accent-soft, #f0f9ff);
}
.admin-tab-btn:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--admin-accent, #0284c7) 28%, transparent);
    outline-offset: -3px;
}
.admin-tab-content {
    display: none;
}
.admin-tab-content.is-active {
    display: block;
}
.admin-tab-content[hidden] {
    display: none !important;
}

/* Preset Cards with Swatches */
.preset-cards-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 16px;
    margin-bottom: 24px;
}
.preset-card-item {
    border: 2px solid #e2e8f0;
    border-radius: 12px;
    padding: 16px;
    background: #ffffff;
    cursor: pointer;
    transition: all 0.2s ease;
    position: relative;
}
.preset-card-item:hover {
    border-color: #94a3b8;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.06);
}
.preset-card-item.is-selected {
    border-color: #0284c7;
    background: #f0f9ff;
    box-shadow: 0 0 0 1px #0284c7;
}
.preset-card-item input[type="radio"] {
    position: absolute;
    top: 16px;
    right: 16px;
}
.preset-card-item__title {
    font-weight: 700;
    font-size: 15px;
    color: #0f172a;
    margin-bottom: 4px;
}
.preset-card-item__desc {
    font-size: 12px;
    color: #64748b;
    margin-bottom: 12px;
    line-height: 1.4;
}
.preset-card-item__swatches {
    display: flex;
    gap: 6px;
    align-items: center;
}
.preset-card-item__dot {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: 1px solid rgba(0,0,0,0.1);
}

/* Interactive Component Live Preview Deck */
.live-deck {
    background: #0f172a;
    color: #f8fafc;
    border-radius: 14px;
    padding: 20px;
    margin-bottom: 28px;
    box-shadow: 0 10px 25px -5px rgba(15, 23, 42, 0.25);
    border: 1px solid #1e293b;
}
.live-deck__head {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 18px;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid #334155;
}
.live-deck__title {
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: #38bdf8;
    display: flex;
    align-items: center;
    gap: 8px;
}
.live-deck__canvas {
    background: var(--live-bg-primary, #f6f8fa);
    color: var(--live-text-main, #1a1a1a);
    border-radius: 10px;
    padding: var(--live-section-pad, 24px);
    border: 1px solid #334155;
    transition: all 0.2s ease;
}
.live-deck__grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: var(--live-card-gap, 20px);
    align-items: start;
}
.live-deck__card {
    background: var(--live-bg-surface, #ffffff);
    border: 1px solid var(--live-border-color, #e1e3e8);
    border-radius: var(--live-radius, 14px);
    padding: 16px;
    box-shadow: var(--live-card-shadow, 0 1px 3px rgba(0,0,0,0.06));
}
.live-deck__h1 { font-size: var(--live-fs-h1, 32px); font-family: var(--live-font-heading, inherit); line-height: var(--live-heading-line-height, 1.25); font-weight: var(--live-heading-font-weight, 700); letter-spacing: var(--live-heading-letter-spacing, -0.02em); margin: 0 0 8px 0; color: var(--live-text-main, #1a1a1a); }
.live-deck__h2 { font-size: var(--live-fs-h2, 24px); font-family: var(--live-font-heading, inherit); line-height: var(--live-heading-line-height, 1.25); font-weight: var(--live-heading-font-weight, 700); letter-spacing: var(--live-heading-letter-spacing, -0.02em); margin: 0 0 6px 0; color: var(--live-text-main, #1a1a1a); }
.live-deck__h3 { font-size: var(--live-fs-h3, 18px); font-family: var(--live-font-heading, inherit); line-height: var(--live-heading-line-height, 1.25); font-weight: var(--live-heading-font-weight, 700); letter-spacing: var(--live-heading-letter-spacing, -0.02em); margin: 0 0 6px 0; color: var(--live-text-main, #1a1a1a); }
.live-deck__p { font-size: var(--live-font-size, 16px); font-family: var(--live-font-body, inherit); line-height: var(--live-line-height, 1.6); color: var(--live-text-muted, #666666); margin: 0 0 12px 0; }
.live-deck__btn-primary { background: var(--live-color-primary, #173a63); color: #ffffff; border: none; border-radius: var(--live-btn-radius, 10px); padding: 8px 16px; font-weight: 600; cursor: pointer; font-size: var(--live-fs-btn, 15px); }
.live-deck__btn-accent { background: var(--live-color-accent, #17999b); color: #ffffff; border: none; border-radius: var(--live-btn-radius, 10px); padding: 8px 16px; font-weight: 600; cursor: pointer; font-size: var(--live-fs-btn, 15px); }

/* Header Live Preview Bar */
.hdr-live-preview {
    background: #0f172a;
    border-radius: 12px;
    padding: 16px;
    margin-bottom: 24px;
    border: 1px solid #1e293b;
}
.hdr-live-preview__head {
    font-size: 13px;
    font-weight: 700;
    color: #38bdf8;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 12px;
}
.hdr-live-preview__box {
    background: #ffffff;
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid #cbd5e1;
}
.hdr-live-preview__top {
    background: var(--prev-topbar-bg, #173a63);
    color: var(--prev-topbar-text, #ffffff);
    padding: 6px 16px;
    font-size: 12px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.hdr-live-preview__main {
    padding: 12px 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--prev-middle-bg, #ffffff);
    border-bottom: 1px solid #e2e8f0;
}
.hdr-live-preview__logo {
    font-weight: 800;
    font-size: 18px;
    color: #1e293b;
}
.hdr-live-preview__nav {
    display: flex;
    gap: 16px;
    font-size: 14px;
    font-weight: 600;
}
.hdr-live-preview__nav-item {
    color: var(--prev-nav-color, #1e293b);
    text-decoration: none;
}
.hdr-live-preview__nav-item.is-active {
    color: var(--prev-nav-active, #0284c7);
}

/* --- Отключение кнопки Upgrade и брендинга в визуальном редакторе TinyMCE --- */
.tox-promotion,
.tox-statusbar__path,
.tox-statusbar__right-container .tox-statusbar__branding {
    display: none !important;
}

/* --- Предпросмотр поста Telegram (Telegram Bubble Design) --- */
.tg-preview__facts { margin: 0 0 14px; padding-left: 20px; line-height: 1.7; font-size: 14px; }
.tg-preview__warn { color: var(--admin-warning, #d97706); font-weight: 600; }
.tg-preview {
    max-width: 580px;
    padding: 16px 18px;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    background: #ffffff;
    box-shadow: 0 6px 24px rgba(15, 23, 42, 0.06);
    line-height: 1.55;
    position: relative;
}
.tg-preview sub {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 3px 10px;
    border-radius: 9999px;
    background: #f1f5f9;
    color: #475569;
    font-size: 12px;
    font-weight: 700;
    margin-bottom: 8px;
}
.tg-preview h1, .tg-preview h2, .tg-preview h3 {
    font-size: 1rem !important;
    font-weight: 700 !important;
    color: #0f172a !important;
    margin: 8px 0 6px !important;
    line-height: 1.35 !important;
}
.tg-preview p { margin: 0 0 10px; color: #1e293b; }
.tg-preview img { display: block; width: 100%; border-radius: 12px; margin-bottom: 10px; }
.tg-preview tg-slideshow { display: flex; gap: 10px; overflow-x: auto; margin-bottom: 12px; padding-bottom: 4px; }
.tg-preview tg-slideshow img { width: 200px; flex: 0 0 auto; margin: 0; border-radius: 10px; }
.tg-preview figure { margin: 0 0 12px; }
.tg-preview figcaption { font-size: 12.5px; color: #64748b; margin-top: 4px; }
.tg-preview cite { display: block; font-style: normal; opacity: .85; }
.tg-preview hr { margin: 16px 0; border: 0; border-top: 1px solid #e2e8f0; }
.tg-preview mark { background: #eff6ff; color: #2563eb; padding: 2px 8px; border-radius: 6px; font-weight: 600; font-size: 13px; }
.tg-preview footer { font-size: 13px; color: #64748b; margin-top: 10px; }

/* --- Превью файлов, выбранных но ещё не загруженных --- */
.file-preview {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 10px;
}
.file-preview__note {
    flex: 0 0 100%;
    margin: 0;
}
.file-preview__item {
    position: relative;
    width: 132px;
    padding: 8px;
    border: 1px solid var(--admin-border, #e1e3e8);
    border-radius: 8px;
    background: var(--admin-card-bg, #fff);
}
.file-preview__item img {
    display: block;
    width: 100%;
    height: 84px;
    object-fit: cover;
    border-radius: 6px;
    margin-bottom: 6px;
}
.file-preview__name {
    display: block;
    font-size: 11px;
    line-height: 1.35;
    color: var(--admin-text-muted, #64748b);
    word-break: break-all;
}
/* Крестик поверх снимка: в ряду из десяти кадров отдельная строка кнопок
   съедала бы больше места, чем сами превью. */
.file-preview__drop {
    position: absolute;
    top: 2px;
    right: 2px;
    width: 22px;
    height: 22px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    cursor: pointer;
    font-size: 15px;
    line-height: 22px;
    color: #fff;
    background: color-mix(in srgb, var(--admin-danger, #b32d2e) 85%, transparent);
}
.file-preview__drop:hover,
.file-preview__drop:focus-visible {
    background: var(--admin-danger, #b32d2e);
}

/* generated:inline-utilities:start */
.u-inline-001013efee{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.u-inline-018813c94c{color:var(--admin-danger, #b42318);}
.u-inline-060dc9f317{vertical-align:top;}
.u-inline-06d0ddb422{display:flex;gap:6px;margin-left:auto;}
.u-inline-07bbf13a37{font-size:0.75rem;}
.u-inline-081bc4f452{color:#94a3b8;font-size:10px;}
.u-inline-083bdc9269{font-size:10px;display:block;margin-top:2px;}
.u-inline-0a679d0540{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;}
.u-inline-0b08752dae{font-weight:700;font-size:0.95rem;display:flex;align-items:center;gap:8px;}
.u-inline-0b87e9e0af{font-weight:600;}
.u-inline-0c8a27e103{font-size:10px;}
.u-inline-0cfd3323fe{display:none;background:#ecfdf5;color:#065f46;border:1px solid #a7f3d0;padding:6px 10px;border-radius:6px;font-size:0.78rem;font-weight:600;align-items:center;gap:6px;}
.u-inline-0d175b7d93{font-size:0.92rem;color:var(--admin-primary-dark,#0369a1);font-weight:700;text-transform:uppercase;}
.u-inline-0dfd020469{display:block;margin-top:6px;font-size:12px;white-space:pre-wrap;word-break:break-word;}
.u-inline-0e0c39e056{margin:0 0 4px;font-size:1.1rem;color:var(--admin-text,#0f172a);}
.u-inline-0e883e39e4{text-align:center;color:#888;padding:24px;}
.u-inline-0fc66a2344{display:flex;align-items:center;justify-content:space-between;padding:9px 12px;border-radius:8px;background:var(--gov-bg, #f8fafc);border:1px solid var(--admin-border, #e2e8f0);}
.u-inline-108a780011{margin-top:20px;padding:20px;background: linear-gradient(135deg, rgba(37,99,235,0.02) 0%, rgba(147,197,253,0.05) 100%);}
.u-inline-1138a90be7{background:var(--admin-danger-soft);border:1px solid var(--admin-danger-border);border-radius:var(--admin-radius);padding:10px 12px;margin-top:12px;}
.u-inline-1204c3c3eb{padding:0 8px;font-weight:600;}
.u-inline-138b28c6d0{display:flex;gap:16px;align-items:center;}
.u-inline-13daa00158{color:#0f172a;}
.u-inline-1446175039{display:flex;align-items:center;gap:10px;margin-bottom:20px;padding-bottom:12px;border-bottom:1px solid var(--admin-border,#e2e8f0);}
.u-inline-1456117e38{margin-top:16px;border:1px solid var(--admin-border);border-radius:var(--admin-radius);padding:12px;}
.u-inline-1745561f5c{display:flex;flex-direction:column;gap:8px;margin-top:8px;}
.u-inline-1755fec80e{display:flex;gap:28px;flex-wrap:wrap;margin:18px 0 4px;}
.u-inline-1a3ecb21b1{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.u-inline-1acd52fd8a{border:1px solid var(--admin-border);border-radius:8px;padding:12px 14px;margin-bottom:16px;background:var(--admin-bg-alt, rgba(0,0,0,0.02));}
.u-inline-1bff6ebf4f{margin-top:0;display:flex;align-items:center;gap:10px;}
.u-inline-1cef6a84e1{font-size:1.02rem;font-weight:600;}
.u-inline-1d77e476f8{font-size:12px;word-break:break-all;}
.u-inline-1d8943fa86{display:flex;gap:6px;}
.u-inline-1da9facb4d{margin:0;}
.u-inline-1dcf0e84b2{font-weight:600;margin-bottom:6px;display:flex;align-items:center;gap:6px;}
.u-inline-1e1a9b09bf{margin-bottom:28px;}
.u-inline-1e51bacc25{display:block;margin:-6px 0 14px;}
.u-inline-1e90930a6f{display:flex;gap:10px;flex-wrap:wrap;}
.u-inline-210f32db0a{gap:18px;}
.u-inline-22ca54a87e{padding:6px 10px;}
.u-inline-24384db92e{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px;margin-bottom:12px;}
.u-inline-24981bd547{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.u-inline-254c3eade8{max-width:280px;overflow:hidden;text-overflow:ellipsis;}
.u-inline-26c741d857{width:8px;height:8px;border-radius:50%;background:#0284c7;display:inline-block;box-shadow:0 0 0 3px rgba(2,132,199,0.25);}
.u-inline-27aa68da7d{width:100%;max-width:580px;background:#ffffff;border-radius:14px;box-shadow:0 20px 40px rgba(0,0,0,0.25);overflow:hidden;border:1px solid #cbd5e1;font-family:-apple-system,BlinkMacSystemFont,\'Segoe UI\',Roboto,sans-serif;}
.u-inline-291b7bbb01{margin-top:0;}
.u-inline-2921120983{font-weight:normal;text-transform:none;color:var(--admin-accent,#2563eb);}
.u-inline-2a7e2ecd89{background:var(--admin-surface-soft, #f4f6f9);padding:10px 16px;border-radius:8px;border:1px solid var(--admin-border, #e0e0e0);}
.u-inline-2cf3de3c05{margin-left: 24px;}
.u-inline-2d22144f96{margin-bottom:24px;max-width:520px;}
.u-inline-2e190aa086{margin:0;font-weight:600;}
.u-inline-2e1ca338d7{display:flex;flex-direction:column;gap:12px;}
.u-inline-2e25154383{border:1px solid var(--admin-border,#e2e8f0);border-radius:10px;padding:18px;margin-bottom:16px;background:var(--admin-surface-soft,#f8fafc);}
.u-inline-2e67dd3b15{margin:0 0 12px;font-size:0.95rem;font-weight:700;color:var(--admin-text,#0f172a);}
.u-inline-2fd7789b39{margin-top:6px;}
.u-inline-30220647a6{font-weight:600;font-size:15px;margin-bottom:4px;color:#0f172a;}
.u-inline-30739594c7{align-self:center;color:#ef4444;font-weight:600;}
.u-inline-3159a647e8{background:#0284c7;color:#ffffff;padding:2px 8px;border-radius:12px;font-size:0.72rem;font-weight:700;letter-spacing:0.02em;}
.u-inline-3343fd6464{margin-top:24px;}
.u-inline-33d0b17b27{font-size:11px;margin:0;}
.u-inline-342ce139a0{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;}
.u-inline-34f05f7385{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px;}
.u-inline-359c202582{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;}
.u-inline-3696404b96{margin:0;font-size:1.05rem;font-weight:700;}
.u-inline-371a921b3b{font-size:0.88rem;padding:6px 12px;}
.u-inline-396a26d7d7{display:grid;grid-template-columns:2fr 2fr 36px;gap:10px;align-items:center;margin-bottom:10px;}
.u-inline-39a35c5e86{margin:0 0 4px;font-size:1.1rem;color:var(--admin-text,#0f172a);display:flex;align-items:center;gap:8px;}
.u-inline-39e79eb52f{position:relative;display:inline-block;}
.u-inline-3a618ca4cc{max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.u-inline-3b3157a26b{font-weight:600;font-size:0.88rem;color:var(--admin-text, #334155);}
.u-inline-3c3e97944f{top:22px;}
.u-inline-3c7c5ffa2b{color:#ffffff;text-align:center;}
.u-inline-3df38c3cc4{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;background:var(--admin-bg);border:1px solid var(--admin-border);border-radius:20px;font-size:13px;}
.u-inline-3e52776664{margin-top:0;font-size:1.05rem;font-weight:700;display:flex;align-items:center;gap:8px;margin-bottom:14px;}
.u-inline-3e8ce2fc5a{margin-top:0;font-size:1.1rem;font-weight:700;}
.u-inline-3ef1fa1aa1{margin-bottom:12px;}
.u-inline-3f5e202c68{margin-top:16px;text-align:center;}
.u-inline-3f6331b9d1{font-size:0.78rem;color:#64748b;margin-top:6px;font-weight:600;text-align:right;}
.u-inline-3f7fce4b31{font-weight:600;font-size:0.95rem;color:#0f172a;}
.u-inline-41724d9228{margin:8px 0 0;}
.u-inline-419b2840c7{background:#0284c7;color:#ffffff;font-size:0.75rem;font-weight:700;padding:3px 10px;border-radius:14px;display:inline-flex;align-items:center;gap:4px;}
.u-inline-42278569ee{cursor:pointer;display:inline-flex;align-items:center;gap:6px;}
.u-inline-4238d06251{max-width:100%;margin-top:12px;}
.u-inline-42cb127355{font-size:11px;padding:2px 6px;}
.u-inline-43a8ae377d{margin-top:12px;padding-top:12px;border-top:1px solid var(--admin-border,#e2e8f0);}
.u-inline-4488ac4e31{background:#0ea5e9;color:#ffffff;padding:2px 8px;border-radius:12px;font-size:0.72rem;font-weight:700;}
.u-inline-45517d35ab{margin:8px 0 0 0;}
.u-inline-4588dc62ed{padding:10px 12px;background:var(--admin-bg);border-radius:8px;border:1px solid var(--admin-border);}
.u-inline-468a6b21bf{border:1px solid var(--admin-border,#e1e3e8);border-radius:8px;padding:10px;background:var(--admin-card-bg,#fff);box-shadow:0 1px 2px rgba(0,0,0,0.03);}
.u-inline-481ed7e754{padding:10px;}
.u-inline-482f283023{font-weight:700;margin-bottom:4px;color:var(--admin-text,#1e293b);display:flex;align-items:center;gap:6px;}
.u-inline-48b8779b18{margin:0 0 4px 0;font-size:11px;}
.u-inline-4aaba5a4dd{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;}
.u-inline-4c7fa37fe5{grid-column: 1/-1;text-align: center;padding: 60px 20px;color: var(--admin-muted);font-size: 15px;}
.u-inline-4e8f89004d{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:70%;}
.u-inline-4f1925a8a6{font-size:18px;}
.u-inline-4f738c4fe1{background:var(--admin-surface-soft, #f4f6f9);padding:10px 14px;border-radius:8px;border:1px solid var(--admin-border, #e0e0e0);}
.u-inline-50960b108b{display:flex;align-items:center;gap:8px;margin-bottom:14px;}
.u-inline-50f7d15eb8{margin-top: 24px;padding: 18px 20px;background: #0f172a;border-radius: 12px;color: #f8fafc;font-family: monospace;font-size: 13px;line-height: 1.6;}
.u-inline-5370cbf1a7{margin-bottom:30px;}
.u-inline-5429e4728e{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px;margin-bottom:20px;}
.u-inline-546ceb205f{width:16px;height:16px;margin:0;cursor:pointer;accent-color:var(--admin-primary,#0284c7);}
.u-inline-5888fddfc8{font-size:12px;padding:4px 8px;}
.u-inline-58d7c6be2b{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(15,23,42,0.6);backdrop-filter:blur(4px);z-index:99999;align-items:flex-start;justify-content:center;padding-top:10vh;}
.u-inline-594b8be61b{color:var(--admin-text-muted);}
.u-inline-59f69369f1{font-size:0.95rem;color:#64748b;margin:0 0 28px 0;max-width:520px;margin-left:auto;margin-right:auto;line-height:1.5;}
.u-inline-5aec6ffae3{width:32px;}
.u-inline-5b6aad9a3f{margin-bottom:18px;}
.u-inline-5b9236194b{background:#10b981;border-color:#10b981;}
.u-inline-5e798cd9db{list-style:none;cursor:pointer;}
.u-inline-608586e10d{background:rgba(255,255,255,0.1);color:#fff;border-color:rgba(255,255,255,0.25);}
.u-inline-61286d69bd{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:24px;}
.u-inline-614afdfeb3{padding-right:44px !important;}
.u-inline-62b266a36b{min-height:300px;}
.u-inline-6435a88594{display:grid;grid-template-columns:repeat(auto-fit, minmax(140px, 1fr));gap:12px;margin-top:8px;}
.u-inline-6581ac980a{max-width:220px;overflow:hidden;text-overflow:ellipsis;}
.u-inline-65e3af54b5{flex:1;min-width:240px;}
.u-inline-6650b8308c{min-height:200px;font-family: monospace;}
.u-inline-6749c87a10{margin:4px 0 0 0;}
.u-inline-67cd735ee7{min-height:260px;}
.u-inline-6a8c41db55{color:#666;}
.u-inline-6abc078b20{flex-shrink:0;margin-top:2px;}
.u-inline-6add97efa7{max-width:480px;}
.u-inline-6c002e2180{margin-bottom:6px;}
.u-inline-6c1edda8b7{vertical-align:top;font-size:12px;}
.u-inline-6c78ba1694{display:grid;grid-template-columns:minmax(0,1fr) 110px;gap:10px;}
.u-inline-6c9f9d2560{border:1px solid var(--admin-border,#e2e8f0);border-radius:12px;padding:20px;background:var(--admin-card-bg,#ffffff);box-shadow:0 1px 3px rgba(0,0,0,0.05);}
.u-inline-6e20fb40dc{font-size:0.92rem;color:#334155;line-height:1.8;}
.u-inline-6f145d537e{margin-bottom:18px;display:flex;flex-direction:row;flex-wrap:wrap;gap:10px;align-items:flex-end;}
.u-inline-6f8ae3477e{display:block;margin-top:2px;}
.u-inline-714787533b{gap:14px;}
.u-inline-71577fef0b{font-size:0.72rem;color:#64748b;}
.u-inline-7180243890{width:100%;border:none;background:transparent;outline:none;font-size:1.05rem;font-weight:500;color:#0f172a;}
.u-inline-72088eb607{font-size:0.85rem;color:var(--admin-text,#1e293b);font-weight:600;}
.u-inline-729013516a{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;background:var(--admin-bg);border-radius:6px;border:1px solid var(--admin-border);}
.u-inline-72d6c38e5f{margin-bottom: 12px;}
.u-inline-732d6ab846{padding:8px 12px;border-radius:8px;border:1px solid #cbd5e1;font-size:13px;}
.u-inline-7519b07094{font-size:0.82rem;font-weight:600;color:var(--admin-text,#1e293b);display:inline-flex;align-items:center;gap:7px;background:color-mix(in srgb, var(--admin-primary,#0284c7) 8%, #ffffff);padding:5px 12px;border-radius:6px;border:1px solid color-mix(in srgb, var(--admin-primary,#0284c7) 30%, #cbd5e1);cursor:pointer;}
.u-inline-7561f48274{display:flex;flex-wrap:wrap;gap:16px;margin:14px 0;}
.u-inline-758a887326{font-weight:700;}
.u-inline-76084ee4e5{margin-bottom:0;}
.u-inline-761ba8828b{position:absolute;right:8px;top:50%;transform:translateY(-50%);background:none;border:none;color:#94a3b8;cursor:pointer;padding:6px;display:flex;align-items:center;justify-content:center;}
.u-inline-7623f05545{flex:1;}
.u-inline-783c7afd53{font-weight:600;font-size:13px;color:var(--admin-accent);}
.u-inline-78a7b9be58{font-weight:600;margin-bottom:8px;}
.u-inline-78cead6503{display:flex;gap:8px;align-items:center;}
.u-inline-79a1c5a5db{margin-bottom:16px;}
.u-inline-7a9664ce54{display: flex;gap: 10px;align-items: center;margin-bottom: 8px;}
.u-inline-7c3cfec592{font-size:0.82rem;color:var(--admin-text-muted,#475569);font-weight:500;}
.u-inline-7ca9af90e8{font-size: .84rem;margin-bottom: 14px;}
.u-inline-7ce543f1f8{display:flex;align-items:center;gap:10px;margin-top:12px;}
.u-inline-7dde5e56b3{margin-bottom:20px;}
.u-inline-7de67ad799{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:20px;}
.u-inline-7defd547d2{margin:0;font-size:1.05rem;font-weight:700;display:flex;align-items:center;gap:8px;}
.u-inline-7e30d285d2{display:flex;align-items:center;gap:10px;}
.u-inline-8001b29eb4{font-weight:normal;font-size:0.85em;color:var(--admin-text-muted);}
.u-inline-821081bbf8{height:100%;width:0%;background:#ef4444;transition:all 0.3s ease;}
.u-inline-8233e9f287{width:auto;background:transparent;border:1px solid #cbd5e1;color:#475569;}
.u-inline-837a4c07e9{margin-bottom:24px;border-left:4px solid #d97706;}
.u-inline-85b0fc8a65{display:grid;grid-template-columns:1.2fr 1fr;gap:14px;}
.u-inline-85b4085512{font-size:0.78rem;margin-top:3px;}
.u-inline-86c549d021{font-size:13.5px;display:block;}
.u-inline-87ff6778ab{margin-top:14px;padding-top:12px;border-top:1px solid #f1f5f9;font-size:0.82rem;color:#64748b;line-height:1.4;}
.u-inline-8981e56111{margin-top:0;display:flex;align-items:center;gap:8px;}
.u-inline-8a359a76eb{margin-top:16px;}
.u-inline-8a43589152{border:1px solid var(--admin-border,#e2e8f0);border-radius:12px;padding:24px;margin-bottom:24px;background:var(--admin-card-bg,#ffffff);box-shadow:0 1px 3px rgba(0,0,0,0.05);}
.u-inline-8b8ad782a0{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 12px;background:color-mix(in srgb, var(--admin-primary, #0284c7) 10%, #ffffff);border:1.5px solid var(--admin-primary, #0284c7);border-radius:8px;margin-bottom:14px;}
.u-inline-8b9688e6e0{margin-bottom:24px;}
.u-inline-8bccce3cd1{margin:4px 0 16px 32px;}
.u-inline-8c07d779a6{cursor:pointer;font-weight:600;color:var(--admin-primary, #0284c7);user-select:none;}
.u-inline-8c735c029d{flex:1;justify-content:center;font-weight:600;font-size:0.8rem;padding:7px 8px;display:inline-flex;align-items:center;gap:6px;white-space:nowrap;}
.u-inline-8ca649dc3b{padding:14px 36px;font-size:1.02rem;border-radius:12px;display:inline-flex;align-items:center;gap:10px;}
.u-inline-8cddc29a69{padding:20px;}
.u-inline-8d83117354{background:#e2e8f0;border-radius:4px;padding:2px 6px;font-size:0.75rem;color:#475569;font-weight:600;}
.u-inline-8e39c37b7b{margin:10px 0 2px 20px;padding:0;font-size:0.875rem;line-height:1.65;color:var(--admin-text, #334155);}
.u-inline-8ff9961267{font-family:monospace;}
.u-inline-907d56949b{display:flex;align-items:center;padding:14px 18px;border-bottom:1px solid #e2e8f0;gap:12px;background:#f8fafc;}
.u-inline-92418d845b{font-size:0.82rem;font-weight:500;}
.u-inline-934ef2d866{margin:0;font-size:0.82rem;color:var(--admin-text-muted,#64748b);line-height:1.4;}
.u-inline-9374e84210{margin-top:12px;}
.u-inline-93e9461c0d{font-size:0.78rem;color:var(--admin-text-muted,#64748b);font-weight:600;}
.u-inline-94c3db5540{font-weight:600;font-size:14px;}
.u-inline-980a1847e5{margin:0;cursor:pointer;font-weight:600;font-size:0.8rem;padding:7px 10px;display:inline-flex;align-items:center;gap:6px;white-space:nowrap;}
.u-inline-99a68ab617{color:#9aa4b2;}
.u-inline-9bef318bc9{min-height:200px;}
.u-inline-9d7ab0e223{margin-left: 24px;max-width: 320px;}
.u-inline-9da576af61{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;border-radius:8px;background:color-mix(in srgb, #0284c7 8%, #ffffff);border:1.5px solid #0284c7;box-shadow:0 2px 6px rgba(2,132,199,0.12);}
.u-inline-9dd1207e58{color:#ef4444;}
.u-inline-9e9c073f14{display:flex;align-items:center;gap:12px;padding:10px 18px;text-decoration:none;background:' + (isSel ? '#eff6ff' : 'transparent') + ';border-left:3px solid ' + (isSel ? '#2563eb' : 'transparent') + ';}
.u-inline-9eb125f52f{margin-top:20px;}
.u-inline-9eb536fb16{margin-top:0;font-size:1.05rem;font-weight:700;margin-bottom:14px;}
.u-inline-9ec672a78d{font-weight:700;font-size:0.9rem;color:#0369a1;}
.u-inline-9f398c70f1{display:block;margin-bottom:8px;}
.u-inline-9f7cb1fbb6{margin-top:40px;}
.u-inline-a0f0a7d9e5{display:grid;grid-template-columns: 2fr 1fr;gap: 20px;}
.u-inline-a3a5568692{margin-top:4px;}
.u-inline-a42388f688{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px;}
.u-inline-a43690dc6d{font-size:13px;color:#64748b;margin-bottom:14px;}
.u-inline-a527bac1ee{text-align:right;}
.u-inline-a650a7522f{padding:10px 18px;background:#f1f5f9;border-top:1px solid #e2e8f0;font-size:0.78rem;color:#64748b;display:flex;gap:16px;}
.u-inline-a8022cb6d9{display:flex;flex-wrap:wrap;gap:12px;align-items:center;max-width:560px;}
.u-inline-a82d7062cc{margin-bottom:14px;}
.u-inline-a8712c9256{margin:20px 0 8px;}
.u-inline-a9961251f2{border:1px solid var(--admin-border);border-radius:8px;padding:16px;margin-bottom:8px;}
.u-inline-a9a523b9ef{margin-bottom:16px;display:flex;gap:8px;max-width:420px;}
.u-inline-a9efa5449f{white-space:nowrap;}
.u-inline-aa1820469b{font-weight:600;margin-bottom:8px;display:block;}
.u-inline-aa5e5b184d{color:var(--admin-primary,#0284c7);}
.u-inline-aad4dde478{margin: 12px 0 0;padding: 12px;background: rgba(255,255,255,0.05);border-radius: 8px;overflow-x: auto;color: #e2e8f0;font-family: consolas, monaco, monospace;font-size: 12.5px;}
.u-inline-ab9be0ec4f{display:flex;align-items:center;gap:10px;margin-bottom:18px;}
.u-inline-abed5788ce{color:#94a3b8;margin:0;}
.u-inline-ad45a8dba2{font-weight:800;font-size:16px;color:var(--admin-accent);min-width:20px;}
.u-inline-ae030cdc90{font-size:0.8rem;color:var(--admin-text-muted,#475569);margin-bottom:12px;background:#f8fafc;padding:10px 12px;border-radius:8px;border:1px solid #e2e8f0;line-height:1.45;}
.u-inline-af3fee87a1{margin-bottom:10px;}
.u-inline-af9c75294f{height:6px;width:100%;background:#e2e8f0;border-radius:999px;overflow:hidden;}
.u-inline-afa3d0ea3b{font-size:0.8rem;color:#64748b;}
.u-inline-afaed7b4de{font-size:0.8rem;color:var(--admin-text-muted);margin-bottom:2px;}
.u-inline-afdf6b2045{max-height:380px;overflow-y:auto;padding:8px 0;}
.u-inline-b1ecc496e0{margin-top:8px;}
.u-inline-b3b6c6d715{padding:12px 28px;font-weight:700;font-size:1rem;}
.u-inline-b5b5b4c4bc{font-weight: 700;margin-bottom: 6px;color: #38bdf8;font-family: inherit;}
.u-inline-b6c72f2984{color:#64748b;font-weight:600;}
.u-inline-b741d381f1{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap;}
.u-inline-b7a1536112{text-align:center;margin-top:16px;}
.u-inline-b9071a39d3{color:var(--admin-muted);}
.u-inline-b9bbe540d3{display:flex;gap:8px;}
.u-inline-b9f96fe18b{opacity: 0.85;font-size: 12px;}
.u-inline-ba853ea68c{display:none;margin-top:12px;}
.u-inline-bbb9c7d040{cursor:pointer;font-size:12px;color:#666;}
.u-inline-bbfba05910{max-width:260px;word-break:break-all;}
.u-inline-bea13c7a75{display:flex;justify-content:center;gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:14px;}
.u-inline-bf60e927c2{min-height:140px;font-family: monospace;}
.u-inline-c00ceb2874{border:1px solid var(--admin-border);border-radius:8px;padding:16px;}
.u-inline-c0715b171a{background:#ffffff;border:1px solid #cbd5e1;border-radius:16px;padding:20px 24px;max-width:500px;margin:0 auto 24px auto;text-align:left;box-shadow:0 4px 12px rgba(0,0,0,0.03);}
.u-inline-c0811a5932{color:#1e293b;display:block;margin-bottom:2px;}
.u-inline-c1563b7411{border:1px solid var(--admin-border,#e2e8f0);border-radius:12px;padding:20px;margin-bottom:20px;background:var(--admin-card-bg,#ffffff);box-shadow:0 1px 3px rgba(0,0,0,0.05);}
.u-inline-c18e1e5580{border:1px solid var(--admin-border,#e2e8f0);border-radius:12px;padding:18px;margin-bottom:20px;background:var(--admin-card-bg,#ffffff);box-shadow:0 2px 8px rgba(0,0,0,0.04);}
.u-inline-c1de996030{font-size:0.82rem;font-weight:600;color:var(--admin-text-muted,#64748b);display:inline-flex;align-items:center;gap:6px;background:var(--admin-surface-soft,#f8fafc);padding:5px 10px;border-radius:6px;border:1px solid var(--admin-border,#e2e8f0);}
.u-inline-c23eb2f888{font-size:0.72rem;color:#64748b;font-weight:600;}
.u-inline-c2a25f11a5{display:flex;gap:4px;margin-bottom:6px;}
.u-inline-c2c51f8917{margin-top:14px;background:var(--admin-surface-soft, #f8fafc);border:1px solid var(--admin-border, #e2e8f0);border-radius:6px;padding:10px 14px;}
.u-inline-c2e0f45886{margin-bottom:8px;font-size:0.875rem;}
.u-inline-c35d85373e{margin:0 0 14px;font-size:1.05rem;font-weight:700;color:var(--admin-accent,#2563eb);display:flex;align-items:center;gap:8px;}
.u-inline-c37fe6a935{display:grid;grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));gap:10px;margin-top:6px;}
.u-inline-c44cea58cf{width:76px;height:76px;background:#dcfce7;color:#10b981;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;margin-bottom:20px;box-shadow:0 0 0 8px rgba(16, 185, 129, 0.12);}
.u-inline-c6e9746c81{font-size:0.85rem;color:#475569;line-height:1.5;}
.u-inline-c76ba7ebe2{display:flex;align-items:center;gap:12px;overflow:hidden;max-width:75%;}
.u-inline-c7cac707db{display:flex;justify-content:space-between;margin-bottom:3px;font-weight:600;}
.u-inline-c8224f825d{margin:0 auto 6px;display:block;opacity:0.55;}
.u-inline-c842ae9ef5{overflow:visible;}
.u-inline-c8be1ccba6{display:none;}
.u-inline-c8d67009fe{display:flex;gap:6px;flex-wrap:wrap;}
.u-inline-c90ff0dd8c{margin-top:20px;padding-top:16px;border-top:1px solid var(--admin-border,#e2e8f0);}
.u-inline-c971a09486{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;}
.u-inline-c9fab0a7e2{margin-bottom:16px;display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
.u-inline-ca55bb2c16{font-size:14px;color:var(--admin-text);}
.u-inline-cbc67de98f{grid-column: 1 / -1;margin-top:4px;}
.u-inline-cc19ec9cf7{color:var(--admin-accent,#17999b);font-weight:600;font-size:11px;}
.u-inline-cca6ad4b4f{margin-top:12px;font-weight:600;}
.u-inline-ceb7346533{margin:10px 0 14px;}
.u-inline-cec5a863d9{display:flex;align-items:center;gap:8px;background:var(--admin-surface-soft,#f8fafc);padding:8px 12px;border-radius:8px;border:1px solid var(--admin-border,#e2e8f0);}
.u-inline-d0009063f3{display:grid;grid-template-columns:1fr 140px 2fr 36px;gap:10px;align-items:center;background:color-mix(in srgb, var(--admin-border,#e2e8f0) 25%, transparent);padding:10px 14px;border-radius:8px;border:1px solid var(--admin-border,#e2e8f0);}
.u-inline-d0698c48c3{overflow-x:auto;}
.u-inline-d15aa4f40a{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px;}
.u-inline-d1df8577ab{min-width:36px;padding:6px 10px;}
.u-inline-d2576ac843{display:flex;gap:8px;align-items:center;margin-top:16px;}
.u-inline-d31dcf37c0{border:1px solid var(--admin-border,#e2e8f0);border-radius:10px;padding:18px;margin-bottom:14px;background:var(--admin-surface-soft,#f8fafc);}
.u-inline-d40243f2ec{margin:0 0 14px 18px;line-height:1.8;}
.u-inline-d40eaf045d{margin-top:20px;padding:20px;}
.u-inline-d442f29d01{white-space:nowrap;color:var(--admin-muted);}
.u-inline-d498835cbd{display:flex;flex-direction:column;gap:10px;margin-top:6px;}
.u-inline-d4be37b0b9{display:grid;grid-template-columns: 1fr 1fr;gap: 20px;}
.u-inline-d4e35c613b{margin-top:20px;padding:16px;background:var(--admin-bg-subtle,#f8fafc);border:1px solid var(--admin-border,#e2e8f0);border-radius:8px;}
.u-inline-d5b43342a2{grid-column: 1 / -1;}
.u-inline-d716a45428{font-size:0.78rem;color:#94a3b8;font-style:italic;}
.u-inline-d76ba0dbd2{font-size:0.92rem;font-weight:600;}
.u-inline-d7a4b27f07{border-radius:12px;margin-bottom:24px;font-weight:500;}
.u-inline-d850ac3a7e{display:flex;align-items:flex-start;gap:12px;}
.u-inline-d8a0156797{margin-top:20px;margin-bottom:30px;}
.u-inline-d8a81eac84{margin-top:10px;}
.u-inline-d8c73d8aa0{background:none;border:none;color:currentColor;cursor:pointer;font-size:18px;margin-left:12px;}
.u-inline-d982937dda{margin-bottom:4px;}
.u-inline-d9d85faa60{padding:0 8px;font-weight:600;font-size:0.85rem;color:var(--admin-muted);}
.u-inline-da71aab0cc{font-size:1.2rem;}
.u-inline-dac4fe6c9b{text-align:center;}
.u-inline-dc16df27e2{text-align:center;padding: 12px 0;}
.u-inline-df20dd0984{margin-top:12px;display:flex;gap:12px;align-items:center;}
.u-inline-df7cae6aa0{white-space:nowrap;vertical-align:top;}
.u-inline-df9c7b5690{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px;}
.u-inline-e02c6d0480{display:flex;align-items:center;justify-content:space-between;}
.u-inline-e129d41383{color:var(--admin-danger);}
.u-inline-e1652ceeff{font-size:0.85rem;font-weight:700;text-transform:uppercase;letter-spacing:0.05em;color:#64748b;margin-bottom:12px;}
.u-inline-e27394a4cc{display:flex;flex-wrap:wrap;gap:12px;margin:14px 0;}
.u-inline-e378797d0c{font-size:13px;font-weight:600;}
.u-inline-e3f61041ef{display:flex;align-items:center;gap:8px;}
.u-inline-e40283b01f{font-size:1.65rem;color:#0f172a;margin-bottom:8px;}
.u-inline-e48b05836a{font-size:11px;}
.u-inline-e4ad4a163b{margin-bottom:8px;}
.u-inline-e596099155{font-size:0.875rem;}
.u-inline-e6e3fab9a5{display:grid;grid-template-columns: 1fr 1fr;gap: 20px;margin-top:20px;}
.u-inline-e71ae94b55{font-size:12px;}
.u-inline-e73ebf4146{max-width:220px;}
.u-inline-e7673d9ced{margin-top:18px;}
.u-inline-e906946788{font-size:15px;padding:3px 8px;background:var(--admin-accent-soft,#eef0fe);border-radius:6px;}
.u-inline-e925a44577{font-weight:600;margin-bottom:6px;display:block;}
.u-inline-eb7fb8da4e{margin:0;font-size:1.15rem;font-weight:700;}
.u-inline-ecc48d0b89{font-size:12px;display:flex;gap:6px;align-items:center;color:#ef4444;cursor:pointer;font-weight:600;}
.u-inline-ed54c2d74f{display:grid;grid-template-columns:1.2fr 1.4fr 1.4fr 36px;gap:10px;align-items:center;margin-bottom:10px;}
.u-inline-ee3d7719a8{margin: 0 0 8px 0;}
.u-inline-ef1c305505{display:inline-block;width:12px;height:12px;border-radius:50%;background:var(--live-color-accent, #17999b);}
.u-inline-ef7f355c70{display:flex;align-items:center;gap:12px;background:var(--admin-surface-soft,#f8fafc);padding:10px 14px;border-radius:8px;border:1px dashed var(--admin-border,#cbd5e1);}
.u-inline-f0778f9dce{margin-top:28px;}
.u-inline-f16ce3d7a8{padding:20px;text-align:center;color:#94a3b8;font-size:0.9rem;}
.u-inline-f1b7a56d35{display:flex;gap:8px;margin-bottom:16px;}
.u-inline-f45a3bfb9e{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;justify-content:space-between;margin-bottom:18px;}
.u-inline-f60258483c{margin:0 0 12px 18px;padding:0;}
.u-inline-f67b86e0fb{display:flex;flex-direction:column;gap:8px;}
.u-inline-f6909f80c2{font-size:.82rem;}
.u-inline-f83af69e78{margin-bottom:16px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;}
.u-inline-f86bea4b15{min-height:160px;font-family: monospace;}
.u-inline-f94566b02a{display:flex;gap:8px;margin-bottom:14px;}
.u-inline-fdc4c2f742{background:#f8fafc;border:1px solid #e2e8f0;border-radius:16px;padding:16px 20px;max-width:500px;margin:0 auto 32px auto;text-align:left;}
.u-inline-ff1c0e35f5{font-size:0.95rem;color:#64748b;margin:0 0 24px 0;max-width:540px;margin-left:auto;margin-right:auto;line-height:1.5;}
.u-inline-ffcf89af9c{font-size:13px;display:block;}
.u-inline-ffed13198a{margin-top:auto;display:flex;gap:10px;justify-content:space-between;align-items:center;padding-top:16px;border-top:1px solid #e2e8f0;}
.u-inline-0021310c98{width:100%;height:120px;object-fit:cover;border-radius:8px;}
.u-inline-0cd28ce9ba{display:inline;}
.u-inline-1a91ef9eca{width:80px;}
.u-inline-232f3d8dee{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;background:var(--admin-bg);border:1px solid var(--admin-border);border-radius:8px;text-decoration:none;color:inherit;}
.u-inline-30b9f76a48{padding:4px 10px;font-size:0.78rem;font-weight:600;display:inline-flex;align-items:center;gap:4px;}
.u-inline-58ee86c404{width:100%;margin-bottom:6px;font-size:0.82rem;}
.u-inline-64c12efe40{padding:4px 10px;font-size:0.78rem;font-weight:600;background:#10b981;border-color:#10b981;color:#ffffff;text-decoration:none;display:inline-flex;align-items:center;gap:4px;}
.u-inline-6735d86a52{font-size:0.88rem;padding:6px 10px;}
.u-inline-7fca5bade1{display:inline-block;margin-right:4px;padding:2px 7px;border-radius:4px;font-size:11px;font-weight:700;text-transform:uppercase;text-decoration:none;background:#f1f2f4;color:#9aa0a6;border:1px solid #dadce0;transition:all .15s ease;}
.u-inline-847548d18c{width:55px;font-size:0.82rem;}
.u-inline-8504468b68{width:100%;height:110px;object-fit:cover;border-radius:6px;margin-bottom:8px;}
.u-inline-861256d7a6{margin-top:8px;display:flex;gap:6px;}
.u-inline-893519dbf3{display: inline-flex;align-items: center;justify-content: center;width: 36px;height: 36px;border: 1px solid var(--admin-border, #cbd5e1);border-radius: 6px;background: var(--admin-bg, #f8fafc);flex-shrink: 0;}
.u-inline-8f95f51649{position:absolute;right:0;z-index:10;width:320px;padding:12px;text-align:left;box-shadow:0 8px 24px rgba(16,24,40,.18);}
.u-inline-a512aee2ba{font-weight:600;display:inline-flex;align-items:center;gap:6px;}
.u-inline-ac5d34f7f3{width:50px;font-size:0.82rem;}
.u-inline-bc64d2d1e3{font-size:1.05rem;font-weight:600;}
.u-inline-cb38de4646{width:64px;height:38px;padding:4px;}
.u-inline-d26d79f4c2{width:70px;}
.u-inline-d7a10ee612{position:absolute;right:0;z-index:10;width:260px;padding:12px;text-align:left;box-shadow:0 8px 24px rgba(16,24,40,.18);}
.u-inline-da0ab63f64{display:inline-block;margin-right:4px;padding:2px 7px;border-radius:4px;font-size:11px;font-weight:700;text-transform:uppercase;text-decoration:none;background:#e6f4ea;color:#1e7e34;border:1px solid #a8dab5;transition:all .15s ease;}
.u-inline-e8d4cc3d50{font-size:0.82rem;font-weight:600;}
.u-inline-ec08abfabe{font-size:0.84rem;padding:6px 12px;display:inline-flex;align-items:center;gap:6px;font-weight:600;}
.u-inline-f6bd23a169{font-size:0.82rem;padding:6px 10px;}
.u-inline-0484dc067f{display:inline-block;width:16px;height:16px;background:#2563eb;color:#fff;border-radius:50%;text-align:center;line-height:16px;font-size:10px;font-weight:bold;}
.u-inline-0d855cb4f4{height:200px;background:#0e1621;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.u-inline-136e5b68ed{margin-top:20px;border:1px solid var(--admin-border,#e2e8f0);border-radius:12px;padding:20px;background:var(--admin-card-bg,#ffffff);box-shadow:0 1px 3px rgba(0,0,0,0.03);}
.u-inline-152ccfa629{font-size:20px;color:#1a0dab;line-height:1.3;margin-bottom:4px;word-break:break-word;}
.u-inline-16a33d931a{color:#cbd5e1;font-weight:300;}
.u-inline-21d91b7027{display:block;}
.u-inline-2ce9644849{font-size:12px;color:#64748b;text-transform:lowercase;display:flex;align-items:center;gap:4px;}
.u-inline-43ae67e204{color:#202124;font-size:14px;}
.u-inline-4680c65b6a{padding:14px 16px;}
.u-inline-4774201452{font-size:13px;color:#7f91a4;line-height:1.4;margin-bottom:10px;}
.u-inline-6804b2c0e5{margin-top:10px;display:flex;gap:16px;font-size:0.78rem;color:#64748b;}
.u-inline-7235472cc2{font-weight:700;font-size:15px;margin-bottom:6px;color:#ffffff;line-height:1.3;}
.u-inline-7d8f4cd990{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;border-bottom:1px solid #f1f5f9;padding-bottom:10px;}
.u-inline-94db95e1b0{font-size:0.8rem;}
.u-inline-99bcb5a34b{max-width:440px;background:#182533;color:#ffffff;border-radius:12px;overflow:hidden;box-shadow:0 4px 12px rgba(0,0,0,0.15);font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;}
.u-inline-a359bfa933{display:flex;align-items:center;gap:8px;font-weight:700;font-size:1.05rem;color:var(--admin-ink,#0f172a);}
.u-inline-ab7dab3c79{color:#5f6368;font-size:12px;}
.u-inline-b75b1843b5{font-family:arial,sans-serif;max-width:600px;background:#fff;padding:14px 18px;border-radius:8px;border:1px solid #e2e8f0;}
.u-inline-c0f5c28d5f{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-bottom:16px;font-size:0.88rem;padding:10px 16px;background:var(--admin-card-bg,#ffffff);border:1px solid var(--admin-border,#e2e8f0);border-radius:10px;box-shadow:0 1px 2px rgba(0,0,0,0.03);}
.u-inline-d60c3b2481{font-size:12px;color:#202124;display:flex;align-items:center;gap:6px;margin-bottom:4px;}
.u-inline-f8b0a0e950{font-size:14px;color:#4d5156;line-height:1.5;word-break:break-word;}
/* generated:inline-utilities:end */

/* generated:embedded-styles:start */
/* ============================================================================
   ПРЕМИАЛЬНАЯ МЕДИАБИБЛИОТЕКА (Modern Media Library)
   ============================================================================ */

.media-lib {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

/* Верхняя панель действий и фильтров */
.media-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 18px;
    background: #ffffff;
    border: 1px solid var(--admin-border, #e6e8ec);
    border-radius: 12px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}

.media-toolbar__left {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.media-toolbar__right {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-left: auto;
}

.media-toolbar select,
.media-toolbar input[type="search"] {
    padding: 8px 12px;
    font-size: 13px;
    border-radius: 8px;
    border: 1px solid var(--admin-border, #d0d7de);
    background: #f8fafc;
    color: var(--admin-ink, #0f172a);
    outline: none;
    transition: all 0.2s ease;
}

.media-toolbar select:focus,
.media-toolbar input[type="search"]:focus {
    background: #ffffff;
    border-color: var(--admin-accent, #0f2756);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--admin-accent, #0f2756) 15%, transparent);
}

/* Кнопка выбора режима просмотра (Список / Сетка) */
#view_mode_list.is-active, #view_mode_grid.is-active {
    background: var(--admin-accent, #173a63) !important;
    color: #ffffff !important;
    border-color: var(--admin-accent, #173a63) !important;
}

.files-view-list .media-grid { display: none !important; }
.files-view-grid .files-table { display: none !important; }

/* Кнопка множественного выбора и пакетного удаления */
.media-bulk-bar {
    display: none;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 12px 18px;
    background: #eff6ff;
    border: 1px solid #bfdbfe;
    border-radius: 10px;
    font-size: 13px;
    color: #1e40af;
}

.media-bulk-bar.is-active {
    display: flex;
}

/* Драг-н-Дроп зона загрузки файлов */
.media-upload-drawer {
    display: none;
    padding: 30px 24px;
    background: #f8fafc;
    border: 2px dashed var(--admin-accent, #0f2756);
    border-radius: 14px;
    text-align: center;
    margin-bottom: 20px;
    transition: all 0.2s ease;
}

.media-upload-drawer.is-open,
.media-upload-drawer.is-dragover {
    display: block;
    background: #f0f7ff;
}

.media-dropzone__title {
    font-size: 16px;
    font-weight: 600;
    color: var(--admin-ink, #0f172a);
    margin-bottom: 6px;
}

.media-dropzone__sub {
    font-size: 13px;
    color: var(--admin-muted, #64748b);
    margin-bottom: 16px;
}

/* Сетка карточек медиабиблиотеки (Квадратные плитки) */
.media-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(135px, 1fr));
    gap: 14px;
}

@media (min-width: 1200px) {
    .media-grid {
        grid-template-columns: repeat(auto-fill, minmax(145px, 1fr));
    }
}

.media-card {
    position: relative;
    aspect-ratio: 1 / 1;
    background: #f1f5f9;
    border: 2px solid transparent;
    border-radius: 10px;
    overflow: hidden;
    cursor: pointer;
    user-select: none;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.media-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);
}

.media-card.is-selected {
    border-color: #0284c7 !important;
    box-shadow: 0 0 0 3px rgba(2, 132, 199, 0.3) !important;
}

.media-card__thumb {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.media-card__icon-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    padding: 12px;
    color: var(--admin-muted, #64748b);
    text-align: center;
    background: #e2e8f0;
}

.media-card__ext {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    margin-top: 4px;
    letter-spacing: 0.05em;
}

.media-card__caption {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 6px 8px;
    background: rgba(15, 23, 42, 0.85);
    color: #ffffff;
    font-size: 11px;
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    backdrop-filter: blur(4px);
}

.media-card__check {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #0284c7;
    color: #ffffff;
    display: none;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
    z-index: 5;
}

.media-card.is-selected .media-card__check {
    display: flex;
}

/* Инспекционная панель только на странице /admin/files.
   Не оставлять эти селекторы глобальными: общая медиабиблиотека в footer.php
   использует те же media-modal__* классы для выбора файлов в формах. */
#media_modal {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.6);
    backdrop-filter: blur(8px);
    z-index: 1000;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

#media_modal.is-open {
    display: flex;
    animation: media-fade-in 0.25s ease;
}

@keyframes media-fade-in {
    from { opacity: 0; }
    to { opacity: 1; }
}

#media_modal .media-modal__dialog {
    position: relative;
    display: flex;
    width: 100%;
    max-width: 1000px;
    max-height: 88vh;
    background: #ffffff;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 24px 48px rgba(0, 0, 0, 0.25);
}

@media (max-width: 800px) {
    #media_modal .media-modal__dialog {
        flex-direction: column;
        max-height: 94vh;
        overflow-y: auto;
    }
}

#media_modal .media-modal__preview-side {
    flex: 1.3;
    background: #0f172a;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    position: relative;
    min-height: 320px;
}

#media_modal .media-modal__preview-side img,
#media_modal .media-modal__preview-side video {
    max-width: 100%;
    max-height: 70vh;
    object-fit: contain;
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5);
}

#media_modal .media-modal__details-side {
    flex: 1;
    padding: 28px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    overflow-y: auto;
    background: #ffffff;
}

#media_modal .media-modal__close {
    position: absolute;
    top: 14px;
    right: 14px;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.2);
    color: #ffffff;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
    transition: background 0.2s ease;
}

#media_modal .media-modal__close:hover {
    background: rgba(255, 255, 255, 0.4);
}

#media_modal .media-modal__title {
    font-size: 16px;
    font-weight: 700;
    color: var(--admin-ink, #0f172a);
    margin: 0;
    word-break: break-all;
}

#media_modal .media-modal__meta-list {
    font-size: 13px;
    color: var(--admin-muted, #64748b);
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--admin-border, #e2e8f0);
}

#media_modal .media-modal__field {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

#media_modal .media-modal__field label {
    font-size: 11px;
    font-weight: 700;
    color: var(--admin-muted, #64748b);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

#media_modal .media-modal__input-group {
    display: flex;
    gap: 8px;
}

#media_modal .media-modal__input-group input {
    flex: 1;
    padding: 8px 12px;
    font-size: 13px;
    border-radius: 8px;
    border: 1px solid var(--admin-border, #cbd5e1);
    background: #f8fafc;
}

/* Премиальный дизайн рабочего пространства Конструктора Шапки Pro Max */
.hdr-workspace-header {
    background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
    color: #ffffff;
    border-radius: 16px;
    padding: 20px 24px;
    margin-bottom: 24px;
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.15);
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px;
}
.hdr-workspace-header__title {
    font-size: 1.35rem;
    font-weight: 800;
    margin: 0 0 4px;
    display: flex;
    align-items: center;
    gap: 10px;
}
.hdr-workspace-header__desc {
    font-size: 0.9rem;
    color: #94a3b8;
    margin: 0;
}

/* Предпросмотр шапки */
.hdr-live-preview {
    background: var(--admin-surface, #ffffff);
    border: 1px solid var(--admin-border, #e2e8f0);
    border-radius: 14px;
    padding: 16px 20px;
    margin-bottom: 24px;
    box-shadow: 0 4px 16px rgba(0,0,0,0.03);
}
.hdr-live-preview__head {
    font-size: 0.82rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--admin-text-muted, #64748b);
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.hdr-live-preview__box {
    border: 1px solid var(--admin-border, #e2e8f0);
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(0,0,0,0.04);
}
.hdr-live-preview__top {
    padding: 6px 16px;
    font-size: 0.78rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #173a63;
    color: #ffffff;
    transition: all 0.2s ease;
}
.hdr-live-preview__main {
    padding: 14px 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #ffffff;
    border-top: 1px solid #e2e8f0;
    transition: all 0.2s ease;
}
.hdr-live-preview__logo {
    font-weight: 800;
    font-size: 1.05rem;
    letter-spacing: -0.02em;
    color: var(--admin-text, #0f172a);
}
.hdr-live-preview__nav {
    display: flex;
    flex: 1 1 auto;
    justify-content: flex-end;
    gap: 18px;
    font-size: 0.88rem;
    font-weight: 600;
}
.hdr-live-preview__nav-item {
    color: var(--prev-nav-color, #1e293b);
    text-decoration: none;
    padding: 4px 0;
    position: relative;
    transition: color 0.15s ease;
}
.hdr-live-preview__nav-item.is-active,
.hdr-live-preview__nav-item:hover {
    color: var(--prev-nav-active, #0284c7);
}
.hdr-live-preview__box[data-preview-container="container"] {
    width: min(92%, 980px);
    margin-inline: auto;
}
.hdr-live-preview__box[data-preview-container="floating"] {
    width: min(92%, 980px);
    margin: 8px auto;
    border-radius: 18px;
    box-shadow: 0 14px 34px rgba(15, 23, 42, .14);
}
/* Модульная панель навигации по вкладкам */
.hdr-tabs-nav {
    display: flex;
    gap: 8px;
    background: var(--admin-bg, #f1f5f9);
    padding: 6px;
    border-radius: 12px;
    margin-bottom: 24px;
    flex-wrap: wrap;
}
.hdr-tab-btn {
    flex: 1;
    min-width: 170px;
    padding: 10px 14px;
    border: none;
    background: transparent;
    border-radius: 8px;
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--admin-text-muted, #64748b);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    transition: all 0.2s ease;
}
.hdr-tab-btn:hover {
    color: var(--admin-text, #0f172a);
    background: rgba(255,255,255,0.6);
}
.hdr-tab-btn.is-active {
    background: #ffffff;
    color: var(--admin-accent, #2563eb);
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}

/* Визуальные карточки селекторов */
.hdr-card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 16px;
    margin-top: 12px;
}
.hdr-select-card {
    background: var(--admin-surface, #ffffff);
    border: 2px solid var(--admin-border, #e2e8f0);
    border-radius: 12px;
    padding: 16px;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    gap: 8px;
    transition: all 0.2s ease;
    position: relative;
}
.hdr-select-card:hover {
    border-color: var(--admin-accent-soft, #93c5fd);
    transform: translateY(-2px);
}
.hdr-select-card.is-selected {
    border-color: var(--admin-accent, #2563eb);
    background: linear-gradient(135deg, #eff6ff 0%, #ffffff 100%);
    box-shadow: 0 4px 14px rgba(37,99,235,0.08);
}
.hdr-select-card__title {
    font-weight: 700;
    font-size: 0.98rem;
    color: var(--admin-text, #0f172a);
    display: flex;
    align-items: center;
    gap: 6px;
}
.hdr-select-card__desc {
    font-size: 0.82rem;
    color: var(--admin-text-muted, #64748b);
    line-height: 1.4;
}
.hdr-select-card input[type="radio"] {
    position: absolute;
    top: 14px;
    right: 14px;
}

.hb-inline-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 16px;
    margin-top: 12px;
}
.color-picker-group {
    display: flex;
    align-items: center;
    gap: 10px;
    background: var(--admin-bg, #f8fafc);
    border: 1px solid var(--admin-border, #e2e8f0);
    border-radius: 8px;
    padding: 6px 12px;
}
.color-picker-group input[type="color"] {
    border: none;
    width: 36px;
    height: 30px;
    border-radius: 4px;
    cursor: pointer;
    background: transparent;
}

/* Стили для Telegram Dashboard */
.tg-summary-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 16px;
    margin-bottom: 24px;
}

.tg-summary-card {
    background: var(--admin-surface, #ffffff);
    border: 1px solid var(--admin-border, #e2e8f0);
    border-radius: var(--admin-radius-lg, 12px);
    padding: 16px 20px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.tg-summary-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.06);
}

.tg-summary-card__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--admin-text-muted, #64748b);
}

.tg-summary-card__title {
    display: flex;
    align-items: center;
    gap: 6px;
}

.tg-summary-card__value {
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--admin-text, #0f172a);
    display: flex;
    align-items: center;
    gap: 8px;
}

.tg-status-pending {
    color: var(--admin-warning, #b45309);
    font-size: .92rem;
    line-height: 1.35;
}

/* Поле отложенной публикации: подпись в строку, а не в два этажа. */
.news-schedule { gap: 8px; white-space: nowrap; }
.news-schedule input[type="datetime-local"] {
    width: auto;
    min-width: 208px;
    margin: 0;
    padding: 4px 8px;
    font-size: .875rem;
}

.tg-status-ok {
    color: var(--admin-success, #10b981);
    font-size: .92rem;
    line-height: 1.35;
}

/* Список остановок сторожа: предупреждение, а не ошибка — сайт работает,
   остановилось фоновое. */
.tg-watchdog-list {
    margin: 0 0 6px;
    padding-left: 18px;
    color: var(--admin-warning, #9a6700);
    font-size: .92rem;
    line-height: 1.5;
}

.tg-step {
    border-left: 3px solid color-mix(in srgb, #229ed9 68%, var(--admin-border));
}

.tg-danger-check {
    color: var(--admin-danger, #dc2626);
}

.tg-clear-confirm {
    max-width: 520px;
    margin-top: 8px;
    padding: 12px 14px;
    border: 1px solid color-mix(in srgb, var(--admin-danger, #dc2626) 34%, var(--admin-border));
    border-radius: 9px;
    background: color-mix(in srgb, var(--admin-danger, #dc2626) 6%, var(--admin-surface));
}
.tg-clear-confirm[hidden] { display: none; }
.tg-clear-confirm label { display: block; margin-bottom: 7px; font-size: 13px; font-weight: 600; }
.tg-clear-confirm input { max-width: 180px; text-transform: uppercase; }

.tg-code-box {
    background: rgba(59, 130, 246, 0.06);
    border: 1px dashed rgba(59, 130, 246, 0.3);
    border-radius: 8px;
    padding: 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin: 12px 0 16px;
}

.tg-code-val {
    font-family: var(--font-mono, monospace);
    font-size: 1.35rem;
    font-weight: 700;
    letter-spacing: 2px;
    color: var(--admin-accent, #2563eb);
}

.tg-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    margin-bottom: 8px;
    background: var(--admin-bg, #f8fafc);
    padding: 8px 12px;
    border-radius: 8px;
    border: 1px solid var(--admin-border, #e2e8f0);
}

.tg-toolbar__title {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--admin-text-muted, #64748b);
    margin-right: 6px;
}

.tg-tag-btn {
    background: var(--admin-surface, #ffffff);
    border: 1px solid var(--admin-border, #cbd5e1);
    border-radius: 6px;
    padding: 4px 10px;
    font-size: 0.82rem;
    font-family: inherit;
    color: var(--admin-text, #334155);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    transition: all 0.15s ease;
}

.tg-tag-btn:hover {
    background: var(--admin-accent-soft, #eff6ff);
    border-color: var(--admin-accent, #2563eb);
    color: var(--admin-accent, #2563eb);
}

.tg-tag-btn code {
    font-family: monospace;
    background: rgba(0,0,0,0.05);
    padding: 1px 4px;
    border-radius: 3px;
}

[data-tg-signature-count] { font-variant-numeric: tabular-nums; font-weight: 600; }
[data-tg-signature-count].is-over-limit { color: var(--admin-danger, #dc2626); }

@media (max-width: 640px) {
    .tg-summary-grid { grid-template-columns: 1fr; gap: 10px; }
    .tg-summary-card { padding: 14px 16px; }
    .tg-code-box { align-items: stretch; flex-direction: column; }
    .tg-code-box .btn { width: 100%; justify-content: center; }
    .tg-code-val { overflow-wrap: anywhere; font-size: 1.1rem; letter-spacing: 1px; }
    .tg-toolbar { align-items: stretch; }
    .tg-toolbar__title { flex: 1 0 100%; }
    .tg-tag-btn { flex: 1 1 auto; justify-content: center; }
}

/* UI/UX Pro Max Installer Styling - Responsive 1080px Layout */
:root {
    --inst-bg: #f8fafc;
    --inst-card-bg: #ffffff;
    --inst-border: #e2e8f0;
    --inst-primary: #2563eb;
    --inst-primary-hover: #1d4ed8;
    --inst-success: #10b981;
    --inst-danger: #ef4444;
    --inst-text: #0f172a;
    --inst-muted: #64748b;
}

body.auth-page {
    background: #0b1120;
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px 24px;
    font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    color: #e2e8f0;
}

.install-wrapper {
    width: 92vw;
    max-width: 1080px;
    margin: 0 auto;
}

.install-brand {
    text-align: center;
    margin-bottom: 28px;
    display: flex;
    justify-content: center;
}
.install-brand__logo {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: rgba(255, 255, 255, 0.06);
    padding: 9px 22px;
    border-radius: 999px;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.2);
    border: 1px solid rgba(255, 255, 255, 0.1);
    margin-bottom: 4px;
}
.install-brand__logo svg { color: var(--inst-primary); }
.install-brand__name { font-weight: 800; font-size: 1.18rem; letter-spacing: -0.02em; color: #f1f5f9; }
.install-brand__badge { background: rgba(37, 99, 235, 0.15); color: #60a5fa; font-size: 0.75rem; font-weight: 700; padding: 2px 8px; border-radius: 999px; text-transform: uppercase; }

.install-card,
.auth-card.install-card,
.auth-card--wide.install-card {
    width: 100% !important;
    max-width: 100% !important;
    background: rgba(15, 23, 42, 0.7);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 24px;
    padding: 44px 48px;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.4);
    backdrop-filter: blur(20px);
    position: relative;
    overflow: hidden;
}
.install-card::before,
.install-card::after,
.auth-card::before,
.auth-card::after {
    display: none !important;
    content: none !important;
}

/* Steps Progress Tracker */
.install-stepper {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    margin-bottom: 36px;
    position: relative;
}
.install-step-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    position: relative;
    z-index: 1;
}
.install-step-badge {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: #f1f5f9;
    color: var(--inst-muted);
    font-weight: 700;
    font-size: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid var(--inst-border);
    margin-bottom: 10px;
    transition: all 0.25s ease;
}
.install-step-item.is-done .install-step-badge {
    background: #ecfdf5;
    color: var(--inst-success);
    border-color: var(--inst-success);
}
.install-step-item.is-active .install-step-badge {
    background: var(--inst-primary);
    color: #ffffff;
    border-color: var(--inst-primary);
    box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.18);
}
.install-step-title {
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--inst-muted);
    line-height: 1.25;
}
.install-step-item.is-active .install-step-title {
    color: var(--inst-primary);
    font-weight: 700;
}
.install-step-item.is-done .install-step-title {
    color: var(--inst-text);
}

.install-header {
    text-align: center;
    margin-bottom: 32px;
    padding-bottom: 24px;
    border-bottom: 1px solid #f1f5f9;
}
.install-header__title {
    font-size: 1.65rem;
    font-weight: 800;
    margin: 0 0 8px 0;
    letter-spacing: -0.02em;
    color: #0f172a;
}
.install-header__desc {
    font-size: 0.96rem;
    color: var(--inst-muted);
    margin: 0 auto;
    max-width: 680px;
    line-height: 1.5;
}

/* Two Column Grid for System Checks on Step 1 */
.check-grid-2col {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 28px;
    margin-bottom: 24px;
}

/* Form Fields & Input Wrappers with Icons */
.install-input-wrap {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
}
.install-input-wrap input,
.install-input-wrap select,
.install-input-wrap textarea {
    width: 100%;
    box-sizing: border-box;
    padding: 13px 16px 13px 44px !important;
    font-size: 0.95rem;
    font-weight: 500;
    color: #0f172a;
    background: #f8fafc;
    border: 1px solid #cbd5e1;
    border-radius: 12px;
    outline: none;
    transition: all 0.2s ease;
}
.install-input-wrap input[type="password"] {
    padding-right: 48px !important;
}
.install-input-wrap textarea {
    padding-top: 12px !important;
}
.install-input-wrap input:focus,
.install-input-wrap select:focus,
.install-input-wrap textarea:focus {
    background: #ffffff;
    border-color: #2563eb;
    box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.12);
}
.install-input-icon {
    position: absolute;
    left: 14px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
    color: #94a3b8;
    pointer-events: none;
    transition: color 0.2s ease;
}
.install-input-wrap:focus-within .install-input-icon {
    color: #2563eb;
}

/* System Check Cards */
.check-card-group {
    margin-bottom: 0;
}
.check-card-group__title {
    font-size: 0.88rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--inst-muted);
    margin-bottom: 14px;
    display: flex;
    align-items: center;
    gap: 8px;
}
.check-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 18px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    margin-bottom: 10px;
    transition: background 0.15s ease;
}
.check-item:hover { background: #f1f5f9; }
.check-item__info {
    display: flex;
    align-items: center;
    gap: 14px;
}
.check-item__icon {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    font-size: 0.85rem;
    flex-shrink: 0;
}
.check-item__icon.ok { background: #dcfce7; color: #15803d; }
.check-item__icon.fail { background: #fee2e2; color: #b91c1c; }
.check-item__label { font-weight: 600; font-size: 0.94rem; }
.check-item__hint { font-size: 0.78rem; color: #ef4444; margin-top: 2px; }

.install-card .form-actions {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-top: 36px;
    padding-top: 24px;
    border-top: 1px solid #f1f5f9;
}
.install-card .form-actions .btn {
    flex: 1 1 auto;
    min-height: 50px;
    font-size: 1rem;
    font-weight: 700;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    cursor: pointer;
    transition: all 0.2s ease;
}
.install-card .btn--primary,
.install-card .btn--primary:visited {
    background: var(--inst-primary);
    border: 1px solid var(--inst-primary);
    color: #ffffff;
    box-shadow: 0 4px 14px rgba(37, 99, 235, 0.25);
}
.install-card .btn--primary:hover {
    background: var(--inst-primary-hover);
    border-color: var(--inst-primary-hover);
    color: #ffffff;
    box-shadow: 0 6px 18px rgba(37, 99, 235, 0.35);
    transform: translateY(-1px);
}
.install-card .btn:active { transform: translateY(1px); }
.install-card .btn:disabled,
.install-card .btn[aria-disabled="true"] { opacity: 0.6; cursor: not-allowed; transform: none; box-shadow: none; }

/* Info Callout */
.install-callout {
    background: #eff6ff;
    border: 1px solid #bfdbfe;
    border-radius: 14px;
    padding: 16px 20px;
    margin-bottom: 28px;
    font-size: 0.92rem;
    color: #1e40af;
    display: flex;
    gap: 14px;
    line-height: 1.5;
}
.install-callout svg { flex-shrink: 0; color: #2563eb; margin-top: 2px; }

/* Backward Compatibility CSS Hook for Tests */
.install-steps { display: none; }
.install-check { display: none; }

@media (max-width: 860px) {
    .check-grid-2col,
    .form-grid-2col,
    .u-inline-a0f0a7d9e5,
    .u-inline-d4be37b0b9,
    .u-inline-e6e3fab9a5 {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
    }
    .install-card { padding: 32px 24px; }
}

@media (max-width: 640px) {
    .install-wrapper { width: 96vw; }
    .install-card { padding: 24px 18px; }
    .install-stepper { gap: 8px; }
    .install-step-badge { width: 36px; height: 36px; font-size: 0.85rem; }
    .install-step-title { font-size: 0.72rem; }
    .install-card .form-actions { flex-direction: column; }
    .install-card .form-actions .btn { width: 100%; }
}
/* generated:embedded-styles:end */

@media (pointer: coarse) {
    .admin-tbtn,
    .admin-user__btn,
    .art-editor__btn,
    .media-modal__close,
    .btn--icon-only,
    .menu-node__move,
    .fb-move {
        min-width: 44px;
        min-height: 44px;
    }
}

/* Centralized state and dynamic-preview helpers. */
.is-hidden {
    display: none !important;
}

.audit-severity {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
}

.audit-severity--critical {
    color: #b42318;
    background: #fde8e8;
}

.audit-severity--warning {
    color: #93540b;
    background: #fef0c7;
}

.publication-status-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
}

.publication-status-dot--published {
    background: #10b981;
}

.publication-status-dot--draft {
    background: #f59e0b;
}

.sidebar-cover-image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.sidebar-cover-placeholder {
    display: block;
    padding: 20px;
    color: var(--admin-text-muted, #64748b);
    text-align: center;
}

.sidebar-cover-clear {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 10px;
    font-size: .8rem;
}
/* Кнопка не исчезает, когда обложки нет: пропадающий элемент управления
   читается как «функции удаления здесь не предусмотрено». Вместо этого она
   гаснет и не нажимается. */
.sidebar-cover-clear[disabled] {
    opacity: .45;
    cursor: not-allowed;
}
/* Три кнопки в одну строку в боковой колонке не помещались: «Удалить»
   вылезала за карточку на 138px. Разрешаем перенос и даём кнопкам сжиматься. */
.sidebar-cover-actions {
    flex-wrap: wrap;
}

.admin-progress__bar {
    width: var(--progress-width, 0%);
}

.admin-theme-card {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 16px;
    cursor: pointer;
    background: var(--admin-card-bg, #fff);
    border: 2px solid var(--admin-border, #cbd5e1);
    border-radius: 12px;
    transition: border-color .15s ease, box-shadow .15s ease;
}

.admin-theme-card.is-active {
    border-color: var(--admin-primary, #0284c7);
    box-shadow: 0 4px 14px rgba(2, 132, 199, .15);
}

.admin-theme-swatch {
    width: 20px;
    height: 20px;
    border: 1px solid rgba(0, 0, 0, .15);
    border-radius: 50%;
    background: var(--swatch-color, transparent);
}

.typo-preview__sample {
    font-size: var(--preview-font-size, 16px);
    line-height: 1.15;
}

.is-copy-success {
    color: #10b981;
    border-color: #10b981;
}

.clipboard-fallback {
    position: fixed;
    top: -9999px;
    left: -9999px;
}

.has-modal-open {
    overflow: hidden;
}

[data-seo-title-count],
[data-seo-desc-count] {
    color: #64748b;
}

[data-seo-title-count].is-valid,
[data-seo-desc-count].is-valid {
    color: #10b981;
}

[data-seo-title-count].is-invalid,
[data-seo-desc-count].is-invalid {
    color: #ef4444;
}

.admin-cmd-palette-overlay.is-open {
    display: flex;
}

.focal-field__pin {
    left: var(--focal-x, 50%);
    top: var(--focal-y, 50%);
}

.lang-filter-link {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: var(--admin-text, #334155);
    font-weight: 500;
    text-decoration: none;
}

.lang-filter-link.is-active {
    color: var(--admin-primary, #2563eb);
    font-weight: 700;
}

.lang-filter-count {
    padding: 1px 6px;
    color: #64748b;
    font-size: .75rem;
    font-weight: 600;
    background: #f1f5f9;
    border-radius: 10px;
}

.lang-filter-link.is-active .lang-filter-count {
    color: #2563eb;
    background: #eff6ff;
}

.seo-social-image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.seo-social-placeholder {
    display: inline-block;
    color: #6c7883;
    font-size: 13px;
}

.csrf-honeypot {
    position: absolute;
    top: -9999px;
    left: -9999px;
}

[hidden] {
    display: none !important;
}

/* ============================================================================
   РАЗДЕЛ: Файловый репозиторий (/admin/repository)
   ============================================================================ */

.repo-subnav {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 20px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--admin-border, #e2e8f0);
}

.repo-subnav__item {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px;
    border-radius: 8px;
    color: var(--admin-text-muted, #64748b);
    font-weight: 500;
    font-size: 14px;
    text-decoration: none;
    transition: all 0.2s ease;
    background: transparent;
}

.repo-subnav__item:hover {
    color: var(--admin-primary, #2563eb);
    background: var(--admin-hover-bg, #f1f5f9);
}

.repo-subnav__item.is-active {
    color: var(--admin-primary, #2563eb);
    background: color-mix(in srgb, var(--admin-primary, #2563eb) 12%, transparent);
    font-weight: 600;
}

.repo-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 16px;
    margin-bottom: 24px;
}

.repo-stat-card {
    background: var(--admin-card-bg, #ffffff);
    border: 1px solid var(--admin-border, #e2e8f0);
    border-radius: 12px;
    padding: 16px 20px;
    display: flex;
    align-items: center;
    gap: 16px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.repo-stat-card__icon {
    width: 44px;
    height: 44px;
    border-radius: 10px;
    display: grid;
    place-items: center;
    background: color-mix(in srgb, var(--admin-primary, #2563eb) 10%, transparent);
    color: var(--admin-primary, #2563eb);
    font-size: 20px;
    flex-shrink: 0;
}

.repo-stat-card--warning .repo-stat-card__icon {
    background: color-mix(in srgb, #f59e0b 15%, transparent);
    color: #d97706;
}

.repo-stat-card__val {
    font-size: 22px;
    font-weight: 700;
    line-height: 1.2;
    color: var(--admin-text, #0f172a);
}

.repo-stat-card__label {
    font-size: 13px;
    color: var(--admin-text-muted, #64748b);
    margin-top: 2px;
}

.repo-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 20px;
    flex-wrap: wrap;
}

.repo-search-form {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1;
    max-width: 480px;
}

.repo-search-form input {
    flex: 1;
}

.repo-popover {
    position: relative;
    display: inline-block;
}

.repo-popover__panel {
    position: absolute;
    right: 0;
    top: calc(100% + 6px);
    z-index: 999;
    width: 320px;
    padding: 16px;
    background: var(--admin-card-bg, #ffffff);
    border: 1px solid var(--admin-border, #e2e8f0);
    border-radius: 12px;
    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.15);
}

.repo-category-indent {
    display: inline-block;
    width: 20px;
    color: var(--admin-text-muted, #94a3b8);
    font-family: monospace;
}

[data-admin-theme="dark_emerald"] .repo-subnav__item {
    color: #94a3b8;
}
[data-admin-theme="dark_emerald"] .repo-subnav__item:hover {
    color: #34d399;
    background: #1e293b;
}
[data-admin-theme="dark_emerald"] .repo-subnav__item.is-active {
    color: #34d399;
    background: color-mix(in srgb, #10b981 18%, transparent);
}
[data-admin-theme="dark_emerald"] .repo-stat-card {
    background: #1e293b;
    border-color: #334155;
}
[data-admin-theme="dark_emerald"] .repo-stat-card__val {
    color: #f8fafc;
}
[data-admin-theme="dark_emerald"] .repo-popover__panel {
    background: #1e293b;
    border-color: #334155;
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.4);
}
.translation-create-form { display: inline; margin: 0; }

/* Единый выбор локальных Tabler Icons. */
.icon,
.icon-tabler {
    display: inline-block;
    flex: 0 0 auto;
    vertical-align: -0.125em;
}
.tabler-icon-field__control {
    display: grid;
    grid-template-columns: 44px minmax(120px, 1fr) auto 40px;
    gap: 8px;
    align-items: stretch;
}
.tabler-icon-field__preview {
    display: grid;
    place-items: center;
    min-height: 40px;
    color: var(--admin-accent, #2271b1);
    border: 1px solid var(--admin-border, #dce2ea);
    border-radius: var(--admin-radius-sm, 8px);
    background: var(--admin-surface-soft, #f8fafc);
}
.tabler-icon-field__control input { min-width: 0; }
.tabler-icon-field__choose { white-space: nowrap; }
.tabler-icon-field__clear { padding-inline: 9px; }
.tabler-picker {
    position: fixed;
    inset: 0;
    z-index: 10050;
    display: grid;
    place-items: center;
    padding: 24px;
    background: rgba(15, 23, 42, 0.58);
    backdrop-filter: blur(3px);
}
.tabler-picker[hidden] { display: none; }
.tabler-picker__dialog {
    display: grid;
    grid-template-rows: auto auto minmax(220px, 1fr) auto;
    width: min(920px, 100%);
    max-height: min(760px, calc(100vh - 48px));
    overflow: hidden;
    color: var(--admin-text, #172033);
    background: var(--admin-card-bg, #fff);
    border: 1px solid var(--admin-border, #dce2ea);
    border-radius: 16px;
    box-shadow: 0 28px 80px rgba(15, 23, 42, 0.28);
}
.tabler-picker__head,
.tabler-picker__foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 16px 18px;
}
.tabler-picker__head { border-bottom: 1px solid var(--admin-border, #dce2ea); }
.tabler-picker__head > div { display: grid; gap: 2px; }
.tabler-picker__head span,
.tabler-picker__foot span { color: var(--admin-muted, #64748b); font-size: 12px; }
.tabler-picker__foot { border-top: 1px solid var(--admin-border, #dce2ea); }
.tabler-picker__search {
    position: relative;
    padding: 14px 18px;
    border-bottom: 1px solid var(--admin-border, #dce2ea);
}
.tabler-picker__search > svg {
    position: absolute;
    top: 50%;
    left: 32px;
    color: var(--admin-muted, #64748b);
    transform: translateY(-50%);
    pointer-events: none;
}
.tabler-picker__search input { width: 100%; padding-left: 42px; }
.tabler-picker__results {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(122px, 1fr));
    align-content: start;
    gap: 8px;
    padding: 16px 18px;
    overflow: auto;
}
.tabler-picker__item {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    gap: 8px;
    align-items: center;
    min-height: 48px;
    padding: 8px;
    color: inherit;
    text-align: left;
    background: var(--admin-surface-soft, #f8fafc);
    border: 1px solid transparent;
    border-radius: 9px;
    cursor: pointer;
}
.tabler-picker__item:hover,
.tabler-picker__item:focus-visible {
    color: var(--admin-accent, #2271b1);
    border-color: currentColor;
    outline: none;
}
.tabler-picker__item span {
    overflow: hidden;
    font-size: 11px;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.tabler-picker__status {
    grid-column: 1 / -1;
    padding: 40px 16px;
    color: var(--admin-muted, #64748b);
    text-align: center;
}
.tabler-picker__status--error { color: var(--admin-danger, #b42318); }
body.has-icon-picker { overflow: hidden; }

@media (max-width: 640px) {
    .tabler-icon-field__control {
        grid-template-columns: 44px minmax(0, 1fr) 40px;
    }
    .tabler-icon-field__choose span { display: none; }
    .tabler-icon-field__choose { padding-inline: 10px; }
    .tabler-picker { padding: 0; }
    .tabler-picker__dialog { width: 100%; max-height: 100vh; height: 100vh; border-radius: 0; }
    .tabler-picker__results { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Подключение приложения-аутентификатора: QR слева, шаги справа. */
.totp-setup { display: flex; gap: 24px; flex-wrap: wrap; align-items: flex-start; margin-bottom: 16px; }
.totp-setup__qr { background: #fff; padding: 12px; border: 1px solid var(--admin-border, #e2e8f0); border-radius: 12px; }
.totp-setup__qr svg { display: block; }

/* Напоминания редактору: свёрнутая полоса над формой. Не тревога и не ошибка —
   спокойный тон, потому что материал сохраняется и без этих пунктов. */
.content-checklist {
    margin-bottom: 16px;
    border: 1px solid var(--admin-border, #e2e8f0);
    border-radius: 10px;
    background: var(--admin-surface, #fff);
    overflow: hidden;
}
.content-checklist__head {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    font-size: 13px;
    font-weight: 600;
    color: var(--admin-muted, #6b7280);
}
.content-checklist__head svg { flex: none; }
.content-checklist__toggle {
    margin-inline-start: auto;
    border: 0;
    background: none;
    padding: 2px 4px;
    font: inherit;
    font-weight: 600;
    color: var(--admin-accent, #2563eb);
    cursor: pointer;
}
.content-checklist__list {
    margin: 0;
    padding: 0 14px 12px;
    list-style: none;
    display: grid;
    gap: 8px;
}
.content-checklist__item {
    display: grid;
    gap: 2px;
    font-size: 13px;
    line-height: 1.45;
    padding-inline-start: 10px;
    border-inline-start: 2px solid var(--admin-border, #e2e8f0);
}
.content-checklist__item strong { font-weight: 600; }
.content-checklist__item span { color: var(--admin-muted, #6b7280); }

/* Лид новости: переключаемые предпросмотры тех мест, куда он попадёт. */
.lead-previews {
    margin-top: 12px;
    border: 1px solid var(--admin-border, #e2e8f0);
    border-radius: 10px;
    overflow: hidden;
    background: var(--admin-surface, #fff);
}
.lead-previews__tabs { display: flex; gap: 4px; padding: 6px; background: var(--admin-bg, #f8fafc); }
.lead-previews__tab {
    border: 0;
    border-radius: 7px;
    padding: 7px 12px;
    background: transparent;
    color: var(--admin-muted, #6b7280);
    font: inherit;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
}
.lead-previews__tab.is-active { background: var(--admin-surface, #fff); color: var(--admin-text, #111827); box-shadow: 0 1px 3px rgba(15,23,42,.1); }
.lead-previews__panel { padding: 14px 16px; font-size: 13px; line-height: 1.55; }
.lead-previews__panel[hidden] { display: none; }
.lead-previews__panel > strong,
.lead-previews__panel > span { display: block; }
.lead-previews__panel > strong { margin-bottom: 5px; font-size: 14px; }
.lead-previews__panel > span { color: var(--admin-muted, #6b7280); }
.lead-previews__panel [data-lead-preview-telegram] :first-child { margin-top: 0; }
.lead-previews__panel [data-lead-preview-telegram] :last-child { margin-bottom: 0; }
.article-media-dialog[hidden] { display: none !important; }
body.article-media-dialog-open { overflow: hidden; }
body.article-media-dialog-open .media-modal { z-index: 10080; }
.article-media-dialog {
    position: fixed;
    inset: 0;
    z-index: 10050;
    display: grid;
    place-items: center;
    padding: 24px;
}
.article-media-dialog__backdrop {
    position: absolute;
    inset: 0;
    border: 0;
    background: rgba(8, 22, 40, .68);
    backdrop-filter: blur(5px);
}
.article-media-dialog__panel {
    position: relative;
    display: flex;
    flex-direction: column;
    width: min(880px, calc(100vw - 32px));
    max-height: min(820px, calc(100vh - 32px));
    overflow: hidden;
    border: 1px solid var(--admin-border, #dbe3ea);
    border-radius: 20px;
    background: var(--admin-surface, #fff);
    color: var(--admin-text, #17243a);
    box-shadow: 0 32px 80px rgba(5, 20, 38, .32);
}
.article-media-dialog__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    padding: 22px 24px 17px;
    border-bottom: 1px solid var(--admin-border, #dbe3ea);
}
.article-media-dialog__eyebrow {
    display: block;
    margin-bottom: 4px;
    color: var(--admin-primary, #0d9488);
    font-size: .7rem;
    font-weight: 800;
    letter-spacing: .09em;
    text-transform: uppercase;
}
.article-media-dialog__head h2 { margin: 0; font-size: 1.35rem; line-height: 1.2; }
.article-media-dialog__close {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    flex: none;
    padding: 0;
    border: 1px solid var(--admin-border, #dbe3ea);
    border-radius: 11px;
    background: var(--admin-bg, #f6f8fa);
    color: var(--admin-text-muted, #64748b);
    font-size: 1.4rem;
    cursor: pointer;
}
.article-media-dialog__tabs {
    display: flex;
    gap: 6px;
    padding: 13px 24px 0;
}
.article-media-dialog__tabs button {
    min-height: 38px;
    padding: 0 15px;
    border: 1px solid transparent;
    border-radius: 10px;
    background: transparent;
    color: var(--admin-text-muted, #64748b);
    font: inherit;
    font-size: .86rem;
    font-weight: 700;
    cursor: pointer;
}
.article-media-dialog__tabs button.is-active {
    border-color: color-mix(in srgb, var(--admin-primary, #0d9488) 24%, transparent);
    background: color-mix(in srgb, var(--admin-primary, #0d9488) 10%, var(--admin-surface, #fff));
    color: var(--admin-primary, #0d9488);
}
.article-media-dialog__body { padding: 20px 24px 24px; overflow-y: auto; }
.article-media-dialog__pane { display: none; }
.article-media-dialog__pane.is-active { display: grid; gap: 18px; }
.article-media-dialog__fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; }
.article-media-dialog__field { display: grid; gap: 7px; min-width: 0; }
.article-media-dialog__field--wide { grid-column: 1 / -1; }
.article-media-dialog__field > span {
    color: var(--admin-text, #17243a);
    font-size: .78rem;
    font-weight: 700;
}
.article-media-dialog__field > span b { color: #dc4c64; font-size: .65rem; text-transform: uppercase; }
.article-media-dialog__field input,
.article-media-dialog__field textarea,
.article-media-dialog__field select {
    width: 100%;
    min-height: 42px;
    padding: 9px 11px;
    border: 1px solid var(--admin-border, #dbe3ea);
    border-radius: 10px;
    background: var(--admin-bg, #f8fafc);
    color: var(--admin-text, #17243a);
    font: inherit;
    font-size: .86rem;
}
.article-media-dialog__field textarea { resize: vertical; }
.article-media-dialog__field input:focus,
.article-media-dialog__field textarea:focus,
.article-media-dialog__field select:focus {
    outline: 2px solid color-mix(in srgb, var(--admin-primary, #0d9488) 30%, transparent);
    border-color: var(--admin-primary, #0d9488);
}
.article-media-dialog__pickrow { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
.article-media-dialog__pickrow button {
    padding: 0 15px;
    border: 0;
    border-radius: 10px;
    background: var(--admin-primary, #0d9488);
    color: #fff;
    font: inherit;
    font-size: .8rem;
    font-weight: 700;
    cursor: pointer;
}
.article-media-dialog__preview {
    min-height: 112px;
    padding: 15px;
    border: 1px dashed var(--admin-border, #dbe3ea);
    border-radius: 14px;
    background: var(--admin-bg, #f8fafc);
    color: var(--admin-text-muted, #64748b);
    font-size: .82rem;
}
.article-media-dialog__preview--image figure { margin: 0; }
.article-media-dialog__preview--image img {
    display: block;
    width: 100%;
    max-height: 300px;
    object-fit: contain;
    border-radius: 10px;
    background: #e8edf1;
}
.article-media-dialog__preview--image figcaption { padding-top: 10px; color: var(--admin-text, #17243a); }
.article-media-dialog__preview--image figcaption span { color: var(--admin-text-muted, #64748b); }
.article-media-dialog__hint { margin: -4px 0 0; color: var(--admin-text-muted, #64748b); font-size: .78rem; }
.article-media-dialog__embed-card {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr);
    gap: 13px;
    align-items: center;
    min-height: 86px;
    padding: 13px;
    border: 1px solid var(--admin-border, #dbe3ea);
    border-inline-start: 4px solid #64748b;
    border-radius: 12px;
    background: var(--admin-surface, #fff);
}
.article-media-dialog__embed-card > strong {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border-radius: 12px;
    background: #eef2f6;
    color: #29445f;
    font-size: 1.05rem;
}
.article-media-dialog__embed-card > span { display: grid; gap: 2px; min-width: 0; }
.article-media-dialog__embed-card b { color: var(--admin-text, #17243a); }
.article-media-dialog__embed-card small { color: var(--admin-text-muted, #64748b); }
.article-media-dialog__embed-card em { overflow: hidden; color: var(--admin-text-muted, #64748b); font-size: .7rem; font-style: normal; text-overflow: ellipsis; white-space: nowrap; }
.article-media-dialog__embed-card.is-youtube { border-inline-start-color: #e62117; }
.article-media-dialog__embed-card.is-telegram { border-inline-start-color: #229ed9; }
.article-media-dialog__embed-card.is-instagram { border-inline-start-color: #d62976; }
.article-media-dialog__embed-card.is-facebook { border-inline-start-color: #1877f2; }
.article-media-dialog__status { display: none; margin: 16px 0 0; padding: 10px 12px; border-radius: 9px; background: #fff1f2; color: #be123c; font-size: .8rem; }
.article-media-dialog__status.is-visible { display: block; }
.article-media-dialog__foot {
    display: flex;
    justify-content: flex-end;
    gap: 9px;
    padding: 16px 24px;
    border-top: 1px solid var(--admin-border, #dbe3ea);
    background: var(--admin-bg, #f8fafc);
}
.article-media-dialog__foot button { min-height: 40px; padding: 0 17px; border-radius: 10px; font: inherit; font-size: .82rem; font-weight: 700; cursor: pointer; }
.article-media-dialog__cancel { border: 1px solid var(--admin-border, #dbe3ea); background: var(--admin-surface, #fff); color: var(--admin-text, #17243a); }
.article-media-dialog__submit { border: 1px solid var(--admin-primary, #0d9488); background: var(--admin-primary, #0d9488); color: #fff; }
@media (max-width: 620px) {
    .article-media-dialog { padding: 8px; }
    .article-media-dialog__panel { width: calc(100vw - 16px); max-height: calc(100vh - 16px); border-radius: 15px; }
    .article-media-dialog__head, .article-media-dialog__body, .article-media-dialog__foot { padding-inline: 16px; }
    .article-media-dialog__tabs { padding-inline: 16px; }
    .article-media-dialog__fields { grid-template-columns: 1fr; }
    .article-media-dialog__field--wide { grid-column: auto; }
    .article-media-dialog__pickrow { grid-template-columns: 1fr; }
    .article-media-dialog__pickrow button { min-height: 40px; }
}

/* ============================================================================
   Чистый дизайн админ-панели (Clean Flat Admin Design Overrides)
   - Исправление и выравнивание топбара
   - Уменьшение радиусов всех блоков и элементов до 6px / 8px
   - Удаление градиентов с сайдбара и шапки
   ============================================================================ */

/* 1. Плоский тёмный сайдбар без градиентов и свечений */
.admin-sidebar,
.admin-sidebar__logo,
.admin-brand,
.admin-sidebar-header {
    background: var(--admin-sidebar-bg, #0f172a) !important;
    background-image: none !important;
    box-shadow: none !important;
}

.admin-nav-item {
    border-radius: 6px !important;
    transition: background-color 0.15s ease, color 0.15s ease !important;
}

.admin-nav-item:hover {
    background: var(--admin-sidebar-hover, #1e293b) !important;
    background-image: none !important;
}

.admin-nav-item.is-active {
    background: var(--admin-sidebar-active-bg, #2563eb) !important;
    background-image: none !important;
    border-radius: 6px !important;
    box-shadow: none !important;
}

/* 2. Чистая плоская верхняя панель (Topbar) */
.admin-topbar {
    background: var(--admin-topbar-bg, #0f172a) !important;
    background-image: none !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
    box-shadow: none !important;
}

.admin-topbar__logo {
    border-radius: 6px !important;
    box-shadow: none !important;
}

.admin-tbtn {
    border-radius: 6px !important;
    box-shadow: none !important;
}

.admin-tbtn--primary {
    box-shadow: none !important;
}

.admin-topbar input,
.admin-topbar select,
.admin-topbar .form-control,
.admin-user__avatar {
    border-radius: 6px !important;
}

.admin-menu__list,
.admin-user__menu {
    border-radius: 8px !important;
    border: 1px solid var(--admin-border, #cbd5e1) !important;
    box-shadow: 0 10px 25px -5px rgba(15, 23, 42, 0.1) !important;
}

.admin-user__link {
    border-radius: 5px !important;
}

/* 3. Оптимизированные уменьшенные радиусы для всех блоков и элементов */
.stat-card,
.admin-card,
.form-card,
.hb-behavior-card,
.fb-card,
.preset-card,
.design-preset,
.revision-item,
.audit-item,
.block-list-item,
.menu-node__inner,
.panel,
.repeater-row,
.fb-grid > .repeater-row,
.sidebar-cover-preview,
.install-card,
.totp-setup__qr,
.form-section,
.fb-palette,
.hb-palette,
.design-card,
.design-section,
.hdr-workspace-header,
.article-media-dialog__panel,
.article-media-dialog__embed-card,
[class*="u-inline-"] {
    border-radius: 6px !important;
}

.btn,
.btn-primary,
.btn-secondary,
.btn-outline,
.btn-danger,
.form-control,
.form-select,
input[type="text"],
input[type="email"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="url"],
textarea,
select,
.badge,
.tag,
.chip,
.fb-card__badge {
    border-radius: 6px !important;
}

/* 4. Отключение пятнистых фоновых бликов на карточках и полях ввода */
.stat-card::before, .design-card::before, .hb-behavior-card::before, .fb-card::before,
.preset-card::before, .form-card::before, .design-preset::before, .revision-item::before,
.audit-item::before, .block-list-item::before, .menu-node__inner::before, .btn::before {
    display: none !important;
}

.admin-main input[type="text"]:hover, .admin-main input[type="email"]:hover,
.admin-main input[type="password"]:hover, .admin-main input[type="search"]:hover,
.admin-main textarea:hover, .admin-main select:hover,
.admin-main input[type="text"]:focus, .admin-main input[type="email"]:focus,
.admin-main input[type="password"]:focus, .admin-main input[type="search"]:focus,
.admin-main textarea:focus, .admin-main select:focus {
    background-image: none !important;
}

/* --- Заметный переключатель автопубикации в соцсетях в нижней панели --- */
.news-social-toggle {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 6px 14px !important;
    border-radius: 6px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    background: #eff6ff !important;
    border: 1px solid #93c5fd !important;
    color: #1d4ed8 !important;
    box-shadow: 0 1px 3px rgba(37, 99, 235, 0.12) !important;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
    user-select: none !important;
}

.news-social-toggle:hover {
    background: #dbeafe !important;
    border-color: #60a5fa !important;
    color: #1e40af !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 10px rgba(37, 99, 235, 0.18) !important;
}

.news-social-toggle input[type="checkbox"] {
    width: 16px !important;
    height: 16px !important;
    margin: 0 !important;
    accent-color: #2563eb !important;
    cursor: pointer !important;
}

.news-social-toggle__icon {
    display: inline-flex !important;
    align-items: center !important;
    color: #2563eb !important;
}

.news-social-toggle:has(input:checked) {
    background: #2563eb !important;
    border-color: #1d4ed8 !important;
    color: #ffffff !important;
    box-shadow: 0 4px 14px rgba(37, 99, 235, 0.35) !important;
}

.news-social-toggle:has(input:checked) .news-social-toggle__icon {
    color: #ffffff !important;
}

/* ============================================================================
   Единая типографика и пропорции интерфейса админ-панели (Enterprise Scale)
   ============================================================================ */

/* 1. Базовый шрифт 14px, комфортный межстрочный интервал и чёткий цвет */
body, body.admin-body {
    font-size: 14px !important;
    line-height: 1.5 !important;
    color: #1e293b !important;
}

/* 2. Строгая иерархия заголовков */
.admin-main h1, .admin-page-title, h1 {
    font-size: 20px !important;
    line-height: 1.3 !important;
    font-weight: 700 !important;
    color: #0f172a !important;
    letter-spacing: -0.01em !important;
}
.admin-main h2, h2 {
    font-size: 16.5px !important;
    line-height: 1.35 !important;
    font-weight: 700 !important;
    color: #0f172a !important;
}
.admin-main h3, h3 {
    font-size: 14.5px !important;
    line-height: 1.4 !important;
    font-weight: 600 !important;
    color: #1e293b !important;
}
.admin-main h4, h4 {
    font-size: 13.5px !important;
    line-height: 1.4 !important;
    font-weight: 600 !important;
    color: #334155 !important;
}

/* 3. Таблицы: контрастные заголовки колонок, читаемые ячейки */
.admin-table th, table.table th, .table th {
    font-size: 12.5px !important;
    font-weight: 700 !important;
    letter-spacing: 0.03em !important;
    text-transform: uppercase !important;
    padding: 12px 16px !important;
    color: #475569 !important;
    background-color: #f8fafc !important;
    border-bottom: 1px solid #e2e8f0 !important;
}

.admin-table td, table.table td, .table td {
    font-size: 13.5px !important;
    padding: 12px 16px !important;
    line-height: 1.5 !important;
    color: #1e293b !important;
    border-bottom: 1px solid #f1f5f9 !important;
}

.admin-table td a, table.table td a, .table td a {
    font-size: 13.5px !important;
    font-weight: 600 !important;
    color: #2563eb !important;
}

/* 4. Поля форм, селекты, лейблы и подсказки */
.filters-panel input, .filters-panel select,
.admin-filters input, .admin-filters select,
.admin-main input[type="text"], .admin-main input[type="search"],
.admin-main input[type="email"], .admin-main input[type="password"],
.admin-main input[type="number"], .admin-main input[type="url"],
.admin-main select {
    font-size: 13.5px !important;
    height: 38px !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 6px !important;
    background-color: #ffffff !important;
    color: #0f172a !important;
    padding: 0 12px !important;
    transition: border-color 0.15s ease, box-shadow 0.15s ease !important;
}

.admin-main input:focus, .admin-main select:focus, .admin-main textarea:focus {
    border-color: #2563eb !important;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15) !important;
    outline: none !important;
}

.admin-main textarea {
    font-size: 13.5px !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 6px !important;
    background-color: #ffffff !important;
    color: #0f172a !important;
    padding: 10px 12px !important;
}

/* Полевые лейблы в светлой рабочей панели (исключая чекбоксы, радио, инсталлятор и экран авторизации) */
.admin-layout .form-field > label:not(.colorfield__off):not(.checkbox-label),
.admin-layout .filters-panel label:not(.colorfield__off):not(.checkbox-label),
.admin-layout label.form-label,
.admin-layout label:not(.colorfield__off):not(.form-field--checkbox):not(.checkbox-label):not([class*="checkbox"]):not([class*="toggle"]):not(:has(input[type="checkbox"])):not(:has(input[type="radio"])) {
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #0f172a !important;
    margin-bottom: 6px !important;
    display: inline-block !important;
}

/* Строгое горизонтальное выравнивание простых строчных чекбоксов */
.form-field--checkbox,
.checkbox-field,
.form-check,
.colorfield__off,
label.colorfield__off,
label.checkbox-inline,
label.radio-inline {
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    margin: 0 !important;
    padding: 0 !important;
    cursor: pointer !important;
    user-select: none !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #1e293b !important;
    line-height: 1.4 !important;
}

.form-field--checkbox > label,
.checkbox-field > label,
.form-check > label,
.colorfield__off > label {
    display: inline !important;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #1e293b !important;
    line-height: 1.4 !important;
    cursor: pointer !important;
    user-select: none !important;
}

.form-field--checkbox input[type="checkbox"],
.checkbox-field input[type="checkbox"],
.form-check input[type="checkbox"],
.colorfield__off input[type="checkbox"],
label.colorfield__off input[type="checkbox"],
label input[type="checkbox"],
label input[type="radio"] {
    width: 16px !important;
    height: 16px !important;
    min-width: 16px !important;
    min-height: 16px !important;
    max-width: 16px !important;
    max-height: 16px !important;
    margin: 0 !important;
    padding: 0 !important;
    flex-shrink: 0 !important;
    accent-color: #2563eb !important;
    cursor: pointer !important;
    vertical-align: middle !important;
}

.colorfield__off,
label.colorfield__off {
    gap: 6px !important;
    margin-top: 6px !important;
    font-size: 12.5px !important;
    color: #475569 !important;
    white-space: nowrap !important;
}

small, .form-hint, .help-block {
    font-size: 12px !important;
    line-height: 1.45 !important;
    color: #64748b !important;
}

/* 5. Бейджи языков (RU/UZ), статусов и теги */
.lang-badge, [class*="lang-badge"] {
    font-size: 11.5px !important;
    font-weight: 700 !important;
    padding: 3px 6px !important;
    border-radius: 3px !important;
}

.badge, .status-badge, .tag, .chip {
    font-size: 12px !important;
    font-weight: 600 !important;
    padding: 3px 8px !important;
    border-radius: 3px !important;
}

/* 6. Сайдбар, меню и кнопки действий */
.admin-sidebar .nav-link, .admin-nav-item, .admin-sidebar a {
    font-size: 13.5px !important;
    font-weight: 500 !important;
    border-radius: 4px !important;
}

.admin-sidebar__label, .admin-sidebar__section-title {
    font-size: 11.5px !important;
    font-weight: 700 !important;
    letter-spacing: 0.06em !important;
}

.btn {
    font-size: 13.5px !important;
    font-weight: 600 !important;
    border-radius: 4px !important;
    padding: 8px 16px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    transition: all 0.15s ease !important;
}

.btn--small, .btn--sm, .btn-sm {
    font-size: 12.5px !important;
    font-weight: 600 !important;
    padding: 5px 10px !important;
    border-radius: 4px !important;
}

/* 7. Полноразмерная свободная ширина без искусственных ограничений */
.admin-main,
.admin-shell-content,
.admin-builder-workspace,
.entry-main,
.settings-container,
.form-card,
.settings-card,
.admin-card {
    max-width: none !important;
    width: 100% !important;
    box-sizing: border-box !important;
    border-radius: 4px !important;
}

/* 8. Глобальное уменьшение всех скруглений до минимальных 4px */
.form-card,
.settings-card,
.admin-card,
.stat-card,
.design-card,
.preset-card,
.fb-card,
.hb-behavior-card,
.form-section,
.form-control,
.form-select,
.filters-panel,
.admin-filters,
.image-field,
.image-field__preview,
.table-responsive,
.admin-table,
.hero-slide-item,
.hero-slide-item__preview,
input[type="text"],
input[type="email"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="url"],
textarea,
select {
    border-radius: 4px !important;
}

/* ============================================================================
   Адаптивность таблиц, Стандартизированная панель сохранения слева и Слайды
   ============================================================================ */

/* 1. Мобильная адаптивность таблиц */
.table-responsive {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    margin-bottom: 1.25rem;
    border-radius: 4px;
    border: 1px solid #e2e8f0;
    background: #ffffff;
}

@media (max-width: 900px) {
    .table-responsive .admin-table,
    .table-responsive table.table,
    .table-responsive .table {
        min-width: 700px !important;
    }
}

/* 2. Стандартизированная панель действий: кнопка «Сохранить» ВСЕГДА СЛЕВА */
.form-actions--sticky,
.admin-save-bar,
.form-actions {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 12px !important;
}

.form-actions--sticky, .admin-save-bar {
    position: fixed !important;
    bottom: 0 !important;
    left: var(--admin-sidebar-w, 286px) !important;
    right: 0 !important;
    z-index: 1000 !important;
    background: rgba(255, 255, 255, 0.97) !important;
    backdrop-filter: blur(16px) !important;
    -webkit-backdrop-filter: blur(16px) !important;
    padding: 12px 32px !important;
    border-radius: 0 !important;
    border: 0 !important;
    border-top: 1px solid #cbd5e1 !important;
    box-shadow: 0 -4px 20px rgba(15, 23, 42, 0.08) !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    color: #1e293b !important;
}

.form-actions--sticky .btn--primary,
.admin-save-bar .btn--primary,
.form-actions .btn--primary {
    order: 1 !important;
    background: #2563eb !important;
    border: 1px solid #2563eb !important;
    color: #ffffff !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    border-radius: 4px !important;
    padding: 8px 20px !important;
    box-shadow: 0 2px 6px rgba(37, 99, 235, 0.25) !important;
}

.form-actions--sticky .btn--primary:hover,
.admin-save-bar .btn--primary:hover,
.form-actions .btn--primary:hover {
    background: #1d4ed8 !important;
    border-color: #1d4ed8 !important;
    box-shadow: 0 4px 10px rgba(37, 99, 235, 0.4) !important;
}

.form-actions--sticky a.btn,
.form-actions--sticky .btn:not(.btn--primary),
.form-actions--sticky .btn--outline,
.form-actions--sticky .btn--secondary,
.form-actions--sticky .btn--cancel,
.admin-save-bar a.btn,
.admin-save-bar .btn:not(.btn--primary),
.form-actions a.btn,
.form-actions .btn:not(.btn--primary) {
    order: 2 !important;
    background: #f8fafc !important;
    border: 1px solid #cbd5e1 !important;
    color: #334155 !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    border-radius: 4px !important;
    padding: 8px 16px !important;
}

.form-actions--sticky a.btn:hover,
.form-actions--sticky .btn:not(.btn--primary):hover,
.form-actions--sticky .btn--outline:hover,
.form-actions--sticky .btn--secondary:hover,
.form-actions--sticky .btn--cancel:hover,
.form-actions a.btn:hover,
.form-actions .btn:not(.btn--primary):hover {
    background: #f1f5f9 !important;
    border-color: #94a3b8 !important;
    color: #0f172a !important;
}

.form-actions--sticky select,
.form-actions--sticky input {
    order: 3 !important;
    background: #ffffff !important;
    border: 1px solid #cbd5e1 !important;
    color: #0f172a !important;
    border-radius: 4px !important;
    height: 34px !important;
}

.form-actions--sticky .form-hint,
.form-actions--sticky label,
.form-actions--sticky span,
.form-actions--sticky .badge,
.form-actions--sticky [class*="u-inline-"] {
    order: 4 !important;
    color: #64748b !important;
    font-size: 13px !important;
}

/* Бейджи внутри светлой панели сохранения */
.form-actions--sticky .badge {
    background: #f1f5f9 !important;
    color: #334155 !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 3px !important;
}
.form-actions--sticky .badge--success,
.form-actions--sticky .badge--published {
    background: #ecfdf5 !important;
    color: #059669 !important;
    border-color: #a7f3d0 !important;
}
.form-actions--sticky .badge--draft {
    background: #f1f5f9 !important;
    color: #64748b !important;
    border-color: #cbd5e1 !important;
}

/* Inline-элементы внутри панели сохранения */
.form-actions--sticky [class*="u-inline-"] {
    color: #334155 !important;
    background: #f8fafc !important;
    border-color: #e2e8f0 !important;
}
.form-actions--sticky [class*="u-inline-"] strong {
    color: #0f172a !important;
}

/* Переключатель соцсетей внутри панели сохранения */
.form-actions--sticky .news-social-toggle {
    order: 5 !important;
    background: #f8fafc !important;
    border-color: #cbd5e1 !important;
    color: #334155 !important;
    box-shadow: none !important;
    border-radius: 4px !important;
}
.form-actions--sticky .news-social-toggle:hover {
    background: #f1f5f9 !important;
    border-color: #94a3b8 !important;
    color: #0f172a !important;
}
.form-actions--sticky .news-social-toggle__icon {
    color: #64748b !important;
}
.form-actions--sticky .news-social-toggle:hover .news-social-toggle__icon {
    color: #2563eb !important;
}
.form-actions--sticky .news-social-toggle input[type="checkbox"] {
    accent-color: #2563eb !important;
}
.form-actions--sticky .news-social-toggle:has(input:checked) {
    background: #2563eb !important;
    border-color: #1d4ed8 !important;
    color: #ffffff !important;
    box-shadow: 0 2px 8px rgba(37, 99, 235, 0.3) !important;
}
.form-actions--sticky .news-social-toggle:has(input:checked) .news-social-toggle__icon {
    color: #ffffff !important;
}

/* 3. Слайды обложек по единому строгому стандарту списков */
.hero-slides {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 0 16px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
}
.hero-slide-item {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 14px !important;
    padding: 10px 14px !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 4px !important;
    background: #ffffff !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.02) !important;
}
.hero-slide-item:hover {
    border-color: #94a3b8 !important;
}
.hero-slide-item.is-off {
    opacity: 0.65 !important;
    background: #f8fafc !important;
}
.hero-slide-item__grip {
    cursor: grab !important;
    color: #94a3b8 !important;
    display: flex !important;
    align-items: center !important;
}
.hero-slide-item__preview {
    width: 120px !important;
    height: 72px !important;
    border-radius: 4px !important;
    border: 1px solid #cbd5e1 !important;
    overflow: hidden !important;
    background: #f8fafc !important;
    flex-shrink: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}
.hero-slide-item__preview img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
}
.hero-slide-item__num {
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #64748b !important;
    flex-shrink: 0 !important;
}
.hero-slide-item__body {
    flex: 1 !important;
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
}
.hero-slide-item__title {
    font-size: 13.5px !important;
    font-weight: 600 !important;
    color: #0f172a !important;
    text-decoration: none !important;
}
.hero-slide-item__title:hover {
    color: #2563eb !important;
}
.hero-slide-item__meta {
    font-size: 12px !important;
    color: #64748b !important;
}
.hero-slide-item__langs {
    display: flex !important;
    gap: 4px !important;
    margin-top: 2px !important;
}
.hero-slide-item__actions {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    flex-shrink: 0 !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
}
.hero-slide-item__actions .btn {
    height: 30px !important;
    padding: 0 10px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    border-radius: 4px !important;
    background: #f8fafc !important;
    border: 1px solid #cbd5e1 !important;
    color: #334155 !important;
}
.hero-slide-item__actions .btn:hover {
    background: #f1f5f9 !important;
    border-color: #94a3b8 !important;
    color: #0f172a !important;
}
.hero-slide-item__actions .btn--danger {
    color: #ef4444 !important;
    border-color: #fca5a5 !important;
}
.hero-slide-item__actions .btn--danger:hover {
    background: #fee2e2 !important;
    border-color: #ef4444 !important;
    color: #b91c1c !important;
}

/* 3. Индикация активных фильтров */
.active-filters-bar {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin: 10px 0 16px;
    padding: 8px 14px;
    background: #f1f5f9;
    border-radius: 10px;
    font-size: 13.5px;
}
.active-filters-bar__title {
    font-weight: 700;
    color: #475569;
    margin-right: 4px;
}
.active-filter-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #ffffff;
    border: 1px solid #cbd5e1;
    color: #0f172a;
    padding: 4px 10px;
    border-radius: 9999px;
    font-size: 13px;
    font-weight: 600;
}
.active-filter-pill__clear {
    color: #64748b;
    cursor: pointer;
    font-weight: 700;
    text-decoration: none;
}
.active-filter-pill__clear:hover {
    color: #ef4444;
}

/* 4. Выпадающее меню действий в строках таблиц */
.admin-dropdown {
    position: relative;
    display: inline-block;
}
.admin-dropdown__toggle {
    background: #f8fafc;
    border: 1px solid #cbd5e1;
    color: #475569;
    border-radius: 8px;
    padding: 6px 10px;
    cursor: pointer;
    font-size: 15px;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    transition: all 0.15s ease;
}
.admin-dropdown__toggle:hover, .admin-dropdown__toggle:focus {
    background: #ffffff;
    border-color: #2563eb;
    color: #2563eb;
    box-shadow: 0 2px 8px rgba(37, 99, 235, 0.12);
}
.admin-dropdown__menu {
    display: none;
    position: absolute;
    right: 0;
    top: calc(100% + 4px);
    z-index: 950;
    min-width: 170px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    box-shadow: 0 10px 25px rgba(15, 23, 42, 0.15);
    padding: 6px;
    list-style: none;
    margin: 0;
}
.admin-dropdown.is-open .admin-dropdown__menu {
    display: block;
    animation: adminDropdownFadeIn 0.15s ease-out;
}
@keyframes adminDropdownFadeIn {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}
.admin-dropdown__item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    color: #334155;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    border-radius: 8px;
    transition: background 0.15s ease, color 0.15s ease;
    width: 100%;
    text-align: left;
    background: transparent;
    border: 0;
    cursor: pointer;
}
.admin-dropdown__item:hover {
    background: #f1f5f9;
    color: #2563eb;
}
.admin-dropdown__item--danger:hover {
    background: #fef2f2;
    color: #dc2626;
}

/* 5. Всплывающие Toast-уведомления */
.admin-toast-container {
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 9999;
    display: flex;
    flex-direction: column;
    gap: 10px;
    max-width: 380px;
    pointer-events: none;
}
.admin-toast {
    pointer-events: auto;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 18px;
    background: #ffffff;
    border-radius: 14px;
    border: 1px solid #e2e8f0;
    box-shadow: 0 12px 32px rgba(15, 23, 42, 0.15);
    color: #0f172a;
    font-size: 14.5px;
    font-weight: 600;
    line-height: 1.4;
    transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
    opacity: 0;
    transform: translateX(30px);
}
.admin-toast.is-show {
    opacity: 1;
    transform: translateX(0);
}
.admin-toast--success {
    border-left: 5px solid #16a34a;
}
.admin-toast--error {
    border-left: 5px solid #dc2626;
}
.admin-toast--info {
    border-left: 5px solid #2563eb;
}
.admin-toast__close {
    margin-left: auto;
    background: transparent;
    border: 0;
    color: #94a3b8;
    cursor: pointer;
    font-size: 18px;
    padding: 0;
    line-height: 1;
}
.admin-toast__close:hover {
    color: #0f172a;
}

/* ============================================================================
   High-Contrast Typography & Accessibility Hardening for Install & Auth Pages
   ============================================================================ */
:root {
    --inst-primary: #2563eb;
    --inst-primary-hover: #1d4ed8;
    --inst-border: rgba(255, 255, 255, 0.12);
    --inst-success: #10b981;
    --inst-text: #f8fafc;
    --inst-muted: #94a3b8;
}

body.auth-page label,
.auth-card label,
.install-card label,
.auth-field label,
.install-card .form-field label,
.auth-card .form-field label {
    color: #f1f5f9 !important;
    font-weight: 600 !important;
    font-size: 0.92rem !important;
    letter-spacing: -0.01em !important;
}

.install-header__title {
    color: #f8fafc !important;
}

.install-header__desc {
    color: #94a3b8 !important;
}

.check-card-group__title {
    color: #cbd5e1 !important;
    font-weight: 700 !important;
}

.install-step-title {
    color: #94a3b8 !important;
}

.install-step-item.is-active .install-step-title {
    color: #60a5fa !important;
    font-weight: 700 !important;
}

.install-step-item.is-done .install-step-title {
    color: #cbd5e1 !important;
}

.install-header {
    border-bottom-color: rgba(255, 255, 255, 0.1) !important;
}

.install-card .form-actions {
    border-top-color: rgba(255, 255, 255, 0.1) !important;
}

.check-item {
    background: #ffffff !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 12px !important;
    padding: 14px 18px !important;
    margin-bottom: 10px !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) !important;
    transition: background 0.15s ease, border-color 0.15s ease !important;
}

.check-item:hover {
    background: #f8fafc !important;
    border-color: #94a3b8 !important;
}

.check-item__label {
    color: #0f172a !important;
    font-weight: 700 !important;
    font-size: 0.94rem !important;
}

.check-item__hint {
    color: #dc2626 !important;
    font-size: 0.8rem !important;
    margin-top: 2px !important;
}

.check-item__icon.ok {
    background: #dcfce7 !important;
    color: #15803d !important;
}

.check-item__icon.fail {
    background: #fee2e2 !important;
    color: #b91c1c !important;
}

.check-item .badge,
.check-item .badge--success {
    background: #dcfce7 !important;
    color: #15803d !important;
    border: 1px solid #bbf7d0 !important;
    font-weight: 700 !important;
}

.check-item .badge--danger {
    background: #fee2e2 !important;
    color: #b91c1c !important;
    border: 1px solid #fecaca !important;
    font-weight: 700 !important;
}

.install-input-wrap input,
.install-input-wrap select,
.install-input-wrap textarea {
    color: #f8fafc !important;
    background: rgba(255, 255, 255, 0.06) !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    border-radius: 12px !important;
}

.install-input-wrap select option {
    background: #0f172a !important;
    color: #f8fafc !important;
}

.install-input-wrap input::placeholder,
.install-input-wrap textarea::placeholder {
    color: #94a3b8 !important;
}

.install-input-wrap input:focus,
.install-input-wrap select:focus,
.install-input-wrap textarea:focus {
    background: rgba(255, 255, 255, 0.1) !important;
    border-color: #3b82f6 !important;
    box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.25) !important;
}

.install-input-icon {
    color: #94a3b8 !important;
}

.install-input-wrap:focus-within .install-input-icon {
    color: #60a5fa !important;
}

.install-callout {
    background: rgba(37, 99, 235, 0.12) !important;
    border: 1px solid rgba(37, 99, 235, 0.25) !important;
    color: #93c5fd !important;
}

.install-callout svg {
    color: #60a5fa !important;
}

.install-callout strong {
    color: #ffffff !important;
}

.install-card .form-hint,
.auth-card .form-hint {
    color: #94a3b8 !important;
}

/* --- Плашка «Редактируется: XX» над списком языков ---------------------- */
/* Раньше она была того же акцентного цвета, что и строка текущего языка
   ниже, и две соседние плашки читались как одинаковые по смыслу. Акцент
   оставлен строке языка (это состояние записи), а этой полосе — роль
   подписи: нейтральный фон и приглушённый текст. */
.multilang-editing {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 10px 12px;
    background: var(--admin-bg-soft, #f8fafc);
    border: 1px solid var(--admin-border, #e2e8f0);
    border-radius: 8px;
    margin-bottom: 14px;
}
.multilang-editing__code {
    font-size: 0.92rem;
    color: var(--admin-text, #1e293b);
    font-weight: 700;
    text-transform: uppercase;
}
/* В узкой боковой колонке подпись и плашка не помещались в строку, и плашка
   вылезала за край карточки. На синем фоне это было незаметно, на спокойном
   стало видно. Разрешаем перенос и даём тексту сжиматься. */
.multilang-editing { flex-wrap: wrap; }
.multilang-editing > div { min-width: 0; flex-wrap: wrap; }
.multilang-editing > span { flex: 0 0 auto; }

/* Строки списка языков: название слева, действие справа. Названию разрешаем
   сжиматься, кнопке — нет, строке — переноситься. Одного лишь gap мало: без
   этих правил зазор выталкивал содержимое за пределы строки. */
.multilang-translation-list > div { flex-wrap: wrap; gap: 10px; }
.multilang-translation-list > div > :first-child { min-width: 0; flex: 1 1 auto; }
.multilang-translation-list > div > :last-child { flex: 0 0 auto; }


/* Спрайт иконок вставляется сразу после <body>. Правило есть в frontend.css,
   но админка его не грузит — и строчный <svg> создавал строку высотой в
   line-height, из-за чего верхняя панель стояла на 26px ниже края экрана и
   «прилипала» только после прокрутки. */
.tabler-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }

/* Метка новости в списке: тот же цвет, что и на сайте. Цвет приходит
   переменными из NewsBadge::styleAttr(), поэтому правило одно на все метки. */
/* Своей строкой под заголовком: у коротких заголовков inline-метка
   прилипала к последнему слову и читалась как часть названия. */
.news-mark {
    display: block; width: fit-content; margin-top: 4px; padding: 1px 7px; border-radius: 4px;
    background: var(--news-badge-bg, rgba(37, 99, 235, 0.12));
    color: var(--news-badge-fg, #1d4ed8);
    font-size: 11px; font-weight: 700; line-height: 1.5;
}


/* --- Раздел «Обложки»: визуальный список слайдов --- */
/* Строка слайда — превью, номер, заголовок и быстрые действия. Порядок
   меняется перетаскиванием и сохраняется общей панелью порядка. */
.hero-slides { list-style: none; margin: 0 0 16px; padding: 0; display: flex; flex-direction: column; gap: 8px; }

.hero-slide-item {
    display: flex; align-items: center; gap: 12px; padding: 10px 12px;
    border: 1px solid var(--admin-border, #e2e8f0); border-radius: 10px;
    background: var(--admin-surface, #fff);
}

.hero-slide-item.is-dragging { opacity: .5; }
.hero-slide-item.is-off { opacity: .6; }
.hero-slide-item__grip { cursor: grab; color: var(--admin-muted, #64748b); display: flex; }

.hero-slide-item__preview {
    flex: 0 0 auto; width: 88px; height: 56px; border-radius: 6px; overflow: hidden;
    background: var(--admin-bg, #f1f5f9); display: flex; align-items: center; justify-content: center;
}

.hero-slide-item__preview img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hero-slide-item__placeholder { color: var(--admin-muted, #64748b); display: flex; }

.hero-slide-item__num {
    flex: 0 0 auto; font-variant-numeric: tabular-nums; font-weight: 700;
    color: var(--admin-muted, #64748b);
}

.hero-slide-item__body { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.hero-slide-item__title { font-weight: 600; text-decoration: none; }
.hero-slide-item__meta { font-size: 12px; color: var(--admin-muted, #64748b); }
.hero-slide-item__langs { display: flex; gap: 4px; }
.hero-slide-item__actions { flex: 0 0 auto; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }

@media (max-width: 900px) {
    .hero-slide-item { flex-wrap: wrap; }
    .hero-slide-item__body { flex-basis: 100%; order: 3; }
    .hero-slide-item__actions { flex-basis: 100%; order: 4; }
}


/* Плотная раскладка форм с большим числом коротких настроек.
   .form-grid — это колонка: каждое поле занимает строку целиком, и форма
   обложки вытягивалась в полотно под 2000px, где правая половина экрана
   пустовала. Здесь короткие поля (селекты, числа, цвета) встают рядом. */
.form-grid--dense,
.form-section__body--grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 16px 20px;
    align-items: start;
}
.form-grid--dense > input,
.form-grid--dense > select,
.form-grid--dense > textarea,
.form-grid--dense .form-field input,
.form-grid--dense .form-field select,
.form-grid--dense .form-field textarea,
.form-section__body--grid .form-field input,
.form-section__body--grid .form-field select,
.form-section__body--grid .form-field textarea { max-width: none; }
.form-grid--dense .form-field--wide,
.form-section__body--grid .form-field--wide { grid-column: 1 / -1; }

/* Текущее значение рядом с названием свёрнутой группы: состояние видно, не
   открывая её. Без этого свёрнутая форма экономит место, но прячет настройки. */
.form-section__state {
    margin-left: auto;
    font-weight: 600;
    font-size: 12px;
    color: var(--admin-accent);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 45%;
}

/* ========================================================================
   Local Draft Recovery Notification Banner
   ======================================================================== */
.admin-draft-banner {
    background: #eff6ff;
    border: 1px solid #bfdbfe;
    color: #1e40af;
    padding: 10px 16px;
    border-radius: 8px;
    margin-bottom: 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 13px;
}

.admin-draft-banner__actions {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* ========================================================================
   WebAuthn / Passkeys Login Button & Divider
   ======================================================================== */
.auth-divider {
    margin: 20px 0 !important;
    text-align: center !important;
    position: relative !important;
}

.auth-divider::before {
    content: "" !important;
    position: absolute !important;
    top: 50% !important;
    left: 0 !important;
    right: 0 !important;
    height: 1px !important;
    background: rgba(255, 255, 255, 0.12) !important;
}

.auth-divider__label {
    position: relative !important;
    background: #1e293b !important;
    padding: 2px 14px !important;
    color: #94a3b8 !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    border-radius: 4px !important;
}

.auth-passkey-btn {
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    padding: 11px 16px !important;
    background: rgba(255, 255, 255, 0.06) !important;
    border: 1px solid #334155 !important;
    border-radius: 4px !important;
    color: #f1f5f9 !important;
    font-weight: 600 !important;
    font-size: 13.5px !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2) !important;
}

.auth-passkey-btn:hover {
    background: rgba(255, 255, 255, 0.12) !important;
    border-color: #64748b !important;
    color: #ffffff !important;
}

.auth-passkey-btn svg {
    color: #60a5fa !important;
}

.auth-security-badge {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    margin-top: 24px !important;
    color: #94a3b8 !important;
    font-size: 12px !important;
    font-weight: 500 !important;
}

.auth-security-badge svg {
    color: #34d399 !important;
}

/* ========================================================================
   Granular Demo Data Modules Selector
   ======================================================================== */
.demo-modules-selector {
    margin: 14px 0 18px;
    padding: 12px 14px;
    background: var(--admin-hover, #f8fafc);
    border: 1px solid var(--admin-border, #e2e8f0);
    border-radius: 8px;
}

.demo-modules-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--admin-border, #e2e8f0);
    font-size: 13px;
    font-weight: 600;
}

.demo-modules-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 8px 12px;
}

.demo-module-item {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: var(--admin-text, #334155);
    cursor: pointer;
}

/* ============================================================================
   WCAG AA Contrast, Spacing Normalization & Header Builder Refinement
   ============================================================================ */

/* 1. Форма входа (/admin/login) - Высокая контрастность и четкие отступы */
body.auth-page {
    background: #0b1120 !important;
    color: #f8fafc !important;
}

.auth-card {
    background: #1e293b !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    border-radius: 6px !important;
    padding: 36px 32px !important;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.5) !important;
}

.auth-card h1 {
    color: #ffffff !important;
    font-size: 20px !important;
    font-weight: 700 !important;
}

.auth-card .auth-sub {
    color: #cbd5e1 !important;
    font-size: 13px !important;
}

.auth-card .auth-brand__name {
    color: #ffffff !important;
    font-weight: 700 !important;
}

.auth-card .auth-field label {
    color: #e2e8f0 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    margin-bottom: 6px !important;
}

.auth-card input[type="text"],
.auth-card input[type="password"],
.auth-card input[type="email"] {
    background: #0f172a !important;
    border: 1px solid #334155 !important;
    color: #ffffff !important;
    border-radius: 4px !important;
    font-size: 13.5px !important;
    padding: 10px 40px !important;
}

.auth-card input:focus {
    border-color: #3b82f6 !important;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.25) !important;
}

.auth-card input::placeholder {
    color: #64748b !important;
}

.auth-submit-btn {
    background: #2563eb !important;
    color: #ffffff !important;
    border: 1px solid #2563eb !important;
    border-radius: 4px !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    padding: 10px 18px !important;
    box-shadow: 0 2px 6px rgba(37, 99, 235, 0.3) !important;
}

.auth-submit-btn:hover {
    background: #1d4ed8 !important;
    border-color: #1d4ed8 !important;
}

.auth-forgot-link {
    color: #60a5fa !important;
    font-size: 12.5px !important;
    font-weight: 600 !important;
}

.auth-site-link:hover {
    color: #ffffff !important;
}

/* 1.1 Инсталлятор (/install/*) - Высокая контрастность, лейблы, шаги и инпуты */
.install-card {
    background: #1e293b !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    border-radius: 6px !important;
    box-shadow: 0 25px 50px rgba(0, 0, 0, 0.5) !important;
}

body.auth-page .install-card label,
body.auth-page .install-card .form-field label,
body.auth-page .install-card .form-field > label,
body.auth-page .install-card label.u-inline-aa1820469b,
body.auth-page .auth-card label,
body.auth-page .auth-card .form-field label,
body.auth-page .auth-card .auth-field label,
.install-wrapper label,
.install-card label,
.install-card .form-field label,
.install-card .form-field > label,
.install-card label.u-inline-aa1820469b,
.install-card label[class*="u-inline"] {
    color: #f1f5f9 !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    margin-bottom: 8px !important;
    display: inline-block !important;
}

body.auth-page .install-card label span,
body.auth-page .install-card .form-field label span,
.install-card label span,
.install-card .form-field label span,
.install-card label .u-inline-9dd1207e58 {
    color: #f87171 !important;
    font-weight: 700 !important;
}

.install-header {
    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
}

.install-header__title {
    color: #ffffff !important;
    font-size: 1.5rem !important;
    font-weight: 700 !important;
}

.install-header__desc {
    color: #cbd5e1 !important;
    font-size: 13.5px !important;
}

.install-step-badge {
    background: #0f172a !important;
    border: 2px solid #334155 !important;
    color: #94a3b8 !important;
}

.install-step-title {
    color: #94a3b8 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
}

.install-step-item.is-done .install-step-badge {
    background: #064e3b !important;
    border-color: #059669 !important;
    color: #34d399 !important;
}

.install-step-item.is-done .install-step-title {
    color: #34d399 !important;
}

.install-step-item.is-active .install-step-badge {
    background: #2563eb !important;
    border-color: #3b82f6 !important;
    color: #ffffff !important;
    box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.25) !important;
}

.install-step-item.is-active .install-step-title {
    color: #60a5fa !important;
    font-weight: 700 !important;
}

.install-callout {
    background: rgba(37, 99, 235, 0.12) !important;
    border: 1px solid rgba(59, 130, 246, 0.3) !important;
    color: #bfdbfe !important;
    border-radius: 6px !important;
}

.install-callout__icon,
.install-callout svg {
    color: #60a5fa !important;
}

.install-input-wrap input,
.install-input-wrap select,
.install-input-wrap textarea {
    background: #0f172a !important;
    border: 1px solid #334155 !important;
    color: #ffffff !important;
    border-radius: 4px !important;
    font-size: 13.5px !important;
    padding: 11px 16px 11px 42px !important;
}

.install-input-wrap input:focus,
.install-input-wrap select:focus,
.install-input-wrap textarea:focus {
    background: #0b1329 !important;
    border-color: #3b82f6 !important;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.25) !important;
}

.install-input-wrap input::placeholder,
.install-input-wrap textarea::placeholder {
    color: #64748b !important;
}

.install-input-icon {
    color: #94a3b8 !important;
}

.install-input-wrap:focus-within .install-input-icon {
    color: #60a5fa !important;
}

.install-card .check-item {
    background: #0f172a !important;
    border: 1px solid #334155 !important;
    border-radius: 6px !important;
    color: #f8fafc !important;
}

.install-card .check-item:hover {
    background: #131d35 !important;
}

.install-card .check-item__label {
    color: #f8fafc !important;
}

.install-card .check-card-group__title {
    color: #e2e8f0 !important;
}

.install-card .form-actions {
    border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
}

.install-card .form-actions .btn,
.install-card .form-actions .btn--primary {
    background: #2563eb !important;
    border: 1px solid #2563eb !important;
    color: #ffffff !important;
    border-radius: 4px !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    padding: 11px 22px !important;
}

.install-card .form-actions .btn--primary:hover {
    background: #1d4ed8 !important;
    border-color: #1d4ed8 !important;
}

/* 2. Конструктор шапки сайта (/admin/header) - Четкий контраст и карточная структура */
.hdr-workspace-header {
    background: #ffffff !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 4px !important;
    padding: 18px 22px !important;
    margin-bottom: 20px !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 16px !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.02) !important;
    color: #0f172a !important;
}

.hdr-workspace-header__title {
    font-size: 1.25rem !important;
    font-weight: 700 !important;
    color: #0f172a !important;
    margin: 0 0 4px !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
}

.hdr-workspace-header__desc {
    font-size: 13px !important;
    color: #475569 !important;
    margin: 0 !important;
}

.hdr-tabs-nav {
    display: flex !important;
    gap: 6px !important;
    background: #f1f5f9 !important;
    padding: 4px !important;
    border-radius: 4px !important;
    margin-bottom: 20px !important;
    flex-wrap: wrap !important;
    border: 1px solid #cbd5e1 !important;
}

.hdr-tab-btn {
    flex: 1 1 auto !important;
    min-width: 140px !important;
    padding: 8px 16px !important;
    border: 1px solid transparent !important;
    background: transparent !important;
    border-radius: 4px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #475569 !important;
    cursor: pointer !important;
    text-align: center !important;
    transition: all 0.15s ease !important;
}

.hdr-tab-btn:hover {
    color: #0f172a !important;
    background: rgba(255, 255, 255, 0.8) !important;
}

.hdr-tab-btn.is-active {
    background: #ffffff !important;
    color: #2563eb !important;
    border-color: #cbd5e1 !important;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05) !important;
}

/* Карточки архитектуры шапки (1. Ширина и форма контейнера) */
.hdr-card-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important;
    gap: 16px !important;
    margin-top: 14px !important;
}

.hdr-select-card,
label.hdr-select-card {
    background: #ffffff !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 4px !important;
    padding: 18px 20px !important;
    cursor: pointer !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    position: relative !important;
    transition: all 0.15s ease !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.02) !important;
    box-sizing: border-box !important;
    min-height: 90px !important;
    width: 100% !important;
}

.hdr-select-card:hover,
label.hdr-select-card:hover {
    border-color: #94a3b8 !important;
    background: #f8fafc !important;
}

.hdr-select-card.is-selected,
.hdr-select-card:has(input:checked),
label.hdr-select-card:has(input:checked) {
    border-color: #2563eb !important;
    background: #f0f7ff !important;
    box-shadow: 0 0 0 1px #2563eb !important;
}

.hdr-select-card input[type="radio"],
label.hdr-select-card input[type="radio"] {
    position: absolute !important;
    top: 18px !important;
    right: 18px !important;
    margin: 0 !important;
    width: 16px !important;
    height: 16px !important;
    accent-color: #2563eb !important;
}

.hdr-select-card__title {
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #0f172a !important;
    padding-right: 32px !important;
    margin: 0 !important;
}

.hdr-select-card__desc {
    font-size: 12.5px !important;
    color: #475569 !important;
    line-height: 1.45 !important;
    margin: 0 !important;
}

/* Карточки поведения при прокрутке (3. Поведение при прокрутке) */
.hb-behavior__options {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important;
    gap: 16px !important;
    margin-top: 14px !important;
}

.hb-behavior-card,
label.hb-behavior-card {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    background: #ffffff !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 4px !important;
    padding: 18px 20px !important;
    cursor: pointer !important;
    transition: all 0.15s ease !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.02) !important;
    box-sizing: border-box !important;
    min-height: 84px !important;
    width: 100% !important;
}

.hb-behavior-card:hover,
label.hb-behavior-card:hover {
    border-color: #94a3b8 !important;
    background: #f8fafc !important;
}

.hb-behavior-card:has(input:checked),
label.hb-behavior-card:has(input:checked) {
    border-color: #2563eb !important;
    background: #f0f7ff !important;
}

.hb-behavior-card .hb-switch {
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 10px !important;
    width: 100% !important;
    margin: 0 !important;
}

.hb-behavior-card__title {
    font-size: 13.5px !important;
    font-weight: 600 !important;
    color: #0f172a !important;
    margin: 0 !important;
}

.hb-behavior-card__hint {
    font-size: 12px !important;
    color: #64748b !important;
    line-height: 1.45 !important;
    display: block !important;
    margin: 0 !important;
}

/* 3. Нормализация глобальных отступов и контраста */
.form-card,
.settings-card,
.admin-card {
    padding: 20px 24px !important;
    margin-bottom: 20px !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 4px !important;
    background: #ffffff !important;
}

.form-card h2, .form-card h3,
.settings-card h2, .settings-card h3,
.admin-card h2, .admin-card h3 {
    color: #0f172a !important;
    font-weight: 700 !important;
}

.form-hint, .help-block, .card-hint {
    color: #64748b !important;
    font-size: 12.5px !important;
}

/* Контраст для таблиц */
.admin-table th,
table.table th {
    background: #f8fafc !important;
    color: #334155 !important;
    font-weight: 700 !important;
    border-bottom: 1px solid #cbd5e1 !important;
    padding: 10px 14px !important;
}

.admin-table td,
table.table td {
    color: #0f172a !important;
    border-bottom: 1px solid #f1f5f9 !important;
    padding: 10px 14px !important;
}