/* Инфоэкран Про — каркас тем (light / dark / auto). Переключение: data-theme на html. */

:root,
[data-theme="dark"] {
    /* Тёмная премиум: deep navy, glassmorphism, мягкие неоновые акценты */
    --color-bg: #0a0e17;
    --color-bg-gradient: radial-gradient(ellipse 120% 80% at 50% 0%, #131b2e 0%, #0a0e17 55%);
    --color-surface: rgba(26, 35, 56, 0.65);
    --color-surface-solid: #1a2338;
    --color-surface-2: rgba(36, 48, 68, 0.6);
    --color-primary: #3b82f6;
    --color-primary-hover: #2563eb;
    --color-accent: #06b6d4;
    --color-accent-glow: rgba(6, 182, 212, 0.35);
    --color-text: #f1f5f9;
    --color-text-muted: #94a3b8;
    --color-border: rgba(71, 85, 105, 0.5);
    --glass-bg: rgba(15, 23, 42, 0.4);
    --glass-border: rgba(148, 163, 184, 0.12);
    --font-sans: 'Outfit', -apple-system, BlinkMacSystemFont, sans-serif;
    --font-mono: 'JetBrains Mono', monospace;
    /* Базовый размер шрифта плеера: умеренное масштабирование. 1080p ≈22px, 4K до 48px. */
    --player-font-base: clamp(13px, 2.1vmin, 48px);
    --radius: 12px;
    --radius-sm: 8px;
    --shadow: 0 4px 24px rgba(0, 0, 0, .3);
    --shadow-glow: 0 0 20px var(--color-accent-glow);
    --transition: 0.25s ease;
    --transition-theme: 0.4s ease;
    /* Единый внутренний отступ всех блоков виджетов (один падинг везде) */
    --widget-block-pad: 10px;
    --widget-pad: var(--widget-block-pad);
    --widget-pad-single: var(--widget-block-pad);
    --widget-box-pad: 6px 10px;
    /* мелкие элементы: квадраты, ячейки таблицы */
    --widget-gap: 8px;
    --widget-gap-sm: 6px;
    --widget-gap-xs: 4px;
    /* Единый отступ ячейки виджета (внешний padding .player-cell) */
    --player-cell-pad: 0.35em;
    /*
     * Общие токены виджетов «Дата» и «Время»: flip-плитки, плашка, подписи, стекло.
     * cqi/cqmax считаются от контейнера .widget-date-inner / .widget-time-inner (container-type: inline-size).
     */
    --widget-dt-flip-tile-size: clamp(2.35rem, min(16cqi, 10vw, 12vmin), 4rem);
    --widget-dt-flip-tile-radius: clamp(6px, min(1.4cqi, 1.1vw), 11px);
    --widget-dt-flip-row-gap: clamp(0.45rem, min(3cqi, 2.2vw), 1rem);
    --widget-dt-flip-row-pad-inline: 0 clamp(0.35rem, min(2.5cqi, 1.5vw), 0.85rem);
    --widget-dt-flip-cell-gap: 0.42em;
    --widget-dt-flip-digit-fs: clamp(0.68rem, min(2.8vw, 5.5cqi, 3.5vmin), 1.28rem);
    --widget-dt-flip-digit-fs-ms: clamp(0.55rem, min(2.2vw, 4.2cqi, 2.8vmin), 0.95rem);
    --widget-dt-flip-caption-fs: clamp(0.58rem, min(2.6cqi, 2vw), 0.82rem);
    --widget-dt-flip-caption-tight-fs: clamp(0.24rem, min(1.35cqi, 0.55vw), 0.4rem);
    --widget-dt-flip-caption-tight-fs-sm: clamp(0.2rem, min(1.1cqi, 0.45vw), 0.32rem);
    --widget-dt-plaque-radius: var(--widget-dt-flip-tile-radius);
    --widget-dt-plaque-pad: clamp(0.35rem, min(2cqi, 1.5vw), 0.75rem) clamp(0.45rem, min(2.8cqi, 2vw), 0.95rem);
    --widget-dt-plaque-cols-gap: clamp(0.45rem, min(2.8cqi, 2vw), 1rem);
    --widget-dt-plaque-cols-gap-tight: clamp(0.12rem, min(0.9cqi, 0.6vw), 0.42rem);
    --widget-dt-plaque-cutline-y: calc(0.5 * 1.1em);
    --widget-dt-glass-pad-y: clamp(0.3em, 0.75cqmax, 0.55em);
    --widget-dt-glass-pad-x: clamp(0.4em, 1cqmax, 0.75em);
    --widget-dt-with-time-stack-gap: clamp(0.35rem, 2cqi, 0.75rem);
    --widget-dt-with-time-grid-row-gap: clamp(0.1rem, min(1.05cqi, 0.8vw), 0.26rem);
    --widget-dt-with-time-time-pad-top: clamp(0.12rem, min(1cqi, 0.9vw), 0.45rem);
    --widget-dt-datetime-under-boxes-fs: clamp(0.62rem, min(2.6vw, 3.8vmin), 1.05rem);
    --widget-dt-long-plain-fs: clamp(0.85rem, min(2.55vw, 4.8cqi, 3vmin), 1.14rem);
    --widget-dt-col-label-gap: max(0.1em, clamp(0.06rem, min(1.2cqi, 0.85vw), 0.24rem));
    --widget-dt-weekday-line-fs: clamp(0.62rem, min(2cqi, 1.65vw), 0.9rem);
    --widget-dt-weekday-line-mt: clamp(0.08rem, min(0.95cqi, 0.72vw), 0.26rem);
}


/* Светлая тема */

[data-theme="light"] {
    --color-bg: #f0f4f8;
    --color-bg-gradient: linear-gradient(180deg, #e2e8f0 0%, #f0f4f8 100%);
    --color-surface: rgba(255, 255, 255, 0.75);
    --color-surface-solid: #ffffff;
    --color-surface-2: rgba(241, 245, 249, 0.9);
    --color-primary: #2563eb;
    --color-primary-hover: #1d4ed8;
    --color-accent: #0891b2;
    --color-accent-glow: rgba(8, 145, 178, 0.2);
    --color-text: #0f172a;
    --color-text-muted: #64748b;
    --color-border: rgba(148, 163, 184, 0.4);
    --glass-bg: rgba(255, 255, 255, 0.6);
    --glass-border: rgba(15, 23, 42, 0.08);
    --shadow: 0 4px 24px rgba(0, 0, 0, .08);
    --shadow-glow: 0 0 16px var(--color-accent-glow);
}


/* Вид темы под виджет: переопределение только внутри ячейки */

.player-cell[data-widget-theme="dark"] {
    --color-bg: #0a0e17;
    --glass-bg: rgba(15, 23, 42, 0.4);
    --glass-border: rgba(148, 163, 184, 0.12);
    --color-text: #f1f5f9;
    --color-text-muted: #94a3b8;
    --color-border: rgba(71, 85, 105, 0.5);
    --color-primary: #3b82f6;
    --color-accent: #06b6d4;
    --color-accent-glow: rgba(6, 182, 212, 0.35);
    --shadow: 0 4px 24px rgba(0, 0, 0, .3);
}

.player-cell[data-widget-theme="light"] {
    --color-bg: #f0f4f8;
    --glass-bg: rgba(255, 255, 255, 0.6);
    --glass-border: rgba(15, 23, 42, 0.08);
    --color-text: #0f172a;
    --color-text-muted: #64748b;
    --color-border: rgba(148, 163, 184, 0.4);
    --color-primary: #2563eb;
    --color-accent: #0891b2;
    --color-accent-glow: rgba(8, 145, 178, 0.2);
    --shadow: 0 4px 24px rgba(0, 0, 0, .08);
}

* {
    box-sizing: border-box;
}

body {
    margin: 0;
    font-family: var(--font-sans);
    background: var(--color-bg);
    color: var(--color-text);
    line-height: 1.5;
    transition: background var(--transition-theme), color var(--transition-theme);
}

a {
    color: var(--color-primary);
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}


/* Лендинг */

.landing {
    min-height: 100vh;
}

.landing-hero {
    padding: 4rem 1.5rem 3rem;
    text-align: center;
    background: linear-gradient(180deg, var(--color-surface) 0%, var(--color-bg) 100%);
}

.landing-hero h1 {
    font-size: clamp(2rem, 5vw, 3rem);
    font-weight: 700;
    margin: 0 0 0.5rem;
    letter-spacing: -0.02em;
}

.landing-hero p {
    font-size: 1.125rem;
    color: var(--color-text-muted);
    max-width: 36rem;
    margin: 0 auto 2rem;
}

.landing-cta {
    display: inline-flex;
    gap: 1rem;
    flex-wrap: wrap;
    justify-content: center;
}

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.75rem 1.5rem;
    border-radius: var(--radius-sm);
    font-weight: 600;
    font-size: 1rem;
    border: none;
    cursor: pointer;
    transition: background var(--transition), transform var(--transition);
}

.btn-primary {
    background: var(--color-primary);
    color: #fff;
}

.btn-primary:hover {
    background: var(--color-primary-hover);
    transform: translateY(-1px);
}

.btn-ghost {
    background: transparent;
    color: var(--color-text);
    border: 1px solid var(--color-border);
}

.btn-ghost:hover {
    background: var(--color-surface-2);
}

.tariffs {
    padding: 3rem 1.5rem;
    max-width: 1100px;
    margin: 0 auto;
}

.tariffs h2 {
    text-align: center;
    font-size: 1.75rem;
    margin-bottom: 2rem;
}

.tariffs-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 1.5rem;
}

.tariff-card {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
    padding: 1.5rem;
    position: relative;
    transition: border-color var(--transition), box-shadow var(--transition);
}

.tariff-card:hover {
    border-color: var(--color-primary);
    box-shadow: var(--shadow);
}

.tariff-card.pro {
    border-color: var(--color-accent);
}

.tariff-card h3 {
    margin: 0 0 0.25rem;
    font-size: 1.25rem;
}

.tariff-card .price {
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--color-accent);
    margin: 0.5rem 0 1rem;
}

.tariff-card .price span {
    font-size: 0.9rem;
    font-weight: 400;
    color: var(--color-text-muted);
}

.tariff-card ul {
    list-style: none;
    padding: 0;
    margin: 0;
    font-size: 0.95rem;
    color: var(--color-text-muted);
}

.tariff-card li {
    padding: 0.35rem 0;
    padding-left: 1.25rem;
    position: relative;
}

.tariff-card li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0.6em;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--color-primary);
}

.tariff-card .btn {
    width: 100%;
    margin-top: 1rem;
}


/* Плеер (полный экран) — фон и плавная смена темы. Шрифты масштабируются по размеру экрана. */

.player-wrap {
    position: fixed;
    inset: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    background: var(--color-bg);
    background-image: var(--color-bg-gradient);
    transition: background var(--transition-theme), color var(--transition-theme);
    font-size: var(--player-font-base);
    font-family: var(--font-sans);
}


/* Основной экран (просмотр): фон в стиле лендинга — сетка + орбы */

.player-wrap::before {
    content: '';
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background-image: linear-gradient(var(--color-border) 1px, transparent 1px), linear-gradient(90deg, var(--color-border) 1px, transparent 1px);
    background-size: 60px 60px;
    opacity: 0.1;
}

body.screen-edit .player-wrap::before {
    opacity: 0.05;
}


/* Орбы как на лендинге — только в режиме просмотра */

.player-wrap::after {
    content: '';
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background-image: radial-gradient(ellipse 45% 45% at 15% 5%, rgba(59, 130, 246, 0.22) 0%, transparent 55%), radial-gradient(ellipse 40% 40% at 88% 85%, rgba(6, 182, 212, 0.2) 0%, transparent 55%), radial-gradient(ellipse 35% 35% at 35% 95%, rgba(99, 102, 241, 0.15) 0%, transparent 50%);
    opacity: 1;
}

body.screen-edit .player-wrap::after {
    opacity: 0.2;
}

[data-theme="light"] .player-wrap::after {
    background-image: radial-gradient(ellipse 45% 45% at 15% 5%, rgba(37, 99, 235, 0.12) 0%, transparent 55%), radial-gradient(ellipse 40% 40% at 88% 85%, rgba(8, 145, 178, 0.1) 0%, transparent 55%);
}

.player-wrap .screen-toolbar,
.player-wrap .screen-ticker,
.player-wrap .player-grid,
.player-wrap .editor-body,
.player-wrap .editor-chrome {
    position: relative;
}


/* Режим редактирования: левая панель с корзиной и область сетки */

.editor-body {
    display: flex;
    flex: 1;
    min-height: 0;
    width: 100%;
}

.editor-trash-zone {
    width: 4.5rem;
    flex-shrink: 0;
    border-right: 1px solid var(--color-border);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.75rem 0.5rem;
    background: var(--color-surface-2);
    transition: background 0.2s ease, box-shadow 0.2s ease;
    cursor: default;
    user-select: none;
}

.editor-trash-zone.drag-over-trash {
    background: rgba(239, 68, 68, 0.18);
    box-shadow: inset 0 0 0 2px rgba(239, 68, 68, 0.5);
}

.editor-trash-icon {
    width: 2rem;
    height: 2rem;
    display: block;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239ca3af' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='3 6 5 6 21 6'/%3E%3Cpath d='M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2'/%3E%3Cline x1='10' y1='11' x2='10' y2='17'/%3E%3Cline x1='14' y1='11' x2='14' y2='17'/%3E%3C/svg%3E") center/contain no-repeat;
}

.editor-trash-zone.drag-over-trash .editor-trash-icon {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ef4444' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='3 6 5 6 21 6'/%3E%3Cpath d='M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2'/%3E%3Cline x1='10' y1='11' x2='10' y2='17'/%3E%3Cline x1='14' y1='11' x2='14' y2='17'/%3E%3C/svg%3E");
}

.editor-trash-label {
    font-size: 0.7rem;
    line-height: 1.2;
    text-align: center;
    color: var(--color-text-muted);
    max-width: 4rem;
}

