/* Admin responsive rules */

@media (max-width: 1200px) {
    .auth-shell {
        grid-template-columns: 1fr;
        min-height: auto;
    }

    .auth-intro {
        display: none;
    }

    .admin-layout {
        grid-template-columns: 1fr;
    }

    .admin-sidebar-collapsed .admin-layout {
        grid-template-columns: 1fr;
    }

    .sidebar {
        position: fixed;
        z-index: 30;
        top: 0;
        right: auto;
        bottom: 0;
        left: 0;
        width: min(76vw, 280px);
        height: 100vh;
        max-width: 280px;
        padding: 18px 14px;
        transform: translateX(-100%);
        visibility: hidden;
        pointer-events: none;
        transition: transform 180ms ease;
        box-shadow: 22px 0 44px rgba(15, 23, 42, 0.22);
    }

    .sidebar-collapse-toggle {
        display: none;
    }

    .admin-sidebar-collapsed .sidebar {
        padding: 18px 14px;
    }

    .admin-sidebar-collapsed .sidebar-head {
        justify-content: space-between;
    }

    .admin-sidebar-collapsed .brand {
        display: block;
    }

    .admin-sidebar-collapsed .brand span,
    .admin-sidebar-collapsed .sidebar nav a span,
    .admin-sidebar-collapsed .sidebar-group-title {
        position: static;
        width: auto;
        height: auto;
        margin: 0;
        padding: 0;
        overflow: visible;
        clip: auto;
        white-space: normal;
        border: 0;
    }

    .admin-sidebar-collapsed .sidebar nav a {
        justify-content: flex-start;
        padding: 8px 9px;
    }

    .admin-sidebar-collapsed .sidebar nav a i {
        width: 20px;
        font-size: 1rem;
    }

    .admin-menu-open .sidebar {
        transform: translateX(0);
        visibility: visible;
        pointer-events: auto;
    }

    .admin-menu-overlay {
        position: fixed;
        z-index: 25;
        inset: 0;
        display: block;
        pointer-events: none;
        background: rgba(15, 23, 42, 0);
        transition: background 180ms ease;
    }

    .admin-menu-open .admin-menu-overlay {
        pointer-events: auto;
        background: rgba(15, 23, 42, 0.5);
    }

    .admin-menu-toggle {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 6px;
        min-height: 36px;
        padding: 7px 10px;
        border: 1px solid rgba(255, 255, 255, 0.4);
        border-radius: 7px;
        background: rgba(255, 255, 255, 0.1);
        color: white;
        font-weight: 800;
        line-height: 1;
    }

    .admin-menu-toggle i {
        font-size: 1.35rem;
        line-height: 1;
    }

    .topbar {
        justify-content: space-between;
    }

    .metric-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dashboard-grid,
    .student-response-grid,
    .home-notice-grid,
    .editor-grid {
        grid-template-columns: 1fr;
    }

    .institution-admin-grid,
    .institution-field-grid,
    .institution-repeat-grid {
        grid-template-columns: 1fr;
    }

    .institution-field-grid > div:nth-child(3),
    .institution-field-grid > div:nth-child(4) {
        grid-column: auto;
    }

    .institution-editor-section-head {
        align-items: stretch;
        flex-direction: column;
    }

    .editor-side {
        position: static;
        order: -1;
    }

    .news-admin-item {
        grid-template-columns: 32px minmax(0, 1fr);
    }

    .news-admin-actions {
        grid-column: 1 / -1;
        justify-content: flex-start;
        min-width: 0;
    }

    .admin-form-grid,
    .document-upload-form,
    .users-form-grid > div,
    .users-form-grid > div:nth-child(2),
    .tag-form-grid > div:first-child,
    .tag-form-grid > .form-action-cell,
    .menu-form-grid > div,
    .menu-form-grid > div:nth-child(3),
    .menu-form-grid > div:nth-child(4),
    .menu-form-grid > .form-check-cell,
    .menu-form-grid > .form-action-cell,
    .internal-person-form > div,
    .internal-person-form > div:first-child,
    .internal-person-form > div:nth-child(8),
    .internal-person-form > div:nth-child(11),
    .internal-person-form > .form-action-cell,
    .internal-event-form > div,
    .internal-event-form > div:first-child,
    .internal-event-form > div:nth-child(8),
    .internal-event-form > div:nth-child(9),
    .internal-event-form > .form-action-cell {
        grid-column: 1 / -1;
    }

    .admin-form-grid {
        grid-template-columns: 1fr;
    }

    .form-action-cell,
    .form-check-cell {
        align-items: stretch;
    }

    .split-actions {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }

    .admin-list-card,
    .admin-list-card.menu-card {
        grid-template-columns: 1fr;
    }

    .student-course-card {
        grid-template-columns: 1fr;
        align-items: stretch;
    }

    .student-course-thumb,
    .student-course-thumb-fallback {
        width: 100%;
    }

    .student-course-card > .btn {
        width: 100%;
        justify-self: stretch;
    }

    .user-directory-card {
        grid-template-columns: 1fr;
    }

    .document-access-options,
    .document-rule-grid,
    .document-summary-grid,
    .document-upload-form,
    .document-edit-grid,
    .education-grid,
    .education-course-form,
    .education-course-advanced-grid,
    .education-picker-toolbar,
    .education-lesson-form,
    .education-module-form,
    .education-user-picker,
    .education-course-intro,
    .education-admin-nav,
    .education-student-overview,
    .education-lesson-row,
    .education-watch-layout,
    .education-builder-layout,
    .education-course-builder,
    .education-player-layout,
    .education-certificate-center-grid,
    .certificate-capability-grid,
    .education-playlist-row,
    .education-module-card > header,
    .education-quick-lesson-form,
    .education-lesson-inline-form,
    .education-sequence-form,
    .education-sequence-extra-grid,
    .education-attendance-date,
    .education-attendance-row,
    .education-attendance-status,
    .education-certificate-settings,
    .education-certificate-checks,
    .education-report-filter,
    .education-report-summary,
    .education-student-report-tools,
    .education-report-row,
    .education-report-dates div,
    .education-student-report-row,
    .education-student-report-row summary,
    .education-student-progress-detail,
    .education-student-activity-head,
    .education-student-activity-list article,
    .education-modal-form,
    .education-modal-form footer {
        grid-template-columns: 1fr;
    }

    .education-admin-details-summary {
        grid-template-columns: 42px minmax(0, 1fr);
    }

    .education-admin-details-summary em {
        grid-column: 2;
        justify-self: start;
    }

    .education-lesson-inline-form > * {
        grid-column: 1 / -1;
    }

    .education-report-head,
    .education-student-report-head,
    .education-student-activity-head {
        display: none;
    }

    .education-player-layout {
        grid-template-columns: 1fr;
        grid-template-areas:
            "content"
            "playlist";
        width: 100%;
        max-width: 100%;
        gap: 14px;
    }

    .education-player-layout:has(.education-playlist-toggle:not([open])) {
        grid-template-columns: minmax(0, 1fr);
    }

    .education-player-layout.is-student-view,
    .education-player-layout.is-student-view:has(.education-playlist-toggle:not([open])) {
        grid-template-columns: minmax(0, 1fr);
        grid-template-areas:
            "content"
            "playlist";
        width: 100%;
        max-width: 100%;
    }

    .education-preview-banner {
        display: grid;
        align-items: stretch;
    }

    .education-material-form-panel {
        position: static;
    }

    .education-playlist-sidebar {
        position: static;
        width: 100%;
        min-width: 0;
    }

    .education-sidebar-scroll {
        max-height: 260px;
        padding: 10px;
    }

    .education-playlist-row {
        gap: 10px;
    }

    .education-playlist-row.is-next {
        padding: 12px;
    }

    .education-playlist-main {
        grid-template-columns: 32px minmax(0, 1fr);
    }

    .education-playlist-main > span:first-child {
        width: 32px;
        height: 32px;
    }

    .education-module-actions,
    .education-lesson-actions {
        justify-content: flex-start;
    }

    .education-lesson-actions .btn,
    .education-lesson-actions form,
    .education-lesson-actions button {
        width: 100%;
    }

    .education-public-page .education-course-presentation {
        gap: 0;
        padding: 16px;
    }

    .education-public-page .education-course-presentation-media {
        display: none;
    }

    .education-public-page .education-playlist-panel {
        padding: 18px 16px;
    }

    .education-public-page .education-playlist-panel.is-student-playlist .education-module-card > header {
        padding: 0 0 14px;
    }

    .education-public-page .education-playlist-panel.is-student-playlist .education-playlist-lessons {
        padding: 0;
    }

    .education-public-page .education-playlist-panel.is-student-playlist .education-playlist-row {
        grid-template-columns: 1fr;
        gap: 12px;
        padding: 14px;
    }

    .education-public-page .education-playlist-panel.is-student-playlist .education-playlist-main {
        grid-template-columns: 38px minmax(0, 1fr);
        align-items: start;
    }

    .education-public-page .education-playlist-panel.is-student-playlist .education-playlist-main strong {
        overflow-wrap: anywhere;
        font-size: 0.95rem;
    }

    .education-public-page .education-playlist-panel.is-student-playlist .education-lesson-actions {
        width: 100%;
    }

    .education-public-page .education-playlist-panel.is-student-playlist .education-lesson-actions .btn,
    .education-public-page .education-playlist-panel.is-student-playlist .education-lesson-actions a {
        justify-content: center;
        width: 100%;
        white-space: normal;
    }

    .education-player-nav {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .education-document-card {
        grid-template-columns: 1fr;
        grid-template-areas:
            "heading"
            "content"
            "footer";
    }

    .education-document-card .education-block-text img {
        max-width: min(260px, 100%);
    }

    .education-document-footer {
        min-height: 0;
    }

    .education-document-actions,
    .education-document-actions .btn {
        width: 100%;
    }

    .education-player-nav > a:last-child,
    .education-player-nav > a:first-child {
        justify-self: stretch;
    }

    .education-course-form > div,
    .education-lesson-form > div,
    .education-module-form > div,
    .education-course-form > .education-course-title-field,
    .education-course-form > .education-course-summary-field,
    .education-course-form > div:first-child,
    .education-course-form > div:nth-child(4),
    .education-lesson-form > div:first-child,
    .education-lesson-form > div:nth-child(3),
    .education-lesson-form > div:nth-child(4),
    .education-module-form .grid-span-2 {
        grid-column: 1 / -1;
    }

    .education-lesson-actions {
        justify-content: flex-start;
    }

    .education-certificate-settings .grid-span-2,
    .education-certificate-settings .form-action-cell {
        grid-column: auto;
    }

    .education-certificate-card {
        grid-template-columns: 52px minmax(0, 1fr);
        align-items: start;
    }

    .education-certificate-card-actions {
        grid-column: 1 / -1;
        justify-content: stretch;
    }

    .education-certificate-card-actions .btn {
        flex: 1 1 140px;
        justify-content: center;
    }

    .education-certificate-sheet {
        width: 297mm;
        height: 210mm;
        max-width: none;
        min-height: 0;
    }

    .education-certificate-copy {
        gap: 10px;
        transform: none;
        overflow: hidden;
    }

    .education-certificate-heading > span {
        font-size: 1.2rem;
    }

    .education-certificate-copy h2 {
        font-size: 1.25rem;
    }

    .education-certificate-nature,
    .education-certificate-details {
        font-size: 0.7rem;
    }

    .education-certificate-copy > div {
        width: min(100%, 238mm);
        font-size: clamp(1.05rem, 1.8vw, 1.32rem);
        line-height: 1.48;
    }

    .education-certificate-footnote {
        align-items: flex-end;
        font-size: 0.72rem;
        overflow: hidden;
    }

    .education-certificate-footnote-text p {
        font-size: 0.6rem;
    }

    .education-certificate-qr {
        width: 110px;
    }

    .education-certificate-program-sheet {
        gap: 12px;
    }

    .education-certificate-program-summary {
        grid-template-columns: 1fr;
    }

    .education-certificate-program-list {
        grid-template-columns: 1fr;
        font-size: 0.8rem;
        line-height: 1.3;
    }

    .education-certificate-name-form,
    .education-certificate-name-requests article {
        grid-template-columns: 1fr;
        flex-direction: column;
        align-items: stretch;
    }

    .users-hero,
    .users-panel-heading {
        align-items: stretch;
        flex-direction: column;
    }

    .users-metrics,
    .users-command-grid,
    .users-directory-toolbar,
    .user-row-header,
    .user-access-grid,
    .events-admin-metrics,
    .events-admin-board,
    .events-form-grid,
    .events-admin-item,
    .events-admin-item-main dl,
    .users-create-form,
    .pending-user-row,
    .user-profile-form,
    .user-role-form,
    .user-pages-form,
    .user-password-form,
    .users-check-options > div,
    .users-check-options.compact > div,
    .responsibility-options {
        grid-template-columns: 1fr;
    }

    .user-action-panel-wide {
        grid-column: auto;
    }

    .users-filter-summary {
        justify-content: flex-start;
        min-width: 0;
    }

    .users-filter-tabs {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
    }

    .user-status-stack {
        justify-content: flex-start;
    }

    .events-admin-hero,
    .events-card-heading {
        align-items: stretch;
        flex-direction: column;
    }

    .events-admin-guide {
        border-top: 1px solid var(--line);
        border-left: 0;
    }

    .events-admin-tabs {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
    }

    .events-admin-item > img,
    .events-admin-placeholder {
        width: 100%;
    }

    .events-admin-actions .btn,
    .events-form-actions .btn,
    .events-admin-item-actions,
    .events-admin-item-actions .btn,
    .events-admin-item-actions form,
    .events-admin-item-actions form button {
        width: 100%;
    }

    .user-manage-drawer > summary,
    .user-stacked-form .btn {
        width: 100%;
    }

    .users-hero .btn,
    .users-create-form .btn,
    .pending-user-row .btn,
    .user-profile-form .btn,
    .user-role-form .btn,
    .user-pages-form .btn,
    .user-password-form .btn,
    .user-status-form,
    .user-status-form .btn {
        width: 100%;
    }

    .document-row {
        grid-template-columns: 52px minmax(0, 1fr);
    }

    .document-actions,
    .document-row-access {
        grid-column: 1 / -1;
    }

    .forum-heading {
        display: grid;
    }

    .forum-heading h1 {
        font-size: 1.6rem;
    }

    .forum-heading-actions {
        justify-content: stretch;
    }

    .forum-heading-actions .btn,
    .forum-heading-actions form {
        width: 100%;
    }

    .forum-area-grid,
    .forum-summary-strip,
    .forum-compose-form {
        grid-template-columns: 1fr;
    }

    .forum-topic-item {
        grid-template-columns: 1fr;
        align-items: stretch;
    }

    .forum-topic-actions {
        justify-content: flex-start;
    }

    .forum-message {
        grid-template-columns: 36px minmax(0, 1fr);
        gap: 9px;
    }

    .forum-reply-branch.is-child-reply {
        margin-left: 14px;
        padding-left: 10px;
    }

    .forum-avatar {
        width: 36px;
        height: 36px;
        font-size: 0.85rem;
    }

    .forum-message-body header {
        display: grid;
    }

    .forum-reply-dock {
        justify-content: stretch;
    }

    .forum-reply-dock .btn {
        width: 100%;
    }

    .forum-modal {
        align-items: flex-end;
        padding: 0;
    }

    .forum-modal-dialog {
        width: 100%;
        max-height: 90vh;
        border-radius: 8px 8px 0 0;
    }

    .document-actions {
        justify-content: flex-start;
    }

    .admin-list-actions {
        justify-content: flex-start;
        min-width: 0;
    }

    .internal-search-form,
    .participant-add-form {
        align-items: stretch;
        flex-direction: column;
        min-width: 0;
    }

    .guardian-fields,
    .input-action-row {
        grid-template-columns: 1fr;
    }

    .guardian-fields > div,
    .guardian-fields > div:nth-child(2) {
        grid-column: 1 / -1;
    }

    .person-register-head,
    .person-registration-form {
        grid-template-columns: 1fr;
    }

    .person-register-head {
        display: grid;
        padding: 18px;
    }

    .person-register-head strong {
        justify-self: start;
    }

    .person-form-main,
    .person-form-side {
        padding: 16px;
    }

    .person-form-side {
        border-top: 1px solid var(--line);
        border-left: 0;
    }

    .person-field-grid,
    .profile-field-grid,
    .profile-consent-grid,
    .profile-password-grid,
    .person-form-section .guardian-grid {
        grid-template-columns: 1fr;
    }

    .profile-complete-form {
        padding: 16px;
    }

    .profile-form-section {
        padding: 14px;
    }

    .person-field-grid > div,
    .person-field-grid > .field-wide {
        grid-column: 1 / -1;
    }

    .person-section-title {
        align-items: flex-start;
    }

    .tag-editor-panel {
        grid-template-columns: 1fr;
        align-items: stretch;
    }

    .taxonomy-editor-panel {
        grid-template-columns: 1fr;
        align-items: stretch;
    }

    .taxonomy-category-form,
    .taxonomy-tag-form {
        grid-template-columns: 1fr;
    }

    .taxonomy-actions {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }

    .taxonomy-table {
        border: 0;
        border-radius: 0;
        gap: 10px;
        overflow: visible;
    }

    .taxonomy-row-head {
        display: none;
    }

    .taxonomy-row,
    .taxonomy-tag-table .taxonomy-row {
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 10px;
        padding: 14px;
        border: 1px solid var(--line);
        border-radius: 8px;
    }

    .taxonomy-row > div:nth-child(2) {
        grid-column: 1 / -1;
    }

    .taxonomy-row > div:nth-child(2)::before {
        content: "Pai: ";
        color: var(--muted);
        font-weight: 800;
    }

    .taxonomy-tag-table .taxonomy-row > div:nth-child(2) {
        grid-column: auto;
    }

    .taxonomy-tag-table .taxonomy-row > div:nth-child(2)::before {
        content: "";
    }

    .taxonomy-row-actions {
        grid-column: 1 / -1;
    }

    .taxonomy-table:not(.taxonomy-tag-table) .taxonomy-row > div:nth-child(3) {
        grid-column: 2;
        grid-row: 1;
    }

    .taxonomy-table:not(.taxonomy-tag-table) .taxonomy-row > div:nth-child(4) {
        grid-column: 1 / -1;
    }

    .tag-editor-form {
        grid-template-columns: 1fr;
    }

    .tag-card-grid {
        grid-template-columns: 1fr;
    }

    .category-editor-panel {
        grid-template-columns: 1fr;
        align-items: stretch;
    }

    .category-editor-form {
        grid-template-columns: 1fr;
    }

    .category-editor-form .form-label,
    .category-description-field,
    .category-actions {
        grid-column: 1 / -1;
    }

    .category-card-grid {
        grid-template-columns: 1fr;
    }

    .category-card-main {
        grid-template-columns: 1fr;
    }

    .order-badge {
        width: 100%;
        height: 34px;
        justify-content: start;
        padding: 0 12px;
    }

    .status-board {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 560px) {
    .auth-page {
        padding: 14px;
        place-items: start center;
    }

    .auth-shell {
        width: 100%;
    }

    .auth-card,
    .panel {
        padding: 18px;
    }

    .education-certificate-sheet-panel {
        margin-right: -18px;
        margin-left: -18px;
        padding: 0 18px 8px;
        overflow-x: hidden;
        --certificate-mobile-scale: 0.45;
    }

    .education-certificate-sheet {
        width: 297mm;
        height: 210mm;
        max-width: none;
        margin-left: 0;
        margin-right: 0;
        transform: scale(var(--certificate-mobile-scale));
        transform-origin: top left;
        margin-bottom: calc((var(--certificate-mobile-scale) - 1) * 210mm);
    }

    .education-certificate-copy {
        gap: 10px;
        transform: none;
        overflow: hidden;
    }

    .education-certificate-heading > span {
        font-size: clamp(1.7rem, 3vw, 2.45rem);
    }

    .education-certificate-copy h2,
    .education-certificate-program-header h2 {
        font-size: clamp(1.35rem, 2.35vw, 2rem);
    }

    .education-certificate-nature {
        margin: -8px 0 0;
        font-size: clamp(0.78rem, 1vw, 0.92rem);
        letter-spacing: 0.08em;
    }

    .education-certificate-copy > div {
        width: min(100%, 238mm);
        font-size: clamp(1.05rem, 1.8vw, 1.32rem);
        line-height: 1.48;
    }

    .education-certificate-details {
        gap: 5px 12px;
        font-size: 0.78rem;
        line-height: 1.35;
    }

    .education-certificate-copy footer {
        padding-top: 12px;
    }

    .education-certificate-copy footer strong {
        font-size: 1.2rem;
    }

    .education-certificate-footnote {
        gap: 8px 18px;
        padding-top: 0;
        font-size: 0.76rem;
        overflow: hidden;
    }

    .education-certificate-footnote-text {
        gap: 4px;
    }

    .education-certificate-institution,
    .education-certificate-footnote-meta {
        gap: 4px 14px;
    }

    .education-certificate-footnote-text p {
        font-size: 0.64rem;
        line-height: 1.25;
    }

    .education-certificate-qr {
        width: 108px;
        margin-top: 0;
        font-size: 0.5rem;
    }

    .education-certificate-qr img {
        width: 78px;
        height: 78px;
    }

    .education-certificate-program-sheet {
        gap: 18px;
    }

    .education-certificate-program-header {
        padding-bottom: 14px;
    }

    .education-certificate-program-extra {
        padding: 10px 14px;
        font-size: 0.9rem;
        line-height: 1.45;
    }

    .education-certificate-program-summary {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
        gap: 10px;
    }

    .education-certificate-program-summary article {
        padding: 10px 12px;
        font-size: 0.78rem;
        line-height: 1.32;
    }

    .education-certificate-program-summary h3 {
        font-size: 0.78rem;
    }

    .education-certificate-program-list {
        grid-template-columns: repeat(var(--certificate-program-columns, 2), minmax(0, 1fr));
        gap: 14px 24px;
        font-size: 0.84rem;
        line-height: 1.35;
    }

    .education-certificate-program-columns-3 .education-certificate-program-list,
    .education-certificate-program-columns-4 .education-certificate-program-list {
        gap: 12px 18px;
        font-size: 0.78rem;
        line-height: 1.28;
    }

    .education-certificate-program-columns-4 .education-certificate-program-list {
        gap: 10px 14px;
        font-size: 0.72rem;
        line-height: 1.22;
    }

    .auth-actions {
        display: grid;
    }

    .content {
        padding: 18px;
    }

    .topbar {
        align-items: stretch;
        flex-wrap: wrap;
        padding: 14px 16px;
    }

    .topbar > div {
        min-width: 0;
    }

    .metric-grid,
    .sidebar nav {
        grid-template-columns: 1fr;
    }

    .brand {
        font-size: 1.08rem;
        margin-bottom: 18px;
    }

    .sidebar nav a {
        gap: 8px;
        padding: 8px 9px;
        font-size: 0.94rem;
    }

    .page-heading {
        align-items: stretch;
        flex-direction: column;
    }

    .certificate-toolbar {
        display: grid;
        grid-template-columns: 1fr;
    }

    .certificate-toolbar h1 {
        max-width: none;
    }

    .certificate-toolbar-actions {
        justify-items: stretch;
    }

    .certificate-toolbar-primary {
        display: grid;
        grid-template-columns: 1fr;
    }

    .certificate-toolbar .btn,
    .certificate-toolbar-primary .inline-form,
    .certificate-toolbar-primary .inline-form .btn {
        width: 100%;
    }

    .page-heading .btn {
        width: 100%;
    }

    .news-admin-title {
        display: grid;
        gap: 8px;
    }

    .news-bulk-form {
        align-items: stretch;
        flex-direction: column;
    }

    .bulk-actions,
    .bulk-actions .btn {
        width: 100%;
    }

    .bulk-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .news-admin-meta {
        grid-template-columns: 1fr;
    }

    .news-admin-actions {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }

    .news-admin-actions .btn,
    .news-admin-actions .inline-form,
    .news-admin-actions .inline-form button {
        width: 100%;
    }

    .metric-card {
        padding: 16px;
    }

    .metric-card strong {
        font-size: 1.6rem;
    }

    .status-board {
        grid-template-columns: 1fr;
    }

    .mini-chart {
        justify-content: space-between;
        gap: 8px;
        overflow-x: auto;
        padding-bottom: 4px;
    }

    .mini-chart div {
        min-width: 34px;
    }

    .section-heading {
        align-items: stretch;
        flex-direction: column;
    }

    .education-lesson-edit-panel .section-heading {
        grid-template-columns: 1fr;
    }

    .education-lesson-edit-panel .section-heading .btn {
        grid-column: 1;
        grid-row: auto;
    }

    .education-image-inputs {
        grid-template-columns: 1fr;
    }

    .section-heading .btn,
    .split-actions .btn,
    .split-actions a,
    .form-action-cell > .btn {
        width: 100%;
    }

    .admin-list-title-row {
        display: grid;
        gap: 8px;
    }

    .admin-list-meta,
    .compact-list .admin-list-meta {
        grid-template-columns: 1fr;
    }

    .admin-list-actions {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }

    .admin-list-actions .btn,
    .admin-list-actions .inline-form,
    .admin-list-actions .inline-form button,
    .password-reset-row .btn {
        width: 100%;
    }

    .document-actions {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }

    .document-actions .btn,
    .document-actions .inline-form,
    .document-actions .inline-form button {
        width: 100%;
    }

    .user-card .admin-list-actions {
        grid-template-columns: 1fr;
    }

    .user-action-heading {
        display: grid;
        gap: 3px;
    }

    .user-action-heading span {
        text-align: left;
    }

    .user-management-block .password-reset-row,
    .user-management-block .user-action-panel:last-child .password-reset-row,
    .user-management-block .responsibility-options,
    .user-profile-form,
    .user-role-options > div,
    .user-role-options.compact {
        grid-template-columns: 1fr;
    }

    .responsibility-form {
        min-width: 0;
    }

    .tag-editor-panel {
        gap: 14px;
    }

    .tag-editor-panel p {
        font-size: 0.92rem;
    }

    .tag-card {
        padding: 14px;
    }

    .tag-card-main {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .tag-count {
        grid-template-columns: auto 1fr;
        justify-content: start;
        justify-items: start;
        min-width: 0;
        gap: 8px;
    }

    .tag-count span {
        align-self: center;
    }

    .category-editor-panel {
        gap: 14px;
    }

    .category-card {
        padding: 14px;
    }

    .editor-side {
        padding-bottom: 96px;
    }

    .editor-actions {
        position: fixed;
        z-index: 20;
        right: 0;
        bottom: 0;
        left: 0;
        grid-template-columns: 1fr 1fr;
        padding: 10px;
        border-top: 1px solid var(--line);
        background: rgba(255, 255, 255, 0.96);
        box-shadow: 0 -10px 24px rgba(15, 23, 42, 0.12);
    }

    .rich-toolbar {
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .rich-toolbar button {
        flex: 0 0 auto;
    }

    .rich-editor {
        min-height: 360px;
        padding: 14px;
        font-size: 1rem;
    }

    .form-control,
    .form-select,
    .btn {
        min-height: 42px;
    }

    .password-reset-row {
        grid-template-columns: 1fr;
        min-width: 0;
    }

    .registration-control {
        align-items: stretch;
        flex-direction: column;
    }

    .registration-control .btn {
        width: 100%;
    }

    .institution-editor-nav {
        margin-inline: -4px;
    }

    .institution-tag-picker,
    .gallery-editor-fields,
    .gallery-editor-fields-wide {
        grid-template-columns: 1fr;
    }

    .gallery-editor-card {
        grid-template-columns: 1fr;
    }

    .gallery-editor-card .btn {
        width: 100%;
    }

    .institution-admin-card dl,
    .institution-admin-actions,
    .institution-save-bar,
    .institution-edit-heading .split-actions {
        grid-template-columns: 1fr;
        flex-direction: column;
    }

    .institution-save-bar {
        right: 10px;
        bottom: 10px;
        left: 10px;
        display: grid;
    }

    .institution-save-bar .btn,
    .institution-edit-heading .btn {
        width: 100%;
    }

    .education-course-forum .forum-topic-item,
    .education-forum-reply-form {
        grid-template-columns: 1fr;
    }

    .education-forum-replies,
    .education-forum-reply-form {
        padding-left: 0;
    }

    .education-forum-reply-children {
        margin-left: 8px;
        padding-left: 10px;
    }
}

@media (max-width: 640px) {
    html,
    body {
        overflow-x: hidden;
    }

    .admin-layout,
    .main-panel,
    .content {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    .content {
        padding: 10px 8px;
    }

    .topbar {
        min-height: auto;
        padding: 8px;
        gap: 8px;
    }

    .topbar .btn,
    .admin-menu-toggle {
        min-height: 34px;
        padding: 6px 8px;
        font-size: 0.78rem;
    }

    .education-lesson-heading {
        gap: 10px;
        margin-bottom: 12px;
    }

    .education-lesson-heading h1 {
        font-size: 1rem;
        line-height: 1.2;
    }

    .education-lesson-heading p,
    .education-block-type,
    .education-playlist-title span {
        font-size: 0.68rem;
    }

    .education-lesson-heading .heading-actions {
        gap: 7px;
    }

    .education-player-layout {
        gap: 10px;
    }

    .education-block-card,
    .education-lesson-description,
    .education-course-forum,
    .education-form-board,
    .education-player-layout.is-student-view .education-block-card,
    .education-player-layout.is-student-view .education-lesson-description,
    .education-player-layout.is-student-view .education-course-forum,
    .education-player-layout.is-student-view .education-form-board {
        padding: 10px;
        border-radius: 7px;
    }

    .education-course-forum.education-admin-details,
    .education-form-board.education-admin-details,
    .education-player-layout.is-student-view .education-course-forum.education-admin-details,
    .education-player-layout.is-student-view .education-form-board.education-admin-details {
        padding: 0;
    }

    .education-lesson-description,
    .education-player-layout.is-student-view .education-lesson-description {
        gap: 10px;
        padding: 14px;
    }

    .education-lesson-description-head {
        gap: 8px;
    }

    .education-lesson-description-head span {
        width: 30px;
        height: 30px;
        border-radius: 7px;
        font-size: 0.9rem;
    }

    .education-block-heading strong,
    .education-lesson-description h2,
    .education-player-layout.is-student-view .education-lesson-description h2 {
        font-size: 0.9rem;
    }

    .education-lesson-description h2,
    .education-player-layout.is-student-view .education-lesson-description h2 {
        font-size: 1rem;
    }

    .education-block-text {
        font-size: 0.82rem;
        line-height: 1.5;
    }

    .education-lesson-description-text {
        font-size: 0.88rem;
        line-height: 1.58;
    }

    .education-video-frame iframe,
    .education-video-frame video {
        aspect-ratio: 16 / 9;
        min-height: 0;
    }

    .education-lesson-main-image,
    .education-player-layout.is-student-view .education-lesson-main-image {
        max-height: 190px;
    }

    .education-sidebar-scroll {
        max-height: 240px;
    }

    .education-sidebar-module a {
        grid-template-columns: 18px minmax(0, 1fr) auto;
        gap: 6px;
        padding: 7px;
        font-size: 0.78rem;
    }

    .education-sidebar-module a small {
        display: none;
    }

    .education-player-nav {
        display: grid;
        gap: 8px;
    }

    .education-player-nav .btn,
    .education-player-nav a {
        justify-content: center;
        width: 100%;
        max-width: 100%;
    }
}

@media (max-width: 520px) {
    .education-certificate-sheet-panel {
        --certificate-mobile-scale: 0.414;
    }
}

@media (max-width: 480px) {
    .education-certificate-sheet-panel {
        --certificate-mobile-scale: 0.385;
    }
}

@media (max-width: 430px) {
    .education-certificate-sheet-panel {
        --certificate-mobile-scale: 0.335;
    }
}

@media (max-width: 390px) {
    .education-certificate-sheet-panel {
        --certificate-mobile-scale: 0.3;
    }
}

@media (max-width: 360px) {
    .education-certificate-sheet-panel {
        --certificate-mobile-scale: 0.288;
    }
}

@media (max-width: 640px) {
    .education-public-page {
        background: #f6f7f9;
    }

    .education-public-topbar {
        display: grid;
        gap: 10px;
        padding: 14px 16px;
    }

    .education-public-brand {
        font-size: 1rem;
        line-height: 1.2;
    }

    .education-public-topbar nav {
        display: flex;
        width: 100%;
        gap: 8px;
    }

    .education-public-topbar nav a {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-height: 36px;
        padding: 7px 10px;
        border: 1px solid rgba(255, 255, 255, 0.34);
        border-radius: 6px;
        font-size: 0.9rem;
        line-height: 1.15;
    }

    .education-public-content {
        width: 100%;
        padding: 16px 10px 30px;
    }

    .education-public-page .education-course-page {
        display: grid;
        gap: 14px;
    }

    .education-public-page .page-heading {
        display: grid;
        gap: 12px;
        align-items: start;
        margin: 0;
        padding: 0 2px;
    }

    .education-public-page .page-heading p {
        margin: 0;
        font-size: 0.72rem;
        line-height: 1.2;
    }

    .education-public-page .page-heading h1 {
        margin: 6px 0 0;
        max-width: 100%;
        font-size: clamp(1.55rem, 8vw, 2.05rem);
        line-height: 1.08;
    }

    .education-public-page .page-heading .heading-actions {
        display: grid;
        width: 100%;
        gap: 8px;
        justify-content: stretch;
    }

    .education-public-page .page-heading .heading-actions .btn {
        width: 100%;
        min-height: 42px;
        justify-content: center;
    }

    .education-public-page .education-course-presentation {
        display: block;
        padding: 16px;
        border: 1px solid #dbeafe;
        border-radius: 8px;
        background: #ffffff;
        box-shadow: 0 10px 22px rgba(15, 23, 42, 0.07);
    }

    .education-public-page .education-course-presentation-media {
        display: none !important;
    }

    .education-public-page .education-course-presentation-body {
        display: grid;
        gap: 10px;
    }

    .education-public-page .education-course-presentation-body h2 {
        margin: 0;
        font-size: 0.74rem;
    }

    .education-public-page .education-course-presentation-body p {
        margin: 0;
        font-size: 1rem;
        line-height: 1.55;
    }

    .education-public-page .education-course-presentation-stats {
        gap: 8px;
        margin-top: 2px;
    }

    .education-public-page .education-course-presentation-stats span {
        padding: 7px 10px;
        border-radius: 7px;
        font-size: 0.85rem;
    }

    .education-public-page .education-playlist-panel {
        padding: 16px;
        border: 0;
        border-radius: 8px;
        background: #ffffff;
        box-shadow: 0 10px 22px rgba(15, 23, 42, 0.07);
    }

    .education-public-page .education-playlist-panel .section-heading {
        display: grid;
        gap: 3px;
        margin: 0 0 14px;
        padding: 0;
        border: 0;
    }

    .education-public-page .education-playlist-panel .section-heading > span:not(.eyebrow) {
        display: none;
    }

    .education-public-page .education-playlist-panel .section-heading h2 {
        margin: 0;
        font-size: 1.2rem;
        line-height: 1.2;
    }

    .education-public-page .education-playlist-panel.is-student-playlist .education-module-list {
        gap: 14px;
    }

    .education-public-page .education-playlist-panel.is-student-playlist .education-module-card {
        border: 0;
        border-radius: 0;
        background: transparent;
        box-shadow: none;
    }

    .education-public-page .education-playlist-panel.is-student-playlist .education-module-card > header {
        padding: 0 0 12px;
        border: 0;
        background: transparent;
    }

    .education-public-page .education-playlist-panel.is-student-playlist .education-module-card > header h3 {
        align-items: center;
        gap: 9px;
        font-size: 1rem;
        line-height: 1.25;
    }

    .education-public-page .education-playlist-panel.is-student-playlist .education-module-card > header h3::before {
        width: 5px;
        height: 28px;
        border-radius: 99px;
    }

    .education-public-page .education-playlist-panel.is-student-playlist .education-playlist-lessons {
        display: grid;
        gap: 10px;
        padding: 0;
    }

    .education-public-page .education-playlist-panel.is-student-playlist .education-playlist-row {
        display: grid;
        grid-template-columns: 1fr;
        gap: 14px;
        padding: 14px;
        border: 1px solid #e2e8f0;
        border-radius: 8px !important;
        background: #ffffff;
        box-shadow: none;
    }

    .education-public-page .education-playlist-panel.is-student-playlist .education-playlist-main {
        display: grid;
        grid-template-columns: 44px minmax(0, 1fr);
        gap: 12px;
        align-items: start;
        min-width: 0;
    }

    .education-public-page .education-playlist-panel.is-student-playlist .education-playlist-main > span:first-child {
        width: 44px;
        height: 44px;
        border-radius: 7px;
        font-size: 0.88rem;
    }

    .education-public-page .education-playlist-panel.is-student-playlist .education-playlist-main > span:nth-child(2) {
        min-width: 0;
    }

    .education-public-page .education-playlist-panel.is-student-playlist .education-lesson-kind {
        display: inline-flex;
        width: fit-content;
        margin: 0 0 7px;
        font-size: 0.68rem;
    }

    .education-public-page .education-playlist-panel.is-student-playlist .education-playlist-main strong {
        display: block;
        max-width: 100%;
        font-size: 1rem;
        line-height: 1.25;
        overflow-wrap: anywhere;
    }

    .education-public-page .education-playlist-panel.is-student-playlist .education-playlist-badges {
        margin-top: 9px;
        gap: 6px;
    }

    .education-public-page .education-playlist-panel.is-student-playlist .education-playlist-badges em {
        padding: 5px 8px;
        border-radius: 7px;
        font-size: 0.72rem;
        line-height: 1.1;
    }

    .education-public-page .education-playlist-panel.is-student-playlist .education-lesson-actions {
        display: grid;
        width: 100%;
    }

    .education-public-page .education-playlist-panel.is-student-playlist .education-lesson-actions .btn,
    .education-public-page .education-playlist-panel.is-student-playlist .education-lesson-actions a {
        width: 100%;
        min-height: 40px;
        justify-content: center;
        white-space: normal;
    }
}

@media (max-width: 768px) {
    .student-announcement-card {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .student-announcement-card footer {
        grid-column: 1 / -1;
        justify-content: flex-start;
    }
}