﻿:root {
    --notebook-paper: #fafafa;
    --notebook-ink: #242424;
    --notebook-muted: #696969;
    --notebook-purple: #a99af4;
    --notebook-purple-dark: #5948bb;
    --notebook-purple-soft: #eeeaff;
    --notebook-green: #dff1dc;
    --notebook-yellow: #fff1b9;
    --notebook-red: #f6d6d1;
    --notebook-blue: #dceef4;
    --notebook-border: 1.5px solid var(--notebook-ink);
    --notebook-hand: "Segoe Print", "Bradley Hand", "Comic Sans MS", cursive;
}

/* Бумажный фон */

body {
    color: var(--notebook-ink);
    background-color: #fff;
    background-image: linear-gradient( rgba(89, 72, 187, 0.025) 1px, transparent 1px ), radial-gradient( rgba(36, 36, 36, 0.018) 0.8px, transparent 0.8px );
    background-size: 100% 29px, 7px 7px;
}

.app-main {
    padding-top: 34px;
}

/* Навигация */

.app-navbar {
    min-height: 68px;
    background: rgba(250, 250, 250, 0.96);
    border-bottom: var(--notebook-border);
    box-shadow: none;
}

.app-brand {
    color: var(--notebook-ink);
    font-family: var(--notebook-hand);
    font-size: 1.22rem;
    font-weight: 700;
}

.app-brand-mark {
    width: 34px;
    height: 34px;
    color: var(--notebook-ink);
    background: var(--notebook-purple);
    border: var(--notebook-border);
    border-radius: 10px;
    box-shadow: 2px 2px 0 var(--notebook-ink);
    transform: rotate(-3deg);
}

.app-navbar .nav-link {
    color: var(--notebook-ink);
    font-family: inherit;
    font-size: 0.94rem;
    border: 1px solid transparent;
    font-weight: 600;
    letter-spacing: normal;
}

    .app-navbar .nav-link:hover {
        color: var(--notebook-ink);
        background: transparent;
        border-color: var(--notebook-ink);
    }

    .app-navbar .nav-link.active {
        color: var(--notebook-purple-dark);
        background: linear-gradient( transparent 62%, rgba(169, 154, 244, 0.46) 62% );
        border-color: transparent;
    }

/* Заголовки */

h1,
h2,
h3,
h4,
h5,
h6 {
    color: var(--notebook-ink);
    font-family: var(--notebook-hand);
    font-weight: 700;
    letter-spacing: -0.035em;
}

.text-muted {
    color: var(--notebook-muted) !important;
}

/* Общие карточки */

.card {
    background: rgba(255, 255, 255, 0.96);
    border: var(--notebook-border);
    border-radius: 13px;
    box-shadow: 3px 4px 0 rgba(38, 36, 33, 0.13);
}


/* Кнопки */

.btn {
    color: var(--notebook-ink);
    font-family: inherit;
    font-weight: 600;
    border: var(--notebook-border);
    border-radius: 8px;
    box-shadow: 2px 2px 0 var(--notebook-ink);
    transition: transform 120ms ease, box-shadow 120ms ease, background-color 120ms ease;
    letter-spacing: normal;
}

    .btn:hover {
        color: var(--notebook-ink);
        transform: translate(-1px, -1px);
        box-shadow: 3px 3px 0 var(--notebook-ink);
    }

    .btn:active {
        transform: translate(2px, 2px);
        box-shadow: none;
    }

.hero-actions .btn,
.favorite-toggle-button {
    font-family: var(--notebook-hand);
    font-weight: 700;
    letter-spacing: normal;
}

.btn-primary {
    --bs-btn-color: var(--notebook-ink);
    --bs-btn-bg: var(--notebook-purple);
    --bs-btn-border-color: var(--notebook-ink);
    --bs-btn-hover-color: var(--notebook-ink);
    --bs-btn-hover-bg: #b8acf8;
    --bs-btn-hover-border-color: var(--notebook-ink);
    --bs-btn-active-color: var(--notebook-ink);
    --bs-btn-active-bg: #9887eb;
    --bs-btn-active-border-color: var(--notebook-ink);
}

.btn-outline-primary {
    --bs-btn-color: var(--notebook-purple-dark);
    --bs-btn-border-color: var(--notebook-ink);
    --bs-btn-hover-color: var(--notebook-ink);
    --bs-btn-hover-bg: var(--notebook-purple-soft);
    --bs-btn-hover-border-color: var(--notebook-ink);
}

/* Формы */

.form-label {
    color: var(--notebook-ink);
    font-family: inherit;
    font-weight: 600;
    letter-spacing: normal;
}

.form-control,
.form-select {
    color: var(--notebook-ink);
    background-color: rgba(255, 255, 255, 0.96);
    border: 1.5px solid rgba(36, 36, 36, 0.62);
    border-radius: 8px;
    box-shadow: 1px 2px 0 rgba(38, 36, 33, 0.1);
}

    .form-control:focus,
    .form-select:focus,
    .form-check-input:focus {
        border-color: var(--notebook-purple-dark);
        box-shadow: 0 0 0 3px rgba(169, 154, 244, 0.27), 1px 2px 0 rgba(38, 36, 33, 0.1);
    }

    .form-control::placeholder {
        color: #918b80;
    }

/* Бейджи */

.badge {
    color: var(--notebook-ink) !important;
    font-family: inherit;
    font-weight: 600;
    border: 1px solid rgba(36, 36, 36, 0.55);
    border-radius: 7px;
    letter-spacing: normal;
}

.text-bg-light {
    background: #f2f2f1 !important;
}

.text-bg-info {
    background: var(--notebook-blue) !important;
}

.text-bg-success {
    background: var(--notebook-green) !important;
}

.text-bg-warning {
    background: var(--notebook-yellow) !important;
}

.text-bg-danger {
    background: var(--notebook-red) !important;
}

/* Уведомления */

.alert {
    color: var(--notebook-ink);
    background: rgba(255, 255, 255, 0.96);
    border: var(--notebook-border);
    border-radius: 10px;
    box-shadow: 2px 3px 0 rgba(38, 36, 33, 0.1);
}

.alert-info {
    background: var(--notebook-purple-soft);
}

.alert-danger {
    background: var(--notebook-red);
}

/* Заголовок каталога */

.notebook-page-heading {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 24px;
    margin-bottom: 27px;
    padding-bottom: 17px;
    border-bottom: 2px solid var(--notebook-ink);
}

.notebook-page-kicker {
    display: inline-block;
    margin-bottom: 8px;
    padding: 3px 9px;
    color: var(--notebook-purple-dark);
    background: var(--notebook-purple-soft);
    border: 1px solid var(--notebook-ink);
    border-radius: 6px;
    font-family: var(--notebook-hand);
    font-size: 0.82rem;
    font-weight: 700;
    transform: rotate(-1deg);
}

.notebook-page-heading h1 {
    margin-bottom: 8px;
    font-size: clamp(2.15rem, 5vw, 3.6rem);
    line-height: 1.03;
}

.catalog-result-count {
    flex: 0 0 auto;
    padding: 9px 13px;
    background: var(--notebook-yellow);
    border: var(--notebook-border);
    border-radius: 8px;
    font-family: inherit;
    font-weight: 600;
    transform: rotate(1deg);
    letter-spacing: normal;
}


.notebook-reset-link {
    color: var(--notebook-muted);
    font-family: inherit;
    font-weight: 600;
    text-decoration: none;
    letter-spacing: normal;
}

    .notebook-reset-link:hover {
        color: var(--notebook-ink);
        text-decoration: underline;
    }

/* Карточки каталога */

.prompt-notes-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 25px;
}

.prompt-note-card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 310px;
    padding: 24px 22px 20px;
    background: rgba(255, 255, 255, 0.98);
    border: var(--notebook-border);
    border-radius: 11px;
    box-shadow: 4px 5px 0 rgba(38, 36, 33, 0.14);
    transition: transform 150ms ease, box-shadow 150ms ease;
}

    .prompt-note-card:nth-child(3n + 1) {
        transform: rotate(-0.35deg);
    }

    .prompt-note-card:nth-child(3n + 2) {
        transform: rotate(0.25deg);
    }

    .prompt-note-card:nth-child(3n) {
        transform: rotate(-0.1deg);
    }

    .prompt-note-card:hover {
        transform: translateY(-4px) rotate(0deg);
        box-shadow: 6px 8px 0 rgba(38, 36, 33, 0.15);
    }

.prompt-note-tape {
    position: absolute;
    top: -10px;
    left: 50%;
    width: 77px;
    height: 20px;
    background: rgba(169, 154, 244, 0.43);
    border-left: 1px solid rgba(38, 36, 33, 0.25);
    border-right: 1px solid rgba(38, 36, 33, 0.25);
    transform: translateX(-50%) rotate(-1deg);
}

.prompt-note-card:nth-child(3n + 2)
.prompt-note-tape {
    background: rgba(255, 241, 185, 0.65);
    transform: translateX(-50%) rotate(2deg);
}

.prompt-note-card:nth-child(3n)
.prompt-note-tape {
    background: rgba(220, 238, 244, 0.7);
    transform: translateX(-50%) rotate(-2deg);
}

.prompt-note-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-bottom: 17px;
}

.notebook-tag {
    padding: 4px 8px;
    color: var(--notebook-ink);
    background: #f4efe1;
    border: 1px solid rgba(36, 36, 36, 0.55);
    border-radius: 7px;
    font-family: inherit;
    font-size: 0.76rem;
    font-weight: 600;
    letter-spacing: normal;
}

.notebook-tag-purple {
    background: var(--notebook-purple-soft);
}

.notebook-tag-blue {
    background: var(--notebook-blue);
}

.prompt-note-title {
    margin-bottom: 12px;
    font-size: 1.33rem;
    line-height: 1.25;
}

    .prompt-note-title a {
        color: var(--notebook-ink);
        text-decoration: none;
    }

        .prompt-note-title a:hover {
            color: var(--notebook-purple-dark);
            text-decoration: underline wavy var(--notebook-purple);
            text-underline-offset: 4px;
        }

.prompt-note-summary {
    flex-grow: 1;
    margin-bottom: 19px;
    color: var(--notebook-muted);
    line-height: 1.65;
}

.prompt-note-author {
    margin-bottom: 13px;
    padding-top: 13px;
    color: var(--notebook-muted);
    border-top: 1px dashed rgba(38, 36, 33, 0.45);
    font-size: 0.84rem;
}

.prompt-note-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 14px;
}

.prompt-note-stats {
    color: var(--notebook-muted);
    font-size: 0.8rem;
    line-height: 1.5;
}

.prompt-note-open {
    flex: 0 0 auto;
    color: var(--notebook-purple-dark);
    font-family: inherit;
    font-weight: 600;
    text-decoration: none;
    letter-spacing: normal;
}

    .prompt-note-open:hover {
        color: var(--notebook-ink);
        text-decoration: underline;
    }

/* Пустой результат */

.notebook-empty-state {
    max-width: 650px;
    margin: 50px auto;
    padding: 35px;
    text-align: center;
    background: rgba(255, 255, 255, 0.98);
    border: var(--notebook-border);
    border-radius: 11px;
    box-shadow: 4px 5px 0 rgba(38, 36, 33, 0.13);
    transform: rotate(-0.3deg);
}

    .notebook-empty-state h2 {
        font-size: 1.55rem;
    }

/* Footer */

.app-footer {
    color: var(--notebook-muted);
    background: rgba(251, 248, 237, 0.96);
    border-top: var(--notebook-border);
}

/* Адаптивность */

@media (max-width: 1199.98px) {
    .prompt-notes-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .notebook-page-heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .catalog-result-count {
        align-self: flex-start;
    }

    .prompt-notes-grid {
        grid-template-columns: 1fr;
    }

    .prompt-note-card,
    .prompt-note-card:nth-child(n) {
        transform: none;
    }
}


/* Страница конкретного промпта */

.prompt-detail-header {
    position: relative;
    margin-bottom: 34px;
    padding: 28px 30px;
    background: linear-gradient( 90deg, transparent 42px, rgba(213, 89, 89, 0.14) 43px, transparent 44px ), repeating-linear-gradient( transparent, transparent 30px, rgba(91, 72, 187, 0.045) 31px ), rgba(255, 255, 255, 0.99);
    border: var(--notebook-border);
    border-radius: 13px;
    box-shadow: 4px 5px 0 rgba(38, 36, 33, 0.13);
}

    .prompt-detail-header::before {
        position: absolute;
        top: -11px;
        left: 50%;
        width: 105px;
        height: 23px;
        content: "";
        background: rgba(169, 154, 244, 0.45);
        border-left: 1px solid rgba(38, 36, 33, 0.24);
        border-right: 1px solid rgba(38, 36, 33, 0.24);
        transform: translateX(-50%) rotate(-1deg);
    }

.prompt-detail-category {
    display: inline-block;
    margin-bottom: 14px;
    padding: 4px 10px;
    color: var(--notebook-purple-dark);
    background: var(--notebook-purple-soft);
    border: 1px solid var(--notebook-ink);
    border-radius: 7px;
    font-family: var(--notebook-hand);
    font-size: 0.82rem;
    font-weight: 700;
    transform: rotate(-1deg);
}

.prompt-detail-title {
    max-width: 1000px;
    margin-bottom: 14px;
    font-size: clamp(2.25rem, 5vw, 4.2rem);
    line-height: 1.04;
}

.prompt-detail-summary {
    max-width: 900px;
    margin-bottom: 21px;
    color: var(--notebook-muted);
    font-size: 1.08rem;
    line-height: 1.65;
}

.prompt-detail-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.prompt-meta-note {
    padding: 5px 9px;
    color: #303030;
    background: #f7f7f8;
    border: 1px solid rgba(36, 36, 36, 0.55);
    border-radius: 7px;
    font-family: inherit;
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: normal;
}

    .prompt-meta-note:nth-child(1) {
        background: #fff7df;
    }

    .prompt-meta-note:nth-child(2) {
        background: #f1edff;
    }

    .prompt-meta-note:nth-child(3) {
        background: #eaf7fa;
    }

    .prompt-meta-note:nth-child(4) {
        background: #f3efff;
    }

    .prompt-meta-note:nth-child(5) {
        background: #fff8e8;
    }

    .prompt-meta-note:nth-child(6) {
        background: #edf8fa;
    }

    .prompt-meta-note:nth-child(7) {
        background: #f5f0e6;
    }

    .prompt-meta-note a,
    a.prompt-meta-note {
        color: #5745c7;
    }

        .prompt-meta-note a:hover,
        a.prompt-meta-note:hover {
            color: #36289d;
        }


/* Предпросмотр */

.notebook-preview-banner {
    position: relative;
    margin-bottom: 27px;
    padding: 17px 19px;
    background: var(--notebook-purple-soft);
    border: var(--notebook-border);
    border-radius: 10px;
    box-shadow: 3px 4px 0 rgba(38, 36, 33, 0.12);
}

    .notebook-preview-banner::after {
        position: absolute;
        top: -8px;
        right: 42px;
        width: 72px;
        height: 18px;
        content: "";
        background: rgba(255, 241, 185, 0.72);
        transform: rotate(3deg);
    }

/* Основная сетка */

.prompt-detail-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 340px);
    gap: 28px;
    align-items: start;
}

.prompt-detail-main {
    min-width: 0;
}

.prompt-detail-sidebar {
    position: sticky;
    top: 96px;
    display: grid;
    gap: 20px;
}

/* Отдельный лист раздела */

.prompt-paper-section {
    position: relative;
    margin-bottom: 29px;
    padding: 25px;
    background: rgba(255, 255, 255, 0.98);
    border: var(--notebook-border);
    border-radius: 12px;
    box-shadow: 4px 5px 0 rgba(38, 36, 33, 0.13);
}

    .prompt-paper-section:nth-child(even) {
        transform: rotate(0.08deg);
    }

    .prompt-paper-section:nth-child(odd) {
        transform: rotate(-0.08deg);
    }

    .prompt-paper-section::before {
        position: absolute;
        top: -9px;
        left: 42px;
        width: 75px;
        height: 19px;
        content: "";
        background: rgba(255, 241, 185, 0.7);
        border-left: 1px solid rgba(38, 36, 33, 0.22);
        border-right: 1px solid rgba(38, 36, 33, 0.22);
        transform: rotate(-2deg);
    }

    .prompt-paper-section.constructor-sheet::before {
        background: rgba(169, 154, 244, 0.48);
        transform: rotate(2deg);
    }

    .prompt-paper-section.result-sheet::before {
        background: rgba(220, 238, 244, 0.75);
        transform: rotate(-1deg);
    }

    .prompt-paper-section.example-sheet::before {
        background: rgba(223, 241, 220, 0.78);
        transform: rotate(2deg);
    }

.prompt-section-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 18px;
    margin-bottom: 19px;
}

.prompt-section-heading {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0;
    font-size: 1.42rem;
}

.prompt-section-number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 34px;
    height: 34px;
    color: var(--notebook-ink);
    background: var(--notebook-purple);
    border: 1.5px solid var(--notebook-ink);
    border-radius: 50%;
    font-family: var(--notebook-hand);
    font-size: 0.95rem;
    font-weight: 800;
    box-shadow: 2px 2px 0 var(--notebook-ink);
    transform: rotate(-4deg);
}

.constructor-sheet .prompt-section-number {
    background: var(--notebook-yellow);
}

.result-sheet .prompt-section-number {
    background: var(--notebook-blue);
}

.example-sheet .prompt-section-number {
    background: var(--notebook-green);
}

/* Текст промпта */

.notebook-prompt-text {
    overflow-x: auto;
    min-height: 130px;
    padding: 23px 22px 23px 49px;
    color: var(--notebook-ink);
    background: linear-gradient( 90deg, transparent 31px, rgba(209, 76, 76, 0.2) 32px, transparent 33px ), repeating-linear-gradient( transparent, transparent 27px, rgba(91, 72, 187, 0.1) 28px ), #fffef9;
    border: 1.5px solid var(--notebook-ink);
    border-radius: 8px;
    font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
    font-size: 0.92rem;
    line-height: 1.8;
    white-space: pre-wrap;
}

.prompt-copy-button {
    flex: 0 0 auto;
}


/* Инструкция по использованию промпта */

.prompt-usage-inline {
    margin-top: 18px;
    padding: 15px 17px;
    background: rgba(255, 249, 223, 0.72);
    border: 1px dashed rgba(38, 36, 33, 0.5);
    border-radius: 8px;
}

.prompt-usage-inline-title {
    margin-bottom: 6px;
    font-weight: 700;
}

.prompt-usage-inline-text {
    line-height: 1.65;
    white-space: pre-line;
}

/* Конструктор */

.constructor-intro {
    margin-bottom: 20px;
    color: var(--notebook-muted);
    line-height: 1.65;
}

.constructor-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 17px;
}

.constructor-field {
    padding: 15px;
    background: rgba(238, 234, 255, 0.36);
    border: 1px dashed rgba(38, 36, 33, 0.6);
    border-radius: 9px;
}

    .constructor-field:has(textarea) {
        grid-column: 1 / -1;
    }

    .constructor-field .form-label {
        display: block;
        margin-bottom: 7px;
    }

.constructor-field-required {
    color: #b33d36;
}

.constructor-submit-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-top: 21px;
    padding-top: 18px;
    border-top: 1px dashed rgba(38, 36, 33, 0.45);
}

.constructor-submit-hint {
    max-width: 470px;
    margin: 0;
    color: var(--notebook-muted);
    font-family: var(--notebook-hand);
    font-size: 0.85rem;
}

/* Пустой результат */

.prompt-result-placeholder {
    padding: 25px;
    color: var(--notebook-muted);
    background: repeating-linear-gradient( transparent, transparent 27px, rgba(91, 72, 187, 0.08) 28px ), rgba(249, 247, 239, 0.8);
    border: 1.5px dashed rgba(38, 36, 33, 0.6);
    border-radius: 8px;
    font-family: var(--notebook-hand);
    text-align: center;
}

/* Боковые заметки */

.prompt-sidebar-note {
    position: relative;
    padding: 21px;
    background: rgba(255, 255, 255, 0.98);
    border: var(--notebook-border);
    border-radius: 10px;
    box-shadow: 4px 5px 0 rgba(38, 36, 33, 0.13);
}

    .prompt-sidebar-note:nth-child(2n) {
        transform: rotate(0.5deg);
    }

    .prompt-sidebar-note::before {
        position: absolute;
        top: -9px;
        right: 31px;
        width: 66px;
        height: 18px;
        content: "";
        background: rgba(169, 154, 244, 0.42);
        transform: rotate(3deg);
    }

    .prompt-sidebar-note h2 {
        margin-bottom: 13px;
        font-size: 1.13rem;
    }

    .prompt-sidebar-note p:last-child {
        margin-bottom: 0;
    }

.prompt-sidebar-list {
    display: grid;
    gap: 10px;
    margin: 0;
    padding: 0;
    list-style: none;
}

    .prompt-sidebar-list li {
        display: flex;
        justify-content: space-between;
        gap: 14px;
        padding-bottom: 8px;
        border-bottom: 1px dashed rgba(38, 36, 33, 0.38);
        color: var(--notebook-muted);
        font-size: 0.86rem;
    }

        .prompt-sidebar-list li:last-child {
            padding-bottom: 0;
            border-bottom: 0;
        }

    .prompt-sidebar-list strong {
        color: var(--notebook-ink);
        font-weight: 700;
    }

.prompt-general-errors {
    margin-top: 18px;
}

/* Адаптивность страницы промпта */

@media (max-width: 991.98px) {
    .prompt-detail-layout {
        grid-template-columns: 1fr;
    }

    .prompt-detail-sidebar {
        position: static;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .prompt-detail-header {
        padding: 24px 18px;
    }

    .prompt-paper-section,
    .prompt-paper-section:nth-child(n) {
        padding: 21px 16px;
        transform: none;
    }

    .prompt-section-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .prompt-copy-button {
        width: 100%;
    }

    .constructor-fields {
        grid-template-columns: 1fr;
    }

    .constructor-field:has(textarea) {
        grid-column: auto;
    }

    .constructor-submit-row {
        align-items: stretch;
        flex-direction: column;
    }

        .constructor-submit-row .btn {
            width: 100%;
        }

    .prompt-detail-sidebar {
        grid-template-columns: 1fr;
    }

    .notebook-prompt-text {
        padding-left: 18px;
        background: repeating-linear-gradient( transparent, transparent 27px, rgba(91, 72, 187, 0.08) 28px ), #fffef9;
    }
}


/* Страница «Мои промпты» */

.author-page-header {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 28px;
    margin-bottom: 26px;
    padding: 27px 29px;
    background: repeating-linear-gradient( transparent, transparent 29px, rgba(91, 72, 187, 0.08) 30px ), rgba(255, 255, 255, 0.98);
    border: var(--notebook-border);
    border-radius: 12px;
    box-shadow: 4px 5px 0 rgba(38, 36, 33, 0.13);
}

    .author-page-header::before {
        position: absolute;
        top: -10px;
        left: 46px;
        width: 91px;
        height: 21px;
        content: "";
        background: rgba(169, 154, 244, 0.47);
        border-left: 1px solid rgba(38, 36, 33, 0.24);
        border-right: 1px solid rgba(38, 36, 33, 0.24);
        transform: rotate(-2deg);
    }

.author-page-kicker {
    display: inline-block;
    margin-bottom: 8px;
    padding: 3px 9px;
    color: var(--notebook-purple-dark);
    background: var(--notebook-purple-soft);
    border: 1px solid var(--notebook-ink);
    border-radius: 6px;
    font-family: var(--notebook-hand);
    font-size: 0.8rem;
    font-weight: 700;
}

.author-page-title {
    margin-bottom: 8px;
    font-size: clamp( 2.15rem, 5vw, 3.6rem);
    line-height: 1.04;
}

.author-page-description {
    max-width: 720px;
    margin-bottom: 0;
    color: var(--notebook-muted);
    line-height: 1.65;
}

/* Краткая статистика */

.author-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 30px;
}

.author-summary-note {
    position: relative;
    min-height: 112px;
    padding: 18px;
    background: rgba(255, 255, 255, 0.98);
    border: var(--notebook-border);
    border-radius: 9px;
    box-shadow: 3px 4px 0 rgba(38, 36, 33, 0.12);
}

    .author-summary-note:nth-child(1) {
        background: #f2f2f1;
        transform: rotate(-0.4deg);
    }

    .author-summary-note:nth-child(2) {
        background: var(--notebook-yellow);
        transform: rotate(0.35deg);
    }

    .author-summary-note:nth-child(3) {
        background: var(--notebook-purple-soft);
        transform: rotate(-0.2deg);
    }

    .author-summary-note:nth-child(4) {
        background: var(--notebook-green);
        transform: rotate(0.45deg);
    }

.author-summary-label {
    margin-bottom: 7px;
    color: var(--notebook-muted);
    font-family: var(--notebook-hand);
    font-size: 0.82rem;
    font-weight: 700;
}

.author-summary-value {
    color: var(--notebook-ink);
    font-family: var(--notebook-hand);
    font-size: 2rem;
    font-weight: 800;
    line-height: 1;
}

/* Список материалов */

.author-prompts-list {
    display: grid;
    gap: 23px;
}

.author-prompt-card {
    position: relative;
    padding: 23px 24px;
    background: rgba(255, 255, 255, 0.98);
    border: var(--notebook-border);
    border-radius: 11px;
    box-shadow: 4px 5px 0 rgba(38, 36, 33, 0.13);
    transition: transform 150ms ease, box-shadow 150ms ease;
}

    .author-prompt-card:nth-child(odd) {
        transform: rotate(-0.08deg);
    }

    .author-prompt-card:nth-child(even) {
        transform: rotate(0.08deg);
    }

    .author-prompt-card:hover {
        transform: translateY(-2px) rotate(0deg);
        box-shadow: 5px 7px 0 rgba(38, 36, 33, 0.14);
    }

    .author-prompt-card::before {
        position: absolute;
        top: -9px;
        left: 45px;
        width: 72px;
        height: 18px;
        content: "";
        background: rgba(220, 238, 244, 0.72);
        transform: rotate(-2deg);
    }

    .author-prompt-card.state-draft::before {
        background: rgba(255, 241, 185, 0.78);
    }

    .author-prompt-card.state-pending::before {
        background: rgba(169, 154, 244, 0.52);
    }

    .author-prompt-card.state-published::before {
        background: rgba(223, 241, 220, 0.84);
    }

    .author-prompt-card.state-rejected::before {
        background: rgba(246, 214, 209, 0.9);
    }

.author-prompt-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 25px;
    align-items: start;
}

.author-prompt-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-bottom: 13px;
}


.author-prompt-title {
    margin-bottom: 9px;
    font-size: 1.43rem;
    line-height: 1.25;
}

.author-prompt-summary {
    max-width: 900px;
    margin-bottom: 16px;
    color: var(--notebook-muted);
    line-height: 1.65;
}

.author-prompt-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 17px;
    padding-top: 13px;
    color: var(--notebook-muted);
    border-top: 1px dashed rgba(38, 36, 33, 0.42);
    font-size: 0.82rem;
}

.author-prompt-meta-item {
    white-space: nowrap;
}

.author-prompt-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 9px;
    max-width: 390px;
}

    .author-prompt-actions form {
        margin: 0;
    }

/* Комментарий модератора */

.moderation-feedback-note {
    position: relative;
    margin: 5px 0 17px;
    padding: 16px 17px;
    color: var(--notebook-ink);
    background: var(--notebook-red);
    border: 1.5px solid var(--notebook-ink);
    border-radius: 8px;
    box-shadow: 2px 3px 0 rgba(38, 36, 33, 0.11);
}

    .moderation-feedback-note::before {
        position: absolute;
        top: -8px;
        right: 34px;
        width: 67px;
        height: 17px;
        content: "";
        background: rgba(255, 255, 255, 0.62);
        transform: rotate(3deg);
    }