.editor-trash-zone.drag-over-trash .editor-trash-label {
    color: var(--color-danger, #ef4444);
}

.editor-grid-wrap {
    flex: 1;
    min-width: 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: stretch;
    padding: 0.5rem;
}

.editor-grid-wrap .screen-ticker {
    flex-shrink: 0;
}

.editor-grid-wrap .player-grid {
    flex: 1;
}

.player-grid {
    display: grid;
    flex: 1;
    width: 100%;
    min-height: 0;
    gap: clamp(2px, 0.3vmin, 8px);
    padding: clamp(6px, 1vmin, 16px);
    grid-template-columns: repeat(var(--cols, 5), 1fr);
    grid-template-rows: repeat(var(--rows, 4), 1fr);
}

.player-grid>* {
    min-width: 0;
    min-height: 0;
    max-width: 100%;
    max-height: 100%;
    box-sizing: border-box;
}


/* Режим редактирования: наглядная сетка */

body.screen-edit .player-grid {
    position: relative;
    background: var(--color-surface-2);
    gap: 3px;
    padding: 10px;
    box-shadow: inset 0 0 0 1px var(--color-border);
    min-height: 320px;
}

body.screen-edit .player-grid>.edit-widget {
    position: relative;
    z-index: 1;
}


/* Подложка с ячейками — тот же размер, что и область сетки с виджетами */

.edit-grid-underlay {
    grid-row: 1 / -1;
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(var(--cols, 5), 1fr);
    grid-template-rows: repeat(var(--rows, 4), 1fr);
    gap: 3px;
    pointer-events: none;
    z-index: 0;
    min-width: 0;
    min-height: 0;
}

.edit-grid-slot {
    border: 1px dashed var(--color-border);
    border-radius: 6px;
    background: rgba(0, 0, 0, 0.2);
    min-width: 0;
    min-height: 0;
}


/* Пустая ячейка: крупный «+» — клик открывает палитру виджетов */

.edit-grid-slot--empty {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    cursor: pointer;
    pointer-events: auto;
}

.edit-grid-slot--empty::after {
    content: "+";
    display: flex;
    align-items: center;
    justify-content: center;
    width: clamp(26px, 5vmin, 44px);
    height: clamp(26px, 5vmin, 44px);
    border-radius: 10px;
    font-size: clamp(1.1rem, 2.8vmin, 1.75rem);
    font-weight: 300;
    line-height: 1;
    color: rgba(147, 197, 253, 0.14);
    background: rgba(59, 130, 246, 0.02);
    border: 1px dashed rgba(59, 130, 246, 0.1);
    box-shadow: none;
    pointer-events: none;
    transition: color 0.18s ease, background 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease, opacity 0.18s ease;
}


/* Подсветка только при наведении на конкретную пустую ячейку */

body.screen-edit .edit-grid-slot--empty:hover::after {
    color: rgba(186, 230, 253, 0.62);
    background: rgba(59, 130, 246, 0.16);
    border: 1px dashed rgba(96, 165, 250, 0.48);
    box-shadow: 0 0 0 1px rgba(59, 130, 246, 0.2), 0 0 20px rgba(59, 130, 246, 0.18);
    transform: scale(1.06);
}


/* Режим «кликните по ячейке» — плюс заметнее */

body.screen-edit .player-grid.grid-place-mode .edit-grid-slot--empty::after {
    color: rgba(255, 255, 255, 0.78);
    background: rgba(59, 130, 246, 0.22);
    border: 1px solid rgba(96, 165, 250, 0.45);
    box-shadow: 0 0 0 1px rgba(59, 130, 246, 0.15);
    transform: scale(1.04);
}

body.screen-edit .player-grid.grid-place-mode .edit-grid-slot--empty:hover::after {
    color: rgba(255, 255, 255, 0.95);
    background: rgba(59, 130, 246, 0.32);
    border-color: rgba(147, 197, 253, 0.65);
    box-shadow: 0 0 0 1px rgba(96, 165, 250, 0.35), 0 0 24px rgba(59, 130, 246, 0.28);
    transform: scale(1.08);
}


/* При перетаскивании виджета — мягче, чтобы не спорить с подсветкой drop */

body.screen-edit .player-grid.drag-over-grid .edit-grid-slot--empty::after {
    opacity: 0.45;
    transform: scale(0.96);
}


/* Затемнение при перетаскивании — поверх виджетов, чтобы они тоже затемнялись */

.edit-grid-dim {
    position: absolute;
    inset: 10px;
    background: rgba(0, 0, 0, 0.55);
    pointer-events: none;
    z-index: 2;
    opacity: 0;
    transition: opacity 0.2s ease;
    border-radius: 6px;
}

body.screen-edit .player-grid.drag-over-grid .edit-grid-dim {
    opacity: 1;
}


/* Пунктирная сетка поверх затемнения — видна при перетаскивании */

.edit-grid-slots-overlay {
    position: absolute;
    inset: 10px;
    display: grid;
    grid-template-columns: repeat(var(--cols, 5), 1fr);
    grid-template-rows: repeat(var(--rows, 4), 1fr);
    gap: 3px;
    pointer-events: none;
    z-index: 3;
    min-width: 0;
    min-height: 0;
    opacity: 0;
    transition: opacity 0.2s ease;
}

body.screen-edit .player-grid.drag-over-grid .edit-grid-slots-overlay {
    opacity: 1;
}

.edit-grid-slots-overlay-cell {
    border: 1px dashed rgba(255, 255, 255, 0.5);
    border-radius: 6px;
    background: transparent;
}


/* Слой зелёных ячеек поверх пунктира */

.edit-grid-drop-highlight {
    position: absolute;
    inset: 10px;
    display: grid;
    grid-template-columns: repeat(var(--cols, 5), 1fr);
    grid-template-rows: repeat(var(--rows, 4), 1fr);
    gap: 3px;
    pointer-events: none;
    z-index: 4;
    min-width: 0;
    min-height: 0;
}

.edit-grid-drop-cell {
    border-radius: 6px;
    background: transparent;
    transition: background 0.15s ease, box-shadow 0.15s ease;
}

.edit-grid-drop-cell.edit-grid-slot-drop-ok {
    background: rgba(34, 197, 94, 0.5);
    box-shadow: inset 0 0 0 2px rgba(34, 197, 94, 0.95);
}

body.screen-edit .player-cell.edit-widget {
    box-shadow: 0 0 0 1px rgba(59, 130, 246, 0.5);
}

body.screen-edit .player-grid.drag-over-grid .edit-grid-slot {
    background: rgba(59, 130, 246, 0.15);
}

body.screen-edit .player-grid.grid-place-mode .edit-grid-slot {
    background: rgba(59, 130, 246, 0.12);
}

body.screen-edit .player-grid.drag-over-grid {
    background: rgba(59, 130, 246, 0.08);
}


/* Карточки виджетов: glassmorphism, адаптивные отступы и шрифт (em от базового размера плеера). */

.player-cell {
    background: var(--glass-bg);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-width: var(--block-border-width, 0);
    border-style: solid;
    border-color: var(--block-border-color, var(--glass-border));
    border-radius: 0;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: clamp(0.25em, 1.5vmin, 0.75em);
    font-size: 1em;
    line-height: 1.35;
    box-shadow: var(--shadow);
    min-width: 0;
    min-height: 0;
    max-width: 100%;
    max-height: 100%;
    box-sizing: border-box;
    transition: background var(--transition-theme), border-color var(--transition-theme), box-shadow var(--transition), transform var(--transition);
}

.player-cell:hover {
    box-shadow: var(--shadow), var(--shadow-glow);
}

.player-wrap[data-cells-rounded="true"] .player-cell {
    border-radius: var(--radius-sm);
}


/* Тулбар редактирования — в стиле панели, инпуты и кнопки */

.editor-chrome {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    min-width: 0;
    z-index: 2;
}

.editor-chrome-panels {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

body.screen-edit.editor-chrome-collapsed .editor-chrome-panels {
    display: none;
}

.editor-chrome-mini {
    display: none;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
    padding: 0.4rem 0.75rem;
    background: var(--color-surface);
    border-bottom: 1px solid var(--color-border);
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.03);
}

body.screen-edit.editor-chrome-collapsed .editor-chrome-mini {
    display: flex;
}

.editor-chrome-mini-spacer {
    flex: 1;
    min-width: 0.5rem;
}

.editor-chrome-mini-caption {
    font-size: 0.78rem;
    line-height: 1.25;
    max-width: min(42rem, 100%);
}

.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.editor-chrome-collapse-btn {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.35rem;
    min-width: 2.25rem;
    min-height: 2.25rem;
}

.editor-chrome-collapse-btn svg {
    display: block;
}

.editor-chrome-expand-btn {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.35rem;
    min-width: 2.25rem;
    min-height: 2.25rem;
}

.editor-chrome-expand-btn svg {
    display: block;
}

.editor-chrome-save-mini {
    flex-shrink: 0;
    font-size: 0.88rem;
    padding: 0.35rem 0.65rem;
}

.editor-chrome-mini-link {
    flex-shrink: 0;
    font-size: 0.86rem;
    padding: 0.35rem 0.55rem;
    text-decoration: none;
}

.screen-toolbar {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.65rem 1rem;
    background: var(--color-surface);
    border-bottom: 1px solid var(--color-border);
    flex-shrink: 0;
    flex-wrap: wrap;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.03);
}

body.screen-edit .screen-toolbar {
    padding: 0.5rem 0.75rem;
    gap: 0.45rem;
}

body.screen-edit .screen-toolbar-ticker {
    margin-top: 0;
    padding-top: 0.45rem;
    border-top: 1px solid var(--color-border);
}

.editor-screen-theme-row {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem 0.5rem;
    max-width: 100%;
}

.editor-screen-theme-select {
    min-width: 11rem;
    width: auto;
}

.editor-screen-theme-auto-wrap {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem 0.45rem;
}

.editor-screen-theme-tz-hint {
    font-size: 0.78rem;
    white-space: nowrap;
}

.screen-toolbar .editor-label {
    font-size: 0.8rem;
    color: var(--color-text-muted);
    font-weight: 500;
}

.screen-toolbar-sep {
    color: var(--color-border);
    margin: 0 0.25rem;
    font-size: 0.85rem;
    user-select: none;
}

.screen-toolbar .editor-number {
    width: 3.5rem;
    padding: 0.4rem 0.5rem;
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-border);
    background: var(--color-bg);
    color: var(--color-text);
    font-size: 0.9rem;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.screen-toolbar .editor-number:focus {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.2);
}

.screen-toolbar select.options-input {
    padding: 0.4rem 0.6rem;
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-border);
    background: var(--color-bg);
    color: var(--color-text);
    font-size: 0.9rem;
    font-family: inherit;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.screen-toolbar select.options-input:focus {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.2);
}

.screen-name-input,
.screen-slug-input {
    width: 8rem;
    padding: 0.4rem 0.6rem;
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-border);
    background: var(--color-bg);
    color: var(--color-text);
    font-size: 0.9rem;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.screen-name-input:focus,
.screen-slug-input:focus {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.2);
}

.screen-toolbar .btn {
    padding: 0.4rem 0.75rem;
    font-size: 0.9rem;
    border-radius: var(--radius-sm);
    transition: background 0.2s ease, border-color 0.2s ease, transform 0.15s ease, box-shadow 0.2s ease;
}

.screen-toolbar .btn:hover {
    transform: translateY(-1px);
}

.screen-toolbar .btn-primary {
    box-shadow: 0 1px 3px rgba(59, 130, 246, 0.25);
}

.screen-toolbar .btn-primary:hover {
    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.35);
}

.screen-toolbar-add {
    position: relative;
}


/* Ручной режим в редакторе: компактная подсказка, без крупной primary-кнопки */

.editor-manual-mode-wrap {
    align-items: center;
    gap: 0.35rem;
    flex-wrap: wrap;
    max-width: min(38rem, 94vw);
}

.editor-manual-mode-panel,
.editor-manual-mode-compact {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    flex-wrap: wrap;
    min-width: 0;
}

.editor-manual-mode-compact {
    display: none;
}

.editor-manual-mode-wrap.is-collapsed .editor-manual-mode-panel {
    display: none;
}

.editor-manual-mode-wrap.is-collapsed .editor-manual-mode-compact {
    display: flex;
}

.editor-manual-mode-badge {
    flex-shrink: 0;
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding: 0.14rem 0.45rem;
    border-radius: 999px;
    background: var(--color-surface-2, rgba(0, 0, 0, 0.06));
    color: var(--color-text-muted);
    border: 1px solid var(--color-border);
}

.editor-manual-mode-toolbar-hint {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 0.76rem;
    line-height: 1.25;
    color: var(--color-text-muted);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.screen-toolbar .editor-manual-mode-btn-cal {
    flex-shrink: 0;
    padding: 0.28rem 0.55rem;
    font-size: 0.78rem;
    white-space: nowrap;
}

.editor-manual-mode-dismiss,
.editor-manual-mode-expand {
    flex-shrink: 0;
    margin: 0;
    padding: 0.12rem 0.38rem;
    border: none;
    border-radius: var(--radius-sm);
    background: transparent;
    color: var(--color-text-muted);
    font-size: 1.05rem;
    line-height: 1;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}

.editor-manual-mode-expand {
    font-size: 0.82rem;
    font-weight: 600;
}

.editor-manual-mode-dismiss:hover,
.editor-manual-mode-expand:hover {
    background: var(--color-surface-2, rgba(0, 0, 0, 0.06));
    color: var(--color-text);
}

.screen-toolbar-ticker {
    background: var(--color-surface-2);
    border-bottom: 1px solid var(--color-border);
}

.screen-toolbar-ticker .screen-name-input {
    width: 14rem;
}

.screen-toolbar-ticker select.options-input {
    padding: 0.4rem 0.5rem;
}

.screen-toolbar-ticker .editor-number {
    width: 4rem;
}

.screen-palette-dropdown {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    margin-top: 8px;
    background: var(--color-surface-solid);
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
    padding: 1rem;
    z-index: 1000;
    max-height: 380px;
    overflow-y: auto;
    overflow-x: hidden;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.35), 0 0 0 1px rgba(255, 255, 255, 0.06);
    min-width: 500px;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.5rem;
    justify-items: stretch;
}

.screen-palette-dropdown.open {
    display: grid;
    animation: palette-fade-in 0.2s ease;
}

@keyframes palette-fade-in {
    from {
        opacity: 0;
        transform: translateY(-4px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.screen-palette-dropdown .widget-chip {
    margin: 0;
    padding: 0.7rem 0.85rem;
    font-size: 0.9rem;
    font-weight: 500;
    border-radius: var(--radius-sm);
    text-align: left;
    justify-content: flex-start;
    display: flex;
    align-items: flex-start;
    min-width: 0;
    background: var(--color-surface-2);
    border: 1px solid transparent;
    color: var(--color-text);
    transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

.screen-palette-dropdown .widget-chip-inner {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    align-items: flex-start;
    width: 100%;
    min-width: 0;
}

.screen-palette-dropdown .widget-chip-name {
    font-weight: 600;
    font-size: 0.9rem;
    line-height: 1.2;
    color: var(--color-text);
}

.screen-palette-dropdown .widget-chip-desc {
    font-size: 0.75rem;
    font-weight: 400;
    line-height: 1.25;
    color: var(--color-text-muted);
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.screen-palette-dropdown .widget-chip-meta {
    font-size: 0.68rem;
    font-weight: 500;
    letter-spacing: 0.02em;
    color: var(--color-text-muted);
    opacity: 0.95;
}

.screen-palette-dropdown .widget-chip:hover {
    background: rgba(59, 130, 246, 0.15);
    border-color: var(--color-primary);
    box-shadow: 0 0 0 1px var(--color-primary);
}

.screen-palette-dropdown .widget-chip:active {
    background: rgba(59, 130, 246, 0.25);
}


/* Редактируемый виджет: полоска для перетаскивания (только в админке) и ручка ресайза */

.edit-widget {
    position: relative;
    cursor: default;
    padding-top: 20px;
}

.edit-widget .widget-drag-strip {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    height: 20px;
    background: rgba(59, 130, 246, 0.25);
    border-bottom: 1px solid rgba(59, 130, 246, 0.5);
    cursor: grab;
    z-index: 3;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.edit-widget .widget-drag-strip::before {
    content: '';
    width: 24px;
    height: 4px;
    border-radius: 2px;
    background: rgba(59, 130, 246, 0.7);
}

.edit-widget .widget-drag-strip:active {
    cursor: grabbing;
}

.widget-resize-handle {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 20px;
    height: 20px;
    background: var(--color-primary);
    opacity: 0.8;
    border-radius: 4px 0 0 0;
    cursor: nwse-resize;
    flex-shrink: 0;
}

.widget-resize-handle:hover {
    opacity: 1;
}

.edit-widget .widget-resize-handle {
    z-index: 2;
}


/* Адаптивный размер по количеству ячеек: em от базового размера плеера. Padding ячеек единый. */

.player-cell.cells-1 {
    font-size: 0.56em;
    padding: var(--player-cell-pad);
}

.player-cell.cells-2 {
    font-size: 0.65em;
    padding: var(--player-cell-pad);
}

.player-cell.cells-3 {
    font-size: 0.74em;
    padding: var(--player-cell-pad);
}

.player-cell.cells-4 {
    font-size: 0.82em;
    padding: var(--player-cell-pad);
}

.player-cell.cells-6 {
    font-size: 0.92em;
    padding: var(--player-cell-pad);
}

.player-cell.cells-8 {
    font-size: 0.98em;
    padding: var(--player-cell-pad);
}

.player-cell.cells-9 {
    font-size: 1.04em;
    padding: var(--player-cell-pad);
}

.player-cell.cells-12 {
    font-size: 1.1em;
    padding: var(--player-cell-pad);
}

.player-cell.cells-16,
.player-cell.cells-20,
.player-cell.cells-24 {
    font-size: 1.2em;
    padding: var(--player-cell-pad);
}


/* Настройки шрифта из панели виджета: семейство и размер в px (адаптивно через clamp). */

.player-cell {
    font-family: var(--widget-font-family, inherit);
}

.player-cell.widget-font-size-custom {
    font-size: var(--widget-font-size);
}


/* ——— Виджеты: единый отступ блоков --widget-block-pad (10px), шрифт и интервалы в em ——— */


/* Общий стиль карточки для виджетов (inner + иконка + подпись); закругление и рамка настраиваются через --block-* на ячейке */

.widget-card {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--widget-gap);
    width: 100%;
    min-height: 100%;
    padding: var(--widget-pad);
    border-radius: var(--block-radius, var(--radius));
    background: var(--glass-bg);
    border-width: var(--block-border-width, 0);
    border-style: solid;
    border-color: var(--block-border-color, var(--glass-border));
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);
    transition: border-color var(--transition), box-shadow var(--transition);
}

.player-cell:hover .widget-card,
.player-cell:focus-within .widget-card {
    border-color: rgba(59, 130, 246, 0.35);
    box-shadow: 0 0 0 1px rgba(59, 130, 246, 0.2);
}

.widget-card-icon {
    flex-shrink: 0;
    width: 1.25em;
    height: 1.25em;
    border-radius: 6px;
    border: 2px solid var(--color-primary);
    background: linear-gradient(145deg, var(--color-surface-2), var(--color-surface));
    position: relative;
    opacity: 0.9;
}

.widget-card-label {
    font-size: 0.5em;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--color-text-muted);
    line-height: 1.2;
}

.widget-card-label:empty {
    display: none;
}


/* Иконки и карточки: custom, news, holidays, schedule, weather, schoolinfo, birthdays, polling_station, taskmanager */

.widget-custom-inner,
.widget-news-inner,
.widget-holidays-inner {
    flex-direction: column;
    gap: var(--widget-gap);
}

.widget-custom--no-icon .widget-custom-icon,
.widget-news--no-icon .widget-news-icon,
.widget-holidays--no-icon .widget-holidays-icon,
.widget-weather--no-icon .widget-weather-card-icon,
.widget-schoolinfo--no-icon .widget-schoolinfo-icon,
.widget-birthdays--no-icon .widget-birthdays-icon,
.widget-polling-station--no-icon .widget-polling-station-icon,
.widget-taskmanager--no-icon .widget-taskmanager-icon,
.widget-canteen-shifts--no-icon .widget-canteen-shifts-icon,
.widget-promo--no-icon .widget-promo-icon,
.widget-canteen-rules--no-icon .widget-canteen-rules-icon,
.widget-canteen-status--no-icon .widget-canteen-status-icon {
    display: none;
}

.widget-custom-icon::before {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 50%;
    height: 60%;
    border: 2px solid var(--color-primary);
    border-radius: 3px;
}

.widget-news-icon::before {
    content: '';
    position: absolute;
    left: 50%;
    top: 35%;
    transform: translate(-50%, 0);
    width: 70%;
    height: 2px;
    background: var(--color-primary);
    border-radius: 1px;
    box-shadow: 0 0.2em 0 var(--color-primary), 0 0.4em 0 var(--color-primary);
}

.widget-holidays-icon::before {
    content: '★';
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    font-size: 0.7em;
    color: var(--color-primary);
}

.widget-weather-card-icon::before {
    content: '';
    position: absolute;
    left: 50%;
    top: 45%;
    transform: translate(-50%, -50%);
    width: 70%;
    height: 35%;
    border-radius: 50%;
    border: 2px solid var(--color-primary);
}

.widget-schoolinfo-icon::before {
    content: '';
    position: absolute;
    left: 50%;
    top: 30%;
    transform: translate(-50%, 0);
    width: 50%;
    height: 35%;
    border: 2px solid var(--color-primary);
    border-radius: 2px 2px 0 0;
}

.widget-birthdays-icon::before {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 45%;
    height: 45%;
    border: 2px solid var(--color-primary);
    border-radius: 50%;
    background: linear-gradient(145deg, transparent 45%, var(--color-primary) 45%);
}

.widget-polling-station-icon::before {
    content: '';
    position: absolute;
    left: 50%;
    top: 35%;
    transform: translate(-50%, 0);
    width: 55%;
    height: 40%;
    border: 2px solid var(--color-primary);
    border-radius: 2px;
}

.widget-taskmanager-icon::before {
    content: '✓';
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    font-size: 0.65em;
    font-weight: 700;
    color: var(--color-primary);
}

.widget-weather-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--widget-gap);
    padding: var(--widget-pad);
}

.widget-weather-wrap .widget-weather-inner {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: var(--widget-gap);
}

.widget-schoolinfo-inner.widget-card {
    flex-direction: column;
    gap: var(--widget-gap);
}

.widget-schoolinfo-main {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-width: 0;
    flex: 1;
}

.widget-schoolinfo-main--logo-left {
    flex-direction: row;
}

.widget-schoolinfo-main--logo-right {
    flex-direction: row-reverse;
}

.widget-schoolinfo-main--logo-top {
    flex-direction: column;
}

.widget-schoolinfo-main--logo-bottom {
    flex-direction: column-reverse;
}

.widget-schoolinfo-logo-wrap {
    flex: 0 1 auto;
    min-width: 2.5em;
    min-height: 2.5em;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--widget-pad-single);
    border-radius: 0.5em;
    overflow: hidden;
}


