* {
            box-sizing: border-box;
        }

        body {
            margin: 0;
            height: 100vh;
            background: var(--page-bg);
            color: var(--text);
            font-family: "Poppins", sans-serif;
            overflow: hidden;
        }

        body.prism-app-authenticated {
            overflow-x: auto;
            overflow-y: hidden;
        }

        #prismAppShell {
            height: 100%;
            display: flex;
            width: max(100%, var(--prism-app-min-width));
            min-width: var(--prism-app-min-width);
        }

        #prismAppShell[hidden] {
            display: none !important;
        }

        .access-gate {
            position: fixed;
            inset: 0;
            overflow-y: auto;
            overflow-x: hidden;
            padding: 0;
            background:
                radial-gradient(circle at 12% 8%, rgba(191, 219, 254, 0.48), transparent 30%),
                radial-gradient(circle at 88% 14%, rgba(221, 214, 254, 0.34), transparent 26%),
                radial-gradient(circle at 78% 82%, rgba(207, 250, 254, 0.28), transparent 28%),
                linear-gradient(135deg, #f8fafc 0%, #eef5fa 52%, #f8fbff 100%);
            color: #0f172a;
            z-index: 200;
        }

        .access-gate[hidden] {
            display: none !important;
        }

        .access-gate-inner {
            width: min(1200px, calc(100vw - 32px));
            margin: 0 auto;
            padding: 36px 0 44px;
            display: flex;
            flex-direction: column;
            gap: 24px;
        }

        .access-landing-panel {
            border: 1px solid rgba(100, 116, 139, 0.18);
            border-radius: 28px;
            background: rgba(255, 255, 255, 0.86);
            box-shadow: 0 24px 60px rgba(15, 23, 42, 0.12);
            backdrop-filter: blur(18px);
        }

        .access-hero {
            padding: 28px;
            display: grid;
            grid-template-columns: minmax(0, 1.35fr) minmax(320px, 420px);
            gap: 28px;
            align-items: stretch;
        }

        .access-hero-copy {
            display: flex;
            flex-direction: column;
            gap: 18px;
            color: #0f172a;
        }

        .access-hero-brand {
            display: inline-flex;
            align-items: center;
            gap: 14px;
        }

        .access-gate-logo {
            width: 72px;
            height: 72px;
            object-fit: contain;
            flex: 0 0 auto;
        }

        .access-gate-title {
            margin: 0;
            color: #0f172a;
            background: linear-gradient(135deg, #0f172a 0%, #1e3a72 58%, #456a8a 100%);
            -webkit-background-clip: text;
            background-clip: text;
            -webkit-text-fill-color: transparent;
            font-size: 28px;
            font-weight: 600;
            letter-spacing: 0.08em;
        }

        .access-hero-kicker {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            width: fit-content;
            padding: 7px 12px;
            border-radius: 999px;
            background: rgba(69, 106, 138, 0.1);
            color: #3f5f7f;
            font-size: 12px;
            font-weight: 600;
            letter-spacing: 0.06em;
            text-transform: uppercase;
        }

        .access-hero-heading {
            margin: 0;
            max-width: 12ch;
            font-size: clamp(36px, 5vw, 58px);
            line-height: 1.02;
            letter-spacing: -0.04em;
            color: #0f172a;
        }

        .access-gate-copy {
            margin: 0;
            max-width: 62ch;
            color: #475569;
            font-size: 18px;
            line-height: 1.65;
        }

        .access-hero-points {
            margin: 4px 0 0;
            padding: 0;
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 12px;
            list-style: none;
        }

        .access-hero-points li {
            display: flex;
            align-items: flex-start;
            gap: 10px;
            padding: 14px 16px;
            border-radius: 18px;
            background: rgba(248, 250, 252, 0.84);
            border: 1px solid rgba(148, 163, 184, 0.18);
            color: #334155;
            font-size: 14px;
            line-height: 1.5;
        }

        .access-hero-points svg {
            width: 18px;
            height: 18px;
            margin-top: 2px;
            color: #456a8a;
            flex: 0 0 auto;
        }

        .access-login-card {
            padding: 24px 22px 22px;
            display: flex;
            flex-direction: column;
            gap: 14px;
            border-radius: 24px;
            border: 1px solid rgba(100, 116, 139, 0.18);
            background: rgba(255, 255, 255, 0.92);
            box-shadow: 0 22px 50px rgba(15, 23, 42, 0.14);
            text-align: left;
        }

        .access-login-eyebrow {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            color: #456a8a;
            font-size: 12px;
            font-weight: 700;
            letter-spacing: 0.08em;
            text-transform: uppercase;
        }

        .access-login-title {
            margin: 0;
            color: #0f172a;
            font-size: 28px;
            line-height: 1.1;
        }

        .access-login-copy {
            margin: 0;
            color: #475569;
            font-size: 14px;
            line-height: 1.6;
        }

        .access-gate-form {
            width: 100%;
            display: flex;
            flex-direction: column;
            gap: 12px;
        }

        .access-gate-actions {
            width: 100%;
            display: grid;
            grid-template-columns: minmax(0, 1fr);
            gap: 10px;
        }

        .access-gate-oauth {
            width: 100%;
            padding: 13px 16px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 10px;
            border: 1px solid rgba(100, 116, 139, 0.18);
            border-radius: 14px;
            background: rgba(248, 250, 252, 0.96);
            color: #0f172a;
            font: inherit;
            font-weight: 700;
            cursor: pointer;
            box-shadow: 0 12px 24px rgba(15, 23, 42, 0.18);
        }

        .access-gate-oauth:hover {
            background: #ffffff;
            box-shadow: 0 16px 30px rgba(15, 23, 42, 0.22);
            transform: translateY(-1px);
        }

        .access-gate-oauth[hidden] {
            display: none !important;
        }

        .access-gate-oauth svg {
            width: 18px;
            height: 18px;
            flex: 0 0 auto;
        }

        .access-gate-input {
            width: 100%;
            padding: 13px 15px;
            border: 1px solid rgba(100, 116, 139, 0.22);
            border-radius: 14px;
            background: rgba(255, 255, 255, 0.92);
            color: #0f172a;
            font: inherit;
            outline: none;
        }

        .access-gate-input::placeholder {
            color: #94a3b8;
        }

        .access-gate-input:focus {
            border-color: rgba(59, 130, 246, 0.75);
            box-shadow: 0 0 0 3px var(--focus-ring);
        }

        .access-gate-submit {
            width: 100%;
            padding: 13px 16px;
            border: none;
            border-radius: 14px;
            background: linear-gradient(180deg, var(--primary-hover) 0%, var(--primary) 100%);
            color: var(--text-inverse);
            font: inherit;
            font-weight: 600;
            cursor: pointer;
        }

        .access-gate-submit:hover {
            background: linear-gradient(180deg, #60a5fa 0%, var(--primary-hover) 100%);
            box-shadow: 0 12px 26px rgba(37, 99, 235, 0.22);
            transform: translateY(-1px);
        }

        .access-gate-secondary {
            width: 100%;
            padding: 13px 16px;
            border: 1px solid rgba(69, 106, 138, 0.26);
            border-radius: 14px;
            background: linear-gradient(180deg, #456a8a 0%, #334155 100%);
            color: var(--text-inverse);
            font: inherit;
            font-weight: 600;
            cursor: pointer;
        }

        .access-gate-secondary:hover {
            background: linear-gradient(180deg, #3f5f7f 0%, #0f172a 100%);
            box-shadow: 0 12px 24px rgba(15, 23, 42, 0.2);
            transform: translateY(-1px);
        }

        .access-gate-secondary[disabled] {
            border-color: rgba(148, 163, 184, 0.22);
            background: rgba(226, 232, 240, 0.72);
            color: #64748b;
            opacity: 1;
            cursor: not-allowed;
        }

        .access-gate-submit:disabled,
        .access-gate-secondary:disabled,
        .access-gate-oauth:disabled,
        .access-gate-input:disabled {
            opacity: 0.68;
            cursor: wait;
            box-shadow: none;
            transform: none;
        }

        .access-gate-error {
            min-height: 20px;
            margin: 0;
            color: #dc2626;
            font-size: 12px;
            font-weight: 500;
            line-height: 1.4;
        }

        .access-gate-error.is-success {
            color: #2563eb;
        }

        .access-gate-error:empty {
            min-height: 0;
        }

        .access-signup-note {
            margin: -2px 0 0;
            color: #64748b;
            font-size: 12px;
            line-height: 1.5;
        }

        .access-gate-actions .access-gate-secondary[disabled] {
            opacity: 0.92;
            cursor: not-allowed;
        }

        .access-section {
            padding: 28px;
            display: flex;
            flex-direction: column;
            gap: 18px;
        }

        .access-section-head {
            display: flex;
            align-items: flex-end;
            justify-content: space-between;
            gap: 16px;
        }

        .access-section-label {
            margin: 0 0 8px;
            color: #456a8a;
            font-size: 12px;
            font-weight: 700;
            letter-spacing: 0.08em;
            text-transform: uppercase;
        }

        .access-section-title {
            margin: 0;
            color: #0f172a;
            font-size: clamp(28px, 3vw, 38px);
            line-height: 1.08;
            letter-spacing: -0.03em;
        }

        .access-section-copy {
            margin: 8px 0 0;
            max-width: 68ch;
            color: #475569;
            font-size: 15px;
            line-height: 1.7;
        }

        .access-showcase-list {
            display: flex;
            flex-direction: column;
            gap: 20px;
        }

        .access-showcase {
            display: grid;
            grid-template-columns: minmax(0, 1.1fr) minmax(300px, 420px);
            gap: 20px;
            align-items: center;
            padding: 20px;
            border-radius: 24px;
            background: linear-gradient(135deg, rgba(248, 250, 252, 0.96) 0%, rgba(238, 245, 250, 0.86) 100%);
            border: 1px solid rgba(100, 116, 139, 0.16);
        }

        .access-showcase.reverse {
            grid-template-columns: minmax(300px, 420px) minmax(0, 1.1fr);
        }

        .access-showcase.reverse .access-showcase-media {
            order: 2;
        }

        .access-showcase.reverse .access-showcase-copy {
            order: 1;
        }

        .access-showcase-media {
            min-width: 0;
        }

        .access-showcase-media img {
            width: 100%;
            display: block;
            border-radius: 22px;
            border: 1px solid rgba(100, 116, 139, 0.16);
            box-shadow: 0 18px 36px rgba(15, 23, 42, 0.12);
            background: #ffffff;
        }

        .access-showcase-media .access-timers-image {
            width: min(100%, 320px);
            margin-inline: auto;
        }

        .access-showcase-copy {
            display: flex;
            flex-direction: column;
            gap: 12px;
            color: #0f172a;
        }

        .access-showcase-copy h3 {
            margin: 0;
            font-size: clamp(24px, 2.5vw, 32px);
            line-height: 1.12;
            letter-spacing: -0.03em;
        }

        .access-showcase-copy p {
            margin: 0;
            color: #475569;
            font-size: 15px;
            line-height: 1.7;
        }

        .access-feature-grid {
            display: grid;
            grid-template-columns: repeat(5, minmax(0, 1fr));
            gap: 14px;
        }

        .access-feature-card {
            min-height: 152px;
            padding: 18px;
            display: flex;
            flex-direction: column;
            gap: 10px;
            border-radius: 22px;
            background: rgba(255, 255, 255, 0.92);
            border: 1px solid rgba(100, 116, 139, 0.16);
            color: #0f172a;
            box-shadow: 0 14px 30px rgba(15, 23, 42, 0.08);
        }

        .access-feature-card svg {
            width: 20px;
            height: 20px;
            color: #456a8a;
        }

        .access-feature-card h3 {
            margin: 0;
            font-size: 17px;
            line-height: 1.25;
        }

        .access-feature-card p {
            margin: 0;
            color: #475569;
            font-size: 13px;
            line-height: 1.65;
        }

        .access-faq-section {
            gap: 22px;
        }

        .access-faq-grid {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 14px;
        }

        .access-faq-item {
            min-height: 168px;
            padding: 18px;
            border-radius: 20px;
            border: 1px solid rgba(100, 116, 139, 0.16);
            background: rgba(255, 255, 255, 0.92);
            box-shadow: 0 14px 30px rgba(15, 23, 42, 0.08);
        }

        .access-faq-item h3 {
            margin: 0 0 8px;
            color: #0f172a;
            font-size: 17px;
            line-height: 1.25;
            letter-spacing: -0.01em;
        }

        .access-faq-item p {
            margin: 0;
            color: #475569;
            font-size: 13px;
            line-height: 1.65;
        }

        .access-faq-item a {
            color: #0f4fb8;
            font-weight: 700;
            text-decoration: none;
        }

        .access-faq-item a:hover,
        .access-faq-item a:focus-visible {
            color: #0f172a;
            text-decoration: underline;
            outline: none;
        }

        .access-about {
            display: grid;
            grid-template-columns: 180px minmax(0, 1fr);
            gap: 22px;
            align-items: center;
        }

        .access-about-photo {
            width: 180px;
            height: 180px;
            border-radius: 24px;
            object-fit: cover;
            border: 1px solid rgba(100, 116, 139, 0.16);
            box-shadow: 0 18px 38px rgba(15, 23, 42, 0.12);
        }

        .access-about-copy {
            display: flex;
            flex-direction: column;
            gap: 12px;
        }

        .access-about-links {
            display: flex;
            flex-wrap: wrap;
            gap: 10px;
            margin-top: 2px;
        }

        .access-about-link {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-height: 40px;
            padding: 10px 16px;
            border-radius: 999px;
            background: #0f172a;
            color: #ffffff;
            font-size: 14px;
            font-weight: 800;
            text-decoration: none;
        }

        .access-about-link-secondary {
            border: 1px solid rgba(69, 106, 138, 0.22);
            background: rgba(248, 250, 252, 0.9);
            color: #0f172a;
        }

        .access-about-link:hover,
        .access-about-link:focus-visible {
            text-decoration: none;
            transform: translateY(-1px);
        }

        .access-about-connect {
            margin-top: 4px;
            display: flex;
            flex-direction: column;
            gap: 10px;
        }

        .access-about-connect-label {
            color: #475569;
            font-size: 13px;
            font-weight: 600;
            line-height: 1.4;
        }

        .access-about-connect-label strong {
            color: #0f172a;
            font-weight: 600;
        }

        .access-about-socials {
            display: inline-flex;
            align-items: center;
            gap: 10px;
            flex-wrap: wrap;
        }

        .access-about-social {
            width: 40px;
            height: 40px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 12px;
            border: 1px solid rgba(100, 116, 139, 0.16);
            background: rgba(248, 250, 252, 0.88);
            color: #456a8a;
            transition: transform 0.2s ease, color 0.2s ease, border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
        }

        .access-about-social:hover,
        .access-about-social:focus-visible {
            color: #0f172a;
            border-color: rgba(69, 106, 138, 0.34);
            background: rgba(219, 234, 254, 0.62);
            box-shadow: 0 12px 24px rgba(15, 23, 42, 0.16);
            transform: translateY(-2px);
            outline: none;
        }

        .access-about-social svg {
            width: 18px;
            height: 18px;
            display: block;
        }

        .access-about-copy h3,
        .access-status-card h2 {
            margin: 0;
            color: #0f172a;
            font-size: 28px;
            line-height: 1.14;
            letter-spacing: -0.03em;
        }

        .access-about-copy p,
        .access-status-card p {
            margin: 0;
            color: #475569;
            font-size: 15px;
            line-height: 1.75;
        }

        .access-status-card {
            display: flex;
            flex-direction: column;
            gap: 12px;
            padding: 28px;
            border-radius: 24px;
            background: linear-gradient(135deg, rgba(248, 250, 252, 0.96) 0%, rgba(219, 234, 254, 0.36) 100%);
            border: 1px solid rgba(100, 116, 139, 0.16);
        }

        .access-listed-section {
            padding: 0;
        }

        .access-listed-card {
            display: flex;
            flex-direction: column;
            gap: 18px;
            padding: 26px 28px;
            border-radius: 24px;
            border: 1px solid rgba(100, 116, 139, 0.16);
            background: linear-gradient(135deg, rgba(255, 255, 255, 0.94) 0%, rgba(239, 246, 255, 0.72) 100%);
            box-shadow: 0 18px 42px rgba(15, 23, 42, 0.08);
            overflow: hidden;
        }

        .access-listed-heading {
            display: flex;
            flex-direction: column;
            gap: 6px;
        }

        .access-listed-rows {
            display: flex;
            flex-direction: column;
            gap: 16px;
            min-width: 0;
        }

        .access-listed-row {
            display: grid;
            grid-template-columns: 132px minmax(0, 1fr);
            align-items: center;
            gap: 18px;
            min-width: 0;
        }

        .access-listed-row + .access-listed-row {
            padding-top: 14px;
            border-top: 1px solid rgba(100, 116, 139, 0.14);
        }

        .access-listed-row-label {
            margin: 0;
            color: #456a8a;
            font-size: 13px;
            font-weight: 800;
            letter-spacing: 0.08em;
            line-height: 1.2;
            text-transform: uppercase;
        }

        .access-listed-heading h2 {
            margin: 0;
            color: #0f172a;
            font-size: 28px;
            line-height: 1.14;
            letter-spacing: -0.03em;
        }

        .access-listed-strip {
            --listed-badge-height: 42px;
            --listed-badge-gap: 16px;
            position: relative;
            min-width: 0;
            height: 76px;
            display: flex;
            align-items: center;
            gap: var(--listed-badge-gap);
            overflow-x: auto;
            overflow-y: hidden;
            scrollbar-width: none;
            -webkit-overflow-scrolling: touch;
            mask-image: linear-gradient(90deg, transparent 0, #000 42px, #000 calc(100% - 42px), transparent 100%);
        }

        .access-listed-strip::-webkit-scrollbar {
            display: none;
        }

        .access-listed-strip:focus-visible {
            outline: 3px solid rgba(47, 107, 255, 0.28);
            outline-offset: 4px;
        }

        .access-listed-strip::before,
        .access-listed-strip::after {
            content: "";
            position: sticky;
            top: 0;
            z-index: 2;
            width: 42px;
            height: 100%;
            flex: 0 0 42px;
            pointer-events: none;
        }

        .access-listed-strip::before {
            left: 0;
            margin-right: -42px;
            background: linear-gradient(90deg, rgba(248, 250, 252, 0.98), rgba(248, 250, 252, 0));
        }

        .access-listed-strip::after {
            right: 0;
            margin-left: -42px;
            background: linear-gradient(270deg, rgba(239, 246, 255, 0.98), rgba(239, 246, 255, 0));
        }

        .access-listed-track {
            display: flex;
            align-items: center;
            gap: var(--listed-badge-gap);
            flex: 0 0 auto;
            min-width: max-content;
            animation: accessListedMarquee 34s linear infinite;
        }

        .access-listed-strip:hover .access-listed-track,
        .access-listed-strip:focus-visible .access-listed-track,
        .access-listed-strip:has(.access-listed-badge:focus-visible) .access-listed-track {
            animation-play-state: paused;
        }

        .access-listed-badge {
            flex: 0 0 auto;
            height: 58px;
            min-width: 132px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            padding: 8px 10px;
            border-radius: 14px;
            background: rgba(255, 255, 255, 0.72);
            text-decoration: none;
            transition: transform 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
        }

        .access-listed-badge:hover,
        .access-listed-badge:focus-visible {
            transform: translateY(-1px);
            background: #ffffff;
            box-shadow: 0 12px 26px rgba(15, 23, 42, 0.13);
            outline: none;
        }

        .access-listed-badge img {
            width: auto;
            height: var(--listed-badge-height);
            max-width: 190px;
            max-height: var(--listed-badge-height);
            display: block;
            object-fit: contain;
        }

        .access-listed-strip-submitator {
            --listed-badge-height: 44px;
        }

        .access-listed-track-submitator {
            flex-basis: 100%;
            min-width: 100%;
            justify-content: space-around;
            animation-duration: 26s;
        }

        .access-submitator-badge {
            min-width: 214px;
            gap: 8px;
            padding: 8px 13px;
            border: 1px solid rgba(47, 107, 255, 0.24);
            background: #0f172a;
            color: #ffffff;
            box-shadow: 3px 3px 0 rgba(47, 107, 255, 0.28);
        }

        .access-submitator-badge:hover,
        .access-submitator-badge:focus-visible {
            background: #111c33;
            box-shadow: 3px 3px 0 rgba(47, 107, 255, 0.44), 0 12px 26px rgba(15, 23, 42, 0.13);
        }

        .access-submitator-mark {
            width: 22px;
            height: 22px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            color: #93c5fd;
            flex: 0 0 auto;
        }

        .access-submitator-mark svg {
            width: 18px;
            height: 18px;
            display: block;
        }

        .access-submitator-copy {
            display: flex;
            flex-direction: column;
            gap: 3px;
            line-height: 1;
            text-transform: none;
        }

        .access-submitator-copy span {
            color: #93c5fd;
            font-size: 10px;
            font-weight: 700;
            letter-spacing: 0.11em;
            text-transform: uppercase;
        }

        .access-submitator-copy strong {
            color: #ffffff;
            font-size: 15px;
            font-weight: 800;
            letter-spacing: 0.04em;
            text-transform: uppercase;
        }

        @keyframes accessListedMarquee {
            from {
                transform: translateX(0);
            }

            to {
                transform: translateX(calc(-100% - var(--listed-badge-gap)));
            }
        }

        @media (prefers-reduced-motion: reduce) {
            .access-listed-track {
                animation: none;
            }
        }

        @media (max-width: 760px) {
            .access-listed-card {
                gap: 16px;
                padding: 22px;
            }

            .access-listed-row {
                grid-template-columns: 1fr;
                gap: 8px;
            }

            .access-listed-row-label {
                font-size: 12px;
            }

            .access-listed-strip {
                --listed-badge-height: 40px;
                height: 72px;
                margin-inline: -4px;
            }

            .access-listed-heading h2 {
                font-size: 25px;
            }
        }

        .site-footer {
            background: transparent;
            border-top: 1px solid rgba(15, 23, 42, 0.12);
            color: #0f172a;
        }

        .footer-inner {
            width: min(1180px, calc(100vw - 32px));
            margin: 0 auto;
            padding: 3.5rem 0 1.5rem;
        }

        .footer-grid {
            display: grid;
            grid-template-columns: minmax(260px, 1.4fr) repeat(3, minmax(180px, 1fr));
            gap: clamp(2rem, 5vw, 5rem);
            align-items: start;
        }

        .footer-section,
        .footer-brand,
        .footer-list,
        .footer-link {
            min-width: 0;
        }

        .footer-heading {
            margin: 0 0 1.25rem;
            color: #0f172a;
            font-size: 0.85rem;
            font-weight: 800;
            letter-spacing: 0.12em;
            text-transform: uppercase;
        }

        .footer-description {
            max-width: 330px;
            margin: 0 0 1.35rem;
            color: rgba(15, 23, 42, 0.62);
            font-size: 0.95rem;
            line-height: 1.65;
        }

        .footer-list {
            display: flex;
            flex-direction: column;
            align-items: flex-start;
            gap: 0.85rem;
            list-style: none;
            margin: 0;
            padding: 0;
            background: none;
            border: 0;
            box-shadow: none;
            overflow: visible;
        }

        .footer-link {
            display: inline-flex;
            align-items: center;
            width: auto;
            max-width: 100%;
            padding: 0;
            margin: 0;
            border: 0;
            border-radius: 0;
            background: none;
            box-shadow: none;
            color: rgba(15, 23, 42, 0.68);
            font-weight: 600;
            line-height: 1.4;
            text-decoration: none;
            white-space: nowrap;
            transition: color 0.18s ease, opacity 0.18s ease;
        }

        .footer-link:hover,
        .footer-link:focus-visible {
            color: rgba(15, 23, 42, 0.95);
            outline: none;
            text-decoration: underline;
            text-underline-offset: 4px;
        }

        .footer-status {
            display: inline-flex;
            width: fit-content;
            margin-top: 1.25rem;
            padding: 0.45rem 0.75rem;
            border: 1px solid rgba(69, 106, 138, 0.2);
            border-radius: 999px;
            background: transparent;
            color: rgba(15, 23, 42, 0.55);
            font-size: 0.78rem;
            font-weight: 700;
        }

        .footer-bottom {
            margin-top: 3rem;
            padding-top: 1.25rem;
            border-top: 1px solid rgba(15, 23, 42, 0.12);
            color: rgba(15, 23, 42, 0.55);
            font-size: 0.9rem;
            font-weight: 600;
        }

        @media (max-width: 1180px) {
            .access-gate-inner {
                width: min(1040px, calc(100vw - 28px));
            }

            .access-hero,
            .access-showcase,
            .access-showcase.reverse {
                grid-template-columns: 1fr;
            }

            .access-showcase.reverse .access-showcase-media,
            .access-showcase.reverse .access-showcase-copy {
                order: initial;
            }

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

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

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

        nav {
            width: 64px;
            padding: 8px 5px;
            display: flex;
            flex-direction: column;
            align-items: center;
            background:
                linear-gradient(180deg, rgba(37, 99, 235, 0.08), transparent 18%),
                var(--sidebar-bg);
            border-right: 1px solid rgba(148, 163, 184, 0.12);
            overflow-y: auto;
            overflow-x: hidden;
            -webkit-overflow-scrolling: touch;
            scrollbar-width: none;
            -ms-overflow-style: none;
            max-height: 100vh;
        }

        nav::-webkit-scrollbar {
            display: none;
        }

        .nav-logo img {
            width: 45px;
            display: block;
            margin-left: auto;
            margin-right: auto;
            margin-bottom: 8px;
        }

        nav button {
            margin: 8px 0;
            padding: 10px;
            border: none;
            border-radius: 10px;
            background: transparent;
            cursor: pointer;
            transition: 0.2s;
        }

        nav button.active {
            background: rgba(37, 99, 235, 0.26);
            box-shadow: inset 0 0 0 1px rgba(147, 197, 253, 0.16), 0 8px 18px rgba(15, 23, 42, 0.2);
        }

        nav button:hover {
            background: rgba(37, 99, 235, 0.18);
            box-shadow: 0 0 10px rgba(59, 130, 246, 0.2);
            transform: scale(1.05);
        }

        nav button {
            position: relative;
            overflow: visible;
        }

        nav svg {
            width: 22px;
            height: 22px;
            stroke: white;
        }

        .nav-custom-icon {
            width: 22px;
            height: 22px;
            object-fit: contain;
            display: block;
        }

        .nav-quicklinks {
            width: 100%;
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 8px;
        }

        .nav-group-label {
            width: 56px;
            margin: 2px 0 3px;
            color: rgba(226, 232, 240, 0.56);
            font-size: 7px;
            font-weight: 800;
            letter-spacing: 0.1em;
            line-height: 1.15;
            text-align: center;
            text-transform: uppercase;
            overflow-wrap: anywhere;
        }

        .nav-quicklink-button {
            width: 54px;
            min-height: 46px;
            margin: 0;
            padding: 10px 8px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 12px;
            background: rgba(255, 255, 255, 0.04);
            box-shadow: inset 0 0 0 1px rgba(148, 163, 184, 0.1);
        }

        .nav-quicklink-icon-wrap {
            position: relative;
            width: 22px;
            height: 22px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
        }

        .nav-quicklink-icon {
            width: 22px;
            height: 22px;
            border-radius: 6px;
            object-fit: contain;
            display: block;
        }

        .nav-quicklink-fallback {
            position: absolute;
            inset: 0;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            color: rgba(255, 255, 255, 0.86);
        }

        .nav-quicklink-fallback svg {
            width: 18px;
            height: 18px;
        }

        .nav-quicklink-button.has-icon .nav-quicklink-fallback {
            display: none;
        }

        .nav-quicklinks-empty {
            width: 54px;
            padding: 8px 6px;
            border-radius: 12px;
            border: 1px dashed rgba(148, 163, 184, 0.18);
            color: rgba(255, 255, 255, 0.62);
            font-size: 9px;
            line-height: 1.25;
            text-align: center;
        }

        .nav-quicklink-manager {
            position: fixed;
            top: 92px;
            left: 78px;
            z-index: 40;
            width: min(340px, calc(100vw - 108px));
            max-height: calc(100dvh - 124px);
            padding: 14px;
            display: flex;
            flex-direction: column;
            gap: 12px;
            border-radius: 20px;
            border: 1px solid rgba(148, 163, 184, 0.16);
            background: rgba(255, 255, 255, 0.96);
            box-shadow: 0 20px 50px rgba(15, 23, 42, 0.16);
            backdrop-filter: blur(14px);
            overflow: hidden;
        }

        .nav-quicklink-manager[hidden] {
            display: none !important;
        }

        .nav-quicklink-manager button {
            margin: 0;
            transform: none;
        }

        .nav-quicklink-manager button:hover {
            transform: none;
            box-shadow: none;
        }

        .nav-quicklink-manager-head {
            display: flex;
            align-items: flex-start;
            justify-content: space-between;
            gap: 12px;
        }

        .nav-quicklink-manager-title {
            display: flex;
            flex-direction: column;
            gap: 2px;
        }

        .nav-quicklink-manager-title strong {
            font-size: 15px;
            color: var(--navy);
        }

        .nav-quicklink-manager-title span {
            font-size: 12px;
            color: var(--muted);
            line-height: 1.4;
        }

        .nav-quicklink-manager-close {
            width: 34px;
            min-height: 34px;
            margin: 0;
            padding: 0;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 12px;
            border: 1px solid rgba(148, 163, 184, 0.18);
            background: rgba(248, 250, 255, 0.92);
            color: var(--navy);
        }

        .nav-quicklink-status {
            min-height: 18px;
            margin: 0;
            font-size: 12px;
            color: var(--muted);
        }

        .nav-quicklink-status[data-state="error"] {
            color: #b91c1c;
        }

        .nav-quicklink-status[data-state="success"] {
            color: #166534;
        }

        .nav-quicklink-manager-actions {
            display: flex;
            justify-content: flex-end;
        }

        .nav-quicklink-add {
            min-height: 36px;
            padding: 8px 12px;
            border-radius: 12px;
            border: 1px solid rgba(37, 99, 235, 0.16);
            background: rgba(37, 99, 235, 0.1);
            color: var(--primary);
            font-size: 12px;
            font-weight: 700;
        }

        .nav-quicklink-list {
            flex: 1 1 auto;
            min-height: 0;
            display: flex;
            flex-direction: column;
            gap: 10px;
            overflow-y: auto;
            padding-right: 2px;
        }

        .nav-quicklink-list::-webkit-scrollbar {
            width: 8px;
        }

        .nav-quicklink-list::-webkit-scrollbar-thumb {
            background: rgba(148, 163, 184, 0.22);
            border-radius: 999px;
        }

        .nav-quicklink-row {
            padding: 12px;
            display: grid;
            grid-template-columns: 36px minmax(0, 1fr);
            gap: 12px;
            align-items: start;
            border-radius: 16px;
            border: 1px solid rgba(148, 163, 184, 0.16);
            background: rgba(248, 250, 255, 0.9);
        }

        .nav-quicklink-row-icon {
            width: 36px;
            height: 36px;
            border-radius: 12px;
            background: rgba(255, 255, 255, 0.92);
            box-shadow: inset 0 0 0 1px rgba(148, 163, 184, 0.12);
            display: inline-flex;
            align-items: center;
            justify-content: center;
        }

        .nav-quicklink-row-icon img {
            width: 22px;
            height: 22px;
            border-radius: 6px;
            object-fit: contain;
        }

        .nav-quicklink-row-icon svg {
            width: 18px;
            height: 18px;
            color: var(--muted);
        }

        .nav-quicklink-row-main {
            display: flex;
            flex-direction: column;
            gap: 10px;
            min-width: 0;
        }

        .nav-quicklink-row-meta {
            display: flex;
            flex-direction: column;
            gap: 4px;
            min-width: 0;
        }

        .nav-quicklink-row-name {
            font-size: 14px;
            font-weight: 700;
            color: var(--navy);
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }

        .nav-quicklink-row-url {
            font-size: 11px;
            color: var(--muted);
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }

        .nav-quicklink-row-actions {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
        }

        .nav-quicklink-row-actions button,
        .nav-quicklink-form-actions button {
            min-height: 34px;
            padding: 8px 10px;
            border-radius: 12px;
            border: 1px solid rgba(148, 163, 184, 0.18);
            background: white;
            color: var(--navy);
            font-size: 12px;
            font-weight: 700;
        }

        .nav-quicklink-row-actions button.primary,
        .nav-quicklink-form-actions button.primary {
            border-color: rgba(37, 99, 235, 0.16);
            background: var(--primary);
            color: white;
        }

        .nav-quicklink-row-actions button.danger,
        .nav-quicklink-form-actions button.danger {
            color: #b91c1c;
        }

        .nav-quicklink-form {
            padding-top: 2px;
            display: grid;
            gap: 10px;
        }

        .nav-quicklink-form[hidden] {
            display: none !important;
        }

        .nav-quicklink-form label {
            display: grid;
            gap: 5px;
            font-size: 11px;
            font-weight: 700;
            letter-spacing: 0.02em;
            color: var(--muted);
            text-transform: uppercase;
        }

        .nav-quicklink-form input {
            min-width: 0;
            min-height: 38px;
            padding: 9px 12px;
            border-radius: 12px;
            border: 1px solid rgba(148, 163, 184, 0.22);
            background: white;
            color: var(--navy);
            font: inherit;
        }

        .nav-quicklink-form input:focus {
            outline: none;
            border-color: rgba(37, 99, 235, 0.42);
            box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.14);
        }

        .nav-quicklink-form-preview {
            display: flex;
            align-items: center;
            gap: 10px;
            min-height: 24px;
            color: var(--muted);
            font-size: 12px;
        }

        .nav-quicklink-form-preview img {
            width: 20px;
            height: 20px;
            border-radius: 6px;
            object-fit: contain;
        }

        .nav-quicklink-form-preview svg {
            width: 18px;
            height: 18px;
            color: var(--muted);
        }

        .nav-quicklink-form-error {
            min-height: 16px;
            margin: 0;
            font-size: 12px;
            color: #b91c1c;
        }

        .nav-quicklink-form-actions {
            display: flex;
            justify-content: flex-end;
            gap: 8px;
        }

        .nav-quicklink-empty-editor {
            padding: 16px 12px;
            border-radius: 16px;
            border: 1px dashed rgba(148, 163, 184, 0.2);
            color: var(--muted);
            font-size: 12px;
            line-height: 1.5;
            text-align: center;
            background: rgba(248, 250, 255, 0.82);
        }

        .nav-divider {
            width: 60%;
            height: 1px;
            margin: 10px 0;
            background: rgba(148, 163, 184, 0.24);
        }

        .nav-spacer {
            flex: 1;
            min-height: 16px;
        }

        .nav-edit {
            width: 54px;
            min-height: 42px;
            margin: 0;
            padding: 9px 6px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 12px;
            background: rgba(255, 255, 255, 0.08);
            box-shadow: inset 0 0 0 1px rgba(148, 163, 184, 0.12);
        }

        .nav-edit:hover {
            transform: translateY(-1px);
        }

        .nav-edit svg {
            width: 18px;
            height: 18px;
        }

        .nav-edit.is-active {
            background: rgba(37, 99, 235, 0.26);
        }

        .nav-visibility-toggle {
            position: absolute;
            top: -4px;
            right: -4px;
            z-index: 2;
            display: none;
            width: 18px;
            height: 18px;
            align-items: center;
            justify-content: center;
            border-radius: 999px;
            background: rgba(15, 23, 42, 0.88);
            box-shadow: 0 4px 12px rgba(15, 23, 42, 0.2);
        }

        .nav-visibility-toggle input {
            width: 13px;
            height: 13px;
            margin: 0;
            accent-color: white;
        }

        nav.editing .nav-item-button .nav-visibility-toggle {
            display: inline-flex;
        }

        nav.editing .nav-item-button.nav-item-hidden-by-user {
            opacity: 0.42;
        }

        .nav-clock {
            margin-top: 12px;
            padding-top: 12px;
            border-top: 1px solid rgba(148, 163, 184, 0.32);
            color: var(--primary);
            font-size: 16px;
            line-height: 1.4;
            text-align: center;
            opacity: 0.9;
        }

        #clockTime {
            margin-bottom: 6px;
            font-size: 29px;
            font-weight: 600;
        }

        #clockDateWords {
            font-size: 17px;
        }

        .clock-date-meta {
            display: flex;
            justify-content: center;
            gap: 8px;
            font-size: 14px;
        }

        #clockDateNums {
            opacity: 0.8;
        }

        main {
            flex: 1;
            height: 100%;
            padding: 10px;
            min-height: 0;
            min-width: 0;
            background: linear-gradient(180deg, rgba(255, 255, 255, 0.28), rgba(248, 250, 252, 0.05));
        }

        .view {
            display: none;
            height: 100%;
            min-height: 0;
        }

        .view.active {
            display: block;
            min-height: 0;
        }

        #workspaceContainer[hidden] {
            display: none !important;
        }

        .workspace-container {
            display: grid;
            grid-template-columns: minmax(0, 1fr) auto;
            gap: 8px;
            height: 100%;
            min-height: 0;
        }

        .workspace-view {
            grid-column: 1;
            min-width: 0;
        }

        #seatingView.active {
            display: block;
        }

        iframe {
            width: 100%;
            height: 100%;
            border: none;
            border-radius: 10px;
        }

        #slidesFrame {
            height: 100%;
            border-top-left-radius: 0;
            border-top-right-radius: 0;
        }

        .slides-stage {
            position: relative;
            min-height: 0;
            height: 100%;
            overflow: hidden;
        }

        .slides-loaded-controls {
            position: absolute;
            top: 18px;
            left: 50%;
            z-index: 2;
            width: min(780px, calc(100% - 36px));
            transform: translateX(-50%);
            display: flex;
            justify-content: center;
            pointer-events: none;
        }

        .slides-loaded-controls[hidden] {
            display: none !important;
        }

        .slides-loaded-controls-inner {
            width: 100%;
            max-width: 720px;
            padding: 10px 12px;
            border-radius: 22px;
            border: 1px solid rgba(37, 99, 235, 0.12);
            background: rgba(255, 255, 255, 0.94);
            box-shadow: 0 14px 30px rgba(15, 23, 42, 0.08);
            backdrop-filter: blur(10px);
            pointer-events: auto;
        }

        .workspace-stage {
            height: 100%;
            min-height: 0;
            overflow: hidden;
        }

        .slides-empty-state {
            position: absolute;
            inset: 24px;
            z-index: 1;
            display: flex;
            align-items: center;
            justify-content: center;
            pointer-events: none;
        }

        .slides-empty-state[hidden] {
            display: none !important;
        }

        .slides-empty-card {
            width: min(720px, 100%);
            padding: 38px 38px 34px;
            border-radius: 28px;
            border: 1px solid rgba(37, 99, 235, 0.12);
            background:
                linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(248, 250, 252, 0.94)),
                rgba(255, 255, 255, 0.92);
            box-shadow: 0 24px 48px rgba(15, 23, 42, 0.08);
            text-align: center;
            pointer-events: auto;
        }

        .slides-empty-card h3 {
            margin: 0 0 12px;
            color: var(--text-soft);
            font-size: clamp(28px, 3vw, 40px);
            line-height: 1.05;
        }

        .slides-empty-card p {
            margin: 0 auto;
            max-width: 520px;
            color: var(--muted);
            font-size: 16px;
            line-height: 1.55;
        }

        .slides-empty-card p + p {
            margin-top: 8px;
        }

        .slides-empty-chip-row {
            width: min(420px, 100%);
            margin: 22px auto 0;
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            gap: 12px;
        }

        .slides-empty-chip,
        .slides-help-chip {
            min-width: 132px;
            padding: 12px 16px;
            border-radius: 18px;
            border: 1px solid rgba(37, 99, 235, 0.12);
            background: rgba(241, 245, 249, 0.94);
            color: var(--navy);
            font-size: 14px;
            font-weight: 600;
            letter-spacing: 0.01em;
        }

        .slides-help-chip {
            box-shadow: none;
            transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease, transform 0.18s ease;
        }

        .slides-help-chip:hover,
        .slides-help-chip.is-active {
            background: rgba(37, 99, 235, 0.1);
            border-color: rgba(37, 99, 235, 0.22);
            color: var(--primary);
            transform: translateY(-1px);
        }

        .slides-entry-panel {
            width: min(640px, 100%);
            margin: 24px auto 0;
            display: flex;
            flex-direction: column;
            gap: 0;
        }

        .slides-help-box {
            width: min(640px, 100%);
            margin: 14px auto 0;
            padding: 16px 18px;
            border-radius: 20px;
            border: 1px solid rgba(37, 99, 235, 0.12);
            background: rgba(248, 250, 255, 0.96);
            text-align: left;
            box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72);
        }

        .slides-help-box[hidden] {
            display: none !important;
        }

        .slides-help-box h4 {
            margin: 0 0 8px;
            color: var(--text-soft);
            font-size: 15px;
            font-weight: 700;
        }

        .slides-help-box ol,
        .slides-help-box ul {
            margin: 0;
            padding-left: 18px;
            color: var(--muted);
            font-size: 13px;
            line-height: 1.6;
        }

        .slides-help-box li + li {
            margin-top: 3px;
        }

        .panel-shell {
            grid-column: 2;
            display: grid;
            grid-template-columns: 18px minmax(0, 1fr);
            gap: 6px;
            width: var(--prism-side-panel-width);
            flex: 0 0 var(--prism-side-panel-width);
            min-width: var(--prism-side-panel-width);
            height: 100%;
            min-height: 0;
            transition: width 0.24s ease, flex-basis 0.24s ease, min-width 0.24s ease;
        }

        .panel-shell.collapsed {
            width: 18px;
            flex-basis: 18px;
            min-width: 18px;
            gap: 0;
        }

        .panel-handle {
            width: 18px;
            height: 100%;
            padding: 0;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 10px;
            background: rgba(255, 255, 255, 0.9);
            color: var(--muted);
            box-shadow: var(--card-shadow);
            border: 1px solid var(--border);
        }

        .panel-handle:hover {
            background: rgba(255, 255, 255, 1);
            box-shadow: 0 8px 18px rgba(37, 99, 235, 0.12);
            transform: none;
        }

        .panel-handle svg {
            width: 14px;
            height: 14px;
            stroke: currentColor;
            transition: transform 0.24s ease;
        }

        .panel-shell.collapsed .panel-handle svg {
            transform: rotate(180deg);
        }

        .panel {
            display: flex;
            flex-direction: column;
            height: 100%;
            gap: 8px;
            min-height: 0;
            min-width: 0;
            overflow-y: auto;
            overflow-x: hidden;
            -webkit-overflow-scrolling: touch;
            scrollbar-width: none;
            -ms-overflow-style: none;
            touch-action: pan-y;
            overscroll-behavior: contain;
            transition: opacity 0.18s ease, transform 0.24s ease;
        }

        .panel::-webkit-scrollbar {
            display: none;
        }

        .panel-shell.collapsed .panel {
            opacity: 0;
            pointer-events: none;
            transform: translateX(10px);
            overflow: hidden;
        }

        .panel-clock {
            flex: 0 0 auto;
            padding: 2px 1px 7px;
        }

        .panel-lesson-title {
            display: flex;
            flex-direction: column;
            gap: 4px;
            text-align: center;
            padding: 2px 4px 0;
            min-width: 0;
        }

        .panel-lesson-label {
            font-size: 10px;
            font-weight: 700;
            letter-spacing: 0.08em;
            text-transform: uppercase;
            color: var(--muted);
        }

        .panel-lesson-name {
            font-size: 17px;
            line-height: 1.2;
            font-weight: 700;
            color: var(--text-soft);
            word-break: break-word;
            overflow-wrap: anywhere;
        }

        .panel-clock-divider {
            height: 1px;
            margin-top: 5px;
            background: var(--slate-divider);
        }

        .card {
            position: relative;
            flex: 0 0 auto;
            padding: 8px;
            min-width: 0;
            max-width: 100%;
            overflow: hidden;
            isolation: isolate;
            background:
                linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(248, 250, 252, 0.96) 100%);
            border: 1px solid var(--border);
            border-radius: 12px;
            box-shadow: var(--card-shadow);
        }

        .card::before {
            content: "";
            position: absolute;
            top: 10px;
            right: 12px;
            width: 34px;
            height: 34px;
            background: var(--prism-glint);
            clip-path: polygon(100% 0, 0 0, 100% 100%);
            opacity: 0.45;
            pointer-events: none;
        }

        .card-title {
            margin: 0;
            color: var(--muted);
            font-size: 10px;
            font-weight: 600;
            letter-spacing: 0.1em;
            position: relative;
        }

        .card-toggle {
            width: 100%;
            padding: 0;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 12px;
            background: transparent;
            color: inherit;
            box-shadow: none;
            transform: none;
        }

        .card-toggle:hover {
            background: transparent;
            box-shadow: none;
            transform: none;
        }

        .card-toggle:focus-visible {
            outline: 2px solid var(--focus-ring);
            outline-offset: 4px;
        }

        .card-toggle-icon {
            width: 16px;
            height: 16px;
            color: var(--muted);
            transition: transform 0.2s ease;
        }

        .card.collapsed .card-toggle-icon {
            transform: rotate(-90deg);
        }

        .card-body {
            margin-top: 5px;
            min-width: 0;
            max-width: 100%;
            overflow-x: hidden;
        }

        .card-body[hidden] {
            display: none !important;
        }

        .utility-cards-list {
            display: flex;
            flex-direction: column;
            flex: 0 0 auto;
            gap: 8px;
            min-height: 0;
        }

        .card-visibility-toggle {
            position: absolute;
            top: 10px;
            right: 38px;
            z-index: 3;
            display: none;
            width: 18px;
            height: 18px;
            align-items: center;
            justify-content: center;
        }

        .card-visibility-toggle input {
            width: 15px;
            height: 15px;
            margin: 0;
            accent-color: var(--primary);
        }

        .utility-cards-list.editing .card {
            cursor: grab;
        }

        .utility-cards-list.editing .card-toggle {
            cursor: grab;
        }

        .utility-cards-list.editing .card-toggle-icon {
            opacity: 0.35;
        }

        .utility-cards-list.editing .card-visibility-toggle {
            display: inline-flex;
        }

        .utility-cards-list.editing .card.card-hidden-by-user {
            opacity: 0.46;
        }

        .utility-cards-list.editing .card.dragging-card {
            opacity: 0.6;
            box-shadow: 0 10px 26px rgba(15, 23, 42, 0.16);
        }

        .calendar-widget {
            display: flex;
            flex-direction: column;
            gap: 8px;
        }

        .calendar-header {
            display: grid;
            grid-template-columns: 28px 1fr 28px;
            align-items: center;
            gap: 6px;
        }

        .calendar-nav,
        .calendar-year-button,
        .calendar-year-shift,
        .calendar-year-option {
            padding: 0;
            border-radius: 10px;
            background: transparent;
            color: var(--primary);
            box-shadow: none;
            transform: none;
        }

        .calendar-nav:hover,
        .calendar-year-button:hover,
        .calendar-year-shift:hover,
        .calendar-year-option:hover {
            background: rgba(37, 99, 235, 0.08);
            box-shadow: none;
            transform: none;
        }

        .calendar-nav {
            width: 28px;
            height: 28px;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .calendar-nav svg {
            width: 16px;
            height: 16px;
            stroke: currentColor;
        }

        .calendar-title {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 6px;
            min-width: 0;
            font-size: 13px;
            font-weight: 600;
            color: var(--text);
        }

        .calendar-month-label {
            white-space: nowrap;
        }

        .calendar-year-button {
            padding: 3px 6px;
            font-size: 13px;
            font-weight: 600;
            color: var(--primary);
        }

        .calendar-year-picker {
            display: flex;
            flex-direction: column;
            gap: 6px;
            padding: 8px;
            border: 1px solid var(--border);
            border-radius: 12px;
            background: rgba(255, 255, 255, 0.76);
        }

        .calendar-year-picker[hidden] {
            display: none !important;
        }

        .calendar-year-toolbar {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 6px;
        }

        .calendar-year-range {
            color: var(--muted);
            font-size: 11px;
            font-weight: 600;
            letter-spacing: 0.04em;
        }

        .calendar-year-shift {
            padding: 3px 6px;
            font-size: 11px;
            font-weight: 600;
            color: var(--primary);
        }

        .calendar-year-grid {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 5px;
        }

        .calendar-year-option {
            padding: 6px 5px;
            border-radius: 10px;
            color: var(--muted);
            font-size: 11px;
            font-weight: 600;
            text-align: center;
        }

        .calendar-year-option.active {
            background: rgba(37, 99, 235, 0.12);
            color: var(--primary);
        }

        .calendar-weekdays,
        .calendar-grid {
            display: grid;
            grid-template-columns: repeat(7, 1fr);
            gap: 4px;
        }

        .calendar-weekday {
            color: #6b7280;
            font-size: 11px;
            font-weight: 500;
            text-align: center;
        }

        .calendar-day {
            min-height: 38px;
            display: flex;
            align-items: center;
            justify-content: center;
            border: 1px solid rgba(203, 213, 225, 0.8);
            border-radius: 10px;
            background: #fbfcff;
            color: var(--text);
            font-size: 13px;
            font-weight: 500;
        }

        .calendar-day.outside {
            color: #c4c9d4;
            background: #f7f8fb;
        }

        .calendar-day.today {
            border-color: var(--primary);
            background: var(--primary);
            color: white;
            font-weight: 600;
        }

        .voice-level-widget {
            display: flex;
            flex-direction: column;
            gap: 8px;
        }

        .voice-level-shell {
            display: grid;
            grid-template-columns: 28px minmax(0, 1fr) 28px;
            align-items: center;
            gap: 6px;
        }

        .voice-level-nav {
            width: 28px;
            height: 28px;
            padding: 0;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 10px;
            background: transparent;
            color: var(--primary);
            box-shadow: none;
            transform: none;
        }

        .voice-level-nav:hover {
            background: rgba(37, 99, 235, 0.08);
            box-shadow: none;
            transform: none;
        }

        .voice-level-nav svg {
            width: 16px;
            height: 16px;
            stroke: currentColor;
        }

        .voice-level-stage {
            display: flex;
            justify-content: center;
            min-width: 0;
        }

        .voice-level-image {
            display: block;
            width: min(100%, 168px);
            height: auto;
            aspect-ratio: 1 / 1;
            object-fit: contain;
        }

        .qr-widget {
            display: flex;
            flex-direction: column;
            gap: 8px;
        }

        .qr-input-row,
        .qr-action-row {
            display: flex;
            gap: 6px;
        }

        .qr-input-row input {
            width: 100%;
            padding: 7px 9px;
            border: 1px solid var(--border);
            border-radius: 8px;
            font: inherit;
            font-size: 14px;
        }

        .qr-input-row button,
        .qr-action-row button {
            flex-shrink: 0;
        }

        .qr-display {
            min-height: 176px;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            padding: 12px;
            border: 1px dashed rgba(51, 65, 85, 0.18);
            border-radius: 16px;
            background: linear-gradient(180deg, rgba(37, 99, 235, 0.04), rgba(255, 255, 255, 0.92));
            transition: min-height 0.2s ease, padding 0.2s ease;
        }

        .qr-display.large {
            min-height: 260px;
            padding: 18px;
        }

        .qr-placeholder {
            max-width: 220px;
            color: var(--muted);
            font-size: 12px;
            text-align: center;
            line-height: 1.4;
        }

        .qr-output {
            display: flex;
            align-items: center;
            justify-content: center;
            min-width: 0;
            min-height: 0;
            border-radius: 12px;
            background: white;
            box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08);
            overflow: hidden;
        }

        .qr-output img,
        .qr-output canvas {
            display: block;
            max-width: 100%;
            height: auto;
        }

        .qr-output[hidden],
        .qr-placeholder[hidden] {
            display: none !important;
        }

        .slide-bar {
            display: flex;
            gap: 8px;
        }

        .slide-summary {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 8px;
            min-width: 0;
        }

        .slide-status {
            color: var(--muted);
            font-size: 13px;
            font-weight: 600;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }

        .slide-summary button {
            flex-shrink: 0;
        }

        .slide-summary-actions {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            flex-shrink: 0;
        }

        .slide-bar[hidden],
        .slide-summary[hidden] {
            display: none !important;
        }

        .slide-bar input,
        textarea,
        select {
            width: 100%;
            padding: 7px 9px;
            border: 1px solid var(--border);
            border-radius: 8px;
            background: rgba(255, 255, 255, 0.94);
            color: var(--text-soft);
            font: inherit;
            font-size: 14px;
        }

        input:focus,
        textarea:focus,
        select:focus {
            outline: none;
            border-color: rgba(37, 99, 235, 0.44);
            box-shadow: 0 0 0 3px var(--focus-ring);
        }

        textarea {
            resize: vertical;
            min-height: 82px;
        }

        button {
            padding: 5px 9px;
            border: none;
            border-radius: 8px;
            background: linear-gradient(180deg, var(--slate-surface-soft) 0%, var(--slate-surface) 100%);
            color: var(--text-inverse);
            font: inherit;
            font-size: 14px;
            line-height: 1.2;
            cursor: pointer;
            box-shadow: 0 10px 22px rgba(15, 23, 42, 0.12);
            transition: background-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease, border-color 0.2s ease;
        }

        .slide-bar button,
        .qr-input-row button,
        .primary,
        .rewards-action-button,
        .rewards-spend-tabs button.active,
        .access-gate-submit {
            background: linear-gradient(180deg, var(--primary-hover) 0%, var(--primary) 100%);
            color: var(--text-inverse);
            font-weight: 600;
        }

        .slide-bar button:hover,
        .qr-input-row button:hover,
        .primary:hover,
        .rewards-action-button:hover,
        .rewards-spend-tabs button.active:hover,
        .access-gate-submit:hover {
            background: linear-gradient(180deg, #60a5fa 0%, var(--primary-hover) 100%);
            box-shadow: 0 0 14px rgba(37, 99, 235, 0.22);
            transform: translateY(-1px);
        }

        button:hover {
            background: linear-gradient(180deg, #475569 0%, var(--slate-surface-soft) 100%);
            box-shadow: 0 0 12px rgba(15, 23, 42, 0.16);
            transform: translateY(-1px);
        }

        .timer-controls button,
        .timer-buttons button.active-timer {
            background: linear-gradient(180deg, #fcd34d 0%, var(--gold) 100%);
            color: #7c2d12;
            font-weight: 700;
        }

        .timer-controls button:hover,
        .timer-buttons button.active-timer:hover {
            background: linear-gradient(180deg, #fddf7a 0%, #f59e0b 100%);
            box-shadow: 0 0 12px rgba(251, 191, 36, 0.24);
            transform: translateY(-1px);
        }

        .timer-display {
            color: var(--primary);
            font-size: 46px;
            font-weight: 600;
            text-align: center;
            transition: color 0.2s ease, transform 0.2s ease;
        }

        .timer-bar {
            height: 10px;
            margin: 6px 0 10px;
            overflow: hidden;
            background: #eeeeee;
            border-radius: 10px;
        }

        .timer-progress {
            height: 100%;
            width: 0;
            background: linear-gradient(90deg, #fbbf24 0%, #f59e0b 100%);
            transition: width 0.2s linear, background-color 0.2s ease;
        }

        .timer-display.warning {
            color: var(--warning);
        }

        .timer-progress.warning {
            background: linear-gradient(90deg, var(--warning-soft), var(--warning));
        }

        .timer-display.warning-pulse {
            animation: timer-warning-pulse 0.6s ease-out;
        }

        @keyframes timer-warning-pulse {
            50% {
                transform: scale(1.03);
            }

            100% {
                transform: scale(1);
            }
        }

        .timer-buttons {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 4px;
        }

        .timer-controls {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 5px;
            margin-top: 6px;
        }

        .timer-buttons button,
        .timer-controls button {
            min-height: 30px;
            padding-top: 4px;
            padding-bottom: 4px;
            font-size: 13px;
        }

        .timer-end {
            position: absolute;
            inset: 0;
            z-index: 5;
            display: none;
            justify-content: center;
            align-items: center;
            border-radius: inherit;
            background: rgba(15, 23, 42, 0.92);
            color: #fde68a;
            font-size: 40px;
            animation: pulse 1.5s infinite;
            pointer-events: auto;
        }

        @keyframes pulse {
            50% {
                transform: scale(1.05);
            }
        }

        .name-picker-shell {
            display: flex;
            flex-direction: column;
            gap: 8px;
            min-width: 0;
            max-width: 100%;
            overflow-x: hidden;
        }

        .name-input-section {
            display: flex;
            flex-direction: column;
            gap: 6px;
        }

        .name-input-actions,
        .name-picker-toolbar,
        .name-picker-secondary-row,
        .name-picker-batch-meta,
        .name-picker-batch-actions,
        .name-picker-award-row {
            display: flex;
            flex-wrap: wrap;
            gap: 6px;
        }

        .name-input-actions button {
            flex: 1;
        }

        .name-picker-toolbar {
            display: grid;
            grid-template-columns: minmax(0, 1fr) auto;
            gap: 5px;
            align-items: stretch;
        }

        .name-picker-manage-controls[hidden] {
            display: none !important;
        }

        .name-picker-secondary-row {
            display: grid;
            grid-template-columns: minmax(0, 1fr) repeat(3, 36px);
            align-items: center;
            gap: 4px;
            min-width: 0;
            max-width: 100%;
        }

        .name-picker-checkbox {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 6px;
            min-height: 36px;
            min-width: 0;
            max-width: 100%;
            padding: 0 10px;
            border: 1px solid rgba(30, 58, 138, 0.12);
            border-radius: 8px;
            background:
                linear-gradient(180deg, rgba(248, 250, 252, 0.98) 0%, rgba(255, 255, 255, 0.98) 100%);
            box-shadow: 0 12px 24px rgba(30, 58, 138, 0.08);
            color: var(--muted);
            font-size: 12px;
            font-weight: 600;
            white-space: nowrap;
            overflow: hidden;
        }

        .name-picker-checkbox input {
            margin: 0;
            flex: 0 0 auto;
        }

        .name-picker-checkbox:hover {
            border-color: rgba(30, 58, 138, 0.2);
            box-shadow: 0 16px 28px rgba(30, 58, 138, 0.1);
        }

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

        .name-picker-secondary-row button,
        .name-picker-toolbar button,
        .name-picker-toolbar select {
            min-width: 0;
        }

        .name-picker-secondary-row > * {
            min-width: 0;
            max-width: 100%;
        }

        .name-picker-toolbar select {
            padding: 6px 9px;
            font-size: 12px;
        }

        .name-picker-toolbar button {
            padding: 6px 10px;
            font-size: 11.5px;
            line-height: 1.15;
            letter-spacing: 0;
            white-space: nowrap;
        }

        .name-picker-icon-button {
            width: 36px;
            height: 36px;
            padding: 0;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-width: 36px;
            flex: 0 0 36px;
        }

        .name-picker-icon-button svg {
            width: 15px;
            height: 15px;
            stroke: currentColor;
        }

        .name-picker-pick-button {
            font-size: 0;
        }

        .name-picker-summary-row {
            display: grid;
            grid-template-columns: minmax(0, 1fr);
            align-items: center;
            gap: 6px;
            min-width: 0;
            max-width: 100%;
        }

        .name-picker-class-hint {
            min-height: 18px;
            min-width: 0;
            max-width: 100%;
            overflow: hidden;
            text-overflow: ellipsis;
            color: var(--muted);
            font-size: 11px;
            text-align: center;
            white-space: nowrap;
        }

        .name-picker-manage-button {
            width: 28px;
            height: 28px;
            padding: 0;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 10px;
            background: transparent;
            color: var(--muted);
            box-shadow: none;
            transform: none;
        }

        .name-picker-manage-button:hover {
            background: rgba(37, 99, 235, 0.08);
            box-shadow: none;
            transform: none;
        }

        .name-picker-manage-button.is-active {
            background: rgba(37, 99, 235, 0.12);
            color: var(--primary);
        }

        .name-picker-manage-button svg {
            width: 15px;
            height: 15px;
            stroke: currentColor;
        }

        .name-picker-focus-card,
        .name-picker-quick-reward-card,
        .name-picker-batch-bar {
            padding: 10px;
            border: 1px solid var(--border);
            border-radius: 12px;
            background:
                linear-gradient(180deg, rgba(248, 250, 252, 0.98) 0%, rgba(241, 245, 249, 0.96) 100%);
            box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7), 0 8px 20px rgba(15, 23, 42, 0.04);
        }

        .name-picker-focus-card[hidden],
        .name-picker-quick-reward-card[hidden],
        .name-picker-batch-bar[hidden] {
            display: none !important;
        }

        .name-picker-focus-eyebrow {
            color: var(--muted);
            font-size: 10px;
            font-weight: 600;
            letter-spacing: 0.08em;
            text-transform: uppercase;
            text-align: center;
        }

        #chosen {
            margin: 4px 0 0;
            font-size: 28px;
            font-weight: 600;
            text-align: center;
            line-height: 1.1;
        }

        .name-picker-focus-balance,
        .name-picker-quick-reward-balance,
        .name-picker-selection-meta {
            color: var(--gold-strong);
            font-size: 12px;
            font-weight: 600;
            text-align: center;
        }

        .name-picker-award-row {
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            margin-top: 8px;
            gap: 6px;
        }

        .name-picker-award-row button {
            width: 100%;
            padding-left: 0;
            padding-right: 0;
        }

        .name-picker-quick-reward-head {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 8px;
        }

        .name-picker-inline-close {
            width: 28px;
            height: 28px;
            padding: 0;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: transparent;
            color: var(--muted);
            box-shadow: none;
            transform: none;
        }

        .name-picker-inline-close:hover {
            background: rgba(30, 58, 138, 0.08);
            box-shadow: none;
            transform: none;
        }

        .name-picker-inline-close svg {
            width: 15px;
            height: 15px;
            stroke: currentColor;
        }

        .name-picker-quick-reward-name {
            margin-top: 2px;
            color: #0f172a;
            font-size: 18px;
            font-weight: 600;
            text-align: center;
        }

        .name-picker-batch-bar {
            display: flex;
            flex-direction: column;
            gap: 8px;
        }

        .name-picker-batch-meta {
            align-items: center;
            justify-content: space-between;
        }

        .name-picker-batch-actions {
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            gap: 6px;
        }

        .name-picker-batch-actions button {
            width: 100%;
            padding-left: 0;
            padding-right: 0;
        }

        .name-list {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 6px;
            min-width: 0;
            max-width: 100%;
        }

        .name-chip {
            position: relative;
            min-width: 0;
            padding: 10px 10px 9px;
            display: flex;
            flex-direction: column;
            align-items: flex-start;
            gap: 3px;
            border: 1px solid rgba(148, 163, 184, 0.28);
            border-radius: 12px;
            background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
            color: var(--text);
            box-shadow: none;
            transform: none;
            text-align: left;
        }

        .name-chip:hover {
            background: linear-gradient(180deg, #ffffff 0%, #eef4ff 100%);
            box-shadow: 0 10px 20px rgba(37, 99, 235, 0.08);
        }

        .name-chip-name {
            width: 100%;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            font-size: 14px;
            font-weight: 600;
        }

        .name-chip-balance {
            color: var(--muted);
            font-size: 11px;
            font-weight: 500;
        }

        .name-chip.used .name-chip-name,
        .name-chip.used .name-chip-balance {
            color: var(--muted-light);
            text-decoration: line-through;
        }

        .name-chip.selected {
            border-color: rgba(37, 99, 235, 0.62);
            background: rgba(37, 99, 235, 0.12);
            box-shadow: inset 0 0 0 1px rgba(37, 99, 235, 0.16);
        }

        .name-chip.focused {
            border-color: rgba(251, 191, 36, 0.56);
            background: rgba(251, 191, 36, 0.12);
            box-shadow: inset 0 0 0 1px rgba(251, 191, 36, 0.18);
        }

        .name-chip.reward-flash {
            animation: namePickerRewardPulse 0.9s ease;
        }

        .name-chip.reward-flash .name-chip-balance {
            animation: namePickerRewardBalancePulse 0.9s ease;
        }

        .name-chip-reward-badge {
            position: absolute;
            right: 10px;
            top: 50%;
            z-index: 2;
            padding: 4px 8px;
            border-radius: 999px;
            background: rgba(250, 204, 21, 0.96);
            color: #172554;
            font-size: 11px;
            font-weight: 700;
            line-height: 1;
            box-shadow: 0 8px 18px rgba(250, 204, 21, 0.24);
            pointer-events: none;
            transform: translateY(-50%);
            animation: namePickerRewardFloat 0.95s ease forwards;
        }

        @keyframes namePickerRewardFloat {
            0% {
                opacity: 0;
                transform: translateY(-34%) scale(0.9);
            }

            18% {
                opacity: 1;
                transform: translateY(-58%) scale(1);
            }

            100% {
                opacity: 0;
                transform: translateY(-130%) scale(1.02);
            }
        }

        @keyframes namePickerRewardPulse {
            0%,
            100% {
                box-shadow: none;
            }

            35% {
                box-shadow: 0 0 0 2px rgba(250, 204, 21, 0.22), 0 10px 20px rgba(30, 58, 138, 0.12);
                border-color: rgba(250, 204, 21, 0.7);
                background: rgba(250, 204, 21, 0.16);
            }
        }

        @keyframes namePickerRewardBalancePulse {
            0%,
            100% {
                color: var(--muted);
                transform: translateY(0);
            }

            35% {
                color: #172554;
                transform: translateY(-1px);
            }
        }

        .sound-controls {
            position: relative;
            margin-top: 10px;
            padding: 0;
            display: flex;
            flex-direction: column;
            gap: 7px;
            border: none;
            background: transparent;
            box-shadow: none;
        }

        .sound-controls-heading {
            margin: 0;
            color: var(--accent);
            font-size: 10px;
            font-weight: 700;
            letter-spacing: 0.14em;
            line-height: 1;
            text-transform: uppercase;
        }

        .sound-controls-row {
            position: relative;
            z-index: 1;
            display: grid;
            grid-template-columns: minmax(0, 1fr);
            gap: 8px;
        }

        .sound-select-shell {
            position: relative;
            min-width: 0;
            display: flex;
            align-items: center;
            min-height: 42px;
            border: 1px solid color-mix(in srgb, var(--accent) 42%, var(--border));
            border-radius: 13px;
            background: color-mix(in srgb, var(--surface) 92%, white);
            color: var(--text-main);
        }

        .sound-select-shell::after {
            content: "";
            position: absolute;
            right: 13px;
            width: 9px;
            height: 9px;
            border-right: 2px solid var(--accent);
            border-bottom: 2px solid var(--accent);
            transform: translateY(-2px) rotate(45deg);
            pointer-events: none;
        }

        .sound-select-shell select {
            flex: 1;
            min-width: 0;
            width: 100%;
            min-height: 42px;
            padding: 0 34px 0 14px;
            border: none;
            border-radius: 13px;
            appearance: none;
            -webkit-appearance: none;
            background: transparent;
            color: var(--text-main);
            font: inherit;
            font-size: 13px;
            font-weight: 700;
            outline: none;
        }

        .sound-select-shell select:focus-visible {
            box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 18%, transparent);
        }

        :root[data-prism-theme="midnight"] .sound-controls {
            background: transparent;
            border-color: transparent;
        }

        :root[data-prism-theme="midnight"] .sound-select-shell {
            background: #0f172a;
            color: #f8fafc;
            border-color: #475569;
        }

        :root[data-prism-theme="midnight"] .sound-select-shell select {
            color: #f8fafc;
        }

        #timerCard .card-body {
            margin-top: 4px;
        }

        .workspace-view {
            height: 100%;
        }

        .app-view {
            height: 100%;
            min-height: 0;
            overflow-y: auto;
            overflow-x: hidden;
            padding-right: 4px;
        }

        .app-view::-webkit-scrollbar {
            width: 10px;
        }

        .app-view::-webkit-scrollbar-thumb {
            background: rgba(148, 163, 184, 0.24);
            border-radius: 999px;
        }

        .prism-home-shell,
        .prism-account-shell {
            display: flex;
            flex-direction: column;
            gap: 12px;
            min-height: 100%;
        }

        .prism-home-hero,
        .prism-account-hero {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 18px;
            padding: 18px 22px;
        }

        .prism-home-hero-copy {
            display: flex;
            align-items: center;
            gap: 18px;
            min-width: 0;
        }

        .prism-home-logo {
            width: 72px;
            height: 72px;
            object-fit: contain;
            flex: 0 0 auto;
        }

        .prism-home-hero-text,
        .prism-account-hero > div:first-child {
            display: flex;
            flex-direction: column;
            gap: 6px;
            min-width: 0;
        }

        .prism-home-eyebrow,
        .prism-home-card-label {
            margin: 0;
            color: var(--muted);
            font-size: 11px;
            font-weight: 700;
            letter-spacing: 0.1em;
            text-transform: uppercase;
        }

        .prism-home-hero-text h2,
        .prism-account-hero h2,
        .prism-home-card-title {
            margin: 0;
            color: var(--text-soft);
            font-size: 28px;
            line-height: 1.08;
            font-weight: 700;
        }

        .prism-home-card-title {
            font-size: 22px;
        }

        .prism-home-hero p,
        .prism-account-hero p,
        .prism-home-card-copy {
            margin: 0;
            color: var(--muted);
            font-size: 14px;
            line-height: 1.55;
        }

        .prism-home-hero-actions,
        .prism-home-hero-buttons {
            display: flex;
            flex-direction: column;
            align-items: flex-end;
            gap: 8px;
            flex-shrink: 0;
        }

        .prism-home-hero-buttons {
            flex-direction: row;
            flex-wrap: wrap;
            justify-content: flex-end;
        }

        .prism-home-account-pill {
            padding: 10px 14px;
            display: inline-flex;
            flex-direction: column;
            align-items: flex-end;
            gap: 2px;
            border-radius: 16px;
            background: rgba(37, 99, 235, 0.08);
            border: 1px solid rgba(37, 99, 235, 0.12);
            color: var(--muted);
            font-size: 11px;
            text-align: right;
        }

        .prism-home-account-pill strong,
        .prism-home-summary-block strong {
            color: var(--text-soft);
            font-size: 15px;
            font-weight: 700;
        }

        .prism-home-grid,
        .prism-account-grid {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 12px;
            min-height: 0;
        }

        .prism-home-grid {
            align-items: start;
        }

        .prism-account-card-wide {
            grid-column: 1 / -1;
        }

        .prism-home-card,
        .prism-account-card {
            display: flex;
            flex-direction: column;
            gap: 12px;
            padding: 18px;
        }

        .prism-version-card {
            justify-content: space-between;
        }

        .prism-version-name {
            margin: 0;
            color: var(--text-soft);
            font-size: 24px;
            line-height: 1.1;
        }

        .prism-version-detail {
            margin: 6px 0 0;
            color: var(--muted);
            font-size: 15px;
            font-weight: 700;
        }

        .prism-version-summary strong {
            font-size: 14px;
        }

        .prism-home-card-head {
            display: flex;
            align-items: flex-start;
            justify-content: space-between;
            gap: 14px;
        }

        .prism-home-card-actions {
            display: inline-flex;
            align-items: center;
            gap: 10px;
            flex-wrap: wrap;
            justify-content: flex-end;
            flex-shrink: 0;
        }

        .prism-home-card-head .primary,
        .prism-home-inline-actions button {
            flex-shrink: 0;
        }

        .prism-home-status {
            min-height: 18px;
            margin: 0;
            font-size: 12px;
            color: var(--muted);
        }

        .prism-home-status[data-state="error"] {
            color: #b91c1c;
        }

        .prism-home-status[data-state="success"] {
            color: #166534;
        }

        .prism-home-empty {
            margin: 0;
            padding: 18px 16px;
            border: 1px dashed rgba(148, 163, 184, 0.22);
            border-radius: 18px;
            background: rgba(248, 250, 255, 0.88);
            color: var(--muted);
            font-size: 13px;
            line-height: 1.5;
            text-align: center;
        }

        .prism-board-placeholder {
            min-height: 100%;
            display: grid;
            place-items: center;
            padding: 24px;
        }

        .prism-board-placeholder-card {
            width: min(720px, 100%);
            display: grid;
            gap: 16px;
            justify-items: center;
            padding: 34px 28px;
            text-align: center;
        }

        .prism-board-placeholder-icon {
            width: 64px;
            height: 64px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 20px;
            color: var(--accent);
            background: var(--accent-soft);
            box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 18%, transparent);
        }

        .prism-board-placeholder-icon svg {
            width: 32px;
            height: 32px;
        }

        .prism-home-lessons-list,
        .prism-home-students-list {
            display: flex;
            flex-direction: column;
            gap: 10px;
            min-height: 0;
        }

        .prism-home-lessons-list {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 12px;
            align-content: start;
        }

        .prism-home-lesson-item,
        .prism-home-class-item,
        .prism-home-student-item {
            display: grid;
            gap: 12px;
            padding: 14px;
            box-sizing: border-box;
            border-radius: 18px;
            border: 1px solid rgba(148, 163, 184, 0.16);
            background: rgba(248, 250, 255, 0.92);
        }

        .prism-home-lesson-item {
            grid-template-columns: minmax(0, 1fr) 44px;
            grid-template-areas: "meta actions";
            align-items: stretch;
            column-gap: 10px;
            height: 136px;
            padding: 12px 10px 12px 14px;
            cursor: pointer;
            transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
        }

        .prism-home-lesson-item:hover,
        .prism-home-lesson-item:focus-visible {
            transform: translateY(-2px);
            box-shadow: 0 18px 30px rgba(15, 23, 42, 0.08);
            border-color: rgba(37, 99, 235, 0.2);
            outline: none;
        }

        .prism-home-lesson-item:focus-visible {
            box-shadow:
                0 0 0 3px rgba(37, 99, 235, 0.14),
                0 18px 30px rgba(15, 23, 42, 0.08);
        }

        .prism-home-item-meta {
            min-width: 0;
            display: flex;
            flex-direction: column;
            gap: 4px;
        }

        .prism-home-lesson-item .prism-home-item-meta {
            grid-area: meta;
            align-self: stretch;
            justify-content: flex-start;
            gap: 6px;
            padding-top: 2px;
        }

        .prism-home-lesson-title-row {
            min-width: 0;
            display: block;
        }

        .prism-home-open-indicator {
            display: none !important;
        }

        .prism-home-item-title {
            margin: 0;
            color: var(--text-soft);
            font-size: 16px;
            font-weight: 700;
            line-height: 1.25;
            min-width: 0;
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 2;
            line-clamp: 2;
            overflow: hidden;
            text-overflow: ellipsis;
            max-height: calc(1.25em * 2);
        }

        .prism-home-item-detail {
            margin: 0;
            color: var(--muted);
            font-size: 12px;
            line-height: 1.45;
        }

        .prism-home-item-actions,
        .prism-home-inline-actions {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
            align-items: center;
        }

        .prism-home-lesson-item .prism-home-item-actions {
            grid-area: actions;
            align-self: center;
            justify-content: center;
            min-width: 44px;
            width: 44px;
            flex-direction: column;
            flex-wrap: nowrap;
            gap: 6px;
        }

        .prism-home-item-actions button,
        .prism-home-inline-actions button {
            min-height: 34px;
            padding: 8px 12px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 8px;
            line-height: 1;
            white-space: nowrap;
        }

        .prism-home-hero-buttons button,
        .prism-home-card-actions button,
        .prism-home-item-actions button,
        .prism-home-inline-actions button {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 8px;
            line-height: 1;
            white-space: nowrap;
        }

        .prism-home-hero-buttons button svg,
        .prism-home-card-actions button svg,
        .prism-home-item-actions button svg,
        .prism-home-inline-actions button svg {
            flex: 0 0 auto;
            display: block;
        }

        .prism-home-hero-buttons button span,
        .prism-home-card-actions button span,
        .prism-home-item-actions button span,
        .prism-home-inline-actions button span {
            display: inline-flex;
            align-items: center;
        }

        .prism-home-lesson-item .prism-home-item-actions button {
            width: 30px;
            height: 30px;
            min-height: 30px;
            padding: 0;
            white-space: nowrap;
        }

        .prism-home-lesson-item .prism-home-item-actions button span {
            display: none;
        }

        .prism-home-lesson-item .prism-home-item-actions button svg {
            width: 15px;
            height: 15px;
        }

        .prism-home-inline-actions-stack {
            flex-direction: column;
            align-items: stretch;
        }

        .prism-home-class-layout {
            display: flex;
            flex-direction: column;
            gap: 12px;
            min-height: 0;
        }

        .prism-home-class-list {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 16px;
            max-height: 520px;
            overflow-y: auto;
            overflow-x: hidden;
            padding-right: 2px;
            align-content: start;
        }

        .prism-home-class-item {
            grid-template-columns: minmax(0, 1fr);
            align-content: center;
            min-height: 92px;
            width: 100%;
            max-width: none;
            min-width: 0;
            cursor: pointer;
            color: var(--text-soft);
            text-align: left;
            box-shadow: none;
            transform: none;
        }

        .prism-home-class-item:hover {
            background: rgba(37, 99, 235, 0.08);
            box-shadow: 0 10px 20px rgba(37, 99, 235, 0.08);
            transform: none;
        }

        .prism-home-class-item.is-active {
            border-color: rgba(37, 99, 235, 0.3);
            background: rgba(37, 99, 235, 0.1);
            box-shadow: inset 0 0 0 1px rgba(37, 99, 235, 0.12);
        }

        .prism-home-student-entry {
            display: grid;
            grid-template-columns: minmax(0, 1fr) auto;
            gap: 8px;
        }

        .prism-home-student-entry input {
            min-width: 0;
        }

        .prism-home-students-list {
            max-height: 420px;
            overflow-y: auto;
            padding-right: 2px;
        }

        .prism-home-student-item {
            grid-template-columns: minmax(0, 1fr) auto;
            align-items: center;
            gap: 10px;
        }

        .prism-home-student-name {
            min-width: 0;
            font-size: 14px;
            font-weight: 600;
            color: var(--text-soft);
            word-break: break-word;
        }

        .prism-home-student-actions {
            display: inline-flex;
            align-items: center;
            gap: 6px;
        }

        .prism-home-student-actions button {
            width: 34px;
            height: 34px;
            min-height: 34px;
            padding: 0;
            display: inline-flex;
            align-items: center;
            justify-content: center;
        }

        .prism-home-inline-actions-icon button {
            width: 36px;
            height: 36px;
            min-height: 36px;
            padding: 0;
        }

        .prism-home-summary-block {
            display: flex;
            flex-direction: column;
            gap: 4px;
            padding: 14px 16px;
            border-radius: 18px;
            border: 1px solid rgba(148, 163, 184, 0.16);
            background: rgba(248, 250, 255, 0.9);
        }

        .prism-account-subscription-grid {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 12px;
            align-items: stretch;
        }

        .prism-account-subscription-grid .prism-home-summary-block,
        .prism-account-subscription-grid .prism-support-block {
            margin: 0;
            min-height: 100%;
        }

        .prism-home-summary-label {
            color: var(--muted);
            font-size: 11px;
            font-weight: 700;
            letter-spacing: 0.08em;
            text-transform: uppercase;
        }

        .prism-home-muted-note {
            color: var(--muted);
            font-size: 12px;
            line-height: 1.45;
        }

        .prism-support-block {
            margin-top: 12px;
            display: grid;
            grid-template-columns: minmax(0, 1fr) 132px;
            gap: 14px;
            align-items: center;
            padding: 14px 16px;
            border-radius: 18px;
            border: 1px solid rgba(148, 163, 184, 0.14);
            background: linear-gradient(180deg, rgba(251, 191, 36, 0.08), rgba(248, 250, 255, 0.94));
        }

        .prism-support-copy {
            display: flex;
            flex-direction: column;
            gap: 6px;
            min-width: 0;
        }

        .prism-support-title {
            margin: 0;
            color: var(--text-soft);
            font-size: 18px;
            line-height: 1.2;
            font-weight: 700;
        }

        .prism-support-copy p {
            margin: 0;
            color: var(--muted);
            font-size: 13px;
            line-height: 1.55;
        }

        .prism-support-qr {
            width: 132px;
            max-width: 100%;
            aspect-ratio: 1;
            display: block;
            justify-self: end;
            border-radius: 16px;
            border: 1px solid rgba(148, 163, 184, 0.16);
            background: rgba(255, 255, 255, 0.98);
            padding: 8px;
            object-fit: contain;
        }

        .prism-theme-grid {
            display: grid;
            grid-template-columns: repeat(5, minmax(0, 1fr));
            gap: 10px;
        }

        .prism-theme-card {
            min-height: 104px;
            padding: 12px;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            gap: 12px;
            border-radius: 16px;
            border: 1px solid color-mix(in srgb, var(--border) 78%, transparent);
            background: color-mix(in srgb, var(--surface) 94%, white);
            color: var(--text-main);
            box-shadow: none;
            text-align: left;
            transform: none;
        }

        .prism-theme-card:hover,
        .prism-theme-card:focus-visible {
            border-color: color-mix(in srgb, var(--accent) 44%, var(--border));
            background: color-mix(in srgb, var(--accent-soft) 54%, var(--surface));
            box-shadow: 0 12px 24px color-mix(in srgb, var(--accent) 12%, transparent);
            transform: translateY(-1px);
            outline: none;
        }

        .prism-theme-card[aria-pressed="true"] {
            border-color: color-mix(in srgb, var(--accent) 64%, var(--border));
            background: var(--accent-soft);
            box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 18%, transparent), 0 12px 24px color-mix(in srgb, var(--accent) 12%, transparent);
        }

        .prism-theme-card-title {
            color: var(--text-main);
            font-size: 13px;
            font-weight: 700;
            line-height: 1.25;
        }

        .prism-theme-swatches {
            display: flex;
            align-items: center;
            gap: 5px;
        }

        .prism-theme-swatch {
            width: 16px;
            height: 16px;
            border-radius: 999px;
            border: 1px solid rgba(15, 23, 42, 0.12);
            box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.28);
        }

        .prism-theme-status {
            min-height: 16px;
            margin: 0;
            color: var(--text-muted);
            font-size: 12px;
            line-height: 1.35;
        }

        .prism-theme-status[data-state="error"] {
            color: var(--danger);
        }

        .prism-theme-status[data-state="success"] {
            color: var(--success);
        }

        :root[data-prism-theme] nav {
            background:
                linear-gradient(180deg, color-mix(in srgb, var(--accent) 12%, transparent), transparent 18%),
                var(--sidebar-bg);
        }

        :root[data-prism-theme] nav button.active {
            background: var(--sidebar-active);
            box-shadow: inset 0 0 0 1px var(--sidebar-active-border), 0 8px 18px rgba(15, 23, 42, 0.2);
        }

        :root[data-prism-theme] nav button:hover {
            background: color-mix(in srgb, var(--sidebar-active) 82%, white 18%);
            box-shadow: 0 0 10px color-mix(in srgb, var(--accent) 26%, transparent);
        }

        :root[data-prism-theme] .card,
        :root[data-prism-theme] .panel,
        :root[data-prism-theme] .prism-dialog-panel,
        :root[data-prism-theme] .prism-home-lesson-item,
        :root[data-prism-theme] .prism-home-class-item,
        :root[data-prism-theme] .prism-home-student-item,
        :root[data-prism-theme] .classroom-card,
        :root[data-prism-theme] .rewards-panel,
        :root[data-prism-theme] .prism-lesson-library-panel,
        :root[data-prism-theme] .prism-media-library-panel {
            border-color: color-mix(in srgb, var(--border) 82%, transparent);
            background-color: color-mix(in srgb, var(--surface) 94%, transparent);
        }

        :root[data-prism-theme] .prism-home-empty,
        :root[data-prism-theme] .prism-home-summary-block,
        :root[data-prism-theme] .name-chip,
        :root[data-prism-theme] .reward-student-card,
        :root[data-prism-theme] .rewards-empty,
        :root[data-prism-theme] .classroom-empty,
        :root[data-prism-theme] .slides-empty-card {
            border-color: color-mix(in srgb, var(--border) 76%, transparent);
            background: color-mix(in srgb, var(--surface-soft) 72%, var(--surface));
        }

        :root[data-prism-theme] .prism-home-account-pill,
        :root[data-prism-theme] .prism-home-class-item.is-active,
        :root[data-prism-theme] .name-chip.selected,
        :root[data-prism-theme] .reward-student-card.selected,
        :root[data-prism-theme] .rewards-spend-student.selected,
        :root[data-prism-theme] .rewards-spend-item.selected {
            border-color: color-mix(in srgb, var(--accent) 38%, var(--border));
            background: color-mix(in srgb, var(--accent-soft) 72%, var(--surface));
        }

        :root[data-prism-theme] .primary,
        :root[data-prism-theme] .slide-bar button,
        :root[data-prism-theme] .qr-input-row button,
        :root[data-prism-theme] .rewards-action-button,
        :root[data-prism-theme] .rewards-spend-tabs button.active {
            background: linear-gradient(180deg, var(--accent) 0%, var(--accent-strong) 100%);
            color: var(--accent-text);
        }

        :root[data-prism-theme] .timer-controls button,
        :root[data-prism-theme] .timer-buttons button.active-timer {
            background: linear-gradient(180deg, color-mix(in srgb, var(--warning) 72%, white) 0%, var(--warning) 100%);
            color: #422006;
        }

        :root[data-prism-theme="midnight"] .prism-slide-ribbon,
        :root[data-prism-theme="midnight"] .prism-context-panel,
        :root[data-prism-theme="midnight"] .prism-shape-inspector,
        :root[data-prism-theme="midnight"] .prism-text-flyout-panel {
            border-color: rgba(71, 85, 105, 0.28);
            background: rgba(248, 250, 252, 0.94);
            color: #0f172a;
            box-shadow: 0 12px 32px rgba(15, 23, 42, 0.24);
        }

        :root[data-prism-theme="midnight"] .prism-slide-ribbon .prism-ribbon-btn,
        :root[data-prism-theme="midnight"] .prism-context-panel .prism-context-tool-btn,
        :root[data-prism-theme="midnight"] .prism-context-panel .prism-slide-control select,
        :root[data-prism-theme="midnight"] .prism-toolbar-menu-trigger,
        :root[data-prism-theme="midnight"] .prism-text-flyout-panel .prism-text-flyout-button,
        :root[data-prism-theme="midnight"] .prism-text-color-marker {
            color: #0f172a;
        }

        :root[data-prism-theme="midnight"] .prism-slide-ribbon .prism-ribbon-btn:hover,
        :root[data-prism-theme="midnight"] .prism-context-panel .prism-context-tool-btn:hover,
        :root[data-prism-theme="midnight"] .prism-text-flyout-panel .prism-text-flyout-button:hover {
            background: rgba(79, 157, 255, 0.14);
            color: #1e293b;
        }

        :root[data-prism-theme="midnight"] .prism-slide-ribbon .prism-ribbon-btn.is-active,
        :root[data-prism-theme="midnight"] .prism-context-panel .prism-context-tool-btn.is-active,
        :root[data-prism-theme="midnight"] .prism-text-style-btn.is-active,
        :root[data-prism-theme="midnight"] .prism-text-flyout-panel .prism-text-flyout-button.is-active {
            background: rgba(79, 157, 255, 0.18);
            color: #2563eb;
            box-shadow: inset 0 0 0 1px rgba(79, 157, 255, 0.3);
        }

        :root[data-prism-theme="midnight"] .prism-slide-ribbon .prism-ribbon-btn:disabled,
        :root[data-prism-theme="midnight"] .prism-context-panel .prism-context-tool-btn:disabled {
            color: #94a3b8;
            opacity: 0.72;
        }

        :root[data-prism-theme="midnight"] .prism-ribbon-divider {
            background: rgba(71, 85, 105, 0.22);
        }

        :root[data-prism-theme="midnight"] .card,
        :root[data-prism-theme="midnight"] .panel,
        :root[data-prism-theme="midnight"] .prism-home-card,
        :root[data-prism-theme="midnight"] .prism-account-hero,
        :root[data-prism-theme="midnight"] .prism-home-hero,
        :root[data-prism-theme="midnight"] .prism-dialog-panel,
        :root[data-prism-theme="midnight"] .rewards-panel,
        :root[data-prism-theme="midnight"] .prism-lesson-library-panel,
        :root[data-prism-theme="midnight"] .prism-media-library-panel {
            border-color: #475569;
            background: linear-gradient(180deg, #1e293b 0%, #172235 100%);
            color: #f8fafc;
        }

        :root[data-prism-theme="midnight"] input,
        :root[data-prism-theme="midnight"] select,
        :root[data-prism-theme="midnight"] textarea {
            border-color: #475569;
            background-color: #0f172a;
            color: #f8fafc;
        }

        :root[data-prism-theme="midnight"] input::placeholder,
        :root[data-prism-theme="midnight"] textarea::placeholder {
            color: #94a3b8;
        }

        :root[data-prism-theme="midnight"] .card-title,
        :root[data-prism-theme="midnight"] .card-toggle-icon {
            color: #cbd5e1;
        }

        :root[data-prism-theme="midnight"] .prism-home-card-title,
        :root[data-prism-theme="midnight"] .prism-home-hero-text h2,
        :root[data-prism-theme="midnight"] .prism-account-hero h2 {
            color: #f8fafc;
        }

        :root[data-prism-theme="midnight"] .prism-home-card-copy,
        :root[data-prism-theme="midnight"] .prism-home-hero p,
        :root[data-prism-theme="midnight"] .prism-account-hero p,
        :root[data-prism-theme="midnight"] .prism-home-card-label,
        :root[data-prism-theme="midnight"] .prism-home-eyebrow {
            color: #cbd5e1;
        }

        :root[data-prism-theme="midnight"] .name-picker-checkbox,
        :root[data-prism-theme="midnight"] .rewards-no-repeat {
            border-color: #475569;
            background: linear-gradient(180deg, #1e293b 0%, #172235 100%);
            color: #f8fafc;
            box-shadow: 0 12px 24px rgba(0, 0, 0, 0.18);
        }

        :root[data-prism-theme="midnight"] .name-picker-checkbox:hover,
        :root[data-prism-theme="midnight"] .rewards-no-repeat:hover {
            border-color: rgba(79, 157, 255, 0.48);
            box-shadow: 0 16px 28px rgba(0, 0, 0, 0.22);
        }

        :root[data-prism-theme="midnight"] .name-picker-focus-card,
        :root[data-prism-theme="midnight"] .name-picker-quick-reward-card,
        :root[data-prism-theme="midnight"] .name-picker-batch-bar {
            border-color: #475569;
            background: linear-gradient(180deg, #1e293b 0%, #172235 100%);
            box-shadow: inset 0 1px 0 rgba(248, 250, 252, 0.06), 0 12px 24px rgba(0, 0, 0, 0.2);
            color: #f8fafc;
        }

        :root[data-prism-theme="midnight"] .name-picker-focus-eyebrow {
            color: #cbd5e1;
        }

        :root[data-prism-theme="midnight"] .name-picker-focus-balance,
        :root[data-prism-theme="midnight"] .name-picker-quick-reward-balance,
        :root[data-prism-theme="midnight"] .name-picker-selection-meta {
            color: #4f9dff;
        }

        .prism-dialog-field-group {
            display: flex;
            flex-direction: column;
            gap: 12px;
        }

        .prism-dialog-field {
            display: flex;
            flex-direction: column;
            gap: 6px;
        }

        .prism-dialog-field label {
            color: var(--muted);
            font-size: 12px;
            font-weight: 600;
        }

        .prism-slides-layout {
            height: 100%;
            display: flex;
            flex-direction: column;
            min-height: 0;
        }

        .prism-slide-stage-card {
            flex: 1;
            display: flex;
            flex-direction: column;
            min-height: 0;
            position: relative;
            padding: 0;
            overflow: hidden;
            background: transparent;
            border: none;
            border-radius: 0;
            box-shadow: none;
        }

        .prism-slide-stage-header {
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 6px;
            justify-content: center;
            position: absolute;
            top: 10px;
            left: 12px;
            right: 12px;
            z-index: 40;
            pointer-events: none;
        }

        .prism-context-rail {
            position: absolute;
            top: 82px;
            left: 12px;
            z-index: 34;
            width: 58px;
            display: flex;
            flex-direction: column;
            gap: 8px;
            pointer-events: auto;
        }

        .prism-context-rail[hidden] {
            display: none !important;
        }

        .prism-context-panel {
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 6px;
            padding: 8px 6px;
            border: 1px solid rgba(30, 58, 138, 0.08);
            border-radius: 16px;
            background: rgba(255, 255, 255, 0.9);
            box-shadow: 0 10px 28px rgba(15, 23, 42, 0.1);
            backdrop-filter: blur(14px);
        }

        .prism-context-panel[hidden] {
            display: none !important;
        }

        .prism-context-label {
            display: none;
        }

        #prismPenOptionsPanel,
        #prismHighlighterOptionsPanel {
            width: 100%;
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 10px;
        }

        #prismPenOptionsPanel[hidden],
        #prismHighlighterOptionsPanel[hidden] {
            display: none !important;
        }

        .prism-slide-ribbon {
            display: flex;
            align-items: center;
            justify-content: flex-start;
            width: auto;
            max-width: min(100%, calc(100% - 12px));
            padding: 5px 8px;
            border: 1px solid rgba(30, 58, 138, 0.08);
            border-radius: 18px;
            background: rgba(255, 255, 255, 0.92);
            box-shadow: 0 10px 28px rgba(15, 23, 42, 0.12);
            backdrop-filter: blur(14px);
            overflow: visible;
            pointer-events: auto;
        }

        .prism-slide-ribbon-scroll {
            display: flex;
            max-width: 100%;
            overflow-x: auto;
            overflow-y: hidden;
            -webkit-overflow-scrolling: touch;
            scrollbar-width: none;
            -ms-overflow-style: none;
            touch-action: pan-x;
        }

        .prism-slide-ribbon-scroll::-webkit-scrollbar {
            display: none;
        }

        .prism-slide-ribbon-actions {
            display: inline-flex;
            gap: 3px;
            flex-wrap: nowrap;
            align-items: center;
            min-width: max-content;
        }

        .prism-ribbon-group {
            display: inline-flex;
            align-items: center;
            gap: 3px;
            flex-wrap: nowrap;
        }

        .prism-toolbar-menu-wrap {
            position: relative;
            display: inline-flex;
            align-items: center;
        }

        .prism-toolbar-menu-trigger {
            min-width: 102px;
            height: 32px;
            justify-content: space-between;
            gap: 8px;
            padding-inline: 11px;
            font-size: 12px;
            font-weight: 600;
        }

        .prism-toolbar-menu-trigger .prism-toolbar-menu-label {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            min-width: 0;
        }

        .prism-toolbar-menu-trigger .prism-toolbar-menu-label span:last-child {
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .prism-toolbar-menu-trigger .prism-toolbar-menu-caret {
            width: 13px;
            height: 13px;
            flex: 0 0 13px;
            color: var(--muted);
        }

        .prism-toolbar-menu-trigger.is-open .prism-toolbar-menu-caret {
            color: var(--primary);
        }

        .prism-toolbar-menu {
            position: absolute;
            top: 58px;
            left: 12px;
            min-width: 206px;
            display: flex;
            flex-direction: column;
            gap: 4px;
            padding: 7px;
            border: 1px solid rgba(30, 58, 138, 0.08);
            border-radius: 16px;
            background: rgba(255, 255, 255, 0.96);
            box-shadow: 0 12px 32px rgba(15, 23, 42, 0.16);
            backdrop-filter: blur(14px);
            pointer-events: auto;
            z-index: 42;
        }

        .prism-toolbar-menu[hidden] {
            display: none !important;
        }

        .prism-toolbar-menu button {
            width: 100%;
            justify-content: flex-start;
        }

        .prism-toolbar-menu-section {
            display: flex;
            flex-direction: column;
            gap: 4px;
        }

        .prism-toolbar-menu-section + .prism-toolbar-menu-section {
            padding-top: 7px;
            border-top: 1px solid rgba(148, 163, 184, 0.18);
        }

        .prism-toolbar-menu-item {
            display: grid;
            grid-template-columns: 18px minmax(0, 1fr);
            align-items: center;
            gap: 11px;
            min-height: 34px;
            padding: 0 10px;
            font-size: 12.5px;
            font-weight: 500;
            text-align: left;
        }

        .prism-toolbar-menu-item > span:last-child {
            min-width: 0;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .prism-toolbar-menu-hint {
            margin: 0;
            padding: 2px 4px 0;
            font-size: 11px;
            line-height: 1.35;
            color: var(--muted);
        }

        .prism-toolbar-control-group {
            display: flex;
            flex-direction: column;
            gap: 6px;
            min-width: 0;
        }

        .prism-toolbar-control-row {
            display: flex;
            align-items: center;
            gap: 10px;
            min-height: 34px;
            padding: 2px 4px;
        }

        .prism-toolbar-control-icon {
            width: 18px;
            height: 18px;
            flex: 0 0 18px;
            color: var(--muted);
        }

        .prism-toolbar-control-row .prism-ribbon-btn {
            width: 32px;
            min-width: 32px;
            height: 32px;
            padding: 0;
        }

        .prism-toolbar-control-row .prism-slide-control {
            flex: 1 1 auto;
            min-width: 0;
        }

        .prism-toolbar-control-row .prism-slide-control select {
            width: 100%;
            min-width: 0;
            height: 32px;
            padding: 5px 29px 5px 10px;
            font-size: 12px;
        }

        #prismDocumentMenu {
            min-width: 216px;
        }

        #prismDocumentMenu .prism-toolbar-control-group {
            width: 162px;
        }

        #prismDocumentMenu .prism-toolbar-control-row {
            display: grid;
            grid-template-columns: 18px 132px;
            align-items: center;
            gap: 12px;
        }

        #prismDocumentMenu .prism-toolbar-control-row .prism-slide-control {
            flex: 0 0 132px;
            width: 132px;
            min-width: 132px;
            max-width: 132px;
        }

        #prismDocumentMenu .prism-toolbar-control-row .prism-slide-control select,
        #prismDocumentMenu #prismPageOrientationSelect,
        #prismDocumentMenu #prismSlideThemeSelect,
        #prismDocumentMenu #prismPageColorModeSelect {
            width: 132px !important;
            min-width: 132px !important;
            max-width: 132px !important;
        }

        .prism-export-panel {
            display: flex;
            flex-direction: column;
            gap: 10px;
            width: min(320px, calc(100vw - 48px));
            margin-top: 4px;
            padding: 12px;
            border: 1px solid rgba(30, 58, 138, 0.08);
            border-radius: 18px;
            background: rgba(255, 255, 255, 0.96);
            box-shadow: 0 12px 32px rgba(15, 23, 42, 0.16);
            backdrop-filter: blur(14px);
            pointer-events: auto;
            align-self: flex-end;
        }

        .prism-export-panel[hidden] {
            display: none !important;
        }

        .prism-export-heading {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 8px;
        }

        .prism-export-heading strong {
            font-size: 12px;
            letter-spacing: 0.08em;
            text-transform: uppercase;
            color: var(--muted);
        }

        .prism-export-close {
            width: 28px;
            height: 28px;
            padding: 0;
        }

        .prism-export-scope {
            display: flex;
            flex-direction: column;
            gap: 8px;
        }

        .prism-export-scope label {
            display: flex;
            align-items: center;
            gap: 8px;
            font-size: 13px;
            color: var(--navy);
        }

        .prism-export-pages {
            display: flex;
            flex-direction: column;
            gap: 8px;
            padding: 10px;
            border: 1px solid rgba(30, 58, 138, 0.1);
            border-radius: 14px;
            background: rgba(248, 250, 255, 0.92);
        }

        .prism-export-pages[hidden] {
            display: none !important;
        }

        .prism-export-pages-toolbar {
            display: flex;
            justify-content: space-between;
            align-items: center;
            gap: 8px;
        }

        .prism-export-pages-toolbar span {
            font-size: 11px;
            font-weight: 600;
            letter-spacing: 0.06em;
            text-transform: uppercase;
            color: var(--muted);
        }

        .prism-export-pages-actions {
            display: inline-flex;
            gap: 6px;
        }

        .prism-export-pages-actions button {
            padding: 4px 8px;
            font-size: 11px;
        }

        .prism-export-pages-list {
            max-height: 180px;
            overflow-y: auto;
            display: flex;
            flex-direction: column;
            gap: 6px;
            padding-right: 2px;
            scrollbar-width: thin;
        }

        .prism-export-page-option {
            display: flex;
            align-items: center;
            gap: 8px;
            font-size: 13px;
            color: var(--navy);
        }

        .prism-export-page-option input {
            margin: 0;
        }

        .prism-export-actions {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 8px;
        }

        .prism-export-help {
            margin: 0;
            font-size: 12px;
            color: var(--muted);
            line-height: 1.35;
        }

        .prism-media-picker {
            position: relative;
            display: inline-flex;
        }

        .prism-media-menu {
            position: absolute;
            top: 66px;
            left: 12px;
            min-width: 132px;
            display: flex;
            flex-direction: column;
            gap: 6px;
            padding: 8px;
            border: 1px solid rgba(30, 58, 138, 0.08);
            border-radius: 16px;
            background: rgba(255, 255, 255, 0.96);
            box-shadow: 0 12px 32px rgba(15, 23, 42, 0.16);
            backdrop-filter: blur(14px);
            pointer-events: auto;
            z-index: 42;
        }

        .prism-media-menu[hidden] {
            display: none !important;
        }

        .prism-media-menu button {
            width: 100%;
            justify-content: flex-start;
        }

        .prism-media-library-panel {
            position: absolute;
            top: 66px;
            left: 50%;
            transform: translateX(-50%);
            z-index: 39;
            width: min(780px, calc(100vw - 104px));
            max-height: min(72vh, 680px);
            display: flex;
            flex-direction: column;
            gap: 12px;
            padding: 14px;
            border: 1px solid rgba(30, 58, 138, 0.08);
            border-radius: 20px;
            background: rgba(255, 255, 255, 0.96);
            box-shadow: 0 16px 40px rgba(15, 23, 42, 0.18);
            backdrop-filter: blur(14px);
            pointer-events: auto;
        }

        .prism-media-library-panel[hidden] {
            display: none !important;
        }

        .prism-media-library-header {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 12px;
        }

        .prism-media-library-header strong {
            font-size: 12px;
            letter-spacing: 0.08em;
            text-transform: uppercase;
            color: var(--muted);
        }

        .prism-media-library-actions {
            display: inline-flex;
            align-items: center;
            gap: 8px;
        }

        .prism-media-library-grid {
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(112px, 112px));
            grid-auto-rows: 112px;
            justify-content: flex-start;
            align-content: flex-start;
            gap: 12px;
            overflow: auto;
            padding-right: 4px;
            min-height: 0;
        }

        .prism-media-library-tile {
            appearance: none;
            width: 112px;
            height: 112px;
            min-width: 0;
            min-height: 0;
            margin: 0;
            padding: 8px;
            display: flex;
            align-items: center;
            justify-content: center;
            align-self: stretch;
            justify-self: stretch;
            border-radius: 16px;
            border: 1px solid rgba(30, 58, 138, 0.1);
            background: rgba(248, 250, 255, 0.92);
            box-shadow: none;
            transform: none;
            overflow: hidden;
            line-height: 0;
            position: relative;
        }

        .prism-media-library-tile:hover {
            background: rgba(255, 255, 255, 1);
            border-color: rgba(30, 58, 138, 0.18);
            box-shadow: 0 10px 24px rgba(15, 23, 42, 0.1);
            transform: translateY(-1px);
        }

        .prism-media-library-tile img {
            max-width: 100%;
            max-height: 100%;
            object-fit: contain;
            display: block;
            user-select: none;
            -webkit-user-drag: none;
            pointer-events: none;
        }

        .prism-media-library-tile[data-media-kind="icon"] {
            background: color-mix(in srgb, var(--surface) 94%, white);
        }

        .prism-media-library-tile[data-media-kind="icon"] img {
            width: 56px;
            height: 56px;
        }

        .prism-media-library-empty {
            margin: 0;
            padding: 18px 10px 10px;
            text-align: center;
            color: var(--muted);
            font-size: 13px;
        }

        .prism-media-upload-panel {
            min-height: 220px;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            gap: 18px;
            padding: 22px;
            border: 1px dashed rgba(37, 99, 235, 0.2);
            border-radius: 18px;
            background:
                linear-gradient(180deg, rgba(37, 99, 235, 0.04), rgba(248, 250, 255, 0.96)),
                #ffffff;
            text-align: center;
        }

        .prism-media-upload-panel[hidden] {
            display: none !important;
        }

        .prism-media-upload-hero {
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 12px;
            max-width: 420px;
        }

        .prism-media-upload-icon {
            width: 52px;
            height: 52px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 18px;
            background: rgba(37, 99, 235, 0.1);
            color: var(--primary);
        }

        .prism-media-upload-copy {
            display: flex;
            flex-direction: column;
            gap: 6px;
            color: var(--muted);
            font-size: 13px;
            line-height: 1.5;
        }

        .prism-media-upload-copy strong {
            color: var(--navy);
            font-size: 15px;
        }

        .prism-media-upload-copy p {
            margin: 0;
        }

        .prism-media-upload-button {
            min-width: 156px;
            min-height: 40px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 8px;
        }

        .prism-media-source-tabs {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
        }

        .prism-media-source-tab {
            min-height: 34px;
            padding: 7px 12px;
            border-radius: 999px;
            border: 1px solid rgba(30, 58, 138, 0.12);
            background: rgba(248, 250, 255, 0.92);
            color: var(--navy);
            font-size: 12px;
            font-weight: 700;
            box-shadow: none;
            transform: none;
        }

        .prism-media-source-tab.is-active {
            background: linear-gradient(180deg, var(--primary-hover) 0%, var(--primary) 100%);
            color: #fff;
            border-color: transparent;
        }

        .prism-media-search-row {
            display: flex;
            align-items: center;
            gap: 10px;
        }

        .prism-media-search-row[hidden] {
            display: none !important;
        }

        .prism-media-search-input {
            flex: 1 1 auto;
            min-width: 0;
            height: 36px;
            padding: 0 12px;
            border: 1px solid rgba(148, 163, 184, 0.28);
            border-radius: 12px;
            background: rgba(255, 255, 255, 0.98);
            color: var(--text);
            font: inherit;
            font-size: 13px;
        }

        .prism-media-search-input:focus-visible {
            outline: none;
            border-color: rgba(37, 99, 235, 0.42);
            box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.14);
        }

        .prism-media-search-button {
            min-width: 92px;
            height: 36px;
        }

        .prism-media-library-status {
            margin: -2px 0 0;
            min-height: 16px;
            font-size: 11px;
            line-height: 1.4;
            color: var(--muted);
        }

        .prism-media-library-status.is-error {
            color: #b45309;
        }

        .prism-media-library-status.is-success {
            color: var(--primary);
        }

        .prism-media-library-tile[data-media-kind="gif"] img,
        .prism-media-library-tile[data-media-kind="photo"] img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            border-radius: 10px;
        }

        .prism-media-library-tile-badge {
            position: absolute;
            left: 8px;
            bottom: 8px;
            min-height: 18px;
            padding: 2px 6px;
            display: inline-flex;
            align-items: center;
            border-radius: 999px;
            background: rgba(15, 23, 42, 0.74);
            color: #fff;
            font-size: 10px;
            font-weight: 700;
            letter-spacing: 0.04em;
            text-transform: uppercase;
            pointer-events: none;
        }

        .prism-media-library-footer {
            margin-top: auto;
            padding-top: 4px;
            display: inline-flex;
            align-items: center;
            gap: 8px;
            color: var(--muted);
            font-size: 11px;
            line-height: 1.4;
        }

        .prism-media-library-footer[hidden] {
            display: none !important;
        }

        .prism-media-library-footer a {
            display: inline-flex;
            align-items: center;
        }

        .prism-media-library-footer img {
            height: 18px;
            width: auto;
            display: block;
        }

        .prism-lesson-library-panel {
            position: fixed;
            top: 88px;
            left: 50%;
            transform: translateX(-50%);
            z-index: 46;
            width: min(840px, calc(100vw - 72px));
            max-height: min(78vh, 760px);
            display: flex;
            flex-direction: column;
            gap: 12px;
            padding: 16px;
            border: 1px solid rgba(30, 58, 138, 0.08);
            border-radius: 20px;
            background: rgba(255, 255, 255, 0.96);
            box-shadow: 0 16px 40px rgba(15, 23, 42, 0.18);
            backdrop-filter: blur(14px);
            pointer-events: auto;
        }

        .prism-lesson-library-panel[hidden] {
            display: none !important;
        }

        .prism-lesson-library-head {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 12px;
        }

        .prism-lesson-library-head strong {
            font-size: 12px;
            letter-spacing: 0.08em;
            text-transform: uppercase;
            color: var(--muted);
        }

        .prism-lesson-library-subtitle {
            margin: 0;
            color: var(--muted);
            font-size: 13px;
            line-height: 1.45;
        }

        .prism-lesson-library-status {
            margin: 0;
            min-height: 16px;
            color: var(--muted);
            font-size: 11px;
            line-height: 1.4;
        }

        .prism-lesson-library-status.is-error {
            color: #b45309;
        }

        .prism-lesson-library-list {
            min-height: 0;
            overflow-y: auto;
            display: flex;
            flex-direction: column;
            gap: 8px;
            padding: 2px 4px 2px 0;
        }

        .prism-lesson-library-list[hidden] {
            display: none !important;
        }

        .prism-lesson-library-empty {
            margin: 0;
            padding: 22px 14px;
            text-align: center;
            color: var(--muted);
            font-size: 13px;
            border: 1px dashed rgba(148, 163, 184, 0.34);
            border-radius: 18px;
            background: rgba(248, 250, 255, 0.9);
        }

        .prism-lesson-library-item {
            display: grid;
            grid-template-columns: minmax(0, 1fr) auto;
            gap: 12px;
            align-items: center;
            min-height: 82px;
            padding: 12px 14px;
            border: 1px solid rgba(30, 58, 138, 0.08);
            border-radius: 16px;
            background: rgba(248, 250, 255, 0.94);
            box-sizing: border-box;
            cursor: pointer;
            transition: transform 140ms ease, box-shadow 140ms ease, border-color 140ms ease;
        }

        .prism-lesson-library-item:hover,
        .prism-lesson-library-item:focus-visible {
            transform: translateY(-1px);
            border-color: rgba(37, 99, 235, 0.18);
            box-shadow: 0 10px 20px rgba(15, 23, 42, 0.08);
            outline: none;
        }

        .prism-lesson-library-item.is-active {
            border-color: rgba(30, 58, 138, 0.08);
            box-shadow: none;
        }

        .prism-lesson-library-meta {
            min-width: 0;
            display: flex;
            flex-direction: column;
            gap: 5px;
            justify-content: center;
        }

        .prism-lesson-library-title {
            margin: 0;
            font-size: 15px;
            line-height: 1.3;
            font-weight: 700;
            color: var(--text-soft);
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 2;
            line-clamp: 2;
            overflow: hidden;
            text-overflow: ellipsis;
            max-height: calc(1.3em * 2);
        }

        .prism-lesson-library-detail {
            margin: 0;
            font-size: 12px;
            line-height: 1.4;
            color: var(--muted);
        }

        .prism-lesson-library-actions {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            flex-wrap: nowrap;
            justify-content: flex-end;
            align-self: center;
        }

        .prism-lesson-library-actions button {
            width: 30px;
            height: 30px;
            min-height: 30px;
            min-width: 30px;
            padding: 0;
            font-size: 12px;
            gap: 0;
            white-space: nowrap;
        }

        .prism-lesson-library-actions button span {
            display: none;
        }

        .prism-lesson-library-actions button svg {
            width: 15px;
            height: 15px;
        }

        .prism-dialog-overlay {
            position: fixed;
            inset: 0;
            z-index: 48;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 24px;
        }

        .prism-dialog-overlay[hidden] {
            display: none !important;
        }

        .prism-dialog-backdrop {
            position: absolute;
            inset: 0;
            background: rgba(15, 23, 42, 0.34);
            backdrop-filter: blur(4px);
        }

        .prism-dialog-panel {
            position: relative;
            width: min(420px, 100%);
            padding: 24px;
            border-radius: 24px;
            background: rgba(255, 255, 255, 0.98);
            border: 1px solid var(--border);
            box-shadow: 0 28px 64px rgba(15, 23, 42, 0.24);
            display: flex;
            flex-direction: column;
            gap: 16px;
        }

        .prism-dialog-label {
            margin: 0;
            color: var(--muted);
            font-size: 12px;
            font-weight: 700;
            letter-spacing: 0.08em;
            text-transform: uppercase;
        }

        .prism-dialog-title {
            margin: 0;
            color: var(--text-soft);
            background: linear-gradient(135deg, #111827 0%, #2563eb 82%);
            -webkit-background-clip: text;
            background-clip: text;
            -webkit-text-fill-color: transparent;
            font-size: 28px;
            font-weight: 700;
            line-height: 1.18;
            padding-bottom: 0.08em;
            overflow: visible;
        }

        .prism-dialog-copy {
            margin: 0;
            color: var(--muted);
            font-size: 14px;
            line-height: 1.5;
        }

        .prism-dialog-input {
            width: 100%;
            height: 42px;
            padding: 0 14px;
            border: 1px solid rgba(148, 163, 184, 0.28);
            border-radius: 14px;
            background: rgba(255, 255, 255, 0.98);
            color: var(--text);
            font: inherit;
            font-size: 15px;
        }

        .prism-dialog-input:focus-visible {
            outline: none;
            border-color: rgba(37, 99, 235, 0.42);
            box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.14);
        }

        .prism-dialog-error {
            margin: 0;
            min-height: 16px;
            font-size: 12px;
            line-height: 1.4;
            color: #b45309;
        }

        .prism-dialog-actions {
            display: flex;
            align-items: center;
            justify-content: flex-end;
            gap: 10px;
        }

        .prism-export-options {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 10px;
        }

        .prism-export-option {
            min-height: 72px;
            padding: 14px;
            border-radius: 16px;
            border: 1px solid rgba(148, 163, 184, 0.34);
            background: rgba(248, 250, 252, 0.92);
            color: var(--text);
            font: inherit;
            text-align: left;
            cursor: pointer;
            transition: border-color 0.16s ease, background 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
        }

        .prism-export-option:hover {
            border-color: rgba(37, 99, 235, 0.34);
            transform: translateY(-1px);
        }

        .prism-export-option[aria-pressed="true"] {
            border-color: rgba(37, 99, 235, 0.62);
            background: rgba(239, 246, 255, 0.96);
            box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12);
        }

        .prism-export-option strong {
            display: block;
            color: var(--text);
            font-size: 15px;
            line-height: 1.2;
        }

        .prism-export-option span {
            display: block;
            margin-top: 5px;
            color: var(--muted);
            font-size: 12px;
            line-height: 1.25;
        }

        .prism-dialog-panel.prism-class-dialog-panel {
            width: min(calc(100vw - 72px), 1120px);
            max-width: 1120px;
            max-height: min(calc(100dvh - 48px), 760px);
            padding: 32px 40px;
            overflow: hidden;
        }

        .prism-class-dialog-layout {
            flex: 1 1 auto;
            min-height: 0;
            display: grid;
            grid-template-columns: minmax(340px, 420px) minmax(0, 1fr);
            gap: 28px;
            align-items: stretch;
            overflow: hidden;
        }

        .prism-class-dialog-layout > * {
            min-width: 0;
        }

        .prism-class-dialog-layout .prism-dialog-field-group {
            min-height: 0;
        }

        .prism-class-dialog-textarea {
            min-height: 160px;
            height: clamp(160px, 28vh, 230px);
            resize: vertical;
            font: inherit;
            line-height: 1.45;
        }

        .prism-class-dialog-inline-actions {
            justify-content: flex-start;
            margin-top: -4px;
        }

        .prism-class-dialog-roster {
            min-width: 0;
            min-height: 0;
            display: flex;
            flex-direction: column;
            gap: 10px;
            overflow: hidden;
        }

        .prism-class-dialog-roster-head {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 12px;
        }

        .prism-class-dialog-students-list {
            flex: 1 1 auto;
            min-height: 0;
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
            gap: 12px;
            overflow-y: auto;
            overflow-x: hidden;
            padding-right: 4px;
            align-content: start;
        }

        .prism-class-dialog-student {
            min-width: 0;
            display: grid;
            grid-template-columns: minmax(0, 1fr) auto;
            align-items: center;
            gap: 8px;
            min-height: 54px;
            padding: 10px 12px;
            border-radius: 14px;
            border: 1px solid rgba(148, 163, 184, 0.16);
            background: rgba(248, 250, 255, 0.92);
        }

        .prism-class-dialog-student-name {
            min-width: 0;
            color: var(--text-soft);
            font-size: 14px;
            font-weight: 600;
            line-height: 1.35;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }

        .prism-class-dialog-student-actions {
            display: inline-flex;
            align-items: center;
            justify-content: flex-end;
            gap: 4px;
        }

        .prism-class-dialog-student-actions button {
            width: 30px;
            height: 30px;
            min-height: 30px;
            padding: 0;
            display: inline-flex;
            align-items: center;
            justify-content: center;
        }

        .prism-class-dialog-student-actions button svg {
            width: 15px;
            height: 15px;
        }

        .prism-class-dialog-footer {
            justify-content: space-between;
            flex-wrap: wrap;
        }

        .prism-class-dialog-footer > :first-child {
            margin-right: auto;
        }

        @media (max-width: 900px) {
            .prism-dialog-panel.prism-class-dialog-panel {
                width: min(calc(100vw - 28px), 720px);
                max-height: calc(100dvh - 28px);
                padding: 24px;
                overflow-y: auto;
            }

            .prism-class-dialog-layout {
                grid-template-columns: 1fr;
                overflow: visible;
            }
        }

        @media (max-width: 760px) {
            .prism-home-class-list {
                grid-template-columns: 1fr;
            }
        }

        .prism-shape-inspector {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            max-width: min(100%, calc(100% - 12px));
            padding: 6px 10px;
            border: 1px solid rgba(30, 58, 138, 0.08);
            border-radius: 16px;
            background: rgba(255, 255, 255, 0.9);
            box-shadow: 0 10px 28px rgba(15, 23, 42, 0.1);
            backdrop-filter: blur(14px);
            flex-wrap: wrap;
            justify-content: center;
            pointer-events: auto;
        }

        .prism-context-panel .prism-shape-inspector {
            display: flex;
            width: 100%;
            max-width: none;
            padding: 0;
            border: none;
            border-radius: 0;
            background: transparent;
            box-shadow: none;
            backdrop-filter: none;
            justify-content: flex-start;
        }

        .prism-ribbon-zoom {
            min-width: 46px;
            color: var(--muted);
            font-size: 11px;
            font-weight: 600;
            text-align: center;
            letter-spacing: 0.02em;
        }

        .prism-shape-inspector[hidden] {
            display: none !important;
        }

        .prism-shape-inspector-group {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            flex-wrap: nowrap;
        }

        .prism-context-panel .prism-shape-inspector-group {
            width: 100%;
            flex-direction: column;
            align-items: center;
            gap: 5px;
            flex-wrap: nowrap;
        }

        .prism-shape-inspector-label {
            font-size: 11px;
            font-weight: 600;
            color: var(--muted);
            letter-spacing: 0.04em;
            text-transform: uppercase;
        }

        .prism-shape-panel {
            max-height: calc(100dvh - 120px);
            overflow: visible;
        }

        .prism-shape-panel .prism-shape-inspector {
            width: 100%;
        }

        .prism-shape-style-dock {
            position: relative;
            width: 100%;
            padding-top: 10px;
            border-top: 1px solid rgba(148, 163, 184, 0.18);
        }

        .prism-shape-style-dock[hidden] {
            display: none !important;
        }

        .prism-shape-style-stack {
            display: grid;
            justify-items: center;
            width: 100%;
            gap: 8px;
        }

        .prism-shape-style-button {
            position: relative;
            width: 36px;
            min-width: 36px;
            height: 36px;
            padding: 0;
            display: inline-flex;
            align-items: center;
            justify-content: center;
        }

        .prism-shape-style-button.is-active {
            background: rgba(37, 99, 235, 0.16);
            color: var(--primary);
            box-shadow: inset 0 0 0 1px rgba(37, 99, 235, 0.24);
        }

        .prism-shape-style-button i {
            width: 16px;
            height: 16px;
        }

        .prism-shape-style-popout {
            position: absolute;
            bottom: 0;
            left: calc(100% + 8px);
            z-index: 32;
            width: 220px;
            display: flex;
            flex-direction: column;
            gap: 8px;
            padding: 14px;
            border-radius: 16px;
            border: 1px solid rgba(148, 163, 184, 0.18);
            background: rgba(255, 255, 255, 0.95);
            backdrop-filter: blur(12px);
            box-shadow: 0 16px 32px rgba(15, 23, 42, 0.08);
        }

        .prism-shape-style-popout.open-left {
            left: auto;
            right: calc(100% + 8px);
        }

        .prism-shape-style-popout[hidden] {
            display: none !important;
        }

        .prism-shape-style-row {
            display: grid;
            grid-template-columns: 22px 64px 90px;
            align-items: center;
            gap: 8px;
            width: 100%;
        }

        .prism-shape-style-icon {
            width: 18px;
            height: 18px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            color: var(--muted);
        }

        .prism-shape-style-icon i {
            width: 16px;
            height: 16px;
        }

        .prism-shape-style-glyph {
            font-size: 12px;
            font-weight: 700;
            letter-spacing: 0.02em;
            color: var(--muted);
        }

        .prism-shape-style-control {
            display: flex;
            align-items: center;
            justify-content: flex-end;
            min-width: 0;
            width: 90px;
            min-width: 90px;
            max-width: 90px;
        }

        .prism-shape-style-label {
            font-size: 12px;
            font-weight: 600;
            color: var(--navy);
            white-space: nowrap;
        }

        .prism-shape-style-color {
            display: inline-flex;
            align-items: center;
            justify-content: stretch;
            width: 90px;
            height: 36px;
            padding: 2px;
            border-radius: 12px;
            border: 1px solid rgba(30, 58, 138, 0.12);
            background: rgba(255, 255, 255, 0.92);
            overflow: hidden;
        }

        .prism-shape-style-color input {
            width: 100%;
            height: 32px;
            padding: 0;
            border: none;
            background: transparent;
            cursor: pointer;
        }

        .prism-shape-style-select {
            width: 90px;
            min-width: 90px;
            max-width: 90px;
        }

        .prism-shape-style-popout .prism-slide-control,
        .prism-shape-style-popout .prism-slide-control select {
            width: 90px !important;
            min-width: 90px !important;
            max-width: 90px !important;
        }

        .prism-shape-style-popout .prism-slide-control select {
            min-height: 34px !important;
            padding: 0 24px 0 10px !important;
            font-size: 12px !important;
            text-align: left !important;
            border-radius: 11px !important;
        }

        .prism-shape-style-popout #prismShapeStrokeWidthSelect,
        .prism-shape-style-popout #prismShapeDashStyleSelect {
            width: 90px !important;
            min-width: 90px !important;
            max-width: 90px !important;
        }

        .prism-shape-style-popout .prism-shape-opacity {
            width: 90px;
            min-width: 90px;
            max-width: 90px;
            margin: 0;
        }

        .prism-shape-style-actions {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 8px;
            width: 90px;
            min-width: 90px;
        }

        .prism-shape-style-actions .prism-ribbon-btn {
            width: 100%;
            min-width: 0;
            min-height: 34px;
            padding: 0;
        }

        .prism-shape-style-actions .prism-ribbon-btn i {
            width: 16px;
            height: 16px;
        }

        .prism-slide-hud {
            position: absolute;
            bottom: 12px;
            left: 12px;
            z-index: 14;
            display: inline-flex;
            align-items: center;
            gap: 8px;
            pointer-events: auto;
        }

        .prism-slide-position {
            min-width: 44px;
            padding: 4px 8px;
            border-radius: 999px;
            background: rgba(255, 255, 255, 0.82);
            box-shadow: 0 6px 16px rgba(15, 23, 42, 0.08);
            color: var(--muted);
            font-size: 11px;
            font-weight: 600;
            white-space: nowrap;
            text-align: center;
            pointer-events: none;
        }

        .prism-slide-hud-controls {
            display: inline-flex;
            align-items: center;
            gap: 4px;
            padding: 4px 6px;
            border-radius: 999px;
            background: rgba(255, 255, 255, 0.82);
            box-shadow: 0 6px 16px rgba(15, 23, 42, 0.08);
            pointer-events: auto;
        }

        .prism-slide-hud-controls .prism-ribbon-divider {
            height: 20px;
        }

        .prism-slide-display {
            flex: 1;
            min-height: 0;
            padding: clamp(20px, 2vw, 28px);
            display: block;
            position: relative;
            border: none;
            border-radius: 18px;
            overflow: auto;
            background: #eef2f7;
            touch-action: none;
            scrollbar-width: none;
            -ms-overflow-style: none;
        }

        .prism-slide-display::-webkit-scrollbar {
            display: none;
        }

        .prism-slide-stack {
            width: max-content;
            min-width: 100%;
            min-height: 100%;
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 30px;
            padding: 8px clamp(24px, 4vw, 40px) 40px;
            box-sizing: border-box;
        }

        .prism-slide-shell {
            position: relative;
            flex: 0 0 auto;
            display: flex;
            align-items: flex-start;
            justify-content: center;
            background: transparent;
            transition: transform 0.18s ease, box-shadow 0.18s ease;
        }

        .prism-slide-shell.active {
            z-index: 2;
        }

        .prism-slide-shell.active .prism-slide-preview {
            display: none !important;
        }

        .prism-slide-preview {
            width: 100%;
            height: 100%;
            display: block;
            border-radius: 0;
            border: none;
            box-shadow: none;
            background: #ffffff;
        }

        .prism-slide-preview.prism-slide-preview-placeholder {
            position: absolute;
            inset: 0;
        }

        .prism-slide-canvas {
            position: absolute;
            top: 0;
            left: 0;
            width: 848.484848px;
            height: 1200px;
            padding: clamp(10px, 1.4vw, 16px) clamp(12px, 1.8vw, 18px);
            display: flex;
            flex-direction: column;
            justify-content: flex-start;
            gap: clamp(6px, 1vw, 10px);
            border-radius: 0;
            border: none;
            background: #ffffff;
            box-shadow: none;
            overflow: hidden;
            touch-action: none;
            transform-origin: 0 0;
            will-change: transform;
        }

        .prism-slide-canvas.textbox-mode {
            cursor: crosshair;
        }

        .prism-slide-canvas.draw-mode {
            cursor: crosshair;
        }

        .prism-slide-canvas.pan-ready,
        .prism-slide-canvas.pan-mode {
            cursor: grab;
        }

        .prism-canvas-visualizer-box {
            border-radius: 18px;
            overflow: visible;
        }

        .prism-canvas-visualizer-content {
            position: relative;
            width: 100%;
            height: 100%;
            overflow: hidden;
            border: 2px solid color-mix(in srgb, var(--accent) 42%, var(--border));
            border-radius: 18px;
            background: linear-gradient(145deg, color-mix(in srgb, var(--surface-soft) 84%, white), var(--surface));
            box-shadow: 0 18px 40px rgba(15, 23, 42, 0.14);
            color: var(--text-main);
        }

        .prism-canvas-visualizer-preview,
        .prism-canvas-visualizer-video,
        .prism-canvas-visualizer-frozen {
            width: 100%;
            height: 100%;
        }

        .prism-canvas-visualizer-video,
        .prism-canvas-visualizer-frozen {
            display: block;
            object-fit: cover;
        }

        .prism-canvas-visualizer-placeholder {
            display: grid;
            height: 100%;
            place-items: center;
            padding: clamp(10px, 5%, 24px);
            text-align: center;
        }

        .prism-canvas-visualizer-placeholder strong {
            display: block;
            color: var(--text-main);
            font-size: clamp(18px, 8cqw, 44px);
            line-height: 1.05;
        }

        .prism-canvas-visualizer-placeholder span {
            display: block;
            margin-top: 0.35em;
            color: var(--text-muted);
            font-size: clamp(12px, 3.8cqw, 18px);
            font-weight: 700;
        }

        .prism-canvas-visualizer-placeholder.is-error strong {
            color: var(--danger);
        }

        .prism-canvas-visualizer-controls {
            position: absolute;
            left: 10px;
            right: 10px;
            bottom: 10px;
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            gap: 6px;
            pointer-events: auto;
        }

        .prism-canvas-visualizer-control {
            min-height: 30px;
            padding: 6px 10px;
            border: 1px solid color-mix(in srgb, var(--accent) 42%, var(--border));
            border-radius: 999px;
            background: color-mix(in srgb, var(--surface) 92%, transparent);
            color: var(--text-main);
            box-shadow: 0 8px 20px rgba(15, 23, 42, 0.12);
            font: inherit;
            font-size: 12px;
            font-weight: 800;
            cursor: pointer;
        }

        .prism-canvas-visualizer-control:hover:not(:disabled),
        .prism-canvas-visualizer-control:focus-visible:not(:disabled) {
            background: var(--accent);
            color: var(--accent-text);
        }

        .prism-canvas-visualizer-control:disabled {
            cursor: not-allowed;
            opacity: 0.54;
        }

        .visualizer-layout {
            height: 100%;
            display: flex;
            flex-direction: column;
            min-height: 0;
        }

        .visualizer-stage-card {
            flex: 1;
            display: flex;
            flex-direction: column;
            min-height: 0;
            padding: 0;
            overflow: hidden;
            background: transparent;
            border: none;
            border-radius: 0;
            box-shadow: none;
        }

        .visualizer-stage-header {
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 8px;
            padding: 10px 12px 0;
            position: relative;
            z-index: 10;
        }

        .visualizer-stage-header .prism-slide-ribbon,
        .visualizer-stage-header .prism-slide-ribbon-scroll,
        .visualizer-stage-header .prism-slide-ribbon-actions {
            pointer-events: auto;
        }

        .visualizer-device-select {
            width: 180px;
            min-width: 180px;
        }

        .visualizer-device-select select {
            width: 100%;
            height: 32px;
            padding: 5px 28px 5px 10px;
            font-size: 12px;
        }

        .visualizer-status {
            min-height: 20px;
            padding: 0 12px;
            color: var(--muted);
            font-size: 12px;
            font-weight: 500;
            text-align: center;
        }

        .visualizer-status[data-type="success"] {
            color: var(--primary);
        }

        .visualizer-status[data-type="error"] {
            color: #b45309;
        }

        .visualizer-display {
            flex: 1;
            min-height: 0;
            padding: 8px;
        }

        .visualizer-feed-shell {
            position: relative;
            width: 100%;
            height: 100%;
            min-height: 0;
            overflow: hidden;
            border-radius: 18px;
            background: #eef2f7;
        }

        .visualizer-video-wrap {
            position: relative;
            width: 100%;
            height: 100%;
            overflow: hidden;
            --visualizer-rotation: 0deg;
            --visualizer-mirror: 1;
        }

        .visualizer-video,
        .visualizer-freeze-frame {
            position: absolute;
            left: 50%;
            top: 50%;
            display: block;
            width: auto;
            height: auto;
            max-width: none;
            max-height: none;
            border: none;
            border-radius: 0;
            background: transparent;
            transform: translate(-50%, -50%) rotate(var(--visualizer-rotation)) scaleX(var(--visualizer-mirror));
            transform-origin: center center;
            object-fit: contain;
        }

        .visualizer-video[hidden],
        .visualizer-freeze-frame[hidden],
        .visualizer-empty[hidden] {
            display: none !important;
        }

        .visualizer-empty {
            position: absolute;
            inset: 0;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            gap: 10px;
            padding: 24px;
            text-align: center;
            color: var(--muted);
            background: linear-gradient(180deg, rgba(255, 255, 255, 0.54), rgba(238, 242, 247, 0.78));
        }

        .visualizer-empty svg {
            width: 28px;
            height: 28px;
            color: var(--primary);
        }

        .visualizer-empty strong {
            color: var(--text);
            font-size: 18px;
            font-weight: 600;
        }

        .visualizer-empty p {
            max-width: 420px;
            margin: 0;
            font-size: 14px;
            line-height: 1.5;
        }

        .prism-page-sorter-panel {
            position: absolute;
            top: 54px;
            right: 0;
            z-index: 35;
            width: min(300px, calc(100vw - 120px));
            max-height: min(72vh, 760px);
            display: flex;
            flex-direction: column;
            gap: 10px;
            padding: 12px;
            border: 1px solid rgba(30, 58, 138, 0.08);
            border-radius: 18px;
            background: rgba(255, 255, 255, 0.96);
            box-shadow: 0 16px 40px rgba(15, 23, 42, 0.18);
            backdrop-filter: blur(14px);
            pointer-events: auto;
        }

        .prism-page-sorter-panel[hidden] {
            display: none !important;
        }

        .prism-page-sorter-header {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
        }

        .prism-page-sorter-header strong {
            font-size: 12px;
            letter-spacing: 0.08em;
            text-transform: uppercase;
            color: var(--muted);
        }

        .prism-page-sorter-list {
            min-height: 0;
            overflow-y: auto;
            display: flex;
            flex-direction: column;
            gap: 8px;
            padding-right: 2px;
        }

        .prism-page-sorter-item {
            width: 100%;
            display: grid;
            grid-template-columns: 74px minmax(0, 1fr);
            gap: 10px;
            align-items: start;
            padding: 8px;
            border: 1px solid rgba(30, 58, 138, 0.08);
            border-radius: 14px;
            background: rgba(248, 250, 255, 0.92);
            box-shadow: none;
            transform: none;
            text-align: left;
        }

        .prism-page-sorter-item:hover {
            background: rgba(255, 255, 255, 1);
            box-shadow: 0 10px 20px rgba(15, 23, 42, 0.08);
            transform: translateY(-1px);
        }

        .prism-page-sorter-item.is-active {
            border-color: rgba(30, 58, 138, 0.22);
            box-shadow: 0 0 0 2px rgba(30, 58, 138, 0.08);
        }

        .prism-page-sorter-item.is-dragging {
            opacity: 0.45;
        }

        .prism-page-sorter-item.is-drop-target {
            border-color: rgba(250, 204, 21, 0.9);
            box-shadow: 0 0 0 2px rgba(250, 204, 21, 0.24);
        }

        .prism-page-sorter-thumb {
            width: 74px;
            aspect-ratio: 3 / 4;
            border-radius: 10px;
            overflow: hidden;
            border: 1px solid rgba(30, 58, 138, 0.08);
            background: white;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .prism-page-sorter-thumb canvas {
            width: 100%;
            height: 100%;
            object-fit: contain;
            display: block;
        }

        .prism-page-sorter-meta {
            min-width: 0;
            display: flex;
            flex-direction: column;
            gap: 5px;
            color: var(--navy);
            position: relative;
            padding-right: 28px;
        }

        .prism-page-sorter-file {
            font-size: 11px;
            font-weight: 600;
            line-height: 1.3;
            color: var(--muted);
            word-break: break-word;
        }

        .prism-page-sorter-page {
            font-size: 13px;
            font-weight: 600;
            line-height: 1.3;
        }

        .prism-page-sorter-detail {
            font-size: 11px;
            color: var(--muted);
        }

        .prism-page-sorter-delete {
            position: absolute;
            top: 0;
            right: 0;
            width: 24px;
            height: 24px;
            padding: 0;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 999px;
            background: rgba(220, 38, 38, 0.12);
            color: #b91c1c;
            box-shadow: none;
            transform: none;
        }

        .prism-page-sorter-delete:hover {
            background: rgba(220, 38, 38, 0.18);
            color: #991b1b;
            box-shadow: none;
            transform: none;
        }

        .prism-text-context-panel {
            position: relative;
            width: auto;
            align-items: center;
            gap: 8px;
            overflow: visible;
        }

        .prism-text-toolbar-row {
            display: grid;
            grid-template-columns: minmax(0, 1fr);
            gap: 6px;
            width: 100%;
        }

        .prism-text-field-row,
        .prism-text-color-row {
            display: grid;
            grid-template-columns: minmax(0, 1fr);
            gap: 6px;
            width: 36px;
            justify-items: center;
        }

        .prism-text-field-row .prism-slide-control,
        .prism-text-field-row .prism-slide-control select {
            width: 100%;
        }

        .prism-text-context-panel .prism-slide-control select {
            min-width: 0;
            width: 100%;
            min-height: 36px;
            padding: 0 14px 0 4px;
            font-size: 9px;
            text-align: left;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            border-radius: 11px;
        }

        .prism-text-style-btn {
            width: 36px;
            min-width: 36px;
            min-height: 36px;
            padding: 0;
        }

        .prism-text-style-btn span {
            font-weight: 600;
            font-size: 13px;
        }

        .prism-text-style-btn i {
            width: 16px;
            height: 16px;
        }

        .prism-text-style-btn.is-active {
            background: rgba(37, 99, 235, 0.16);
            color: var(--primary);
            box-shadow: inset 0 0 0 1px rgba(37, 99, 235, 0.24);
        }

        .prism-text-color-chip {
            width: 30px;
            min-width: 30px;
            min-height: 30px;
            padding: 2px;
            border-radius: 11px;
            border: 1px solid rgba(30, 58, 138, 0.12);
            background: rgba(255, 255, 255, 0.92);
        }

        .prism-text-color-chip input {
            width: 100%;
            height: 100%;
            min-height: 24px;
            padding: 0;
            border: none;
            background: transparent;
        }

        .prism-text-color-marker {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 16px;
            height: 16px;
            color: var(--muted);
        }

        .prism-text-color-marker i {
            width: 14px;
            height: 14px;
        }

        .prism-text-flyout-row {
            position: relative;
            width: 100%;
            display: grid;
            justify-items: center;
        }

        .prism-layer-controls-row {
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 6px;
        }

        .prism-layer-controls-row .prism-context-tool-btn {
            width: 100%;
            min-width: 0;
        }

        .prism-shape-style-stack > .prism-context-tool-btn,
        .prism-shape-style-stack .prism-layer-controls-row .prism-context-tool-btn {
            width: 28px;
            height: 28px;
            border-radius: 9px;
        }

        .prism-shape-style-stack > .prism-context-tool-btn svg,
        .prism-shape-style-stack .prism-layer-controls-row .prism-context-tool-btn svg {
            width: 15px;
            height: 15px;
        }

        .prism-text-flyout-toggle {
            justify-content: center;
            padding: 0;
            text-align: center;
        }

        .prism-text-flyout-toggle span {
            display: none;
        }

        .prism-text-flyout-panel {
            position: absolute;
            top: 0;
            left: calc(100% + 8px);
            z-index: 30;
            width: 52px;
            display: flex;
            flex-direction: column;
            gap: 6px;
            padding: 8px;
            border-radius: 16px;
            border: 1px solid rgba(148, 163, 184, 0.18);
            background: rgba(255, 255, 255, 0.94);
            backdrop-filter: blur(12px);
            box-shadow: 0 16px 32px rgba(15, 23, 42, 0.08);
        }

        .prism-text-flyout-panel.open-left {
            left: auto;
            right: calc(100% + 8px);
        }

        .prism-text-flyout-panel[hidden] {
            display: none !important;
        }

        .prism-text-flyout-group {
            display: flex;
            flex-direction: column;
            gap: 6px;
            align-items: center;
        }

        .prism-text-flyout-divider {
            height: 1px;
            background: rgba(148, 163, 184, 0.18);
            margin: 2px 0;
        }

        .prism-text-flyout-button {
            width: 36px;
            min-width: 36px;
            min-height: 36px;
            border-radius: 11px;
            justify-content: center;
            gap: 0;
            padding: 0;
            text-align: center;
        }

        .prism-text-flyout-button span {
            font-size: 13px;
            font-weight: 600;
            line-height: 1;
        }

        .prism-text-flyout-button i {
            width: 16px;
            height: 16px;
        }

        .prism-text-flyout-button.is-active {
            background: rgba(37, 99, 235, 0.16);
            color: var(--primary);
            box-shadow: inset 0 0 0 1px rgba(37, 99, 235, 0.24);
        }

        .prism-text-context-panel .prism-slide-control {
            width: 100%;
        }

        #prismTextContextPanel {
            gap: 10px;
            padding-top: 10px;
            padding-bottom: 10px;
        }

        #prismTextContextPanel .prism-text-field-row,
        #prismTextContextPanel .prism-text-color-row {
            width: 34px;
        }

        #prismTextContextPanel .prism-text-style-btn,
        #prismTextContextPanel .prism-text-flyout-button,
        #prismTextContextPanel .prism-layer-controls-row .prism-context-tool-btn {
            width: 28px;
            min-width: 28px;
            min-height: 28px;
            height: 28px;
            border-radius: 9px;
        }

        #prismTextContextPanel .prism-text-style-btn i,
        #prismTextContextPanel .prism-text-flyout-button i,
        #prismTextContextPanel .prism-layer-controls-row .prism-context-tool-btn svg {
            width: 15px;
            height: 15px;
        }

        #prismTextContextPanel .prism-text-style-btn span,
        #prismTextContextPanel .prism-text-flyout-button span {
            font-size: 12px;
        }

        #prismTextContextPanel .prism-text-color-chip {
            width: 28px;
            min-width: 28px;
            min-height: 28px;
            border-radius: 10px;
        }

        #prismTextContextPanel .prism-text-color-chip input {
            min-height: 22px;
        }

        #prismTextContextPanel .prism-slide-control select {
            min-height: 34px;
            border-radius: 10px;
        }

        .prism-slide-canvas.pan-ready.panning,
        .prism-slide-canvas.pan-mode.panning {
            cursor: grabbing;
        }

        .prism-slide-content {
            display: none;
        }

        .prism-slide-canvas.textbox-mode .prism-slide-content,
        .prism-slide-canvas.draw-mode .prism-slide-content {
            pointer-events: none;
        }

        .prism-slide-canvas[data-theme="white"] {
            background: #ffffff;
        }

        .prism-slide-preview[data-theme="white"] {
            background: #ffffff;
        }

        .prism-slide-canvas[data-theme="grid"] {
            background-color: #ffffff;
            background-image:
                linear-gradient(rgba(148, 163, 184, 0.2) 1px, transparent 1px),
                linear-gradient(90deg, rgba(148, 163, 184, 0.2) 1px, transparent 1px);
            background-size:
                33.6px 33.6px,
                33.6px 33.6px;
        }

        .prism-slide-preview[data-theme="grid"] {
            background-color: #ffffff;
            background-image:
                linear-gradient(rgba(148, 163, 184, 0.2) 1px, transparent 1px),
                linear-gradient(90deg, rgba(148, 163, 184, 0.2) 1px, transparent 1px);
            background-size:
                33.6px 33.6px,
                33.6px 33.6px;
        }

        .prism-slide-canvas[data-theme="dots"] {
            background-color: #ffffff;
            background-image: radial-gradient(circle, rgba(148, 163, 184, 0.34) 1px, transparent 1.4px);
            background-size: 26.4px 26.4px;
        }

        .prism-slide-preview[data-theme="dots"] {
            background-color: #ffffff;
            background-image: radial-gradient(circle, rgba(148, 163, 184, 0.34) 1px, transparent 1.4px);
            background-size: 26.4px 26.4px;
        }

        .prism-slide-canvas[data-theme="lines"] {
            background-color: #ffffff;
            background-image: linear-gradient(
                180deg,
                rgba(148, 163, 184, 0.29) 1px,
                transparent 1px
            );
            background-size: 100% 38.2px;
        }

        .prism-slide-preview[data-theme="lines"] {
            background-color: #ffffff;
            background-image: linear-gradient(
                180deg,
                rgba(148, 163, 184, 0.29) 1px,
                transparent 1px
            );
            background-size: 100% 38.2px;
        }

        .prism-slide-canvas[data-theme="dark"] {
            background: #0b0f17;
            border-color: rgba(125, 168, 255, 0.18);
        }

        .prism-slide-preview[data-theme="dark"] {
            background: #0b0f17;
            border-color: rgba(125, 168, 255, 0.18);
        }

        .prism-slide-canvas[data-theme="sepia"] {
            background: #fbf4e8;
        }

        .prism-slide-preview[data-theme="sepia"] {
            background: #fbf4e8;
        }

        .prism-slide-canvas[data-theme="dark-grid"] {
            background-color: #0b0f17;
            background-image:
                linear-gradient(rgba(125, 168, 255, 0.18) 1px, transparent 1px),
                linear-gradient(90deg, rgba(125, 168, 255, 0.18) 1px, transparent 1px);
            background-size:
                33.6px 33.6px,
                33.6px 33.6px;
            border-color: rgba(125, 168, 255, 0.18);
        }

        .prism-slide-preview[data-theme="dark-grid"] {
            background-color: #0b0f17;
            background-image:
                linear-gradient(rgba(125, 168, 255, 0.18) 1px, transparent 1px),
                linear-gradient(90deg, rgba(125, 168, 255, 0.18) 1px, transparent 1px);
            background-size:
                33.6px 33.6px,
                33.6px 33.6px;
            border-color: rgba(125, 168, 255, 0.18);
        }

        .prism-slide-canvas[data-theme="dark-dots"] {
            background-color: #0b0f17;
            background-image: radial-gradient(circle, rgba(125, 168, 255, 0.42) 1px, transparent 1.5px);
            background-size: 26.4px 26.4px;
            border-color: rgba(125, 168, 255, 0.18);
        }

        .prism-slide-preview[data-theme="dark-dots"] {
            background-color: #0b0f17;
            background-image: radial-gradient(circle, rgba(125, 168, 255, 0.42) 1px, transparent 1.5px);
            background-size: 26.4px 26.4px;
            border-color: rgba(125, 168, 255, 0.18);
        }

        .prism-slide-canvas[data-theme="dark-lines"] {
            background-color: #0b0f17;
            background-image: linear-gradient(
                180deg,
                rgba(125, 168, 255, 0.28) 1px,
                transparent 1px
            );
            background-size: 100% 38.2px;
            border-color: rgba(125, 168, 255, 0.18);
        }

        .prism-slide-preview[data-theme="dark-lines"] {
            background-color: #0b0f17;
            background-image: linear-gradient(
                180deg,
                rgba(125, 168, 255, 0.28) 1px,
                transparent 1px
            );
            background-size: 100% 38.2px;
            border-color: rgba(125, 168, 255, 0.18);
        }

        .prism-slide-canvas[data-theme="sepia-grid"] {
            background-color: #fbf4e8;
            background-image:
                linear-gradient(rgba(154, 145, 132, 0.26) 1px, transparent 1px),
                linear-gradient(90deg, rgba(154, 145, 132, 0.26) 1px, transparent 1px);
            background-size:
                33.6px 33.6px,
                33.6px 33.6px;
        }

        .prism-slide-preview[data-theme="sepia-grid"] {
            background-color: #fbf4e8;
            background-image:
                linear-gradient(rgba(154, 145, 132, 0.26) 1px, transparent 1px),
                linear-gradient(90deg, rgba(154, 145, 132, 0.26) 1px, transparent 1px);
            background-size:
                33.6px 33.6px,
                33.6px 33.6px;
        }

        .prism-slide-canvas[data-theme="sepia-dots"] {
            background-color: #fbf4e8;
            background-image: radial-gradient(circle, rgba(154, 145, 132, 0.42) 1px, transparent 1.4px);
            background-size: 26.4px 26.4px;
        }

        .prism-slide-preview[data-theme="sepia-dots"] {
            background-color: #fbf4e8;
            background-image: radial-gradient(circle, rgba(154, 145, 132, 0.42) 1px, transparent 1.4px);
            background-size: 26.4px 26.4px;
        }

        .prism-slide-canvas[data-theme="sepia-lines"] {
            background-color: #fbf4e8;
            background-image: linear-gradient(
                180deg,
                rgba(154, 145, 132, 0.32) 1px,
                transparent 1px
            );
            background-size: 100% 38.2px;
        }

        .prism-slide-preview[data-theme="sepia-lines"] {
            background-color: #fbf4e8;
            background-image: linear-gradient(
                180deg,
                rgba(154, 145, 132, 0.32) 1px,
                transparent 1px
            );
            background-size: 100% 38.2px;
        }

        .prism-slide-canvas[data-theme="grid"],
        .prism-slide-canvas[data-theme="dots"],
        .prism-slide-canvas[data-theme="lines"],
        .prism-slide-canvas[data-theme="dark-grid"],
        .prism-slide-canvas[data-theme="dark-dots"],
        .prism-slide-canvas[data-theme="dark-lines"],
        .prism-slide-canvas[data-theme="sepia-grid"],
        .prism-slide-canvas[data-theme="sepia-dots"],
        .prism-slide-canvas[data-theme="sepia-lines"] {
            background-repeat: repeat;
        }

        .prism-slide-preview[data-theme="grid"],
        .prism-slide-preview[data-theme="dots"],
        .prism-slide-preview[data-theme="lines"],
        .prism-slide-preview[data-theme="dark-grid"],
        .prism-slide-preview[data-theme="dark-dots"],
        .prism-slide-preview[data-theme="dark-lines"],
        .prism-slide-preview[data-theme="sepia-grid"],
        .prism-slide-preview[data-theme="sepia-dots"],
        .prism-slide-preview[data-theme="sepia-lines"] {
            background-repeat: repeat;
        }

        .prism-slide-title {
            margin: 0;
            color: #0f172a;
            font-size: clamp(24px, 2.5vw, 40px);
            line-height: 1.08;
            white-space: pre-wrap;
        }

        .prism-slide-body {
            color: #334155;
            font-size: clamp(16px, 1.45vw, 22px);
            line-height: 1.38;
            white-space: pre-wrap;
        }

        .prism-slide-editable {
            position: relative;
            outline: none;
            border-radius: 12px;
            cursor: text;
            transition: background-color 0.2s ease, box-shadow 0.2s ease;
        }

        .prism-slide-editable:hover {
            background: rgba(255, 255, 255, 0.35);
        }

        .prism-slide-editable:focus {
            background: rgba(255, 255, 255, 0.72);
            box-shadow: 0 0 0 2px rgba(30, 58, 138, 0.12);
        }

        .prism-slide-editable[data-placeholder]:empty::before {
            content: attr(data-placeholder);
            color: #94a3b8;
            pointer-events: none;
        }

        .prism-image-layer,
        .prism-page-background-layer,
        .prism-shape-layer,
        .prism-textbox-layer,
        .prism-selection-layer {
            position: absolute;
            inset: 0;
            pointer-events: none;
        }

        .prism-page-background-layer {
            z-index: 0;
            overflow: hidden;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .prism-page-background-image {
            width: 100%;
            height: 100%;
            object-fit: contain;
            object-position: center;
            display: block;
            user-select: none;
            pointer-events: none;
        }

        .prism-image-layer,
        .prism-shape-layer,
        .prism-textbox-layer {
            z-index: auto;
        }

        .prism-selection-layer {
            z-index: 10000;
        }

        .prism-slide-canvas.draw-mode .prism-image-layer,
        .prism-slide-canvas.draw-mode .prism-shape-layer,
        .prism-slide-canvas.draw-mode .prism-textbox-layer,
        .prism-slide-canvas.draw-mode .prism-selection-layer,
        .prism-slide-canvas.draw-mode .prism-overlay-item {
            pointer-events: none;
        }

        .prism-slide-canvas.draw-mode .prism-image-layer *,
        .prism-slide-canvas.draw-mode .prism-shape-layer *,
        .prism-slide-canvas.draw-mode .prism-textbox-layer *,
        .prism-slide-canvas.draw-mode .prism-selection-layer *,
        .prism-slide-canvas.draw-mode .prism-drawing-hit-target {
            pointer-events: none !important;
        }

        .prism-drawing-layer {
            position: absolute;
            inset: 0;
            z-index: 8000;
            width: 100%;
            height: 100%;
            pointer-events: none;
            overflow: visible;
        }

        .prism-drawing-group {
            pointer-events: none;
        }

        .prism-drawing-layer .prism-drawing-stroke {
            pointer-events: none;
        }

        .prism-drawing-hit-target {
            fill: none;
            stroke: transparent;
            pointer-events: visibleStroke;
            cursor: move;
        }

        .prism-drawing-selection-outline {
            fill: none;
            stroke: rgba(30, 58, 138, 0.24);
            stroke-linecap: round;
            stroke-linejoin: round;
            vector-effect: non-scaling-stroke;
            pointer-events: none;
        }

        .prism-drawing-stroke {
            fill: none;
            stroke-linecap: round;
            stroke-linejoin: round;
            vector-effect: non-scaling-stroke;
        }

        .prism-drawing-stroke.highlighter {
            mix-blend-mode: multiply;
        }

        .prism-overlay-item.selected,
        .prism-overlay-item.selected-member {
            z-index: 9000 !important;
        }

        .prism-overlay-item {
            position: absolute;
            pointer-events: auto;
            touch-action: none;
            transition: border-color 0.18s ease, background-color 0.18s ease, box-shadow 0.18s ease;
        }

        .prism-overlay-item.selected-member::after {
            content: "";
            position: absolute;
            inset: -4px;
            border: 1.5px dashed rgba(30, 58, 138, 0.32);
            border-radius: 12px;
            pointer-events: none;
        }

        .prism-overlay-link-badge {
            position: absolute;
            top: -10px;
            right: -10px;
            z-index: 1000;
            width: 26px;
            height: 26px;
            border: 1px solid color-mix(in srgb, var(--accent) 46%, var(--border));
            border-radius: 999px;
            background: var(--surface);
            color: var(--accent-strong);
            display: inline-flex;
            align-items: center;
            justify-content: center;
            box-shadow: 0 8px 18px rgba(15, 23, 42, 0.14);
            cursor: pointer;
            pointer-events: auto;
        }

        .prism-overlay-link-badge:hover,
        .prism-overlay-link-badge:focus-visible {
            background: var(--accent-soft);
            outline: none;
        }

        .prism-overlay-link-badge svg {
            width: 14px;
            height: 14px;
        }

        .prism-selection-box,
        .prism-selection-marquee {
            position: absolute;
            border: 1.5px dashed rgba(30, 58, 138, 0.54);
            border-radius: 12px;
            background: rgba(30, 58, 138, 0.08);
            box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.72) inset;
        }

        .prism-selection-box {
            pointer-events: auto;
            touch-action: none;
            cursor: move;
        }

        .prism-selection-marquee {
            pointer-events: none;
        }

        .prism-selection-box .prism-overlay-resize {
            pointer-events: auto;
        }

        .prism-textbox {
            min-width: 72px;
            min-height: 12px;
        }

        .prism-textbox-content {
            width: 100%;
            height: 100%;
            min-width: 72px;
            padding: 4px 6px;
            border: 1px dashed transparent;
            border-radius: 8px;
            background: rgba(255, 255, 255, 0.15);
            color: #0f172a;
            line-height: 1.25;
            white-space: normal;
            outline: none;
            cursor: text;
            overflow-x: hidden;
            overflow-y: auto;
            touch-action: auto;
            display: block;
            text-align: left;
            overflow-wrap: anywhere;
            word-break: break-word;
            font-family: "Poppins", sans-serif;
            --prism-text-highlight-color: transparent;
            box-sizing: border-box;
            position: relative;
        }

        .prism-slide-display[data-theme^="dark"] .prism-textbox-content {
            color: #edf4ff;
            background: rgba(15, 23, 42, 0.46);
        }

        .prism-textbox:hover .prism-textbox-content {
            background: rgba(255, 255, 255, 0.45);
            border-color: rgba(30, 58, 138, 0.16);
        }

        .prism-slide-display[data-theme^="dark"] .prism-textbox:hover .prism-textbox-content {
            background: rgba(30, 41, 59, 0.7);
            border-color: rgba(125, 168, 255, 0.28);
        }

        .prism-textbox.selected .prism-textbox-content,
        .prism-textbox:focus-within .prism-textbox-content {
            background: rgba(255, 255, 255, 0.78);
            border-color: rgba(30, 58, 138, 0.35);
            box-shadow: 0 0 0 2px rgba(30, 58, 138, 0.12);
        }

        .prism-slide-display[data-theme^="dark"] .prism-textbox.selected .prism-textbox-content,
        .prism-slide-display[data-theme^="dark"] .prism-textbox:focus-within .prism-textbox-content {
            background: rgba(30, 41, 59, 0.88);
            border-color: rgba(125, 168, 255, 0.44);
            box-shadow: 0 0 0 2px rgba(125, 168, 255, 0.14);
        }

        .prism-overlay-item.dragging {
            cursor: grabbing;
            box-shadow: 0 10px 24px rgba(30, 58, 138, 0.16);
        }

        .prism-textbox.dragging .prism-textbox-content {
            background: rgba(255, 255, 255, 0.88);
        }

        .prism-text-rich-root {
            width: 100%;
            min-height: 0;
            line-height: inherit;
            display: block;
            margin: 0;
            padding: 0;
            position: relative;
            box-sizing: border-box;
            outline: none;
            cursor: text;
            white-space: normal;
            overflow-wrap: anywhere;
            word-break: break-word;
        }

        .prism-text-rich-root[data-empty="true"]::before {
            content: attr(data-placeholder);
            position: absolute;
            top: 0;
            left: 0;
            color: #94a3b8;
            pointer-events: none;
        }

        .prism-slide-display[data-theme^="dark"] .prism-text-rich-root[data-empty="true"]::before {
            color: #8ea3c8;
        }

        .prism-text-rich-root > *,
        .prism-text-rich-root p,
        .prism-text-rich-root div {
            margin: 0 0 0.18em;
            padding: 0;
        }

        .prism-textbox-content[data-highlight-active="true"] .prism-text-rich-root,
        .prism-textbox-content[data-highlight-active="true"] .prism-text-rich-root * {
            background-color: var(--prism-text-highlight-color);
            -webkit-box-decoration-break: clone;
            box-decoration-break: clone;
        }

        .prism-text-rich-root > *:last-child {
            margin-bottom: 0;
        }

        .prism-text-rich-root ul,
        .prism-text-rich-root ol {
            padding-left: 1.25em;
        }

        .prism-text-rich-root li {
            margin: 0.12em 0;
        }

        .prism-text-rich-root ul ul,
        .prism-text-rich-root ul ol,
        .prism-text-rich-root ol ul,
        .prism-text-rich-root ol ol {
            margin-top: 0.16em;
            margin-bottom: 0;
        }

        .prism-equation-box {
            min-width: 120px;
            min-height: 58px;
            padding: 6px 8px;
            display: flex;
            flex-direction: column;
            gap: 6px;
            border: 1px dashed transparent;
            border-radius: 10px;
            background: rgba(255, 255, 255, 0.2);
        }

        .prism-slide-display[data-theme^="dark"] .prism-equation-box {
            background: rgba(15, 23, 42, 0.48);
        }

        .prism-equation-box:hover {
            background: rgba(255, 255, 255, 0.46);
            border-color: rgba(30, 58, 138, 0.16);
        }

        .prism-slide-display[data-theme^="dark"] .prism-equation-box:hover {
            background: rgba(30, 41, 59, 0.72);
            border-color: rgba(125, 168, 255, 0.28);
        }

        .prism-equation-box.selected {
            background: rgba(255, 255, 255, 0.82);
            border-color: rgba(30, 58, 138, 0.35);
            box-shadow: 0 0 0 2px rgba(30, 58, 138, 0.12);
        }

        .prism-slide-display[data-theme^="dark"] .prism-equation-box.selected {
            background: rgba(30, 41, 59, 0.9);
            border-color: rgba(125, 168, 255, 0.44);
            box-shadow: 0 0 0 2px rgba(125, 168, 255, 0.14);
        }

        .prism-equation-box.dragging {
            background: rgba(255, 255, 255, 0.9);
        }

        .prism-equation-display {
            flex: 1;
            min-height: 34px;
            display: flex;
            align-items: center;
            justify-content: center;
            overflow: hidden;
            color: #0f172a;
            text-align: center;
        }

        .prism-slide-display[data-theme^="dark"] .prism-equation-display {
            color: #edf4ff;
        }

        .prism-equation-display.is-empty::before {
            content: attr(data-placeholder);
            color: #94a3b8;
            font-size: 13px;
        }

        .prism-slide-display[data-theme^="dark"] .prism-equation-display.is-empty::before {
            color: #8ea3c8;
        }

        .prism-equation-display svg {
            max-width: 100%;
            max-height: 100%;
        }

        .prism-equation-display .MathJax {
            max-width: 100%;
        }

        .prism-equation-source {
            display: none;
            width: 100%;
            min-height: 44px;
            padding: 6px 8px;
            border: 1px solid rgba(30, 58, 138, 0.16);
            border-radius: 8px;
            background: rgba(255, 255, 255, 0.98);
            color: #0f172a;
            font: 500 12px/1.35 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
            resize: none;
            outline: none;
            touch-action: auto;
        }

        .prism-slide-display[data-theme^="dark"] .prism-equation-source {
            border-color: rgba(125, 168, 255, 0.24);
            background: rgba(15, 23, 42, 0.94);
            color: #edf4ff;
        }

        .prism-equation-box.selected .prism-equation-source,
        .prism-equation-source:focus {
            display: block;
        }

        .prism-equation-source:focus {
            border-color: rgba(30, 58, 138, 0.34);
            box-shadow: 0 0 0 2px rgba(30, 58, 138, 0.12);
        }

        .prism-shape-box {
            min-width: 36px;
            min-height: 36px;
            background: transparent;
            box-shadow: none;
        }

        .prism-shape-box.endpoint-shape {
            min-width: 0;
            min-height: 0;
        }

        .prism-shape-box.selected {
            box-shadow: 0 0 0 1.5px rgba(30, 58, 138, 0.32);
        }

        .prism-image-box {
            min-width: 48px;
            min-height: 48px;
            overflow: visible;
            background: transparent;
            box-shadow: none;
        }

        .prism-image-box.selected {
            z-index: 5;
        }

        .prism-image-frame {
            position: absolute;
            inset: 0;
            overflow: hidden;
            border-radius: 8px;
            background: transparent;
            box-shadow: none;
        }

        .prism-image-content {
            position: absolute;
            display: block;
            object-fit: fill;
            user-select: none;
            -webkit-user-drag: none;
            pointer-events: none;
        }

        .prism-image-box.selected .prism-image-frame {
            box-shadow: 0 0 0 2px rgba(30, 58, 138, 0.18), 0 8px 18px rgba(15, 23, 42, 0.12);
        }

        .prism-image-crop-guide {
            position: absolute;
            border: 1px dashed rgba(30, 58, 138, 0.55);
            border-radius: 8px;
            display: none;
            pointer-events: none;
            z-index: 2;
        }

        .prism-image-crop-mask {
            position: absolute;
            background: rgba(15, 23, 42, 0.26);
            display: none;
            pointer-events: none;
            z-index: 1;
        }

        .prism-image-box.cropping .prism-image-crop-mask,
        .prism-image-box.cropping .prism-image-crop-guide {
            display: block;
        }

        .prism-image-box.cropping .prism-image-frame {
            box-shadow: 0 0 0 2px rgba(30, 58, 138, 0.18), 0 8px 18px rgba(15, 23, 42, 0.12);
        }

        .prism-image-box.cropping .prism-image-content {
            box-shadow: none;
        }

        .prism-image-box.cropping .prism-image-crop-guide {
            border: 1px dashed rgba(30, 58, 138, 0.55);
            background: transparent;
        }

        .prism-image-crop-handle {
            position: absolute;
            width: 18px;
            height: 18px;
            padding: 0;
            display: none;
            align-items: center;
            justify-content: center;
            border-radius: 999px;
            background: rgba(255, 255, 255, 0.96);
            color: var(--navy);
            box-shadow: 0 4px 10px rgba(15, 23, 42, 0.12);
            z-index: 4;
        }

        .prism-image-crop-handle::before {
            content: "";
            width: 8px;
            height: 8px;
            border-radius: 999px;
            background: currentColor;
            opacity: 0.86;
        }

        .prism-image-box.cropping .prism-image-crop-handle {
            display: inline-flex;
        }

        .prism-image-crop-handle[data-edge="top"] {
            top: -9px;
            left: 50%;
            transform: translateX(-50%);
            cursor: ns-resize;
        }

        .prism-image-crop-handle[data-edge="right"] {
            top: 50%;
            right: -9px;
            transform: translateY(-50%);
            cursor: ew-resize;
        }

        .prism-image-crop-handle[data-edge="bottom"] {
            bottom: -9px;
            left: 50%;
            transform: translateX(-50%);
            cursor: ns-resize;
        }

        .prism-image-crop-handle[data-edge="left"] {
            top: 50%;
            left: -9px;
            transform: translateY(-50%);
            cursor: ew-resize;
        }

        .prism-shape {
            width: 100%;
            height: 100%;
            pointer-events: none;
        }

        .prism-shape-svg {
            width: 100%;
            height: 100%;
            overflow: visible;
            display: block;
        }

        .prism-shape-preview-layer {
            position: absolute;
            inset: 0;
            pointer-events: none;
            z-index: 4;
        }

        .prism-shape-preview-svg {
            width: 100%;
            height: 100%;
            overflow: visible;
        }

        .prism-shape-svg .shape-fill {
            vector-effect: non-scaling-stroke;
        }

        .prism-shape-svg .line-fill,
        .prism-shape-svg .shape-open {
            fill: none;
            stroke-linecap: round;
            stroke-linejoin: round;
            vector-effect: non-scaling-stroke;
        }

        .prism-shape-svg .shape-fill.angular {
            stroke-linejoin: miter;
            stroke-linecap: butt;
        }

        .prism-overlay-delete,
        .prism-overlay-more,
        .prism-overlay-endpoint,
        .prism-overlay-resize,
        .prism-overlay-rotate {
            position: absolute;
            width: 18px;
            height: 18px;
            padding: 0;
            display: none;
            align-items: center;
            justify-content: center;
            border-radius: 999px;
            background: rgba(255, 255, 255, 0.95);
            color: var(--navy);
            box-shadow: 0 4px 10px rgba(15, 23, 42, 0.12);
            z-index: 3;
        }

        .prism-overlay-delete:hover,
        .prism-overlay-more:hover,
        .prism-overlay-endpoint:hover,
        .prism-overlay-resize:hover,
        .prism-overlay-rotate:hover {
            background: rgba(255, 255, 255, 1);
            box-shadow: 0 4px 10px rgba(15, 23, 42, 0.12);
            transform: none;
        }

        .prism-overlay-delete {
            top: -9px;
            right: -9px;
        }

        .prism-overlay-more {
            top: -9px;
            left: -9px;
        }

        .prism-overlay-menu {
            position: absolute;
            top: 16px;
            left: -9px;
            min-width: 118px;
            display: flex;
            flex-direction: column;
            gap: 2px;
            padding: 6px;
            border: 1px solid rgba(30, 58, 138, 0.08);
            border-radius: 12px;
            background: rgba(255, 255, 255, 0.96);
            box-shadow: 0 10px 24px rgba(15, 23, 42, 0.12);
            z-index: 6;
        }

        .prism-overlay-menu[hidden] {
            display: none !important;
        }

        .prism-overlay-menu button {
            width: 100%;
            min-height: 30px;
            padding: 6px 8px;
            justify-content: flex-start;
            border-radius: 8px;
            background: transparent;
            color: var(--navy);
            font-size: 12px;
            font-weight: 500;
            box-shadow: none;
            transform: none;
        }

        .prism-overlay-menu button:hover {
            background: rgba(30, 58, 138, 0.08);
            box-shadow: none;
            transform: none;
        }

        .prism-canvas-context-menu {
            position: fixed;
            min-width: 142px;
            padding: 6px;
            display: flex;
            flex-direction: column;
            gap: 2px;
            border: 1px solid color-mix(in srgb, var(--border) 78%, transparent);
            border-radius: 12px;
            background: color-mix(in srgb, var(--surface) 96%, transparent);
            box-shadow: var(--shadow);
            z-index: 10000;
        }

        .prism-canvas-context-menu[hidden] {
            display: none !important;
        }

        .prism-canvas-context-menu button {
            width: 100%;
            padding: 8px 10px;
            border: 0;
            border-radius: 8px;
            background: transparent;
            color: var(--text-main);
            font-size: 13px;
            font-weight: 600;
            line-height: 1.2;
            text-align: left;
            box-shadow: none;
            cursor: pointer;
            transform: none;
        }

        .prism-canvas-context-menu button:hover,
        .prism-canvas-context-menu button:focus-visible {
            background: var(--accent-soft);
            color: var(--accent-strong);
            box-shadow: none;
            outline: none;
            transform: none;
        }

        .prism-canvas-context-menu button:disabled {
            color: var(--text-muted);
            cursor: default;
            opacity: 0.48;
        }

        .prism-canvas-context-menu button:disabled:hover {
            background: transparent;
            color: var(--text-muted);
        }

        .prism-overlay-resize {
            cursor: nwse-resize;
        }

        .prism-overlay-endpoint {
            cursor: move;
            transform: translate(-50%, -50%) rotate(calc(-1 * var(--shape-rotation, 0deg)));
            transform-origin: center center;
        }

        .prism-overlay-endpoint:hover,
        .prism-overlay-endpoint:active {
            transform: translate(-50%, -50%) rotate(calc(-1 * var(--shape-rotation, 0deg)));
        }

        .prism-overlay-endpoint::before {
            content: "";
            width: 7px;
            height: 7px;
            border-radius: 999px;
            background: currentColor;
        }

        .prism-overlay-rotate {
            top: -26px;
            left: 50%;
            cursor: grab;
            transform: translateX(-50%) rotate(calc(-1 * var(--shape-rotation, 0deg)));
            transform-origin: center center;
        }

        .prism-overlay-rotate:active {
            cursor: grabbing;
        }

        .prism-overlay-rotate:hover,
        .prism-overlay-rotate:active {
            transform: translateX(-50%) rotate(calc(-1 * var(--shape-rotation, 0deg)));
        }

        .prism-overlay-resize::before {
            content: "";
            width: 7px;
            height: 7px;
            border-radius: 2px;
            background: currentColor;
        }

        .prism-overlay-resize[data-handle="nw"] {
            top: -9px;
            left: -9px;
            cursor: nwse-resize;
        }

        .prism-overlay-resize[data-handle="n"] {
            top: -9px;
            left: 50%;
            transform: translateX(-50%);
            cursor: ns-resize;
        }

        .prism-overlay-resize[data-handle="ne"] {
            top: -9px;
            right: -9px;
            cursor: nesw-resize;
        }

        .prism-overlay-resize[data-handle="e"] {
            top: 50%;
            right: -9px;
            transform: translateY(-50%);
            cursor: ew-resize;
        }

        .prism-overlay-resize[data-handle="se"] {
            right: -9px;
            bottom: -9px;
            cursor: nwse-resize;
        }

        .prism-overlay-resize[data-handle="s"] {
            bottom: -9px;
            left: 50%;
            transform: translateX(-50%);
            cursor: ns-resize;
        }

        .prism-overlay-resize[data-handle="sw"] {
            bottom: -9px;
            left: -9px;
            cursor: nesw-resize;
        }

        .prism-overlay-resize[data-handle="w"] {
            top: 50%;
            left: -9px;
            transform: translateY(-50%);
            cursor: ew-resize;
        }

        .prism-overlay-item.selected .prism-overlay-delete,
        .prism-overlay-item.selected .prism-overlay-more,
        .prism-overlay-item.selected .prism-overlay-endpoint,
        .prism-overlay-item.selected .prism-overlay-resize,
        .prism-overlay-item.selected .prism-overlay-rotate {
            display: inline-flex;
        }

        .prism-slide-control {
            display: flex;
            flex-direction: column;
            min-width: 0;
        }

        .prism-slide-control select {
            min-width: 106px;
            padding: 4px 8px;
            border-radius: 10px;
            font-size: 12px;
            background: rgba(30, 58, 138, 0.04);
        }

        .prism-shape-style-select {
            min-width: 66px !important;
        }

        .prism-shape-opacity {
            width: 42px;
            accent-color: var(--navy);
        }

        .prism-ribbon-divider {
            width: 1px;
            height: 22px;
            margin: 0 2px;
            background: rgba(30, 58, 138, 0.12);
        }

        .prism-ribbon-btn {
            width: 32px;
            height: 32px;
            padding: 0;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border: none;
            border-radius: 10px;
            background: transparent;
            color: #0f172a;
            box-shadow: none;
            transform: none;
            outline: none;
            transition:
                background-color 0.16s ease,
                color 0.16s ease,
                box-shadow 0.16s ease,
                border-color 0.16s ease;
        }

        .prism-ribbon-btn.is-active {
            background: rgba(37, 99, 235, 0.14);
            color: var(--primary);
            box-shadow: inset 0 0 0 1px rgba(37, 99, 235, 0.18);
        }

        .prism-ribbon-btn:hover {
            background: rgba(37, 99, 235, 0.08);
            color: var(--navy);
            box-shadow: none;
            transform: none;
        }

        .prism-ribbon-btn:focus {
            outline: none;
        }

        .prism-ribbon-btn:focus:not(:focus-visible) {
            outline: none;
            box-shadow: none;
        }

        .prism-ribbon-btn:focus-visible {
            outline: none;
            background: rgba(37, 99, 235, 0.08);
            color: var(--navy);
            box-shadow:
                0 0 0 2px rgba(37, 99, 235, 0.18),
                0 0 0 4px rgba(37, 99, 235, 0.08);
        }

        .prism-ribbon-btn.is-active:focus-visible {
            background: rgba(37, 99, 235, 0.14);
            color: var(--primary);
            box-shadow:
                inset 0 0 0 1px rgba(37, 99, 235, 0.18),
                0 0 0 2px rgba(37, 99, 235, 0.18),
                0 0 0 4px rgba(37, 99, 235, 0.08);
        }

        .prism-ribbon-btn:disabled {
            opacity: 0.42;
            cursor: default;
            pointer-events: none;
        }

        .prism-ribbon-btn.danger:hover {
            background: rgba(220, 38, 38, 0.08);
            color: var(--danger);
        }

        .prism-ribbon-btn svg,
        .prism-slide-theme-icon svg,
        .prism-overlay-delete svg,
        .prism-overlay-rotate svg {
            width: 17px;
            height: 17px;
            stroke-width: 2;
        }

        .prism-slide-theme-picker {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            padding: 0 2px 0 1px;
        }

        .prism-ribbon-glyph {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 18px;
            min-width: 18px;
            height: 18px;
            font-size: 14px;
            font-weight: 600;
            line-height: 1;
            letter-spacing: -0.02em;
            text-align: center;
        }

        .prism-ribbon-glyph-small {
            font-size: 9px;
            letter-spacing: 0.04em;
        }

        .prism-draw-picker {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            padding: 0 2px 0 1px;
        }

        .prism-draw-tool-group {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            flex-wrap: nowrap;
        }

        .prism-draw-swatches {
            display: inline-flex;
            align-items: center;
            gap: 4px;
        }

        .prism-context-panel .prism-draw-swatches {
            width: 100%;
            flex-direction: column;
            flex-wrap: nowrap;
            align-items: center;
            justify-content: center;
            gap: 8px;
        }

        .prism-draw-swatch {
            width: 16px;
            height: 16px;
            padding: 0;
            border: 2px solid rgba(30, 58, 138, 0.14);
            border-radius: 999px;
            box-shadow: none;
            transform: none;
        }

        .prism-draw-swatch:hover {
            box-shadow: none;
            transform: none;
            border-color: rgba(30, 58, 138, 0.32);
        }

        .prism-draw-swatch.is-active {
            border-color: rgba(15, 23, 42, 0.86);
            box-shadow: 0 0 0 2px rgba(15, 23, 42, 0.08);
        }

        .prism-highlighter-swatch {
            opacity: 0.72;
        }

        .prism-highlighter-swatch.is-active {
            opacity: 1;
        }

        .prism-thickness-stack {
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 8px;
            width: 100%;
        }

        .prism-draw-tool-stack {
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 4px;
            width: 100%;
        }

        .prism-context-tool-btn {
            width: 30px;
            height: 30px;
            padding: 0;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 10px;
            background: transparent;
            color: #0f172a;
            box-shadow: none;
            transform: none;
        }

        .prism-context-tool-btn:hover {
            background: rgba(30, 58, 138, 0.08);
            box-shadow: none;
            transform: none;
        }

        .prism-context-tool-btn.is-active {
            background: rgba(30, 58, 138, 0.12);
            color: var(--navy);
        }

        .prism-thickness-btn {
            width: 30px;
            height: 30px;
            padding: 0;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 10px;
            background: transparent;
            color: #0f172a;
            box-shadow: none;
            transform: none;
        }

        .prism-thickness-btn:hover {
            background: rgba(30, 58, 138, 0.08);
            box-shadow: none;
            transform: none;
        }

        .prism-thickness-btn.is-active {
            background: rgba(30, 58, 138, 0.12);
            color: var(--navy);
        }

        .prism-thickness-dot {
            display: block;
            border-radius: 999px;
            background: currentColor;
        }

        .prism-draw-picker input[type="color"] {
            width: 34px;
            height: 34px;
            padding: 0;
            border: 1px solid rgba(30, 58, 138, 0.14);
            border-radius: 10px;
            background: transparent;
            cursor: pointer;
            overflow: hidden;
        }

        .prism-pen-color-input {
            width: 27px !important;
            height: 27px !important;
            border-radius: 8px !important;
        }

        .prism-context-panel .prism-pen-color-input {
            display: block;
            margin: 0 auto;
        }

        .prism-draw-picker input[type="color"]::-webkit-color-swatch-wrapper {
            padding: 0;
        }

        .prism-draw-picker input[type="color"]::-webkit-color-swatch {
            border: none;
            border-radius: 9px;
        }

        .prism-context-panel input[type="color"]::-webkit-color-swatch-wrapper {
            padding: 0;
        }

        .prism-context-panel input[type="color"]::-webkit-color-swatch {
            border: none;
            border-radius: 9px;
        }

        .prism-shape-picker {
            position: relative;
            display: inline-flex;
            align-items: center;
            z-index: 30;
        }

        .prism-shape-color-input {
            width: 34px;
            height: 34px;
            padding: 0;
            border: 1px solid rgba(30, 58, 138, 0.14);
            border-radius: 10px;
            background: transparent;
            cursor: pointer;
            overflow: hidden;
        }

        .prism-shape-color-input::-webkit-color-swatch-wrapper {
            padding: 0;
        }

        .prism-shape-color-input::-webkit-color-swatch {
            border: none;
            border-radius: 9px;
        }

        .prism-shape-color-input:disabled {
            opacity: 0.42;
            cursor: default;
        }

        .prism-shape-menu {
            position: static;
            width: 100%;
            min-width: 0;
            flex: 1 1 auto;
            min-height: 0;
            max-height: min(100%, calc(100dvh - 180px));
            padding: 14px 0;
            display: grid;
            grid-template-columns: 1fr;
            gap: 4px;
            border: none;
            border-radius: 0;
            background: transparent;
            box-shadow: none;
            z-index: auto;
            pointer-events: auto;
            overflow-y: auto;
            overflow-x: hidden;
            scroll-behavior: smooth;
            scrollbar-width: none;
            -ms-overflow-style: none;
            overscroll-behavior: contain;
            touch-action: pan-y;
            -webkit-overflow-scrolling: touch;
        }

        .prism-shape-menu::-webkit-scrollbar {
            display: none;
        }

        .prism-shape-menu[hidden] {
            display: none !important;
        }

        .prism-shape-option {
            width: 100%;
            height: 30px;
            padding: 0;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 10px;
            background: transparent;
            color: #0f172a;
            box-shadow: none;
            transform: none;
            touch-action: manipulation;
        }

        .prism-shape-option:hover {
            background: rgba(30, 58, 138, 0.08);
            box-shadow: none;
            transform: none;
        }

        .prism-shape-option-preview {
            width: 18px;
            height: 18px;
        }

        .prism-shape-option-preview .shape-fill {
            fill: rgba(30, 58, 138, 0.08);
            stroke: rgba(30, 58, 138, 0.62);
            stroke-width: 1.05;
            vector-effect: non-scaling-stroke;
        }

        .prism-shape-option-preview .shape-open {
            fill: none;
            stroke: rgba(30, 58, 138, 0.62);
            stroke-width: 1.05;
            stroke-linecap: round;
            stroke-linejoin: round;
            vector-effect: non-scaling-stroke;
        }

        .prism-shape-option-preview text {
            fill: rgba(30, 58, 138, 0.82);
            font-size: 38px;
            font-weight: 600;
            text-anchor: middle;
            dominant-baseline: central;
        }

        .prism-ribbon-btn:disabled {
            opacity: 0.35;
            cursor: default;
        }

        .prism-ribbon-btn:disabled:hover {
            background: transparent;
            color: #0f172a;
        }

        .prism-fontsize-picker {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            padding: 0 2px 0 1px;
        }

        .prism-context-panel .prism-slide-control select {
            min-width: 36px;
            width: 36px;
            padding-left: 2px;
            padding-right: 2px;
            font-size: 11px;
            text-align: center;
            box-sizing: border-box;
        }

        .prism-selection-actions {
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 12px;
            width: 100%;
        }

        .prism-selection-actions .prism-ribbon-btn,
        .prism-selection-actions .prism-context-tool-btn {
            width: 100%;
        }

        .prism-selection-count {
            font-size: 12px;
            font-weight: 600;
            color: #475569;
            letter-spacing: 0.04em;
        }

        #prismSlideThemeSelect {
            min-width: 64px;
            width: 64px;
        }

        #prismPageOrientationSelect {
            min-width: 92px;
            width: 92px;
        }

        #prismTextBoxFontSizeSelect {
            min-width: 0;
            width: 100%;
        }

        #prismShapeStrokeWidthSelect {
            min-width: 36px !important;
            width: 36px !important;
        }

        #prismShapeDashStyleSelect {
            min-width: 42px !important;
            width: 42px !important;
            font-size: 10px;
        }

        .prism-slide-theme-icon {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            color: var(--muted);
        }

        .seating-layout {
            height: 100%;
            display: flex;
            flex-direction: column;
            gap: 10px;
        }

        .seating-toolbar {
            display: flex;
            justify-content: space-between;
            align-items: end;
            gap: 12px;
        }

        .seating-copy {
            margin: 0;
            color: var(--muted);
            font-size: 13px;
        }

        .seating-copy[role="status"]:empty {
            display: none;
        }

        .seating-copy[role="status"] {
            font-weight: 700;
            line-height: 1.4;
        }

        .seating-copy[role="status"][data-state="error"] {
            color: #dc2626;
        }

        .seating-copy[role="status"][data-state="success"] {
            color: #2563eb;
        }

        .seating-actions {
            min-width: 380px;
            display: flex;
            gap: 8px;
            align-items: center;
        }

        .seating-actions select,
        .seating-actions button {
            flex: 1;
        }

        .classroom-card {
            flex: 1;
            padding: 16px;
            display: flex;
            flex-direction: column;
            overflow: hidden;
        }

        .classroom-front {
            margin-bottom: 12px;
            padding: 8px 14px;
            align-self: center;
            border-radius: 999px;
            background: rgba(37, 99, 235, 0.08);
            color: var(--primary);
            font-size: 12px;
            font-weight: 600;
            letter-spacing: 0.08em;
            text-transform: uppercase;
        }

        .classroom-stage {
            position: relative;
            flex: 1;
            min-height: 480px;
            border: 1px dashed rgba(51, 65, 85, 0.18);
            border-radius: 18px;
            background:
                linear-gradient(180deg, rgba(37, 99, 235, 0.05), rgba(255, 255, 255, 0)),
                repeating-linear-gradient(
                    0deg,
                    rgba(148, 163, 184, 0.08) 0,
                    rgba(148, 163, 184, 0.08) 1px,
                    transparent 1px,
                    transparent 48px
                ),
                repeating-linear-gradient(
                    90deg,
                    rgba(148, 163, 184, 0.08) 0,
                    rgba(148, 163, 184, 0.08) 1px,
                    transparent 1px,
                    transparent 48px
                ),
                #fcfdff;
            overflow: hidden;
        }

        .classroom-empty {
            position: absolute;
            inset: 0;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 24px;
            color: var(--muted);
            font-size: 15px;
            text-align: center;
        }

        .student-card {
            position: absolute;
            width: 120px;
            height: 56px;
            padding: 8px 10px;
            display: flex;
            align-items: center;
            justify-content: center;
            border: 1px solid rgba(30, 58, 138, 0.12);
            border-radius: 14px;
            background: white;
            box-shadow: 0 8px 18px rgba(30, 58, 138, 0.08);
            color: var(--navy);
            font-size: 14px;
            font-weight: 600;
            text-align: center;
            line-height: 1.2;
            cursor: grab;
            user-select: none;
            touch-action: none;
        }

        .student-card.dragging {
            cursor: grabbing;
            box-shadow: 0 14px 28px rgba(30, 58, 138, 0.16);
            z-index: 2;
        }

        .rewards-layout {
            height: 100%;
            display: flex;
            flex-direction: column;
            gap: 10px;
        }

        .rewards-toolbar {
            display: flex;
            justify-content: space-between;
            align-items: end;
            gap: 12px;
        }

        .rewards-toolbar-copy {
            display: flex;
            flex-direction: column;
            gap: 4px;
        }

        .rewards-class-total {
            display: inline-flex;
            align-items: baseline;
            gap: 8px;
            margin-top: 4px;
            color: var(--muted);
            font-size: 13px;
            font-weight: 600;
        }

        .rewards-class-total strong {
            color: var(--reward-amount-color);
            font-size: 22px;
            font-weight: 700;
            line-height: 1;
        }

        .rewards-actions {
            min-width: 420px;
            display: flex;
            gap: 8px;
            align-items: center;
            flex-wrap: nowrap;
            justify-content: flex-end;
        }

        .rewards-actions select {
            min-width: 180px;
            flex: 1 1 180px;
        }

        .rewards-class-picker {
            flex: 0 1 320px !important;
            min-width: 220px !important;
        }

        .rewards-action-button,
        .rewards-no-repeat {
            min-height: 52px;
            border-radius: 18px;
        }

        .rewards-action-button {
            min-width: 112px;
            padding: 0 16px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 8px;
            text-align: center;
        }

        .rewards-action-label {
            line-height: 1.05;
        }

        .rewards-no-repeat {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 8px;
            padding: 0 14px;
            border: 1px solid rgba(30, 58, 138, 0.12);
            background:
                linear-gradient(180deg, rgba(248, 250, 252, 0.98) 0%, rgba(255, 255, 255, 0.98) 100%);
            box-shadow: 0 12px 24px rgba(30, 58, 138, 0.08);
            color: var(--muted);
            font-size: 13px;
            font-weight: 600;
            white-space: nowrap;
        }

        .rewards-no-repeat input {
            margin: 0;
        }

        .rewards-no-repeat:hover {
            border-color: rgba(30, 58, 138, 0.2);
            box-shadow: 0 16px 28px rgba(30, 58, 138, 0.1);
        }

        .rewards-toolbar-toggle.is-active {
            background: rgba(37, 99, 235, 0.14);
            color: var(--primary);
        }

        .rewards-batch-bar {
            position: relative;
            margin-top: 12px;
            padding: 12px;
            border: 1px solid var(--border);
            border-radius: 16px;
            background:
                linear-gradient(180deg, rgba(248, 250, 252, 0.98) 0%, rgba(241, 245, 249, 0.96) 100%);
            box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7), 0 8px 20px rgba(15, 23, 42, 0.04);
            display: none;
            flex-direction: column;
            gap: 8px;
        }

        .rewards-batch-bar.active {
            display: flex;
        }

        .rewards-selection-meta {
            color: var(--muted);
            font-size: 13px;
            font-weight: 600;
        }

        .rewards-batch-group {
            display: flex;
            align-items: center;
            gap: 8px;
            flex-wrap: wrap;
            width: 100%;
        }

        .rewards-batch-group.awards {
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            gap: 8px;
        }

        .rewards-batch-group.awards button {
            width: 100%;
            padding-left: 0;
            padding-right: 0;
        }

        .rewards-board-card {
            flex: 1;
            min-height: 0;
            display: flex;
            flex-direction: column;
            overflow: hidden;
        }

        .rewards-board {
            flex: 1;
            min-height: 400px;
            padding: 6px;
            display: grid;
            grid-template-columns: repeat(auto-fit, 198px);
            justify-content: start;
            align-content: flex-start;
            align-items: start;
            gap: 10px;
            overflow: auto;
            -ms-overflow-style: none;
            scrollbar-width: none;
        }

        .rewards-board::-webkit-scrollbar {
            display: none;
        }

        .rewards-empty {
            min-height: 320px;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 28px;
            border: 1px dashed rgba(51, 65, 85, 0.18);
            border-radius: 22px;
            background:
                linear-gradient(180deg, rgba(37, 99, 235, 0.05), rgba(255, 255, 255, 0.86)),
                #fcfdff;
            color: var(--muted);
            font-size: 15px;
            text-align: center;
        }

        .reward-student-card {
            position: relative;
            width: 198px;
            min-height: 86px;
            padding: 8px 12px 7px;
            display: flex;
            flex-direction: column;
            gap: 5px;
            border: 1px solid var(--border);
            border-radius: 22px;
            background:
                linear-gradient(180deg, rgba(37, 99, 235, 0.04), rgba(255, 255, 255, 0.94)),
                white;
            box-shadow: 0 14px 28px rgba(15, 23, 42, 0.08);
            text-align: left;
            transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease, background-color 0.2s ease;
            touch-action: manipulation;
        }

        .reward-student-card:hover {
            border-color: rgba(251, 191, 36, 0.72);
            background:
                linear-gradient(180deg, rgba(251, 191, 36, 0.12), rgba(255, 255, 255, 0.96)),
                white;
            box-shadow: 0 0 0 3px rgba(251, 191, 36, 0.14), 0 18px 34px rgba(37, 99, 235, 0.1);
        }

        .reward-student-card.selected {
            border-color: rgba(37, 99, 235, 0.78);
            background:
                linear-gradient(180deg, rgba(37, 99, 235, 0.16), rgba(255, 255, 255, 0.96)),
                white;
            box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.2), 0 20px 36px rgba(37, 99, 235, 0.14);
            transform: translateY(-2px);
        }

        .reward-student-card.used {
            opacity: 0.68;
            border-style: dashed;
        }

        .reward-student-card.spinning {
            border-color: rgba(251, 191, 36, 0.88);
            background:
                linear-gradient(180deg, rgba(251, 191, 36, 0.18), rgba(255, 255, 255, 0.96)),
                white;
            box-shadow: 0 0 0 3px rgba(251, 191, 36, 0.22), 0 18px 34px rgba(37, 99, 235, 0.12);
            transform: translateY(-1px);
        }

        .reward-student-card.reward-flash {
            animation: namePickerRewardPulse 1.2s ease;
        }

        .reward-student-card.reward-flash .reward-total {
            animation: namePickerRewardBalancePulse 1.2s ease;
        }

        .reward-student-card.spend-flash {
            animation: rewardsSpendPulse 1.2s ease;
        }

        .reward-student-card.spend-flash .reward-total {
            animation: rewardsSpendBalancePulse 1.2s ease;
        }

        .reward-card-reward-badge {
            position: absolute;
            right: 12px;
            bottom: 24px;
            z-index: 2;
            padding: 4px 8px;
            border-radius: 999px;
            background: rgba(251, 191, 36, 0.96);
            color: #78350f;
            font-size: 11px;
            font-weight: 700;
            line-height: 1;
            box-shadow: 0 8px 18px rgba(251, 191, 36, 0.22);
            pointer-events: none;
            animation: namePickerRewardFloat 1.2s ease forwards;
        }

        .reward-card-reward-badge.is-negative {
            background: rgba(251, 146, 60, 0.96);
            color: #7c2d12;
            box-shadow: 0 8px 18px rgba(251, 146, 60, 0.28);
        }

        .reward-student-name {
            flex: 1 1 auto;
            min-height: 0;
            font-size: 17px;
            font-weight: 600;
            line-height: 1.15;
            color: var(--text-main);
            word-break: break-word;
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 2;
            line-clamp: 2;
            overflow: hidden;
            text-overflow: ellipsis;
            max-height: calc(1.15em * 2);
        }

        .reward-total-wrap {
            display: flex;
            align-items: end;
            justify-content: space-between;
            gap: 10px;
            margin-top: auto;
        }

        .reward-total-label {
            color: var(--muted);
            font-size: 10px;
            font-weight: 600;
            letter-spacing: 0.08em;
            text-transform: uppercase;
        }

        .reward-total {
            color: var(--reward-amount-color);
            font-size: 24px;
            font-weight: 700;
            line-height: 1;
        }

        .rewards-inline-menu {
            position: absolute;
            top: calc(100% + 8px);
            right: 0;
            min-width: 180px;
            padding: 8px;
            display: flex;
            flex-direction: column;
            gap: 6px;
            border: 1px solid var(--border);
            border-radius: 16px;
            background: rgba(255, 255, 255, 0.98);
            box-shadow: 0 14px 30px rgba(15, 23, 42, 0.12);
            z-index: 8;
        }

        .rewards-inline-menu[hidden] {
            display: none !important;
        }

        .rewards-inline-menu button {
            width: 100%;
            justify-content: flex-start;
            min-height: 38px;
            padding: 8px 10px;
            border-radius: 10px;
            box-shadow: none;
            transform: none;
        }

        .rewards-inline-menu button:hover {
            transform: none;
        }

        .rewards-overlay {
            position: fixed;
            inset: 0;
            z-index: 40;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 24px;
        }

        .rewards-overlay[hidden] {
            display: none !important;
        }

        .rewards-overlay-backdrop {
            position: absolute;
            inset: 0;
            background: rgba(15, 23, 42, 0.34);
            backdrop-filter: blur(4px);
        }

        .rewards-award-panel {
            position: relative;
            width: min(520px, 100%);
            padding: 24px;
            border-radius: 28px;
            background: rgba(255, 255, 255, 0.98);
            border: 1px solid var(--border);
            box-shadow: 0 28px 64px rgba(15, 23, 42, 0.24);
            display: flex;
            flex-direction: column;
            gap: 18px;
        }

        .rewards-award-heading {
            display: flex;
            flex-direction: column;
            gap: 4px;
        }

        .rewards-award-label {
            color: var(--muted);
            font-size: 12px;
            font-weight: 700;
            letter-spacing: 0.08em;
            text-transform: uppercase;
        }

        .rewards-award-title {
            margin: 0;
            color: var(--text-soft);
            background: linear-gradient(135deg, #111827 0%, #2563eb 82%);
            -webkit-background-clip: text;
            background-clip: text;
            -webkit-text-fill-color: transparent;
            font-size: 28px;
            font-weight: 700;
            line-height: 1.1;
        }

        .rewards-award-subtitle {
            margin: 0;
            color: var(--muted);
            font-size: 15px;
        }

        .rewards-award-grid {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 12px;
        }

        .rewards-award-grid button {
            min-height: 76px;
            border-radius: 20px;
            font-size: 24px;
            font-weight: 700;
        }

        .rewards-secondary-action {
            align-self: flex-end;
            min-width: 112px;
        }

        .rewards-spend-panel {
            width: min(880px, 100%);
            max-height: min(84vh, 960px);
            padding: 22px;
            gap: 16px;
        }

        .rewards-spend-header {
            display: flex;
            align-items: flex-start;
            justify-content: space-between;
            gap: 16px;
        }

        .rewards-spend-header-actions {
            display: flex;
            align-items: center;
            gap: 10px;
        }

        .rewards-spend-tabs {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            padding: 6px;
            border-radius: 999px;
            background: rgba(241, 245, 249, 0.95);
            border: 1px solid var(--border);
        }

        .rewards-spend-tabs button {
            min-height: 38px;
            padding: 8px 14px;
            border-radius: 999px;
            box-shadow: none;
            transform: none;
            font-size: 14px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 8px;
        }

        .rewards-spend-tabs button.active {
            background: linear-gradient(180deg, var(--primary-hover) 0%, var(--primary) 100%);
            color: white;
        }

        .rewards-spend-tabs button svg,
        .rewards-dialog-close svg,
        .rewards-action-button svg {
            width: 18px;
            height: 18px;
            stroke-width: 2;
        }

        .rewards-dialog-close {
            min-width: 92px;
            box-shadow: none;
        }

        .rewards-spend-section {
            min-height: 0;
            display: flex;
            flex-direction: column;
            gap: 14px;
        }

        .rewards-spend-section[hidden] {
            display: none !important;
        }

        .rewards-spend-grid {
            min-height: 0;
            display: grid;
            grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
            gap: 14px;
        }

        .rewards-spend-column,
        .rewards-spend-summary,
        .rewards-store-panel,
        .rewards-ledger-panel {
            padding: 14px;
            border: 1px solid var(--border);
            border-radius: 18px;
            background:
                linear-gradient(180deg, rgba(248, 250, 252, 0.98) 0%, rgba(241, 245, 249, 0.94) 100%);
            box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.76);
        }

        .rewards-spend-column {
            min-height: 280px;
            display: flex;
            flex-direction: column;
            gap: 12px;
        }

        .rewards-spend-section-head,
        .rewards-store-head,
        .rewards-ledger-head {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 12px;
        }

        .rewards-spend-section-head h4,
        .rewards-store-head h4,
        .rewards-ledger-head h4 {
            margin: 0;
            color: #111827;
            font-size: 16px;
            font-weight: 700;
        }

        .rewards-spend-section-head p,
        .rewards-store-head p,
        .rewards-ledger-head p {
            margin: 0;
            color: var(--muted);
            font-size: 13px;
        }

        .rewards-spend-inline-actions,
        .rewards-store-actions,
        .rewards-ledger-actions {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            flex-wrap: wrap;
            justify-content: flex-end;
        }

        .rewards-spend-inline-actions button,
        .rewards-store-actions button,
        .rewards-ledger-actions button {
            min-height: 36px;
            padding: 8px 12px;
            border-radius: 12px;
            box-shadow: none;
            transform: none;
            font-size: 13px;
        }

        .rewards-spend-selection-list,
        .rewards-spend-item-list {
            min-height: 0;
            display: grid;
            gap: 10px;
            align-content: start;
            overflow: auto;
            padding-right: 2px;
            -ms-overflow-style: none;
            scrollbar-width: none;
        }

        .rewards-spend-selection-list::-webkit-scrollbar,
        .rewards-spend-item-list::-webkit-scrollbar,
        .rewards-store-list::-webkit-scrollbar,
        .rewards-ledger-list::-webkit-scrollbar {
            display: none;
        }

        .rewards-spend-selection-list {
            grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
        }

        .rewards-spend-item-list {
            grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
        }

        .rewards-spend-student,
        .rewards-spend-item {
            position: relative;
            border: 1px solid var(--border);
            border-radius: 16px;
            background: rgba(255, 255, 255, 0.96);
            box-shadow: 0 10px 18px rgba(15, 23, 42, 0.06);
            transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease, background-color 0.18s ease;
        }

        .rewards-spend-student:hover,
        .rewards-spend-item:hover {
            border-color: rgba(37, 99, 235, 0.2);
            box-shadow: 0 14px 24px rgba(37, 99, 235, 0.1);
        }

        .rewards-spend-student button,
        .rewards-spend-item button {
            width: 100%;
            min-height: 88px;
            padding: 14px;
            border-radius: 16px;
            background: transparent;
            color: inherit;
            box-shadow: none;
            transform: none;
            display: flex;
            flex-direction: column;
            align-items: flex-start;
            justify-content: space-between;
            gap: 10px;
            text-align: left;
        }

        .rewards-spend-student.selected,
        .rewards-spend-item.selected {
            border-color: rgba(37, 99, 235, 0.82);
            background: linear-gradient(180deg, rgba(37, 99, 235, 0.16), rgba(255, 255, 255, 0.98));
            box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.18), 0 18px 28px rgba(37, 99, 235, 0.12);
            transform: translateY(-1px);
        }

        .rewards-spend-student.cannot-afford {
            border-color: rgba(249, 115, 22, 0.42);
            background: linear-gradient(180deg, rgba(255, 237, 213, 0.84), rgba(255, 255, 255, 0.98));
        }

        .rewards-spend-student-name,
        .rewards-spend-item-name {
            color: #111827;
            font-size: 15px;
            font-weight: 700;
            line-height: 1.2;
        }

        .rewards-spend-student-balance,
        .rewards-spend-item-cost {
            color: var(--muted);
            font-size: 13px;
            font-weight: 600;
        }

        .rewards-spend-student-balance.is-warning {
            color: #c2410c;
        }

        .rewards-spend-summary {
            display: flex;
            flex-direction: column;
            gap: 12px;
        }

        .rewards-spend-summary-copy {
            color: var(--muted);
            font-size: 14px;
            line-height: 1.45;
        }

        .rewards-spend-warning {
            min-height: 18px;
            color: #c2410c;
            font-size: 13px;
            font-weight: 600;
        }

        .rewards-spend-warning:empty {
            display: none;
        }

        .rewards-spend-summary-actions {
            display: flex;
            align-items: flex-end;
            justify-content: space-between;
            gap: 14px;
            flex-wrap: wrap;
        }

        .rewards-spend-total {
            display: inline-flex;
            align-items: flex-end;
            gap: 10px;
            color: var(--muted);
            font-size: 14px;
            font-weight: 600;
            line-height: 1.1;
        }

        .rewards-spend-total strong {
            display: inline-block;
            color: #c2410c;
            font-size: 26px;
            line-height: 1;
        }

        .rewards-store-panel,
        .rewards-ledger-panel {
            min-height: 420px;
            display: flex;
            flex-direction: column;
            gap: 14px;
        }

        .rewards-store-list,
        .rewards-ledger-list {
            min-height: 0;
            overflow: auto;
            display: flex;
            flex-direction: column;
            gap: 10px;
            -ms-overflow-style: none;
            scrollbar-width: none;
        }

        .rewards-store-row,
        .rewards-ledger-entry {
            display: grid;
            gap: 10px;
            align-items: center;
            border: 1px solid rgba(30, 58, 138, 0.1);
            border-radius: 16px;
            background: rgba(255, 255, 255, 0.96);
            box-shadow: 0 10px 18px rgba(30, 58, 138, 0.05);
        }

        .rewards-store-row {
            grid-template-columns: minmax(0, 1fr) 124px auto;
            padding: 10px;
        }

        .rewards-store-row input {
            min-width: 0;
        }

        .rewards-store-row .cost-input {
            text-align: right;
        }

        .rewards-ledger-entry {
            padding: 12px 14px;
        }

        .rewards-ledger-entry-top {
            display: flex;
            align-items: flex-start;
            justify-content: space-between;
            gap: 12px;
        }

        .rewards-ledger-student {
            color: #111827;
            font-size: 15px;
            font-weight: 700;
        }

        .rewards-ledger-meta,
        .rewards-ledger-items {
            color: var(--muted);
            font-size: 13px;
            line-height: 1.45;
        }

        .rewards-ledger-amount {
            color: #c2410c;
            font-size: 18px;
            font-weight: 700;
            white-space: nowrap;
        }

        .rewards-ledger-balance {
            color: var(--navy);
            font-size: 13px;
            font-weight: 700;
        }

        .rewards-panel-empty {
            min-height: 180px;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 18px;
            border: 1px dashed rgba(30, 58, 138, 0.12);
            border-radius: 18px;
            background: rgba(255, 255, 255, 0.72);
            color: var(--muted);
            font-size: 14px;
            text-align: center;
        }

        @keyframes rewardsSpendPulse {
            0% {
                box-shadow: 0 14px 28px rgba(30, 58, 138, 0.08);
            }

            35% {
                box-shadow: 0 0 0 4px rgba(251, 146, 60, 0.18), 0 20px 36px rgba(249, 115, 22, 0.16);
                transform: translateY(-2px);
            }

            100% {
                box-shadow: 0 14px 28px rgba(30, 58, 138, 0.08);
                transform: translateY(0);
            }
        }

        @keyframes rewardsSpendBalancePulse {
            0% {
                color: var(--navy);
            }

            30% {
                color: #c2410c;
                transform: translateY(-1px);
            }

            100% {
                color: var(--navy);
                transform: translateY(0);
            }
        }

        @media (max-width: 1360px) {
            body.prism-app-authenticated .prism-home-hero,
            body.prism-app-authenticated .prism-account-hero,
            body.prism-app-authenticated .prism-home-card-head,
            body.prism-app-authenticated .seating-toolbar,
            body.prism-app-authenticated .rewards-toolbar {
                flex-wrap: wrap;
                align-items: flex-start;
            }

            body.prism-app-authenticated .prism-home-hero-actions,
            body.prism-app-authenticated .prism-home-hero-buttons,
            body.prism-app-authenticated .prism-home-card-actions {
                width: 100%;
                align-items: flex-start;
                justify-content: flex-start;
            }

            body.prism-app-authenticated .seating-actions,
            body.prism-app-authenticated .rewards-actions {
                min-width: 0;
                width: 100%;
                justify-content: flex-start;
                flex-wrap: wrap;
            }

            body.prism-app-authenticated .prism-theme-grid {
                grid-template-columns: repeat(3, minmax(0, 1fr));
            }

            body.prism-app-authenticated .seating-actions select {
                flex: 1 1 220px;
            }

            body.prism-app-authenticated .seating-actions button {
                flex: 0 0 auto;
            }

            body.prism-app-authenticated .rewards-class-picker {
                flex: 1 1 280px !important;
                min-width: 220px !important;
            }

            body.prism-app-authenticated .rewards-actions > * {
                flex: 0 0 auto;
            }

            body.prism-app-authenticated #homeView .prism-home-hero {
                align-items: center;
                flex-wrap: nowrap;
            }

            body.prism-app-authenticated #homeView .prism-home-hero-actions,
            body.prism-app-authenticated #homeView .prism-home-hero-buttons,
            body.prism-app-authenticated #homeView .prism-home-card-actions {
                width: auto;
                align-items: flex-end;
                justify-content: flex-end;
            }

            body.prism-app-authenticated #homeView .prism-home-grid {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }

            body.prism-app-authenticated #homeView .prism-home-lessons-list,
            body.prism-app-authenticated #homeView .prism-home-class-list {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }
        }

        @media (max-width: 1220px) {
            body.prism-app-authenticated .rewards-actions {
                gap: 6px;
            }

            body.prism-app-authenticated .prism-home-lesson-item {
                grid-template-columns: minmax(0, 1fr) 44px;
                column-gap: 14px;
            }

            body.prism-app-authenticated #homeView .prism-home-lesson-item {
                grid-template-columns: minmax(0, 1fr) 44px;
                column-gap: 12px;
                height: 136px;
            }
        }

        @media (max-width: 960px) {
            body {
                flex-direction: column;
            }

            .access-gate-inner {
                width: min(100%, calc(100vw - 24px));
                padding: 20px 0 28px;
                gap: 18px;
            }

            .access-landing-panel,
            .access-status-card,
            .access-showcase {
                border-radius: 22px;
            }

            .access-hero,
            .access-section {
                padding: 20px;
            }

            .access-hero-heading {
                max-width: none;
                font-size: clamp(32px, 10vw, 46px);
            }

            .access-gate-copy {
                font-size: 16px;
            }

            .access-hero-points,
            .access-feature-grid,
            .access-faq-grid {
                grid-template-columns: 1fr;
            }

            .access-about {
                grid-template-columns: 1fr;
            }

            .access-about-photo {
                width: 140px;
                height: 140px;
            }

            .footer-inner {
                width: min(100%, calc(100vw - 24px));
                padding: 2.25rem 0 1.25rem;
            }

            .footer-grid {
                grid-template-columns: 1fr;
                gap: 2rem;
            }

            .footer-link {
                white-space: normal;
            }

            .footer-bottom {
                margin-top: 2rem;
            }

            nav {
                width: 100%;
                padding: 8px;
                flex-direction: row;
                flex-wrap: wrap;
                justify-content: center;
                gap: 6px;
            }

            .nav-logo,
            .nav-divider {
                display: none;
            }

            iframe {
                min-height: 50vh;
            }

            .name-list {
                grid-template-columns: repeat(2, 1fr);
            }

            .seating-toolbar {
                align-items: stretch;
                flex-direction: column;
            }

            .rewards-toolbar,
            .rewards-spend-header,
            .rewards-spend-grid,
            .rewards-spend-summary-actions {
                flex-direction: column;
                align-items: stretch;
            }

            .rewards-actions {
                min-width: 0;
                width: 100%;
                flex-wrap: wrap;
                justify-content: stretch;
            }

            .rewards-actions > * {
                flex: 1 1 160px;
            }

            .rewards-spend-header-actions {
                flex-direction: column;
                align-items: stretch;
            }

            .rewards-spend-tabs {
                justify-content: center;
                flex-wrap: wrap;
            }

            .rewards-store-row {
                grid-template-columns: 1fr;
            }

            .prism-slide-ribbon-actions {
                width: 100%;
                flex-wrap: nowrap;
                justify-content: flex-start;
            }

            .prism-slide-ribbon {
                width: 100%;
            }

            .prism-slide-display {
                padding: 6px;
            }

            .prism-slide-canvas {
                padding: 18px 20px;
            }

            .seating-actions {
                min-width: 0;
                width: 100%;
                flex-direction: column;
            }

            .rewards-toolbar {
                align-items: stretch;
                flex-direction: column;
            }

            .rewards-actions {
                min-width: 0;
                width: 100%;
                flex-wrap: wrap;
                justify-content: stretch;
            }

            .rewards-no-repeat {
                width: 100%;
                justify-content: center;
            }

            .rewards-actions select,
            .rewards-actions button {
                width: 100%;
            }

            .rewards-batch-group.awards {
                width: 100%;
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }

            .rewards-batch-group.awards button {
                width: 100%;
            }

            .rewards-board {
                grid-template-columns: repeat(2, minmax(0, 1fr));
                justify-content: stretch;
            }

            .reward-student-card {
                width: 100%;
            }

            .rewards-award-grid {
                grid-template-columns: 1fr;
            }

            .classroom-stage {
                min-height: 360px;
            }

            .workspace-container {
                gap: 6px;
            }

            .panel-shell {
                width: var(--prism-side-panel-width);
                flex-basis: var(--prism-side-panel-width);
                min-width: var(--prism-side-panel-width);
            }

            .prism-home-hero,
            .prism-account-hero,
            .prism-home-card-head,
            .prism-home-class-layout,
            .prism-class-dialog-layout,
            .prism-account-grid,
            .prism-home-grid,
            .prism-account-subscription-grid,
            .prism-theme-grid,
            .prism-home-class-editor-head {
                grid-template-columns: 1fr;
                flex-direction: column;
                align-items: stretch;
            }

            .prism-home-card-actions {
                justify-content: stretch;
            }

            .prism-home-card-actions button {
                width: 100%;
            }

            .prism-home-lesson-item {
                grid-template-columns: 1fr;
                grid-template-areas:
                    "thumb"
                    "meta"
                    "actions";
                row-gap: 12px;
                min-height: 0;
            }

            .prism-home-lesson-item .prism-home-item-actions {
                width: 100%;
                min-width: 0;
            }

            .prism-lesson-library-item {
                grid-template-columns: 40px minmax(0, 1fr);
            }

            .prism-lesson-library-actions {
                grid-column: 1 / -1;
                justify-content: flex-start;
                padding-left: 50px;
            }

            .prism-support-block {
                grid-template-columns: 1fr;
            }

            .prism-support-qr {
                justify-self: start;
            }

            .prism-home-hero-buttons,
            .prism-home-item-actions,
            .prism-home-inline-actions {
                justify-content: stretch;
            }

            .prism-home-hero-buttons button,
            .prism-home-item-actions button,
            .prism-home-inline-actions button {
                width: 100%;
            }
        }

        @media (max-width: 960px) {
            body.prism-app-authenticated nav {
                width: 64px;
                padding: 8px 5px;
                flex-direction: column;
                flex-wrap: nowrap;
                justify-content: flex-start;
                gap: 0;
            }

            body.prism-app-authenticated .nav-logo,
            body.prism-app-authenticated .nav-divider {
                display: block;
            }

            body.prism-app-authenticated iframe {
                min-height: 0;
            }

            body.prism-app-authenticated .workspace-container {
                gap: 8px;
                grid-template-columns: minmax(0, 1fr) auto;
            }

            body.prism-app-authenticated .panel-shell {
                width: var(--prism-side-panel-width);
                flex-basis: var(--prism-side-panel-width);
                min-width: var(--prism-side-panel-width);
            }

            body.prism-app-authenticated .panel-shell.collapsed {
                width: 18px;
                flex-basis: 18px;
                min-width: 18px;
            }

            body.prism-app-authenticated .rewards-toolbar {
                flex-direction: row;
                align-items: flex-start;
            }

            body.prism-app-authenticated .rewards-actions {
                min-width: 0;
                width: 100%;
                flex-wrap: wrap;
                justify-content: flex-start;
            }

            body.prism-app-authenticated .rewards-actions > * {
                flex: 0 0 auto;
            }

            body.prism-app-authenticated .rewards-no-repeat {
                width: auto;
            }

            body.prism-app-authenticated .rewards-actions select,
            body.prism-app-authenticated .rewards-actions button {
                width: auto;
            }

            body.prism-app-authenticated .rewards-board {
                grid-template-columns: repeat(auto-fit, 198px);
                justify-content: start;
            }

            body.prism-app-authenticated .reward-student-card {
                width: 198px;
            }

            body.prism-app-authenticated .seating-toolbar {
                flex-direction: row;
                align-items: flex-start;
            }

            body.prism-app-authenticated .seating-actions {
                width: 100%;
                min-width: 0;
                flex-direction: row;
                flex-wrap: wrap;
            }

            body.prism-app-authenticated .seating-actions select {
                flex: 1 1 220px;
            }

            body.prism-app-authenticated .seating-actions button {
                flex: 0 0 auto;
            }

            body.prism-app-authenticated .prism-home-hero,
            body.prism-app-authenticated .prism-account-hero {
                display: flex;
                flex-direction: row;
                flex-wrap: wrap;
                align-items: flex-start;
            }

            body.prism-app-authenticated .prism-home-card-head {
                flex-direction: row;
                flex-wrap: wrap;
                align-items: flex-start;
            }

            body.prism-app-authenticated .prism-home-class-layout {
                display: flex;
                flex-direction: column;
            }

            body.prism-app-authenticated .prism-class-dialog-layout {
                display: grid;
                grid-template-columns: minmax(340px, 420px) minmax(0, 1fr);
                overflow: hidden;
            }

            body.prism-app-authenticated .prism-home-class-editor-head {
                flex-direction: row;
                flex-wrap: wrap;
                align-items: flex-start;
            }

            body.prism-app-authenticated .prism-home-card-actions,
            body.prism-app-authenticated .prism-home-hero-buttons,
            body.prism-app-authenticated .prism-home-item-actions,
            body.prism-app-authenticated .prism-home-inline-actions {
                justify-content: flex-start;
            }

            body.prism-app-authenticated .prism-home-card-actions button,
            body.prism-app-authenticated .prism-home-hero-buttons button,
            body.prism-app-authenticated .prism-home-item-actions button,
            body.prism-app-authenticated .prism-home-inline-actions button {
                width: auto;
            }

            body.prism-app-authenticated .prism-home-lesson-item {
                grid-template-columns: minmax(0, 1fr) 44px;
                grid-template-areas: "meta actions";
                row-gap: 12px;
                min-height: 136px;
            }

            body.prism-app-authenticated .prism-home-lesson-item .prism-home-item-actions {
                width: 44px;
                min-width: 44px;
                align-self: center;
                justify-content: center;
                flex-direction: column;
            }

            body.prism-app-authenticated .prism-lesson-library-actions {
                grid-column: auto;
                justify-content: flex-start;
                padding-left: 0;
            }

            body.prism-app-authenticated #homeView .prism-home-hero {
                display: flex;
                flex-direction: row;
                flex-wrap: nowrap;
                align-items: center;
            }

            body.prism-app-authenticated #homeView .prism-home-hero-actions,
            body.prism-app-authenticated #homeView .prism-home-hero-buttons {
                width: auto;
                align-items: flex-end;
                justify-content: flex-end;
            }

            body.prism-app-authenticated #homeView .prism-home-grid {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }

            body.prism-app-authenticated #homeView .prism-home-card-head {
                flex-direction: row;
                flex-wrap: nowrap;
                align-items: flex-start;
            }

            body.prism-app-authenticated #homeView .prism-home-card-actions {
                justify-content: flex-end;
                width: auto;
            }

            body.prism-app-authenticated #homeView .prism-home-card-actions button {
                width: auto;
            }

            body.prism-app-authenticated #homeView .prism-home-lessons-list,
            body.prism-app-authenticated #homeView .prism-home-class-list {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }

            body.prism-app-authenticated #homeView .prism-home-lesson-item {
                grid-template-columns: minmax(0, 1fr) 44px;
                grid-template-areas: "meta actions";
                height: 136px;
            }

            body.prism-app-authenticated #homeView .prism-home-lesson-item .prism-home-item-actions {
                width: 44px;
                min-width: 44px;
                align-self: center;
                justify-content: center;
                flex-direction: column;
            }
        }


        /* Logged-out public landing page hero refresh */
        body:not(.prism-app-authenticated).prism-login-dialog-open {
            overflow: hidden;
        }

        .access-gate-inner {
            width: 100%;
            margin: 0;
            padding: 0 0 44px;
            gap: 28px;
        }

        .access-public-nav {
            width: min(1200px, calc(100vw - 32px));
            min-height: 76px;
            margin: 0 auto;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 22px;
            color: #0f172a;
        }

        .access-public-brand {
            display: inline-flex;
            align-items: center;
            gap: 10px;
            color: #0f172a;
            font-size: 20px;
            font-weight: 600;
            letter-spacing: 0.08em;
            text-decoration: none;
        }

        .access-public-brand img {
            width: 42px;
            height: 42px;
            object-fit: contain;
            display: block;
        }

        .access-public-links {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 22px;
            background: transparent;
            border: 0;
            width: auto;
            padding: 0;
            overflow: visible;
        }

        .access-public-links a {
            color: #334155;
            font-size: 14px;
            font-weight: 600;
            text-decoration: none;
            transition: color 0.2s ease;
        }

        .access-public-links a:hover,
        .access-public-links a:focus-visible {
            color: #0f172a;
            outline: none;
        }

        .access-public-actions {
            display: inline-flex;
            align-items: center;
            justify-content: flex-end;
            gap: 10px;
            flex: 0 0 auto;
        }

        .access-nav-login,
        .access-nav-signup {
            width: auto;
            min-height: 42px;
            padding: 10px 16px;
            border-radius: 999px;
            font-size: 14px;
            white-space: nowrap;
        }

        .access-nav-login {
            border: 1px solid rgba(15, 23, 42, 0.12);
            background: rgba(255, 255, 255, 0.78);
            color: #0f172a;
            font: inherit;
            font-weight: 700;
            cursor: pointer;
            box-shadow: 0 12px 24px rgba(15, 23, 42, 0.08);
            transition: transform 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
        }

        .access-nav-login:hover,
        .access-nav-login:focus-visible {
            background: #ffffff;
            box-shadow: 0 16px 30px rgba(15, 23, 42, 0.14);
            transform: translateY(-1px);
            outline: none;
        }

        .access-nav-signup.access-gate-secondary[disabled] {
            border-color: rgba(69, 106, 138, 0.18);
            background: rgba(226, 232, 240, 0.74);
            color: #475569;
            cursor: not-allowed;
        }

        .access-landing-panel.access-hero {
            width: 100%;
            min-height: clamp(680px, 78vh, 760px);
            padding: 0;
            display: flex;
            align-items: stretch;
            border: 0;
            border-radius: 0;
            background:
                linear-gradient(90deg, rgba(9, 16, 31, 0.92) 0%, rgba(15, 23, 42, 0.82) 30%, rgba(15, 23, 42, 0.4) 54%, rgba(15, 23, 42, 0.08) 78%),
                url("../hero-banner.png") center right / cover no-repeat;
            box-shadow: none;
            backdrop-filter: none;
            overflow: hidden;
        }

        .access-hero-content {
            width: min(1200px, calc(100vw - 32px));
            margin: 0 auto;
            display: flex;
            align-items: center;
        }

        .access-hero-copy {
            width: min(620px, 100%);
            gap: 22px;
            color: #f8fafc;
            padding: 54px 0;
        }

        .access-hero-kicker {
            background: rgba(255, 255, 255, 0.13);
            border: 1px solid rgba(255, 255, 255, 0.18);
            color: #dbeafe;
            backdrop-filter: blur(14px);
        }

        .access-hero-kicker svg {
            width: 16px;
            height: 16px;
        }

        .access-hero-heading {
            max-width: 13ch;
            color: #ffffff;
            font-size: clamp(44px, 5.8vw, 74px);
            line-height: 0.98;
            letter-spacing: -0.045em;
            text-wrap: balance;
        }

        .access-hero .access-gate-copy {
            max-width: 58ch;
            color: #dbeafe;
            font-size: clamp(17px, 1.6vw, 21px);
            line-height: 1.7;
        }

        .access-hero-actions {
            display: flex;
            align-items: center;
            gap: 12px;
            flex-wrap: wrap;
            margin-top: 4px;
        }

        .access-hero-primary,
        .access-hero-secondary {
            min-height: 48px;
            padding: 13px 18px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 999px;
            font-size: 15px;
            font-weight: 700;
            text-decoration: none;
            transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
        }

        .access-hero-primary {
            background: #ffffff;
            color: #0f172a;
            box-shadow: 0 18px 36px rgba(0, 0, 0, 0.28);
        }

        .access-hero-secondary {
            border: 1px solid rgba(255, 255, 255, 0.3);
            background: rgba(255, 255, 255, 0.1);
            color: #f8fafc;
            backdrop-filter: blur(14px);
        }

        .access-hero-primary:hover,
        .access-hero-primary:focus-visible,
        .access-hero-secondary:hover,
        .access-hero-secondary:focus-visible {
            transform: translateY(-1px);
            outline: none;
        }

        .access-hero-primary:hover,
        .access-hero-primary:focus-visible {
            box-shadow: 0 24px 44px rgba(0, 0, 0, 0.34);
        }

        .access-hero-secondary:hover,
        .access-hero-secondary:focus-visible {
            background: rgba(255, 255, 255, 0.18);
            box-shadow: 0 18px 32px rgba(0, 0, 0, 0.2);
        }

        .access-feature-strip,
        .access-landing-panel:not(.access-hero) {
            width: min(1200px, calc(100vw - 32px));
            margin-left: auto;
            margin-right: auto;
        }

        .access-feature-strip {
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            gap: 14px;
        }

        .access-feature-summary-card {
            min-height: 190px;
            padding: 22px;
            display: flex;
            flex-direction: column;
            gap: 12px;
            border-radius: 24px;
            border: 1px solid rgba(100, 116, 139, 0.16);
            background: rgba(255, 255, 255, 0.88);
            color: #0f172a;
            box-shadow: 0 18px 42px rgba(15, 23, 42, 0.1);
            backdrop-filter: blur(16px);
        }

        .access-feature-summary-card svg {
            width: 24px;
            height: 24px;
            color: #456a8a;
        }

        .access-feature-summary-card h3 {
            margin: 0;
            font-size: 20px;
            line-height: 1.18;
            letter-spacing: -0.02em;
        }

        .access-feature-summary-card p {
            margin: 0;
            color: #475569;
            font-size: 14px;
            line-height: 1.65;
        }

        .access-login-dialog {
            position: fixed;
            inset: 0;
            z-index: 260;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 22px;
        }

        .access-login-dialog[hidden] {
            display: none !important;
        }

        .access-login-backdrop {
            position: absolute;
            inset: 0;
            background: rgba(15, 23, 42, 0.58);
            backdrop-filter: blur(10px);
        }

        .access-login-dialog .access-login-card {
            position: relative;
            z-index: 1;
            width: min(430px, calc(100vw - 32px));
            max-height: calc(100vh - 44px);
            overflow: auto;
        }

        .access-login-close {
            position: absolute;
            top: 14px;
            right: 14px;
            width: 36px;
            height: 36px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border: 1px solid rgba(100, 116, 139, 0.16);
            border-radius: 999px;
            background: rgba(248, 250, 252, 0.9);
            color: #334155;
            cursor: pointer;
        }

        .access-login-close svg {
            width: 18px;
            height: 18px;
        }

        .access-login-close:hover,
        .access-login-close:focus-visible {
            background: #ffffff;
            color: #0f172a;
            outline: none;
        }

        @media (max-width: 1100px) {
            .access-public-nav {
                min-height: auto;
                padding: 16px 0;
                flex-wrap: wrap;
            }

            .access-public-links {
                order: 3;
                width: 100%;
                justify-content: flex-start;
                overflow-x: auto;
                padding-bottom: 2px;
            }

            .access-landing-panel.access-hero {
                min-height: 620px;
                background:
                    linear-gradient(90deg, rgba(9, 16, 31, 0.94) 0%, rgba(15, 23, 42, 0.82) 44%, rgba(15, 23, 42, 0.28) 100%),
                    url("../hero-banner.png") center right / cover no-repeat;
            }

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

        @media (max-width: 720px) {
            .access-gate-inner {
                padding-bottom: 28px;
                gap: 18px;
            }

            .access-public-nav,
            .access-hero-content,
            .access-feature-strip,
            .access-landing-panel:not(.access-hero) {
                width: min(100%, calc(100vw - 24px));
            }

            .access-public-nav {
                align-items: flex-start;
                gap: 12px;
            }

            .access-public-brand img {
                width: 36px;
                height: 36px;
            }

            .access-public-actions {
                width: 100%;
                justify-content: stretch;
            }

            .access-nav-login,
            .access-nav-signup {
                flex: 1 1 0;
                min-width: 0;
                padding-left: 12px;
                padding-right: 12px;
            }

            .access-public-links {
                gap: 16px;
            }

            .access-public-links a {
                font-size: 13px;
            }

            .access-landing-panel.access-hero {
                min-height: 560px;
                background:
                    linear-gradient(90deg, rgba(9, 16, 31, 0.96) 0%, rgba(15, 23, 42, 0.88) 58%, rgba(15, 23, 42, 0.48) 100%),
                    url("../hero-banner.png") center right / cover no-repeat;
            }

            .access-hero-copy {
                padding: 36px 0;
            }

            .access-hero-heading {
                max-width: 11ch;
                font-size: clamp(38px, 12vw, 54px);
            }

            .access-hero .access-gate-copy {
                font-size: 16px;
            }

            .access-hero-primary,
            .access-hero-secondary {
                width: 100%;
            }

            .access-feature-strip {
                grid-template-columns: 1fr;
            }

            .access-feature-summary-card {
                min-height: 0;
            }
        }


        /* Logged-out hero layout refinements */
        .access-public-nav {
            width: 100%;
            min-height: 92px;
            margin: 0;
            padding: 0 clamp(28px, 4vw, 58px);
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: clamp(18px, 3vw, 42px);
            background: rgba(255, 255, 255, 0.96);
            border-radius: 0;
            color: #0f172a;
            box-shadow: 0 1px 0 rgba(15, 23, 42, 0.08);
        }

        .access-public-brand {
            flex: 0 0 auto;
            color: #0f172a;
        }

        .access-public-brand img {
            width: 52px;
            height: 52px;
        }

        .access-public-brand span {
            font-size: 26px;
            font-weight: 700;
            letter-spacing: 0.09em;
        }

        .access-public-links {
            width: auto !important;
            min-width: 0 !important;
            max-height: none !important;
            height: auto !important;
            padding: 0 !important;
            display: flex !important;
            flex: 1 1 auto;
            flex-direction: row !important;
            align-items: center !important;
            justify-content: center !important;
            gap: clamp(24px, 4vw, 48px) !important;
            overflow: visible !important;
            background: transparent !important;
            border: 0 !important;
            box-shadow: none !important;
            scrollbar-width: auto !important;
        }

        .access-public-links a {
            display: inline-flex;
            align-items: center;
            min-height: 42px;
            color: #0f172a !important;
            opacity: 1 !important;
            white-space: nowrap;
            font-size: 15px;
            font-weight: 700;
        }

        .access-public-links a:hover,
        .access-public-links a:focus-visible {
            color: #2563eb !important;
        }

        .access-public-actions {
            flex: 0 0 auto;
        }

        .access-nav-login,
        .access-nav-signup {
            min-height: 48px;
            padding: 11px 22px;
            border-radius: 14px;
            font-size: 15px;
        }

        .access-nav-login {
            border: 1px solid rgba(15, 23, 42, 0.45);
            background: #ffffff;
            color: #0f172a;
            box-shadow: none;
        }

        .access-nav-login:hover,
        .access-nav-login:focus-visible {
            border-color: #2563eb;
            background: #f8fbff;
            color: #0f172a;
            box-shadow: 0 10px 24px rgba(15, 23, 42, 0.1);
        }

        .access-nav-signup.access-gate-secondary[disabled] {
            border-color: transparent;
            background: #e9edf8;
            color: #0f172a;
            opacity: 0.72;
        }

        .access-landing-panel.access-hero {
            position: relative;
            isolation: isolate;
            width: 100%;
            min-height: clamp(650px, 74vh, 760px);
            padding: 0;
            display: flex;
            align-items: stretch;
            border: 0;
            border-radius: 0;
            background: #071b36;
            box-shadow: none;
            backdrop-filter: none;
            overflow: hidden;
        }

        .access-hero-banner {
            position: absolute;
            inset: 0;
            z-index: 0;
            width: 100%;
            height: 100%;
            max-height: none;
            object-fit: cover;
            object-position: center right;
            pointer-events: none;
            user-select: none;
            filter: none;
        }

        .access-landing-panel.access-hero::before {
            content: "";
            position: absolute;
            inset: 0;
            z-index: 1;
            background:
                linear-gradient(90deg, rgba(4, 14, 31, 0.95) 0%, rgba(5, 18, 39, 0.9) 32%, rgba(6, 23, 48, 0.48) 48%, rgba(6, 23, 48, 0.05) 70%),
                linear-gradient(0deg, rgba(4, 14, 31, 0.12), rgba(4, 14, 31, 0.02));
            pointer-events: none;
        }

        .access-hero-content {
            position: relative;
            z-index: 2;
            width: min(1480px, calc(100vw - clamp(56px, 7vw, 112px)));
            margin: 0 auto;
            display: flex;
            align-items: center;
        }

        .access-hero-copy {
            width: min(590px, 42vw);
            gap: 20px;
            color: #f8fafc;
            padding: 54px 0 62px;
        }

        .access-hero-kicker {
            width: fit-content;
            background: rgba(255, 255, 255, 0.16);
            border: 1px solid rgba(255, 255, 255, 0.2);
            color: #eef6ff;
            box-shadow: 0 12px 30px rgba(0, 0, 0, 0.18);
            backdrop-filter: blur(14px);
        }

        .access-hero-kicker svg {
            width: 15px;
            height: 15px;
        }

        .access-hero-heading {
            max-width: 12.5ch;
            color: #ffffff;
            font-size: clamp(46px, 4.4vw, 66px);
            line-height: 1.11;
            letter-spacing: -0.04em;
            text-wrap: balance;
        }

        .access-hero .access-gate-copy {
            max-width: 560px;
            color: #e2ecfb;
            font-size: clamp(18px, 1.35vw, 22px);
            line-height: 1.52;
        }

        .access-hero-actions {
            display: flex;
            align-items: center;
            gap: 18px;
            flex-wrap: wrap;
            margin-top: 12px;
        }

        .access-hero-primary,
        .access-hero-secondary {
            min-height: 52px;
            min-width: 210px;
            padding: 13px 22px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 15px;
            font-size: 16px;
            font-weight: 700;
            text-decoration: none;
            transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease, border-color 0.2s ease;
        }

        .access-hero-primary {
            background: #1768ff;
            color: #ffffff;
            box-shadow: 0 18px 34px rgba(23, 104, 255, 0.28);
        }

        .access-hero-secondary {
            border: 1px solid rgba(255, 255, 255, 0.72);
            background: rgba(255, 255, 255, 0.06);
            color: #f8fafc;
            backdrop-filter: blur(14px);
        }

        .access-hero-primary:hover,
        .access-hero-primary:focus-visible,
        .access-hero-secondary:hover,
        .access-hero-secondary:focus-visible {
            transform: translateY(-1px);
            outline: none;
        }

        .access-hero-primary:hover,
        .access-hero-primary:focus-visible {
            background: #0f5aea;
            box-shadow: 0 24px 44px rgba(23, 104, 255, 0.34);
        }

        .access-hero-secondary:hover,
        .access-hero-secondary:focus-visible {
            background: rgba(255, 255, 255, 0.14);
            box-shadow: 0 18px 32px rgba(0, 0, 0, 0.18);
        }

        @media (max-width: 1180px) {
            .access-public-nav {
                padding-inline: 24px;
                gap: 18px;
            }

            .access-public-brand span {
                font-size: 22px;
            }

            .access-public-links {
                gap: 22px !important;
            }

            .access-hero-content {
                width: min(100%, calc(100vw - 48px));
            }

            .access-hero-copy {
                width: min(570px, 52vw);
            }

            .access-hero-heading {
                font-size: clamp(42px, 5.3vw, 60px);
            }
        }

        @media (max-width: 920px) {
            .access-public-links {
                display: none !important;
            }

            .access-public-nav {
                min-height: 82px;
            }

            .access-landing-panel.access-hero {
                min-height: 620px;
            }

            .access-landing-panel.access-hero::before {
                background: linear-gradient(90deg, rgba(4, 14, 31, 0.98) 0%, rgba(5, 18, 39, 0.9) 58%, rgba(6, 23, 48, 0.42) 100%);
            }

            .access-hero-banner {
                object-position: 68% center;
                opacity: 0.62;
            }

            .access-hero-copy {
                width: min(620px, 100%);
            }
        }

        @media (max-width: 620px) {
            .access-public-nav {
                padding: 14px 18px;
                flex-wrap: wrap;
            }

            .access-public-brand img {
                width: 40px;
                height: 40px;
            }

            .access-public-brand span {
                font-size: 20px;
            }

            .access-public-actions {
                width: 100%;
                justify-content: stretch;
            }

            .access-nav-login,
            .access-nav-signup {
                flex: 1 1 0;
                min-width: 0;
                padding-left: 12px;
                padding-right: 12px;
            }

            .access-landing-panel.access-hero {
                min-height: 570px;
            }

            .access-hero-content {
                width: min(100%, calc(100vw - 32px));
            }

            .access-hero-banner {
                object-position: 72% center;
                opacity: 0.42;
            }

            .access-hero-heading {
                max-width: 11ch;
                font-size: clamp(38px, 11vw, 52px);
            }

            .access-hero .access-gate-copy {
                font-size: 16px;
            }

            .access-hero-primary,
            .access-hero-secondary {
                width: 100%;
                min-width: 0;
            }
        }

        /* PRISM Boards */
        .prism-home-boards-list {
            min-height: 0;
        }

        .prism-home-board-item .prism-home-item-title::before {
            content: "";
            width: 8px;
            height: 8px;
            display: inline-block;
            margin-right: 8px;
            border-radius: 999px;
            background: var(--accent);
            box-shadow: 0 0 0 4px var(--accent-soft);
            vertical-align: middle;
        }

        .prism-board-view {
            background: linear-gradient(180deg, color-mix(in srgb, var(--surface-soft) 86%, #ffffff 14%), var(--app-bg));
        }

        .prism-board-shell {
            height: 100%;
            min-height: 0;
            display: grid;
            grid-template-rows: auto minmax(0, 1fr);
            gap: 12px;
            padding: 0 4px 4px 0;
        }

        .prism-board-toolbar {
            position: relative;
            z-index: 30;
            display: grid;
            grid-template-columns: minmax(220px, 1fr) auto auto;
            align-items: center;
            gap: 12px;
            padding: 12px 14px;
            overflow: visible;
        }

        .prism-board-title-group {
            min-width: 0;
            display: flex;
            flex-direction: column;
            gap: 4px;
        }

        .prism-board-title-input {
            width: min(460px, 100%);
            border: 0;
            padding: 0;
            background: transparent;
            color: var(--text-soft);
            font: inherit;
            font-size: 22px;
            font-weight: 800;
            line-height: 1.1;
            outline: none;
        }

        .prism-board-title-input:focus-visible {
            box-shadow: 0 2px 0 var(--accent);
        }

        .prism-board-toolbar-actions {
            display: flex;
            align-items: center;
            justify-content: flex-end;
            gap: 8px;
            flex-wrap: wrap;
        }

        .prism-board-toolbar-actions button,
        .prism-board-popover button,
        .prism-board-widget button {
            min-height: 38px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 7px;
            border-radius: 12px;
            border: 1px solid var(--border);
            background: var(--surface);
            color: var(--text-soft);
            font: inherit;
            font-size: 13px;
            font-weight: 800;
            cursor: pointer;
            transition: transform 0.16s ease, border-color 0.16s ease, background 0.16s ease;
        }

        .prism-board-toolbar-actions button {
            padding: 0 12px;
        }

        .prism-board-toolbar-actions button:hover:not(:disabled),
        .prism-board-popover button:hover:not(:disabled),
        .prism-board-widget button:hover:not(:disabled) {
            transform: translateY(-1px);
            border-color: color-mix(in srgb, var(--accent) 44%, var(--border));
            background: var(--accent-soft);
        }

        .prism-board-toolbar-actions button:disabled {
            opacity: 0.45;
            cursor: not-allowed;
        }

        .prism-board-toolbar-actions svg {
            width: 17px;
            height: 17px;
        }

        .prism-board-save-state {
            justify-self: end;
            width: 148px;
            min-width: 148px;
            padding: 8px 12px;
            border-radius: 999px;
            border: 1px solid var(--border);
            color: var(--muted);
            font-size: 12px;
            font-weight: 800;
            text-align: center;
            background: var(--surface-soft);
        }

        .prism-board-save-state[data-state="saving"],
        .prism-board-save-state[data-state="dirty"] {
            color: var(--accent-strong);
            border-color: color-mix(in srgb, var(--accent) 30%, var(--border));
            background: var(--accent-soft);
        }

        .prism-board-save-state[data-state="failed"] {
            color: var(--danger);
            border-color: color-mix(in srgb, var(--danger) 28%, var(--border));
            background: var(--danger-soft);
        }

        .prism-board-status {
            grid-column: 1 / -1;
            margin-top: -4px;
        }

        .prism-board-popover {
            position: absolute;
            top: calc(100% + 8px);
            right: 14px;
            z-index: 60;
            width: min(420px, calc(100vw - 160px));
            padding: 12px;
            border-radius: 18px;
            border: 1px solid var(--border);
            background: var(--surface);
            box-shadow: var(--shadow);
        }

        .prism-board-popover[hidden] {
            display: none !important;
        }

        .prism-board-add-menu:not([hidden]) {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 8px;
        }

        .prism-board-add-menu button {
            min-height: 72px;
            flex-direction: column;
            padding: 10px 8px;
            text-align: center;
        }

        .prism-board-add-menu svg {
            width: 22px;
            height: 22px;
            color: var(--accent);
        }

        .prism-board-background-panel:not([hidden]) {
            display: grid;
            gap: 10px;
        }

        .prism-board-background-panel label {
            display: grid;
            gap: 5px;
            color: var(--muted);
            font-size: 11px;
            font-weight: 800;
            letter-spacing: 0.08em;
            text-transform: uppercase;
        }

        .prism-board-background-panel input,
        .prism-board-background-panel select {
            width: 100%;
            min-height: 42px;
            border: 1px solid var(--border);
            border-radius: 12px;
            padding: 0 12px;
            background: var(--surface);
            color: var(--text-soft);
            font: inherit;
            font-weight: 700;
        }

        .prism-board-stage-shell {
            position: relative;
            z-index: 1;
            min-height: 0;
            display: grid;
            place-items: center;
            padding: 18px;
            border-radius: 22px;
            background: color-mix(in srgb, var(--surface-soft) 86%, var(--border) 14%);
            overflow: hidden;
        }

        .prism-board-stage-viewport {
            --prism-board-scale: 0.5;
            position: relative;
            width: 960px;
            height: 540px;
            min-width: 0;
            min-height: 0;
            flex: 0 0 auto;
        }

        .prism-board-stage {
            position: absolute;
            top: 50%;
            left: 50%;
            width: 1920px;
            height: 1080px;
            border-radius: 18px;
            border: 1px solid color-mix(in srgb, var(--border) 72%, var(--accent) 28%);
            background-color: #f8fafc;
            background-repeat: no-repeat;
            box-shadow: 0 24px 60px rgba(15, 23, 42, 0.16);
            overflow: hidden;
            touch-action: none;
            transform: translate(-50%, -50%) scale(var(--prism-board-scale));
            transform-origin: center center;
        }

        .prism-board-stage.is-empty {
            display: grid;
            place-items: center;
            background: linear-gradient(135deg, #f8fafc, #eaf2ff);
        }

        .prism-board-empty-state {
            max-width: 520px;
            display: grid;
            justify-items: center;
            gap: 14px;
            padding: 34px;
            color: var(--text-soft);
            text-align: center;
        }

        .prism-board-empty-state svg {
            width: 58px;
            height: 58px;
            color: var(--accent);
        }

        .prism-board-empty-state h2,
        .prism-board-empty-state p {
            margin: 0;
        }

        .prism-board-empty-state p {
            color: var(--muted);
            line-height: 1.55;
        }

        .prism-board-widget {
            position: absolute;
            display: flex;
            border-radius: 18px;
            outline: 2px solid transparent;
            outline-offset: 2px;
            cursor: grab;
            user-select: none;
            touch-action: none;
        }

        .prism-board-widget.is-selected {
            outline-color: var(--accent);
            box-shadow: 0 0 0 6px color-mix(in srgb, var(--accent) 16%, transparent), 0 20px 36px rgba(15, 23, 42, 0.22);
        }

        .prism-board-widget-content {
            width: 100%;
            height: 100%;
            display: flex;
            flex-direction: column;
            gap: 8px;
            border-radius: inherit;
            background: color-mix(in srgb, var(--surface) 92%, transparent);
            border: 1px solid color-mix(in srgb, var(--border) 72%, transparent);
            box-shadow: 0 14px 28px rgba(15, 23, 42, 0.14);
            overflow: hidden;
            color: #0f172a;
        }

        .prism-board-widget-content input,
        .prism-board-widget-content textarea,
        .prism-board-widget-content select {
            font: inherit;
        }

        .prism-board-resize-handle {
            position: absolute;
            width: 22px;
            height: 22px;
            border-radius: 999px;
            border: 3px solid #ffffff;
            background: var(--accent);
            box-shadow: 0 6px 14px rgba(15, 23, 42, 0.22);
            z-index: 3;
        }

        .prism-board-resize-nw { top: -11px; left: -11px; cursor: nwse-resize; }
        .prism-board-resize-ne { top: -11px; right: -11px; cursor: nesw-resize; }
        .prism-board-resize-sw { bottom: -11px; left: -11px; cursor: nesw-resize; }
        .prism-board-resize-se { right: -11px; bottom: -11px; cursor: nwse-resize; }

        .prism-board-text-control,
        .prism-board-sticky-control {
            width: 100%;
            height: 100%;
            flex: 1;
            resize: none;
            border: 0;
            outline: 0;
            background: transparent;
            color: inherit;
            padding: 20px 22px 10px;
            font-weight: 800;
            line-height: 1.14;
        }

        .prism-board-widget-stickyNote .prism-board-widget-content {
            border-color: rgba(180, 83, 9, 0.16);
        }

        .prism-board-widget-swatches {
            display: flex;
            gap: 9px;
            padding: 0 12px 12px;
        }

        .prism-board-widget-swatches button {
            min-height: 38px;
            width: 38px;
            padding: 0;
            border-radius: 12px;
        }

        .prism-board-widget-swatches button.is-active {
            box-shadow: 0 0 0 3px #ffffff, 0 0 0 5px color-mix(in srgb, var(--accent) 46%, transparent);
        }

        .prism-board-timer-display,
        .prism-board-clock-live {
            flex: 1;
            display: grid;
            place-items: center;
            padding: 16px;
            color: var(--board-widget-accent, var(--accent));
            font-size: clamp(30px, 5vw, 86px);
            font-weight: 900;
            line-height: 1;
            text-align: center;
        }

        .prism-board-clock-live {
            color: #0f172a;
        }

        .prism-board-widget-controls {
            display: flex;
            justify-content: center;
            gap: 6px;
            padding: 0 10px 10px;
            flex-wrap: wrap;
        }

        .prism-board-widget-timer input[type="number"] {
            width: calc(100% - 20px);
            min-height: 34px;
            margin: 0 10px 10px;
            border: 1px solid rgba(148, 163, 184, 0.35);
            border-radius: 10px;
            padding: 0 10px;
            font-weight: 800;
        }

        .prism-board-traffic-shell {
            align-items: center;
            justify-content: center;
            gap: min(4.2cqh, 16px);
            padding: min(6.2cqh, 24px) 12%;
            background: #26384a;
            container-type: size;
        }

        .prism-board-widget .prism-board-traffic-light {
            appearance: none;
            --traffic-light-size: min(76cqw, 27cqh);
            width: var(--traffic-light-size);
            height: var(--traffic-light-size);
            aspect-ratio: 1 / 1;
            display: block;
            min-height: 0;
            flex: 0 0 auto;
            box-sizing: border-box;
            padding: 0;
            border-radius: 50%;
            opacity: 0.58;
            filter: saturate(0.88) brightness(0.7);
            border: clamp(3px, 2.1cqw, 8px) solid rgba(15, 23, 42, 0.18);
            color: transparent;
            box-shadow:
                inset 0 min(-8px, -1.8cqh) min(16px, 4cqh) rgba(15, 23, 42, 0.2),
                inset 0 min(6px, 1.5cqh) min(12px, 3cqh) rgba(255, 255, 255, 0.14);
            transform: none;
            transition: opacity 0.16s ease, filter 0.16s ease, box-shadow 0.16s ease;
        }

        .prism-board-widget .prism-board-traffic-light:hover:not(:disabled) {
            border-color: rgba(15, 23, 42, 0.18);
            background: inherit;
            transform: none;
        }

        .prism-board-widget .prism-board-traffic-light.is-red { background: #ef4438; }
        .prism-board-widget .prism-board-traffic-light.is-yellow { background: #facc15; }
        .prism-board-widget .prism-board-traffic-light.is-green { background: #2ecc71; }
        .prism-board-widget .prism-board-traffic-light.is-active {
            opacity: 1;
            filter: saturate(1.08) brightness(1.03);
        }

        .prism-board-widget .prism-board-traffic-light.is-active.is-red {
            box-shadow:
                inset 0 -8px 16px rgba(15, 23, 42, 0.18),
                inset 0 6px 14px rgba(255, 255, 255, 0.18),
                0 0 18px rgba(239, 68, 56, 0.48),
                0 0 34px rgba(239, 68, 56, 0.28);
        }

        .prism-board-widget .prism-board-traffic-light.is-active.is-yellow {
            box-shadow:
                inset 0 -8px 16px rgba(15, 23, 42, 0.18),
                inset 0 6px 14px rgba(255, 255, 255, 0.2),
                0 0 18px rgba(250, 204, 21, 0.52),
                0 0 34px rgba(250, 204, 21, 0.3);
        }

        .prism-board-widget .prism-board-traffic-light.is-active.is-green {
            box-shadow:
                inset 0 -8px 16px rgba(15, 23, 42, 0.18),
                inset 0 6px 14px rgba(255, 255, 255, 0.18),
                0 0 18px rgba(46, 204, 113, 0.5),
                0 0 34px rgba(46, 204, 113, 0.28);
        }

        .prism-board-widget-image img,
        .prism-board-widget-youtube iframe {
            width: 100%;
            min-height: 0;
            flex: 1;
            border: 0;
        }

        .prism-board-widget-image input,
        .prism-board-widget-youtube input {
            min-height: 38px;
            border: 0;
            border-top: 1px solid rgba(148, 163, 184, 0.28);
            padding: 0 12px;
            font-weight: 700;
        }

        .prism-board-schedule-title {
            min-height: 54px;
            border: 0;
            border-bottom: 1px solid rgba(148, 163, 184, 0.25);
            padding: 0 16px;
            color: #0f172a;
            font-size: 28px;
            font-weight: 900;
        }

        .prism-board-schedule-list {
            flex: 1;
            min-height: 0;
            display: flex;
            flex-direction: column;
            gap: 8px;
            padding: 12px 14px 0;
            overflow: auto;
        }

        .prism-board-schedule-item {
            display: grid;
            grid-template-columns: auto minmax(0, 1fr) auto;
            align-items: center;
            gap: 8px;
        }

        .prism-board-schedule-item input[type="text"] {
            min-width: 0;
            border: 0;
            border-bottom: 1px solid rgba(148, 163, 184, 0.24);
            background: transparent;
            color: #0f172a;
            font-weight: 800;
        }

        .prism-board-schedule-item button {
            min-height: 28px;
            width: 28px;
            padding: 0;
        }

        .prism-board-schedule-add {
            margin: 0 14px 14px;
        }



        .prism-board-sticky-tools {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 18px;
            padding: 0 22px 20px;
        }

        .prism-board-sticky-tools .prism-board-widget-swatches {
            flex: 0 0 auto;
            gap: 10px;
            padding: 0;
        }

        .prism-board-sticky-tools .prism-board-widget-swatches button {
            width: 42px;
            min-height: 42px;
            border-radius: 13px;
        }

        .prism-board-sticky-tools .prism-board-segmented-control {
            flex: 0 0 auto;
            flex-wrap: nowrap;
            gap: 8px;
        }

        .prism-board-sticky-tools .prism-board-segmented-control button {
            min-width: 38px;
            min-height: 38px;
            padding: 0 11px;
            border-radius: 13px;
            font-size: 13px;
        }

        .prism-board-segmented-control,
        .prism-board-image-source-row,
        .prism-board-clock-controls,
        .prism-board-timer-controls {
            display: flex;
            gap: 8px;
            flex-wrap: wrap;
            justify-content: center;
        }

        .prism-board-segmented-control button,
        .prism-board-image-source-row button,
        .prism-board-clock-controls button,
        .prism-board-timer-controls button {
            min-height: 34px;
            padding: 0 12px;
            border-radius: 12px;
            font-size: 12px;
        }

        .prism-board-segmented-control button.is-active,
        .prism-board-image-source-row button.is-active,
        .prism-board-clock-controls button.is-active {
            background: var(--accent);
            border-color: var(--accent);
            color: var(--accent-text, #ffffff);
        }

        .prism-board-widget-timer .prism-board-widget-content {
            position: relative;
            justify-content: center;
            container-type: size;
            gap: clamp(5px, 1.7cqh, 12px);
            padding: clamp(14px, 4.2cqw, 28px);
            box-sizing: border-box;
            border-color: color-mix(in srgb, var(--accent) 24%, var(--border));
            background:
                radial-gradient(circle at 50% 12%, color-mix(in srgb, var(--accent-soft) 64%, transparent), transparent 48%),
                linear-gradient(180deg, color-mix(in srgb, var(--surface) 96%, var(--accent-soft) 4%) 0%, var(--surface-soft) 100%);
        }

        .prism-board-widget-timer .prism-board-timer-display {
            width: 100%;
            height: 1.08em;
            min-height: 0;
            flex: 0 0 auto;
            border: 0;
            outline: 0;
            appearance: none;
            background: transparent;
            color: var(--accent-strong, var(--accent));
            font-size: clamp(52px, min(18cqw, 31cqh), 140px);
            font-weight: 900;
            text-align: center;
            line-height: 1;
            letter-spacing: 0;
            overflow: visible;
            text-shadow: 0 8px 22px color-mix(in srgb, var(--accent) 18%, transparent);
        }

        .prism-board-widget-timer .prism-board-timer-display:focus {
            box-shadow: inset 0 -3px 0 color-mix(in srgb, var(--accent) 45%, transparent);
        }

        .prism-board-timer-progress {
            width: 100%;
            height: clamp(7px, 2.3cqh, 13px);
            overflow: hidden;
            border-radius: 999px;
            background: color-mix(in srgb, var(--border) 74%, var(--surface-soft));
        }

        .prism-board-timer-progress-fill {
            width: 100%;
            height: 100%;
            border-radius: inherit;
            background: linear-gradient(90deg, var(--accent), var(--accent-strong, var(--accent)));
            transition: width 180ms linear;
        }

        .prism-board-timer-quick-times,
        .prism-board-widget-timer .prism-board-widget-controls,
        .prism-board-timer-settings {
            opacity: 0.38;
            transition: opacity 160ms ease;
        }

        .prism-board-widget-timer:hover .prism-board-timer-quick-times,
        .prism-board-widget-timer:hover .prism-board-widget-controls,
        .prism-board-widget-timer:hover .prism-board-timer-settings,
        .prism-board-widget-timer.is-selected .prism-board-timer-quick-times,
        .prism-board-widget-timer.is-selected .prism-board-widget-controls,
        .prism-board-widget-timer.is-selected .prism-board-timer-settings,
        .prism-board-widget-timer:focus-within .prism-board-timer-quick-times,
        .prism-board-widget-timer:focus-within .prism-board-widget-controls,
        .prism-board-widget-timer:focus-within .prism-board-timer-settings {
            opacity: 1;
        }

        .prism-board-timer-quick-times {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            gap: clamp(6px, 2cqh, 12px);
        }

        .prism-board-timer-quick-times button {
            min-height: clamp(32px, 10.2cqh, 50px);
            padding: 0 clamp(12px, 3.4cqw, 22px);
            border-radius: 999px;
            border-color: color-mix(in srgb, var(--accent) 22%, var(--border));
            background: color-mix(in srgb, var(--surface) 84%, var(--accent-soft) 16%);
            color: var(--text-soft);
            font-size: clamp(12px, 3.8cqw, 18px);
            font-weight: 900;
        }

        .prism-board-timer-quick-times button.is-active {
            background: var(--accent);
            border-color: var(--accent);
            color: var(--accent-text, #ffffff);
            box-shadow: 0 8px 18px color-mix(in srgb, var(--accent) 26%, transparent);
        }

        .prism-board-widget-timer .prism-board-widget-controls {
            padding: 0;
        }

        .prism-board-widget-timer .prism-board-timer-controls {
            gap: clamp(10px, 3cqh, 20px);
        }

        .prism-board-widget-timer .prism-board-timer-controls button {
            width: clamp(46px, 14.2cqh, 72px);
            min-height: 0;
            height: clamp(46px, 14.2cqh, 72px);
            padding: 0;
            border-radius: 999px;
            border-color: color-mix(in srgb, var(--accent) 30%, var(--border));
            background: var(--surface);
            color: var(--accent-strong, var(--accent));
            box-shadow: 0 10px 22px rgba(15, 23, 42, 0.12);
        }

        .prism-board-widget-timer .prism-board-timer-controls button:first-child {
            background: var(--accent);
            border-color: var(--accent);
            color: var(--accent-text, #ffffff);
            box-shadow: 0 12px 26px color-mix(in srgb, var(--accent) 28%, transparent);
        }

        .prism-board-widget-timer .prism-board-timer-controls svg {
            width: 54%;
            height: 54%;
            stroke-width: 2.5;
        }

        .prism-board-timer-settings {
            display: flex;
            justify-content: center;
        }

        .prism-board-timer-sound-select {
            width: min(300px, 84%);
            min-height: clamp(38px, 11.2cqh, 54px);
            align-self: center;
            border: 1px solid color-mix(in srgb, var(--accent) 38%, var(--border));
            border-radius: 999px;
            padding: 0 clamp(14px, 3.2cqw, 20px);
            color: var(--text-soft);
            background: var(--surface);
            font-size: clamp(12px, 3.5cqw, 17px);
            font-weight: 800;
        }

        .prism-board-widget-timer .prism-board-timer-complete-overlay {
            position: absolute;
            inset: 0;
            z-index: 4;
            width: 100%;
            height: 100%;
            min-height: 0;
            display: grid;
            place-items: center;
            padding: clamp(16px, 5cqw, 34px);
            border: 0;
            border-radius: inherit;
            background:
                radial-gradient(circle at 50% 30%, color-mix(in srgb, var(--accent) 24%, transparent), transparent 46%),
                color-mix(in srgb, var(--surface) 88%, rgba(15, 23, 42, 0.74) 12%);
            color: var(--accent-strong, var(--accent));
            font-size: clamp(38px, min(14cqw, 24cqh), 108px);
            font-weight: 950;
            letter-spacing: 0;
            line-height: 1;
            text-align: center;
            text-transform: none;
            box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 28%, transparent);
            cursor: pointer;
        }

        .prism-board-widget-timer .prism-board-timer-complete-overlay:hover,
        .prism-board-widget-timer .prism-board-timer-complete-overlay:focus-visible {
            background:
                radial-gradient(circle at 50% 30%, color-mix(in srgb, var(--accent) 32%, transparent), transparent 46%),
                color-mix(in srgb, var(--surface) 82%, rgba(15, 23, 42, 0.8) 18%);
            transform: none;
        }

        .prism-board-widget-image .prism-board-widget-content {
            gap: 0;
        }

        .prism-board-widget-image .prism-board-widget-content.has-board-image {
            padding: 0;
            background: #ffffff;
        }

        .prism-board-image-fill {
            width: 100%;
            height: 100%;
            display: block;
        }

        .prism-board-image-selected-controls {
            position: absolute;
            left: 10px;
            right: 10px;
            bottom: 10px;
            z-index: 4;
            display: flex;
            justify-content: center;
            gap: 6px;
            padding: 6px;
            border-radius: 14px;
            background: color-mix(in srgb, var(--surface) 88%, transparent);
            box-shadow: 0 8px 22px rgba(15, 23, 42, 0.18);
        }

        .prism-board-image-selected-controls select,
        .prism-board-image-selected-controls button {
            min-height: 30px;
            border-radius: 10px;
            padding: 0 10px;
            font-size: 11px;
            font-weight: 800;
        }

        .prism-board-image-preview {
            min-height: 0;
            flex: 1;
            display: grid;
            place-items: center;
            gap: 8px;
            color: var(--muted);
            background: color-mix(in srgb, var(--surface-soft) 84%, #ffffff 16%);
            overflow: hidden;
        }

        .prism-board-image-preview img {
            width: 100%;
            height: 100%;
            min-height: 0;
        }

        .prism-board-image-preview svg {
            width: 34px;
            height: 34px;
            color: var(--accent);
        }

        .prism-board-image-controls {
            display: grid;
            gap: 7px;
            padding: 8px;
            border-top: 1px solid rgba(148, 163, 184, 0.28);
            background: color-mix(in srgb, var(--surface) 94%, transparent);
        }

        .prism-board-image-controls > input,
        .prism-board-image-search-row input {
            width: 100%;
            min-height: 34px;
            border: 1px solid rgba(148, 163, 184, 0.32);
            border-radius: 10px;
            padding: 0 10px;
            font-weight: 700;
        }

        .prism-board-image-search-panel {
            display: grid;
            gap: 6px;
        }

        .prism-board-image-search-row {
            display: grid;
            grid-template-columns: minmax(0, 1fr) auto;
            gap: 6px;
        }

        .prism-board-image-search-status {
            margin: 0;
            color: var(--muted);
            font-size: 11px;
            font-weight: 700;
        }

        .prism-board-image-results {
            max-height: 92px;
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            gap: 6px;
            overflow: auto;
        }

        .prism-board-image-results button {
            min-height: 54px;
            padding: 0;
            overflow: hidden;
            border-radius: 10px;
        }

        .prism-board-image-results img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        .prism-board-widget-clock .prism-board-widget-content {
            position: relative;
            justify-content: center;
            gap: 0;
            padding: clamp(4px, 1.6cqh, 10px) clamp(5px, 1.8cqw, 12px) clamp(38px, 13cqh, 58px);
            overflow: hidden;
            container-type: size;
            background: transparent;
            border-color: transparent;
            box-shadow: none;
        }

        .prism-board-widget-clock .prism-board-clock-live {
            flex: 1 1 auto;
            width: 100%;
            min-height: 0;
            display: flex;
            flex-direction: column;
            gap: clamp(4px, 1.8cqh, 10px);
            align-items: center;
            justify-content: center;
            padding: 0;
            color: var(--text-main, #0f172a);
            text-align: center;
        }

        .prism-board-widget-clock .prism-board-digital-time {
            color: var(--accent-strong, var(--accent, #2563eb));
            font-size: clamp(62px, min(26cqw, 42cqh), 150px);
            font-weight: 950;
            letter-spacing: -0.035em;
            line-height: 0.9;
            text-shadow: 0 10px 26px color-mix(in srgb, var(--accent, #2563eb) 18%, transparent);
        }

        .prism-board-widget-clock .prism-board-clock-date {
            color: var(--text-muted, var(--muted, #64748b));
            font-size: clamp(14px, min(4cqw, 7cqh), 28px);
            font-weight: 850;
            line-height: 1.05;
        }

        .prism-board-widget-clock .prism-board-analog-clock {
            position: relative;
            width: min(94cqw, 92cqh);
            aspect-ratio: 1;
            border: clamp(5px, 2cqw, 10px) solid color-mix(in srgb, var(--accent, #2563eb) 62%, #ffffff 38%);
            border-radius: 50%;
            background: radial-gradient(circle, var(--surface, #ffffff) 0 58%, color-mix(in srgb, var(--accent-soft, #dbeafe) 82%, #ffffff 18%) 100%);
            box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--text-main, #0f172a) 8%, transparent), 0 12px 26px rgba(15, 23, 42, 0.12);
        }

        .prism-board-widget-clock .prism-board-clock-number {
            position: absolute;
            inset: clamp(10px, 4cqw, 22px);
            display: grid;
            place-items: start center;
            color: var(--text-main, #0f172a);
            font-size: clamp(11px, 3.2cqw, 21px);
            font-weight: 900;
            transform: rotate(var(--clock-number-angle));
        }

        .prism-board-clock-number span {
            transform: rotate(calc(var(--clock-number-angle) * -1));
        }

        .prism-board-widget-clock .prism-board-clock-hand {
            position: absolute;
            left: 50%;
            bottom: 50%;
            transform-origin: 50% 100%;
            translate: -50% 0;
            border-radius: 999px;
            background: var(--text-main, #0f172a);
        }

        .prism-board-widget-clock .prism-board-clock-hour {
            width: clamp(5px, 1.6cqw, 9px);
            height: 28%;
        }

        .prism-board-widget-clock .prism-board-clock-minute {
            width: clamp(3px, 1.1cqw, 6px);
            height: 38%;
            background: var(--accent, #2563eb);
        }

        .prism-board-widget-clock .prism-board-clock-pin {
            position: absolute;
            width: clamp(11px, 3cqw, 20px);
            height: clamp(11px, 3cqw, 20px);
            left: 50%;
            top: 50%;
            border-radius: 50%;
            background: var(--text-main, #0f172a);
            transform: translate(-50%, -50%);
        }

        .prism-board-widget-clock .prism-board-clock-controls {
            position: absolute;
            left: clamp(8px, 3cqw, 18px);
            right: clamp(8px, 3cqw, 18px);
            bottom: clamp(6px, 2.2cqh, 12px);
            z-index: 2;
            flex: 0 0 auto;
            display: flex;
            justify-content: center;
            gap: clamp(6px, 2cqw, 12px);
            width: auto;
            padding: 0;
            flex-wrap: nowrap;
            opacity: 0;
            pointer-events: none;
            transition: opacity 160ms ease;
        }

        .prism-board-widget-clock:hover .prism-board-clock-controls,
        .prism-board-widget-clock.is-selected .prism-board-clock-controls,
        .prism-board-widget-clock:focus-within .prism-board-clock-controls {
            opacity: 1;
            pointer-events: auto;
        }

        .prism-board-widget-clock .prism-board-clock-controls button {
            min-height: clamp(30px, 9cqh, 44px);
            min-width: clamp(60px, 18cqw, 108px);
            padding: 0 clamp(10px, 3cqw, 18px);
            border-radius: 999px;
            border-color: color-mix(in srgb, var(--accent, #2563eb) 22%, var(--border, #cbd5e1) 78%);
            background: color-mix(in srgb, var(--surface, #ffffff) 90%, transparent);
            color: var(--text-main, #0f172a);
            font-size: clamp(11px, min(3.5cqw, 5cqh), 15px);
            font-weight: 850;
            box-shadow: 0 8px 18px rgba(15, 23, 42, 0.08);
        }

        .prism-board-widget-clock .prism-board-clock-controls button.is-active {
            background: var(--accent, #2563eb);
            border-color: var(--accent, #2563eb);
            color: var(--accent-text, #ffffff);
            box-shadow: 0 10px 22px color-mix(in srgb, var(--accent, #2563eb) 28%, transparent);
        }

        .prism-board-widget-noiseLevel .prism-board-widget-content {
            box-sizing: border-box;
            background: transparent;
            border-color: transparent;
            box-shadow: none;
            overflow: hidden;
        }

        .prism-board-noise-shell {
            flex: 1;
            width: 100%;
            height: 100%;
            min-height: 0;
            display: grid;
            place-items: center;
            padding: 0;
            box-sizing: border-box;
            container-type: size;
        }

        .prism-board-noise-scale-shell {
            width: min(94cqw, 150.4cqh);
            max-width: 100%;
            aspect-ratio: 8 / 5;
            min-width: 0;
            display: grid;
            grid-template-columns: 15% minmax(0, 70%) 15%;
            align-items: center;
            justify-items: center;
            column-gap: 0;
        }

        .prism-board-noise-image {
            display: block;
            width: 100%;
            height: 100%;
            max-width: 100%;
            max-height: 100%;
            min-width: 0;
            min-height: 0;
            object-fit: contain;
        }

        .prism-board-noise-arrow {
            display: grid;
            place-items: center;
            width: 68%;
            min-height: 0;
            aspect-ratio: 1 / 1;
            padding: 0;
            border: 0;
            border-radius: 10px;
            color: var(--primary);
            background: transparent;
            box-shadow: none;
            opacity: 0;
            transform: none;
            transition: opacity 160ms ease, background-color 160ms ease;
        }

        .prism-board-widget-noiseLevel:hover .prism-board-noise-arrow,
        .prism-board-widget-noiseLevel.is-selected .prism-board-noise-arrow,
        .prism-board-noise-arrow:focus-visible {
            opacity: 1;
        }

        .prism-board-noise-arrow:hover,
        .prism-board-noise-arrow:focus-visible {
            background: rgba(37, 99, 235, 0.08);
            color: var(--primary);
            box-shadow: none;
            transform: none;
        }

        .prism-board-noise-arrow svg {
            width: 58%;
            height: 58%;
            stroke: currentColor;
        }

        .prism-board-view.is-presenting {
            position: fixed;
            inset: 0;
            z-index: 4000;
            padding: 0;
            background: #020617;
        }

        .prism-board-view.is-presenting .prism-board-toolbar {
            display: none;
        }

        .prism-board-view.is-presenting .prism-board-shell,
        .prism-board-view.is-presenting .prism-board-stage-shell {
            width: 100%;
            height: 100%;
            padding: 0;
            border-radius: 0;
            background: #020617;
        }

        .prism-board-view.is-presenting .prism-board-stage {
            border-radius: 0;
            border: 0;
            box-shadow: none;
        }

        :root[data-prism-theme="midnight"] .prism-board-stage-shell {
            background: #1e293b;
        }

        :root[data-prism-theme="midnight"] .prism-board-toolbar,
        :root[data-prism-theme="midnight"] .prism-board-popover {
            background: var(--surface);
            color: var(--text-main);
        }

        @media (max-width: 1180px) {
            .prism-board-toolbar {
                grid-template-columns: 1fr;
            }

            .prism-board-save-state {
                justify-self: start;
            }
        }

        @media (max-width: 760px) {
            .prism-board-shell {
                padding-right: 0;
            }

            .prism-board-toolbar-actions {
                justify-content: flex-start;
            }

            .prism-board-toolbar-actions button span {
                display: none;
            }

            .prism-board-add-menu {
                grid-template-columns: repeat(2, minmax(0, 1fr));
                width: calc(100vw - 48px);
            }

            .prism-board-stage-shell {
                padding: 10px;
            }

            .prism-board-stage-viewport,
            .prism-board-stage {
                min-width: 0;
            }
        }