.moderation-feedback-title {
    margin-bottom: 6px;
    font-family: var(--notebook-hand);
    font-weight: 800;
}

.moderation-feedback-text {
    line-height: 1.6;
    white-space: pre-wrap;
}


/* Пустая страница */

.author-empty-sheet {
    position: relative;
    max-width: 720px;
    margin: 45px auto 0;
    padding: 45px 32px;
    text-align: center;
    background: repeating-linear-gradient( transparent, transparent 29px, rgba(91, 72, 187, 0.08) 30px ), rgba(255, 255, 255, 0.98);
    border: var(--notebook-border);
    border-radius: 11px;
    box-shadow: 4px 5px 0 rgba(38, 36, 33, 0.13);
}

    .author-empty-sheet::before {
        position: absolute;
        top: -10px;
        left: 50%;
        width: 94px;
        height: 21px;
        content: "";
        background: rgba(255, 241, 185, 0.75);
        transform: translateX(-50%) rotate(-2deg);
    }

    .author-empty-sheet h2 {
        margin-bottom: 12px;
        font-size: 1.75rem;
    }

    .author-empty-sheet p {
        max-width: 500px;
        margin: 0 auto 22px;
        color: var(--notebook-muted);
        line-height: 1.65;
    }

@media (max-width: 991.98px) {
    .author-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .author-prompt-layout {
        grid-template-columns: 1fr;
    }

    .author-prompt-actions {
        justify-content: flex-start;
        max-width: none;
    }
}

@media (max-width: 767.98px) {
    .author-page-header {
        align-items: stretch;
        flex-direction: column;
        padding: 24px 18px;
    }

        .author-page-header > .btn {
            width: 100%;
        }

    .author-summary-grid {
        grid-template-columns: 1fr 1fr;
    }

    .author-prompt-card,
    .author-prompt-card:nth-child(n) {
        padding: 21px 16px;
        transform: none;
    }

    .author-prompt-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

        .author-prompt-actions .btn,
        .author-prompt-actions form,
        .author-prompt-actions form .btn {
            width: 100%;
        }
}

@media (max-width: 439.98px) {
    .author-summary-grid {
        grid-template-columns: 1fr;
    }
}


/* Создание и редактирование промпта */

.prompt-form-page {
    max-width: 1260px;
    margin-inline: auto;
}

.prompt-form-header {
    position: relative;
    margin-bottom: 28px;
    padding: 27px 30px;
    background: repeating-linear-gradient( transparent, transparent 29px, rgba(91, 72, 187, 0.08) 30px ), rgba(255, 255, 255, 0.98);
    border: var(--notebook-border);
    border-radius: 12px;
    box-shadow: 4px 5px 0 rgba(38, 36, 33, 0.13);
}

    .prompt-form-header::before {
        position: absolute;
        top: -10px;
        left: 50%;
        width: 96px;
        height: 21px;
        content: "";
        background: rgba(169, 154, 244, 0.48);
        border-left: 1px solid rgba(38, 36, 33, 0.22);
        border-right: 1px solid rgba(38, 36, 33, 0.22);
        transform: translateX(-50%) rotate(-2deg);
    }

.prompt-form-kicker {
    display: inline-block;
    margin-bottom: 8px;
    padding: 3px 9px;
    color: var(--notebook-purple-dark);
    background: var(--notebook-purple-soft);
    border: 1px solid var(--notebook-ink);
    border-radius: 6px;
    font-family: var(--notebook-hand);
    font-size: 0.8rem;
    font-weight: 700;
    transform: rotate(-1deg);
}

.prompt-form-title {
    margin-bottom: 9px;
    font-size: clamp( 2.15rem, 5vw, 3.7rem);
    line-height: 1.04;
}

.prompt-form-description {
    max-width: 770px;
    margin-bottom: 0;
    color: var(--notebook-muted);
    line-height: 1.65;
}

/* Общая сетка формы */

.prompt-form-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(250px, 310px);
    gap: 28px;
    align-items: start;
}

.prompt-form-sheet {
    position: relative;
    padding: 31px 31px 31px 57px;
    background: linear-gradient( 90deg, transparent 37px, rgba(211, 81, 81, 0.2) 38px, transparent 39px ), repeating-linear-gradient( transparent, transparent 29px, rgba(91, 72, 187, 0.075) 30px ), rgba(255, 255, 255, 0.99);
    border: var(--notebook-border);
    border-radius: 12px;
    box-shadow: 5px 6px 0 rgba(38, 36, 33, 0.13);
}

    .prompt-form-sheet::before {
        position: absolute;
        top: -10px;
        right: 80px;
        width: 85px;
        height: 20px;
        content: "";
        background: rgba(255, 241, 185, 0.73);
        border-left: 1px solid rgba(38, 36, 33, 0.22);
        border-right: 1px solid rgba(38, 36, 33, 0.22);
        transform: rotate(2deg);
    }

.prompt-form-section {
    padding-block: 8px 28px;
    margin-bottom: 27px;
    border-bottom: 1px dashed rgba(38, 36, 33, 0.42);
}

    .prompt-form-section:last-of-type {
        margin-bottom: 0;
    }

.prompt-form-section-header {
    display: flex;
    align-items: flex-start;
    gap: 13px;
    margin-bottom: 19px;
}

.prompt-form-section-number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 34px;
    height: 34px;
    color: var(--notebook-ink);
    background: var(--notebook-purple);
    border: 1.5px solid var(--notebook-ink);
    border-radius: 50%;
    box-shadow: 2px 2px 0 var(--notebook-ink);
    font-family: var(--notebook-hand);
    font-size: 0.94rem;
    font-weight: 800;
    transform: rotate(-4deg);
}

.prompt-form-section:nth-of-type(2)
.prompt-form-section-number {
    background: var(--notebook-yellow);
    transform: rotate(3deg);
}

.prompt-form-section:nth-of-type(3)
.prompt-form-section-number {
    background: var(--notebook-blue);
}

.prompt-form-section:nth-of-type(4)
.prompt-form-section-number {
    background: var(--notebook-green);
}

.prompt-form-section-title {
    margin: 0 0 4px;
    font-size: 1.35rem;
}

.prompt-form-section-description {
    margin: 0;
    color: var(--notebook-muted);
    font-size: 0.9rem;
    line-height: 1.55;
}

.prompt-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.prompt-form-field-wide {
    grid-column: 1 / -1;
}

.prompt-form-field {
    min-width: 0;
}

    .prompt-form-field textarea {
        resize: vertical;
    }

/* Готовый промпт */

.ready-prompt-editor {
    min-height: 330px;
    font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
    font-size: 0.91rem;
    line-height: 1.7;
    background: repeating-linear-gradient( transparent, transparent 27px, rgba(91, 72, 187, 0.07) 28px ), rgba(255, 255, 255, 0.98);
}

/* Переключатель конструктора */

.constructor-toggle-note {
    display: flex;
    align-items: flex-start;
    gap: 13px;
    padding: 16px 17px;
    background: var(--notebook-purple-soft);
    border: 1.5px solid var(--notebook-ink);
    border-radius: 9px;
    box-shadow: 2px 3px 0 rgba(38, 36, 33, 0.1);
}

    .constructor-toggle-note .form-check-input {
        flex: 0 0 auto;
        margin-top: 4px;
    }

.constructor-toggle-title {
    display: block;
    margin-bottom: 3px;
    color: var(--notebook-ink);
    font-family: var(--notebook-hand);
    font-weight: 800;
}

.constructor-toggle-description {
    display: block;
    color: var(--notebook-muted);
    font-size: 0.87rem;
    line-height: 1.5;
}

/* Редактор конструктора */

.constructor-editor-sheet {
    position: relative;
    margin-top: 20px;
    padding: 23px;
    background: rgba(238, 234, 255, 0.5);
    border: 1.5px dashed var(--notebook-ink);
    border-radius: 10px;
}

    .constructor-editor-sheet::before {
        position: absolute;
        top: -8px;
        left: 37px;
        width: 68px;
        height: 17px;
        content: "";
        background: rgba(220, 238, 244, 0.76);
        transform: rotate(-2deg);
    }

.constructor-template-editor {
    min-height: 300px;
    font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
    line-height: 1.7;
}

.constructor-toolbar {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-top: 16px;
}

.constructor-toolbar-hint {
    max-width: 520px;
    margin: 0;
    color: var(--notebook-muted);
    font-family: var(--notebook-hand);
    font-size: 0.84rem;
}

/* Добавленные визуальные поля */

.visual-fields-heading {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 15px;
    margin: 25px 0 13px;
    padding-top: 20px;
    border-top: 1px dashed rgba(38, 36, 33, 0.4);
}

    .visual-fields-heading h3 {
        margin: 0;
        font-size: 1.08rem;
    }

.visual-fields-empty {
    padding: 18px;
    color: var(--notebook-muted);
    background: rgba(255, 255, 255, 0.7);
    border: 1px dashed rgba(38, 36, 33, 0.55);
    border-radius: 8px;
    font-family: var(--notebook-hand);
    text-align: center;
}

.visual-fields-list {
    display: grid;
    gap: 13px;
}

.visual-field-note {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 18px;
    padding: 17px;
    background: rgba(255, 255, 255, 0.98);
    border: 1.5px solid var(--notebook-ink);
    border-radius: 9px;
    box-shadow: 2px 3px 0 rgba(38, 36, 33, 0.11);
}

    .visual-field-note:nth-child(3n + 1) {
        background: #fff8d8;
        transform: rotate(-0.15deg);
    }

    .visual-field-note:nth-child(3n + 2) {
        background: #eeeaff;
        transform: rotate(0.12deg);
    }

    .visual-field-note:nth-child(3n) {
        background: #e6f3f7;
        transform: rotate(-0.08deg);
    }

.visual-field-title {
    margin-bottom: 5px;
    font-family: var(--notebook-hand);
    font-weight: 800;
}

.visual-field-meta {
    margin-bottom: 7px;
    color: var(--notebook-muted);
    font-size: 0.81rem;
}

.visual-field-marker {
    color: var(--notebook-purple-dark);
    font-size: 0.81rem;
}

.visual-field-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 7px;
}

/* Форма добавления поля */

.field-editor-sheet {
    position: relative;
    margin-top: 22px;
    padding: 22px;
    background: var(--notebook-yellow);
    border: 1.5px solid var(--notebook-ink);
    border-radius: 10px;
    box-shadow: 3px 4px 0 rgba(38, 36, 33, 0.12);
}

    .field-editor-sheet::before {
        position: absolute;
        top: -8px;
        right: 44px;
        width: 73px;
        height: 17px;
        content: "";
        background: rgba(255, 255, 255, 0.67);
        transform: rotate(3deg);
    }

.field-editor-heading {
    margin-bottom: 17px;
    font-size: 1.18rem;
}

.field-editor-error {
    background: var(--notebook-red);
}

/* Нижние кнопки формы */

.prompt-form-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 17px;
    padding-top: 5px;
}

.prompt-form-actions-note {
    max-width: 520px;
    margin: 0;
    color: var(--notebook-muted);
    font-family: var(--notebook-hand);
    font-size: 0.84rem;
    line-height: 1.55;
}

.prompt-form-action-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

/* Боковые подсказки */

.prompt-form-sidebar {
    position: sticky;
    top: 95px;
    display: grid;
    gap: 20px;
}

.prompt-form-sidebar-note {
    position: relative;
    padding: 20px;
    background: rgba(255, 255, 255, 0.98);
    border: var(--notebook-border);
    border-radius: 10px;
    box-shadow: 4px 5px 0 rgba(38, 36, 33, 0.12);
}

    .prompt-form-sidebar-note:nth-child(2) {
        background: var(--notebook-purple-soft);
        transform: rotate(0.45deg);
    }

    .prompt-form-sidebar-note:nth-child(3) {
        background: var(--notebook-green);
        transform: rotate(-0.4deg);
    }

    .prompt-form-sidebar-note::before {
        position: absolute;
        top: -8px;
        right: 28px;
        width: 64px;
        height: 17px;
        content: "";
        background: rgba(169, 154, 244, 0.44);
        transform: rotate(3deg);
    }

    .prompt-form-sidebar-note h2 {
        margin-bottom: 12px;
        font-size: 1.1rem;
    }

    .prompt-form-sidebar-note p {
        color: var(--notebook-muted);
        font-size: 0.87rem;
        line-height: 1.6;
    }

        .prompt-form-sidebar-note p:last-child {
            margin-bottom: 0;
        }

.prompt-form-checklist {
    display: grid;
    gap: 10px;
    margin: 0;
    padding: 0;
    list-style: none;
}

    .prompt-form-checklist li {
        position: relative;
        padding-left: 24px;
        color: var(--notebook-muted);
        font-size: 0.87rem;
        line-height: 1.5;
    }

        .prompt-form-checklist li::before {
            position: absolute;
            top: 2px;
            left: 0;
            content: "□";
            color: var(--notebook-ink);
            font-family: var(--notebook-hand);
            font-weight: 800;
        }

        .prompt-form-checklist li.checked::before {
            content: "✓";
            color: #377151;
        }

/* Валидация */

.prompt-form-validation {
    margin-bottom: 23px;
}

    .prompt-form-validation ul {
        margin-bottom: 0;
    }

/* Адаптивность */

@media (max-width: 991.98px) {
    .prompt-form-layout {
        grid-template-columns: 1fr;
    }

    .prompt-form-sidebar {
        position: static;
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .prompt-form-header {
        padding: 24px 18px;
    }

    .prompt-form-sheet {
        padding: 25px 16px;
        background: repeating-linear-gradient( transparent, transparent 29px, rgba(91, 72, 187, 0.06) 30px ), rgba(255, 255, 255, 0.99);
    }

    .prompt-form-grid {
        grid-template-columns: 1fr;
    }

    .prompt-form-field-wide {
        grid-column: auto;
    }

    .visual-field-note {
        flex-direction: column;
    }

        .visual-field-note:nth-child(n) {
            transform: none;
        }

    .visual-field-actions {
        justify-content: flex-start;
        width: 100%;
    }

    .prompt-form-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .prompt-form-action-buttons {
        display: grid;
        grid-template-columns: 1fr;
        width: 100%;
    }

        .prompt-form-action-buttons .btn {
            width: 100%;
        }

    .prompt-form-sidebar {
        grid-template-columns: 1fr;
    }
}

/* Модерация */

.moderation-page-header {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 28px;
    margin-bottom: 29px;
    padding: 27px 29px;
    background: repeating-linear-gradient( transparent, transparent 29px, rgba(91, 72, 187, 0.08) 30px ), rgba(255, 255, 255, 0.98);
    border: var(--notebook-border);
    border-radius: 12px;
    box-shadow: 4px 5px 0 rgba(38, 36, 33, 0.13);
}

    .moderation-page-header::before {
        position: absolute;
        top: -10px;
        left: 54px;
        width: 92px;
        height: 21px;
        content: "";
        background: rgba(169, 154, 244, 0.48);
        border-left: 1px solid rgba(38, 36, 33, 0.22);
        border-right: 1px solid rgba(38, 36, 33, 0.22);
        transform: rotate(-2deg);
    }

.moderation-page-kicker {
    display: inline-block;
    margin-bottom: 8px;
    padding: 3px 9px;
    color: var(--notebook-purple-dark);
    background: var(--notebook-purple-soft);
    border: 1px solid var(--notebook-ink);
    border-radius: 6px;
    font-family: var(--notebook-hand);
    font-size: 0.8rem;
    font-weight: 700;
}

.moderation-page-title {
    margin-bottom: 8px;
    font-size: clamp( 2.15rem, 5vw, 3.6rem);
    line-height: 1.04;
}

.moderation-page-description {
    max-width: 740px;
    margin-bottom: 0;
    color: var(--notebook-muted);
    line-height: 1.65;
}

.moderation-queue-count {
    flex: 0 0 auto;
    min-width: 132px;
    padding: 13px 16px;
    text-align: center;
    background: var(--notebook-yellow);
    border: var(--notebook-border);
    border-radius: 9px;
    box-shadow: 2px 3px 0 rgba(38, 36, 33, 0.11);
    font-family: var(--notebook-hand);
    font-weight: 800;
    transform: rotate(1deg);
}

.moderation-queue-count-value {
    display: block;
    margin-bottom: 3px;
    font-size: 2rem;
    line-height: 1;
}

.moderation-queue-count-label {
    color: var(--notebook-muted);
    font-size: 0.78rem;
}

/* Очередь */

.moderation-queue-list {
    display: grid;
    gap: 23px;
}

.moderation-queue-card {
    position: relative;
    padding: 23px 24px;
    background: rgba(255, 255, 255, 0.98);
    border: var(--notebook-border);
    border-radius: 11px;
    box-shadow: 4px 5px 0 rgba(38, 36, 33, 0.13);
    transition: transform 150ms ease, box-shadow 150ms ease;
}

    .moderation-queue-card:nth-child(odd) {
        transform: rotate(-0.08deg);
    }

    .moderation-queue-card:nth-child(even) {
        transform: rotate(0.08deg);
    }

    .moderation-queue-card:hover {
        transform: translateY(-2px) rotate(0deg);
        box-shadow: 5px 7px 0 rgba(38, 36, 33, 0.14);
    }

    .moderation-queue-card::before {
        position: absolute;
        top: -9px;
        left: 48px;
        width: 75px;
        height: 18px;
        content: "";
        background: rgba(169, 154, 244, 0.52);
        transform: rotate(-2deg);
    }

.moderation-queue-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 25px;
    align-items: start;
}

.moderation-queue-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-bottom: 13px;
}

.moderation-queue-title {
    margin-bottom: 9px;
    font-size: 1.43rem;
    line-height: 1.25;
}

.moderation-queue-summary {
    max-width: 900px;
    margin-bottom: 16px;
    color: var(--notebook-muted);
    line-height: 1.65;
}

.moderation-queue-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 17px;
    padding-top: 13px;
    color: var(--notebook-muted);
    border-top: 1px dashed rgba(38, 36, 33, 0.42);
    font-size: 0.83rem;
}

.moderation-empty-sheet {
    position: relative;
    max-width: 720px;
    margin: 48px auto 0;
    padding: 46px 32px;
    text-align: center;
    background: repeating-linear-gradient( transparent, transparent 29px, rgba(91, 72, 187, 0.08) 30px ), rgba(255, 255, 255, 0.98);
    border: var(--notebook-border);
    border-radius: 11px;
    box-shadow: 4px 5px 0 rgba(38, 36, 33, 0.13);
}

    .moderation-empty-sheet::before {
        position: absolute;
        top: -10px;
        left: 50%;
        width: 92px;
        height: 21px;
        content: "";
        background: rgba(223, 241, 220, 0.82);
        transform: translateX(-50%) rotate(-2deg);
    }

    .moderation-empty-sheet h2 {
        margin-bottom: 12px;
        font-size: 1.75rem;
    }

/* Страница проверки */

.moderation-back-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 20px;
    color: var(--notebook-purple-dark);
    font-family: var(--notebook-hand);
    font-weight: 700;
    text-decoration: none;
}

    .moderation-back-link:hover {
        color: var(--notebook-ink);
        text-decoration: underline;
    }

.moderation-review-header {
    position: relative;
    margin-bottom: 28px;
    padding: 27px 29px;
    background: repeating-linear-gradient( transparent, transparent 29px, rgba(91, 72, 187, 0.08) 30px ), rgba(255, 255, 255, 0.98);
    border: var(--notebook-border);
    border-radius: 12px;
    box-shadow: 4px 5px 0 rgba(38, 36, 33, 0.13);
}

    .moderation-review-header::before {
        position: absolute;
        top: -10px;
        right: 75px;
        width: 92px;
        height: 21px;
        content: "";
        background: rgba(255, 241, 185, 0.76);
        transform: rotate(2deg);
    }

.moderation-review-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-bottom: 14px;
}

.moderation-review-title {
    max-width: 980px;
    margin-bottom: 12px;
    font-size: clamp( 2.05rem, 5vw, 3.7rem);
    line-height: 1.04;
}

.moderation-review-summary {
    max-width: 900px;
    margin-bottom: 18px;
    color: var(--notebook-muted);
    font-size: 1.04rem;
    line-height: 1.65;
}

.moderation-review-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 18px;
    color: var(--notebook-muted);
    font-size: 0.84rem;
}

.moderation-review-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(290px, 350px);
    gap: 28px;
    align-items: start;
}

.moderation-review-main {
    min-width: 0;
}

.moderation-review-sidebar {
    position: sticky;
    top: 95px;
    display: grid;
    gap: 20px;
}

.moderation-review-sheet {
    position: relative;
    margin-bottom: 27px;
    padding: 24px;
    background: rgba(255, 255, 255, 0.98);
    border: var(--notebook-border);
    border-radius: 11px;
    box-shadow: 4px 5px 0 rgba(38, 36, 33, 0.13);
}

    .moderation-review-sheet::before {
        position: absolute;
        top: -9px;
        left: 45px;
        width: 73px;
        height: 18px;
        content: "";
        background: rgba(169, 154, 244, 0.47);
        transform: rotate(-2deg);
    }

    .moderation-review-sheet.constructor-review::before {
        background: rgba(220, 238, 244, 0.78);
        transform: rotate(2deg);
    }


    .moderation-review-sheet h2 {
        margin-bottom: 17px;
        font-size: 1.4rem;
    }

.moderation-review-text {
    overflow-x: auto;
    padding: 22px 20px 22px 46px;
    background: linear-gradient( 90deg, transparent 30px, rgba(211, 81, 81, 0.2) 31px, transparent 32px ), repeating-linear-gradient( transparent, transparent 27px, rgba(91, 72, 187, 0.09) 28px ), #fffef9;
    border: 1.5px solid var(--notebook-ink);
    border-radius: 8px;
    font-size: 0.91rem;
    line-height: 1.8;
    white-space: pre-wrap;
}

/* Таблица полей */

.moderation-variables-wrapper {
    margin-top: 23px;
}

    .moderation-variables-wrapper h3 {
        margin-bottom: 13px;
        font-size: 1.08rem;
    }

.moderation-variable-table {
    overflow: hidden;
    border: 1.5px solid var(--notebook-ink);
    border-radius: 8px;
}

    .moderation-variable-table .table {
        margin-bottom: 0;
    }

    .moderation-variable-table th {
        color: var(--notebook-ink);
        background: var(--notebook-purple-soft);
        font-family: var(--notebook-hand);
        font-size: 0.82rem;
    }

    .moderation-variable-table td,
    .moderation-variable-table th {
        border-color: rgba(38, 36, 33, 0.22);
    }

    .moderation-variable-table td {
        background: rgba(255, 255, 255, 0.95);
        vertical-align: middle;
    }

/* Инструкция и пример */

.moderation-secondary-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
}

.moderation-small-note {
    position: relative;
    min-height: 190px;
    padding: 21px;
    background: rgba(255, 255, 255, 0.98);
    border: var(--notebook-border);
    border-radius: 10px;
    box-shadow: 3px 4px 0 rgba(38, 36, 33, 0.12);
}

    .moderation-small-note:nth-child(1) {
        background: var(--notebook-yellow);
        transform: rotate(-0.25deg);
    }

    .moderation-small-note:nth-child(2) {
        background: var(--notebook-green);
        transform: rotate(0.25deg);
    }

    .moderation-small-note h2 {
        margin-bottom: 13px;
        font-size: 1.14rem;
    }

.moderation-small-note-content {
    color: var(--notebook-muted);
    line-height: 1.65;
    white-space: pre-wrap;
}

/* Боковые решения */

.moderation-sidebar-note {
    position: relative;
    padding: 21px;
    background: rgba(255, 255, 255, 0.98);
    border: var(--notebook-border);
    border-radius: 10px;
    box-shadow: 4px 5px 0 rgba(38, 36, 33, 0.12);
}

    .moderation-sidebar-note::before {
        position: absolute;
        top: -8px;
        right: 30px;
        width: 65px;
        height: 17px;
        content: "";
        background: rgba(169, 154, 244, 0.45);
        transform: rotate(3deg);
    }

    .moderation-sidebar-note h2 {
        margin-bottom: 13px;
        font-size: 1.14rem;
    }

.moderation-author-list {
    display: grid;
    gap: 10px;
    margin: 0;
    padding: 0;
    list-style: none;
}

    .moderation-author-list li {
        padding-bottom: 8px;
        color: var(--notebook-muted);
        border-bottom: 1px dashed rgba(38, 36, 33, 0.38);
        font-size: 0.86rem;
    }

        .moderation-author-list li:last-child {
            padding-bottom: 0;
            border-bottom: 0;
        }

    .moderation-author-list strong {
        display: block;
        margin-top: 2px;
        color: var(--notebook-ink);
        overflow-wrap: anywhere;
    }

.moderation-decision-card {
    position: relative;
    padding: 21px;
    border: 1.5px solid var(--notebook-ink);
    border-radius: 10px;
    box-shadow: 4px 5px 0 rgba(38, 36, 33, 0.12);
}

    .moderation-decision-card.approve {
        background: var(--notebook-green);
        transform: rotate(-0.25deg);
    }

    .moderation-decision-card.reject {
        background: var(--notebook-red);
        transform: rotate(0.25deg);
    }

    .moderation-decision-card h2 {
        margin-bottom: 10px;
        font-size: 1.18rem;
    }

    .moderation-decision-card p {
        color: var(--notebook-muted);
        font-size: 0.87rem;
        line-height: 1.55;
    }

    .moderation-decision-card .btn {
        width: 100%;
    }

.moderation-reject-textarea {
    min-height: 135px;
    background: rgba(255, 255, 255, 0.92);
}

/* Адаптивность */