/* Логотип в квадрате: не на весь виджет, с отступами; размер области настраивается (Маленький / Средний / Большой) */

.widget-schoolinfo-main--logo-left .widget-schoolinfo-logo-wrap,
.widget-schoolinfo-main--logo-right .widget-schoolinfo-logo-wrap {
    aspect-ratio: 1;
    height: auto;
    max-height: 100%;
    align-self: center;
    flex: 0 0 auto;
    margin: var(--widget-gap-sm);
    box-sizing: border-box;
}

.widget-schoolinfo-main--logo-top .widget-schoolinfo-logo-wrap,
.widget-schoolinfo-main--logo-bottom .widget-schoolinfo-logo-wrap {
    aspect-ratio: 1;
    height: auto;
    align-self: center;
    flex: 0 0 auto;
    margin: var(--widget-gap-sm);
    box-sizing: border-box;
}


/* Размер области логотипа (квадрат): ограничен в em, чтобы не занимать весь виджет */

.widget-schoolinfo-logo-wrap--area-small {
    width: min(14%, 2.8em);
    max-width: 2.8em;
    max-height: 2.8em;
}

.widget-schoolinfo-main--logo-left .widget-schoolinfo-logo-wrap--area-small,
.widget-schoolinfo-main--logo-right .widget-schoolinfo-logo-wrap--area-small {
    width: min(14%, 2.8em);
}

.widget-schoolinfo-main--logo-top .widget-schoolinfo-logo-wrap--area-small,
.widget-schoolinfo-main--logo-bottom .widget-schoolinfo-logo-wrap--area-small {
    width: min(18%, 2.8em);
    max-height: 22%;
    max-width: 100%;
}

.widget-schoolinfo-logo-wrap--area-medium {
    width: min(20%, 4em);
    max-width: 4em;
    max-height: 4em;
}

.widget-schoolinfo-main--logo-left .widget-schoolinfo-logo-wrap--area-medium,
.widget-schoolinfo-main--logo-right .widget-schoolinfo-logo-wrap--area-medium {
    width: min(20%, 4em);
}

.widget-schoolinfo-main--logo-top .widget-schoolinfo-logo-wrap--area-medium,
.widget-schoolinfo-main--logo-bottom .widget-schoolinfo-logo-wrap--area-medium {
    width: min(22%, 4em);
    max-height: 22%;
    max-width: 100%;
}

.widget-schoolinfo-logo-wrap--area-large {
    width: min(26%, 5.5em);
    max-width: 5.5em;
    max-height: 5.5em;
}

.widget-schoolinfo-main--logo-left .widget-schoolinfo-logo-wrap--area-large,
.widget-schoolinfo-main--logo-right .widget-schoolinfo-logo-wrap--area-large {
    width: min(26%, 5.5em);
}

.widget-schoolinfo-main--logo-top .widget-schoolinfo-logo-wrap--area-large,
.widget-schoolinfo-main--logo-bottom .widget-schoolinfo-logo-wrap--area-large {
    width: min(28%, 5.5em);
    max-height: 28%;
    max-width: 100%;
}

.widget-schoolinfo-logo-wrap.widget-schoolinfo-logo-wrap--has-bg {
    padding: var(--widget-pad-single);
}

.widget-schoolinfo-logo--rotate-slow {
    animation: widget-schoolinfo-logo-spin 8s linear infinite;
}

.widget-schoolinfo-logo--rotate-fast {
    animation: widget-schoolinfo-logo-spin 3s linear infinite;
}

@keyframes widget-schoolinfo-logo-spin {
    to {
        transform: rotate(360deg);
    }
}


/* 3D вращение логотипа (объёмное) */

.widget-schoolinfo-logo--rotate-3d-slow {
    perspective: 900px;
}

.widget-schoolinfo-logo--rotate-3d-slow .widget-schoolinfo-logo {
    animation: widget-schoolinfo-logo-3d 8s linear infinite;
    display: block;
}

.widget-schoolinfo-logo--rotate-3d-fast {
    perspective: 900px;
}

.widget-schoolinfo-logo--rotate-3d-fast .widget-schoolinfo-logo {
    animation: widget-schoolinfo-logo-3d 3s linear infinite;
    display: block;
}

@keyframes widget-schoolinfo-logo-3d {
    from {
        transform: rotateY(0deg);
    }
    to {
        transform: rotateY(360deg);
    }
}


/* Разметка: default — обычный gap; space-between — логотип и текст по краям */

.widget-schoolinfo-main--layout-default {}

.widget-schoolinfo-main--layout-space-between {
    width: 100%;
    justify-content: space-between;
}

.widget-schoolinfo-text {
    min-width: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.25em;
}

.widget-birthdays-inner.widget-card,
.widget-polling-station-inner.widget-card,
.widget-taskmanager-inner.widget-card {
    flex-direction: column;
    gap: var(--widget-gap);
}

.widget-birthdays-main,
.widget-polling-station-main,
.widget-taskmanager-main {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 0;
    overflow: auto;
}

.widget-slider-inner.widget-card {
    padding: var(--widget-pad-single);
    overflow: hidden;
    height: 100%;
}

.widget-slider-inner .widget-slider-slick {
    width: 100%;
    min-height: 0;
    flex: 1;
}


/* Виджеты столовой: смены, акция, правила, статус */

.widget-canteen-shifts-inner.widget-card,
.widget-promo-inner.widget-card,
.widget-canteen-rules-inner.widget-card,
.widget-canteen-status-card.widget-card {
    flex-direction: column;
    gap: var(--widget-gap);
}

.widget-canteen-shifts-main {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 0;
    overflow: auto;
    align-self: stretch;
    width: 100%;
}

.widget-promo-main,
.widget-canteen-rules-main,
.widget-canteen-status-main {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 0;
    overflow: auto;
    width: 100%;
}

.widget-canteen-shifts-title,
.widget-promo-title,
.widget-canteen-rules-title {
    font-weight: 600;
    margin-bottom: var(--widget-gap-sm);
    font-size: 0.98em;
    text-align: center;
}

.widget-canteen-shifts-status {
    font-weight: 600;
    font-size: 0.9em;
    margin-bottom: var(--widget-gap);
    padding: var(--widget-box-pad);
    background: rgba(21, 128, 61, 0.25);
    border-radius: 6px;
    text-align: center;
    width: 100%;
    box-sizing: border-box;
}

.widget-canteen-shifts-countdown {
    font-size: 0.82em;
    opacity: 0.95;
    margin-bottom: var(--widget-gap-sm);
}

.widget-canteen-shifts-list {
    width: 100%;
    font-size: 0.88em;
}

.widget-canteen-shifts-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.88em;
}

.widget-canteen-shifts-table td,
.widget-canteen-shifts-table th {
    padding: var(--widget-box-pad);
    border: 1px solid var(--color-border);
    text-align: center;
}

.widget-canteen-shifts-table .widget-canteen-shifts-time {
    font-variant-numeric: tabular-nums;
}

.widget-canteen-shifts-table tr.widget-canteen-shifts-row--current {
    background: rgba(21, 128, 61, 0.35);
    font-weight: 600;
}

.widget-canteen-shifts-table tr.widget-canteen-shifts-row--current td {
    border-color: rgba(21, 128, 61, 0.5);
}

.widget-promo-text {
    font-size: 1em;
    font-weight: 500;
    margin: var(--widget-gap-sm) 0;
}

.widget-promo-until {
    font-size: 0.82em;
    opacity: 0.9;
}

.widget-promo-image {
    margin: var(--widget-gap-sm) 0;
    width: 100%;
}

.widget-promo-image img {
    width: 100%;
    max-width: 100%;
    max-height: 260px;
    height: auto;
    object-fit: cover;
    border-radius: 10px;
    display: block;
}

.widget-promo-list {
    display: flex;
    flex-direction: column;
    gap: var(--widget-gap-md, 1rem);
    margin: var(--widget-gap-sm) 0;
    width: 100%;
}

