/*
 * LUMI Core CSS
 * Structured global styles for the LUMI platform.
 *
 * Sections:
 * 01. Design tokens
 * 02. Page background and local reset
 * 03. Layout
 * 04. Cards and common blocks
 * 05. Typography helpers
 * 06. Buttons
 * 07. Sidebar
 * 08. Client header
 * 09. Material cards
 * 10. Format selector
 * 11. Media slot
 * 12. Flashcard sheet
 * 13. Test helpers
 */

/* =========================================================
   01. Design tokens
   ========================================================= */

:root {
    --lumi-font-ui: "Plus Jakarta Sans", Arial, sans-serif;

    --lumi-primary: #4E52D8;
    --lumi-accent: #FF7A59;

    --lumi-bg: #ffffff;
    --lumi-bg-soft: #F5F6FF;
    --lumi-accent-soft: #FFF0ED;
    --lumi-card-bg: #ffffff;

    --lumi-text: #222222;
    --lumi-text-muted: #666666;
    --lumi-text-light: #7A7A8C;

    --lumi-border: #E4E4EF;
    --lumi-border-dashed: #CFCFD8;

    --lumi-radius-card: 14px;
    --lumi-radius-input: 16px;
    --lumi-radius-button: 28px;
    --lumi-radius-pill: 999px;

    --lumi-shadow-card: 0 4px 7px 1px rgba(0, 0, 0, 0.06);

    --lumi-sidebar-width: 280px;
    --lumi-content-max-width: 1222px;

    --lumi-page-padding: 32px;
    --lumi-layout-gap: 32px;
    --lumi-section-gap: 24px;

    --lumi-button-height: 44px;
    --lumi-button-height-large: 56px;
    --lumi-button-padding: 0 22px;
    --lumi-button-padding-large: 0 32px;
    --lumi-button-border-width: 2px;

    --lumi-button-text-dark: #111111;
    --lumi-button-white: #ffffff;
}

/* Medium desktop/laptop: optional reuse of the compact sidebar rail. */
@media (min-width: 1281px) and (max-width: 1440px) {
    body:has(.lumi-child-page) .lumi-child-page {
        --lumi-responsive-sidebar-width: 240px;
        grid-template-columns: var(--lumi-responsive-sidebar-width) minmax(0, 1fr) !important;
        transition: grid-template-columns 180ms ease;
    }

    body:has(.lumi-child-page) .lumi-child-page.is-tablet-sidebar-collapsed {
        --lumi-responsive-sidebar-width: 72px;
    }

    body:has(.lumi-child-page) .lumi-child-app-header {
        grid-template-columns: var(--lumi-responsive-sidebar-width) minmax(0, 1fr) auto minmax(0, 1fr) !important;
    }

    body:has(.lumi-child-page) .lumi-child-sidebar {
        width: var(--lumi-responsive-sidebar-width) !important;
        transition: width 180ms ease;
    }

    body:has(.lumi-child-page) .lumi-child-sidebar__toggle {
        display: flex !important;
        align-items: center;
        justify-content: flex-end;
        width: calc(100% - 24px);
        min-height: 44px;
        margin: 8px 12px 0;
        padding: 8px 10px;
        border: 1px solid #e4e4ef;
        border-radius: 6px;
        background: #ffffff;
        color: #4e52d8;
        font: inherit;
        font-size: 13px;
        font-weight: 600;
        cursor: pointer;
    }

    body:has(.lumi-child-page) .lumi-child-sidebar__toggle:focus-visible {
        outline: 2px solid #4e52d8;
        outline-offset: 2px;
    }

    body:has(.lumi-child-page) .lumi-child-sidebar__toggle-icon {
        position: relative;
        width: 20px;
        height: 20px;
        flex: 0 0 20px;
        border: 1.5px solid currentColor;
        border-radius: 3px;
        transition: transform 200ms ease-in-out;
    }

    body:has(.lumi-child-page) .lumi-child-sidebar__toggle-icon::before {
        position: absolute;
        top: 2px;
        bottom: 2px;
        left: 6px;
        border-left: 1.5px solid currentColor;
        content: "";
    }

    body:has(.lumi-child-page) .lumi-child-sidebar__toggle-icon::after {
        position: absolute;
        top: 50%;
        right: 2px;
        width: 5px;
        height: 5px;
        border-right: 1.5px solid currentColor;
        border-bottom: 1.5px solid currentColor;
        content: "";
        transform: translateY(-50%) rotate(135deg);
    }

    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-sidebar__toggle-icon::after {
        right: 2px;
        transform: translateY(-50%) rotate(135deg);
    }

    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-sidebar__toggle-icon {
        transform: rotate(180deg);
    }

    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-sidebar__toggle {
        justify-content: center;
        width: 44px;
        margin-right: 12px;
        margin-left: auto;
        padding: 8px;
    }

    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-sidebar__toggle-label,
    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-workspace-menu__badge {
        display: none !important;
    }

    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-workspace-menu__label {
        position: absolute !important;
        width: 1px !important;
        height: 1px !important;
        padding: 0 !important;
        overflow: hidden !important;
        clip: rect(0, 0, 0, 0) !important;
        white-space: nowrap !important;
        border: 0 !important;
    }

    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-workspace-menu {
        padding-top: 12px !important;
        padding-left: 0 !important;
    }

    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-workspace-menu__primary {
        align-items: center;
        width: 64px;
        margin-right: auto;
        margin-left: auto;
        padding: 6px;
        box-sizing: border-box;
    }

    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-workspace-menu__item {
        justify-content: center;
        width: 48px;
        min-height: 48px;
        margin-right: auto;
        margin-left: auto;
        padding: 12px !important;
        gap: 0;
    }

    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-sidebar,
    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-workspace-menu,
    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-workspace-menu__primary {
        overflow: visible !important;
    }

    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-app-header__brand {
        grid-column: 1 !important;
        grid-row: 1 !important;
        justify-self: center;
        margin-left: 0;
    }

    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-app-header__full-logo {
        display: none !important;
    }

    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-app-header__compact-logo {
        display: block !important;
        width: 34px !important;
        height: 34px !important;
        object-fit: contain;
    }

    body:has(.lumi-child-page) .lumi-child-page::after {
        left: var(--lumi-responsive-sidebar-width) !important;
    }

    @media (hover: hover) and (pointer: fine) {
        body:has(.lumi-child-page)
            .lumi-child-page.is-tablet-sidebar-collapsed:has(
                .lumi-child-workspace-menu__item[data-lumi-nav-label]:hover,
                .lumi-child-workspace-menu__item[data-lumi-nav-label]:focus-visible
            )
            .lumi-child-sidebar {
            z-index: 11 !important;
        }

        body:has(.lumi-child-page)
            .lumi-child-page.is-tablet-sidebar-collapsed
            .lumi-child-workspace-menu__item[data-lumi-nav-label] {
            position: relative;
        }

        body:has(.lumi-child-page)
            .lumi-child-page.is-tablet-sidebar-collapsed
            .lumi-child-workspace-menu__item[data-lumi-nav-label]::after {
            position: absolute;
            z-index: 20;
            top: 50%;
            left: calc(100% + 10px);
            width: max-content;
            max-width: 220px;
            padding: 7px 10px;
            border: 1px solid #e4e4ef;
            border-radius: 6px;
            background: #ffffff;
            color: #17172f;
            box-shadow: 0 6px 18px rgba(23, 23, 47, 0.12);
            content: attr(data-lumi-nav-label);
            font-size: 13px;
            font-weight: 600;
            line-height: 1.3;
            opacity: 0;
            pointer-events: none;
            transform: translate(4px, -50%);
            transition: opacity 140ms ease, transform 140ms ease;
            visibility: hidden;
            white-space: nowrap;
        }

        body:has(.lumi-child-page)
            .lumi-child-page.is-tablet-sidebar-collapsed
            .lumi-child-workspace-menu__item[data-lumi-nav-label]:hover::after,
        body:has(.lumi-child-page)
            .lumi-child-page.is-tablet-sidebar-collapsed
            .lumi-child-workspace-menu__item[data-lumi-nav-label]:focus-visible::after {
            opacity: 1;
            transform: translate(0, -50%);
            visibility: visible;
        }
    }
}

/* =========================================================
   02. Page background and local reset
   ========================================================= */

html,
body {
    min-height: 100%;
    font-family: var(--lumi-font-ui);
}

/*
 * Local reset only inside LUMI screens.
 * This avoids changing the whole WordPress / Elementor site.
 */

.lumi-app-shell,
.lumi-app-shell * {
    box-sizing: border-box;
}

.lumi-app-shell {
    font-family: var(--lumi-font-ui);
    color: var(--lumi-text);
}

.lumi-app-shell a {
    color: inherit;
    text-decoration: none;
}

.lumi-app-shell button,
.lumi-app-shell input,
.lumi-app-shell select,
.lumi-app-shell textarea {
    font-family: var(--lumi-font-ui);
}

/* =========================================================
   03. Layout
   ========================================================= */

.lumi-app-shell {
    display: flex;
    gap: var(--lumi-layout-gap);
    width: 100%;
    min-height: 600px;
    padding: var(--lumi-page-padding);
}

.lumi-main-content {
    flex: 1;
    width: 100%;
    max-width: var(--lumi-content-max-width);
}

/* Tablet / smaller desktop support. Mobile is not targeted yet. */
@media (max-width: 1024px) {
    .lumi-app-shell {
        gap: 24px;
        padding: 24px;
    }

    .lumi-main-content {
        max-width: none;
    }
}

/* =========================================================
   04. Cards and common blocks
   ========================================================= */

.lumi-card,
.lumi-sidebar,
.lumi-client-header,
.lumi-material-card,
.lumi-format-selector {
    background: var(--lumi-card-bg);
    border-radius: var(--lumi-radius-card);
    box-shadow: var(--lumi-shadow-card);
}

.lumi-card {
    padding: 28px 32px;
}

/* =========================================================
   05. Typography helpers
   ========================================================= */

.lumi-eyebrow {
    margin: 0 0 8px;
    color: var(--lumi-text-light);
    font-size: 13px;
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: 0.02em;
}

.lumi-section-heading {
    margin-bottom: 20px;
}

.lumi-section-heading h2 {
    margin: 0;
    color: var(--lumi-text);
    font-size: 24px;
    line-height: 1.25;
}

/* =========================================================
   06. Buttons
   ========================================================= */

/*
 * New button system.
 *
 * Use:
 * .lumi-button .lumi-button--primary
 * .lumi-button .lumi-button--accent
 * .lumi-button .lumi-button--outline-dark
 * .lumi-button .lumi-button--outline-primary
 */

button.lumi-button,
a.lumi-button,
.lumi-button {
    appearance: none !important;
    -webkit-appearance: none !important;

    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 10px;

    min-height: var(--lumi-button-height);
    padding: var(--lumi-button-padding);

    border-radius: var(--lumi-radius-button) !important;
    border: var(--lumi-button-border-width) solid transparent !important;

    font-family: var(--lumi-font-ui);
    font-size: 15px;
    font-weight: 600;
    line-height: 1;

    cursor: pointer;
    text-decoration: none !important;
    box-shadow: none !important;
    outline: none !important;
}

button.lumi-button--large,
a.lumi-button--large,
.lumi-button--large {
    min-height: var(--lumi-button-height-large);
    padding: var(--lumi-button-padding-large);
    font-size: 18px;
}

/* Filled purple: Save / Export PDF */
button.lumi-button--primary,
a.lumi-button--primary,
.lumi-button--primary {
    background: #4E52D8 !important;
    border-color: #4E52D8 !important;
    color: var(--lumi-button-white) !important;
}

/* Filled coral: Preview / Generate */
button.lumi-button--accent,
a.lumi-button--accent,
.lumi-button--accent {
    background: var(--lumi-accent) !important;
    border-color: var(--lumi-accent) !important;
    color: var(--lumi-button-white) !important;
}

/* Dark outline: Upload / Clear */
button.lumi-button--outline-dark,
a.lumi-button--outline-dark,
.lumi-button--outline-dark {
    background: var(--lumi-card-bg) !important;
    border-color: var(--lumi-button-text-dark) !important;
    color: var(--lumi-button-text-dark) !important;
}

/* Purple outline: Search LUMI library / Edit profile */
button.lumi-button--outline-primary,
a.lumi-button--outline-primary,
.lumi-button--outline-primary {
    background: var(--lumi-card-bg) !important;
    border-color: #4E52D8 !important;
    color: #4E52D8 !important;
}

button.lumi-button:hover,
button.lumi-button:focus,
button.lumi-button:active,
a.lumi-button:hover,
a.lumi-button:focus,
a.lumi-button:active,
.lumi-button:hover,
.lumi-button:focus,
.lumi-button:active {
    opacity: 0.9;
    box-shadow: none !important;
    outline: none !important;
}

/*
 * Legacy button aliases.
 * Keep these temporarily for old components.
 * New components should use .lumi-button + variant classes.
 */

button.lumi-primary-button,
.lumi-primary-button {
    appearance: none !important;
    -webkit-appearance: none !important;

    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 10px;

    min-height: var(--lumi-button-height);
    padding: var(--lumi-button-padding);

    border-radius: var(--lumi-radius-button) !important;
    border: var(--lumi-button-border-width) solid var(--lumi-primary) !important;

    background: var(--lumi-primary) !important;
    color: var(--lumi-button-white) !important;

    font-family: var(--lumi-font-ui);
    font-size: 15px;
    font-weight: 600;
    line-height: 1;

    cursor: pointer;
    text-decoration: none !important;
    box-shadow: none !important;
    outline: none !important;
}

button.lumi-secondary-button,
.lumi-secondary-button {
    appearance: none !important;
    -webkit-appearance: none !important;

    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 8px;

    min-height: 30px !important;
    height: 30px !important;
    padding: 0 12px !important;

    border-radius: 999px !important;
    border: 1px solid #4E52D8 !important;

    background: transparent !important;
    color: #4E52D8 !important;

    font-family: var(--lumi-font-ui);
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1 !important;

    cursor: pointer;
    text-decoration: none !important;
    box-shadow: none !important;
    outline: none !important;
}

button.lumi-primary-button:hover,
button.lumi-primary-button:focus,
button.lumi-primary-button:active,
.lumi-primary-button:hover,
.lumi-primary-button:focus,
.lumi-primary-button:active,
button.lumi-secondary-button:hover,
button.lumi-secondary-button:focus,
button.lumi-secondary-button:active,
.lumi-secondary-button:hover,
.lumi-secondary-button:focus,
.lumi-secondary-button:active {
    opacity: 0.9;
    box-shadow: none !important;
    outline: none !important;
}

button.lumi-secondary-button:hover,
button.lumi-secondary-button:focus,
.lumi-secondary-button:hover,
.lumi-secondary-button:focus {
    background: #4E52D8 !important;
    color: #ffffff !important;
    border-color: #4E52D8 !important;
}

button.lumi-secondary-button:active,
.lumi-secondary-button:active {
    transform: scale(1.02) !important;
    transition: transform 0.12s ease !important;
}

/* =========================================================
   07. Sidebar
   ========================================================= */

.lumi-sidebar {
    width: var(--lumi-sidebar-width);
    min-width: var(--lumi-sidebar-width);
    min-height: 520px;
    padding: 24px;
}

.lumi-sidebar-logo {
    display: none;
}

.lumi-sidebar-nav {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.lumi-sidebar-nav a {
    display: block;
    padding: 10px 14px;
    border-radius: var(--lumi-radius-card);
    color: var(--lumi-text);
    font-size: 15px;
    font-weight: 500;
}

.lumi-sidebar-nav a:hover {
    background: var(--lumi-accent-soft);
    color: var(--lumi-accent);
}

/* =========================================================
   08. Client header
   ========================================================= */

.lumi-client-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 28px 32px;
    margin-bottom: var(--lumi-section-gap);
}

.lumi-client-header h1 {
    margin: 0;
    color: var(--lumi-text);
    font-size: 32px;
    line-height: 1.2;
}

.lumi-client-meta {
    margin: 8px 0 0;
    color: var(--lumi-text-muted);
    font-size: 15px;
}

/* =========================================================
   09. Material cards
   ========================================================= */

.lumi-material-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
}

.lumi-material-card {
    padding: 24px;
}

.lumi-material-card h3 {
    margin: 0 0 10px;
    color: var(--lumi-text);
    font-size: 20px;
    line-height: 1.3;
}

.lumi-material-card p {
    margin: 0 0 20px;
    color: var(--lumi-text-muted);
    font-size: 14px;
    line-height: 1.5;
}

/* =========================================================
   10. Format selector
   ========================================================= */

.lumi-format-selector {
    padding: 0;
    margin: 0;
    background: transparent;
    border-radius: 0;
    box-shadow: none;
}

.lumi-format-options {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    width: 100%;
}

.lumi-format-group {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    gap: 6px;
    align-items: flex-start;
}

.lumi-format-group--page {
    margin-right: 6px;
}

.lumi-format-group--size {
    margin-left: 0;
    flex: 0 1 auto;
}

.lumi-format-group label {
    height: 12px;
    margin: 0;

    color: #111111;
    font-size: 11px;
    font-weight: 700;
    line-height: 12px;
    text-transform: uppercase;
}

/* Page format */

.lumi-page-format-select {
    width: 92px;
    height: 54px;
    min-height: 54px;

    padding: 0 32px 0 14px;

    border: 1px solid #E4E4EF;
    border-radius: 6px;
    background-color: #ffffff;
    color: #111111;

    font-family: var(--lumi-font-ui);
    font-size: 13px;
    font-weight: 600;

    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;

    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 7.5L10 12.5L15 7.5' stroke='%23111111' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: 15px 15px;
    background-position: right 10px center;
}

/* Page orientation */

.lumi-orientation-toggle {
    display: flex;
    align-items: flex-start;
    gap: 8px;
}

button.lumi-orientation-choice {
    appearance: none !important;
    -webkit-appearance: none !important;

    width: 54px !important;
    height: 54px !important;
    min-height: 54px !important;

    padding: 5px 6px !important;
    margin: 0 !important;

    display: inline-flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 3px !important;

    background: #ffffff !important;
    border: 1px solid #CFCFD8 !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    outline: none !important;

    color: #8A8A8A !important;

    font-family: var(--lumi-font-ui) !important;
    font-size: 8px !important;
    font-weight: 600 !important;
    line-height: 1 !important;

    cursor: pointer;
}

button.lumi-orientation-choice.is-selected {
    border-color: var(--lumi-primary) !important;
    color: var(--lumi-primary) !important;
    background: rgba(78, 82, 216, 0.04) !important;
}

.lumi-social-story__format-settings button.lumi-orientation-choice {
    width: 54px !important;
    height: 54px !important;
    min-height: 54px !important;
    padding: 0 !important;
    gap: 0 !important;
    border-color: #E4E4EF !important;
    border-radius: 8px !important;
    background: #FFFFFF !important;
    color: #A9AAB7 !important;
}

.lumi-social-story__format-settings .lumi-format-options {
    gap: 20px !important;
    width: auto;
}

.lumi-social-story__format-settings .lumi-format-group--page {
    flex: 0 0 auto !important;
    margin-right: 0;
}

.lumi-social-story__format-settings .lumi-orientation-toggle {
    gap: 6px;
}

.lumi-social-story__format-settings .lumi-card-size-control {
    gap: 8px;
}

.lumi-social-story__format-settings + .lumi-workspace-settings__field {
    margin-left: 10px;
}

.lumi-social-story__format-settings .lumi-page-format-select,
.lumi-social-story__format-settings .lumi-card-size-input,
.lumi-social-story__format-settings .lumi-card-size-unit {
    border: 1px solid #B6B9E5 !important;
    border-radius: 8px !important;
}

.lumi-social-story__format-settings
    button.lumi-orientation-choice.is-selected {
    border-color: #D8D9FF !important;
    background: #F2F2FF !important;
    color: #4E52D8 !important;
}

.lumi-social-story__format-settings .lumi-orientation-icon svg {
    width: 42px;
    height: 42px;
}

.lumi-social-story__format-settings .lumi-orientation-icon rect {
    stroke-width: 1px;
}

.lumi-social-story__format-settings
    .lumi-orientation-choice > span:not(.lumi-orientation-icon) {
    display: none;
}

.lumi-social-story__format-settings .lumi-card-size-input {
    width: 90px;
    padding: 0 14px;
    background: #FFFFFF !important;
    box-shadow: none !important;
}

.lumi-social-story__format-settings .lumi-card-size-unit {
    width: 100px;
    padding: 0 46px 0 14px;
    background-color: #FFFFFF !important;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 7.5L10 12.5L15 7.5' stroke='%23111111' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-size: 15px 15px !important;
    background-position: right 22px center !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    box-shadow: none !important;
}

.lumi-social-story__format-settings .lumi-card-size-input:focus,
.lumi-social-story__format-settings .lumi-card-size-unit:focus {
    border-color: #B6B9E5 !important;
    outline: none !important;
    box-shadow: none !important;
}

.lumi-orientation-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.lumi-orientation-icon svg {
    display: block;
    width: 16px;
    height: 16px;
}

/* Card size */

.lumi-card-size-control {
    display: flex;
    align-items: stretch;
    gap: 6px;
}

.lumi-card-size-input,
.lumi-card-size-unit {
    height: 54px;
    min-height: 54px;
    box-sizing: border-box;
    border: 1px solid #E4E4EF;
    border-radius: 6px;
    background-color: #ffffff;
    color: #111111;
    font-family: var(--lumi-font-ui);
    font-size: 13px;
    font-weight: 600;
}

.lumi-card-size-input {
    width: 160px;
    padding: 0 14px;
}

.lumi-card-size-input::placeholder {
    color: #A5A5B2;
    opacity: 1;
}

.lumi-card-size-unit {
    width: 76px;
    padding: 0 30px 0 12px;
}

.lumi-card-size-input:focus,
.lumi-card-size-unit:focus {
    border-color: var(--lumi-primary);
    outline: none;
    box-shadow: 0 0 0 2px rgba(78, 82, 216, 0.12);
}

.lumi-card-size-input.has-error {
    border-color: #D64545;
}

.lumi-card-size-error {
    max-width: 242px;
    color: #D64545;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.35;
}

.lumi-card-size-error[hidden] {
    display: none !important;
}
/* =========================================================
   11. Media slot
   ========================================================= */

/*
 * Global image/media slot.
 * The base slot is intentionally simple.
 * Flashcards currently use only the empty state.
 */

.lumi-media-slot {
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 1;

    display: flex;
    align-items: center;
    justify-content: center;

    overflow: hidden;

    background: #FFFFFF;
    border: 1px dashed #8286DE;
    border-radius: 24px;
    box-shadow: none;

    transition:
        transform 0.18s ease,
        border-color 0.2s ease,
        background-color 0.2s ease;
}

.lumi-media-slot:hover {
  transform: scale(1.02);
  border-color: #4E52D8;
  background: #FFFFFF;
}

.lumi-media-slot.lumi-media-slot--filled:hover {
  transform: none;
  border-color: #cfcfd6;
  background: #fcfcfc;
}

.lumi-media-slot--empty,
.lumi-media-slot--actions,
.lumi-media-slot--filled {
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Empty state */

.lumi-media-slot__empty-button {
    appearance: none !important;
    -webkit-appearance: none !important;

    width: 100% !important;
    height: 100% !important;

    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;

    padding: 0 !important;
    margin: 0 !important;

    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    outline: none !important;

    cursor: pointer;
}

.lumi-media-slot__empty-button:hover,
.lumi-media-slot__empty-button:focus,
.lumi-media-slot__empty-button:active {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    outline: none !important;
}

.lumi-media-slot__plus {
    position: relative;
    display: block;

    width: 54px;
    height: 54px;
    border-radius: 50%;

    background: #F4F5FF;
    font-size: 0;
    line-height: 0;

    transition: background-color 0.2s ease;
}

.lumi-media-slot__plus::before,
.lumi-media-slot__plus::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;

    background: #8286DE;
    border-radius: 999px;

    transform: translate(-50%, -50%);
    transition: background-color 0.2s ease;
}

.lumi-media-slot__plus::before {
    width: 22px;
    height: 3px;
}

.lumi-media-slot__plus::after {
    width: 3px;
    height: 22px;
}

.lumi-media-slot__empty-text {
    display: block;

    font-family: var(--lumi-font-ui);
    font-size: 13px;
    font-weight: 400;
    line-height: 1.2;

    color: #8286DE;
    transition: color 0.2s ease;
}

.lumi-media-slot:hover .lumi-media-slot__plus {
    background: #F4F5FF;
}

.lumi-media-slot:hover .lumi-media-slot__plus::before,
.lumi-media-slot:hover .lumi-media-slot__plus::after {
    background: #4E52D8;
}

.lumi-media-slot:hover .lumi-media-slot__empty-text {
    color: #4E52D8;
}
/* Uploading state */

.lumi-media-slot--uploading {
    background: #fcfcfc;
    border-color: rgba(78, 82, 216, 0.35);
    cursor: default;
}

.lumi-media-slot__uploading {
    width: 100%;
    height: 100%;
    padding: 20px;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;

    box-sizing: border-box;
    text-align: center;
}

.lumi-media-slot__uploading-spinner {
    width: 28px;
    height: 28px;

    border: 3px solid rgba(78, 82, 216, 0.18);
    border-top-color: #4E52D8;
    border-radius: 999px;

    animation: lumi-upload-spin 0.8s linear infinite;
}

.lumi-media-slot__uploading-text {
    color: #4E52D8;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.2;
}

@keyframes lumi-upload-spin {
    to {
        transform: rotate(360deg);
    }
}
/* Actions state */

.lumi-media-slot__actions {
    width: 100%;
    height: 100%;
    padding: 20px;

    display: none;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
}

.lumi-media-slot.is-active,
.lumi-media-slot.is-active:hover {
    background: #FFFFFF;
}

.lumi-media-slot.is-active .lumi-media-slot__empty-button {
    display: none !important;
}

.lumi-media-slot.is-active .lumi-media-slot__actions {
    display: flex;
}

button.lumi-media-slot__action-button.lumi-button {
    width: 68% !important;
    min-width: 150px !important;
    max-width: 220px !important;

    height: 34px !important;
    min-height: 34px !important;

    padding: 0 14px !important;
    box-sizing: border-box !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;

    background: #ffffff !important;
    border: 1px solid #4E52D8 !important;
    border-radius: 6px !important;
    color: #4E52D8 !important;

    font-family: "Plus Jakarta Sans", sans-serif !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    line-height: 1 !important;

    white-space: nowrap !important;
    overflow: visible !important;
    opacity: 1 !important;
}
.lumi-media-slot__svg-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 16px;
    height: 16px;

    flex: 0 0 16px;
}

.lumi-media-slot__svg-icon svg {
    display: block;
    width: 16px;
    height: 16px;
}

/* Filled state: kept for the result stage of the same slot. */

.lumi-media-slot__image-area {
    position: relative;
    width: 100%;
    height: 100%;
    padding: 10px;

    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.lumi-media-slot__image {
    display: block;
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    border-radius: 18px;
}

.lumi-media-slot__icon {
    appearance: none !important;
    -webkit-appearance: none !important;

    position: absolute;
    width: 36px;
    height: 36px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: 0 !important;
    border: none !important;
    background: rgba(255, 255, 255, 0.9) !important;
    box-shadow: none !important;
    outline: none !important;
    border-radius: 50% !important;

    cursor: pointer;
    font-size: 20px;
    line-height: 1;
    color: #111111 !important;
    z-index: 2;
}

.lumi-media-slot__icon--preview {
    bottom: 12px;
    right: 56px;
    top: auto;
    left: auto;
}

.lumi-media-slot__icon--preview svg {
    width: 20px;
    height: 20px;
    display: block;
}

.lumi-media-slot__icon--edit {
    bottom: 12px;
    right: 12px;
    top: auto;
    left: auto;
}

.lumi-media-slot--filled .lumi-media-slot__close {
    display: flex !important;
    align-items: center;
    justify-content: center;
}

.lumi-media-slot--filled .lumi-media-slot__close {
    top: 12px;
    right: 12px;
}

.lumi-media-slot__icon--favorite {
    display: none !important;
}

.lumi-media-slot__icon:hover {
    color: #111111 !important;
    background: #ffffff !important;
}

/* =========================================================
   12. Flashcard sheet
   ========================================================= */

.lumi-flashcard-workspace {
    padding: 28px 32px;
    background: var(--lumi-card-bg);
    border-radius: var(--lumi-radius-card);
    box-shadow: var(--lumi-shadow-card);
}

.lumi-sheet-preview {
    width: 100%;
}

.lumi-flashcard-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    column-gap: 20px;
    row-gap: 6px;
}

.lumi-flashcard-slot {
    aspect-ratio: 1 / 1;
    min-height: 0;
    border: 2px dashed var(--lumi-border-dashed);
    border-radius: var(--lumi-radius-card);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--lumi-text-light);
    font-size: 15px;
}

/* =========================================================
   13. Test helpers
   ========================================================= */

.lumi-test-box {
    padding: 24px;
    background: var(--lumi-bg-soft);
    color: var(--lumi-text);
    font-size: 18px;
    font-weight: 600;
    border-radius: var(--lumi-radius-card);
}

/* ================================
   Flashcards page
================================ */

.lumi-flashcards-page {
  min-height: 100vh;
}

.lumi-flashcards-main {
    width: 100%;
    max-width: none;
    padding: 0 32px 40px 0;
}
.lumi-flashcards-content {
  width: 100%;
  max-width: none;
  margin: 0;
}

.lumi-flashcards-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 28px;

  min-height: 132px;
  padding: 18px 24px;

  background: #ffffff;
  border-radius: 14px;
  box-shadow: 0 6px 18px rgba(23, 23, 23, 0.06);
}

.lumi-flashcards-topbar__left {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 0;
}

.lumi-flashcards-topbar .lumi-page-title {
    margin: 0 !important;
    font-family: "Plus Jakarta Sans", sans-serif !important;
    font-size: 28px !important;
    line-height: 1.2 !important;
    font-weight: 700 !important;
    color: #111111 !important;
}

.lumi-flashcards-topbar__actions {
    display: flex;
    align-items: center;
    gap: 10px;
    padding-top: 48px;
}
.lumi-flashcards-topbar__actions .lumi-button {
    min-height: 36px !important;
    height: 36px !important;
    padding: 0 18px !important;

    font-size: 12px !important;
    font-weight: 600 !important;

    border-width: 2px !important;
    border-radius: 24px !important;
}

/* Compact format selector inside Flashcards topbar */

.lumi-flashcards-topbar .lumi-format-selector {
  padding: 0;
  margin: 0;

  background: transparent;
  border-radius: 0;
  box-shadow: none;
}

.lumi-flashcards-topbar .lumi-format-selector h2,
.lumi-flashcards-topbar .lumi-format-selector .lumi-section-heading,
.lumi-flashcards-topbar .lumi-format-selector .lumi-eyebrow {
  display: none;
}

.lumi-flashcards-topbar .lumi-format-options {
  display: flex;
  align-items: flex-end;
  gap: 8px;
}

.lumi-flashcards-topbar .lumi-format-group {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.lumi-flashcards-topbar .lumi-format-group label {
  color: #111111;
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  text-transform: uppercase;
}

.lumi-flashcards-topbar .lumi-format-group select {
  height: 42px;
  min-height: 42px;
  padding: 0 14px;

  border-radius: 10px;
  font-size: 13px;
}

.lumi-flashcards-topbar .lumi-format-group:nth-child(1) select {
  width: 118px;
}

.lumi-flashcards-topbar .lumi-format-group:nth-child(2) select {
  width: 210px;
}

.lumi-flashcards-workspace {
  position: relative;
  margin-top: 0;

  background: #ffffff;
  border-radius: 14px;
  padding: 12px 12px 24px;
  box-shadow: 0 6px 18px rgba(23, 23, 23, 0.06);
}

.lumi-flashcards-note {
    display: none;
}

.lumi-flashcards-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  column-gap: 18px;
  row-gap: 18px;
  background: transparent;
  border-radius: 14px;
  padding: 18px;
  min-height: 0;
  margin-top: 18px !important;
  margin-bottom: 130px;
}

.lumi-flashcards-bottom-bar {
    position: sticky;
    bottom: 24px;
    z-index: 20;

    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 14px;

    margin: 28px 0 0;
    width: 100%;
    box-sizing: border-box;
    padding: 14px 20px;
    min-height: 62px;

    background: #ffffff;
    border-radius: 14px;
    box-shadow: 0 8px 24px rgba(23, 23, 23, 0.08);
}

@media (max-width: 1100px) {
  .lumi-flashcards-topbar {
    flex-direction: column;
  }

  .lumi-flashcards-topbar__actions {
    padding-top: 0;
  }

  .lumi-flashcards-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* Close button inside active media slot */

button.lumi-media-slot__close {
    display: none !important;

    position: absolute;
    top: 14px;
    right: 14px;
    z-index: 3;

    width: 24px !important;
    height: 24px !important;
    min-height: 24px !important;

    padding: 0 !important;
    margin: 0 !important;

    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    outline: none !important;

    color: #9b9b9b !important;

    font-family: "Plus Jakarta Sans", sans-serif !important;
    font-size: 20px !important;
    font-weight: 400 !important;
    line-height: 1 !important;

    cursor: pointer;
}

.lumi-media-slot.is-active button.lumi-media-slot__close {
    display: flex !important;
    align-items: center;
    justify-content: center;
}

button.lumi-media-slot__close:hover,
button.lumi-media-slot__close:focus,
button.lumi-media-slot__close:active {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    outline: none !important;

    color: #4E52D8 !important;
    opacity: 1 !important;
}


.lumi-profile-modal {
    position: fixed !important;
    inset: 0 !important;
    z-index: 99999 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 24px !important;
}

.lumi-profile-modal__overlay {
    position: absolute !important;
    inset: 0 !important;
    background: rgba(18, 18, 35, 0.42) !important;
    backdrop-filter: blur(4px);
}

.lumi-profile-modal__box {
    position: relative !important;
    z-index: 1 !important;
    width: 100% !important;
    max-width: 640px !important;
    background: #ffffff !important;
    border-radius: 28px !important;
    padding: 36px !important;
    box-shadow: 0 24px 70px rgba(40, 40, 90, 0.24) !important;
}

.lumi-profile-modal__close {
    position: absolute !important;
    top: 18px !important;
    right: 22px !important;
    width: 34px !important;
    height: 34px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-decoration: none !important;
    color: #db3d6d !important;
    font-size: 24px !important;
    line-height: 1 !important;
}

.lumi-profile-modal__box h2 {
    margin: 8px 0 14px !important;
    font-size: 30px !important;
    line-height: 1.2 !important;
    color: #15152f !important;
}

.lumi-profile-modal__text {
    margin: 0 0 24px !important;
    color: #5e6077 !important;
    font-size: 16px !important;
    line-height: 1.6 !important;
}

.lumi-profile-form {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 18px !important;
    margin-bottom: 26px !important;
}

.lumi-profile-form label {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    color: #5e6077 !important;
    font-size: 14px !important;
    font-weight: 600 !important;
}

.lumi-profile-form textarea,
.lumi-profile-form select {
    width: 100% !important;
    border: 1px solid #d7d7e5 !important;
    border-radius: 14px !important;
    padding: 12px 14px !important;
    font-family: inherit !important;
    font-size: 15px !important;
}

.lumi-profile-form textarea {
    min-height: 96px !important;
    resize: vertical !important;
}
.lumi-profile-modal__danger-button {
    background: #db3d6d !important;
    border: 2px solid #db3d6d !important;
    color: #ffffff !important;
}

.lumi-profile-modal__danger-button:hover {
    background: #c92f5f !important;
    border-color: #c92f5f !important;
    color: #ffffff !important;
}
.lumi-profile-modal__delete-form {
    margin: 0 !important;
}

.lumi-child-page {
    display: grid;
    grid-template-columns: 280px minmax(0, 1fr);
    grid-template-rows: 72px auto;
    gap: 0;
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    padding: 24px 32px 48px;
    box-sizing: border-box;
    overflow-x: clip;
}

.lumi-child-sidebar {
    grid-column: 1;
    grid-row: 2;
    display: flex;
    flex-direction: column;
    gap: 20px;
    min-width: 0;
    padding: 32px 24px 0 0;
    border-right: 1px solid #e7e8ff;
}

.lumi-child-card,
.lumi-child-workspace-menu,
.lumi-child-main {
    background: transparent;
    border-radius: 24px;
    border: 0;
    box-shadow: none;
}

.lumi-child-card {
    padding: 24px;
}

.lumi-child-card__top {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 22px;
}

.lumi-child-card__avatar {
    width: 58px;
    height: 58px;
    border-radius: 50%;
    border: 2px solid #5a55f5;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 28px;
}

.lumi-child-card h2 {
    margin: 0 0 6px;
    font-size: 22px;
    color: #17172f;
}

.lumi-child-card__edit {
    display: inline-flex;
    padding: 5px 14px;
    border: 1px solid #5a55f5;
    border-radius: 999px;
    color: #5a55f5;
    font-size: 13px;
    text-decoration: none;
}

.lumi-child-card__details,
.lumi-child-card__settings {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding-top: 18px;
    margin-top: 18px;
    margin-top: 24px;
    border-top: 1px solid rgba(20, 20, 50, 0.1);
}

.lumi-child-card__details p,
.lumi-child-card__settings p {
    margin: 0;
    font-size: 15px;
    color: #33334d;
}

.lumi-child-workspace-menu {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 18px;
}

.lumi-child-workspace-menu__item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 14px;
    border-radius: 14px;
    color: #33334d;
    text-decoration: none;
    font-size: 15px;
    font-weight: 500;
    line-height: 1.3;
}

.lumi-child-workspace-menu__item.is-active,
.lumi-child-workspace-menu__item:hover {
    margin-right: 12px;
    border-radius: 6px;
    background: #e7e8ff;
    color: #4e52d8;
}

.lumi-child-workspace-menu__item.is-active .lumi-child-workspace-menu__icon img,
.lumi-child-workspace-menu__item:hover .lumi-child-workspace-menu__icon img {
    filter: invert(36%) sepia(53%) saturate(1211%) hue-rotate(212deg)
        brightness(94%) contrast(94%);
}

.lumi-child-workspace-menu__icon {
    width: 22px;
    height: 22px;
    flex: 0 0 22px;

    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.lumi-child-workspace-menu__icon img {
    display: block;
    width: 20px;
    height: 20px;
    object-fit: contain;
}

.lumi-child-workspace-menu__item.is-disabled,
.lumi-child-workspace-menu__item.is-disabled:hover {
    margin-right: 0;
    background: transparent;
    color: #77798c;
    cursor: default;
    opacity: 0.68;
}

.lumi-child-workspace-menu__item.is-disabled:hover
    .lumi-child-workspace-menu__icon img {
    filter: none;
}

.lumi-child-workspace-menu__label {
    min-width: 0;
}

.lumi-child-workspace-menu__badge {
    margin-left: auto;
    padding: 3px 6px;
    border-radius: 999px;
    background: #eeecff;
    color: #4e52d8;
    font-size: 8px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.02em;
    white-space: nowrap;
}

.lumi-child-main {
    grid-column: 2;
    grid-row: 2;
    min-width: 0;
    min-height: 520px;
    padding: 32px 42px 0;
}

.lumi-child-breadcrumb {
    display: flex;
    gap: 8px;
    margin-bottom: 18px;
    font-size: 14px;
    color: #5a55f5;
}

.lumi-child-breadcrumb a {
    color: #5a55f5;
    text-decoration: none;
}

.lumi-child-main h1 {
    margin: 0 0 42px;
    font-size: 30px;
    color: #17172f;
}

.lumi-child-home-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(120px, 1fr));
    gap: 28px;
    max-width: 720px;
    margin: 0 auto;
}

.lumi-child-home-card {
    min-height: 150px;
    border: 1px solid rgba(20, 20, 50, 0.1);
    border-radius: 16px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 14px;
    text-align: center;
    text-decoration: none;
    color: #17172f;
    background: #ffffff;
}

.lumi-child-home-card:hover {
    border-color: #5a55f5;
    box-shadow: 0 12px 28px rgba(90, 85, 245, 0.12);
}

.lumi-child-home-card__icon {
    position: relative;
    width: 72px;
    height: 72px;
    border-radius: 14px;
    background: rgba(255, 122, 89, 0.14);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ff6f4a;
}

.lumi-child-home-card__icon img {
    display: none;
}

.lumi-child-home-card__icon::before {
    content: "";
    display: block;
    width: 42px;
    height: 42px;
    background: currentColor;
    -webkit-mask: var(--lumi-home-card-icon) center / contain no-repeat;
    mask: var(--lumi-home-card-icon) center / contain no-repeat;
}

.lumi-child-home-card__label {
    font-size: 15px;
    font-weight: 400;
    line-height: 1.15;
}

.lumi-child-home-card--flashcards .lumi-child-home-card__icon {
    --lumi-home-card-icon: url("../icons/workspaces/flashcards.svg");
    background: #ffeadf;
    color: #ff7558;
}

.lumi-child-home-card--visual-schedule .lumi-child-home-card__icon {
    --lumi-home-card-icon: url("../icons/workspaces/visual-schedule.svg");
    background: #ffe8e4;
    color: #ff7558;
}

.lumi-child-home-card--social-story .lumi-child-home-card__icon {
    --lumi-home-card-icon: url("../icons/workspaces/social-story.svg");
    background: #f0efff;
    color: #5251e5;
}

.lumi-child-home-card--first-then-board .lumi-child-home-card__icon {
    --lumi-home-card-icon: url("../icons/workspaces/first-then-board.svg");
    background: #fff8dc;
    color: #ffbd00;
}

.lumi-child-home-card--token-board .lumi-child-home-card__icon {
    --lumi-home-card-icon: url("../icons/workspaces/token-board.svg");
    background: #dcffe4;
    color: #2cc866;
}

.lumi-child-home-card--choice-board .lumi-child-home-card__icon {
    --lumi-home-card-icon: url("../icons/workspaces/choice-board.svg");
    background: #daf8ff;
    color: #0bb5da;
}

.lumi-child-home-card--matching-activity .lumi-child-home-card__icon {
    --lumi-home-card-icon: url("../icons/workspaces/matching-activity.svg");
    background: #ffe1e1;
    color: #ff3e45;
}

.lumi-child-home-card--templates .lumi-child-home-card__icon {
    --lumi-home-card-icon: url("../icons/workspaces/templates.svg");
    background: #dcfffb;
    color: #249c91;
}

.lumi-child-workspace-placeholder {
    min-height: 360px;
    border-radius: 18px;
    background: rgba(90, 85, 245, 0.04);
    border: 1px dashed rgba(90, 85, 245, 0.25);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #6c6c82;
    font-size: 18px;
}
.lumi-child-app-header {
    grid-column: 1 / -1;
    grid-row: 1;
    display: grid;
    grid-template-columns: 280px minmax(0, 1fr);
    align-items: stretch;
    min-width: 0;
    background: #ffffff;
    border-bottom: 1px solid #e7e8ff;
}

.lumi-child-app-header__logo {
    display: flex;
    align-items: center;
    width: 100%;
    min-width: 0;
    height: 72px;
    padding: 0 32px;
    border-right: 1px solid #e7e8ff;
    text-decoration: none;
    box-sizing: border-box;
}

.lumi-child-app-header__logo img {
    display: block;
    width: 84px;
    height: auto;
    max-width: 100%;
}

.lumi-child-app-header__right {
    display: flex;
    align-items: center;
    gap: 24px;
    min-width: 0;
    padding: 0 0 0 42px;
}

.lumi-child-app-header__meta {
    display: flex;
    align-items: center;
    gap: 32px;
    min-width: 0;
}

.lumi-child-app-header__back {
    color: #5f6284;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.3;
    text-decoration: none;
    white-space: nowrap;
}

.lumi-child-app-header__back:hover {
    color: #4e52d8;
}

.lumi-child-app-header__title {
    min-width: 0;
    color: #20213a;
    font-size: 28px;
    font-weight: 700;
    line-height: 1.2;
    white-space: nowrap;
}

.lumi-child-app-header__account {
    margin-left: auto;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: #4e52d8;
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 42px;
    text-decoration: none;
    font-size: 16px;
    font-weight: 700;
}

.lumi-child-breadcrumb {
    margin-bottom: 10px;
}

.lumi-flashcards-embedded__top h2,
.lumi-child-main h1 {
    margin-bottom: 18px;
}

.lumi-child-home-grid {
    width: 100%;
    max-width: 760px;
}

.lumi-child-home-card {
    width: 100%;
    min-width: 0;
}

@media (max-width: 1279px) {
    .lumi-child-page {
        max-width: none;
    }
}

@media (max-width: 1100px) {
    .lumi-child-page {
        grid-template-columns: 240px minmax(0, 1fr);
    }

    .lumi-child-app-header {
        grid-template-columns: 240px minmax(0, 1fr);
    }

    .lumi-child-app-header__logo {
        padding: 0 24px;
    }

    .lumi-child-app-header__right {
        padding-left: 32px;
    }

    .lumi-child-app-header__meta {
        gap: 20px;
    }
}

@media (max-width: 860px) {
    .lumi-child-page {
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: auto auto auto;
        padding: 20px 16px 32px;
    }

    .lumi-child-app-header {
        grid-template-columns: minmax(0, 1fr);
    }

    .lumi-child-app-header__logo {
        justify-content: center;
        height: 64px;
        padding: 0 16px;
        border-right: 0;
        border-bottom: 1px solid #e7e8ff;
    }

    .lumi-child-app-header__right {
        flex-wrap: wrap;
        padding: 16px;
        gap: 16px;
    }

    .lumi-child-app-header__meta {
        order: 2;
        flex: 1 1 100%;
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }

    .lumi-child-app-header__back,
    .lumi-child-app-header__title {
        white-space: normal;
    }

    .lumi-child-sidebar {
        grid-column: 1;
        grid-row: 2;
        padding: 24px 0 0;
        border-right: 0;
    }

    .lumi-child-main {
        grid-column: 1;
        grid-row: 3;
        padding: 28px 0 0;
    }

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

@media (max-width: 680px) {
    .lumi-child-app-header__right {
        align-items: flex-start;
    }

    .lumi-child-app-header__account {
        margin-left: 0;
    }

    .lumi-child-home-grid {
        grid-template-columns: minmax(0, 1fr);
    }
}
button.lumi-child-card__edit,
.lumi-child-card__edit {
    appearance: none !important;
    -webkit-appearance: none !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: auto !important;
    min-width: 0 !important;
    height: 34px !important;
    min-height: 34px !important;

    padding: 0 14px !important;
    margin-top: 6px !important;

    border: 1px solid rgba(78, 82, 216, 0.32) !important;
    border-radius: 6px !important;

    background: #F7F6FF !important;
    color: #4E52D8 !important;

    font-family: inherit !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    text-decoration: none !important;

    cursor: pointer !important;
    box-shadow: none !important;
}

button.lumi-child-card__edit:hover,
.lumi-child-card__edit:hover {
    background: #EEECFF !important;
    color: #3F43C8 !important;
    border-color: rgba(78, 82, 216, 0.48) !important;
}

button.lumi-child-card__edit:focus,
button.lumi-child-card__edit:focus-visible {
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(78, 82, 216, 0.14) !important;
}
.lumi-editor-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.65);
    z-index: 999999;
    align-items: center;
    justify-content: center;
    padding: 24px;
}

.lumi-editor-overlay.is-open {
    display: flex;
}

.lumi-editor-overlay__box {
    position: relative;
    width: min(676px, 100%);
    height: 1px;
    max-height: 100%;
    background: #ffffff;
    border-radius: 20px;
    box-shadow: 0 20px 50px rgba(20, 24, 50, 0.08);
    overflow: hidden;
}

.lumi-editor-overlay.is-loading .lumi-editor-overlay__box {
    visibility: hidden;
}

.lumi-editor-overlay__frame {
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
}

body.lumi-editor-open {
    overflow: hidden;
}
.lumi-media-slot-library-modal {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 999998;
    align-items: center;
    justify-content: center;
    padding: 24px;
}

.lumi-media-slot-library-modal.is-open {
    display: flex;
}

.lumi-media-slot-library-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(23, 23, 47, 0.45);
}

.lumi-media-slot-library-modal__panel {
    position: relative;
    z-index: 1;
    width: min(1100px, 100%);
    max-height: 88vh;
    overflow: auto;
    background: #ffffff;
    border-radius: 28px;
    padding: 40px;
    box-shadow: 0 24px 80px rgba(23, 23, 47, 0.22);
}

button.lumi-media-slot-library-modal__close,
.lumi-media-slot-library-modal__close {
    position: absolute !important;
    top: 16px !important;
    right: 16px !important;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    padding: 0 !important;
    border: 0 !important;
    outline: none !important;
    border-radius: 999px;
    background: transparent !important;
    color: #111111 !important;
    font-size: 32px !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    cursor: pointer;
    box-shadow: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    transform: none !important;
}

button.lumi-media-slot-library-modal__close:hover,
button.lumi-media-slot-library-modal__close:focus,
.lumi-media-slot-library-modal__close:hover,
.lumi-media-slot-library-modal__close:focus {
    background: transparent !important;
    color: #111111 !important;
    border: 0 !important;
    outline: none !important;
    box-shadow: none !important;
    opacity: 1 !important;
    transform: none !important;
}

button.lumi-media-slot-library-modal__close:active,
.lumi-media-slot-library-modal__close:active {
    transform: scale(1.04) !important;
    transition: transform 0.12s ease !important;
}

.lumi-media-slot-library-modal__header {
    max-width: 620px;
    margin-bottom: 28px;
}

.lumi-media-slot-library-modal__eyebrow {
    margin: 0 0 8px;
    color: #5458f7;
    font-size: 13px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.lumi-media-slot-library-modal__header h2 {
    margin: 0 0 10px;
    color: #17172f;
    font-size: 32px;
    line-height: 1.1;
    font-weight: 800;
}

.lumi-media-slot-library-modal__header p {
    margin: 0;
    color: #5f6270;
    font-size: 15px;
    line-height: 1.5;
}

.lumi-media-slot-library-modal__search input {
    width: 100%;
    height: 56px;
    border-radius: 18px;
    border: 1px solid #B6B9E5 !important;
    padding: 0 20px;
    background: #ffffff !important;
    color: #111111 !important;
    font-size: 16px;
    outline: none !important;
    box-shadow: none !important;
}

.lumi-media-slot-library-modal__search input:hover {
    border-color: #B6B9E5 !important;
}

.lumi-media-slot-library-modal__search input:focus,
.lumi-media-slot-library-modal__search input:focus-visible {
    border-color: #4E52D8 !important;
    outline: none !important;
    box-shadow: 0 0 0 2px rgba(78, 82, 216, 0.12) !important;
}

.lumi-media-slot-library-modal__results {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 320px));
    gap: 18px;
    margin-top: 26px;
}

.lumi-media-slot-library-modal__results:empty {
    display: none;
}

.lumi-media-slot-library-modal__empty {
    margin-top: 10px;
    color: #5f6270;
    font-size: 13px;
    line-height: 1.4;
}

.lumi-media-slot-library-modal__empty p {
    margin: 0;
}

.lumi-media-slot-library-modal__generation-status {
    margin-top: 10px;
    color: #5f6270;
    font-size: 14px;
    line-height: 1.4;
}

.lumi-media-slot-library-modal__generation-status[hidden] {
    display: none !important;
}

.lumi-ai-limit-modal[hidden] {
    display: none !important;
}

.lumi-ai-limit-modal {
    position: fixed;
    inset: 0;
    z-index: 1000000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
}

.lumi-ai-limit-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(23, 23, 47, 0.5);
    backdrop-filter: blur(3px);
}

.lumi-ai-limit-modal__panel {
    position: relative;
    z-index: 1;
    width: min(520px, 100%);
    box-sizing: border-box;
    padding: 44px 40px 36px;
    border-radius: 28px;
    background: #ffffff;
    box-shadow: 0 24px 80px rgba(23, 23, 47, 0.24);
    color: #17172f;
    text-align: center;
}

button.lumi-ai-limit-modal__close {
    position: absolute !important;
    top: 14px !important;
    right: 14px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #17172f !important;
    font-size: 30px !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    cursor: pointer;
}

.lumi-ai-limit-modal__icon {
    display: grid;
    width: 64px;
    height: 64px;
    margin: 0 auto 22px;
    border-radius: 20px;
    place-items: center;
    background: #e7e8ff;
    color: #4e52d8;
    font-size: 32px;
}

.lumi-ai-limit-modal__panel h2 {
    margin: 0 0 14px;
    color: #17172f;
    font-size: 30px;
    font-weight: 800;
    line-height: 1.15;
}

.lumi-ai-limit-modal__panel p {
    margin: 0 auto;
    max-width: 420px;
    color: #5f6270;
    font-size: 16px;
    line-height: 1.55;
}

.lumi-ai-limit-modal__actions {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
    margin-top: 30px;
}

.lumi-ai-limit-modal__upgrade {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 52px !important;
    border-radius: 8px !important;
    text-decoration: none !important;
}

button.lumi-ai-limit-modal__dismiss {
    min-height: 44px !important;
    padding: 0 20px !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #5f6270 !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    cursor: pointer;
}

@media (max-width: 600px) {
    .lumi-ai-limit-modal {
        padding: 16px;
    }

    .lumi-ai-limit-modal__panel {
        padding: 40px 24px 28px;
        border-radius: 22px;
    }

    .lumi-ai-limit-modal__panel h2 {
        font-size: 26px;
    }
}

.lumi-media-slot-library-result {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 10px !important;

    width: 100% !important;
    min-height: 220px !important;
    padding: 14px !important;

    background: #ffffff !important;
    border: 1px solid rgba(23, 23, 47, 0.12) !important;
    border-radius: 20px !important;
    box-shadow: none !important;

    color: #17172f !important;
    text-align: center !important;
    cursor: pointer !important;
}

.lumi-media-slot-library-result:hover {
    border-color: #5458f7 !important;
    box-shadow: 0 8px 24px rgba(84, 88, 247, 0.12) !important;
}

.lumi-media-slot-library-result__image {
    width: 100% !important;
    aspect-ratio: 1 / 1 !important;
    height: auto !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    background: #ffffff !important;
    border-radius: 14px !important;
    overflow: hidden !important;
}

.lumi-media-slot-library-result__image img {
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
    display: block !important;
}

.lumi-media-slot-library-result__title {
    width: 100% !important;
    color: #17172f !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
}

.lumi-media-slot-library-result__save {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-height: 34px !important;
    padding: 8px 16px !important;

    border-radius: 999px !important;
    background: #5458f7 !important;
    color: #ffffff !important;

    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
}
.lumi-media-slot-library-result.is-selected {
    border-color: #5458f7 !important;
    box-shadow: 0 10px 28px rgba(84, 88, 247, 0.18) !important;
    background: #f7f7ff !important;
}

.lumi-media-slot-library-result.is-selected::after {
    content: '✓';
    position: absolute;
    top: 12px;
    right: 12px;

    width: 28px;
    height: 28px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 999px;
    background: #5458f7;
    color: #ffffff;

    font-size: 16px;
    font-weight: 800;
}

.lumi-media-slot-library-result {
    position: relative !important;
}
.lumi-media-slot-library-result {
    position: relative !important;
}

.lumi-media-slot-library-result::before {
    content: '';
    position: absolute;
    top: 14px;
    right: 14px;

    width: 28px;
    height: 28px;

    border-radius: 999px;
    border: 2px solid rgba(23, 23, 47, 0.22);
    background: #ffffff;

    box-sizing: border-box;
    z-index: 2;
}

.lumi-media-slot-library-result.is-selected {
    border-color: #5458f7 !important;
    box-shadow: 0 10px 28px rgba(84, 88, 247, 0.18) !important;
    background: #f7f7ff !important;
}

.lumi-media-slot-library-result.is-selected::before {
    content: '';

    display: flex;
    align-items: center;
    justify-content: center;

    border-color: #5458f7;
    background: #5458f7;
}

.lumi-media-slot-library-result.is-selected::after {
    content: '' !important;
    position: absolute;
    top: 21px;
    right: 21px;
    width: 14px;
    height: 14px;
    background: #ffffff;
    -webkit-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 10 8.2 13.2 15 6.5' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 10 8.2 13.2 15 6.5' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
    z-index: 3;
    pointer-events: none;
}
.lumi-media-slot-library-modal [hidden] {
    display: none !important;
}
.lumi-profile-modal {
    z-index: 999999 !important;
}

.lumi-profile-modal__overlay {
    z-index: 1 !important;
}

.lumi-profile-modal__box {
    position: relative !important;
    z-index: 2 !important;
}
.lumi-media-slot-library-modal__search {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto auto !important;
    gap: 14px !important;
    align-items: center !important;
}

.lumi-media-slot-library-modal__search:has(
    .lumi-media-slot-library-modal__generate-button[hidden]
) {
    grid-template-columns: minmax(0, 1fr) auto !important;
}

.lumi-media-slot-library-modal__search input {
    width: 100% !important;
    margin: 0 !important;
}

button.lumi-media-slot-library-modal__search-button {
    height: 56px !important;
    padding: 0 28px !important;
    border-radius: 6px !important;
    white-space: nowrap !important;
}

.lumi-media-slot-library-modal__search-button::before {
    content: "";
    width: 15px;
    height: 15px;
    flex: 0 0 15px;
    background: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 15 15' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14 14 10.737 10.737M12.5 6.5a6 6 0 1 1-12 0 6 6 0 0 1 12 0Z' fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 15 15' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14 14 10.737 10.737M12.5 6.5a6 6 0 1 1-12 0 6 6 0 0 1 12 0Z' fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

button.lumi-media-slot-library-modal__generate-button,
.lumi-media-slot-library-modal__generate-button {
    width: auto !important;
    min-width: 0 !important;
    height: 56px !important;
    min-height: 56px !important;
    padding: 0 28px !important;
    border: 1px solid #4E52D8 !important;
    border-radius: 6px !important;
    background: transparent !important;
    color: #4E52D8 !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    box-shadow: none !important;
    opacity: 1 !important;
}

button.lumi-media-slot-library-modal__generate-button::before,
.lumi-media-slot-library-modal__generate-button::before {
    content: "";
    width: 17px;
    height: 15px;
    flex: 0 0 17px;
    background: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 33 28' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15.36 0c.38 2.35 1.37 3.37 3.72 3.77-2.35.39-3.34 1.41-3.72 3.76-.39-2.35-1.38-3.37-3.72-3.76C13.98 3.37 14.97 2.35 15.36 0ZM17.99 20.47c.38 2.35 1.37 3.37 3.72 3.76-2.35.4-3.34 1.42-3.72 3.77-.39-2.35-1.38-3.37-3.72-3.77 2.34-.39 3.33-1.41 3.72-3.76ZM9.68 7.59c.99 5.83 3.84 8.8 9.67 9.79-5.83.99-8.68 3.96-9.67 9.79C8.68 21.34 5.83 18.37 0 17.38c5.83-.99 8.68-3.96 9.68-9.79ZM23.32.2c.99 5.83 3.85 8.8 9.68 9.79-5.83.99-8.69 3.96-9.68 9.79-.99-5.83-3.84-8.8-9.67-9.79C19.48 9 22.33 6.03 23.32.2Z'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 33 28' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15.36 0c.38 2.35 1.37 3.37 3.72 3.77-2.35.39-3.34 1.41-3.72 3.76-.39-2.35-1.38-3.37-3.72-3.76C13.98 3.37 14.97 2.35 15.36 0ZM17.99 20.47c.38 2.35 1.37 3.37 3.72 3.76-2.35.4-3.34 1.42-3.72 3.77-.39-2.35-1.38-3.37-3.72-3.77 2.34-.39 3.33-1.41 3.72-3.76ZM9.68 7.59c.99 5.83 3.84 8.8 9.67 9.79-5.83.99-8.68 3.96-9.67 9.79C8.68 21.34 5.83 18.37 0 17.38c5.83-.99 8.68-3.96 9.68-9.79ZM23.32.2c.99 5.83 3.85 8.8 9.68 9.79-5.83.99-8.69 3.96-9.68 9.79-.99-5.83-3.84-8.8-9.67-9.79C19.48 9 22.33 6.03 23.32.2Z'/%3E%3C/svg%3E") center / contain no-repeat;
}

button.lumi-media-slot-library-modal__generate-button:hover,
button.lumi-media-slot-library-modal__generate-button:focus,
.lumi-media-slot-library-modal__generate-button:hover,
.lumi-media-slot-library-modal__generate-button:focus {
    background: transparent !important;
    border-color: #4E52D8 !important;
    color: #4E52D8 !important;
    box-shadow: none !important;
    opacity: 1 !important;
}

button.lumi-media-slot-library-modal__generate-button:active,
.lumi-media-slot-library-modal__generate-button:active {
    transform: scale(1.02) !important;
    transition: transform 0.12s ease !important;
}

button.lumi-media-slot-library-modal__generate-button:disabled,
.lumi-media-slot-library-modal__generate-button:disabled {
    background: transparent !important;
    border-color: #C7CADC !important;
    color: #8A8D99 !important;
    cursor: not-allowed !important;
    box-shadow: none !important;
    opacity: 1 !important;
}

button.lumi-media-slot-library-modal__generate-button:disabled::before,
.lumi-media-slot-library-modal__generate-button:disabled::before {
    width: 17px;
    height: 17px;
    flex-basis: 17px;
    box-sizing: border-box;
    background: transparent;
    border: 2px solid rgba(78, 82, 216, 0.2);
    border-top-color: #4E52D8;
    border-radius: 999px;
    -webkit-mask: none;
    mask: none;
    animation: lumi-upload-spin 0.8s linear infinite;
}

.lumi-media-slot-library-modal__footer {
    display: flex !important;
    justify-content: flex-end !important;
    margin-top: 28px !important;
}

.lumi-media-slot-library-modal__footer:has(
    [data-lumi-library-save-selected]:not([hidden])
) {
    position: sticky;
    bottom: -40px;
    z-index: 3;
    min-height: 96px;
    box-sizing: border-box;
    margin: 28px -40px -40px !important;
    padding: 20px 40px;
    border-top: 1px solid #E4E4EF;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 -10px 24px rgba(23, 23, 47, 0.06);
}

.lumi-media-slot-library-modal__footer .lumi-button:disabled {
    opacity: 0.45 !important;
    cursor: not-allowed !important;
}

.lumi-media-slot-library-modal__footer
    [data-lumi-library-save-selected] {
    border-radius: 6px !important;
}
/* Flashcards workspace layout.
   This is a working grid, not an exact print preview. */

.lumi-flashcards-grid[data-cards-per-page="12"] {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    justify-content: stretch !important;
}

.lumi-flashcards-grid[data-cards-per-page="6"] {
    grid-template-columns: repeat(auto-fill, minmax(220px, 250px)) !important;
    justify-content: start !important;
}

.lumi-flashcards-grid[data-cards-per-page="2"] {
    grid-template-columns: repeat(auto-fill, minmax(220px, 250px)) !important;
    justify-content: stretch !important;
}
.lumi-flashcards-preview-modal[hidden] {
    display: none !important;
}

.lumi-flashcards-preview-modal {
    position: fixed;
    inset: 0;
    z-index: 999999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 32px;
}

.lumi-flashcards-preview-modal.is-exporting {
    visibility: hidden;
    pointer-events: none;
}

.lumi-flashcards-preview-modal__overlay {
    position: absolute;
    inset: 0;
    background: rgba(23, 23, 47, 0.45);
}

.lumi-flashcards-preview-modal__box {
    position: relative;
    z-index: 2;
    width: min(92vw, 860px);
    max-height: 92vh;
    overflow: auto;
    background: #ffffff;
    border-radius: 20px;
    padding: 28px;
    box-shadow: 0 24px 80px rgba(23, 23, 47, 0.22);
}

button.lumi-flashcards-preview-modal__close,
.lumi-flashcards-preview-modal__close {
    position: absolute !important;
    top: 16px !important;
    right: 16px !important;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    border: 0 !important;
    outline: none !important;
    border-radius: 999px;
    background: transparent !important;
    color: #111111 !important;
    font-size: 32px !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    cursor: pointer;
    box-shadow: none !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    transform: none !important;
}

button.lumi-flashcards-preview-modal__close:hover,
button.lumi-flashcards-preview-modal__close:focus,
.lumi-flashcards-preview-modal__close:hover,
.lumi-flashcards-preview-modal__close:focus {
    background: transparent !important;
    color: #111111 !important;
    border: 0 !important;
    outline: none !important;
    box-shadow: none !important;
    opacity: 1 !important;
    transform: none !important;
}

button.lumi-flashcards-preview-modal__close:active,
.lumi-flashcards-preview-modal__close:active {
    transform: scale(1.04) !important;
    transition: transform 0.12s ease !important;
}

.lumi-flashcards-preview-modal__header {
    margin-bottom: 24px;
}

.lumi-flashcards-preview-modal__eyebrow {
    display: block;
    margin-bottom: 6px;
    color: #6f7280;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.lumi-flashcards-preview-modal__header h3 {
    margin: 0;
    font-size: 22px;
    line-height: 1.2;
}

.lumi-flashcards-preview-modal__body {
    display: flex;
    justify-content: center;
    padding: 24px;
    background: #f5f5f7;
    border-radius: 16px;
}

.lumi-flashcards-preview-page {
    width: 420px;
    min-height: 594px;
    padding: 20px;
    background: #ffffff;
    box-shadow: 0 8px 28px rgba(23, 23, 47, 0.12);
}
.lumi-flashcards-preview-modal {
    z-index: 2147483000 !important;
}

body.lumi-preview-open {
    overflow: hidden !important;
}

.lumi-flashcards-preview-page {
    display: grid !important;
    grid-template-columns: repeat(
        var(--lumi-flashcards-columns, 2),
        var(--lumi-flashcards-preview-card-size, 160px)
    ) !important;
    grid-auto-rows: auto !important;
    gap: var(--lumi-flashcards-preview-gap, 8px) !important;
    align-content: start !important;
    box-sizing: border-box !important;
}

.lumi-flashcards-preview-card {
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    box-sizing: border-box;
    padding: 7%;
    border: 1px dashed #d2d5df;
    background: #ffffff;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.lumi-flashcards-preview-card img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

/* Edited images already include a frame inset; do not add card padding too. */
.lumi-flashcards-preview-card--editor-frame {
    padding: 0;
}

.lumi-flashcards-preview-card--editor-frame img {
    /* Trim only outer whitespace; keep the editor's 3.5% inset frame intact. */
    transform: scale(1.04);
}
/* Small cards: 4 × 4 cm / 20 per page */

.lumi-flashcards-grid[data-cards-per-page="20"] {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    justify-content: stretch !important;
}

.lumi-flashcards-preview-page {
    align-content: center !important;
    justify-content: center !important;
}
/* My Materials */

.lumi-my-materials {
    width: 100%;
}

.lumi-my-materials__header {
    margin-bottom: 28px;
}

.lumi-my-materials__header h2 {
    margin: 0 0 8px;
    font-size: 34px;
    line-height: 1.15;
    color: #17172f;
}

.lumi-my-materials__header p {
    margin: 0;
    color: #6f7280;
    font-size: 16px;
    line-height: 1.5;
}

.lumi-my-materials__empty {
    padding: 32px;
    background: #ffffff;
    border: 1px solid #e5e7f0;
    border-radius: 16px;
    box-shadow: 0 8px 24px rgba(23, 23, 47, 0.06);
}

.lumi-my-materials__empty h3 {
    margin: 0 0 8px;
    font-size: 22px;
    color: #17172f;
}

.lumi-my-materials__empty p {
    margin: 0;
    color: #6f7280;
}

.lumi-my-materials__grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, 320px);
    justify-content: start;
    gap: 22px;
}
.lumi-my-materials__thumbnail {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 5px;

    width: 100%;
    height: 150px;

    margin-bottom: 12px;
    padding: 8px;

    background: #f7f7fb;
    border-radius: 12px;
    box-sizing: border-box;
}

.lumi-my-materials__thumbnail-slot {
    aspect-ratio: 1 / 1;

    display: flex;
    align-items: center;
    justify-content: center;

    background: #ffffff;
    border: 1px dashed #d2d5df;
    border-radius: 8px;
    overflow: hidden;
}

.lumi-my-materials__thumbnail-slot img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

/* Flashcards use a fixed-size contact sheet that scales every square to fit. */
.lumi-my-materials__thumbnail--flashcards {
    container-type: size;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-template-rows: repeat(
        var(--lumi-flashcards-preview-rows, 1),
        minmax(0, 1fr)
    );
    place-items: center;
    overflow: hidden;
}

.lumi-my-materials__thumbnail--flashcards .lumi-my-materials__thumbnail-slot {
    --lumi-flashcards-preview-cell-size: min(
        calc((100cqw - 10px) / 3),
        calc(
            (100cqh - var(--lumi-flashcards-preview-row-gaps, 0px)) /
            var(--lumi-flashcards-preview-rows, 1)
        )
    );
    width: var(--lumi-flashcards-preview-cell-size);
    height: var(--lumi-flashcards-preview-cell-size);
    aspect-ratio: 1 / 1;
}

.lumi-my-materials__thumbnail-slot img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

.lumi-my-materials__card {
    position: relative;
    width: 280px;
    box-sizing: border-box;
    padding: 12px 16px 16px;
    background: #ffffff;
    border: 1px solid #e5e7f0;
    border-radius: 16px;
    box-shadow: 0 8px 24px rgba(23, 23, 47, 0.06);
}
.lumi-my-materials__card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 26px;
    margin-bottom: 8px;
}

.lumi-my-materials__tags {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    min-width: 0;
}

button.lumi-my-materials__trash {
    appearance: none !important;
    -webkit-appearance: none !important;

    position: static !important;
    flex: 0 0 24px;
    width: 24px !important;
    height: 24px !important;
    min-width: 24px !important;
    min-height: 24px !important;

    padding: 0 !important;
    margin: 0 !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;

    color: #8a8d99 !important;

    cursor: pointer !important;
}

.lumi-my-materials__trash img {
    display: block;
    width: 15px;
    height: 16px;
}

button.lumi-my-materials__trash:hover,
button.lumi-my-materials__trash:focus {
    background: transparent !important;
    color: #FC7754 !important;
    box-shadow: none !important;
}

.lumi-my-materials__trash:hover,
.lumi-my-materials__trash:focus {
    background: #ffe9e3;
    color: #FC7754;
}

.lumi-my-materials__type {
    display: inline-flex;
    align-items: center;
    min-height: 20px;
    box-sizing: border-box;
    margin: 0;
    padding: 2px 8px;
    border-radius: 999px;
    background: #f0f1ff;
    color: #4E52D8;
    font-size: 9px;
    font-weight: 800;
    line-height: 1;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.lumi-my-materials__title-row {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    margin-bottom: 8px;
}

.lumi-my-materials__title-row h3 {
    flex: 0 1 auto;
    min-width: 0;
    margin: 0;
    color: #17172f;
    font-size: 20px;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.lumi-my-materials__rename-form {
    flex: 1 1 auto;
    min-width: 0;
}

.lumi-my-materials__rename-form[hidden] {
    display: none;
}

.lumi-my-materials__rename-form input {
    width: 100%;
    min-width: 0;
    height: 34px;
    box-sizing: border-box;
    padding: 0 8px;
    border: 1px solid #4e52d8;
    border-radius: 6px;
    color: #17172f;
    font: inherit;
    font-size: 16px;
    line-height: 1;
}

button.lumi-my-materials__rename {
    appearance: none !important;
    -webkit-appearance: none !important;
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    min-height: 0 !important;
    padding: 0 !important;
    margin: 2px 0 0 !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    cursor: pointer;
    opacity: 0.8;
}

button.lumi-my-materials__rename:hover,
button.lumi-my-materials__rename:focus,
button.lumi-my-materials__rename:active {
    background: transparent !important;
    box-shadow: none !important;
    opacity: 1;
}

button.lumi-my-materials__rename:focus-visible {
    outline: 2px solid #4e52d8;
    outline-offset: 2px;
}

.lumi-my-materials__rename img {
    display: block;
    width: 15px;
    height: 15px;
}

.lumi-my-materials__client,
.lumi-my-materials__date {
    margin: 0;
    color: #6f7280;
    font-size: 12px;
    line-height: 1.4;
}

.lumi-my-materials__actions {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: center;
    gap: 8px;
    width: 100%;
    margin-top: 14px;
}

.lumi-my-materials__library-state {
    display: block;
    margin: 0;
}

.lumi-my-materials__meta-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
}

.lumi-my-materials__meta-row .lumi-my-materials__date {
    flex: 0 0 auto;
    padding-top: 5px;
    text-align: right;
}

.lumi-my-materials__visibility {
    appearance: none;
    display: inline-flex !important;
    align-items: center;
    gap: 7px;
    min-height: 30px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: #555866 !important;
    font: inherit;
    font-size: 12px !important;
    font-weight: 600 !important;
    box-shadow: none !important;
    cursor: pointer;
}

.lumi-my-materials__visibility-track {
    position: relative;
    width: 34px;
    height: 20px;
    flex: 0 0 34px;
    border-radius: 999px;
    background: #d8d9e1;
    transition: background-color .18s ease;
}

.lumi-my-materials__visibility-track span {
    position: absolute;
    top: 3px;
    left: 3px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 3px rgba(23, 23, 47, .24);
    transition: transform .18s ease;
}

.lumi-my-materials__visibility[aria-checked="true"] {
    color: #176b38 !important;
}

.lumi-my-materials__visibility[aria-checked="true"] .lumi-my-materials__visibility-track {
    background: #62bf78;
}

.lumi-my-materials__visibility[aria-checked="true"] .lumi-my-materials__visibility-track span {
    transform: translateX(14px);
}

.lumi-my-materials__visibility:focus-visible {
    outline: 2px solid #4e52d8;
    outline-offset: 3px;
    border-radius: 4px;
}

.lumi-my-materials__visibility:disabled {
    cursor: wait;
    opacity: .55;
}

.lumi-my-materials__review-tag {
    display: inline-flex !important;
    align-items: center;
    min-height: 26px !important;
    box-sizing: border-box;
    padding: 4px 10px !important;
    border: 0 !important;
    border-radius: 999px !important;
    font: inherit;
    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 1.2;
    box-shadow: none !important;
}

button.lumi-my-materials__review-tag {
    cursor: pointer;
}

.lumi-my-materials__review-tag--pending {
    background: #fde8ef !important;
    color: #a62f5c !important;
}

.lumi-my-materials__review-tag--review {
    background: #e4f6ea !important;
    color: #176b38 !important;
}

.lumi-my-materials__review-tag--rejected {
    background: #fde4e7 !important;
    color: #a72b3b !important;
}

.lumi-my-materials__rejection-reason {
    flex-basis: 100%;
    margin: -5px 0 0;
    color: #9f3a49;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.35;
}

.lumi-my-materials__review-tag:focus-visible {
    outline: 2px solid #4e52d8;
    outline-offset: 2px;
}

.lumi-my-materials__library-error {
    flex-basis: 100%;
    color: #b42318;
    font-size: 12px;
}

.lumi-my-materials__actions .lumi-button {
    width: 100% !important;
    height: 38px !important;
    min-height: 30px !important;
    padding: 0 8px !important;

    font-size: 12px !important;
    line-height: 1 !important;
    border-radius: 6px !important;

    white-space: nowrap !important;
}

button.lumi-my-materials__share {
    appearance: none !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 5px;
    width: 100% !important;
    height: 38px !important;
    min-height: 38px !important;
    padding: 0 2px !important;
    border: 0 !important;
    background: transparent !important;
    color: #4e52d8 !important;
    font: inherit;
    font-size: 12px !important;
    font-weight: 700 !important;
    box-shadow: none !important;
    cursor: pointer;
}

.lumi-my-materials__sharing-indicators {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 7px;
    margin-top: 8px;
}

.lumi-my-materials__sharing-indicators:not(:has(.lumi-my-materials__sharing-indicator--people)) {
    display: none;
}

.lumi-my-materials__sharing-indicator {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #555971;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.25;
}

.lumi-my-materials__sharing-indicator--people {
    position: relative;
}

.lumi-my-materials__sharing-indicator--people::after {
    content: attr(data-tooltip);
    position: absolute;
    z-index: 30;
    bottom: calc(100% + 6px);
    left: 50%;
    width: max-content;
    max-width: 160px;
    padding: 4px 6px;
    border-radius: 4px;
    background: #303248;
    color: #fff;
    font-size: 10px;
    font-weight: 600;
    line-height: 1.2;
    white-space: nowrap;
    box-shadow: 0 3px 10px rgba(31, 35, 64, .16);
    opacity: 0;
    pointer-events: none;
    transform: translate(-50%, 2px);
    transition: opacity .12s ease, transform .12s ease;
}

.lumi-my-materials__sharing-indicator--people:hover::after,
.lumi-my-materials__sharing-indicator--people:focus::after,
.lumi-my-materials__sharing-indicator--people:focus-visible::after {
    opacity: 1;
    transform: translate(-50%, 0);
}

.lumi-my-materials__sharing-indicator svg {
    width: 15px;
    height: 15px;
    flex: 0 0 auto;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.lumi-my-materials__sharing-indicator--library {
    color: #16833f;
}

.lumi-my-materials__visibility-control {
    position: relative;
    display: grid;
    justify-items: start;
}

.lumi-my-materials__visibility-button {
    display: inline-flex !important;
    align-items: center;
    gap: 5px;
    min-height: 26px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: #303248 !important;
    font: inherit;
    font-size: 12px !important;
    font-weight: 700 !important;
    box-shadow: none !important;
    cursor: pointer;
}

.lumi-my-materials__visibility-review,
.lumi-my-materials__visibility-warning {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    line-height: 1;
}

.lumi-my-materials__visibility-review {
    position: relative;
    width: 15px;
    height: 15px;
    background: transparent;
    color: currentColor;
}

.lumi-my-materials__visibility-review::after {
    content: attr(data-tooltip);
    position: absolute;
    z-index: 30;
    bottom: calc(100% + 6px);
    left: 50%;
    width: max-content;
    max-width: 140px;
    padding: 4px 6px;
    border-radius: 4px;
    background: #303248;
    color: #fff;
    font-size: 10px;
    font-weight: 600;
    line-height: 1.2;
    white-space: nowrap;
    box-shadow: 0 3px 10px rgba(31, 35, 64, .16);
    opacity: 0;
    pointer-events: none;
    transform: translate(-50%, 2px);
    transition: opacity .12s ease, transform .12s ease;
}

.lumi-my-materials__visibility-review:hover::after,
.lumi-my-materials__visibility-review:focus::after,
.lumi-my-materials__visibility-review:focus-visible::after {
    opacity: 1;
    transform: translate(-50%, 0);
}

.lumi-my-materials__visibility-review svg {
    display: block;
    width: 15px;
    height: 15px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.25;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.lumi-my-materials__visibility-warning {
    position: relative;
    width: 17px;
    height: 17px;
    border-radius: 50%;
    background: #fde4e7;
    color: #a72b3b;
    font-weight: 800;
}

.lumi-my-materials__visibility-warning::after {
    content: attr(data-tooltip);
    position: absolute;
    z-index: 30;
    bottom: calc(100% + 6px);
    left: 50%;
    width: max-content;
    max-width: 160px;
    padding: 4px 6px;
    border-radius: 4px;
    background: #303248;
    color: #ffffff;
    font-size: 10px;
    font-weight: 600;
    line-height: 1.2;
    white-space: nowrap;
    box-shadow: 0 3px 10px rgba(31, 35, 64, .16);
    opacity: 0;
    pointer-events: none;
    transform: translate(-50%, 2px);
    transition: opacity .12s ease, transform .12s ease;
}

.lumi-my-materials__visibility-warning:hover::after,
.lumi-my-materials__visibility-warning:focus::after,
.lumi-my-materials__visibility-warning:focus-visible::after {
    opacity: 1;
    transform: translate(-50%, 0);
}

.lumi-my-materials__visibility-review[hidden],
.lumi-my-materials__visibility-warning[hidden] {
    display: none !important;
}

.lumi-my-materials__visibility-menu {
    position: static;
    width: 165px;
    box-sizing: border-box;
    margin-top: 4px;
    padding: 4px;
    border: 1px solid #e3e4ec;
    border-radius: 6px;
    background: #fff;
    box-shadow: 0 4px 12px rgba(31, 35, 64, .09);
}

.lumi-my-materials__visibility-menu[hidden] {
    display: none !important;
}

.lumi-my-materials__visibility-menu button {
    appearance: none !important;
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 6px 8px !important;
    border: 0 !important;
    border-radius: 4px !important;
    background: #fff !important;
    color: #303248 !important;
    text-align: left !important;
    font: inherit !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    line-height: 1.3 !important;
    box-shadow: none !important;
    cursor: pointer;
}

.lumi-my-materials__visibility-menu button:hover,
.lumi-my-materials__visibility-menu button:focus {
    background: #f5f5fa !important;
    color: #303248 !important;
    box-shadow: none !important;
}

.lumi-my-materials__visibility-menu button:focus-visible {
    outline: 1px solid #a9abe0;
    outline-offset: -1px;
}

.lumi-my-materials__visibility-menu button:disabled {
    background: #fff !important;
    color: #8b8d99 !important;
    opacity: .65;
    cursor: wait;
}

.lumi-my-materials__visibility-menu p {
    max-width: 230px;
    margin: 5px 9px 4px;
    color: #9f3a49;
    font-size: 11px;
    line-height: 1.35;
}

.lumi-my-materials__share svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.lumi-my-materials__share:hover,
.lumi-my-materials__share:focus {
    color: #3539bd !important;
    background: transparent !important;
}

.lumi-my-materials__share:focus-visible {
    outline: 2px solid #4e52d8;
    outline-offset: 2px;
    border-radius: 4px;
}

html.lumi-share-modal-open {
    overflow: hidden;
}

.lumi-material-share-modal[hidden] {
    display: none !important;
}

.lumi-material-share-modal {
    position: fixed;
    inset: 0;
    z-index: 100001;
    display: grid;
    place-items: center;
    padding: 24px;
}

.lumi-material-share-modal__overlay {
    position: absolute;
    inset: 0;
    background: rgba(27, 31, 45, .52);
    backdrop-filter: blur(3px);
}

.lumi-material-share-modal__box {
    position: relative;
    width: min(440px, 100%);
    max-height: calc(100vh - 48px);
    overflow: auto;
    box-sizing: border-box;
    padding: 28px;
    border: 1px solid #e5e7f2;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 24px 70px rgba(31, 35, 64, .24);
}

.lumi-material-share-modal__eyebrow {
    display: block;
    margin: 0 42px 5px 0;
    color: #6865d9;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.lumi-material-share-modal h3 {
    margin: 0 42px 18px 0;
    color: #17172f;
    font-size: 22px;
}

.lumi-material-share-modal__search input {
    width: 100%;
    height: 44px;
    box-sizing: border-box;
    padding: 0 44px 0 13px;
    border: 1px solid #d8d9e7;
    border-radius: 6px;
    background: #ffffff;
    color: #17172f;
    font: inherit;
    font-size: 14px;
    box-shadow: none;
}

.lumi-material-share-modal__search {
    position: relative;
}

button.lumi-material-share-modal__search-remove {
    appearance: none;
    position: absolute;
    top: 50%;
    right: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    min-width: 28px;
    min-height: 28px;
    padding: 0;
    border: 0 !important;
    border-radius: 6px;
    background: transparent !important;
    color: #555971 !important;
    font-size: 22px;
    font-weight: 400;
    line-height: 1;
    box-shadow: none !important;
    cursor: pointer;
    transform: translateY(-50%);
}

button.lumi-material-share-modal__search-remove:hover,
button.lumi-material-share-modal__search-remove:focus-visible {
    border: 0 !important;
    background: #f3f3f7 !important;
    color: #303248 !important;
    box-shadow: none !important;
    outline: none;
}

button.lumi-material-share-modal__search-remove[hidden] {
    display: none;
}

.lumi-material-share-modal__search input:focus,
.lumi-material-share-modal__search input:focus-visible {
    border-color: #4e52d8;
    outline: none;
    box-shadow: 0 0 0 3px rgba(78, 82, 216, .12);
}

.lumi-material-share-modal__results,
.lumi-material-share-modal__selected {
    display: grid;
    gap: 6px;
    margin-top: 8px;
}

.lumi-material-share-modal__results {
    position: relative;
    z-index: 2;
}

button.lumi-material-share-modal__person {
    appearance: none;
    width: 100%;
    padding: 10px 11px;
    border: 1px solid #e5e6ef !important;
    border-radius: 6px;
    background: #ffffff !important;
    color: #303248 !important;
    text-align: left;
    cursor: pointer;
}

button.lumi-material-share-modal__person:hover,
button.lumi-material-share-modal__person:focus-visible {
    border-color: #d8d9e9 !important;
    background: #f7f7f9 !important;
    color: #303248 !important;
    outline: none;
}

.lumi-material-share-modal__submit {
    width: 100%;
    min-height: 42px !important;
    margin-top: 18px;
    padding: 0 18px !important;
    border-radius: 6px !important;
}

.lumi-material-share-modal__submit:disabled {
    border-color: #c9cad6 !important;
    background: #c9cad6 !important;
    color: #ffffff !important;
    cursor: default;
    opacity: 1;
}

.lumi-material-share-modal__current {
    margin-top: 10px;
}

button.lumi-material-share-modal__current-toggle {
    appearance: none;
    padding: 3px 0;
    border: 0 !important;
    background: transparent !important;
    color: #555971 !important;
    font: inherit;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.4;
    text-decoration: underline;
    text-decoration-color: #c8cad8;
    text-underline-offset: 3px;
    cursor: pointer;
}

button.lumi-material-share-modal__current-toggle:hover,
button.lumi-material-share-modal__current-toggle:focus-visible {
    border: 0 !important;
    background: transparent !important;
    color: #303248 !important;
    box-shadow: none !important;
    outline: 2px solid rgba(85, 89, 113, .22);
    outline-offset: 2px;
}

.lumi-material-share-modal__current [data-lumi-material-share-current] {
    display: grid;
    gap: 6px;
    margin-top: 8px;
}

.lumi-material-share-modal__current [data-lumi-material-share-current][hidden] {
    display: none;
}

.lumi-material-share-modal__library {
    margin-top: 20px;
    padding-top: 16px;
    border-top: 1px solid #ececf3;
}

.lumi-material-share-modal__library h4 {
    margin: 0 0 10px;
    color: #303248;
    font-size: 13px;
}

.lumi-material-share-modal__library > div {
    display: grid;
    gap: 10px;
}

.lumi-material-share-modal__library-status,
.lumi-material-share-modal__library-help,
.lumi-material-share-modal__library-reason {
    margin: 0;
}

.lumi-material-share-modal__library-status {
    color: #303248;
    font-size: 13px;
    font-weight: 700;
}

.lumi-material-share-modal__library-status--published {
    color: #16833f;
}

.lumi-material-share-modal__library-help {
    color: #74778a;
    font-size: 12px;
    line-height: 1.45;
}

.lumi-material-share-modal__library-reason {
    color: #9f3a49;
    font-size: 12px;
    font-weight: 600;
}

.lumi-material-share-modal__library-choice {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    color: #303248;
    cursor: pointer;
}

.lumi-material-share-modal__library-choice input {
    margin-top: 3px;
}

.lumi-material-share-modal__library-choice span {
    display: grid;
    gap: 3px;
}

.lumi-material-share-modal__library-choice small {
    color: #74778a;
    font-size: 12px;
    font-weight: 400;
}

.lumi-material-share-modal__library-expanded {
    display: grid;
    gap: 12px;
    padding-top: 2px;
}

.lumi-material-share-modal__library-confirmation {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    color: #303248;
    font-size: 12px;
    line-height: 1.45;
    cursor: pointer;
}

.lumi-material-share-modal__library-confirmation input {
    margin-top: 3px;
}

.lumi-material-share-modal__person {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 9px 0;
}

.lumi-material-share-modal__selected .lumi-material-share-modal__person,
.lumi-material-share-modal__current .lumi-material-share-modal__person {
    padding: 9px 11px;
    border: 1px solid #e5e6ef;
    border-radius: 6px;
    background: #fafaff;
}

.lumi-material-share-modal__person > div {
    display: grid;
    min-width: 0;
}

.lumi-material-share-modal__person strong,
.lumi-material-share-modal__person span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lumi-material-share-modal__person strong {
    color: #303248 !important;
}

.lumi-material-share-modal__person span,
.lumi-material-share-modal__empty {
    color: #74778a !important;
    font-size: 12px;
}

.lumi-material-share-modal__person button {
    flex: 0 0 auto;
    padding: 5px 9px;
    border: 0;
    border-radius: 7px;
    background: #f0f1ff;
    color: #4e52d8;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
}

.lumi-material-share-modal__empty {
    margin: 8px 0;
}

.lumi-material-share-modal__error {
    margin: 12px 0 0;
    color: #b42318;
    font-size: 12px;
}

.lumi-material-share-modal__link-section {
    margin-top: 22px;
    padding-top: 18px;
    border-top: 1px solid #ececf3;
}

.lumi-material-share-modal__link-section h4 {
    margin: 0 0 5px;
    color: #303248;
    font-size: 14px;
}

.lumi-material-share-modal__link-section > p {
    margin: 0 0 11px;
    color: #74778a;
    font-size: 12px;
    line-height: 1.45;
}

.lumi-material-share-modal__link-controls {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

.lumi-material-share-modal__link-controls input {
    width: 100%;
    height: 38px;
    box-sizing: border-box;
    padding: 0 10px;
    border: 1px solid #d8d9e7;
    border-radius: 6px;
    background: #f8f8fb;
    color: #555971;
    font: inherit;
    font-size: 12px;
}

.lumi-material-share-modal__link-controls .lumi-button {
    min-height: 38px !important;
    padding: 0 14px !important;
    border-radius: 6px !important;
}

.lumi-material-share-modal__copied {
    color: #16833f;
    font-size: 12px;
    font-weight: 700;
}

.lumi-shared-material-view {
    min-height: 100vh;
    margin: 0;
    background: #f7f7fb;
    color: #17172f;
}

.lumi-shared-material-view__main {
    display: grid;
    min-height: 100vh;
    place-items: center;
    box-sizing: border-box;
    padding: 24px;
}

.lumi-shared-material-view__card {
    width: min(420px, 100%);
    box-sizing: border-box;
    padding: 28px;
    border: 1px solid #e5e7f0;
    border-radius: 16px;
    background: #ffffff;
    box-shadow: 0 12px 34px rgba(23, 23, 47, .08);
}

.lumi-shared-material-view__card h1 {
    margin: 18px 0 8px;
    font-size: 26px;
    line-height: 1.2;
}

.lumi-shared-material-view__card p {
    margin: 0 0 20px;
    color: #6f7280;
}

.lumi-my-materials__actions .lumi-button--outline-primary {
    border-width: 1px !important;
}

@media (max-width: 1100px) {
    .lumi-my-materials__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
/* Material delete modal */

.lumi-material-delete-modal[hidden] {
    display: none !important;
}

.lumi-material-delete-modal {
    position: fixed;
    inset: 0;
    z-index: 999999;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 24px;
}

.lumi-material-delete-modal__overlay {
    position: absolute;
    inset: 0;
    background: rgba(23, 23, 47, 0.42);
}

.lumi-material-delete-modal__box {
    position: relative;
    z-index: 2;

    width: min(92vw, 420px);
    padding: 32px;

    background: #ffffff;
    border-radius: 20px;
    box-shadow: 0 24px 80px rgba(23, 23, 47, 0.22);
}

.lumi-material-delete-modal__box h3 {
    margin: 0 0 10px;
    color: #17172f;
    font-size: 24px;
    line-height: 1.2;
}

.lumi-material-delete-modal__box p {
    margin: 0;
    color: #6f7280;
    font-size: 15px;
    line-height: 1.5;
}

.lumi-material-delete-modal__actions {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 28px;
}

.lumi-material-delete-modal__actions .lumi-button {
    border-radius: 6px !important;
}

.lumi-material-delete-modal__confirm {
    background: #FC7754 !important;
    border-color: #FC7754 !important;
}
/* Progressive flashcards workspace grid */

.lumi-flashcards-grid[data-lumi-flashcards-grid] {
    width: calc(100% - 210px) !important;
    max-width: calc(100% - 210px) !important;
    grid-template-columns: repeat(auto-fill, minmax(220px, 250px)) !important;
    justify-content: stretch !important;
    align-items: start !important;
    column-gap: 22px !important;
    row-gap: 22px !important;
    margin-bottom: 0 !important;
}

.lumi-flashcards-grid[data-lumi-flashcards-grid] .lumi-media-slot {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: 1 / 1 !important;
}

/* Small laptop / tablet landscape */
@media (max-width: 1279px) {
    .lumi-flashcards-grid[data-lumi-flashcards-grid] {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

/* Tablet portrait / narrow screens */
@media (max-width: 860px) {
    .lumi-flashcards-grid[data-lumi-flashcards-grid] {
        grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
    }
}
/* Card size confirm modal */

.lumi-confirm-modal[hidden] {
    display: none !important;
}

.lumi-confirm-modal {
    position: fixed;
    inset: 0;
    z-index: 2147483000;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 24px;
}

.lumi-confirm-modal__overlay {
    position: absolute;
    inset: 0;
    background: rgba(23, 23, 47, 0.45);
}

.lumi-confirm-modal__box {
    position: relative;
    z-index: 2;

    width: min(92vw, 460px);
    padding: 34px;

    background: #ffffff;
    border-radius: 22px;
    box-shadow: 0 24px 80px rgba(23, 23, 47, 0.24);
}

.lumi-confirm-modal__close {
    position: absolute;
    top: 18px;
    right: 20px;

    width: 28px;
    height: 28px;

    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;

    color: #8a8d99;

    font-size: 28px;
    font-weight: 400;
    line-height: 1;

    cursor: pointer;
}

.lumi-confirm-modal__close:hover,
.lumi-confirm-modal__close:focus {
    color: #FC7754;
    background: transparent;
    box-shadow: none;
}

.lumi-confirm-modal__eyebrow {
    margin-bottom: 10px;

    color: #4E52D8;
    font-size: 13px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.lumi-confirm-modal__title {
    margin: 0 0 10px;

    color: #17172f;
    font-size: 24px;
    line-height: 1.2;
}

.lumi-confirm-modal__text {
    margin: 0;

    color: #6f7280;
    font-size: 15px;
    line-height: 1.5;
}

.lumi-confirm-modal__actions {
    display: flex;
    justify-content: flex-end;
    gap: 12px;

    margin-top: 30px;
}

[data-lumi-unsaved-changes-modal] .lumi-confirm-modal__actions .lumi-button {
    border-radius: 6px !important;
}

[data-lumi-unsaved-changes-stay].lumi-button {
    border-color: #4e52d8 !important;
    background: transparent !important;
    color: #4e52d8 !important;
}

[data-lumi-unsaved-changes-stay].lumi-button:hover,
[data-lumi-unsaved-changes-stay].lumi-button:focus-visible {
    border-color: #4e52d8 !important;
    background: rgba(78, 82, 216, 0.06) !important;
    color: #4e52d8 !important;
}

.lumi-flashcards-limit-message {
    margin: 10px 0 90;

    color: #FC7754;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.35;
}

.lumi-flashcards-limit-message[hidden] {
    display: none !important;
}
/* Responsive print settings */

.lumi-format-options {
    display: flex !important;
    align-items: flex-start !important;
    gap: 2px !important;
    flex-wrap: wrap !important;
}

.lumi-format-group--page {
    flex: 0 0 146px !important;
    margin-right: 0 !important;
}

.lumi-format-group--size {
    flex: 0 1 auto !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    max-width: 100% !important;
}

.lumi-card-size-control {
    display: flex !important;
    gap: 6px !important;
}

/* Small laptop / tablet landscape */
@media (max-width: 1279px) {
    .lumi-format-group--page {
        flex: 0 0 150px !important;
    }

    .lumi-format-group--size {
        flex: 1 1 100% !important;
    }

}

/* Tablet portrait */
@media (max-width: 860px) {
    .lumi-format-options {
        flex-direction: column !important;
        gap: 16px !important;
    }

    .lumi-format-group--page,
    .lumi-format-group--size {
        width: 100% !important;
        flex: 1 1 auto !important;
    }

}
/* Fix profile modal close state */

.lumi-profile-modal.is-hidden {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}
/* Flashcards title row with Save button */

.lumi-flashcards-embedded__header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 24px !important;

    width: 100% !important;
    margin-bottom: 26px !important;
}

.lumi-flashcards-embedded__header h2 {
    margin: 0 !important;
    font-size: 34px !important;
    line-height: 1.2 !important;
    font-weight: 500 !important;
    color: #111111 !important;
}

/* Save material button in flashcards header */

button.lumi-flashcards-save-top,
.lumi-flashcards-save-top {
    appearance: none !important;
    -webkit-appearance: none !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;

    flex: 0 0 auto !important;

    width: auto !important;
    min-width: 0 !important;
    height: 34px !important;
    min-height: 34px !important;

    padding: 0 14px !important;

    border: 1px solid #4E52D8 !important;
    border-radius: 999px !important;

    background: transparent !important;
    color: #4E52D8 !important;

    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1 !important;

    box-shadow: none !important;
    white-space: nowrap !important;
    opacity: 1 !important;
}

button.lumi-flashcards-save-top:hover,
button.lumi-flashcards-save-top:focus,
.lumi-flashcards-save-top:hover,
.lumi-flashcards-save-top:focus {
    background: transparent !important;
    color: #4E52D8 !important;
    border-color: #4E52D8 !important;
    box-shadow: none !important;
    opacity: 1 !important;
}

.lumi-flashcards-save-top__icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 14px !important;
    height: 14px !important;
    flex: 0 0 14px !important;
}

.lumi-flashcards-save-top__icon svg {
    display: block !important;
    width: 14px !important;
    height: 14px !important;
}

.lumi-flashcards-save-top__icon svg path {
    stroke: currentColor !important;
    stroke-width: 1.2 !important;
}
/* New material button in flashcards header */

button.lumi-flashcards-new-top,
.lumi-flashcards-new-top {
    appearance: none !important;
    -webkit-appearance: none !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    flex: 0 0 auto !important;

    width: auto !important;
    min-width: 0 !important;
    height: 34px !important;
    min-height: 34px !important;

    padding: 0 14px !important;

    border: 1px solid #4E52D8 !important;
    border-radius: 999px !important;

    background: transparent !important;
    color: #4E52D8 !important;

    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1 !important;

    box-shadow: none !important;
    white-space: nowrap !important;
    opacity: 1 !important;
}

button.lumi-flashcards-new-top[disabled],
.lumi-flashcards-new-top[disabled],
button.lumi-flashcards-new-top.is-disabled,
.lumi-flashcards-new-top.is-disabled {
    background: transparent !important;
    border-color: #C7CADC !important;
    color: #8A8D99 !important;
    cursor: not-allowed !important;
    pointer-events: none !important;
    box-shadow: none !important;
    opacity: 1 !important;
}

button.lumi-flashcards-new-top[disabled]:hover,
button.lumi-flashcards-new-top[disabled]:focus,
.lumi-flashcards-new-top[disabled]:hover,
.lumi-flashcards-new-top[disabled]:focus,
button.lumi-flashcards-new-top.is-disabled:hover,
button.lumi-flashcards-new-top.is-disabled:focus,
.lumi-flashcards-new-top.is-disabled:hover,
.lumi-flashcards-new-top.is-disabled:focus {
    background: transparent !important;
    color: #8A8D99 !important;
    border-color: #C7CADC !important;
    box-shadow: none !important;
    opacity: 1 !important;
}

button.lumi-flashcards-new-top:hover,
button.lumi-flashcards-new-top:focus,
.lumi-flashcards-new-top:hover,
.lumi-flashcards-new-top:focus {
    background: transparent !important;
    color: #4E52D8 !important;
    border-color: #4E52D8 !important;
    box-shadow: none !important;
    opacity: 1 !important;
}

button.lumi-flashcards-new-top:active,
.lumi-flashcards-new-top:active {
    transform: scale(1.02) !important;
    transition: transform 0.12s ease !important;
}
/* Flashcards action hierarchy */

/* Save material = primary save action, coral */
button.lumi-flashcards-save-top,
.lumi-flashcards-save-top {
    background: #FF7A59 !important;
    border-color: #FF7A59 !important;
    color: #ffffff !important;
}

button.lumi-flashcards-save-top:hover,
button.lumi-flashcards-save-top:focus,
.lumi-flashcards-save-top:hover,
.lumi-flashcards-save-top:focus {
    background: #F26D4C !important;
    border-color: #F26D4C !important;
    color: #ffffff !important;
}

/* Preview = secondary action, same outline style as New resource */
.lumi-flashcards-bottom-bar button[data-lumi-preview-flashcards] {
    height: 34px !important;
    min-height: 34px !important;
    padding: 0 14px !important;

    background: transparent !important;
    border: 1px solid #4E52D8 !important;
    color: #4E52D8 !important;

    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1 !important;

    box-shadow: none !important;
    opacity: 1 !important;
}

.lumi-flashcards-bottom-bar button[data-lumi-preview-flashcards]:hover,
.lumi-flashcards-bottom-bar button[data-lumi-preview-flashcards]:focus {
    background: #4E52D8 !important;
    border-color: #4E52D8 !important;
    color: #ffffff !important;

    box-shadow: none !important;
    opacity: 1 !important;
}

.lumi-flashcards-bottom-bar button[data-lumi-preview-flashcards]:active {
    transform: scale(1.02) !important;
    transition: transform 0.12s ease !important;
}

.lumi-flashcards-bottom-bar button[data-lumi-export-flashcards] {
    height: 34px !important;
    min-height: 34px !important;
    padding: 0 14px !important;

    background: #4E52D8 !important;
    border: 1px solid #4E52D8 !important;
    color: #ffffff !important;

    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    box-shadow: none !important;
    opacity: 1 !important;
}

.lumi-flashcards-bottom-bar button[data-lumi-export-flashcards]:hover,
.lumi-flashcards-bottom-bar button[data-lumi-export-flashcards]:focus {
    background: #FC7754 !important;
    border-color: #FC7754 !important;
    color: #ffffff !important;
    box-shadow: none !important;
    opacity: 1 !important;
}

.lumi-flashcards-bottom-bar button[data-lumi-export-flashcards]:active {
    transform: scale(1.02) !important;
    transition: transform 0.12s ease !important;
}

/* LUMI character picker */
.lumi-character-picker {
    grid-column: 1 / -1 !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
}

.lumi-character-picker legend {
    margin: 0 0 12px !important;
    padding: 0 !important;
    color: #5e6077 !important;
    font-size: 14px !important;
    font-weight: 600 !important;
}

.lumi-character-picker__grid {
    display: grid !important;
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    gap: 10px !important;
    align-items: start !important;
}

.lumi-character-card {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 8px !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    cursor: pointer !important;
}

.lumi-character-card__image {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 76px !important;
    height: 76px !important;
    overflow: hidden !important;
    border: 2px solid #d7d7e5 !important;
    border-radius: 50% !important;
    background: #f7f7fb !important;
    transition:
        border-color 0.18s ease,
        box-shadow 0.18s ease,
        transform 0.18s ease !important;
}

.lumi-character-card:hover .lumi-character-card__image {
    border-color: #4e52d8 !important;
    transform: translateY(-2px) !important;
}

.lumi-character-card:has(input:checked) .lumi-character-card__image {
    border-color: #4e52d8 !important;
    box-shadow: 0 0 0 3px rgba(78, 82, 216, 0.14) !important;
}

.lumi-character-card__image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
}

.lumi-character-card__choice {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 5px !important;
    white-space: nowrap !important;
}

.lumi-character-card:has(input[value="pictogram"]) .lumi-character-card__choice {
    width: max-content !important;
    justify-content: flex-start !important;
    align-self: flex-start !important;
}

.lumi-character-card__choice input {
    position: static !important;
    width: 17px !important;
    height: 17px !important;
    margin: 0 !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    accent-color: #4e52d8 !important;
    cursor: pointer !important;
}

.lumi-character-card__name {
    color: #17172f !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
}

@media (max-width: 680px) {
    .lumi-character-picker__grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        row-gap: 18px !important;
    }
}

/* LUMI character profile modal */
.lumi-profile-modal__box--character-profile {
    width: calc(100% - 40px) !important;
    max-width: 920px !important;
    max-height: calc(100vh - 40px) !important;
    overflow-y: auto !important;
}

/* LUMI character profile layout refinement */
.lumi-profile-form__style {
    grid-column: 1 / -1 !important;
    width: 100% !important;
}

.lumi-character-picker legend {
    margin-bottom: 4px !important;
    color: #17172f !important;
    font-size: 16px !important;
    font-weight: 700 !important;
}

.lumi-character-picker__description {
    margin: 0 0 14px !important;
    color: #77798d !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
}

.lumi-character-picker__grid {
    grid-template-columns: repeat(6, 76px) !important;
    justify-content: start !important;
    gap: 16px !important;
}

/* LUMI character profile final sizing */
.lumi-profile-modal__box--character-profile {
    width: calc(100% - 40px) !important;
    max-width: 820px !important;
    padding: 44px 48px 40px !important;
}

.lumi-profile-modal__box--character-profile .lumi-profile-modal__close {
    top: 20px !important;
    right: 24px !important;
    width: 40px !important;
    height: 40px !important;
    color: #17172f !important;
    font-size: 32px !important;
    font-weight: 400 !important;
}

.lumi-profile-modal__box--character-profile .lumi-profile-modal__footer {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 20px !important;
    margin-top: 8px !important;
}

.lumi-profile-modal__box--character-profile .lumi-profile-modal__main-actions {
    display: flex !important;
    align-items: center !important;
    order: 2 !important;
}

.lumi-profile-modal__box--character-profile .lumi-profile-modal__skip {
    display: none !important;
}

.lumi-profile-modal__box--character-profile .lumi-profile-modal__delete {
    order: 1 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 170px !important;
    min-height: 46px !important;
    padding: 10px 22px !important;
    border: 1.5px solid #ff7a59 !important;
    border-radius: 6px !important;
    background: #ffffff !important;
    color: #ff7a59 !important;
    text-decoration: none !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    line-height: 1 !important;
}

.lumi-profile-modal__box--character-profile .lumi-profile-modal__delete:hover {
    background: rgba(255, 122, 89, 0.07) !important;
    color: #ff7a59 !important;
}

.lumi-profile-modal__box--character-profile button[name="lumi_save_child_profile_submit"] {
    min-width: 170px !important;
    min-height: 46px !important;
    padding: 10px 22px !important;
    border-radius: 6px !important;
}

/* LUMI delete confirmation modal */
.lumi-profile-modal__box--delete-confirmation .lumi-profile-modal__close {
    top: 20px !important;
    right: 24px !important;
    width: 42px !important;
    height: 42px !important;
    color: #17172f !important;
    font-size: 34px !important;
    font-weight: 400 !important;
}

.lumi-profile-modal__box--delete-confirmation .lumi-profile-modal__footer {
    margin-top: 28px !important;
}

.lumi-profile-modal__box--delete-confirmation .lumi-profile-modal__main-actions {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 14px !important;
}

.lumi-profile-modal__box--delete-confirmation .lumi-profile-modal__danger-button {
    min-width: 170px !important;
    min-height: 48px !important;
    padding: 11px 24px !important;
    background: #ff7a59 !important;
    border: 2px solid #ff7a59 !important;
    border-radius: 6px !important;
    color: #ffffff !important;
}

.lumi-profile-modal__box--delete-confirmation .lumi-profile-modal__danger-button:hover {
    background: #ec6849 !important;
    border-color: #ec6849 !important;
}

.lumi-profile-modal__box--delete-confirmation .lumi-button--outline-dark {
    min-width: 170px !important;
    min-height: 48px !important;
    padding: 11px 24px !important;
    border-color: #4e52d8 !important;
    border-radius: 6px !important;
    background: transparent !important;
    color: #4e52d8 !important;
}

.lumi-profile-modal__box--delete-confirmation .lumi-button--outline-dark:hover,
.lumi-profile-modal__box--delete-confirmation .lumi-button--outline-dark:focus-visible {
    border-color: #4e52d8 !important;
    background: rgba(78, 82, 216, 0.06) !important;
    color: #4e52d8 !important;
}

/* LUMI profile eyebrow accent */
.lumi-profile-modal__box--character-profile > .lumi-eyebrow {
    color: #ff7a59 !important;
    text-transform: uppercase !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    letter-spacing: 0.08em !important;
}

/* LUMI profile select arrow */
.lumi-profile-modal__box--character-profile .lumi-profile-form select {
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    padding-right: 56px !important;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 7.5L10 12.5L15 7.5' stroke='%2317172F' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-size: 16px 16px !important;
    background-position: right 22px center !important;
}

/* Hide unavailable character styles */
.lumi-character-card[hidden] {
    display: none !important;
}

/* Library modal character picker */
.lumi-media-slot-library-character {
    margin: 22px 0 16px !important;
    border: 1px solid rgba(23, 23, 47, 0.14) !important;
    border-radius: 6px !important;
    background: #ffffff !important;
}

.lumi-media-slot-library-character__summary {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 20px !important;
    min-height: 52px !important;
    padding: 12px 18px !important;
    color: #17172f !important;
    font-size: 14px !important;
    cursor: pointer !important;
    list-style: none !important;
}

.lumi-media-slot-library-character__summary::-webkit-details-marker {
    display: none !important;
}

.lumi-media-slot-library-character__summary strong {
    font-weight: 700 !important;
}

.lumi-media-slot-library-character__change {
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    color: #4e52d8 !important;
    font-size: 13px !important;
    font-weight: 700 !important;
}

.lumi-media-slot-library-character__change::after {
    width: 7px !important;
    height: 7px !important;
    border-right: 2px solid currentColor !important;
    border-bottom: 2px solid currentColor !important;
    content: '' !important;
    transform: translateY(-2px) rotate(45deg) !important;
    transition: transform 0.18s ease !important;
}

.lumi-media-slot-library-character[open] .lumi-media-slot-library-character__change::after {
    transform: translateY(2px) rotate(225deg) !important;
}

.lumi-media-slot-library-character__change-close {
    display: none;
}

.lumi-media-slot-library-character[open] .lumi-media-slot-library-character__change-open {
    display: none;
}

.lumi-media-slot-library-character[open] .lumi-media-slot-library-character__change-close {
    display: inline;
}

.lumi-media-slot-library-character__content {
    padding: 8px 32px 24px !important;
    border-top: 1px solid rgba(23, 23, 47, 0.1) !important;
}

.lumi-media-slot-library-character__description {
    margin: 16px 0 22px !important;
    color: #77798d !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
}

.lumi-media-slot-library-character__style {
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
}

.lumi-media-slot-library-character__style legend {
    margin: 0 0 10px !important;
    padding: 0 !important;
    color: #5e6077 !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
}

.lumi-media-slot-library-character__style-options {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 12px 24px !important;
}

.lumi-media-slot-library-character__style-option {
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    margin: 0 !important;
    color: #17172f !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.3 !important;
    cursor: pointer !important;
}

.lumi-media-slot-library-character__style-option input {
    position: static !important;
    width: 18px !important;
    height: 18px !important;
    margin: 0 !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    accent-color: #4e52d8 !important;
    cursor: pointer !important;
}

.lumi-media-slot-library-character__grid {
    position: relative !important;
    display: grid !important;
    grid-template-columns: repeat(6, 76px) !important;
    justify-content: start !important;
    gap: 24px 20px !important;
    margin-top: 24px !important;
    padding-top: 24px !important;
}

.lumi-media-slot-library-character__grid::before {
    position: absolute !important;
    top: 0 !important;
    right: -32px !important;
    left: -32px !important;
    height: 1px !important;
    background: rgba(23, 23, 47, 0.1) !important;
    content: '' !important;
}

.lumi-media-slot-library-character__grid .lumi-character-card {
    align-items: flex-start !important;
}

@media (max-width: 760px) {
    .lumi-media-slot-library-character__content {
        padding-right: 18px !important;
        padding-left: 18px !important;
    }

    .lumi-media-slot-library-character__grid {
        grid-template-columns: repeat(3, 76px) !important;
    }

    .lumi-media-slot-library-character__grid::before {
        right: -18px !important;
        left: -18px !important;
    }
}

/* PMPro checkout */
body.pmpro-checkout {
    background:
        radial-gradient(circle at 10% 4%, rgba(255, 102, 78, 0.05), transparent 25rem),
        radial-gradient(circle at 90% 5%, rgba(93, 72, 238, 0.07), transparent 30rem),
        #f8f8fc;
}

body.pmpro-checkout #content.site-main {
    width: min(1240px, calc(100% - 48px));
    margin: 0 auto;
    padding: 42px 0 76px;
}

body.pmpro-checkout .page-header,
body.pmpro-checkout .page-content {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
}

body.pmpro-checkout .page-header .entry-title {
    margin: 0 0 22px;
    color: #111936;
    font-size: clamp(36px, 4vw, 48px);
    font-weight: 800;
    letter-spacing: -0.045em;
    line-height: 1.05;
}

body.pmpro-checkout .pmpro,
body.pmpro-checkout .pmpro * {
    box-sizing: border-box;
}

body.pmpro-checkout .pmpro_form {
    display: grid;
    gap: 20px;
}

body.pmpro-checkout .pmpro_card {
    overflow: hidden;
    margin: 0;
    border: 1px solid rgba(25, 30, 61, 0.07);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.97);
    box-shadow: 0 16px 42px rgba(32, 37, 70, 0.08);
}

body.pmpro-checkout .pmpro_card_title {
    margin: 0;
    padding: 24px 28px 0;
    color: #111936;
    font-size: 25px;
    font-weight: 800;
    letter-spacing: -0.025em;
    line-height: 1.2;
}

body.pmpro-checkout .pmpro_card_content {
    padding: 18px 28px 24px;
    color: #525a70;
    font-size: 16px;
    line-height: 1.55;
}

body.pmpro-checkout #pmpro_pricing_fields {
    position: relative;
    border-top: 4px solid #ff664e;
}

body.pmpro-checkout #pmpro_pricing_fields::after {
    content: '100 AI generations / month';
    display: inline-flex;
    width: fit-content;
    margin: 0 28px 24px;
    padding: 7px 14px;
    border-radius: 999px;
    background: #fff0ec;
    color: #ff664e;
    font-size: 14px;
    font-weight: 800;
    line-height: 1.25;
}

body.pmpro-checkout #pmpro_level-6 #pmpro_pricing_fields {
    border-top-color: #5d48ee;
}

body.pmpro-checkout #pmpro_level-6 #pmpro_pricing_fields::after {
    content: '300 AI generations / month';
    background: #eeebff;
    color: #5d48ee;
}

body.pmpro-checkout .pmpro_level_name_text,
body.pmpro-checkout .pmpro_level_cost_text p {
    margin: 0 0 10px;
}

body.pmpro-checkout .pmpro_level_description_text {
    margin: 0 0 12px;
}

body.pmpro-checkout .pmpro_level_description_text code {
    padding: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    white-space: normal;
}

body.pmpro-checkout .pmpro_level_name_text strong,
body.pmpro-checkout .pmpro_level_cost_text strong {
    color: #111936;
    font-weight: 800;
}

body.pmpro-checkout .pmpro_form_fields {
    gap: 20px;
}

body.pmpro-checkout .pmpro_cols-2 {
    gap: 20px;
}

body.pmpro-checkout .pmpro_form_label {
    margin-bottom: 8px;
    color: #252c47;
    font-size: 15px;
    font-weight: 700;
}

body.pmpro-checkout .pmpro_form_input,
body.pmpro-checkout input[type='text'],
body.pmpro-checkout input[type='email'],
body.pmpro-checkout input[type='password'],
body.pmpro-checkout input[type='tel'],
body.pmpro-checkout select {
    min-height: 52px;
    padding: 12px 14px;
    border: 1px solid #d9dce7;
    border-radius: 6px;
    background: #ffffff;
    color: #111936;
    font-size: 16px;
    box-shadow: none;
    transition: border-color 160ms ease, box-shadow 160ms ease;
}

body.pmpro-checkout .pmpro_form_input:focus,
body.pmpro-checkout input:focus,
body.pmpro-checkout select:focus {
    border-color: #5d48ee;
    outline: none;
    box-shadow: 0 0 0 3px rgba(93, 72, 238, 0.12);
}

body.pmpro-checkout .pmpro_form_field-password-toggle {
    margin-top: 8px;
}

body.pmpro-checkout .pmpro_btn-password-toggle {
    color: #5d48ee;
    font-weight: 700;
}

body.pmpro-checkout .pmpro_card_actions {
    padding: 16px 28px;
    border-top: 1px solid #ececf3;
    background: #fafaff;
    color: #5d6478;
    font-size: 15px;
}

body.pmpro-checkout .pmpro_card_actions a {
    color: #5d48ee;
    font-weight: 700;
}

body.pmpro-checkout .lumi-checkout-stripe-card {
    display: flex;
    height: 100%;
    flex-direction: column;
}

body.pmpro-checkout .lumi-checkout-stripe-card .pmpro_card_content {
    flex: 1;
}

body.pmpro-checkout .lumi-checkout-stripe-card .pmpro_card_content p {
    max-width: 440px;
    margin: 0;
}

body.pmpro-checkout .lumi-checkout-stripe-card ul {
    display: grid;
    gap: 13px;
    margin: 26px 0 0;
    padding: 0;
    list-style: none;
}

body.pmpro-checkout .lumi-checkout-stripe-card li {
    position: relative;
    margin: 0;
    padding-left: 30px;
    color: #252c47;
    font-weight: 600;
}

body.pmpro-checkout .lumi-checkout-stripe-card li::before {
    content: '';
    position: absolute;
    top: 0.15em;
    left: 0;
    width: 19px;
    height: 19px;
    background: #5d48ee;
    -webkit-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m4 10.5 3.5 3.5L16 5.5' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m4 10.5 3.5 3.5L16 5.5' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

body.pmpro-checkout .lumi-checkout-stripe-card > .pmpro_form_submit {
    width: 100%;
    margin-top: auto;
    padding: 0 28px 28px;
}

body.pmpro-checkout .pmpro_form_submit {
    margin: 0;
}

body.pmpro-checkout #pmpro_btn-submit {
    min-height: 54px;
    padding: 13px 28px;
    border: 0;
    border-radius: 6px;
    background: #5d48ee;
    color: #ffffff;
    font-size: 17px;
    font-weight: 800;
    box-shadow: 0 10px 24px rgba(93, 72, 238, 0.22);
    transition: transform 160ms ease, background-color 160ms ease, box-shadow 160ms ease;
}

body.pmpro-checkout #pmpro_btn-submit:hover,
body.pmpro-checkout #pmpro_btn-submit:focus-visible {
    transform: translateY(-1px);
    background: #503bdf;
    box-shadow: 0 13px 28px rgba(93, 72, 238, 0.28);
}

body.pmpro-checkout .pmpro_message {
    border-radius: 8px;
}

body.pmpro-checkout.lumi-checkout-redirecting #pmpro_form > :not(.lumi-checkout-redirect-notice) {
    display: none !important;
}

body.pmpro-checkout .lumi-checkout-redirect-notice {
    display: flex;
    min-height: 180px;
    align-items: center;
    justify-content: center;
    padding: 32px;
    border: 1px solid rgba(25, 30, 61, 0.07);
    border-radius: 18px;
    background: #ffffff;
    color: #111936;
    font-size: 20px;
    font-weight: 700;
    text-align: center;
    box-shadow: 0 16px 42px rgba(32, 37, 70, 0.08);
}

@media (min-width: 901px) {
    body.pmpro-checkout .pmpro_form {
        grid-template-columns: 1fr;
    }

    body.pmpro-checkout #pmpro_message,
    body.pmpro-checkout #pmpro_message_bottom {
        grid-column: 1;
    }

    body.pmpro-checkout .lumi-checkout-columns {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 20px;
        align-items: stretch;
    }

    body.pmpro-checkout .lumi-checkout-left-column {
        display: grid;
        grid-template-rows: auto 1fr;
        gap: 20px;
        min-width: 0;
    }

    body.pmpro-checkout .lumi-checkout-left-column #pmpro_pricing_fields,
    body.pmpro-checkout .lumi-checkout-left-column #pmpro_user_fields {
        grid-column: auto;
        margin: 0;
    }

    body.pmpro-checkout #pmpro_pricing_fields .pmpro_card_content {
        display: block;
    }

    body.pmpro-checkout #pmpro_user_fields {
        grid-column: 1;
        margin: 0;
    }

    body.pmpro-checkout #pmpro_payment_information_fields {
        margin: 0;
    }

    body.pmpro-checkout #pmpro_user_fields,
    body.pmpro-checkout #pmpro_user_fields > .pmpro_card,
    body.pmpro-checkout #pmpro_payment_information_fields,
    body.pmpro-checkout #pmpro_payment_information_fields > .pmpro_card {
        height: 100%;
    }

    body.pmpro-checkout #pmpro_payment_information_fields > .lumi-checkout-payment-card {
        display: flex;
        flex-direction: column;
    }

    body.pmpro-checkout #pmpro_payment_information_fields > .lumi-checkout-payment-card > .pmpro_card_content {
        flex: 1;
    }

    body.pmpro-checkout .pmpro_form_submit {
        grid-column: 2;
        justify-self: start;
    }

    body.pmpro-checkout .lumi-checkout-payment-card > .pmpro_form_submit {
        width: 100%;
        margin-top: auto;
        padding: 0 28px 28px;
    }

}

@media (max-width: 900px) {
    body.pmpro-checkout #content.site-main {
        width: min(100% - 32px, 560px);
        padding: 34px 0 72px;
    }

    body.pmpro-checkout .page-header .entry-title {
        margin-bottom: 22px;
        font-size: 36px;
    }

    body.pmpro-checkout .pmpro_card_title {
        padding: 24px 22px 0;
        font-size: 22px;
    }

    body.pmpro-checkout .pmpro_card_content {
        padding: 18px 22px 24px;
    }

    body.pmpro-checkout .pmpro_card_actions {
        padding: 16px 22px;
    }

    body.pmpro-checkout #pmpro_pricing_fields::after {
        margin: 0 22px 24px;
    }

    body.pmpro-checkout .pmpro_cols-2 {
        grid-template-columns: 1fr;
    }

    body.pmpro-checkout #pmpro_btn-submit {
        width: 100%;
    }
}

/* Organizations contact flow */
body.lumi-organizations-contact-page {
    background:
        radial-gradient(circle at 10% 5%, rgba(255, 102, 78, 0.05), transparent 25rem),
        radial-gradient(circle at 90% 6%, rgba(93, 72, 238, 0.075), transparent 30rem),
        #f8f8fc;
}

body.lumi-organizations-contact-page .elementor-282 {
    display: grid;
    width: min(1240px, calc(100% - 48px));
    margin: 0 auto;
    padding: 58px 0 92px;
    grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
    gap: 48px;
    align-items: start;
}

body.lumi-organizations-contact-page .elementor-282 > .e-con {
    width: 100%;
    padding: 0;
}

body.lumi-organizations-contact-page .elementor-282 > .e-con > .e-con-inner {
    width: 100%;
    max-width: none;
    padding: 0;
}

body.lumi-organizations-contact-page .elementor-widget-heading .elementor-widget-container {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

body.lumi-organizations-contact-page .elementor-heading-title {
    margin: 0;
    color: #111936;
    font-size: clamp(40px, 3.8vw, 54px) !important;
    font-weight: 800;
    letter-spacing: -0.035em;
    line-height: 1.1;
}

body.lumi-organizations-contact-page .elementor-heading-title span {
    display: block;
}

.lumi-organizations-contact__eyebrow {
    display: inline-flex;
    margin-bottom: 18px;
    padding: 7px 13px;
    border-radius: 999px;
    background: #eeebff;
    color: #5d48ee;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 0.08em;
    line-height: 1.2;
}

.lumi-organizations-contact__intro {
    max-width: 510px;
    margin: 22px 0 0;
    color: #60687e;
    font-size: 18px;
    line-height: 1.55;
}

.lumi-organizations-contact__points {
    display: grid;
    gap: 15px;
    margin: 30px 0 0;
    padding: 0;
    list-style: none;
}

.lumi-organizations-contact__points li {
    position: relative;
    margin: 0;
    padding-left: 32px;
    color: #252c47;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.4;
}

.lumi-organizations-contact__points li::before {
    content: '';
    position: absolute;
    top: 0.15em;
    left: 0;
    width: 20px;
    height: 20px;
    background: #5d48ee;
    -webkit-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m4 10.5 3.5 3.5L16 5.5' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m4 10.5 3.5 3.5L16 5.5' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

body.lumi-organizations-contact-page .fluentform-widget-wrapper {
    padding: 32px;
    border: 1px solid rgba(25, 30, 61, 0.07);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.98);
    box-shadow: 0 16px 42px rgba(32, 37, 70, 0.08);
}

body.lumi-organizations-contact-page #fluentform_1 .ff-el-group {
    margin-bottom: 18px;
}

body.lumi-organizations-contact-page #fluentform_1 .ff-t-container {
    gap: 16px;
}

body.lumi-organizations-contact-page #fluentform_1 .ff-t-cell {
    padding: 0;
}

body.lumi-organizations-contact-page #fluentform_1 .ff-el-input--label label {
    margin-bottom: 8px;
    color: #252c47;
    font-size: 14px;
    font-weight: 700;
}

body.lumi-organizations-contact-page #fluentform_1 .ff-el-form-control {
    min-height: 52px;
    padding: 12px 14px;
    border: 1px solid #d9dce7;
    border-radius: 6px;
    background: #ffffff;
    color: #111936;
    font-size: 16px;
    box-shadow: none;
    transition: border-color 160ms ease, box-shadow 160ms ease;
}

body.lumi-organizations-contact-page #fluentform_1 textarea.ff-el-form-control {
    min-height: 148px;
    resize: vertical;
}

body.lumi-organizations-contact-page #fluentform_1 .ff-el-form-control:focus {
    border-color: #5d48ee;
    outline: none;
    box-shadow: 0 0 0 3px rgba(93, 72, 238, 0.12);
}

body.lumi-organizations-contact-page #fluentform_1 .ff-btn-submit {
    min-height: 54px;
    padding: 13px 28px;
    border: 0;
    border-radius: 6px;
    background: #5d48ee;
    color: #ffffff;
    font-size: 17px;
    font-weight: 800;
    box-shadow: 0 10px 24px rgba(93, 72, 238, 0.22);
    transition: transform 160ms ease, background-color 160ms ease, box-shadow 160ms ease;
}

body.lumi-organizations-contact-page #fluentform_1 .ff-btn-submit:hover,
body.lumi-organizations-contact-page #fluentform_1 .ff-btn-submit:focus-visible {
    transform: translateY(-1px);
    background: #503bdf;
    box-shadow: 0 13px 28px rgba(93, 72, 238, 0.28);
}

@media (max-width: 860px) {
    body.lumi-organizations-contact-page .elementor-282 {
        width: min(100% - 32px, 620px);
        padding: 38px 0 72px;
        grid-template-columns: 1fr;
        gap: 30px;
    }

    body.lumi-organizations-contact-page .elementor-heading-title {
        font-size: 40px !important;
    }

    body.lumi-organizations-contact-page .fluentform-widget-wrapper {
        padding: 24px;
    }
}

/* Library result image preview */
.lumi-media-slot-library-result__preview {
    position: absolute !important;
    top: 14px !important;
    left: 14px !important;
    z-index: 3 !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 36px !important;
    height: 36px !important;
    padding: 0 !important;

    border: 1px solid rgba(23, 23, 47, 0.14) !important;
    border-radius: 50% !important;
    background: rgba(255, 255, 255, 0.94) !important;
    color: #17172f !important;
    box-shadow: 0 4px 14px rgba(23, 23, 47, 0.1) !important;
    cursor: pointer !important;
}

.lumi-media-slot-library-result__preview:hover,
.lumi-media-slot-library-result__preview:focus {
    border-color: #4e52d8 !important;
    color: #4e52d8 !important;
    transform: translateY(-1px) !important;
}

.lumi-media-slot-library-result__preview svg {
    width: 20px !important;
    height: 20px !important;
    display: block !important;
}

.lumi-library-image-preview {
    position: fixed !important;
    inset: 0 !important;
    z-index: 1000001 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    padding: 30px !important;
}

.lumi-library-image-preview[hidden] {
    display: none !important;
}

.lumi-library-image-preview__overlay {
    position: absolute !important;
    inset: 0 !important;
    background: rgba(23, 23, 47, 0.7) !important;
}

.lumi-library-image-preview__box {
    position: relative !important;
    z-index: 1 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: min(760px, calc(100vw - 60px)) !important;
    height: min(760px, calc(100vh - 60px)) !important;
    padding: 24px !important;

    border-radius: 24px !important;
    background: #ffffff !important;
    box-shadow: 0 24px 80px rgba(23, 23, 47, 0.28) !important;
}

.lumi-library-image-preview__box img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    display: block !important;
}

/* Tablet editor workspace: compact navigation and width-aware canvas. */
.lumi-child-sidebar__toggle {
    display: none !important;
}

.lumi-child-app-header__compact-logo {
    display: none !important;
}

@media (min-width: 768px) and (max-width: 1440px) {
    body:has(.lumi-child-page) .lumi-child-page {
        --lumi-tablet-sidebar-width: 240px;
        --lumi-tablet-preview-width: 260px;
        grid-template-columns: var(--lumi-tablet-sidebar-width) minmax(0, 1fr) !important;
        column-gap: 20px !important;
        min-height: 100dvh !important;
        padding-right: 24px !important;
        padding-bottom: 24px !important;
        transition: grid-template-columns 180ms ease;
    }

    body:has(.lumi-child-page) .lumi-child-page.is-tablet-sidebar-collapsed {
        --lumi-tablet-sidebar-width: 72px;
    }

    body:has(.lumi-child-page) .lumi-child-app-header {
        grid-template-columns: var(--lumi-tablet-sidebar-width) minmax(0, 1fr) auto minmax(0, 1fr) !important;
    }

    body:has(.lumi-child-page) .lumi-child-sidebar {
        width: var(--lumi-tablet-sidebar-width) !important;
        min-height: calc(100dvh - 91px) !important;
        transition: width 180ms ease;
    }

    body:has(.lumi-child-page) .lumi-child-sidebar__toggle {
        display: flex !important;
        align-items: center;
        justify-content: flex-end;
        width: calc(100% - 24px);
        min-height: 44px;
        margin: 8px 12px 0;
        padding: 8px 10px;
        border: 1px solid #e4e4ef;
        border-radius: 6px;
        background: #ffffff;
        color: #4e52d8;
        font: inherit;
        font-size: 13px;
        font-weight: 600;
        cursor: pointer;
    }

    body:has(.lumi-child-page) .lumi-child-sidebar__toggle:focus-visible {
        outline: 2px solid #4e52d8;
        outline-offset: 2px;
    }

    .lumi-child-sidebar__toggle-icon {
        position: relative;
        width: 20px;
        height: 20px;
        flex: 0 0 20px;
        border: 1.5px solid currentColor;
        border-radius: 3px;
        transition: transform 200ms ease-in-out;
    }

    .lumi-child-sidebar__toggle-icon::before {
        position: absolute;
        top: 2px;
        bottom: 2px;
        left: 6px;
        border-left: 1.5px solid currentColor;
        content: "";
    }

    .lumi-child-sidebar__toggle-icon::after {
        position: absolute;
        top: 50%;
        right: 2px;
        width: 5px;
        height: 5px;
        border-right: 1.5px solid currentColor;
        border-bottom: 1.5px solid currentColor;
        content: "";
        transform: translateY(-50%) rotate(135deg);
    }

    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-sidebar__toggle-icon::after {
        right: 2px;
        transform: translateY(-50%) rotate(135deg);
    }

    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-sidebar__toggle-icon {
        transform: rotate(180deg);
    }

    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-sidebar__toggle {
        justify-content: center;
        width: 44px;
        margin-right: 12px;
        margin-left: auto;
        padding: 8px;
    }

    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-sidebar__toggle-label,
    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-workspace-menu__badge {
        display: none !important;
    }

    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-workspace-menu__label {
        position: absolute !important;
        width: 1px !important;
        height: 1px !important;
        padding: 0 !important;
        overflow: hidden !important;
        clip: rect(0, 0, 0, 0) !important;
        white-space: nowrap !important;
        border: 0 !important;
    }

    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-workspace-menu {
        padding-top: 12px !important;
        padding-left: 0 !important;
    }

    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-workspace-menu__primary {
        align-items: center;
        width: 64px;
        margin-right: auto;
        margin-left: auto;
        padding: 6px;
        box-sizing: border-box;
    }

    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-flashcards-embedded__top::after {
        left: -20px;
    }

    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-workspace-menu__item {
        justify-content: center;
        width: 48px;
        min-height: 48px;
        margin-right: auto;
        margin-left: auto;
        padding: 12px !important;
        gap: 0;
    }

    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-workspace-menu__item.is-active,
    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-workspace-menu__item:hover {
        margin-right: auto;
        margin-left: auto;
    }

    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-sidebar,
    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-workspace-menu,
    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-workspace-menu__primary {
        overflow: visible !important;
    }

    @media (hover: hover) and (pointer: fine) {
        body:has(.lumi-child-page)
            .lumi-child-page.is-tablet-sidebar-collapsed:has(
                .lumi-child-workspace-menu__item[data-lumi-nav-label]:hover,
                .lumi-child-workspace-menu__item[data-lumi-nav-label]:focus-visible
            )
            .lumi-child-sidebar {
            z-index: 11 !important;
        }

        body:has(.lumi-child-page)
            .lumi-child-page.is-tablet-sidebar-collapsed
            .lumi-child-workspace-menu__item[data-lumi-nav-label] {
            position: relative;
        }

        body:has(.lumi-child-page)
            .lumi-child-page.is-tablet-sidebar-collapsed
            .lumi-child-workspace-menu__item[data-lumi-nav-label]::after {
            position: absolute;
            z-index: 20;
            top: 50%;
            left: calc(100% + 10px);
            width: max-content;
            max-width: 220px;
            padding: 7px 10px;
            border: 1px solid #e4e4ef;
            border-radius: 6px;
            background: #ffffff;
            color: #17172f;
            box-shadow: 0 6px 18px rgba(23, 23, 47, 0.12);
            content: attr(data-lumi-nav-label);
            font-size: 13px;
            font-weight: 600;
            line-height: 1.3;
            opacity: 0;
            pointer-events: none;
            transform: translate(4px, -50%);
            transition: opacity 140ms ease, transform 140ms ease;
            visibility: hidden;
            white-space: nowrap;
        }

        body:has(.lumi-child-page)
            .lumi-child-page.is-tablet-sidebar-collapsed
            .lumi-child-workspace-menu__item[data-lumi-nav-label]:hover::after,
        body:has(.lumi-child-page)
            .lumi-child-page.is-tablet-sidebar-collapsed
            .lumi-child-workspace-menu__item[data-lumi-nav-label]:focus-visible::after {
            opacity: 1;
            transform: translate(0, -50%);
            visibility: visible;
        }
    }

    body:has(.lumi-child-page) .lumi-child-main {
        padding-top: 16px !important;
        transition: padding-right 180ms ease;
    }

    body:has(.lumi-child-page)
        .lumi-child-page.is-pages-preview-open
        .lumi-child-main {
        padding-right: calc(var(--lumi-tablet-preview-width) - 24px) !important;
    }

    body:has(.lumi-child-page) .lumi-pages-preview__panel,
    body:has(.lumi-child-page) .lumi-pages-preview__footer {
        width: var(--lumi-tablet-preview-width) !important;
    }

    body:has(.lumi-child-page) .lumi-pages-preview__panel {
        min-height: calc(100dvh - 203px);
        right: -24px;
        padding-right: 20px;
        padding-left: 20px;
    }

    body:has(.lumi-child-page) .lumi-pages-preview__panel.is-viewport-fixed {
        right: 0;
    }

    body:has(.lumi-child-page) .lumi-pages-preview__footer {
        padding-right: 20px;
        padding-left: 20px;
    }

    body:has(.lumi-child-page)
        .lumi-flashcards-grid[data-lumi-flashcards-grid] {
        width: 100% !important;
        max-width: none !important;
        grid-template-columns: repeat(auto-fill, minmax(min(220px, 100%), 250px)) !important;
        column-gap: 18px !important;
        row-gap: 18px !important;
    }

    body:has(.lumi-child-page) .lumi-workspace-settings-row {
        gap: 16px;
    }

    body:has(.lumi-child-page) .lumi-flashcards-embedded__top,
    body:has(.lumi-child-page) .lumi-editor-shell__settings {
        padding-bottom: 16px;
        margin-bottom: 18px;
    }
}

.lumi-library-image-preview__close {
    position: absolute !important;
    top: 14px !important;
    right: 14px !important;
    z-index: 2 !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 42px !important;
    height: 42px !important;
    padding: 0 !important;

    border: 0 !important;
    border-radius: 50% !important;
    background: rgba(255, 255, 255, 0.94) !important;
    color: #17172f !important;
    box-shadow: 0 4px 16px rgba(23, 23, 47, 0.14) !important;

    font-size: 30px !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    cursor: pointer !important;
}

/* Filled flashcard: image with footer actions */

.lumi-flashcards-grid[data-lumi-flashcards-grid] .lumi-media-slot--filled,
.lumi-visual-schedule__section-media-grid .lumi-media-slot--filled {
    aspect-ratio: auto !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    overflow: hidden !important;

    background: #ffffff !important;
    border: 1px solid #e6e6eb !important;
    border-radius: 24px !important;
}

.lumi-flashcards-grid[data-lumi-flashcards-grid] .lumi-media-slot,
.lumi-flashcards-grid[data-lumi-flashcards-grid] .lumi-media-slot--filled,
.lumi-visual-schedule__section-media-grid .lumi-media-slot,
.lumi-visual-schedule__section-media-grid .lumi-media-slot--filled {
    border-radius: 12px !important;
}

.lumi-media-slot--filled .lumi-media-slot__image-area {
    position: relative;
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    flex: 0 0 auto;
}

.lumi-media-slot__footer-actions {
    width: 100%;
    min-height: 48px;
    box-sizing: border-box;

    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;

    padding: 4px 10px;

    background: #ffffff;
}

button.lumi-media-slot__footer-button {
    appearance: none !important;
    -webkit-appearance: none !important;

    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    padding: 0 !important;
    margin: 0 !important;

    border: 0 !important;
    border-radius: 50% !important;
    background: transparent !important;
    box-shadow: none !important;
    outline: none !important;

    color: #626060 !important;
    cursor: pointer;
}

button.lumi-media-slot__footer-button:hover,
button.lumi-media-slot__footer-button:focus-visible {
    color: #4e52d8 !important;
    background: rgba(78, 82, 216, 0.07) !important;
}

button.lumi-media-slot__footer-button svg {
    display: block;
    flex: 0 0 auto;
}

button.lumi-media-slot__footer-button[hidden] {
    display: none !important;
}

button.lumi-media-slot__footer-button:disabled {
    cursor: wait;
    opacity: 0.55;
}

button.lumi-media-slot__footer-button--preview svg {
    width: 22px;
    height: auto;
}

button.lumi-media-slot__footer-button--download svg {
    width: 20px;
    height: auto;
}

.lumi-media-slot__favorite-icon {
    display: block;
    width: 17px;
    height: 15px;
    flex: 0 0 17px;
    background: currentColor;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    mask-size: contain;
}

button.lumi-media-slot__footer-button--favorite.is-saved {
    color: #4e52d8 !important;
    background: rgba(78, 82, 216, 0.07) !important;
}

button.lumi-media-slot__footer-button--edit svg {
    width: 16px;
    height: auto;
}

.lumi-flashcards-grid[data-cards-per-page="20"] .lumi-media-slot__footer-actions {
    gap: 2px;
    padding-right: 4px;
    padding-left: 4px;
}

.lumi-flashcards-grid[data-cards-per-page="20"] button.lumi-media-slot__footer-button {
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    min-height: 30px !important;
}

/* Child profile card — redesigned layout */

.lumi-child-card {
    padding: 24px 22px 22px !important;
}

.lumi-child-card__top {
    display: grid !important;
    grid-template-columns: 88px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 18px !important;
    margin-bottom: 26px !important;
}

.lumi-child-card__avatar {
    width: 88px !important;
    height: 88px !important;
    border: 1px solid #e4e4eb !important;
    border-radius: 50% !important;
    background: #f5f5f7 !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
}

.lumi-child-card__avatar img {
    display: block;
    width: 30px;
    height: 30px;
    object-fit: contain;
    opacity: 0.72;
}

.lumi-child-card__identity {
    min-width: 0;
}

.lumi-child-card__identity h2,
.lumi-child-card h2 {
    margin: 0 0 10px !important;
    color: #17172f !important;
    font-size: 22px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
}

button.lumi-child-card__edit,
.lumi-child-card__edit {
    height: 32px !important;
    min-height: 32px !important;
    padding: 0 14px !important;
    margin: 0 !important;

    border: 1px solid #4e52d8 !important;
    border-radius: 999px !important;
    background: #ffffff !important;
    color: #4e52d8 !important;

    font-size: 13px !important;
    font-weight: 600 !important;
}

button.lumi-child-card__edit:hover,
.lumi-child-card__edit:hover {
    background: rgba(78, 82, 216, 0.06) !important;
}

.lumi-child-card__profile-actions {
    margin-bottom: 24px;
}

.lumi-child-card__preferences {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.lumi-child-card__preference-row {
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr);
    align-items: start;
    gap: 11px;
}

.lumi-child-card__preference-row > img {
    display: block;
    width: 20px;
    height: 20px;
    margin-top: 1px;
    object-fit: contain;
}

.lumi-child-card__preference-row p {
    margin: 0;
    color: #4c4c5f;
    font-size: 14px;
    line-height: 1.45;
}

.lumi-child-card__preference-row strong {
    color: #25253b;
    font-weight: 700;
}


.lumi-child-card__settings {
    display: flex !important;
    flex-direction: column !important;
    gap: 14px !important;
    padding: 0 0 24px !important;
    margin: 26px 0 0 !important;
    border: 0 !important;
}

.lumi-child-card__character {
    display: flex;
    align-items: center;
    gap: 12px;
}

.lumi-child-card__character img {
    display: block;
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    object-fit: cover;
    border-radius: 50%;
    background: #f4f4f7;
}

.lumi-child-card__character span {
    color: #25253b;
    font-size: 15px;
    font-weight: 600;
}

.lumi-child-card__visual-style {
    margin: 0 !important;
    color: #4c4c5f !important;
    font-size: 14px !important;
    line-height: 1.4 !important;
}



.lumi-child-card__avatar img.has-photo {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    opacity: 1 !important;
}


.lumi-child-card__avatar {
    overflow: hidden !important;
    border-radius: 50% !important;
    padding: 0 !important;
}

.lumi-child-card__avatar img.has-photo {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: 50% !important;
    opacity: 1 !important;
}

/* Student avatar editor */

.lumi-avatar-editor {
    position: fixed;
    inset: 0;
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
}

.lumi-avatar-editor.is-hidden {
    display: none;
}

.lumi-avatar-editor__overlay {
    position: absolute;
    inset: 0;
    background: rgba(23, 23, 47, 0.48);
}

.lumi-avatar-editor__dialog {
    position: relative;
    z-index: 1;
    width: min(440px, 100%);
    padding: 28px;
    border-radius: 20px;
    background: #ffffff;
    box-shadow: 0 20px 60px rgba(23, 23, 47, 0.2);
}

.lumi-avatar-editor__dialog h2 {
    margin: 0 0 8px;
    color: #17172f;
    font-size: 22px;
    line-height: 1.2;
}

.lumi-avatar-editor__dialog > p {
    margin: 0 0 22px;
    color: #666678;
    font-size: 14px;
    line-height: 1.45;
}

.lumi-avatar-editor__close {
    position: absolute;
    top: 14px;
    right: 16px;
    width: 34px;
    height: 34px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: #4c4c5f;
    font-size: 25px;
    line-height: 1;
    cursor: pointer;
}

.lumi-avatar-editor__viewport {
    width: 320px;
    height: 320px;
    max-width: 100%;
    margin: 0 auto 22px;
    border-radius: 50%;
    overflow: hidden;
    background: #f1f1f5;
    box-shadow: 0 0 0 1px #e3e3ea;
}

.lumi-avatar-editor__viewport canvas {
    display: block;
    width: 100%;
    height: 100%;
    cursor: grab;
    touch-action: none;
}

.lumi-avatar-editor__viewport canvas:active {
    cursor: grabbing;
}

.lumi-avatar-editor__zoom {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 14px;
    margin-bottom: 24px;
}

.lumi-avatar-editor__zoom span {
    color: #25253b;
    font-size: 14px;
    font-weight: 600;
}

.lumi-avatar-editor__zoom input {
    width: 100%;
}

.lumi-avatar-editor__actions {
    display: flex;
    align-items: center;
    gap: 12px;
}

.lumi-avatar-editor__actions .lumi-profile-modal__skip {
    padding: 0;
    border: 0;
    background: transparent;
    color: #4e52d8;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
}

button.lumi-avatar-editor__close,
.lumi-avatar-editor__close {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    outline: none !important;
    color: #111111 !important;
}

button.lumi-avatar-editor__close:hover,
button.lumi-avatar-editor__close:focus,
.lumi-avatar-editor__close:hover,
.lumi-avatar-editor__close:focus {
    background: transparent !important;
    color: #111111 !important;
    box-shadow: none !important;
}

button.lumi-avatar-editor__close,
.lumi-avatar-editor__close {
    top: 20px !important;
    right: 24px !important;
    width: 40px !important;
    height: 40px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    color: #17172f !important;
    font-size: 32px !important;
    font-weight: 400 !important;
    line-height: 1 !important;
}

.lumi-child-card__avatar {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.lumi-child-card__avatar img:not(.has-photo) {
    margin: 0 !important;
}

body:has(.lumi-child-page) .elementor-location-footer,
body:has(.lumi-child-page) footer {
    display: none !important;
}

.lumi-child-card__character img {
    background: transparent !important;
}

/* Selected character in library modal summary */
.lumi-media-slot-library-character__current {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
}

.lumi-media-slot-library-character__current img {
    width: 44px !important;
    height: 44px !important;
    flex: 0 0 44px !important;
    border-radius: 50% !important;
    object-fit: cover !important;
    display: block !important;
}

/* My students and classes */
.lumi-my-clients {
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.lumi-my-clients__section {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.lumi-my-clients__title {
    margin: 0;
    color: #1f2433;
    font-size: 24px;
    font-weight: 700;
    line-height: 1.25;
}

.lumi-my-clients__list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.lumi-my-clients__item,
.lumi-my-clients__add {
    display: flex;
    align-items: center;
    gap: 16px;
    min-height: 64px;
    padding: 8px 12px;
    border-radius: 14px;
    color: #1f2433;
    text-decoration: none;
    transition:
        background-color 180ms ease,
        color 180ms ease;
}

.lumi-my-clients__item:hover,
.lumi-my-clients__item:focus-visible {
    background: rgba(78, 82, 216, 0.06);
    color: #1f2433;
}

.lumi-my-clients__avatar {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    flex: 0 0 48px;
    border-radius: 50%;
    background: #f2f2f8;
    font-size: 25px;
    line-height: 1;
}

.lumi-my-clients__name {
    font-size: 15px;
    font-weight: 500;
    line-height: 1.3;
}

.lumi-my-clients__add {
    padding-top: 4px;
    padding-bottom: 4px;
    font-size: 16px;
    font-weight: 600;
    color: #4e52d8;
}

.lumi-my-clients__add:hover,
.lumi-my-clients__add:focus-visible {
    color: #4e52d8;
}

.lumi-my-clients__add-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    flex: 0 0 56px;
    box-sizing: border-box;
    border: 2px dashed #4e52d8;
    border-radius: 50%;
    background: transparent;
    color: #4e52d8;
    font-size: 28px;
    font-weight: 400;
    line-height: 1;
    transition:
        border-style 180ms ease,
        background-color 180ms ease;
}

/* Native Dashboard */
/* Pricing page */
body.lumi-pricing-page {
    background:
        radial-gradient(circle at 12% 5%, rgba(255, 102, 78, 0.055), transparent 24rem),
        radial-gradient(circle at 88% 8%, rgba(93, 72, 238, 0.065), transparent 28rem),
        #f8f8fc;
}

/* Public LUMI header */
body:not(.lumi-native-dashboard-page) #site-header.dynamic-header {
    border: 0;
    background: transparent;
    box-shadow: none;
}

body:not(.lumi-native-dashboard-page) #site-header.dynamic-header .header-inner {
    position: relative;
    display: grid;
    width: min(1420px, calc(100% - 48px));
    max-width: none;
    min-height: 80px;
    margin: 0 auto;
    padding: 0;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
}

body:not(.lumi-native-dashboard-page) #site-header.dynamic-header .site-branding {
    grid-column: 1;
    justify-self: start;
}

body:not(.lumi-native-dashboard-page) #site-header.dynamic-header .custom-logo {
    display: block;
    width: auto;
    height: 43px;
}

body:not(.lumi-native-dashboard-page) #site-header.dynamic-header > .header-inner > .site-navigation {
    position: static;
    grid-column: 2;
    justify-self: center;
}

body:not(.lumi-native-dashboard-page) #site-header.dynamic-header > .header-inner > .site-navigation > .menu {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 38px;
    margin: 0;
    padding: 0;
}

body:not(.lumi-native-dashboard-page) #site-header.dynamic-header .site-navigation .menu-item:not(.menu-item-lumi-account) > a {
    padding: 10px 0;
    color: #4f576d;
    font-family: var(--lumi-font-ui);
    font-size: 15px;
    font-weight: 600;
    line-height: 1.2;
    text-decoration: none;
    transition: color 160ms ease;
}

body:not(.lumi-native-dashboard-page) #site-header.dynamic-header .site-navigation .menu-item:not(.menu-item-lumi-account) > a:hover,
body:not(.lumi-native-dashboard-page) #site-header.dynamic-header .site-navigation .current-menu-item:not(.menu-item-lumi-account) > a {
    color: #5d48ee;
}

body:not(.lumi-native-dashboard-page) #site-header.dynamic-header > .header-inner > .site-navigation .menu-item-lumi-account {
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
}

body:not(.lumi-native-dashboard-page) #site-header.dynamic-header .menu-item-lumi-account > a {
    display: inline-flex;
    min-width: 112px;
    min-height: 42px;
    padding: 10px 20px;
    border: 2px solid #5d48ee;
    border-radius: 6px;
    align-items: center;
    justify-content: center;
    background: #5d48ee;
    color: #ffffff !important;
    font-family: var(--lumi-font-ui);
    font-size: 14px;
    font-weight: 800;
    line-height: 1;
    text-decoration: none;
    box-shadow: 0 8px 20px rgba(93, 72, 238, 0.2);
    transition: transform 160ms ease, background-color 160ms ease, box-shadow 160ms ease;
}

body:not(.lumi-native-dashboard-page) #site-header.dynamic-header .menu-item-lumi-account > a:hover,
body:not(.lumi-native-dashboard-page) #site-header.dynamic-header .menu-item-lumi-account > a:focus-visible {
    transform: translateY(-1px);
    background: #503bdf;
    box-shadow: 0 11px 24px rgba(93, 72, 238, 0.26);
}

body:not(.lumi-native-dashboard-page) #site-header.dynamic-header .menu-item-lumi-account--logged-in > a {
    width: 36px;
    min-width: 36px;
    height: 36px;
    min-height: 36px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #4e52d8;
    font-size: 14px;
    font-weight: 700;
    box-shadow: none;
}

/* Public LUMI footer */
body:not(.lumi-native-dashboard-page) #site-footer.dynamic-footer {
    padding: 0 24px;
    border-top: 0;
    background: linear-gradient(135deg, #efeffb 0%, #f5f3ff 52%, #eef1ff 100%);
    color: #4f576d;
}

body:not(.lumi-native-dashboard-page) #site-footer.dynamic-footer .footer-inner {
    position: relative;
    display: grid;
    width: min(1420px, 100%);
    max-width: none;
    min-height: 190px;
    margin: 0 auto;
    padding: 40px 0 24px;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    grid-template-rows: 1fr auto;
    align-items: start;
}

body:not(.lumi-native-dashboard-page) #site-footer.dynamic-footer .site-branding {
    grid-column: 1;
    grid-row: 1;
    justify-self: start;
}

body:not(.lumi-native-dashboard-page) #site-footer.dynamic-footer .custom-logo {
    display: block;
    width: auto;
    height: 43px;
}

body:not(.lumi-native-dashboard-page) #site-footer.dynamic-footer .site-navigation {
    position: static;
    grid-column: 2;
    grid-row: 1;
    justify-self: center;
}

body:not(.lumi-native-dashboard-page) #site-footer.dynamic-footer .site-navigation .menu {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 38px;
    margin: 0;
    padding: 0;
}

body:not(.lumi-native-dashboard-page) #site-footer.dynamic-footer .site-navigation .menu-item > a {
    padding: 10px 0;
    color: #4f576d;
    font-family: var(--lumi-font-ui);
    font-size: 15px;
    font-weight: 600;
    line-height: 1.2;
    text-decoration: none;
}

body:not(.lumi-native-dashboard-page) #site-footer.dynamic-footer .site-navigation .menu-item > a:hover,
body:not(.lumi-native-dashboard-page) #site-footer.dynamic-footer .site-navigation .menu-item > a:focus-visible {
    color: #5d48ee;
}

body:not(.lumi-native-dashboard-page) #site-footer.dynamic-footer .menu-item-lumi-footer-account {
    position: absolute;
    top: 36px;
    right: 0;
}

body:not(.lumi-native-dashboard-page) #site-footer.dynamic-footer .menu-item-lumi-footer-account--guest > a {
    display: inline-flex;
    min-width: 112px;
    min-height: 42px;
    padding: 10px 20px;
    border-radius: 6px;
    align-items: center;
    justify-content: center;
    background: #5d48ee;
    color: #ffffff !important;
    font-size: 14px;
    font-weight: 800;
    box-shadow: 0 8px 20px rgba(93, 72, 238, 0.18);
}

body:not(.lumi-native-dashboard-page) #site-footer.dynamic-footer .menu-item-lumi-footer-account--logged-in > a {
    display: inline-flex;
    width: 36px;
    height: 36px;
    padding: 0;
    border-radius: 50%;
    align-items: center;
    justify-content: center;
    background: #4e52d8;
    color: #ffffff !important;
    font-size: 14px;
    font-weight: 700;
}

body:not(.lumi-native-dashboard-page) #site-footer.dynamic-footer .copyright {
    width: 100%;
    grid-column: 1 / -1;
    grid-row: 2;
}

body:not(.lumi-native-dashboard-page) #site-footer.dynamic-footer .copyright p {
    display: flex;
    margin: 0;
    padding-top: 22px;
    border-top: 1px solid #e0e1ec;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    color: #70778a;
    font-family: var(--lumi-font-ui);
    font-size: 13px;
    line-height: 1.4;
}

.lumi-public-footer__legal {
    display: inline-flex;
    align-items: center;
    gap: 12px;
}

.lumi-public-footer__legal a {
    color: inherit;
    text-decoration: none;
}

.lumi-public-footer__legal a:hover,
.lumi-public-footer__legal a:focus-visible {
    color: #5d48ee;
}

.lumi-pricing,
.lumi-pricing * {
    box-sizing: border-box;
}

.lumi-pricing {
    color: #111936;
    background: transparent;
}

.lumi-pricing__container {
    width: min(1420px, calc(100% - 48px));
    margin: 0 auto;
}

.lumi-pricing__hero {
    padding: clamp(18px, 2vw, 28px) 0 18px;
}

.lumi-pricing__hero h1 {
    max-width: 980px;
    margin: 0;
    color: #111936;
    font-size: 42px !important;
    font-weight: 800;
    letter-spacing: -0.045em;
    line-height: 0.98;
}

.lumi-pricing__hero > .lumi-pricing__container > p {
    max-width: 860px;
    margin: 16px 0 0;
    color: #626a80;
    font-size: 18px !important;
    line-height: 1.32;
}

.lumi-pricing__assurances {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 18px 42px;
    margin-top: 28px;
}

.lumi-pricing__assurances span {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    color: #555d73;
    font-size: 17px;
    font-weight: 600;
}

.lumi-pricing__assurances svg {
    width: 24px;
    height: 24px;
    fill: none;
    stroke: #5d48ee;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2.1;
}

.lumi-pricing__plans {
    padding: 0 0 clamp(80px, 9vw, 132px);
}

.lumi-pricing__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 26px;
}

.lumi-pricing-card {
    --lumi-plan-accent: #5d48ee;
    --lumi-plan-soft: #eeebff;
    display: flex;
    min-width: 0;
    min-height: 690px;
    padding: 36px 40px 34px;
    border: 1px solid rgba(25, 30, 61, 0.06);
    border-radius: 24px;
    flex-direction: column;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 16px 45px rgba(32, 37, 70, 0.08);
}

.lumi-pricing-card--essential {
    --lumi-plan-accent: #ff664e;
    --lumi-plan-soft: #fff0ec;
}

.lumi-pricing-card__icon {
    display: grid;
    width: 76px;
    height: 76px;
    margin: 0 auto 22px;
    border-radius: 50%;
    place-items: center;
    background: var(--lumi-plan-soft);
    color: var(--lumi-plan-accent);
}

.lumi-pricing-card__icon svg {
    width: 40px;
    height: 40px;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.8;
}

.lumi-pricing-card h2 {
    margin: 0;
    color: var(--lumi-plan-accent);
    font-size: clamp(25px, 2vw, 31px);
    font-weight: 800;
    line-height: 1.2;
    text-align: center;
}

.lumi-pricing-card__price {
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: 12px;
    min-height: 78px;
    margin-top: 18px;
    color: #111936;
    text-align: center;
}

.lumi-pricing-card__price strong {
    font-size: 46px;
    font-weight: 700;
    letter-spacing: -0.035em;
    line-height: 1;
}

.lumi-pricing-card--organizations .lumi-pricing-card__price strong {
    font-size: clamp(32px, 3vw, 42px);
    letter-spacing: -0.02em;
}

.lumi-pricing-card__price span {
    font-size: 22px;
    font-weight: 700;
}

.lumi-pricing-card__badge {
    align-self: center;
    margin: 0;
    padding: 7px 20px;
    border-radius: 999px;
    background: var(--lumi-plan-soft);
    color: var(--lumi-plan-accent);
    font-size: 17px;
    font-weight: 800;
    line-height: 1.25;
    text-align: center;
}

.lumi-pricing-card__description {
    min-height: 82px;
    margin: 30px 0 0;
    color: #535b71;
    font-size: 18px;
    line-height: 1.5;
}

.lumi-pricing-card ul {
    display: grid;
    gap: 15px;
    margin: 0;
    padding: 27px 0 30px;
    border-top: 1px solid #e8e9f1;
    list-style: none;
}

.lumi-pricing-card li {
    position: relative;
    margin: 0;
    padding-left: 34px;
    color: #202843;
    font-size: 17px;
    line-height: 1.4;
}

.lumi-pricing-card li::before {
    content: '';
    position: absolute;
    top: 0.2em;
    left: 2px;
    width: 18px;
    height: 18px;
    background: var(--lumi-plan-accent);
    -webkit-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m4 10.5 3.5 3.5L16 5.5' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m4 10.5 3.5 3.5L16 5.5' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

.lumi-pricing-card__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 58px;
    margin-top: auto;
    padding: 12px 24px;
    border: 2px solid var(--lumi-plan-accent);
    border-radius: 6px;
    background: var(--lumi-plan-accent);
    color: #ffffff !important;
    font-size: 20px;
    font-weight: 800;
    line-height: 1.2;
    text-align: center;
    text-decoration: none !important;
    transition: transform 0.16s ease, box-shadow 0.16s ease;
}

.lumi-pricing-card--organizations .lumi-pricing-card__button {
    background: #ffffff;
    color: var(--lumi-plan-accent) !important;
}

.lumi-pricing-card__button:hover,
.lumi-pricing-card__button:focus-visible {
    transform: translateY(-2px);
    box-shadow: 0 10px 24px color-mix(in srgb, var(--lumi-plan-accent) 24%, transparent);
}

@media (max-width: 1100px) {
    .lumi-pricing__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .lumi-pricing-card--organizations {
        grid-column: 1 / -1;
        width: min(100%, 680px);
        justify-self: center;
    }
}

@media (max-width: 720px) {
    body:not(.lumi-native-dashboard-page) #site-header.dynamic-header .header-inner {
        width: min(100% - 32px, 560px);
        min-height: 72px;
        grid-template-columns: 1fr auto;
    }

    body:not(.lumi-native-dashboard-page) #site-header.dynamic-header .site-navigation-toggle-holder {
        grid-column: 2;
    }

    body:not(.lumi-native-dashboard-page) #site-header.dynamic-header .site-navigation-dropdown .menu-item-lumi-account--guest > a {
        width: calc(100% - 32px);
        margin: 12px 16px 16px;
    }

    body:not(.lumi-native-dashboard-page) #site-footer.dynamic-footer {
        padding: 0 16px;
    }

    body:not(.lumi-native-dashboard-page) #site-footer.dynamic-footer .footer-inner {
        min-height: 0;
        padding: 34px 0 24px;
        grid-template-columns: 1fr;
        grid-template-rows: auto auto auto;
        justify-items: center;
        gap: 24px;
    }

    body:not(.lumi-native-dashboard-page) #site-footer.dynamic-footer .site-branding,
    body:not(.lumi-native-dashboard-page) #site-footer.dynamic-footer .site-navigation,
    body:not(.lumi-native-dashboard-page) #site-footer.dynamic-footer .copyright {
        grid-column: 1;
        justify-self: center;
    }

    body:not(.lumi-native-dashboard-page) #site-footer.dynamic-footer .site-branding {
        grid-row: 1;
    }

    body:not(.lumi-native-dashboard-page) #site-footer.dynamic-footer .site-navigation {
        grid-row: 2;
    }

    body:not(.lumi-native-dashboard-page) #site-footer.dynamic-footer .site-navigation .menu {
        flex-wrap: wrap;
        gap: 16px 28px;
    }

    body:not(.lumi-native-dashboard-page) #site-footer.dynamic-footer .menu-item-lumi-footer-account {
        position: static;
    }

    body:not(.lumi-native-dashboard-page) #site-footer.dynamic-footer .copyright {
        grid-row: 3;
    }

    body:not(.lumi-native-dashboard-page) #site-footer.dynamic-footer .copyright p {
        align-items: center;
        flex-direction: column;
        gap: 12px;
        text-align: center;
    }

    .lumi-pricing__container {
        width: min(100% - 32px, 560px);
    }

    .lumi-pricing__hero {
        padding: 28px 0 26px;
    }

    .lumi-pricing__hero h1 {
        font-size: 42px !important;
    }

    .lumi-pricing__hero > .lumi-pricing__container > p {
        margin-top: 14px;
        font-size: 18px !important;
    }

    .lumi-pricing__assurances {
        gap: 14px 24px;
        margin-top: 20px;
    }

    .lumi-pricing__assurances span {
        font-size: 15px;
    }

    .lumi-pricing__grid {
        grid-template-columns: 1fr;
    }

    .lumi-pricing-card,
    .lumi-pricing-card--organizations {
        grid-column: auto;
        width: 100%;
        min-height: 0;
        padding: 30px 24px 26px;
    }

    .lumi-pricing-card__description {
        min-height: 0;
    }
}

body.lumi-native-dashboard-page {
    min-width: 1180px;
    margin: 0;
    background: #ffffff;
}

.lumi-native-dashboard,
.lumi-native-dashboard * {
    box-sizing: border-box;
}

.lumi-native-dashboard {
    display: grid;
    grid-template-columns: 240px minmax(0, 1fr);
    min-height: 100vh;
    background: #ffffff;
    color: #17172f;
    font-family: var(--lumi-font-ui);
}

.lumi-native-dashboard__sidebar {
    display: flex;
    min-height: 100vh;
    flex-direction: column;
    border-right: 1px solid #e7e8ff;
    background: #ffffff;
}

.lumi-native-dashboard__logo {
    display: flex;
    width: auto;
    justify-content: center;
    margin: 0;
    padding: 34px 0 22px;
    border-bottom: 1px solid #e7e8ff;
}

.lumi-native-dashboard__logo img {
    display: block;
    width: 94px;
    height: auto;
}

.lumi-native-dashboard__nav {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 22px 28px 14px;
}

.lumi-native-dashboard__nav a {
    display: flex;
    min-height: 46px;
    align-items: center;
    gap: 12px;
    padding: 0 20px;
    border-radius: 4px;
    color: #17172f;
    font-size: 16px;
    font-weight: 500;
    text-decoration: none;
}

.lumi-native-dashboard__nav a:hover,
.lumi-native-dashboard__nav a:focus-visible,
.lumi-native-dashboard__nav a.is-active {
    background: #f0f0ff;
    color: #4e52d8;
}

.lumi-native-dashboard__nav img {
    width: 18px;
    height: 18px;
    object-fit: contain;
}

.lumi-native-dashboard__clients {
    padding: 22px 28px;
    border-top: 1px solid #e7e8ff;
}

.lumi-native-dashboard__main {
    min-width: 0;
    padding: 50px 68px 80px;
    background: #ffffff;
}

.lumi-native-dashboard__content {
    width: 100%;
    max-width: 1440px;
}

.lumi-native-dashboard__content .pmpro {
    max-width: none;
}

/* Native My resources shell */
body:has(.lumi-resources-page) header:not(.lumi-resources-header),
body:has(.lumi-resources-page) .elementor-location-header,
body:has(.lumi-resources-page) .site-header,
body:has(.lumi-resources-page) footer,
body:has(.lumi-resources-page) .elementor-location-footer,
body:has(.lumi-resources-page) .site-footer {
    display: none !important;
}

body:has(.lumi-resources-page) .elementor-element:has(.lumi-resources-page),
body:has(.lumi-resources-page) .elementor-container:has(.lumi-resources-page),
body:has(.lumi-resources-page) .elementor-widget-container:has(.lumi-resources-page) {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.lumi-resources-page,
.lumi-resources-page * {
    box-sizing: border-box;
}

.lumi-resources-page {
    display: grid;
    grid-template-columns: 240px minmax(0, 1fr);
    grid-template-rows: 91px minmax(0, 1fr);
    width: 100% !important;
    max-width: none !important;
    min-height: 100vh;
    margin: 0 !important;
    padding: 0 !important;
    background: #ffffff;
    color: #17172f;
    font-family: var(--lumi-font-ui);
}

.lumi-resources-page > .lumi-native-dashboard__sidebar {
    grid-column: 1;
    grid-row: 1 / -1;
}

.lumi-resources-page > .lumi-native-dashboard__sidebar .lumi-native-dashboard__logo {
    display: flex;
    height: 91px;
    align-items: center;
    padding-top: 0;
    padding-bottom: 0;
}

.lumi-resources-header {
    display: grid;
    grid-column: 2;
    grid-row: 1;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
    min-width: 0;
    padding: 0 34px;
    border-bottom: 1px solid #e4e4ef;
    background: #ffffff;
}

.lumi-resources-header__back,
.lumi-resources-header__account {
    display: inline-flex;
    align-items: center;
    text-decoration: none;
}

.lumi-resources-header__back {
    justify-self: start;
    gap: 7px;
    color: #4e52d8;
    font-size: 14px;
    font-weight: 600;
}

.lumi-resources-header__back svg {
    width: 18px;
    height: 18px;
}

.lumi-resources-header h1 {
    margin: 0;
    color: #17172f;
    font-size: 22px;
    font-weight: 700;
    line-height: 1.2;
}

.lumi-resources-header__account {
    width: 36px;
    height: 36px;
    justify-content: center;
    justify-self: end;
    border-radius: 50%;
    background: #4e52d8;
    color: #ffffff;
    font-size: 14px;
    font-weight: 700;
}

.lumi-resources-page__main {
    min-width: 0;
    grid-column: 2;
    grid-row: 2;
    padding: 34px 32px 72px;
    background: #ffffff;
}

.lumi-my-clients__add:hover .lumi-my-clients__add-icon,
.lumi-my-clients__add:focus-visible .lumi-my-clients__add-icon {
    border-style: solid;
    background: rgba(78, 82, 216, 0.06);
}

.lumi-my-clients__empty {
    margin: 0;
    color: #77798a;
    font-size: 14px;
}

.lumi-my-clients__notice {
    padding: 12px 16px;
    border-radius: 12px;
    background: rgba(255, 122, 89, 0.1);
    color: #1f2433;
    font-size: 14px;
}

.lumi-my-clients__form {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.lumi-my-clients__form input {
    min-height: 46px;
    padding: 0 14px;
    border: 1px solid #d9d9e3;
    border-radius: 12px;
    font: inherit;
}

.lumi-my-clients__submit {
    min-height: 46px;
    padding: 0 20px;
    border: 0;
    border-radius: 24px;
    background: #4e52d8;
    color: #ffffff;
    font: inherit;
    font-weight: 600;
    cursor: pointer;
}

.lumi-my-clients__form--student {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 36px 36px;
    align-items: center;
    gap: 6px;
    width: 100%;
}

.lumi-my-clients__form--student input {
    width: 100%;
    min-width: 0;
    height: 36px;
    min-height: 36px;
    padding: 0 10px;
    border: 1px solid #d9daea;
    border-radius: 6px;
    background: #ffffff;
    color: #1f2433;
    font: inherit;
    font-size: 13px;
    box-shadow: none;
}

.lumi-my-clients__form--student input:focus {
    border-color: #5d48ee;
    outline: none;
    box-shadow: 0 0 0 3px rgba(93, 72, 238, 0.1);
}

.lumi-my-clients__form-action {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 36px !important;
    min-width: 36px !important;
    height: 36px !important;
    min-height: 36px !important;
    padding: 0 !important;
    border: 1px solid #5d48ee !important;
    border-radius: 6px !important;
    color: #5d48ee !important;
    font-family: inherit;
    line-height: 1;
    cursor: pointer;
    text-decoration: none;
    box-shadow: none;
}

button.lumi-my-clients__form-action--confirm {
    background: #5d48ee !important;
    border-color: #5d48ee !important;
    color: #ffffff !important;
}

.lumi-my-clients__form-action--cancel {
    background: transparent !important;
}

.lumi-my-clients__form-action svg {
    display: block;
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.lumi-my-clients__form-action:hover,
.lumi-my-clients__form-action:focus-visible {
    opacity: 0.88;
    outline: none;
}

.lumi-my-clients__form-action--cancel:hover,
.lumi-my-clients__form-action--cancel:focus-visible {
    background: rgba(93, 72, 238, 0.06) !important;
}

/* My clients compact size corrections */
.lumi-my-clients {
    gap: 28px;
}

.lumi-my-clients__section {
    gap: 12px;
}

.lumi-my-clients__section:first-of-type {
    padding-bottom: 20px;
    border-bottom: 1px solid #e7e8ff;
}

.lumi-my-clients__title {
    font-size: 18px !important;
    font-weight: 600 !important;
}

.lumi-my-clients__list {
    gap: 4px;
}

.lumi-my-clients__item,
.lumi-my-clients__add {
    min-height: 48px;
    padding: 6px 8px;
    gap: 12px;
}

.lumi-my-clients__avatar {
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    font-size: 18px;
}

.lumi-my-clients__name,
.lumi-my-clients__add {
    font-size: 16px !important;
    font-weight: 500 !important;
}

.lumi-my-clients__add-icon {
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    border-width: 1px;
    font-size: 22px;
}

.lumi-my-clients__empty {
    font-size: 14px;
    font-weight: 400;
}

/* My clients avatar and add button corrections */
.lumi-my-clients__avatar {
    overflow: hidden;
    border: 0 !important;
    box-shadow: none !important;
    background: #f2f2f8;
}

.lumi-my-clients__avatar img {
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: cover;
    border: 0 !important;
    border-radius: 50%;
    box-shadow: none !important;
    outline: none !important;
    background: transparent;
}

.lumi-my-clients__avatar img:not(.has-photo) {
    width: 18px;
    height: 18px;
    object-fit: contain;
    border-radius: 0;
}

.lumi-my-clients__add {
    min-height: 38px;
    gap: 10px;
    padding: 3px 6px;
    font-size: 14px !important;
    font-weight: 500 !important;
}

.lumi-my-clients__add-icon {
    width: 28px;
    height: 28px;
    flex: 0 0 28px;
    border-width: 1px;
    position: relative;
    font-size: 0;
    line-height: 0;
}

.lumi-my-clients__add-icon::before,
.lumi-my-clients__add-icon::after {
    position: absolute;
    top: 50%;
    left: 50%;
    display: block;
    width: 9px;
    height: 1.5px;
    border-radius: 1px;
    background: currentColor;
    content: "";
    transform: translate(-50%, -50%);
}

.lumi-my-clients__add-icon::after {
    transform: translate(-50%, -50%) rotate(90deg);
}
/* Shared editor shell */
.lumi-editor-shell {
    width: 100%;
}

.lumi-editor-shell__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 24px;
}

.lumi-editor-shell__title h1 {
    margin: 0 !important;
}

.lumi-editor-shell__body {
    width: 100%;
}

.lumi-editor-shell__workspace {
    width: 100%;
}

.lumi-editor-shell__side-panel:empty {
    display: none;
}

.lumi-editor-shell__footer {
    margin-top: 32px;
}

.lumi-editor-bottom-bar {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
}

/* LUMI Flashcards: print only the generated preview page */
@media print {
    html.lumi-flashcards-printing,
    html.lumi-flashcards-printing body {
        min-height: 0 !important;
        height: auto !important;
    }

    @page lumi-flashcards-a4 {
        size: A4 portrait;
        margin: 0;
    }

    @page lumi-flashcards-letter {
        size: Letter portrait;
        margin: 0;
    }

    html,
    body {
        width: auto !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
        background: #ffffff !important;
    }

    body > * {
        display: none !important;
    }

    body > .lumi-flashcards-preview-modal.is-exporting {
        display: block !important;
    }

    body * {
        visibility: hidden !important;
    }

    .lumi-flashcards-preview-modal.is-exporting,
    .lumi-flashcards-preview-modal.is-exporting * {
        visibility: visible !important;
    }

    .lumi-flashcards-preview-modal.is-exporting {
        --lumi-flashcards-print-width: 210mm;
        --lumi-flashcards-print-height: 297mm;
        page: lumi-flashcards-a4;
        position: static !important;
        inset: auto !important;
        display: block !important;
        width: var(--lumi-flashcards-print-width) !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        background: #ffffff !important;
    }

    .lumi-flashcards-preview-modal.is-exporting[data-lumi-flashcards-print-format="letter"] {
        --lumi-flashcards-print-width: 215.9mm;
        --lumi-flashcards-print-height: 279.4mm;
        page: lumi-flashcards-letter;
    }

    .lumi-flashcards-preview-modal.is-exporting__overlay,
    .lumi-flashcards-preview-modal.is-exporting .lumi-flashcards-preview-modal__overlay,
    .lumi-flashcards-preview-modal.is-exporting .lumi-flashcards-preview-modal__header,
    .lumi-flashcards-preview-modal.is-exporting .lumi-flashcards-preview-modal__close {
        display: none !important;
    }

    .lumi-flashcards-preview-modal.is-exporting .lumi-flashcards-preview-modal__box,
    .lumi-flashcards-preview-modal.is-exporting .lumi-flashcards-preview-modal__body {
        position: static !important;
        display: block !important;
        width: var(--lumi-flashcards-print-width) !important;
        height: auto !important;
        max-width: none !important;
        max-height: none !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        overflow: visible !important;
        background: #ffffff !important;
    }

    .lumi-flashcards-preview-modal.is-exporting .lumi-flashcards-preview-page {
        width: var(--lumi-flashcards-print-width) !important;
        height: var(--lumi-flashcards-print-height) !important;
        min-height: var(--lumi-flashcards-print-height) !important;
        margin: 0 !important;
        padding: 10mm !important;
        box-sizing: border-box !important;
        background: #ffffff !important;
        grid-template-columns: repeat(
            var(--lumi-flashcards-columns),
            var(--lumi-flashcards-card-size-mm)
        ) !important;
        grid-auto-rows: var(--lumi-flashcards-card-size-mm) !important;
        gap: 8mm !important;
        align-content: center !important;
        justify-content: center !important;
        overflow: hidden !important;
        break-inside: avoid;
        break-after: page;
    }

    .lumi-flashcards-preview-modal.is-exporting .lumi-flashcards-preview-card {
        width: var(--lumi-flashcards-card-size-mm) !important;
        height: var(--lumi-flashcards-card-size-mm) !important;
    }

    .lumi-flashcards-preview-modal.is-exporting
        .lumi-flashcards-preview-page:last-child {
        break-after: auto;
    }
}

/* =========================================================
   Child workspace app shell
   Keep WordPress/Elementor chrome outside LUMI workspaces.
   ========================================================= */

body:has(.lumi-child-page) header:not(.lumi-child-app-header),
body:has(.lumi-child-page) .elementor-location-header,
body:has(.lumi-child-page) .site-header,
body:has(.lumi-child-page) footer,
body:has(.lumi-child-page) .elementor-location-footer,
body:has(.lumi-child-page) .site-footer {
    display: none !important;
}

/* Remove the theme and Elementor content-width constraint on workspace pages only. */
body:has(.lumi-child-page) .elementor-element:has(.lumi-child-page),
body:has(.lumi-child-page) .elementor-container:has(.lumi-child-page),
body:has(.lumi-child-page) .elementor-widget-container:has(.lumi-child-page) {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

body:has(.lumi-child-page) .lumi-child-page {
    position: relative !important;
    width: 100% !important;
    max-width: none !important;
    min-height: 100vh;
    margin: 0 !important;
    padding: 0 !important;
}

body:has(.lumi-child-page) .lumi-child-page::after {
    content: "" !important;
    position: absolute !important;
    z-index: 10 !important;
    top: 0 !important;
    bottom: 0 !important;
    left: 240px !important;
    width: 1px !important;
    pointer-events: none !important;
    background: #e4e4ef !important;
}


/* Visual Schedule settings bar */
.lumi-visual-schedule-settings {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    width: 100%;
}

.lumi-visual-schedule-settings__controls,
.lumi-visual-schedule-settings__actions {
    display: flex;
    align-items: flex-end;
    gap: 16px;
}

.lumi-visual-schedule-settings__actions {
    margin-left: auto;
    flex: 0 0 auto;
}

button.lumi-visual-schedule-settings__new-resource,
button.lumi-visual-schedule-settings__save-resource {
    min-height: 62px !important;
    height: 62px !important;
    padding: 0 20px !important;
    border-radius: 6px !important;
    border-width: 1px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
}

button.lumi-visual-schedule-settings__new-resource {
    border-color: #4E52D8 !important;
    background: #ffffff !important;
    color: #4E52D8 !important;
}

button.lumi-visual-schedule-settings__save-resource {
    border-color: #FF7A59 !important;
    background: #FF7A59 !important;
    color: #ffffff !important;
}

.lumi-visual-schedule-settings__new-icon,
.lumi-visual-schedule-settings__save-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: currentColor;
}

.lumi-visual-schedule-settings__new-icon svg {
    display: block;
    width: 18px;
    height: 18px;
}

.lumi-visual-schedule-settings__save-icon svg {
    display: block;
    width: 15px;
    height: 16px;
}

button.lumi-visual-schedule-settings__new-resource:disabled,
button.lumi-visual-schedule-settings__save-resource:disabled {
    cursor: not-allowed;
    opacity: 0.45 !important;
}

@media (max-width: 860px) {
    .lumi-visual-schedule-settings {
        align-items: flex-start;
        flex-direction: column;
    }

    .lumi-visual-schedule-settings__actions {
        margin-left: 0;
    }
}


/* Shared workspace actions: New resource / Save resource */
.lumi-workspace-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    margin-left: auto;
}

button.lumi-workspace-actions__button {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 62px !important;
    height: 62px !important;
    padding: 0 20px !important;
    border-width: 1px !important;
    border-radius: 6px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    white-space: nowrap;
}

button.lumi-workspace-actions__button--new {
    border-color: #4E52D8 !important;
    background: #ffffff !important;
    color: #4E52D8 !important;
}

button.lumi-workspace-actions__button--save {
    border-color: #FF7A59 !important;
    background: #FF7A59 !important;
    color: #ffffff !important;
}

.lumi-workspace-actions__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: currentColor;
}

.lumi-workspace-actions__icon svg {
    display: block;
}

.lumi-workspace-actions__icon--new svg {
    width: 16px;
    height: 16px;
}

.lumi-workspace-actions__icon--save svg {
    width: 24px;
    height: 24px;
}

button.lumi-workspace-actions__button--new:hover,
button.lumi-workspace-actions__button--new:focus-visible {
    background: rgba(78, 82, 216, 0.06) !important;
}

button.lumi-workspace-actions__button--save:hover,
button.lumi-workspace-actions__button--save:focus-visible {
    border-color: #F26D4C !important;
    background: #F26D4C !important;
}

button.lumi-workspace-actions__button:disabled,
button.lumi-workspace-actions__button:disabled:hover,
button.lumi-workspace-actions__button:disabled:focus-visible {
    border-color: #C7CADC !important;
    background: transparent !important;
    color: #8A8D99 !important;
    cursor: not-allowed;
    opacity: 1 !important;
}

@media (max-width: 860px) {
    .lumi-workspace-actions {
        width: 100%;
        justify-content: flex-start;
    }
}


/* Shared workspace toolbar: controls and actions share one baseline. */
.lumi-workspace-settings-row {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    width: 100%;
}

.lumi-workspace-settings-row .lumi-format-selector {
    min-width: 0;
}

body:has(.lumi-child-page)
    .lumi-flashcards-embedded .lumi-page-format-select,
body:has(.lumi-child-page)
    .lumi-flashcards-embedded .lumi-card-size-input,
body:has(.lumi-child-page)
    .lumi-flashcards-embedded .lumi-card-size-unit {
    height: 54px !important;
    min-height: 54px !important;
    border: 1px solid #E4E4EF !important;
    border-radius: 6px !important;
    background-color: #ffffff !important;
    color: #111111 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
}

body:has(.lumi-child-page)
    .lumi-flashcards-embedded .lumi-card-size-input {
    width: 90px !important;
    padding: 0 14px !important;
}

body:has(.lumi-child-page)
    .lumi-flashcards-embedded .lumi-format-group--page {
    flex: 0 0 112px !important;
}

body:has(.lumi-child-page)
    .lumi-flashcards-embedded .lumi-card-size-unit {
    width: 100px !important;
    padding: 0 40px 0 14px !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 7.5L10 12.5L15 7.5' stroke='%23111111' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-size: 15px 15px !important;
    background-position: right 16px center !important;
}

body:has(.lumi-child-page)
    .lumi-flashcards-embedded .lumi-page-format-select:focus,
body:has(.lumi-child-page)
    .lumi-flashcards-embedded .lumi-card-size-input:focus,
body:has(.lumi-child-page)
    .lumi-flashcards-embedded .lumi-card-size-unit:focus {
    border: 2px solid #0B63CE !important;
    outline: none !important;
    box-shadow: none !important;
}

/* Keep resource actions compact and aligned with 54px workspace controls. */
button.lumi-workspace-actions__button {
    min-height: 54px !important;
    height: 54px !important;
    padding: 0 16px !important;
    font-size: 14px !important;
}

.lumi-workspace-placeholder__header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 18px;
}

.lumi-workspace-placeholder__header h1 {
    margin: 0 !important;
}

/* The settings bar ends before the editor canvas begins. */
.lumi-flashcards-embedded__top,
.lumi-editor-shell__settings,
.lumi-workspace-placeholder__header {
    padding-bottom: 20px;
    margin-bottom: 24px;
    border-bottom: 1px solid #E4E4EF;
}

.lumi-flashcards-embedded__top {
    position: relative;
    border-bottom: 0;
}

.lumi-flashcards-embedded__top::after {
    content: "";
    position: absolute;
    right: -42px;
    bottom: 0;
    left: -28px;
    height: 1px;
    background: #E4E4EF;
}

@media (max-width: 860px) {
    .lumi-workspace-settings-row,
    .lumi-workspace-placeholder__header {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* Workspace shell restoration
   Kept at the end of the stylesheet so legacy workspace rules cannot bring
   back the former card-based, centred layout. */
body:has(.lumi-child-page) .lumi-child-page {
    display: grid !important;
    grid-template-columns: 240px minmax(0, 1fr) !important;
    grid-template-rows: 91px auto !important;
    column-gap: 28px !important;
    row-gap: 0 !important;
    width: 100% !important;
    max-width: none !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 42px 48px 0 !important;
    background: transparent !important;
    box-sizing: border-box !important;
}

body:has(.lumi-child-page) .lumi-child-app-header {
    position: relative !important;
    grid-column: 1 / -1 !important;
    grid-row: 1 !important;
    display: grid !important;
    grid-template-columns: 240px minmax(0, 1fr) auto minmax(0, 1fr) !important;
    align-items: center !important;
    min-height: 91px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-bottom: 0 !important;
    background: transparent !important;
}

body:has(.lumi-child-page) .lumi-child-app-header::before {
    content: "" !important;
    grid-column: 1 !important;
    grid-row: 1 !important;
    justify-self: center !important;
    width: 94px !important;
    height: 34px !important;
    background: url("../images/lumi-logo.svg") center / contain no-repeat !important;
}

body:has(.lumi-child-page) .lumi-child-app-header::after {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    right: -42px !important;
    width: auto !important;
    pointer-events: none;
    background: linear-gradient(#E4E4EF, #E4E4EF) left bottom / 100% 1px no-repeat !important;
}

.lumi-child-app-header__back,
.lumi-child-app-header__brand,
.lumi-child-app-header__account {
    display: inline-flex;
    align-items: center;
    text-decoration: none;
}

.lumi-child-app-header__back {
    grid-column: 2 !important;
    grid-row: 1 !important;
    justify-self: start;
    margin-left: 24px !important;
    gap: 7px;
    color: #4e52d8;
    font-size: 14px;
    font-weight: 600;
}

.lumi-child-app-header__back svg {
    width: 18px;
    height: 18px;
}

.lumi-child-app-header__title {
    grid-column: 3 !important;
    grid-row: 1 !important;
    margin: 0;
    color: #17172f;
    font-size: 22px;
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
}

.lumi-child-app-header__brand {
    justify-self: start;
    margin-left: 42px;
}

.lumi-child-app-header__brand img {
    display: block;
    width: 86px;
    height: auto;
}

body:has(.lumi-child-page) .lumi-child-app-header__account {
    grid-column: 4 !important;
    grid-row: 1 !important;
    justify-self: end;
    width: 36px !important;
    height: 36px !important;
    border-radius: 50% !important;
    background: #4e52d8 !important;
    color: #ffffff !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    justify-content: center;
}

body:has(.lumi-child-page) .lumi-child-app-header__install {
    grid-column: 4;
    grid-row: 1;
    justify-self: end;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 36px;
    margin-right: 48px;
    padding: 0 13px;
    border: 1px solid #4e52d8;
    border-radius: 18px;
    background: #ffffff;
    color: #4e52d8;
    font: inherit;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
}

body:has(.lumi-child-page) .lumi-child-app-header__install[hidden] {
    display: none;
}

body:has(.lumi-child-page) .lumi-child-app-header__install svg {
    width: 17px;
    height: 17px;
}

body:has(.lumi-child-page) .lumi-child-app-header__install:hover,
body:has(.lumi-child-page) .lumi-child-app-header__install:focus-visible {
    background: #f7f7ff;
}

body:has(.lumi-child-page) .lumi-child-app-header__install:focus-visible {
    outline: 2px solid #4e52d8;
    outline-offset: 2px;
}

body:has(.lumi-child-page) .lumi-child-sidebar {
    grid-column: 1 !important;
    grid-row: 2 !important;
    position: relative !important;
    z-index: 2 !important;
    width: 240px !important;
    box-sizing: border-box !important;
    min-height: calc(100vh - 91px) !important;
    min-width: 0 !important;
    max-width: none !important;
    gap: 8px !important;
    padding: 0 !important;
    border-right: 0 !important;
    background: transparent !important;
}

body:has(.lumi-child-page) .lumi-child-sidebar::after {
    display: none !important;
}

body:has(.lumi-child-page) .lumi-child-card {
    position: relative;
    z-index: 1;
    padding: 0 !important;
    overflow: visible !important;
    border: 0 !important;
    border-bottom: 1px solid #e4e4ef !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

body:has(.lumi-child-page) .lumi-child-card__summary {
    display: grid !important;
    grid-template-columns: 44px minmax(0, 1fr) 20px !important;
    align-items: center !important;
    width: 100% !important;
    min-height: 56px !important;
    padding: 20px 12px 20px 28px !important;
    gap: 12px !important;
    appearance: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: #17172f !important;
    font: inherit !important;
    text-align: left !important;
    cursor: pointer !important;
    box-shadow: none !important;
}

body:has(.lumi-child-page) .lumi-child-card__summary .lumi-child-card__avatar {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    border: 1px solid #4e52d8 !important;
    background: #ffffff !important;
}

body:has(.lumi-child-page) .lumi-child-card__name {
    color: #17172f !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
}

body:has(.lumi-child-page) .lumi-child-card__chevron {
    display: block !important;
    width: 20px !important;
    height: 20px !important;
    color: #4e52d8 !important;
}

body:has(.lumi-child-page) .lumi-child-card__collapsible-inner {
    padding-right: 12px !important;
    padding-left: 28px !important;
}

body:has(.lumi-child-page) .lumi-child-workspace-menu {
    position: relative;
    z-index: 1;
    padding: 8px 0 0 16px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

body:has(.lumi-child-page) .lumi-child-workspace-menu__primary {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-right: 12px;
    padding: 7px;
    border: 1px solid #e6e6f1;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.62);
}

body:has(.lumi-child-page)
    .lumi-child-workspace-menu__primary
    .lumi-child-workspace-menu__item,
body:has(.lumi-child-page)
    .lumi-child-workspace-menu__primary
    .lumi-child-workspace-menu__item:hover {
    margin-right: 0;
    border-radius: 6px;
}


body:has(.lumi-child-page) .lumi-child-main {
    grid-column: 2 !important;
    grid-row: 2 !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    padding: 20px 0 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

/* The workspace title lives in the shared app header. */
body:has(.lumi-child-page) .lumi-flashcards-embedded__header > div:first-child,
body:has(.lumi-child-page) .lumi-editor-shell__title {
    display: none !important;
}

body:has(.lumi-child-page) .lumi-flashcards-embedded__header {
    justify-content: flex-end !important;
    margin: 0 0 14px !important;
}

body:has(.lumi-child-page) .lumi-editor-shell__header {
    display: none !important;
}

body:has(.lumi-child-page) .lumi-child-breadcrumb {
    display: none !important;
}

/* Shared resource actions: compact, right-aligned, 1px plus and 6px corners. */
body:has(.lumi-child-page) .lumi-flashcards-header-actions,
body:has(.lumi-child-page) .lumi-visual-schedule-settings__actions {
    display: flex !important;
    align-items: flex-end !important;
    justify-content: flex-end !important;
    gap: 8px !important;
}

body:has(.lumi-child-page) .lumi-flashcards-new-top,
body:has(.lumi-child-page) .lumi-flashcards-save-top,
body:has(.lumi-child-page) .lumi-visual-schedule-settings__new-resource,
body:has(.lumi-child-page) .lumi-visual-schedule-settings__save-resource {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    height: 38px !important;
    min-height: 38px !important;
    padding: 0 13px !important;
    border-radius: 6px !important;
    font-size: 13px !important;
    line-height: 1 !important;
    box-shadow: none !important;
}

body:has(.lumi-child-page) .lumi-flashcards-new-top::before,
body:has(.lumi-child-page) .lumi-visual-schedule-settings__new-resource::before {
    width: 12px;
    height: 12px;
    content: "";
    background: linear-gradient(currentColor, currentColor) center / 1px 100% no-repeat,
        linear-gradient(currentColor, currentColor) center / 100% 1px no-repeat;
}

body:has(.lumi-child-page) .lumi-flashcards-new-top:disabled {
    color: #a9aab7 !important;
    border-color: #dedee7 !important;
    background: #f7f7fa !important;
}

body:has(.lumi-child-page) .lumi-child-card__collapsible {
    display: grid !important;
    grid-template-rows: 0fr !important;
    opacity: 0 !important;
    overflow: hidden !important;
    transition: grid-template-rows 240ms ease, opacity 180ms ease !important;
}

html.lumi-client-summary-precollapsed
    body:has(.lumi-child-page)
    .lumi-child-card.is-expanded .lumi-child-card__collapsible {
    grid-template-rows: 0fr !important;
    opacity: 0 !important;
    transition: none !important;
}

html.lumi-client-summary-precollapsed
    body:has(.lumi-child-page)
    .lumi-child-card.is-expanded .lumi-child-card__chevron {
    transform: rotate(0deg) !important;
    transition: none !important;
}

body:has(.lumi-child-page) .lumi-child-card__collapsible > * {
    min-height: 0 !important;
}

body:has(.lumi-child-page) .lumi-child-card.is-expanded .lumi-child-card__collapsible {
    grid-template-rows: 1fr !important;
    opacity: 1 !important;
}

body:has(.lumi-child-page) .lumi-child-card__chevron {
    transition: transform 220ms ease !important;
}

body:has(.lumi-child-page) .lumi-child-card.is-expanded .lumi-child-card__chevron {
    transform: rotate(180deg) !important;
}

@media (max-width: 860px) {
    body:has(.lumi-child-page) .lumi-child-page {
        grid-template-columns: 1fr !important;
        grid-template-rows: auto auto auto !important;
        padding: 12px 20px 32px !important;
    }

    body:has(.lumi-child-page) .lumi-child-page::after {
        display: none !important;
    }

    body:has(.lumi-child-page) .lumi-child-app-header {
        grid-template-columns: 1fr auto !important;
        min-height: 54px !important;
    }

    .lumi-child-app-header__title,
    .lumi-child-app-header__brand {
        display: none !important;
    }

    body:has(.lumi-child-page) .lumi-child-sidebar,
    body:has(.lumi-child-page) .lumi-child-main {
        grid-column: 1 !important;
    }

    body:has(.lumi-child-page) .lumi-child-sidebar {
        grid-row: 2 !important;
        width: 100% !important;
    }

    body:has(.lumi-child-page) .lumi-child-main {
        grid-row: 3 !important;
    }

    body:has(.lumi-child-page) .lumi-child-sidebar::after {
        width: calc(100vw - 20px) !important;
    }
}

/* Clickable avatar and profile toggle */
body:has(.lumi-child-page) .lumi-child-card__summary {
    grid-template-columns: 44px minmax(0, 1fr) !important;
}

body:has(.lumi-child-page) button.lumi-child-card__avatar {
    position: relative;
    display: flex !important;
    align-items: center;
    justify-content: center;
    padding: 0 !important;
    overflow: visible !important;
    appearance: none;
    cursor: pointer;
}

body:has(.lumi-child-page) .lumi-child-card__avatar-edit {
    position: absolute;
    right: -2px;
    bottom: -2px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border: 2px solid #ffffff;
    border-radius: 50%;
    background: #4e52d8;
    color: #ffffff;
    box-sizing: border-box;
}

body:has(.lumi-child-page) .lumi-child-card__avatar-edit svg {
    width: 10px;
    height: 10px;
}

body:has(.lumi-child-page) button.lumi-child-card__profile-toggle {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 20px;
    align-items: center;
    width: 100%;
    box-sizing: border-box;
    padding: 0 12px 0 0;
    gap: 12px;
    appearance: none;
    border: 0;
    background: transparent;
    color: #17172f;
    font: inherit;
    text-align: left;
    cursor: pointer;
}

body:has(.lumi-child-page) button.lumi-child-card__avatar:focus-visible,
body:has(.lumi-child-page) button.lumi-child-card__profile-toggle:focus-visible {
    outline: 2px solid #4e52d8;
    outline-offset: 3px;
}


.lumi-child-card__setting {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.lumi-child-card__setting-label {
    margin: 0;
    color: #4c4c5f;
    font-size: 13px;
    font-weight: 700;
}


/* Shared Pages / Preview overlay shell */
body:has(.lumi-child-page) .lumi-child-main {
    position: relative !important;
}

body:has(.lumi-child-page) .lumi-child-main > .lumi-pages-preview {
    position: absolute;
    inset: 0;
    z-index: 10;
    pointer-events: none;
}

.lumi-pages-preview {
    height: 100%;
}

button.lumi-pages-preview__trigger {
    position: absolute;
    z-index: 2;
    top: 118px;
    right: 20px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 38px;
    padding: 0;
    border: 0 !important;
    border-radius: 0;
    background: transparent !important;
    color: #4e52d8;
    font: inherit;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    pointer-events: auto;
    transition: right 220ms ease;
}

button.lumi-pages-preview__trigger[aria-expanded="true"] {
    right: 190px;
    visibility: hidden;
    pointer-events: none;
}

button.lumi-pages-preview__trigger span {
    color: #4e52d8 !important;
}

.lumi-pages-preview__trigger img,
.lumi-pages-preview__panel-toggle img,
.lumi-pages-preview__header img {
    display: block;
    width: 20px;
    height: 20px;
}

.lumi-pages-preview__panel {
    display: flex;
    flex-direction: column;
    overflow-x: hidden;
    overflow-y: auto;
    position: absolute;
    z-index: 1;
    top: 112px;
    right: -42px;
    bottom: 0;
    width: var(--lumi-pages-preview-open-width, 380px);
    box-sizing: border-box;
    padding: 24px 24px 0;
    border-top: 0;
    border-left: 1px solid #e4e4ef;
    background: #ffffff;
    box-shadow: none;
    pointer-events: auto;
}

.lumi-pages-preview__header {
    display: flex;
    align-items: center;
    gap: 10px;
}

.lumi-pages-preview__header h2 {
    margin: 0;
    color: #17172f;
    font-size: 20px;
    line-height: 1.2;
}

.lumi-pages-preview__empty {
    margin: 24px 0 0;
    color: #666678;
    font-size: 14px;
}


.lumi-pages-preview__panel [data-lumi-flashcards-panel-preview] {
    width: 100% !important;
    min-height: 0 !important;
    aspect-ratio: 210 / 297;
    padding: 4.7619% !important;
    gap: var(--lumi-flashcards-preview-gap, 4px) !important;
    box-shadow: none !important;
}

.lumi-pages-preview__panel
    [data-lumi-flashcards-panel-preview].lumi-flashcards-preview-page--letter {
    aspect-ratio: 215.9 / 279.4;
}

.lumi-pages-preview__page-card {
    margin: 24px 0 0;
}

.lumi-pages-preview__page-frame {
    position: relative;
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-rows: 24px auto;
    padding: 0 20px 12px;
    border: 1px solid #b9b9c3;
    border-radius: 6px;
}

/* Service row (page number + trash) sits in its own grid row, above the printable preview. */
.lumi-pages-preview__page-frame > *:not(.lumi-pages-preview__page-number):not(.lumi-pages-preview__delete-page) {
    grid-row: 2;
    grid-column: 1 / -1;
}

.lumi-pages-preview__page-number {
    position: static;
    z-index: 3;
    grid-row: 1;
    grid-column: 1;
    align-self: center;
    justify-self: start;
    display: grid;
    place-items: center;
    width: 28px;
    height: 28px;
    border: 1px solid #b9b9c3;
    border-radius: 50%;
    background: #ffffff;
    color: #17172f;
    font-size: 14px;
    font-weight: 700;
}

.lumi-pages-preview__page-label {
    margin: 10px 0 0;
    color: #666678;
    font-size: 14px;
    font-weight: 600;
    text-align: center;
}

.lumi-pages-preview__page-card.is-active
    .lumi-pages-preview__page-frame {
    border-color: #4e52d8;
}

.lumi-pages-preview__page-card.is-active
    .lumi-pages-preview__page-number {
    border-color: #4e52d8;
    background: #4e52d8;
    color: #ffffff;
}

.lumi-pages-preview__page-card.is-active
    .lumi-pages-preview__page-label {
    color: #4e52d8;
}

.lumi-pages-preview__topbar {
    position: relative;
    z-index: 2;
    flex: 0 0 auto;
    padding-bottom: 16px;
    background: #ffffff;
}

button.lumi-pages-preview__panel-toggle {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 38px;
    padding: 0;
    border: 0 !important;
    border-radius: 0;
    background: transparent !important;
    color: #4e52d8;
    font: inherit;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
}

button.lumi-pages-preview__panel-toggle span {
    color: #4e52d8 !important;
}

.lumi-pages-preview__actions {
    margin-top: 16px;
}

.lumi-pages-preview__content {
    flex: 0 0 auto;
}

/* Page number is now shown in the nav row / thumbnail badge instead. */
.lumi-pages-preview__page-label {
    display: none;
}

.lumi-pages-preview__nav {
    --lumi-pages-preview-nav-control-height: 34px;
    position: relative;
    z-index: 2;
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: space-between;
    width: 88%;
    margin-left: auto;
    margin-right: auto;
    gap: 8px;
    margin-top: 12px;
    padding-bottom: 108px;
    background: #ffffff;
}

.lumi-pages-preview__nav[hidden] {
    display: none;
}

.lumi-pages-preview__nav:has(
    .lumi-pages-preview__picker:not([hidden])
) {
    z-index: 70;
}

button.lumi-pages-preview__nav-arrow {
    display: grid;
    flex: 0 0 auto;
    width: 34px;
    height: var(--lumi-pages-preview-nav-control-height);
    padding: 0;
    border: 1px solid #b9b9c3 !important;
    border-radius: 6px;
    place-items: center;
    background: #ffffff !important;
    color: #17172f !important;
    cursor: pointer;
}

button.lumi-pages-preview__nav-arrow:hover:not(:disabled) {
    border-color: #4e52d8 !important;
    color: #4e52d8 !important;
}

button.lumi-pages-preview__nav-arrow:disabled {
    cursor: not-allowed;
    opacity: 0.35;
}

button.lumi-pages-preview__nav-arrow svg {
    display: block;
    width: 14px;
    height: 14px;
}

button.lumi-pages-preview__nav-current {
    display: inline-flex;
    height: var(--lumi-pages-preview-nav-control-height);
    min-height: var(--lumi-pages-preview-nav-control-height);
    min-width: 96px;
    align-items: center;
    justify-content: center;
    padding: 0 24px;
    border: 0 !important;
    border-radius: 999px;
    background: #f2f2ff !important;
    color: #4e52d8 !important;
    font: inherit;
    font-size: 13px;
    font-weight: 600;
    text-align: center;
    cursor: pointer;
}

button.lumi-pages-preview__nav-current:hover:not(:disabled) {
    background: #e7e8ff !important;
    color: #4e52d8 !important;
}

button.lumi-pages-preview__nav-current:focus-visible:not(:disabled) {
    outline: 2px solid #4e52d8;
    outline-offset: 2px;
}

button.lumi-pages-preview__nav-current:disabled {
    background: #f5f5f7 !important;
    color: #666678 !important;
    cursor: not-allowed;
    opacity: 0.35;
}

.lumi-pages-preview__picker {
    position: fixed;
    z-index: 60;
    box-sizing: border-box;
    width: auto;
    max-width: calc(100vw - 32px);
    padding: 6px 8px 8px;
    border: 1px solid #e4e4ef;
    border-radius: 6px;
    background: #ffffff;
    box-shadow: 0 8px 24px rgba(23, 23, 47, 0.12);
    overflow: hidden;
}

.lumi-pages-preview__picker[hidden] {
    display: none;
}

.lumi-pages-preview__picker-header {
    display: flex;
    min-height: 28px;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 4px;
}

.lumi-pages-preview__picker-title {
    color: #666678;
    font-size: 12px;
    font-weight: 600;
}

button.lumi-pages-preview__picker-close {
    display: grid;
    width: 28px;
    height: 28px;
    padding: 0;
    border: 0 !important;
    border-radius: 4px;
    place-items: center;
    background: transparent !important;
    color: #5f5f6d !important;
    cursor: pointer;
}

button.lumi-pages-preview__picker-close:hover {
    background: #f5f5f7 !important;
    color: #17172f !important;
}

button.lumi-pages-preview__picker-close svg {
    width: 14px;
    height: 14px;
}

.lumi-pages-preview__picker-grid {
    display: flex;
    width: 100%;
    max-width: 100%;
    flex-wrap: nowrap;
    gap: 12px;
    padding: 2px 1px 6px;
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-x: contain;
    scrollbar-gutter: stable;
}

button.lumi-pages-preview__picker-thumb {
    position: relative;
    display: flex;
    width: 110px;
    min-width: 110px;
    height: 140px;
    flex: 0 0 110px;
    flex-direction: column;
    align-items: center;
    gap: 7px;
    padding: 8px 10px 9px;
    border: 1px solid transparent !important;
    border-radius: 6px;
    background: #f5f5f7 !important;
    box-sizing: border-box;
    cursor: pointer;
}

button.lumi-pages-preview__picker-thumb:hover {
    border-color: #b9b9c3 !important;
}

button.lumi-pages-preview__picker-thumb.is-active {
    border-color: #4e52d8 !important;
}

.lumi-pages-preview__picker-thumb-preview-area {
    display: flex;
    width: 88px;
    height: 90px;
    align-items: center;
    justify-content: center;
}

.lumi-pages-preview__picker-thumb-preview {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 4px;
    overflow: hidden;
    border: 1px solid #b9b9c3;
    border-radius: 4px;
    background: #ffffff;
    box-sizing: border-box;
    pointer-events: none;
}

.lumi-pages-preview__picker-thumb-preview .lumi-pages-preview__page-card {
    margin: 0;
}

.lumi-pages-preview__picker-thumb-preview
    .lumi-pages-preview__picker-page--scale-whole {
    flex: 0 0 auto;
}

.lumi-pages-preview__picker-thumb-preview .lumi-pages-preview__page-frame {
    /* The number/delete service row is outside picker previews. */
    grid-template-rows: auto;
    padding: 0;
    border: 0 !important;
    border-radius: 0;
    box-shadow: none;
}

.lumi-pages-preview__picker-thumb-preview
    .lumi-pages-preview__page-frame
    > * {
    grid-row: 1;
}

.lumi-pages-preview__picker-page-number {
    position: static;
    order: -1;
    align-self: flex-start;
    display: grid;
    width: 24px;
    height: 24px;
    border: 1px solid #b9b9c3;
    border-radius: 50%;
    place-items: center;
    background: #ffffff;
    color: #17172f;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
}

button.lumi-pages-preview__picker-thumb.is-active
    .lumi-pages-preview__picker-page-number {
    border-color: #4e52d8;
    background: #4e52d8;
    color: #ffffff;
}

body:has(.lumi-child-page) .lumi-pages-preview__footer {
    display: block !important;
    position: fixed;
    right: 0;
    bottom: 0;
    left: auto;
    z-index: 12;
    width: var(--lumi-pages-preview-open-width, 380px);
    box-sizing: border-box;
    padding: 16px 24px 24px;
    border-left: 1px solid #e4e4ef;
    background: #ffffff;
}

.lumi-pages-preview__footer .lumi-button {
    width: 100%;
    border-radius: 6px !important;
}

.lumi-pages-preview__panel.is-viewport-fixed {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
}

button.lumi-pages-preview__add-page {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    box-sizing: border-box;
    min-height: 54px;
    padding: 10px 16px;
    border: 1px dashed #7b7fff !important;
    border-radius: 6px;
    background: #fafaff !important;
    color: #4e52d8 !important;
    font: inherit;
    font-size: 17px;
    font-weight: 600;
    cursor: pointer;
}

.lumi-pages-preview__add-page-icon {
    position: relative;
    width: 24px;
    height: 24px;
    border: 2px solid #4e52d8;
    border-radius: 50%;
    transition: transform 160ms ease;
}

button.lumi-pages-preview__add-page:hover:not(:disabled)
    .lumi-pages-preview__add-page-icon {
    transform: scale(1.12);
}

.lumi-pages-preview__add-page-icon::before,
.lumi-pages-preview__add-page-icon::after {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 12px;
    height: 1.5px;
    background: currentColor;
    content: "";
    transform: translate(-50%, -50%);
}

.lumi-pages-preview__add-page-icon::after {
    transform: translate(-50%, -50%) rotate(90deg);
}

.lumi-pages-preview__page-card {
    width: 88%;
    margin: 16px auto 0;
}


[data-lumi-saved-material-preview-pages] {
    display: grid;
    gap: 24px;
}

.lumi-saved-visual-preview {
    display: flex;
    width: 420px;
    max-width: 100%;
    box-sizing: border-box;
    align-items: center;
    justify-content: center;
    padding: 32px;
    background: #FFFFFF;
    box-shadow: 0 8px 28px rgba(23, 23, 47, 0.12);
}

.lumi-saved-visual-preview img {
    display: block;
    width: auto;
    max-width: 100%;
    height: auto;
    max-height: 70vh;
    object-fit: contain;
}

.lumi-saved-visual-schedule-preview-pages {
    display: grid;
    width: 444px;
    max-width: 100%;
    gap: 24px;
}

.lumi-saved-visual-schedule-preview-pages
    .lumi-pages-preview__page-frame--visual-schedule {
    border-color: transparent;
    box-shadow: 0 8px 28px rgba(23, 23, 47, 0.12);
}


button.lumi-pages-preview__delete-page {
    position: static;
    grid-row: 1;
    grid-column: 2;
    align-self: center;
    justify-self: end;
    display: grid;
    width: 28px;
    height: 28px;
    padding: 0;
    border: 0 !important;
    border-radius: 4px;
    place-items: center;
    background: transparent !important;
    color: #5f5f6d !important;
    cursor: pointer;
}

button.lumi-pages-preview__delete-page:hover:not(:disabled) {
    background: #f5f5f7 !important;
    color: #17172f !important;
}

button.lumi-pages-preview__delete-page:disabled {
    cursor: not-allowed;
    opacity: 0.35;
}

button.lumi-pages-preview__delete-page svg {
    display: block;
    width: 15px;
    height: 16px;
}


/* Student and therapist libraries. */
.lumi-child-workspace-menu__divider {
    height: 1px;
    margin: 12px 0;
    background: #e4e4ef;
}

/* Keep a single LUMI logo in the child workspace header. */
body:has(.lumi-child-page) .lumi-child-app-header::before {
    content: none !important;
    background: none !important;
}

.lumi-my-materials__search {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    margin: 0 0 26px;
}

.lumi-my-materials__search input[type="search"] {
    width: 100%;
    min-width: 0;
    height: 50px;
    padding: 0 38px;
    border: 1px solid #e4e4ef;
    border-radius: 6px;
    background: #ffffff;
    color: #17172f;
    font: inherit;
    font-size: 14px;
    box-shadow: 0 10px 28px rgba(23, 23, 47, 0.05);
    box-sizing: border-box;
}

.lumi-my-materials__search input[type="search"]::-webkit-search-cancel-button {
    display: none;
    -webkit-appearance: none;
    appearance: none;
}

.lumi-my-materials__search-icon,
.lumi-my-materials__search-clear {
    position: absolute;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #626477;
}

.lumi-my-materials__search-icon {
    left: 12px;
    width: 16px;
    height: 16px;
}

.lumi-my-materials__search-icon svg {
    display: block;
    width: 16px;
    height: 16px;
}

.lumi-my-materials__search-clear {
    right: 10px;
    width: 20px;
    height: 20px;
    color: #17172f;
    font-size: 20px;
    line-height: 1;
    text-decoration: none;
}

.lumi-my-materials__filters {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 0 0 18px;
}

.lumi-my-materials__filter {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 50px;
    padding: 0 16px;
    border: 1px solid #4E52D8;
    border-radius: 6px;
    background: #ffffff;
    color: #4E52D8;
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
}

.lumi-my-materials__filter:hover,
.lumi-my-materials__filter:focus {
    border-color: #4e52d8;
    color: #4e52d8;
}

.lumi-my-materials__filter.is-active {
    border-color: #ff7754;
    background: #ff7754;
    color: #ffffff;
}

.lumi-my-materials__filter-divider {
    width: 1px;
    align-self: stretch;
    min-height: 34px;
    background: #e4e4ef;
}

.lumi-my-materials__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 14px;
}

.lumi-my-materials__type {
    display: inline-flex;
    align-items: center;
    min-height: 20px;
    margin: 0;
    padding: 2px 8px;
    border-radius: 999px;
    background: #f0f1ff;
    color: #4E52D8;
    font-size: 9px;
    font-weight: 800;
    line-height: 1;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.lumi-my-materials__client-tag {
    display: inline-flex;
    align-items: center;
    padding: 6px 10px;
    border-radius: 999px;
    background: #f7f7fb;
    color: #626477;
    font-size: 12px;
    font-weight: 700;
}


/* Shared editor workspace zoom. */
.lumi-workspace-zoom {
    display: inline-flex;
    align-items: center;
    height: 54px;
    overflow: hidden;
    border: 1px solid #B6B9E5;
    border-radius: 8px;
    background: #FFFFFF;
}

button.lumi-workspace-zoom__button {
    display: grid !important;
    width: 34px !important;
    height: 52px !important;
    min-height: 52px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    place-items: center;
    background: #FFFFFF !important;
    color: #4E52D8 !important;
    font: inherit;
    font-size: 23px;
    font-weight: 400;
    line-height: 1;
    cursor: pointer;
}

button.lumi-workspace-zoom__button:hover:not(:disabled),
button.lumi-workspace-zoom__button:focus-visible {
    background: #F5F6FF !important;
}

button.lumi-workspace-zoom__button:disabled {
    cursor: not-allowed;
    opacity: .4;
}

.lumi-workspace-zoom__value {
    display: grid;
    min-width: 52px;
    height: 52px;
    padding: 0 8px;
    border-right: 1px solid #B6B9E5;
    border-left: 1px solid #B6B9E5;
    place-items: center;
    color: #17172F;
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
}

.lumi-workspace-zoom-viewport {
    width: 100%;
    overflow: auto;
}

.lumi-workspace-zoom-canvas {
    width: min(100%, var(--lumi-workspace-canvas-max-width, 100%));
    margin: 0;
    zoom: var(--lumi-workspace-zoom, 1);
    transform-origin: top center;
}

.lumi-visual-schedule__workspace {
    --lumi-workspace-canvas-max-width: 1200px;
}

/* Visual Schedule Preview: scaled copy of the printable page (JS reads this frame's own padding to fit the paper). */
.lumi-pages-preview__page-frame--visual-schedule {
    display: block;
    width: 100%;
    min-height: 0;
    padding: 36px 0 0;
    overflow: hidden;
    box-sizing: border-box;
}

.lumi-pages-preview__page-frame--visual-schedule .lumi-pages-preview__page-number {
    position: absolute;
    top: 10px;
    left: 10px;
}

.lumi-pages-preview__page-frame--visual-schedule button.lumi-pages-preview__delete-page {
    position: absolute;
    top: 10px;
    right: 10px;
}

.lumi-pages-preview__page-frame--visual-schedule-portrait {
    aspect-ratio: 210 / 297;
}

.lumi-pages-preview__page-frame--visual-schedule-landscape {
    aspect-ratio: 297 / 210;
}

.lumi-pages-preview__page-frame--visual-schedule-a3.lumi-pages-preview__page-frame--visual-schedule-portrait {
    aspect-ratio: 297 / 420;
}

.lumi-pages-preview__page-frame--visual-schedule-a3.lumi-pages-preview__page-frame--visual-schedule-landscape {
    aspect-ratio: 420 / 297;
}

.lumi-pages-preview__page-frame--visual-schedule-letter.lumi-pages-preview__page-frame--visual-schedule-portrait {
    aspect-ratio: 215.9 / 279.4;
}

.lumi-pages-preview__page-frame--visual-schedule-letter.lumi-pages-preview__page-frame--visual-schedule-landscape {
    aspect-ratio: 279.4 / 215.9;
}

.lumi-visual-schedule-preview-paper {
    display: grid;
    width: 210mm;
    height: 297mm;
    grid-template-rows: 18mm minmax(0, 1fr);
    margin: 0;
    padding: 12mm;
    overflow: hidden;
    box-sizing: border-box;
    background: #FFFFFF;
    transform-origin: top left;
}

.lumi-visual-schedule-preview-paper.lumi-visual-schedule-print-page--without-title {
    grid-template-rows: minmax(0, 1fr);
}

.lumi-visual-schedule-preview-paper.lumi-visual-schedule-print-page--landscape {
    width: 297mm;
    height: 210mm;
    grid-template-rows: 16mm auto;
    align-content: center;
}

.lumi-visual-schedule-preview-paper.lumi-visual-schedule-print-page--landscape.lumi-visual-schedule-print-page--without-title {
    grid-template-rows: auto;
}

.lumi-visual-schedule-preview-paper.lumi-visual-schedule-print-page--a3 {
    width: 297mm;
    height: 420mm;
}

.lumi-visual-schedule-preview-paper.lumi-visual-schedule-print-page--letter {
    width: 215.9mm;
    height: 279.4mm;
}

.lumi-visual-schedule-preview-paper.lumi-visual-schedule-print-page--a3.lumi-visual-schedule-print-page--landscape {
    width: 420mm;
    height: 297mm;
}

.lumi-visual-schedule-preview-paper.lumi-visual-schedule-print-page--letter.lumi-visual-schedule-print-page--landscape {
    width: 279.4mm;
    height: 215.9mm;
}

.lumi-visual-schedule-preview-paper .lumi-visual-schedule-print-page__title {
    margin: 0;
    color: #4E52D8;
    font-size: 10mm;
    font-weight: 600;
    line-height: 1.1;
    text-align: center;
}

.lumi-visual-schedule-preview-paper .lumi-visual-schedule-print-page__body {
    display: grid;
    min-height: 0;
    grid-template-columns: 60mm 34mm 60mm;
    justify-content: center;
    align-items: start;
    column-gap: 14mm;
}

.lumi-visual-schedule-preview-paper.lumi-visual-schedule-print-page--without-time .lumi-visual-schedule-print-page__body {
    grid-template-columns: 60mm 60mm;
}

.lumi-visual-schedule-preview-paper.lumi-visual-schedule-print-page--without-done-check .lumi-visual-schedule-print-page__body {
    grid-template-columns: 60mm 34mm;
}

.lumi-visual-schedule-preview-paper.lumi-visual-schedule-print-page--without-time.lumi-visual-schedule-print-page--without-done-check .lumi-visual-schedule-print-page__body {
    grid-template-columns: 60mm;
}

.lumi-visual-schedule-preview-paper .lumi-visual-schedule-print-page__track {
    display: grid;
    grid-template-rows: repeat(var(--lumi-visual-schedule-activity-count), var(--lumi-visual-schedule-preview-card-size));
    align-content: start;
    gap: 4mm;
    padding: 4mm;
    border-radius: 6mm;
    box-sizing: border-box;
}

.lumi-visual-schedule-preview-paper .lumi-visual-schedule-print-page__track--images {
    width: calc(var(--lumi-visual-schedule-preview-card-size) + 8mm);
    justify-self: center;
    background: #E7E8FF;
}

.lumi-visual-schedule-preview-paper .lumi-visual-schedule-print-page__track--times {
    padding: 4mm 0;
    background: transparent;
}

.lumi-visual-schedule-preview-paper .lumi-visual-schedule-print-page__track--checks {
    width: calc(var(--lumi-visual-schedule-preview-card-size) + 8mm);
    justify-self: center;
    background: #FFF0ED;
}

.lumi-visual-schedule-preview-paper .lumi-visual-schedule-print-page__activity {
    display: grid;
    min-height: 0;
    place-items: center;
    overflow: hidden;
}

.lumi-visual-schedule-preview-paper .lumi-visual-schedule-print-page__image-square {
    display: grid;
    position: relative;
    width: var(--lumi-visual-schedule-preview-card-size);
    height: var(--lumi-visual-schedule-preview-card-size);
    overflow: hidden;
    border-radius: 4mm;
    place-items: center;
    background: #FFFFFF;
}

.lumi-visual-schedule-preview-paper .lumi-visual-schedule-print-page__image-square img {
    display: block;
    position: absolute;
    inset: 0;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
}

.lumi-visual-schedule-preview-paper .lumi-visual-schedule-print-page__time-chip {
    display: grid;
    width: 100%;
    min-height: 0;
    padding: 3mm 1mm;
    border: 0.3mm solid #E7E8FF;
    border-radius: 4mm;
    place-items: center;
    box-sizing: border-box;
    color: #000000;
    font-size: 6mm;
    font-weight: 600;
    line-height: 1;
}

.lumi-visual-schedule-preview-paper .lumi-visual-schedule-print-page__check {
    width: min(100%, 24mm);
    aspect-ratio: 1 / 1;
    border: 0.6mm dashed #B9B9C3;
    border-radius: 50%;
    box-sizing: border-box;
    background: #FFFFFF;
}

.lumi-visual-schedule-preview-paper.lumi-visual-schedule-print-page--count-1,
.lumi-visual-schedule-preview-paper.lumi-visual-schedule-print-page--count-2,
.lumi-visual-schedule-preview-paper.lumi-visual-schedule-print-page--count-3,
.lumi-visual-schedule-preview-paper.lumi-visual-schedule-print-page--count-4 {
    --lumi-visual-schedule-preview-card-size: 52mm;
}

.lumi-visual-schedule-preview-paper.lumi-visual-schedule-print-page--count-5 {
    --lumi-visual-schedule-preview-card-size: 46mm;
}

.lumi-visual-schedule-preview-paper.lumi-visual-schedule-print-page--count-6 {
    --lumi-visual-schedule-preview-card-size: 37mm;
}

.lumi-visual-schedule-preview-paper.lumi-visual-schedule-print-page--count-7 {
    --lumi-visual-schedule-preview-card-size: 31mm;
}

.lumi-visual-schedule-preview-paper.lumi-visual-schedule-print-page--landscape .lumi-visual-schedule-print-page__body {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 4mm;
}

.lumi-visual-schedule-preview-paper.lumi-visual-schedule-print-page--landscape .lumi-visual-schedule-print-page__track {
    grid-template-columns: repeat(var(--lumi-visual-schedule-activity-count), var(--lumi-visual-schedule-preview-card-size));
    grid-template-rows: var(--lumi-visual-schedule-preview-card-size);
    gap: 2mm;
}

.lumi-visual-schedule-preview-paper.lumi-visual-schedule-print-page--landscape .lumi-visual-schedule-print-page__track--times {
    grid-template-rows: 14mm;
    padding: 0 4mm;
}

.lumi-visual-schedule-preview-paper.lumi-visual-schedule-print-page--landscape .lumi-visual-schedule-print-page__track--checks {
    grid-template-rows: 32mm;
    width: var(--lumi-visual-schedule-preview-track-width);
}

.lumi-visual-schedule-preview-paper.lumi-visual-schedule-print-page--landscape .lumi-visual-schedule-print-page__track {
    width: var(--lumi-visual-schedule-preview-track-width);
}

.lumi-visual-schedule-preview-paper.lumi-visual-schedule-print-page--landscape.lumi-visual-schedule-print-page--count-1 {
    --lumi-visual-schedule-preview-card-size: 60mm;
    --lumi-visual-schedule-preview-track-width: 68mm;
}

.lumi-visual-schedule-preview-paper.lumi-visual-schedule-print-page--landscape.lumi-visual-schedule-print-page--count-2 {
    --lumi-visual-schedule-preview-card-size: 60mm;
    --lumi-visual-schedule-preview-track-width: 130mm;
}

.lumi-visual-schedule-preview-paper.lumi-visual-schedule-print-page--landscape.lumi-visual-schedule-print-page--count-3 {
    --lumi-visual-schedule-preview-card-size: 58mm;
    --lumi-visual-schedule-preview-track-width: 186mm;
}

.lumi-visual-schedule-preview-paper.lumi-visual-schedule-print-page--landscape.lumi-visual-schedule-print-page--count-4 {
    --lumi-visual-schedule-preview-card-size: 52mm;
    --lumi-visual-schedule-preview-track-width: 222mm;
}

.lumi-visual-schedule-preview-paper.lumi-visual-schedule-print-page--landscape.lumi-visual-schedule-print-page--count-5 {
    --lumi-visual-schedule-preview-card-size: 45mm;
    --lumi-visual-schedule-preview-track-width: 241mm;
}

.lumi-visual-schedule-preview-paper.lumi-visual-schedule-print-page--landscape.lumi-visual-schedule-print-page--count-6 {
    --lumi-visual-schedule-preview-card-size: 38mm;
    --lumi-visual-schedule-preview-track-width: 246mm;
}

.lumi-visual-schedule-preview-paper.lumi-visual-schedule-print-page--landscape.lumi-visual-schedule-print-page--count-7 {
    --lumi-visual-schedule-preview-card-size: 33mm;
    --lumi-visual-schedule-preview-track-width: 251mm;
}

.lumi-visual-schedule-preview-paper.lumi-visual-schedule-print-page--landscape .lumi-visual-schedule-print-page__time-chip {
    height: 14mm;
}

/* Visual Schedule: align toolbar controls with Flashcards. */
body:has(.lumi-child-page) .lumi-visual-schedule-settings {
    align-items: flex-end !important;
    gap: 24px !important;
}

body:has(.lumi-child-page) .lumi-visual-schedule-settings__controls,
body:has(.lumi-child-page) .lumi-workspace-settings__controls {
    display: flex !important;
    align-items: flex-end !important;
    gap: 10px !important;
}

body:has(.lumi-child-page) .lumi-visual-schedule-settings__field,
body:has(.lumi-child-page) .lumi-workspace-settings__field {
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
}

body:has(.lumi-child-page)
    .lumi-visual-schedule-settings__field[hidden] {
    display: none !important;
}

body:has(.lumi-child-page) .lumi-visual-schedule-settings__field > label,
body:has(.lumi-child-page) .lumi-visual-schedule-settings__label,
body:has(.lumi-child-page) .lumi-workspace-settings__field > label,
body:has(.lumi-child-page) .lumi-workspace-settings__label {
    height: 12px !important;
    margin: 0 !important;
    color: #111111 !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 12px !important;
    text-transform: uppercase !important;
}

body:has(.lumi-child-page) .lumi-visual-schedule-settings__select,
body:has(.lumi-child-page) .lumi-workspace-settings__select {
    width: 160px !important;
    height: 54px !important;
    min-height: 54px !important;
    padding: 0 32px 0 14px !important;
    border: 1px solid #B6B9E5 !important;
    border-radius: 6px !important;
    background-color: #ffffff !important;
    color: #111111 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 7.5L10 12.5L15 7.5' stroke='%23111111' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-size: 15px 15px !important;
    background-position: right 16px center !important;
}

body:has(.lumi-child-page) .lumi-visual-schedule-settings__select--format,
body:has(.lumi-child-page) .lumi-workspace-settings__select--format {
    width: 100px !important;
}

body:has(.lumi-child-page) .lumi-workspace-settings__select:disabled {
    border-color: #C7CADC !important;
    background-color: #F7F7FA !important;
    color: #8A8D99 !important;
    cursor: not-allowed;
    opacity: 1 !important;
}

body:has(.lumi-child-page) .lumi-visual-schedule-settings__orientation {
    display: flex !important;
    gap: 6px !important;
}

body:has(.lumi-child-page) .lumi-visual-schedule-settings__orientation-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 54px !important;
    height: 54px !important;
    min-height: 54px !important;
    padding: 0 !important;
    border: 1px solid #E4E4EF !important;
    border-radius: 8px !important;
    background: #ffffff !important;
    color: #A9AAB7 !important;
}

body:has(.lumi-child-page) .lumi-visual-schedule-settings__orientation-button--selected {
    border-color: #D8D9FF !important;
    background: #f2f2ff !important;
    color: #4e52d8 !important;
}

body:has(.lumi-child-page) .lumi-visual-schedule-settings__orientation-icon,
body:has(.lumi-child-page) .lumi-visual-schedule-settings__orientation-icon svg {
    width: 42px !important;
    height: 42px !important;
}

body:has(.lumi-child-page) .lumi-visual-schedule-settings__orientation-button > span:last-child {
    display: none !important;
}

body:has(.lumi-child-page) .lumi-visual-schedule-settings__display-options {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 54px;
}

body:has(.lumi-child-page) .lumi-visual-schedule-settings__display-option {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #17172F;
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
    cursor: pointer;
}

body:has(.lumi-child-page) .lumi-visual-schedule-settings__display-option input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
}

body:has(.lumi-child-page) .lumi-visual-schedule-settings__switch {
    position: relative;
    display: inline-block;
    width: 32px;
    height: 18px;
    border-radius: 999px;
    background: #CFCFDB;
    transition: background 150ms ease;
}

body:has(.lumi-child-page) .lumi-visual-schedule-settings__switch::after {
    content: "";
    position: absolute;
    top: 3px;
    left: 3px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #FFFFFF;
    transition: transform 150ms ease;
}

body:has(.lumi-child-page) .lumi-visual-schedule-settings__display-option input:checked + .lumi-visual-schedule-settings__switch {
    background: #4E52D8;
}

body:has(.lumi-child-page) .lumi-visual-schedule-settings__display-option input:checked + .lumi-visual-schedule-settings__switch::after {
    transform: translateX(14px);
}

body:has(.lumi-child-page) .lumi-visual-schedule-settings__display-option input:focus-visible + .lumi-visual-schedule-settings__switch {
    outline: 2px solid #4E52D8;
    outline-offset: 2px;
}


body:has(.lumi-child-page)
    .lumi-editor-shell:has(.lumi-visual-schedule-settings)
    .lumi-editor-shell__settings {
    position: relative;
    border-bottom: 0;
}

body:has(.lumi-child-page)
    .lumi-editor-shell:has(.lumi-visual-schedule-settings)
    .lumi-editor-shell__settings::after {
    content: "";
    position: absolute;
    right: -42px;
    bottom: 0;
    left: -28px;
    height: 1px;
    background: #E4E4EF;
}


body:has(.lumi-child-page)
    .lumi-visual-schedule-settings__orientation-icon rect {
    stroke-width: 1px !important;
}


.lumi-visual-schedule__title-fields {
    margin-bottom: 24px;
}

.lumi-visual-schedule__title-field,
.lumi-visual-schedule__day-title-field {
    margin: 0;
}

.lumi-visual-schedule__workspace.is-weekly
    .lumi-visual-schedule__title-fields {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 12px;
}

.lumi-visual-schedule__title-field label,
.lumi-visual-schedule__day-title-field label {
    display: block;
    margin-bottom: 8px;
    color: #17172F;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.3;
}

.lumi-visual-schedule__title-control {
    position: relative;
    width: 100%;
}

.lumi-visual-schedule__title-control input {
    width: 100% !important;
    height: 70px;
    box-sizing: border-box;
    padding: 0 72px 0 24px;
    border: 1px solid #B6B9E5 !important;
    border-radius: 6px;
    background: #FFFFFF !important;
    color: #111111;
    font: inherit;
    font-size: 28px;
    font-weight: 400;
}

.lumi-visual-schedule__title-icon {
    position: absolute;
    top: 50%;
    right: 24px;
    transform: translateY(-50%);
    color: #A7A9B6;
    font-family: Georgia, serif;
    font-size: 34px;
    font-weight: 400;
    line-height: 1;
    pointer-events: none;
}


.lumi-visual-schedule__workspace.is-weekly
    .lumi-visual-schedule__section-content {
    grid-template-columns: 250px;
}

.lumi-visual-schedule__workspace.is-weekly
    .lumi-visual-schedule__time-field {
    display: none;
}

.lumi-visual-schedule__section {
    position: relative;
    display: grid;
    grid-template-columns: 64px 96px 1fr;
    width: 100%;
    box-sizing: border-box;
    min-height: 300px;
    overflow: hidden;
    border: 1px solid #B6B9E5;
    border-radius: 12px;
    background: #FFFFFF;
}

.lumi-visual-schedule__section-handle,
.lumi-visual-schedule__section-number {
    display: flex;
    align-items: center;
    justify-content: center;
    border-right: 1px solid #B6B9E5;
}

.lumi-visual-schedule__section-handle {
    display: grid;
    grid-template-columns: repeat(2, 4px);
    gap: 4px;
    align-content: center;
    justify-content: center;
    cursor: grab;
    touch-action: none;
    user-select: none;
}

.lumi-visual-schedule__section.is-dragging {
    border-color: #4E52D8;
    box-shadow: 0 10px 24px rgba(78, 82, 216, 0.16);
    opacity: 0.72;
}

.lumi-visual-schedule__section.is-dragging
    .lumi-visual-schedule__section-handle {
    cursor: grabbing;
}

.lumi-visual-schedule__section-handle i {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #D8D9FF;
}

.lumi-visual-schedule__section-number {
    color: #111111;
    font-size: 24px;
    font-weight: 500;
}

.lumi-visual-schedule__section-content {
    display: grid;
    grid-template-columns: 250px 240px;
    align-items: center;
    gap: 32px;
    padding: 20px 32px;
}

.lumi-visual-schedule__section-media-grid {
    grid-template-columns: repeat(auto-fill, minmax(220px, 250px));
    gap: 0;
    padding: 0;
}

.lumi-visual-schedule__time-field {
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 240px;
}

.lumi-visual-schedule__time-label {
    color: #626477;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.3;
}

.lumi-visual-schedule__time {
    flex: 0 0 auto;
    width: 100% !important;
    min-width: 0;
    max-width: none;
    height: 70px;
    box-sizing: border-box;
    border: 1px solid #B6B9E5 !important;
    border-radius: 6px;
    background: #FFFFFF !important;
    color: #111111;
    font: inherit;
    font-size: 30px;
    font-weight: 500;
    text-align: center;
}

.lumi-visual-schedule__section-delete {
    position: absolute;
    top: 10px;
    right: 10px;
    display: grid !important;
    width: 28px !important;
    height: 28px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 4px !important;
    place-items: center;
    background: transparent !important;
    box-shadow: none !important;
    color: #5F5F6D !important;
    cursor: pointer;
}

.lumi-visual-schedule__section-delete img {
    display: block;
    width: 15px;
    height: 16px;
}



button.lumi-visual-schedule__add-activity {
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100% !important;
    min-height: 110px !important;
    padding: 0 !important;
    margin-top: 20px;
    border: 1px dashed #B8BAFF !important;
    border-radius: 6px !important;
    background: #FBFBFF !important;
    color: #4E52D8 !important;
    box-shadow: none !important;
    font: inherit;
    cursor: pointer;
}

.lumi-visual-schedule__add-activity-main {
    display: flex;
    align-items: center;
    gap: 16px;
    font-size: 22px;
    font-weight: 600;
}

.lumi-visual-schedule__add-activity-icon {
    position: relative;
    width: 28px;
    height: 28px;
    border: 2px solid currentColor;
    border-radius: 50%;
}

.lumi-visual-schedule__add-activity-icon::before,
.lumi-visual-schedule__add-activity-icon::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    background: currentColor;
    transform: translate(-50%, -50%);
}

.lumi-visual-schedule__add-activity-icon::before {
    width: 10px;
    height: 2px;
}

.lumi-visual-schedule__add-activity-icon::after {
    width: 2px;
    height: 10px;
}

.lumi-visual-schedule__add-activity small {
    color: #8A8D99;
    font-size: 14px;
    font-weight: 400;
}

.lumi-visual-schedule__section-delete:disabled {
    cursor: not-allowed;
    opacity: .35;
}


.lumi-visual-schedule__sections {
    display: flex;
    flex-direction: column;
    gap: 20px;
}


.lumi-visual-schedule-print-frame {
    position: fixed;
    width: 1px;
    height: 1px;
    border: 0;
    opacity: 0;
    pointer-events: none;
}

.lumi-visual-schedule-print-modal[hidden] {
    display: none;
}

@media print {
    @page lumi-visual-schedule-a3-portrait {
        size: A3 portrait;
        margin: 0;
    }

    @page lumi-visual-schedule-a3-landscape {
        size: A3 landscape;
        margin: 0;
    }

    @page lumi-visual-schedule-a4-portrait {
        size: A4 portrait;
        margin: 0;
    }

    @page lumi-visual-schedule-a4-landscape {
        size: A4 landscape;
        margin: 0;
    }

    @page lumi-visual-schedule-letter-portrait {
        size: Letter portrait;
        margin: 0;
    }

    @page lumi-visual-schedule-letter-landscape {
        size: Letter landscape;
        margin: 0;
    }

    html,
    body {
        width: auto !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        background: #FFFFFF !important;
    }

    body > .lumi-visual-schedule-print-modal.is-exporting {
        display: block !important;
    }

    body * {
        visibility: hidden !important;
    }

    .lumi-visual-schedule-print-modal.is-exporting,
    .lumi-visual-schedule-print-modal.is-exporting * {
        visibility: visible !important;
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }

    .lumi-visual-schedule-print-modal.is-exporting {
        position: static !important;
        display: block !important;
        width: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        background: #FFFFFF !important;
    }

    .lumi-visual-schedule-print-page {
        display: grid !important;
        grid-template-rows: 18mm minmax(0, 1fr);
        width: 210mm !important;
        height: 297mm !important;
        margin: 0 !important;
        padding: 12mm !important;
        overflow: hidden;
        box-sizing: border-box !important;
        background: #FFFFFF !important;
        page: lumi-visual-schedule-a4-portrait;
        break-after: page;
    }

    .lumi-visual-schedule-print-page:last-child {
        break-after: auto;
    }

    .lumi-visual-schedule-print-page--without-title {
        grid-template-rows: minmax(0, 1fr);
    }

    .lumi-visual-schedule-print-page--landscape.lumi-visual-schedule-print-page--without-title {
        grid-template-rows: auto;
    }

    .lumi-visual-schedule-print-page--landscape {
        grid-template-rows: 16mm auto;
        align-content: center;
        width: 297mm !important;
        height: 210mm !important;
        page: lumi-visual-schedule-a4-landscape;
    }

    .lumi-visual-schedule-print-page--a3 {
        width: 297mm !important;
        height: 420mm !important;
        page: lumi-visual-schedule-a3-portrait;
    }

    .lumi-visual-schedule-print-page--a3.lumi-visual-schedule-print-page--landscape {
        width: 420mm !important;
        height: 297mm !important;
        page: lumi-visual-schedule-a3-landscape;
    }

    .lumi-visual-schedule-print-page--letter {
        width: 215.9mm !important;
        height: 279.4mm !important;
        page: lumi-visual-schedule-letter-portrait;
    }

    .lumi-visual-schedule-print-page--letter.lumi-visual-schedule-print-page--landscape {
        width: 279.4mm !important;
        height: 215.9mm !important;
        page: lumi-visual-schedule-letter-landscape;
    }

    .lumi-visual-schedule-print-page__title {
        margin: 0;
        color: #4E52D8;
        font-size: 10mm;
        font-weight: 600;
        line-height: 1.1;
        text-align: center;
    }

    .lumi-visual-schedule-print-page__body {
        display: grid;
        grid-template-columns: 60mm 34mm 60mm;
        justify-content: center;
        align-items: start;
        column-gap: 14mm;
        min-height: 0;
    }

    .lumi-visual-schedule-print-page--without-time
        .lumi-visual-schedule-print-page__body {
        grid-template-columns: 60mm 60mm;
    }

    .lumi-visual-schedule-print-page--without-done-check
        .lumi-visual-schedule-print-page__body {
        grid-template-columns: 60mm 34mm;
    }

    .lumi-visual-schedule-print-page--without-time.lumi-visual-schedule-print-page--without-done-check
        .lumi-visual-schedule-print-page__body {
        grid-template-columns: 60mm;
    }

    .lumi-visual-schedule-print-page__track {
        display: grid;
        grid-template-rows: repeat(
            var(--lumi-visual-schedule-activity-count),
            var(--lumi-visual-schedule-print-card-size)
        );
        align-content: start;
        gap: 4mm;
        padding: 4mm;
        border-radius: 6mm;
        box-sizing: border-box;
    }

    .lumi-visual-schedule-print-page__track--images {
        width: calc(var(--lumi-visual-schedule-print-card-size) + 8mm);
        justify-self: center;
        background: #E7E8FF !important;
    }

    .lumi-visual-schedule-print-page__track--times {
        padding: 4mm 0;
        background: transparent;
    }

    .lumi-visual-schedule-print-page__track--checks {
        width: calc(var(--lumi-visual-schedule-print-card-size) + 8mm);
        justify-self: center;
        background: #FFF0ED !important;
    }

    .lumi-visual-schedule-print-page__activity {
        display: grid;
        min-height: 0;
        place-items: center;
        overflow: hidden;
    }

    .lumi-visual-schedule-print-page__image-square {
        display: grid;
        position: relative;
        width: var(--lumi-visual-schedule-print-card-size);
        height: var(--lumi-visual-schedule-print-card-size);
        overflow: hidden;
        border-radius: 4mm;
        place-items: center;
        background: #FFFFFF !important;
    }

    .lumi-visual-schedule-print-page__image-square img {
        display: block;
        position: absolute;
        inset: 0;
        width: 100% !important;
        height: 100% !important;
        object-fit: contain !important;
        object-position: center !important;
    }

    .lumi-visual-schedule-print-page__time-chip {
        display: grid;
        width: 100%;
        min-height: 0;
        padding: 3mm 1mm;
        border: 0.3mm solid #E7E8FF;
        border-radius: 4mm;
        place-items: center;
        box-sizing: border-box;
        color: #000000;
        font-size: 6mm;
        font-weight: 600;
        line-height: 1;
    }

    .lumi-visual-schedule-print-page__check {
        width: min(100%, 24mm);
        aspect-ratio: 1 / 1;
        border: 0.6mm dashed #B9B9C3;
        border-radius: 50%;
        box-sizing: border-box;
        background: #FFFFFF !important;
    }

    .lumi-visual-schedule-print-page--count-1 {
        --lumi-visual-schedule-print-card-size: 52mm;
    }

    .lumi-visual-schedule-print-page--count-2 {
        --lumi-visual-schedule-print-card-size: 52mm;
    }

    .lumi-visual-schedule-print-page--count-3 {
        --lumi-visual-schedule-print-card-size: 52mm;
    }

    .lumi-visual-schedule-print-page--count-4 {
        --lumi-visual-schedule-print-card-size: 52mm;
    }

    .lumi-visual-schedule-print-page--count-5 {
        --lumi-visual-schedule-print-card-size: 46mm;
    }

    .lumi-visual-schedule-print-page--count-6 {
        --lumi-visual-schedule-print-card-size: 37mm;
    }

    .lumi-visual-schedule-print-page--count-7 {
        --lumi-visual-schedule-print-card-size: 31mm;
    }

    .lumi-visual-schedule-print-page--landscape
        .lumi-visual-schedule-print-page__body {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
        gap: 4mm;
    }

    .lumi-visual-schedule-print-page--landscape
        .lumi-visual-schedule-print-page__track {
        grid-template-columns: repeat(
            var(--lumi-visual-schedule-activity-count),
            var(--lumi-visual-schedule-print-card-size)
        );
        grid-template-rows: var(--lumi-visual-schedule-print-card-size);
        gap: 2mm;
    }

    .lumi-visual-schedule-print-page--landscape
        .lumi-visual-schedule-print-page__track--times {
        grid-template-rows: 14mm;
        padding: 0 4mm;
    }

    .lumi-visual-schedule-print-page--landscape
        .lumi-visual-schedule-print-page__track--checks {
        grid-template-rows: 32mm;
    }

    .lumi-visual-schedule-print-page--landscape
        .lumi-visual-schedule-print-page__track {
        width: var(--lumi-visual-schedule-print-track-width);
    }

    .lumi-visual-schedule-print-page--landscape.lumi-visual-schedule-print-page--count-1 {
        --lumi-visual-schedule-print-track-width: 68mm;
    }

    .lumi-visual-schedule-print-page--landscape.lumi-visual-schedule-print-page--count-2 {
        --lumi-visual-schedule-print-track-width: 130mm;
    }

    .lumi-visual-schedule-print-page--landscape.lumi-visual-schedule-print-page--count-3 {
        --lumi-visual-schedule-print-track-width: 186mm;
    }

    .lumi-visual-schedule-print-page--landscape.lumi-visual-schedule-print-page--count-4 {
        --lumi-visual-schedule-print-track-width: 222mm;
    }

    .lumi-visual-schedule-print-page--landscape.lumi-visual-schedule-print-page--count-5 {
        --lumi-visual-schedule-print-track-width: 241mm;
    }

    .lumi-visual-schedule-print-page--landscape.lumi-visual-schedule-print-page--count-6 {
        --lumi-visual-schedule-print-track-width: 246mm;
    }

    .lumi-visual-schedule-print-page--landscape.lumi-visual-schedule-print-page--count-7 {
        --lumi-visual-schedule-print-track-width: 251mm;
    }

    .lumi-visual-schedule-print-page--landscape
        .lumi-visual-schedule-print-page__time-chip {
        height: 14mm;
    }

    .lumi-visual-schedule-print-page--landscape.lumi-visual-schedule-print-page--count-1,
    .lumi-visual-schedule-print-page--landscape.lumi-visual-schedule-print-page--count-2 {
        --lumi-visual-schedule-print-card-size: 60mm;
    }

    .lumi-visual-schedule-print-page--landscape.lumi-visual-schedule-print-page--count-3 {
        --lumi-visual-schedule-print-card-size: 58mm;
    }

    .lumi-visual-schedule-print-page--landscape.lumi-visual-schedule-print-page--count-4 {
        --lumi-visual-schedule-print-card-size: 52mm;
    }

    .lumi-visual-schedule-print-page--landscape.lumi-visual-schedule-print-page--count-5 {
        --lumi-visual-schedule-print-card-size: 45mm;
    }

    .lumi-visual-schedule-print-page--landscape.lumi-visual-schedule-print-page--count-6 {
        --lumi-visual-schedule-print-card-size: 38mm;
    }

    .lumi-visual-schedule-print-page--landscape.lumi-visual-schedule-print-page--count-7 {
        --lumi-visual-schedule-print-card-size: 33mm;
    }
}


/* A3 Visual Schedule scale */
.lumi-visual-schedule-print-page.lumi-visual-schedule-print-page--a3 {
    grid-template-rows: 25.5mm minmax(0, 1fr);
    padding: 17mm !important;
}

.lumi-visual-schedule-print-page.lumi-visual-schedule-print-page--a3.lumi-visual-schedule-print-page--without-title {
    grid-template-rows: minmax(0, 1fr);
}

.lumi-visual-schedule-print-page.lumi-visual-schedule-print-page--a3.lumi-visual-schedule-print-page--landscape {
    grid-template-rows: 22.6mm auto;
}

.lumi-visual-schedule-print-page.lumi-visual-schedule-print-page--a3.lumi-visual-schedule-print-page--landscape.lumi-visual-schedule-print-page--without-title {
    grid-template-rows: auto;
}

.lumi-visual-schedule-print-page--a3 .lumi-visual-schedule-print-page__title {
    font-size: 14.1mm;
}

.lumi-visual-schedule-print-page--a3 .lumi-visual-schedule-print-page__body {
    grid-template-columns: 84.9mm 48.1mm 84.9mm;
    column-gap: 19.8mm;
}

.lumi-visual-schedule-print-page--a3.lumi-visual-schedule-print-page--without-time .lumi-visual-schedule-print-page__body {
    grid-template-columns: 84.9mm 84.9mm;
}

.lumi-visual-schedule-print-page--a3.lumi-visual-schedule-print-page--without-done-check .lumi-visual-schedule-print-page__body {
    grid-template-columns: 84.9mm 48.1mm;
}

.lumi-visual-schedule-print-page--a3.lumi-visual-schedule-print-page--without-time.lumi-visual-schedule-print-page--without-done-check .lumi-visual-schedule-print-page__body {
    grid-template-columns: 84.9mm;
}

.lumi-visual-schedule-print-page--a3 .lumi-visual-schedule-print-page__track {
    gap: 5.7mm;
    padding: 5.7mm;
    border-radius: 8.5mm;
}

.lumi-visual-schedule-print-page--a3 .lumi-visual-schedule-print-page__track--images,
.lumi-visual-schedule-print-page--a3 .lumi-visual-schedule-print-page__track--checks {
    width: calc(var(--lumi-visual-schedule-print-card-size) + 11.4mm);
}

.lumi-visual-schedule-print-page--a3 .lumi-visual-schedule-print-page__image-square {
    border-radius: 5.7mm;
}

.lumi-visual-schedule-print-page--a3 .lumi-visual-schedule-print-page__time-chip {
    padding: 4.2mm 1.4mm;
    border-width: 0.4mm;
    border-radius: 5.7mm;
    font-size: 8.5mm;
}

.lumi-visual-schedule-print-page--a3 .lumi-visual-schedule-print-page__check {
    width: min(100%, 33.9mm);
    border-width: 0.8mm;
}

.lumi-visual-schedule-print-page--a3.lumi-visual-schedule-print-page--count-1,
.lumi-visual-schedule-print-page--a3.lumi-visual-schedule-print-page--count-2,
.lumi-visual-schedule-print-page--a3.lumi-visual-schedule-print-page--count-3,
.lumi-visual-schedule-print-page--a3.lumi-visual-schedule-print-page--count-4 {
    --lumi-visual-schedule-preview-card-size: 73.5mm;
    --lumi-visual-schedule-print-card-size: 73.5mm;
}

.lumi-visual-schedule-print-page--a3.lumi-visual-schedule-print-page--count-5 {
    --lumi-visual-schedule-preview-card-size: 65mm;
    --lumi-visual-schedule-print-card-size: 65mm;
}

.lumi-visual-schedule-print-page--a3.lumi-visual-schedule-print-page--count-6 {
    --lumi-visual-schedule-preview-card-size: 52.3mm;
    --lumi-visual-schedule-print-card-size: 52.3mm;
}

.lumi-visual-schedule-print-page--a3.lumi-visual-schedule-print-page--count-7 {
    --lumi-visual-schedule-preview-card-size: 43.8mm;
    --lumi-visual-schedule-print-card-size: 43.8mm;
}

.lumi-visual-schedule-print-page--a3.lumi-visual-schedule-print-page--landscape .lumi-visual-schedule-print-page__body {
    gap: 5.7mm;
}

.lumi-visual-schedule-print-page--a3.lumi-visual-schedule-print-page--landscape .lumi-visual-schedule-print-page__track {
    gap: 2.8mm;
}

.lumi-visual-schedule-print-page--a3.lumi-visual-schedule-print-page--landscape .lumi-visual-schedule-print-page__track--times {
    grid-template-rows: 19.8mm;
    padding: 0 5.7mm;
}

.lumi-visual-schedule-print-page--a3.lumi-visual-schedule-print-page--landscape .lumi-visual-schedule-print-page__track--checks {
    grid-template-rows: 45.2mm;
}

.lumi-visual-schedule-print-page--a3.lumi-visual-schedule-print-page--landscape .lumi-visual-schedule-print-page__time-chip {
    height: 19.8mm;
}

.lumi-visual-schedule-print-page--a3.lumi-visual-schedule-print-page--landscape.lumi-visual-schedule-print-page--count-1 {
    --lumi-visual-schedule-preview-card-size: 84.8mm;
    --lumi-visual-schedule-preview-track-width: 96.2mm;
    --lumi-visual-schedule-print-card-size: 84.8mm;
    --lumi-visual-schedule-print-track-width: 96.2mm;
}

.lumi-visual-schedule-print-page--a3.lumi-visual-schedule-print-page--landscape.lumi-visual-schedule-print-page--count-2 {
    --lumi-visual-schedule-preview-card-size: 84.8mm;
    --lumi-visual-schedule-preview-track-width: 183.8mm;
    --lumi-visual-schedule-print-card-size: 84.8mm;
    --lumi-visual-schedule-print-track-width: 183.8mm;
}

.lumi-visual-schedule-print-page--a3.lumi-visual-schedule-print-page--landscape.lumi-visual-schedule-print-page--count-3 {
    --lumi-visual-schedule-preview-card-size: 82mm;
    --lumi-visual-schedule-preview-track-width: 263mm;
    --lumi-visual-schedule-print-card-size: 82mm;
    --lumi-visual-schedule-print-track-width: 263mm;
}

.lumi-visual-schedule-print-page--a3.lumi-visual-schedule-print-page--landscape.lumi-visual-schedule-print-page--count-4 {
    --lumi-visual-schedule-preview-card-size: 73.5mm;
    --lumi-visual-schedule-preview-track-width: 313.9mm;
    --lumi-visual-schedule-print-card-size: 73.5mm;
    --lumi-visual-schedule-print-track-width: 313.9mm;
}

.lumi-visual-schedule-print-page--a3.lumi-visual-schedule-print-page--landscape.lumi-visual-schedule-print-page--count-5 {
    --lumi-visual-schedule-preview-card-size: 63.6mm;
    --lumi-visual-schedule-preview-track-width: 340.8mm;
    --lumi-visual-schedule-print-card-size: 63.6mm;
    --lumi-visual-schedule-print-track-width: 340.8mm;
}

.lumi-visual-schedule-print-page--a3.lumi-visual-schedule-print-page--landscape.lumi-visual-schedule-print-page--count-6 {
    --lumi-visual-schedule-preview-card-size: 53.7mm;
    --lumi-visual-schedule-preview-track-width: 347.8mm;
    --lumi-visual-schedule-print-card-size: 53.7mm;
    --lumi-visual-schedule-print-track-width: 347.8mm;
}

.lumi-visual-schedule-print-page--a3.lumi-visual-schedule-print-page--landscape.lumi-visual-schedule-print-page--count-7 {
    --lumi-visual-schedule-preview-card-size: 46.7mm;
    --lumi-visual-schedule-preview-track-width: 354.9mm;
    --lumi-visual-schedule-print-card-size: 46.7mm;
    --lumi-visual-schedule-print-track-width: 354.9mm;
}


/* Saved visual source */
.lumi-media-slot-library-modal__tabs {
    display: flex;
    gap: 0;
    width: min(100%, 420px);
    box-sizing: border-box;
    margin: 0 0 22px;
    overflow: hidden;
    border: 1px solid #4E52D8;
    border-radius: 6px;
}

button.lumi-media-slot-library-modal__tab,
.lumi-media-slot-library-modal__tab {
    display: inline-flex !important;
    flex: 1 1 0;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 52px;
    padding: 0 20px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #FFFFFF !important;
    box-shadow: none !important;
    color: #4E52D8 !important;
    font: inherit;
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1.2;
    cursor: pointer;
}

.lumi-media-slot-library-modal__tab-icon {
    display: block;
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
    background: currentColor;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    mask-size: contain;
}

.lumi-media-slot-library-modal__tab-icon--library {
    -webkit-mask-image: url('../icons/media-slot-library.svg');
    mask-image: url('../icons/media-slot-library.svg');
}

.lumi-media-slot-library-modal__tab-icon--saved {
    -webkit-mask-image: url('../icons/profile/heart.svg');
    mask-image: url('../icons/profile/heart.svg');
}

button.lumi-media-slot-library-modal__tab.is-active,
.lumi-media-slot-library-modal__tab.is-active {
    border-radius: 6px !important;
    background: #4E52D8 !important;
    color: #FFFFFF !important;
}

[data-lumi-library-mode="saved"]
    .lumi-media-slot-library-modal__results {
    grid-template-columns: repeat(auto-fill, 220px);
}

[data-lumi-library-mode="saved"]
    .lumi-media-slot-library-result {
    box-sizing: border-box !important;
    min-height: 0 !important;
    aspect-ratio: 1 / 1;
}

[data-lumi-library-mode="saved"]
    .lumi-media-slot-library-result__image {
    height: 100% !important;
    aspect-ratio: auto !important;
}

.lumi-my-materials__thumbnail--weekly {
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 4px;
}

.lumi-my-materials__weekly-thumbnail-day {
    display: grid;
    grid-template-rows: repeat(5, minmax(0, 1fr));
    min-width: 0;
    gap: 3px;
    padding: 3px;
    border-radius: 5px;
    box-sizing: border-box;
}

.lumi-my-materials__weekly-thumbnail-day:nth-child(1) {
    background: #FBE9ED;
}

.lumi-my-materials__weekly-thumbnail-day:nth-child(2) {
    background: #FDECDD;
}

.lumi-my-materials__weekly-thumbnail-day:nth-child(3) {
    background: #FFF3D7;
}

.lumi-my-materials__weekly-thumbnail-day:nth-child(4) {
    background: #E9F3DD;
}

.lumi-my-materials__weekly-thumbnail-day:nth-child(5) {
    background: #E2F3F8;
}

.lumi-my-materials__weekly-thumbnail-day:nth-child(6) {
    background: #E5EEF9;
}

.lumi-my-materials__weekly-thumbnail-day:nth-child(7) {
    background: #ECE6FA;
}

.lumi-my-materials__weekly-thumbnail-slot {
    display: grid;
    min-width: 0;
    min-height: 0;
    place-items: center;
    overflow: hidden;
    border-radius: 3px;
    background: #FFFFFF;
}

.lumi-my-materials__weekly-thumbnail-slot img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.lumi-saved-weekly-schedule-preview {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    width: min(100%, 1100px);
    min-width: 680px;
    aspect-ratio: 297 / 210;
    min-height: 480px;
    padding: 32px;
    box-sizing: border-box;
    background: #FFFFFF;
    box-shadow: 0 8px 28px rgba(23, 23, 47, 0.12);
}

.lumi-saved-weekly-schedule-preview__title {
    margin: 0 0 22px;
    color: #4E52D8 !important;
    font-size: 30px !important;
    font-weight: 600;
    line-height: 1.1;
    text-align: center;
}

.lumi-saved-weekly-schedule-preview__days {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    min-height: 0;
    gap: 12px;
}

.lumi-saved-weekly-schedule-preview__day {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    min-width: 0;
    gap: 8px;
    padding: 10px;
    border-radius: 10px;
    box-sizing: border-box;
}

.lumi-saved-weekly-schedule-preview__day:nth-child(1) {
    background: #FBE9ED;
}

.lumi-saved-weekly-schedule-preview__day:nth-child(2) {
    background: #FDECDD;
}

.lumi-saved-weekly-schedule-preview__day:nth-child(3) {
    background: #FFF3D7;
}

.lumi-saved-weekly-schedule-preview__day:nth-child(4) {
    background: #E9F3DD;
}

.lumi-saved-weekly-schedule-preview__day:nth-child(5) {
    background: #E2F3F8;
}

.lumi-saved-weekly-schedule-preview__day:nth-child(6) {
    background: #E5EEF9;
}

.lumi-saved-weekly-schedule-preview__day:nth-child(7) {
    background: #ECE6FA;
}

.lumi-saved-weekly-schedule-preview__day-title {
    margin: 0;
    overflow: hidden;
    font-size: 14px !important;
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lumi-saved-weekly-schedule-preview__day:nth-child(1)
    .lumi-saved-weekly-schedule-preview__day-title {
    color: #B44E69 !important;
}

.lumi-saved-weekly-schedule-preview__day:nth-child(2)
    .lumi-saved-weekly-schedule-preview__day-title {
    color: #B96F2B !important;
}

.lumi-saved-weekly-schedule-preview__day:nth-child(3)
    .lumi-saved-weekly-schedule-preview__day-title {
    color: #A67A10 !important;
}

.lumi-saved-weekly-schedule-preview__day:nth-child(4)
    .lumi-saved-weekly-schedule-preview__day-title {
    color: #65883B !important;
}

.lumi-saved-weekly-schedule-preview__day:nth-child(5)
    .lumi-saved-weekly-schedule-preview__day-title {
    color: #327E9B !important;
}

.lumi-saved-weekly-schedule-preview__day:nth-child(6)
    .lumi-saved-weekly-schedule-preview__day-title {
    color: #4E70A4 !important;
}

.lumi-saved-weekly-schedule-preview__day:nth-child(7)
    .lumi-saved-weekly-schedule-preview__day-title {
    color: #8060A5 !important;
}

.lumi-saved-weekly-schedule-preview__activities {
    display: grid;
    grid-template-rows: repeat(5, minmax(0, 1fr));
    min-height: 0;
    gap: 8px;
}

.lumi-saved-weekly-schedule-preview__slot {
    display: grid;
    min-width: 0;
    min-height: 0;
    place-items: center;
    overflow: hidden;
    border-radius: 6px;
    background: #FFFFFF;
}

.lumi-saved-weekly-schedule-preview__slot img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

/* Weekly Schedule: live single-page preview in the shared Pages panel. */
.lumi-visual-schedule-weekly-preview-paper {
    display: grid;
    width: 297mm;
    height: 210mm;
    grid-template-rows: auto minmax(0, 1fr);
    gap: 6mm;
    margin: 0;
    padding: 12mm;
    overflow: hidden;
    box-sizing: border-box;
    background: #FFFFFF;
}

.lumi-visual-schedule-weekly-preview-paper--a3 {
    width: 420mm;
    height: 297mm;
}

.lumi-visual-schedule-weekly-preview-paper--letter {
    width: 279.4mm;
    height: 215.9mm;
}

.lumi-visual-schedule-weekly-preview-paper__title {
    margin: 0;
    color: #4E52D8;
    font-size: 8mm;
    font-weight: 600;
    line-height: 1.1;
    text-align: center;
}

.lumi-visual-schedule-weekly-preview-paper__days {
    display: grid;
    min-height: 0;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 3mm;
}

.lumi-visual-schedule-weekly-preview-paper__day {
    display: grid;
    min-width: 0;
    min-height: 0;
    grid-template-rows: auto minmax(0, 1fr);
    gap: 3mm;
    padding: 3mm;
    border-radius: 4mm;
    box-sizing: border-box;
}

.lumi-visual-schedule-weekly-preview-paper__day:nth-child(1) {
    background: #FCE6EB;
}

.lumi-visual-schedule-weekly-preview-paper__day:nth-child(2) {
    background: #FDEEDC;
}

.lumi-visual-schedule-weekly-preview-paper__day:nth-child(3) {
    background: #FFF6D8;
}

.lumi-visual-schedule-weekly-preview-paper__day:nth-child(4) {
    background: #EEF7E3;
}

.lumi-visual-schedule-weekly-preview-paper__day:nth-child(5) {
    background: #E6F6FB;
}

.lumi-visual-schedule-weekly-preview-paper__day:nth-child(6) {
    background: #EAF0FA;
}

.lumi-visual-schedule-weekly-preview-paper__day:nth-child(7) {
    background: #F0E8FB;
}

.lumi-visual-schedule-weekly-preview-paper__day-title {
    margin: 0;
    overflow: hidden;
    font-size: 4.4mm;
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lumi-visual-schedule-weekly-preview-paper__day:nth-child(1)
    .lumi-visual-schedule-weekly-preview-paper__day-title {
    color: #B44E69;
}

.lumi-visual-schedule-weekly-preview-paper__day:nth-child(2)
    .lumi-visual-schedule-weekly-preview-paper__day-title {
    color: #B96F2B;
}

.lumi-visual-schedule-weekly-preview-paper__day:nth-child(3)
    .lumi-visual-schedule-weekly-preview-paper__day-title {
    color: #A67A10;
}

.lumi-visual-schedule-weekly-preview-paper__day:nth-child(4)
    .lumi-visual-schedule-weekly-preview-paper__day-title {
    color: #65883B;
}

.lumi-visual-schedule-weekly-preview-paper__day:nth-child(5)
    .lumi-visual-schedule-weekly-preview-paper__day-title {
    color: #327E9B;
}

.lumi-visual-schedule-weekly-preview-paper__day:nth-child(6)
    .lumi-visual-schedule-weekly-preview-paper__day-title {
    color: #4E70A4;
}

.lumi-visual-schedule-weekly-preview-paper__day:nth-child(7)
    .lumi-visual-schedule-weekly-preview-paper__day-title {
    color: #8060A5;
}

.lumi-visual-schedule-weekly-preview-paper__activities {
    display: grid;
    min-height: 0;
    grid-template-rows: repeat(5, minmax(0, 1fr));
    gap: 3mm;
}

.lumi-visual-schedule-weekly-preview-paper__slot {
    display: grid;
    position: relative;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    border-radius: 3mm;
    place-items: center;
    background: #FFFFFF;
}

.lumi-visual-schedule-weekly-preview-paper__slot img {
    display: block;
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

@media print {
    .lumi-visual-schedule-print-modal.is-exporting
        .lumi-visual-schedule-weekly-preview-paper {
        display: grid !important;
        width: 297mm !important;
        height: 210mm !important;
        margin: 0 !important;
        page: lumi-visual-schedule-a4-landscape;
        break-after: auto;
    }

    .lumi-visual-schedule-print-modal.is-exporting
        .lumi-visual-schedule-weekly-preview-paper--a3 {
        width: 420mm !important;
        height: 297mm !important;
        page: lumi-visual-schedule-a3-landscape;
    }

    .lumi-visual-schedule-print-modal.is-exporting
        .lumi-visual-schedule-weekly-preview-paper--letter {
        width: 279.4mm !important;
        height: 215.9mm !important;
        page: lumi-visual-schedule-letter-landscape;
    }
}

/* Social Story workspace */
.lumi-social-story {
    width: min(100%, 1040px);
    padding-bottom: 48px;
}

.lumi-social-story__title-field {
    display: flex;
    flex-direction: column;
    gap: 8px;
    max-width: 620px;
    margin-bottom: 24px;
}

.lumi-social-story__title-control {
    position: relative;
    width: 100%;
}

.lumi-social-story__title-icon {
    position: absolute;
    top: 50%;
    right: 24px;
    transform: translateY(-50%);
    color: #A7A9B6;
    font-family: Georgia, serif;
    font-size: 34px;
    font-weight: 400;
    line-height: 1;
    pointer-events: none;
}

.lumi-social-story__title-field > label,
.lumi-social-story__text-field > span {
    color: #17172F;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.3;
}

.lumi-social-story__title-field input,
.lumi-social-story__text-field textarea {
    width: 100%;
    box-sizing: border-box;
    border: 1px solid #B6B9E5;
    border-radius: 6px;
    background: #FFFFFF;
    color: #111111;
    font: inherit;
}

.lumi-social-story__title-control input {
    height: 70px;
    padding: 0 72px 0 24px;
    font-size: 28px;
    font-weight: 400;
}

.lumi-social-story__title-control input {
    width: 100% !important;
    border: 1px solid #B6B9E5 !important;
    background: #FFFFFF !important;
    color: #111111 !important;
}

.lumi-social-story__title-control input::placeholder {
    color: #A7A9B6 !important;
    opacity: 1 !important;
}

.lumi-social-story__cards {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.lumi-social-story__card.is-dragging {
    border-color: #4E52D8;
    box-shadow: 0 10px 24px rgba(78, 82, 216, 0.16);
    opacity: 0.72;
}

.lumi-social-story__card.is-dragging
    .lumi-social-story__card-handle {
    cursor: grabbing;
}

button.lumi-social-story__add-card {
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100% !important;
    min-height: 110px !important;
    margin-top: 20px;
    padding: 0 !important;
    border: 1px dashed #B8BAFF !important;
    border-radius: 6px !important;
    background: #FBFBFF !important;
    color: #4E52D8 !important;
    box-shadow: none !important;
    font: inherit;
    cursor: pointer;
}

.lumi-social-story__add-card-main {
    display: flex;
    align-items: center;
    gap: 16px;
    font-size: 22px;
    font-weight: 600;
}

.lumi-social-story__add-card-icon {
    position: relative;
    width: 28px;
    height: 28px;
    border: 2px solid currentColor;
    border-radius: 50%;
}

.lumi-social-story__add-card-icon::before,
.lumi-social-story__add-card-icon::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    background: currentColor;
    transform: translate(-50%, -50%);
}

.lumi-social-story__add-card-icon::before {
    width: 10px;
    height: 2px;
}

.lumi-social-story__add-card-icon::after {
    width: 2px;
    height: 10px;
}

.lumi-social-story__add-card small {
    color: #8A8D99;
    font-size: 14px;
    font-weight: 400;
}

button.lumi-social-story__add-card:disabled {
    cursor: not-allowed;
    opacity: .35;
}

.lumi-social-story__card {
    position: relative;
    display: grid;
    grid-template-columns: 64px 96px minmax(0, 1fr);
    min-height: 300px;
    overflow: hidden;
    border: 1px solid #B6B9E5;
    border-radius: 12px;
    background: #FFFFFF;
}


.lumi-social-story__card-delete {
    position: absolute;
    top: 10px;
    right: 10px;
    display: grid !important;
    width: 28px !important;
    height: 28px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 4px !important;
    place-items: center;
    background: transparent !important;
    box-shadow: none !important;
    color: #5F5F6D !important;
    cursor: pointer;
}

.lumi-social-story__card-delete img {
    display: block;
    width: 15px;
    height: 16px;
}

.lumi-social-story__card-delete:disabled {
    cursor: not-allowed;
    opacity: .35;
}

.lumi-social-story__card-meta {
    display: contents;
}

button.lumi-social-story__card-handle {
    display: grid;
    grid-template-columns: repeat(2, 4px);
    align-content: center;
    justify-content: center;
    gap: 4px;
    width: 64px;
    min-width: 64px;
    min-height: 300px;
    padding: 0;
    border: 0 !important;
    border-right: 1px solid #B6B9E5 !important;
    border-radius: 0;
    background: transparent !important;
    box-shadow: none !important;
    outline: none !important;
    cursor: grab;
    touch-action: none;
    user-select: none;
}

button.lumi-social-story__card-handle:hover,
button.lumi-social-story__card-handle:focus,
button.lumi-social-story__card-handle:active {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    outline: none !important;
    opacity: 1 !important;
}

.lumi-social-story__card-handle i {
    display: block;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #D8D9FF;
}

input.lumi-social-story__card-number {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-width: 0;
    padding: 0 12px;
    border: 0 !important;
    border-right: 1px solid #B6B9E5 !important;
    border-radius: 0 !important;
    outline: 0 !important;
    background: #FFFFFF !important;
    box-shadow: none !important;
    color: #17172F !important;
    font-family: inherit;
    font-size: 24px;
    font-weight: 500;
    text-align: center;
    cursor: text;
}

input.lumi-social-story__card-number:hover {
    background: #F5F5FF !important;
}

input.lumi-social-story__card-number:focus {
    background: #F5F5FF !important;
    box-shadow: inset 0 0 0 2px #4E52D8 !important;
}

.lumi-social-story__card-number-cursor {
    position: absolute;
    top: calc(50% - 14px);
    left: 124px;
    width: 2px;
    height: 28px;
    background: #4E52D8;
    animation: lumi-social-story-cursor-blink 1s steps(1, end) infinite;
    pointer-events: none;
}

.lumi-social-story__card:not(:first-child)
    .lumi-social-story__card-number-cursor,
.lumi-social-story__card.is-number-edited
    .lumi-social-story__card-number-cursor {
    display: none;
}

@keyframes lumi-social-story-cursor-blink {
    50% {
        opacity: 0;
    }
}

.lumi-social-story__card-content {
    display: grid;
    grid-template-columns: 250px minmax(0, 1fr);
    align-items: center;
    gap: 32px;
    padding: 20px 32px;
}

.lumi-social-story__media-grid {
    grid-template-columns: repeat(auto-fill, minmax(220px, 250px));
    gap: 0;
    padding: 0;
}

.lumi-social-story__media-grid .lumi-media-slot,
.lumi-social-story__media-grid .lumi-media-slot--filled {
    min-height: 250px;
    border-radius: 12px !important;
}

.lumi-social-story__media-grid .lumi-media-slot--filled {
    aspect-ratio: auto !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    overflow: hidden !important;
    border: 1px solid #E6E6EB !important;
    background: #FFFFFF !important;
}

.lumi-social-story__text-field {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.lumi-social-story__text-field textarea {
    min-height: 180px;
    padding: 18px;
    resize: vertical;
    font-size: 20px;
    line-height: 1.45;
}

@media (max-width: 860px) {
    .lumi-social-story__card-content {
        grid-template-columns: 1fr;
    }

    .lumi-social-story__media-grid {
        width: 250px;
        max-width: 100%;
    }
}


/* Social Story printable-page thumbnail. */
.lumi-pages-preview__page-frame--social-story {
    overflow: hidden;
}

.lumi-pages-preview__panel [data-lumi-social-story-panel-preview] {
    width: 100%;
    min-height: 0;
    aspect-ratio: 210 / 297;
    padding: 20px;
    overflow: hidden;
    box-sizing: border-box;
}

.lumi-pages-preview__panel
    [data-lumi-social-story-panel-preview].lumi-social-story-preview-page--letter {
    aspect-ratio: 215.9 / 279.4;
}

.lumi-pages-preview__panel
    [data-lumi-social-story-panel-preview].lumi-social-story-preview-page--landscape {
    aspect-ratio: 297 / 210;
}

.lumi-social-story-preview__title {
    margin: 4px 32px 18px;
    overflow: hidden;
    color: #4e52d8;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.25;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lumi-social-story-preview-page--landscape
    .lumi-social-story-preview__title {
    margin-top: -12px;
    margin-bottom: 8px;
}

.lumi-social-story-preview__grid {
    display: grid;
    grid-template-columns: repeat(
        var(--lumi-social-story-columns, 3),
        var(--lumi-social-story-card-size, minmax(0, 1fr))
    );
    justify-content: center;
    gap: var(--lumi-social-story-gap, 12px);
}

.lumi-social-story-preview__grid.is-single-card {
    display: flex;
    min-height: 0;
    flex: 1 1 auto;
    align-items: center;
    justify-content: center;
}

.lumi-social-story-preview-page.has-single-card {
    position: relative;
}

.lumi-social-story-preview__grid.is-single-card
    .lumi-social-story-preview__cell {
    width: var(--lumi-social-story-card-size, 45%);
    flex: 0 0 auto;
}

.lumi-social-story-preview-page.has-single-card
    .lumi-social-story-preview__grid.is-single-card {
    position: absolute;
    top: 20px;
    right: 20px;
    bottom: 20px;
    left: 20px;
}

.lumi-social-story-preview-page.has-single-card.has-title
    .lumi-social-story-preview__grid.is-single-card {
    top: 80px;
}

.lumi-social-story-preview-page--landscape.has-single-card.has-title
    .lumi-social-story-preview__grid.is-single-card {
    top: 52px;
}

.lumi-social-story-preview__cell {
    position: relative;
    display: flex;
    min-width: 0;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    container-type: inline-size;
    background: transparent;
}

.lumi-social-story-preview__image-frame {
    position: relative;
    display: flex;
    width: 100%;
    aspect-ratio: 1;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border: 4px solid #dfe0ff;
    border-radius: 6px;
    background: #ffffff;
}

.lumi-social-story-preview__image-frame img {
    width: 100%;
    min-height: 0;
    flex: 1 1 auto;
    object-fit: contain;
}

.lumi-social-story-preview__card-number {
    position: absolute;
    z-index: 1;
    top: 5cqw;
    left: 7cqw;
    background: transparent;
    color: #4e52d8;
    font-size: 10cqw;
    line-height: 1;
    font-weight: 700;
}

.lumi-social-story-preview__card-text {
    display: -webkit-box;
    width: 100%;
    margin: 0;
    padding: 0 2px;
    overflow: hidden;
    box-sizing: border-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    color: #17172f;
    font-size: 5cqw;
    line-height: 1.2;
    text-align: center;
    text-overflow: ellipsis;
}

.lumi-social-story-print-frame {
    position: fixed;
    width: 1px;
    height: 1px;
    border: 0;
    opacity: 0;
    pointer-events: none;
}

/* Saved Social Story preview in My Materials. */
.lumi-saved-social-story-preview-page {
    width: 420px;
    max-width: 100%;
    margin: 0 auto;
    aspect-ratio: 210 / 297;
    box-sizing: border-box;
    padding: 40px;
    background: #ffffff;
    overflow: hidden;
    box-shadow: 0 8px 28px rgba(23, 23, 47, 0.12);
}

.lumi-saved-social-story-preview-page--letter {
    aspect-ratio: 215.9 / 279.4;
}

.lumi-saved-social-story-preview__title {
    margin: 0 40px 28px;
    color: #4e52d8;
    font-size: 24px;
    font-weight: 600;
    line-height: 1.25;
    text-align: center;
}

.lumi-saved-social-story-preview__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
}

.lumi-saved-social-story-preview-page
    .lumi-social-story-preview__card-number {
    top: 5cqw;
    left: 7cqw;
    font-size: 10cqw;
}

.lumi-saved-social-story-preview-page
    .lumi-social-story-preview__card-text {
    font-size: 5cqw;
    line-height: 1.2;
}

/* First Then */

.lumi-first-then__steps {
    width: 100%;
}

.lumi-first-then__step {
    display: grid;
    grid-template-columns: 64px 96px minmax(0, 1fr);
    align-items: stretch;
    width: 100%;
    max-width: 1000px;
    min-height: 300px;
    overflow: hidden;
    border: 1px solid #B6B9E5;
    border-radius: 12px;
    background: #FFFFFF;
}

.lumi-first-then__handle {
    display: flex;
    width: 64px;
    min-width: 64px;
    min-height: 300px;
    align-items: center;
    justify-content: center;
    border-right: 1px solid #B6B9E5;
}

.lumi-first-then__step-number {
    display: flex;
    min-height: 300px;
    align-items: center;
    justify-content: center;
    border-right: 1px solid #B6B9E5;
    color: #111111;
    font-size: 24px;
    font-weight: 500;
    text-align: center;
}

.lumi-first-then__content {
    display: flex;
    align-items: center;
    gap: 32px;
    min-width: 0;
    padding: 20px 32px;
}

.lumi-first-then__media {
    flex: 0 0 250px;
    width: 250px;
}

.lumi-first-then__fields {
    display: flex;
    flex: 0 0 320px;
    min-width: 0;
    flex-direction: column;
    gap: 16px;
}

.lumi-first-then__label-control {
    position: relative;
}

.lumi-first-then__label-control input,
.lumi-first-then__fields > input {
    width: 100%;
    height: 56px;
    box-sizing: border-box;
    border: 1px solid #B6B9E5 !important;
    border-radius: 6px;
    background: #FFFFFF;
    padding: 0 48px 0 18px;
    color: #111111;
    font: inherit;
}

.lumi-first-then__fields > input {
    padding-right: 18px;
}

.lumi-first-then__label-icon {
    position: absolute;
    top: 50%;
    right: 24px;
    transform: translateY(-50%);
    color: #A7A9B6;
    font-family: Georgia, serif;
    font-size: 34px;
    font-weight: 400;
    line-height: 1;
    pointer-events: none;
}


button.lumi-first-then__color-control {
    display: inline-flex !important;
    width: auto !important;
    min-width: 0 !important;
    height: 30px !important;
    min-height: 0 !important;
    align-items: center;
    align-self: flex-start;
    padding: 0 !important;
    overflow: hidden;
    border: 1px solid #B6B9E5 !important;
    border-radius: 6px !important;
    background: #FFFFFF !important;
    color: #17172F !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    cursor: pointer;
}

button.lumi-first-then__color-control .lumi-first-then__color-swatch {
    display: block;
    flex: 0 0 36px;
    width: 36px;
    height: 100%;
    border-right: 1px solid #B6B9E5;
    background: #E5E7FF;
}

button.lumi-first-then__color-control > span:last-child {
    padding: 0 12px;
}

.lumi-first-then__color-picker {
    position: relative;
    display: inline-flex;
    align-self: flex-start;
}

.lumi-first-then__color-picker > input[type="color"] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    opacity: 0;
    cursor: pointer;
}

button.lumi-first-then__color-reset {
    display: inline-flex !important;
    width: auto !important;
    min-width: 0 !important;
    height: 30px !important;
    min-height: 30px !important;
    align-items: center;
    align-self: flex-start;
    padding: 0 10px !important;
    border: 0 !important;
    background: transparent !important;
    color: #6F7285 !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    box-shadow: none !important;
    cursor: pointer;
}

button.lumi-first-then__color-reset:hover,
button.lumi-first-then__color-reset:focus {
    background: transparent !important;
    color: #4E52D8 !important;
}

.lumi-first-then__color-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    align-self: flex-start;
}

.lumi-first-then__steps {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.lumi-first-then__hide-step {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    align-self: flex-start;
    cursor: pointer;
}

.lumi-first-then__hide-step input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
}

.lumi-first-then__switch {
    position: relative;
    display: inline-block;
    width: 32px;
    height: 18px;
    flex: 0 0 32px;
    border-radius: 999px;
    background: #CFCFDB;
    transition: background 150ms ease;
}

.lumi-first-then__switch::after {
    content: "";
    position: absolute;
    top: 3px;
    left: 3px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #FFFFFF;
    transition: transform 150ms ease;
}

.lumi-first-then__hide-step input:checked + .lumi-first-then__switch {
    background: #4E52D8;
}

.lumi-first-then__hide-step input:checked + .lumi-first-then__switch::after {
    transform: translateX(14px);
}

.lumi-first-then__hide-step input:focus-visible + .lumi-first-then__switch {
    outline: 2px solid #4E52D8;
    outline-offset: 2px;
}

.lumi-first-then__step.is-disabled {
    opacity: 0.45;
}

/* First Then — Pages preview (frame stays centered flex; number/trash keep their absolute badge positions). */

.lumi-pages-preview__page-frame--first-then {
    display: flex;
    align-items: center;
    justify-content: center;
}

.lumi-pages-preview__page-frame--first-then .lumi-pages-preview__page-number {
    position: absolute;
    top: 10px;
    left: 10px;
}

.lumi-pages-preview__page-frame--first-then button.lumi-pages-preview__delete-page {
    position: absolute;
    top: 10px;
    right: 10px;
}

.lumi-first-then-preview {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    width: 86%;
    overflow: hidden;
    border-radius: 6px;
}

.lumi-first-then-preview__step {
    display: flex;
    min-width: 0;
    min-height: 105px;
    flex-direction: column;
    padding: 10px;
}

.lumi-first-then-preview__heading {
    margin-bottom: 8px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1;
}

.lumi-first-then-preview__card {
    display: flex;
    flex: 1;
    min-height: 70px;
    align-items: flex-end;
    justify-content: center;
    padding: 6px;
    border-radius: 5px;
    background: #FFFFFF;
    font-size: 9px;
    line-height: 1.2;
    text-align: center;
}

.lumi-first-then .lumi-media-slot__image {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
}

.lumi-first-then__media .lumi-media-slot--filled {
    aspect-ratio: auto !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    overflow: hidden !important;
}

.lumi-first-then-preview__heading {
    display: flex;
    align-items: center;
    gap: 8px;
}

.lumi-first-then-preview__heading-number {
    display: inline-flex;
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #4E52D8;
    color: var(--preview-number-color);
    font-size: 11px;
    font-weight: 600;
    line-height: 1;
}

.lumi-first-then-preview__heading-label {
    font-size: 16px;
    font-weight: 600;
    line-height: 1;
}

.lumi-pages-preview__page-frame--first-then {
    width: 100%;
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: 297 / 210;
}

.lumi-pages-preview__page-frame--first-then .lumi-first-then-preview {
    width: 88%;
    min-height: 56%;
    margin-top: 7%;
}

.lumi-pages-preview__page-frame--first-then .lumi-first-then-preview__step {
    min-height: 170px;
    padding: 14px;
}

.lumi-pages-preview__page-frame--first-then .lumi-first-then-preview__card {
    min-height: 120px;
}

.lumi-pages-preview__page-frame--first-then .lumi-first-then-preview {
    margin-top: 15%;
}

.lumi-pages-preview__page-frame--first-then .lumi-first-then-preview__step {
    min-height: 0;
}

.lumi-pages-preview__page-frame--first-then .lumi-first-then-preview__card {
    min-height: 0;
    aspect-ratio: 1 / 1;
}

.lumi-pages-preview__page-frame--first-then .lumi-first-then-preview {
    margin-top: 11%;
}

.lumi-pages-preview__page-frame--first-then .lumi-first-then-preview__heading-label {
    font-size: 13px;
}

.lumi-pages-preview__page-frame--first-then .lumi-first-then-preview__heading-number {
    width: 16px;
    height: 16px;
    flex-basis: 16px;
    font-size: 9px;
}

.lumi-pages-preview__page-frame--first-then .lumi-first-then-preview__heading-label {
    text-transform: uppercase;
}

.lumi-pages-preview__page-frame--first-then .lumi-first-then-preview__card {
    width: 115%;
    max-width: none;
}

.lumi-pages-preview__page-frame--first-then .lumi-first-then-preview__heading-label {
    font-size: 11px;
}

.lumi-pages-preview__page-frame--first-then .lumi-first-then-preview__heading-number {
    width: 14px;
    height: 14px;
    flex-basis: 14px;
    font-size: 8px;
}

/* First Then preview — three equal sections */

.lumi-pages-preview__page-frame--first-then .lumi-first-then-preview {
    width: 92%;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 9%;
}

.lumi-pages-preview__page-frame--first-then .lumi-first-then-preview__step {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    padding: 12px 10px 14px;
    align-items: stretch;
}

.lumi-pages-preview__page-frame--first-then .lumi-first-then-preview__heading {
    width: 100%;
    gap: 5px;
    margin-bottom: 8px;
}

.lumi-pages-preview__page-frame--first-then .lumi-first-then-preview__card {
    width: 100%;
    max-width: none;
    aspect-ratio: 1 / 1;
    box-sizing: border-box;
}

.lumi-pages-preview__page-frame--first-then .lumi-first-then-preview__image {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

/* First Then preview — individual section colors */

.lumi-pages-preview__page-frame--first-then
.lumi-first-then-preview__step:nth-child(1) {
    background: #E5E7FF;
}

.lumi-pages-preview__page-frame--first-then
.lumi-first-then-preview__step:nth-child(2) {
    background: #DCE5FF;
}

.lumi-pages-preview__page-frame--first-then
.lumi-first-then-preview__step:nth-child(3) {
    background: #F6DDF8;
}

/* Rounded corners belong to the outer edges only */

.lumi-pages-preview__page-frame--first-then
.lumi-first-then-preview__step:first-child {
    border-radius: 6px 0 0 6px;
}

.lumi-pages-preview__page-frame--first-then
.lumi-first-then-preview__step:last-child {
    border-radius: 0 6px 6px 0;
}

/* First Then preview — centered compact headings */

.lumi-pages-preview__page-frame--first-then
.lumi-first-then-preview__heading {
    justify-content: center;
    gap: 4px;
    margin-bottom: 7px;
}

.lumi-pages-preview__page-frame--first-then
.lumi-first-then-preview__heading-label {
    font-size: 10px;
    font-weight: 600;
}

.lumi-pages-preview__page-frame--first-then
.lumi-first-then-preview__heading-number {
    width: 13px;
    height: 13px;
    flex-basis: 13px;
    font-size: 7px;
}

.lumi-first-then-preview__heading-label {
    color: var(--preview-text-color);
}

.lumi-pages-preview__page-frame--first-then
.lumi-first-then-preview__heading-number {
    background-color: var(--preview-text-color);
    color: var(--preview-number-color);
}


.lumi-first-then-preview:has(.lumi-first-then-preview__step:nth-child(2):last-child) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 60%;
    margin-left: auto;
    margin-right: auto;
}

.lumi-pages-preview__page-frame--first-then .lumi-first-then-preview__card {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    overflow: hidden;
}

.lumi-pages-preview__page-frame--first-then .lumi-first-then-preview__image {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.lumi-pages-preview__page-frame--first-then .lumi-first-then-preview__card.has-text {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
}

.lumi-pages-preview__page-frame--first-then .lumi-first-then-preview__card.has-text .lumi-first-then-preview__image {
    width: 75%;
    height: 75%;
}

.lumi-pages-preview__page-frame--first-then .lumi-first-then-preview__text {
    flex-shrink: 0;
    margin-top: 4px;
}

/* First Then — A4 landscape print layout */
@media print {
    @page {
        size: A4 landscape;
        margin: 0;
    }

    html,
    body {
        margin: 0 !important;
        padding: 0 !important;
        background: #FFFFFF !important;
    }

    .lumi-first-then-print-page,
    .lumi-first-then-print-page * {
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }

    .lumi-first-then-print-page {
        display: flex;
        width: 297mm;
        height: 210mm;
        box-sizing: border-box;
        align-items: center;
        justify-content: center;
        padding: 22mm;
        overflow: hidden;
        background: #FFFFFF;
        break-after: page;
        page-break-after: always;
    }

    .lumi-first-then-print-page__content {
        display: grid;
        width: 245mm;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        overflow: hidden;
        border-radius: 6mm;
    }

    .lumi-first-then-print-page__content.is-two-step {
        width: 170mm;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .lumi-first-then-print-page__step {
        display: flex;
        min-width: 0;
        flex-direction: column;
        box-sizing: border-box;
        padding: 8mm;
    }

    .lumi-first-then-print-page__heading {
        display: flex;
        width: 100%;
        align-items: center;
        justify-content: center;
        gap: 3mm;
        margin-bottom: 5mm;
    }

    .lumi-first-then-print-page__number {
        display: inline-flex;
        width: 9mm;
        height: 9mm;
        flex: 0 0 9mm;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        background: var(--preview-text-color);
        color: var(--preview-number-color);
        font-size: 4.5mm;
        font-weight: 600;
        line-height: 1;
    }

    .lumi-first-then-print-page__label {
        min-width: 0;
        color: var(--preview-text-color);
        font-size: 6mm;
        font-weight: 600;
        line-height: 1;
        white-space: nowrap;
    }

    .lumi-first-then-print-page__card {
        display: flex;
        width: 100%;
        aspect-ratio: 1 / 1;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
        box-sizing: border-box;
        overflow: hidden;
        border-radius: 4mm;
        background: #FFFFFF;
    }

    .lumi-first-then-print-page__image {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: contain;
    }

    .lumi-first-then-print-page__card.has-text
    .lumi-first-then-print-page__image {
        width: 78%;
        height: 78%;
    }

    .lumi-first-then-print-page__text {
        flex-shrink: 0;
        margin: 2mm 3mm 3mm;
        color: #17172F;
        font-size: 5mm;
        line-height: 1.2;
        text-align: center;
    }
}
@media print {
    body > .lumi-first-then-print-modal.is-exporting {
        display: block !important;
    }

    .lumi-first-then-print-modal.is-exporting,
    .lumi-first-then-print-modal.is-exporting * {
        visibility: visible !important;
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }

    .lumi-first-then-print-modal.is-exporting {
        position: static !important;
        display: block !important;
        width: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        background: #FFFFFF !important;
    }
}

@media print {
    .lumi-first-then-print-page__label {
        text-transform: uppercase;
    }
}

/* Saved First Then material preview — A4 landscape paper */
[data-lumi-saved-material-preview-pages]
.lumi-saved-first-then-preview-page {
    display: flex;
    width: 594px;
    height: 420px;
    box-sizing: border-box;
    align-items: center;
    justify-content: center;
    padding: 44px;
    overflow: hidden;
    background: #FFFFFF;
    box-shadow: 0 8px 28px rgba(23, 23, 47, 0.12);
}

[data-lumi-saved-material-preview-pages]
.lumi-saved-first-then-preview-page
.lumi-first-then-print-page__content {
    display: grid;
    width: 490px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    overflow: hidden;
    border-radius: 12px;
}

[data-lumi-saved-material-preview-pages]
.lumi-saved-first-then-preview-page
.lumi-first-then-print-page__content.is-two-step {
    width: 340px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

[data-lumi-saved-material-preview-pages]
.lumi-saved-first-then-preview-page
.lumi-first-then-print-page__step {
    display: flex;
    min-width: 0;
    flex-direction: column;
    box-sizing: border-box;
    padding: 16px;
}

[data-lumi-saved-material-preview-pages]
.lumi-saved-first-then-preview-page
.lumi-first-then-print-page__heading {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin-bottom: 10px;
}

[data-lumi-saved-material-preview-pages]
.lumi-saved-first-then-preview-page
.lumi-first-then-print-page__number {
    display: inline-flex;
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--preview-text-color);
    color: var(--preview-number-color);
    font-size: 9px;
    font-weight: 600;
    line-height: 1;
}

[data-lumi-saved-material-preview-pages]
.lumi-saved-first-then-preview-page
.lumi-first-then-print-page__label {
    min-width: 0;
    color: var(--preview-text-color);
    font-size: 12px;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
    text-transform: uppercase;
}

[data-lumi-saved-material-preview-pages]
.lumi-saved-first-then-preview-page
.lumi-first-then-print-page__card {
    display: flex;
    width: 100%;
    aspect-ratio: 1 / 1;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    overflow: hidden;
    border-radius: 8px;
    background: #FFFFFF;
}

[data-lumi-saved-material-preview-pages]
.lumi-saved-first-then-preview-page
.lumi-first-then-print-page__image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

[data-lumi-saved-material-preview-pages]
.lumi-saved-first-then-preview-page
.lumi-first-then-print-page__card.has-text
.lumi-first-then-print-page__image {
    width: 78%;
    height: 78%;
}

[data-lumi-saved-material-preview-pages]
.lumi-saved-first-then-preview-page
.lumi-first-then-print-page__text {
    flex-shrink: 0;
    margin: 4px 6px 6px;
    color: #17172F;
    font-size: 10px;
    line-height: 1.2;
    text-align: center;
}

/* Native Dashboard account and membership cards */
.lumi-native-dashboard__content .pmpro {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    gap: 28px;
    color: #17172f;
}

.lumi-native-dashboard__content .pmpro_section {
    width: 100%;
    max-width: 780px;
    margin: 0 !important;
}

.lumi-native-dashboard__content .pmpro_section_title {
    margin: 0 0 24px;
    color: #17172f;
    font-family: var(--lumi-font-ui);
    font-size: 36px;
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -0.02em;
}

.lumi-native-dashboard__content .pmpro_card {
    overflow: hidden;
    border: 1px solid #E4E4EF;
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 8px 26px rgba(36, 38, 72, 0.08);
}

.lumi-native-dashboard__content .pmpro_card_title {
    margin: 0;
    min-height: 0 !important;
    padding: 42px 52px 18px;
    color: #17172f;
    font-family: var(--lumi-font-ui);
    font-size: 24px;
    font-weight: 700;
    line-height: 1.25;
}

.lumi-native-dashboard__content .pmpro_heading-with-avatar {
    display: flex;
    align-items: center;
    gap: 48px !important;
    column-gap: 48px !important;
}

.lumi-native-dashboard__content .pmpro_heading-with-avatar .avatar {
    width: 100px;
    height: 100px;
    flex: 0 0 100px;
    border: 5px solid #ffffff;
    border-radius: 50%;
    background: #F0F0FF;
    box-shadow: 0 0 0 4px #F0F0FF, 0 8px 20px rgba(78, 82, 216, 0.14);
    object-fit: cover;
}

.lumi-member-avatar-form {
    display: none;
}

.lumi-native-dashboard__content .lumi-member-avatar-button {
    position: relative;
    display: block;
    width: 100px;
    height: 100px;
    flex: 0 0 100px;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    cursor: pointer;
}

.lumi-native-dashboard__content .lumi-member-avatar-button .avatar {
    display: block;
}

.lumi-native-dashboard__content .lumi-member-avatar-button::before {
    position: absolute;
    z-index: 1;
    inset: 7px;
    border: 1px solid #17172f;
    border-radius: 50%;
    content: "";
    pointer-events: none;
}

.lumi-native-dashboard__content .lumi-member-avatar-button__edit {
    position: absolute;
    z-index: 2;
    right: -3px;
    bottom: -3px;
    display: flex;
    width: 30px;
    height: 30px;
    align-items: center;
    justify-content: center;
    border: 3px solid #ffffff;
    border-radius: 50%;
    background: #4e52d8;
    color: #ffffff;
    box-shadow: 0 2px 8px rgba(36, 38, 72, 0.16);
}

.lumi-native-dashboard__content .lumi-member-avatar-button__edit svg {
    width: 15px;
    height: 15px;
}

.lumi-native-dashboard__content .lumi-member-avatar-button:focus-visible {
    outline: 3px solid rgba(78, 82, 216, 0.28);
    outline-offset: 6px;
}

/* Member profile modal */
.lumi-member-profile-modal {
    position: fixed;
    z-index: 10000;
    inset: 0;
    display: grid;
    place-items: center;
    padding: 28px;
}

.lumi-member-profile-modal.is-hidden {
    display: none;
}

button.lumi-member-profile-modal__overlay,
button.lumi-member-profile-modal__overlay:hover,
button.lumi-member-profile-modal__overlay:focus,
button.lumi-member-profile-modal__overlay:active {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    border: 0 !important;
    border-radius: 0 !important;
    outline: 0 !important;
    background: rgba(18, 18, 35, 0.42) !important;
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
    color: transparent !important;
    box-shadow: none !important;
    cursor: default;
    opacity: 1 !important;
    transform: none !important;
}

.lumi-member-profile-modal__dialog {
    position: relative;
    width: min(760px, 100%);
    max-height: calc(100vh - 56px);
    overflow: auto;
    border: 1px solid #e4e4ef;
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 24px 70px rgba(23, 23, 47, 0.2);
}

.lumi-member-profile-modal__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    padding: 28px 32px 22px;
    border-bottom: 1px solid #e4e4ef;
}

.lumi-member-profile-modal__eyebrow {
    margin: 0 0 6px;
    color: #626477;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.08em;
    line-height: 1.2;
    text-transform: uppercase;
}

.lumi-member-profile-modal__header h2 {
    margin: 0;
    color: #17172f;
    font-size: 28px;
    font-weight: 700;
    line-height: 1.2;
}

button.lumi-member-profile-modal__close {
    display: inline-flex;
    width: 38px;
    height: 38px;
    align-items: center;
    justify-content: center;
    flex: 0 0 38px;
    margin: 0;
    padding: 0;
    border: 0 !important;
    border-radius: 50% !important;
    background: transparent !important;
    color: #17172f !important;
    box-shadow: none !important;
    font-size: 30px;
    font-weight: 400;
    line-height: 1;
    cursor: pointer;
}

button.lumi-member-profile-modal__close:hover,
button.lumi-member-profile-modal__close:focus-visible {
    border: 0 !important;
    background: transparent !important;
    color: #4e52d8 !important;
    box-shadow: none !important;
}

.lumi-member-profile-modal__content {
    padding: 26px 32px 32px;
}

.lumi-native-dashboard__content .lumi-member-profile-modal .pmpro,
.lumi-native-dashboard__content .lumi-member-profile-modal .pmpro_section,
.lumi-native-dashboard__content .lumi-member-profile-modal .pmpro_section_content {
    display: block;
    width: 100%;
    max-width: none;
    margin: 0 !important;
}

.lumi-native-dashboard__content .lumi-member-profile-modal .pmpro_card {
    overflow: visible;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.lumi-native-dashboard__content .lumi-member-profile-modal .pmpro_card_content {
    padding: 0;
}

.lumi-member-profile-modal .pmpro_form_fieldset {
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
}

.lumi-member-profile-modal .pmpro_form_legend {
    margin: 0 0 20px;
    padding: 0;
}

.lumi-member-profile-modal .pmpro_form_heading {
    margin: 0;
    color: #17172f;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.25;
}

.lumi-member-profile-modal .pmpro_form_fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px 20px;
}

.lumi-member-profile-modal .pmpro_form_field {
    min-width: 0;
}

.lumi-member-profile-modal .pmpro_form_label {
    display: block;
    margin: 0 0 8px;
    color: var(--lumi-text);
    font-family: var(--lumi-font-ui);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.3;
}

.lumi-member-profile-modal .pmpro_form_input {
    appearance: none;
    -webkit-appearance: none;
    box-sizing: border-box;
    width: 100%;
    height: 56px;
    padding: 0 20px;
    border: 1px solid #B6B9E5 !important;
    border-radius: 6px !important;
    background: var(--lumi-card-bg) !important;
    color: var(--lumi-text) !important;
    font-family: var(--lumi-font-ui);
    font-size: 16px;
    font-weight: 500;
    line-height: 1.2;
    outline: none !important;
    box-shadow: none !important;
}

.lumi-member-profile-modal .pmpro_form_input:hover {
    border-color: #B6B9E5 !important;
}

.lumi-member-profile-modal .pmpro_form_input:focus,
.lumi-member-profile-modal .pmpro_form_input:focus-visible {
    border-color: var(--lumi-primary) !important;
    outline: none !important;
    box-shadow: 0 0 0 2px rgba(78, 82, 216, 0.12) !important;
}

.lumi-member-profile-modal .pmpro_form_input[readonly] {
    background: var(--lumi-bg-soft) !important;
    color: var(--lumi-text-light) !important;
}

.lumi-native-dashboard__content .lumi-member-profile-modal .pmpro_form_hint {
    margin: 7px 0 0;
    color: #77798a;
    font-size: 12px !important;
    line-height: 1.45 !important;
}

.lumi-member-profile-modal .pmpro_form_submit {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 18px;
    padding-top: 0;
    border-top: 0;
}

.lumi-member-profile-modal .pmpro_form_submit .pmpro_btn {
    appearance: none !important;
    -webkit-appearance: none !important;
    display: inline-flex;
    min-height: var(--lumi-button-height);
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: var(--lumi-button-padding);
    border: var(--lumi-button-border-width) solid var(--lumi-primary) !important;
    border-radius: 6px !important;
    font-family: var(--lumi-font-ui);
    font-size: 15px;
    font-weight: 600;
    line-height: 1;
    text-decoration: none !important;
    outline: none !important;
    box-shadow: none !important;
    cursor: pointer;
}

.lumi-member-profile-modal .pmpro_form_submit .pmpro_btn-submit-update-profile,
.lumi-member-profile-modal .pmpro_form_submit .pmpro_btn-submit-change-password,
.lumi-member-profile-modal .pmpro_form_submit .pmpro_btn-submit {
    background: var(--lumi-primary) !important;
    color: var(--lumi-button-white) !important;
}

.lumi-member-profile-modal .pmpro_form_submit .pmpro_btn-cancel {
    border-width: 1px !important;
    background: var(--lumi-card-bg) !important;
    color: var(--lumi-primary) !important;
}

.lumi-member-profile-modal .pmpro_form_submit .pmpro_btn:hover,
.lumi-member-profile-modal .pmpro_form_submit .pmpro_btn:focus,
.lumi-member-profile-modal .pmpro_form_submit .pmpro_btn:active {
    opacity: 0.9;
    border-color: var(--lumi-primary) !important;
    box-shadow: none !important;
}

.lumi-member-password-modal .pmpro_form_legend {
    display: none;
}

.lumi-member-password-modal .pmpro_form_fields {
    display: block;
}

.lumi-member-password-modal .pmpro_form_field-password_current {
    margin-bottom: 10px !important;
}

.lumi-native-dashboard__content .lumi-member-password-modal button.lumi-member-password-modal__forgot-link {
    appearance: none !important;
    -webkit-appearance: none !important;
    display: flex !important;
    width: auto !important;
    height: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    align-items: center;
    justify-content: flex-end;
    margin: 4px 0 0 auto !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: var(--lumi-primary) !important;
    box-shadow: none !important;
    font-family: var(--lumi-font-ui);
    font-size: 12px;
    font-weight: 600;
    line-height: 1.25 !important;
    text-decoration: none !important;
    cursor: pointer;
}

.lumi-member-password-modal__forgot-link:hover,
.lumi-member-password-modal__forgot-link:focus-visible {
    border: 0 !important;
    background: transparent !important;
    color: var(--lumi-primary) !important;
    box-shadow: none !important;
    text-decoration: underline !important;
}

.lumi-member-password-modal [data-lumi-password-change-view].is-hidden,
.lumi-member-password-modal__recovery.is-hidden {
    display: none;
}

.lumi-member-password-modal__recovery-copy {
    margin: 0 0 20px;
    color: var(--lumi-text-muted);
    font-size: 14px;
    line-height: 1.55;
}

.lumi-member-password-modal__recovery .pmpro_form_submit {
    margin-top: 22px;
    padding-top: 0;
    border-top: 0;
}

.lumi-member-password-modal__back {
    appearance: none !important;
    -webkit-appearance: none !important;
    width: fit-content;
    min-width: 0;
    min-height: 0;
    margin: 16px 0 0;
    padding: 0;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: var(--lumi-primary) !important;
    box-shadow: none !important;
    font-family: var(--lumi-font-ui);
    font-size: 13px;
    font-weight: 600;
    line-height: 1.4;
    cursor: pointer;
}

.lumi-member-password-modal__back:hover,
.lumi-member-password-modal__back:focus-visible {
    border: 0 !important;
    background: transparent !important;
    color: var(--lumi-primary) !important;
    box-shadow: none !important;
    text-decoration: underline;
}

.lumi-member-password-modal .pmpro_cols-2 {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

.lumi-member-password-modal .pmpro_form_field-password-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.lumi-member-password-modal button.pmpro_btn-password-toggle {
    appearance: none !important;
    -webkit-appearance: none !important;
    display: inline-flex;
    width: auto;
    min-width: 0;
    min-height: 0;
    align-items: center;
    justify-content: center;
    gap: 7px;
    margin: 0 0 8px;
    padding: 0;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: var(--lumi-primary) !important;
    box-shadow: none !important;
    font-family: var(--lumi-font-ui);
    font-size: 13px;
    font-weight: 600;
    line-height: 1.3;
}

.lumi-member-password-modal .pmpro_btn-password-toggle:hover,
.lumi-member-password-modal .pmpro_btn-password-toggle:focus-visible {
    border: 0 !important;
    background: transparent !important;
    color: var(--lumi-primary) !important;
    box-shadow: none !important;
}

.lumi-member-password-modal .pmpro_btn-password-toggle svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: var(--lumi-primary) !important;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.lumi-member-password-modal .pmpro_btn-password-toggle .pmpro_icon-eye {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--lumi-primary) !important;
}

.lumi-native-dashboard__content .lumi-member-password-modal .pmpro_form_hint {
    margin: 4px 0 0 !important;
    font-size: 12px !important;
    line-height: 1.45 !important;
}

.lumi-member-password-modal #pass-strength-result {
    margin-top: 10px;
    color: var(--lumi-text-light);
    font-size: 11px;
}

.lumi-member-password-modal #pass-strength-result.hide-if-no-js {
    display: none !important;
}

.lumi-member-password-modal [data-lumi-password-change-view] .pmpro_form_submit {
    margin-top: 12px !important;
    padding-top: 0 !important;
    border-top: 0 !important;
}

.lumi-member-profile-modal .pmpro_message {
    margin: 0 0 22px;
    padding: 14px 16px;
    border-radius: 6px;
    background: #eff9f1;
    color: #287a3e;
    font-size: 14px;
}

/* Member login page */
#pmpro_login {
    width: min(100%, 520px);
    margin: 48px auto 72px;
    font-family: var(--lumi-font-ui);
}

#pmpro_login .pmpro_login_wrap,
#pmpro_login .pmpro_lost_password_wrap {
    overflow: hidden;
    border: 1px solid var(--lumi-border);
    border-radius: 12px;
    background: var(--lumi-card-bg);
    box-shadow: var(--lumi-shadow-card);
}

#pmpro_login .pmpro_card_content {
    padding: 38px 40px 30px;
}

#pmpro_login .lumi-member-login__title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin: 0 0 28px;
    color: var(--lumi-text);
    font-family: var(--lumi-font-ui);
    font-size: 28px;
    font-weight: 700;
    line-height: 1.2;
}

#pmpro_login .lumi-member-login__title::after {
    content: "";
    display: block;
    width: 72px;
    height: 34px;
    flex: 0 0 72px;
    background: url("../images/lumi-logo.svg") no-repeat right center / contain;
}

#pmpro_login .lumi-member-login__error {
    display: block !important;
    width: 100%;
    margin: -8px 0 24px !important;
    padding: 12px 14px !important;
    border: 1px solid #f2b8b8 !important;
    border-radius: 6px !important;
    background: #fff2f2 !important;
    color: #b42318 !important;
    font-family: var(--lumi-font-ui);
    font-size: 14px;
    font-weight: 500;
    line-height: 1.4;
    box-sizing: border-box;
}

#pmpro_login #loginform {
    display: grid;
    gap: 20px;
    margin: 0;
}

#pmpro_login #loginform > p,
#pmpro_login #loginform .login-username,
#pmpro_login #loginform .login-password,
#pmpro_login #loginform .login-remember,
#pmpro_login #loginform .login-submit {
    margin: 0;
}

#pmpro_login #loginform label {
    display: block;
    margin: 0 0 8px;
    color: var(--lumi-text);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.35;
}

#pmpro_login #loginform input[type="text"],
#pmpro_login #loginform input[type="password"] {
    width: 100%;
    height: 56px;
    margin: 0;
    padding: 0 16px;
    border: 1px solid #b6b9e5;
    border-radius: 6px;
    background: var(--lumi-card-bg);
    color: var(--lumi-text);
    font-family: var(--lumi-font-ui);
    font-size: 16px;
    line-height: 1.3;
    outline: none;
    box-shadow: none;
}

#pmpro_login #loginform input[type="text"]:focus,
#pmpro_login #loginform input[type="password"]:focus {
    border-color: var(--lumi-primary);
    box-shadow: 0 0 0 3px rgba(82, 81, 229, 0.12);
}

#pmpro_login #loginform .login-password {
    position: relative;
}

#pmpro_login .pmpro_form_field-password-toggle {
    position: absolute;
    top: 0;
    right: 0;
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
}

#pmpro_login .pmpro_form_field-password-toggle:focus,
#pmpro_login .pmpro_form_field-password-toggle:focus-visible,
#pmpro_login .pmpro_form_field-password-toggle:focus-within {
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
}

#pmpro_login button.pmpro_btn-password-toggle {
    appearance: none !important;
    -webkit-appearance: none !important;
    display: inline-flex;
    width: auto;
    min-width: 0;
    min-height: 0;
    align-items: center;
    justify-content: center;
    gap: 7px;
    margin: 0;
    padding: 0;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: var(--lumi-primary) !important;
    box-shadow: none !important;
    font-family: var(--lumi-font-ui);
    font-size: 13px;
    font-weight: 600;
    line-height: 1.35;
}

#pmpro_login button.pmpro_btn-password-toggle:hover,
#pmpro_login button.pmpro_btn-password-toggle:focus,
#pmpro_login button.pmpro_btn-password-toggle:focus-visible,
#pmpro_login button.pmpro_btn-password-toggle:active {
    border: 0 !important;
    background: transparent !important;
    color: var(--lumi-primary) !important;
    outline: none !important;
    outline-offset: 0 !important;
    box-shadow: none !important;
}

#pmpro_login button.pmpro_btn-password-toggle::before,
#pmpro_login button.pmpro_btn-password-toggle::after {
    box-shadow: none !important;
}

#pmpro_login .pmpro_btn-password-toggle svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: var(--lumi-primary) !important;
    stroke-width: 2;
}

#pmpro_login #loginform .login-remember label {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin: 0;
    color: var(--lumi-text-muted);
    font-weight: 500;
    cursor: pointer;
}

#pmpro_login #loginform input[type="checkbox"] {
    width: 18px;
    height: 18px;
    margin: 0;
    accent-color: var(--lumi-primary);
}

#pmpro_login #loginform input[type="submit"] {
    appearance: none !important;
    -webkit-appearance: none !important;
    width: 100%;
    min-height: var(--lumi-button-height);
    margin: 0;
    padding: var(--lumi-button-padding);
    border: 1px solid var(--lumi-primary) !important;
    border-radius: 6px !important;
    background: var(--lumi-primary) !important;
    color: var(--lumi-button-white) !important;
    font-family: var(--lumi-font-ui);
    font-size: var(--lumi-button-font-size);
    font-weight: var(--lumi-button-font-weight);
    line-height: 1;
    box-shadow: none !important;
    cursor: pointer;
}

#pmpro_login #loginform input[type="submit"]:hover,
#pmpro_login #loginform input[type="submit"]:focus-visible {
    opacity: 0.92;
    border-color: var(--lumi-primary) !important;
    background: var(--lumi-primary) !important;
}

#pmpro_login .pmpro_card_actions {
    padding: 0 40px 30px;
    border-top: 0;
    background: var(--lumi-card-bg);
}

#pmpro_login .pmpro_actions_nav {
    margin: 0;
    text-align: center;
}

#pmpro_login .pmpro_actions_nav a {
    color: var(--lumi-primary);
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
}

#pmpro_login .pmpro_actions_nav a:hover,
#pmpro_login .pmpro_actions_nav a:focus-visible {
    color: var(--lumi-primary);
    text-decoration: underline;
}

#pmpro_login .pmpro_lost_password-instructions {
    margin: 0 0 24px;
    color: var(--lumi-text-muted);
    font-size: 14px;
    line-height: 1.55;
}

#pmpro_login .pmpro_lost_password_wrap .pmpro_spacer {
    display: none;
}

#pmpro_login #lostpasswordform .pmpro_form_fields,
#pmpro_login #lostpasswordform .pmpro_form_field {
    margin: 0;
}

#pmpro_login #lostpasswordform .pmpro_form_label {
    display: block;
    margin: 0 0 8px;
    color: var(--lumi-text);
    font-family: var(--lumi-font-ui);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.35;
}

#pmpro_login #lostpasswordform .pmpro_form_input {
    width: 100%;
    height: 56px;
    margin: 0;
    padding: 0 16px;
    border: 1px solid #b6b9e5 !important;
    border-radius: 6px !important;
    background: var(--lumi-card-bg) !important;
    color: var(--lumi-text);
    font-family: var(--lumi-font-ui);
    font-size: 16px;
    line-height: 1.3;
    outline: none;
    box-shadow: none !important;
}

#pmpro_login #lostpasswordform .pmpro_form_input:focus,
#pmpro_login #lostpasswordform .pmpro_form_input:focus-visible {
    border-color: var(--lumi-primary) !important;
    outline: none;
    box-shadow: 0 0 0 3px rgba(82, 81, 229, 0.12) !important;
}

#pmpro_login #lostpasswordform .pmpro_form_submit {
    margin: 20px 0 0;
    padding: 0;
    border: 0;
}

#pmpro_login #lostpasswordform .pmpro_btn-submit {
    appearance: none !important;
    -webkit-appearance: none !important;
    width: 100%;
    min-height: var(--lumi-button-height);
    margin: 0;
    padding: var(--lumi-button-padding);
    border: 1px solid var(--lumi-primary) !important;
    border-radius: 6px !important;
    background: var(--lumi-primary) !important;
    color: var(--lumi-button-white) !important;
    font-family: var(--lumi-font-ui);
    font-size: var(--lumi-button-font-size);
    font-weight: var(--lumi-button-font-weight);
    line-height: 1;
    outline: none;
    box-shadow: none !important;
    cursor: pointer;
}

#pmpro_login #lostpasswordform .pmpro_btn-submit:hover,
#pmpro_login #lostpasswordform .pmpro_btn-submit:focus-visible {
    opacity: 0.92;
    border-color: var(--lumi-primary) !important;
    background: var(--lumi-primary) !important;
}

@media (max-width: 767px) {
    #pmpro_login {
        width: calc(100% - 32px);
        margin: 28px auto 48px;
    }

    #pmpro_login .pmpro_card_content {
        padding: 28px 24px 24px;
    }

    #pmpro_login .pmpro_card_actions {
        padding: 0 24px 24px;
    }
}

@media (max-width: 700px) {
    .lumi-member-profile-modal {
        padding: 16px;
    }

    .lumi-member-profile-modal__dialog {
        max-height: calc(100vh - 32px);
    }

    .lumi-member-profile-modal__header,
    .lumi-member-profile-modal__content {
        padding-right: 22px;
        padding-left: 22px;
    }

    .lumi-member-profile-modal .pmpro_form_fields {
        grid-template-columns: 1fr;
    }

    .lumi-member-password-modal .pmpro_cols-2 {
        grid-template-columns: 1fr;
    }
}

.lumi-native-dashboard__content .pmpro_card_content {
    padding: 6px 52px 40px;
}

.lumi-native-dashboard__content #pmpro_account-profile .pmpro_card_content {
    padding-left: 200px;
}

.lumi-native-dashboard__content .pmpro_list {
    display: flex;
    width: 100% !important;
    flex-direction: column;
    flex-wrap: nowrap;
    gap: 18px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.lumi-native-dashboard__content .pmpro_list_item {
    position: relative;
    display: block !important;
    width: auto !important;
    max-width: none !important;
    flex: none !important;
    overflow: visible !important;
    padding-left: 48px !important;
    color: #5f6173;
    font-size: 15px;
    line-height: 1.5;
}

.lumi-native-dashboard__content #pmpro_account-profile .pmpro_list_item::before {
    position: absolute;
    top: 50%;
    left: 0;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background-color: #F0F0FF;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 17px 17px;
    content: "";
    transform: translateY(-50%);
}

.lumi-native-dashboard__content #pmpro_account-profile .pmpro_list_item:first-child::before {
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='12' cy='8' r='4' stroke='%234E52D8' stroke-width='2'/%3E%3Cpath d='M4.5 20c.7-4.2 3.2-6.3 7.5-6.3s6.8 2.1 7.5 6.3' stroke='%234E52D8' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
}

.lumi-native-dashboard__content #pmpro_account-profile .pmpro_list_item:nth-child(2)::before {
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='3' y='5' width='18' height='14' rx='2' stroke='%234E52D8' stroke-width='2'/%3E%3Cpath d='m4 7 8 6 8-6' stroke='%234E52D8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.lumi-native-dashboard__content .pmpro_list_item strong {
    color: #17172f;
    font-weight: 650;
}

.lumi-native-dashboard__content .pmpro_card_actions {
    display: flex;
    align-items: center;
    gap: 20px;
    min-height: 104px;
    padding: 24px 52px;
    border-top: 1px solid #E4E4EF;
    background: #ffffff !important;
    background-color: #ffffff !important;
    box-shadow: none !important;
}

.lumi-native-dashboard__content .pmpro_card_action_separator {
    display: block !important;
    width: 1px !important;
    height: 30px !important;
    flex: 0 0 1px !important;
    margin: 0 6px !important;
    overflow: hidden;
    background: #E4E4EF !important;
    color: transparent;
    font-size: 0;
    opacity: 1 !important;
}

.lumi-native-dashboard__content .pmpro_card_action a {
    display: inline-flex;
    min-height: 54px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 0 30px;
    border: 1px solid #B6B9E5;
    border-radius: 6px;
    background: #ffffff;
    color: #4e52d8;
    font-size: 15px;
    font-weight: 650;
    line-height: 1;
    text-decoration: none;
    transition: background-color 160ms ease, border-color 160ms ease;
}

.lumi-native-dashboard__content .pmpro_card_action a::before {
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
    background: currentColor;
    content: "";
}

.lumi-native-dashboard__content .pmpro_card_action a:hover,
.lumi-native-dashboard__content .pmpro_card_action a:focus-visible {
    border-color: #bfc1ed;
    background: #f0f0ff;
    color: #4e52d8;
}

.lumi-native-dashboard__content #pmpro_actionlink-profile {
    border-color: #B6B9E5;
    background: #ffffff;
    color: #4E52D8;
}

.lumi-native-dashboard__content #pmpro_actionlink-profile:hover,
.lumi-native-dashboard__content #pmpro_actionlink-profile:focus-visible {
    border-color: #4E52D8;
    background: #F5F6FF;
    color: #4E52D8;
}

.lumi-native-dashboard__content #pmpro_actionlink-profile::before {
    -webkit-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m4 20 4.2-1 10-10a2.1 2.1 0 0 0-3-3l-10 10L4 20Zm9.8-12.6 3 3' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m4 20 4.2-1 10-10a2.1 2.1 0 0 0-3-3l-10 10L4 20Zm9.8-12.6 3 3' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

.lumi-native-dashboard__content #pmpro_actionlink-change-password::before {
    -webkit-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='4' y='10' width='16' height='11' rx='2' fill='none' stroke='black' stroke-width='2'/%3E%3Cpath d='M8 10V7a4 4 0 0 1 8 0v3' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='4' y='10' width='16' height='11' rx='2' fill='none' stroke='black' stroke-width='2'/%3E%3Cpath d='M8 10V7a4 4 0 0 1 8 0v3' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

.lumi-native-dashboard__content #pmpro_account-membership [id="pmpro_actionlink-change"]::before,
.lumi-native-dashboard__content #pmpro_account-membership [id^="pmpro_actionlink-change-"]:not([id^="pmpro_actionlink-change-password"])::before {
    -webkit-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 8h14m0 0-3-3m3 3-3 3M20 16H6m0 0 3 3m-3-3 3-3' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 8h14m0 0-3-3m3 3-3 3M20 16H6m0 0 3 3m-3-3 3-3' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

.lumi-native-dashboard__content #pmpro_actionlink-logout,
.lumi-native-dashboard__content #pmpro_account-membership [id="pmpro_actionlink-cancel"],
.lumi-native-dashboard__content #pmpro_account-membership [id^="pmpro_actionlink-cancel-"] {
    border-color: #FFD3D8;
    background: #FFF5F6;
    color: #E94B64;
}

.lumi-native-dashboard__content #pmpro_actionlink-logout:hover,
.lumi-native-dashboard__content #pmpro_actionlink-logout:focus-visible,
.lumi-native-dashboard__content #pmpro_account-membership [id="pmpro_actionlink-cancel"]:hover,
.lumi-native-dashboard__content #pmpro_account-membership [id="pmpro_actionlink-cancel"]:focus-visible,
.lumi-native-dashboard__content #pmpro_account-membership [id^="pmpro_actionlink-cancel-"]:hover,
.lumi-native-dashboard__content #pmpro_account-membership [id^="pmpro_actionlink-cancel-"]:focus-visible {
    border-color: #FFBFC7;
    background: #FFECEF;
    color: #D93C56;
}

.lumi-native-dashboard__content #pmpro_actionlink-logout::before {
    -webkit-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14 8V5a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h7a2 2 0 0 0 2-2v-3M10 12h11m0 0-4-4m4 4-4 4' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14 8V5a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h7a2 2 0 0 0 2-2v-3M10 12h11m0 0-4-4m4 4-4 4' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

.lumi-native-dashboard__content #pmpro_account-membership .pmpro_card_title {
    display: grid;
    grid-template-columns: 54px minmax(0, 1fr);
    align-items: center;
    gap: 20px;
    padding: 42px 52px;
    text-align: left;
}

.lumi-native-dashboard__content #pmpro_account-membership .pmpro_card_title::before {
    width: 54px;
    height: 54px;
    flex: 0 0 54px;
    border-radius: 50%;
    background: #F0F0FF url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 5.5c3.2-.8 5.9-.2 8 1.8v12c-2.1-2-4.8-2.6-8-1.8v-12Zm16 0c-3.2-.8-5.9-.2-8 1.8v12c2.1-2 4.8-2.6 8-1.8v-12Z' stroke='%234E52D8' stroke-width='1.8' stroke-linejoin='round'/%3E%3C/svg%3E") center / 28px 28px no-repeat;
    content: "";
}

.lumi-native-dashboard__content #pmpro_account-membership .pmpro_card_title::after {
    content: none;
}

.lumi-native-dashboard__content #pmpro_account-membership .pmpro_card_content:not(:has(.pmpro_list_item)) {
    display: none !important;
}

.lumi-native-dashboard__content #pmpro_account-membership .pmpro_card_actions {
    justify-content: flex-start;
}

.lumi-native-dashboard__content #pmpro_account-membership [id="pmpro_actionlink-cancel"]::before,
.lumi-native-dashboard__content #pmpro_account-membership [id^="pmpro_actionlink-cancel-"]::before {
    -webkit-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='12' cy='12' r='9' fill='none' stroke='black' stroke-width='2'/%3E%3Cpath d='m9 9 6 6m0-6-6 6' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='12' cy='12' r='9' fill='none' stroke='black' stroke-width='2'/%3E%3Cpath d='m9 9 6 6m0-6-6 6' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

@media (max-width: 760px) {
    .lumi-native-dashboard__content .pmpro_section_title {
        font-size: 30px;
    }

    .lumi-native-dashboard__content .pmpro_card_title,
    .lumi-native-dashboard__content .pmpro_card_content,
    .lumi-native-dashboard__content .pmpro_card_actions {
        padding-right: 24px;
        padding-left: 24px;
    }

    .lumi-native-dashboard__content #pmpro_account-profile .pmpro_card_content {
        padding-left: 24px;
    }

    .lumi-native-dashboard__content .pmpro_heading-with-avatar {
        align-items: flex-start;
        flex-direction: column;
    }

    .lumi-native-dashboard__content .pmpro_list,
    .lumi-native-dashboard__content .pmpro_card_actions {
        align-items: flex-start;
        flex-direction: column;
    }

    .lumi-native-dashboard__content .pmpro_card_action_separator {
        display: none;
    }
}

html.lumi-save-modal-open {
    overflow: hidden;
}

.lumi-material-save-modal[hidden] {
    display: none !important;
}

.lumi-material-save-modal {
    position: fixed;
    inset: 0;
    z-index: 100000;
    display: grid;
    place-items: center;
    padding: 24px;
}

.lumi-material-save-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(27, 31, 45, 0.52);
    backdrop-filter: blur(3px);
}

.lumi-material-save-modal__dialog {
    position: relative;
    width: min(560px, 100%);
    max-height: min(820px, calc(100vh - 48px));
    overflow: auto;
    border: 1px solid #e5e7f2;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 24px 70px rgba(31, 35, 64, 0.24);
    padding: 28px;
    color: #2d3045;
}

button.lumi-material-save-modal__close,
.lumi-material-save-modal__close {
    position: absolute !important;
    top: 14px !important;
    right: 14px !important;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: transparent !important;
    color: #111 !important;
    font-size: 30px !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    box-shadow: none !important;
    cursor: pointer;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

button.lumi-material-save-modal__close:hover,
button.lumi-material-save-modal__close:focus {
    border: 0 !important;
    background: transparent !important;
    color: #111 !important;
    box-shadow: none !important;
}

.lumi-material-save-modal__eyebrow {
    margin: 0 0 6px;
    color: #6865d9;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.lumi-material-save-modal h2 {
    margin: 0 48px 8px 0;
    font-size: clamp(28px, 4vw, 34px);
    line-height: 1.2;
}

.lumi-material-save-modal__review-intro {
    margin: 0;
    color: #6f7280;
    font-size: 13px;
    line-height: 1.45;
}

.lumi-material-save-modal [data-lumi-save-modal-stage="review"] h2 {
    font-size: 30px !important;
    line-height: 1.2 !important;
}

.lumi-material-save-modal__field {
    display: grid;
    gap: 8px;
    margin: 20px 0;
    font-weight: 650;
}

.lumi-material-save-modal__field input[type="text"] {
    width: 100%;
    min-height: 48px;
    border: 1px solid #d8d9e7;
    border-radius: 12px;
    padding: 10px 14px;
    background: #fff;
    color: #2d3045;
    font: inherit;
}

.lumi-material-save-modal__destinations {
    display: grid;
    gap: 12px;
    margin: 0;
    padding: 0;
    border: 0;
}

.lumi-material-save-modal__destinations legend {
    margin-bottom: 10px;
    font-weight: 700;
}

.lumi-material-save-modal__destination {
    display: grid;
    grid-template-columns: 22px 1fr;
    gap: 12px;
    align-items: start;
    border: 1px solid #dfe0eb;
    border-radius: 16px;
    padding: 16px;
    cursor: pointer;
}

.lumi-material-save-modal__destination:has(input:checked) {
    border-color: #7772e4;
    background: #f7f6ff;
    box-shadow: 0 0 0 2px rgba(119, 114, 228, 0.12);
}

.lumi-material-save-modal__destination input {
    margin-top: 3px;
    accent-color: #6865d9;
}

.lumi-material-save-modal__destination span {
    display: grid;
    gap: 4px;
}

.lumi-material-save-modal__destination small,
.lumi-material-save-modal__field small {
    color: #73768a;
    font-weight: 400;
    line-height: 1.45;
}

.lumi-material-save-modal__notice {
    margin-top: 14px;
    border-radius: 12px;
    background: #f0f7ff;
    padding: 13px 15px;
    color: #3f536d;
    font-size: 14px;
    line-height: 1.5;
}

.lumi-material-save-modal__actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 24px;
}

.lumi-material-save-modal__actions .lumi-button {
    border-radius: 6px !important;
}

.lumi-material-save-modal__actions .lumi-button:disabled {
    border-color: #d8d9e3 !important;
    background: #d8d9e3 !important;
    color: #777a89 !important;
    cursor: not-allowed !important;
    opacity: 1 !important;
}

.lumi-material-save-modal__error {
    margin: 14px 0 0;
    border-radius: 10px;
    background: #fff0f0;
    padding: 12px 14px;
    color: #9f2525;
}

.lumi-material-save-modal__loading,
.lumi-material-save-modal__success {
    display: grid;
    justify-items: center;
    padding: 46px 16px 24px;
    text-align: center;
}

.lumi-material-save-modal__loading h2,
.lumi-material-save-modal__success h2 {
    margin: 18px 0 8px;
}

.lumi-material-save-modal__spinner {
    width: 46px;
    height: 46px;
    border: 4px solid #e4e3f8;
    border-top-color: #6865d9;
    border-radius: 50%;
    animation: lumi-save-modal-spin 0.8s linear infinite;
}

@keyframes lumi-save-modal-spin {
    to { transform: rotate(360deg); }
}

.lumi-material-save-modal__preview {
    margin: 18px 0 16px;
    border: 1px solid #e0e1ec;
    border-radius: 12px;
    background: #fafafe;
    padding: 14px;
}

.lumi-material-save-modal__preview p {
    margin: 8px 0 0;
    color: #383b50;
    font-size: 13px;
    line-height: 1.4;
}

.lumi-material-save-modal__preview-gallery {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(96px, 128px));
    gap: 10px;
}

.lumi-material-save-modal__preview img {
    width: 100%;
    aspect-ratio: 1;
    border-radius: 10px;
    object-fit: contain;
    background: #fff;
}

.lumi-material-save-modal__confirmation {
    display: grid;
    grid-template-columns: 20px 1fr;
    gap: 10px;
    align-items: start;
    margin: 12px 0;
    font-size: 13px;
    line-height: 1.45;
}

.lumi-material-save-modal__confirmation input {
    appearance: none;
    -webkit-appearance: none;
    position: relative;
    width: 19px;
    height: 19px;
    margin: 0;
    border: 1.5px solid #b9bbc9;
    border-radius: 5px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(23, 23, 47, .06);
    cursor: pointer;
    transition: border-color .16s ease, background-color .16s ease, box-shadow .16s ease;
}

.lumi-material-save-modal__confirmation:hover input {
    border-color: #6865d9;
}

.lumi-material-save-modal__confirmation input:checked {
    border-color: #4e52d8;
    background: #4e52d8;
    box-shadow: 0 2px 5px rgba(78, 82, 216, .24);
}

.lumi-material-save-modal__confirmation input:checked::after {
    content: '';
    position: absolute;
    left: 5px;
    top: 2px;
    width: 5px;
    height: 9px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

.lumi-material-save-modal__confirmation input:focus-visible {
    outline: 3px solid rgba(78, 82, 216, .2);
    outline-offset: 2px;
    border-color: #4e52d8;
}

.lumi-material-save-modal__confirmation a {
    color: #4e52d8;
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.lumi-material-save-modal__submit-hint {
    margin: 12px 0 -12px;
    color: #9f4363;
    font-size: 12px;
    text-align: right;
}

.lumi-material-save-modal__success > span {
    display: grid;
    place-items: center;
    width: 58px;
    height: 58px;
    border-radius: 50%;
    background: #e7f8ed;
    color: #238448;
    font-size: 30px;
    font-weight: 700;
}

@media (max-width: 600px) {
    .lumi-material-save-modal {
        align-items: end;
        padding: 0;
    }

    .lumi-material-save-modal__dialog {
        max-height: 92vh;
        border-radius: 22px 22px 0 0;
        padding: 26px 20px;
    }

    .lumi-material-save-modal__actions {
        flex-direction: column-reverse;
    }

    .lumi-material-save-modal__actions .lumi-button {
        width: 100%;
    }
}

/* Final material-card visual grid */
.lumi-my-materials__card-header {
    padding-bottom: 10px;
    margin-bottom: 10px;
    border-bottom: 1px solid #ececf3;
}

.lumi-my-materials__actions {
    position: relative;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
    width: 100%;
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid #ececf3;
}

.lumi-my-materials__actions::before,
.lumi-my-materials__actions::after {
    content: "";
    position: absolute;
    top: 12px;
    bottom: 0;
    width: 1px;
    background: #ececf3;
    pointer-events: none;
}

.lumi-my-materials__actions::before {
    left: 33.333%;
}

.lumi-my-materials__actions::after {
    left: 66.666%;
}

.lumi-my-materials__actions .lumi-button,
button.lumi-my-materials__share {
    width: calc(100% - 16px) !important;
    justify-self: center;
}

button.lumi-my-materials__share {
    padding-left: 6px !important;
    padding-right: 6px !important;
}

.lumi-my-materials__meta-row {
    align-items: center;
}

.lumi-my-materials__meta-row .lumi-my-materials__date {
    padding-top: 0;
}



/* Material card final alignment pass */
.lumi-my-materials__card-header {
    min-height: 22px;
    padding-bottom: 7px;
    margin-bottom: 8px;
    align-items: center;
}

.lumi-my-materials__tags {
    margin-bottom: 0;
    align-items: center;
}

.lumi-my-materials__type {
    min-height: 20px;
    padding: 2px 8px;
    font-size: 9px;
    line-height: 1;
}

button.lumi-my-materials__trash {
    flex: 0 0 20px;
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    min-height: 20px !important;
    align-items: center !important;
    justify-content: center !important;
}

.lumi-my-materials__trash img {
    width: 15px;
    height: 16px;
}

.lumi-my-materials__actions {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
    padding-top: 12px;
}

.lumi-my-materials__actions > * {
    width: calc(100% - 14px) !important;
    min-width: 0 !important;
    justify-self: center;
}

.lumi-my-materials__actions .lumi-button,
button.lumi-my-materials__share {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding-left: 7px !important;
    padding-right: 7px !important;
}

.lumi-my-materials__action-icon {
    display: block;
    width: 17px;
    height: 17px;
    flex: 0 0 17px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

button.lumi-my-materials__share svg {
    width: 17px;
    height: 17px;
}


/* Material card width + action button refinement */
.lumi-my-materials__card {
    width: 320px;
}

.lumi-my-materials__card-header {
    min-height: 30px;
    padding-bottom: 10px;
    margin-bottom: 10px;
}

.lumi-my-materials__actions {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.lumi-my-materials__actions .lumi-button,
button.lumi-my-materials__share {
    width: calc(100% - 12px) !important;
    height: 42px !important;
}

button.lumi-my-materials__share {
    border: 1px solid #4e52d8 !important;
    border-radius: 6px !important;
    background: #ffffff !important;
}

button.lumi-my-materials__share:hover,
button.lumi-my-materials__share:focus {
    background: #f7f7ff !important;
    color: #3539bd !important;
}


/* Keep visibility + direct-share count on one metadata row */
.lumi-my-materials__meta-left {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.lumi-my-materials__meta-left .lumi-my-materials__visibility-control {
    flex: 0 0 auto;
}

.lumi-my-materials__meta-left .lumi-my-materials__sharing-indicator--people {
    flex: 0 0 auto;
    margin: 0;
}

/* Unified search: sanitized public-library result cards. */
.lumi-my-materials__public-result-tag {
    display: inline-flex;
    align-items: center;
    min-height: 20px;
    box-sizing: border-box;
    padding: 2px 8px;
    border: 1px solid #dfe1eb;
    border-radius: 999px;
    background: #ffffff;
    color: #555971;
    font-size: 9px;
    font-weight: 800;
    line-height: 1;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.lumi-my-materials__actions--public-result {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.lumi-my-materials__actions--shared-result {
    grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.35fr);
}

.lumi-my-materials__actions--shared-result-preview-only {
    grid-template-columns: minmax(0, 1fr);
}

/* Keep every card's action row aligned along the bottom of its grid row. */
.lumi-my-materials__card {
    display: flex;
    flex-direction: column;
}

.lumi-my-materials__card > .lumi-my-materials__actions {
    margin-top: auto;
}

.lumi-my-materials__actions--shared-result::before,
.lumi-my-materials__actions--shared-result::after {
    display: none;
}

.lumi-my-materials__actions--public-result::before,
.lumi-my-materials__actions--public-result::after {
    display: none;
}

.lumi-my-materials__actions--public-result [data-lumi-save-public-material]:disabled {
    border-color: #dfe1eb !important;
    background: #f5f5f8 !important;
    color: #74778a !important;
    opacity: 1;
    cursor: default;
}

/* Give Preview button more breathing room */
.lumi-my-materials__actions .lumi-button--outline-primary {
    padding-left: 12px !important;
    padding-right: 12px !important;
}


/* Make Preview button slightly wider inside its action column */
.lumi-my-materials__actions .lumi-button--outline-primary {
    width: calc(100% - 4px) !important;
}


/* Remove vertical dividers between material card action buttons */
.lumi-my-materials__actions::before,
.lumi-my-materials__actions::after {
    display: none !important;
}

button.lumi-material-share-modal__submit.lumi-button,
button.lumi-material-share-modal__submit.lumi-button:disabled {
    min-height: 42px !important;
    padding: 0 18px !important;
    border-radius: 6px !important;
}

.lumi-material-share-modal__box .lumi-material-share-modal__search {
    display: block;
    width: 100%;
}

.lumi-material-share-modal__box .lumi-material-share-modal__search input[type="search"] {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 44px !important;
    box-sizing: border-box !important;
    border: 1px solid #d8d9e7 !important;
    border-radius: 6px !important;
    background: #ffffff !important;
    box-shadow: none !important;
}

.lumi-material-share-modal__box .lumi-material-share-modal__search input[type="search"]:focus,
.lumi-material-share-modal__box .lumi-material-share-modal__search input[type="search"]:focus-visible {
    border-color: #4e52d8 !important;
    box-shadow: 0 0 0 3px rgba(78, 82, 216, .12) !important;
    outline: none !important;
}

.lumi-material-share-modal__box .lumi-material-share-modal__search > button.lumi-material-share-modal__search-remove,
.lumi-material-share-modal__box .lumi-material-share-modal__search > button.lumi-material-share-modal__search-remove:hover,
.lumi-material-share-modal__box .lumi-material-share-modal__search > button.lumi-material-share-modal__search-remove:focus,
.lumi-material-share-modal__box .lumi-material-share-modal__search > button.lumi-material-share-modal__search-remove:focus-visible {
    border: 0 !important;
    background: transparent !important;
    color: #303248 !important;
    box-shadow: none !important;
}

.lumi-shared-material-view__actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

.lumi-shared-material-view__actions .lumi-button {
    min-height: 42px !important;
    padding: 0 18px !important;
    border-radius: 6px !important;
}

.lumi-shared-material-view__feedback {
    margin: 12px 0 0 !important;
    color: #16833f !important;
    font-size: 13px;
    font-weight: 700;
}

.lumi-shared-material-view__feedback.is-error {
    color: #b42318 !important;
}

/* User-uploaded resources. */
.lumi-my-materials__upload-row { display: flex; justify-content: flex-end; margin-bottom: 10px; }
.lumi-my-materials__upload-button { min-height: 40px; padding: 8px 14px; border-radius: 6px; }
.lumi-my-materials__upload-button svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.lumi-my-materials__thumbnail--uploaded img { width: 100%; height: 100%; object-fit: contain; }
.lumi-my-materials__pdf-placeholder { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; width: 100%; min-height: 100%; color: #55586d; font-weight: 700; }
.lumi-my-materials__actions--uploaded { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.lumi-upload-resource-modal[hidden] { display: none; }
.lumi-upload-resource-modal { position: fixed; inset: 0; z-index: 10020; display: grid; place-items: center; padding: 24px; }
.lumi-upload-resource-modal__overlay { position: absolute; inset: 0; background: rgb(29 30 49 / 48%); }
.lumi-upload-resource-modal__box { position: relative; z-index: 1; width: min(100%, 480px); padding: 32px; border: 1px solid #e0e2ec; border-radius: 18px; background: #fff; box-shadow: 0 22px 60px rgb(28 30 48 / 22%); }
.lumi-upload-resource-modal__box h2 { margin: 0 40px 24px 0; }
.lumi-upload-resource-modal__box form, .lumi-upload-resource-modal__box label { display: grid; gap: 8px; }
.lumi-upload-resource-modal__box form { gap: 18px; }
.lumi-upload-resource-modal__box input[type="text"], .lumi-upload-resource-modal__box input[type="file"] { width: 100%; min-height: 44px; padding: 10px 12px; border: 1px solid #d7d9e4; border-radius: 6px; background: #fff; color: #202236; }
.lumi-upload-resource-modal__close { position: absolute; top: 22px; right: 22px; width: 36px; height: 36px; padding: 0; border: 0; background: transparent; color: #171827; font-size: 30px; line-height: 1; cursor: pointer; }
.lumi-upload-resource-modal__feedback { margin: 0; color: #b42318; }
.lumi-upload-resource-modal__actions { display: flex; justify-content: flex-end; gap: 10px; }
html.lumi-upload-modal-open { overflow: hidden; }

/* Keep tablet shell sizing after all legacy workspace restoration rules. */
@media (min-width: 768px) and (max-width: 1440px) {
    body:has(.lumi-child-page) .lumi-child-page {
        --lumi-tablet-preview-width: 260px;
        grid-template-columns: var(--lumi-tablet-sidebar-width) minmax(0, 1fr) !important;
        grid-template-rows: 64px auto !important;
        column-gap: 20px !important;
        min-height: 100dvh !important;
        padding-right: 24px !important;
        padding-bottom: 24px !important;
    }

    body:has(.lumi-child-page) .lumi-child-app-header {
        grid-template-columns: var(--lumi-tablet-sidebar-width) minmax(0, 1fr) auto minmax(0, 1fr) !important;
        min-height: 64px !important;
    }

    body:has(.lumi-child-page) .lumi-child-sidebar {
        width: var(--lumi-tablet-sidebar-width) !important;
        min-height: calc(100dvh - 64px) !important;
    }

    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-app-header__brand {
        grid-column: 1 !important;
        grid-row: 1 !important;
        justify-self: center;
        margin-left: 0;
    }

    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-app-header__full-logo {
        display: none !important;
    }

    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-app-header__compact-logo {
        display: block !important;
        width: 34px !important;
        height: 34px !important;
        object-fit: contain;
    }

    body:has(.lumi-child-page) .lumi-child-page::after {
        display: block !important;
        top: 0 !important;
        bottom: 0 !important;
        left: var(--lumi-tablet-sidebar-width) !important;
    }

    body:has(.lumi-child-page)
        .lumi-child-page.is-pages-preview-open
        .lumi-child-main {
        padding-right: 0 !important;
    }

    body:has(.lumi-child-page) .lumi-flashcards-embedded__workspace,
    body:has(.lumi-child-page) .lumi-editor-shell__body {
        transition: padding-right 180ms ease;
    }

    body:has(.lumi-child-page)
        .lumi-child-page.is-pages-preview-open
        .lumi-flashcards-embedded__workspace,
    body:has(.lumi-child-page)
        .lumi-child-page.is-pages-preview-open
        .lumi-editor-shell__body {
        padding-right: calc(var(--lumi-tablet-preview-width) - 24px) !important;
    }
}

@media (min-width: 768px) and (max-width: 1440px) and (orientation: landscape) {
    body:has(.lumi-child-page) .lumi-workspace-settings-row {
        flex-flow: row nowrap !important;
        align-items: flex-end !important;
        gap: 12px !important;
    }

    body:has(.lumi-child-page) .lumi-workspace-settings__controls {
        flex-flow: row nowrap !important;
        min-width: 0;
        gap: 8px !important;
    }

    body:has(.lumi-child-page) .lumi-format-options {
        flex-flow: row nowrap !important;
        gap: 2px !important;
    }

    body:has(.lumi-child-page)
        .lumi-flashcards-embedded
        .lumi-format-group--size {
        flex: 0 1 auto !important;
        width: auto !important;
    }

    body:has(.lumi-child-page) .lumi-workspace-actions {
        flex: 0 0 auto;
        width: auto;
        gap: 8px;
    }

    body:has(.lumi-child-page) .lumi-flashcards-embedded__top,
    body:has(.lumi-child-page) .lumi-editor-shell__settings {
        position: relative;
        z-index: 11;
    }

    body:has(.lumi-child-page)
        .lumi-child-main
        > .lumi-pages-preview.lumi-pages-preview--below-toolbar {
        top: var(--lumi-pages-preview-toolbar-bottom);
        bottom: 0;
        height: auto;
    }

    body:has(.lumi-child-page)
        .lumi-pages-preview--below-toolbar
        .lumi-pages-preview__panel {
        top: 0;
    }

    body:has(.lumi-child-page)
        .lumi-pages-preview--below-toolbar
        button.lumi-pages-preview__trigger {
        top: 6px;
    }

    body:has(.lumi-child-page)
        .lumi-pages-preview--below-toolbar
        .lumi-pages-preview__panel.is-viewport-fixed {
        top: 0;
    }
}

/* Keep the optional laptop sidebar state after legacy restoration rules. */
@media (min-width: 1281px) and (max-width: 1440px) {
    body:has(.lumi-child-page) .lumi-child-page {
        grid-template-columns: var(--lumi-responsive-sidebar-width) minmax(0, 1fr) !important;
    }

    body:has(.lumi-child-page) .lumi-child-app-header {
        grid-template-columns: var(--lumi-responsive-sidebar-width) minmax(0, 1fr) auto minmax(0, 1fr) !important;
    }

    body:has(.lumi-child-page) .lumi-child-sidebar {
        width: var(--lumi-responsive-sidebar-width) !important;
    }

    body:has(.lumi-child-page) .lumi-child-sidebar__toggle {
        display: flex !important;
    }

    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-workspace-menu {
        padding-top: 12px !important;
        padding-left: 0 !important;
    }

    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-app-header__full-logo {
        display: none !important;
    }

    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-app-header__compact-logo {
        display: block !important;
    }

    body:has(.lumi-child-page) .lumi-child-page::after {
        left: var(--lumi-responsive-sidebar-width) !important;
    }
}

@media (min-width: 768px) and (max-width: 1440px) and (prefers-reduced-motion: reduce) {
    body:has(.lumi-child-page) .lumi-child-sidebar__toggle-icon {
        transition: none !important;
    }
}

@media (min-width: 768px) and (max-width: 1440px) {
    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-card {
        display: block !important;
        width: 64px;
        margin: 8px auto 0;
    }

    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-card__summary {
        display: flex !important;
        flex-direction: column;
        justify-content: center;
        width: 64px !important;
        min-height: 0 !important;
        padding: 8px 4px 10px !important;
        gap: 6px !important;
        box-sizing: border-box;
    }

    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-card__summary
        .lumi-child-card__avatar {
        margin: 0 auto;
    }

    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-card__avatar-edit {
        display: none !important;
    }

    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        button.lumi-child-card__profile-toggle {
        display: block !important;
        width: 56px;
        padding: 0 !important;
        text-align: center;
    }

    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-card__identity,
    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-card__name {
        display: block;
        min-width: 0;
        max-width: 56px;
    }

    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-card__name {
        overflow: hidden;
        color: #55586d !important;
        font-size: 11px !important;
        font-weight: 600 !important;
        line-height: 1.25 !important;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-card__chevron,
    body:has(.lumi-child-page)
        .lumi-child-page.is-tablet-sidebar-collapsed
        .lumi-child-card__collapsible {
        display: none !important;
    }
}

/* Shared compact Pages / Preview rail. */
body:has(.lumi-child-page) .lumi-child-page {
    --lumi-pages-preview-collapsed-width: 64px;
    --lumi-pages-preview-open-width: 380px;
    --lumi-pages-preview-edge-offset: 42px;
}

body:has(.lumi-child-page)
    .lumi-pages-preview[data-lumi-pages-preview-state="closed"]::before {
    position: absolute;
    z-index: 1;
    top: 112px;
    right: calc(-1 * var(--lumi-pages-preview-edge-offset));
    bottom: 0;
    width: var(--lumi-pages-preview-collapsed-width);
    box-sizing: border-box;
    border-left: 1px solid #e4e4ef;
    background: #ffffff;
    content: "";
    pointer-events: none;
}

body:has(.lumi-child-page)
    .lumi-pages-preview--below-toolbar[data-lumi-pages-preview-state="closed"]::before {
    top: 0;
}

body:has(.lumi-child-page)
    .lumi-pages-preview[data-lumi-pages-preview-state="closed"]
    button.lumi-pages-preview__trigger {
    top: 122px;
    right: calc(10px - var(--lumi-pages-preview-edge-offset));
    justify-content: center;
    width: 44px;
    min-height: 44px;
    padding: 8px;
    border: 1px solid #e4e4ef !important;
    border-radius: 6px;
    background: #ffffff !important;
}

body:has(.lumi-child-page)
    .lumi-pages-preview--below-toolbar[data-lumi-pages-preview-state="closed"]
    button.lumi-pages-preview__trigger {
    top: 10px;
}

body:has(.lumi-child-page)
    button.lumi-pages-preview__trigger
    .lumi-pages-preview__toggle-label,
body:has(.lumi-child-page)
    button.lumi-pages-preview__panel-toggle
    .lumi-pages-preview__toggle-label {
    display: none !important;
}

body:has(.lumi-child-page) button.lumi-pages-preview__panel-toggle {
    justify-content: flex-start;
    width: 100%;
    min-height: 44px;
    box-sizing: border-box;
    padding: 8px 10px;
    border: 1px solid #e4e4ef !important;
    border-radius: 6px;
    background: #ffffff !important;
}

body:has(.lumi-child-page) button.lumi-pages-preview__trigger:focus-visible,
body:has(.lumi-child-page) button.lumi-pages-preview__panel-toggle:focus-visible {
    outline: 2px solid #4e52d8;
    outline-offset: 2px;
}

body:has(.lumi-child-page) .lumi-child-sidebar__toggle-icon,
body:has(.lumi-child-page) .lumi-pages-preview__toggle-icon {
    position: relative;
    display: block;
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
    border: 1.5px solid currentColor;
    border-radius: 3px;
    transition: transform 200ms ease-in-out;
}

body:has(.lumi-child-page) .lumi-child-sidebar__toggle-icon::before,
body:has(.lumi-child-page) .lumi-pages-preview__toggle-icon::before {
    position: absolute;
    top: 2px;
    bottom: 2px;
    left: 6px;
    border-left: 1.5px solid currentColor;
    content: "";
}

body:has(.lumi-child-page) .lumi-child-sidebar__toggle-icon::after,
body:has(.lumi-child-page) .lumi-pages-preview__toggle-icon::after {
    position: absolute;
    top: 50%;
    right: 2px;
    width: 5px;
    height: 5px;
    border-right: 1.5px solid currentColor;
    border-bottom: 1.5px solid currentColor;
    content: "";
    transform: translateY(-50%) rotate(135deg);
}

body:has(.lumi-child-page)
    .lumi-pages-preview[data-lumi-pages-preview-state="open"]
    .lumi-pages-preview__toggle-icon {
    transform: rotate(180deg);
}

body:has(.lumi-child-page)
    .lumi-child-main
    > .lumi-pages-preview.lumi-pages-preview--below-toolbar {
    top: var(--lumi-pages-preview-toolbar-bottom);
    bottom: 0;
    height: auto;
}

body:has(.lumi-child-page)
    .lumi-pages-preview--below-toolbar
    .lumi-pages-preview__panel {
    top: 0;
}

body:has(.lumi-child-page)
    .lumi-child-page[data-lumi-pages-preview-state="closed"]
    .lumi-flashcards-embedded__workspace,
body:has(.lumi-child-page)
    .lumi-child-page[data-lumi-pages-preview-state="closed"]
    .lumi-editor-shell__body {
    padding-right: calc(
        var(--lumi-pages-preview-collapsed-width) -
        var(--lumi-pages-preview-edge-offset)
    ) !important;
}

body:has(.lumi-child-page)
    .lumi-child-page.is-pages-preview-open
    .lumi-flashcards-embedded__workspace,
body:has(.lumi-child-page)
    .lumi-child-page.is-pages-preview-open
    .lumi-editor-shell__body {
    padding-right: calc(
        var(--lumi-pages-preview-open-width) -
        var(--lumi-pages-preview-edge-offset)
    ) !important;
}

@media (min-width: 768px) and (max-width: 1440px) {
    body:has(.lumi-child-page) .lumi-child-page {
        --lumi-pages-preview-open-width: var(--lumi-tablet-preview-width);
        --lumi-pages-preview-edge-offset: 24px;
    }

    body:has(.lumi-child-page) .lumi-pages-preview__panel {
        padding-right: 14px;
        padding-left: 14px;
    }

    body:has(.lumi-child-page) .lumi-pages-preview__page-card {
        margin-top: 12px;
    }

    body:has(.lumi-child-page) .lumi-pages-preview__page-frame {
        padding: 12px;
    }
}

@media (max-width: 767px) {
    body:has(.lumi-child-page)
        .lumi-pages-preview[data-lumi-pages-preview-state="closed"]::before {
        display: none;
    }

    body:has(.lumi-child-page)
        .lumi-child-page[data-lumi-pages-preview-state="closed"]
        .lumi-flashcards-embedded__workspace,
    body:has(.lumi-child-page)
        .lumi-child-page[data-lumi-pages-preview-state="closed"]
        .lumi-editor-shell__body {
        padding-right: 0 !important;
    }

    body:has(.lumi-child-page)
        .lumi-child-page.is-pages-preview-open
        .lumi-flashcards-embedded__workspace,
    body:has(.lumi-child-page)
        .lumi-child-page.is-pages-preview-open
        .lumi-editor-shell__body {
        padding-right: 0 !important;
    }

    body:has(.lumi-child-page)
        .lumi-pages-preview[data-lumi-pages-preview-state="closed"]
        button.lumi-pages-preview__trigger {
        top: 118px;
        right: 20px;
        justify-content: flex-start;
        width: auto;
        min-height: 38px;
        padding: 0;
    }

    body:has(.lumi-child-page)
        button.lumi-pages-preview__trigger
        .lumi-pages-preview__toggle-label,
    body:has(.lumi-child-page)
        button.lumi-pages-preview__panel-toggle
        .lumi-pages-preview__toggle-label {
        display: inline !important;
    }

    body:has(.lumi-child-page) button.lumi-pages-preview__panel-toggle {
        width: auto;
        min-height: 38px;
        padding: 0;
        border: 0 !important;
        border-radius: 0;
        background: transparent !important;
    }

    body:has(.lumi-child-page)
        .lumi-pages-preview[data-lumi-pages-preview-state="open"]
        .lumi-pages-preview__toggle-icon {
        transform: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    body:has(.lumi-child-page) .lumi-pages-preview__toggle-icon {
        transition: none !important;
    }
}

/* Compact shared Preview header controls. */
body:has(.lumi-child-page) .lumi-pages-preview__topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 88%;
    margin-left: auto;
    margin-right: auto;
    gap: 12px;
    padding-bottom: 0;
}

body:has(.lumi-child-page) button.lumi-pages-preview__panel-toggle {
    justify-content: center;
    width: 31px;
    min-width: 31px;
    min-height: 31px;
    padding: 5px;
    border: 0 !important;
    border-radius: 0;
    background: transparent !important;
}

body:has(.lumi-child-page) button.lumi-pages-preview__panel-toggle::after {
    display: none;
}

body:has(.lumi-child-page)
    .lumi-pages-preview[data-lumi-pages-preview-state="closed"]
    button.lumi-pages-preview__trigger {
    border: 0 !important;
    background: transparent !important;
}

body:has(.lumi-child-page)
    .lumi-pages-preview__topbar
    .lumi-pages-preview__toggle-icon {
    border: 1.5px solid currentColor;
    border-radius: 3px;
}

body:has(.lumi-child-page)
    .lumi-pages-preview__topbar
    .lumi-pages-preview__toggle-label {
    display: none !important;
}

body:has(.lumi-child-page)
    .lumi-pages-preview[data-lumi-pages-preview-state="open"]
    .lumi-pages-preview__toggle-icon {
    transform: rotate(180deg);
}

body:has(.lumi-child-page) .lumi-pages-preview__actions {
    display: flex;
    justify-content: flex-end;
    margin-top: 0;
    margin-left: auto;
}

body:has(.lumi-child-page) button.lumi-pages-preview__add-page {
    position: relative;
    flex-direction: column;
    gap: 0;
    width: auto;
    min-width: 30px;
    height: auto;
    min-height: 30px;
    padding: 0;
    border: 0 !important;
    border-radius: 0;
    background: transparent !important;
}

body:has(.lumi-child-page) .lumi-pages-preview__add-page-icon {
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    border: 1.5px solid #4e52d8;
    border-radius: 50%;
}

body:has(.lumi-child-page) .lumi-pages-preview__add-page-label {
    display: none;
}

body:has(.lumi-child-page) button.lumi-pages-preview__add-page:focus-visible {
    outline: 2px solid #4e52d8;
    outline-offset: 2px;
}

@media (hover: hover) and (pointer: fine) {
    body:has(.lumi-child-page)
        button.lumi-pages-preview__add-page[data-lumi-tooltip]::after {
        position: absolute;
        z-index: 20;
        top: calc(100% + 8px);
        left: 50%;
        width: max-content;
        padding: 6px 9px;
        border: 1px solid #e4e4ef;
        border-radius: 6px;
        background: #ffffff;
        color: #17172f;
        box-shadow: 0 6px 18px rgba(23, 23, 47, 0.12);
        content: attr(data-lumi-tooltip);
        font-size: 12px;
        font-weight: 600;
        line-height: 1.2;
        opacity: 0;
        pointer-events: none;
        transform: translate(-50%, -2px);
        transition: opacity 140ms ease, transform 140ms ease;
        visibility: hidden;
        white-space: nowrap;
    }

    body:has(.lumi-child-page)
        button.lumi-pages-preview__add-page[data-lumi-tooltip]:hover::after {
        opacity: 1;
        transform: translate(-50%, 0);
        visibility: visible;
    }
}

@media (max-height: 800px) {
    body:has(.lumi-child-page) .lumi-child-page {
        --lumi-pages-preview-open-width: 260px;
        --lumi-tablet-preview-width: 260px;
        grid-template-rows: 64px auto !important;
    }

    body:has(.lumi-child-page) .lumi-child-app-header {
        min-height: 64px !important;
    }

    body:has(.lumi-child-page) .lumi-child-sidebar {
        min-height: calc(100dvh - 64px) !important;
    }

    body:has(.lumi-child-page) .lumi-pages-preview__panel,
    body:has(.lumi-child-page) .lumi-pages-preview__footer {
        width: var(--lumi-pages-preview-open-width) !important;
    }

    body:has(.lumi-child-page) .lumi-pages-preview__panel {
        padding-right: 14px;
        padding-left: 14px;
    }

    body:has(.lumi-child-page) .lumi-pages-preview__page-card {
        margin-top: 12px;
    }

    body:has(.lumi-child-page) .lumi-pages-preview__page-frame {
        padding: 12px;
    }

    body:has(.lumi-child-page) .lumi-pages-preview__footer {
        /* Shrink footer's content box (not its outer width) to match the page-frame's 88% column, centered. */
        padding-right: calc((var(--lumi-pages-preview-open-width) - 0.88 * (var(--lumi-pages-preview-open-width) - 28px)) / 2);
        padding-left: calc((var(--lumi-pages-preview-open-width) - 0.88 * (var(--lumi-pages-preview-open-width) - 28px)) / 2);
    }

    body:has(.lumi-child-page) .lumi-child-app-header {
        min-height: 64px !important;
    }

    body:has(.lumi-child-page) .lumi-child-page {
        grid-template-rows: 64px auto !important;
    }
}