@media (max-width: 991.98px) {
    .moderation-review-layout {
        grid-template-columns: 1fr;
    }

    .moderation-review-sidebar {
        position: static;
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .moderation-queue-layout {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767.98px) {
    .moderation-page-header {
        align-items: flex-start;
        flex-direction: column;
        padding: 24px 18px;
    }

    .moderation-queue-count {
        align-self: flex-start;
    }

    .moderation-queue-card,
    .moderation-queue-card:nth-child(n) {
        padding: 21px 16px;
        transform: none;
    }

    .moderation-review-header {
        padding: 24px 18px;
    }

    .moderation-review-sheet {
        padding: 21px 16px;
    }

    .moderation-review-text {
        padding-left: 17px;
        background: repeating-linear-gradient( transparent, transparent 27px, rgba(91, 72, 187, 0.08) 28px ), #fffef9;
    }

    .moderation-secondary-grid {
        grid-template-columns: 1fr;
    }

    .moderation-small-note:nth-child(n) {
        transform: none;
    }

    .moderation-review-sidebar {
        grid-template-columns: 1fr;
    }

    .moderation-decision-card:nth-child(n) {
        transform: none;
    }
}


/* Вход и регистрация */

.identity-page {
    max-width: 920px;
    margin-inline: auto;
    padding-block: 18px 35px;
}

.identity-layout {
    display: block;
    width: 100%;
    max-width: 880px;
    margin-inline: auto;
}

.identity-sheet {
    position: relative;
    padding: 38px 42px 36px 68px;
    background: linear-gradient( 90deg, transparent 43px, rgba(211, 81, 81, 0.2) 44px, transparent 45px ), repeating-linear-gradient( transparent, transparent 30px, rgba(91, 72, 187, 0.08) 31px ), rgba(255, 255, 255, 0.99);
    border: var(--notebook-border);
    border-radius: 13px;
    box-shadow: 5px 6px 0 rgba(38, 36, 33, 0.14);
}

    .identity-sheet::before {
        position: absolute;
        top: -11px;
        left: 50%;
        width: 101px;
        height: 22px;
        content: "";
        background: rgba(169, 154, 244, 0.48);
        border-left: 1px solid rgba(38, 36, 33, 0.24);
        border-right: 1px solid rgba(38, 36, 33, 0.24);
        transform: translateX(-50%) rotate(-2deg);
    }

.identity-kicker {
    display: inline-block;
    margin-bottom: 11px;
    padding: 4px 9px;
    color: var(--notebook-purple-dark);
    background: var(--notebook-purple-soft);
    border: 1px solid var(--notebook-ink);
    border-radius: 6px;
    font-family: var(--notebook-hand);
    font-size: 0.8rem;
    font-weight: 800;
    transform: rotate(-1deg);
}

.identity-title {
    margin-bottom: 11px;
    font-size: clamp( 2.2rem, 6vw, 3.8rem);
    line-height: 1.02;
}

.identity-description {
    max-width: 710px;
    margin-bottom: 29px;
    color: var(--notebook-muted);
    line-height: 1.65;
}

.identity-form {
    max-width: 750px;
}

.identity-form-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 18px;
    margin: 18px 0 23px;
}

.identity-small-link {
    color: var(--notebook-purple-dark);
    font-family: var(--notebook-hand);
    font-size: 0.84rem;
    font-weight: 700;
    text-decoration: none;
}

    .identity-small-link:hover {
        color: var(--notebook-ink);
        text-decoration: underline;
    }

.identity-submit-button {
    width: 100%;
    min-height: 48px;
    margin-top: 8px;
    font-size: 1rem;
}

.identity-captcha {
    margin: 22px 0 14px;
}

.identity-captcha .smart-captcha {
    min-height: 100px;
    max-width: 100%;
}

.identity-footer-text {
    margin-top: 25px;
    padding-top: 19px;
    color: var(--notebook-muted);
    border-top: 1px dashed rgba(38, 36, 33, 0.43);
    font-family: var(--notebook-hand);
    text-align: center;
}

    .identity-footer-text a {
        font-weight: 800;
    }

.identity-password-note {
    margin: 17px 0 8px;
    padding: 12px 14px;
    color: var(--notebook-muted);
    background: rgba(255, 241, 185, 0.55);
    border: 1px dashed rgba(38, 36, 33, 0.5);
    border-radius: 8px;
    font-size: 0.84rem;
    line-height: 1.5;
}


/* Имя пользователя в шапке */

.account-link {
    color: var(--notebook-ink) !important;
    background: rgba(255, 255, 255, 0.7);
    border: 1px dashed rgba(38, 36, 33, 0.55) !important;
    border-radius: 8px !important;
}

@media (max-width: 991.98px) {
}

@media (max-width: 767.98px) {
    .identity-sheet {
        padding: 29px 18px;
        background: repeating-linear-gradient( transparent, transparent 30px, rgba(91, 72, 187, 0.07) 31px ), rgba(255, 255, 255, 0.99);
    }

    .identity-form-row {
        align-items: flex-start;
        flex-direction: column;
    }
}


/* Личный кабинет */

.account-page {
    max-width: 1260px;
    margin-inline: auto;
}

.account-header-sheet {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 28px;
    margin-bottom: 28px;
    padding: 24px 28px;
    background: repeating-linear-gradient( transparent, transparent 29px, rgba(91, 72, 187, 0.075) 30px ), rgba(255, 255, 255, 0.98);
    border: var(--notebook-border);
    border-radius: 12px;
    box-shadow: 4px 5px 0 rgba(38, 36, 33, 0.13);
}

    .account-header-sheet::before {
        position: absolute;
        top: -10px;
        left: 50%;
        width: 96px;
        height: 21px;
        content: "";
        background: rgba(169, 154, 244, 0.48);
        transform: translateX(-50%) rotate(-2deg);
    }

.account-header-identity {
    display: flex;
    align-items: center;
    gap: 18px;
}

.account-avatar {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 76px;
    height: 76px;
    overflow: hidden;
    color: var(--notebook-ink);
    background: var(--notebook-purple);
    border: 2px solid var(--notebook-ink);
    border-radius: 20px;
    box-shadow: 3px 3px 0 var(--notebook-ink);
    font-family: var(--notebook-hand);
    font-size: 2rem;
    font-weight: 800;
    transform: rotate(-2deg);
}

    .account-avatar img {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.account-header-kicker,
.account-section-kicker {
    display: inline-block;
    margin-bottom: 5px;
    padding: 3px 8px;
    color: var(--notebook-purple-dark);
    background: var(--notebook-purple-soft);
    border: 1px solid var(--notebook-ink);
    border-radius: 6px;
    font-family: var(--notebook-hand);
    font-size: 0.76rem;
    font-weight: 800;
}

.account-header-title {
    margin-bottom: 3px;
    font-size: 2rem;
}

.account-header-email {
    color: var(--notebook-muted);
    font-size: 0.9rem;
}

.account-header-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 9px;
}

/* Сетка кабинета */

.account-layout {
    display: grid;
    grid-template-columns: minmax(220px, 270px) minmax(0, 1fr);
    gap: 27px;
    align-items: start;
}

.account-sidebar {
    position: sticky;
    top: 94px;
}

.account-nav-sheet {
    position: relative;
    padding: 21px;
    background: #fff9df;
    border: 1.5px solid rgba(36, 36, 36, 0.72);
    border-radius: 10px;
    box-shadow: 4px 5px 0 rgba(38, 36, 33, 0.13);
    transform: rotate(-0.25deg);
}

    .account-nav-sheet::before {
        position: absolute;
        top: -9px;
        right: 34px;
        width: 68px;
        height: 18px;
        content: "";
        background: rgba(255, 255, 255, 0.7);
        transform: rotate(3deg);
    }

.account-nav-title {
    margin-bottom: 10px;
    color: var(--notebook-muted);
    font-family: inherit;
    font-size: 0.78rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: normal;
}

.account-nav-links {
    display: grid;
    gap: 7px;
}

.account-nav-link {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 11px;
    color: var(--notebook-ink);
    border: 1px solid transparent;
    border-radius: 8px;
    font-family: inherit;
    font-weight: 600;
    text-decoration: none;
    letter-spacing: normal;
}

    .account-nav-link:hover {
        color: var(--notebook-ink);
        background: rgba(255, 255, 255, 0.62);
        border-color: var(--notebook-ink);
    }

    .account-nav-link.active {
        color: var(--notebook-purple-dark);
        background: var(--notebook-purple-soft);
        border-color: var(--notebook-ink);
        box-shadow: 2px 2px 0 var(--notebook-ink);
    }

.account-nav-number {
    color: var(--notebook-muted);
    font-size: 0.72rem;
}

.account-nav-divider {
    margin: 17px 0;
    border-top: 1px dashed rgba(38, 36, 33, 0.45);
}

/* Основной лист */

.account-content {
    min-width: 0;
}

.account-content-sheet {
    position: relative;
    padding: 29px 31px;
    background: repeating-linear-gradient( transparent, transparent 29px, rgba(91, 72, 187, 0.04) 30px ), rgba(255, 255, 255, 0.99);
    border: 1.5px solid rgba(36, 36, 36, 0.72);
    border-radius: 12px;
    box-shadow: 5px 6px 0 rgba(38, 36, 33, 0.13);
}

    .account-content-sheet::before {
        position: absolute;
        top: -9px;
        right: 75px;
        width: 82px;
        height: 19px;
        content: "";
        background: rgba(220, 238, 244, 0.75);
        transform: rotate(2deg);
    }

.account-section-header {
    margin-bottom: 25px;
    padding-bottom: 18px;
    border-bottom: 1px dashed rgba(38, 36, 33, 0.43);
}

    .account-section-header h2 {
        margin-bottom: 7px;
        font-size: 1.85rem;
    }

    .account-section-header p {
        max-width: 680px;
        margin-bottom: 0;
        color: var(--notebook-muted);
        line-height: 1.6;
    }

/* Статистика */

.account-stats-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 13px;
    margin-bottom: 27px;
}

.account-stat-note {
    min-height: 94px;
    padding: 15px;
    background: rgba(255, 255, 255, 0.95);
    border: 1.5px solid rgba(36, 36, 36, 0.58);
    border-radius: 8px;
    box-shadow: 2px 2px 0 rgba(36, 36, 36, 0.07);
}

    .account-stat-note:nth-child(1) {
        background: #f5f5f4;
        transform: rotate(-0.25deg);
    }

    .account-stat-note:nth-child(2) {
        background: #fff9e3;
        transform: rotate(0.25deg);
    }

    .account-stat-note:nth-child(3) {
        background: #f3f0ff;
        transform: rotate(-0.15deg);
    }

    .account-stat-note:nth-child(4) {
        background: #edf7eb;
        transform: rotate(0.25deg);
    }

.account-stat-label {
    margin-bottom: 6px;
    color: var(--notebook-muted);
    font-family: inherit;
    font-size: 0.76rem;
    font-weight: 600;
    letter-spacing: normal;
}

.account-stat-value {
    font-family: inherit;
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 1;
    letter-spacing: normal;
}

/* Форма профиля */

.account-profile-grid {
    display: grid;
    grid-template-columns: minmax(190px, 240px) minmax(0, 1fr);
    gap: 27px;
    align-items: start;
}

.account-avatar-editor {
    padding: 20px;
    text-align: center;
    background: var(--notebook-purple-soft);
    border: var(--notebook-border);
    border-radius: 10px;
    box-shadow: 3px 4px 0 rgba(38, 36, 33, 0.11);
    transform: rotate(-0.25deg);
}

.account-avatar-preview {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 120px;
    height: 120px;
    margin: 0 auto 17px;
    overflow: hidden;
    color: var(--notebook-ink);
    background: var(--notebook-purple);
    border: 2px solid var(--notebook-ink);
    border-radius: 27px;
    box-shadow: 4px 4px 0 var(--notebook-ink);
    font-family: var(--notebook-hand);
    font-size: 3rem;
    font-weight: 800;
}

    .account-avatar-preview img {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.account-avatar-editor h3 {
    margin-bottom: 8px;
    font-size: 1.05rem;
}

.account-avatar-editor p {
    margin-bottom: 0;
    color: var(--notebook-muted);
    font-size: 0.82rem;
    line-height: 1.55;
}


/* Загрузка аватара профиля */

.account-avatar-form {
    display: grid;
    gap: 10px;
    margin-top: 17px;
    text-align: left;
}

    .account-avatar-form .form-label {
        margin-bottom: 0;
        font-family: var(--notebook-hand);
        font-size: 0.82rem;
        font-weight: 800;
    }

    .account-avatar-form .form-control {
        font-size: 0.8rem;
    }

    .account-avatar-form .btn {
        width: 100%;
        margin-top: 2px;
    }

.account-avatar-delete-form {
    margin-top: 9px;
}

    .account-avatar-delete-form .btn {
        width: 100%;
    }

.account-avatar-preview img {
    background: var(--notebook-paper);
}


.account-profile-fields {
    min-width: 0;
}

.account-readonly-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 17px;
}

.account-readonly-value {
    display: flex;
    align-items: center;
    min-height: 44px;
    padding: 10px 13px;
    background: rgba(245, 240, 227, 0.8);
    border: 1.5px dashed rgba(38, 36, 33, 0.55);
    border-radius: 8px;
    font-family: inherit;
    font-weight: 600;
    letter-spacing: normal;
}

.account-form-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 25px;
    padding-top: 20px;
    border-top: 1px dashed rgba(38, 36, 33, 0.43);
}

/* Изменение пароля */

.account-password-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(220px, 290px);
    gap: 27px;
    align-items: start;
}

.account-password-form {
    max-width: 590px;
}

.account-security-note {
    position: relative;
    padding: 21px;
    background: var(--notebook-green);
    border: var(--notebook-border);
    border-radius: 10px;
    box-shadow: 4px 5px 0 rgba(38, 36, 33, 0.12);
    transform: rotate(0.35deg);
}

    .account-security-note::before {
        position: absolute;
        top: -8px;
        right: 32px;
        width: 66px;
        height: 17px;
        content: "";
        background: rgba(255, 255, 255, 0.65);
        transform: rotate(-3deg);
    }

    .account-security-note h3 {
        margin-bottom: 13px;
        font-size: 1.15rem;
    }

    .account-security-note ul {
        display: grid;
        gap: 10px;
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .account-security-note li {
        position: relative;
        padding-left: 23px;
        color: var(--notebook-muted);
        font-size: 0.85rem;
        line-height: 1.5;
    }

        .account-security-note li::before {
            position: absolute;
            left: 0;
            content: "✓";
            color: #377151;
            font-family: var(--notebook-hand);
            font-weight: 800;
        }

/* Адаптивность кабинета */

@media (max-width: 991.98px) {
    .account-layout {
        grid-template-columns: 1fr;
    }

    .account-sidebar {
        position: static;
    }

    .account-nav-sheet {
        transform: none;
    }

    .account-nav-links {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .account-password-layout {
        grid-template-columns: 1fr;
    }

    .account-security-note {
        transform: none;
    }
}

@media (max-width: 767.98px) {
    .account-header-sheet {
        align-items: flex-start;
        flex-direction: column;
        padding: 22px 17px;
    }

    .account-header-actions {
        display: grid;
        grid-template-columns: 1fr;
        width: 100%;
    }

        .account-header-actions .btn {
            width: 100%;
        }

    .account-content-sheet {
        padding: 24px 16px;
    }

    .account-stats-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .account-stat-note:nth-child(n) {
        transform: none;
    }

    .account-profile-grid {
        grid-template-columns: 1fr;
    }

    .account-avatar-editor {
        transform: none;
    }

    .account-readonly-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 479.98px) {
    .account-header-identity {
        align-items: flex-start;
    }

    .account-avatar {
        width: 60px;
        height: 60px;
        border-radius: 16px;
        font-size: 1.6rem;
    }

    .account-nav-links {
        grid-template-columns: 1fr;
    }

    .account-stats-grid {
        grid-template-columns: 1fr;
    }

    .account-form-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

        .account-form-actions .btn {
            width: 100%;
        }
}


/* Черновик успешно создан */

.draft-created-page {
    max-width: 1050px;
    margin-inline: auto;
}

.draft-created-sheet {
    position: relative;
    padding: 39px 42px 37px 67px;
    background: linear-gradient( 90deg, transparent 42px, rgba(211, 81, 81, 0.2) 43px, transparent 44px ), repeating-linear-gradient( transparent, transparent 30px, rgba(91, 72, 187, 0.08) 31px ), rgba(255, 255, 255, 0.99);
    border: var(--notebook-border);
    border-radius: 13px;
    box-shadow: 5px 6px 0 rgba(38, 36, 33, 0.14);
}

    .draft-created-sheet::before {
        position: absolute;
        top: -11px;
        left: 50%;
        width: 105px;
        height: 22px;
        content: "";
        background: rgba(223, 241, 220, 0.86);
        border-left: 1px solid rgba(38, 36, 33, 0.23);
        border-right: 1px solid rgba(38, 36, 33, 0.23);
        transform: translateX(-50%) rotate(-2deg);
    }

.draft-created-status {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 15px;
    padding: 6px 10px;
    color: #315f45;
    background: var(--notebook-green);
    border: 1px solid var(--notebook-ink);
    border-radius: 7px;
    font-family: var(--notebook-hand);
    font-size: 0.82rem;
    font-weight: 800;
    transform: rotate(-1deg);
}

.draft-created-status-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    color: var(--notebook-ink);
    background: rgba(255, 255, 255, 0.75);
    border: 1px solid var(--notebook-ink);
    border-radius: 50%;
    font-size: 0.78rem;
}

.draft-created-title {
    max-width: 850px;
    margin-bottom: 13px;
    font-size: clamp( 2.3rem, 6vw, 4.3rem);
    line-height: 1.02;
}

.draft-created-description {
    max-width: 760px;
    margin-bottom: 28px;
    color: var(--notebook-muted);
    font-size: 1.03rem;
    line-height: 1.7;
}

/* Путь публикации */

.draft-created-steps {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 15px;
    margin-bottom: 29px;
}

.draft-created-step {
    position: relative;
    min-height: 125px;
    padding: 17px;
    background: rgba(255, 255, 255, 0.95);
    border: 1.5px solid var(--notebook-ink);
    border-radius: 9px;
    box-shadow: 2px 3px 0 rgba(38, 36, 33, 0.1);
}

    .draft-created-step:nth-child(1) {
        background: var(--notebook-green);
        transform: rotate(-0.3deg);
    }

    .draft-created-step:nth-child(2) {
        background: var(--notebook-yellow);
        transform: rotate(0.25deg);
    }

    .draft-created-step:nth-child(3) {
        background: var(--notebook-purple-soft);
        transform: rotate(-0.15deg);
    }

.draft-created-step-number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    margin-bottom: 9px;
    background: rgba(255, 255, 255, 0.73);
    border: 1px solid var(--notebook-ink);
    border-radius: 50%;
    font-family: var(--notebook-hand);
    font-size: 0.8rem;
    font-weight: 800;
}

.draft-created-step-title {
    margin-bottom: 6px;
    font-family: var(--notebook-hand);
    font-size: 0.96rem;
    font-weight: 800;
}

.draft-created-step-text {
    margin: 0;
    color: var(--notebook-muted);
    font-size: 0.82rem;
    line-height: 1.5;
}

/* Информация о конструкторе */

.draft-created-constructor {
    position: relative;
    margin-bottom: 29px;
    padding: 22px;
    background: rgba(238, 234, 255, 0.68);
    border: 1.5px dashed var(--notebook-ink);
    border-radius: 10px;
}

    .draft-created-constructor::before {
        position: absolute;
        top: -8px;
        right: 50px;
        width: 72px;
        height: 17px;
        content: "";
        background: rgba(169, 154, 244, 0.48);
        transform: rotate(2deg);
    }

.draft-created-constructor-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 15px;
    margin-bottom: 16px;
}

.draft-created-constructor-title {
    margin: 0;
    font-size: 1.25rem;
}

.draft-created-constructor-count {
    flex: 0 0 auto;
    padding: 4px 8px;
    background: var(--notebook-blue);
    border: 1px solid var(--notebook-ink);
    border-radius: 7px;
    font-family: var(--notebook-hand);
    font-size: 0.78rem;
    font-weight: 800;
}

.draft-created-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 11px;
}

.draft-created-field {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 13px;
    padding: 12px 13px;
    background: rgba(255, 255, 255, 0.92);
    border: 1px solid var(--notebook-ink);
    border-radius: 8px;
    font-size: 0.86rem;
}

.draft-created-field-name {
    color: var(--notebook-ink);
    font-family: var(--notebook-hand);
    font-weight: 700;
}

.draft-created-field-state {
    flex: 0 0 auto;
    color: var(--notebook-muted);
    font-size: 0.75rem;
}

.draft-created-ready-note {
    margin-bottom: 29px;
    padding: 18px 19px;
    background: var(--notebook-blue);
    border: 1.5px dashed var(--notebook-ink);
    border-radius: 9px;
    color: var(--notebook-muted);
    line-height: 1.6;
}

    .draft-created-ready-note strong {
        display: block;
        margin-bottom: 4px;
        color: var(--notebook-ink);
        font-family: var(--notebook-hand);
    }

/* Действия */

.draft-created-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    padding-top: 22px;
    border-top: 1px dashed rgba(38, 36, 33, 0.45);
}


.draft-created-help {
    margin-top: 22px;
    color: var(--notebook-muted);
    font-family: var(--notebook-hand);
    font-size: 0.84rem;
    line-height: 1.6;
}

@media (max-width: 767.98px) {
    .draft-created-sheet {
        padding: 31px 17px;
        background: repeating-linear-gradient( transparent, transparent 30px, rgba(91, 72, 187, 0.07) 31px ), rgba(255, 255, 255, 0.99);
    }

    .draft-created-steps {
        grid-template-columns: 1fr;
    }

    .draft-created-step:nth-child(n) {
        min-height: auto;
        transform: none;
    }

    .draft-created-fields {
        grid-template-columns: 1fr;
    }

    .draft-created-constructor-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .draft-created-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

        .draft-created-actions .btn {
            width: 100%;
        }
}


/* Избранное */

.prompt-detail-favorite-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 20px;
    padding-top: 17px;
    border-top: 1px dashed rgba(38, 36, 33, 0.42);
}

.favorite-toggle-form {
    margin: 0;
}

.favorite-toggle-button {
    min-width: 118px;
}

    .favorite-toggle-button.is-favorite {
        background: var(--notebook-purple);
    }

    .favorite-toggle-button:disabled {
        cursor: wait;
        opacity: 0.72;
    }

.prompt-note-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
}

@media (max-width: 575.98px) {
    .prompt-note-footer {
        align-items: stretch;
        flex-direction: column;
    }

    .prompt-note-actions {
        justify-content: space-between;
        width: 100%;
    }

        .prompt-note-actions .favorite-toggle-form {
            flex-grow: 1;
        }

        .prompt-note-actions .favorite-toggle-button {
            width: 100%;
        }

    .prompt-detail-favorite-row .favorite-toggle-form,
    .prompt-detail-favorite-row .btn {
        width: 100%;
    }
}

/* Оценки промптов */

.prompt-rating-panel {
    position: relative;
    margin-top: 18px;
    padding: 18px 19px;
    background: #fff9df;
    border: 1.5px solid rgba(36, 36, 36, 0.72);
    border-radius: 10px;
    box-shadow: 3px 4px 0 rgba(38, 36, 33, 0.12);
}

    .prompt-rating-panel::before {
        position: absolute;
        top: -8px;
        right: 42px;
        width: 72px;
        height: 17px;
        content: "";
        background: rgba(255, 255, 255, 0.65);
        transform: rotate(3deg);
    }

.prompt-rating-summary {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 18px;
    margin-bottom: 14px;
}

.prompt-rating-label {
    color: var(--notebook-muted);
    font-family: var(--notebook-hand);
    font-size: 0.82rem;
    font-weight: 800;
}

.prompt-rating-value {
    color: var(--notebook-ink);
    font-family: var(--notebook-hand);
    font-size: 2rem;
    font-weight: 800;
    line-height: 1;
}

.prompt-rating-max {
    color: var(--notebook-muted);
    font-size: 1rem;
}

.prompt-rating-count {
    color: var(--notebook-muted);
    font-family: var(--notebook-hand);
    font-size: 0.86rem;
    font-weight: 700;
}

.prompt-rating-form {
    margin: 0;
}

.prompt-rating-stars {
    display: inline-flex;
    gap: 5px;
    margin-bottom: 10px;
}

.prompt-rating-star {
    width: 39px;
    height: 39px;
    color: rgba(38, 36, 33, 0.38);
    background: rgba(255, 255, 255, 0.76);
    border: 1.5px solid var(--notebook-ink);
    border-radius: 9px;
    box-shadow: 2px 2px 0 rgba(38, 36, 33, 0.45);
    font-size: 1.15rem;
    line-height: 1;
    transition: transform 120ms ease, box-shadow 120ms ease, color 120ms ease, background-color 120ms ease;
}

    .prompt-rating-star:hover,
    .prompt-rating-star.active {
        color: var(--notebook-ink);
        background: #ffd96a;
    }

    .prompt-rating-star:hover {
        transform: translateY(-2px);
    }

    .prompt-rating-star:active {
        transform: translate(2px, 2px);
        box-shadow: none;
    }

.prompt-rating-footer {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 10px;
    color: var(--notebook-muted);
    font-family: var(--notebook-hand);
    font-size: 0.84rem;
}

.prompt-rating-clear {
    padding: 0;
    color: var(--notebook-purple-dark);
    background: transparent;
    border: 0;
    font-family: var(--notebook-hand);
    font-weight: 800;
    text-decoration: underline;
}

    .prompt-rating-clear:hover {
        color: var(--notebook-ink);
    }

.prompt-note-rating {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin: -2px 0 13px;
    color: var(--notebook-muted);
    font-family: var(--notebook-hand);
    font-size: 0.82rem;
    font-weight: 700;
}

    .prompt-note-rating > span:first-child {
        color: #c58a16;
    }

.prompt-note-user-rating {
    padding-inline: 6px;
    color: var(--notebook-purple-dark);
    background: var(--notebook-purple-soft);
    border: 1px solid rgba(38, 36, 33, 0.35);
    border-radius: 6px;
}

@media (max-width: 575.98px) {
    .prompt-rating-summary {
        align-items: flex-start;
        flex-direction: column;
    }

    .prompt-rating-stars {
        display: grid;
        grid-template-columns: repeat(5, 1fr);
        width: 100%;
    }

    .prompt-rating-star {
        width: 100%;
    }
}

/* Главная: лучшие промпты */

.home-top-prompts {
    padding-block: 46px 20px;
}

.home-section-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 24px;
    margin-bottom: 25px;
    padding-bottom: 17px;
    border-bottom: 2px solid var(--notebook-ink);
}

    .home-section-header h2 {
        margin-bottom: 8px;
        font-size: clamp( 2rem, 5vw, 3.25rem);
        line-height: 1.05;
    }

    .home-section-header p {
        max-width: 690px;
        margin-bottom: 0;
        color: var(--notebook-muted);
        line-height: 1.65;
    }

.home-top-prompts-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
}


.home-empty-note {
    position: relative;
    max-width: 650px;
    margin-inline: auto;
    padding: 34px;
    text-align: center;
    background: rgba(255, 255, 255, 0.98);
    border: var(--notebook-border);
    border-radius: 11px;
    box-shadow: 4px 5px 0 rgba(38, 36, 33, 0.13);
}

    .home-empty-note::before {
        position: absolute;
        top: -10px;
        left: 50%;
        width: 92px;
        height: 21px;
        content: "";
        background: rgba(255, 241, 185, 0.75);
        transform: translateX(-50%) rotate(-2deg);
    }

    .home-empty-note h3 {
        margin-bottom: 10px;
        font-size: 1.55rem;
    }

    .home-empty-note p {
        margin-bottom: 0;
        color: var(--notebook-muted);
    }

@media (max-width: 991.98px) {
    .home-top-prompts-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .home-section-header {
        align-items: flex-start;
        flex-direction: column;
    }

        .home-section-header .btn {
            width: 100%;
        }

    .home-top-prompts-grid {
        grid-template-columns: 1fr;
    }
}

/* Публичная страница автора */

.notebook-inline-link {
    color: var(--notebook-purple-dark);
    font-family: var(--notebook-hand);
    font-weight: 800;
    text-decoration: none;
}

    .notebook-inline-link:hover {
        color: var(--notebook-ink);
        text-decoration: underline wavy var(--notebook-purple);
        text-underline-offset: 4px;
    }

.author-profile-page {
    max-width: 1260px;
    margin-inline: auto;
}

.author-profile-header {
    position: relative;
    margin-bottom: 24px;
    padding: 28px 30px;
    background: repeating-linear-gradient( transparent, transparent 29px, rgba(91, 72, 187, 0.075) 30px ), rgba(255, 255, 255, 0.98);
    border: var(--notebook-border);
    border-radius: 12px;
    box-shadow: 4px 5px 0 rgba(38, 36, 33, 0.13);
}

    .author-profile-header::before {
        position: absolute;
        top: -10px;
        left: 50%;
        width: 102px;
        height: 21px;
        content: "";
        background: rgba(169, 154, 244, 0.48);
        transform: translateX(-50%) rotate(-2deg);
    }

.author-profile-main {
    display: flex;
    align-items: center;
    gap: 24px;
}

.author-profile-avatar {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 118px;
    height: 118px;
    overflow: hidden;
    color: var(--notebook-ink);
    background: var(--notebook-purple);
    border: 2px solid var(--notebook-ink);
    border-radius: 28px;
    box-shadow: 4px 4px 0 var(--notebook-ink);
    font-family: var(--notebook-hand);
    font-size: 3rem;
    font-weight: 800;
    transform: rotate(-2deg);
}

    .author-profile-avatar img {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.author-profile-kicker {
    display: inline-block;
    margin-bottom: 8px;
    padding: 4px 9px;
    color: var(--notebook-purple-dark);
    background: var(--notebook-purple-soft);
    border: 1px solid var(--notebook-ink);
    border-radius: 6px;
    font-family: var(--notebook-hand);
    font-size: 0.8rem;
    font-weight: 800;
    transform: rotate(-1deg);
}

.author-profile-title {
    margin-bottom: 10px;
    font-size: clamp( 2.35rem, 6vw, 4.35rem);
    line-height: 1.02;
}

.author-profile-description {
    max-width: 820px;
    margin-bottom: 12px;
    color: var(--notebook-muted);
    font-size: 1.02rem;
    line-height: 1.7;
    white-space: pre-line;
}

.author-profile-meta {
    color: var(--notebook-muted);
    font-family: var(--notebook-hand);
    font-size: 0.86rem;
    font-weight: 700;
}

.author-profile-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 15px;
    margin-bottom: 37px;
}