.widget-promo-item {
    padding: var(--widget-gap-sm) 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.widget-promo-item:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.widget-promo-item-title {
    font-weight: 600;
    font-size: 1.05em;
    margin-bottom: 0.25em;
}

.widget-promo-item-text {
    font-size: 1em;
    font-weight: 500;
    margin: 0.25em 0;
}

.widget-canteen-rules-main {
    align-self: stretch;
    width: 100%;
    box-sizing: border-box;
}

.widget-canteen-rules-list {
    width: 100%;
    text-align: left;
    font-size: 0.88em;
}

.widget-canteen-rules-table {
    width: 100%;
    max-width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}

.widget-canteen-rules-table td {
    padding: var(--widget-gap-xs) var(--widget-gap-sm);
    vertical-align: middle;
    border-bottom: 1px solid var(--color-border);
}

.widget-canteen-rules-table tr:last-child td {
    border-bottom: none;
}

.widget-canteen-rules-num {
    width: 1.5em;
    font-weight: 600;
    color: var(--color-primary);
    white-space: nowrap;
}

.widget-canteen-rules-cell {}

.widget-canteen-rules-hours {
    flex-shrink: 0;
    font-size: 0.82em;
    color: var(--color-text-muted);
    margin-top: var(--widget-gap-sm);
}

.widget-canteen-status-inner {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 2em;
    width: 100%;
    text-align: center;
}

.widget-canteen-status-text {
    font-weight: 600;
    font-size: 0.95em;
}


/* Иконки виджетов столовой — разные для каждого типа */

.widget-canteen-shifts-icon::before {
    content: '';
    position: absolute;
    left: 50%;
    top: 28%;
    transform: translate(-50%, 0);
    width: 36%;
    height: 26%;
    border: 2px solid var(--color-primary);
    border-radius: 50%;
    border-bottom: none;
}

.widget-canteen-shifts-icon::after {
    content: '';
    position: absolute;
    left: 50%;
    top: 38%;
    width: 2px;
    height: 18%;
    background: var(--color-primary);
    transform: translate(-50%, 0) rotate(-45deg);
    transform-origin: 50% 100%;
}

.widget-promo-icon::before {
    content: '★';
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    font-size: 0.7em;
    color: var(--color-primary);
}

.widget-canteen-rules-icon::before {
    content: '';
    position: absolute;
    left: 50%;
    top: 32%;
    transform: translate(-50%, 0);
    width: 65%;
    height: 2px;
    background: var(--color-primary);
    border-radius: 1px;
    box-shadow: 0 0.25em 0 var(--color-primary), 0 0.5em 0 var(--color-primary);
}

.widget-canteen-status-icon::before {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 35%;
    height: 35%;
    background: var(--color-primary);
    border-radius: 50%;
    opacity: 0.9;
}


/* Виджет: Погода — текст по умолчанию яркий (белый/чёрный без прозрачности) */

.widget-weather {
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.widget-weather-inner {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: var(--widget-gap);
    width: 100%;
    min-height: 3em;
    font-size: var(--weather-font-size, inherit);
}

.widget-weather-city {
    font-size: 0.85em;
    color: var(--weather-text-color, var(--color-text));
    width: 100%;
}

.widget-weather-flip {
    position: relative;
    width: 100%;
    min-height: 2.5em;
}

.widget-weather-slide {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    opacity: 0;
    transition: opacity 0.4s ease;
    pointer-events: none;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.2em;
}

.widget-weather-slide--active {
    position: relative;
    opacity: 1;
    pointer-events: auto;
}

.widget-weather-period {
    font-size: 0.75em;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--weather-text-color, var(--color-text));
}

.widget-weather-icon-temp-row {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 0.4em;
    flex-wrap: nowrap;
}

.widget-weather-temp {
    font-weight: 700;
    font-size: 1.15em;
    color: var(--weather-text-color, var(--color-text));
}

.widget-weather-wind {
    font-size: 0.78em;
    color: var(--weather-text-color, var(--color-text));
}

.widget-weather-wind-direction {
    font-size: 0.78em;
    color: var(--weather-text-color, var(--color-text));
}

.weather-widget__wind-speed {
    font-size: 0.78em;
    color: var(--weather-text-color, var(--color-text));
}

.weather-widget__wind-direction {
    font-size: 0.78em;
    color: var(--weather-text-color, var(--color-text));
}

.widget-weather.widget-weather--text-muted .widget-weather-inner {
    --weather-text-color: var(--color-text-muted);
}

.widget-weather.widget-weather--text-muted .widget-weather-city {
    color: var(--color-text-muted);
}

.widget-weather.widget-weather--text-muted .widget-weather-period {
    color: var(--color-text-muted);
}

.widget-weather.widget-weather--text-muted .widget-weather-temp {
    color: var(--color-text-muted);
}

.widget-weather.widget-weather--text-muted .widget-weather-wind {
    color: var(--color-text-muted);
}

.widget-weather.widget-weather--text-muted .widget-weather-wind-direction {
    color: var(--color-text-muted);
}

.widget-weather.widget-weather--text-muted .weather-widget__wind-speed {
    color: var(--color-text-muted);
}

.widget-weather.widget-weather--text-muted .weather-widget__wind-direction {
    color: var(--color-text-muted);
}

.weather-widget__img.widget-weather-icon-img {
    width: 2.2em;
    height: 2.2em;
    flex-shrink: 0;
    object-fit: contain;
}

.widget-weather-icon {
    width: 2.2em;
    height: 2.2em;
    flex-shrink: 0;
}


/* Виджет: Праздники */

.widget-holidays {
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.widget-holidays .widget-holidays-title {
    font-weight: 600;
    margin-bottom: 0.18em;
}

.widget-holidays .widget-holidays-value {
    font-size: 0.95em;
    color: var(--color-text-muted);
}

.widget-holidays .widget-holidays-item {
    margin-top: 0.22em;
    line-height: 1.3;
}

.widget-holidays .widget-holidays-item:first-child {
    margin-top: 0;
}


/* Новости список */

.widget-news-list {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.22em;
}

.widget-news-item {
    font-size: 0.92em;
    color: var(--color-text-muted);
    line-height: 1.35;
    text-align: center;
}

.widget-news-empty {
    font-style: italic;
    opacity: 0.9;
    text-align: center;
}


/* Виджет: Новости / Объявления */

.widget-announcements {
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.widget-news-title {
    font-weight: 600;
    opacity: 0.95;
    margin-bottom: 0.18em;
    text-align: center;
}

.widget-news-text {
    font-size: 0.95em;
    color: var(--color-text-muted);
    line-height: 1.4;
    text-align: center;
}


/* Виджет: Информация о школе */

.widget-schoolinfo {
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: var(--widget-pad-single);
}

.widget-schoolinfo-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--widget-gap);
    width: 100%;
}

.widget-schoolinfo-logo {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
    object-position: center;
    display: block;
}

.widget-schoolinfo-name {
    font-weight: 700;
    font-size: 1em;
    line-height: 1.25;
}

.widget-schoolinfo-desc {
    font-size: 0.88em;
    color: var(--color-text-muted);
    line-height: 1.35;
    white-space: pre-wrap;
    word-break: break-word;
}


/* Виджет: Дни рождения */

.widget-birthdays {
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.widget-birthdays-inner {
    min-height: 2em;
    width: 100%;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    overflow: auto;
    flex: 1;
}

.widget-birthdays .widget-birthdays-title {
    font-weight: 600;
    margin-bottom: 0.25em;
    flex-shrink: 0;
}

.widget-birthdays-list {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.2em;
    min-height: 0.5em;
    width: 100%;
}

.widget-birthdays-item {
    font-size: 0.95em;
    line-height: 1.35;
    text-align: center;
}

.widget-birthdays-today {
    font-weight: 600;
    color: var(--color-text);
}

.widget-birthdays-badge {
    font-size: 0.75em;
    font-weight: normal;
    opacity: 0.9;
    margin-left: 0.2em;
}

.widget-birthdays-empty {
    font-size: 0.9em;
    color: var(--color-text-muted);
    font-style: italic;
}


/* Виджет: Информация избирательного участка */

.widget-polling-station {
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.widget-polling-station .widget-polling-title {
    font-weight: 600;
    margin-bottom: 0.25em;
}

.widget-polling-content {
    font-size: 0.92em;
    color: var(--color-text-muted);
    line-height: 1.5;
    text-align: center;
}


/* Виджет: Task manager */

.widget-taskmanager {
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.widget-taskmanager-inner {
    min-height: 2em;
    width: 100%;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    overflow: auto;
}

.widget-taskmanager .widget-taskmanager-title {
    font-weight: 600;
    margin-bottom: 0.25em;
    flex-shrink: 0;
}

.widget-taskmanager-list {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.18em;
    min-height: 0.5em;
    width: 100%;
    max-width: 100%;
}

.widget-taskmanager-item {
    font-size: 0.95em;
    line-height: 1.35;
    padding-left: 1.2em;
    position: relative;
    text-align: left;
}

.widget-taskmanager-item::before {
    content: '○';
    position: absolute;
    left: 0;
    color: var(--color-text-muted);
}

.widget-taskmanager-done {
    text-decoration: line-through;
    color: var(--color-text-muted);
}

.widget-taskmanager-done::before {
    content: '✓';
    color: var(--color-primary);
}


/* Виджет: Свой виджет */

.widget-custom {
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.widget-custom .widget-custom-title {
    font-weight: 600;
    margin-bottom: 0.22em;
}

.widget-custom .widget-custom-content {
    font-size: 0.95em;
    color: var(--color-text-muted);
    line-height: 1.4;
    white-space: pre-wrap;
    word-break: break-word;
    text-align: center;
}

.widget-customjs .widget-customjs-inner {
    min-height: 1.5em;
}

.widget-customjs-placeholder {
    font-size: 0.88em;
    color: var(--color-text-muted);
}

.widget-customjs-error {
    font-size: 0.88em;
    color: #dc2626;
}


/* Виджет: Популярные букеты */

.widget-popular-bouquets {
    flex-direction: column;
    align-items: stretch;
    text-align: left;
}

.widget-popular-bouquets-inner {
    min-height: 2em;
    width: 100%;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    overflow: hidden;
}

.widget-popular-bouquets-inner.widget-card {
    flex-direction: column;
    gap: var(--widget-gap);
    padding: calc(var(--widget-pad) * 1.1);
    height: 100%;
}

.widget-popular-bouquets-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.35em;
}

.widget-popular-bouquets-title {
    font-weight: 650;
    font-size: 1.02em;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.widget-popular-bouquets-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
    gap: var(--widget-gap);
}

.widget-popular-bouquet-card {
    display: flex;
    flex-direction: column;
    background: radial-gradient(circle at top left, rgba(251, 191, 36, 0.18), transparent 60%), radial-gradient(circle at bottom right, rgba(244, 114, 182, 0.20), transparent 55%);
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.04);
}

.widget-popular-bouquet-image {
    position: relative;
    padding-top: 62%;
    overflow: hidden;
}

.widget-popular-bouquet-image img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.widget-popular-bouquet-info {
    padding: 0.5em 0.75em 0.6em;
    display: flex;
    flex-direction: column;
    gap: 0.18em;
}

.widget-popular-bouquet-name {
    font-weight: 600;
    font-size: 0.95em;
}

.widget-popular-bouquet-price {
    font-weight: 650;
    font-size: 0.9em;
    color: var(--color-primary, #f97316);
}

.widget-popular-bouquet-empty {
    font-size: 0.9em;
    color: var(--color-text-muted);
    font-style: italic;
}


/* Виджет: Цены на цветы */

.widget-flower-prices {
    flex-direction: column;
    align-items: stretch;
    text-align: left;
}

.widget-flower-prices-inner {
    min-height: 2em;
    width: 100%;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    overflow: hidden;
}

.widget-flower-prices-inner.widget-card {
    flex-direction: column;
    gap: var(--widget-gap);
    padding: calc(var(--widget-pad) * 1.1);
    height: 100%;
}

.widget-flower-prices-header {
    margin-bottom: 0.3em;
}

.widget-flower-prices-title {
    font-weight: 650;
    font-size: 1.02em;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.widget-flower-prices-list {
    display: flex;
    flex-direction: column;
    gap: 0.18em;
}

.widget-flower-prices-row {
    display: flex;
    justify-content: space-between;
    gap: 0.75em;
    font-size: 0.95em;
    line-height: 1.3;
}

.widget-flower-prices-name {
    color: var(--color-text);
}

.widget-flower-prices-price {
    font-weight: 600;
    color: var(--color-primary, #f97316);
    white-space: nowrap;
}

.widget-flower-prices-empty {
    font-size: 0.9em;
    color: var(--color-text-muted);
    font-style: italic;
}


/* Виджет: Таймер до закрытия (время из календаря/пресетов расписания) */

.widget-closing-timer {
    flex-direction: column;
    align-items: stretch;
    text-align: center;
}

.widget-closing-timer-inner {
    min-height: 2em;
    width: 100%;
    min-width: 0;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: var(--widget-gap);
    padding: var(--widget-pad);
}

.widget-closing-timer-inner.widget-card {
    flex-direction: row;
    gap: var(--widget-gap);
    padding: calc(var(--widget-pad) * 1.1);
    height: 100%;
}

.widget-closing-timer-icon {
    flex-shrink: 0;
    position: relative;
    width: 2em;
    height: 2em;
    opacity: 0.9;
}

.widget-closing-timer-icon::before {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    width: 1.1em;
    height: 1.1em;
    margin-left: -0.55em;
    margin-top: -0.55em;
    border: 2px solid currentColor;
    border-radius: 50%;
    box-sizing: border-box;
}

.widget-closing-timer-icon::after {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    width: 2px;
    height: 0.4em;
    margin-left: -1px;
    margin-top: -0.5em;
    background: currentColor;
    transform-origin: 50% 100%;
    transform: rotate(-45deg);
}

.widget-closing-timer-main {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.25em;
}

.widget-closing-timer-title {
    font-weight: 650;
    font-size: 0.95em;
    letter-spacing: 0.04em;
    color: var(--color-text);
}

.widget-closing-timer-status {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.15em;
}

.widget-closing-timer-status-text {
    font-weight: 600;
    font-size: 0.9em;
    color: var(--color-text);
}

.widget-closing-timer-time {
    font-variant-numeric: tabular-nums;
    font-size: 1.1em;
    opacity: 0.95;
}


/* Виджет: QR «Скачайте приложение» — крупный QR и подписи */

.widget-qr-app {
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.widget-qr-app-inner {
    min-height: 2em;
    width: 100%;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--widget-pad);
}

.widget-qr-app-inner.widget-card {
    padding: calc(var(--widget-pad) * 1.2);
    height: 100%;
}

.widget-qr-app-main {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5em;
    width: 100%;
}

.widget-qr-app-title {
    font-weight: 700;
    font-size: 1.05em;
    letter-spacing: 0.03em;
    color: var(--color-text);
    line-height: 1.2;
}

.widget-qr-app-code {
    line-height: 0;
}

.widget-qr-app-code img {
    display: block;
    max-width: 100%;
    height: auto;
    border-radius: 6px;
}

.widget-qr-app-placeholder {
    min-width: 140px;
    min-height: 140px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.85em;
    color: var(--color-text-muted);
    background: rgba(255, 255, 255, 0.06);
    border: 1px dashed rgba(255, 255, 255, 0.2);
    border-radius: 8px;
    padding: 1rem;
    text-align: center;
}

.widget-qr-app-caption {
    font-size: 0.9em;
    color: var(--color-text);
    opacity: 0.92;
    line-height: 1.3;
    max-width: 100%;
}


/* Бегущая строка: много копий текста по всей ширине, скорость через --ticker-duration */

.widget-ticker {
    display: flex;
    align-items: center;
    overflow: hidden;
    --ticker-duration: 25s;
    --ticker-copies: 25;
}

.widget-ticker-wrap {
    overflow: hidden;
    width: 100%;
}

.widget-ticker-inner {
    display: inline-flex;
    white-space: nowrap;
    animation: widget-ticker-marquee var(--ticker-duration) linear infinite;
    will-change: transform;
}

.widget-ticker-text {
    padding-right: 2em;
    flex-shrink: 0;
}

.widget-ticker--small .widget-ticker-inner {
    font-size: 0.85em;
}

.widget-ticker--medium .widget-ticker-inner {
    font-size: 1em;
}

.widget-ticker--large .widget-ticker-inner {
    font-size: 1.25em;
}

body.screen-edit .widget-ticker .widget-ticker-inner {
    animation: none;
}

@keyframes widget-ticker-marquee {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(calc(-100% / var(--ticker-copies, 25)));
    }
}


/* Полоса бегущей строки экрана (вверху/внизу, отдельно от сетки) */

.screen-ticker {
    flex-shrink: 0;
    width: 100%;
    overflow: hidden;
    display: flex;
    align-items: center;
    min-height: 2.5em;
    padding: var(--widget-pad);
    background: var(--color-surface-2);
    border-top: 1px solid var(--color-border);
    font-weight: 500;
}

.screen-ticker--top {
    border-top: none;
    border-bottom: 1px solid var(--color-border);
}

.screen-ticker:empty {
    display: none;
}

.screen-ticker .widget-ticker-wrap {
    width: 100%;
}


/* Виджет: Слайдер (Slick) */

.widget-slider {
    padding: 0;
    overflow: hidden;
    min-height: var(--slider-image-height, 160px);
    opacity: 1;
}

.widget-slider .widget-slider-slick {
    width: 100%;
    height: 100%;
    min-height: var(--slider-image-height, 160px);
}


/* Без заданной высоты — ограничиваем по умолчанию, чтобы большие картинки не растягивали слайдер */


/* До инициализации Slick — первый слайд виден сразу (без opacity: 0) */

.widget-slider .widget-slider-slick:not(.slick-initialized) .slider-slide {
    opacity: 1;
}

.widget-slider .widget-slider-slick:not(.slick-initialized) .slider-slide:not(:first-child) {
    display: none;
}


/* Slick при загрузке скрывает .slick-track — не скрывать, контент виден с первой отрисовки */

.widget-slider .slick-list,
.widget-slider .slick-track {
    visibility: visible !important;
}


/* В fade-режиме активный слайд всегда виден */

.widget-slider .slick-slide.slick-active {
    opacity: 1 !important;
}

.widget-slider .slider-slide {
    outline: none;
    min-height: var(--slider-image-height, 160px);
    overflow: hidden;
}

.widget-slider .widget-slider-slick {
    min-height: var(--slider-image-height, 160px);
}


/* Жёсткая высота, когда задана в настройках (data-image-height + --slider-image-height) */

.widget-slider-inner .widget-slider-slick,
.widget-slider-inner .slick-list,
.widget-slider-inner .slick-track,
.widget-slider-inner .slider-slide,
.widget-slider-inner .slider-slide img {
    height: 100% !important;
    min-height: 100% !important;
    max-height: 100% !important;
}

.slick-dotted.slick-slider {
    margin: 0 !important;
}

.widget-slider-inner[data-image-height] .widget-slider-slick,
.widget-slider-inner[data-image-height] .slick-list,
.widget-slider-inner[data-image-height] .slick-track,
.widget-slider-inner[data-image-height] .slider-slide,
.widget-slider-inner[data-image-height] .slider-slide img {
    height: var(--slider-image-height) !important;
    min-height: var(--slider-image-height) !important;
    max-height: var(--slider-image-height) !important;
}

.widget-slider .slider-slide img {
    width: 100%;
    height: 100%;
    min-height: var(--slider-image-height, 160px);
    object-fit: cover;
    display: block;
    background: var(--color-surface-2, #334155);
    animation: slider-zoom var(--slider-speed, 5s) ease-in-out infinite;
}


/* Подпись к слайду */

.widget-slider .slider-slide {
    position: relative;
}

.widget-slider .slider-caption {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 0.45em 0.9em;
    font-size: 0.9em;
    line-height: 1.3;
    color: #ffffff;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.7);
    background: linear-gradient(to top, rgba(0, 0, 0, 0.78), rgba(0, 0, 0, 0.0));
    box-sizing: border-box;
}

.widget-slider-inner[data-image-fit="contain"] .slider-slide img {
    object-fit: contain;
}

.widget-slider-inner[data-image-fit="fill"] .slider-slide img {
    object-fit: fill;
}

.widget-slider-inner[data-image-fit="none"] .slider-slide img {
    object-fit: none;
}

.widget-slider-inner[data-image-fit="scale-down"] .slider-slide img {
    object-fit: scale-down;
}

@keyframes slider-zoom {
    0%,
    100% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.06);
    }
}

.widget-slider-inner[data-image-height] img.slider-img {
    height: var(--slider-image-height) !important;
    min-height: var(--slider-image-height) !important;
    max-height: var(--slider-image-height) !important;
}

.widget-slider img.slider-img {
    width: 100%;
    height: 100%;
    min-height: var(--slider-image-height, 160px);
    object-fit: cover;
    display: block;
    background: var(--color-surface-2, #334155);
    animation: slider-zoom var(--slider-speed, 5s) ease-in-out infinite;
}

.widget-slider-inner[data-image-fit="contain"] img.slider-img {
    object-fit: contain;
}

.widget-slider-inner[data-image-fit="fill"] img.slider-img {
    object-fit: fill;
}

.widget-slider-inner[data-image-fit="none"] img.slider-img {
    object-fit: none;
}

.widget-slider-inner[data-image-fit="scale-down"] img.slider-img {
    object-fit: scale-down;
}

.widget-slider .slick-dots {
    bottom: 0.5em;
}

.widget-slider .slick-dots li button::before {
    color: rgba(255, 255, 255, 0.8);
    font-size: 0.5em;
}

.widget-slider .slick-dots li.slick-active button::before {
    color: #fff;
}

.widget-slider .slider-slide-placeholder {
    min-height: 160px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--color-surface-2, #334155);
    color: var(--color-text-muted);
    font-size: 0.9em;
}


/* Неизвестный тип */

.widget-unknown {
    font-size: 0.92em;
    color: var(--color-text-muted);
}


/* Редактор — как на экране */

.editor-wrap {
    min-height: 100vh;
    padding: 1rem;
    background: var(--color-bg);
}

.editor-toolbar {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1rem;
    flex-wrap: wrap;
}

.editor-label {
    font-size: 0.85rem;
    color: var(--color-text-muted);
}

.editor-number {
    width: 4rem;
    padding: 0.4rem 0.5rem;
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-border);
    background: var(--color-bg);
    color: var(--color-text);
    font-size: 0.95rem;
}

.editor-grid {
    display: grid;
    gap: 2px;
    max-width: 900px;
    aspect-ratio: 5/4;
    grid-template-columns: repeat(var(--cols, 5), 1fr);
    grid-template-rows: repeat(var(--rows, 4), 1fr);
    background: var(--color-bg);
    padding: 8px;
    border-radius: var(--radius);
    min-height: 320px;
}

.editor-cell {
    background: var(--color-surface);
    border: 2px dashed var(--color-border);
    border-radius: var(--radius-sm);
    min-height: 60px;
    transition: border-color var(--transition), background var(--transition);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 0.5rem;
    font-size: 0.9rem;
    overflow: hidden;
}

.editor-cell.drag-over {
    border-color: var(--color-primary);
    background: rgba(59, 130, 246, .1);
}

.editor-cell.filled {
    border: 1px solid var(--color-border);
    background: var(--color-surface);
}

.editor-cell.filled.widget-origin {
    border-color: rgba(59, 130, 246, .4);
    box-shadow: 0 0 0 1px rgba(59, 130, 246, .2);
}

.editor-cell .editor-preview-time,
.editor-cell .editor-preview-date {
    font-variant-numeric: tabular-nums;
}

.editor-cell .editor-preview-label {
    font-weight: 600;
    font-size: 0.8em;
    color: var(--color-text-muted);
    margin-bottom: 0.15em;
}

.editor-cell .editor-preview-text {
    font-size: 0.85em;
    color: var(--color-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

.options-hint {
    font-size: 0.8rem;
    color: var(--color-text-muted);
    margin: 0.5rem 0 0;
}

.options-hint-inline {
    font-weight: 400;
    font-size: 0.82em;
    opacity: 0.88;
}

.options-row--range {
    align-items: center;
    margin-bottom: 0.35rem;
}

.options-input-range {
    flex: 1;
    min-width: 120px;
    max-width: 220px;
    accent-color: var(--color-primary, #3b82f6);
}

.options-range-val {
    font-size: 0.82rem;
    color: var(--color-text-muted);
    min-width: 3.25rem;
    font-variant-numeric: tabular-nums;
}

.options-input-range-num {
    width: 4.25rem;
    flex: 0 0 auto;
    min-width: 3.25rem;
    margin-bottom: 0;
}

.options-range-suffix {
    font-size: 0.82rem;
    color: var(--color-text-muted);
    flex-shrink: 0;
    user-select: none;
}

.options-sub-block {
    margin: 0.35rem 0 0.5rem 0;
    padding: 0.35rem 0 0.25rem 0.65rem;
    border-left: 2px solid rgba(59, 130, 246, 0.35);
}

.options-sub-block>.options-hint:last-child {
    margin-bottom: 0;
}

.options-widget-hint {
    margin: 0 0 1rem 0;
    padding: 0.65rem 0.85rem;
    border-radius: var(--radius-sm);
    border-left: 3px solid var(--color-primary);
    background: rgba(59, 130, 246, 0.1);
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.04);
}

.options-widget-hint-lead {
    margin: 0 0 0.35rem 0;
    font-size: 0.88rem;
    line-height: 1.35;
    color: var(--color-text);
}

.options-widget-hint-meta {
    margin: 0;
    font-size: 0.78rem;
    color: var(--color-text-muted);
    line-height: 1.3;
}

.editor-toolbar-hint-bar {
    padding: 0.25rem 0.6rem 0.35rem;
    border-bottom: 1px solid var(--color-border);
    background: var(--color-surface, rgba(0, 0, 0, 0.15));
}

body.screen-edit .editor-quick-help {
    font-size: 0.8rem;
}

.editor-quick-help {
    font-size: 0.85rem;
    color: var(--color-text-muted);
}

.editor-quick-help>summary {
    cursor: pointer;
    font-weight: 600;
    color: var(--color-primary);
    list-style: none;
    user-select: none;
}

.editor-quick-help>summary::-webkit-details-marker {
    display: none;
}

.editor-quick-help>summary::before {
    content: "ⓘ ";
    opacity: 0.85;
}

.editor-quick-help-body {
    margin: 0.5rem 0 0 0;
    padding-left: 0.25rem;
    border-left: 2px solid var(--color-border);
}

.editor-quick-help-body p {
    margin: 0.35rem 0;
    line-height: 1.4;
}

.editor-quick-help-body strong {
    color: var(--color-text);
}

.opt-menu-item-icon-picker {
    margin: 0.5rem 0 0.75rem;
}

.opt-menu-icon-picker-label {
    display: block;
    font-size: 0.85rem;
    color: var(--color-text-muted);
    margin-bottom: 0.4rem;
}

.opt-menu-icon-picker-btns {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.opt-menu-icon-btn {
    padding: 0.35rem 0.6rem;
    font-size: 0.8rem;
    border: 1px solid var(--color-border);
    background: var(--color-surface-2);
    border-radius: var(--radius-sm);
    cursor: pointer;
    color: var(--color-text);
    transition: background 0.15s, border-color 0.15s;
}

.opt-menu-icon-btn:hover {
    background: var(--color-primary);
    color: #fff;
    border-color: var(--color-primary);
}

.widget-palette {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-bottom: 1rem;
}

.widget-palette .widget-chip {
    padding: 0.5rem 0.75rem;
    background: var(--color-surface-2);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    cursor: grab;
    font-size: 0.9rem;
}

.widget-chip:active {
    cursor: grabbing;
}

.editor-cell.widget-origin {
    font-weight: 600;
}

.editor-status {
    margin-left: 0.5rem;
    font-size: 0.85rem;
    color: var(--color-text-muted);
    padding: 0.25rem 0;
}

.editor-status.error {
    color: #f87171;
}

.editor-widget-menu {
    display: flex;
    gap: 4px;
    padding: 4px;
    background: var(--color-surface-2);
    border-radius: var(--radius-sm);
    box-shadow: var(--shadow);
    z-index: 1000;
}

.editor-menu-btn {
    padding: 6px 10px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 0.85rem;
}

.editor-menu-btn.config {
    background: var(--color-primary);
    color: #fff;
}

.editor-menu-btn.delete {
    background: #dc2626;
    color: #fff;
}

.options-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, .5);
    z-index: 2000;
}

.options-overlay.open {
    display: block;
}

.layout-import-modal {
    position: fixed;
    inset: 0;
    z-index: 2100;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}

.layout-import-modal[style*="none"] {
    display: none !important;
}

.layout-import-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, .5);
}

.layout-import-modal-content {
    position: relative;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    padding: 1.25rem;
    max-width: 520px;
    width: 100%;
    max-height: 90vh;
    overflow: auto;
    box-shadow: 0 8px 32px rgba(0, 0, 0, .25);
}

.layout-import-modal-title {
    margin: 0 0 0.5rem 0;
    font-size: 1.1rem;
}

.template-picker-content {
    max-width: 640px;
}

.template-picker-list.template-picker-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 1rem;
    margin-top: 0.5rem;
}

.template-picker-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0.75rem;
    background: var(--color-surface-2);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
}

.template-picker-thumb {
    width: 120px;
    height: 120px;
    object-fit: contain;
    border-radius: var(--radius-sm);
    background: var(--color-bg);
}

.template-picker-name {
    margin-top: 0.5rem;
    font-size: 0.9rem;
    font-weight: 500;
    text-align: center;
    color: var(--color-text);
}

.template-picker-apply {
    margin-top: 0.5rem;
    width: 100%;
}

.options-panel {
    position: fixed;
    right: -380px;
    top: 0;
    width: 360px;
    max-width: 95vw;
    height: 100vh;
    background: var(--color-surface);
    border-left: 1px solid var(--color-border);
    box-shadow: -4px 0 24px rgba(0, 0, 0, .2);
    z-index: 2001;
    display: flex;
    flex-direction: column;
    transition: right var(--transition);
    overflow: hidden;
}

.options-panel.open {
    right: 0;
}

.options-panel-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem;
    border-bottom: 1px solid var(--color-border);
}

.options-panel-header h3 {
    margin: 0;
    font-size: 1.1rem;
}

.options-panel-close {
    background: none;
    border: none;
    color: var(--color-text-muted);
    font-size: 1.5rem;
    cursor: pointer;
    line-height: 1;
}

.options-panel-body {
    flex: 1;
    overflow: auto;
    padding: 1rem;
}

.options-panel-body label {
    display: block;
    margin-bottom: 0.25rem;
    font-size: 0.9rem;
    color: var(--color-text-muted);
}

.options-row {
    display: flex;
    gap: 0.5rem;
    align-items: center;
    flex-wrap: wrap;
}

.btn.btn-compact {
    padding: 0.35rem 0.55rem;
    font-size: 0.78rem;
    line-height: 1.05;
    border-radius: 0.45rem;
}

.options-row--font-autofill {
    margin-top: 0.35rem;
}

.options-input-color {
    width: 2.75rem;
    height: 2rem;
    padding: 2px;
    flex-shrink: 0;
    cursor: pointer;
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-border);
}

.options-row--schedule-color .options-input-color {
    flex: 0 0 auto;
}

.options-hr {
    margin: 1.25rem 0 0.75rem;
    border: none;
    border-top: 1px solid var(--color-border);
}

.options-section-title {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--color-text);
    margin-bottom: 0.75rem;
}

.options-panel-body label code {
    font-size: 0.8rem;
    background: var(--color-surface-2);
    padding: 0.15rem 0.35rem;
    border-radius: 3px;
}

.options-input-css {
    font-family: var(--font-mono, 'JetBrains Mono', monospace);
    font-size: 0.85rem;
    min-height: 120px;
}

.options-block {
    margin-top: 1rem;
    padding: 1rem;
    background: var(--color-surface-2);
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-border);
}

.options-block-title {
    font-size: 1rem;
    font-weight: 600;
    color: var(--color-text);
    margin-bottom: 0.75rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid var(--color-border);
}

.options-slick-block {}

.options-slick-row {
    margin-bottom: 0.6rem;
}

.options-slick-row:last-child {
    margin-bottom: 0;
}

.options-slick-row-speed {
    margin-top: 0.75rem;
}

.options-slick-row-speed label {
    display: block;
    margin-bottom: 0.25rem;
}

.options-input-num {
    width: 7rem;
    margin-bottom: 0;
}


/* Фотогалерея слайдера в настройках */

.options-slider-gallery {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 0.75rem;
    min-height: 2rem;
}

.opt-slider-thumb {
    position: relative;
    width: 64px;
    height: 64px;
    border-radius: 6px;
    overflow: hidden;
    background: var(--color-surface-2);
    border: 1px solid var(--color-border);
    flex-shrink: 0;
}

.opt-slider-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.opt-slider-thumb-remove {
    position: absolute;
    top: 2px;
    right: 2px;
    width: 20px;
    height: 20px;
    padding: 0;
    border: none;
    border-radius: 4px;
    background: rgba(0, 0, 0, 0.65);
    color: #fff;
    font-size: 1rem;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}

.opt-slider-thumb-remove:hover {
    background: var(--color-danger, #dc2626);
}

.options-panel-footer {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
    padding: 0.75rem 1rem;
    border-top: 1px solid var(--color-border);
    background: var(--color-surface-2);
    flex-shrink: 0;
    min-width: 0;
    overflow: visible;
}

.options-panel-footer .btn {
    flex-shrink: 0;
    white-space: nowrap;
    font-size: 0.9rem;
    padding: 0.45rem 0.75rem;
}

.options-panel-delete {
    color: var(--color-text-muted);
}

.options-panel-delete:hover {
    color: var(--color-danger, #dc2626);
}


/* Панель в стиле лендинга (дашборд, админка режимов) — работает в светлой и тёмной теме */

.panel-page {
    min-height: 100vh;
    position: relative;
    overflow-x: hidden;
}

.panel-bg {
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background: var(--color-bg);
    background-image: var(--color-bg-gradient);
}

.panel-bg-grid {
    position: absolute;
    inset: 0;
    opacity: 0.08;
}

[data-theme="dark"] .panel-bg-grid {
    opacity: 0.12;
}

.panel-bg-grid {
    background-image: linear-gradient(var(--color-border) 1px, transparent 1px), linear-gradient(90deg, var(--color-border) 1px, transparent 1px);
    background-size: 52px 52px;
}

.panel-orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(60px);
    pointer-events: none;
}

.panel-orb--1 {
    width: 280px;
    height: 280px;
    background: var(--color-primary);
    top: -8%;
    left: -5%;
    opacity: 0.2;
}

.panel-orb--2 {
    width: 220px;
    height: 220px;
    background: var(--color-accent);
    bottom: -5%;
    right: -5%;
    opacity: 0.18;
}

[data-theme="light"] .panel-orb--1,
[data-theme="light"] .panel-orb--2 {
    opacity: 0.12;
}

.panel-content {
    position: relative;
    z-index: 1;
    max-width: 960px;
    margin: 0 auto;
    padding: 2rem 1rem 3rem;
}


/* Суперадмин: шире контент — таблица школ и экранов читается без сжатия */

.panel-page--wide .panel-content {
    max-width: min(100%, 1320px);
    padding-left: 1.25rem;
    padding-right: 1.25rem;
}

.panel-card {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
    padding: 1.5rem;
    margin-bottom: 1.5rem;
    box-shadow: var(--shadow);
}

.panel-card h2 {
    margin: 0 0 0.5rem;
    font-size: 1.25rem;
}

.panel-card h3 {
    margin: 0 0 0.5rem;
    font-size: 1.1rem;
}


/* ——— Форм-контролы в карточках панели и панели настроек виджетов ——— */

.panel-card .options-input,
.panel-card input[type="text"],
.panel-card input[type="email"],
.panel-card input[type="password"],
.panel-card input[type="number"],
.panel-card select,
.panel-card textarea,
.options-panel-body .options-input,
.options-panel-body input[type="text"],
.options-panel-body input[type="number"],
.options-panel-body select,
.options-panel-body textarea {
    width: 100%;
    max-width: 100%;
    padding: 0.6rem 0.85rem;
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-border);
    background: var(--color-bg);
    color: var(--color-text);
    font-size: 0.95rem;
    font-family: inherit;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.panel-card .options-input::placeholder,
.panel-card input::placeholder,
.options-panel-body .options-input::placeholder,
.options-panel-body input::placeholder {
    color: var(--color-text-muted);
    opacity: 0.8;
}

.panel-card select.options-input,
.panel-card select,
.options-panel-body select {
    cursor: pointer;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%2394a3b8' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.75rem center;
    padding-right: 2rem;
}

.panel-card .options-input:focus,
.panel-card input:focus,
.panel-card select:focus,
.panel-card textarea:focus,
.options-panel-body .options-input:focus,
.options-panel-body input:focus,
.options-panel-body select:focus,
.options-panel-body textarea:focus {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.2);
}