.author-profile-stat {
    min-height: 105px;
    padding: 17px;
    background: rgba(255, 255, 255, 0.96);
    border: 1.5px solid var(--notebook-ink);
    border-radius: 9px;
    box-shadow: 3px 4px 0 rgba(38, 36, 33, 0.12);
}

    .author-profile-stat:nth-child(1) {
        background: var(--notebook-yellow);
        transform: rotate(-0.25deg);
    }

    .author-profile-stat:nth-child(2) {
        background: var(--notebook-purple-soft);
        transform: rotate(0.25deg);
    }

    .author-profile-stat:nth-child(3) {
        background: var(--notebook-blue);
        transform: rotate(-0.15deg);
    }

    .author-profile-stat:nth-child(4) {
        background: var(--notebook-green);
        transform: rotate(0.2deg);
    }

.author-profile-stat-label {
    margin-bottom: 7px;
    color: var(--notebook-muted);
    font-family: var(--notebook-hand);
    font-size: 0.82rem;
    font-weight: 800;
}

.author-profile-stat-value {
    color: var(--notebook-ink);
    font-family: var(--notebook-hand);
    font-size: 2rem;
    font-weight: 800;
    line-height: 1;
}

.author-profile-prompts {
    margin-top: 20px;
}

@media (max-width: 767.98px) {
    .author-profile-header {
        padding: 24px 18px;
    }

    .author-profile-main {
        align-items: flex-start;
        flex-direction: column;
    }

    .author-profile-avatar {
        width: 96px;
        height: 96px;
        border-radius: 23px;
        font-size: 2.4rem;
    }

    .author-profile-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .author-profile-stat:nth-child(n) {
        transform: none;
    }
}

@media (max-width: 439.98px) {
    .author-profile-stats {
        grid-template-columns: 1fr;
    }
}


/* Жалобы на промпты */

.prompt-report-panel {
    position: relative;
    margin-top: 18px;
    padding: 18px 19px;
    background: #fff8f9;
    border: 1px solid rgba(36, 36, 36, 0.78);
    border-radius: 10px;
    box-shadow: 2px 2px 0 rgba(36, 36, 36, 0.12);
}

    .prompt-report-panel::before {
        position: absolute;
        top: -8px;
        right: 42px;
        width: 72px;
        height: 17px;
        content: "";
        background: rgba(255, 255, 255, 0.68);
        transform: rotate(-3deg);
    }


.prompt-report-description {
    margin-bottom: 14px;
    color: #666;
    font-size: 0.86rem;
    line-height: 1.55;
}

.prompt-report-status {
    margin-bottom: 13px;
    padding: 10px 12px;
    color: var(--notebook-muted);
    background: rgba(255, 255, 255, 0.7);
    border: 1px dashed rgba(38, 36, 33, 0.5);
    border-radius: 8px;
    font-family: var(--notebook-hand);
    font-size: 0.84rem;
    font-weight: 700;
}

.prompt-report-form {
    margin: 0;
}

.moderation-report-links {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 16px;
}

.report-card {
    background: repeating-linear-gradient( transparent, transparent 29px, rgba(211, 81, 81, 0.055) 30px ), rgba(255, 255, 255, 0.98);
}

.report-details-box {
    margin: 16px 0;
    padding: 14px 15px;
    color: var(--notebook-muted);
    background: rgba(255, 235, 235, 0.55);
    border: 1.5px dashed rgba(38, 36, 33, 0.55);
    border-radius: 8px;
    line-height: 1.6;
    white-space: pre-line;
}

.report-actions {
    display: grid;
    gap: 12px;
    min-width: 240px;
}

.report-resolution-input {
    min-height: 84px;
    font-size: 0.86rem;
}

@media (max-width: 767.98px) {
    .report-actions {
        min-width: 0;
        width: 100%;
    }

    .prompt-report-panel .btn {
        width: 100%;
    }
}

/* Жалоба в правой колонке */

.sidebar-report-panel {
    background: #FFEBEB;
    border: 1px solid #595959;
    box-shadow: 2px 3px 0 rgba(36, 36, 36, 0.10);
    transform: none !important;
}

    .sidebar-report-panel::before {
        background: rgba(255, 255, 255, 0.9);
        transform: rotate(-3deg);
    }

    .sidebar-report-panel .prompt-report-description {
        margin-bottom: 14px;
        color: #5f5f5f;
    }

    .sidebar-report-panel .prompt-report-status {
        margin-bottom: 13px;
    }

    .sidebar-report-panel .form-label {
        margin-bottom: 6px;
        color: #303030;
    }

    .sidebar-report-panel textarea {
        min-height: 110px;
    }

    .sidebar-report-panel .form-control,
    .sidebar-report-panel .form-select {
        color: #242424;
        background: #fff;
        border: 1px solid #777;
        box-shadow: none;
    }

        .sidebar-report-panel .form-control::placeholder {
            color: #909090;
            opacity: 1;
        }

    .sidebar-report-panel .btn {
        background: #fffafa;
        border: 1.5px solid #242424;
        box-shadow: 2px 2px 0 #242424;
    }


/* Архивация промпта модератором */

.report-archive-form {
    padding: 12px;
    background: rgba(255, 235, 235, 0.66);
    border: 1.5px dashed rgba(38, 36, 33, 0.55);
    border-radius: 9px;
}

.author-prompt-card.state-archived::before {
    background: rgba(38, 36, 33, 0.18);
}

.archive-feedback-note {
    background: rgba(38, 36, 33, 0.08);
}

    .archive-feedback-note .moderation-feedback-title {
        color: var(--notebook-ink);
    }

.moderation-feedback-date {
    margin-top: 10px;
    padding-top: 9px;
    color: var(--notebook-muted);
    border-top: 1px dashed rgba(38, 36, 33, 0.42);
    font-family: var(--notebook-hand);
    font-size: 0.8rem;
    font-weight: 700;
}


/* Восстановление скрытых промптов */

.archived-prompt-card {
    background: repeating-linear-gradient( transparent, transparent 29px, rgba(38, 36, 33, 0.045) 30px ), rgba(255, 255, 255, 0.98);
}

.archive-reason-box {
    margin: 16px 0;
    padding: 14px 15px;
    color: var(--notebook-muted);
    background: rgba(38, 36, 33, 0.065);
    border: 1.5px dashed rgba(38, 36, 33, 0.55);
    border-radius: 8px;
    line-height: 1.6;
    white-space: pre-line;
}

.archive-reason-title {
    margin-bottom: 6px;
    color: var(--notebook-ink);
    font-family: var(--notebook-hand);
    font-size: 0.86rem;
    font-weight: 800;
}

.restore-prompt-form {
    padding: 12px;
    background: rgba(223, 241, 220, 0.72);
    border: 1.5px dashed rgba(38, 36, 33, 0.55);
    border-radius: 9px;
}


/* Админка пользователей */

.admin-users-page {
    max-width: 1260px;
    margin-inline: auto;
}

.admin-user-list {
    display: grid;
    gap: 23px;
}

.admin-user-card {
    position: relative;
    display: grid;
    grid-template-columns: minmax(260px, 1.1fr) minmax(360px, 1.4fr) minmax(210px, auto);
    gap: 22px;
    align-items: center;
    padding: 22px 23px;
    background: rgba(255, 255, 255, 0.98);
    border: var(--notebook-border);
    border-radius: 11px;
    box-shadow: 4px 5px 0 rgba(38, 36, 33, 0.13);
}

    .admin-user-card::before {
        position: absolute;
        top: -9px;
        left: 48px;
        width: 74px;
        height: 18px;
        content: "";
        background: rgba(169, 154, 244, 0.48);
        transform: rotate(-2deg);
    }

    .admin-user-card:nth-child(2n)::before {
        background: rgba(255, 241, 185, 0.78);
        transform: rotate(2deg);
    }

.admin-user-main {
    display: flex;
    align-items: center;
    gap: 15px;
    min-width: 0;
}

.admin-user-avatar {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 58px;
    height: 58px;
    color: var(--notebook-ink);
    background: var(--notebook-purple);
    border: 2px solid var(--notebook-ink);
    border-radius: 16px;
    box-shadow: 3px 3px 0 var(--notebook-ink);
    font-family: var(--notebook-hand);
    font-size: 1.55rem;
    font-weight: 800;
    transform: rotate(-2deg);
}

.admin-user-title-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-bottom: 3px;
}

    .admin-user-title-row h2 {
        margin: 0;
        font-size: 1.28rem;
        line-height: 1.25;
    }

.admin-user-email {
    color: var(--notebook-muted);
    font-size: 0.84rem;
    overflow-wrap: anywhere;
}

.admin-user-roles {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 9px;
}

.admin-user-created {
    margin-top: 8px;
    color: var(--notebook-muted);
    font-family: var(--notebook-hand);
    font-size: 0.78rem;
    font-weight: 700;
}

.admin-user-stats-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
}

.admin-user-stat {
    min-height: 68px;
    padding: 10px;
    background: rgba(255, 255, 255, 0.88);
    border: 1.5px dashed rgba(38, 36, 33, 0.52);
    border-radius: 8px;
}

    .admin-user-stat span {
        display: block;
        margin-bottom: 4px;
        color: var(--notebook-muted);
        font-family: var(--notebook-hand);
        font-size: 0.72rem;
        font-weight: 800;
    }

    .admin-user-stat strong {
        color: var(--notebook-ink);
        font-family: var(--notebook-hand);
        font-size: 1.25rem;
        font-weight: 800;
        line-height: 1;
    }

.admin-user-actions {
    display: grid;
    gap: 9px;
    justify-self: stretch;
}

    .admin-user-actions form {
        margin: 0;
    }

    .admin-user-actions .btn {
        width: 100%;
    }

@media (max-width: 1199.98px) {
    .admin-user-card {
        grid-template-columns: 1fr;
        align-items: stretch;
    }

    .admin-user-stats-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .admin-user-card {
        padding: 21px 16px;
    }

    .admin-user-main {
        align-items: flex-start;
    }

    .admin-user-stats-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 439.98px) {
    .admin-user-stats-grid {
        grid-template-columns: 1fr;
    }

    .admin-user-main {
        flex-direction: column;
    }
}


/* Админка категорий */

.admin-categories-page {
    max-width: 1260px;
    margin-inline: auto;
}

.admin-category-list {
    display: grid;
    gap: 22px;
}

.admin-category-card {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(250px, 0.7fr) minmax(190px, auto);
    gap: 22px;
    align-items: center;
    padding: 22px 23px;
    background: rgba(255, 255, 255, 0.98);
    border: var(--notebook-border);
    border-radius: 11px;
    box-shadow: 4px 5px 0 rgba(38, 36, 33, 0.13);
}

    .admin-category-card::before {
        position: absolute;
        top: -9px;
        left: 48px;
        width: 74px;
        height: 18px;
        content: "";
        background: rgba(169, 154, 244, 0.48);
        transform: rotate(-2deg);
    }

    .admin-category-card.category-hidden {
        opacity: 0.78;
        background: repeating-linear-gradient( transparent, transparent 29px, rgba(38, 36, 33, 0.045) 30px ), rgba(255, 255, 255, 0.98);
    }

        .admin-category-card.category-hidden::before {
            background: rgba(38, 36, 33, 0.18);
        }

.admin-category-title-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 9px;
    margin-bottom: 7px;
}

    .admin-category-title-row h2 {
        margin: 0;
        font-size: 1.35rem;
        line-height: 1.25;
    }

.admin-category-slug {
    display: inline-block;
    margin-bottom: 12px;
    padding: 5px 8px;
    color: var(--notebook-purple-dark);
    background: var(--notebook-purple-soft);
    border: 1px dashed rgba(38, 36, 33, 0.45);
    border-radius: 7px;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 0.78rem;
    overflow-wrap: anywhere;
}

.admin-category-description {
    max-width: 760px;
    margin-bottom: 13px;
    color: var(--notebook-muted);
    line-height: 1.6;
}

.admin-category-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 16px;
    color: var(--notebook-muted);
    font-family: var(--notebook-hand);
    font-size: 0.8rem;
    font-weight: 700;
}

.admin-category-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.admin-category-actions {
    display: grid;
    gap: 9px;
}

    .admin-category-actions form {
        margin: 0;
    }

    .admin-category-actions .btn {
        width: 100%;
    }

/* Форма категории */

.admin-category-form-page {
    max-width: 880px;
    margin-inline: auto;
}

.admin-category-form-sheet {
    max-width: 880px;
}

.admin-category-current-slug {
    margin-bottom: 22px;
    padding: 13px 14px;
    color: var(--notebook-muted);
    background: rgba(238, 234, 255, 0.67);
    border: 1.5px dashed rgba(38, 36, 33, 0.5);
    border-radius: 9px;
    font-size: 0.86rem;
    line-height: 1.55;
}

    .admin-category-current-slug strong {
        color: var(--notebook-ink);
        font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    }

    .admin-category-current-slug span {
        display: block;
        margin-top: 5px;
    }

.admin-category-active-row {
    margin-top: 18px;
    padding: 13px 14px;
    background: rgba(255, 241, 185, 0.53);
    border: 1px dashed rgba(38, 36, 33, 0.5);
    border-radius: 8px;
}

@media (max-width: 991.98px) {
    .admin-category-card {
        grid-template-columns: 1fr;
        align-items: stretch;
    }

    .admin-category-stats {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 575.98px) {
    .admin-category-card {
        padding: 21px 16px;
    }

    .admin-category-stats {
        grid-template-columns: 1fr;
    }
}


/* Смена категории при модерации */

.moderation-category-editor {
    background: rgba(220, 238, 244, 0.78);
}

    .moderation-category-editor::before {
        background: rgba(255, 255, 255, 0.68);
        transform: rotate(-3deg);
    }

.moderation-category-warning {
    margin-bottom: 13px;
    padding: 10px 12px;
    color: var(--notebook-muted);
    background: rgba(255, 235, 235, 0.72);
    border: 1.5px dashed rgba(38, 36, 33, 0.52);
    border-radius: 8px;
    font-family: var(--notebook-hand);
    font-size: 0.84rem;
    font-weight: 700;
    line-height: 1.5;
}


/* Редакционная правка при модерации */

.moderation-editorial-editor {
    background: rgba(255, 241, 185, 0.72);
}

    .moderation-editorial-editor::before {
        background: rgba(255, 255, 255, 0.68);
        transform: rotate(3deg);
    }

.moderation-editorial-description {
    margin-bottom: 14px;
    color: var(--notebook-muted);
    font-size: 0.86rem;
    line-height: 1.55;
}

.moderation-editorial-note {
    margin-top: 12px;
    padding-top: 10px;
    color: var(--notebook-muted);
    border-top: 1px dashed rgba(38, 36, 33, 0.42);
    font-family: var(--notebook-hand);
    font-size: 0.78rem;
    font-weight: 700;
}


/* Панель модерации */

.moderation-dashboard-page {
    max-width: 1260px;
    margin-inline: auto;
}

.moderation-dashboard-total {
    display: grid;
    place-items: center;
    min-width: 190px;
    padding: 22px 24px;
    background: rgba(255, 255, 255, 0.94);
    border: var(--notebook-border);
    border-radius: 14px;
    box-shadow: 4px 5px 0 rgba(38, 36, 33, 0.15);
    text-align: center;
}

    .moderation-dashboard-total span {
        color: var(--notebook-muted);
        font-family: var(--notebook-hand);
        font-size: 0.83rem;
        font-weight: 800;
    }

    .moderation-dashboard-total strong {
        color: var(--notebook-ink);
        font-family: var(--notebook-hand);
        font-size: 2.5rem;
        font-weight: 800;
        line-height: 1;
    }

.moderation-dashboard-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    margin-bottom: 28px;
}

.moderation-dashboard-stat-card {
    position: relative;
    display: block;
    min-height: 150px;
    padding: 22px;
    color: var(--notebook-ink);
    text-decoration: none;
    background: rgba(220, 238, 244, 0.8);
    border: var(--notebook-border);
    border-radius: 13px;
    box-shadow: 4px 5px 0 rgba(38, 36, 33, 0.14);
    transition: transform 0.16s ease, box-shadow 0.16s ease;
}

    .moderation-dashboard-stat-card:hover {
        color: var(--notebook-ink);
        transform: translateY(-2px);
        box-shadow: 6px 7px 0 rgba(38, 36, 33, 0.16);
    }

    .moderation-dashboard-stat-card::before {
        position: absolute;
        top: -8px;
        left: 36px;
        width: 68px;
        height: 17px;
        content: "";
        background: rgba(255, 255, 255, 0.72);
        transform: rotate(-3deg);
    }

    .moderation-dashboard-stat-card span {
        display: block;
        color: var(--notebook-muted);
        font-family: var(--notebook-hand);
        font-size: 0.9rem;
        font-weight: 800;
    }

    .moderation-dashboard-stat-card strong {
        display: block;
        margin: 10px 0 5px;
        font-family: var(--notebook-hand);
        font-size: 2.6rem;
        font-weight: 800;
        line-height: 1;
    }

    .moderation-dashboard-stat-card small {
        color: var(--notebook-muted);
        font-size: 0.86rem;
    }

.dashboard-stat-danger {
    background: rgba(255, 235, 235, 0.8);
}

.dashboard-stat-muted {
    background: rgba(238, 234, 255, 0.78);
}

.moderation-dashboard-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px;
}

.moderation-dashboard-panel {
    padding: 22px;
    background: repeating-linear-gradient( transparent, transparent 29px, rgba(38, 36, 33, 0.045) 30px ), rgba(255, 255, 255, 0.98);
    border: var(--notebook-border);
    border-radius: 13px;
    box-shadow: 4px 5px 0 rgba(38, 36, 33, 0.13);
}

.dashboard-panel-wide {
    grid-column: 1 / -1;
}

.moderation-dashboard-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 18px;
}

    .moderation-dashboard-panel-header h2 {
        margin: 0;
        font-size: 1.35rem;
    }

    .moderation-dashboard-panel-header a {
        color: var(--notebook-purple-dark);
        font-family: var(--notebook-hand);
        font-size: 0.84rem;
        font-weight: 800;
        text-decoration: none;
    }

        .moderation-dashboard-panel-header a:hover {
            text-decoration: underline;
        }

.moderation-dashboard-list {
    display: grid;
    gap: 15px;
}

.moderation-dashboard-item {
    display: grid;
    gap: 10px;
    padding: 16px;
    background: rgba(255, 255, 255, 0.9);
    border: 1.5px dashed rgba(38, 36, 33, 0.52);
    border-radius: 10px;
}

.moderation-dashboard-item-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.moderation-dashboard-item h3 {
    margin: 0;
    font-size: 1.08rem;
    line-height: 1.3;
}

.moderation-dashboard-item p {
    margin: 0;
    color: var(--notebook-muted);
    line-height: 1.55;
}

.moderation-dashboard-item-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 7px 14px;
    color: var(--notebook-muted);
    font-family: var(--notebook-hand);
    font-size: 0.78rem;
    font-weight: 700;
}

.moderation-dashboard-item .btn {
    justify-self: start;
}

.moderation-dashboard-empty {
    padding: 18px;
    color: var(--notebook-muted);
    background: rgba(255, 255, 255, 0.72);
    border: 1.5px dashed rgba(38, 36, 33, 0.45);
    border-radius: 9px;
    font-family: var(--notebook-hand);
    font-weight: 700;
}

.dashboard-archive-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

@media (max-width: 1199.98px) {
    .dashboard-archive-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 991.98px) {
    .moderation-dashboard-stats,
    .moderation-dashboard-grid {
        grid-template-columns: 1fr;
    }

    .dashboard-panel-wide {
        grid-column: auto;
    }

    .dashboard-archive-list {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 575.98px) {
    .moderation-dashboard-total {
        width: 100%;
    }

    .moderation-dashboard-panel-header {
        align-items: flex-start;
        flex-direction: column;
    }
}


/* Уведомления пользователя */

.notifications-page {
    max-width: 1040px;
    margin-inline: auto;
}

.notifications-toolbar {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 18px;
}

.notifications-list {
    display: grid;
    gap: 18px;
}

.notification-card {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 18px;
    align-items: center;
    padding: 20px 22px;
    background: repeating-linear-gradient( transparent, transparent 29px, rgba(38, 36, 33, 0.045) 30px ), rgba(255, 255, 255, 0.98);
    border: var(--notebook-border);
    border-radius: 12px;
    box-shadow: 4px 5px 0 rgba(38, 36, 33, 0.13);
}

    .notification-card::before {
        position: absolute;
        top: -8px;
        left: 44px;
        width: 72px;
        height: 17px;
        content: "";
        background: rgba(255, 241, 185, 0.78);
        transform: rotate(-2deg);
    }

.notification-unread {
    background: repeating-linear-gradient( transparent, transparent 29px, rgba(38, 36, 33, 0.045) 30px ), rgba(220, 238, 244, 0.92);
}

.notification-read {
    opacity: 0.78;
}

.notification-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-bottom: 8px;
}

.notification-card h2 {
    margin: 0 0 7px;
    font-size: 1.25rem;
    line-height: 1.3;
}

.notification-card p {
    margin: 0;
    color: var(--notebook-muted);
    line-height: 1.6;
}

.notification-date {
    margin-top: 10px;
    color: var(--notebook-muted);
    font-family: var(--notebook-hand);
    font-size: 0.8rem;
    font-weight: 700;
}

.notification-actions form {
    margin: 0;
}

@media (max-width: 767.98px) {
    .notification-card {
        grid-template-columns: 1fr;
        align-items: stretch;
    }

    .notification-actions .btn {
        width: 100%;
    }
}


/* Счётчик уведомлений */

.notification-nav-link {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

.notification-nav-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 22px;
    padding: 0 7px;
    color: var(--notebook-ink);
    background: rgba(255, 120, 120, 0.82);
    border: 1.5px solid var(--notebook-ink);
    border-radius: 999px;
    box-shadow: 2px 2px 0 var(--notebook-ink);
    font-family: var(--notebook-hand);
    font-size: 0.74rem;
    font-weight: 900;
    line-height: 1;
    transform: rotate(-3deg);
}

.account-nav-text-with-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

    .account-nav-text-with-badge .notification-nav-badge {
        min-width: 21px;
        height: 21px;
        font-size: 0.72rem;
    }

.notification-read-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 112px;
    padding: 7px 11px;
    color: var(--notebook-muted);
    background: rgba(38, 36, 33, 0.06);
    border: 1.5px dashed rgba(38, 36, 33, 0.45);
    border-radius: 8px;
    font-family: var(--notebook-hand);
    font-size: 0.82rem;
    font-weight: 800;
}

@media (max-width: 991.98px) {
    .notification-nav-link {
        justify-content: flex-start;
    }
}


/* Управление уведомлениями */

.notifications-toolbar {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
    margin-bottom: 18px;
}

    .notifications-toolbar form {
        margin: 0;
    }

.notification-actions {
    display: grid;
    gap: 8px;
    min-width: 128px;
}

    .notification-actions form {
        margin: 0;
    }

    .notification-actions .btn {
        width: 100%;
    }


/* Админка тегов */

.admin-tags-page {
    max-width: 1260px;
    margin-inline: auto;
}

.admin-tag-list {
    display: grid;
    gap: 20px;
}

.admin-tag-card {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(210px, 0.55fr) minmax(190px, auto);
    gap: 22px;
    align-items: center;
    padding: 22px 23px;
    background: rgba(255, 255, 255, 0.98);
    border: var(--notebook-border);
    border-radius: 11px;
    box-shadow: 4px 5px 0 rgba(38, 36, 33, 0.13);
}

    .admin-tag-card::before {
        position: absolute;
        top: -9px;
        left: 48px;
        width: 74px;
        height: 18px;
        content: "";
        background: rgba(220, 238, 244, 0.82);
        transform: rotate(-2deg);
    }

    .admin-tag-card.tag-hidden {
        opacity: 0.78;
        background: repeating-linear-gradient( transparent, transparent 29px, rgba(38, 36, 33, 0.045) 30px ), rgba(255, 255, 255, 0.98);
    }

        .admin-tag-card.tag-hidden::before {
            background: rgba(38, 36, 33, 0.18);
        }

.admin-tag-title-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 9px;
    margin-bottom: 7px;
}

    .admin-tag-title-row h2 {
        margin: 0;
        font-size: 1.35rem;
        line-height: 1.25;
    }

@media (max-width: 991.98px) {
    .admin-tag-card {
        grid-template-columns: 1fr;
        align-items: stretch;
    }
}


/* Выбор тегов в форме промпта */

.prompt-tag-picker-section {
    padding: 16px;
    background: rgba(220, 238, 244, 0.54);
    border: 1.5px dashed rgba(38, 36, 33, 0.45);
    border-radius: 10px;
}

.prompt-tag-picker {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-bottom: 8px;
}

.prompt-tag-option {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin: 0;
    padding: 8px 11px;
    cursor: pointer;
    user-select: none;
    color: var(--notebook-ink);
    background: rgba(255, 255, 255, 0.95);
    border: 1.5px solid rgba(38, 36, 33, 0.55);
    border-radius: 999px;
    font-family: var(--notebook-hand);
    font-size: 0.86rem;
    font-weight: 800;
    transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

    .prompt-tag-option:hover {
        transform: translateY(-1px);
        box-shadow: 2px 3px 0 rgba(38, 36, 33, 0.16);
    }

    .prompt-tag-option input {
        width: 16px;
        height: 16px;
        margin: 0;
        accent-color: var(--notebook-purple-dark);
    }

    .prompt-tag-option:has(input:checked) {
        background: var(--notebook-purple-soft);
        border-color: var(--notebook-ink);
        box-shadow: 2px 3px 0 rgba(38, 36, 33, 0.18);
    }

.prompt-form-grid .prompt-tag-picker-section {
    grid-column: 1 / -1;
}

.prompt-tag-empty {
    padding: 12px 13px;
    color: var(--notebook-muted);
    background: rgba(255, 255, 255, 0.7);
    border: 1.5px dashed rgba(38, 36, 33, 0.42);
    border-radius: 8px;
    font-family: var(--notebook-hand);
    font-size: 0.84rem;
    font-weight: 700;
}


/* Отображение тегов промпта */

.prompt-note-extra-tags,
.author-prompt-extra-tags,
.prompt-detail-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 10px;
}

.prompt-detail-tags {
    margin-top: 16px;
}

.prompt-tag-badge {
    display: inline-flex;
    align-items: center;
    padding: 5px 9px;
    color: var(--notebook-purple-dark);
    background: rgba(238, 234, 255, 0.74);
    border: 1.4px dashed rgba(38, 36, 33, 0.48);
    border-radius: 999px;
    font-family: var(--notebook-hand);
    font-size: 0.78rem;
    font-weight: 800;
    line-height: 1.15;
}

.prompt-detail-tag {
    padding: 6px 10px;
    font-size: 0.84rem;
}


/* Теги в модерации */

.moderation-prompt-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 10px;
}

.moderation-review-prompt-tags {
    margin-top: 12px;
}

.moderation-queue-card .moderation-prompt-tags,
.moderation-dashboard-item .moderation-prompt-tags {
    margin-bottom: 4px;
}


/* Компактный каталог */

.catalog-compact-heading {
    align-items: flex-end;
    margin-bottom: 28px;
}