.options-panel-body .options-input,
.options-panel-body input,
.options-panel-body select,
.options-panel-body textarea {
    margin-bottom: 1rem;
}

.options-panel-body textarea.options-input {
    min-height: 80px;
    resize: vertical;
}

.options-row .options-input,
.options-row input,
.options-row select {
    flex: 1;
    min-width: 8rem;
    margin-bottom: 0;
}

/* Блок загрузки фоновой картинки виджета */
.options-widget-bg-block {
    display: grid;
    gap: 0.55rem;
    margin: 0 0 0.85rem;
    padding: 0.6rem;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    background: color-mix(in srgb, var(--color-surface-2) 65%, transparent);
}

.options-widget-bg-file-row {
    display: block;
}

.options-widget-bg-file-row .opt-widget-bg-file {
    width: 100%;
    margin: 0;
}

.options-widget-bg-buttons {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.45rem;
}

.options-widget-bg-buttons .opt-widget-bg-btn {
    width: 100%;
    justify-content: center;
    text-align: center;
    white-space: nowrap;
    min-height: 2.1rem;
    padding: 0.45rem 0.7rem;
}


/* Чекбокс и радио — аккуратный вид в панели и опциях */

.panel-card input[type="checkbox"],
.panel-card input[type="radio"],
.options-panel-body input[type="checkbox"],
.options-panel-body input[type="radio"],
.screen-toolbar input[type="checkbox"] {
    width: 1.15rem;
    height: 1.15rem;
    margin: 0 0.35rem 0 0;
    cursor: pointer;
    accent-color: var(--color-primary);
    vertical-align: middle;
    flex-shrink: 0;
}

.panel-card label:has(input[type="checkbox"]),
.panel-card label:has(input[type="radio"]),
.options-panel-body label:has(input[type="checkbox"]),
.options-panel-body label:has(input[type="radio"]),
.options-slick-option {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    cursor: pointer;
    font-weight: normal;
    color: var(--color-text);
}

.options-slick-option input {
    flex-shrink: 0;
    width: 1.15rem;
    height: 1.15rem;
}

.panel-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-bottom: 1.5rem;
}

.panel-header h1 {
    margin: 0;
    font-size: clamp(1.35rem, 3vw, 1.6rem);
    font-weight: 700;
}

.panel-header-actions {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.panel-nav {
    margin-bottom: 1rem;
}

.panel-nav a {
    color: var(--color-primary);
    margin-right: 0.75rem;
}

.panel-nav a:hover {
    color: var(--color-accent);
    text-decoration: underline;
}


/* Страница настроек школы */

.settings-label {
    display: block;
    margin-bottom: 0.35rem;
    font-size: 0.9rem;
    font-weight: 500;
    color: var(--color-text-muted);
}

.settings-hint {
    font-size: 0.85rem;
    margin-top: 0.5rem;
    line-height: 1.45;
}

.settings-fields {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.panel-card .settings-label+.options-input {
    margin-bottom: 0;
}


/* Дашборд */

.dashboard {
    max-width: 900px;
    margin: 0 auto;
    padding: 0;
}

.panel-page .dashboard {
    max-width: 100%;
}

.dashboard-section {
    margin-bottom: 0;
}

.panel-page .dashboard-section {
    margin-bottom: 1.5rem;
}

.panel-page .dashboard-section:last-child {
    margin-bottom: 0;
}

.dashboard h1,
.dashboard h2 {
    margin-bottom: 0.5rem;
}

.dashboard-table-wrap {
    overflow-x: auto;
    margin: 0.5rem 0;
}

.dashboard-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.dashboard-table th,
.dashboard-table td {
    padding: 0.5rem 0.75rem;
    text-align: left;
    border: 1px solid var(--color-border);
}

.dashboard-table th {
    background: var(--color-surface-2);
    color: var(--color-text-muted);
}

.dashboard-table td a {
    color: var(--color-primary);
    text-decoration: none;
}

.dashboard-table td a:hover {
    color: var(--color-accent);
    text-decoration: underline;
}


/* Действия в одну линию: ссылки и «Удалить» в том же визуальном ряду */

.dashboard-screen-actions {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.35rem 0.65rem;
    line-height: 1.5;
}


/* Кнопка удаления — как текстовая ссылка, без рамки и заливки */

button.dashboard-screen-delete-link {
    display: inline;
    vertical-align: baseline;
    background: none !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    min-height: 0;
    box-shadow: none !important;
    font: inherit;
    font-size: inherit;
    font-weight: 400;
    line-height: inherit;
    cursor: pointer;
    color: var(--color-text-muted);
    text-decoration: underline;
    text-decoration-color: transparent;
    text-underline-offset: 2px;
    transition: color 0.15s ease, text-decoration-color 0.15s ease;
}

button.dashboard-screen-delete-link:hover {
    color: var(--color-danger, #f87171);
    text-decoration-color: currentColor;
}

.panel-card .dashboard-table-wrap {
    margin: 0.75rem 0 0;
}


/* Таблица «Школы» в панели суперадмина: шире колонки, телефон в одну строку, заметный скролл */

.dashboard-table-wrap--schools {
    margin: 0.75rem -0.25rem 0;
    padding: 0.35rem 0.25rem 0.5rem;
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-border);
    background: var(--color-surface-2, rgba(255, 255, 255, 0.03));
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.02);
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.dashboard-table-wrap--schools:focus-visible {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}

.dashboard-table.dashboard-table--schools {
    min-width: 1080px;
    width: max(100%, 1080px);
    table-layout: auto;
    font-size: 0.92rem;
}

.dashboard-table--schools th,
.dashboard-table--schools td {
    padding: 0.6rem 0.85rem;
    vertical-align: middle;
}

.dashboard-table--schools .dashboard-th-id,
.dashboard-table--schools .dashboard-td-id {
    width: 3rem;
    text-align: center;
    white-space: nowrap;
}

.dashboard-table--schools .dashboard-th-org-settings,
.dashboard-table--schools .dashboard-td-org-settings {
    width: 2.75rem;
    text-align: center;
    padding-left: 0.35rem;
    padding-right: 0.35rem;
}

.dashboard-org-settings-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: var(--radius-sm, 8px);
    font-size: 1.15rem;
    line-height: 1;
    text-decoration: none;
    color: var(--color-text-muted, #94a3b8);
    border: 1px solid transparent;
    transition: color 0.15s, border-color 0.15s, background 0.15s;
}

.dashboard-org-settings-link:hover {
    color: var(--color-primary, #38bdf8);
    border-color: rgba(56, 189, 248, 0.35);
    background: rgba(56, 189, 248, 0.08);
}

.dashboard-th-settings-icon {
    font-size: 1rem;
    opacity: 0.75;
}

.dashboard-table .dashboard-td-last-seen {
    font-variant-numeric: tabular-nums;
    white-space: normal;
    font-size: 0.88rem;
    line-height: 1.35;
    vertical-align: top;
}

.dashboard-table .dashboard-td-last-seen .dashboard-last-seen-main {
    white-space: nowrap;
}

.dashboard-table .dashboard-td-last-seen .dashboard-poll-interval-hint {
    display: block;
    font-size: 0.78rem;
    margin-top: 0.2rem;
    white-space: nowrap;
}


/* Таблица «Все экраны»: блок лендинга и публикация */

.dashboard-table-wrap--all-screens {
    margin: 0.75rem -0.25rem 0;
    padding: 0.5rem 0.35rem 0.65rem;
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-border);
    background: linear-gradient(165deg, rgba(255, 255, 255, 0.04) 0%, var(--color-surface-2, rgba(255, 255, 255, 0.03)) 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.dashboard-table-wrap--all-screens .dashboard-table {
    min-width: 960px;
}

.dashboard-table .landing-section-cell {
    vertical-align: middle;
    min-width: 9.5rem;
}

.dashboard-landing-block-wrap {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    align-items: flex-start;
}

.dashboard-landing-block-label {
    font-size: 0.68rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--color-text-muted);
    opacity: 0.85;
}

.dashboard-landing-select {
    appearance: none;
    min-width: 11rem;
    max-width: 14rem;
    padding: 0.45rem 2rem 0.45rem 0.65rem;
    font-size: 0.82rem;
    line-height: 1.3;
    border-radius: var(--radius-sm);
    border: 1px solid rgba(148, 163, 184, 0.35);
    background-color: var(--color-surface, #1e293b);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%2394a3b8' d='M3 4.5L6 8l3-3.5'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.55rem center;
    color: var(--color-text);
    cursor: pointer;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.dashboard-landing-select:hover {
    border-color: rgba(56, 189, 248, 0.45);
}

.dashboard-landing-select:focus {
    outline: none;
    border-color: var(--color-accent, #22d3ee);
    box-shadow: 0 0 0 3px rgba(34, 211, 238, 0.18);
}

.dashboard-landing-publish {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.4rem 0.55rem;
    max-width: 15rem;
}

.dashboard-landing-publish--off {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.5rem;
}


/* Колонка «Лендинг»: только иконки */

.dashboard-landing-publish--icons {
    flex-wrap: nowrap;
    align-items: center;
    max-width: none;
    gap: 0.45rem;
}

.dashboard-landing-publish--icons.dashboard-landing-publish--off {
    flex-direction: row;
    align-items: center;
}

.dashboard-landing-ico-group {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
}

.dashboard-landing-ico-stat {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: var(--radius-sm);
    border: 1px solid transparent;
    flex-shrink: 0;
}

.dashboard-landing-ico-stat--on {
    color: #6ee7b7;
    background: rgba(16, 185, 129, 0.15);
    border-color: rgba(52, 211, 153, 0.35);
}

.dashboard-landing-ico-stat--off {
    color: var(--color-text-muted);
    background: rgba(148, 163, 184, 0.1);
    border-color: rgba(148, 163, 184, 0.25);
}

.dashboard-landing-ico-order {
    font-size: 0.75rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    color: var(--color-text-muted);
    line-height: 1;
}

.dashboard-landing-svg {
    display: block;
}

.dashboard-landing-ico-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    padding: 0;
    margin: 0;
    border: none;
    border-radius: var(--radius-sm);
    cursor: pointer;
    flex-shrink: 0;
    transition: background 0.15s ease, color 0.15s ease, transform 0.1s ease;
}

.dashboard-landing-ico-btn:focus-visible {
    outline: 2px solid var(--color-accent, #22d3ee);
    outline-offset: 2px;
}

.dashboard-landing-ico-btn--accent {
    background: var(--color-primary, #0ea5e9);
    color: #fff;
}

.dashboard-landing-ico-btn--accent:hover {
    filter: brightness(1.1);
}

.dashboard-landing-ico-btn--accent .dashboard-landing-svg {
    opacity: 1;
}

.dashboard-landing-ico-btn--mute {
    background: rgba(148, 163, 184, 0.12);
    color: var(--color-text-muted);
}

.dashboard-landing-ico-btn--mute:hover {
    background: rgba(248, 113, 113, 0.18);
    color: var(--color-danger, #f87171);
}

.dashboard-landing-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.2rem 0.55rem;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.01em;
    line-height: 1.2;
}

.dashboard-landing-badge-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1rem;
    height: 1rem;
    border-radius: 50%;
    font-size: 0.65rem;
    background: rgba(255, 255, 255, 0.15);
}

.dashboard-landing-badge--on {
    color: #a7f3d0;
    background: rgba(16, 185, 129, 0.18);
    border: 1px solid rgba(52, 211, 153, 0.35);
}

.dashboard-landing-badge--off {
    color: var(--color-text-muted);
    background: rgba(148, 163, 184, 0.12);
    border: 1px solid rgba(148, 163, 184, 0.25);
}

.dashboard-landing-order {
    font-size: 0.75rem;
    font-variant-numeric: tabular-nums;
    color: var(--color-text-muted);
    white-space: nowrap;
}

.dashboard-landing-btn-off {
    padding: 0.28rem 0.65rem !important;
    font-size: 0.78rem !important;
    border-radius: var(--radius-sm) !important;
}

.dashboard-landing-btn-on {
    padding: 0.4rem 0.85rem !important;
    font-size: 0.82rem !important;
    border-radius: var(--radius-sm) !important;
    font-weight: 600;
}

.dashboard-demo-create--card {
    border: 1px solid rgba(56, 189, 248, 0.2);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.dashboard-demo-create--card .dashboard-add-screen {
    align-items: flex-end;
}

.dashboard-demo-create--card label {
    display: block;
    margin-bottom: 0.2rem;
}


/* Форма «Создать демо-экран»: широкие поля, читаемый текст */

.dashboard-demo-create .dashboard-demo-create__form {
    display: flex;
    flex-wrap: wrap;
    gap: 0.85rem 1.1rem;
    align-items: flex-end;
    padding: 0;
    background: transparent;
    border: none;
}

.dashboard-demo-create .dashboard-demo-create__field {
    flex: 1 1 16rem;
    min-width: min(100%, 12rem);
}

.dashboard-demo-create .dashboard-demo-create__field .options-input {
    width: 100%;
    min-height: 2.85rem;
    padding: 0.55rem 0.9rem;
    font-size: 0.95rem;
    box-sizing: border-box;
}

.dashboard-demo-create .dashboard-demo-create__form label {
    font-size: 0.9rem;
    margin-bottom: 0.35rem;
    color: var(--color-text-muted);
}

.dashboard-demo-create .dashboard-demo-create__submit {
    flex: 0 0 auto;
    min-height: 2.85rem;
    padding-left: 1.15rem;
    padding-right: 1.15rem;
    font-size: 0.95rem;
}


/* Два блока экранов суперадмина: демо и «возможности» — всегда столбик (друг под другом) */

.dashboard-screens-split {
    display: flex;
    flex-direction: column;
    gap: 1.75rem;
    margin-top: 1rem;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

.dashboard-screens-split__panel {
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
}


/* Узкая колонка: горизонтальный скролл внутри панели, без раздувания grid */

.dashboard-screens-split__panel .dashboard-table-wrap--all-screens {
    margin-left: 0;
    margin-right: 0;
    width: 100%;
    max-width: 100%;
}

.dashboard-screens-split__title {
    margin: 0 0 0.25rem 0;
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--color-text);
    letter-spacing: -0.02em;
}

.dashboard-screens-split__hint {
    margin: 0 0 0.65rem 0;
    font-size: 0.82rem;
    line-height: 1.35;
}

.dashboard-table--screens-compact {
    font-size: 0.84rem;
}

.dashboard-table--screens-compact th,
.dashboard-table--screens-compact td {
    padding: 0.45rem 0.55rem;
    vertical-align: top;
}

.dashboard-table--screens-compact .dashboard-td-actions {
    min-width: 9.5rem;
}

.dashboard-td-dates {
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.dashboard-td-dates-inner {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    line-height: 1.25;
}

.dashboard-date-label {
    font-size: 0.68rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--color-text-muted);
    margin-right: 0.15rem;
}

.dashboard-slug-code {
    font-size: 0.78rem;
    word-break: break-all;
    white-space: normal;
}

.dashboard-screen-actions-move {
    margin-top: 0.45rem;
    padding-top: 0.4rem;
    border-top: 1px dashed rgba(148, 163, 184, 0.25);
}

.dashboard-move-section-link {
    display: inline;
    padding: 0;
    margin: 0;
    border: none;
    background: none !important;
    box-shadow: none !important;
    font: inherit;
    font-size: 0.8rem;
    color: var(--color-accent, #22d3ee);
    cursor: pointer;
    text-decoration: underline;
    text-underline-offset: 2px;
    text-decoration-color: rgba(34, 211, 238, 0.35);
}

.dashboard-move-section-link:hover {
    color: var(--color-primary, #38bdf8);
    text-decoration-color: currentColor;
}

.dashboard-table--schools .dashboard-th-email,
.dashboard-table--schools .dashboard-td-email {
    min-width: 11rem;
    max-width: 18rem;
}

.dashboard-table--schools .dashboard-cell-clip {
    display: inline-block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    vertical-align: bottom;
}

.dashboard-table--schools .dashboard-th-phone,
.dashboard-table--schools .dashboard-td-phone {
    min-width: 10.5rem;
    white-space: nowrap;
}

.dashboard-table--schools .dashboard-phone {
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.02em;
}

.dashboard-table--schools .dashboard-th-name,
.dashboard-table--schools .dashboard-td-name {
    min-width: 8rem;
    max-width: 14rem;
}

.dashboard-table--schools .dashboard-th-tariff,
.dashboard-table--schools .dashboard-th-sub {
    min-width: 10rem;
}

.dashboard-table--schools .dashboard-th-access,
.dashboard-table--schools .school-approved-cell {
    text-align: center;
    white-space: nowrap;
}

.dashboard-table--schools .dashboard-th-actions {
    min-width: 11rem;
}

.dashboard-access-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.28rem 0.65rem;
    border-radius: 999px;
    font-size: 0.8rem;
    font-weight: 600;
    line-height: 1.2;
}

.dashboard-access-badge--yes {
    background: rgba(34, 197, 94, 0.18);
    color: #4ade80;
    border: 1px solid rgba(34, 197, 94, 0.35);
}

.dashboard-access-badge--wait {
    background: rgba(251, 191, 36, 0.15);
    color: #fbbf24;
    border: 1px solid rgba(251, 191, 36, 0.35);
}

[data-theme="light"] .dashboard-access-badge--yes {
    color: #15803d;
    background: rgba(34, 197, 94, 0.2);
}

[data-theme="light"] .dashboard-access-badge--wait {
    color: #b45309;
    background: rgba(251, 191, 36, 0.25);
}

.dashboard-register-cta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.65rem 1rem;
    padding: 0.85rem 1rem;
    margin-top: 1rem !important;
    border-radius: var(--radius-sm);
    border: 1px dashed var(--color-border);
    background: var(--color-surface-2, rgba(255, 255, 255, 0.03));
}

.dashboard-register-cta .btn-primary {
    flex-shrink: 0;
}

.dashboard-register-hint {
    font-size: 0.88rem;
    line-height: 1.4;
    max-width: 28rem;
}


/* Виджеты по организациям: категории */

.widget-cat-block {
    margin-bottom: 1.25rem;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    overflow: hidden;
    background: var(--color-surface-2, rgba(255, 255, 255, 0.03));
}

.widget-cat-header {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.75rem 1rem;
    padding: 0.65rem 0.85rem;
    background: var(--color-surface, rgba(0, 0, 0, 0.2));
    border-bottom: 1px solid var(--color-border);
}

.widget-cat-header .widget-cat-title {
    font-weight: 600;
    margin: 0;
    flex: 1 1 auto;
}

.widget-cat-header .editor-label {
    margin: 0;
    font-size: 0.9rem;
}

.widget-cat-block .dashboard-table-wrap {
    margin: 0;
}

.widget-cat-block .dashboard-table {
    margin: 0;
}

.widget-cat-move {
    min-width: 11rem;
    max-width: 100%;
}

.screens-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.screens-list li {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
    padding: 1rem;
    background: var(--color-surface-2);
    border-radius: var(--radius-sm);
    margin-bottom: 0.5rem;
    border: 1px solid var(--color-border);
}

.screens-list a {
    color: var(--color-text);
}

.screens-list-delete.dashboard-screen-delete-link {
    margin-left: 0.35rem;
}

.screens-list-delete:not(.dashboard-screen-delete-link) {
    font-size: 0.85rem;
    padding: 0.2rem 0.5rem;
    margin-left: 0.25rem;
}

.screens-list-delete:not(.dashboard-screen-delete-link):hover {
    color: var(--color-danger, #dc2626);
}

.screens-list a:hover {
    color: var(--color-primary);
    text-decoration: none;
}

.dashboard-add-screen {
    padding: 1rem;
    background: var(--color-surface-2);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
}

.panel-page .dashboard-add-screen {
    margin-top: 1rem;
}


/* Регистрация экрана */


/* Только подписи к полям — не карточки «Тип заведения» / «Тариф» (иначе «лесенка» в сетке) */

.register-form label.auth-label {
    display: block;
    margin-top: 1rem;
    margin-bottom: 0.25rem;
    font-size: 0.9rem;
    color: var(--color-text-muted);
}

.register-form label.auth-label:first-of-type {
    margin-top: 0;
}

.register-form input {
    width: 100%;
    padding: 0.5rem 0.75rem;
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-border);
    background: var(--color-bg);
    color: var(--color-text);
    margin-bottom: 0.25rem;
    box-sizing: border-box;
}

.register-form button[type="submit"] {
    margin-top: 1.25rem;
}


/* Админка режимов */

.panel-page .admin-dashboard {
    max-width: 100%;
    padding: 0;
}

.admin-mode-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 0.5rem;
}

.admin-current-mode {
    font-weight: 600;
    margin: 0.5rem 0;
}

.admin-dashboard {
    max-width: 1920px;
    padding-left: 1rem;
    padding-right: 1rem;
}

.admin-page-lead {
    line-height: 1.55;
    font-size: 0.95rem;
}

.admin-help-callout {
    margin-top: 0.75rem;
    padding: 1rem 1.15rem;
    border-radius: var(--radius-md);
    border: 1px solid var(--color-border);
    border-left: 4px solid var(--color-primary);
    background: rgba(59, 130, 246, 0.06);
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.03);
}

.admin-help-callout--compact {
    padding: 0.85rem 1rem;
    margin-bottom: 0.75rem;
}

.admin-help-callout-title {
    margin: 0 0 0.5rem 0;
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--color-text);
}

.admin-help-callout-text {
    margin: 0 0 0.65rem 0;
    font-size: 0.9rem;
    line-height: 1.5;
}

.admin-help-callout-text:last-of-type {
    margin-bottom: 0.35rem;
}

.admin-help-callout-format {
    margin: 0.5rem 0 0 0;
    font-size: 0.88rem;
    line-height: 1.45;
}

.admin-help-callout-format code {
    font-size: 0.85em;
}

.admin-help-list {
    margin: 0.35rem 0 0 1rem;
    padding: 0;
    font-size: 0.88rem;
    line-height: 1.55;
}

.admin-help-list li {
    margin-bottom: 0.35rem;
}

.admin-preset-micro-hint {
    font-size: 0.78rem;
    line-height: 1.35;
    margin: 0 0 0.35rem 0;
}


/* Подсказка под полем пресета (не часть текста расписания) */

.admin-presets-section .admin-preset-below-hint {
    font-size: 0.78rem;
    line-height: 1.35;
    margin: 0.4rem 0 0.15rem 0;
}

.admin-mode-section,
.admin-mode-packs-section,
.admin-presets-section,
.admin-add-mode-section,
.admin-calendar-section {
    margin-top: 0;
}


/* Готовые наборы внутри карточки «Пресеты» */

.admin-mode-packs-embed {
    margin-top: 1.5rem;
    padding-top: 1.35rem;
    border-top: 1px solid var(--color-border);
}

.admin-mode-packs-embed .admin-mode-packs-embed-title {
    margin: 0 0 0.65rem 0;
    font-size: 1.08rem;
    font-weight: 700;
}

.panel-page .admin-mode-section,
.panel-page .admin-mode-packs-section,
.panel-page .admin-presets-section {
    margin-bottom: 1.5rem;
}

.panel-page .admin-mode-section .panel-card,
.panel-page .admin-mode-packs-section .panel-card,
.panel-page .admin-presets-section .panel-card,
.panel-page .admin-add-mode-section,
.panel-page .admin-calendar-section .panel-card {
    margin-bottom: 1.5rem;
}

.admin-mode-packs-section .admin-mode-packs-grid,
.admin-mode-packs-embed .admin-mode-packs-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 1.25rem;
    margin-top: 1rem;
}

.admin-mode-packs-section .admin-mode-pack-card,
.admin-mode-packs-embed .admin-mode-pack-card {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
    padding: 1.15rem;
    background: var(--color-surface-2);
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-border);
}

.admin-mode-packs-section .admin-mode-pack-title,
.admin-mode-packs-embed .admin-mode-pack-title {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 700;
}

.admin-mode-packs-section .admin-mode-pack-sub,
.admin-mode-packs-embed .admin-mode-pack-sub {
    margin: 0;
    font-size: 0.88rem;
    line-height: 1.4;
}

.admin-mode-packs-section .admin-mode-pack-modes,
.admin-mode-packs-embed .admin-mode-pack-modes {
    margin: 0;
    padding-left: 1.15rem;
    font-size: 0.82rem;
    line-height: 1.45;
}

.admin-mode-packs-section .admin-mode-pack-card .btn,
.admin-mode-packs-embed .admin-mode-pack-card .btn {
    margin-top: auto;
    align-self: flex-start;
}

.admin-presets-section .admin-presets-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 1.5rem;
    margin-top: 1rem;
}

.admin-presets-section .admin-preset-block {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    padding: 1.15rem;
    margin-bottom: 0.25rem;
    background: var(--color-surface-2);
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-border);
}