.catalog-heading-main {
    min-width: 0;
}

.catalog-heading-side {
    display: grid;
    gap: 12px;
    justify-items: end;
    width: min(100%, 590px);
    min-width: 500px;
}

    .catalog-heading-side .catalog-result-count {
        justify-self: end;
    }

/* Поиск и кнопка фильтров */

.catalog-toolbar {
    width: 100%;
}

.catalog-toolbar-row {
    display: grid;
    grid-template-columns: minmax(240px, 1fr) auto auto;
    align-items: stretch;
    gap: 9px;
}

.catalog-search-input,
.catalog-search-submit,
.catalog-filter-trigger {
    min-height: 46px;
}

.catalog-search-submit {
    min-width: 96px;
}

/* Выпадающие фильтры */

.catalog-filter-menu {
    position: relative;
}

.catalog-filter-trigger {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-width: 116px;
    cursor: pointer;
    list-style: none;
    user-select: none;
}

    .catalog-filter-trigger::-webkit-details-marker {
        display: none;
    }

    .catalog-filter-trigger::after {
        display: inline-block;
        content: "▾";
        font-size: 0.8rem;
        transition: transform 160ms ease;
    }

.catalog-filter-menu[open] .catalog-filter-trigger::after {
    transform: rotate(180deg);
}

.catalog-filter-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 21px;
    height: 21px;
    padding: 0 6px;
    color: var(--notebook-ink);
    background: var(--notebook-yellow);
    border: 1px solid var(--notebook-ink);
    border-radius: 999px;
    font-family: var(--notebook-hand);
    font-size: 0.74rem;
    font-weight: 800;
}

.catalog-filter-popover {
    position: absolute;
    z-index: 30;
    top: calc(100% + 10px);
    right: 0;
    display: grid;
    gap: 14px;
    width: 330px;
    padding: 18px;
    background: rgba(255, 255, 255, 0.98);
    border: var(--notebook-border);
    border-radius: 11px;
    box-shadow: 5px 6px 0 rgba(38, 36, 33, 0.16);
}

    .catalog-filter-popover::before {
        position: absolute;
        top: -8px;
        right: 36px;
        width: 70px;
        height: 17px;
        content: "";
        background: rgba(255, 241, 185, 0.78);
        transform: rotate(2deg);
    }

.catalog-filter-popover-heading {
    position: relative;
    z-index: 1;
    font-family: var(--notebook-hand);
    font-size: 1rem;
    font-weight: 800;
}

.catalog-filter-field {
    display: grid;
    gap: 6px;
}

.catalog-filter-label {
    margin: 0;
    color: var(--notebook-ink);
    font-family: var(--notebook-hand);
    font-size: 0.82rem;
    font-weight: 800;
}

.catalog-filter-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding-top: 2px;
}

    .catalog-filter-actions .btn {
        min-width: 112px;
    }

/* Планшет */

@media (max-width: 991.98px) {
    .catalog-compact-heading {
        align-items: stretch;
        flex-direction: column;
    }

    .catalog-heading-side {
        justify-items: stretch;
        width: 100%;
        min-width: 0;
    }

        .catalog-heading-side .catalog-result-count {
            justify-self: start;
        }
}

/* Телефон */

@media (max-width: 575.98px) {
    .catalog-toolbar-row {
        grid-template-columns: 1fr;
    }

    .catalog-search-submit,
    .catalog-filter-menu,
    .catalog-filter-trigger {
        width: 100%;
    }

    .catalog-filter-popover {
        position: static;
        width: 100%;
        margin-top: 9px;
    }

    .catalog-filter-actions {
        align-items: stretch;
        flex-direction: column;
    }

        .catalog-filter-actions .btn,
        .catalog-filter-actions .notebook-reset-link {
            width: 100%;
            text-align: center;
        }
}


/* Выпадающая админка в верхнем меню */

.admin-nav-item {
    position: relative;
}

.admin-nav-toggle {
    border: 0;
    background: transparent;
}

.admin-nav-menu {
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    z-index: 1000;
    display: none;
    min-width: 190px;
    padding: 10px;
    background: rgba(255, 255, 255, 0.98);
    border: var(--notebook-border);
    border-radius: 10px;
    box-shadow: 4px 5px 0 rgba(38, 36, 33, 0.16);
}

    .admin-nav-menu::before {
        position: absolute;
        top: -8px;
        right: 34px;
        width: 58px;
        height: 15px;
        content: "";
        background: rgba(169, 154, 244, 0.45);
        transform: rotate(2deg);
    }

.admin-nav-item:hover .admin-nav-menu,
.admin-nav-item:focus-within .admin-nav-menu {
    display: grid;
    gap: 7px;
}

.admin-nav-menu-link {
    display: block;
    padding: 8px 10px;
    color: var(--notebook-ink);
    text-decoration: none;
    border-radius: 7px;
    font-family: var(--notebook-hand);
    font-size: 0.92rem;
    font-weight: 800;
}

    .admin-nav-menu-link:hover {
        color: var(--notebook-purple-dark);
        background: var(--notebook-purple-soft);
    }

@media (max-width: 991.98px) {
    .admin-nav-menu {
        position: static;
        display: grid;
        gap: 7px;
        margin-top: 6px;
        margin-left: 16px;
        box-shadow: none;
    }

        .admin-nav-menu::before {
            display: none;
        }
}

/* Выравнивание карточек каталога */

.prompt-notes-grid {
    align-items: stretch;
}

.prompt-note-card {
    min-height: 365px;
}

.prompt-card-badge-zone {
    min-height: 74px;
    margin-bottom: 10px;
}

    .prompt-card-badge-zone .prompt-note-tags {
        margin-bottom: 8px;
    }

    .prompt-card-badge-zone .prompt-note-extra-tags {
        margin-top: 0;
        margin-bottom: 0;
    }

.prompt-note-extra-tags-empty {
    min-height: 27px;
}

.prompt-note-title {
    min-height: 3.35rem;
    margin-bottom: 10px;
}

    .prompt-note-title a {
        display: -webkit-box;
        overflow: hidden;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }

.prompt-note-summary {
    display: -webkit-box;
    overflow: hidden;
    flex-grow: 0;
    min-height: 3.45rem;
    margin-bottom: 16px;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.prompt-note-author {
    margin-top: auto;
    margin-bottom: 11px;
}

.prompt-note-rating {
    min-height: 23px;
    margin-bottom: 12px;
}

.prompt-note-footer {
    align-items: flex-end;
    margin-top: 0;
    padding-top: 14px;
    border-top: 1px dashed rgba(38, 36, 33, 0.42);
}

.prompt-note-stats {
    min-width: 112px;
}

.prompt-note-actions {
    align-items: center;
}

    .prompt-note-actions .favorite-toggle-button {
        min-width: 122px;
    }

.prompt-note-open {
    white-space: nowrap;
}

@media (max-width: 575.98px) {
    .prompt-card-badge-zone {
        min-height: 0;
    }

    .prompt-note-extra-tags-empty {
        display: none;
    }

    .prompt-note-title,
    .prompt-note-summary {
        min-height: 0;
    }

        .prompt-note-title a,
        .prompt-note-summary {
            -webkit-line-clamp: unset;
        }

    .prompt-note-stats {
        min-width: 0;
    }
}


/* Карточки каталога */

.catalog-icon-sprite {
    position: absolute;
    width: 0;
    height: 0;
    overflow: hidden;
}

.catalog-prompt-card {
    min-height: 0;
    height: 100%;
    padding: 16px 16px 15px;
    border-radius: 13px;
}

    .catalog-prompt-card .prompt-card-cover {
        margin: 0 0 14px;
        aspect-ratio: 16 / 9;
        border-radius: 10px;
        box-shadow: 1px 2px 0 rgba(36, 36, 36, 0.08);
    }

    .catalog-prompt-card .favorite-toggle-form {
        position: absolute;
        z-index: 6;
        top: 28px;
        right: 28px;
        margin: 0;
    }

    .catalog-prompt-card .favorite-toggle-button {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 40px;
        height: 40px;
        min-width: 0;
        padding: 0;
        color: var(--notebook-purple-dark);
        background: rgba(255, 255, 255, 0.94);
        border: 1px solid rgba(36, 36, 36, 0.68);
        border-radius: 50%;
        box-shadow: 2px 2px 0 rgba(36, 36, 36, 0.14);
        font-family: Arial, sans-serif;
        font-size: 0;
        transition: transform 120ms ease, background-color 120ms ease, box-shadow 120ms ease;
    }

        .catalog-prompt-card .favorite-toggle-button::before {
            content: "♡";
            font-size: 26px;
            font-weight: 400;
            line-height: 1;
            transform: translateY(-1px);
        }

        .catalog-prompt-card .favorite-toggle-button.is-favorite {
            color: var(--notebook-purple-dark);
            background: #f1edff;
        }

            .catalog-prompt-card .favorite-toggle-button.is-favorite::before {
                content: "♥";
            }

        .catalog-prompt-card .favorite-toggle-button:hover {
            color: var(--notebook-purple-dark);
            background: #f1edff;
            transform: translateY(-2px);
            box-shadow: 2px 3px 0 rgba(36, 36, 36, 0.16);
        }

    .catalog-prompt-card .prompt-card-badge-zone {
        min-height: 0;
        margin-bottom: 10px;
    }

    .catalog-prompt-card .prompt-note-tags {
        gap: 6px;
        margin-bottom: 7px;
    }

    .catalog-prompt-card .prompt-note-extra-tags {
        gap: 6px;
        margin-top: 0;
        margin-bottom: 0;
    }

    .catalog-prompt-card .notebook-tag,
    .catalog-prompt-card .prompt-tag-badge {
        padding: 4px 7px;
        font-size: 0.74rem;
    }

.catalog-tag-more {
    color: var(--notebook-muted);
    background: rgba(36, 36, 36, 0.045);
}

.catalog-prompt-card .prompt-note-title {
    min-height: 0;
    margin-bottom: 7px;
    font-size: 1.26rem;
    line-height: 1.28;
}

    .catalog-prompt-card .prompt-note-title a {
        display: -webkit-box;
        overflow: hidden;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }

.catalog-prompt-card .prompt-note-summary {
    display: -webkit-box;
    overflow: hidden;
    flex-grow: 0;
    min-height: 0;
    margin-bottom: 13px;
    color: #626262;
    font-size: 0.9rem;
    line-height: 1.5;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.catalog-card-info {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px 14px;
    margin-top: auto;
    margin-bottom: 11px;
    padding-top: 10px;
    color: var(--notebook-muted);
    border-top: 1px dashed rgba(36, 36, 36, 0.22);
    font-size: 0.78rem;
}

.catalog-card-rating {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px;
    min-width: 0;
}

.catalog-card-rating-star {
    color: #c58a16;
    font-size: 0.94rem;
    line-height: 1;
}

.catalog-card-rating-count {
    color: #858585;
}

.catalog-prompt-card .prompt-note-user-rating {
    padding: 2px 6px;
    font-size: 0.72rem;
}

.catalog-card-metrics {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    margin-left: auto;
}

.catalog-card-metric {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #626262;
    white-space: nowrap;
}

.catalog-card-metric-icon {
    width: 15px;
    height: 15px;
    overflow: visible;
    color: #5e5e5e;
}

.catalog-card-footer {
    justify-content: flex-end;
    align-items: center;
    margin-top: 0;
    padding-top: 10px;
    border-top: 1px dashed rgba(36, 36, 36, 0.22);
}

    .catalog-card-footer .prompt-note-actions {
        width: 100%;
        margin-left: 0;
        justify-content: flex-end;
        gap: 9px;
    }


    .catalog-card-footer .prompt-note-open {
        font-size: 0.82rem;
        white-space: nowrap;
    }

@media (max-width: 575.98px) {
    .catalog-prompt-card {
        padding: 15px;
    }

        .catalog-prompt-card .favorite-toggle-form {
            top: 25px;
            right: 25px;
        }

        .catalog-prompt-card .prompt-note-title a,
        .catalog-prompt-card .prompt-note-summary {
            -webkit-line-clamp: unset;
        }

    .catalog-card-info {
        align-items: flex-start;
        flex-direction: column;
    }

    .catalog-card-metrics {
        margin-left: 0;
    }

    .catalog-card-footer .prompt-note-actions {
        justify-content: space-between;
    }
}

/* Выравнивание карточек в разделе "Мои промпты" */


.author-prompt-card {
    min-height: 360px;
}

.author-prompt-badge-zone {
    min-height: 82px;
    margin-bottom: 10px;
}

    .author-prompt-badge-zone .author-prompt-tags {
        margin-bottom: 8px;
    }

    .author-prompt-badge-zone .author-prompt-extra-tags {
        margin-top: 0;
        margin-bottom: 0;
    }

.author-prompt-title {
    min-height: 3.25rem;
    margin-bottom: 10px;
}

    .author-prompt-title a,
    .author-prompt-title {
        display: -webkit-box;
        overflow: hidden;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }

.author-prompt-summary {
    display: -webkit-box;
    overflow: hidden;
    min-height: 3.45rem;
    margin-bottom: 15px;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.author-prompt-meta {
    margin-top: auto;
}

.author-prompt-actions {
    margin-top: 14px;
    padding-top: 13px;
    border-top: 1px dashed rgba(38, 36, 33, 0.42);
}

@media (max-width: 575.98px) {
    .author-prompt-card {
        min-height: 0;
    }

    .author-prompt-badge-zone {
        min-height: 0;
    }

    .author-prompt-title,
    .author-prompt-summary {
        min-height: 0;
        -webkit-line-clamp: unset;
    }
}


/* Теги на странице промпта */

.prompt-detail-tags-block {
    margin-top: 18px;
    padding: 14px 15px;
    background: rgba(238, 234, 255, 0.46);
    border: 1.5px dashed rgba(38, 36, 33, 0.42);
    border-radius: 10px;
}

.prompt-detail-tags-label {
    margin-bottom: 9px;
    color: var(--notebook-muted);
    font-family: var(--notebook-hand);
    font-size: 0.82rem;
    font-weight: 800;
}

.prompt-detail-tags-block .prompt-detail-tags {
    margin-top: 0;
}


/* Комментарии на странице промпта */

.prompt-comments-section {
    scroll-margin-top: 90px;
}

.prompt-comments-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 34px;
    height: 30px;
    padding: 0 10px;
    color: var(--notebook-purple-dark);
    background: var(--notebook-purple-soft);
    border: var(--notebook-border);
    border-radius: 999px;
    font-family: var(--notebook-hand);
    font-size: 0.92rem;
    font-weight: 900;
}

.prompt-comments-empty {
    padding: 18px;
    color: var(--notebook-muted);
    background: rgba(255, 255, 255, 0.72);
    border: 1.5px dashed rgba(38, 36, 33, 0.38);
    border-radius: 10px;
    font-family: var(--notebook-hand);
    font-weight: 700;
}

.prompt-comments-list {
    display: grid;
    gap: 14px;
}

.prompt-comment-card {
    padding: 15px 16px;
    background: rgba(255, 255, 255, 0.84);
    border: 1.5px solid rgba(38, 36, 33, 0.32);
    border-radius: 11px;
    box-shadow: 3px 4px 0 rgba(38, 36, 33, 0.08);
}

.prompt-comment-header {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 8px 14px;
    margin-bottom: 10px;
}

.prompt-comment-author {
    color: var(--notebook-ink);
    text-decoration: none;
    font-family: var(--notebook-hand);
    font-size: 1rem;
    font-weight: 900;
}

    .prompt-comment-author:hover {
        color: var(--notebook-purple-dark);
        text-decoration: underline;
    }

.prompt-comment-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    color: var(--notebook-muted);
    font-size: 0.82rem;
    font-weight: 700;
}

.prompt-comment-body {
    white-space: pre-line;
    color: var(--notebook-ink);
    line-height: 1.58;
}


/* Форма комментария */

.prompt-comment-form {
    display: grid;
    gap: 10px;
    margin-bottom: 18px;
    padding: 15px 16px;
    background: rgba(255, 255, 255, 0.78);
    border: 1.5px dashed rgba(38, 36, 33, 0.42);
    border-radius: 11px;
}

.prompt-comment-form-label {
    color: var(--notebook-ink);
    font-family: var(--notebook-hand);
    font-size: 0.95rem;
    font-weight: 900;
}

.prompt-comment-textarea {
    min-height: 112px;
    resize: vertical;
}

.prompt-comment-form-footer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    color: var(--notebook-muted);
    font-size: 0.84rem;
    font-weight: 700;
}

.prompt-comment-login-note {
    margin-bottom: 18px;
    padding: 14px 16px;
    color: var(--notebook-muted);
    background: rgba(255, 255, 255, 0.72);
    border: 1.5px dashed rgba(38, 36, 33, 0.35);
    border-radius: 10px;
    font-family: var(--notebook-hand);
    font-weight: 800;
}

@media (max-width: 575.98px) {
    .prompt-comment-form-footer {
        align-items: stretch;
        flex-direction: column;
    }

        .prompt-comment-form-footer .btn {
            width: 100%;
        }
}

/* Действия с комментариями */

.prompt-comment-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: 13px;
    padding-top: 12px;
    border-top: 1px dashed rgba(38, 36, 33, 0.26);
}

.prompt-comment-action-form {
    margin: 0;
}

.prompt-comment-delete-button,
.prompt-comment-hide-button,
.prompt-comment-moderation-details > summary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 6px 12px;
    color: var(--notebook-ink);
    background: rgba(255, 255, 255, 0.84);
    border: 1.5px solid rgba(38, 36, 33, 0.55);
    border-radius: 8px;
    box-shadow: 2px 2px 0 rgba(38, 36, 33, 0.12);
    font-family: var(--notebook-hand);
    font-size: 0.86rem;
    font-weight: 900;
    line-height: 1.1;
    text-decoration: none;
    cursor: pointer;
}

    .prompt-comment-delete-button:hover {
        color: #8f1f1f;
        background: rgba(255, 231, 231, 0.86);
    }

    .prompt-comment-hide-button:hover,
    .prompt-comment-moderation-details > summary:hover {
        color: #5f4300;
        background: rgba(255, 248, 214, 0.92);
    }

.prompt-comment-moderation-details {
    position: relative;
    margin-left: auto;
}

    .prompt-comment-moderation-details > summary {
        list-style: none;
    }

        .prompt-comment-moderation-details > summary::-webkit-details-marker {
            display: none;
        }

    .prompt-comment-moderation-details[open] {
        flex: 1 1 100%;
        margin-left: 0;
        padding: 10px;
        background: rgba(255, 248, 214, 0.52);
        border: 1.5px dashed rgba(95, 67, 0, 0.28);
        border-radius: 10px;
    }

        .prompt-comment-moderation-details[open] > summary {
            width: fit-content;
            margin-bottom: 9px;
        }

.prompt-comment-hide-form {
    display: block;
    margin: 0;
}

.prompt-comment-hide-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
}

    .prompt-comment-hide-row .form-control {
        min-height: 36px;
    }

.prompt-comment-hide-button {
    white-space: nowrap;
}

@media (max-width: 575.98px) {
    .prompt-comment-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .prompt-comment-moderation-details {
        margin-left: 0;
    }

        .prompt-comment-moderation-details > summary,
        .prompt-comment-delete-button {
            width: 100%;
        }

    .prompt-comment-hide-row {
        grid-template-columns: 1fr;
    }

    .prompt-comment-hide-button {
        width: 100%;
    }
}


/* Жалобы на комментарии */

.prompt-comment-report-details {
    position: relative;
}

    .prompt-comment-report-details > summary,
    .prompt-comment-report-button {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-height: 34px;
        padding: 6px 12px;
        color: var(--notebook-ink);
        background: rgba(255, 255, 255, 0.84);
        border: 1.5px solid rgba(38, 36, 33, 0.55);
        border-radius: 8px;
        box-shadow: 2px 2px 0 rgba(38, 36, 33, 0.12);
        font-family: var(--notebook-hand);
        font-size: 0.86rem;
        font-weight: 900;
        line-height: 1.1;
        cursor: pointer;
    }

    .prompt-comment-report-details > summary {
        list-style: none;
    }

        .prompt-comment-report-details > summary::-webkit-details-marker {
            display: none;
        }

        .prompt-comment-report-details > summary:hover,
        .prompt-comment-report-button:hover {
            color: #7a1f1f;
            background: rgba(255, 231, 231, 0.82);
        }

    .prompt-comment-report-details[open] {
        flex: 1 1 100%;
        padding: 10px;
        background: rgba(255, 231, 231, 0.42);
        border: 1.5px dashed rgba(122, 31, 31, 0.28);
        border-radius: 10px;
    }

        .prompt-comment-report-details[open] > summary {
            width: fit-content;
            margin-bottom: 9px;
        }

.prompt-comment-report-form {
    margin: 0;
}

.prompt-comment-report-grid {
    display: grid;
    grid-template-columns: minmax(180px, 240px) minmax(0, 1fr) auto;
    gap: 8px;
    align-items: start;
}

    .prompt-comment-report-grid .form-select,
    .prompt-comment-report-grid .form-control {
        min-height: 36px;
    }

.prompt-comment-report-button {
    white-space: nowrap;
}

.prompt-comment-report-status {
    padding: 7px 10px;
    color: var(--notebook-muted);
    background: rgba(238, 234, 255, 0.5);
    border: 1.5px dashed rgba(38, 36, 33, 0.28);
    border-radius: 9px;
    font-family: var(--notebook-hand);
    font-size: 0.84rem;
    font-weight: 900;
}

@media (max-width: 767.98px) {
    .prompt-comment-report-grid {
        grid-template-columns: 1fr;
    }

    .prompt-comment-report-details > summary,
    .prompt-comment-report-button {
        width: 100%;
    }
}


/* Модерация жалоб на комментарии */

.moderation-comment-reports-page {
    max-width: 1120px;
}

.comment-report-list {
    display: grid;
    gap: 18px;
}

.comment-report-card {
    padding: 20px;
    background: rgba(255, 255, 255, 0.94);
    border: var(--notebook-border);
    border-radius: 14px;
    box-shadow: 4px 5px 0 rgba(38, 36, 33, 0.12);
}

.comment-report-header {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 14px;
}

.comment-report-kicker {
    margin-bottom: 5px;
    color: var(--notebook-purple-dark);
    font-family: var(--notebook-hand);
    font-size: 0.9rem;
    font-weight: 900;
}

.comment-report-header h2 {
    margin: 0;
    font-family: var(--notebook-hand);
    font-size: 1.35rem;
    font-weight: 900;
}

    .comment-report-header h2 a {
        color: var(--notebook-ink);
        text-decoration: none;
    }

        .comment-report-header h2 a:hover {
            color: var(--notebook-purple-dark);
            text-decoration: underline;
        }

.comment-report-date {
    flex: 0 0 auto;
    color: var(--notebook-muted);
    font-size: 0.84rem;
    font-weight: 800;
}

.comment-report-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 18px;
    margin-bottom: 15px;
    color: var(--notebook-muted);
    font-size: 0.9rem;
    font-weight: 800;
}

    .comment-report-meta a {
        color: var(--notebook-ink);
        font-weight: 900;
    }

.comment-report-body-block {
    margin-top: 12px;
    padding: 13px 14px;
    background: rgba(255, 255, 255, 0.78);
    border: 1.5px dashed rgba(38, 36, 33, 0.34);
    border-radius: 10px;
}

.comment-report-label {
    margin-bottom: 7px;
    color: var(--notebook-muted);
    font-family: var(--notebook-hand);
    font-size: 0.82rem;
    font-weight: 900;
}

.comment-report-comment-body,
.comment-report-details {
    white-space: pre-line;
    color: var(--notebook-ink);
    line-height: 1.58;
}

.comment-report-already-hidden {
    margin-top: 12px;
    padding: 10px 12px;
    color: #5f4300;
    background: rgba(255, 248, 214, 0.8);
    border: 1.5px dashed rgba(95, 67, 0, 0.35);
    border-radius: 10px;
    font-weight: 800;
}

    .comment-report-already-hidden span {
        display: block;
        margin-top: 4px;
    }

.comment-report-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px dashed rgba(38, 36, 33, 0.34);
}

.comment-report-resolution-form {
    display: grid;
    gap: 9px;
    margin: 0;
    padding: 13px;
    background: rgba(238, 234, 255, 0.32);
    border: 1.5px solid rgba(38, 36, 33, 0.22);
    border-radius: 11px;
}

    .comment-report-resolution-form label {
        color: var(--notebook-ink);
        font-family: var(--notebook-hand);
        font-size: 0.88rem;
        font-weight: 900;
    }

    .comment-report-resolution-form textarea {
        min-height: 74px;
        resize: vertical;
    }

    .comment-report-resolution-form .btn {
        justify-self: start;
    }

@media (max-width: 767.98px) {
    .comment-report-header {
        flex-direction: column;
    }

    .comment-report-actions {
        grid-template-columns: 1fr;
    }

    .comment-report-resolution-form .btn {
        width: 100%;
    }
}



/* История жалоб на комментарии */

.comment-report-filter-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 20px;
}

.comment-report-filter-tab {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 13px;
    color: var(--notebook-ink);
    background: rgba(255, 255, 255, 0.84);
    border: 1.5px solid rgba(38, 36, 33, 0.34);
    border-radius: 999px;
    text-decoration: none;
    font-family: var(--notebook-hand);
    font-size: 0.92rem;
    font-weight: 900;
}

    .comment-report-filter-tab span {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 26px;
        height: 24px;
        padding: 0 8px;
        color: var(--notebook-purple-dark);
        background: var(--notebook-purple-soft);
        border: 1px solid rgba(38, 36, 33, 0.24);
        border-radius: 999px;
        font-size: 0.78rem;
    }

    .comment-report-filter-tab:hover,
    .comment-report-filter-tab.active {
        color: var(--notebook-purple-dark);
        background: rgba(238, 234, 255, 0.72);
    }

.comment-report-status-pill {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    margin-top: 6px;
    padding: 4px 9px;
    border-radius: 999px;
    font-family: var(--notebook-hand);
    font-size: 0.78rem;
    font-weight: 900;
}

.comment-report-status-open {
    color: #5f4300;
    background: rgba(255, 208, 77, 0.35);
    border: 1px solid rgba(95, 67, 0, 0.24);
}

.comment-report-status-closed {
    color: var(--notebook-purple-dark);
    background: rgba(238, 234, 255, 0.72);
    border: 1px solid rgba(38, 36, 33, 0.22);
}

.comment-report-resolution-block {
    margin-top: 12px;
    padding: 13px 14px;
    background: rgba(238, 234, 255, 0.4);
    border: 1.5px dashed rgba(38, 36, 33, 0.34);
    border-radius: 10px;
}

.comment-report-resolution-text {
    white-space: pre-line;
    color: var(--notebook-ink);
    line-height: 1.55;
}

    .comment-report-resolution-text span {
        color: var(--notebook-muted);
    }

.comment-report-resolution-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 14px;
    margin-top: 8px;
    color: var(--notebook-muted);
    font-size: 0.82rem;
    font-weight: 800;
}

/* Галерея примеров результата */

.prompt-media-gallery-count {
    color: var(--notebook-muted);
    font-size: 0.9rem;
}

.prompt-example-text-block {
    margin-bottom: 28px;
}

.prompt-example-subheading {
    margin-bottom: 12px;
    font-size: 1.1rem;
}

.prompt-media-gallery {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
}

.prompt-media-gallery-item {
    position: relative;
    overflow: hidden;
    margin: 0;
    background: rgba(255, 255, 255, 0.96);
    border: var(--notebook-border);
    border-radius: 12px;
    box-shadow: 3px 4px 0 rgba(38, 36, 33, 0.13);
}

    .prompt-media-gallery-item.is-cover::before {
        position: absolute;
        z-index: 2;
        top: 10px;
        right: 10px;
        width: 52px;
        height: 14px;
        content: "";
        pointer-events: none;
        background: rgba(255, 241, 185, 0.84);
        transform: rotate(2deg);
    }

.prompt-media-gallery-link {
    display: block;
    overflow: hidden;
    color: inherit;
    background: linear-gradient( 135deg, rgba(169, 154, 244, 0.1), rgba(255, 241, 185, 0.16));
}

    .prompt-media-gallery-link:focus-visible {
        outline: 3px solid var(--notebook-purple-dark);
        outline-offset: -3px;
    }

.prompt-media-gallery-image {
    display: block;
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: contain;
    transition: transform 180ms ease, opacity 180ms ease;
}

.prompt-media-gallery-link:hover .prompt-media-gallery-image {
    opacity: 0.96;
    transform: scale(1.015);
}

.prompt-media-gallery-caption {
    padding: 14px 16px 16px;
    border-top: 1px dashed rgba(38, 36, 33, 0.35);
}

    .prompt-media-gallery-caption p {
        margin: 10px 0 0;
        white-space: pre-line;
    }

.prompt-media-gallery-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.prompt-media-gallery-hint {
    margin: 14px 0 0;
    color: var(--notebook-muted);
    font-size: 0.9rem;
}

@media (max-width: 767.98px) {
    .prompt-media-gallery {
        grid-template-columns: minmax(0, 1fr);
    }

    .prompt-media-gallery-image {
        aspect-ratio: 16 / 11;
    }
}


/* Обложки карточек промптов */

.prompt-note-tape {
    z-index: 3;
}

.prompt-card-cover {
    position: relative;
    display: block;
    overflow: hidden;
    width: 100%;
    margin: 1px 0 18px;
    color: var(--notebook-ink);
    aspect-ratio: 16 / 10;
    background: rgba(244, 239, 225, 0.82);
    border: 1.5px solid var(--notebook-ink);
    border-radius: 9px;
    box-shadow: 2px 3px 0 rgba(38, 36, 33, 0.12);
    text-decoration: none;
}

    .prompt-card-cover:focus-visible {
        outline: 3px solid var(--notebook-purple-dark);
        outline-offset: 3px;
    }

.prompt-card-cover-image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: transform 180ms ease, opacity 180ms ease;
}

.prompt-card-cover:hover .prompt-card-cover-image {
    opacity: 0.96;
    transform: scale(1.025);
}

.prompt-card-cover.is-placeholder {
    background: repeating-linear-gradient( 0deg, transparent, transparent 25px, rgba(91, 72, 187, 0.08) 26px), rgba(238, 234, 255, 0.72);
}

.prompt-card-cover-placeholder {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 7px;
    width: 100%;
    height: 100%;
    padding: 18px;
    text-align: center;
}

.prompt-card-cover-placeholder-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 42px;
    background: var(--notebook-purple);
    border: 1.5px solid var(--notebook-ink);
    border-radius: 10px;
    box-shadow: 2px 2px 0 var(--notebook-ink);
    font-family: var(--notebook-hand);
    font-weight: 800;
    transform: rotate(-3deg);
}

.prompt-card-cover-placeholder-category {
    font-family: var(--notebook-hand);
    font-size: 0.92rem;
    font-weight: 800;
}

.prompt-card-cover-placeholder-text {
    max-width: 220px;
    color: var(--notebook-muted);
    font-size: 0.8rem;
    line-height: 1.45;
}


@media (max-width: 575.98px) {
    .prompt-card-cover {
        aspect-ratio: 16 / 9;
    }
}


/* Просмотр медиа промпта */

.prompt-media-lightbox {
    width: min(1180px, calc(100% - 32px));
    max-width: none;
    max-height: calc(100vh - 32px);
    padding: 0;
    overflow: hidden;
    color: var(--notebook-ink);
    background: transparent;
    border: 0;
}

    .prompt-media-lightbox::backdrop {
        background: rgba(20, 18, 16, 0.82);
        backdrop-filter: blur(3px);
    }

.prompt-media-lightbox-panel {
    display: flex;
    flex-direction: column;
    max-height: calc(100vh - 32px);
    overflow: hidden;
    background: #f8f4e9;
    border: 2px solid var(--notebook-ink);
    border-radius: 14px;
    box-shadow: 7px 8px 0 rgba(0, 0, 0, 0.32);
}

.prompt-media-lightbox-header {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    min-height: 68px;
    padding: 12px 18px;
    border-bottom: 1px dashed rgba(38, 36, 33, 0.42);
}

.prompt-media-lightbox-title {
    margin: 0;
    font-size: 1.15rem;
}

.prompt-media-lightbox-position {
    display: block;
    margin-top: 3px;
    color: var(--notebook-muted);
    font-size: 0.86rem;
}

.prompt-media-lightbox-close {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    padding: 0;
    font-size: 0;
    line-height: 1;
    background: #fffdf8;
    border: 1px solid rgba(36, 36, 36, 0.8);
    border-radius: 50%;
    box-shadow: none;
}


.prompt-media-lightbox-content {
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr) 58px;
    align-items: center;
    min-height: 0;
    padding: 18px;
}

.prompt-media-lightbox-figure {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
    margin: 0;
}

.prompt-media-lightbox-image-wrapper {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 280px;
    overflow: hidden;
    background: rgba(28, 26, 23, 0.94);
    border-radius: 10px;
}

.prompt-media-lightbox-image {
    display: block;
    max-width: 100%;
    max-height: calc(100vh - 190px);
    object-fit: contain;
    transition: opacity 160ms ease;
}

    .prompt-media-lightbox-image.is-loading {
        opacity: 0.72;
    }

.prompt-media-lightbox-status {
    position: absolute;
    right: 12px;
    bottom: 12px;
    padding: 6px 9px;
    color: #fff;
    font-size: 0.78rem;
    background: rgba(0, 0, 0, 0.68);
    border-radius: 6px;
}

.prompt-media-lightbox-caption {
    flex-shrink: 0;
    padding: 13px 4px 0;
}

    .prompt-media-lightbox-caption p {
        margin: 0;
        white-space: pre-line;
    }

.prompt-media-lightbox-navigation {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 58px;
    padding: 0;
    font-size: 0;
    line-height: 1;
    background: #fffdf8;
    border: 1px solid rgba(36, 36, 36, 0.75);
    border-radius: 10px;
    box-shadow: none;
}

.prompt-media-lightbox-close::before {
    content: "×";
    display: block;
    font-family: Arial, sans-serif;
    font-size: 28px;
    font-weight: 400;
    line-height: 1;
    transform: translateY(-1px);
}

.prompt-media-lightbox-navigation.is-previous::before {
    content: "‹";
    display: block;
    font-family: Arial, sans-serif;
    font-size: 34px;
    font-weight: 400;
    line-height: 1;
    transform: translateY(-2px);
}

.prompt-media-lightbox-navigation.is-next::before {
    content: "›";
    display: block;
    font-family: Arial, sans-serif;
    font-size: 34px;
    font-weight: 400;
    line-height: 1;
    transform: translateY(-2px);
}

.prompt-media-lightbox-close:hover,
.prompt-media-lightbox-navigation:hover {
    background: #f1edff;
}


.prompt-media-lightbox-navigation.is-previous {
    justify-self: start;
}

.prompt-media-lightbox-navigation.is-next {
    justify-self: end;
}

.prompt-media-lightbox button:focus-visible {
    outline: 2px solid #7665d8;
    outline-offset: 2px;
}

@media (max-width: 767.98px) {
    .prompt-media-lightbox {
        width: calc(100% - 16px);
        max-height: calc(100vh - 16px);
    }

    .prompt-media-lightbox-panel {
        max-height: calc(100vh - 16px);
    }

    .prompt-media-lightbox-header {
        min-height: 60px;
        padding: 9px 12px;
    }

    .prompt-media-lightbox-content {
        position: relative;
        display: block;
        padding: 10px;
    }

    .prompt-media-lightbox-image {
        max-height: calc(100vh - 175px);
    }

    .prompt-media-lightbox-navigation {
        position: absolute;
        z-index: 2;
        top: 50%;
        width: 42px;
        height: 52px;
        background: #fffdf8;
        transform: translateY(-50%);
    }

        .prompt-media-lightbox-navigation.is-previous {
            left: 17px;
        }

        .prompt-media-lightbox-navigation.is-next {
            right: 17px;
        }

    .prompt-media-lightbox-caption {
        padding-right: 4px;
        padding-left: 4px;
    }
}


/* Сортировка медиа промпта */

.prompt-media-order-sheet {
    margin-bottom: 28px;
    padding: 20px;
    background: repeating-linear-gradient( 0deg, transparent, transparent 28px, rgba(91, 72, 187, 0.06) 29px), rgba(255, 255, 255, 0.96);
    border: var(--notebook-border);
    border-radius: 12px;
    box-shadow: 4px 5px 0 rgba(38, 36, 33, 0.12);
}

.prompt-media-order-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 18px;
}

.prompt-media-order-status {
    flex: 0 0 auto;
    padding: 5px 9px;
    color: var(--notebook-muted);
    font-size: 0.85rem;
    background: rgba(255, 255, 255, 0.76);
    border: 1px dashed rgba(38, 36, 33, 0.42);
    border-radius: 7px;
}

.has-unsaved-order .prompt-media-order-status {
    color: var(--notebook-ink);
    background: rgba(255, 241, 185, 0.9);
}

.prompt-media-order-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
    gap: 13px;
}

.prompt-media-order-item {
    position: relative;
    display: grid;
    grid-template-columns: 34px 34px 70px minmax(0, 1fr);
    align-items: center;
    gap: 9px;
    min-width: 0;
    padding: 9px;
    cursor: grab;
    background: rgba(255, 255, 255, 0.98);
    border: 1.5px solid var(--notebook-ink);
    border-radius: 9px;
    box-shadow: 2px 3px 0 rgba(38, 36, 33, 0.13);
    transition: opacity 140ms ease, transform 140ms ease, box-shadow 140ms ease;
}

    .prompt-media-order-item:active {
        cursor: grabbing;
    }

    .prompt-media-order-item.is-dragging {
        opacity: 0.45;
        transform: scale(0.98);
    }

    .prompt-media-order-item.is-drag-target {
        box-shadow: 0 0 0 3px rgba(91, 72, 187, 0.25), 2px 3px 0 rgba(38, 36, 33, 0.13);
    }

.prompt-media-order-handle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 44px;
    padding: 0;
    color: var(--notebook-muted);
    font-size: 1.25rem;
    cursor: grab;
    background: transparent;
    border: 0;
    border-radius: 6px;
}

    .prompt-media-order-handle:hover {
        color: var(--notebook-ink);
        background: rgba(91, 72, 187, 0.1);
    }

.prompt-media-order-position {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 29px;
    height: 29px;
    font-family: var(--notebook-hand);
    font-weight: 800;
    background: rgba(255, 241, 185, 0.94);
    border: 1.5px solid var(--notebook-ink);
    border-radius: 50%;
}

.prompt-media-order-image {
    display: block;
    width: 70px;
    height: 58px;
    object-fit: cover;
    background: #f4f1e8;
    border: 1px solid rgba(38, 36, 33, 0.38);
    border-radius: 6px;
}

.prompt-media-order-info {
    min-width: 0;
}

.prompt-media-order-name {
    display: block;
    overflow: hidden;
    font-size: 0.88rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.prompt-media-order-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 18px;
}

@media (max-width: 767.98px) {
    .prompt-media-order-header {
        display: block;
    }

    .prompt-media-order-status {
        display: inline-block;
        margin-top: 12px;
    }

    .prompt-media-order-list {
        grid-template-columns: minmax(0, 1fr);
    }

    .prompt-media-order-item {
        grid-template-columns: 30px 30px 62px minmax(0, 1fr);
    }

    .prompt-media-order-image {
        width: 62px;
        height: 54px;
    }
}

/* Изображения при создании промпта */

.prompt-create-media-upload {
    display: grid;
    gap: 10px;
}

.prompt-create-media-preview {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: 14px;
    margin-top: 8px;
}

    .prompt-create-media-preview:empty {
        display: none;
    }

.prompt-create-media-preview-item {
    overflow: hidden;
    margin: 0;
    background: var(--notebook-paper);
    border: var(--notebook-border);
    border-radius: 10px;
    box-shadow: 3px 4px 0 rgba(38, 36, 33, 0.12);
}

    .prompt-create-media-preview-item img {
        display: block;
        width: 100%;
        aspect-ratio: 4 / 3;
        object-fit: cover;
        background: rgba(150, 137, 232, 0.08);
        border-bottom: var(--notebook-border);
    }

.prompt-create-media-preview-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    min-height: 52px;
    padding: 9px 10px;
}

.prompt-create-media-preview-name {
    min-width: 0;
    overflow: hidden;
    font-size: 0.76rem;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.prompt-create-media-preview-information {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

    .prompt-create-media-preview-information .prompt-create-media-preview-name {
        flex: 1;
    }

.prompt-create-media-preview-remove {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 30px;
    height: 30px;
    padding: 0;
    color: var(--notebook-ink);
    background: transparent;
    border: 1px solid var(--notebook-ink);
    border-radius: 7px;
    font-family: Arial, sans-serif;
    font-size: 1.25rem;
    line-height: 1;
    cursor: pointer;
    transition: background-color 140ms ease, transform 140ms ease;
}

    .prompt-create-media-preview-remove:hover {
        background: rgba(217, 83, 79, 0.14);
        transform: rotate(-3deg);
    }

    .prompt-create-media-preview-remove:focus-visible {
        outline: 3px solid rgba(150, 137, 232, 0.35);
        outline-offset: 2px;
    }

@media (max-width: 575.98px) {
    .prompt-create-media-preview {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

.account-nav-link-disabled {
    opacity: 0.45;
    cursor: not-allowed;
    user-select: none;
}

    .account-nav-link-disabled:hover {
        color: var(--notebook-ink);
        background: transparent;
        border-color: transparent;
    }




/* =========================================================
   Footer
   ========================================================= */

.app-footer {
    padding-block: 20px;
    color: #777;
    background: rgba(255, 255, 255, 0.98);
    border-top: 1px solid rgba(36, 36, 36, 0.16);
    font-size: 0.84rem;
}

.app-footer-content {
    align-items: center;
    gap: 24px;
}

.app-footer nav {
    align-items: center;
    gap: 22px !important;
}

.app-footer a {
    color: #666;
    text-decoration: none;
    transition: color 120ms ease;
}

    .app-footer a:hover {
        color: var(--notebook-purple-dark);
        text-decoration: underline;
        text-underline-offset: 4px;
    }

@media (max-width: 767.98px) {
    .app-footer-content {
        align-items: flex-start;
        gap: 14px;
    }

    .app-footer nav {
        gap: 10px 18px !important;
    }
}



/* =========================================================
   Анимации интерфейса
   ========================================================= */

:root {
    --notebook-motion-fast: 140ms;
    --notebook-motion-normal: 260ms;
    --notebook-motion-slow: 420ms;
    --notebook-ease: cubic-bezier(0.2, 0.8, 0.2, 1);
}


/* =========================================================
   Появление карточек каталога
   ========================================================= */

@keyframes notebook-card-enter {
    from {
        opacity: 0;
        transform: translateY(14px) rotate(0deg);
    }

    to {
        opacity: 1;
    }
}

.prompt-note-card {
    animation: notebook-card-enter var(--notebook-motion-slow) var(--notebook-ease) both;
}

    .prompt-note-card:nth-child(2) {
        animation-delay: 50ms;
    }

    .prompt-note-card:nth-child(3) {
        animation-delay: 100ms;
    }

    .prompt-note-card:nth-child(4) {
        animation-delay: 150ms;
    }

    .prompt-note-card:nth-child(5) {
        animation-delay: 200ms;
    }

    .prompt-note-card:nth-child(6) {
        animation-delay: 250ms;
    }


/* =========================================================
   Карточка при наведении
   ========================================================= */

.prompt-note-card {
    transition: transform var(--notebook-motion-normal) var(--notebook-ease), box-shadow var(--notebook-motion-normal) var(--notebook-ease);
}

    .prompt-note-card:hover {
        transform: translateY(-5px) rotate(0deg);
    }


/* =========================================================
   Скотч карточки
   ========================================================= */

.prompt-note-tape {
    transition: transform var(--notebook-motion-normal) var(--notebook-ease), opacity var(--notebook-motion-normal) ease;
}

.prompt-note-card:hover .prompt-note-tape {
    transform: translateX(-50%) rotate(1deg) translateY(-2px);
    opacity: 0.9;
}


/* =========================================================
   Обложка
   ========================================================= */

.prompt-card-cover {
    transition: transform var(--notebook-motion-normal) var(--notebook-ease), box-shadow var(--notebook-motion-normal) var(--notebook-ease);
}

.prompt-note-card:hover .prompt-card-cover {
    transform: translateY(-2px);
    box-shadow: 2px 4px 0 rgba(36, 36, 36, 0.11);
}

.prompt-card-cover-image {
    transition: transform 380ms var(--notebook-ease), opacity 180ms ease;
}

.prompt-note-card:hover .prompt-card-cover-image {
    transform: scale(1.025);
}


/* =========================================================
   Избранное
   ========================================================= */

.prompt-note-card .favorite-toggle-button {
    transition: transform var(--notebook-motion-fast) var(--notebook-ease), background-color var(--notebook-motion-fast) ease, box-shadow var(--notebook-motion-fast) ease;
}

    .prompt-note-card .favorite-toggle-button:hover {
        transform: translateY(-2px) scale(1.06);
    }

    .prompt-note-card .favorite-toggle-button:active {
        transform: scale(0.90);
    }


/* =========================================================
   Ссылка открытия
   ========================================================= */

.prompt-note-open {
    transition: color var(--notebook-motion-fast) ease, transform var(--notebook-motion-fast) var(--notebook-ease);
}

    .prompt-note-open:hover {
        transform: translateX(3px);
    }


/* =========================================================
   Кнопки
   ========================================================= */

.btn {
    transition: transform var(--notebook-motion-fast) var(--notebook-ease), box-shadow var(--notebook-motion-fast) var(--notebook-ease), background-color var(--notebook-motion-fast) ease;
}


/* =========================================================
   Отключение анимаций
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}


/* =========================================================
   Расширенные анимации интерфейса
   ========================================================= */

@keyframes notebook-reveal {
    from {
        opacity: 0;
        translate: 0 12px;
        filter: blur(0.6px);
    }

    to {
        opacity: var(--motion-opacity, 1);
        translate: 0 0;
        filter: none;
    }
}

@keyframes notebook-popover-in {
    from {
        opacity: 0;
        translate: 0 -7px;
        scale: 0.98;
    }

    to {
        opacity: 1;
        translate: 0 0;
        scale: 1;
    }
}

@keyframes notebook-lightbox-in {
    from {
        opacity: 0;
        translate: 0 10px;
        scale: 0.975;
    }

    to {
        opacity: 1;
        translate: 0 0;
        scale: 1;
    }
}

@keyframes notebook-lightbox-out {
    from {
        opacity: 1;
        translate: 0 0;
        scale: 1;
    }

    to {
        opacity: 0;
        translate: 0 8px;
        scale: 0.98;
    }
}

@keyframes notebook-backdrop-in {
    from {
        background: rgba(20, 18, 16, 0);
        backdrop-filter: blur(0);
    }

    to {
        background: rgba(20, 18, 16, 0.82);
        backdrop-filter: blur(3px);
    }
}

@keyframes notebook-backdrop-out {
    from {
        background: rgba(20, 18, 16, 0.82);
        backdrop-filter: blur(3px);
    }

    to {
        background: rgba(20, 18, 16, 0);
        backdrop-filter: blur(0);
    }
}

@keyframes notebook-heart-pop {
    0% {
        scale: 1;
    }

    45% {
        scale: 1.22;
    }

    75% {
        scale: 0.94;
    }

    100% {
        scale: 1;
    }
}

@keyframes notebook-copy-success {
    0% {
        scale: 1;
    }

    40% {
        scale: 1.04;
        background: #edf7eb;
    }

    100% {
        scale: 1;
    }
}

@keyframes notebook-copy-error {
    0%, 100% {
        translate: 0 0;
    }

    25% {
        translate: -3px 0;
    }

    50% {
        translate: 3px 0;
    }

    75% {
        translate: -2px 0;
    }
}

@keyframes notebook-field-in {
    from {
        opacity: 0;
        translate: 0 9px;
        scale: 0.98;
    }

    to {
        opacity: 1;
        translate: 0 0;
        scale: 1;
    }
}

@keyframes notebook-badge-pop {
    0% {
        scale: 0.72;
        rotate: -7deg;
    }

    60% {
        scale: 1.1;
        rotate: 2deg;
    }

    100% {
        scale: 1;
        rotate: 0deg;
    }
}

@keyframes notebook-cookie-in {
    from {
        opacity: 0;
        translate: 0 18px;
    }

    to {
        opacity: 1;
        translate: 0 0;
    }
}


/* =========================================================
   Появление элементов при прокрутке
   ========================================================= */

.motion-enabled .motion-reveal {
    opacity: 0;
}

    .motion-enabled .motion-reveal.is-visible {
        animation: notebook-reveal 420ms var(--notebook-ease, cubic-bezier(0.2, 0.8, 0.2, 1)) calc(var(--motion-order, 0) * 45ms) both;
    }


/* =========================================================
   Навигация
   ========================================================= */

.app-navbar .nav-link {
    position: relative;
}

    .app-navbar .nav-link.active {
        background: transparent;
    }

    .app-navbar .nav-link::after {
        position: absolute;
        right: 8px;
        bottom: 4px;
        left: 8px;
        height: 6px;
        content: "";
        background: rgba(169, 154, 244, 0.46);
        border-radius: 999px;
        transform: scaleX(0);
        transform-origin: left center;
        transition: transform 240ms var(--notebook-ease, cubic-bezier(0.2, 0.8, 0.2, 1));
        z-index: -1;
    }

    .motion-ready .app-navbar .nav-link.active::after,
    .app-navbar .nav-link:hover::after {
        transform: scaleX(1);
    }


/* =========================================================
   Выпадающие фильтры
   ========================================================= */

.catalog-filter-menu[open] .catalog-filter-popover {
    transform-origin: top right;
    animation: notebook-popover-in 220ms var(--notebook-ease, cubic-bezier(0.2, 0.8, 0.2, 1)) both;
}

    .catalog-filter-menu[open] .catalog-filter-popover::before {
        animation: notebook-badge-pop 360ms var(--notebook-ease, cubic-bezier(0.2, 0.8, 0.2, 1)) both;
    }


/* =========================================================
   Выпадающее меню администратора
   ========================================================= */

.admin-nav-item:hover .admin-nav-menu,
.admin-nav-item:focus-within .admin-nav-menu {
    transform-origin: top right;
    animation: notebook-popover-in 180ms var(--notebook-ease, cubic-bezier(0.2, 0.8, 0.2, 1)) both;
}


/* =========================================================
   Скотч
   ========================================================= */

.prompt-paper-section::before,
.prompt-sidebar-note::before,
.prompt-form-header::before,
.prompt-form-sidebar-note::before,
.account-header-sheet::before,
.account-content-sheet::before,
.author-page-header::before,
.author-prompt-card::before,
.author-profile-header::before,
.notification-card::before,
.moderation-page-header::before,
.moderation-review-header::before,
.moderation-review-sheet::before {
    transition: translate 240ms var(--notebook-ease, cubic-bezier(0.2, 0.8, 0.2, 1)), opacity 240ms ease;
}

.prompt-paper-section:hover::before,
.prompt-sidebar-note:hover::before,
.prompt-form-header:hover::before,
.prompt-form-sidebar-note:hover::before,
.account-header-sheet:hover::before,
.account-content-sheet:hover::before,
.author-page-header:hover::before,
.author-prompt-card:hover::before,
.author-profile-header:hover::before,
.notification-card:hover::before,
.moderation-page-header:hover::before,
.moderation-review-header:hover::before,
.moderation-review-sheet:hover::before {
    translate: 0 -2px;
    opacity: 0.9;
}


/* =========================================================
   Lightbox
   ========================================================= */

.prompt-media-lightbox[open] .prompt-media-lightbox-panel {
    animation: notebook-lightbox-in 260ms var(--notebook-ease, cubic-bezier(0.2, 0.8, 0.2, 1)) both;
}

.prompt-media-lightbox[open]::backdrop {
    animation: notebook-backdrop-in 220ms ease both;
}

.prompt-media-lightbox.is-closing .prompt-media-lightbox-panel {
    animation: notebook-lightbox-out 170ms ease both;
}

.prompt-media-lightbox.is-closing::backdrop {
    animation: notebook-backdrop-out 170ms ease both;
}

.prompt-media-lightbox-navigation,
.prompt-media-lightbox-close {
    transition: scale 140ms ease, translate 140ms ease, background-color 140ms ease;
}

    .prompt-media-lightbox-navigation:hover,
    .prompt-media-lightbox-close:hover {
        scale: 1.05;
    }

    .prompt-media-lightbox-navigation:active,
    .prompt-media-lightbox-close:active {
        scale: 0.92;
    }


/* =========================================================
   Избранное
   ========================================================= */

.favorite-toggle-button.is-favorite-pop {
    animation: notebook-heart-pop 420ms var(--notebook-ease, cubic-bezier(0.2, 0.8, 0.2, 1));
}


/* =========================================================
   Копирование
   ========================================================= */

.copy-prompt-button.is-copy-success {
    animation: notebook-copy-success 520ms var(--notebook-ease, cubic-bezier(0.2, 0.8, 0.2, 1));
}

.copy-prompt-button.is-copy-error {
    animation: notebook-copy-error 320ms ease;
}


/* =========================================================
   Конструктор
   ========================================================= */

.visual-field-note.motion-added {
    animation: notebook-field-in 360ms var(--notebook-ease, cubic-bezier(0.2, 0.8, 0.2, 1)) both;
}


/* =========================================================
   Уведомления
   ========================================================= */

.motion-ready .notification-nav-badge {
    animation: notebook-badge-pop 420ms var(--notebook-ease, cubic-bezier(0.2, 0.8, 0.2, 1)) 160ms both;
}

.notification-card {
    transition: translate 220ms var(--notebook-ease, cubic-bezier(0.2, 0.8, 0.2, 1)), box-shadow 220ms ease;
}

    .notification-card:hover {
        translate: 0 -3px;
        box-shadow: 5px 7px 0 rgba(38, 36, 33, 0.14);
    }


/* =========================================================
   Рейтинг
   ========================================================= */

.prompt-rating-star {
    transition: scale 120ms ease, rotate 120ms ease, transform 120ms ease, background-color 120ms ease, color 120ms ease;
}

    .prompt-rating-star:hover {
        scale: 1.08;
        rotate: -4deg;
    }


/* =========================================================
   Главная
   ========================================================= */

.hero-preview-window {
    transition: translate 260ms var(--notebook-ease, cubic-bezier(0.2, 0.8, 0.2, 1)), box-shadow 260ms ease;
}

.hero-preview:hover .hero-preview-window {
    translate: 0 -4px;
}


/* =========================================================
   Формы
   ========================================================= */

.form-control,
.form-select {
    transition: border-color 150ms ease, box-shadow 150ms ease, background-color 150ms ease;
}


/* =========================================================
   Ошибки
   ========================================================= */

.alert-danger {
    animation: notebook-copy-error 320ms ease;
}


/* =========================================================
   Cookie banner
   ========================================================= */

.cookie-consent {
    animation: notebook-cookie-in 360ms var(--notebook-ease, cubic-bezier(0.2, 0.8, 0.2, 1)) both;
}


/* =========================================================
   Снижение движения
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
    .motion-reveal,
    .motion-reveal.is-visible {
        opacity: revert !important;
        translate: none !important;
        filter: none !important;
    }
}


/* =========================================================
   Исправления анимаций и чёткости
   ========================================================= */

/*
   Отключаем scroll-reveal.
   Остальные анимации сайта — hover, сердце, фильтры,
   lightbox, кнопки, скотч и т.д. — продолжают работать.
*/
.motion-enabled .motion-reveal,
.motion-enabled .motion-reveal.is-visible {
    opacity: var(--motion-opacity, 1) !important;
    translate: none !important;
    filter: none !important;
    animation: none !important;
}


/* =========================================================
   Карточки каталога
   ========================================================= */

/*
   Убираем микроповорот всей карточки.
   Именно transform: rotate(...) размывает весь текст.
*/
.prompt-note-card,
.prompt-note-card:nth-child(3n + 1),
.prompt-note-card:nth-child(3n + 2),
.prompt-note-card:nth-child(3n) {
    transform: none;
}

    /* При наведении карточка только приподнимается */
    .prompt-note-card:hover {
        transform: translateY(-5px);
    }


/* =========================================================
   Карточки на главной
   ========================================================= */

.home-top-prompt-card,
.home-top-prompt-card:nth-child(1),
.home-top-prompt-card:nth-child(2),
.home-top-prompt-card:nth-child(3) {
    transform: none;
}

    .home-top-prompt-card:hover {
        transform: translateY(-4px);
    }


/* =========================================================
   Разделы страницы промпта
   ========================================================= */

/*
   Не поворачиваем целиком листы с текстом.
   Скотч и остальные notebook-элементы остаются неровными.
*/
.prompt-paper-section,
.prompt-paper-section:nth-child(even),
.prompt-paper-section:nth-child(odd) {
    transform: none;
}


/* =========================================================
   Карточки на главной — исправление видимости
   ========================================================= */

.home-top-prompt-card,
.motion-enabled .home-top-prompt-card,
.motion-enabled .home-top-prompt-card.motion-reveal,
.motion-enabled .home-top-prompt-card.motion-reveal.is-visible {
    opacity: 1 !important;
    animation: none !important;
    filter: none !important;
    translate: none !important;
}

    .home-top-prompt-card:hover {
        transform: translateY(-4px);
    }





/* =========================================================
   Страница помощи
   ========================================================= */

.help-page {
    padding-bottom: 54px;
}

.help-hero {
    position: relative;
    margin-bottom: 34px;
    padding: 38px 40px 34px;
    overflow: hidden;
    background: repeating-linear-gradient( transparent, transparent 28px, rgba(89, 72, 187, 0.07) 29px ), rgba(255, 255, 255, 0.97);
    border: var(--notebook-border);
    border-radius: 14px;
    box-shadow: 4px 5px 0 rgba(38, 36, 33, 0.12);
}

    .help-hero::before {
        position: absolute;
        top: -9px;
        left: 50%;
        width: 112px;
        height: 22px;
        content: "";
        background: rgba(255, 241, 185, 0.76);
        border-right: 1px solid rgba(36, 36, 36, 0.2);
        border-left: 1px solid rgba(36, 36, 36, 0.2);
        transform: translateX(-50%) rotate(-1deg);
    }

.help-hero-kicker,
.help-section-kicker {
    color: var(--notebook-purple-dark);
    font-family: var(--notebook-hand);
    font-size: 0.84rem;
    font-weight: 700;
}

.help-hero-kicker {
    display: inline-block;
    margin-bottom: 9px;
    padding: 4px 9px;
    background: var(--notebook-purple-soft);
    border: 1px solid var(--notebook-ink);
    border-radius: 6px;
}

.help-hero-title {
    max-width: 760px;
    margin: 0 0 14px;
    font-size: clamp(2rem, 5vw, 3rem);
    line-height: 1.04;
}

.help-hero-description {
    max-width: 760px;
    margin: 0;
    color: var(--notebook-muted);
    font-size: 1.05rem;
    line-height: 1.7;
}

.help-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 24px;
}


/* =========================================================
   Навигация по справке
   ========================================================= */

.help-layout {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    align-items: start;
    gap: 30px;
}

.help-navigation {
    position: sticky;
    top: 92px;
    padding: 18px;
    background: rgba(255, 255, 255, 0.95);
    border: var(--notebook-border);
    border-radius: 11px;
    box-shadow: 3px 4px 0 rgba(38, 36, 33, 0.1);
}

.help-navigation-title {
    margin-bottom: 12px;
    padding-bottom: 10px;
    border-bottom: 1px dashed rgba(36, 36, 36, 0.3);
    font-family: var(--notebook-hand);
    font-weight: 700;
}

.help-navigation nav {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.help-navigation a {
    padding: 7px 8px;
    color: var(--notebook-muted);
    border-radius: 6px;
    font-size: 0.9rem;
    font-weight: 600;
    text-decoration: none;
    transition: color 120ms ease, background-color 120ms ease, transform 120ms ease;
}

    .help-navigation a:hover {
        color: var(--notebook-purple-dark);
        background: var(--notebook-purple-soft);
        transform: translateX(2px);
    }


/* =========================================================
   Листы справки
   ========================================================= */

.help-content {
    display: flex;
    flex-direction: column;
    gap: 26px;
    min-width: 0;
}

.help-sheet {
    scroll-margin-top: 92px;
    padding: 30px 32px;
    background: repeating-linear-gradient( transparent, transparent 29px, rgba(89, 72, 187, 0.045) 30px ), rgba(255, 255, 255, 0.97);
    border: var(--notebook-border);
    border-radius: 13px;
    box-shadow: 4px 5px 0 rgba(38, 36, 33, 0.1);
}

    .help-sheet p {
        line-height: 1.7;
    }

.help-section-heading {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 22px;
}

    .help-section-heading h2 {
        margin: 2px 0 0;
        font-size: clamp(1.55rem, 3vw, 2.1rem);
    }

.help-section-number {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    background: var(--notebook-purple-soft);
    border: var(--notebook-border);
    border-radius: 50%;
    font-family: var(--notebook-hand);
    font-size: 1rem;
    font-weight: 700;
}

.help-lead {
    max-width: 790px;
    font-size: 1.02rem;
}


/* =========================================================
   Быстрые шаги
   ========================================================= */

.help-steps,
.help-author-flow {
    display: grid;
    gap: 12px;
    margin-top: 22px;
}

    .help-step,
    .help-author-flow article {
        display: flex;
        align-items: flex-start;
        gap: 14px;
        padding: 15px 16px;
        background: rgba(250, 250, 250, 0.8);
        border: 1px solid rgba(36, 36, 36, 0.25);
        border-radius: 9px;
    }

        .help-step-number,
        .help-author-flow article > span {
            display: inline-flex;
            flex: 0 0 auto;
            align-items: center;
            justify-content: center;
            width: 30px;
            height: 30px;
            color: var(--notebook-purple-dark);
            background: var(--notebook-purple-soft);
            border: 1px solid var(--notebook-ink);
            border-radius: 7px;
            font-family: var(--notebook-hand);
            font-size: 0.84rem;
            font-weight: 700;
        }

        .help-step h3,
        .help-author-flow h3 {
            margin: 1px 0 5px;
            font-family: inherit;
            font-size: 1rem;
            font-weight: 700;
            letter-spacing: normal;
        }

        .help-step p,
        .help-author-flow p {
            margin: 0;
            color: var(--notebook-muted);
            font-size: 0.93rem;
        }


/* =========================================================
   Карточки возможностей
   ========================================================= */

.help-feature-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin-top: 22px;
}

.help-feature {
    padding: 17px;
    background: rgba(250, 250, 250, 0.8);
    border: 1px solid rgba(36, 36, 36, 0.24);
    border-radius: 9px;
}

    .help-feature h3 {
        margin-bottom: 7px;
        font-family: inherit;
        font-size: 1rem;
        font-weight: 700;
        letter-spacing: normal;
    }

    .help-feature p {
        margin: 0;
        color: var(--notebook-muted);
        font-size: 0.92rem;
    }


/* =========================================================
   Структура страницы промпта
   ========================================================= */

.help-prompt-parts {
    display: grid;
    gap: 14px;
    margin-top: 22px;
}

    .help-prompt-parts article {
        display: flex;
        gap: 15px;
        padding-bottom: 14px;
        border-bottom: 1px dashed rgba(36, 36, 36, 0.22);
    }

        .help-prompt-parts article:last-child {
            padding-bottom: 0;
            border-bottom: 0;
        }

.help-part-number {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    color: var(--notebook-purple-dark);
    background: var(--notebook-purple-soft);
    border: 1px solid var(--notebook-ink);
    border-radius: 50%;
    font-family: var(--notebook-hand);
    font-size: 0.85rem;
    font-weight: 700;
}

.help-prompt-parts h3 {
    margin: 2px 0 5px;
    font-family: inherit;
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: normal;
}

.help-prompt-parts p {
    margin: 0;
    color: var(--notebook-muted);
}


/* =========================================================
   Подсказки
   ========================================================= */

.help-note {
    margin-top: 24px;
    padding: 15px 17px;
    background: rgba(255, 241, 185, 0.48);
    border-left: 4px solid #d7b950;
    border-radius: 7px;
}

.help-note-purple {
    background: rgba(238, 234, 255, 0.78);
    border-left-color: var(--notebook-purple);
}

.help-note-red {
    background: rgba(246, 214, 209, 0.55);
    border-left-color: #cf776c;
}

.help-note strong {
    display: block;
    margin-bottom: 4px;
    font-weight: 700;
}

.help-note p {
    margin: 0;
}


/* =========================================================
   Списки
   ========================================================= */

.help-check-list {
    display: grid;
    gap: 8px;
    margin: 20px 0;
    padding: 0;
    list-style: none;
}

    .help-check-list li {
        position: relative;
        padding-left: 28px;
    }

        .help-check-list li::before {
            position: absolute;
            top: 0;
            left: 2px;
            color: var(--notebook-purple-dark);
            content: "✓";
            font-family: var(--notebook-hand);
            font-weight: 700;
        }

.help-subheading {
    margin-top: 26px;
    font-family: inherit;
    font-size: 1.08rem;
    font-weight: 700;
    letter-spacing: normal;
}


/* =========================================================
   Статусы
   ========================================================= */

.help-status-list {
    display: grid;
    gap: 12px;
    margin-top: 22px;
}

    .help-status-list article {
        display: grid;
        grid-template-columns: 145px minmax(0, 1fr);
        align-items: center;
        gap: 18px;
    }

    .help-status-list p {
        margin: 0;
        color: var(--notebook-muted);
    }

.help-status-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 5px 10px;
    border: 1px solid var(--notebook-ink);
    border-radius: 7px;
    font-size: 0.84rem;
    font-weight: 700;
}

.help-status-draft {
    background: #f1f2f3;
}

.help-status-pending {
    background: var(--notebook-yellow);
}

.help-status-published {
    background: var(--notebook-green);
}

.help-status-rejected {
    background: var(--notebook-red);
}

.help-status-archived {
    background: var(--notebook-blue);
}


/* =========================================================
   Ссылки и нижний блок
   ========================================================= */

.help-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 18px;
    margin-top: 22px;
}

.help-text-link {
    color: var(--notebook-purple-dark);
    font-weight: 700;
    text-decoration: none;
}

    .help-text-link:hover {
        color: var(--notebook-ink);
        text-decoration: underline;
        text-underline-offset: 4px;
    }

.help-bottom-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 26px;
    padding: 28px 30px;
    background: var(--notebook-purple-soft);
    border: var(--notebook-border);
    border-radius: 13px;
    box-shadow: 4px 5px 0 rgba(38, 36, 33, 0.11);
}

    .help-bottom-card h2 {
        margin: 3px 0 7px;
    }

    .help-bottom-card p {
        max-width: 620px;
        margin: 0;
        color: var(--notebook-muted);
    }