.admin-presets-section .admin-preset-label {
    font-weight: 600;
    font-size: 0.95rem;
}

.admin-presets-section .admin-preset-name {
    font-weight: 600;
    margin-bottom: 0.25rem;
}

.admin-presets-section .admin-preset-textarea {
    font-family: var(--font-mono), monospace;
    font-size: 0.85rem;
    min-height: 8em;
}

.admin-presets-section .admin-preset-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
}


/* «Удалить» в карточке пресета — как текстовая ссылка (как в дашборде) */

.admin-presets-section button.btn-delete-preset.dashboard-screen-delete-link {
    margin-left: auto;
}


/* Блоки календаря: отступы и фон */

.admin-calendar-section .admin-calendar-block {
    margin-top: 1.25rem;
    margin-bottom: 1.25rem;
    padding: 1.25rem 1.5rem;
    background: var(--color-surface-2);
    border-radius: var(--radius-md);
    border: 1px solid var(--color-border);
}

.admin-calendar-section .admin-calendar-block .options-block-title {
    margin-bottom: 1rem;
    padding-bottom: 0.6rem;
}


/* Правила по дням недели */

.admin-weekend-rules-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1.25rem 2rem;
}

.admin-weekend-rules .admin-weekend-label {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.95rem;
    color: var(--color-text);
}

.admin-weekend-rules .admin-weekend-label .options-input {
    min-width: 10em;
    padding: 0.4em 0.6em;
}


/* Кастомные правила */

.admin-custom-rules-desc {
    font-size: 0.9rem;
    margin-bottom: 1rem;
    line-height: 1.45;
}

.admin-custom-rules-list {
    margin-bottom: 1rem;
}

.admin-custom-rules .admin-custom-rule-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem 1rem;
    margin-bottom: 0.75rem;
    padding: 0.6rem 0;
    border-bottom: 1px solid var(--color-border);
}

.admin-custom-rules .admin-custom-rule-row:last-child {
    border-bottom: none;
}

.admin-custom-rules .admin-custom-rule-row .options-input {
    min-width: 0;
    padding: 0.4em 0.6em;
}

.admin-custom-rules .admin-custom-rule-row .custom-rule-type {
    min-width: 8em;
}

.admin-custom-rules .admin-custom-rule-row .custom-rule-mode {
    min-width: 11em;
}

.admin-add-custom-rule-btn {
    margin-top: 0.25rem;
    padding: 0.5rem 1rem;
}


/* Строка с годом и кнопками */

.admin-calendar-actions-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1rem 1.5rem;
    margin-top: 1.25rem;
    margin-bottom: 1rem;
}

.admin-year-label {
    font-weight: 500;
    color: var(--color-text);
}

.admin-year-select {
    max-width: 8em;
    padding: 0.4em 0.6em;
}

.admin-calendar-buttons {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.admin-calendar-status {
    margin-left: 0.25rem;
    font-size: 0.9rem;
    color: var(--color-text-muted);
}

.admin-calendar-section {
    margin-top: 0;
}

.admin-calendar-section>h2 {
    margin-bottom: 0.5rem;
}

.admin-calendar-section>p.text-muted {
    margin-bottom: 0.75rem;
    line-height: 1.5;
}

.admin-calendar-legend {
    margin-top: 1rem;
    margin-bottom: 0.75rem;
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    font-size: 0.85rem;
    color: var(--color-text);
}

.admin-calendar-section .admin-calendar-grid {
    margin-top: 0.75rem;
    margin-bottom: 1rem;
}

.admin-calendar-section #admin-save-calendar {
    margin-top: 0.5rem;
}

.admin-legend {
    padding: 0.2em 0.5em;
    border-radius: 4px;
}

.admin-legend-c {
    background: rgba(34, 197, 94, 0.5);
    color: #dcfce7;
}

.admin-legend-b {
    background: rgba(249, 115, 22, 0.5);
    color: #ffedd5;
}

.admin-legend-a {
    background: rgba(239, 68, 68, 0.5);
    color: #fecaca;
}

.admin-legend-e {
    background: rgba(168, 85, 247, 0.5);
    color: #e9d5ff;
}

.admin-legend-w {
    background: rgba(59, 130, 246, 0.5);
    color: #dbeafe;
}

.admin-calendar-info {
    font-size: 0.9rem;
    color: var(--color-text);
    margin-bottom: 0.5rem;
}

.admin-calendar-fullyear {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 200px));
    gap: 1rem 1.25rem;
    margin-top: 1rem;
    max-width: 900px;
}

.admin-calendar-month-block {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 2px 3px;
    font-size: 0.7rem;
    min-width: 0;
    padding: 0.5rem;
    background: var(--color-surface-2);
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-border);
    align-content: start;
}

.admin-calendar-month-block .p {
    grid-column: 1 / -1;
    font-weight: 600;
    margin-bottom: 0.25rem;
    font-size: 0.75rem;
    color: var(--color-text);
}

.admin-calendar-month-block .h {
    padding: 0.2em;
    border: none;
    background: var(--color-surface);
    color: var(--color-text);
    cursor: default;
    font-size: 0.6rem;
    text-align: center;
    min-width: 0;
}

.admin-calendar-month-block .s {
    padding: 0;
    border: none;
    background: transparent;
    min-width: 0;
    visibility: hidden;
}

.admin-calendar-month-block .admin-day-btn {
    padding: 0.2em 0.1em;
    border: 1px solid var(--color-border);
    border-radius: 4px;
    cursor: pointer;
    font-size: 0.65rem;
    min-width: 0;
    width: 2.2em;
    max-width: 100%;
    min-height: 2.2em;
    line-height: 1.1;
    color: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.05em;
    box-sizing: border-box;
}

.admin-calendar-month-block .admin-day-num {
    font-weight: 700;
}

.admin-calendar-month-block .admin-day-mode {
    font-size: 0.75em;
    opacity: 0.95;
}

.admin-calendar-month-block .admin-day-btn.c {
    background: rgba(34, 197, 94, 0.5);
    color: #dcfce7;
}

.admin-calendar-month-block .admin-day-btn.b {
    background: rgba(249, 115, 22, 0.5);
    color: #ffedd5;
}

.admin-calendar-month-block .admin-day-btn.a {
    background: rgba(239, 68, 68, 0.5);
    color: #fecaca;
}

.admin-calendar-month-block .admin-day-btn.e {
    background: rgba(168, 85, 247, 0.5);
    color: #e9d5ff;
}

.admin-calendar-month-block .admin-day-btn.w {
    background: rgba(59, 130, 246, 0.5);
    color: #dbeafe;
}

.admin-calendar-month-block .admin-day-btn.f {
    box-shadow: 0 0 0 2px var(--color-primary);
}

.admin-calendar-month-block .admin-day-btn.admin-day-deleted {
    background: #9ca3af !important;
    position: relative;
    opacity: 0.9;
}

.admin-calendar-month-block .admin-day-btn.admin-day-deleted::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, transparent 45%, rgba(0, 0, 0, 0.15) 50%, transparent 55%), linear-gradient(45deg, transparent 45%, rgba(0, 0, 0, 0.15) 50%, transparent 55%);
    pointer-events: none;
    border-radius: inherit;
}

.admin-calendar-month-block .admin-day-btn:hover {
    filter: brightness(1.15);
}

.admin-calendar-grid {
    margin-top: 1rem;
}

.admin-calendar-month {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.2rem;
    margin-bottom: 0.5rem;
    font-size: 0.9rem;
}

.admin-calendar-month strong {
    min-width: 2.5rem;
}

.admin-calendar-day {
    width: 2rem;
    padding: 0.15rem;
    font-size: 0.75rem;
    border-radius: 2px;
    border: 1px solid var(--color-border);
    background: var(--color-bg);
    color: var(--color-text);
}


/* Утилиты */

.text-muted {
    color: var(--color-text-muted);
}

.mt-2 {
    margin-top: 1rem;
}