/* =========================================================
   Адаптивность страницы помощи
   ========================================================= */

@media (max-width: 991.98px) {
    .help-layout {
        grid-template-columns: 1fr;
    }

    .help-navigation {
        position: static;
    }

        .help-navigation nav {
            flex-direction: row;
            flex-wrap: wrap;
        }

        .help-navigation a {
            background: rgba(238, 234, 255, 0.55);
        }
}

@media (max-width: 767.98px) {
    .help-hero {
        padding: 32px 22px 26px;
    }

    .help-sheet {
        padding: 24px 20px;
    }

    .help-feature-grid {
        grid-template-columns: 1fr;
    }

    .help-status-list article {
        grid-template-columns: 1fr;
        gap: 7px;
    }

    .help-status-badge {
        justify-self: start;
    }

    .help-bottom-card {
        flex-direction: column;
        align-items: flex-start;
        padding: 24px 20px;
    }
}

@media (max-width: 575.98px) {
    .help-section-heading {
        align-items: flex-start;
    }

    .help-step,
    .help-author-flow article {
        padding: 13px;
    }

    .help-navigation nav {
        flex-direction: column;
    }
}


/* =========================================================
   Заметки на странице помощи
   ========================================================= */

.help-annotation {
    --help-annotation-accent: rgba(36, 36, 36, 0.55);
    display: grid;
    grid-template-columns: 135px minmax(0, 1fr);
    gap: 22px;
    margin-top: 28px;
    padding: 18px 4px 17px;
    background: transparent;
    border-top: 1px dashed rgba(36, 36, 36, 0.28);
    border-bottom: 1px dashed rgba(36, 36, 36, 0.28);
}

.help-annotation-label {
    align-self: start;
    justify-self: start;
    padding: 2px 4px 5px;
    color: var(--notebook-muted);
    border-bottom: 4px solid var(--help-annotation-accent);
    font-family: var(--notebook-hand);
    font-size: 0.9rem;
    font-weight: 700;
    line-height: 1.15;
    transform: rotate(-1deg);
}

.help-annotation-content {
    min-width: 0;
}

    .help-annotation-content h3 {
        margin: 0 0 6px;
        font-family: inherit;
        font-size: 1rem;
        font-weight: 700;
        letter-spacing: normal;
    }

    .help-annotation-content p {
        margin: 0;
        color: var(--notebook-muted);
        line-height: 1.65;
    }

.help-annotation-purple {
    --help-annotation-accent: rgba(143, 126, 243, 0.72);
}

.help-annotation-yellow {
    --help-annotation-accent: rgba(214, 182, 69, 0.72);
}

.help-annotation-red {
    --help-annotation-accent: rgba(199, 102, 93, 0.7);
}


/* =========================================================
   Инструкция по конструктору
   ========================================================= */

.help-constructor-steps {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 13px;
    margin-top: 24px;
}

    .help-constructor-steps article {
        display: flex;
        align-items: flex-start;
        gap: 13px;
        padding: 16px;
        background: rgba(255, 255, 255, 0.72);
        border: 1px solid rgba(36, 36, 36, 0.22);
        border-radius: 9px;
    }

.help-constructor-step-number {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    color: var(--notebook-purple-dark);
    background: var(--notebook-purple-soft);
    border: 1px solid var(--notebook-ink);
    border-radius: 50%;
    font-family: var(--notebook-hand);
    font-size: 0.82rem;
    font-weight: 700;
}

.help-constructor-steps h3 {
    margin: 1px 0 5px;
    font-family: inherit;
    font-size: 0.97rem;
    font-weight: 700;
    letter-spacing: normal;
}

.help-constructor-steps p {
    margin: 0;
    color: var(--notebook-muted);
    font-size: 0.92rem;
    line-height: 1.6;
}


/* =========================================================
   Наглядный пример конструктора
   ========================================================= */

.help-constructor-example {
    position: relative;
    margin-top: 28px;
    padding: 24px;
    background: repeating-linear-gradient( transparent, transparent 27px, rgba(89, 72, 187, 0.045) 28px ), rgba(250, 249, 255, 0.8);
    border: 1px solid rgba(36, 36, 36, 0.4);
    border-radius: 10px;
}

.help-constructor-example-heading {
    margin-bottom: 17px;
    color: var(--notebook-purple-dark);
    font-family: var(--notebook-hand);
    font-weight: 700;
}

.help-constructor-example-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 13px;
}

.help-constructor-example-field span {
    display: block;
    margin-bottom: 6px;
    font-size: 0.82rem;
    font-weight: 700;
}

.help-constructor-example-field div {
    min-height: 43px;
    padding: 10px 12px;
    background: rgba(255, 255, 255, 0.95);
    border: 1px solid rgba(36, 36, 36, 0.42);
    border-radius: 7px;
    color: var(--notebook-muted);
    font-size: 0.9rem;
}

.help-constructor-example-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: 15px;
    padding: 9px 15px;
    background: var(--notebook-purple);
    border: 1px solid var(--notebook-ink);
    border-radius: 7px;
    box-shadow: 2px 2px 0 rgba(36, 36, 36, 0.16);
    font-size: 0.88rem;
    font-weight: 700;
}

.help-constructor-example-result {
    margin-top: 20px;
    padding-top: 17px;
    border-top: 1px dashed rgba(36, 36, 36, 0.3);
}

    .help-constructor-example-result span {
        display: block;
        margin-bottom: 6px;
        font-family: var(--notebook-hand);
        font-weight: 700;
    }

    .help-constructor-example-result p {
        margin: 0;
        color: var(--notebook-muted);
    }


/* =========================================================
   Адаптивность новых элементов
   ========================================================= */

@media (max-width: 767.98px) {
    .help-annotation {
        grid-template-columns: 1fr;
        gap: 11px;
    }

    .help-constructor-steps {
        grid-template-columns: 1fr;
    }

    .help-constructor-example-fields {
        grid-template-columns: 1fr;
    }
}


/* =========================================================
   Патч чёткости заметок на странице помощи
   ========================================================= */

.help-annotation {
    gap: 20px;
    padding: 18px 4px 17px;
    border-top: 1px dashed rgba(36, 36, 36, 0.34);
    border-bottom: 1px dashed rgba(36, 36, 36, 0.34);
}

.help-annotation-label {
    color: rgba(36, 36, 36, 0.82);
    border-bottom-width: 5px;
    font-size: 0.98rem;
    font-weight: 800;
    line-height: 1.05;
    letter-spacing: 0.01em;
    transform: rotate(-0.4deg);
    text-shadow: none;
    opacity: 1;
}

.help-annotation-content h3 {
    color: var(--notebook-ink);
    font-size: 1.02rem;
    font-weight: 800;
}

.help-annotation-content p {
    color: rgba(36, 36, 36, 0.8);
    line-height: 1.68;
}

.help-annotation-purple {
    --help-annotation-accent: rgba(143, 126, 243, 0.88);
}

.help-annotation-yellow {
    --help-annotation-accent: rgba(214, 182, 69, 0.88);
}

.help-annotation-red {
    --help-annotation-accent: rgba(199, 102, 93, 0.84);
}


/* =========================================================
   Блок "Конструктор для автора"
   ========================================================= */

.help-author-constructor {
    margin-top: 30px;
}

.help-section-subheading {
    display: inline-block;
    margin-bottom: 10px;
    padding: 4px 10px 5px;
    background: rgba(143, 126, 243, 0.12);
    border: 1px solid rgba(36, 36, 36, 0.28);
    border-radius: 999px;
    color: var(--notebook-purple-dark);
    font-family: var(--notebook-hand);
    font-size: 0.95rem;
    font-weight: 700;
}

.help-constructor-steps-author {
    margin-top: 18px;
}

.help-constructor-example-author {
    margin-top: 24px;
}

.help-constructor-author-template-title {
    margin-bottom: 10px;
    color: var(--notebook-ink);
    font-family: var(--notebook-hand);
    font-size: 1rem;
    font-weight: 700;
}

.help-constructor-author-template p {
    margin-bottom: 16px;
    color: var(--notebook-muted);
}

.help-constructor-author-fields {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 18px;
}

.help-constructor-author-field span {
    display: block;
    margin-bottom: 6px;
    font-size: 0.8rem;
    font-weight: 700;
    color: var(--notebook-muted);
}

.help-constructor-author-field div {
    min-height: 42px;
    padding: 10px 12px;
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid rgba(36, 36, 36, 0.42);
    border-radius: 7px;
    color: var(--notebook-ink);
    font-size: 0.9rem;
}

.help-constructor-author-template-result {
    padding-top: 16px;
    border-top: 1px dashed rgba(36, 36, 36, 0.28);
}

    .help-constructor-author-template-result span {
        display: block;
        margin-bottom: 8px;
        font-family: var(--notebook-hand);
        font-weight: 700;
        color: var(--notebook-ink);
    }

.help-constructor-author-result-card {
    margin-top: 10px;
    padding: 14px 16px;
    background: rgba(255, 255, 255, 0.92);
    border: 1px solid rgba(36, 36, 36, 0.38);
    border-radius: 8px;
    color: rgba(36, 36, 36, 0.84);
    line-height: 1.65;
}


/* =========================================================
   Адаптивность блока автора
   ========================================================= */

@media (max-width: 991.98px) {
    .help-constructor-author-fields {
        grid-template-columns: 1fr;
    }
}


/* =========================================================
   Помощь по конструктору в форме промпта
   ========================================================= */

.constructor-help {
    margin: 20px 0 18px;
    background: rgba(255, 255, 255, 0.78);
    border-top: 1px dashed rgba(36, 36, 36, 0.28);
    border-bottom: 1px dashed rgba(36, 36, 36, 0.28);
}

.constructor-help-summary {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 13px 4px;
    color: var(--notebook-ink);
    cursor: pointer;
    font-size: 0.94rem;
    font-weight: 700;
    list-style: none;
    user-select: none;
}

    .constructor-help-summary::-webkit-details-marker {
        display: none;
    }

.constructor-help-mark {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 27px;
    height: 27px;
    color: var(--notebook-purple-dark);
    background: var(--notebook-purple-soft);
    border: 1px solid rgba(36, 36, 36, 0.65);
    border-radius: 50%;
    font-family: var(--notebook-hand);
    font-size: 0.9rem;
    font-weight: 800;
}

.constructor-help-chevron {
    margin-left: auto;
    color: var(--notebook-purple-dark);
    font-family: var(--notebook-hand);
    transition: transform 180ms ease;
}

.constructor-help[open] .constructor-help-chevron {
    transform: rotate(180deg);
}

.constructor-help-body {
    padding: 5px 4px 21px;
}

.constructor-help-intro {
    max-width: 790px;
}

    .constructor-help-intro h3 {
        margin: 0 0 7px;
        font-family: inherit;
        font-size: 1rem;
        font-weight: 800;
        letter-spacing: normal;
    }

    .constructor-help-intro p {
        margin: 0;
        color: rgba(36, 36, 36, 0.78);
        line-height: 1.65;
    }


/* =========================================================
   Последовательность работы конструктора
   ========================================================= */

.constructor-help-flow {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 11px;
    margin-top: 20px;
}

.constructor-help-step {
    display: flex;
    align-items: flex-start;
    gap: 11px;
    padding: 13px 14px;
    background: rgba(250, 250, 250, 0.76);
    border: 1px solid rgba(36, 36, 36, 0.21);
    border-radius: 8px;
}

    .constructor-help-step > span {
        display: inline-flex;
        flex: 0 0 auto;
        align-items: center;
        justify-content: center;
        width: 27px;
        height: 27px;
        color: var(--notebook-purple-dark);
        background: var(--notebook-purple-soft);
        border: 1px solid rgba(36, 36, 36, 0.58);
        border-radius: 50%;
        font-family: var(--notebook-hand);
        font-size: 0.78rem;
        font-weight: 800;
    }

    .constructor-help-step strong {
        display: block;
        margin: 1px 0 4px;
        font-size: 0.9rem;
    }

    .constructor-help-step p {
        margin: 0;
        color: var(--notebook-muted);
        font-size: 0.87rem;
        line-height: 1.55;
    }

    .constructor-help-step code {
        color: var(--notebook-purple-dark);
        background: rgba(238, 234, 255, 0.68);
    }


/* =========================================================
   Пример конструктора
   ========================================================= */

.constructor-help-example {
    margin-top: 19px;
    padding: 18px;
    background: repeating-linear-gradient( transparent, transparent 27px, rgba(89, 72, 187, 0.04) 28px ), rgba(250, 249, 255, 0.72);
    border: 1px solid rgba(36, 36, 36, 0.34);
    border-radius: 9px;
}

.constructor-help-example-title {
    margin-bottom: 14px;
    color: var(--notebook-purple-dark);
    font-family: var(--notebook-hand);
    font-size: 0.95rem;
    font-weight: 800;
}

.constructor-help-example-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
    gap: 15px;
}

.constructor-help-example-label {
    display: block;
    margin-bottom: 7px;
    color: var(--notebook-muted);
    font-size: 0.78rem;
    font-weight: 700;
}

.constructor-help-paper {
    min-height: 105px;
    padding: 13px 14px;
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid rgba(36, 36, 36, 0.38);
    border-radius: 7px;
    color: rgba(36, 36, 36, 0.84);
    font-size: 0.87rem;
    line-height: 1.65;
}

    .constructor-help-paper strong {
        color: var(--notebook-purple-dark);
        font-weight: 800;
    }

.constructor-help-example-arrow {
    color: var(--notebook-purple-dark);
    font-family: var(--notebook-hand);
    font-size: 1.4rem;
    font-weight: 800;
}

.constructor-help-fields {
    display: grid;
    gap: 8px;
}

    .constructor-help-fields > div {
        padding: 9px 11px;
        background: rgba(255, 255, 255, 0.96);
        border: 1px solid rgba(36, 36, 36, 0.38);
        border-radius: 7px;
    }

    .constructor-help-fields span {
        display: block;
        margin-bottom: 2px;
        color: var(--notebook-muted);
        font-size: 0.73rem;
        font-weight: 700;
    }

    .constructor-help-fields strong {
        display: block;
        font-size: 0.86rem;
        font-weight: 600;
    }

.constructor-help-result {
    margin-top: 15px;
    padding-top: 14px;
    border-top: 1px dashed rgba(36, 36, 36, 0.28);
}

    .constructor-help-result > span {
        display: block;
        margin-bottom: 5px;
        font-family: var(--notebook-hand);
        font-size: 0.86rem;
        font-weight: 800;
    }

    .constructor-help-result p {
        margin: 0;
        color: rgba(36, 36, 36, 0.8);
        font-size: 0.88rem;
        line-height: 1.6;
    }


/* =========================================================
   Правила конструктора
   ========================================================= */

.constructor-help-rules {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-top: 16px;
}

    .constructor-help-rules > div {
        padding: 11px 12px;
        border-left: 3px solid rgba(143, 126, 243, 0.68);
    }

    .constructor-help-rules strong {
        display: block;
        margin-bottom: 3px;
        font-size: 0.83rem;
    }

    .constructor-help-rules span {
        color: var(--notebook-muted);
        font-size: 0.8rem;
        line-height: 1.45;
    }

.constructor-help-warning {
    display: grid;
    grid-template-columns: 105px minmax(0, 1fr);
    gap: 16px;
    margin-top: 17px;
    padding: 13px 0;
    border-top: 1px dashed rgba(36, 36, 36, 0.25);
    border-bottom: 1px dashed rgba(36, 36, 36, 0.25);
}

.constructor-help-warning-label {
    align-self: start;
    color: rgba(36, 36, 36, 0.82);
    border-bottom: 4px solid rgba(214, 182, 69, 0.85);
    font-family: var(--notebook-hand);
    font-size: 0.88rem;
    font-weight: 800;
}

.constructor-help-warning p {
    margin: 0;
    color: rgba(36, 36, 36, 0.78);
    font-size: 0.85rem;
    line-height: 1.55;
}

.constructor-help-link {
    display: inline-flex;
    margin-top: 15px;
    color: var(--notebook-purple-dark);
    font-size: 0.85rem;
    font-weight: 700;
    text-decoration: none;
}

    .constructor-help-link:hover {
        color: var(--notebook-ink);
        text-decoration: underline;
        text-underline-offset: 4px;
    }


/* =========================================================
   Адаптивность помощи конструктора
   ========================================================= */