.ml-2 {
    margin-left: 1rem;
}


/* ========== Мобильная адаптация ========== */

@media (max-width: 768px) {
    .panel-content {
        padding: 1rem 0.75rem 2rem;
    }
    .panel-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }
    .panel-header-actions {
        width: 100%;
        justify-content: flex-end;
    }
    .panel-card {
        padding: 1.25rem;
    }
    .dashboard-table-wrap {
        margin: 0.5rem -0.5rem;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    .dashboard-table {
        font-size: 0.85rem;
        min-width: 520px;
    }
    .dashboard-table th,
    .dashboard-table td {
        padding: 0.4rem 0.5rem;
    }
    .dashboard-table.dashboard-table--schools {
        min-width: 960px;
        width: max(100%, 960px);
        font-size: 0.82rem;
    }
    .dashboard-table.dashboard-table--schools th,
    .dashboard-table.dashboard-table--schools td {
        padding: 0.45rem 0.55rem;
    }
    .dashboard-register-cta {
        flex-direction: column;
        align-items: flex-start;
    }
    .screens-list li {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }
    .screens-list a+a {
        margin-left: 0;
    }
    .dashboard-add-screen .panel-card {
        padding: 1rem;
    }
    .dashboard-add-screen label {
        display: block;
        margin-bottom: 0.25rem;
    }
    .dashboard-add-screen input {
        max-width: 100%;
    }
    .dashboard-add-screen>div {
        flex-direction: column;
        align-items: stretch;
    }
    .dashboard-add-screen .options-input {
        width: 100% !important;
    }
    .dashboard-add-screen #new-screen-name,
    .dashboard-add-screen #new-screen-slug {
        width: 100% !important;
        max-width: 100%;
        box-sizing: border-box;
    }
    .dashboard-demo-create .dashboard-demo-create__form {
        flex-direction: column;
        align-items: stretch;
    }
    .dashboard-demo-create .dashboard-demo-create__field {
        flex: 1 1 auto;
        min-width: 0;
        max-width: 100%;
    }
    .dashboard-demo-create .dashboard-demo-create__submit {
        width: 100%;
    }
    #super-school-select {
        max-width: 100% !important;
    }
    #org-select {
        max-width: 100% !important;
    }
    /* Админка: календарь — сетка года 2 колонки, обёртка с горизонтальным скроллом */
    .admin-dashboard {
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }
    .admin-calendar-fullyear {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.75rem 1rem;
        max-width: 100%;
    }
    .admin-calendar-section .panel-card {
        overflow-x: auto;
    }
    .admin-calendar-grid {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        min-width: 0;
    }
    .admin-calendar-month-block {
        min-width: 200px;
        font-size: 0.65rem;
        gap: 1px 2px;
        padding: 0.35rem;
    }
    .admin-calendar-month-block .admin-day-btn {
        width: 1.8em;
        min-height: 1.8em;
        font-size: 0.6rem;
        padding: 0.15em 0.05em;
    }
    .admin-calendar-month-block .p {
        font-size: 0.7rem;
    }
    .admin-calendar-month-block .h {
        font-size: 0.55rem;
        padding: 0.15em;
    }
    .admin-presets-section .admin-presets-grid {
        grid-template-columns: 1fr;
    }
    .admin-preset-block {
        min-width: 0;
    }
    .admin-preset-textarea {
        min-height: 6em;
    }
    .admin-add-mode-section>div {
        flex-direction: column;
        align-items: stretch;
    }
    .admin-add-mode-section input.options-input {
        width: 100% !important;
        max-width: 100%;
    }
    .admin-calendar-section .btn {
        margin-bottom: 0.25rem;
    }
    .admin-calendar-section #admin-load-calendar,
    .admin-calendar-section #admin-auto-saturday {
        margin-right: 0.5rem;
    }
    /* Редактор экрана: тулбар в 2–3 ряда, компактные поля */
    .screen-toolbar {
        padding: 0.5rem 0.75rem;
        gap: 0.4rem;
    }
    .screen-toolbar-sep {
        display: none;
    }
    .screen-toolbar .editor-number {
        width: 3rem;
        padding: 0.35rem 0.4rem;
    }
    .screen-name-input,
    .screen-toolbar .screen-name-input {
        width: 6rem;
        max-width: 100%;
    }
    .screen-slug-input {
        width: 5rem;
        max-width: 100%;
    }
    .screen-toolbar-ticker .screen-name-input {
        width: 10rem;
        max-width: 100%;
    }
    .screen-toolbar .btn {
        padding: 0.35rem 0.5rem;
        font-size: 0.85rem;
    }
    .screen-toolbar .editor-label {
        font-size: 0.75rem;
    }
    .screen-palette-dropdown {
        min-width: 280px;
        max-width: 95vw;
        left: 50%;
        transform: translateX(-50%);
        grid-template-columns: 1fr;
    }
    .options-panel {
        width: 100%;
        max-width: 100%;
        right: -100%;
    }
    .options-panel.open {
        right: 0;
    }
    .editor-status {
        font-size: 0.75rem;
        margin-left: 0.25rem;
    }
    .editor-chrome-mini-caption {
        display: none;
    }
    .editor-chrome-collapse-btn,
    .editor-chrome-expand-btn {
        min-width: 2.05rem;
        min-height: 2.05rem;
        padding: 0.3rem;
    }
    .editor-chrome-mini-link {
        font-size: 0.8rem;
        padding: 0.3rem 0.45rem;
    }
    /* Лендинг */
    .lp-theme-toggle {
        top: 0.5rem;
        right: 0.5rem;
        padding: 0.4rem 0.65rem;
        font-size: 0.85rem;
    }
    .lp-for-you-grid {
        grid-template-columns: 1fr;
    }
    .lp-features-grid {
        grid-template-columns: 1fr;
    }
    .lp-tariffs-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 480px) {
    .panel-content {
        padding: 0.75rem 0.5rem 1.5rem;
    }
    .panel-card {
        padding: 1rem;
    }
    .panel-card h2 {
        font-size: 1.1rem;
    }
    .dashboard-table {
        min-width: 480px;
        font-size: 0.8rem;
    }
    /* Календарь: 1 колонка месяцев, ячейки дня мельче */
    .admin-calendar-fullyear {
        grid-template-columns: 1fr;
        gap: 0.5rem;
    }
    .admin-calendar-month-block {
        min-width: 180px;
        font-size: 0.6rem;
    }
    .admin-calendar-month-block .admin-day-btn {
        width: 1.6em;
        min-height: 1.6em;
        font-size: 0.55rem;
    }
    .admin-calendar-legend {
        font-size: 0.8rem;
    }
    .admin-mode-buttons {
        gap: 0.35rem;
    }
    .admin-mode-buttons .btn {
        padding: 0.4rem 0.6rem;
        font-size: 0.85rem;
    }
    /* Тулбар экрана: ещё компактнее */
    .screen-toolbar {
        flex-wrap: wrap;
    }
    .screen-toolbar .editor-label span {
        display: none;
    }
    #preset-layout-select {
        min-width: 8rem !important;
        max-width: 100%;
    }
    .screen-toolbar-add .btn {
        font-size: 0.8rem;
        padding: 0.3rem 0.5rem;
    }
    .screen-toolbar-ticker {
        padding: 0.4rem 0.75rem;
    }
    .screen-toolbar-ticker .screen-name-input {
        width: 100%;
        min-width: 0;
    }
    /* Кнопки и ссылки — удобный тап */
    .btn {
        padding: 0.6rem 1rem;
        min-height: 44px;
    }
    .panel-nav a {
        display: inline-block;
        margin-bottom: 0.25rem;
    }
    .screens-list-delete:not(.dashboard-screen-delete-link) {
        padding: 0.4rem 0.65rem;
        min-height: 44px;
    }
    .screens-list-delete.dashboard-screen-delete-link {
        min-height: 44px;
        display: inline-flex !important;
        align-items: center;
        padding: 0.35rem 0.3rem !important;
    }
    .screens-list a {
        padding: 0.35rem 0;
        min-height: 44px;
        display: inline-flex;
        align-items: center;
    }
    /* Настройки школы: поля в колонку */
    .settings-fields {
        gap: 0.5rem;
    }
    .panel-card .options-input,
    .panel-card input,
    .panel-card select {
        padding: 0.65rem 0.75rem;
    }
    .ml-2 {
        margin-left: 0;
        margin-top: 0.5rem;
    }
    #theme-auto-range {
        display: flex;
        flex-wrap: wrap;
        gap: 0.5rem;
        align-items: center;
    }
    #theme-auto-range .settings-label {
        margin-bottom: 0;
    }
    /* Лендинг: CTA и футер */
    .lp-cta {
        flex-direction: column;
        align-items: center;
    }
    .lp-cta .btn {
        width: 100%;
        max-width: 280px;
    }
    .lp-footer .btn {
        display: block;
        width: 100%;
        max-width: 280px;
        margin: 0 auto;
    }
    .lp-for-you-item {
        flex-direction: column;
        gap: 0.75rem;
        padding: 1.25rem;
    }
    .lp-for-you-item .lp-for-you-icon {
        align-self: flex-start;
    }
}


/* Горизонтальный скролл для календаря на очень узких экранах */

@media (max-width: 360px) {
    .admin-calendar-fullyear {
        grid-template-columns: 1fr;
    }
    .admin-calendar-month-block {
        min-width: 160px;
    }
}


/* ——— Вертикальный экран (киоск): data-screen-orientation на .player-wrap из раскладки (orientation: portrait) ——— */

@supports (container-type: size) {
    .player-wrap[data-screen-orientation="portrait"] .player-cell {
        container-type: size;
        container-name: kiosk-cell;
    }
}


/* Ячейки растягивают виджет по высоте киоска */

.player-wrap[data-screen-orientation="portrait"] .player-cell {
    align-items: stretch;
    justify-content: stretch;
}


/*
 * В обычном режиме .player-cell.cells-N задаёт font-size 0.56em–1.2em — в киоске это ужимает всё.
 * Для ключевых виджетов сбрасываем базу на 1rem; масштаб даём через cqmax/cqh (не cqmin: в узкой высокой ячейке cqmin = ширина колонки → мелкий шрифт и пустота по вертикали).
 */

.player-wrap[data-screen-orientation="portrait"] .player-cell.widget-time,
.player-wrap[data-screen-orientation="portrait"] .player-cell.widget-date,
.player-wrap[data-screen-orientation="portrait"] .player-cell.widget-weather,
.player-wrap[data-screen-orientation="portrait"] .player-cell.widget-menu,
.player-wrap[data-screen-orientation="portrait"] .player-cell.widget-slider,
.player-wrap[data-screen-orientation="portrait"] .player-cell.widget-news,
.player-wrap[data-screen-orientation="portrait"] .player-cell.widget-announcements,
.player-wrap[data-screen-orientation="portrait"] .player-cell.widget-custom,
.player-wrap[data-screen-orientation="portrait"] .player-cell.widget-holidays,
.player-wrap[data-screen-orientation="portrait"] .player-cell.widget-schoolinfo,
.player-wrap[data-screen-orientation="portrait"] .player-cell.widget-closing_timer,
.player-wrap[data-screen-orientation="portrait"] .player-cell.widget-birthdays,
.player-wrap[data-screen-orientation="portrait"] .player-cell.widget-polling_station,
.player-wrap[data-screen-orientation="portrait"] .player-cell.widget-taskmanager,
.player-wrap[data-screen-orientation="portrait"] .player-cell.widget-promo,
.player-wrap[data-screen-orientation="portrait"] .player-cell.widget-canteen_shifts,
.player-wrap[data-screen-orientation="portrait"] .player-cell.widget-canteen_rules,
.player-wrap[data-screen-orientation="portrait"] .player-cell.widget-canteen_status,
.player-wrap[data-screen-orientation="portrait"] .player-cell.widget-orders_json,
.player-wrap[data-screen-orientation="portrait"] .player-cell.widget-qr_app,
.player-wrap[data-screen-orientation="portrait"] .player-cell.widget-flower_care,
.player-wrap[data-screen-orientation="portrait"] .player-cell.widget-popular_bouquets,
.player-wrap[data-screen-orientation="portrait"] .player-cell.widget-flower_prices,
.player-wrap[data-screen-orientation="portrait"] .player-cell.widget-customjs {
    font-size: 1rem;
}


/* Погода */

.player-wrap[data-screen-orientation="portrait"] .widget-weather-wrap {
    flex-direction: column;
    justify-content: center;
    min-height: 0;
    flex: 1;
}

.player-wrap[data-screen-orientation="portrait"] .widget-weather-wrap .widget-weather-inner {
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    gap: clamp(0.45rem, 2.5cqmax, 1.1rem);
    font-size: clamp(0.95rem, min(3.8cqmax, 3.2cqh), 1.85rem);
}


/* Слайдер — заполняет ячейку */

.player-wrap[data-screen-orientation="portrait"] .widget-slider {
    min-height: 100%;
    height: 100%;
}

.player-wrap[data-screen-orientation="portrait"] .widget-slider-inner {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.player-wrap[data-screen-orientation="portrait"] .widget-slider .widget-slider-slick,
.player-wrap[data-screen-orientation="portrait"] .widget-slider .slick-list,
.player-wrap[data-screen-orientation="portrait"] .widget-slider .slick-track {
    min-height: 0;
    flex: 1;
}


/* Новости, объявления (тот же .widget-news-inner), свой блок */

.player-wrap[data-screen-orientation="portrait"] .widget-news-inner,
.player-wrap[data-screen-orientation="portrait"] .widget-custom-inner {
    font-size: clamp(0.85rem, min(3cqmax, 2.8cqh), 1.2rem);
    line-height: 1.45;
    text-align: center;
}

.player-wrap[data-screen-orientation="portrait"] .widget-schoolinfo-main--logo-left,
.player-wrap[data-screen-orientation="portrait"] .widget-schoolinfo-main--logo-right {
    flex-direction: column;
    align-items: center;
    text-align: center;
    font-size: clamp(0.85rem, min(2.8cqmax, 2.4cqh), 1.15rem);
}

.player-wrap[data-screen-orientation="portrait"] .widget-closing-timer-main {
    flex-direction: column;
    align-items: center;
    text-align: center;
    font-size: clamp(0.95rem, min(3.6cqmax, 3.2cqh), 1.55rem);
}

.player-wrap[data-screen-orientation="portrait"] .widget-closing-timer-main .widget-closing-timer-time {
    width: 100%;
}

.player-wrap[data-screen-orientation="portrait"] .widget-holidays-inner {
    font-size: clamp(0.85rem, min(3cqmax, 2.8cqh), 1.15rem);
    text-align: center;
}

.player-wrap[data-screen-orientation="portrait"] .widget-birthdays-inner,
.player-wrap[data-screen-orientation="portrait"] .widget-polling-station-inner,
.player-wrap[data-screen-orientation="portrait"] .widget-taskmanager-inner {
    flex-direction: column;
    align-items: center;
    text-align: center;
    font-size: clamp(0.85rem, min(3cqmax, 2.8cqh), 1.1rem);
}

.player-wrap[data-screen-orientation="portrait"] .widget-promo-inner,
.player-wrap[data-screen-orientation="portrait"] .widget-canteen-rules-inner,
.player-wrap[data-screen-orientation="portrait"] .widget-canteen-status-inner,
.player-wrap[data-screen-orientation="portrait"] .widget-canteen-shifts-inner {
    flex-direction: column;
    align-items: center;
    text-align: center;
    font-size: clamp(0.85rem, min(3cqmax, 2.8cqh), 1.1rem);
}


/* Заказы JSON, QR, цветы и др. карточки */

.player-wrap[data-screen-orientation="portrait"] .widget-orders-json-inner,
.player-wrap[data-screen-orientation="portrait"] .widget-qr-app-inner,
.player-wrap[data-screen-orientation="portrait"] .widget-flower-care-inner,
.player-wrap[data-screen-orientation="portrait"] .widget-popular-bouquets-inner,
.player-wrap[data-screen-orientation="portrait"] .widget-flower-prices-inner {
    font-size: clamp(0.8rem, min(2.8cqmax, 2.4cqh), 1.08rem);
    flex-direction: column;
    align-items: stretch;
    text-align: center;
    gap: 0.5em;
}

.player-wrap[data-screen-orientation="portrait"] .widget-customjs-inner {
    font-size: clamp(0.75rem, min(2.4cqmax, 2.1cqh), 1rem);
    overflow: auto;
    max-height: 100%;
}