@media (max-width: 767.98px) {
    .constructor-help-flow {
        grid-template-columns: 1fr;
    }

    .constructor-help-example-grid {
        grid-template-columns: 1fr;
    }

    .constructor-help-example-arrow {
        transform: rotate(90deg);
        justify-self: center;
    }

    .constructor-help-rules {
        grid-template-columns: 1fr;
    }

    .constructor-help-warning {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .constructor-help-warning-label {
        justify-self: start;
    }
}





/* =========================================================
   Настройки поддержки автора
   ========================================================= */

.author-support-settings {
    overflow: visible;
}

.author-support-intro {
    display: flex;
    align-items: flex-start;
    gap: 15px;
    margin-bottom: 25px;
    padding: 16px 0 18px;
    border-top: 1px dashed rgba(36, 36, 36, 0.25);
    border-bottom: 1px dashed rgba(36, 36, 36, 0.25);
}

.author-support-intro-mark {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    color: var(--notebook-purple-dark);
    background: var(--notebook-purple-soft);
    border: 1px solid rgba(36, 36, 36, 0.62);
    border-radius: 50%;
    font-family: var(--notebook-hand);
    font-size: 1rem;
    font-weight: 800;
}

.author-support-intro h3 {
    margin: 1px 0 5px;
    font-family: inherit;
    font-size: 1rem;
    font-weight: 800;
    letter-spacing: normal;
}

.author-support-intro p {
    max-width: 720px;
    margin: 0;
    color: var(--notebook-muted);
    line-height: 1.65;
}


/* =========================================================
   Способы поддержки
   ========================================================= */

.author-support-methods {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.author-support-method-card {
    padding: 20px;
    background: repeating-linear-gradient( transparent, transparent 28px, rgba(89, 72, 187, 0.035) 29px ), rgba(255, 255, 255, 0.94);
    border: 1px solid rgba(36, 36, 36, 0.42);
    border-radius: 11px;
    box-shadow: 3px 4px 0 rgba(36, 36, 36, 0.08);
}

.author-support-method-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 12px;
}

.author-support-method-provider {
    margin-bottom: 2px;
    color: var(--notebook-purple-dark);
    font-family: var(--notebook-hand);
    font-size: 0.86rem;
    font-weight: 800;
}

.author-support-method-header h3 {
    margin: 0;
    font-family: inherit;
    font-size: 1.08rem;
    font-weight: 800;
    letter-spacing: normal;
}

.author-support-provider-badge {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    color: var(--notebook-purple-dark);
    background: var(--notebook-purple-soft);
    border: 1px solid rgba(36, 36, 36, 0.55);
    border-radius: 9px;
    font-family: var(--notebook-hand);
    font-size: 0.9rem;
    font-weight: 800;
}

.author-support-method-description {
    min-height: 68px;
    margin-bottom: 18px;
    color: var(--notebook-muted);
    font-size: 0.91rem;
    line-height: 1.6;
}

.author-support-enabled {
    margin-top: 13px;
}

.author-support-external-link {
    display: inline-flex;
    margin-top: 16px;
    color: var(--notebook-purple-dark);
    font-size: 0.84rem;
    font-weight: 700;
    text-decoration: none;
}

    .author-support-external-link:hover {
        color: var(--notebook-ink);
        text-decoration: underline;
        text-underline-offset: 4px;
    }


/* =========================================================
   Заметки поддержки
   ========================================================= */

.author-support-note {
    display: grid;
    grid-template-columns: 115px minmax(0, 1fr);
    gap: 20px;
    margin-top: 24px;
    padding: 15px 3px;
    border-top: 1px dashed rgba(36, 36, 36, 0.27);
}

    .author-support-note + .author-support-note {
        margin-top: 0;
    }

.author-support-note-label {
    align-self: start;
    justify-self: start;
    padding-bottom: 4px;
    color: rgba(36, 36, 36, 0.82);
    border-bottom: 4px solid rgba(143, 126, 243, 0.82);
    font-family: var(--notebook-hand);
    font-size: 0.9rem;
    font-weight: 800;
}

.author-support-note strong {
    display: block;
    margin-bottom: 4px;
}

.author-support-note p {
    max-width: 690px;
    margin: 0;
    color: var(--notebook-muted);
    line-height: 1.6;
}

.author-support-form-actions {
    display: flex;
    margin-top: 26px;
}


/* =========================================================
   Адаптивность поддержки автора
   ========================================================= */

@media (max-width: 767.98px) {
    .author-support-methods {
        grid-template-columns: 1fr;
    }

    .author-support-method-description {
        min-height: 0;
    }

    .author-support-note {
        grid-template-columns: 1fr;
        gap: 9px;
    }
}




/* =========================================================
   Публичная поддержка автора
   ========================================================= */

.author-support-card-kicker {
    margin-bottom: 4px;
    color: var(--notebook-purple-dark);
    font-family: var(--notebook-hand);
    font-size: 0.84rem;
    font-weight: 800;
}

.author-support-sidebar p {
    margin-bottom: 16px;
    color: var(--notebook-muted);
    line-height: 1.6;
}

.author-support-open-button {
    width: 100%;
}


/* =========================================================
   Поддержка в профиле автора
   ========================================================= */

.author-support-profile-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    margin: 22px 0;
    padding: 20px 24px;
    background: repeating-linear-gradient( transparent, transparent 28px, rgba(89, 72, 187, 0.035) 29px ), rgba(255, 255, 255, 0.96);
    border: 1px solid rgba(36, 36, 36, 0.42);
    border-radius: 11px;
    box-shadow: 3px 4px 0 rgba(36, 36, 36, 0.09);
}

    .author-support-profile-card h2 {
        margin: 2px 0 5px;
        font-size: 1.25rem;
    }

    .author-support-profile-card p {
        max-width: 720px;
        margin: 0;
        color: var(--notebook-muted);
    }


/* =========================================================
   Диалог поддержки
   ========================================================= */

.author-support-dialog {
    width: min(620px, calc(100vw - 32px));
    max-width: 620px;
    padding: 0;
    overflow: visible;
    background: transparent;
    border: 0;
}

    .author-support-dialog::backdrop {
        background: rgba(26, 24, 22, 0.68);
        backdrop-filter: blur(2px);
    }

.author-support-dialog-sheet {
    position: relative;
    max-height: calc(100vh - 40px);
    padding: 30px;
    overflow-y: auto;
    background: repeating-linear-gradient( transparent, transparent 29px, rgba(89, 72, 187, 0.045) 30px ), #fff;
    border: 1px solid rgba(36, 36, 36, 0.72);
    border-radius: 13px;
    box-shadow: 7px 9px 0 rgba(25, 23, 21, 0.2);
}

    .author-support-dialog-sheet::before {
        position: absolute;
        top: -10px;
        left: 50%;
        width: 98px;
        height: 21px;
        content: "";
        background: rgba(190, 178, 255, 0.58);
        border-right: 1px solid rgba(36, 36, 36, 0.14);
        border-left: 1px solid rgba(36, 36, 36, 0.14);
        transform: translateX(-50%) rotate(-1deg);
    }

.author-support-dialog-close {
    position: absolute;
    top: 15px;
    right: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    padding: 0;
    color: var(--notebook-ink);
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid rgba(36, 36, 36, 0.5);
    border-radius: 50%;
    font-family: Arial, sans-serif;
    font-size: 23px;
    line-height: 1;
}

.author-support-dialog-kicker {
    margin-bottom: 6px;
    color: var(--notebook-purple-dark);
    font-family: var(--notebook-hand);
    font-size: 0.88rem;
    font-weight: 800;
}

.author-support-dialog-title {
    margin: 0 45px 8px 0;
    font-size: clamp(1.6rem, 4vw, 2.15rem);
}

.author-support-dialog-description {
    max-width: 500px;
    margin: 0;
    color: var(--notebook-muted);
    line-height: 1.6;
}

.author-support-dialog-label {
    margin-bottom: 10px;
    font-size: 0.86rem;
    font-weight: 800;
}


/* =========================================================
   Выбор суммы
   ========================================================= */

.author-support-amount-section {
    margin-top: 25px;
    padding-top: 19px;
    border-top: 1px dashed rgba(36, 36, 36, 0.28);
}

.author-support-amounts {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
}

.author-support-amount-button {
    min-width: 82px;
    padding: 9px 14px;
    color: var(--notebook-ink);
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid rgba(36, 36, 36, 0.55);
    border-radius: 8px;
    box-shadow: 2px 2px 0 rgba(36, 36, 36, 0.09);
    font-weight: 700;
}

    .author-support-amount-button:hover,
    .author-support-amount-button.is-selected {
        color: var(--notebook-purple-dark);
        background: var(--notebook-purple-soft);
    }

    .author-support-amount-button.is-selected {
        border-color: var(--notebook-purple-dark);
    }

.author-support-custom-amount {
    display: block;
    margin-top: 15px;
}

    .author-support-custom-amount > span:first-child {
        display: block;
        margin-bottom: 6px;
        color: var(--notebook-muted);
        font-size: 0.82rem;
        font-weight: 700;
    }

.author-support-custom-input {
    display: flex;
    align-items: center;
    width: min(240px, 100%);
}

    .author-support-custom-input input {
        width: 100%;
        min-height: 42px;
        padding: 8px 11px;
        background: #fff;
        border: 1px solid rgba(36, 36, 36, 0.45);
        border-radius: 7px 0 0 7px;
    }

    .author-support-custom-input > span {
        display: inline-flex;
        align-items: center;
        min-height: 42px;
        padding: 0 12px;
        background: rgba(238, 234, 255, 0.75);
        border: 1px solid rgba(36, 36, 36, 0.45);
        border-left: 0;
        border-radius: 0 7px 7px 0;
        font-weight: 700;
    }

.author-support-amount-error {
    margin-top: 7px;
    color: #a23d35;
    font-size: 0.82rem;
    font-weight: 600;
}


/* =========================================================
   Платёжные сервисы
   ========================================================= */

.author-support-provider-section {
    margin-top: 24px;
    padding-top: 19px;
    border-top: 1px dashed rgba(36, 36, 36, 0.28);
}

.author-support-providers {
    display: grid;
    gap: 11px;
}

.author-support-provider-button,
.author-support-yoomoney {
    padding: 13px 14px;
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid rgba(36, 36, 36, 0.38);
    border-radius: 9px;
}

.author-support-provider-button {
    display: flex;
    align-items: center;
    gap: 12px;
    color: var(--notebook-ink);
    text-decoration: none;
    transition: transform 140ms ease, background-color 140ms ease;
}

    .author-support-provider-button:hover {
        color: var(--notebook-ink);
        background: rgba(238, 234, 255, 0.56);
        transform: translateY(-2px);
    }

.author-support-provider-icon {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    color: var(--notebook-purple-dark);
    background: var(--notebook-purple-soft);
    border: 1px solid rgba(36, 36, 36, 0.5);
    border-radius: 9px;
    font-family: var(--notebook-hand);
    font-weight: 800;
}

.author-support-provider-button strong,
.author-support-provider-heading strong {
    display: block;
    font-size: 0.9rem;
}

.author-support-provider-button small,
.author-support-provider-heading small {
    display: block;
    margin-top: 2px;
    color: var(--notebook-muted);
    font-size: 0.76rem;
}

.author-support-provider-heading {
    display: flex;
    align-items: center;
    gap: 12px;
}

.author-support-yoomoney-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
    padding-left: 50px;
}

.author-support-payment-button {
    padding: 7px 10px;
    color: var(--notebook-purple-dark);
    background: rgba(238, 234, 255, 0.58);
    border: 1px solid rgba(36, 36, 36, 0.35);
    border-radius: 7px;
    font-size: 0.8rem;
    font-weight: 700;
}

    .author-support-payment-button:hover {
        background: var(--notebook-purple-soft);
    }


/* =========================================================
   Пояснение
   ========================================================= */

.author-support-dialog-note {
    display: grid;
    grid-template-columns: 80px minmax(0, 1fr);
    gap: 16px;
    margin-top: 22px;
    padding-top: 16px;
    border-top: 1px dashed rgba(36, 36, 36, 0.28);
}

    .author-support-dialog-note > span {
        align-self: start;
        justify-self: start;
        padding-bottom: 4px;
        color: rgba(36, 36, 36, 0.82);
        border-bottom: 4px solid rgba(214, 182, 69, 0.82);
        font-family: var(--notebook-hand);
        font-size: 0.86rem;
        font-weight: 800;
    }

    .author-support-dialog-note p {
        margin: 0;
        color: var(--notebook-muted);
        font-size: 0.82rem;
        line-height: 1.55;
    }


/* =========================================================
   Адаптивность
   ========================================================= */

@media (max-width: 575.98px) {
    .author-support-profile-card {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
    }

    .author-support-dialog-sheet {
        padding: 26px 19px 22px;
    }

    .author-support-amounts {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
    }

    .author-support-amount-button {
        min-width: 0;
    }

    .author-support-yoomoney-actions {
        padding-left: 0;
    }

    .author-support-dialog-note {
        grid-template-columns: 1fr;
        gap: 8px;
    }
}


/* =========================================================
   Ошибки форм входа и регистрации
   ========================================================= */

.identity-form .validation-summary-errors {
    position: relative;
    margin: 0 0 22px;
    padding: 14px 16px 14px 48px;
    color: var(--notebook-ink);
    background: rgba(255, 255, 255, 0.72);
    border: 0;
    border-top: 1px dashed rgba(169, 82, 73, 0.42);
    border-bottom: 1px dashed rgba(169, 82, 73, 0.42);
    border-radius: 0;
    box-shadow: none;
}

    .identity-form .validation-summary-errors::before {
        position: absolute;
        top: 12px;
        left: 5px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 29px;
        height: 29px;
        color: #a45149;
        content: "!";
        background: rgba(246, 214, 209, 0.5);
        border: 1px solid rgba(169, 82, 73, 0.55);
        border-radius: 50%;
        font-family: var(--notebook-hand);
        font-size: 0.92rem;
        font-weight: 800;
    }

    .identity-form .validation-summary-errors ul {
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .identity-form .validation-summary-errors li {
        margin: 0;
        padding: 0;
        font-size: 0.91rem;
        font-weight: 600;
        line-height: 1.55;
    }

        .identity-form .validation-summary-errors li + li {
            margin-top: 5px;
        }

.identity-form .validation-summary-valid {
    display: none;
}

/* --------------------------------------------------------------------------
   EN: Stable prompt media lightbox grid placement
   RU: Фиксированное размещение элементов lightbox
   -------------------------------------------------------------------------- */

.prompt-media-lightbox-navigation.is-previous {
    grid-column: 1;
}

.prompt-media-lightbox-figure {
    grid-column: 2;
}

.prompt-media-lightbox-navigation.is-next {
    grid-column: 3;
}



/* --------------------------------------------------------------------------
   EN: Prompt media image zoom
   RU: Увеличение изображения в просмотрщике
   -------------------------------------------------------------------------- */

.prompt-media-lightbox-image {
    cursor: zoom-in;
    user-select: none;
    transform-origin: var(--prompt-media-zoom-x, 50%) var(--prompt-media-zoom-y, 50%);
    transition: opacity 160ms ease, transform 180ms ease;
}

    .prompt-media-lightbox-image.is-loading {
        cursor: default;
    }

    .prompt-media-lightbox-image.is-zoomed {
        cursor: zoom-out;
        transform: scale(2);
    }


/* =========================================================
   Каталог в верхней навигации
   Категории + популярные теги
   ========================================================= */

.catalog-nav-item {
    position: relative;
    display: flex;
    align-items: center;
}

.catalog-nav-main-link {
    padding-right: 4px !important;
}

.catalog-nav-dropdown {
    position: static;
}

.catalog-nav-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 34px;
    margin-left: 1px;
    padding: 0;
    color: var(--notebook-muted);
    cursor: pointer;
    list-style: none;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 7px;
}

    .catalog-nav-toggle::-webkit-details-marker {
        display: none;
    }

    .catalog-nav-toggle::before {
        content: "▾";
        font-size: 0.82rem;
        line-height: 1;
        transition: transform 150ms ease;
    }

    .catalog-nav-toggle:hover,
    .catalog-nav-toggle:focus-visible {
        color: var(--notebook-ink);
        background: rgba(238, 234, 255, 0.72);
        border-color: rgba(36, 36, 36, 0.55);
        outline: none;
    }

.catalog-nav-dropdown[open] .catalog-nav-toggle::before {
    transform: rotate(180deg);
}

.catalog-nav-mega {
    position: absolute;
    z-index: 1050;
    top: calc(100% + 10px);
    left: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 22px 26px;
    width: min(720px, calc(100vw - 32px));
    padding: 21px;
    background: rgba(255, 255, 255, 0.99);
    border: 1.5px solid rgba(36, 36, 36, 0.82);
    border-radius: 12px;
    box-shadow: 5px 6px 0 rgba(36, 36, 36, 0.14);
}

    .catalog-nav-mega::before {
        position: absolute;
        top: -8px;
        left: 62px;
        width: 76px;
        height: 17px;
        content: "";
        pointer-events: none;
        background: rgba(169, 154, 244, 0.48);
        transform: rotate(-2deg);
    }

.catalog-nav-section {
    min-width: 0;
}

.catalog-nav-section-title {
    margin-bottom: 10px;
    padding-bottom: 8px;
    color: var(--notebook-muted);
    border-bottom: 1px dashed rgba(36, 36, 36, 0.34);
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.055em;
}

.catalog-nav-list {
    display: grid;
    gap: 4px;
}

.catalog-nav-menu-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-width: 0;
    padding: 7px 9px;
    color: var(--notebook-ink);
    border: 1px solid transparent;
    border-radius: 7px;
    font-size: 0.88rem;
    font-weight: 600;
    line-height: 1.3;
    text-decoration: none;
}

    .catalog-nav-menu-link > span:first-child {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .catalog-nav-menu-link:hover,
    .catalog-nav-menu-link:focus-visible,
    .catalog-nav-menu-link.is-current {
        color: var(--notebook-purple-dark);
        background: rgba(238, 234, 255, 0.68);
        border-color: rgba(36, 36, 36, 0.32);
        outline: none;
    }

.catalog-nav-tag-link {
    color: #4f4690;
}

.catalog-nav-item-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    min-width: 28px;
    height: 22px;
    padding: 0 7px;
    color: var(--notebook-muted);
    background: rgba(245, 245, 244, 0.9);
    border: 1px solid rgba(36, 36, 36, 0.22);
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
}

.catalog-nav-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    grid-column: 1 / -1;
    padding-top: 13px;
    border-top: 1px dashed rgba(36, 36, 36, 0.36);
}

.catalog-nav-all-link {
    color: var(--notebook-purple-dark);
    font-weight: 700;
    text-decoration: none;
}

    .catalog-nav-all-link:hover {
        color: var(--notebook-ink);
        text-decoration: underline;
        text-underline-offset: 3px;
    }

.catalog-nav-footer-note {
    color: var(--notebook-muted);
    font-size: 0.78rem;
}

@media (max-width: 991.98px) {
    .catalog-nav-item {
        display: block;
    }

    .catalog-nav-main-link {
        display: block;
        padding-right: 44px !important;
    }

    .catalog-nav-toggle {
        position: absolute;
        top: 3px;
        right: 3px;
        width: 38px;
        height: 36px;
    }

    .catalog-nav-mega {
        position: static;
        grid-template-columns: 1fr;
        gap: 18px;
        width: 100%;
        margin: 7px 0 12px;
        padding: 17px;
        box-shadow: none;
    }

        .catalog-nav-mega::before {
            display: none;
        }

    .catalog-nav-footer {
        grid-column: auto;
        align-items: flex-start;
        flex-direction: column;
        gap: 7px;
    }
}

@media (max-width: 575.98px) {
    .catalog-nav-menu-link {
        padding: 8px;
    }

    .catalog-nav-footer-note {
        display: none;
    }
}


/* =========================================================
   Каталог в верхней навигации — hover-версия
   Стрелка убрана. На компьютере mega-menu открывается
   после короткой задержки при наведении на «Каталог».
   Сам клик по «Каталог» всегда ведёт в каталог.
   ========================================================= */

.catalog-nav-main-link {
    padding-right: var(--bs-nav-link-padding-x, 0.5rem) !important;
}

@media (min-width: 992px) {
    .catalog-nav-item {
        position: relative;
        display: flex;
        align-items: center;
    }

    .catalog-nav-mega {
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transform: translateY(5px);
        transition: opacity 140ms ease, transform 140ms ease, visibility 0s linear 140ms;
    }

    .catalog-nav-item.is-open .catalog-nav-mega {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: translateY(0);
        transition-delay: 0s;
    }
}

@media (max-width: 991.98px) {
    .catalog-nav-item {
        display: block;
    }

    .catalog-nav-main-link {
        padding-right: var(--bs-nav-link-padding-x, 0.5rem) !important;
    }

    /* На touch-экране клик по «Каталог» сразу открывает каталог.
       Mega-menu не мешает мобильной навигации. */
    .catalog-nav-mega {
        display: none;
    }
}

/* =========================================================
   Все теги — алфавитная навигация
   ========================================================= */

.catalog-nav-more-link {
    display: inline-flex;
    width: fit-content;
    margin-top: 10px;
    color: var(--notebook-purple-dark);
    font-size: 0.82rem;
    font-weight: 700;
    text-decoration: none;
}

    .catalog-nav-more-link:hover,
    .catalog-nav-more-link:focus-visible {
        color: var(--notebook-ink);
        text-decoration: underline;
        text-underline-offset: 3px;
    }

.all-tags-page {
    max-width: 1180px;
    margin-inline: auto;
}

.all-tags-heading {
    align-items: flex-end;
}

.all-tags-intro {
    max-width: 760px;
    margin: 0;
    color: var(--notebook-muted);
    line-height: 1.65;
}

.all-tags-alphabet {
    position: sticky;
    z-index: 8;
    top: 78px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 28px;
    padding: 13px 14px;
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid rgba(36, 36, 36, 0.52);
    border-radius: 10px;
    box-shadow: 2px 3px 0 rgba(36, 36, 36, 0.09);
    backdrop-filter: blur(8px);
}

.all-tags-letter-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    height: 34px;
    padding: 0 9px;
    color: var(--notebook-ink);
    background: rgba(245, 245, 244, 0.9);
    border: 1px solid rgba(36, 36, 36, 0.38);
    border-radius: 7px;
    font-size: 0.86rem;
    font-weight: 700;
    line-height: 1;
    text-decoration: none;
}

    .all-tags-letter-link:hover,
    .all-tags-letter-link:focus-visible {
        color: var(--notebook-purple-dark);
        background: var(--notebook-purple-soft);
        border-color: rgba(36, 36, 36, 0.62);
        outline: none;
    }

.all-tags-groups {
    display: grid;
    gap: 28px;
}

.all-tags-group {
    scroll-margin-top: 145px;
    padding-bottom: 28px;
    border-bottom: 1px dashed rgba(36, 36, 36, 0.34);
}

    .all-tags-group:last-child {
        padding-bottom: 0;
        border-bottom: 0;
    }

.all-tags-group-header {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 14px;
}

    .all-tags-group-header h2 {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 45px;
        height: 45px;
        margin: 0;
        color: var(--notebook-ink);
        background: var(--notebook-purple-soft);
        border: 1.5px solid rgba(36, 36, 36, 0.68);
        border-radius: 11px;
        box-shadow: 2px 2px 0 rgba(36, 36, 36, 0.1);
        font-size: 1.2rem;
        line-height: 1;
    }

    .all-tags-group-header span {
        color: var(--notebook-muted);
        font-size: 0.8rem;
        font-weight: 700;
    }

.all-tags-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.all-tags-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-width: 0;
    min-height: 46px;
    padding: 10px 12px;
    color: var(--notebook-ink);
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid rgba(36, 36, 36, 0.38);
    border-radius: 9px;
    text-decoration: none;
    transition: transform 120ms ease, border-color 120ms ease, background-color 120ms ease, box-shadow 120ms ease;
}

    .all-tags-card:hover,
    .all-tags-card:focus-visible {
        color: var(--notebook-purple-dark);
        background: rgba(238, 234, 255, 0.58);
        border-color: rgba(36, 36, 36, 0.64);
        box-shadow: 2px 2px 0 rgba(36, 36, 36, 0.08);
        outline: none;
        transform: translateY(-1px);
    }

.all-tags-card-name {
    min-width: 0;
    overflow: hidden;
    font-size: 0.88rem;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.all-tags-card-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    min-width: 28px;
    height: 23px;
    padding: 0 7px;
    color: var(--notebook-muted);
    background: rgba(245, 245, 244, 0.92);
    border: 1px solid rgba(36, 36, 36, 0.22);
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
}

.all-tags-back-row {
    margin-top: 36px;
    padding-top: 18px;
    border-top: 1px dashed rgba(36, 36, 36, 0.34);
}

@media (max-width: 991.98px) {
    .all-tags-alphabet {
        position: static;
    }

    .all-tags-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .all-tags-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 479.98px) {
    .all-tags-grid {
        grid-template-columns: 1fr;
    }

    .all-tags-letter-link {
        min-width: 34px;
        height: 32px;
        padding-inline: 8px;
    }
}


/* =========================================================
   Navbar search — глобальный поиск промптов
   ========================================================= */

.navbar-prompt-search {
    display: flex;
    align-items: center;
    flex: 0 1 290px;
    gap: 7px;
    width: min(290px, 22vw);
    margin-right: 10px;
}

.navbar-prompt-search-input {
    min-width: 0;
    height: 40px;
    padding: 8px 12px;
    font-size: 0.9rem;
    background: rgba(255, 255, 255, 0.96);
    border-color: rgba(36, 36, 36, 0.58);
    box-shadow: 1px 2px 0 rgba(36, 36, 36, 0.08);
}

    .navbar-prompt-search-input::placeholder {
        color: #858585;
    }

.navbar-prompt-search-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    padding: 0;
}

    .navbar-prompt-search-button svg {
        width: 18px;
        height: 18px;
    }

@media (min-width: 992px) and (max-width: 1199.98px) {
    .navbar-prompt-search {
        flex-basis: 205px;
        width: 205px;
        margin-right: 6px;
    }

    .navbar-prompt-search-input {
        padding-inline: 10px;
        font-size: 0.86rem;
    }
}

@media (max-width: 991.98px) {
    .navbar-prompt-search {
        width: 100%;
        margin: 14px 0 12px;
    }

    .navbar-prompt-search-input {
        height: 44px;
    }

    .navbar-prompt-search-button {
        flex-basis: 44px;
        width: 44px;
        height: 44px;
    }
}


/* =========================================================
   Поддержка автора — финальная корректировка контраста
   ========================================================= */

.prompt-detail-sidebar .author-support-sidebar {
    color: var(--notebook-ink);
    background: rgba(255, 255, 255, 0.99);
    border: 1.5px solid rgba(36, 36, 36, 0.82);
    box-shadow: 4px 5px 0 rgba(36, 36, 36, 0.13);
    opacity: 1 !important;
    filter: none !important;
}

    .prompt-detail-sidebar .author-support-sidebar::before {
        background: rgba(169, 154, 244, 0.58);
    }

    .prompt-detail-sidebar .author-support-sidebar h2 {
        color: var(--notebook-ink);
    }

    .prompt-detail-sidebar .author-support-sidebar p {
        color: #5f5f5f;
    }

    .prompt-detail-sidebar .author-support-sidebar .author-support-card-kicker {
        color: var(--notebook-purple-dark);
        opacity: 1;
    }

    .prompt-detail-sidebar .author-support-sidebar .author-support-open-button {
        color: var(--notebook-ink);
        background: #fff;
        border-color: var(--notebook-ink);
        box-shadow: 2px 2px 0 var(--notebook-ink);
        opacity: 1;
    }

.author-support-profile-card {
    border-color: rgba(36, 36, 36, 0.68);
    box-shadow: 3px 4px 0 rgba(36, 36, 36, 0.12);
    opacity: 1 !important;
    filter: none !important;
}

/* Не поворачиваем карточку поддержки автора:
   transform делает текст визуально размытым */
.author-support-sidebar {
    transform: none !important;
}
