:root {
    --ink: #0d0d0d;
    --cream: #f5f0e8;
    --gold: #c9a84c;
    --gold-light: #e8c97a;
    --teal: #1a6b6b;
    --teal-light: #2e9e9e;
    --teal-pale: #e8f4f4;
    --rust: #c05e3a;
    --sage: #7aad8a;
    --off-white: #faf7f2;
    --mid: #6b6560;
    --card: #ffffff;
    --border: rgba(13, 13, 13, 0.1);
    --sidebar-w: clamp(282px, 21vw, 320px);
    --sidebar-collapsed-w: 80px;
    --sidebar-motion-duration: 220ms;
    --sidebar-motion-ease: cubic-bezier(0.22, 0.78, 0.22, 1);
    --header-h: 60px;
    --scroll-track: rgba(13, 13, 13, 0.05);
    --scroll-thumb: rgba(26, 107, 107, 0.34);
    --scroll-thumb-strong: rgba(26, 107, 107, 0.56);
    --scroll-corner: rgba(13, 13, 13, 0.02);
    --workspace-hero-radius: 20px;
    --workspace-hero-padding: clamp(1.25rem, 2.4vw, 1.85rem);
    --workspace-hero-gap: clamp(1rem, 2vw, 1.6rem);
    --workspace-hero-shadow: 0 20px 56px rgba(13, 13, 13, 0.12);
    --workspace-card-radius: 18px;
    --workspace-card-padding: 1rem;
    --workspace-card-shadow: 0 14px 34px rgba(13, 13, 13, 0.055);
    --workspace-card-border: rgba(13, 13, 13, 0.08);
    --workspace-student-hero: linear-gradient(135deg, rgba(26, 107, 107, 0.98), rgba(46, 158, 158, 0.96));
    --workspace-school-hero: radial-gradient(circle at top right, rgba(232, 201, 122, 0.34), transparent 34%), linear-gradient(135deg, rgba(11, 39, 82, 0.98), rgba(26, 107, 107, 0.94));
    --workspace-tutor-hero: radial-gradient(circle at top right, rgba(46, 158, 158, 0.24), transparent 34%), linear-gradient(135deg, rgba(13, 13, 13, 0.98), rgba(26, 107, 107, 0.94));
    --workspace-course-hero: radial-gradient(circle at top right, rgba(232, 201, 122, 0.22), transparent 34%), linear-gradient(135deg, rgba(9, 51, 68, 0.98), rgba(26, 107, 107, 0.94));
}

/* Forum pages share the workspace hero and content-panel language. */
.forum-shell { max-width: 1080px; margin: 0 auto; display: grid; gap: 1.2rem; padding-bottom: 3rem; min-width: 0; }
.forum-operations-shell { max-width: none; }
.forum-workspace-hero { margin-bottom: 0; min-width: 0; }
.forum-workspace-hero :is(.admin-hero-copy, .tutor-hero-copy, .student-hero-copy, .school-hero-copy) { min-width: 0; }
.forum-workspace-hero h2 { overflow-wrap: anywhere; }
.forum-hero-emblem { display: grid; place-items: center; width: 5.5rem; height: 5.5rem; border: 1px solid rgba(255, 255, 255, .32); border-radius: 1.35rem; background: rgba(255, 255, 255, .14); color: #fff; font-size: 2rem; }
.forum-panel { padding: clamp(1.15rem, 2.6vw, 1.7rem); border: 1px solid var(--workspace-card-border); border-radius: var(--workspace-card-radius); background: var(--card); box-shadow: var(--workspace-card-shadow); min-width: 0; }
.forum-panel h3 { font-family: Georgia, serif; font-size: clamp(1.3rem, 2.5vw, 1.6rem); color: #163e47; margin: .25rem 0 .6rem; }
.forum-panel h3 > i { color: var(--teal); font-family: 'Font Awesome 6 Free'; font-size: .75em; margin-right: .25rem; }
.forum-panel-kicker { color: #13736d; font-size: .72rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.forum-entry-panel { display: grid; gap: 1rem; border: 1px solid #cfe3df; background: radial-gradient(circle at top right, rgba(46, 158, 158, .09), transparent 38%), #fff; }
.forum-entry-head { margin: 0; align-items: end; }
.forum-entry-head > div { min-width: 0; }
.forum-entry-head h2 { margin: .35rem 0; color: #153d47; font-size: clamp(1.3rem, 2.3vw, 1.65rem); overflow-wrap: anywhere; }
.forum-entry-head h2 i { margin-right: .3rem; color: var(--teal); font-size: .8em; }
.forum-entry-head p:last-child { margin: 0; color: var(--mid); line-height: 1.5; }
.forum-entry-head .button { flex: 0 0 auto; }
.forum-entry-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: .75rem; }
.forum-entry-question { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .45rem .7rem; align-content: space-between; min-height: 108px; padding: 1rem; border: 1px solid #dce9e5; border-radius: 14px; background: #f8fbfa; color: #173d46; text-decoration: none; transition: border-color .2s ease, transform .2s ease; }
.forum-entry-question:hover, .forum-entry-question:focus-visible { border-color: var(--teal); transform: translateY(-2px); }
.forum-entry-question > span { grid-column: 1 / -1; color: var(--teal); font-size: .72rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.forum-entry-question > strong { overflow-wrap: anywhere; line-height: 1.45; }
.forum-entry-question > i { align-self: end; color: var(--teal); }
.forum-entry-footnote { margin: 0; color: var(--mid); font-size: .83rem; }
.forum-entry-empty { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem 1rem; padding: .9rem 1rem; border: 1px dashed #c9deda; border-radius: 13px; background: #f8fbfa; }
.forum-entry-empty > i { color: var(--teal); }
.forum-entry-empty p { margin: 0; color: #4e6569; }
.forum-entry-empty .text-link { margin-left: auto; }
.forum-directory-panel { display: grid; gap: .8rem; }
.forum-directory-panel .panel-head { margin: 0; }
.forum-directory-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: .75rem; }
.forum-directory-link { display: flex; justify-content: space-between; align-items: center; gap: .8rem; padding: .9rem 1rem; border: 1px solid #dce9e5; border-radius: 13px; background: #f8fbfa; color: #173d46; text-decoration: none; }
.forum-directory-link:hover, .forum-directory-link:focus-visible { border-color: var(--teal); background: #eef8f6; }
.forum-directory-link > span:first-child { display: grid; gap: .2rem; min-width: 0; }
.forum-directory-link small { color: var(--teal); font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.forum-directory-link strong { overflow-wrap: anywhere; }
.forum-directory-link > span:last-child { flex: 0 0 auto; color: var(--teal); font-size: .82rem; font-weight: 800; }
.forum-directory-link > span:last-child i { margin-left: .25rem; }
.forum-compose { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: 1.75rem; align-items: start; }
.forum-compose p { color: #57666a; line-height: 1.55; margin: 0; }
.forum-compose-form { display: grid; gap: .7rem; }
.forum-compose-form label { font-weight: 700; color: #1b5156; }
.forum-compose-form textarea, .forum-search input { width: 100%; border: 1px solid #b9d0ce; border-radius: 13px; background: #fcfefd; color: #183d46; font: inherit; padding: .85rem 1rem; }
.forum-compose-form textarea:focus, .forum-search input:focus { outline: 3px solid #a9d8d2; border-color: #14716b; }
.forum-compose-actions { display: flex; align-items: center; justify-content: space-between; gap: .8rem; flex-wrap: wrap; }
.forum-compose-actions small { color: #667578; max-width: 35ch; }
.forum-feed-heading, .forum-question-top, .forum-question-meta, .forum-pages { display: flex; align-items: center; justify-content: space-between; gap: .8rem; }
.forum-search { display: flex; gap: .6rem; margin: 1rem 0; }
.forum-search input { min-width: 0; flex: 1; }
.forum-filters { display: flex; flex-wrap: wrap; gap: .45rem; margin: 1rem 0 1.2rem; }
.forum-filters a { padding: .55rem .9rem; white-space: nowrap; text-decoration: none; color: #52686a; font-size: .9rem; font-weight: 700; border: 1px solid #d8e5e1; border-radius: 999px; background: #f6faf8; }
.forum-filters a:hover, .forum-filters a:focus-visible { border-color: var(--teal); color: var(--teal); }
.forum-filters a[aria-current="page"] { color: #fff; border-color: var(--teal); background: var(--teal); }
.forum-question-list { display: grid; gap: .75rem; }
.forum-question-card { display: grid; gap: .7rem; padding: 1.1rem 1.2rem; border: 1px solid #dce9e5; border-radius: 15px; background: linear-gradient(145deg, #f9fcfb, #fff); text-decoration: none; color: #173a42; transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease; }
.forum-question-card:hover, .forum-question-card:focus-visible { border-color: #8bbfba; box-shadow: 0 9px 22px rgba(19, 59, 69, .08); transform: translateY(-2px); }
.forum-question-card:hover strong, .forum-question-card:focus-visible strong { color: #08756f; }
.forum-question-card > strong { font-size: 1.08rem; line-height: 1.4; overflow-wrap: anywhere; }
.forum-question-top { font-size: .84rem; color: #5b6c6e; flex-wrap: wrap; }
.forum-question-top > span:first-child { font-weight: 700; }
.forum-status { display: inline-flex; border-radius: 999px; padding: .25rem .65rem; background: #e8f2ef; color: #25645f; font-size: .75rem; font-weight: 800; }
.forum-status.is-answered { background: #dff3ec; color: #17644e; }
.forum-status.is-held { background: #fff3d8; color: #805b1e; }
.forum-question-meta { color: #718183; font-size: .78rem; justify-content: flex-start; }
.forum-question-meta .fa-arrow-right { margin-left: auto; color: #13736d; }
.forum-pages { padding-top: 1rem; }
.forum-empty { display: grid; justify-items: center; gap: .35rem; text-align: center; padding: 2.5rem .5rem; color: #657476; }
.forum-empty i { font-size: 1.7rem; color: #13736d; }
.forum-empty strong { color: #173e45; }
.forum-back { color: #176b66; font-weight: 700; text-decoration: none; }
.forum-thread-shell { max-width: 800px; }
.forum-thread-body { font-size: 1.05rem; line-height: 1.65; overflow-wrap: anywhere; white-space: normal; color: #243f46; }
.forum-thread-question time, .forum-reply time { font-size: .8rem; color: #748184; }
.forum-held-note { padding: .8rem 1rem; border-radius: 12px; background: #fff7e4; color: #77571b; }
.forum-thread-actions { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: 1.3rem; }
.forum-thread-actions form { margin: 0; }
.forum-reply { padding: 1.2rem 0; border-top: 1px solid #e6edeb; }
.forum-reply:first-of-type { margin-top: .8rem; }
.forum-contribution-label { display: inline-block; margin-top: .55rem; color: #17645f; font-size: .78rem; font-weight: 800; letter-spacing: .02em; }
.forum-health-workspace { display: grid; gap: 1.2rem; min-width: 0; }
.forum-health-workspace .admin-hero-band { margin-bottom: 0; }
.forum-health-status { display: flex; flex-wrap: wrap; align-items: center; gap: .8rem; margin-top: .3rem; color: rgba(255, 255, 255, .76); font-size: .85rem; }
.forum-health-hero .forum-health-status .pill { border: 1px solid rgba(255, 255, 255, .25); background: rgba(255, 255, 255, .14); color: #fff; }
.forum-health-hero .forum-health-status .pill.is-off { background: rgba(201, 168, 76, .2); }
.forum-health-scope-panel .panel-head { margin-bottom: .3rem; }
.forum-health-scope-panel p:last-child { margin-bottom: 0; color: var(--mid); }
.forum-health-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; min-width: 0; }
.forum-health-grid .student-pulse-card { min-width: 0; min-height: 145px; border-radius: 18px; align-content: start; }
.forum-health-grid .student-pulse-card strong { overflow-wrap: anywhere; }
.forum-push-metrics { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: .75rem; margin: 1rem 0 0; }
.forum-push-metrics > div { min-width: 0; padding: .85rem 1rem; border: 1px solid #d9e7e2; border-radius: 14px; background: #f5faf7; }
.forum-push-metrics dt { color: #486862; font-size: .8rem; font-weight: 700; }
.forum-push-metrics dd { margin: .2rem 0 0; color: #153b37; font-family: Georgia, serif; font-size: 1.65rem; font-weight: 700; line-height: 1.1; }
.forum-push-attention { display: flex; align-items: baseline; gap: .5rem; margin: .85rem 0 0; color: #6b4c24; font-size: .85rem; }
.forum-health-readonly-note { display: flex; align-items: flex-start; gap: .75rem; padding: .9rem 1rem; border: 1px solid rgba(201, 168, 76, .35); border-radius: 12px; background: #fff9ea; color: #66532b; line-height: 1.5; }
.forum-health-readonly-note i { margin-top: .2rem; }
.forum-health-forum-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .9rem; }
.forum-health-forum-grid .forum-empty { grid-column: 1 / -1; }
.forum-health-forum-card { min-width: 0; }
.forum-health-forum-card[aria-current='page'] { border-color: var(--teal); box-shadow: inset 0 0 0 1px var(--teal); }
.forum-health-forum-card strong { overflow-wrap: anywhere; }
.forum-health-forum-link { display: flex; align-items: center; justify-content: space-between; gap: .7rem; margin-top: .25rem; color: var(--teal); font-size: .85rem; font-weight: 700; }
.forum-settings-warning { border-color: #e7d6a6; background: #fffaf0; }
.forum-settings-warning p { max-width: 72ch; color: #5b563e; line-height: 1.55; }
.forum-settings-pilot-warning { display: flex; align-items: flex-start; gap: .5rem; padding: .75rem .9rem; border: 1px solid #e5cfaa; border-radius: 11px; background: #fffbf3; color: #69502a; font-size: .85rem; line-height: 1.45; }
.forum-settings-pilot-warning i { flex: none; margin-top: .2rem; }
.forum-settings-pilot-label { margin-left: .35rem; color: #1a745a; font-size: .68rem; letter-spacing: .06em; text-transform: uppercase; }
.forum-setting-item { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1.2rem 0; border-bottom: 1px solid #e3ece9; }
.forum-setting-item > div { display: grid; gap: .35rem; min-width: 0; }
.forum-setting-item strong { color: #173e45; overflow-wrap: anywhere; }
.forum-setting-item span { color: #617376; font-size: .86rem; }
.forum-settings-form { display: flex; flex-wrap: wrap; align-items: center; gap: .55rem; margin-top: 1rem; }
.forum-settings-form label { color: #194b50; font-size: .85rem; font-weight: 700; }
.forum-settings-form input { width: 7rem; padding: .65rem .75rem; border: 1px solid #bdd2ce; border-radius: 10px; font: inherit; }
.forum-settings-form input:focus { outline: 3px solid #a9d8d2; border-color: #14716b; }
.forum-moderation-item { padding: 1.2rem; border: 1px solid #e0e9e7; border-radius: 15px; background: #fbfdfc; display: grid; gap: .6rem; min-width: 0; }
.forum-moderation-item p { margin: 0; overflow-wrap: anywhere; }
.forum-moderation-content { border-left: 3px solid #8db9b4; padding: .65rem .9rem; background: #f5faf8; color: #28464b; white-space: pre-wrap; }
.forum-moderation-form { display: grid; gap: .55rem; margin-top: .75rem; }
.forum-moderation-form label { color: #194b50; font-weight: 700; }
.forum-moderation-form :is(input, select, textarea) { width: 100%; padding: .7rem .85rem; border: 1px solid #bdd2ce; border-radius: 10px; background: #fff; color: #173d43; font: inherit; }
.forum-moderation-form :is(input, select, textarea):focus { outline: 3px solid #a9d8d2; border-color: #14716b; }
.forum-report-panel summary { cursor: pointer; color: #185c5c; font-weight: 800; }
.forum-report-panel > p { color: #52686a; }
.forum-guardian-answer { margin-top: .9rem; padding: 1rem; border-radius: 13px; background: #eff8f5; border: 1px solid #c9e2db; }
.forum-guardian-answer strong { color: #17604d; }
.forum-guardian-answer p { margin: .4rem 0; overflow-wrap: anywhere; }
.forum-audit-item { padding: .9rem 1rem; border: 1px solid #e3ece9; border-radius: 12px; background: #fbfdfc; display: grid; gap: .25rem; }
.forum-audit-item span, .forum-audit-item p { color: #647477; font-size: .85rem; margin: 0; }
@media (max-width: 960px) { .forum-health-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 720px) { .forum-compose { grid-template-columns: 1fr; gap: 1rem; } .forum-search { flex-wrap: wrap; } .forum-search .button { flex: 0 0 auto; } .forum-thread-actions .button { width: 100%; } .forum-setting-item { align-items: flex-start; flex-direction: column; } .forum-health-forum-grid { grid-template-columns: 1fr; } .forum-hero-emblem { display: none; } .forum-workspace-hero :is(.admin-hero-actions, .tutor-hero-actions, .student-hero-actions, .school-hero-actions) { width: 100%; min-width: 0; } }
@media (max-width: 560px) { .forum-health-grid { grid-template-columns: 1fr; } .forum-health-scope-panel .panel-head { align-items: flex-start; flex-wrap: wrap; } .forum-shell .forum-panel { padding: 1rem; } .forum-shell .panel-head { align-items: flex-start; flex-wrap: wrap; } .forum-question-card, .forum-moderation-item { padding: 1rem; } .forum-pages { flex-wrap: wrap; } }
@media (max-width: 560px) { .forum-entry-head { align-items: flex-start; flex-direction: column; } .forum-entry-head .button { width: 100%; } .forum-entry-empty .text-link { margin-left: 0; } .forum-directory-link { align-items: flex-start; flex-direction: column; } }

/* Learning community: a restrained forum surface within the workspace. */
.app-content:has(> .forum-shell) { background-color: #f8f9f5; background-image: linear-gradient(rgba(248, 250, 246, .5), rgba(248, 250, 246, .5)), url("../images/forum-sage-pattern.5ec1dd972a66.webp"); background-repeat: repeat; background-size: auto, 627px 627px; }
.forum-shell { --forum-deep: #123f38; --forum-ink: #183b37; --forum-line: #dbe7e2; --forum-accent: #176b55; --forum-accent-soft: #e3f2e9; --forum-accent-wash: #f6fbf7; --forum-accent-line: #b6d8c7; max-width: 960px; gap: 1.15rem; }
.forum-tone-general { --forum-accent: #176b55; --forum-accent-soft: #e3f2e9; --forum-accent-wash: #f6fbf7; --forum-accent-line: #b6d8c7; }
.forum-tone-subject { --forum-accent: #245f82; --forum-accent-soft: #e8f3f9; --forum-accent-wash: #f7fbfd; --forum-accent-line: #bdd8e7; }
.forum-tone-course { --forum-accent: #805b23; --forum-accent-soft: #f8efde; --forum-accent-wash: #fffbf5; --forum-accent-line: #e8d4b0; }
.forum-feed-shell { width: 100%; max-width: none; }
.forum-operations-shell { max-width: 1080px; }
.forum-community-hero { position: relative; display: grid; gap: .75rem; overflow: hidden; min-width: 0; padding: clamp(1.4rem, 3vw, 2.2rem); border-radius: 22px; background: radial-gradient(circle at 91% 5%, rgba(232, 189, 99, .2), transparent 28%), radial-gradient(circle at 92% -20%, rgba(120, 191, 160, .22), transparent 33%), linear-gradient(135deg, #103b35, #19584c); box-shadow: 0 16px 35px rgba(14, 54, 47, .14); color: #fff; }
.forum-feed-shell .forum-community-hero, .forum-thread-shell .forum-community-hero { gap: .5rem; padding: clamp(1.15rem, 2.2vw, 1.7rem); }
.forum-feed-shell .forum-community-hero h2, .forum-thread-shell .forum-community-hero h2 { max-width: none; font-size: clamp(1.65rem, 3vw, 2.35rem); }
.forum-feed-shell .forum-community-eyebrow, .forum-thread-shell .forum-community-eyebrow { margin: 0 !important; }
.forum-feed-shell .forum-hero-controls { margin-top: .3rem; }
.forum-community-hero::after { content: ''; position: absolute; width: 15rem; height: 15rem; right: -7rem; bottom: -11rem; border: 1px solid rgba(255, 255, 255, .1); border-radius: 50%; pointer-events: none; }
.forum-community-hero > * { position: relative; z-index: 1; }
.forum-community-mark { display: flex; align-items: center; gap: .65rem; margin-bottom: .35rem; }
.forum-community-mark > div { display: grid; gap: .08rem; }
.forum-community-mark strong { font-size: .9rem; letter-spacing: .015em; }
.forum-community-mark small { color: #b6d8cd; font-size: .7rem; }
.forum-community-icon { display: grid; place-items: center; width: 2.5rem; height: 2.5rem; border-radius: 50%; background: #357f70; color: #fff; }
.forum-community-eyebrow { margin: .15rem 0 -.45rem !important; color: #f1dba6 !important; font-size: .72rem !important; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; overflow-wrap: anywhere; }
.forum-community-hero h2 { margin: 0; max-width: 18ch; color: #fff; font-family: Georgia, serif; font-size: clamp(1.9rem, 4vw, 2.8rem); line-height: 1.12; letter-spacing: -.035em; }
.forum-community-hero > p:not(.forum-community-eyebrow) { max-width: 67ch; margin: 0; color: #d9ebe4; line-height: 1.55; }
.forum-hero-controls { display: flex; align-items: stretch; gap: .7rem; margin-top: .7rem; min-width: 0; }
.forum-hero-controls .forum-search { display: flex; flex: 1 1 auto; flex-wrap: nowrap; align-items: center; gap: .65rem; min-width: 0; margin: 0; padding: .2rem .35rem .2rem .85rem; border: 1px solid rgba(220, 244, 233, .32); border-radius: 999px; background: rgba(5, 41, 35, .26); color: #cce7dc; }
.forum-hero-controls .forum-search input { flex: 1 1 auto; min-width: 0; width: auto; padding: .6rem .25rem; border: 0; border-radius: 0; outline: 0; background: transparent; color: #fff; box-shadow: none; }
.forum-hero-controls .forum-search input::placeholder { color: #bfd7cc; opacity: 1; }
.forum-hero-controls .forum-search input:focus { outline: 0; border: 0; }
.forum-hero-controls .forum-search:focus-within { outline: 3px solid rgba(210, 243, 228, .4); }
.forum-hero-controls .forum-search button { flex: 0 0 auto; min-height: 2.3rem; padding: .45rem .9rem; border: 0; border-radius: 999px; background: #e9f6ef; color: #164f43; font: inherit; font-size: .82rem; font-weight: 800; cursor: pointer; }
.forum-new-post { display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; gap: .5rem; min-height: 3rem; padding: .7rem 1.25rem; border: 1px solid #fff; border-radius: 999px; background: #fff; color: #164c42; text-decoration: none; font-size: .88rem; font-weight: 800; transition: transform .18s ease, background .18s ease; }
.forum-new-post:not(.forum-queue-shortcut) i { display: grid; place-items: center; width: 1.45rem; height: 1.45rem; border-radius: 50%; background: #f7e8c5; color: #745018; font-size: .7rem; }
.forum-new-post:hover, .forum-new-post:focus-visible { transform: translateY(-2px); background: #eaf7ef; }
.forum-queue-shortcut { border-color: rgba(255, 255, 255, .45); background: transparent; color: #fff; }
.forum-queue-shortcut:hover, .forum-queue-shortcut:focus-visible { background: rgba(255, 255, 255, .12); color: #fff; }
.forum-hero-back { justify-self: start; display: inline-flex; align-items: center; gap: .45rem; color: #d9efe5; font-size: .84rem; font-weight: 700; text-decoration: none; }
.forum-hero-back:hover, .forum-hero-back:focus-visible { color: #fff; text-decoration: underline; }
.forum-shell .forum-filters { flex-wrap: nowrap; width: 100%; max-width: 100%; margin: 0; padding: .2rem 0 .45rem; overflow-x: auto; scrollbar-width: thin; }
.forum-shell .forum-filters a { flex: 0 0 auto; padding: .6rem 1rem; background: #fff; border-color: #dce6e2; color: #315850; font-size: .81rem; }
.forum-shell .forum-filters a[aria-current="page"] { background: var(--forum-deep); border-color: var(--forum-deep); color: #fff; }
.forum-shell .forum-filters a.forum-filter-subject:not([aria-current]) { border-color: #c7deeb; background: #edf6fa; color: #245f82; }
.forum-shell .forum-filters a.forum-filter-course:not([aria-current]) { border-color: #ebdabd; background: #fdf7ec; color: #805b23; }
.forum-shell .forum-filters a.forum-filter-subject[aria-current] { border-color: #245f82; background: #245f82; }
.forum-shell .forum-filters a.forum-filter-course[aria-current] { border-color: #805b23; background: #805b23; }
.forum-view-tabs { display: flex; gap: .35rem; min-width: 0; overflow-x: auto; padding: .15rem 0 .45rem; border-bottom: 1px solid var(--forum-line); scrollbar-width: thin; }
.forum-view-tabs a { flex: 0 0 auto; padding: .55rem .9rem; border-radius: 10px; color: #40685d; font-size: .85rem; font-weight: 700; text-decoration: none; }
.forum-view-tabs a:hover, .forum-view-tabs a:focus-visible { background: #edf5f0; }
.forum-view-tabs a[aria-current="page"] { background: #e5f2eb; color: #145b48; }
.forum-feed-section, .forum-replies-section { display: grid; gap: 1rem; min-width: 0; }
.forum-shell .forum-feed-heading { display: flex; align-items: end; justify-content: space-between; gap: .75rem; min-width: 0; }
.forum-shell .forum-feed-heading h3 { margin: .15rem 0 0; color: #193c38; font-family: Georgia, serif; font-size: clamp(1.3rem, 2.3vw, 1.65rem); }
.forum-feed-count { flex: 0 0 auto; color: #687b75; font-size: .82rem; }
.forum-feed-tools { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: .35rem .85rem; }
.forum-sort { display: flex; flex-wrap: wrap; gap: .3rem; }
.forum-sort a { padding: .35rem .55rem; border-radius: 8px; color: #55756b; font-size: .78rem; text-decoration: none; }
.forum-sort a:hover, .forum-sort a:focus-visible { background: #edf5f0; }
.forum-sort a[aria-current="page"] { background: #e5f2eb; color: #145b48; font-weight: 800; }
.forum-shell .forum-question-list { gap: .8rem; }
.forum-feed-shell .forum-question-card { grid-template-columns: 2.6rem minmax(0, 1fr); align-items: start; gap: .8rem; padding: 1.2rem; border: 1px solid var(--forum-line); border-left: 3px solid var(--forum-accent-line); border-radius: 18px; background: #fff; box-shadow: 0 6px 22px rgba(17, 58, 50, .035); }
.forum-feed-shell .forum-question-card:hover, .forum-feed-shell .forum-question-card:focus-visible { border-color: var(--forum-accent-line); border-left-color: var(--forum-accent); box-shadow: 0 13px 28px rgba(17, 58, 50, .09); }
.forum-operations-shell .forum-question-card { border-color: var(--forum-line); border-radius: 18px; background: #fff; box-shadow: 0 6px 22px rgba(17, 58, 50, .035); }
.forum-operations-shell .forum-question-card:hover, .forum-operations-shell .forum-question-card:focus-visible { border-color: #90b7aa; box-shadow: 0 13px 28px rgba(17, 58, 50, .09); }
.forum-avatar { display: grid; flex: 0 0 2.6rem; place-items: center; width: 2.6rem; height: 2.6rem; border-radius: 50%; background: var(--forum-accent-soft); color: var(--forum-accent); font-size: 1rem; font-weight: 800; }
.forum-avatar.is-staff { background: #d6ebe4; color: #0d5b4b; }
.forum-question-content { display: grid; gap: .6rem; min-width: 0; }
.forum-question-byline { display: flex; align-items: baseline; flex-wrap: wrap; gap: .15rem .5rem; color: #6a7772; font-size: .77rem; }
.forum-question-byline strong { color: #1c403b; font-size: .84rem; }
.forum-question-byline time::before { content: '\00b7'; margin-right: .5rem; }
.forum-question-title { color: #1a3431; font-size: 1.08rem; line-height: 1.38; overflow-wrap: anywhere; }
.forum-question-preview { color: #536b64; font-size: .86rem; line-height: 1.5; overflow-wrap: anywhere; }
.forum-card-tags { display: flex; flex-wrap: wrap; align-items: center; gap: .45rem; min-width: 0; }
.forum-subject-tag { display: inline-flex; max-width: 100%; padding: .3rem .65rem; border-radius: 999px; background: var(--forum-accent-soft); color: var(--forum-accent); font-size: .74rem; font-weight: 800; overflow-wrap: anywhere; }
.forum-shell .forum-status { gap: .3rem; max-width: 100%; overflow-wrap: anywhere; }
.forum-shell .forum-status.is-answered { background: #e3f4e9; color: #176c4c; }
.forum-shell .forum-status.is-staff-topic { background: #e3efea; color: #174f45; }
.forum-feed-shell .forum-question-meta { display: flex; flex-wrap: wrap; gap: .4rem 1rem; padding-top: .45rem; border-top: 1px solid #edf1ef; color: #657873; font-size: .77rem; }
.forum-card-arrow { margin-left: auto; color: #267461; }
.forum-home-spaces { scroll-margin-top: 5rem; }
.forum-space-hint { margin: -.3rem 0 0; color: #45665d; font-size: .88rem; }
.forum-home-spaces.is-asking .forum-space-card { border-color: #9fc8b4; }
.forum-home-spaces.is-asking .forum-space-copy > span { color: #176b50; font-weight: 800; }
.forum-space-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 245px), 1fr)); gap: .8rem; }
.forum-space-card { display: flex; align-items: flex-start; gap: .85rem; min-width: 0; padding: 1.1rem; border: 1px solid var(--forum-line); border-left: 3px solid var(--forum-accent); border-radius: 17px; background: linear-gradient(115deg, var(--forum-accent-wash), #fff 65%); color: var(--forum-ink); text-decoration: none; box-shadow: 0 6px 22px rgba(17, 58, 50, .035); transition: border-color .18s ease, transform .18s ease, box-shadow .18s ease; }
.forum-space-card:hover, .forum-space-card:focus-visible { border-color: var(--forum-accent-line); border-left-color: var(--forum-accent); box-shadow: 0 13px 28px rgba(17, 58, 50, .09); transform: translateY(-2px); }
.forum-space-card.is-general { border-color: #aacdc0; border-left-color: var(--forum-accent); background: linear-gradient(115deg, var(--forum-accent-wash), #fff 65%); }
.forum-general-guidance { margin: 0; padding: .8rem 1rem; border: 1px solid #c4dfd0; border-radius: 12px; background: #f3faf5; color: #31594b; font-size: .85rem; line-height: 1.55; }
.forum-general-guidance a { color: #145e48; font-weight: 800; text-underline-offset: 2px; }
.forum-space-icon { display: grid; flex: 0 0 2.5rem; place-items: center; width: 2.5rem; height: 2.5rem; border-radius: 12px; background: var(--forum-accent-soft); color: var(--forum-accent); }
.forum-space-copy { display: grid; gap: .3rem; min-width: 0; }
.forum-space-copy small { color: var(--forum-accent); font-size: .7rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.forum-space-copy strong { overflow-wrap: anywhere; line-height: 1.35; }
.forum-space-copy > span { color: #6c7d76; font-size: .79rem; }
.forum-space-card > .fa-arrow-right { margin: .65rem 0 0 auto; color: var(--forum-accent); }
.forum-feed-shell #forum-ask-title { scroll-margin-top: 5rem; }
.forum-shell .forum-panel { border-color: var(--forum-line); border-radius: 18px; box-shadow: 0 7px 24px rgba(17, 58, 50, .04); }
.forum-shell .forum-moderation-item { border-color: var(--forum-line); border-radius: 17px; background: #fff; }
.forum-moderation-title { display: block; margin-top: .6rem; color: #193c37; font-size: .95rem; overflow-wrap: anywhere; }
.forum-shell .forum-audit-item { border-color: var(--forum-line); background: #fff; }
.forum-shell .forum-compose { gap: clamp(1rem, 3vw, 2rem); background: #fff; }
.forum-feed-shell .forum-question-compose { grid-template-columns: minmax(0, 1fr); gap: .85rem; }
.forum-feed-shell .forum-question-compose > div { display: grid; gap: .25rem; }
.forum-feed-shell .forum-question-compose > div p { font-size: .86rem; }
.forum-thread-shell .forum-reply-compose { grid-template-columns: minmax(0, 1fr); gap: .85rem; }
.forum-thread-shell .forum-reply-compose > div { display: grid; gap: .25rem; }
.forum-thread-shell .forum-reply-compose > div p { font-size: .86rem; }
.forum-shell .forum-compose-form input[type="text"] { width: 100%; min-height: 2.8rem; padding: .7rem 1rem; border: 1px solid #b9d0ce; border-radius: 13px; background: #fcfefd; color: #183d46; font: inherit; }
.forum-shell .forum-compose-form input[type="text"]:focus { outline: 3px solid #a9d8d2; border-color: #14716b; }
.forum-feed-shell .forum-question-compose .forum-compose-form { gap: .5rem; }
.forum-feed-shell .forum-question-compose .forum-compose-form label:not(:first-of-type) { margin-top: .2rem; }
.forum-shell .forum-compose-form textarea { min-height: 9rem; resize: vertical; background: #fcfefd; }
.forum-shell .forum-compose-form label { color: var(--forum-ink); }
.forum-shell .forum-compose-actions .button-primary { min-height: 2.8rem; }
.forum-thread-shell { max-width: 820px; }
.forum-thread-question { display: grid; gap: 1rem; border-left: 3px solid #1e6f5c !important; }
.forum-thread-author { display: flex; align-items: center; gap: .7rem; min-width: 0; }
.forum-thread-author-copy { display: grid; gap: .15rem; min-width: 0; }
.forum-thread-author-copy strong { color: #193c37; overflow-wrap: anywhere; }
.forum-thread-author-copy small { color: #6b7d76; font-weight: 500; }
.forum-thread-author-copy time { color: #6d7d76; font-size: .76rem; }
.forum-thread-author > .forum-status { margin-left: auto; }
.forum-thread-question .forum-thread-body { margin: .3rem 0; font-size: 1.13rem; line-height: 1.65; }
.forum-thread-title { margin: 0; color: var(--forum-ink); font-family: Georgia, serif; font-size: clamp(1.35rem, 2.4vw, 1.8rem); line-height: 1.25; overflow-wrap: anywhere; }
.forum-thread-question .forum-card-tags { margin-top: -.3rem; }
.forum-thread-actions { margin-top: .4rem; }
.forum-thread-actions .button { border-radius: 999px; }
.forum-jump-answer { display: inline-flex; align-items: center; gap: .45rem; width: fit-content; color: #176c57; font-weight: 700; text-decoration: none; }
.forum-jump-answer:hover, .forum-jump-answer:focus-visible { text-decoration: underline; }
.forum-replies-section .forum-reply { display: grid; gap: .75rem; padding: 1.15rem 1.25rem; border: 1px solid var(--forum-line); border-radius: 17px; background: #fff; box-shadow: 0 5px 19px rgba(17, 58, 50, .035); }
.forum-replies-section .forum-reply.is-verified-answer { border-color: #a7cfc2; border-left: 3px solid #267a60; background: #f8fcf9; scroll-margin-top: 6rem; }
.forum-verified-label { margin-left: 3.3rem; color: #1c715b; font-size: .76rem; font-weight: 700; letter-spacing: .02em; }
.forum-replies-section .forum-reply:first-of-type { margin-top: 0; }
.forum-replies-section .forum-reply .forum-thread-body { margin: 0 0 0 3.3rem; }
.forum-replies-section .forum-contribution-label { margin: 0 0 0 3.3rem; }
.forum-report-panel summary { padding: .15rem 0; }
.forum-thread-shell { max-width: 1140px; }
.forum-thread-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(220px, 270px); align-items: start; gap: clamp(.9rem, 2vw, 1.35rem); min-width: 0; }
.forum-thread-main { display: grid; gap: 1rem; min-width: 0; }
.forum-thread-aside { display: grid; gap: .8rem; min-width: 0; }
.forum-thread-shell .forum-thread-question { gap: .85rem; padding: clamp(1rem, 2vw, 1.4rem); border-top: 3px solid var(--forum-accent); border-left: 1px solid var(--forum-line) !important; background: radial-gradient(circle at 100% 0, var(--forum-accent-wash), transparent 34%), #fff; }
.forum-thread-shell .forum-thread-title { font-size: clamp(1.3rem, 2.2vw, 1.65rem); }
.forum-thread-shell .forum-thread-question .forum-thread-body { margin: 0; font-size: .97rem; line-height: 1.6; }
.forum-thread-summary { display: flex; align-items: center; flex-wrap: wrap; gap: .5rem .8rem; }
.forum-thread-summary .forum-jump-answer { font-size: .8rem; }
.forum-thread-footer { display: flex; align-items: center; justify-content: space-between; gap: .7rem; padding-top: .75rem; border-top: 1px solid var(--forum-line); }
.forum-thread-reply-count { color: #597369; font-size: .82rem; font-weight: 700; }
.forum-thread-reply-count i { margin-right: .25rem; }
.forum-thread-reply-link { display: inline-flex; align-items: center; gap: .4rem; min-height: 2.35rem; padding: .4rem .8rem; border: 1px solid #c9ddd4; border-radius: 9px; background: #f6faf8; color: #175c4b; font-size: .82rem; font-weight: 800; text-decoration: none; }
.forum-thread-reply-link:hover, .forum-thread-reply-link:focus-visible { border-color: #7fb29e; background: #e8f4ed; }
.forum-thread-shell .forum-thread-actions { margin-top: -.15rem; padding-top: .7rem; border-top: 1px solid var(--forum-line); }
.forum-thread-shell .forum-thread-actions .button { min-height: 2.25rem; padding: .35rem .75rem; font-size: .78rem; }
.forum-replies-count { display: inline-grid; place-items: center; min-width: 1.55rem; height: 1.55rem; padding: 0 .3rem; border-radius: 999px; background: #e4f1e9; color: #1c654e; font-family: inherit; font-size: .75rem; vertical-align: middle; }
.forum-replies-section { display: grid; gap: .7rem; min-width: 0; }
.forum-thread-shell .forum-replies-section .forum-reply { gap: .6rem; padding: 1rem 1.1rem; border-radius: 14px; box-shadow: 0 3px 12px rgba(17, 58, 50, .025); }
.forum-thread-shell .forum-replies-section .forum-reply:not(.is-verified-answer) { border-left: 3px solid var(--forum-accent-line); }
.forum-thread-shell .forum-replies-section .forum-reply.is-verified-answer { overflow: hidden; padding-top: 0; border: 1px solid #9ccdb0; background: #f7fcf8; }
.forum-answer-ribbon { margin: 0 -1.1rem .35rem; padding: .45rem .85rem; background: #dbf2e3; color: #155d3e; font-size: .76rem; font-weight: 800; }
.forum-answer-ribbon i { margin-right: .3rem; }
.forum-reply-role { margin-left: auto; padding: .27rem .55rem; border-radius: 999px; background: #f0f5f2; color: #47675b; font-size: .7rem; font-weight: 800; white-space: nowrap; }
.forum-thread-shell .forum-replies-section .forum-reply .forum-thread-body { margin: 0; font-size: .93rem; line-height: 1.58; }
.forum-reply-note { color: #5f756a; font-size: .76rem; }
.forum-thread-shell .forum-reply-compose { padding: 1rem 1.2rem; gap: .65rem; background: linear-gradient(135deg, var(--forum-accent-wash), #fff 58%); scroll-margin-top: 5rem; }
.forum-thread-shell .forum-reply-compose > div p { margin: 0; color: #64786e; line-height: 1.45; }
.forum-thread-shell .forum-reply-compose .forum-compose-form textarea { min-height: 7rem; }
.forum-thread-shell .forum-reply-compose .forum-compose-actions { align-items: center; }
.forum-thread-info { padding: 1rem !important; }
.forum-thread-info h3 { margin: 0 0 .75rem; color: var(--forum-ink); font-family: Georgia, serif; font-size: 1rem; }
.forum-thread-info dl { margin: 0; }
.forum-thread-info dl > div { display: flex; align-items: flex-start; justify-content: space-between; gap: .7rem; padding: .55rem 0; border-top: 1px solid var(--forum-line); font-size: .78rem; }
.forum-thread-info dt { display: inline-flex; align-items: center; gap: .4rem; color: #61766a; }
.forum-thread-info dd { margin: 0; color: #24483c; font-weight: 700; text-align: right; overflow-wrap: anywhere; }
.forum-thread-info dd a { color: #17634c; text-decoration: none; }
.forum-thread-info dd a:hover, .forum-thread-info dd a:focus-visible { text-decoration: underline; }
.forum-related-section { display: grid; gap: .7rem; min-width: 0; }
.forum-thread-aside .forum-related-section { padding: 1rem; }
.forum-thread-aside .forum-related-section h3 { margin: 0; color: var(--forum-ink); font-family: Georgia, serif; font-size: 1rem; }
.forum-thread-aside .forum-related-grid { grid-template-columns: minmax(0, 1fr); gap: .55rem; }
.forum-thread-aside .forum-related-card { gap: .4rem; padding: .75rem; border-top-width: 1px; border-left: 3px solid var(--forum-accent-line); box-shadow: none; }
.forum-thread-aside .forum-related-card:hover, .forum-thread-aside .forum-related-card:focus-visible { border-left-color: var(--forum-accent); }
.forum-thread-aside .forum-related-card strong { font-size: .8rem; }
.forum-thread-aside .forum-related-preview { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
.forum-related-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr)); gap: .7rem; min-width: 0; }
.forum-related-card { display: grid; align-content: start; gap: .55rem; min-width: 0; padding: 1rem; border: 1px solid var(--forum-line); border-top: 3px solid var(--forum-accent-line); border-radius: 14px; background: #fff; color: var(--forum-ink); text-decoration: none; box-shadow: 0 4px 16px rgba(17, 58, 50, .035); transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease; }
.forum-related-card:hover, .forum-related-card:focus-visible { border-color: var(--forum-accent-line); border-top-color: var(--forum-accent); box-shadow: 0 9px 23px rgba(17, 58, 50, .09); transform: translateY(-2px); }
.forum-related-card:focus-visible { outline: 3px solid var(--forum-accent-line); outline-offset: 2px; }
.forum-related-reason { width: fit-content; padding: .25rem .55rem; border-radius: 999px; background: var(--forum-accent-soft); color: var(--forum-accent); font-size: .7rem; font-weight: 800; }
.forum-related-card strong { font-size: .9rem; line-height: 1.35; overflow-wrap: anywhere; }
.forum-related-preview { color: #5c7169; font-size: .79rem; line-height: 1.45; overflow-wrap: anywhere; }
.forum-related-meta { display: flex; align-items: center; gap: .35rem; margin-top: auto; padding-top: .55rem; border-top: 1px solid var(--forum-line); color: #5a756a; font-size: .74rem; font-weight: 700; }
.forum-related-meta .fa-arrow-right { margin-left: auto; color: var(--forum-accent); }
@media (max-width: 820px) { .forum-thread-grid { grid-template-columns: minmax(0, 1fr); } .forum-thread-aside { position: static; } }
@media (max-width: 560px) { .forum-thread-shell .forum-thread-question, .forum-thread-shell .forum-replies-section .forum-reply { padding: .95rem; } .forum-thread-shell .forum-replies-section .forum-reply.is-verified-answer { padding-top: 0; } .forum-answer-ribbon { margin-inline: -.95rem; } .forum-thread-shell .forum-reply-compose { padding: .95rem; } .forum-thread-footer { align-items: center; } .forum-thread-shell .forum-replies-section .forum-reply .forum-thread-body { margin: 0; } }
.forum-scope-header { display: grid; gap: .8rem; min-width: 0; padding: clamp(1rem, 2.2vw, 1.45rem); border: 1px solid rgba(31, 76, 55, .28); border-radius: 19px; background: radial-gradient(circle at 95% 0, rgba(197, 219, 184, .28), transparent 38%), linear-gradient(120deg, #28513f, #52765b); box-shadow: 0 14px 32px rgba(25, 66, 47, .16); color: #fff; }
.forum-breadcrumbs { display: flex; align-items: center; flex-wrap: wrap; gap: .4rem .6rem; min-width: 0; color: #64786f; font-size: .8rem; font-weight: 700; }
.forum-breadcrumbs a { color: #176a58; text-decoration: none; }
.forum-breadcrumbs a:hover, .forum-breadcrumbs a:focus-visible { text-decoration: underline; }
.forum-breadcrumbs i { color: #9bb2a7; font-size: .62rem; }
.forum-breadcrumbs span { min-width: 0; overflow-wrap: anywhere; }
.forum-lesson-back { justify-self: start; width: fit-content; min-height: 2.4rem; padding: .45rem .8rem; font-size: .8rem; }
.forum-thread-shell > .forum-lesson-back { margin: .2rem 0 .85rem; }
.forum-scope-header .forum-lesson-back { border-color: rgba(255, 255, 255, .55); background: rgba(255, 255, 255, .12); color: #fff; }
.forum-scope-header .forum-lesson-back:hover, .forum-scope-header .forum-lesson-back:focus-visible { background: rgba(255, 255, 255, .22); color: #fff; }
.forum-scope-heading { display: flex; align-items: center; gap: .8rem; min-width: 0; }
.forum-space-follow { margin-left: auto; flex: 0 0 auto; }
.forum-space-follow button { display: inline-flex; align-items: center; justify-content: center; gap: .45rem; min-height: 2.6rem; padding: .55rem .85rem; border: 1px solid rgba(255, 255, 255, .6); border-radius: 999px; background: rgba(255, 255, 255, .12); color: #fff; font: inherit; font-size: .8rem; font-weight: 750; cursor: pointer; }
.forum-space-follow button:hover, .forum-space-follow button:focus-visible, .forum-space-follow button[aria-pressed="true"] { background: #fff; color: #24533d; }
.forum-space-follow button:disabled { opacity: .65; cursor: wait; }
@media (max-width: 520px) { .forum-scope-heading { flex-wrap: wrap; } .forum-space-follow { margin-left: 0; } }
.forum-scope-heading > div { min-width: 0; }
.forum-scope-icon { display: grid; flex: 0 0 2.8rem; place-items: center; width: 2.8rem; height: 2.8rem; border-radius: 12px; background: var(--forum-accent-soft); color: var(--forum-accent); }
.forum-scope-heading h2 { margin: .15rem 0 0; color: var(--forum-ink); font-family: Georgia, serif; font-size: clamp(1.45rem, 2.8vw, 2rem); line-height: 1.15; overflow-wrap: anywhere; }
.forum-scope-controls { margin: .1rem 0 0; }
.forum-scope-controls .forum-search { border-color: #cbded7; background: #f8fbf9; color: #2d6a58; }
.forum-scope-controls .forum-search input { color: var(--forum-ink); }
.forum-scope-controls .forum-search input::placeholder { color: #687f75; }
.forum-scope-controls .forum-search:focus-within { outline-color: #a6d1c4; }
.forum-scope-controls .forum-search button { background: #e2f1e8; color: #155641; }
.forum-scope-controls .forum-new-post { border-color: #1c6d59; background: #1c6d59; color: #fff; cursor: pointer; font: inherit; font-size: .88rem; font-weight: 800; }
.forum-scope-controls .forum-new-post:hover, .forum-scope-controls .forum-new-post:focus-visible { background: #125444; color: #fff; }
.forum-scope-header .forum-breadcrumbs, .forum-scope-header .forum-breadcrumbs a { color: #eef7ed; }
.forum-scope-header .forum-breadcrumbs i { color: #c7ddca; }
.forum-scope-header .forum-panel-kicker { color: #d4ebd4; }
.forum-scope-header .forum-scope-heading h2 { color: #fff; }
.forum-scope-header .forum-scope-icon { background: rgba(255, 255, 255, .17); color: #fff; }
.forum-scope-header .forum-general-guidance { border-color: rgba(255, 255, 255, .3); background: rgba(255, 255, 255, .93); color: #28503e; }
.forum-scope-header .forum-general-guidance a { color: #145840; }
.forum-scope-header .forum-search { border-color: rgba(255, 255, 255, .5); background: rgba(255, 255, 255, .96); color: #315b47; }
.forum-scope-header .forum-search input { color: #183b2e; }
.forum-scope-header .forum-search input::placeholder { color: #61796b; }
.forum-scope-header .forum-search button { background: #e4efe3; color: #24533d; }
.forum-scope-header .forum-new-post { border-color: #fff; background: #fff; color: #24533d; }
.forum-scope-header .forum-new-post:hover, .forum-scope-header .forum-new-post:focus-visible { border-color: #e4efe3; background: #e4efe3; color: #17412f; }
.forum-scope-header .forum-new-post:not(.forum-queue-shortcut) i { background: #e4efe3; color: #24533d; }
.forum-toolbar { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: .5rem 1rem; min-width: 0; padding: .65rem .75rem; border: 1px solid var(--forum-line); border-radius: 15px; background: #fff; }
.forum-toolbar-groups { display: flex; align-items: center; flex-wrap: wrap; gap: .3rem .7rem; min-width: 0; }
.forum-toolbar .forum-filters, .forum-toolbar .forum-view-tabs { flex: 0 1 auto; width: auto; max-width: 100%; margin: 0; padding: .12rem 0; border-bottom: 0; }
.forum-toolbar .forum-filters a { padding: .48rem .76rem; }
.forum-toolbar .forum-view-tabs { padding-left: .65rem; border-left: 1px solid var(--forum-line); }
.forum-toolbar .forum-view-tabs a { padding: .47rem .65rem; }
.forum-sort-menu { position: relative; justify-self: end; min-width: 0; }
.forum-sort-menu > summary { display: flex; align-items: center; justify-content: space-between; gap: .55rem; min-height: 2.5rem; padding: .5rem .75rem; border: 1px solid var(--forum-line); border-radius: 10px; color: #315b50; background: #f8fbf9; cursor: pointer; font-size: .8rem; font-weight: 800; list-style: none; white-space: nowrap; }
.forum-sort-menu > summary::-webkit-details-marker, .forum-question-disclosure > summary::-webkit-details-marker { display: none; }
.forum-sort-menu > summary:focus-visible, .forum-question-disclosure > summary:focus-visible { outline: 3px solid #a9d8d2; outline-offset: 2px; }
.forum-sort-menu[open] > summary i, .forum-question-disclosure[open] > summary > i { transform: rotate(180deg); }
.forum-sort-menu nav { position: absolute; z-index: 8; top: calc(100% + .3rem); right: 0; display: grid; gap: .2rem; min-width: 11rem; padding: .35rem; border: 1px solid var(--forum-line); border-radius: 11px; background: #fff; box-shadow: 0 13px 28px rgba(17, 58, 50, .12); }
.forum-sort-menu nav a { padding: .55rem .65rem; border-radius: 7px; color: #315b50; font-size: .82rem; text-decoration: none; white-space: nowrap; }
.forum-sort-menu nav a:hover, .forum-sort-menu nav a:focus-visible, .forum-sort-menu nav a[aria-current="page"] { background: #e5f2eb; color: #145b48; }
.forum-question-disclosure { scroll-margin-top: 5rem; }
.forum-question-disclosure > summary { display: flex; align-items: center; justify-content: space-between; gap: .75rem; min-height: 2.9rem; color: #185646; cursor: pointer; font-weight: 800; list-style: none; }
.forum-question-disclosure > summary > span { min-width: 0; overflow-wrap: anywhere; }
.forum-question-disclosure > summary > span i { margin-right: .5rem; }
.forum-question-disclosure > .forum-compose { padding-top: 1rem; border-top: 1px solid var(--forum-line); }
.forum-compose-form .forum-form-field { display: grid; gap: .35rem; min-width: 0; }
.forum-compose-form .forum-form-field .field-errors { padding: .3rem 0 0; border: 0; border-radius: 0; background: transparent; color: #8d2f2f; font-size: .82rem; font-weight: 700; }
.forum-compose-form .form-errors { margin: 0 0 .35rem; }
.forum-post-feedback { display: flex; align-items: flex-start; gap: .7rem; padding: .85rem 1rem; border: 1px solid #b7d9c9; border-radius: 13px; background: #eff8f2; color: #1b5b46; }
.forum-post-feedback > i { flex: none; margin-top: .2rem; font-size: 1.05rem; }
.forum-post-feedback > div { display: grid; gap: .15rem; min-width: 0; }
.forum-post-feedback strong { font-size: .91rem; }
.forum-post-feedback span { font-size: .84rem; line-height: 1.45; }
.forum-post-feedback.is-review { border-color: #d6d5c8; background: #f8f7f1; color: #655c37; }
.forum-feed-shell .forum-question-title { font-size: 1.12rem; }
.forum-feed-shell .forum-question-content { gap: .38rem; }
.forum-feed-shell .forum-question-preview { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; }
@media (max-width: 720px) { .forum-toolbar { grid-template-columns: minmax(0, 1fr); } .forum-sort-menu { justify-self: start; } .forum-toolbar .forum-view-tabs { padding-left: 0; border-left: 0; } }
@media (max-width: 720px) { .forum-hero-controls { flex-wrap: wrap; } .forum-hero-controls .forum-search { flex-basis: 100%; } .forum-new-post { width: 100%; } }
@media (max-width: 720px) { .forum-shell .forum-feed-heading { align-items: flex-start; flex-wrap: wrap; } .forum-feed-tools { justify-content: flex-start; } }
@media (max-width: 560px) { .forum-community-hero { padding: 1.2rem; gap: .65rem; } .forum-community-hero h2 { font-size: 1.85rem; } .forum-feed-shell .forum-question-card { grid-template-columns: 2.25rem minmax(0, 1fr); padding: 1rem; gap: .7rem; } .forum-avatar { flex-basis: 2.25rem; width: 2.25rem; height: 2.25rem; } .forum-thread-author > .forum-status { margin-left: 0; } .forum-thread-author { flex-wrap: wrap; } .forum-replies-section .forum-reply .forum-thread-body, .forum-replies-section .forum-contribution-label, .forum-verified-label { margin-left: 0; } .forum-replies-section .forum-reply { padding: 1rem; } .forum-shell .forum-feed-heading { align-items: baseline; } }
@media (max-width: 900px) { .workspace-mobile-nav.has-six-items { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
@media (max-width: 360px) { .workspace-mobile-nav.has-six-items { left: max(.35rem, env(safe-area-inset-left, 0px)); right: max(.35rem, env(safe-area-inset-right, 0px)); gap: .1rem; padding-inline: .3rem; } .workspace-mobile-nav.has-six-items .student-mobile-nav-item { padding-inline: 0; font-size: .55rem; } }
@media (prefers-reduced-motion: reduce) { .forum-question-card, .forum-new-post, .forum-related-card { transition: none; } }

/* BECE reporting */
.assessment-report-hero {
    position: relative;
    overflow: hidden;
}

.assessment-report-hero::after {
    content: "";
    position: absolute;
    right: -4rem;
    bottom: -5rem;
    width: 15rem;
    aspect-ratio: 1;
    border: 1px solid rgba(24, 119, 116, 0.16);
    border-radius: 50%;
    box-shadow: 0 0 0 2.5rem rgba(24, 119, 116, 0.05), 0 0 0 5rem rgba(208, 172, 67, 0.05);
    pointer-events: none;
}

.assessment-report-hero > * {
    position: relative;
    z-index: 1;
}

.assessment-report-stats {
    grid-template-columns: repeat(auto-fit, minmax(10.5rem, 1fr));
}

.assessment-report-panel {
    min-width: 0;
}

.assessment-report-course-list,
.assessment-school-course-list,
.assessment-question-report-list,
.assessment-learner-report-list {
    display: grid;
    gap: 0.8rem;
}

.assessment-report-course {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) auto;
    gap: 1rem;
    padding: 1.1rem;
    border: 1px solid rgba(20, 33, 39, 0.1);
    border-left: 4px solid var(--teal);
    border-radius: 1.1rem;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(235, 247, 246, 0.62));
}

.assessment-report-course.tone-warning,
.assessment-report-course.tone-watch {
    border-left-color: var(--gold);
}

.assessment-report-course.tone-muted {
    border-left-color: rgba(20, 33, 39, 0.28);
}

.assessment-report-course-main {
    display: flex;
    align-items: flex-start;
    gap: 0.85rem;
    min-width: 0;
}

.assessment-report-course-main h4,
.assessment-school-course h4,
.assessment-admin-quality-grid h4 {
    margin: 0.35rem 0;
    font-size: 1.08rem;
}

.assessment-report-course-main p {
    margin: 0;
    color: var(--muted, var(--mid));
}

.assessment-report-icon {
    display: grid;
    flex: 0 0 2.65rem;
    width: 2.65rem;
    aspect-ratio: 1;
    place-items: center;
    border-radius: 0.9rem;
    color: var(--teal-dark, var(--teal));
    background: rgba(24, 119, 116, 0.12);
}

.assessment-report-score {
    display: grid;
    align-content: start;
    justify-items: end;
    gap: 0.2rem;
}

.assessment-report-score span,
.assessment-report-metrics small,
.assessment-school-course-head span,
.assessment-question-report-list small,
.assessment-question-report-list div:last-child span {
    color: var(--muted, var(--mid));
    font-size: 0.76rem;
}

.assessment-report-score strong {
    font-family: var(--font-display, Georgia, serif);
    font-size: clamp(1.8rem, 4vw, 2.7rem);
}

.assessment-report-metrics {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.55rem;
}

.assessment-report-metrics > span {
    display: grid;
    gap: 0.2rem;
    padding: 0.7rem;
    border-radius: 0.8rem;
    background: rgba(20, 33, 39, 0.045);
}

.assessment-topic-report-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));
    gap: 0.75rem;
}

.assessment-topic-report-grid article {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.5rem 0.8rem;
    padding: 0.9rem;
    border: 1px solid rgba(20, 33, 39, 0.09);
    border-radius: 0.9rem;
    background: #fff;
}

.assessment-topic-report-grid article > div:first-child {
    display: grid;
    gap: 0.2rem;
}

.assessment-topic-report-grid article > div:first-child span {
    color: var(--muted, var(--mid));
    font-size: 0.76rem;
}

.assessment-topic-report-grid .guardian-monitor-progress {
    grid-column: 1 / -1;
}

.assessment-school-course {
    padding: 1rem;
    border: 1px solid rgba(20, 33, 39, 0.1);
    border-radius: 1rem;
    background: linear-gradient(145deg, #fff, rgba(245, 241, 233, 0.62));
}

.assessment-school-course-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid rgba(20, 33, 39, 0.08);
}

.assessment-school-course-head > div:last-child {
    display: grid;
    justify-items: end;
}

.assessment-learner-report-list {
    margin-top: 0.75rem;
}

.assessment-learner-report-list > div {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(3.5rem, auto);
    align-items: center;
    gap: 0.75rem;
    padding: 0.72rem 0.2rem;
    border-bottom: 1px solid rgba(20, 33, 39, 0.07);
}

.assessment-learner-report-list > div:last-child {
    border-bottom: 0;
}

.assessment-learner-report-list > div > span:first-child {
    display: grid;
    gap: 0.15rem;
}

.assessment-learner-report-list small,
.assessment-report-empty-inline {
    color: var(--muted, var(--mid));
}

.assessment-report-layout {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.assessment-question-report-list article {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 1rem;
    padding: 0.9rem;
    border: 1px solid rgba(20, 33, 39, 0.09);
    border-radius: 0.9rem;
    background: #fff;
}

.assessment-question-report-list article > div {
    display: grid;
    gap: 0.3rem;
}

.assessment-question-report-list article > div:last-child {
    min-width: 4.5rem;
    justify-items: end;
}

.assessment-question-report-list article > div:last-child strong {
    font-family: var(--font-display, Georgia, serif);
    font-size: 1.65rem;
}

.assessment-admin-quality-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
    gap: 0.8rem;
}

.assessment-admin-quality-grid article {
    padding: 1rem;
    border: 1px solid rgba(20, 33, 39, 0.09);
    border-radius: 1rem;
    background: #fff;
}

.assessment-admin-quality-grid dl {
    display: grid;
    gap: 0.45rem;
    margin: 0.85rem 0 0;
}

.assessment-admin-quality-grid dl div {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
}

.assessment-admin-quality-grid dt {
    color: var(--muted, var(--mid));
}

.assessment-admin-quality-grid dd {
    margin: 0;
    font-weight: 800;
}

.theory-engagement-panel {
    background:
        radial-gradient(circle at 92% 10%, rgba(208, 172, 67, 0.13), transparent 28%),
        linear-gradient(145deg, #fff, rgba(232, 244, 244, 0.62));
}

.theory-report-note {
    display: flex;
    align-items: flex-start;
    gap: 0.7rem;
    margin-bottom: 1rem;
    padding: 0.85rem 0.95rem;
    border: 1px solid rgba(24, 119, 116, 0.14);
    border-radius: 0.9rem;
    color: var(--teal-dark, var(--teal));
    background: rgba(232, 244, 244, 0.72);
}

.theory-report-note i {
    margin-top: 0.18rem;
}

.theory-report-note p {
    margin: 0;
    color: inherit;
}

.theory-report-note-card {
    padding-block: 0.85rem;
}

.theory-report-note-card .theory-report-note {
    margin: 0;
}

.theory-engagement-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(10.5rem, 1fr));
    gap: 0.7rem;
}

.theory-engagement-stats article {
    display: grid;
    gap: 0.25rem;
    min-width: 0;
    padding: 0.9rem;
    border: 1px solid rgba(20, 33, 39, 0.09);
    border-radius: 0.9rem;
    background: rgba(255, 255, 255, 0.86);
}

.theory-engagement-stats span,
.theory-engagement-stats small,
.theory-course-engagement-list p,
.theory-course-engagement-list dt,
.theory-topic-signal-grid small,
.theory-paper-report-list small,
.theory-paper-report-list dt,
.theory-cohort-report-list small,
.theory-cohort-report-list span,
.theory-school-summary small,
.theory-school-summary span:not(.eyebrow-inline) {
    color: var(--muted, var(--mid));
}

.theory-engagement-stats strong {
    font-family: var(--font-display, Georgia, serif);
    font-size: clamp(1.55rem, 3vw, 2.15rem);
}

.theory-course-engagement-list,
.theory-paper-report-list,
.theory-cohort-report-list {
    display: grid;
    gap: 0.7rem;
    margin-top: 0.9rem;
}

.theory-course-engagement-list > article,
.theory-paper-report-list > article,
.theory-cohort-report-list > article {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.8rem;
    padding: 0.9rem;
    border: 1px solid rgba(20, 33, 39, 0.09);
    border-radius: 0.9rem;
    background: #fff;
}

.theory-course-engagement-list h4,
.theory-course-engagement-list p {
    margin: 0.3rem 0 0;
}

.theory-course-engagement-list dl,
.theory-paper-report-list dl {
    display: grid;
    grid-template-columns: repeat(2, auto);
    gap: 0.55rem;
    margin: 0;
}

.theory-course-engagement-list dl div,
.theory-paper-report-list dl div {
    display: grid;
    gap: 0.15rem;
    min-width: 7rem;
    padding: 0.55rem 0.65rem;
    border-radius: 0.7rem;
    background: rgba(20, 33, 39, 0.045);
}

.theory-course-engagement-list dd,
.theory-paper-report-list dd {
    margin: 0;
    font-weight: 800;
}

.theory-topic-signal-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
    gap: 0.7rem;
}

.theory-topic-signal-grid article {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.15rem 0.6rem;
    padding: 0.85rem;
    border: 1px solid rgba(208, 172, 67, 0.24);
    border-radius: 0.85rem;
    background: rgba(255, 250, 234, 0.7);
}

.theory-topic-signal-grid strong {
    grid-row: span 2;
    font-family: var(--font-display, Georgia, serif);
    font-size: 1.65rem;
}

.theory-school-summary {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.7rem;
    margin-top: 0.8rem;
    padding: 0.8rem;
    border-radius: 0.85rem;
    background: rgba(232, 244, 244, 0.64);
}

.theory-school-summary > div:not(.theory-topic-chips) {
    display: grid;
    gap: 0.2rem;
}

.theory-topic-chips {
    grid-column: 1 / -1;
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}

.theory-topic-chips span {
    padding: 0.35rem 0.55rem;
    border: 1px solid rgba(208, 172, 67, 0.24);
    border-radius: 999px;
    color: var(--ink) !important;
    background: rgba(255, 255, 255, 0.78);
    font-size: 0.76rem;
}

.theory-cohort-report-list > article {
    grid-template-columns: minmax(0, 1fr) repeat(2, minmax(7rem, auto));
}

.theory-cohort-report-list > article > div {
    display: grid;
    gap: 0.15rem;
}

.theory-cohort-report-list > article > div:not(:first-child) {
    justify-items: end;
}

@media (max-width: 760px) {
    .assessment-report-course,
    .assessment-report-layout,
    .assessment-question-report-list article {
        grid-template-columns: 1fr;
    }

    .assessment-report-score,
    .assessment-question-report-list article > div:last-child {
        justify-items: start;
    }

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

    .assessment-school-course-head {
        display: grid;
    }

    .assessment-school-course-head > div:last-child {
        justify-items: start;
    }

    .assessment-learner-report-list > div {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .assessment-learner-report-list > div > strong {
        grid-column: 1 / -1;
    }

    .theory-course-engagement-list > article,
    .theory-paper-report-list > article,
    .theory-cohort-report-list > article,
    .theory-school-summary {
        grid-template-columns: 1fr;
    }

    .theory-course-engagement-list dl,
    .theory-paper-report-list dl {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .theory-cohort-report-list > article > div:not(:first-child) {
        justify-items: start;
    }

    .theory-topic-chips {
        grid-column: auto;
    }
}

/* BECE assessment-course question bank */
.bece-inline-filter {
    display: flex;
    align-items: center;
    gap: .65rem;
}

.bece-inline-filter label {
    font-weight: 700;
}

.bece-inline-filter select {
    min-width: 11rem;
}

.paper-review-filter {
    flex-wrap: wrap;
    justify-content: flex-end;
}

.paper-review-filter select[name="paper_id"] {
    width: min(18rem, 100%);
    min-width: 0;
}

.question-bank-library-head {
    margin-bottom: .85rem;
}

.question-bank-filter-bar {
    display: grid;
    grid-template-columns: minmax(15rem, 1.8fr) repeat(4, minmax(9rem, 1fr)) auto;
    align-items: end;
    gap: .65rem;
    margin-bottom: 1rem;
    padding: .85rem;
    border: 1px solid rgba(14, 94, 91, .13);
    border-radius: 1rem;
    background: linear-gradient(135deg, rgba(235, 247, 244, .8), rgba(255, 250, 235, .72));
}

.question-bank-filter-bar label {
    display: grid;
    gap: .32rem;
    min-width: 0;
}

.question-bank-filter-bar label > span {
    color: #49615f;
    font: 800 .67rem/1.2 var(--font-mono, monospace);
    letter-spacing: .07em;
    text-transform: uppercase;
}

.question-bank-filter-bar input,
.question-bank-filter-bar select {
    width: 100%;
    min-height: 2.7rem;
    padding: .55rem .7rem;
    border: 1px solid rgba(16, 40, 50, .16);
    border-radius: .7rem;
    background: rgba(255, 255, 255, .94);
    color: var(--ink, #102832);
    font: inherit;
}

.question-bank-filter-bar input:focus,
.question-bank-filter-bar select:focus {
    border-color: var(--teal, #157a78);
    outline: 3px solid rgba(21, 122, 120, .14);
}

.question-bank-filter-actions {
    display: flex;
    gap: .45rem;
}

.question-bank-selection-hint {
    display: flex;
    align-items: center;
    gap: .75rem;
    margin-bottom: 1rem;
    padding: .75rem .9rem;
    border: 1px dashed rgba(21, 122, 120, .28);
    border-radius: .9rem;
    color: #174f4e;
    background: rgba(235, 247, 244, .66);
}

.question-bank-selection-hint > i {
    display: grid;
    flex: 0 0 2.4rem;
    width: 2.4rem;
    height: 2.4rem;
    place-items: center;
    border-radius: .7rem;
    color: #fff;
    background: var(--teal, #157a78);
}

.question-bank-selection-hint p,
.question-bank-selection-hint span {
    margin: 0;
}

.question-bank-selection-hint p {
    display: grid;
    gap: .12rem;
}

.question-bank-selection-hint span {
    color: var(--muted, #66706f);
    font-size: .87rem;
}

.bece-question-list {
    display: grid;
    gap: 1rem;
}

.bece-question-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(13rem, 18rem);
    gap: 1.25rem;
    padding: 1.25rem;
    border: 1px solid rgba(14, 94, 91, .16);
    border-left: 4px solid var(--primary, #157a78);
    border-radius: 1.25rem;
    background: linear-gradient(135deg, rgba(255, 255, 255, .98), rgba(244, 249, 247, .94));
    transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.bece-question-card.is-selected {
    border-color: rgba(21, 122, 120, .64);
    border-left-color: #dfa900;
    background: linear-gradient(135deg, #fffef8, #edf8f5);
    box-shadow: 0 .8rem 2rem rgba(15, 81, 78, .12);
    transform: translateY(-2px);
}

.bece-question-card.is-in-current-paper {
    border-color: rgba(34, 96, 132, .28);
    border-left-color: #4d7890;
    background: linear-gradient(135deg, rgba(245, 250, 252, .98), rgba(235, 244, 246, .94));
}

.question-oversight-card {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
}

#question-oversight {
    scroll-margin-top: 6rem;
}

.question-oversight-details {
    min-width: 0;
}

.question-oversight-details summary {
    display: grid;
    gap: .55rem;
    list-style: none;
    cursor: pointer;
}

.question-oversight-details summary::-webkit-details-marker {
    display: none;
}

.question-oversight-details summary:focus-visible {
    outline: 2px solid var(--primary, #157a78);
    outline-offset: .3rem;
    border-radius: .4rem;
}

.question-oversight-preview {
    max-width: 70ch;
    overflow-wrap: anywhere;
    font: 700 1rem/1.45 var(--font-display, Georgia, serif);
}

.question-oversight-expand {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    color: var(--primary, #157a78);
    font-size: .82rem;
    font-weight: 700;
}

.question-oversight-expand i {
    transition: transform .2s ease;
}

.question-oversight-details[open] .question-oversight-expand i {
    transform: rotate(180deg);
}

.question-oversight-body {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(14, 94, 91, .14);
    overflow-wrap: anywhere;
}

.question-oversight-parts {
    display: grid;
    gap: .7rem;
    padding-left: 1.5rem;
}

.question-oversight-parts li {
    padding: .7rem;
    border-radius: .75rem;
    background: rgba(255, 255, 255, .8);
}

.question-oversight-parts p {
    margin: .45rem 0 0;
}

.question-oversight-action {
    justify-self: end;
}

.bece-question-card-main,
.bece-question-card-actions {
    min-width: 0;
}

.bece-question-card h4 {
    margin: .7rem 0 .4rem;
    overflow-wrap: anywhere;
}

.question-bank-topic-list {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
    margin-top: .7rem;
}

.question-bank-topic-list span {
    padding: .32rem .5rem;
    border-radius: 999px;
    color: #175f5d;
    background: rgba(21, 122, 120, .1);
    font: 800 .67rem/1 var(--font-mono, monospace);
    letter-spacing: .03em;
}

.question-bank-answer-preview {
    margin-top: .85rem;
    overflow: clip;
    border: 1px solid rgba(16, 40, 50, .11);
    border-radius: .85rem;
    background: rgba(255, 255, 255, .72);
}

.question-bank-answer-preview > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    padding: .75rem .85rem;
    cursor: pointer;
    list-style: none;
    color: #185f5d;
    font-weight: 800;
}

.question-bank-answer-preview > summary::-webkit-details-marker {
    display: none;
}

.question-bank-answer-preview > summary span {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
}

.question-bank-answer-preview > summary > i {
    transition: transform .2s ease;
}

.question-bank-answer-preview[open] > summary > i {
    transform: rotate(180deg);
}

.question-bank-answer-preview > div {
    padding: 0 .85rem .85rem;
    border-top: 1px solid rgba(16, 40, 50, .08);
}

.question-bank-explanation {
    display: grid;
    gap: .2rem;
    margin: .8rem 0 0;
    padding: .75rem .85rem;
    border-radius: .7rem;
    background: rgba(229, 168, 0, .1);
    line-height: 1.55;
}

.question-bank-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .75rem;
    margin-top: 1.2rem;
}

.question-bank-page-links {
    display: flex;
    align-items: center;
    gap: .35rem;
}

.question-bank-page-links a,
.question-bank-page-links span {
    display: grid;
    place-items: center;
    min-width: 2.25rem;
    min-height: 2.25rem;
    padding: .35rem;
    border-radius: .65rem;
    color: #315957;
    font-weight: 800;
    text-decoration: none;
}

.question-bank-page-links a:hover,
.question-bank-page-links a:focus-visible,
.question-bank-page-links .is-current {
    color: #fff;
    background: var(--teal, #157a78);
}

.bece-question-card-meta,
.bece-question-card-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .55rem;
}

.bece-question-card-actions {
    align-content: flex-start;
    justify-content: flex-end;
}

.paper-order-controls {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.3rem;
    border: 1px solid rgba(14, 94, 91, 0.16);
    border-radius: 0.85rem;
    background: rgba(255, 255, 255, 0.8);
}

.paper-order-controls form {
    display: contents;
}

.paper-order-position {
    padding: 0 0.35rem;
    color: var(--muted, #66706f);
    font: 800 0.68rem/1 var(--font-mono, monospace);
    letter-spacing: 0.05em;
    white-space: nowrap;
}

.paper-order-button {
    min-width: 2.35rem;
    padding-inline: 0.65rem;
}

.paper-order-button:disabled {
    cursor: not-allowed;
    opacity: 0.38;
}

.question-paper-check {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    min-height: 2.35rem;
    padding: .45rem .7rem;
    border: 1px solid rgba(21, 122, 120, .26);
    border-radius: .72rem;
    cursor: pointer;
    color: #175f5d;
    background: #fff;
    font-size: .82rem;
}

.question-paper-check input {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
}

.question-paper-check > span {
    display: grid;
    width: 1.25rem;
    height: 1.25rem;
    place-items: center;
    border: 1px solid rgba(21, 122, 120, .35);
    border-radius: .35rem;
    color: transparent;
    background: #fff;
}

.question-paper-check input:focus-visible + span {
    outline: 3px solid rgba(21, 122, 120, .22);
    outline-offset: 2px;
}

.question-paper-check input:checked + span {
    border-color: var(--teal, #157a78);
    color: #fff;
    background: var(--teal, #157a78);
}

.question-paper-check.is-in-current-paper {
    cursor: not-allowed;
    border-color: rgba(34, 96, 132, .2);
    color: #49666f;
    background: #edf4f5;
}

.question-paper-check.is-in-current-paper > span {
    border-color: #4d7890;
    color: #fff;
    background: #4d7890;
}

.question-paper-membership-status {
    align-items: center;
    gap: .35rem;
}

.question-paper-membership-tools {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin: 1rem 0;
    padding: .85rem 1rem;
    border: 1px solid rgba(34, 96, 132, .16);
    border-radius: 1rem;
    background: rgba(238, 246, 247, .86);
}

.question-paper-membership-tools[hidden] {
    display: none;
}

.question-paper-membership-tools p,
.question-paper-membership-tools p > span {
    display: flex;
    align-items: center;
    gap: .55rem;
    margin: 0;
}

.question-paper-membership-tools p > span {
    align-items: flex-start;
    flex-direction: column;
    gap: .08rem;
}

.question-paper-membership-tools p > i {
    color: #28667a;
}

.question-paper-membership-tools small {
    color: var(--muted, #66706f);
}

.question-paper-membership-tools > div {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem;
}

.question-paper-membership-tools .is-active {
    border-color: var(--teal, #157a78);
    color: #fff;
    background: var(--teal, #157a78);
}

.question-paper-selection {
    position: sticky;
    z-index: 12;
    top: 1rem;
    display: grid;
    grid-template-columns: minmax(13rem, .8fr) minmax(22rem, 1.4fr) auto;
    align-items: center;
    gap: 1rem;
    margin: 1rem 0 1.25rem;
    padding: 1rem;
    border: 1px solid rgba(255, 255, 255, .2);
    border-radius: 1.2rem;
    color: #fff;
    background: linear-gradient(125deg, #103f48, #126c69);
    box-shadow: 0 1.1rem 3rem rgba(10, 45, 52, .28);
}

.question-paper-selection[hidden] {
    display: none;
}

.question-paper-selection-summary {
    display: flex;
    align-items: center;
    gap: .75rem;
    min-width: 0;
}

.question-paper-selection-icon {
    display: grid;
    flex: 0 0 2.65rem;
    width: 2.65rem;
    height: 2.65rem;
    place-items: center;
    border-radius: .8rem;
    color: #103f48;
    background: #e8bf42;
}

.question-paper-selection-summary > div {
    display: grid;
    min-width: 0;
    gap: .18rem;
}

.question-paper-selection-summary .eyebrow-inline {
    color: rgba(255, 255, 255, .65);
}

.question-paper-selection-summary strong,
.question-paper-selection-summary small {
    overflow-wrap: anywhere;
}

.question-paper-selection-summary small {
    color: rgba(255, 255, 255, .72);
    line-height: 1.4;
}

.question-paper-selection-fields,
.question-paper-new-fields {
    display: grid;
    gap: .55rem;
}

.question-paper-new-fields {
    grid-template-columns: minmax(12rem, 1fr) minmax(6rem, .36fr);
}

.question-paper-selection-fields label {
    display: grid;
    gap: .25rem;
}

.question-paper-selection-fields label > span {
    color: rgba(255, 255, 255, .7);
    font: 800 .62rem/1 var(--font-mono, monospace);
    letter-spacing: .08em;
    text-transform: uppercase;
}

.question-paper-selection-fields input,
.question-paper-selection-fields select {
    width: 100%;
    min-height: 2.5rem;
    padding: .48rem .65rem;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: .68rem;
    color: #102832;
    background: #fff;
    font: inherit;
}

.question-paper-capacity {
    min-height: 1.1rem;
    margin: 0;
    color: #cce5e1;
    font-size: .76rem;
}

.question-paper-capacity.is-over-capacity {
    color: #ffd690;
    font-weight: 800;
}

.question-paper-selection-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: .5rem;
}

.question-paper-selection .button-primary {
    color: #113c44;
    background: #e8bf42;
}

.question-paper-selection .button-secondary {
    border-color: rgba(255, 255, 255, .35);
    color: #fff;
    background: transparent;
}

.bece-paper-bank-action {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
    padding: .9rem 1rem;
    border: 1px solid rgba(21, 122, 120, .15);
    border-radius: 1rem;
    background: linear-gradient(135deg, rgba(235, 247, 244, .82), rgba(255, 250, 235, .7));
}

.bece-paper-bank-action p {
    margin: .2rem 0 0;
    color: var(--muted, #66706f);
}

.bece-option-preview {
    display: grid;
    gap: .45rem;
    margin: .9rem 0;
    padding-left: 1.7rem;
}

.bece-option-preview li {
    padding: .65rem .8rem;
    border-radius: .75rem;
    background: rgba(255, 255, 255, .8);
}

.bece-option-preview li.is-correct {
    background: rgba(25, 135, 84, .11);
    color: #115b3c;
}

.bece-option-preview li span {
    float: right;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.bece-question-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.bece-question-form-grid .form-field:has(textarea),
.bece-question-form-grid [data-form-field="prompt"],
.bece-question-form-grid [data-form-field="explanation"],
.bece-question-form-grid [data-form-field="rights_declaration"],
.bece-question-form-grid [data-form-field="supporting_table"],
.bece-question-form-grid [data-form-field="code_snippet"] {
    grid-column: 1 / -1;
}

.question-quick-builder {
    display: grid;
    gap: 1rem;
}

.question-builder-section {
    padding: clamp(1rem, 2vw, 1.4rem);
    border: 1px solid rgba(14, 94, 91, .14);
    border-radius: 1.2rem;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, .98), rgba(246, 250, 248, .95)),
        radial-gradient(circle at 100% 0, rgba(229, 168, 0, .08), transparent 34%);
}

.question-builder-section-head {
    display: flex;
    align-items: flex-start;
    gap: .8rem;
    margin-bottom: 1rem;
}

.question-builder-section-head > span:first-child {
    display: grid;
    flex: 0 0 2rem;
    place-items: center;
    min-height: 2rem;
    border-radius: .65rem;
    color: #fff;
    background: var(--teal, #157a78);
    font-family: var(--font-mono, monospace);
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .08em;
}

.question-builder-section-head h3,
.question-builder-section-head p {
    margin: 0;
}

.question-builder-section-head p,
.question-builder-section-head small {
    display: block;
    margin-top: .2rem;
    color: var(--muted, #686868);
}

.compact-grid {
    grid-template-columns: minmax(12rem, 1.2fr) minmax(16rem, 2fr) minmax(10rem, .8fr) minmax(7rem, .55fr);
}

.question-and-answer-grid [data-form-field="prompt"],
.question-and-answer-grid [data-form-field="explanation"],
.rights-question-grid [data-form-field="rights_declaration"],
.question-rights-confirmation {
    grid-column: 1 / -1;
}

.question-and-answer-grid [data-form-field="correct_choice"] {
    max-width: 18rem;
}

.question-builder-optional {
    padding: 0;
    overflow: clip;
}

.question-builder-optional > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.1rem 1.35rem;
    cursor: pointer;
    list-style: none;
}

.question-builder-optional > summary::-webkit-details-marker {
    display: none;
}

.question-builder-optional > summary .question-builder-section-head {
    align-items: center;
    margin: 0;
}

.question-builder-optional > summary i {
    transition: transform .2s ease;
}

.question-builder-optional[open] > summary i {
    transform: rotate(180deg);
}

.optional-question-grid {
    padding: 0 1.35rem 1.35rem;
}

.question-rights-confirmation label {
    display: flex;
    align-items: flex-start;
    gap: .8rem;
    padding: .9rem 1rem;
    border: 1px solid rgba(14, 94, 91, .18);
    border-radius: .9rem;
    background: rgba(227, 243, 240, .62);
    cursor: pointer;
}

.question-rights-confirmation input {
    width: 1.15rem;
    height: 1.15rem;
    margin-top: .15rem;
    accent-color: var(--teal, #157a78);
}

.question-rights-confirmation label span,
.question-rights-confirmation label small {
    display: block;
}

.question-rights-confirmation label small {
    margin-top: .2rem;
    color: var(--muted, #686868);
}

.compact-safeguard {
    margin-top: 1rem;
}

.question-builder-copy-notice,
.question-draft-status {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .85rem;
    margin-bottom: 1rem;
    padding: .85rem 1rem;
    border-radius: 1rem;
}

.question-builder-copy-notice {
    justify-content: flex-start;
    color: #704f00;
    background: rgba(229, 168, 0, .13);
}

.question-builder-copy-notice > i {
    font-size: 1.15rem;
}

.question-builder-copy-notice p,
.question-builder-copy-notice span {
    display: block;
    margin: 0;
}

.question-draft-status {
    margin: 0;
    color: #15594e;
    background: rgba(21, 122, 120, .09);
    font-size: .9rem;
}

.question-draft-status > span {
    display: flex;
    align-items: center;
    gap: .55rem;
}

.question-builder-actions {
    align-items: center;
    margin-top: 0;
    padding-top: .25rem;
}

.question-builder-shortcut {
    margin-left: auto;
    color: var(--muted, #686868);
}

.question-builder-shortcut kbd {
    padding: .12rem .35rem;
    border: 1px solid rgba(16, 40, 50, .2);
    border-bottom-width: 2px;
    border-radius: .3rem;
    background: #fff;
    font: inherit;
    font-size: .78rem;
}

.question-bulk-builder {
    display: grid;
    gap: 1rem;
}

.question-bulk-defaults,
.question-bulk-sheet-panel {
    overflow: clip;
}

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

.bulk-default-grid [data-form-field="rights_declaration"],
.bulk-default-grid .question-rights-confirmation {
    grid-column: 1 / -1;
}

.question-bulk-panel-head {
    align-items: flex-end;
}

.question-bulk-toolbar {
    display: flex;
    align-items: end;
    flex-wrap: wrap;
    gap: .65rem;
    margin: 1rem 0 .75rem;
}

.question-bulk-toolbar label {
    display: grid;
    gap: .3rem;
    min-width: 12rem;
    color: var(--muted, #686868);
    font-size: .78rem;
    font-weight: 800;
}

.question-bulk-toolbar input {
    min-height: 2.5rem;
    padding: .55rem .7rem;
    border: 1px solid rgba(16, 40, 50, .18);
    border-radius: .65rem;
    background: #fff;
    color: var(--ink, #102832);
    font: inherit;
}

.question-bulk-status {
    margin-bottom: .6rem;
    color: #15594e;
    font-size: .86rem;
    font-weight: 700;
}

.question-bulk-table-shell {
    position: relative;
    max-height: min(65vh, 46rem);
    overflow: auto;
    overscroll-behavior: contain;
    border: 1px solid rgba(16, 40, 50, .14);
    border-radius: 1rem;
    background: #fff;
    scrollbar-color: var(--teal, #157a78) rgba(16, 40, 50, .08);
    scrollbar-width: thin;
}

.question-bulk-table-shell:focus-visible {
    outline: 3px solid rgba(21, 122, 120, .25);
    outline-offset: 3px;
}

.question-bulk-table {
    width: 100%;
    min-width: 122rem;
    border-spacing: 0;
    table-layout: fixed;
}

.question-bulk-table th,
.question-bulk-table td {
    padding: .45rem;
    border-right: 1px solid rgba(16, 40, 50, .09);
    border-bottom: 1px solid rgba(16, 40, 50, .09);
    background: #fff;
    vertical-align: top;
}

.question-bulk-table thead th {
    position: sticky;
    z-index: 3;
    top: 0;
    padding: .7rem .55rem;
    color: #fff;
    background: #164f50;
    font: 800 .67rem/1.2 var(--font-mono, monospace);
    letter-spacing: .07em;
    text-align: left;
    text-transform: uppercase;
}

.question-bulk-table thead th:first-child {
    z-index: 5;
    left: 0;
}

.question-bulk-table tbody th {
    position: sticky;
    z-index: 2;
    left: 0;
    width: 4.25rem;
    background: #edf5f3;
    color: #15594e;
    text-align: center;
}

.question-bulk-table th:first-child { width: 4.25rem; }
.question-bulk-table th:nth-child(2) { width: 10rem; }
.question-bulk-table th:nth-child(3) { width: 22rem; }
.question-bulk-table th:nth-child(4) { width: 20rem; }
.question-bulk-table th:nth-child(5) { width: 12rem; }
.question-bulk-table th:nth-child(6) { width: 8rem; }
.question-bulk-table th:nth-child(7) { width: 6rem; }
.question-bulk-table th:nth-child(n+8):nth-child(-n+11) { width: 13rem; }
.question-bulk-table th:nth-child(12) { width: 7rem; }
.question-bulk-table th:nth-child(13) { width: 15rem; }

.question-bulk-table input,
.question-bulk-table select,
.question-bulk-table textarea {
    width: 100%;
    min-height: 2.65rem;
    padding: .55rem .6rem;
    resize: vertical;
    border: 1px solid rgba(16, 40, 50, .15);
    border-radius: .55rem;
    background: #fbfdfc;
    color: var(--ink, #102832);
    font: inherit;
    line-height: 1.35;
}

.question-bulk-table textarea {
    min-height: 4.2rem;
}

.question-bulk-table input:focus,
.question-bulk-table select:focus,
.question-bulk-table textarea:focus {
    position: relative;
    z-index: 1;
    border-color: var(--teal, #157a78);
    outline: 3px solid rgba(21, 122, 120, .15);
}

.question-bulk-table tr.has-errors > th,
.question-bulk-table tr.has-errors > td {
    background: #fff7f5;
}

.question-bulk-remove-row {
    display: grid;
    place-items: center;
    width: 1.75rem;
    height: 1.75rem;
    margin: .4rem auto 0;
    padding: 0;
    border: 0;
    border-radius: 50%;
    color: #8b392f;
    background: rgba(185, 75, 59, .12);
    cursor: pointer;
}

.question-bulk-remove-row:hover,
.question-bulk-remove-row:focus-visible {
    color: #fff;
    background: #a64034;
}

.question-bulk-row-result {
    color: #49615f;
    font-size: .76rem;
    line-height: 1.45;
}

.question-bulk-row-result ul {
    display: grid;
    gap: .3rem;
    margin: 0;
    padding-left: 1rem;
    color: #923a2f;
}

.question-bulk-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.15rem;
    border: 1px solid rgba(16, 40, 50, .12);
    border-radius: 1rem;
    background: linear-gradient(135deg, #edf7f4, #fff9e8);
}

.question-bulk-actions p {
    margin: 0;
    color: #365452;
}

.bece-import-form {
    display: flex;
    align-items: end;
    flex-wrap: wrap;
    gap: 1rem;
}

.bece-import-form .form-field {
    flex: 1 1 20rem;
}

.bece-csv-guide {
    margin-top: 1rem;
}

.bece-csv-guide code {
    overflow-wrap: anywhere;
}

.bece-preview-table-shell {
    max-height: 34rem;
    overflow: auto;
}

.bece-review-decision-form {
    display: grid;
    align-content: start;
    gap: .75rem;
}

.bece-foundation-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
    gap: .8rem;
}

.bece-foundation-grid article {
    display: grid;
    gap: .3rem;
    padding: 1rem;
    border-radius: 1rem;
    background: rgba(19, 115, 111, .08);
}

.bece-paper-add-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: 1rem;
    margin-bottom: 1rem;
}

.bece-paper-add-form .form-field {
    margin: 0;
}

.bece-paper-item {
    display: grid;
    grid-template-columns: 2.75rem minmax(0, 1fr) auto;
    align-items: center;
    gap: 1rem;
    padding: 1rem;
    border: 1px solid rgba(14, 94, 91, .14);
    border-radius: 1rem;
    background: rgba(255, 255, 255, .88);
}

.bece-paper-order {
    display: grid;
    place-items: center;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: .8rem;
    color: #fff;
    background: var(--teal);
    font-weight: 800;
}

.bece-paper-item p {
    margin: .25rem 0;
}

/* Assessment paper setup */
.paper-setup-hero-meta {
    display: flex;
    flex-wrap: wrap;
    gap: .55rem;
    margin-top: .85rem;
}

.paper-setup-hero-meta span {
    display: inline-flex;
    align-items: center;
    gap: .42rem;
    padding: .45rem .65rem;
    border: 1px solid rgba(21, 122, 120, .15);
    border-radius: 999px;
    color: #315957;
    background: rgba(255, 255, 255, .68);
    font-size: .78rem;
    font-weight: 800;
}

.paper-setup-hero-meta i {
    color: var(--teal, #157a78);
}

.paper-setup-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(18rem, 22rem);
    align-items: start;
    gap: 1.25rem;
}

.paper-setup-sections {
    display: grid;
    min-width: 0;
    gap: 1rem;
}

.paper-setup-section {
    margin: 0;
}

.paper-setup-section-head {
    display: grid;
    grid-template-columns: 2.6rem minmax(0, 1fr);
    gap: .8rem;
    margin-bottom: 1.2rem;
}

.paper-setup-section-head > span {
    display: grid;
    width: 2.6rem;
    height: 2.6rem;
    place-items: center;
    border-radius: .8rem;
    color: #fff;
    background: var(--teal, #157a78);
    font: 800 .85rem/1 var(--font-mono, monospace);
}

.paper-setup-section-head h3,
.paper-setup-section-head p {
    margin: 0;
}

.paper-setup-section-head h3 {
    margin-top: .2rem;
}

.paper-setup-section-head div > p:last-child {
    margin-top: .3rem;
    color: var(--muted, #66706f);
}

.paper-setup-basic-grid,
.paper-formal-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.paper-setup-basic-grid [data-form-field="instructions"] {
    grid-column: 1 / -1;
}

.paper-choice-fieldset,
.paper-release-field {
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
}

.paper-choice-fieldset + .paper-choice-fieldset {
    margin-top: 1.25rem;
    padding-top: 1.25rem;
    border-top: 1px solid rgba(16, 40, 50, .09);
}

.paper-choice-fieldset > legend,
.paper-release-field > legend {
    margin-bottom: .65rem;
    color: #183d42;
    font-weight: 800;
}

.paper-choice-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem;
}

.paper-choice-card {
    position: relative;
    display: grid;
    grid-template-columns: 2.5rem minmax(0, 1fr) auto;
    align-items: start;
    gap: .7rem;
    min-height: 7rem;
    padding: .9rem;
    border: 1px solid rgba(16, 40, 50, .13);
    border-radius: 1rem;
    cursor: pointer;
    background: #fbfcfb;
    transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.paper-choice-card:hover {
    border-color: rgba(21, 122, 120, .4);
    transform: translateY(-1px);
}

.paper-choice-card.is-selected {
    border-color: rgba(21, 122, 120, .65);
    background: linear-gradient(135deg, #eef9f6, #fffdf6);
    box-shadow: 0 .65rem 1.5rem rgba(16, 89, 84, .1);
}

.paper-choice-card > input {
    position: absolute;
    width: 1px;
    height: 1px;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
}

.paper-choice-card:has(input:focus-visible) {
    outline: 3px solid rgba(21, 122, 120, .2);
    outline-offset: 3px;
}

.paper-choice-icon {
    display: grid;
    width: 2.5rem;
    height: 2.5rem;
    place-items: center;
    border-radius: .75rem;
    color: var(--teal, #157a78);
    background: rgba(21, 122, 120, .1);
}

.paper-choice-card > span:nth-of-type(2) {
    display: grid;
    gap: .25rem;
}

.paper-choice-card small {
    color: var(--muted, #66706f);
    line-height: 1.45;
}

.paper-choice-check {
    margin-top: .15rem;
    color: transparent;
}

.paper-choice-card.is-selected .paper-choice-check {
    color: var(--teal, #157a78);
}

.paper-metric-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .75rem;
}

.paper-metric-field {
    margin: 0;
    padding: .8rem;
    border: 1px solid rgba(16, 40, 50, .1);
    border-radius: .9rem;
    background: #fafbf9;
}

.paper-metric-field input {
    min-height: 3rem;
    font-size: 1.1rem;
    font-weight: 800;
}

.paper-toggle-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem;
    margin-top: 1rem;
}

.paper-toggle-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: .8rem;
    min-height: 5.5rem;
    padding: .85rem;
    border: 1px solid rgba(16, 40, 50, .1);
    border-radius: .9rem;
    cursor: pointer;
    background: #fff;
}

.paper-toggle-card > input {
    position: absolute;
    width: 1px;
    height: 1px;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
}

.paper-toggle-card > span:nth-of-type(1) {
    display: grid;
    gap: .2rem;
}

.paper-toggle-card small {
    color: var(--muted, #66706f);
    line-height: 1.4;
}

.paper-switch {
    position: relative;
    width: 2.8rem;
    height: 1.55rem;
    border-radius: 999px;
    background: #d9dfde;
    transition: background .2s ease;
}

.paper-switch::after {
    position: absolute;
    top: .2rem;
    left: .22rem;
    width: 1.15rem;
    height: 1.15rem;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 .15rem .4rem rgba(16, 40, 50, .2);
    transition: transform .2s ease;
    content: "";
}

.paper-toggle-card:has(input:checked) {
    border-color: rgba(21, 122, 120, .35);
    background: rgba(235, 247, 244, .6);
}

.paper-toggle-card input:checked ~ .paper-switch {
    background: var(--teal, #157a78);
}

.paper-toggle-card input:checked ~ .paper-switch::after {
    transform: translateX(1.2rem);
}

.paper-toggle-card:has(input:focus-visible) {
    outline: 3px solid rgba(21, 122, 120, .2);
    outline-offset: 3px;
}

.paper-practice-note,
.paper-formal-settings {
    margin-top: 1rem;
    border-radius: 1rem;
}

.paper-practice-note {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: .75rem;
    padding: .9rem;
    color: #15594e;
    background: linear-gradient(135deg, rgba(223, 246, 238, .9), rgba(255, 250, 230, .78));
}

.paper-practice-note[hidden],
.paper-formal-settings[hidden],
[data-scheduled-release-field][hidden] {
    display: none;
}

.paper-practice-note > i {
    margin-top: .15rem;
    color: #b78000;
}

.paper-practice-note p,
.paper-formal-settings p {
    margin: .2rem 0 0;
}

.paper-formal-settings {
    padding: 1rem;
    border: 1px solid rgba(21, 122, 120, .16);
    background: rgba(238, 246, 245, .55);
}

.paper-formal-settings-head {
    display: flex;
    gap: .65rem;
    margin-bottom: 1rem;
}

.paper-formal-settings-head > i {
    color: var(--teal, #157a78);
}

.paper-formal-grid > [data-form-field="answer_release_at"] {
    grid-column: 1 / -1;
}

.paper-release-options {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}

.paper-release-options label {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .55rem .65rem;
    border: 1px solid rgba(16, 40, 50, .12);
    border-radius: .7rem;
    cursor: pointer;
    background: #fff;
    font-weight: 700;
}

.paper-setup-summary {
    position: sticky;
    top: 1rem;
    overflow: hidden;
    padding: 1.2rem;
    border: 1px solid rgba(16, 40, 50, .11);
    border-radius: 1.3rem;
    background: linear-gradient(155deg, #fff 0%, #f2f8f6 68%, #fff8e3 100%);
    box-shadow: 0 1rem 2.5rem rgba(16, 58, 62, .12);
}

.paper-setup-summary::before {
    display: block;
    width: 4rem;
    height: .28rem;
    margin: -1.2rem 0 1.1rem;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--teal, #157a78), #e1af1e);
    content: "";
}

.paper-setup-summary h3 {
    margin: .55rem 0 .35rem;
    overflow-wrap: anywhere;
    font-family: var(--font-display);
    font-size: 1.65rem;
}

.paper-setup-summary > p:not(.eyebrow-inline) {
    margin: 0;
    color: var(--muted, #66706f);
    line-height: 1.5;
}

.paper-summary-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .45rem;
    margin: 1rem 0;
}

.paper-summary-metrics span {
    display: grid;
    gap: .1rem;
    padding: .7rem .4rem;
    border-radius: .8rem;
    text-align: center;
    background: rgba(255, 255, 255, .78);
}

.paper-summary-metrics strong {
    color: var(--teal, #157a78);
    font-size: 1.15rem;
}

.paper-summary-metrics small {
    color: var(--muted, #66706f);
    font-size: .65rem;
}

.paper-summary-list {
    display: grid;
    gap: .5rem;
}

.paper-summary-list p {
    display: grid;
    grid-template-columns: 2rem minmax(0, 1fr);
    align-items: center;
    gap: .55rem;
    margin: 0;
    padding: .65rem;
    border-radius: .75rem;
    background: rgba(255, 255, 255, .72);
}

.paper-summary-list > p > i {
    color: var(--teal, #157a78);
    text-align: center;
}

.paper-summary-list span {
    display: grid;
    gap: .1rem;
}

.paper-summary-list small {
    color: var(--muted, #66706f);
    font-size: .65rem;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.paper-summary-next {
    margin: 1rem 0;
    padding: .8rem;
    border-left: 3px solid #e1af1e;
    border-radius: .2rem .75rem .75rem .2rem;
    background: #fff9e8;
}

.paper-summary-next span {
    color: #80600a;
    font: 800 .64rem/1 var(--font-mono, monospace);
    letter-spacing: .08em;
    text-transform: uppercase;
}

.paper-summary-next p {
    margin: .3rem 0 0;
    line-height: 1.45;
}

.paper-setup-summary > .button {
    width: 100%;
}

.paper-summary-save-note {
    display: flex;
    align-items: flex-start;
    gap: .4rem;
    margin-top: .75rem;
    color: var(--muted, #66706f);
    line-height: 1.4;
}

.bece-paper-item-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: .4rem;
}

.bece-paper-item-actions .button[disabled] {
    opacity: .38;
}

.bece-readiness-list {
    display: grid;
    gap: .65rem;
    margin: 0 0 1rem;
    padding: 0;
    list-style: none;
}

.bece-readiness-list li {
    display: flex;
    gap: .65rem;
    padding: .75rem .9rem;
    border-radius: .8rem;
    color: #7a2f26;
    background: rgba(192, 94, 58, .1);
}

.bece-preview-question {
    grid-template-columns: 1fr;
}

.bece-question-image {
    display: block;
    width: min(100%, 36rem);
    max-height: 24rem;
    margin: 1rem 0;
    object-fit: contain;
    border-radius: 1rem;
}

@media (max-width: 1200px) {
    .question-bank-filter-bar {
        grid-template-columns: minmax(14rem, 1.5fr) repeat(2, minmax(9rem, 1fr));
    }

    .question-paper-selection {
        grid-template-columns: minmax(13rem, .8fr) minmax(20rem, 1.4fr);
    }

    .question-paper-selection-actions {
        grid-column: 1 / -1;
    }
}

@media (max-width: 1000px) {
    .paper-setup-layout {
        grid-template-columns: 1fr;
    }

    .paper-setup-summary {
        position: static;
    }
}

@media (max-width: 800px) {
    .bece-question-card,
    .bece-question-form-grid {
        grid-template-columns: 1fr;
    }

    .question-oversight-action {
        justify-self: stretch;
    }

    .question-oversight-action .button {
        width: 100%;
    }

    .bece-question-card-actions {
        justify-content: flex-start;
    }

    .question-paper-membership-tools {
        align-items: stretch;
        flex-direction: column;
    }

    .question-paper-membership-tools > div .button {
        flex: 1 1 auto;
    }

    .question-paper-selection {
        position: static;
        grid-template-columns: 1fr;
    }

    .question-paper-selection-actions {
        grid-column: 1;
        justify-content: stretch;
    }

    .question-paper-selection-actions .button {
        flex: 1 1 0;
    }

    .bece-paper-bank-action {
        align-items: stretch;
        flex-direction: column;
    }

    .question-bank-filter-bar {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .question-bank-search,
    .question-bank-filter-actions {
        grid-column: 1 / -1;
    }

    .question-bank-filter-actions .button {
        flex: 1 1 0;
    }

    .question-bank-pagination {
        justify-content: space-between;
    }

    .bece-question-form-grid .form-field {
        grid-column: 1;
    }

    .question-builder-section {
        padding: .9rem;
    }

    .question-builder-optional > summary,
    .optional-question-grid {
        padding-right: .9rem;
        padding-left: .9rem;
    }

    .question-builder-shortcut {
        width: 100%;
        margin-left: 0;
    }

    .question-draft-status {
        align-items: flex-start;
        flex-direction: column;
    }

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

    .bulk-default-grid .form-field,
    .bulk-default-grid [data-form-field="rights_declaration"],
    .bulk-default-grid .question-rights-confirmation {
        grid-column: 1;
    }

    .question-bulk-panel-head,
    .question-bulk-actions {
        align-items: flex-start;
        flex-direction: column;
    }

    .question-bulk-toolbar {
        align-items: stretch;
    }

    .question-bulk-toolbar label {
        width: 100%;
    }

    .question-bulk-toolbar .button {
        flex: 1 1 calc(50% - .4rem);
    }

    .question-bulk-table-shell {
        max-height: 60vh;
        border-radius: .75rem;
    }

    .question-bulk-actions .button-row,
    .question-bulk-actions .button {
        width: 100%;
    }

    .bece-inline-filter {
        width: 100%;
        align-items: stretch;
        flex-direction: column;
    }

    .bece-paper-add-form,
    .bece-paper-item {
        grid-template-columns: 1fr;
    }

    .bece-paper-order {
        width: 2.25rem;
        height: 2.25rem;
    }

    .bece-paper-item-actions {
        justify-content: flex-start;
    }

    .paper-choice-grid,
    .paper-toggle-grid,
    .paper-setup-basic-grid,
    .paper-formal-grid {
        grid-template-columns: 1fr;
    }

    .paper-formal-grid > [data-form-field="answer_release_at"],
    .paper-setup-basic-grid [data-form-field="instructions"] {
        grid-column: 1;
    }
}

@media (max-width: 520px) {
    .question-bank-filter-bar {
        grid-template-columns: 1fr;
    }

    .question-bank-search,
    .question-bank-filter-actions {
        grid-column: 1;
    }

    .question-bank-pagination .button span {
        display: none;
    }

    .question-bank-page-links a,
    .question-bank-page-links span {
        min-width: 2rem;
        min-height: 2rem;
    }

    .question-paper-new-fields {
        grid-template-columns: 1fr;
    }

    .question-paper-selection-actions {
        flex-direction: column-reverse;
    }

    .question-paper-selection-actions .button,
    .bece-paper-bank-action .button {
        width: 100%;
    }

    .paper-setup-section {
        padding: .9rem;
    }

    .paper-setup-section-head {
        grid-template-columns: 2.25rem minmax(0, 1fr);
    }

    .paper-setup-section-head > span {
        width: 2.25rem;
        height: 2.25rem;
    }

    .paper-choice-card {
        grid-template-columns: 2.25rem minmax(0, 1fr) auto;
        min-height: 0;
    }

    .paper-choice-icon {
        width: 2.25rem;
        height: 2.25rem;
    }

    .paper-metric-grid {
        gap: .45rem;
    }

    .paper-metric-field {
        padding: .55rem;
    }
}

/* Global system loader */
.system-loader {
    --system-loader-size: clamp(14rem, min(32vw, 44dvh), 23rem);
    position: fixed;
    inset: 0;
    z-index: 100000;
    display: grid;
    place-items: center;
    min-height: 100dvh;
    padding: max(1.5rem, env(safe-area-inset-top)) max(1.25rem, env(safe-area-inset-right)) max(1.5rem, env(safe-area-inset-bottom)) max(1.25rem, env(safe-area-inset-left));
    overflow: hidden;
    background:
        radial-gradient(circle at 50% 38%, rgba(17, 170, 229, 0.09), transparent 31rem),
        linear-gradient(145deg, #ffffff 0%, #fbfcfe 52%, #f5f8fc 100%);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 220ms ease, visibility 220ms ease;
}

.system-loader::before,
.system-loader::after {
    content: "";
    position: absolute;
    width: min(38rem, 70vw);
    aspect-ratio: 1;
    border-radius: 50%;
    filter: blur(4rem);
    opacity: 0.13;
    pointer-events: none;
}

.system-loader::before {
    top: -22rem;
    left: -18rem;
    background: #0baeea;
}

.system-loader::after {
    right: -20rem;
    bottom: -24rem;
    background: #efb41d;
}

.system-loader-enabled .system-loader.is-active {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.system-loader-panel {
    position: relative;
    z-index: 1;
    display: grid;
    justify-items: center;
    width: min(100%, 38rem);
    transform: translateY(-1.5vh);
}

.system-loader-progress {
    position: relative;
    display: grid;
    place-items: center;
    width: var(--system-loader-size);
    aspect-ratio: 1;
    filter: drop-shadow(0 1.4rem 2.3rem rgba(12, 45, 104, 0.09));
}

.system-loader-ring {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    overflow: visible;
    transform: rotate(-90deg);
}

.system-loader-track,
.system-loader-value {
    fill: none;
    stroke-width: 2.7;
}

.system-loader-track {
    stroke: #e7eef9;
}

.system-loader-value {
    stroke: url("#system-loader-gradient");
    stroke-linecap: round;
    stroke-dasharray: 100;
    stroke-dashoffset: 88;
    transition: stroke-dashoffset 240ms cubic-bezier(0.22, 0.78, 0.22, 1);
}

.system-loader-marker {
    position: absolute;
    inset: 4%;
    display: block;
    transform: rotate(43.2deg);
    transition: transform 240ms cubic-bezier(0.22, 0.78, 0.22, 1);
}

.system-loader-marker > span {
    position: absolute;
    top: 0;
    left: 50%;
    width: clamp(1rem, 3.6vw, 1.45rem);
    aspect-ratio: 1;
    border: 0.28rem solid #ffffff;
    border-radius: 50%;
    background: linear-gradient(145deg, #f9c72b, #d89000);
    box-shadow: 0 0.45rem 1rem rgba(214, 143, 0, 0.26);
    transform: translate(-50%, -50%);
}

.system-loader-brand {
    display: grid;
    place-items: center;
    width: 75%;
    aspect-ratio: 1;
    overflow: hidden;
    border: 1px solid rgba(17, 99, 166, 0.08);
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: inset 0 0 2.4rem rgba(15, 92, 172, 0.035);
    animation: system-loader-breathe 2.2s ease-in-out infinite;
}

.system-loader-brand img {
    display: block;
    width: 92%;
    height: 92%;
    object-fit: contain;
}

.system-loader-percentage {
    margin-top: clamp(0.9rem, 2.4vh, 1.45rem);
    color: #123e98;
    font-family: "DM Sans", sans-serif;
    font-size: clamp(2.25rem, min(4.6vw, 7dvh), 3.6rem);
    font-weight: 700;
    letter-spacing: -0.05em;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}

.system-loader-message {
    margin: clamp(0.55rem, 1.4vh, 0.8rem) 0 0;
    color: #294979;
    font-family: "DM Sans", sans-serif;
    font-size: clamp(0.88rem, min(1.4vw, 2.4dvh), 1.05rem);
    font-weight: 400;
    letter-spacing: 0.015em;
    text-align: center;
}

.system-loader.is-finishing .system-loader-panel {
    transform: translateY(-1.5vh) scale(0.985);
    opacity: 0;
    transition: opacity 180ms ease, transform 220ms ease;
}

@keyframes system-loader-breathe {
    0%, 100% { transform: scale(0.985); }
    50% { transform: scale(1); }
}

@media (max-width: 600px) {
    .system-loader {
        --system-loader-size: clamp(13rem, min(70vw, 38dvh), 19rem);
    }

    .system-loader-panel {
        transform: translateY(-3vh);
    }

    .system-loader-percentage {
        margin-top: 1rem;
    }
}

@media (max-height: 560px) and (orientation: landscape) {
    .system-loader {
        --system-loader-size: min(48vh, 16rem);
    }

    .system-loader-panel {
        transform: none;
    }

    .system-loader-percentage {
        margin-top: 0.55rem;
        font-size: clamp(1.8rem, 7vh, 2.4rem);
    }

    .system-loader-message {
        margin-top: 0.35rem;
        font-size: 0.78rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .system-loader,
    .system-loader-panel,
    .system-loader-value,
    .system-loader-marker {
        transition-duration: 0.01ms !important;
    }

    .system-loader-brand {
        animation: none;
    }
}

/* Assessment discovery keeps artwork secondary to status and the real actions. */
.assessment-discovery-card.illustrated-card {
    display: block;
    border-color: #dce8e5;
    border-radius: 1.25rem;
    background: #fff;
}

.assessment-discovery-card .student-library-item-shell {
    grid-template-columns: minmax(8rem, 10.5rem) minmax(0, 1fr);
    align-items: stretch;
    gap: 1.25rem;
    padding: .9rem;
    border: 0;
    border-radius: 0;
    background: none;
    box-shadow: none;
}

.assessment-discovery-cover {
    display: grid;
    place-items: center;
    min-height: 10rem;
    overflow: hidden;
    border-radius: .9rem;
    background: linear-gradient(145deg, #e9f4f2, #d9eae5);
    color: #257268;
}

.assessment-discovery-cover img {
    width: 100%;
    height: 100%;
    max-height: 16rem;
    object-fit: cover;
}

.assessment-discovery-cover i {
    font-size: 2.4rem;
    opacity: .78;
}

.assessment-discovery-card .student-library-item-main {
    align-content: center;
    padding: .25rem .35rem .25rem 0;
}

.assessment-discovery-card .student-library-status-pill i {
    font-size: .78rem;
}

.assessment-discovery-card.student-library-item-success { border-color: #c6ddce; }
.assessment-discovery-card.student-library-item-success .assessment-discovery-cover { background: linear-gradient(145deg, #ecf8ee, #d9ecdd); color: #307543; }
.assessment-discovery-card.student-library-item-watch { border-color: #e8ddba; }
.assessment-discovery-card.student-library-item-watch .assessment-discovery-cover { background: linear-gradient(145deg, #fffaf0, #f1e8ce); color: #8b6817; }
.assessment-discovery-card.student-library-item-warning { border-color: #e6d6ce; }
.assessment-discovery-card.student-library-item-warning .assessment-discovery-cover { background: linear-gradient(145deg, #fbf3ef, #eeded5); color: #9a533a; }

.assessment-overview-launch.illustrated-card--status {
    display: grid;
    border-color: #cde4df;
    box-shadow: 0 12px 28px rgba(13, 53, 65, .055);
}

.assessment-overview-launch-locked.illustrated-card--status {
    border-color: #e4d8c9;
    background: linear-gradient(120deg, #fff, #faf5ee);
}

.assessment-overview-launch-locked .assessment-overview-launch-icon {
    background: #8b6957;
    box-shadow: none;
}

.exam-launch-state {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    padding: .4rem .7rem;
    border: 1px solid #cfe2d9;
    border-radius: 999px;
    background: #f1f8f4;
    color: #246452;
    font-size: .76rem;
    font-weight: 800;
}

.exam-launch-state.is-active {
    border-color: #b9d9d7;
    background: #e8f5f3;
    color: #145f63;
}

.exam-launch-action-card.illustrated-card--status {
    align-items: flex-start;
    border-color: #d6e8e3;
    box-shadow: none;
    background: #fff;
}

.exam-launch-action-card.theory-guided-action-card.illustrated-card--status {
    background: linear-gradient(145deg, #fff, #eff8f6);
}

@media (max-width: 700px) {
    .assessment-discovery-card .student-library-item-shell {
        grid-template-columns: minmax(0, 1fr);
        gap: .8rem;
    }

    .assessment-discovery-cover {
        min-height: 7rem;
        max-height: 8rem;
    }

    .assessment-discovery-card .student-library-item-main {
        padding: .15rem;
    }
}

/* Live platform updates on the public homepage and in the content manager. */
.landing-home .landing-hero-visual.landing-hero-updates {
    display: flex;
    width: 100%;
    min-width: 0;
    align-items: center;
    justify-content: center;
}

.landing-update-board {
    position: relative;
    width: min(100%, 560px);
    padding: clamp(1.25rem, 3vw, 2rem);
    overflow: hidden;
    border: 1px solid rgba(26, 107, 107, 0.16);
    border-radius: 34px;
    background:
        radial-gradient(circle at 8% 12%, rgba(57, 172, 161, 0.12), transparent 27%),
        radial-gradient(circle at 92% 8%, rgba(201, 168, 76, 0.15), transparent 24%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(250, 248, 241, 0.96));
    box-shadow: 0 28px 70px rgba(22, 45, 52, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.landing-update-board::after {
    position: absolute;
    right: -3.5rem;
    bottom: -3.5rem;
    width: 10rem;
    height: 10rem;
    border: 1px solid rgba(26, 107, 107, 0.1);
    border-radius: 50%;
    content: "";
}

.landing-update-accent {
    position: absolute;
    top: 0;
    left: 12%;
    width: 34%;
    height: 5px;
    border-radius: 0 0 999px 999px;
    background: linear-gradient(90deg, var(--teal), #49b6a7 56%, var(--gold));
}

.landing-update-board-head {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: center;
    margin-bottom: 1.35rem;
}

.landing-update-megaphone,
.landing-updates-hero-mark > i {
    display: inline-grid;
    width: 3.5rem;
    height: 3.5rem;
    place-items: center;
    border: 1px solid rgba(26, 107, 107, 0.17);
    border-radius: 18px;
    color: var(--teal-dark);
    background: rgba(255, 255, 255, 0.78);
    box-shadow: 0 12px 26px rgba(26, 107, 107, 0.12);
    font-size: 1.35rem;
    transform: rotate(-7deg);
}

.landing-update-kicker {
    margin: 0 0 0.15rem;
    color: var(--teal);
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

.landing-update-board-head h2 {
    margin: 0;
    color: var(--ink);
    font-size: clamp(1.75rem, 4vw, 2.45rem);
    line-height: 1;
}

.landing-update-board-head h2 span {
    position: relative;
    z-index: 0;
}

.landing-update-board-head h2 span::after {
    position: absolute;
    z-index: -1;
    right: -0.12em;
    bottom: 0.04em;
    left: -0.12em;
    height: 0.36em;
    border-radius: 999px;
    background: rgba(244, 194, 70, 0.46);
    content: "";
    transform: rotate(-1.5deg);
}

.landing-update-board-head p:last-child {
    margin: 0.45rem 0 0;
    color: var(--mid);
    font-size: 0.83rem;
    line-height: 1.45;
}

.landing-update-note {
    display: inline-grid;
    min-width: 4.6rem;
    min-height: 4.35rem;
    place-items: center;
    padding: 0.65rem;
    border-radius: 3px;
    color: #713653;
    background: linear-gradient(145deg, #ffd2e3, #f7a9c8);
    box-shadow: 0 12px 22px rgba(113, 54, 83, 0.18);
    font-size: 0.7rem;
    font-weight: 800;
    line-height: 1.25;
    text-align: center;
    text-transform: uppercase;
    transform: rotate(-6deg);
}

.landing-update-list {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 0.75rem;
}

.landing-update-item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto auto;
    gap: 0.85rem;
    align-items: center;
    min-width: 0;
    padding: 0.9rem;
    border: 1px solid rgba(26, 107, 107, 0.14);
    border-radius: 20px;
    color: var(--ink);
    background: rgba(240, 250, 247, 0.82);
    text-decoration: none;
    transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

a.landing-update-item:hover,
a.landing-update-item:focus-visible {
    border-color: rgba(26, 107, 107, 0.36);
    box-shadow: 0 12px 25px rgba(26, 107, 107, 0.1);
    transform: translateY(-2px);
}

.landing-update-item.tone-content,
.landing-update-item.tone-learning {
    border-color: rgba(49, 117, 181, 0.18);
    background: rgba(241, 247, 253, 0.88);
}

.landing-update-item.tone-curriculum,
.landing-update-item.tone-school {
    border-color: rgba(201, 168, 76, 0.24);
    background: rgba(255, 250, 236, 0.88);
}

.landing-update-item.tone-family {
    border-color: rgba(150, 105, 205, 0.2);
    background: rgba(248, 244, 253, 0.9);
}

.landing-update-icon {
    display: inline-grid;
    width: 2.85rem;
    height: 2.85rem;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 15px;
    color: #fff;
    background: linear-gradient(145deg, var(--teal), #36aa93);
    box-shadow: 0 8px 18px rgba(26, 107, 107, 0.18);
}

.tone-content .landing-update-icon,
.tone-learning .landing-update-icon {
    background: linear-gradient(145deg, #347eb5, #65a9d3);
}

.tone-curriculum .landing-update-icon,
.tone-school .landing-update-icon {
    color: #342a10;
    background: linear-gradient(145deg, #e5b62f, #f3d66e);
}

.tone-family .landing-update-icon {
    background: linear-gradient(145deg, #7956c5, #aa83e3);
}

.landing-update-copy {
    display: grid;
    min-width: 0;
    gap: 0.18rem;
}

.landing-update-copy strong {
    overflow: hidden;
    font-size: 0.95rem;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.landing-update-copy small {
    display: -webkit-box;
    overflow: hidden;
    color: var(--mid);
    font-size: 0.76rem;
    line-height: 1.35;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.landing-update-badge {
    display: inline-flex;
    align-items: center;
    min-height: 1.8rem;
    padding: 0.35rem 0.58rem;
    border-radius: 9px;
    color: var(--teal-dark);
    background: rgba(96, 201, 176, 0.2);
    font-size: 0.64rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.landing-update-arrow {
    color: var(--teal-dark);
    font-size: 0.8rem;
}

.landing-update-empty,
.landing-updates-empty {
    display: flex;
    gap: 1rem;
    align-items: center;
    padding: 1.25rem;
    border: 1px dashed rgba(26, 107, 107, 0.24);
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.65);
}

.landing-update-empty > span,
.landing-updates-empty > span {
    display: inline-grid;
    width: 3rem;
    height: 3rem;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 50%;
    color: var(--teal);
    background: rgba(26, 107, 107, 0.1);
}

.landing-update-empty p,
.landing-updates-empty p {
    margin: 0.2rem 0 0;
    color: var(--mid);
}

.landing-update-all {
    position: relative;
    z-index: 1;
    display: inline-flex;
    gap: 0.6rem;
    align-items: center;
    margin-top: 1.2rem;
    color: var(--teal-dark);
    font-weight: 800;
    text-decoration: none;
}

.landing-update-all i:last-child {
    transition: transform 0.2s ease;
}

.landing-update-all:hover i:last-child,
.landing-update-all:focus-visible i:last-child {
    transform: translateX(4px);
}

.landing-animations-ready .landing-hero-updates:not(.is-visible) .landing-update-board {
    opacity: 0;
    transform: translateY(18px) rotate(1deg);
}

.landing-animations-ready .landing-hero-updates.is-visible .landing-update-board {
    animation: landingUpdateBoardIn 0.65s cubic-bezier(0.2, 0.75, 0.25, 1) both;
}

.landing-animations-ready .landing-hero-updates:not(.is-visible) .landing-update-item {
    opacity: 0;
    transform: translateY(12px);
}

.landing-animations-ready .landing-hero-updates.is-visible .landing-update-item {
    animation: landingUpdateItemIn 0.45s ease both;
}

.landing-animations-ready .landing-hero-updates.is-visible .landing-update-item:nth-child(2) {
    animation-delay: 0.1s;
}

.landing-animations-ready .landing-hero-updates.is-visible .landing-update-item:nth-child(3) {
    animation-delay: 0.2s;
}

@keyframes landingUpdateBoardIn {
    from { opacity: 0; transform: translateY(18px) rotate(1deg); }
    to { opacity: 1; transform: translateY(0) rotate(0); }
}

@keyframes landingUpdateItemIn {
    from { opacity: 0; transform: translateY(12px); }
    to { opacity: 1; transform: translateY(0); }
}

.landing-updates-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: clamp(2rem, 7vw, 6rem);
    align-items: center;
    min-height: 460px;
    padding: 8.5rem clamp(1.25rem, 6vw, 6rem) 4rem;
    background:
        radial-gradient(circle at 78% 28%, rgba(201, 168, 76, 0.18), transparent 22%),
        linear-gradient(135deg, rgba(245, 250, 247, 0.98), rgba(252, 248, 237, 0.96));
}

.landing-updates-hero-copy {
    max-width: 790px;
}

.landing-updates-hero h1 {
    margin: 0.75rem 0 1.15rem;
    font-size: clamp(2.65rem, 6vw, 5.2rem);
    line-height: 1;
}

.landing-updates-hero h1 em {
    color: var(--teal);
}

.landing-updates-hero-copy > p:last-child {
    max-width: 680px;
    color: var(--mid);
    font-size: 1.08rem;
    line-height: 1.7;
}

.landing-updates-hero-mark {
    display: grid;
    gap: 1rem;
    justify-items: center;
    min-width: 12rem;
    padding: 1.6rem;
    border: 1px solid rgba(26, 107, 107, 0.15);
    border-radius: 30px;
    background: rgba(255, 255, 255, 0.75);
    box-shadow: 0 20px 50px rgba(22, 45, 52, 0.12);
    color: var(--teal-dark);
    font-weight: 900;
    line-height: 1.35;
    text-align: center;
    text-transform: uppercase;
}

.landing-updates-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.landing-update-archive-card {
    display: flex;
    min-width: 0;
    min-height: 270px;
    flex-direction: column;
    padding: 1.35rem;
    border: 1px solid rgba(26, 107, 107, 0.13);
    border-radius: 24px;
    background: rgba(255, 255, 255, 0.86);
    box-shadow: 0 16px 36px rgba(22, 45, 52, 0.07);
}

.landing-update-archive-top {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: center;
    margin-bottom: 1.2rem;
}

.landing-update-archive-card .eyebrow {
    margin-bottom: 0.55rem;
    font-size: 0.64rem;
}

.landing-update-archive-card h3 {
    margin-bottom: 0.6rem;
    font-size: 1.35rem;
}

.landing-update-archive-card > p:not(.eyebrow) {
    color: var(--mid);
    line-height: 1.6;
}

.landing-update-archive-card .text-link {
    margin-top: auto;
    padding-top: 1rem;
}

.landing-update-pagination {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    align-items: center;
    justify-content: center;
    margin-top: 2rem;
}

.platform-update-manager-list {
    display: grid;
    gap: 0.85rem;
}

.platform-update-manager-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: center;
    padding: 1rem;
    border: 1px solid rgba(26, 107, 107, 0.13);
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.82);
}

.platform-update-manager-copy {
    min-width: 0;
}

.platform-update-manager-copy h3 {
    margin: 0.35rem 0;
}

.platform-update-manager-copy p,
.platform-update-manager-copy small {
    color: var(--mid);
}

.platform-update-manager-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem 0.8rem;
    align-items: center;
    color: var(--mid);
    font-size: 0.72rem;
}

.platform-update-form-grid .is-wide {
    grid-column: 1 / -1;
}

@media (max-width: 900px) {
    .landing-updates-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .landing-update-board {
        padding: 1.15rem;
        border-radius: 24px;
    }

    .landing-update-board-head {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .landing-update-note {
        display: none;
    }

    .landing-update-item {
        grid-template-columns: auto minmax(0, 1fr) auto;
        gap: 0.7rem;
    }

    .landing-update-badge {
        grid-column: 2;
        justify-self: start;
    }

    .landing-update-arrow {
        grid-column: 3;
        grid-row: 1 / span 2;
    }

    .landing-updates-hero {
        grid-template-columns: 1fr;
        min-height: 0;
        padding: 6.5rem 1rem 2.8rem;
    }

    .landing-updates-hero-mark {
        display: none;
    }

    .landing-updates-grid {
        grid-template-columns: 1fr;
    }

    .landing-update-archive-card {
        min-height: 0;
    }

    .platform-update-manager-row {
        grid-template-columns: auto minmax(0, 1fr);
        align-items: start;
    }

    .platform-update-manager-row > .button {
        grid-column: 1 / -1;
        width: 100%;
        justify-content: center;
    }
}

@media (max-width: 420px) {
    .landing-update-board-head {
        gap: 0.7rem;
    }

    .landing-update-megaphone {
        width: 2.8rem;
        height: 2.8rem;
        border-radius: 14px;
    }

    .landing-update-board-head h2 {
        font-size: 1.7rem;
    }

    .landing-update-copy strong {
        white-space: normal;
    }
}

@media (prefers-reduced-motion: reduce) {
    .landing-animations-ready .landing-hero-updates .landing-update-board,
    .landing-animations-ready .landing-hero-updates .landing-update-item {
        opacity: 1 !important;
        animation: none !important;
        transform: none !important;
    }
}

/* Public platform guide library */
.platform-guides-hero {
    background:
        linear-gradient(120deg, rgba(250, 247, 242, 0.96), rgba(232, 244, 244, 0.82)),
        radial-gradient(circle at 80% 15%, rgba(201, 168, 76, 0.2), transparent 34%);
    display: grid;
    gap: clamp(2rem, 5vw, 5rem);
    grid-template-columns: minmax(0, 1.2fr) minmax(320px, 0.8fr);
    overflow: hidden;
    padding: clamp(5rem, 9vw, 8rem) max(5vw, calc((100vw - 1320px) / 2));
    position: relative;
}

.platform-guides-hero-copy,
.platform-guides-hero-card {
    position: relative;
    z-index: 1;
}

.platform-guides-hero-copy {
    align-self: center;
    max-width: 760px;
}

.platform-guides-hero-copy h1 {
    font-family: "Playfair Display", serif;
    font-size: clamp(3rem, 6vw, 6.4rem);
    letter-spacing: -0.055em;
    line-height: 0.96;
    margin: 0.65rem 0 1.25rem;
    max-width: 760px;
}

.platform-guides-hero-copy > p:not(.eyebrow) {
    color: var(--mid);
    font-size: clamp(1rem, 1.6vw, 1.22rem);
    line-height: 1.75;
    max-width: 650px;
}

.platform-guides-hero-card {
    align-self: center;
    background: linear-gradient(145deg, #102d31, #0b171b);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 30px;
    box-shadow: 0 28px 70px rgba(13, 13, 13, 0.2);
    color: #fff;
    padding: clamp(1.6rem, 3vw, 2.5rem);
}

.platform-guides-hero-card .eyebrow {
    color: var(--gold-light);
}

.platform-guides-hero-card h2 {
    color: #fff;
    font-family: "Playfair Display", serif;
    font-size: clamp(1.75rem, 3vw, 2.65rem);
    line-height: 1.08;
    margin: 1rem 0 1.5rem;
}

.platform-guides-hero-card ul {
    display: grid;
    gap: 0.85rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

.platform-guides-hero-card li {
    align-items: center;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    display: flex;
    gap: 0.8rem;
    padding-top: 0.85rem;
}

.platform-guides-hero-card li i {
    color: var(--gold-light);
}

.platform-guides-hero-icon {
    align-items: center;
    background: rgba(46, 158, 158, 0.2);
    border: 1px solid rgba(46, 158, 158, 0.35);
    border-radius: 18px;
    color: #8bdfd9;
    display: inline-flex;
    font-size: 1.35rem;
    height: 58px;
    justify-content: center;
    width: 58px;
}

.platform-guide-library {
    background: rgba(255, 255, 255, 0.58);
}

.platform-guide-jump-links {
    display: flex;
    flex-wrap: wrap;
    gap: 0.7rem;
    justify-content: center;
    margin: 0 auto clamp(2.5rem, 5vw, 4.5rem);
}

.platform-guide-jump-links a {
    align-items: center;
    background: #fff;
    border: 1px solid rgba(26, 107, 107, 0.16);
    border-radius: 999px;
    color: var(--ink);
    display: inline-flex;
    font-weight: 700;
    gap: 0.6rem;
    padding: 0.7rem 0.9rem 0.7rem 1rem;
    text-decoration: none;
}

.platform-guide-jump-links a:hover,
.platform-guide-jump-links a:focus-visible {
    border-color: var(--teal);
    color: var(--teal);
    transform: translateY(-2px);
}

.platform-guide-jump-links span {
    align-items: center;
    background: var(--teal-pale);
    border-radius: 999px;
    display: inline-flex;
    font-size: 0.75rem;
    height: 28px;
    justify-content: center;
    min-width: 28px;
}

.platform-guide-group {
    margin: 0 auto clamp(3.5rem, 7vw, 6rem);
    max-width: 1320px;
    scroll-margin-top: 6rem;
}

.platform-guide-group-head {
    align-items: center;
    display: flex;
    gap: 1rem;
    margin-bottom: 1.35rem;
}

.platform-guide-group-head > span {
    align-items: center;
    background: var(--teal);
    border-radius: 16px;
    color: #fff;
    display: inline-flex;
    height: 52px;
    justify-content: center;
    width: 52px;
}

.platform-guide-group-head .eyebrow,
.platform-guide-group-head h2 {
    margin: 0;
}

.platform-guide-group-head h2 {
    font-family: "Playfair Display", serif;
    font-size: clamp(1.7rem, 3vw, 2.5rem);
}

.platform-guide-grid {
    display: grid;
    gap: clamp(1rem, 2vw, 1.5rem);
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.platform-guide-card {
    background: #fff;
    border: 1px solid rgba(13, 13, 13, 0.09);
    border-radius: 24px;
    box-shadow: 0 18px 46px rgba(13, 13, 13, 0.07);
    min-width: 0;
    overflow: hidden;
    transition: box-shadow 180ms ease, transform 180ms ease;
}

.platform-guide-card:hover {
    box-shadow: 0 24px 58px rgba(13, 13, 13, 0.12);
    transform: translateY(-4px);
}

.platform-guide-player {
    aspect-ratio: 16 / 9;
    background: #071619;
    overflow: hidden;
    position: relative;
}

.platform-guide-player iframe {
    border: 0;
    height: 100%;
    width: 100%;
}

.platform-guide-preview {
    background: #071619;
    border: 0;
    color: #fff;
    cursor: pointer;
    height: 100%;
    padding: 0;
    position: relative;
    width: 100%;
}

.platform-guide-preview::after {
    background: linear-gradient(180deg, transparent 42%, rgba(7, 22, 25, 0.78));
    content: "";
    inset: 0;
    position: absolute;
}

.platform-guide-preview img {
    height: 100%;
    object-fit: cover;
    transition: opacity 180ms ease, transform 350ms ease;
    width: 100%;
}

.platform-guide-preview:hover img,
.platform-guide-preview:focus-visible img {
    opacity: 0.82;
    transform: scale(1.035);
}

.platform-guide-play {
    align-items: center;
    background: var(--teal);
    border: 4px solid rgba(255, 255, 255, 0.88);
    border-radius: 50%;
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.28);
    display: inline-flex;
    font-size: 1.05rem;
    height: 62px;
    justify-content: center;
    left: 50%;
    padding-left: 0.15rem;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 62px;
    z-index: 1;
}

.platform-guide-preview-label {
    bottom: 1rem;
    font-size: 0.75rem;
    font-weight: 800;
    left: 1rem;
    letter-spacing: 0.08em;
    position: absolute;
    text-transform: uppercase;
    z-index: 1;
}

.platform-guide-copy {
    padding: 1.25rem;
}

.platform-guide-audience {
    color: var(--teal);
    display: block;
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    margin-bottom: 0.65rem;
    text-transform: uppercase;
}

.platform-guide-copy h3 {
    font-family: "Playfair Display", serif;
    font-size: clamp(1.25rem, 2vw, 1.55rem);
    line-height: 1.16;
    margin: 0;
}

.platform-guide-copy p {
    color: var(--mid);
    line-height: 1.65;
    margin: 0.7rem 0 0;
}

.platform-guide-copy > a {
    align-items: center;
    color: var(--teal);
    display: inline-flex;
    font-size: 0.85rem;
    font-weight: 800;
    gap: 0.5rem;
    margin-top: 1rem;
    text-decoration: none;
}

.platform-guide-copy > a:hover,
.platform-guide-copy > a:focus-visible {
    color: var(--ink);
}

.platform-guide-empty {
    background:
        radial-gradient(circle at top right, rgba(201, 168, 76, 0.16), transparent 30%),
        linear-gradient(145deg, #fff, #f4faf9);
    border: 1px solid rgba(26, 107, 107, 0.14);
    border-radius: 30px;
    box-shadow: 0 24px 60px rgba(13, 13, 13, 0.08);
    margin: 0 auto;
    max-width: 760px;
    padding: clamp(2rem, 5vw, 4rem);
    text-align: center;
}

.platform-guide-empty > span {
    align-items: center;
    background: var(--teal-pale);
    border-radius: 20px;
    color: var(--teal);
    display: inline-flex;
    font-size: 1.4rem;
    height: 64px;
    justify-content: center;
    margin-bottom: 1rem;
    width: 64px;
}

.platform-guide-empty h2 {
    font-family: "Playfair Display", serif;
    font-size: clamp(1.8rem, 4vw, 3rem);
    margin: 0.7rem 0;
}

.platform-guide-empty > p:not(.eyebrow) {
    color: var(--mid);
    line-height: 1.7;
    margin: 0 auto 1.4rem;
    max-width: 540px;
}

.platform-guides-featured {
    background:
        radial-gradient(circle at 10% 20%, rgba(46, 158, 158, 0.11), transparent 28%),
        rgba(255, 255, 255, 0.72);
}

@media (max-width: 980px) {
    .platform-guides-hero {
        grid-template-columns: 1fr;
    }

    .platform-guides-hero-card {
        max-width: 680px;
    }

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

@media (max-width: 640px) {
    .platform-guides-hero {
        gap: 1.5rem;
        padding: 4rem 1rem 2.5rem;
    }

    .platform-guides-hero-copy h1 {
        font-size: clamp(2.65rem, 14vw, 4rem);
    }

    .platform-guides-hero-card {
        border-radius: 22px;
    }

    .platform-guide-jump-links {
        flex-wrap: nowrap;
        justify-content: flex-start;
        margin-inline: -1rem;
        overflow-x: auto;
        padding: 0 1rem 0.5rem;
        scrollbar-width: thin;
    }

    .platform-guide-jump-links a {
        flex: 0 0 auto;
    }

    .platform-guide-grid {
        grid-template-columns: 1fr;
    }

    .platform-guide-card,
    .platform-guide-empty {
        border-radius: 20px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .platform-guide-card,
    .platform-guide-preview img,
    .platform-guide-jump-links a {
        transition: none;
    }
}

/* Guardian notifications keep urgent family actions visible without becoming a dense inbox. */
.guardian-notification-hero {
    margin-bottom: 1rem;
}

.guardian-notification-toolbar {
    align-items: center;
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.08), transparent 38%),
        rgba(255, 255, 255, 0.92);
    border: 1px solid rgba(26, 107, 107, 0.13);
    border-radius: 20px;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    margin-bottom: 1rem;
    padding: 0.85rem 1rem;
}

.guardian-notification-toolbar form {
    margin: 0;
}

.guardian-notification-toolbar .button {
    min-height: 44px;
}

.guardian-notification-unread {
    align-items: center;
    display: flex;
    gap: 0.75rem;
    min-width: 0;
}

.guardian-notification-unread > span:last-child,
.guardian-notification-unread strong,
.guardian-notification-unread small {
    display: block;
    min-width: 0;
}

.guardian-notification-unread small {
    color: var(--mid);
    font-size: 0.76rem;
    margin-top: 0.16rem;
}

.guardian-notification-unread-icon,
.guardian-notification-section-icon,
.guardian-notification-card-icon {
    align-items: center;
    background: rgba(26, 107, 107, 0.1);
    border-radius: 14px;
    color: var(--teal);
    display: inline-flex;
    flex: 0 0 auto;
    height: 44px;
    justify-content: center;
    width: 44px;
}

.guardian-notification-feed,
.guardian-notification-ward-groups,
.guardian-notification-list {
    display: grid;
}

.guardian-notification-feed {
    gap: 1rem;
}

.guardian-notification-section {
    margin: 0;
}

.guardian-notification-section-needs_attention {
    background:
        radial-gradient(circle at top right, rgba(201, 168, 76, 0.12), transparent 34%),
        rgba(255, 255, 255, 0.96);
    border-color: rgba(201, 168, 76, 0.24);
}

.guardian-notification-section-head {
    align-items: flex-start;
    border-bottom: 1px solid rgba(13, 13, 13, 0.08);
    display: grid;
    gap: 0.8rem;
    grid-template-columns: auto minmax(0, 1fr);
    margin-bottom: 1rem;
    padding-bottom: 1rem;
}

.guardian-notification-section-head h3,
.guardian-notification-section-head p,
.guardian-notification-ward-head h4 {
    margin: 0;
}

.guardian-notification-section-head h3 {
    font-family: var(--font-display, Georgia, serif);
    font-size: clamp(1.25rem, 2vw, 1.65rem);
    margin-top: 0.2rem;
}

.guardian-notification-section-head p {
    color: var(--mid);
    line-height: 1.5;
    margin-top: 0.25rem;
}

.guardian-notification-ward-groups {
    gap: 1.15rem;
}

.guardian-notification-ward-group {
    min-width: 0;
    border: 1px solid rgba(26, 107, 107, 0.14);
    border-radius: 17px;
    background: rgba(255, 255, 255, 0.68);
    overflow: hidden;
}

.guardian-notification-ward-head {
    align-items: center;
    display: grid;
    gap: 0.65rem;
    grid-template-columns: auto minmax(0, 1fr) auto;
    min-height: 64px;
    padding: 0.7rem 0.85rem;
    cursor: pointer;
    list-style: none;
}

.guardian-notification-ward-head::-webkit-details-marker {
    display: none;
}

.guardian-notification-ward-head:focus-visible {
    outline: 3px solid var(--teal);
    outline-offset: -3px;
}

.guardian-notification-ward-group[open] > .guardian-notification-ward-head {
    border-bottom: 1px solid rgba(26, 107, 107, 0.12);
}

.guardian-notification-ward-chevron {
    color: var(--teal);
    transition: transform 180ms ease;
}

.guardian-notification-ward-group[open] .guardian-notification-ward-chevron {
    transform: rotate(180deg);
}

.guardian-notification-ward-group > .guardian-notification-list {
    padding: 0.75rem;
}

.guardian-notification-ward-avatar {
    align-items: center;
    background: linear-gradient(135deg, var(--teal-pale), rgba(201, 168, 76, 0.18));
    border-radius: 11px;
    color: var(--teal-dark);
    display: inline-flex;
    flex: 0 0 36px;
    font-family: var(--font-display, Georgia, serif);
    font-weight: 800;
    height: 36px;
    justify-content: center;
    width: 36px;
}

.guardian-notification-ward-head h4 {
    font-size: 0.98rem;
    overflow-wrap: anywhere;
}

.guardian-notification-ward-head small {
    color: var(--mid);
    display: block;
    font-size: 0.72rem;
    margin-top: 0.15rem;
}

.guardian-notification-list {
    gap: 0.65rem;
}

.guardian-notification-card {
    align-items: start;
    background: rgba(255, 255, 255, 0.86);
    border: 1px solid rgba(13, 13, 13, 0.09);
    border-left: 4px solid rgba(107, 101, 96, 0.38);
    border-radius: 17px;
    color: var(--ink);
    display: grid;
    gap: 0.75rem;
    grid-template-columns: auto minmax(0, 1fr);
    min-height: 76px;
    min-width: 0;
    padding: 0.85rem;
    text-decoration: none;
    transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

a.guardian-notification-card:hover,
a.guardian-notification-card:focus-visible {
    border-color: rgba(26, 107, 107, 0.34);
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.09);
    color: var(--ink);
    transform: translateY(-1px);
}

.guardian-notification-card.is-unread {
    background: rgba(249, 253, 252, 0.98);
    box-shadow: 0 9px 22px rgba(15, 23, 42, 0.045);
}

.guardian-notification-card-critical {
    border-left-color: var(--rust);
}

.guardian-notification-card-warning {
    border-left-color: var(--gold);
}

.guardian-notification-card-assessment {
    border-left-color: var(--teal);
}

.guardian-notification-card-critical .guardian-notification-card-icon {
    background: rgba(192, 94, 58, 0.11);
    color: var(--rust);
}

.guardian-notification-card-warning .guardian-notification-card-icon {
    background: rgba(201, 168, 76, 0.14);
    color: #806212;
}

.guardian-notification-card-copy,
.guardian-notification-card-copy > strong,
.guardian-notification-detail {
    display: block;
    min-width: 0;
    overflow-wrap: anywhere;
}

.guardian-notification-card-copy > strong {
    font-size: 0.96rem;
    line-height: 1.4;
}

.guardian-notification-detail {
    color: var(--mid);
    font-size: 0.82rem;
    line-height: 1.52;
    margin-top: 0.25rem;
}

.guardian-notification-card-meta,
.guardian-notification-card-status {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem 0.75rem;
    justify-content: space-between;
}

.guardian-notification-card-meta {
    color: var(--mid);
    font-family: var(--font-mono, monospace);
    font-size: 0.62rem;
    letter-spacing: 0.08em;
    margin-bottom: 0.3rem;
    text-transform: uppercase;
}

.guardian-notification-card-status {
    margin-top: 0.55rem;
}

.guardian-notification-new,
.guardian-notification-action {
    align-items: center;
    display: inline-flex;
    font-size: 0.76rem;
    font-weight: 800;
    gap: 0.35rem;
}

.guardian-notification-new {
    color: var(--rust);
}

.guardian-notification-new > span {
    background: currentColor;
    border-radius: 999px;
    height: 7px;
    width: 7px;
}

.guardian-notification-action {
    color: var(--teal-dark);
    margin-left: auto;
}

@media (max-width: 620px) {
    .guardian-notification-toolbar,
    .guardian-notification-toolbar form,
    .guardian-notification-toolbar .button {
        width: 100%;
    }

    .guardian-notification-hero .school-hero-actions {
        display: none;
    }

    .guardian-notification-toolbar {
        align-items: stretch;
        bottom: var(--workspace-mobile-nav-clearance, 6.5rem);
        flex-direction: column;
        position: sticky;
        z-index: 20;
    }

    .guardian-notification-toolbar .button {
        justify-content: center;
        min-height: 48px;
    }

    .guardian-notification-section {
        padding: 1rem;
    }

    .guardian-notification-card {
        gap: 0.65rem;
        grid-template-columns: auto minmax(0, 1fr);
        padding: 0.8rem;
    }

    .guardian-notification-card-icon {
        border-radius: 12px;
        height: 40px;
        width: 40px;
    }

    .guardian-notification-card-meta {
        align-items: flex-start;
        flex-direction: column;
        gap: 0.2rem;
    }
}

*,
*::before,
*::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: "DM Sans", sans-serif;
    background: var(--off-white);
    color: var(--ink);
    overflow-x: hidden;
}

html,
body,
.sidebar,
.sidebar-body,
.table-wrap,
.notif-dropdown,
.notif-dropdown-list,
.nav-user-dropdown {
    scrollbar-width: thin;
    scrollbar-color: transparent transparent;
}

html:hover,
body:hover,
.sidebar:hover,
.sidebar-body:hover,
.table-wrap:hover,
.notif-dropdown:hover,
.notif-dropdown-list:hover,
.nav-user-dropdown:hover,
html:focus-within,
body:focus-within,
.sidebar:focus-within,
.sidebar-body:focus-within,
.table-wrap:focus-within,
.notif-dropdown:focus-within,
.notif-dropdown-list:focus-within,
.nav-user-dropdown:focus-within {
    scrollbar-color: var(--scroll-thumb) var(--scroll-track);
}

html::-webkit-scrollbar,
body::-webkit-scrollbar,
.sidebar::-webkit-scrollbar,
.sidebar-body::-webkit-scrollbar,
.table-wrap::-webkit-scrollbar,
.notif-dropdown::-webkit-scrollbar,
.notif-dropdown-list::-webkit-scrollbar,
.nav-user-dropdown::-webkit-scrollbar {
    width: 11px;
    height: 11px;
}

html::-webkit-scrollbar-track,
body::-webkit-scrollbar-track,
.sidebar::-webkit-scrollbar-track,
.sidebar-body::-webkit-scrollbar-track,
.table-wrap::-webkit-scrollbar-track,
.notif-dropdown::-webkit-scrollbar-track,
.notif-dropdown-list::-webkit-scrollbar-track,
.nav-user-dropdown::-webkit-scrollbar-track {
    background: transparent;
}

html::-webkit-scrollbar-thumb,
body::-webkit-scrollbar-thumb,
.sidebar::-webkit-scrollbar-thumb,
.sidebar-body::-webkit-scrollbar-thumb,
.table-wrap::-webkit-scrollbar-thumb,
.notif-dropdown::-webkit-scrollbar-thumb,
.notif-dropdown-list::-webkit-scrollbar-thumb,
.nav-user-dropdown::-webkit-scrollbar-thumb {
    background: transparent;
    border-radius: 999px;
    border: 3px solid transparent;
    background-clip: padding-box;
}

html:hover::-webkit-scrollbar-thumb,
body:hover::-webkit-scrollbar-thumb,
.sidebar:hover::-webkit-scrollbar-thumb,
.sidebar-body:hover::-webkit-scrollbar-thumb,
.table-wrap:hover::-webkit-scrollbar-thumb,
.notif-dropdown:hover::-webkit-scrollbar-thumb,
.notif-dropdown-list:hover::-webkit-scrollbar-thumb,
.nav-user-dropdown:hover::-webkit-scrollbar-thumb,
html:focus-within::-webkit-scrollbar-thumb,
body:focus-within::-webkit-scrollbar-thumb,
.sidebar:focus-within::-webkit-scrollbar-thumb,
.sidebar-body:focus-within::-webkit-scrollbar-thumb,
.table-wrap:focus-within::-webkit-scrollbar-thumb,
.notif-dropdown:focus-within::-webkit-scrollbar-thumb,
.notif-dropdown-list:focus-within::-webkit-scrollbar-thumb,
.nav-user-dropdown:focus-within::-webkit-scrollbar-thumb {
    background: var(--scroll-thumb);
}

html::-webkit-scrollbar-thumb:hover,
body::-webkit-scrollbar-thumb:hover,
.sidebar::-webkit-scrollbar-thumb:hover,
.sidebar-body::-webkit-scrollbar-thumb:hover,
.table-wrap::-webkit-scrollbar-thumb:hover,
.notif-dropdown::-webkit-scrollbar-thumb:hover,
.notif-dropdown-list::-webkit-scrollbar-thumb:hover,
.nav-user-dropdown::-webkit-scrollbar-thumb:hover,
html::-webkit-scrollbar-thumb:active,
body::-webkit-scrollbar-thumb:active,
.sidebar::-webkit-scrollbar-thumb:active,
.sidebar-body::-webkit-scrollbar-thumb:active,
.table-wrap::-webkit-scrollbar-thumb:active,
.notif-dropdown::-webkit-scrollbar-thumb:active,
.notif-dropdown-list::-webkit-scrollbar-thumb:active,
.nav-user-dropdown::-webkit-scrollbar-thumb:active {
    background: var(--scroll-thumb-strong);
}

html::-webkit-scrollbar-corner,
body::-webkit-scrollbar-corner,
.sidebar::-webkit-scrollbar-corner,
.sidebar-body::-webkit-scrollbar-corner,
.table-wrap::-webkit-scrollbar-corner,
.notif-dropdown::-webkit-scrollbar-corner,
.notif-dropdown-list::-webkit-scrollbar-corner,
.nav-user-dropdown::-webkit-scrollbar-corner {
    background: var(--scroll-corner);
}

a {
    text-decoration: none;
    color: inherit;
}

button,
input,
textarea,
select {
    font-family: inherit;
}

img {
    max-width: 100%;
    display: block;
}

[hidden] {
    display: none !important;
}

.container {
    width: min(1200px, calc(100vw - 3rem));
    margin: 0 auto;
}

.site-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 200;
}

.top-nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.1rem 0;
    background: rgba(245, 240, 232, 0.92);
    backdrop-filter: blur(14px);
    border-bottom: 1px solid var(--border);
}

.brand {
    display: inline-flex;
    align-items: center;
    gap: 0.8rem;
    min-width: 0;
}

.brand img {
    width: 46px;
    height: 46px;
    object-fit: contain;
    flex-shrink: 0;
}

.brand span {
    display: grid;
    gap: 0.12rem;
}

.nav-logo strong,
.sidebar-logo strong,
.footer-brand strong {
    font-family: "Playfair Display", serif;
    font-size: 1.25rem;
    font-weight: 900;
    letter-spacing: -0.02em;
}

.nav-logo em,
.sidebar-logo em,
.footer-brand em {
    color: var(--teal);
    font-style: normal;
}

.nav-logo small,
.footer-brand small,
.sidebar-logo small {
    font-size: 0.72rem;
    color: var(--mid);
}

.nav-links {
    display: flex;
    align-items: center;
    gap: 2rem;
}

.nav-links a {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.87rem;
    font-weight: 500;
    color: var(--mid);
    transition: color 0.2s;
}

.nav-links a:hover,
.nav-links a.active {
    color: var(--teal);
}

.nav-auth {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.nav-auth-link {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    min-height: 2.45rem;
    padding: 0.55rem 0.85rem;
    border-radius: 999px;
    color: var(--mid);
    font-size: 0.84rem;
    font-weight: 800;
    text-decoration: none;
    transition: color 0.2s ease, background 0.2s ease, transform 0.2s ease;
}

.nav-auth-link:hover,
.nav-auth-link:focus-visible {
    color: var(--teal);
    background: rgba(26, 107, 107, 0.07);
    transform: translateY(-1px);
}

.nav-auth-link.is-primary {
    color: var(--teal);
    background: rgba(232, 244, 244, 0.82);
}

.nav-auth-link.is-primary:hover,
.nav-auth-link.is-primary:focus-visible {
    color: var(--ink);
    background: rgba(232, 201, 122, 0.24);
}

.nav-user-menu {
    position: relative;
}

.nav-user-card {
    display: inline-flex;
    align-items: center;
    gap: 0.7rem;
    min-width: 0;
    padding: 0.35rem 0.6rem 0.35rem 0.35rem;
    border: 1px solid rgba(26, 107, 107, 0.15);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.92);
    transition: border-color 0.2s, box-shadow 0.2s, transform 0.2s;
}

.nav-user-trigger {
    cursor: pointer;
}

.nav-user-card:hover,
.nav-user-card:focus-visible {
    border-color: rgba(26, 107, 107, 0.3);
    box-shadow: 0 10px 24px rgba(26, 107, 107, 0.08);
    transform: translateY(-1px);
}

.nav-user-avatar {
    width: 38px;
    height: 38px;
    border-radius: 999px;
    overflow: hidden;
    flex-shrink: 0;
    background: rgba(26, 107, 107, 0.08);
}

.nav-user-avatar img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.nav-user-copy {
    display: grid;
    min-width: 0;
}

.nav-user-copy strong {
    color: var(--ink);
    font-size: 0.84rem;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 150px;
}

.nav-user-copy small {
    color: var(--mid);
    font-size: 0.72rem;
    line-height: 1.2;
}

.nav-user-caret {
    color: var(--mid);
    font-size: 0.78rem;
}

.nav-user-menu.open .nav-user-caret {
    transform: rotate(180deg);
}

.nav-user-dropdown {
    display: none;
    position: absolute;
    top: calc(100% + 0.55rem);
    right: 0;
    min-width: 200px;
    padding: 0.45rem;
    border: 1px solid rgba(26, 107, 107, 0.14);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.98);
    box-shadow: 0 18px 40px rgba(13, 13, 13, 0.12);
    gap: 0.25rem;
    z-index: 25;
}

.nav-user-menu.open .nav-user-dropdown {
    display: grid;
}

.nav-user-dropdown-link {
    display: inline-flex;
    align-items: center;
    gap: 0.7rem;
    padding: 0.8rem 0.85rem;
    border-radius: 10px;
    color: var(--ink);
    font-size: 0.84rem;
    font-weight: 600;
    transition: background 0.2s, color 0.2s;
}

.nav-user-dropdown-link:hover,
.nav-user-dropdown-link:focus-visible {
    background: rgba(26, 107, 107, 0.08);
    color: var(--teal);
}

.nav-user-dropdown-link.danger:hover,
.nav-user-dropdown-link.danger:focus-visible {
    background: rgba(177, 59, 48, 0.08);
    color: #b13b30;
}

.button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.7rem 1.6rem;
    border-radius: 3px;
    font-size: 0.87rem;
    font-weight: 600;
    letter-spacing: 0.03em;
    border: none;
    transition:
        transform 0.18s ease,
        box-shadow 0.22s ease,
        background-color 0.22s ease,
        border-color 0.22s ease,
        color 0.22s ease,
        opacity 0.22s ease;
    cursor: pointer;
    will-change: transform;
}

.button:hover,
.button:focus-visible {
    transform: translateY(-1px);
}

.button:focus-visible {
    outline: 3px solid rgba(201, 168, 76, 0.42);
    outline-offset: 2px;
    box-shadow: 0 0 0 3px rgba(15, 76, 92, 0.18);
}

.button:active {
    transform: translateY(0) scale(0.985);
}

.button:disabled,
.button[disabled] {
    cursor: not-allowed;
    transform: none;
}

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

.button-primary,
.button-primary i,
.button-primary span {
    color: #fff;
}

.button-primary:hover,
.button-primary:focus-visible {
    background: #155f60;
    color: #fff;
    box-shadow: 0 6px 20px rgba(26, 107, 107, 0.3);
}

.button-primary:hover i,
.button-primary:hover span,
.button-primary:focus-visible i,
.button-primary:focus-visible span {
    color: #fff;
}

.button-secondary {
    background: transparent;
    border: 1.5px solid var(--ink);
    color: var(--ink);
}

.button-secondary:hover,
.button-secondary:focus-visible {
    background: var(--ink);
    color: var(--cream);
}

.button-secondary:hover i,
.button-secondary:hover span,
.button-secondary:focus-visible i,
.button-secondary:focus-visible span {
    color: var(--cream);
}

.button-secondary.light {
    border-color: rgba(255, 255, 255, 0.4);
    color: #fff;
    transition:
        transform 0.18s ease,
        box-shadow 0.22s ease,
        border-color 0.22s ease,
        opacity 0.22s ease;
}

.button-secondary.light,
.button-secondary.light i,
.button-secondary.light span {
    color: #fff;
}

.button-secondary.light:hover,
.button-secondary.light:focus-visible {
    background: var(--teal);
    color: #fff;
}

.button-small {
    padding: 0.45rem 1rem;
    font-size: 0.78rem;
    min-height: 44px;
}

.full {
    width: 100%;
}

.mobile-nav-toggle {
    display: none;
    align-items: center;
    gap: 0.55rem;
    padding: 0.55rem 0.85rem;
    border-radius: 3px;
    border: 1.5px solid var(--border);
    background: #fff;
    font-size: 0.8rem;
    font-weight: 600;
    cursor: pointer;
}

.mobile-nav-toggle-icon {
    display: inline-grid;
    gap: 0.22rem;
    width: 1.05rem;
}

.mobile-nav-toggle-icon span {
    display: block;
    height: 2px;
    border-radius: 999px;
    background: currentColor;
    transition: transform 0.2s ease, opacity 0.2s ease;
}

.mobile-nav-toggle[aria-expanded="true"] .mobile-nav-toggle-icon span:nth-child(1) {
    transform: translateY(5px) rotate(45deg);
}

.mobile-nav-toggle[aria-expanded="true"] .mobile-nav-toggle-icon span:nth-child(2) {
    opacity: 0;
}

.mobile-nav-toggle[aria-expanded="true"] .mobile-nav-toggle-icon span:nth-child(3) {
    transform: translateY(-5px) rotate(-45deg);
}

.hero-section,
.page-hero {
    padding: 8rem 0 4rem;
}

.page-hero {
    position: relative;
    overflow: hidden;
}

.page-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse 44% 66% at 82% 22%, rgba(26, 107, 107, 0.08) 0%, transparent 70%),
        radial-gradient(ellipse 38% 58% at 12% 78%, rgba(201, 168, 76, 0.08) 0%, transparent 60%);
    pointer-events: none;
}

.hero-section {
    min-height: 100vh;
    position: relative;
    overflow: hidden;
}

.hero-section::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse 60% 80% at 70% 50%, rgba(26, 107, 107, 0.07) 0%, transparent 70%),
        radial-gradient(ellipse 40% 60% at 20% 80%, rgba(201, 168, 76, 0.09) 0%, transparent 60%);
}

.hero-grid,
.two-column,
.detail-grid,
.contact-grid,
.auth-grid,
.lesson-layout,
.cta-panel {
    display: grid;
    gap: 2rem;
}

.hero-grid {
    grid-template-columns: 1fr 1fr;
    align-items: center;
    position: relative;
    z-index: 2;
}

.page-hero {
    padding-top: 8.5rem;
}

.page-hero .container,
.auth-section .container {
    position: relative;
    z-index: 1;
}

.eyebrow,
.eyebrow-inline {
    font-family: "Space Mono", monospace;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.15em;
    color: var(--teal);
    text-transform: uppercase;
    margin-bottom: 1.2rem;
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
}

.eyebrow::before,
.eyebrow-inline::before {
    content: "";
    width: 2rem;
    height: 2px;
    background: currentColor;
    display: block;
}

.eyebrow-inline.light {
    color: var(--gold-light);
}

h1,
h2,
h3,
h4 {
    font-family: "Playfair Display", serif;
    letter-spacing: -0.02em;
}

h1 {
    font-size: clamp(2.6rem, 4.5vw, 4.2rem);
    font-weight: 900;
    line-height: 1.1;
    margin-bottom: 1.4rem;
}

h2 {
    font-size: clamp(1.9rem, 3vw, 2.8rem);
    font-weight: 900;
    line-height: 1.2;
    margin-bottom: 1rem;
}

h3 {
    font-size: 1.08rem;
    margin-bottom: 0.55rem;
}

h4 {
    font-size: 1rem;
}

.lead,
.section-heading p,
.content-panel p,
.auth-copy p,
.contact-side p {
    font-size: 1rem;
    line-height: 1.75;
    color: var(--mid);
}

.lead {
    max-width: 520px;
}

.lead.narrow {
    max-width: 620px;
}

.button-row {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
    align-items: center;
}

.hero-section .button-row {
    margin-top: 2rem;
}

.stat-grid.compact {
    display: flex;
    gap: 1.5rem;
    margin-top: 2.4rem;
    padding-top: 1.8rem;
    border-top: 1px solid var(--border);
}

.stat-grid.compact .stat-card {
    background: transparent;
    border: none;
    padding: 0;
    box-shadow: none;
}

.stat-card strong {
    font-family: "Playfair Display", serif;
    font-size: 1.8rem;
    font-weight: 700;
    display: block;
}

.stat-card span {
    font-size: 0.78rem;
    color: var(--mid);
    margin-top: 0.15rem;
    display: block;
}

.hero-card,
.course-card,
.plan-card,
.testimonial-card,
.content-panel,
.benefit-card,
.info-card,
.auth-card,
.stat-card {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 6px;
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.08);
}

.hero-card {
    max-width: 420px;
    margin-left: auto;
    padding: 1.5rem;
    position: relative;
}

.hero-card::before {
    content: "";
    position: absolute;
    top: -14px;
    right: -12px;
    width: 92%;
    height: 100%;
    background: var(--teal);
    border-radius: 8px;
    z-index: -1;
    opacity: 0.12;
}

.hero-card p {
    color: var(--mid);
    font-size: 0.85rem;
    line-height: 1.6;
}

.status-pill,
.pill {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.22rem 0.65rem;
    border-radius: 2px;
    font-family: "Space Mono", monospace;
    font-size: 0.65rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    line-height: 1.35;
    white-space: normal;
    overflow-wrap: anywhere;
}

.pill {
    background: rgba(26, 107, 107, 0.14);
    color: var(--brand-700);
}

.status-pill-success {
    background: rgba(122, 173, 138, 0.2);
    color: var(--sage);
}

.status-pill-info {
    background: rgba(26, 107, 107, 0.16);
    color: var(--teal);
}

.status-pill-warning {
    background: rgba(0, 0, 0, 0.08);
    color: var(--mid);
}

.status-pill-error {
    background: rgba(185, 67, 47, 0.12);
    color: #a23c2c;
}

.tutor-application-queue-grid {
    margin-bottom: 1.5rem;
}

.tutor-application-list {
    display: grid;
    gap: 0.85rem;
    margin-top: 1.2rem;
}

.tutor-application-row {
    display: grid;
    grid-template-columns: minmax(220px, 1.05fr) minmax(190px, 0.8fr) minmax(150px, 0.58fr) minmax(320px, 1.35fr);
    gap: 1rem;
    align-items: start;
    padding: 1rem;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(246, 249, 248, 0.9));
    border: 1px solid var(--border);
    border-left: 4px solid rgba(26, 107, 107, 0.55);
    border-radius: 14px;
}

.tutor-application-row.status-suspended,
.tutor-application-row.status-rejected {
    border-left-color: rgba(185, 67, 47, 0.7);
}

.tutor-application-main,
.tutor-application-meta,
.tutor-application-detail,
.tutor-application-decision-form {
    min-width: 0;
}

.tutor-application-main {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.tutor-application-avatar {
    display: inline-flex;
    width: 42px;
    height: 42px;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    border-radius: 50%;
    background: rgba(26, 107, 107, 0.12);
    color: var(--teal);
    font-weight: 800;
}

.tutor-application-main div,
.tutor-application-meta,
.tutor-application-detail {
    display: grid;
    gap: 0.3rem;
}

.tutor-application-main span,
.tutor-application-main small,
.tutor-application-meta small,
.tutor-application-detail span,
.tutor-application-closed {
    color: var(--mid);
    font-size: 0.78rem;
    overflow-wrap: anywhere;
}

.tutor-application-warning {
    color: #a23c2c !important;
    font-weight: 700;
}

.tutor-application-decision-form {
    display: grid;
    grid-template-columns: minmax(125px, 0.55fr) minmax(160px, 1fr);
    gap: 0.65rem;
}

.tutor-application-decision-form label {
    display: grid;
    gap: 0.25rem;
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--mid);
}

.tutor-application-decision-form select,
.tutor-application-decision-form textarea {
    width: 100%;
    font: inherit;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: #fff;
    padding: 0.55rem 0.65rem;
}

.tutor-application-decision-form textarea {
    resize: vertical;
    min-height: 48px;
}

.tutor-application-decision-form .button-row {
    grid-column: 1 / -1;
    margin: 0;
}

@media (max-width: 1180px) {
    .tutor-application-row {
        grid-template-columns: minmax(220px, 1fr) minmax(190px, 0.75fr) minmax(300px, 1.1fr);
    }

    .tutor-application-detail {
        grid-column: 1 / 2;
    }
}

@media (max-width: 760px) {
    .tutor-application-row,
    .tutor-application-decision-form {
        grid-template-columns: 1fr;
    }

    .tutor-application-detail,
    .tutor-application-decision-form .button-row {
        grid-column: auto;
    }
}

.stack-list,
.feature-list {
    list-style: none;
    margin-top: 1rem;
}

.stack-list li,
.feature-list li {
    padding: 0.75rem 0;
    border-bottom: 1px solid var(--border);
    font-size: 0.84rem;
    color: var(--mid);
}

.stack-list li strong,
.feature-list li strong {
    color: var(--ink);
}

.stack-list li.active-item {
    color: var(--teal);
    font-weight: 600;
}

.stack-list li.muted-item {
    opacity: 0.5;
}

.section {
    padding: 6rem 0;
}

.muted-section {
    background: var(--cream);
}

.dark-section {
    background: var(--ink);
    color: var(--cream);
}

.dark-section .eyebrow-inline,
.dark-section .eyebrow-inline::before,
.cta-band .eyebrow-inline,
.cta-band .eyebrow-inline::before {
    color: var(--gold-light);
}

.dark-section h2,
.dark-section h3,
.dark-section p,
.dark-section .text-link,
.testimonial-card strong,
.testimonial-card span {
    color: var(--cream);
}

.dark-section .section-heading p {
    color: rgba(245, 240, 232, 0.6);
}

.section-heading {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 2rem;
    margin-bottom: 3rem;
}

.section-heading.center {
    justify-content: center;
    text-align: center;
}

.section-heading.center > * {
    max-width: 780px;
}

.feature-grid,
.card-grid,
.benefit-grid,
.testimonial-grid,
.plan-grid,
.info-grid,
.dashboard-stat-grid,
.dashboard-grid {
    display: grid;
    gap: 1.5rem;
}

.feature-grid,
.card-grid,
.benefit-grid,
.testimonial-grid,
.info-grid,
.plan-grid {
    grid-template-columns: repeat(3, 1fr);
}

.plan-grid.four {
    grid-template-columns: repeat(4, 1fr);
}

.feature-grid {
    gap: 1.5px;
    background: rgba(245, 240, 232, 0.1);
    border: 1.5px solid rgba(245, 240, 232, 0.1);
}

.feature-card {
    background: var(--ink);
    padding: 2.2rem 1.8rem;
    border: none;
    border-radius: 0;
    box-shadow: none;
    transition: background 0.3s;
}

.feature-card:hover {
    background: #1c1c1c;
}

.feature-card h3 {
    color: var(--cream);
    font-size: 1.1rem;
}

.feature-card p {
    font-size: 0.87rem;
    line-height: 1.7;
    color: rgba(245, 240, 232, 0.58);
}

.feature-card small {
    color: var(--gold);
    opacity: 0.8;
    display: inline-block;
    margin-top: 0.9rem;
}

.feature-icon {
    width: 48px;
    height: 48px;
    border-radius: 4px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    margin-bottom: 1.3rem;
    background: rgba(201, 168, 76, 0.15);
    color: var(--cream);
    font-family: "Space Mono", monospace;
}

.course-card,
.plan-card,
.testimonial-card,
.content-panel,
.benefit-card,
.info-card,
.auth-card,
.stat-card {
    padding: 1.5rem;
}

.course-card:hover,
.plan-card:hover {
    transform: translateY(-4px);
    transition: transform 0.25s, box-shadow 0.25s;
}

.course-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    margin-bottom: 0.8rem;
}

.course-card p {
    font-size: 0.83rem;
    color: var(--mid);
    line-height: 1.6;
}

.meta-pairs {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.8rem;
    margin: 1.1rem 0 1.3rem;
}

.meta-pairs div {
    background: transparent;
    padding: 0;
}

.meta-pairs dt {
    font-family: "Space Mono", monospace;
    font-size: 0.65rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--teal);
    margin-bottom: 0.2rem;
}

.meta-pairs dd {
    font-size: 0.83rem;
    color: var(--mid);
    margin: 0;
}

.course-hero-copy {
    display: grid;
    gap: 0.9rem;
    min-width: 0;
}

.course-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(280px, 0.72fr);
    gap: 1.5rem;
    align-items: start;
}

.course-hero-single {
    grid-template-columns: minmax(0, 1fr);
}

.course-hero-card {
    display: grid;
    gap: 1rem;
    min-width: 0;
}

.course-hero-copy h1,
.course-hero-copy .lead {
    overflow-wrap: anywhere;
    word-break: break-word;
}

.course-student-progress {
    padding: 1rem;
    border: 1px solid var(--border);
    background: rgba(26, 107, 107, 0.05);
    display: grid;
    gap: 0.4rem;
}

.course-student-progress-label,
.course-pathway-card span {
    font-family: "Space Mono", monospace;
    font-size: 0.63rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--teal);
}

.course-student-progress strong {
    font-family: "Playfair Display", serif;
    font-size: 1.8rem;
    line-height: 1;
}

.course-student-progress p,
.course-journey-summary p {
    color: var(--mid);
    margin: 0;
}

.dashboard-page .page-hero {
    padding: 0 0 1rem;
}

.dashboard-page .page-hero::before {
    display: none;
}

.dashboard-page .section {
    padding: 0 0 1.5rem;
}

@media (max-width: 960px) {
    .course-hero {
        grid-template-columns: 1fr;
    }
}

.course-pathway-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    margin-top: 1.2rem;
}

.course-pathway-card {
    padding: 1rem 1.05rem;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.82);
    display: grid;
    gap: 0.35rem;
}

.course-pathway-card strong {
    font-size: 1rem;
    line-height: 1.45;
}

.course-pathway-card p,
.curriculum-card-head p {
    color: var(--mid);
    line-height: 1.65;
}

.curriculum-card-head {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: flex-start;
    margin-bottom: 0.85rem;
}

.course-journey-panel {
    display: grid;
    gap: 1rem;
}

.learner-course-journey-panel {
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.08), transparent 34%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(243, 249, 248, 0.94));
}

.learner-course-journey-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.85rem;
}

.course-journey-summary {
    padding: 1rem;
    border: 1px solid var(--border);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.78);
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.04);
}

.student-curriculum-tree-panel {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.student-curriculum-tree {
    max-height: none;
    overflow: auto;
    padding-right: 0.4rem;
}

.learner-course-journey-grid {
    display: grid;
    gap: 0.85rem;
}

.learner-course-journey-card {
    display: grid;
    gap: 0.28rem;
    padding: 1rem 1.05rem;
    border-radius: 18px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.88);
}

.learner-course-journey-card span {
    font-family: "Space Mono", monospace;
    font-size: 0.66rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--teal);
}

.learner-course-journey-card strong {
    font-size: 1rem;
    line-height: 1.45;
    color: var(--ink);
}

.learner-course-journey-card p {
    margin: 0;
    color: var(--mid);
    line-height: 1.65;
    font-size: 0.84rem;
}

.benefit-card p,
.info-card p,
.content-panel p,
.auth-card p {
    font-size: 0.87rem;
}

.plan-card {
    padding: 2.2rem 1.8rem;
}

.plan-card.highlight {
    background: var(--teal);
    color: #fff;
    border-color: var(--teal);
    transform: scale(1.02);
}

.plan-card.highlight:hover {
    transform: scale(1.02) translateY(-3px);
}

.plan-card .pill {
    background: transparent;
    padding: 0;
    color: var(--gold);
}

.plan-card.highlight .pill {
    color: #fff;
}

.price {
    font-family: "Playfair Display", serif;
    font-size: 2.6rem;
    font-weight: 900;
    line-height: 1;
    margin: 0.8rem 0 1rem;
}

.price small {
    font-family: "DM Sans", sans-serif;
    font-size: 0.85rem;
    font-weight: 400;
    opacity: 0.72;
}

.pricing-plan-card {
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
}

.pricing-plan-top,
.pricing-plan-actions,
.pricing-school-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.pricing-plan-icon {
    width: 42px;
    height: 42px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(26, 107, 107, 0.08);
    color: var(--teal);
    flex-shrink: 0;
}

.plan-card.highlight .pricing-plan-icon {
    background: rgba(255, 255, 255, 0.16);
    color: #fff;
}

.pricing-best-for {
    color: var(--teal);
    font-size: 0.88rem;
    line-height: 1.6;
}

.plan-card.highlight .pricing-best-for {
    color: rgba(255, 255, 255, 0.82);
}

.pricing-plan-note {
    display: flex;
    align-items: flex-start;
    gap: 0.65rem;
    margin-top: auto;
    padding-top: 0.35rem;
    font-size: 0.8rem;
    line-height: 1.6;
    color: var(--mid);
}

.pricing-plan-note i {
    color: var(--gold);
    margin-top: 0.15rem;
}

.plan-card.highlight .pricing-plan-note,
.plan-card.highlight .pricing-plan-note i {
    color: rgba(255, 255, 255, 0.86);
}

.plan-card.highlight .feature-list li {
    color: rgba(255, 255, 255, 0.94);
    border-bottom-color: rgba(255, 255, 255, 0.18);
}

.plan-card.highlight .feature-list li strong {
    color: #fff;
}

.plan-card.highlight .button-primary {
    background: transparent;
    border: 1.5px solid #fff;
    color: #fff;
}

.plan-card.highlight .button-primary:hover,
.plan-card.highlight .button-primary:focus-visible {
    background: #fff;
    color: var(--teal);
    box-shadow: none;
}

.pricing-school-layout,
.pricing-compare-row {
    display: grid;
    gap: 1.5rem;
}

.pricing-school-layout {
    grid-template-columns: 1.35fr 0.9fr;
    align-items: stretch;
}

.pricing-school-panel,
.pricing-school-aside {
    padding: 2rem;
}

.premium-school-panel {
    background:
        linear-gradient(135deg, rgba(10, 53, 68, 0.96), rgba(26, 107, 107, 0.95)),
        radial-gradient(circle at top right, rgba(255, 255, 255, 0.12), transparent 38%);
    color: #fff;
    border: none;
    position: relative;
    overflow: hidden;
}

.premium-school-panel::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.03), transparent 40%);
    pointer-events: none;
}

.pricing-school-hero {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1.25rem;
    margin-bottom: 1.4rem;
}

.pricing-school-badge {
    font-family: "Space Mono", monospace;
    font-size: 0.68rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--gold-light);
    border: 1px solid rgba(255, 255, 255, 0.22);
    padding: 0.55rem 0.75rem;
    white-space: nowrap;
}

.premium-school-panel .eyebrow-inline,
.premium-school-panel p,
.premium-school-panel li {
    color: rgba(255, 255, 255, 0.88);
}

.premium-school-panel h2 {
    color: #fff;
}

.pricing-school-list {
    margin-top: 1.2rem;
}

.premium-school-panel .pricing-school-list li {
    color: rgba(255, 255, 255, 0.94);
    border-bottom-color: rgba(255, 255, 255, 0.16);
}

.pricing-school-highlight-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
    margin-bottom: 1.3rem;
}

.pricing-school-highlight-card {
    padding: 1rem;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.12);
    display: grid;
    gap: 0.45rem;
}

.pricing-school-highlight-card span {
    font-family: "Space Mono", monospace;
    font-size: 0.66rem;
    letter-spacing: 0.11em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.68);
}

.pricing-school-highlight-card strong {
    font-size: 0.92rem;
    line-height: 1.65;
    color: #fff;
    font-weight: 600;
}

.pricing-school-highlight-icon {
    width: 40px;
    height: 40px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(232, 201, 122, 0.16);
    color: var(--gold-light);
}

.pricing-school-actions {
    justify-content: flex-start;
    flex-wrap: wrap;
    margin-top: 1.6rem;
}

.pricing-school-meta {
    display: grid;
    gap: 0.9rem;
    margin: 1.35rem 0 1rem;
}

.pricing-school-meta-item {
    padding: 1rem 1.1rem;
    border: 1px solid var(--border);
    background: rgba(255, 255, 255, 0.72);
    border-radius: 4px;
    display: grid;
    gap: 0.3rem;
}

.pricing-school-meta-item span {
    font-family: "Space Mono", monospace;
    font-size: 0.68rem;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: var(--teal);
}

.pricing-school-meta-item strong {
    font-size: 0.95rem;
}

.pricing-school-aside-copy {
    color: var(--mid);
    line-height: 1.7;
}

.button-ghost.light-ghost {
    border-color: rgba(255, 255, 255, 0.32);
    color: #fff;
}

.button-ghost.light-ghost:hover,
.button-ghost.light-ghost:focus-visible {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.5);
    color: #fff;
}

.pricing-school-journey {
    margin-top: 1.75rem;
    display: grid;
    gap: 0.95rem;
}

.pricing-school-journey-step {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.9rem;
    align-items: start;
    padding-top: 0.95rem;
    border-top: 1px solid var(--border);
}

.pricing-school-step {
    width: 40px;
    height: 40px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--teal-pale);
    color: var(--teal);
    font-family: "Space Mono", monospace;
    font-size: 0.72rem;
    font-weight: 700;
}

.pricing-school-journey-step h3 {
    font-size: 1rem;
    margin-bottom: 0.3rem;
}

.pricing-school-journey-step p {
    color: var(--mid);
    font-size: 0.87rem;
    line-height: 1.65;
}

.pricing-compare-shell {
    border: 1px solid var(--border);
    background: var(--card);
}

.pricing-compare-row {
    grid-template-columns: 1.3fr repeat(4, 1fr);
    border-bottom: 1px solid var(--border);
}

.pricing-compare-row:last-child {
    border-bottom: none;
}

.pricing-compare-head {
    background: rgba(26, 107, 107, 0.06);
}

.pricing-compare-feature,
.pricing-compare-plan,
.pricing-compare-value {
    padding: 1rem 1.1rem;
    font-size: 0.88rem;
}

.pricing-compare-feature {
    font-weight: 700;
}

.pricing-compare-plan {
    font-family: "Space Mono", monospace;
    font-size: 0.72rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--teal);
}

.pricing-compare-value {
    border-left: 1px solid var(--border);
    color: var(--mid);
}

.pricing-compare-value.is-strong {
    color: var(--ink);
    font-weight: 600;
}

.pricing-compare-value.is-partial {
    color: var(--rust);
    font-weight: 600;
}

.pricing-compare-value.is-muted {
    color: var(--mid);
}

.pricing-faq-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
}

.pricing-faq-item {
    border: 1px solid var(--border);
    background: var(--card);
    padding: 1.15rem 1.2rem;
}

.pricing-faq-item summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    cursor: pointer;
    list-style: none;
    font-weight: 700;
}

.pricing-faq-item summary::-webkit-details-marker {
    display: none;
}

.pricing-faq-item summary i {
    color: var(--teal);
    transition: transform 0.25s ease;
}

.pricing-faq-item[open] summary i {
    transform: rotate(45deg);
}

.pricing-faq-item p {
    margin-top: 0.95rem;
    color: var(--mid);
    line-height: 1.7;
    font-size: 0.88rem;
}

.testimonial-card {
    background: rgba(245, 240, 232, 0.05);
    border: 1px solid rgba(245, 240, 232, 0.1);
}

.testimonial-card p {
    font-family: "Playfair Display", serif;
    font-size: 1.02rem;
    line-height: 1.75;
    color: rgba(245, 240, 232, 0.88);
    margin-bottom: 1rem;
    font-style: italic;
}

.testimonial-card strong {
    font-size: 0.88rem;
}

.testimonial-card span {
    display: block;
    font-size: 0.76rem;
    color: rgba(245, 240, 232, 0.45);
}

.cta-band {
    background: var(--teal);
    color: #fff;
    padding: 5rem 0;
    text-align: center;
}

.cta-panel {
    display: grid;
    gap: 1.5rem;
}

.cta-panel p {
    color: rgba(255, 255, 255, 0.75);
}

.cta-band .button-row {
    justify-content: center;
}

.mf {
    background: #080808;
    color: rgba(245, 240, 232, 0.55);
    padding: 3.5rem 0 2rem;
}

.foot-grid {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr;
    gap: 3rem;
    padding-bottom: 2.5rem;
    border-bottom: 1px solid rgba(245, 240, 232, 0.1);
    margin-bottom: 1.5rem;
}

.foot-col h4 {
    font-family: "Space Mono", monospace;
    font-size: 0.67rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--cream);
    margin-bottom: 1.1rem;
}

.foot-col a,
.foot-btm {
    font-size: 0.85rem;
    color: rgba(245, 240, 232, 0.45);
    transition: color 0.2s;
    display: block;
    margin-bottom: 0.5rem;
}

.foot-col a:hover {
    color: var(--teal-light);
}

.foot-btm {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1rem;
    font-size: 0.8rem;
}

.text-link {
    color: var(--teal);
    font-weight: 600;
}

.text-link i {
    margin-right: 0.35rem;
}

.ges-action-links {
    display: flex;
    flex-wrap: wrap;
    gap: 0.9rem 1.1rem;
    align-items: center;
    margin-top: 0.85rem;
}

.ges-action-links .text-link,
.ges-action-link-button {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.92rem;
}

.ges-action-links .text-link {
    min-height: 42px;
    padding: 0.55rem 0.75rem;
    border-radius: 999px;
    background: rgba(26, 107, 107, 0.08);
    color: var(--teal);
    line-height: 1;
    text-decoration: none;
}

.ges-action-links .text-link:hover,
.ges-action-links .text-link:focus-visible {
    background: rgba(26, 107, 107, 0.14);
    color: var(--teal-dark);
}

.row-overflow-menu {
    position: relative;
    display: inline-flex;
}

.row-overflow-menu[open] {
    z-index: 12;
}

.row-overflow-trigger {
    list-style: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 2.9rem;
    padding: 0.72rem 1rem;
    border-radius: 12px;
    border: 1px solid rgba(15, 23, 42, 0.12);
    background: rgba(255, 255, 255, 0.96);
    color: var(--ink);
    font-weight: 600;
    cursor: pointer;
    box-shadow: 0 10px 22px rgba(15, 23, 42, 0.06);
    white-space: nowrap;
}

.row-overflow-trigger::-webkit-details-marker {
    display: none;
}

.row-overflow-trigger-small {
    min-height: 2.45rem;
    padding: 0.58rem 0.85rem;
    font-size: 0.92rem;
}

.row-overflow-panel {
    position: absolute;
    top: calc(100% + 0.45rem);
    right: 0;
    min-width: 220px;
    display: grid;
    gap: 0.25rem;
    padding: 0.45rem;
    border-radius: 16px;
    border: 1px solid rgba(15, 23, 42, 0.09);
    background: rgba(255, 255, 255, 0.98);
    box-shadow: 0 18px 40px rgba(15, 23, 42, 0.14);
}

.row-overflow-panel-compact {
    min-width: 200px;
}

.row-overflow-link {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    width: 100%;
    padding: 0.72rem 0.8rem;
    border: 0;
    border-radius: 12px;
    background: transparent;
    color: var(--ink);
    text-decoration: none;
    font-size: 0.94rem;
    text-align: left;
    cursor: pointer;
}

.row-overflow-link:hover,
.row-overflow-link:focus-visible {
    background: rgba(26, 107, 107, 0.08);
    color: var(--teal);
}

.row-overflow-link-danger:hover,
.row-overflow-link-danger:focus-visible {
    background: rgba(185, 67, 47, 0.08);
    color: #b9432f;
}

.row-overflow-form {
    margin: 0;
}

.ges-action-link-button {
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    color: var(--teal);
    font-weight: 600;
}

.ges-action-link-danger {
    color: #8c2f2f;
}

.filter-bar {
    display: grid;
    gap: 1rem;
    margin-bottom: 2rem;
}

.filter-bar input,
.stack-form input,
.stack-form select,
.stack-form textarea,
.dark-panel textarea {
    width: 100%;
    padding: 0.75rem 1rem;
    border: 1.5px solid var(--border);
    border-radius: 3px;
    font-size: 0.9rem;
    background: #fff;
    color: var(--ink);
    transition: border-color 0.2s, box-shadow 0.2s;
    outline: none;
}

.filter-bar input:focus,
.stack-form input:focus,
.stack-form select:focus,
.stack-form textarea:focus,
.dark-panel textarea:focus {
    border-color: var(--teal);
    box-shadow: 0 0 0 3px rgba(26, 107, 107, 0.12);
}

.filter-pills,
.role-picker,
.category-strip {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
}

.filter-pill-button {
    border: none;
    cursor: pointer;
    transition: all 0.2s ease;
}

.filter-pill-button.active,
.filter-pill-button:hover {
    background: var(--teal);
    color: #fff;
}

.discovery-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
    margin-bottom: 2rem;
}

.discovery-card {
    background: rgba(255, 255, 255, 0.92);
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 1.25rem;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.04);
}

.discovery-icon {
    width: 42px;
    height: 42px;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
    font-size: 0.95rem;
    margin-bottom: 0.75rem;
}

.discovery-card h3 {
    margin-bottom: 0.4rem;
}

.discovery-card p {
    font-size: 0.83rem;
    line-height: 1.65;
    color: var(--mid);
}

.catalog-learner-band {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 1.5rem;
    margin-bottom: 1.8rem;
    padding: 1.4rem 1.5rem;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.96), rgba(232, 244, 244, 0.84));
    box-shadow: 0 14px 36px rgba(0, 0, 0, 0.05);
}

.catalog-learner-copy {
    display: grid;
    gap: 0.45rem;
    max-width: 60ch;
    min-width: 0;
}

.catalog-learner-copy h2 {
    margin: 0;
    overflow-wrap: anywhere;
}

.catalog-learner-copy p {
    color: var(--mid);
    line-height: 1.7;
    margin: 0;
}

.catalog-learner-actions {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-self: end;
}

.courses-access-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 0.7rem;
    margin-bottom: 1.25rem;
}

.access-tab-button {
    border: 1px solid rgba(13, 13, 13, 0.12);
    background: rgba(255, 255, 255, 0.9);
    color: var(--mid);
    border-radius: 999px;
    padding: 0.62rem 1rem;
    font-size: 0.8rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
}

.access-tab-button.active,
.access-tab-button:hover {
    background: var(--ink);
    color: var(--cream);
    border-color: var(--ink);
}

.detail-grid,
.contact-grid {
    grid-template-columns: 2fr 1fr;
}

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

.two-column {
    grid-template-columns: 1fr 1fr;
}

.stack-panel,
.contact-side {
    display: grid;
    gap: 1.2rem;
}

.stack-panel {
    min-width: 0;
}

.contact-panel,
.contact-channel-card,
.contact-location-card,
.contact-social-card {
    position: relative;
}

.contact-panel-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1.5rem;
    margin-bottom: 1.5rem;
}

.contact-panel-copy {
    max-width: 52ch;
    color: var(--mid);
    line-height: 1.75;
}

.contact-response-note {
    min-width: 180px;
    padding: 1rem 1.1rem;
    border: 1px solid var(--border);
    background: rgba(26, 107, 107, 0.05);
    display: grid;
    gap: 0.35rem;
}

.contact-response-note span {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-family: "Space Mono", monospace;
    font-size: 0.67rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--teal);
}

.contact-response-note strong {
    font-size: 0.95rem;
}

.contact-prefill-note {
    margin-top: -0.2rem;
    margin-bottom: 0.2rem;
    color: var(--teal);
    font-weight: 600;
}

.mobile-lab-page .mobile-lab-hero {
    background:
        radial-gradient(circle at top right, rgba(20, 73, 168, 0.12), transparent 34%),
        radial-gradient(circle at left center, rgba(201, 168, 76, 0.12), transparent 28%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(245, 240, 232, 0.92));
}

.mobile-lab-page .mobile-lab-hero-grid,
.mobile-lab-page .mobile-lab-readiness-layout {
    display: grid;
    grid-template-columns: 1.05fr 0.95fr;
    gap: 2rem;
    align-items: center;
}

.mobile-lab-page .mobile-lab-hero-copy {
    display: grid;
    gap: 1rem;
}

.mobile-lab-page .mobile-lab-hero-panel {
    background:
        linear-gradient(145deg, rgba(18, 61, 150, 0.96), rgba(26, 107, 107, 0.92));
    color: #fff;
    border-radius: 10px;
    padding: 1.6rem;
    box-shadow: 0 18px 46px rgba(18, 61, 150, 0.18);
    display: grid;
    gap: 1rem;
}

.mobile-lab-page .mobile-lab-hero-panel h3 {
    color: #fff;
    font-size: 1.55rem;
    line-height: 1.28;
    margin: 0;
}

.mobile-lab-page .mobile-lab-hero-panel p {
    color: rgba(255, 255, 255, 0.82);
    font-size: 0.92rem;
    line-height: 1.7;
}

.mobile-lab-page .mobile-lab-hero-badge {
    display: inline-flex;
    width: fit-content;
    padding: 0.45rem 0.7rem;
    border: 1px solid rgba(255, 255, 255, 0.24);
    color: var(--gold-light);
    font-family: "Space Mono", monospace;
    font-size: 0.66rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.mobile-lab-page .mobile-lab-hero-highlights {
    display: grid;
    gap: 0.85rem;
}

.mobile-lab-page .mobile-lab-highlight-item {
    padding: 0.95rem 1rem;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 6px;
    display: grid;
    gap: 0.3rem;
}

.mobile-lab-page .mobile-lab-highlight-item span {
    color: var(--gold-light);
    font-family: "Space Mono", monospace;
    font-size: 0.63rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.mobile-lab-page .mobile-lab-highlight-item strong {
    color: #fff;
    font-size: 0.9rem;
    line-height: 1.55;
}

.mobile-lab-page .mobile-lab-announcement {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    padding: 0.6rem 1rem;
    background: #123d96;
    color: #fff;
    border-radius: 4px;
    font-size: 0.86rem;
    font-weight: 600;
}

.mobile-lab-page .mobile-lab-trust-row {
    display: flex;
    gap: 0.85rem;
    flex-wrap: wrap;
}

.mobile-lab-page .mobile-lab-trust-pill {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.55rem 0.85rem;
    border: 1px solid rgba(18, 61, 150, 0.14);
    background: rgba(255, 255, 255, 0.78);
    font-size: 0.8rem;
    color: #123d96;
    font-weight: 600;
}

.mobile-lab-page .mobile-lab-section-heading {
    align-items: flex-end;
}

.mobile-lab-page .mobile-lab-services-head {
    display: grid;
    grid-template-columns: minmax(80px, 1fr) auto minmax(80px, 1fr);
    gap: 1.5rem;
    align-items: center;
    margin-bottom: 2rem;
    text-align: center;
}

.mobile-lab-page .mobile-lab-services-head p {
    max-width: 700px;
    margin: 0 auto;
    color: var(--mid);
    line-height: 1.7;
}

.mobile-lab-page .mobile-lab-services-head .eyebrow-inline {
    justify-content: center;
}

.mobile-lab-page .mobile-lab-services-line {
    height: 2px;
    background: linear-gradient(90deg, transparent, #123d96, transparent);
}

.mobile-lab-page .mobile-lab-step-card,
.mobile-lab-page .mobile-lab-service-card,
.mobile-lab-page .mobile-lab-benefit-card {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 8px;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.06);
}

.mobile-lab-page .mobile-lab-step-grid,
.mobile-lab-page .mobile-lab-service-grid,
.mobile-lab-page .mobile-lab-benefit-grid {
    display: grid;
    gap: 1.5rem;
}

.mobile-lab-page .mobile-lab-step-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.mobile-lab-page .mobile-lab-service-grid,
.mobile-lab-page .mobile-lab-benefit-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.mobile-lab-page .mobile-lab-step-card,
.mobile-lab-page .mobile-lab-service-card,
.mobile-lab-page .mobile-lab-benefit-card {
    padding: 1.4rem;
}

.mobile-lab-page .mobile-lab-step-card {
    position: relative;
    overflow: hidden;
}

.mobile-lab-page .mobile-lab-step-card::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: linear-gradient(180deg, #123d96, var(--gold));
}

.mobile-lab-page .mobile-lab-service-card {
    text-align: center;
    border-color: rgba(18, 61, 150, 0.18);
}

.mobile-lab-page .mobile-lab-service-card h3 {
    font-size: 1.18rem;
    line-height: 1.2;
    margin-bottom: 0.65rem;
    text-transform: uppercase;
}

.mobile-lab-page .mobile-lab-service-grid .mobile-lab-service-card:nth-child(odd) h3 {
    color: #123d96;
}

.mobile-lab-page .mobile-lab-service-grid .mobile-lab-service-card:nth-child(even) h3 {
    color: #c48b00;
}

.mobile-lab-page .mobile-lab-step-number,
.mobile-lab-page .mobile-lab-service-icon,
.mobile-lab-page .mobile-lab-benefit-icon {
    width: 52px;
    height: 52px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1rem;
}

.mobile-lab-page .mobile-lab-step-number {
    background: rgba(18, 61, 150, 0.12);
    color: #123d96;
    font-family: "Space Mono", monospace;
    font-size: 0.8rem;
    font-weight: 700;
}

.mobile-lab-page .mobile-lab-service-icon {
    background: rgba(201, 168, 76, 0.18);
    color: #b67b00;
    font-size: 1.15rem;
}

.mobile-lab-page .mobile-lab-service-grid .mobile-lab-service-card:nth-child(odd) .mobile-lab-service-icon {
    background: rgba(18, 61, 150, 0.12);
    color: #123d96;
}

.mobile-lab-page .mobile-lab-service-grid .mobile-lab-service-card:nth-child(even) .mobile-lab-service-icon {
    background: rgba(201, 168, 76, 0.18);
    color: #c48b00;
}

.mobile-lab-page .mobile-lab-benefit-icon {
    background: rgba(26, 107, 107, 0.12);
    color: var(--teal);
    font-size: 1.05rem;
}

.mobile-lab-page .mobile-lab-step-card p,
.mobile-lab-page .mobile-lab-service-card p,
.mobile-lab-page .mobile-lab-benefit-card p,
.mobile-lab-page .mobile-lab-readiness-panel p,
.mobile-lab-page .mobile-lab-school-note p {
    color: var(--mid);
    line-height: 1.7;
    font-size: 0.88rem;
}

.mobile-lab-page .mobile-lab-benefit-card {
    background: linear-gradient(180deg, rgba(255,255,255,0.98), rgba(245,240,232,0.88));
}

.mobile-lab-page .mobile-lab-services-section {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(245, 240, 232, 0.94));
}

.mobile-lab-page .mobile-lab-value-strip {
    margin-top: 1.6rem;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    border-top: 1px solid rgba(18, 61, 150, 0.15);
}

.mobile-lab-page .mobile-lab-value-item {
    padding: 1.2rem 1rem 0;
    display: flex;
    align-items: center;
    gap: 0.8rem;
    border-right: 1px solid rgba(18, 61, 150, 0.15);
}

.mobile-lab-page .mobile-lab-value-item:last-child {
    border-right: none;
}

.mobile-lab-page .mobile-lab-value-item strong {
    color: #123d96;
    font-size: 0.95rem;
    line-height: 1.45;
}

.mobile-lab-page .mobile-lab-value-icon {
    width: 54px;
    height: 54px;
    border-radius: 999px;
    border: 2px solid rgba(18, 61, 150, 0.26);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #123d96;
    flex-shrink: 0;
    font-size: 1rem;
}

.mobile-lab-page .mobile-lab-readiness-section {
    background: rgba(245, 240, 232, 0.72);
}

.mobile-lab-page .mobile-lab-readiness-panel,
.mobile-lab-page .mobile-lab-school-note {
    padding: 1.7rem;
}

.mobile-lab-page .mobile-lab-readiness-list {
    display: grid;
    gap: 0.85rem;
    margin-top: 1.2rem;
}

.mobile-lab-page .mobile-lab-readiness-item {
    display: grid;
    gap: 0.28rem;
    padding: 0.95rem 1rem;
    border: 1px solid var(--border);
    background: rgba(255, 255, 255, 0.78);
    border-radius: 4px;
}

.mobile-lab-page .mobile-lab-readiness-item span {
    font-family: "Space Mono", monospace;
    font-size: 0.66rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #123d96;
}

.mobile-lab-page .mobile-lab-school-note {
    background:
        linear-gradient(135deg, rgba(18, 61, 150, 0.96), rgba(26, 107, 107, 0.94));
    color: #fff;
    border: none;
}

.mobile-lab-page .mobile-lab-school-note h3,
.mobile-lab-page .mobile-lab-school-note p {
    color: #fff;
}

.mobile-lab-page .mobile-lab-school-note p {
    color: rgba(255, 255, 255, 0.82);
    margin-bottom: 1.2rem;
}

.mobile-lab-page .mobile-lab-note-actions {
    display: flex;
    gap: 0.9rem;
    flex-wrap: wrap;
}

.mobile-lab-page .mobile-lab-cta-band {
    background:
        linear-gradient(135deg, #123d96, #1a6b6b);
}

.contact-support-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.contact-support-card {
    padding: 1rem;
    border: 1px solid var(--border);
    background: rgba(255, 255, 255, 0.75);
}

.contact-support-card h3 {
    font-size: 0.98rem;
    margin-bottom: 0.4rem;
}

.contact-support-card p {
    color: var(--mid);
    font-size: 0.84rem;
    line-height: 1.7;
}

.contact-support-icon,
.contact-channel-icon,
.contact-social-icon {
    width: 42px;
    height: 42px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(26, 107, 107, 0.08);
    color: var(--teal);
}

.contact-support-icon {
    margin-bottom: 0.85rem;
}

.contact-success-card {
    padding: 1.4rem;
    border: 1px solid rgba(122, 173, 138, 0.28);
    background: rgba(122, 173, 138, 0.08);
    margin-bottom: 1.35rem;
    display: grid;
    gap: 0.75rem;
}

.contact-success-card p {
    color: var(--mid);
    line-height: 1.75;
}

.contact-channel-card {
    display: grid;
    gap: 0.65rem;
}

.contact-channel-link {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--teal);
}

.contact-map-placeholder {
    margin-top: 1rem;
    min-height: 150px;
    border: 1px dashed rgba(26, 107, 107, 0.28);
    background: linear-gradient(135deg, rgba(26, 107, 107, 0.06), rgba(201, 168, 76, 0.09));
    display: grid;
    place-items: center;
    gap: 0.6rem;
    text-align: center;
    color: var(--teal);
    padding: 1rem;
}

.contact-map-placeholder i {
    font-size: 1.5rem;
}

.contact-social-list {
    display: grid;
    gap: 0.75rem;
}

.contact-social-link {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    padding: 0.85rem 0.9rem;
    border: 1px solid var(--border);
    background: rgba(255, 255, 255, 0.72);
    transition: transform 0.2s ease, border-color 0.2s ease;
}

.contact-social-link:hover {
    transform: translateY(-2px);
    border-color: rgba(26, 107, 107, 0.28);
}

.contact-social-link span:last-child {
    display: grid;
    gap: 0.12rem;
}

.contact-social-link strong {
    font-size: 0.9rem;
}

.contact-social-link small {
    color: var(--mid);
    font-size: 0.78rem;
}

.utility-card-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
}

.utility-card {
    height: 100%;
}

.utility-card h2 {
    font-size: 1.35rem;
    margin-bottom: 0.8rem;
}

.utility-card p {
    color: var(--mid);
    line-height: 1.75;
}

.utility-cta-panel {
    display: grid;
    grid-template-columns: 1.2fr auto;
    align-items: center;
    gap: 1.5rem;
    padding: 2rem;
    border: 1px solid var(--border);
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.82), rgba(232, 244, 244, 0.72));
}

.utility-cta-panel p {
    color: var(--mid);
    line-height: 1.75;
}

.utility-cta-actions {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.stack-form {
    display: grid;
    gap: 1rem;
}

.field-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.field-row label,
.stack-form label {
    display: grid;
    gap: 0.45rem;
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--ink);
}

.role-option {
    border: 1.5px solid var(--border);
    border-radius: 4px;
    padding: 0.85rem 0.7rem;
    text-align: center;
    cursor: pointer;
    transition: all 0.2s;
    background: #fff;
    color: var(--ink);
    font-size: 0.8rem;
    font-weight: 600;
}

.role-option:hover,
.role-option.active {
    border-color: var(--teal);
    background: var(--teal-pale);
}

.helper-text {
    margin-top: 1rem;
    font-size: 0.83rem;
    color: var(--mid);
}

.field-error {
    font-size: 0.77rem;
    color: #a13c24;
}

.form-alert {
    padding: 0.9rem 1rem;
    border: 1px solid rgba(161, 60, 36, 0.25);
    background: rgba(192, 94, 58, 0.08);
    color: #7b351e;
    font-size: 0.83rem;
    line-height: 1.6;
}

.form-alert p + p {
    margin-top: 0.35rem;
}

.flash-stack {
    padding-top: 6.4rem;
}

.flash-stack .container {
    display: grid;
    gap: 0.75rem;
}

.flash-message {
    padding: 0.9rem 1rem;
    border-radius: 6px;
    border: 1px solid rgba(13, 13, 13, 0.08);
    background: #fff;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.05);
    font-size: 0.88rem;
}

.flash-success {
    border-color: rgba(122, 173, 138, 0.28);
    background: rgba(122, 173, 138, 0.12);
}

.flash-info {
    border-color: rgba(26, 107, 107, 0.22);
    background: rgba(26, 107, 107, 0.09);
}

.flash-error,
.flash-warning {
    border-color: rgba(192, 94, 58, 0.28);
    background: rgba(192, 94, 58, 0.1);
}

.auth-section {
    padding: 8rem 0 4rem;
}

.auth-grid {
    grid-template-columns: 1fr 1fr;
    align-items: center;
}

.small-row {
    font-size: 0.83rem;
}

.checkbox {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
}

.app-shell {
    display: flex;
    min-height: 100vh;
    background:
        radial-gradient(circle at top left, rgba(26, 107, 107, 0.08), transparent 28%),
        linear-gradient(180deg, #f8f5ef, #f2ede5);
}

.sidebar {
    width: var(--sidebar-w);
    background:
        radial-gradient(circle at top left, rgba(46, 158, 158, 0.16), transparent 26%),
        radial-gradient(circle at bottom right, rgba(201, 168, 76, 0.14), transparent 30%),
        linear-gradient(180deg, #0a0b0f 0%, #0e1015 48%, #0b0c11 100%);
    color: var(--cream);
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    z-index: 100;
    overflow-y: hidden;
    overflow-x: hidden;
    overscroll-behavior: contain;
    scrollbar-gutter: auto;
    border-right: 1px solid rgba(255, 255, 255, 0.05);
    box-shadow: 22px 0 60px rgba(0, 0, 0, 0.28);
    will-change: width, transform;
    transition: width var(--sidebar-motion-duration) var(--sidebar-motion-ease), transform var(--sidebar-motion-duration) var(--sidebar-motion-ease), box-shadow 180ms ease;
}

.sidebar::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.04), transparent 22%, transparent 78%, rgba(255, 255, 255, 0.02)),
        linear-gradient(135deg, rgba(255, 255, 255, 0.02), transparent 30%);
    pointer-events: none;
}

.sidebar-shell {
    position: relative;
    z-index: 1;
    min-height: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    gap: 0.95rem;
    padding: 1rem 0.95rem max(1.5rem, env(safe-area-inset-bottom));
    transition: padding var(--sidebar-motion-duration) var(--sidebar-motion-ease), gap var(--sidebar-motion-duration) var(--sidebar-motion-ease);
}

.sidebar-topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    transition: gap var(--sidebar-motion-duration) var(--sidebar-motion-ease), transform var(--sidebar-motion-duration) var(--sidebar-motion-ease);
}

.sidebar-topbar-brand {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 0.78rem;
    transition: transform var(--sidebar-motion-duration) var(--sidebar-motion-ease), gap var(--sidebar-motion-duration) var(--sidebar-motion-ease);
}

.sidebar-mini-brand {
    width: 48px;
    height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    overflow: hidden;
    transition: transform var(--sidebar-motion-duration) var(--sidebar-motion-ease), width var(--sidebar-motion-duration) var(--sidebar-motion-ease), height var(--sidebar-motion-duration) var(--sidebar-motion-ease);
}

.sidebar-mini-brand img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

.sidebar-topbar-copy {
    min-width: 0;
    display: grid;
    gap: 0.12rem;
    overflow: hidden;
    transform-origin: left center;
    max-height: 72px;
    transition: opacity 120ms ease, transform var(--sidebar-motion-duration) var(--sidebar-motion-ease), max-width var(--sidebar-motion-duration) var(--sidebar-motion-ease), max-height var(--sidebar-motion-duration) var(--sidebar-motion-ease);
    max-width: 210px;
}

.sidebar-topbar-copy strong {
    font-family: "Playfair Display", serif;
    font-size: 1.04rem;
    line-height: 1.08;
    color: var(--cream);
    letter-spacing: -0.02em;
}

.sidebar-topbar-copy small {
    font-family: "Space Mono", monospace;
    font-size: 0.62rem;
    letter-spacing: 0.16em;
    color: rgba(245, 240, 232, 0.5);
}

.sidebar-collapse-btn {
    width: 42px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: rgba(255, 255, 255, 0.05);
    color: rgba(245, 240, 232, 0.82);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: relative;
    cursor: pointer;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
    transition: background 160ms ease, color 160ms ease, border-color 160ms ease, transform var(--sidebar-motion-duration) var(--sidebar-motion-ease), width var(--sidebar-motion-duration) var(--sidebar-motion-ease), height var(--sidebar-motion-duration) var(--sidebar-motion-ease);
}

.sidebar-collapse-btn i {
    position: absolute;
    top: 50%;
    left: 50%;
    line-height: 1;
    transform: translate(-50%, -50%);
    transform-origin: center;
    transition: transform var(--sidebar-motion-duration) var(--sidebar-motion-ease);
}

.sidebar-collapse-btn:hover,
.sidebar-collapse-btn:focus-visible {
    background: rgba(46, 158, 158, 0.16);
    border-color: rgba(46, 158, 158, 0.3);
    color: var(--cream);
    transform: translateY(-1px);
}

.sidebar-panel,
.sidebar-welcome-card,
.sidebar-footer {
    border: 1px solid rgba(255, 255, 255, 0.07);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.03));
    border-radius: 22px;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.05),
        0 18px 40px rgba(0, 0, 0, 0.2);
    transition: opacity 140ms ease, transform var(--sidebar-motion-duration) var(--sidebar-motion-ease), border-color 160ms ease, background 160ms ease;
}

.sidebar-body {
    display: grid;
    grid-auto-rows: max-content;
    gap: 0.9rem;
    min-width: 0;
    min-height: 0;
    flex: 1 1 auto;
    align-content: start;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
    padding-right: 0.15rem;
    padding-bottom: 0.75rem;
    isolation: isolate;
    transition: gap var(--sidebar-motion-duration) var(--sidebar-motion-ease);
}

.legal-hero {
    background:
        radial-gradient(circle at 82% 22%, rgba(204, 164, 61, 0.16), transparent 26rem),
        linear-gradient(135deg, rgba(241, 248, 247, 0.98), rgba(252, 249, 241, 0.96));
}

.legal-document-hero .container {
    display: grid;
    gap: 1rem;
}

.legal-back-link {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    width: fit-content;
    color: var(--teal);
    font-weight: 700;
}

.legal-version-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
}

.legal-version-row span {
    padding: 0.55rem 0.75rem;
    border: 1px solid rgba(26, 107, 107, 0.18);
    background: rgba(255, 255, 255, 0.7);
    color: var(--mid);
    font-family: 'Space Mono', monospace;
    font-size: 0.72rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.legal-document-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.25rem;
}

.legal-document-card {
    display: grid;
    align-content: space-between;
    gap: 1.75rem;
    min-height: 16rem;
}

.legal-document-card h2 {
    margin: 0.6rem 0 0.7rem;
}

.legal-document-card p,
.legal-contact-panel p {
    color: var(--mid);
    line-height: 1.7;
}

.legal-document-card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding-top: 1rem;
    border-top: 1px solid var(--border);
}

.legal-document-card-footer span {
    color: var(--mid);
    font-family: 'Space Mono', monospace;
    font-size: 0.72rem;
    text-transform: uppercase;
}

.legal-reading-container {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(16rem, 21rem);
    align-items: start;
    gap: 1.5rem;
}

.legal-document-copy {
    padding: clamp(1.35rem, 3vw, 3rem);
}

.legal-document-copy p {
    color: var(--ink);
    line-height: 1.85;
    margin: 0 0 1.15rem;
}

.legal-contact-panel {
    position: sticky;
    top: 6.5rem;
    padding: 1.5rem;
    border: 1px solid var(--border);
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.92), rgba(244, 240, 230, 0.9));
}

.legal-contact-panel h2 {
    margin: 0.65rem 0;
    font-size: 1.45rem;
}

.legal-acceptance-panel {
    display: grid;
    gap: 0.65rem;
    padding: 1rem;
    border: 1px solid rgba(26, 107, 107, 0.2);
    background: linear-gradient(145deg, rgba(240, 248, 247, 0.95), rgba(255, 250, 239, 0.9));
}

.legal-acceptance-check {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    gap: 0.75rem !important;
    color: var(--ink);
    font-size: 0.86rem !important;
    line-height: 1.65;
}

.legal-acceptance-check input[type="checkbox"] {
    width: 1.1rem !important;
    min-width: 1.1rem;
    height: 1.1rem;
    margin-top: 0.18rem;
    accent-color: var(--teal);
}

.legal-acceptance-check a {
    color: var(--teal);
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 0.18em;
}

.legal-checkout-form {
    display: grid;
    gap: 1rem;
    margin-top: 1rem;
}

.legal-configuration-alert {
    margin: 0;
}

@media (max-width: 760px) {
    .legal-document-grid,
    .legal-reading-container {
        grid-template-columns: 1fr;
    }

    .legal-document-card {
        min-height: auto;
    }

    .legal-document-card-footer {
        align-items: stretch;
        flex-direction: column;
    }

    .legal-contact-panel {
        position: static;
    }
}

/* Apply the saved sidebar state without replaying an expansion on every page load. */
.app-shell.sidebar-state-pending .sidebar,
.app-shell.sidebar-state-pending .sidebar *,
.app-shell.sidebar-state-pending .app-main {
    transition: none !important;
}

.sidebar.role-student .sidebar-shell {
    gap: 0.8rem;
}

.sidebar.role-student .sidebar-welcome-card,
.sidebar.role-student .sidebar-panel,
.sidebar.role-student .sidebar-footer {
    border-radius: 18px;
}

.sidebar.role-student .sidebar-welcome-card {
    padding: 0.9rem;
}

.sidebar.role-student .sidebar-item {
    padding-top: 0.85rem;
    padding-bottom: 0.85rem;
}

.sidebar.role-student .sidebar-action-list {
    gap: 0.65rem;
}

.sidebar.role-student .sidebar-footer-note {
    font-size: 0.78rem;
}

.sidebar-welcome-card {
    padding: 0.85rem 1rem;
    transition: opacity 0.22s ease, transform 0.3s ease;
}

.sidebar-welcome-top {
    display: flex;
    align-items: center;
    gap: 0.7rem;
}

.sidebar-welcome-avatar {
    width: 40px;
    height: 40px;
    font-size: 0.92rem;
    background: linear-gradient(135deg, rgba(26, 107, 107, 0.98), rgba(201, 168, 76, 0.88));
    color: #fff;
    box-shadow: 0 10px 20px rgba(13, 13, 13, 0.24);
}

.sidebar-welcome-copy {
    display: grid;
    gap: 0.26rem;
}

.sidebar-welcome-copy strong {
    color: var(--cream);
    font-size: 1.04rem;
    line-height: 1.2;
}

.sidebar-panel {
    padding: 0.85rem;
    transition: opacity 0.22s ease, transform 0.3s ease;
}

.sidebar-label {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    font-family: "Space Mono", monospace;
    font-size: 0.6rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: rgba(245, 240, 232, 0.52);
    padding: 0 0.15rem 0.68rem;
    transition: opacity 0.2s ease, transform 0.28s cubic-bezier(0.2, 0.9, 0.2, 1);
}

.sidebar-label::after {
    content: "";
    height: 1px;
    flex: 1;
    background: linear-gradient(90deg, rgba(245, 240, 232, 0.15), transparent);
}

.sidebar-quick-panel,
.sidebar-tools-panel {
    padding: 0.4rem 0.25rem 0.25rem;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.dashboard-nav {
    display: grid;
    gap: 0.4rem;
    transition: gap 0.34s cubic-bezier(0.2, 0.9, 0.2, 1);
}

[data-school-registration-note][hidden] { display: none; }
[data-student-registration-note][hidden],
[data-registration-password-fields][hidden] { display: none; }

.sidebar-nav-group {
    min-width: 0;
}

.sidebar-nav-group-toggle {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.78rem;
    min-height: 48px;
    padding: 0.42rem 0.55rem;
    border: 1px solid transparent;
    border-radius: 0.75rem;
    color: rgba(245, 240, 232, 0.76);
    cursor: pointer;
    font-size: 0.84rem;
    font-weight: 700;
    list-style: none;
}

.sidebar-nav-group-toggle::-webkit-details-marker { display: none; }
.sidebar-nav-group-toggle::marker { content: ""; }
.sidebar-nav-group-toggle:hover,
.sidebar-nav-group-toggle:focus-visible,
.sidebar-nav-group.has-active-item > .sidebar-nav-group-toggle {
    border-color: rgba(255, 255, 255, 0.08);
    background: rgba(255, 255, 255, 0.07);
    color: var(--cream);
}

.sidebar-nav-group-toggle:focus-visible { outline: 2px solid var(--teal-light); outline-offset: 2px; }
.sidebar-nav-group-copy { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sidebar-nav-group-caret { font-size: 0.7rem; color: rgba(245, 240, 232, 0.55); transition: transform 0.2s ease; }
.sidebar-nav-group[open] > .sidebar-nav-group-toggle .sidebar-nav-group-caret { transform: rotate(180deg); }
.sidebar-nav-group-links { display: grid; gap: 0.2rem; margin: 0.25rem 0 0.3rem 1.05rem; padding-left: 0.45rem; border-left: 1px solid rgba(245, 240, 232, 0.16); }
.sidebar-nav-group:not([open]) .sidebar-nav-group-links { display: none; }
.sidebar-nav-group-links .sidebar-item { min-height: 42px; padding: 0.35rem 0.45rem; font-size: 0.81rem; }
.sidebar-nav-group-links .s-ico { width: 1.9rem; height: 1.9rem; border-radius: 0.58rem; font-size: 0.85rem; }

.sidebar-item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.78rem;
    min-height: 56px;
    padding: 0.72rem 0.78rem;
    font-size: 0.87rem;
    color: rgba(245, 240, 232, 0.68);
    position: relative;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid transparent;
    transition: transform 0.24s ease, background 0.24s ease, color 0.24s ease, border-color 0.24s ease, box-shadow 0.24s ease;
}

.sidebar-item:hover {
    color: var(--cream);
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.08);
    transform: translateX(2px);
}

.sidebar-item.active {
    color: var(--cream);
    background:
        linear-gradient(135deg, rgba(46, 158, 158, 0.2), rgba(46, 158, 158, 0.08)),
        rgba(255, 255, 255, 0.04);
    border-color: rgba(46, 158, 158, 0.2);
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.2);
}

.sidebar-item.active::after {
    content: "";
    position: absolute;
    left: 0.42rem;
    top: 50%;
    transform: translateY(-50%);
    width: 3px;
    height: 24px;
    border-radius: 999px;
    background: linear-gradient(180deg, var(--gold-light), var(--teal-light));
}

.s-ico {
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: relative;
    flex-shrink: 0;
    font-size: 0.96rem;
    background: rgba(255, 255, 255, 0.06);
    color: inherit;
    transition: transform 0.2s ease, background 0.2s ease, color 0.2s ease;
}

.s-ico i {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    line-height: 1;
}

.sidebar-item:hover .s-ico,
.sidebar-item.active .s-ico {
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
    transform: translateY(-1px);
}

.sidebar-item-copy {
    display: grid;
    min-width: 0;
    gap: 0.14rem;
}

.sidebar-item-label {
    display: inline-flex;
    align-items: center;
    min-width: 0;
    line-height: 1.2;
    overflow: hidden;
    white-space: nowrap;
    max-width: 180px;
    transition: opacity 0.2s ease, transform 0.3s cubic-bezier(0.2, 0.9, 0.2, 1), max-width 0.3s cubic-bezier(0.2, 0.9, 0.2, 1);
}

.sidebar-item-arrow {
    color: rgba(245, 240, 232, 0.3);
    font-size: 0.72rem;
    transition: transform 0.2s ease, color 0.2s ease;
}

.sidebar-item:hover .sidebar-item-arrow,
.sidebar-item.active .sidebar-item-arrow {
    color: rgba(245, 240, 232, 0.72);
    transform: translateX(2px);
}

.sidebar-action-list {
    display: grid;
    gap: 0.65rem;
}

.sidebar-action-card {
    display: grid;
    gap: 0.35rem;
    padding: 0.9rem;
    border: 1px solid rgba(255, 255, 255, 0.06);
    background: rgba(255, 255, 255, 0.03);
    border-radius: 18px;
    transition: transform 0.2s ease, background 0.2s ease, border-color 0.2s ease;
}

.sidebar-action-card:hover {
    background: rgba(46, 158, 158, 0.12);
    border-color: rgba(46, 158, 158, 0.26);
    transform: translateY(-1px);
}

.sidebar-action-head {
    display: flex;
    align-items: center;
    gap: 0.55rem;
}

.sidebar-action-icon {
    width: 2rem;
    height: 2rem;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.08);
    color: var(--teal-light);
    flex-shrink: 0;
}

.sidebar-action-title {
    color: var(--cream);
    font-size: 0.83rem;
    font-weight: 600;
}

.sidebar-action-card small {
    color: rgba(245, 240, 232, 0.58);
    font-size: 0.74rem;
    line-height: 1.55;
}

.sidebar-collapsed-shortcuts-panel {
    display: none;
}

.sidebar-collapsed-shortcuts {
    display: grid;
    gap: 0.7rem;
}

.sidebar-collapsed-shortcut {
    width: 100%;
    min-height: 52px;
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: rgba(255, 255, 255, 0.04);
    color: rgba(245, 240, 232, 0.84);
    display: grid;
    place-items: center;
    transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease, color 0.18s ease;
}

.sidebar-collapsed-shortcut:hover {
    transform: translateY(-1px);
    border-color: rgba(198, 161, 74, 0.2);
    background: rgba(198, 161, 74, 0.08);
    color: #fff;
}

.sidebar-collapsed-logout {
    border-color: rgba(212, 90, 76, 0.18);
    background: rgba(212, 90, 76, 0.08);
    color: #ffd7d0;
}

.sidebar-collapsed-logout:hover,
.sidebar-collapsed-logout:focus-visible {
    border-color: rgba(212, 90, 76, 0.34);
    background: rgba(212, 90, 76, 0.15);
    color: #fff;
}

.sidebar-collapsed-shortcut i {
    font-size: 1rem;
}

.sidebar-mini-links {
    display: grid;
    gap: 0.55rem;
}

.sidebar-utility-link {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    min-height: 44px;
    padding: 0.7rem 0.8rem;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.03);
    color: rgba(245, 240, 232, 0.72);
    border: 1px solid rgba(255, 255, 255, 0.05);
    font-size: 0.78rem;
    transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.sidebar-utility-link:hover {
    color: var(--cream);
    background: rgba(255, 255, 255, 0.07);
    border-color: rgba(255, 255, 255, 0.08);
}

.sidebar-footer {
    margin-top: 0;
    padding: 0.78rem 0.85rem;
    display: grid;
    gap: 0.62rem;
    flex-shrink: 0;
    transition: opacity 0.22s ease, transform 0.3s ease;
}

.sidebar-user {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.s-avatar {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--teal), var(--gold));
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.85rem;
    color: #fff;
    flex-shrink: 0;
}

.sidebar-user strong {
    font-size: 0.85rem;
    color: var(--cream);
}

.sidebar-user small {
    font-size: 0.72rem;
    color: rgba(245, 240, 232, 0.45);
}

.sidebar-developer-credit {
    margin: 0;
    padding-top: 0.58rem;
    border-top: 1px solid rgba(255, 255, 255, 0.07);
    color: rgba(245, 240, 232, 0.46);
    font-family: "Space Mono", monospace;
    font-size: 0.56rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.app-main {
    margin-left: var(--sidebar-w);
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    min-width: 0;
    transition: margin-left var(--sidebar-motion-duration) var(--sidebar-motion-ease);
}

.workspace-scroll-region {
    display: contents;
}

.app-shell.sidebar-collapsed .sidebar {
    width: var(--sidebar-collapsed-w);
}

.app-shell.sidebar-collapsed .app-main {
    margin-left: var(--sidebar-collapsed-w);
}

.app-shell.sidebar-collapsed .sidebar-topbar {
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    gap: 0.65rem;
}

.app-shell.sidebar-collapsed .sidebar-collapse-btn {
    order: 1;
}

.app-shell.sidebar-collapsed .sidebar-topbar-brand {
    order: 2;
    flex-direction: column;
    justify-content: center;
    gap: 0;
    width: 44px;
    height: 44px;
    border-radius: 13px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 9px 22px rgba(0, 0, 0, 0.24);
    line-height: 0;
}

.app-shell.sidebar-collapsed .sidebar-mini-brand {
    width: 48px;
    height: 48px;
}

.app-shell.sidebar-collapsed .sidebar-topbar-copy,
.app-shell.sidebar-collapsed .sidebar-welcome-card,
.app-shell.sidebar-collapsed .sidebar-quick-panel,
.app-shell.sidebar-collapsed .sidebar-tools-panel,
.app-shell.sidebar-collapsed .sidebar-footer {
    display: none;
}

.app-shell.sidebar-collapsed .sidebar-shell {
    padding-left: 0.55rem;
    padding-right: 0.55rem;
    gap: 0.8rem;
}

.app-shell.sidebar-collapsed .sidebar-body {
    gap: 0;
    padding-right: 0;
    scrollbar-gutter: auto;
    scrollbar-width: none;
}

.app-shell.sidebar-collapsed .sidebar-body::-webkit-scrollbar {
    width: 0;
    height: 0;
}

.app-shell.sidebar-collapsed .sidebar-nav-panel {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    padding: 0.2rem 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.app-shell.sidebar-collapsed .sidebar-collapsed-shortcuts-panel {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    display: grid;
    padding: 0.2rem 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.app-shell.sidebar-collapsed .sidebar-label,
.app-shell.sidebar-collapsed .sidebar-item-copy,
.app-shell.sidebar-collapsed .sidebar-item-arrow,
.app-shell.sidebar-collapsed .sidebar-item::after {
    display: none;
}

.app-shell.sidebar-collapsed .dashboard-nav {
    gap: 0.62rem;
}

.app-shell.sidebar-collapsed .sidebar-collapsed-shortcuts {
    width: 100%;
    gap: 0.62rem;
}

.app-shell.sidebar-collapsed .sidebar-item {
    grid-template-columns: 1fr;
    justify-items: center;
    width: 50px;
    min-height: 50px;
    margin: 0 auto;
    padding: 0;
    border-radius: 16px;
}

.app-shell.sidebar-collapsed .sidebar-item:hover {
    transform: translateY(-1px);
}

.app-shell.sidebar-collapsed .s-ico {
    width: 2.3rem;
    height: 2.3rem;
    font-size: 0.92rem;
}

.app-shell.sidebar-collapsed .sidebar-collapsed-shortcut {
    width: 50px;
    min-height: 50px;
    margin: 0 auto;
    border-radius: 16px;
}

.app-shell.sidebar-collapsed .sidebar-collapse-btn {
    width: 38px;
    height: 38px;
}

.app-shell.sidebar-collapsed .sidebar-mini-brand {
    width: 44px;
    height: 44px;
    border-radius: inherit;
}

.app-shell.sidebar-collapsed .sidebar-mini-brand img {
    width: 40px;
    height: 40px;
}

.app-shell.sidebar-collapsed .sidebar-collapse-btn i {
    transform: translate(-50%, -50%) rotate(180deg);
}

@media (min-width: 901px) {
    .app-shell.sidebar-collapsed .sidebar-nav-group-toggle {
        grid-template-columns: 1fr;
        justify-items: center;
        width: 50px;
        min-height: 50px;
        margin: 0 auto;
        padding: 0;
        border-radius: 16px;
    }
    .app-shell.sidebar-collapsed .sidebar-nav-group-copy,
    .app-shell.sidebar-collapsed .sidebar-nav-group-caret,
    .app-shell.sidebar-collapsed .sidebar-nav-group-links { display: none; }
}

/* Let the expanded sidebar content fold away instead of disappearing abruptly. */
@media (min-width: 901px) {
    .sidebar-welcome-card,
    .sidebar-quick-panel,
    .sidebar-tools-panel,
    .sidebar-footer {
        overflow: hidden;
        opacity: 1;
        transform: translateX(0) scale(1);
        visibility: visible;
        transition:
            max-height var(--sidebar-motion-duration) var(--sidebar-motion-ease),
            margin var(--sidebar-motion-duration) ease,
            padding var(--sidebar-motion-duration) ease,
            opacity 120ms ease,
            transform var(--sidebar-motion-duration) var(--sidebar-motion-ease),
            border-color 140ms ease,
            visibility 0s linear 0s;
    }

    .sidebar-welcome-card {
        max-height: 340px;
    }

    .sidebar-quick-panel {
        max-height: 720px;
    }

    .sidebar-tools-panel {
        max-height: 180px;
    }

    .sidebar-footer {
        max-height: none;
    }

    .sidebar-collapsed-shortcuts-panel {
        display: grid;
        max-height: 0;
        overflow: hidden;
        margin: 0;
        padding: 0;
        border-width: 0;
        opacity: 0;
        transform: translateX(-10px) scale(0.97);
        visibility: hidden;
        pointer-events: none;
        transition:
            max-height var(--sidebar-motion-duration) var(--sidebar-motion-ease),
            margin var(--sidebar-motion-duration) ease,
            padding var(--sidebar-motion-duration) ease,
            opacity 120ms ease,
            transform var(--sidebar-motion-duration) var(--sidebar-motion-ease),
            border-color 140ms ease,
            visibility 0s linear var(--sidebar-motion-duration);
    }

    .sidebar-label {
        display: flex;
        max-height: 2rem;
        overflow: hidden;
        transition:
            max-height 180ms ease,
            padding 180ms ease,
            opacity 100ms ease,
            transform 180ms var(--sidebar-motion-ease);
    }

    .sidebar-item {
        transition:
            width var(--sidebar-motion-duration) var(--sidebar-motion-ease),
            min-height var(--sidebar-motion-duration) var(--sidebar-motion-ease),
            padding var(--sidebar-motion-duration) var(--sidebar-motion-ease),
            gap var(--sidebar-motion-duration) var(--sidebar-motion-ease),
            border-radius var(--sidebar-motion-duration) var(--sidebar-motion-ease),
            transform 0.24s ease,
            background 0.24s ease,
            color 0.24s ease,
            border-color 0.24s ease,
            box-shadow 0.24s ease;
    }

    .app-shell.sidebar-collapsed .sidebar-topbar-copy {
        display: grid;
        opacity: 0;
        transform: translateX(-10px) scale(0.98);
        max-width: 0;
        max-height: 0;
        visibility: hidden;
        pointer-events: none;
    }

    .app-shell.sidebar-collapsed .sidebar-welcome-card,
    .app-shell.sidebar-collapsed .sidebar-quick-panel,
    .app-shell.sidebar-collapsed .sidebar-tools-panel,
    .app-shell.sidebar-collapsed .sidebar-footer {
        display: grid;
        max-height: 0;
        margin: 0;
        padding-top: 0;
        padding-bottom: 0;
        border-width: 0;
        opacity: 0;
        transform: translateX(-10px) scale(0.97);
        visibility: hidden;
        pointer-events: none;
        transition-delay: 0s, 0s, 0s, 0s, 0s, 0s, var(--sidebar-motion-duration);
    }

    .app-shell.sidebar-collapsed .sidebar-collapsed-shortcuts-panel {
        display: grid;
        max-height: 520px;
        margin: 0;
        padding: 0.2rem 0;
        border-width: 0;
        opacity: 1;
        transform: translateX(0) scale(1);
        visibility: visible;
        pointer-events: auto;
        transition-delay: 40ms, 40ms, 40ms, 40ms, 40ms, 40ms, 0s;
    }

    .app-shell.sidebar-collapsed .sidebar-label {
        display: block;
        max-height: 0;
        padding: 0;
        opacity: 0;
        transform: translateX(-6px);
    }

    .app-shell.sidebar-collapsed .sidebar-item-copy,
    .app-shell.sidebar-collapsed .sidebar-item-arrow {
        display: grid;
        position: absolute;
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
    }

    .app-shell.sidebar-collapsed .sidebar-item-copy {
        left: 100%;
        transform: translateX(-8px);
    }

    .app-shell.sidebar-collapsed .sidebar-item-arrow {
        right: 0.7rem;
        transform: translateX(-6px);
    }

    .app-shell.sidebar-collapsed .sidebar-item::after {
        display: block;
        opacity: 0;
        transform: translateY(-50%) scaleY(0.45);
        transition: opacity 0.16s ease, transform 0.26s cubic-bezier(0.2, 0.9, 0.2, 1);
    }
}

/* Family access discovery. */
.auth-access-switcher {
    display: grid;
    gap: 0.6rem;
    margin-bottom: 1.25rem;
    padding-bottom: 1.15rem;
    border-bottom: 1px solid rgba(13, 13, 13, 0.08);
}

.auth-access-switcher > p {
    margin: 0;
    color: var(--mid);
    font-family: "Space Mono", monospace;
    font-size: 0.64rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.auth-access-switcher-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.5rem;
}

.auth-access-option {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.55rem;
    align-items: center;
    min-width: 0;
    min-height: 3.55rem;
    padding: 0.6rem 0.65rem;
    border: 1px solid rgba(13, 13, 13, 0.09);
    border-radius: 15px;
    background: rgba(255, 255, 255, 0.68);
    color: var(--ink);
    transition: transform 0.2s ease, border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
}

.auth-access-option:hover,
.auth-access-option:focus-visible {
    transform: translateY(-2px);
    border-color: rgba(26, 107, 107, 0.28);
    background: #fff;
    box-shadow: 0 12px 24px rgba(13, 13, 13, 0.07);
}

.auth-access-option.is-active {
    border-color: rgba(26, 107, 107, 0.32);
    background: rgba(232, 244, 244, 0.9);
    box-shadow: inset 0 0 0 1px rgba(26, 107, 107, 0.06);
}

.auth-access-option > i {
    display: grid;
    width: 2rem;
    height: 2rem;
    place-items: center;
    border-radius: 10px;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
}

.auth-access-option span,
.auth-access-option strong,
.auth-access-option small {
    display: block;
    min-width: 0;
}

.auth-access-option strong {
    font-size: 0.75rem;
    line-height: 1.25;
}

.auth-access-option small {
    margin-top: 0.15rem;
    color: var(--mid);
    font-size: 0.64rem;
    line-height: 1.25;
}

.nav-auth-link.is-ward {
    border: 1px solid rgba(201, 168, 76, 0.26);
    background: rgba(255, 249, 231, 0.78);
    color: #705814;
}

.nav-auth-link.is-ward:hover,
.nav-auth-link.is-ward:focus-visible {
    border-color: rgba(26, 107, 107, 0.24);
    background: rgba(232, 244, 244, 0.9);
    color: var(--teal);
}

.landing-family-section {
    position: relative;
}

.landing-family-shell {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(390px, 0.92fr);
    gap: clamp(1.5rem, 4vw, 3.5rem);
    padding: clamp(1.4rem, 4vw, 3.5rem);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 34px;
    background:
        radial-gradient(circle at 8% 10%, rgba(75, 173, 160, 0.24), transparent 32%),
        radial-gradient(circle at 92% 88%, rgba(232, 201, 122, 0.17), transparent 34%),
        linear-gradient(135deg, #082e33 0%, #0e4e50 58%, #163f46 100%);
    box-shadow: 0 26px 70px rgba(9, 45, 48, 0.2);
    color: #fff;
}

.landing-family-copy,
.landing-family-access,
.landing-family-access-head,
.landing-family-capabilities,
.landing-family-access-grid,
.landing-family-access-card {
    display: grid;
}

.landing-family-copy {
    gap: 1rem;
    align-content: center;
}

.landing-family-copy .eyebrow {
    margin: 0;
    color: #a7e7da;
}

.landing-family-copy .eyebrow::before {
    background: var(--gold-light);
}

.landing-family-copy h2 {
    max-width: 720px;
    margin: 0;
    color: #fff;
    font-size: clamp(2.15rem, 4vw, 3.7rem);
    line-height: 1.02;
}

.landing-family-copy > p:not(.eyebrow) {
    max-width: 690px;
    margin: 0;
    color: rgba(255, 255, 255, 0.76);
    line-height: 1.72;
}

.landing-family-capabilities {
    gap: 0.65rem;
    margin-top: 0.4rem;
}

.landing-family-capabilities article {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.8rem;
    align-items: start;
    padding: 0.85rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.06);
}

.landing-family-capabilities i {
    display: grid;
    width: 2.4rem;
    height: 2.4rem;
    place-items: center;
    border-radius: 12px;
    background: rgba(232, 201, 122, 0.16);
    color: var(--gold-light);
}

.landing-family-capabilities strong,
.landing-family-capabilities small {
    display: block;
}

.landing-family-capabilities small {
    margin-top: 0.16rem;
    color: rgba(255, 255, 255, 0.66);
    line-height: 1.45;
}

.landing-family-access {
    gap: 1rem;
    padding: clamp(1rem, 2.5vw, 1.5rem);
    border-radius: 26px;
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 22px 46px rgba(0, 0, 0, 0.14);
    color: var(--ink);
}

.landing-family-access-head {
    gap: 0.45rem;
}

.landing-family-access-head .pill {
    width: fit-content;
}

.landing-family-access-head h3,
.landing-family-access-head p,
.landing-family-access-card p {
    margin: 0;
}

.landing-family-access-head h3 {
    font-size: clamp(1.55rem, 3vw, 2.25rem);
}

.landing-family-access-head p,
.landing-family-access-card p {
    color: var(--mid);
    line-height: 1.55;
}

.landing-family-access-grid {
    gap: 0.75rem;
}

.landing-family-access-card {
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.75rem 0.85rem;
    align-items: start;
    padding: 1rem;
    border: 1px solid rgba(13, 13, 13, 0.08);
    border-radius: 20px;
    background: rgba(247, 243, 234, 0.68);
}

.landing-family-access-card.is-guardian {
    background: rgba(232, 244, 244, 0.72);
}

.landing-family-access-icon {
    display: grid;
    width: 2.65rem;
    height: 2.65rem;
    place-items: center;
    border-radius: 14px;
    background: var(--teal);
    color: #fff;
}

.landing-family-access-card.is-ward .landing-family-access-icon {
    background: #c9a84c;
    color: #172f31;
}

.landing-family-access-card strong {
    display: block;
    margin-bottom: 0.2rem;
}

.landing-family-actions,
.landing-family-access-card > .btn {
    grid-column: 1 / -1;
}

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

.landing-family-access-card > .btn {
    justify-content: center;
}

.pricing-family-section {
    background: rgba(255, 255, 255, 0.4);
}

.pricing-family-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(320px, 0.82fr);
    gap: clamp(1.35rem, 4vw, 3rem);
    padding: clamp(1.4rem, 3.5vw, 2.5rem);
    border: 1px solid rgba(13, 13, 13, 0.08);
    border-radius: 30px;
    background:
        radial-gradient(circle at top right, rgba(232, 201, 122, 0.2), transparent 31%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.96), rgba(232, 244, 244, 0.84));
    box-shadow: 0 20px 48px rgba(13, 13, 13, 0.07);
}

.pricing-family-copy h2 {
    margin: 0 0 0.75rem;
    font-size: clamp(2rem, 4vw, 3.25rem);
    line-height: 1.03;
}

.pricing-family-copy > p:not(.eyebrow) {
    max-width: 680px;
    color: var(--mid);
    line-height: 1.68;
}

.pricing-family-copy ul {
    display: grid;
    gap: 0.65rem;
    padding: 0;
    margin: 1.2rem 0;
    list-style: none;
}

.pricing-family-copy li {
    display: flex;
    gap: 0.6rem;
    color: var(--mid);
    line-height: 1.5;
}

.pricing-family-copy li i {
    margin-top: 0.18rem;
    color: var(--teal);
}

.pricing-family-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.pricing-family-route {
    display: grid;
    gap: 0.7rem;
    align-content: center;
}

.pricing-family-route > article {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.7rem;
    align-items: start;
    padding: 0.9rem;
    border: 1px solid rgba(26, 107, 107, 0.12);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.78);
}

.pricing-family-route > article > span {
    display: grid;
    width: 2rem;
    height: 2rem;
    place-items: center;
    border-radius: 999px;
    background: rgba(26, 107, 107, 0.12);
    color: var(--teal);
    font-family: "Space Mono", monospace;
    font-size: 0.68rem;
    font-weight: 700;
}

.pricing-family-route strong,
.pricing-family-route small {
    display: block;
}

.pricing-family-route small {
    margin-top: 0.14rem;
    color: var(--mid);
    line-height: 1.45;
}

.pricing-family-ward-link {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0.7rem;
    align-items: center;
    padding: 0.9rem;
    border: 1px solid rgba(201, 168, 76, 0.3);
    border-radius: 18px;
    background: rgba(255, 249, 231, 0.88);
    color: var(--ink);
    transition: transform 0.2s ease, border-color 0.2s ease;
}

.pricing-family-ward-link:hover,
.pricing-family-ward-link:focus-visible {
    transform: translateY(-2px);
    border-color: rgba(26, 107, 107, 0.3);
}

.pricing-family-ward-link > i:first-child {
    color: var(--teal);
}

@media (max-width: 960px) {
    .landing-family-shell,
    .pricing-family-card {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 620px) {
    .auth-access-switcher-grid {
        grid-template-columns: 1fr;
    }

    .auth-access-option {
        min-height: 3.35rem;
    }

    .landing-family-shell {
        padding: 1rem;
        border-radius: 26px;
    }

    .landing-family-copy h2 {
        font-size: clamp(2rem, 11vw, 2.7rem);
    }

    .landing-family-access {
        padding: 0.8rem;
        border-radius: 22px;
    }

    .landing-family-actions,
    .pricing-family-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .landing-family-actions .btn,
    .pricing-family-actions .btn {
        width: 100%;
        justify-content: center;
    }

    .pricing-family-card {
        padding: 1rem;
        border-radius: 24px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .sidebar,
    .sidebar *,
    .app-main {
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
    }
}

.dashboard-action-icon {
    width: 2rem;
    height: 2rem;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(26, 107, 107, 0.12);
    color: var(--teal);
    flex-shrink: 0;
}

.app-header {
    min-height: var(--header-h);
    background: rgba(255, 255, 255, 0.86);
    border-bottom: 1px solid var(--border);
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 1rem 2rem;
    position: sticky;
    top: 0;
    z-index: 50;
    backdrop-filter: blur(14px);
    gap: 1rem;
}

.app-header h1,
.app-header h2 {
    font-size: 1.28rem;
    font-weight: 700;
    margin: 0;
    line-height: 1.2;
    overflow-wrap: anywhere;
}

.app-header h1 {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    min-width: 0;
}

.app-header-title-icon {
    display: inline-grid;
    place-items: center;
    flex: 0 0 2rem;
    width: 2rem;
    height: 2rem;
    border-radius: 0.6rem;
    background: #e6f3ef;
    color: #176c6e;
    font-size: 0.9rem;
}

.app-header-title-text {
    min-width: 0;
}

.app-shell.has-student-mobile-nav .app-header {
    position: relative;
    top: auto;
}

.app-header-main {
    display: grid;
    gap: 0.35rem;
    flex: 1 1 auto;
    min-width: 0;
}

.app-sidebar-toggle {
    display: none;
    align-items: center;
    gap: 0.7rem;
    width: fit-content;
    padding: 0.55rem 0.85rem;
    border-radius: 999px;
    border: 1px solid rgba(26, 107, 107, 0.18);
    background: rgba(255, 255, 255, 0.86);
    color: var(--ink);
    font-weight: 700;
    font-size: 0.75rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.app-sidebar-toggle-bars {
    position: relative;
    display: inline-block;
    width: 14px;
    height: 2px;
    background: currentColor;
    border-radius: 999px;
}

.app-sidebar-toggle-bars::before,
.app-sidebar-toggle-bars::after {
    content: "";
    position: absolute;
    left: 0;
    width: 14px;
    height: 2px;
    background: currentColor;
    border-radius: 999px;
}

.app-sidebar-toggle-bars::before {
    top: -5px;
}

.app-sidebar-toggle-bars::after {
    top: 5px;
}

.app-sidebar-toggle-chevron {
    display: none;
}

.app-header-badge-row {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    flex-wrap: wrap;
}

.app-shell-badge,
.app-shell-chip {
    display: inline-flex;
    align-items: center;
    padding: 0.32rem 0.6rem;
    border-radius: 999px;
    font-family: "Space Mono", monospace;
    font-size: 0.63rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.app-shell-badge {
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
}

.app-shell-chip {
    background: rgba(201, 168, 76, 0.14);
    color: #8b6900;
}

.app-header-copy {
    margin-top: 0.18rem;
    color: var(--mid);
    font-size: 0.82rem;
    line-height: 1.55;
    overflow-wrap: anywhere;
}

.app-header-mobile-identity {
    display: none;
}

.guardian-mobile-brand {
    display: none;
}

.student-mobile-nav {
    display: none;
}

@keyframes studentSurfaceIn {
    from {
        opacity: 0;
        transform: translateY(8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes studentNavIn {
    from {
        opacity: 0;
        transform: translateY(12px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.header-right {
    display: flex;
    align-items: flex-start;
    gap: 0.9rem;
    flex-wrap: nowrap;
    justify-content: flex-end;
    flex: 0 0 auto;
    max-width: min(520px, 48vw);
}

.app-header-meta {
    display: grid;
    gap: 0.12rem;
    padding: 0.55rem 0.8rem;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.8);
    min-width: 170px;
    flex: 0 0 auto;
}

.header-right .student-header-primary-action {
    flex: 0 0 auto;
    white-space: nowrap;
}

.header-right .notif-menu {
    flex: 0 0 auto;
}

.app-header-meta-label {
    font-family: "Space Mono", monospace;
    font-size: 0.62rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--mid);
}

.app-header-meta strong {
    font-size: 0.88rem;
    color: var(--ink);
}

.notif-btn {
    position: relative;
    width: 42px;
    height: 42px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.88);
    border: 1px solid var(--border);
    font-size: 1rem;
    cursor: pointer;
    color: var(--mid);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.notif-btn:hover {
    color: var(--teal);
    border-color: rgba(26, 107, 107, 0.24);
    background: rgba(232, 244, 244, 0.92);
}

.notif-dot {
    position: absolute;
    top: 9px;
    right: 10px;
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: var(--rust);
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.95);
}

.notif-menu {
    position: relative;
}

.notif-dropdown {
    position: absolute;
    top: calc(100% + 0.65rem);
    right: 0;
    width: min(340px, calc(100vw - 2rem));
    display: none;
    border: 1px solid rgba(26, 107, 107, 0.12);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.99);
    box-shadow: 0 22px 54px rgba(13, 13, 13, 0.14);
    overflow: hidden;
    z-index: 35;
}

.notif-menu.open .notif-dropdown {
    display: block;
}

.notif-dropdown-head {
    display: grid;
    gap: 0.15rem;
    padding: 1rem 1rem 0.85rem;
    border-bottom: 1px solid var(--border);
    background: linear-gradient(180deg, rgba(26, 107, 107, 0.06), rgba(255, 255, 255, 0));
}

.notif-dropdown-head strong {
    font-size: 0.92rem;
    color: var(--ink);
}

.notif-dropdown-head small {
    color: var(--mid);
    font-size: 0.74rem;
}

.notif-dropdown-list {
    display: grid;
    gap: 0.55rem;
    padding: 0.8rem;
}

.notif-item,
.notif-empty {
    display: grid;
    gap: 0.28rem;
    padding: 0.85rem 0.9rem;
    border-radius: 12px;
    border: 1px solid var(--border);
    background: rgba(248, 245, 239, 0.72);
}

.notif-item strong,
.notif-empty strong {
    font-size: 0.8rem;
    color: var(--ink);
}

.notif-category {
    justify-self: start;
    display: inline-flex;
    align-items: center;
    min-height: 1.25rem;
    padding: 0.12rem 0.4rem;
    border-radius: 999px;
    background: rgba(26, 107, 107, 0.1);
    color: var(--brand);
    font-family: var(--mono);
    font-size: 0.58rem;
    font-style: normal;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.notif-item span,
.notif-empty span {
    font-size: 0.8rem;
    color: var(--mid);
    line-height: 1.55;
}

.notif-link {
    text-decoration: none;
    color: inherit;
    transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.notif-link:hover {
    transform: translateY(-1px);
    border-color: rgba(26, 107, 107, 0.22);
    box-shadow: 0 12px 26px rgba(13, 13, 13, 0.08);
}

.notif-success {
    border-color: rgba(122, 173, 138, 0.22);
    background: rgba(122, 173, 138, 0.09);
}

.notif-info {
    border-color: rgba(26, 107, 107, 0.18);
    background: rgba(26, 107, 107, 0.08);
}

.notif-warning,
.notif-error {
    border-color: rgba(192, 94, 58, 0.22);
    background: rgba(192, 94, 58, 0.08);
}

.app-content {
    flex: 1;
    padding: 2rem;
    background: transparent;
    opacity: 1;
    transform: translateY(0);
    transition:
        opacity 0.24s ease,
        transform 0.28s cubic-bezier(0.2, 0.9, 0.2, 1);
}

/* Public course components also render inside workspaces, where the sidebar
   reduces the usable width below the viewport width. */
.app-content .container {
    width: 100%;
    max-width: 1200px;
}

.dashboard-page.workspace-transition-ready .app-content {
    animation: workspacePageEnter 0.28s cubic-bezier(0.2, 0.9, 0.2, 1) both;
}

.dashboard-page.workspace-is-leaving .app-content {
    opacity: 0.82;
    transform: translateY(4px);
}

/* Sidebar navigation keeps the workspace chrome mounted while the page panel changes. */
.app-content.workspace-content-is-swapping {
    opacity: 0.42;
    transform: translateY(5px);
    pointer-events: none;
}

.app-content.workspace-content-enter {
    animation: workspacePageEnter 0.3s cubic-bezier(0.2, 0.9, 0.2, 1) both;
}

.dashboard-page .workspace-action-activated {
    animation: workspaceActionActivated 0.36s cubic-bezier(0.2, 0.9, 0.2, 1);
}

@keyframes workspacePageEnter {
    from {
        opacity: 0.86;
        transform: translateY(6px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes workspaceActionActivated {
    0% {
        transform: scale(1);
    }
    38% {
        transform: scale(0.965);
        box-shadow: 0 0 0 5px rgba(26, 107, 107, 0.11);
    }
    100% {
        transform: scale(1);
    }
}

.dashboard-intro {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1.4rem;
}

.student-hero-band {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    gap: var(--workspace-hero-gap);
    margin-bottom: 1.4rem;
    padding: var(--workspace-hero-padding);
    border-radius: var(--workspace-hero-radius);
    background: var(--workspace-student-hero);
    color: #fff;
    box-shadow: var(--workspace-hero-shadow);
}

.student-hero-copy {
    display: grid;
    gap: 0.6rem;
    max-width: 62ch;
    min-width: 0;
}

.student-hero-band .eyebrow-inline {
    color: var(--gold-light);
}

.student-hero-band h2 {
    color: #fff;
    margin: 0;
    overflow-wrap: anywhere;
}

.student-hero-band p {
    color: rgba(255, 255, 255, 0.82);
    line-height: 1.75;
    margin: 0;
}

.student-hero-actions {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    justify-content: center;
    min-width: 210px;
}

.student-hero-actions .button {
    min-width: 0;
}

.student-hero-actions .button span {
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.student-pulse-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.student-pulse-card {
    padding: 1.1rem 1.2rem;
    border-radius: 12px;
    border: 1px solid var(--border);
    background: rgba(255, 255, 255, 0.88);
    display: grid;
    gap: 0.45rem;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.05);
}

.student-pulse-icon {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.82);
    border: 1px solid rgba(15, 76, 92, 0.1);
    color: var(--teal);
    font-size: 1rem;
    box-shadow: 0 8px 22px rgba(15, 76, 92, 0.08);
}

.student-pulse-card.tone-teal {
    background: linear-gradient(145deg, rgba(232, 244, 244, 0.98), rgba(255, 255, 255, 0.95));
}

.student-pulse-card.tone-gold {
    background: linear-gradient(145deg, rgba(255, 248, 229, 0.98), rgba(255, 255, 255, 0.95));
}

.student-pulse-card.tone-ink {
    background: linear-gradient(145deg, rgba(243, 242, 239, 0.98), rgba(255, 255, 255, 0.95));
}

.student-pulse-card.tone-sage {
    background: linear-gradient(145deg, rgba(239, 249, 242, 0.98), rgba(255, 255, 255, 0.95));
}

.student-pulse-label {
    font-family: "Space Mono", monospace;
    font-size: 0.63rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--brand-700);
}

.student-pulse-card strong {
    font-family: "Playfair Display", serif;
    font-size: 1.8rem;
    line-height: 1;
    color: var(--ink);
}

.student-pulse-card strong small {
    font-family: "DM Sans", sans-serif;
    font-size: 0.82rem;
    color: var(--mid);
    margin-left: 0.3rem;
}

.student-pulse-card p {
    margin: 0;
    color: var(--mid);
    font-size: 0.88rem;
    line-height: 1.5;
}

.tutor-scope-overview-card {
    padding: 1.15rem 1.2rem;
    border-radius: 16px;
    border: 1px solid var(--border);
    background: rgba(255, 255, 255, 0.9);
    display: grid;
    gap: 0.55rem;
    box-shadow: 0 14px 32px rgba(0, 0, 0, 0.05);
}

.tutor-scope-overview-card.tone-teal {
    background: linear-gradient(145deg, rgba(232, 244, 244, 0.98), rgba(255, 255, 255, 0.95));
}

.tutor-scope-overview-card.tone-gold {
    background: linear-gradient(145deg, rgba(255, 248, 229, 0.98), rgba(255, 255, 255, 0.95));
}

.tutor-scope-overview-card.tone-ink {
    background: linear-gradient(145deg, rgba(243, 242, 239, 0.98), rgba(255, 255, 255, 0.95));
}

.tutor-scope-overview-card.tone-sage {
    background: linear-gradient(145deg, rgba(239, 249, 242, 0.98), rgba(255, 255, 255, 0.95));
}

.tutor-scope-overview-top {
    display: flex;
    align-items: center;
    gap: 0.7rem;
}

.tutor-scope-overview-icon {
    width: 2.45rem;
    height: 2.45rem;
    border-radius: 999px;
    display: inline-grid;
    place-items: center;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
    flex-shrink: 0;
}

.tutor-scope-overview-card.tone-gold .tutor-scope-overview-icon {
    background: rgba(198, 161, 74, 0.16);
    color: #9a7110;
}

.tutor-scope-overview-card.tone-ink .tutor-scope-overview-icon {
    background: rgba(18, 28, 49, 0.1);
    color: #17243f;
}

.tutor-scope-overview-card.tone-sage .tutor-scope-overview-icon {
    background: rgba(73, 125, 116, 0.12);
    color: #3f7067;
}

.tutor-scope-overview-card strong {
    font-family: "Playfair Display", serif;
    font-size: 1.85rem;
    line-height: 1;
    color: var(--ink);
}

.tutor-scope-overview-card p,
.tutor-scope-overview-card small {
    margin: 0;
    color: var(--ink);
    line-height: 1.5;
}

.tutor-scope-overview-card p {
    font-size: 0.96rem;
}

.tutor-scope-overview-card small {
    color: var(--mid);
    font-size: 0.8rem;
}

.tutor-scope-compare-strip {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.95rem;
    margin-bottom: 1.35rem;
}

.tutor-scope-compare-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.85rem;
    align-items: start;
    padding: 1rem;
    border-radius: 18px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.92);
    box-shadow: 0 14px 28px rgba(15, 23, 42, 0.05);
}

.tutor-scope-compare-icon {
    width: 2.45rem;
    height: 2.45rem;
    border-radius: 999px;
    display: inline-grid;
    place-items: center;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
}

.tutor-scope-compare-card.tone-gold .tutor-scope-compare-icon {
    background: rgba(198, 161, 74, 0.16);
    color: #9a7110;
}

.tutor-scope-compare-card.tone-ink .tutor-scope-compare-icon {
    background: rgba(18, 28, 49, 0.1);
    color: #17243f;
}

.tutor-scope-compare-card strong {
    display: block;
    margin-top: 0.45rem;
    color: var(--ink);
    line-height: 1.35;
}

.tutor-scope-compare-card p {
    margin: 0.3rem 0 0;
    color: var(--mid);
    line-height: 1.55;
    font-size: 0.86rem;
}

.student-stat-grid {
    margin-bottom: 1.5rem;
}

.student-focus-panel {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(245, 240, 232, 0.92));
}

.student-dashboard-stack {
    display: grid;
    gap: 1.5rem;
}

.student-dashboard-stack > * {
    min-width: 0;
}

.student-summary-shell {
    display: grid;
    gap: 1rem;
}

.student-context-panel {
    display: grid;
    gap: 1rem;
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.06), transparent 32%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(246, 242, 234, 0.92));
}

.student-context-panel-classroom {
    border-color: rgba(26, 107, 107, 0.18);
}

.student-context-panel-direct {
    border-color: rgba(201, 168, 76, 0.18);
}

.student-context-head {
    display: grid;
    gap: 0.9rem;
}

.student-context-copy {
    display: grid;
    gap: 0.4rem;
}

.student-context-copy h3 {
    margin: 0;
}

.student-context-copy p {
    margin: 0;
    color: var(--mid);
    line-height: 1.7;
}

.student-context-subjects {
    display: grid;
    gap: 0.55rem;
}

.student-context-subjects-label {
    font-family: "Space Mono", monospace;
    font-size: 0.66rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--teal);
}

.student-context-pill-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
}

.student-context-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.85rem;
}

.student-context-stat {
    display: grid;
    gap: 0.3rem;
    padding: 0.95rem 1rem;
    border-radius: 16px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.88);
}

.student-context-stat span {
    font-family: "Space Mono", monospace;
    font-size: 0.66rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--teal);
}

.student-context-stat strong {
    font-size: 0.96rem;
    line-height: 1.45;
    color: var(--ink);
}

.student-subject-scope-panel {
    display: grid;
    gap: 1rem;
    background:
        radial-gradient(circle at top right, rgba(201, 168, 76, 0.1), transparent 34%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(247, 251, 253, 0.94));
    border-color: rgba(26, 107, 107, 0.16);
}

.student-subject-scope-head {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(220px, 0.65fr);
    gap: 1rem;
    align-items: start;
}

.student-subject-scope-copy {
    display: grid;
    gap: 0.45rem;
}

.student-subject-scope-copy h3,
.student-subject-scope-plan strong {
    margin: 0;
}

.student-subject-scope-copy p {
    margin: 0;
    color: var(--mid);
    line-height: 1.7;
}

.student-subject-scope-plan {
    display: grid;
    gap: 0.45rem;
    padding: 1rem;
    border-radius: 18px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.86);
    justify-items: start;
}

.student-subject-scope-label {
    font-family: "Space Mono", monospace;
    font-size: 0.66rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--teal);
}

.student-subject-scope-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.85rem;
}

.student-subject-scope-metric {
    display: grid;
    gap: 0.3rem;
    padding: 0.95rem 1rem;
    border-radius: 16px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.88);
}

.student-subject-scope-metric span {
    font-family: "Space Mono", monospace;
    font-size: 0.66rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--teal);
}

.student-subject-scope-metric strong {
    font-size: 0.96rem;
    line-height: 1.45;
    color: var(--ink);
}

.student-subject-scope-body {
    display: grid;
    gap: 0.85rem;
}

.student-subject-scope-list {
    display: grid;
    gap: 0.75rem;
}

.student-subject-scope-row {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: center;
    padding: 0.95rem 1rem;
    border-radius: 18px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.9);
}

a.student-subject-scope-row {
    color: inherit;
    text-decoration: none;
}

a.student-subject-scope-row:hover {
    border-color: rgba(18, 116, 116, 0.42);
    background: rgba(233, 245, 243, 0.7);
}

.student-curriculum-hero {
    align-items: center;
}

.student-curriculum-panel,
.student-curriculum-tree-panel {
    width: 100%;
}

.student-curriculum-list {
    display: grid;
    gap: 0.85rem;
}

.curriculum-progress-overview {
    display: grid;
    grid-template-columns: minmax(260px, 0.8fr) minmax(320px, 1.2fr);
    align-items: center;
    gap: 1.5rem;
    border-color: rgba(18, 116, 116, 0.2);
    background:
        radial-gradient(circle at 92% 12%, rgba(223, 179, 67, 0.12), transparent 34%),
        linear-gradient(115deg, rgba(239, 248, 247, 0.96), rgba(255, 255, 255, 0.98));
}

.curriculum-progress-copy {
    display: flex;
    align-items: center;
    gap: 0.9rem;
}

.curriculum-progress-copy > div {
    display: grid;
    gap: 0.16rem;
}

.curriculum-progress-copy small,
.curriculum-dashboard-progress span,
.curriculum-toolbar-progress span {
    color: #177273;
    font-family: var(--font-mono);
    font-size: 0.68rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.curriculum-progress-copy strong {
    font-family: var(--font-display);
    font-size: clamp(1.25rem, 2vw, 1.75rem);
}

.curriculum-progress-copy > div > span,
.curriculum-dashboard-progress small {
    color: var(--muted);
}

.curriculum-progress-meter,
.curriculum-row-progress {
    display: block;
    overflow: hidden;
    width: 100%;
    height: 0.55rem;
    border-radius: 999px;
    background: rgba(18, 116, 116, 0.12);
}

.curriculum-progress-meter > span,
.curriculum-row-progress > span {
    display: block;
    width: 0;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #0d6f70, #2f9b91);
    transition: width 420ms ease;
}

.curriculum-row-progress {
    max-width: 22rem;
    height: 0.35rem;
    margin-top: 0.28rem;
}

.student-curriculum-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.1rem;
    color: inherit;
    text-decoration: none;
    border: 1px solid rgba(18, 116, 116, 0.16);
    border-radius: 18px;
    background: linear-gradient(110deg, rgba(239, 248, 247, 0.92), rgba(255, 252, 245, 0.96));
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.student-curriculum-row:hover {
    transform: translateY(-2px);
    border-color: rgba(18, 116, 116, 0.42);
    box-shadow: 0 14px 32px rgba(26, 48, 47, 0.08);
}

.student-curriculum-row-icon,
.student-curriculum-lesson-icon {
    display: grid;
    place-items: center;
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 14px;
    color: #0d6f70;
    background: rgba(18, 116, 116, 0.1);
}

.student-curriculum-row-copy {
    display: grid;
    gap: 0.2rem;
    min-width: 0;
}

.student-curriculum-row-copy small,
.student-curriculum-row-meta small {
    color: #177273;
    font-family: var(--font-mono);
    font-size: 0.68rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.student-curriculum-row-copy strong {
    font-size: 1.05rem;
}

.student-curriculum-row-copy span {
    color: var(--muted);
}

.student-curriculum-row-meta {
    display: grid;
    min-width: 4.5rem;
    text-align: center;
}

.student-curriculum-row-meta strong {
    font-family: var(--font-display);
    font-size: 1.5rem;
}

.curriculum-lesson-node.is-complete {
    border-color: rgba(18, 116, 116, 0.3);
    background: linear-gradient(90deg, rgba(230, 246, 241, 0.94), rgba(255, 255, 255, 0.98));
}

.curriculum-lesson-node.is-locked,
.admin-structure-tree-item.is-locked > .admin-structure-tree-node {
    border-color: rgba(108, 95, 76, 0.18);
    background: linear-gradient(90deg, rgba(247, 244, 237, 0.96), rgba(255, 255, 255, 0.98));
}

.curriculum-lesson-node.is-locked .admin-structure-tree-link,
.admin-structure-tree-item.is-locked > .admin-structure-tree-node .admin-structure-tree-link {
    color: #554f46;
}

.curriculum-lesson-state {
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    width: 2.2rem;
    height: 2.2rem;
    border-radius: 999px;
    color: var(--muted);
    background: rgba(45, 55, 54, 0.06);
}

.curriculum-lesson-state.is-complete,
.curriculum-lesson-status-pill.is-complete,
.curriculum-written-complete {
    color: #0d6f70;
    background: rgba(18, 116, 116, 0.12);
}

.curriculum-lesson-state.is-locked,
.admin-structure-tree-lock {
    color: #765f24;
    background: rgba(224, 180, 83, 0.18);
}

.curriculum-dashboard-progress {
    display: grid;
    gap: 0.48rem;
    padding: 0.85rem 0;
}

.curriculum-dashboard-progress > div:first-child,
.curriculum-toolbar-progress > div:first-child {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.curriculum-toolbar-progress {
    display: grid;
    gap: 0.38rem;
    width: min(18rem, 42vw);
}

.curriculum-written-complete {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.65rem 0.85rem;
    border-radius: 999px;
    font-weight: 700;
}

.student-curriculum-tree {
    display: grid;
    gap: 1rem;
}

.student-curriculum-branch {
    overflow: hidden;
    border: 1px solid rgba(18, 116, 116, 0.18);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.78);
}

.student-curriculum-branch > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.1rem;
    cursor: pointer;
    list-style: none;
    background: linear-gradient(90deg, rgba(18, 116, 116, 0.1), rgba(223, 179, 67, 0.08));
}

.student-curriculum-branch > summary span:first-child,
.student-curriculum-subbranch-head span {
    display: flex;
    align-items: center;
    gap: 0.7rem;
}

.student-curriculum-subbranches {
    display: grid;
    gap: 1rem;
    padding: 1rem;
}

.student-curriculum-subbranch {
    padding-left: 1rem;
    border-left: 2px solid rgba(18, 116, 116, 0.22);
}

.student-curriculum-subbranch-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 0.65rem;
}

.student-curriculum-lessons {
    display: grid;
    gap: 0.55rem;
}

.student-curriculum-lessons a {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.75rem;
    padding: 0.8rem;
    color: inherit;
    text-decoration: none;
    border: 1px solid rgba(45, 55, 54, 0.1);
    border-radius: 14px;
    background: #fff;
}

.student-curriculum-lessons a > span:nth-child(2) {
    display: grid;
    gap: 0.15rem;
}

.student-curriculum-lessons a small {
    color: var(--muted);
}

.student-curriculum-lesson-shell {
    display: grid;
    gap: 1.35rem;
    max-width: 1120px;
    margin: 0 auto;
}

.student-curriculum-video-panel {
    width: min(100%, 920px);
    margin: 0 auto;
}

.student-curriculum-lesson-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.55fr) minmax(280px, 0.75fr);
    align-items: start;
    gap: 1.25rem;
}

.student-curriculum-support-stack {
    display: grid;
    gap: 1.25rem;
}

.student-lesson-pagination {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
}

@media (max-width: 800px) {
    .curriculum-progress-overview {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .student-curriculum-row {
        grid-template-columns: auto minmax(0, 1fr) auto;
    }

    .student-curriculum-row-meta {
        min-width: 3.75rem;
    }

    .curriculum-toolbar-progress {
        width: 100%;
    }

    .student-curriculum-lesson-grid {
        grid-template-columns: 1fr;
    }

    .student-lesson-pagination {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }

    .student-lesson-pagination .button {
        min-width: 0;
    }
}

@media (max-width: 520px) {
    .curriculum-progress-copy {
        align-items: flex-start;
    }

    .student-curriculum-row {
        grid-template-columns: auto minmax(0, 1fr) auto;
        gap: 0.7rem;
        padding: 0.85rem;
    }

    .student-curriculum-row-icon {
        width: 2.35rem;
        height: 2.35rem;
    }

    .student-curriculum-row-meta strong {
        font-size: 1.15rem;
    }

    .student-curriculum-row-meta small {
        font-size: 0.56rem;
    }

    .student-curriculum-branch > summary,
    .student-curriculum-subbranch-head {
        align-items: flex-start;
    }

    .student-curriculum-subbranch {
        padding-left: 0.65rem;
    }

    .student-lesson-pagination {
        grid-template-columns: 1fr;
    }
}

.student-subject-scope-row-copy {
    display: grid;
    gap: 0.25rem;
}

.student-subject-scope-row-copy strong {
    color: var(--ink);
}

.student-subject-scope-row-copy span {
    color: var(--mid);
    line-height: 1.65;
}

.student-workspace-grid {
    display: grid;
    gap: 1.5rem;
}

.student-pathways-panel {
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.06), transparent 36%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(246, 242, 234, 0.94));
}

.student-focus-shell {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1.25rem;
}

.student-focus-primary {
    display: grid;
    gap: 0.9rem;
}

.student-focus-primary h3 {
    margin: 0;
}

.student-focus-primary p {
    color: var(--mid);
    line-height: 1.7;
}

.student-focus-mini-card {
    padding: 1rem;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.82);
    display: grid;
    gap: 0.35rem;
}

.student-focus-mini-card span,
.student-next-label {
    font-family: "Space Mono", monospace;
    font-size: 0.62rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--teal);
}

.student-focus-mini-card strong {
    font-size: 0.92rem;
    line-height: 1.55;
}

.student-next-lesson {
    padding: 1rem 1.1rem;
    border-radius: 10px;
    background: rgba(26, 107, 107, 0.08);
    border: 1px solid rgba(26, 107, 107, 0.14);
    display: grid;
    gap: 0.28rem;
}

.student-next-lesson strong {
    font-size: 1rem;
}

.student-next-lesson small {
    color: var(--mid);
}

.student-primary-actions {
    gap: 0.75rem;
}

.student-primary-actions .button {
    min-height: 48px;
}

.student-quick-grid {
    display: grid;
    gap: 0.85rem;
}

.student-quick-card {
    display: grid;
    gap: 0.35rem;
    padding: 1rem;
    min-height: 96px;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.76);
    transition: transform 0.2s ease, border-color 0.2s ease, background 0.2s ease, box-shadow 0.24s ease;
}

.student-quick-card:hover {
    transform: translateY(-2px);
    border-color: rgba(26, 107, 107, 0.22);
    background: rgba(232, 244, 244, 0.9);
}

.student-quick-card:active {
    transform: translateY(0) scale(0.988);
}

.student-quick-card strong {
    font-size: 0.92rem;
}

.student-quick-card span {
    font-size: 0.82rem;
    color: var(--mid);
    line-height: 1.6;
}

.admin-action-studio-panel {
    display: grid;
    gap: 1rem;
}

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

.admin-studio-card {
    min-height: 112px;
    background:
        radial-gradient(circle at top right, rgba(198, 161, 74, 0.1), transparent 45%),
        rgba(255, 255, 255, 0.78);
}

.admin-studio-card .dashboard-action-title-text {
    font-size: 0.98rem;
}

.website-content-summary-grid {
    margin-bottom: 0;
}

.website-content-library-panel,
.website-content-signal-panel {
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.06), transparent 36%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(246, 242, 234, 0.94));
}

.website-content-section-list,
.website-content-signal-list {
    display: grid;
    gap: 0.95rem;
}

.website-content-section-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.05rem;
    border-radius: 18px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.9);
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.05);
}

.website-content-section-row.tone-warning,
.website-content-section-row.tone-error {
    border-color: rgba(201, 168, 76, 0.24);
}

.website-content-section-main {
    display: flex;
    align-items: flex-start;
    gap: 0.95rem;
    min-width: 0;
}

.website-content-section-icon {
    width: 2.7rem;
    height: 2.7rem;
    border-radius: 16px;
    display: inline-grid;
    place-items: center;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
    flex-shrink: 0;
}

.website-content-section-copy {
    display: grid;
    gap: 0.25rem;
    min-width: 0;
}

.website-content-section-copy h3,
.website-content-support-card strong {
    margin: 0;
}

.website-content-section-copy p,
.website-content-section-copy span,
.website-content-signal-copy span,
.website-content-support-card span {
    margin: 0;
    color: var(--mid);
    line-height: 1.6;
}

.website-content-section-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.65rem;
}

.website-content-signal-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.85rem;
    align-items: start;
    padding: 0.95rem 1rem;
    border-radius: 16px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.88);
}

.website-content-signal-card.is-ready {
    border-color: rgba(73, 125, 116, 0.2);
}

.website-content-signal-card.needs-attention {
    border-color: rgba(201, 168, 76, 0.24);
}

.website-content-signal-icon {
    width: 2.35rem;
    height: 2.35rem;
    border-radius: 999px;
    display: inline-grid;
    place-items: center;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
}

.website-content-signal-card.needs-attention .website-content-signal-icon {
    background: rgba(201, 168, 76, 0.16);
    color: #9a7110;
}

.website-content-signal-copy {
    display: grid;
    gap: 0.22rem;
}

.website-content-signal-copy strong {
    color: var(--ink);
}

.website-content-support-grid {
    display: grid;
    gap: 0.85rem;
}

.website-content-support-card {
    display: grid;
    gap: 0.3rem;
    padding: 0.95rem 1rem;
    border-radius: 16px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.88);
}

@media (max-width: 760px) {
    .admin-action-studio-grid {
        grid-template-columns: 1fr;
    }
}

.dashboard-action-title-row {
    display: flex;
    align-items: center;
    gap: 0.7rem;
}

.dashboard-action-title-text {
    font-size: 0.92rem;
    color: var(--ink);
    line-height: 1.35;
}

.dashboard-action-description {
    font-size: 0.82rem;
    color: var(--mid);
    line-height: 1.6;
}

.student-activity-list {
    list-style: none;
    display: grid;
    gap: 0.85rem;
}

.student-activity-list li {
    display: grid;
    gap: 0.2rem;
    padding: 0.95rem 1rem;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.76);
    position: relative;
}

.student-activity-list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 14px;
    bottom: 14px;
    width: 4px;
    border-radius: 999px;
    background: var(--teal);
}

.student-activity-list li.activity-assessment::before {
    background: var(--gold);
}

.student-activity-list li.activity-package::before {
    background: var(--gold);
}

.student-activity-list li.activity-classroom::before {
    background: var(--ink);
}

.student-activity-list li.activity-access::before {
    background: #7aad8a;
}

.student-activity-list li strong,
.student-course-card h3 {
    margin: 0;
}

.student-activity-list li span,
.student-activity-list li small {
    color: var(--mid);
}

.student-activity-list li small {
    font-size: 0.76rem;
}

.student-course-paths {
    display: grid;
    gap: 1rem;
}

.student-course-card {
    position: relative;
    overflow: hidden;
    padding: 1.2rem 1.25rem;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.9);
    display: grid;
    gap: 0.85rem;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.04);
    transition: transform 0.22s ease, box-shadow 0.24s ease, border-color 0.22s ease, background-color 0.22s ease;
}

.student-course-card::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: linear-gradient(180deg, rgba(26, 107, 107, 0.88), rgba(201, 168, 76, 0.7));
}

.student-course-card:active {
    transform: scale(0.992);
}

.student-course-card.tone-strong {
    border-color: rgba(122, 173, 138, 0.28);
}

.student-course-card.tone-steady {
    border-color: rgba(26, 107, 107, 0.22);
}

.student-course-card.tone-starting {
    border-color: rgba(201, 168, 76, 0.3);
}

.student-course-top {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: flex-start;
}

.student-course-progress {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 54px;
    padding: 0.42rem 0.7rem;
    border-radius: 999px;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
    font-weight: 700;
    font-size: 0.86rem;
}

.student-course-summary-line {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    color: var(--mid);
    font-size: 0.78rem;
}

.student-course-summary-line span {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.38rem 0.65rem;
    border-radius: 999px;
    background: rgba(26, 107, 107, 0.08);
}

.student-course-meta-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
}

.student-course-meta-card {
    display: grid;
    gap: 0.22rem;
    padding: 0.85rem 0.9rem;
    border-radius: 14px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(248, 245, 239, 0.72);
}

.student-course-meta-card span {
    font-family: "Space Mono", monospace;
    font-size: 0.62rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--teal);
}

.student-course-meta-card strong {
    font-size: 0.88rem;
    line-height: 1.5;
    color: var(--ink);
}

.student-course-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.85rem;
    color: var(--mid);
    font-size: 0.8rem;
}

.student-course-next-step {
    display: grid;
    gap: 0.22rem;
    padding: 0.9rem 1rem;
    border-radius: 12px;
    border: 1px solid rgba(26, 107, 107, 0.12);
    background: rgba(26, 107, 107, 0.06);
}

.student-course-next-step strong {
    margin: 0;
    font-size: 0.95rem;
    line-height: 1.45;
}

.student-course-next-step small {
    color: var(--mid);
    line-height: 1.55;
}

.student-course-next-step.is-complete {
    border-color: rgba(122, 173, 138, 0.22);
    background: rgba(239, 249, 242, 0.74);
}

.student-course-actions {
    gap: 0.7rem;
    align-items: center;
    flex-wrap: wrap;
}

.student-course-actions .button {
    min-height: 46px;
}

.student-course-secondary-link {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.88rem;
    font-weight: 600;
}

.student-detail-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.student-support-grid {
    align-items: start;
}

.student-secondary-card {
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.04), transparent 34%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(246, 242, 234, 0.92));
}

.student-secondary-list {
    display: grid;
    gap: 0.85rem;
}

.student-secondary-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.95rem 1rem;
    border-radius: 16px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.88);
    box-shadow: 0 10px 26px rgba(15, 23, 42, 0.04);
}

.student-notification-item {
    align-items: flex-start;
}

.student-notification-preview-panel {
    display: grid;
    gap: 0.9rem;
}

.student-notification-preview-list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.85rem;
}

.student-notification-preview-item {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.8rem;
    padding: 0.9rem;
    border-radius: 18px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.9);
    min-width: 0;
}

.student-notification-preview-copy {
    display: grid;
    gap: 0.25rem;
    min-width: 0;
}

.student-notification-preview-copy strong {
    line-height: 1.35;
}

.student-notification-preview-copy span {
    color: var(--mid);
    font-size: 0.82rem;
    line-height: 1.45;
}

.student-notification-preview-item .text-link {
    white-space: nowrap;
    align-self: center;
}

.student-notification-info {
    border-color: rgba(26, 107, 107, 0.16);
    background: linear-gradient(180deg, rgba(244, 250, 249, 0.98), rgba(255, 255, 255, 0.92));
}

.student-notification-warning {
    border-color: rgba(201, 168, 76, 0.24);
    background: linear-gradient(180deg, rgba(255, 251, 241, 0.98), rgba(255, 255, 255, 0.92));
}

.student-notification-success {
    border-color: rgba(72, 146, 89, 0.2);
    background: linear-gradient(180deg, rgba(245, 252, 246, 0.98), rgba(255, 255, 255, 0.92));
}

.student-notification-steady {
    border-color: rgba(15, 23, 42, 0.1);
}

.student-secondary-copy {
    display: grid;
    gap: 0.2rem;
    min-width: 0;
}

.student-secondary-copy strong {
    margin: 0;
    line-height: 1.45;
}

.student-secondary-copy span {
    color: var(--mid);
    line-height: 1.55;
    font-size: 0.84rem;
}

.student-secondary-meta {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.student-timeline-panel {
    display: grid;
    gap: 0.9rem;
}

.student-timeline-list {
    display: grid;
    gap: 0.85rem;
}

.student-timeline-item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.9rem;
    align-items: start;
    padding: 1rem;
    border-radius: 18px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.9);
    box-shadow: 0 10px 26px rgba(15, 23, 42, 0.04);
}

.student-timeline-icon {
    width: 2.7rem;
    height: 2.7rem;
    display: grid;
    place-items: center;
    border-radius: 999px;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
}

.student-timeline-item-next .student-timeline-icon {
    background: rgba(26, 107, 107, 0.16);
}

.student-timeline-item-assessment .student-timeline-icon {
    background: rgba(201, 168, 76, 0.18);
    color: #8d6e19;
}

.student-timeline-item-certificate .student-timeline-icon {
    background: rgba(122, 173, 138, 0.2);
    color: #2f6d40;
}

.student-timeline-copy {
    display: grid;
    gap: 0.3rem;
    min-width: 0;
}

.student-timeline-label {
    font-family: "Space Mono", monospace;
    font-size: 0.66rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--teal);
}

.student-timeline-copy strong {
    color: var(--ink);
    line-height: 1.45;
}

.student-timeline-copy p {
    margin: 0;
    color: var(--mid);
    line-height: 1.65;
}

.student-timeline-meta {
    display: flex;
    gap: 0.8rem;
    flex-wrap: wrap;
    align-items: center;
    margin-top: 0.2rem;
}

.student-timeline-meta small {
    color: var(--mid);
}

@media (max-width: 1100px) {
    .student-context-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .student-detail-grid {
        grid-template-columns: 1fr;
    }

    .student-hero-actions {
        min-width: 0;
        width: 100%;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: flex-start;
    }

    .student-hero-actions .button {
        flex: 1 1 220px;
    }

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

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

@media (max-width: 760px) {
    .classroom-entry-grid,
    .classroom-entry-grid-wide {
        gap: 1.25rem;
    }

    .lesson-journey-grid {
        grid-template-columns: 1fr;
    }

    .lesson-journey-actions {
        flex-direction: column;
    }

    .lesson-journey-actions .button {
        width: 100%;
    }

    .classroom-entry-card {
        padding: 1.05rem 1rem 1rem;
        border-radius: 20px;
    }

    .classroom-entry-step,
    .classroom-entry-note {
        padding: 0.95rem;
        border-radius: 16px;
    }

    .classroom-entry-row {
        grid-template-columns: 1fr;
    }

    .classroom-entry-form input {
        min-height: 52px;
        font-size: 1rem;
    }

    .student-dashboard-stack {
        gap: 1rem;
    }

    .app-shell.has-student-mobile-nav .app-content {
        padding-bottom: calc(6.4rem + env(safe-area-inset-bottom, 0px));
    }

    .student-summary-shell,
    .student-workspace-grid {
        gap: 1rem;
    }

    .student-hero-band {
        padding: 1.15rem 1rem;
        gap: 1rem;
        border-radius: 18px;
    }

    .student-hero-copy {
        gap: 0.45rem;
    }

    .student-hero-band h2 {
        font-size: 1.8rem;
    }

    .student-pulse-grid-tight,
    .student-stat-grid {
        grid-template-columns: 1fr 1fr;
        gap: 0.75rem;
    }

    .student-pulse-card,
    .student-stat-grid .stat-card {
        padding: 0.95rem 0.9rem;
    }

    .student-pulse-card strong {
        font-size: 1.55rem;
    }

    .student-focus-panel,
    .student-pathways-panel,
    .student-secondary-card {
        border-radius: 18px;
    }

    .student-context-head {
        gap: 0.75rem;
    }

    .student-subject-scope-head,
    .student-subject-scope-metrics {
        grid-template-columns: 1fr;
    }

    .student-focus-shell {
        gap: 0.9rem;
    }

    .student-focus-mini-card,
    .student-next-lesson,
    .student-course-next-step {
        padding: 0.9rem;
    }

    .student-course-card {
        padding: 1rem;
        gap: 0.75rem;
    }

    .student-course-progress {
        min-width: 50px;
        padding: 0.35rem 0.6rem;
    }

    .student-course-meta-grid {
        grid-template-columns: 1fr;
    }

    .student-secondary-item {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.65rem;
        padding: 0.9rem;
    }

    .student-timeline-item {
        grid-template-columns: 1fr;
    }

    .student-subject-scope-row {
        flex-direction: column;
        align-items: flex-start;
    }

    .student-secondary-meta {
        justify-content: flex-start;
    }

    .learner-course-journey-actions {
        flex-direction: column;
    }

    .curriculum-support-heading {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: 0.75rem;
    }

    .curriculum-support-heading .pill {
        justify-self: start;
    }

    .curriculum-support-row,
    .curriculum-assessment-row {
        grid-template-columns: auto minmax(0, 1fr);
        gap: 0.8rem;
        padding: 0.9rem;
    }

    .curriculum-support-row-metric {
        grid-column: 2;
        grid-template-columns: auto auto;
        align-items: baseline;
        justify-content: start;
        min-width: 0;
        gap: 0.25rem;
        padding: 0.4rem 0.6rem;
    }

    .curriculum-support-row-action {
        grid-column: 1 / -1;
        width: 100%;
    }
}

@media (max-width: 520px) {
    .classroom-entry-step {
        grid-template-columns: 1fr;
    }

    .classroom-entry-step-number {
        width: 2rem;
        height: 2rem;
    }

    .student-context-stats,
    .student-pulse-grid-tight,
    .student-stat-grid {
        grid-template-columns: 1fr;
    }

    .student-hero-actions {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        width: 100%;
    }

    .student-hero-actions .button {
        width: 100%;
        min-width: 0;
    }

}

.management-grid,
.tutor-module-grid {
    align-items: start;
}

.management-hero {
    margin-bottom: 1.2rem;
}

.management-tag-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
}

.form-grid {
    display: grid;
    gap: 1rem;
}

.form-field {
    display: grid;
    gap: 0.38rem;
}

.form-field label {
    font-size: 0.84rem;
    font-weight: 700;
    color: var(--ink);
}

.form-field input,
.form-field select,
.form-field textarea {
    width: 100%;
    border-radius: 12px;
    border: 1px solid var(--border);
    background: rgba(255, 255, 255, 0.92);
    padding: 0.9rem 1rem;
    color: var(--ink);
    font: inherit;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.form-field textarea {
    resize: vertical;
    min-height: 120px;
}

.form-field input:focus,
.form-field select:focus,
.form-field textarea:focus {
    outline: none;
    border-color: rgba(26, 107, 107, 0.35);
    box-shadow: 0 0 0 4px rgba(26, 107, 107, 0.08);
}

.form-help,
.form-error {
    font-size: 0.76rem;
    line-height: 1.55;
}

.form-help {
    color: var(--mid);
}

.form-error {
    color: #9b3027;
}

.form-field.has-errors input,
.form-field.has-errors select,
.form-field.has-errors textarea {
    border-color: rgba(155, 48, 39, 0.4);
    background: rgba(255, 248, 247, 0.95);
}

.course-thumbnail-upload-control {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.course-thumbnail-upload-control input[type="file"] {
    flex: 1 1 260px;
}

.course-thumbnail-upload-status {
    color: var(--mid);
    font-size: 0.78rem;
}

.course-thumbnail-preview {
    width: min(100%, 360px);
    margin: 0.15rem 0 0;
    overflow: hidden;
    border: 1px solid rgba(26, 107, 107, 0.16);
    border-radius: 14px;
    background: rgba(247, 251, 253, 0.78);
}

.course-thumbnail-preview img {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
}

.course-thumbnail-preview figcaption {
    padding: 0.55rem 0.7rem;
    color: var(--mid);
    font-size: 0.75rem;
}

.content-copy-block {
    display: grid;
    gap: 0.9rem;
    color: var(--mid);
    line-height: 1.75;
}

.content-copy-block p {
    margin: 0;
}

.workflow-status-band {
    display: grid;
    gap: 0.65rem;
    margin-bottom: 1rem;
    padding: 1rem 1.05rem;
    border: 1px solid var(--border);
    border-radius: 16px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(245, 240, 232, 0.88));
}

.workflow-status-band-tight {
    margin-top: 0.5rem;
}

.workflow-status-band p {
    margin: 0;
    color: var(--mid);
    line-height: 1.7;
}

.workflow-status-band.tone-success {
    background: rgba(20, 110, 60, 0.08);
    border-color: rgba(20, 110, 60, 0.18);
}

.workflow-status-band.tone-info {
    background: rgba(26, 107, 107, 0.08);
    border-color: rgba(26, 107, 107, 0.18);
}

.workflow-status-band.tone-warning {
    background: rgba(201, 168, 76, 0.12);
    border-color: rgba(201, 168, 76, 0.24);
}

.workflow-status-band.tone-error {
    background: rgba(185, 67, 47, 0.1);
    border-color: rgba(185, 67, 47, 0.22);
}

.stack-list li form {
    display: inline;
}

.stack-list-actions {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.6rem;
    margin-left: 0.75rem;
}

.link-button {
    border: 0;
    background: none;
    padding: 0;
    color: var(--teal);
    font: inherit;
    cursor: pointer;
    text-decoration: underline;
}

.link-button:hover {
    color: var(--ink);
}

.link-button[disabled] {
    color: rgba(73, 68, 63, 0.42);
    cursor: not-allowed;
    text-decoration: none;
}

.checkpoint-stack {
    gap: 0.9rem;
}

.checkpoint-list-intro {
    margin-bottom: 0.95rem;
}

.checkpoint-list-intro p {
    color: var(--mid);
    line-height: 1.7;
}

.checkpoint-card {
    display: grid;
    gap: 0.9rem;
    padding: 1rem 1.05rem;
    border: 1px solid rgba(19, 107, 116, 0.14);
    border-radius: 18px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(245, 240, 232, 0.82));
}

.checkpoint-card-main {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.9rem;
    align-items: start;
}

.checkpoint-time-badge {
    min-width: 74px;
    padding: 0.55rem 0.75rem;
    border-radius: 14px;
    background: rgba(19, 107, 116, 0.12);
    color: var(--teal);
    font-weight: 700;
    text-align: center;
}

.checkpoint-copy {
    display: grid;
    gap: 0.32rem;
}

.checkpoint-copy-head {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: start;
}

.checkpoint-pill-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.45rem;
}

.checkpoint-copy strong {
    font-size: 1rem;
}

.checkpoint-copy span,
.checkpoint-meta {
    color: var(--mid);
    line-height: 1.65;
}

.checkpoint-actions {
    margin-left: 0;
}

.checkpoint-studio-panel {
    overflow: visible;
}

.checkpoint-studio-layout {
    width: min(100%, 860px);
    margin-top: 1rem;
    margin-inline: auto;
}

.checkpoint-video-shell {
    position: relative;
    border-radius: 22px;
    overflow: hidden;
    background: #000;
    box-shadow: 0 18px 42px rgba(0, 0, 0, 0.16);
}

.checkpoint-studio-video {
    aspect-ratio: 16 / 9;
}

.checkpoint-youtube-controls {
    position: absolute;
    right: 1rem;
    bottom: 1rem;
    left: 1rem;
    z-index: 4;
    display: grid;
    grid-template-columns: auto auto minmax(6rem, 1fr) auto;
    gap: 0.65rem;
    align-items: center;
    padding: 0.62rem 0.75rem;
    border: 1px solid rgba(201, 168, 76, 0.34);
    border-radius: 14px;
    background: rgba(8, 29, 30, 0.88);
    backdrop-filter: blur(12px);
}

.checkpoint-youtube-play {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    min-height: 2.25rem;
    padding: 0.45rem 0.78rem;
    border: 0;
    border-radius: 0.65rem;
    background: var(--teal);
    color: #fff;
    font: inherit;
    font-weight: 700;
    cursor: pointer;
}

.checkpoint-youtube-play:hover,
.checkpoint-youtube-play:focus-visible {
    background: #0f666c;
}

.checkpoint-youtube-time {
    color: #fff;
    font-family: "DM Mono", monospace;
    font-size: 0.72rem;
    white-space: nowrap;
}

.checkpoint-youtube-controls input[type="range"] {
    min-width: 0;
    accent-color: #c9a84c;
}

.checkpoint-studio-sidebar {
    display: grid;
    gap: 0.9rem;
}

.checkpoint-studio-sidebar-under-video {
    grid-template-columns: 1fr;
    gap: 0.9rem;
    width: min(100%, 860px);
    margin: 1rem auto 0;
}

.checkpoint-studio-sidebar-under-video .checkpoint-studio-copy {
    grid-area: auto;
}

.checkpoint-studio-console {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 0.9fr);
    gap: 1.25rem;
    align-items: center;
    padding: 1rem 1.1rem;
    border: 1px solid rgba(19, 107, 116, 0.14);
    border-radius: 20px;
    background:
        radial-gradient(circle at top right, rgba(201, 168, 76, 0.14), transparent 42%),
        linear-gradient(135deg, rgba(242, 249, 248, 0.96), rgba(255, 255, 255, 0.98));
    box-shadow: 0 14px 30px rgba(20, 54, 59, 0.06);
}

.checkpoint-studio-status {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: center;
}

.checkpoint-studio-status,
.checkpoint-studio-copy {
    display: grid;
    gap: 0.55rem;
    padding: 1rem 1.05rem;
    border: 1px solid rgba(19, 107, 116, 0.12);
    border-radius: 18px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(245, 240, 232, 0.84));
}

.checkpoint-studio-console .checkpoint-studio-status {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
}

.checkpoint-studio-status-copy {
    display: grid;
    gap: 0.42rem;
}

.checkpoint-studio-status-copy strong {
    color: var(--ink);
    font-size: 1rem;
}

.checkpoint-studio-status-copy p {
    margin: 0;
    color: var(--mid);
    font-size: 0.88rem;
    line-height: 1.55;
}

.checkpoint-current-time-readout {
    display: grid;
    gap: 0.2rem;
    min-width: 7.25rem;
    padding: 0.7rem 0.85rem;
    border-radius: 14px;
    background: rgba(19, 107, 116, 0.08);
    text-align: right;
}

.checkpoint-current-time-readout span {
    color: var(--teal);
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.checkpoint-current-time-readout strong {
    font-size: 1.35rem;
    color: var(--ink);
}

.checkpoint-studio-copy span {
    color: var(--mid);
    line-height: 1.65;
}

.checkpoint-studio-copy strong {
    color: var(--ink);
}

.checkpoint-studio-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.55rem;
    align-items: stretch;
}

.checkpoint-studio-actions .button {
    justify-content: center;
    min-height: 2.8rem;
    white-space: nowrap;
}

.checkpoint-studio-workflow-head {
    display: grid;
    gap: 0.2rem;
}

.checkpoint-studio-workflow-head strong {
    color: var(--ink);
}

.checkpoint-studio-workflow-steps {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 0.5rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.checkpoint-studio-workflow-steps li {
    display: grid;
    gap: 0.2rem;
    min-width: 0;
    padding: 0.68rem 0.72rem;
    border-left: 2px solid rgba(26, 107, 107, 0.2);
}

.checkpoint-studio-workflow-steps strong {
    color: var(--ink);
    font-size: 0.8rem;
}

.checkpoint-studio-workflow-steps span {
    font-size: 0.74rem;
    line-height: 1.45;
}

@media (max-width: 640px) {
    .checkpoint-youtube-controls {
        right: 0.55rem;
        bottom: 0.55rem;
        left: 0.55rem;
        gap: 0.4rem;
        padding: 0.45rem;
    }

    .checkpoint-youtube-play {
        min-height: 2rem;
        padding: 0.35rem 0.55rem;
    }

    .checkpoint-youtube-play span,
    .checkpoint-youtube-time:last-child {
        display: none;
    }

    .checkpoint-studio-console {
        padding: 0.95rem;
    }

    .checkpoint-studio-actions {
        grid-template-columns: 1fr;
    }

    .checkpoint-studio-actions .button {
        width: 100%;
    }

    .checkpoint-studio-workflow-steps {
        grid-template-columns: 1fr;
    }

    .checkpoint-studio-workflow-steps li {
        grid-template-columns: 5.5rem minmax(0, 1fr);
        align-items: baseline;
        border-left: 0;
        border-top: 2px solid rgba(26, 107, 107, 0.2);
    }
}

.checkpoint-form-note {
    display: flex;
    gap: 0.65rem;
    align-items: start;
    padding: 0.9rem 1rem;
    border-radius: 16px;
    background: rgba(19, 107, 116, 0.08);
    color: var(--mid);
    line-height: 1.7;
}

.checkpoint-form-note i {
    color: var(--teal);
    margin-top: 0.2rem;
}

.checkpoint-empty-state {
    margin-top: 1rem;
}

.checkpoint-upload-state {
    gap: 1.25rem;
}

.checkpoint-upload-intro {
    display: grid;
    gap: 0.75rem;
    justify-items: center;
}

.checkpoint-upload-copy {
    display: grid;
    gap: 0.5rem;
    justify-items: center;
    text-align: center;
}

.checkpoint-video-upload-form {
    display: grid;
    gap: 1rem;
    width: min(760px, 100%);
    margin: 0 auto;
    padding: 1.2rem;
    border-radius: 20px;
    border: 1px solid rgba(13, 13, 13, 0.08);
    background: rgba(255, 255, 255, 0.86);
}

.checkpoint-video-upload-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    align-items: start;
}

.checkpoint-video-upload-grid.single-column {
    grid-template-columns: minmax(0, 1fr);
}

.checkpoint-upload-actions {
    justify-content: center;
}

.checkpoint-upload-actions .button-primary,
.checkpoint-upload-actions .button-primary span,
.checkpoint-upload-actions .button-primary i {
    color: #fff;
}

.checkpoint-upload-actions .button-primary {
    box-shadow: 0 14px 30px rgba(26, 107, 107, 0.22);
}

.checkpoint-upload-hint {
    color: var(--mid);
    font-size: 0.82rem;
    line-height: 1.6;
}

.checkpoint-studio-overlay {
    position: absolute;
    inset: 0;
}

.checkpoint-builder-panel {
    display: grid;
    gap: 1rem;
    order: 2;
}

.checkpoint-existing-panel {
    order: 3;
}

.checkpoint-builder-form {
    display: grid;
    gap: 1rem;
}

.checkpoint-builder-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(280px, 0.9fr);
    gap: 1.1rem;
    align-items: start;
}

.checkpoint-builder-main,
.checkpoint-builder-aside {
    display: grid;
    gap: 1rem;
}

.checkpoint-builder-section,
.checkpoint-builder-summary,
.checkpoint-builder-tips {
    padding: 1rem 1.05rem;
    border: 1px solid rgba(19, 107, 116, 0.12);
    border-radius: 18px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(245, 240, 232, 0.84));
}

.checkpoint-builder-section {
    display: grid;
    gap: 0.95rem;
}

.checkpoint-builder-section-head {
    display: flex;
    justify-content: space-between;
    align-items: start;
    gap: 1rem;
}

.checkpoint-builder-section-head > div {
    display: grid;
    gap: 0.45rem;
}

.checkpoint-builder-section-head h4 {
    margin: 0;
    font-size: 1.05rem;
}

.checkpoint-builder-section-head p,
.checkpoint-builder-tips span {
    color: var(--mid);
    line-height: 1.65;
}

.checkpoint-core-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.95rem;
}

.checkpoint-toggle-wrap {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-height: 48px;
    padding: 0.8rem 0.95rem;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.78);
}

.checkpoint-toggle-wrap input[type="checkbox"] {
    width: 18px;
    height: 18px;
    margin: 0;
}

.checkpoint-toggle-wrap span {
    color: var(--mid);
    line-height: 1.55;
    font-size: 0.88rem;
}

.checkpoint-options-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.9rem;
}

.checkpoint-option-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.8rem;
    align-items: start;
    padding: 0.9rem 0.95rem;
    border-radius: 16px;
    border: 1px solid rgba(19, 107, 116, 0.12);
    background: rgba(255, 255, 255, 0.72);
    transition: border-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}

.checkpoint-option-card.is-filled {
    border-color: rgba(26, 107, 107, 0.22);
    box-shadow: 0 12px 24px rgba(13, 13, 13, 0.05);
}

.checkpoint-option-letter {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border-radius: 999px;
    background: rgba(201, 168, 76, 0.16);
    color: var(--gold);
    font-weight: 700;
}

.checkpoint-option-body {
    display: grid;
    gap: 0.45rem;
}

.checkpoint-option-body label {
    margin: 0;
}

.checkpoint-builder-summary {
    display: grid;
    gap: 0.8rem;
}

.checkpoint-builder-summary strong {
    font-size: 1.05rem;
    line-height: 1.45;
}

.checkpoint-summary-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
}

.checkpoint-summary-card {
    display: grid;
    gap: 0.25rem;
    padding: 0.85rem 0.9rem;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.78);
    border: 1px solid rgba(13, 13, 13, 0.07);
}

.checkpoint-summary-card span {
    font-family: "Space Mono", monospace;
    font-size: 0.62rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--teal);
}

.checkpoint-summary-card strong {
    font-size: 0.98rem;
}

.checkpoint-builder-tips {
    display: grid;
    gap: 0.6rem;
}

.checkpoint-builder-tips strong {
    color: var(--ink);
}

.lesson-management-list {
    display: grid;
    gap: 1rem;
    margin-top: 1rem;
}

.lesson-sequence-note {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    margin-top: 1rem;
    padding: 0.78rem 0.9rem;
    border: 1px solid rgba(19, 107, 116, 0.12);
    border-radius: 14px;
    color: var(--mid);
    background: rgba(228, 239, 237, 0.56);
}

.lesson-sequence-note i {
    color: var(--teal);
}

.lesson-management-card {
    display: grid;
    gap: 0.95rem;
    padding: 1.1rem 1.15rem;
    border: 1px solid rgba(19, 107, 116, 0.12);
    border-radius: 20px;
    background:
        radial-gradient(circle at top right, rgba(201, 168, 76, 0.08), transparent 34%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(245, 240, 232, 0.82));
}

.lesson-management-head {
    display: flex;
    justify-content: space-between;
    align-items: start;
    gap: 1rem;
}

.lesson-management-title {
    display: grid;
    gap: 0.3rem;
}

.lesson-management-title strong {
    font-size: 1.03rem;
    color: var(--ink);
}

.lesson-management-title span {
    color: var(--mid);
    line-height: 1.6;
}

.lesson-management-badges {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.5rem;
}

.lesson-management-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem 1rem;
}

.lesson-management-stats span {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.45rem 0.7rem;
    border-radius: 999px;
    background: rgba(19, 107, 116, 0.08);
    color: var(--mid);
    font-size: 0.82rem;
}

.lesson-management-stats strong {
    color: var(--ink);
}

.lesson-management-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.lesson-management-workflow {
    display: flex;
    flex-wrap: wrap;
    gap: 0.85rem;
    padding-top: 0.25rem;
    border-top: 1px solid rgba(19, 107, 116, 0.1);
}

.lesson-management-workflow form {
    display: inline;
}

.lesson-builder-panel {
    display: grid;
    gap: 1rem;
}

.lesson-management-heading-group,
.lesson-management-head-actions {
    display: flex;
    align-items: flex-start;
    gap: 0.85rem;
}

.lesson-management-heading-group {
    min-width: 0;
}

.lesson-management-head-actions {
    justify-content: flex-end;
}

.lesson-sequence-position {
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    min-width: 58px;
    min-height: 54px;
    padding: 0.45rem 0.55rem;
    border: 1px solid rgba(19, 107, 116, 0.14);
    border-radius: 15px;
    color: var(--teal);
    background: linear-gradient(145deg, rgba(228, 239, 237, 0.94), rgba(255, 255, 255, 0.96));
}

.lesson-sequence-position span {
    font-family: "Space Mono", monospace;
    font-size: 0.62rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.lesson-sequence-position strong {
    color: var(--ink);
    font-size: 1rem;
    line-height: 1.1;
}

.lesson-sequence-position-compact {
    min-width: 52px;
    min-height: 42px;
    padding: 0.3rem 0.45rem;
    border-radius: 12px;
}

.lesson-order-controls {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.28rem;
    border: 1px solid rgba(15, 23, 42, 0.09);
    border-radius: 13px;
    background: rgba(255, 255, 255, 0.88);
    box-shadow: 0 7px 18px rgba(15, 23, 42, 0.055);
}

.lesson-order-controls form {
    display: contents;
}

.lesson-order-button {
    display: inline-grid;
    place-items: center;
    width: 36px;
    height: 36px;
    padding: 0;
    border: 1px solid transparent;
    border-radius: 10px;
    color: var(--teal);
    background: rgba(228, 239, 237, 0.72);
    cursor: pointer;
    transition: transform 0.18s ease, color 0.18s ease, background 0.18s ease, border-color 0.18s ease;
}

.lesson-order-button:hover:not(:disabled),
.lesson-order-button:focus-visible:not(:disabled) {
    transform: translateY(-1px);
    border-color: rgba(19, 107, 116, 0.18);
    color: #fff;
    background: var(--teal);
}

.lesson-order-button:disabled {
    opacity: 0.3;
    cursor: not-allowed;
}

[data-lesson-order-list].is-updating {
    pointer-events: none;
}

[data-lesson-order-item],
[data-tree-lesson-item] {
    transition: transform 0.24s ease, opacity 0.24s ease, box-shadow 0.24s ease;
}

[data-lesson-order-item].is-order-moving {
    opacity: 0.62;
    transform: scale(0.992);
}

[data-lesson-order-item].is-order-settled,
[data-tree-lesson-item].is-order-settled {
    animation: lesson-order-settle 0.38s ease;
}

@keyframes lesson-order-settle {
    0% { transform: translateY(5px); }
    100% { transform: translateY(0); }
}

.ges-lesson-sequence-groups {
    display: grid;
    gap: 1rem;
}

.ges-lesson-sequence-group {
    display: grid;
    gap: 0.75rem;
    padding: 0.85rem;
    border: 1px solid rgba(19, 107, 116, 0.1);
    border-radius: 20px;
    background: rgba(247, 250, 249, 0.68);
}

.ges-lesson-sequence-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.15rem 0.15rem 0.05rem;
}

.ges-lesson-sequence-heading > div {
    display: grid;
    gap: 0.15rem;
}

.ges-lesson-sequence-heading span:not(.pill) {
    color: var(--teal);
    font-family: "Space Mono", monospace;
    font-size: 0.65rem;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.ges-lesson-sequence-heading strong {
    color: var(--ink);
}

@media (max-width: 760px) {
    .lesson-management-head,
    .lesson-management-head-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .lesson-management-head-actions,
    .lesson-management-badges {
        justify-content: flex-start;
    }

    .lesson-order-controls {
        align-self: flex-start;
    }

    .course-detail-row-status {
        justify-content: flex-start;
    }
}

.ges-builder-shell {
    width: min(1200px, 100%);
    margin: 0 auto;
}

.ges-builder-hero .tutor-course-hero-copy {
    max-width: 760px;
}

.ges-lesson-builder-panel {
    gap: 1.2rem;
    padding: 1.15rem;
    border-radius: 26px;
    border: 1px solid rgba(19, 107, 116, 0.12);
    background:
        radial-gradient(circle at top right, rgba(224, 180, 83, 0.14), transparent 26%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(246, 241, 234, 0.92));
    box-shadow: 0 22px 48px rgba(15, 23, 35, 0.06);
}

.ges-builder-context-bar {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.85rem;
}

.ges-builder-context-bar span {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.8rem 0.95rem;
    border-radius: 16px;
    border: 1px solid rgba(19, 107, 116, 0.12);
    background: rgba(255, 255, 255, 0.78);
    color: var(--mid);
    line-height: 1.55;
    font-size: 0.88rem;
}

.ges-builder-context-bar i {
    color: var(--brand);
}

.lesson-builder-form {
    display: grid;
    gap: 1rem;
}

.lesson-builder-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.65fr) minmax(280px, 0.85fr);
    gap: 1.15rem;
    align-items: start;
}

.ges-builder-grid {
    gap: 1.25rem;
}

.lesson-builder-main,
.lesson-builder-aside {
    display: grid;
    gap: 1rem;
}

.lesson-builder-section,
.lesson-builder-summary,
.lesson-builder-tips {
    padding: 1rem 1.05rem;
    border: 1px solid rgba(19, 107, 116, 0.12);
    border-radius: 18px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(245, 240, 232, 0.84));
}

.lesson-builder-section {
    display: grid;
    gap: 0.95rem;
}

.ges-builder-section {
    padding: 1.15rem 1.15rem 1.05rem;
}

.lesson-builder-section-head {
    display: flex;
    justify-content: space-between;
    align-items: start;
    gap: 1rem;
}

.lesson-builder-section-head > div {
    display: grid;
    gap: 0.45rem;
}

.lesson-builder-section-head h4 {
    margin: 0;
    font-size: 1.05rem;
}

.lesson-builder-section-head p,
.lesson-builder-tips span {
    color: var(--mid);
    line-height: 1.65;
}

.lesson-thumbnail-studio {
    display: grid;
    grid-template-columns: minmax(220px, 0.9fr) minmax(0, 1.1fr);
    gap: 1rem;
    padding: 0.9rem;
    border: 1px solid rgba(19, 107, 116, 0.16);
    border-radius: 18px;
    background:
        radial-gradient(circle at 12% 14%, rgba(224, 180, 83, 0.13), transparent 32%),
        rgba(255, 255, 255, 0.76);
}

.lesson-thumbnail-studio.has-errors {
    border-color: rgba(155, 48, 39, 0.42);
    background: linear-gradient(135deg, rgba(255, 248, 247, 0.96), rgba(255, 255, 255, 0.92));
}

.lesson-thumbnail-preview {
    position: relative;
    min-height: 190px;
    overflow: hidden;
    border-radius: 15px;
    border: 1px solid rgba(19, 107, 116, 0.14);
    background: linear-gradient(145deg, rgba(225, 239, 239, 0.92), rgba(248, 244, 235, 0.94));
}

.lesson-thumbnail-preview img {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 190px;
    aspect-ratio: 16 / 9;
    object-fit: cover;
}

.lesson-thumbnail-preview img[hidden],
.lesson-thumbnail-placeholder[hidden] {
    display: none;
}

.lesson-thumbnail-placeholder {
    min-height: 190px;
    display: grid;
    place-content: center;
    justify-items: center;
    gap: 0.45rem;
    padding: 1.2rem;
    color: var(--mid);
    text-align: center;
}

.lesson-thumbnail-placeholder strong {
    color: var(--ink);
}

.lesson-thumbnail-placeholder span:last-child {
    max-width: 30ch;
    font-size: 0.8rem;
    line-height: 1.5;
}

.lesson-thumbnail-placeholder-icon {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 16px;
    background: rgba(19, 107, 116, 0.11);
    color: var(--brand);
    font-size: 1.2rem;
}

.lesson-thumbnail-preview-badge {
    position: absolute;
    left: 0.7rem;
    bottom: 0.7rem;
    padding: 0.35rem 0.55rem;
    border-radius: 999px;
    background: rgba(12, 32, 36, 0.84);
    color: #fff;
    font-family: "Space Mono", monospace;
    font-size: 0.61rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    backdrop-filter: blur(8px);
}

.lesson-thumbnail-copy {
    align-content: center;
    display: grid;
    gap: 0.7rem;
}

.lesson-thumbnail-copy > div:first-child {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.7rem;
}

.lesson-thumbnail-copy h4,
.lesson-thumbnail-copy p {
    margin: 0;
}

.lesson-thumbnail-copy p {
    color: var(--mid);
    line-height: 1.6;
}

.lesson-thumbnail-file-field {
    position: relative;
    display: grid;
}

.lesson-thumbnail-file-field > label {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    min-height: 44px;
    padding: 0.68rem 0.9rem;
    border-radius: 12px;
    background: var(--teal);
    color: #fff;
    cursor: pointer;
    font-weight: 700;
    transition: transform 0.18s ease, background-color 0.18s ease, box-shadow 0.18s ease;
}

.lesson-thumbnail-file-field > label:hover {
    transform: translateY(-1px);
    background: #145656;
    box-shadow: 0 10px 24px rgba(19, 107, 116, 0.16);
}

.lesson-thumbnail-file-field:has(.lesson-thumbnail-file-input:focus-visible) > label {
    outline: 3px solid rgba(224, 180, 83, 0.32);
    outline-offset: 2px;
}

.lesson-thumbnail-file-input {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
}

.lesson-thumbnail-selection-status {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    padding: 0.65rem 0.75rem;
    border-radius: 12px;
    background: rgba(19, 107, 116, 0.07);
    color: var(--mid);
    font-size: 0.78rem;
    line-height: 1.5;
}

.lesson-thumbnail-selection-status i {
    margin-top: 0.17rem;
    color: var(--brand);
}

.lesson-thumbnail-studio.has-local-preview .lesson-thumbnail-preview {
    border-color: rgba(19, 107, 116, 0.38);
    box-shadow: 0 12px 28px rgba(19, 107, 116, 0.12);
}

.lesson-thumbnail-media {
    position: relative;
    display: inline-grid;
    flex: 0 0 auto;
    overflow: hidden;
    place-items: center;
    border: 1px solid rgba(19, 107, 116, 0.14);
    border-radius: 13px;
    background: rgba(228, 239, 237, 0.72);
    box-shadow: 0 7px 18px rgba(15, 23, 42, 0.055);
}

.lesson-thumbnail-media img,
.lesson-thumbnail-fallback {
    width: 100%;
    height: 100%;
}

.lesson-thumbnail-media img {
    display: block;
    object-fit: cover;
}

.lesson-thumbnail-fallback {
    display: grid;
    place-items: center;
    background:
        radial-gradient(circle at 72% 22%, rgba(224, 180, 83, 0.28), transparent 32%),
        linear-gradient(145deg, rgba(224, 239, 237, 0.98), rgba(248, 244, 235, 0.96));
    color: var(--teal);
}

.lesson-thumbnail-media-management {
    width: 76px;
    height: 52px;
}

.lesson-thumbnail-media-card {
    width: 72px;
    height: 48px;
}

.lesson-thumbnail-media-compact {
    width: 58px;
    height: 40px;
    border-radius: 11px;
}

.lesson-thumbnail-media-tree {
    width: 42px;
    height: 32px;
    border-radius: 9px;
    font-size: 0.72rem;
}

.lesson-thumbnail-media-feature {
    width: min(100%, 280px);
    aspect-ratio: 16 / 9;
    justify-self: start;
    border-radius: 17px;
    box-shadow: 0 16px 34px rgba(15, 23, 42, 0.1);
}

.lesson-thumbnail-media-feature .lesson-thumbnail-fallback {
    font-size: 1.45rem;
}

.course-detail-row-identity {
    display: flex;
    align-items: center;
    min-width: 0;
    gap: 0.8rem;
}

.lesson-sequence-thumbnail-wrap {
    position: relative;
    display: inline-grid;
}

.lesson-sequence-thumbnail-state {
    position: absolute;
    right: -0.22rem;
    bottom: -0.22rem;
    display: grid;
    width: 1.15rem;
    height: 1.15rem;
    place-items: center;
    border: 2px solid #fff;
    border-radius: 999px;
    background: #fff;
    color: var(--teal);
    font-size: 0.52rem;
    box-shadow: 0 4px 10px rgba(15, 23, 42, 0.12);
}

.lesson-sequence-thumbnail-state.is-complete {
    background: var(--teal);
    color: #fff;
}

.lesson-sequence-thumbnail-state.is-current {
    background: var(--gold);
    color: var(--ink);
}

.ges-builder-inline-note {
    display: flex;
    align-items: flex-start;
    gap: 0.7rem;
    padding: 0.9rem 1rem;
    border-radius: 16px;
    background: rgba(26, 107, 107, 0.07);
    border: 1px solid rgba(26, 107, 107, 0.12);
    color: var(--mid);
    line-height: 1.6;
}

.ges-builder-inline-note i {
    color: var(--brand);
    margin-top: 0.15rem;
}

.lesson-builder-two-col {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.95rem;
}

.lesson-upload-progress-card {
    grid-column: 1 / -1;
    display: grid;
    gap: 0.7rem;
    padding: 0.95rem 1rem;
    border-radius: 18px;
    border: 1px solid rgba(26, 107, 107, 0.16);
    background:
        radial-gradient(circle at top right, rgba(224, 180, 83, 0.16), transparent 30%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(234, 246, 246, 0.9));
}

.lesson-upload-progress-card[hidden] {
    display: none;
}

.lesson-upload-progress-head {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: start;
}

.lesson-upload-progress-head > div {
    display: grid;
    gap: 0.45rem;
}

.lesson-upload-progress-head strong {
    color: var(--ink);
}

.lesson-upload-progress-percent {
    flex: 0 0 auto;
    min-width: 58px;
    padding: 0.45rem 0.65rem;
    border-radius: 999px;
    background: var(--teal);
    color: #fff;
    font-family: "Space Mono", monospace;
    font-size: 0.72rem;
    text-align: center;
}

.lesson-upload-progress-track {
    height: 0.65rem;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(26, 107, 107, 0.12);
}

.lesson-upload-progress-track span {
    display: block;
    width: 0%;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--teal), var(--gold));
    transition: width 0.22s ease;
}

.lesson-upload-progress-card p {
    margin: 0;
    color: var(--mid);
    line-height: 1.6;
}

.video-processing-card {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-top: 16px;
    padding: 16px 18px;
    border: 1px solid rgba(18, 104, 105, 0.18);
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(238, 248, 247, 0.96), rgba(255, 253, 248, 0.96));
}

.video-processing-icon {
    display: grid;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 14px;
    color: #fff;
    background: var(--teal);
}

.video-processing-copy {
    display: grid;
    flex: 1 1 auto;
    gap: 3px;
    min-width: 0;
}

.video-processing-content {
    display: grid;
    flex: 1 1 auto;
    gap: 12px;
    min-width: 0;
}

.video-processing-progress {
    display: grid;
    gap: 7px;
}

.video-processing-progress[hidden] {
    display: none;
}

.video-processing-progress-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    color: var(--mid);
    font-size: 0.82rem;
}

.video-processing-progress-head strong {
    color: var(--teal);
    font-family: "Space Mono", monospace;
    font-size: 0.68rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.video-processing-progress-track span {
    width: 38%;
    animation: lesson-video-processing-progress 1.7s ease-in-out infinite;
}

@keyframes lesson-video-processing-progress {
    0% { transform: translateX(-110%); }
    55% { transform: translateX(95%); }
    100% { transform: translateX(270%); }
}

.video-processing-copy p {
    margin: 0;
    color: var(--mid);
}

.video-processing-card.is-failed {
    border-color: rgba(174, 61, 45, 0.28);
    background: #fff8f5;
}

.video-processing-card.is-failed .video-processing-icon {
    background: #ad4637;
}

.video-processing-card.is-ready .video-processing-icon {
    background: #2d8666;
}

@media (max-width: 720px) {
    .video-processing-card {
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .video-processing-retry {
        width: 100%;
    }
}

/* BECE Section B theory authoring */
.theory-bank-hero {
    background:
        radial-gradient(circle at 90% 10%, rgba(228, 179, 47, 0.2), transparent 28%),
        linear-gradient(135deg, #123f46, #176f6c);
    color: #fff;
}

.theory-bank-hero .eyebrow-inline,
.theory-bank-hero p {
    color: rgba(255, 255, 255, 0.82);
}

.workspace-stat-grid.compact-stat-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.8rem;
    margin-bottom: 1rem;
}

.workspace-stat-grid.compact-stat-grid article {
    display: grid;
    gap: 0.3rem;
    padding: 1rem 1.15rem;
    border: 1px solid rgba(18, 63, 70, 0.12);
    border-radius: 1rem;
    background: rgba(255, 255, 255, 0.88);
}

.workspace-stat-grid.compact-stat-grid span {
    color: var(--muted, #686663);
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.workspace-stat-grid.compact-stat-grid strong {
    font-family: var(--font-display, Georgia, serif);
    font-size: 1.8rem;
}

.theory-question-bank-list,
.theory-preview-parts {
    display: grid;
    gap: 0.85rem;
    margin: 1rem 0 0;
    padding: 0;
    list-style: none;
}

.theory-bank-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: center;
    padding: 1.15rem;
    border: 1px solid rgba(18, 63, 70, 0.13);
    border-left: 0.3rem solid var(--teal, #167873);
    border-radius: 1rem;
    background: linear-gradient(120deg, rgba(238, 247, 245, 0.76), #fff 65%);
}

.theory-bank-card-copy,
.theory-bank-card-copy h3,
.theory-readiness-note {
    margin: 0;
}

.theory-bank-card-copy h3 {
    margin-top: 0.65rem;
}

.theory-bank-card-actions,
.theory-part-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
    justify-content: flex-end;
}

.theory-bank-card-actions form,
.theory-part-actions form {
    margin: 0;
}

.theory-readiness-note {
    margin-top: 0.65rem;
    color: #805e12;
    font-size: 0.9rem;
}

.theory-mark-meter {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(12rem, 24rem);
    gap: 1.25rem;
    align-items: center;
    margin-bottom: 1rem;
    padding: 1rem 1.2rem;
    border: 1px solid rgba(186, 123, 18, 0.25);
    border-radius: 1rem;
    background: linear-gradient(120deg, #fff7e5, #fff);
}

.theory-mark-meter.is-balanced {
    border-color: rgba(22, 120, 115, 0.3);
    background: linear-gradient(120deg, #e9f7f3, #fff);
}

.theory-mark-meter p,
.theory-mark-meter strong,
.theory-mark-meter small {
    display: block;
    margin: 0;
}

.theory-mark-meter small {
    margin-top: 0.25rem;
    color: var(--muted, #686663);
}

.theory-mark-track {
    height: 0.65rem;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(18, 63, 70, 0.12);
}

.theory-mark-track span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: #c88917;
    transition: width 180ms ease, background-color 180ms ease;
}

.theory-mark-meter.is-balanced .theory-mark-track span {
    background: var(--teal, #167873);
}

.theory-builder-layout {
    display: grid;
    grid-template-columns: minmax(20rem, 0.85fr) minmax(28rem, 1.15fr);
    gap: 1rem;
    align-items: start;
}

.theory-builder-layout > .content-panel {
    min-width: 0;
}

.theory-part-list {
    display: grid;
    gap: 0.7rem;
    margin: 1rem 0 0;
    padding: 0;
    list-style: none;
}

.theory-part-list > li {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.8rem 1rem;
    align-items: center;
    padding: 0.9rem;
    border: 1px solid rgba(18, 63, 70, 0.12);
    border-radius: 0.9rem;
    background: rgba(247, 250, 249, 0.86);
}

.theory-part-list > li.is-editing {
    border-color: var(--teal, #167873);
    box-shadow: 0 0 0 0.18rem rgba(22, 120, 115, 0.1);
}

.theory-part-order {
    display: grid;
    width: 4rem;
    min-height: 4rem;
    place-content: center;
    text-align: center;
    border-radius: 0.85rem;
    color: #fff;
    background: #123f46;
}

.theory-part-order span,
.theory-part-summary p {
    color: inherit;
    font-size: 0.76rem;
}

.theory-part-summary h4,
.theory-part-summary p,
.theory-solution-fields h4 {
    margin: 0;
}

.theory-part-summary p {
    margin-top: 0.25rem;
    color: var(--muted, #686663);
}

.theory-part-actions {
    grid-column: 1 / -1;
    justify-content: flex-start;
    padding-top: 0.65rem;
    border-top: 1px solid rgba(18, 63, 70, 0.09);
}

.theory-part-form,
.theory-solution-fields,
.theory-question-settings form {
    display: grid;
    gap: 1rem;
}

.theory-editor-details,
.theory-question-settings > details,
.theory-solution-preview {
    border: 1px solid rgba(18, 63, 70, 0.12);
    border-radius: 0.9rem;
    background: rgba(247, 250, 249, 0.78);
}

.theory-editor-details > summary,
.theory-question-settings > details > summary,
.theory-solution-preview > summary {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: center;
    padding: 0.9rem 1rem;
    cursor: pointer;
    font-weight: 750;
}

.theory-editor-details[open] > summary,
.theory-question-settings > details[open] > summary,
.theory-solution-preview[open] > summary {
    border-bottom: 1px solid rgba(18, 63, 70, 0.1);
}

.theory-editor-details > div,
.theory-question-settings form,
.theory-solution-preview > div {
    padding: 1rem;
}

.theory-question-settings {
    margin-top: 1rem;
}

.theory-readiness-panel {
    margin-top: 1rem;
    padding: 1rem;
    border-radius: 0.9rem;
    color: #684b0e;
    background: #fff6df;
}

.theory-readiness-panel ul {
    margin: 0.6rem 0 0;
    padding-left: 1.25rem;
}

.theory-question-preview {
    display: grid;
    gap: 1rem;
}

.theory-question-preview > header h2 {
    max-width: 70ch;
    margin: 0.8rem 0 0;
}

.theory-question-preview figure {
    margin: 0;
}

.theory-question-preview img {
    display: block;
    max-width: min(100%, 50rem);
    max-height: 32rem;
    object-fit: contain;
    border-radius: 0.8rem;
}

.theory-question-preview figcaption {
    margin-top: 0.4rem;
    color: var(--muted, #686663);
    font-size: 0.85rem;
}

.theory-preview-parts > li {
    padding: 1.15rem;
    border: 1px solid rgba(18, 63, 70, 0.13);
    border-radius: 1rem;
    background: #fff;
}

.theory-preview-part-heading {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: center;
    margin-bottom: 0.75rem;
}

.theory-preview-part-heading span {
    display: grid;
    width: 2.5rem;
    height: 2.5rem;
    place-items: center;
    border-radius: 50%;
    color: #fff;
    background: #123f46;
}

.theory-response-guidance {
    padding: 0.75rem;
    border-left: 0.25rem solid #d8a21c;
    background: #fff9e9;
}

.theory-format-block pre,
.theory-text-table pre {
    max-width: 100%;
    overflow: auto;
    padding: 0.85rem;
    border-radius: 0.75rem;
    white-space: pre-wrap;
    background: #f2f6f5;
}

.theory-preview-decision {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: center;
    margin-top: 1rem;
}

@media (max-width: 980px) {
    .theory-builder-layout,
    .theory-bank-card,
    .theory-mark-meter {
        grid-template-columns: 1fr;
    }

    .theory-bank-card-actions {
        justify-content: flex-start;
    }
}

@media (max-width: 640px) {
    .workspace-stat-grid.compact-stat-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .theory-preview-decision {
        align-items: stretch;
        flex-direction: column;
    }

    .theory-bank-card-actions .button,
    .theory-bank-card-actions form,
    .theory-bank-card-actions form .button {
        width: 100%;
    }
}

@media (prefers-reduced-motion: reduce) {
    .video-processing-progress-track span {
        width: 72%;
        animation: none;
    }
}

.lesson-builder-toggle {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-height: 48px;
    padding: 0.8rem 0.95rem;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.78);
}

.lesson-builder-toggle input[type="checkbox"] {
    width: 18px;
    height: 18px;
    margin: 0;
}

.lesson-builder-toggle span {
    color: var(--mid);
    line-height: 1.55;
    font-size: 0.88rem;
}

.lesson-builder-summary {
    display: grid;
    gap: 0.8rem;
}

.ges-builder-summary-head {
    display: grid;
    gap: 0.45rem;
}

.lesson-builder-summary strong {
    font-size: 1.05rem;
    line-height: 1.45;
}

.lesson-summary-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
}

.lesson-summary-card {
    display: grid;
    gap: 0.25rem;
    padding: 0.85rem 0.9rem;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.78);
    border: 1px solid rgba(13, 13, 13, 0.07);
}

.lesson-summary-card span {
    font-family: "Space Mono", monospace;
    font-size: 0.62rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--teal);
}

.lesson-summary-card strong {
    font-size: 0.98rem;
}

.lesson-builder-tips {
    display: grid;
    gap: 0.6rem;
}

.ges-builder-notes-panel {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(239, 247, 247, 0.9));
}

.lesson-builder-tips strong {
    color: var(--ink);
}

.lesson-builder-support-panel {
    gap: 0.85rem;
}

.lesson-support-grid {
    grid-template-columns: 1fr;
}

.ges-builder-footer {
    padding-top: 0.35rem;
    border-top: 1px solid rgba(19, 107, 116, 0.1);
}

.resource-workspace-grid {
    align-items: start;
}

.resource-management-list {
    display: grid;
    gap: 1rem;
    margin-top: 1rem;
}

.resource-management-card {
    display: grid;
    gap: 0.9rem;
    padding: 1rem 1.05rem;
    border: 1px solid rgba(19, 107, 116, 0.14);
    border-radius: 18px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(245, 240, 232, 0.82));
}

.resource-management-head {
    display: flex;
    justify-content: space-between;
    align-items: start;
    gap: 1rem;
}

.resource-management-title {
    display: grid;
    gap: 0.3rem;
}

.resource-management-title strong {
    font-size: 1rem;
    color: var(--ink);
}

.resource-management-title span {
    color: var(--mid);
    line-height: 1.6;
}

.resource-management-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

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

.resource-management-actions form {
    margin: 0;
}

.inline-action-form {
    margin: 0;
}

.assessment-builder-workspace {
    align-items: start;
}

.assessment-builder-single-column {
    width: min(100%, 860px);
    margin: 0 auto;
    display: grid;
    gap: 1.15rem;
    padding-right: 0;
}

.assessment-builder-overview-bar {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem 1.2rem;
    align-items: start;
}

.assessment-builder-overview-main,
.assessment-builder-overview-side {
    display: grid;
    gap: 0.9rem;
}

.assessment-builder-overview-side .assessment-builder-status-strip > * {
    flex: 1 1 220px;
}

.assessment-builder-overview-side .assessment-builder-top-actions {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(138px, 1fr));
    gap: 0.6rem;
}

.assessment-builder-overview-side .assessment-builder-top-actions .button,
.assessment-builder-overview-side .assessment-builder-top-actions form .button {
    width: 100%;
    justify-content: center;
}

.assessment-builder-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1.15rem;
    align-items: start;
}

.assessment-builder-navigator-panel {
    display: none;
}

.assessment-builder-navigator-card {
    position: sticky;
    top: 7.5rem;
    display: grid;
    gap: 1rem;
    padding: 1rem;
    border-radius: 22px;
    border: 1px solid rgba(17, 24, 39, 0.08);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.985), rgba(241, 247, 246, 0.94));
    box-shadow: 0 20px 40px rgba(17, 24, 39, 0.06);
}

.assessment-builder-navigator-details {
    display: grid;
    gap: 0.9rem;
}

.assessment-builder-navigator-details > summary {
    cursor: pointer;
    list-style: none;
}

.assessment-builder-navigator-details > summary::-webkit-details-marker {
    display: none;
}

.assessment-builder-navigator-head {
    display: flex;
    justify-content: space-between;
    gap: 0.9rem;
    align-items: start;
}

.assessment-builder-navigator-head h3 {
    margin: 0.25rem 0 0;
    font-size: 1rem;
    color: var(--ink);
}

.assessment-builder-navigator-head > span:first-child {
    display: grid;
    gap: 0.22rem;
}

.assessment-builder-navigator-head > span:first-child > strong {
    color: var(--ink);
    font-size: 1rem;
}

.assessment-builder-navigator-summary-meta {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    color: var(--mid);
}

.assessment-builder-navigator-summary-meta > i {
    transition: transform 0.18s ease;
}

.assessment-builder-navigator-details:not([open]) .assessment-builder-navigator-summary-meta > i {
    transform: rotate(-90deg);
}

.assessment-builder-navigator-list {
    display: grid;
    gap: 0.55rem;
    max-height: min(62vh, 34rem);
    overflow-y: auto;
    padding-right: 0.2rem;
}

.assessment-builder-navigator-link {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.75rem;
    align-items: start;
    padding: 0.75rem 0.8rem;
    border-radius: 16px;
    border: 1px solid rgba(17, 24, 39, 0.06);
    background: rgba(255, 255, 255, 0.76);
    text-decoration: none;
    transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

.assessment-builder-navigator-link:hover,
.assessment-builder-navigator-link:focus-visible {
    transform: translateY(-1px);
    border-color: rgba(26, 107, 107, 0.18);
    box-shadow: 0 12px 26px rgba(17, 24, 39, 0.06);
}

.assessment-builder-navigator-link.is-active,
.assessment-builder-navigator-link.is-current {
    border-color: rgba(26, 107, 107, 0.24);
    background: linear-gradient(180deg, rgba(234, 245, 243, 0.98), rgba(255, 255, 255, 0.94));
    box-shadow: inset 0 0 0 1px rgba(26, 107, 107, 0.08);
}

.assessment-builder-navigator-order {
    display: inline-grid;
    place-items: center;
    min-width: 2.25rem;
    height: 2.25rem;
    padding: 0 0.55rem;
    border-radius: 999px;
    background: rgba(201, 168, 76, 0.14);
    color: #8d6e19;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.06em;
}

.assessment-builder-navigator-link.is-active .assessment-builder-navigator-order,
.assessment-builder-navigator-link.is-current .assessment-builder-navigator-order {
    background: rgba(26, 107, 107, 0.16);
    color: var(--teal);
}

.assessment-builder-navigator-copy {
    display: grid;
    gap: 0.18rem;
    min-width: 0;
}

.assessment-builder-navigator-copy strong {
    color: var(--ink);
    font-size: 0.86rem;
    line-height: 1.45;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.assessment-builder-navigator-copy small {
    color: var(--mid);
    line-height: 1.4;
}

.assessment-builder-navigator-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.36rem;
    align-items: center;
}

.assessment-builder-navigator-meta small {
    display: inline-flex;
    align-items: center;
    min-height: 1.35rem;
    padding: 0.18rem 0.36rem;
    border-radius: 999px;
    background: rgba(241, 246, 245, 0.9);
    font-family: "Space Mono", monospace;
    font-size: 0.55rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    line-height: 1;
    text-transform: uppercase;
}

.assessment-builder-navigator-meta small.is-ready {
    background: rgba(234, 247, 237, 0.96);
    color: #2f6d40;
}

.assessment-builder-navigator-meta small.is-pending {
    background: rgba(255, 247, 226, 0.96);
    color: #815f19;
}

.assessment-builder-shortcut-note {
    display: grid;
    gap: 0.35rem;
    padding: 0.9rem;
    border-radius: 16px;
    background: rgba(250, 247, 242, 0.82);
    border: 1px solid rgba(17, 24, 39, 0.06);
}

.assessment-builder-shortcut-note p {
    margin: 0;
    color: var(--mid);
    line-height: 1.65;
    font-size: 0.84rem;
}

.assessment-builder-shortcut-note kbd {
    display: inline-block;
    min-width: 1.45rem;
    padding: 0.1rem 0.35rem;
    border-radius: 8px;
    border: 1px solid rgba(17, 24, 39, 0.1);
    background: rgba(255, 255, 255, 0.94);
    color: var(--ink);
    font-family: "Space Mono", monospace;
    font-size: 0.7rem;
    text-align: center;
}

.assessment-builder-navigator-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    min-height: 2.9rem;
    padding: 0.78rem 0.95rem;
    border-radius: 16px;
    border: 1px solid rgba(26, 107, 107, 0.16);
    background: rgba(255, 255, 255, 0.9);
    color: var(--teal);
    font-weight: 700;
    text-decoration: none;
    transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

.assessment-builder-navigator-cta:hover,
.assessment-builder-navigator-cta:focus-visible {
    transform: translateY(-1px);
    border-color: rgba(26, 107, 107, 0.24);
    box-shadow: 0 12px 24px rgba(26, 107, 107, 0.1);
    background: rgba(239, 248, 246, 0.96);
}

.assessment-builder-app {
    display: grid;
    gap: 1.2rem;
    transition: opacity 0.2s ease, filter 0.2s ease;
}

.assessment-builder-app.is-loading {
    opacity: 0.74;
    filter: saturate(0.94);
    pointer-events: none;
}

.assessment-form-stage {
    display: grid;
    gap: 1.25rem;
}

@media (min-width: 1260px) {
    .assessment-builder-single-column {
        width: min(100%, 1140px);
        padding-right: 0;
    }

    .assessment-builder-layout {
        grid-template-columns: minmax(0, 1fr) 252px;
    }

    .assessment-builder-navigator-panel {
        display: block;
        order: 2;
    }

    .assessment-form-stage {
        order: 1;
    }
}

@media (max-width: 900px) {
    .assessment-builder-overview-side .assessment-builder-top-actions {
        grid-template-columns: repeat(auto-fit, minmax(148px, 1fr));
    }
}

@media (max-width: 640px) {
    .assessment-builder-overview-side .assessment-builder-top-actions {
        grid-template-columns: 1fr;
    }
}

.assessment-question-insert-row {
    position: relative;
    display: grid;
    justify-items: center;
    gap: 0.55rem;
    margin: -0.1rem 0 0.15rem;
}

.assessment-question-insert-line {
    width: 100%;
    height: 1px;
    background: linear-gradient(90deg, rgba(17, 24, 39, 0), rgba(17, 24, 39, 0.12) 18%, rgba(17, 24, 39, 0.12) 82%, rgba(17, 24, 39, 0));
}

.assessment-question-insert-button,
.assessment-question-insert-active-label {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.55rem 0.95rem;
    border-radius: 999px;
    font-size: 0.8rem;
    font-weight: 700;
    transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease, color 0.18s ease, box-shadow 0.18s ease;
}

.assessment-question-insert-button {
    border: 1px dashed rgba(26, 107, 107, 0.22);
    background: rgba(255, 255, 255, 0.84);
    color: var(--mid);
}

.assessment-question-insert-button:hover,
.assessment-question-insert-button:focus-visible {
    color: var(--teal);
    border-color: rgba(26, 107, 107, 0.4);
    background: rgba(241, 248, 247, 0.94);
    box-shadow: 0 10px 22px rgba(26, 107, 107, 0.08);
    transform: translateY(-1px);
}

.assessment-question-insert-active-label {
    border: 1px solid rgba(26, 107, 107, 0.2);
    background: rgba(241, 248, 247, 0.94);
    color: var(--teal);
}

.assessment-question-insert-active-label i {
    font-size: 0.82rem;
}

.assessment-question-insert-row.is-active .assessment-question-insert-line {
    background: linear-gradient(90deg, rgba(17, 24, 39, 0), rgba(26, 107, 107, 0.18) 18%, rgba(26, 107, 107, 0.18) 82%, rgba(17, 24, 39, 0));
}

.assessment-builder-main {
    display: grid;
    gap: 1rem;
}

.assessment-form-stage,
.assessment-question-sheet,
#question-composer,
.assessment-question-insert-row {
    scroll-margin-top: 8rem;
}

.assessment-builder-rail {
    display: grid;
    gap: 1rem;
    align-content: start;
}

.assessment-form-sheet {
    position: relative;
    overflow: hidden;
    display: grid;
    gap: 1rem;
    padding: 1.15rem 1.15rem 1.2rem;
    border: 1px solid rgba(19, 107, 116, 0.12);
    border-radius: 22px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.99), rgba(247, 243, 235, 0.92));
    box-shadow: 0 18px 38px rgba(0, 0, 0, 0.05);
    transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
}

.assessment-form-sheet-bar {
    width: calc(100% + 2.3rem);
    height: 0.45rem;
    margin: -1.15rem -1.15rem 0;
    background: linear-gradient(90deg, rgba(26, 107, 107, 0.95), rgba(201, 168, 76, 0.88));
}

.assessment-form-header-card {
    gap: 0.95rem;
}

.assessment-builder-header-sheet {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.99), rgba(250, 247, 241, 0.88));
    box-shadow: 0 14px 30px rgba(17, 24, 39, 0.04);
}

.assessment-form-header-copy {
    display: grid;
    gap: 0.5rem;
}

.assessment-form-header-copy h3 {
    margin: 0;
    font-size: clamp(1.3rem, 1.8vw, 1.75rem);
}

.assessment-form-header-copy p {
    margin: 0;
    color: var(--mid);
    line-height: 1.62;
    max-width: 62ch;
}

.assessment-form-header-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.assessment-builder-header-sheet .assessment-form-header-meta .pill {
    padding: 0.34rem 0.62rem;
    font-size: 0.68rem;
    background: rgba(255, 255, 255, 0.86);
    border-color: rgba(17, 24, 39, 0.08);
}

.assessment-builder-status-strip {
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 0.7rem;
}

.assessment-builder-save-chip {
    display: inline-grid;
    gap: 0.16rem;
    min-width: 228px;
    padding: 0.58rem 0.8rem;
    border-radius: 14px;
    border: 1px solid rgba(26, 107, 107, 0.12);
    background: rgba(241, 248, 247, 0.72);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65);
    transition: border-color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.assessment-builder-progress-chip {
    display: inline-grid;
    gap: 0.22rem;
    min-width: 220px;
    padding: 0.62rem 0.84rem;
    border-radius: 14px;
    border: 1px solid rgba(17, 24, 39, 0.08);
    background: rgba(255, 255, 255, 0.78);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.68);
}

.assessment-builder-progress-chip strong {
    font-size: 0.92rem;
    color: var(--ink);
}

.assessment-builder-progress-chip small {
    color: var(--mid);
    font-size: 0.74rem;
}

.assessment-builder-progress-track {
    position: relative;
    width: 100%;
    height: 0.34rem;
    margin-top: 0.18rem;
    border-radius: 999px;
    background: rgba(17, 24, 39, 0.08);
    overflow: hidden;
}

.assessment-builder-progress-fill {
    position: absolute;
    inset: 0 auto 0 0;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(26, 107, 107, 0.94), rgba(201, 168, 76, 0.88));
}

.assessment-builder-save-chip strong {
    font-size: 0.9rem;
    color: var(--ink);
}

.assessment-builder-save-chip small {
    color: var(--mid);
    font-size: 0.74rem;
}

.assessment-builder-save-chip.is-saved {
    border-color: rgba(26, 107, 107, 0.14);
    background: rgba(241, 248, 247, 0.82);
}

.assessment-builder-save-chip.is-dirty {
    border-color: rgba(201, 168, 76, 0.2);
    background: rgba(252, 248, 238, 0.9);
    box-shadow: 0 10px 22px rgba(201, 168, 76, 0.08);
}

.assessment-builder-save-chip.is-saving {
    border-color: rgba(26, 107, 107, 0.18);
    background: rgba(233, 243, 242, 0.95);
    box-shadow: 0 12px 26px rgba(26, 107, 107, 0.1);
    transform: translateY(-1px);
}

.assessment-builder-save-chip.is-dirty strong {
    color: #7f5f11;
}

.assessment-builder-save-chip.is-saving strong {
    color: var(--teal);
}

.assessment-builder-summary-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.72rem;
}

.assessment-builder-summary-chip {
    display: grid;
    gap: 0.25rem;
    padding: 0.78rem 0.88rem;
    border-radius: 18px;
    border: 1px solid rgba(17, 24, 39, 0.08);
    background: rgba(255, 255, 255, 0.72);
}

.assessment-builder-summary-chip span {
    font-size: 0.69rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--mid);
    font-weight: 700;
}

.assessment-builder-summary-chip strong {
    font-size: 1.04rem;
    color: var(--ink);
}

.assessment-builder-save-status,
.assessment-builder-readiness {
    display: grid;
    gap: 0.85rem;
    padding: 1rem 1.05rem;
    border-radius: 18px;
    border: 1px solid rgba(17, 24, 39, 0.08);
    background: rgba(255, 255, 255, 0.88);
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease, background 0.2s ease;
}

.assessment-builder-save-status {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
}

.assessment-builder-save-status strong,
.assessment-builder-readiness-head strong {
    display: block;
    font-size: 1rem;
    color: var(--ink);
    margin-top: 0.18rem;
}

.assessment-builder-save-status p,
.assessment-builder-readiness-head p {
    margin: 0.35rem 0 0;
    color: var(--mid);
    line-height: 1.7;
}

.assessment-builder-readiness {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.95), rgba(247, 243, 236, 0.84));
}

.assessment-builder-readiness.is-ready {
    background: linear-gradient(180deg, rgba(245, 252, 247, 0.98), rgba(255, 255, 255, 0.92));
    border-color: rgba(122, 173, 138, 0.24);
    box-shadow: 0 14px 30px rgba(122, 173, 138, 0.08);
}

.assessment-builder-readiness-head {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: start;
}

.assessment-builder-readiness-list {
    display: grid;
    gap: 0.75rem;
}

.assessment-builder-readiness-item {
    display: grid;
    gap: 0.28rem;
    padding: 0.9rem 0.95rem;
    border-radius: 16px;
    border: 1px solid rgba(17, 24, 39, 0.08);
    background: rgba(255, 255, 255, 0.8);
}

.assessment-builder-readiness-item strong {
    font-size: 0.95rem;
    color: var(--ink);
}

.assessment-builder-readiness-item p {
    margin: 0;
    color: var(--mid);
    line-height: 1.65;
}

.assessment-builder-readiness-item[href] {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    color: inherit;
    text-decoration: none;
    transition: border-color 180ms ease, transform 180ms ease, box-shadow 180ms ease;
}

.assessment-builder-readiness-item[href]:hover,
.assessment-builder-readiness-item[href]:focus-visible {
    border-color: rgba(24, 120, 122, 0.48);
    box-shadow: 0 10px 22px rgba(12, 39, 44, 0.08);
    transform: translateY(-1px);
}

.assessment-builder-readiness-item[href] > .fa-arrow-right {
    color: var(--teal);
}

.assessment-builder-ready-copy {
    margin: 0;
    color: var(--teal);
    font-weight: 700;
}

.assessment-builder-ready-copy .fa-circle-check {
    margin-right: 0.4rem;
}

.assessment-builder-publish-confirmation {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    border-color: rgba(71, 137, 103, 0.28);
    background: linear-gradient(135deg, rgba(236, 248, 240, 0.96), rgba(255, 255, 255, 0.96));
}

.assessment-builder-publish-confirmation strong,
.assessment-builder-publish-confirmation p {
    display: block;
}

.assessment-builder-publish-confirmation strong {
    margin-top: 0.22rem;
    color: var(--ink);
}

.assessment-builder-publish-confirmation p {
    margin: 0.35rem 0 0;
    color: var(--mid);
}

.assessment-builder-save-chip.is-retry {
    border-color: rgba(184, 91, 69, 0.34);
    background: rgba(255, 243, 238, 0.94);
}

@media (min-width: 901px) and (max-width: 1259px) {
    .assessment-builder-overview-side .assessment-builder-top-actions {
        grid-template-columns: repeat(auto-fit, minmax(156px, 1fr));
    }
}

@media (min-width: 1260px) {
    .assessment-builder-publish-confirmation {
        min-height: 6.35rem;
    }
}

.assessment-builder-readiness-item.tone-warning {
    border-color: rgba(201, 168, 76, 0.28);
    background: rgba(255, 249, 235, 0.92);
}

.assessment-builder-readiness-item.tone-ink {
    border-color: rgba(17, 24, 39, 0.12);
}

.assessment-builder-top-actions {
    justify-content: flex-start;
}

.assessment-builder-top-actions form {
    margin: 0;
}

.assessment-form-editor-card .panel-head,
.assessment-question-library .panel-head,
.assessment-option-panel .panel-head {
    margin-bottom: 0;
    align-items: start;
}

.assessment-google-form {
    gap: 0.95rem;
}

.assessment-google-form .form-field {
    gap: 0.45rem;
}

.assessment-google-form .form-field label {
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--mid);
}

.assessment-google-form .form-field input,
.assessment-google-form .form-field select,
.assessment-google-form .form-field textarea {
    border-radius: 16px;
    border-color: rgba(17, 24, 39, 0.08);
    background: rgba(255, 255, 255, 0.98);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
}

.assessment-google-form .form-field textarea {
    min-height: 140px;
}

.assessment-question-card-list,
.assessment-option-card-list {
    gap: 1rem;
}

.assessment-question-sheet {
    position: relative;
    scroll-margin-top: 8.25rem;
    border-radius: 24px;
    transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease, background 0.22s ease;
}

.assessment-question-sheet.is-active {
    overflow: visible;
    padding-right: 1.15rem;
    border-color: rgba(26, 107, 107, 0.26);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.995), rgba(244, 249, 248, 0.94));
    box-shadow:
        0 24px 44px rgba(26, 107, 107, 0.12),
        0 0 0 3px rgba(26, 107, 107, 0.08);
}

.assessment-question-sheet.is-active::before {
    content: "";
    position: absolute;
    top: 1rem;
    bottom: 1rem;
    left: -0.42rem;
    width: 0.28rem;
    border-radius: 999px;
    background: linear-gradient(180deg, rgba(26, 107, 107, 0.95), rgba(201, 168, 76, 0.82));
    box-shadow: 0 0 0 5px rgba(26, 107, 107, 0.08);
}

.assessment-question-sheet.is-active .assessment-form-sheet-bar {
    display: none;
}

.assessment-question-sheet.is-active .assessment-question-sheet-header h3 {
    color: #14363a;
}

.assessment-question-sheet.is-active .assessment-question-header-meta .pill {
    border-color: rgba(26, 107, 107, 0.16);
    background: rgba(232, 243, 241, 0.96);
}

.assessment-question-sheet.is-selected {
    border-color: rgba(26, 107, 107, 0.22);
    box-shadow: 0 20px 42px rgba(26, 107, 107, 0.08);
}

.assessment-question-sheet.is-editing {
    border-color: rgba(201, 168, 76, 0.28);
    box-shadow: 0 20px 42px rgba(201, 168, 76, 0.08);
}

.assessment-question-sheet.is-collapsed {
    gap: 0.45rem;
    padding: 0.9rem 1rem 0.95rem;
}

.assessment-question-sheet.is-collapsed:hover {
    transform: translateY(-2px);
    box-shadow: 0 20px 38px rgba(17, 24, 39, 0.06);
}

.assessment-question-sheet.is-collapsed .assessment-form-sheet-bar {
    width: calc(100% + 2rem);
    height: 0.32rem;
    margin: -0.9rem -1rem 0;
}

.assessment-question-sheet.is-collapsed .assessment-builder-question-media,
.assessment-question-sheet.is-collapsed .assessment-question-card-note,
.assessment-question-sheet.is-collapsed .assessment-inline-option-preview,
.assessment-question-sheet.is-collapsed .assessment-flow-preview-list,
.assessment-question-sheet.is-collapsed .assessment-inline-config,
.assessment-question-sheet.is-collapsed .assessment-inline-question-form {
    display: none;
}

.assessment-question-sheet.is-collapsed .assessment-question-sheet-header h3 {
    margin-top: 0.15rem;
    font-size: 1.02rem;
    line-height: 1.38;
}

.assessment-question-sheet.is-collapsed .assessment-question-sheet-header p {
    margin-top: 0.28rem;
    font-size: 0.9rem;
}

.assessment-question-sheet.is-collapsed .assessment-question-sheet-header {
    gap: 0.8rem;
}

.assessment-question-sheet.is-collapsed .student-pulse-label {
    font-size: 0.64rem;
}

.assessment-question-sheet.is-spotlight {
    animation: assessmentBuilderSpotlight 1.4s ease;
}

.assessment-question-sheet.is-soft-focus {
    animation: assessmentBuilderSoftFocus 0.85s ease;
}

@keyframes assessmentBuilderSpotlight {
    0% {
        transform: translateY(6px) scale(0.992);
        box-shadow:
            0 0 0 0 rgba(26, 107, 107, 0.24),
            0 26px 52px rgba(26, 107, 107, 0.18);
    }
    45% {
        transform: translateY(0) scale(1);
        box-shadow:
            0 0 0 10px rgba(26, 107, 107, 0.1),
            0 28px 56px rgba(26, 107, 107, 0.16);
    }
    100% {
        transform: translateY(0) scale(1);
    }
}

@keyframes assessmentBuilderSoftFocus {
    0% {
        box-shadow:
            0 0 0 0 rgba(26, 107, 107, 0.18),
            0 18px 36px rgba(26, 107, 107, 0.08);
    }
    55% {
        box-shadow:
            0 0 0 8px rgba(26, 107, 107, 0.08),
            0 24px 44px rgba(26, 107, 107, 0.14);
    }
    100% {
        box-shadow: inherit;
    }
}

.assessment-question-composer {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.99), rgba(241, 247, 246, 0.92));
}

.assessment-question-inline-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.55rem;
    margin: 1rem 0 0.3rem;
    padding: 0.65rem;
    border: 1px solid rgba(26, 107, 107, 0.13);
    border-radius: 18px;
    background: linear-gradient(180deg, rgba(241, 249, 248, 0.96), rgba(255, 255, 255, 0.94));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.82);
}

.assessment-question-inline-toolbar form {
    margin: 0;
}

.assessment-question-inline-toolbar .button {
    min-height: 2.5rem;
    white-space: nowrap;
}

.assessment-question-toolbar-delete {
    color: #9b3027;
    border-color: rgba(155, 48, 39, 0.2);
    background: rgba(255, 247, 245, 0.98);
}

.assessment-question-toolbar-delete:hover,
.assessment-question-toolbar-delete:focus-visible {
    color: #8d271e;
    border-color: rgba(155, 48, 39, 0.34);
    background: rgba(255, 239, 235, 0.98);
}

.assessment-builder-empty-starter {
    display: grid;
    gap: 0.95rem;
    padding: 1rem 1.05rem;
    border-radius: 18px;
    border: 1px solid rgba(17, 24, 39, 0.08);
    background:
        linear-gradient(180deg, rgba(252, 251, 248, 0.98), rgba(241, 248, 247, 0.9));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75);
}

.assessment-builder-empty-copy {
    display: grid;
    gap: 0.35rem;
}

.assessment-builder-empty-copy strong {
    color: var(--ink);
    font-size: 1rem;
}

.assessment-builder-empty-copy p {
    margin: 0;
    color: var(--mid);
    line-height: 1.7;
}

.assessment-builder-empty-preset-row {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.7rem;
}

.assessment-builder-empty-preset {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    gap: 0.6rem;
    padding: 0.88rem 0.95rem;
    border-radius: 18px;
    border: 1px solid rgba(17, 24, 39, 0.08);
    background: rgba(255, 255, 255, 0.88);
    color: var(--ink);
    text-decoration: none;
    transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

.assessment-builder-empty-preset:hover,
.assessment-builder-empty-preset:focus-visible {
    transform: translateY(-1px);
    border-color: rgba(26, 107, 107, 0.18);
    box-shadow: 0 12px 24px rgba(17, 24, 39, 0.06);
}

.assessment-builder-empty-preset i {
    color: var(--teal);
    font-size: 1rem;
    margin-top: 0.1rem;
}

.assessment-builder-empty-preset-copy {
    display: grid;
    gap: 0.18rem;
}

.assessment-builder-empty-preset-copy strong {
    color: var(--ink);
    font-size: 0.9rem;
}

.assessment-builder-empty-preset-copy small {
    color: var(--mid);
    line-height: 1.45;
}

.assessment-question-composer-topline {
    display: grid;
    gap: 1.1rem;
}

.assessment-question-prompt-field textarea {
    min-height: 180px;
    font-size: 1.02rem;
    line-height: 1.65;
}

.assessment-question-type-heading {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.8rem;
}

.assessment-question-type-heading small {
    color: var(--mid);
    font-size: 0.78rem;
}

.assessment-question-type-picker {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.45rem;
    margin-top: 0.7rem;
}

.assessment-question-type-option {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    min-height: 2.45rem;
    padding: 0.5rem 0.62rem;
    border: 1px solid rgba(17, 24, 39, 0.09);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.86);
    color: var(--mid);
    font: inherit;
    font-size: 0.78rem;
    font-weight: 700;
    text-align: left;
    cursor: pointer;
    transition: border-color 0.18s ease, background 0.18s ease, color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.assessment-question-type-option:hover,
.assessment-question-type-option:focus-visible,
.assessment-question-type-option.is-selected {
    color: var(--brand-deep);
    border-color: rgba(26, 107, 107, 0.3);
    background: rgba(229, 243, 241, 0.92);
    box-shadow: 0 8px 18px rgba(26, 107, 107, 0.09);
}

.assessment-question-type-option:hover,
.assessment-question-type-option:focus-visible {
    transform: translateY(-1px);
}

.assessment-question-type-option:focus-visible {
    outline: 3px solid rgba(26, 107, 107, 0.15);
    outline-offset: 1px;
}

.assessment-question-type-option i {
    color: var(--teal);
    font-size: 0.88rem;
}

.assessment-question-type-guidance {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.58rem;
    align-items: start;
    margin-top: 0.6rem;
    padding: 0.68rem 0.75rem;
    border-radius: 14px;
    border: 1px solid rgba(26, 107, 107, 0.1);
    background: rgba(242, 249, 248, 0.84);
}

.assessment-question-type-guidance > i {
    color: var(--teal);
    margin-top: 0.15rem;
}

.assessment-question-type-guidance div {
    display: grid;
    gap: 0.16rem;
}

.assessment-question-type-guidance strong {
    color: var(--ink);
    font-size: 0.8rem;
}

.assessment-question-type-guidance small {
    color: var(--mid);
    font-size: 0.76rem;
    line-height: 1.45;
}

.assessment-accepted-answer-chip-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    padding: 0.25rem 0;
}

.assessment-accepted-answer-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.38rem;
    min-height: 2.35rem;
    padding: 0.35rem 0.42rem 0.35rem 0.75rem;
    border: 1px solid rgba(26, 107, 107, 0.16);
    border-radius: 999px;
    background: rgba(240, 249, 247, 0.9);
    color: var(--ink);
    font-size: 0.86rem;
    font-weight: 650;
}

.assessment-accepted-answer-chip a,
.assessment-accepted-answer-chip button {
    display: inline-grid;
    width: 1.72rem;
    height: 1.72rem;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: var(--mid);
    text-decoration: none;
    cursor: pointer;
    transition: background 0.18s ease, color 0.18s ease;
}

.assessment-accepted-answer-chip form {
    display: contents;
    margin: 0;
}

.assessment-accepted-answer-chip a:hover,
.assessment-accepted-answer-chip a:focus-visible {
    background: rgba(26, 107, 107, 0.12);
    color: var(--brand-deep);
}

.assessment-accepted-answer-chip button:hover,
.assessment-accepted-answer-chip button:focus-visible {
    background: rgba(155, 48, 39, 0.12);
    color: #8d271e;
}

.assessment-question-side-rail {
    position: absolute;
    top: 1.15rem;
    right: 1rem;
    transform: none;
    z-index: 4;
    display: grid;
    gap: 0.55rem;
    padding: 0.45rem;
    border-radius: 20px;
    border: 1px solid rgba(17, 24, 39, 0.08);
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 18px 38px rgba(0, 0, 0, 0.09);
    backdrop-filter: blur(10px);
    opacity: 0.96;
    transition: transform 0.22s ease, opacity 0.22s ease, box-shadow 0.22s ease;
}

.assessment-question-sheet.is-active .assessment-question-side-rail {
    transform: translateY(0);
    box-shadow: 0 20px 42px rgba(0, 0, 0, 0.11);
}

.assessment-question-side-rail form {
    margin: 0;
}

.assessment-question-rail-button {
    position: relative;
    width: 2.85rem;
    height: 2.85rem;
    display: inline-grid;
    place-items: center;
    border-radius: 14px;
    border: 1px solid rgba(17, 24, 39, 0.1);
    background: rgba(255, 255, 255, 0.98);
    color: var(--mid);
    cursor: pointer;
    transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease, color 0.18s ease, background 0.18s ease;
}

.assessment-question-rail-button::after {
    content: attr(data-tooltip);
    position: absolute;
    right: calc(100% + 0.7rem);
    top: 50%;
    transform: translateY(-50%) translateX(6px);
    padding: 0.45rem 0.62rem;
    border-radius: 12px;
    background: rgba(17, 24, 39, 0.92);
    color: #fff;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    white-space: nowrap;
    opacity: 0;
    pointer-events: none;
    box-shadow: 0 12px 26px rgba(17, 24, 39, 0.18);
    transition: opacity 0.18s ease, transform 0.18s ease;
}

.assessment-question-rail-button::before {
    content: "";
    position: absolute;
    right: calc(100% + 0.35rem);
    top: 50%;
    width: 0.5rem;
    height: 0.5rem;
    background: rgba(17, 24, 39, 0.92);
    transform: translateY(-50%) rotate(45deg) translateX(6px);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.18s ease, transform 0.18s ease;
}

.assessment-question-rail-button:hover,
.assessment-question-rail-button:focus-visible {
    transform: translateY(-1px);
    color: var(--ink);
    border-color: rgba(26, 107, 107, 0.24);
    box-shadow: 0 12px 24px rgba(26, 107, 107, 0.12);
}

.assessment-question-rail-button:hover::after,
.assessment-question-rail-button:hover::before,
.assessment-question-rail-button:focus-visible::after,
.assessment-question-rail-button:focus-visible::before {
    opacity: 1;
    transform: translateY(-50%) translateX(0);
}

.assessment-question-rail-button:focus-visible,
.assessment-question-insert-button:focus-visible,
.assessment-question-utility-button:focus-visible,
.assessment-question-utility-link:focus-visible,
.assessment-question-advanced-summary:focus-visible {
    outline: none;
    box-shadow:
        0 0 0 3px rgba(26, 107, 107, 0.12),
        0 12px 24px rgba(26, 107, 107, 0.12);
}

.assessment-question-rail-button.is-primary {
    background: var(--teal);
    border-color: rgba(26, 107, 107, 0.8);
    color: #fff;
    box-shadow: 0 16px 30px rgba(26, 107, 107, 0.2);
}

.assessment-question-rail-button.is-primary:hover,
.assessment-question-rail-button.is-primary:focus-visible {
    background: var(--teal-light);
    color: #fff;
}

.assessment-question-rail-button.is-danger {
    color: #9b3027;
    border-color: rgba(155, 48, 39, 0.16);
    background: rgba(255, 247, 245, 0.98);
}

.assessment-question-rail-button.is-danger:hover,
.assessment-question-rail-button.is-danger:focus-visible {
    color: #9b3027;
    border-color: rgba(155, 48, 39, 0.28);
    background: rgba(255, 240, 236, 0.98);
    box-shadow: 0 12px 24px rgba(155, 48, 39, 0.12);
}

.assessment-question-rail-button i {
    font-size: 0.98rem;
}

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

@media (max-width: 1180px) {
    .assessment-question-sheet.is-active {
        padding-right: 1.15rem;
    }

    .assessment-question-side-rail {
        position: static;
        order: 98;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: flex-start;
        gap: 0.5rem;
        width: 100%;
        padding: 0.6rem;
        margin-top: 0.35rem;
        border-radius: 18px;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72), 0 12px 24px rgba(17, 24, 39, 0.06);
        background:
            linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(241, 248, 247, 0.9));
        backdrop-filter: none;
    }

    .assessment-question-side-rail form {
        display: contents;
    }

    .assessment-question-rail-button {
        width: auto;
        min-width: 2.75rem;
        height: 2.75rem;
        padding: 0 0.82rem;
        gap: 0.45rem;
        grid-auto-flow: column;
    }

    .assessment-question-rail-label {
        position: static;
        width: auto;
        height: auto;
        padding: 0;
        margin: 0;
        overflow: visible;
        clip: auto;
        white-space: nowrap;
        border: 0;
        font-size: 0.72rem;
        font-weight: 800;
        letter-spacing: 0.03em;
    }

    .assessment-question-rail-button::before,
    .assessment-question-rail-button::after {
        display: none;
    }
}

@media (max-width: 640px) {
    .assessment-question-side-rail {
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        gap: 0.45rem;
    }

    .assessment-question-rail-button {
        width: 100%;
        min-width: 0;
        padding: 0;
        grid-auto-flow: row;
        gap: 0.22rem;
    }

    .assessment-question-rail-label {
        font-size: 0.58rem;
        white-space: normal;
        line-height: 1.1;
    }
}

.assessment-question-sheet-header {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: start;
}

.assessment-question-sheet-header h3 {
    margin: 0.3rem 0 0;
    font-size: clamp(1.2rem, 1.7vw, 1.55rem);
    line-height: 1.45;
}

.assessment-question-sheet-header p {
    margin: 0.45rem 0 0;
    color: var(--mid);
    line-height: 1.7;
    max-width: 44rem;
}

.assessment-question-sheet.is-editing .assessment-question-sheet-header {
    gap: 0.8rem;
    align-items: center;
}

.assessment-question-sheet.is-editing .assessment-question-sheet-header h3 {
    margin-top: 0.08rem;
    font-size: 1.08rem;
    line-height: 1.32;
}

.assessment-question-sheet.is-editing .assessment-question-sheet-header p {
    margin-top: 0.22rem;
    font-size: 0.92rem;
    line-height: 1.55;
}

.assessment-question-sheet.is-editing .assessment-question-header-meta {
    gap: 0.35rem;
}

.assessment-question-sheet.is-editing .assessment-question-header-meta .pill {
    padding: 0.3rem 0.56rem;
    font-size: 0.66rem;
}

.assessment-question-header-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    justify-content: flex-end;
    align-items: flex-start;
}

.assessment-question-header-meta .pill.is-core {
    background: rgba(241, 248, 247, 0.92);
    color: var(--teal);
}

.assessment-question-readiness {
    display: inline-flex;
    align-items: center;
    gap: 0.34rem;
    min-height: 1.75rem;
    padding: 0.3rem 0.52rem;
    border: 1px solid transparent;
    border-radius: 999px;
    font-family: "Space Mono", monospace;
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    line-height: 1;
    text-transform: uppercase;
}

.assessment-question-readiness.is-ready {
    border-color: rgba(55, 123, 75, 0.2);
    background: rgba(234, 247, 237, 0.96);
    color: #2f6d40;
}

.assessment-question-readiness.is-pending {
    border-color: rgba(173, 120, 34, 0.2);
    background: rgba(255, 247, 226, 0.96);
    color: #815f19;
}

.assessment-question-readiness i {
    font-size: 0.74rem;
}

.assessment-question-sheet.is-collapsed .assessment-question-readiness {
    padding: 0.27rem 0.46rem;
    font-size: 0.58rem;
}

.assessment-question-collapsed-summary {
    display: none;
    flex-wrap: wrap;
    gap: 0.5rem 0.8rem;
    align-items: center;
    padding: 0.05rem 0 0.1rem;
    color: var(--mid);
    font-size: 0.8rem;
    line-height: 1.5;
    opacity: 0.9;
    transition: opacity 0.18s ease;
}

.assessment-question-collapsed-summary span {
    display: inline-flex;
    align-items: center;
    gap: 0.38rem;
    white-space: nowrap;
}

.assessment-question-collapsed-summary i {
    color: var(--teal);
    font-size: 0.76rem;
}

.assessment-question-sheet.is-collapsed .assessment-question-collapsed-summary {
    display: flex;
}

.assessment-question-sheet.is-collapsed .assessment-question-header-meta {
    gap: 0.35rem;
}

.assessment-question-sheet.is-collapsed .assessment-question-header-meta .pill {
    padding: 0.28rem 0.52rem;
    font-size: 0.66rem;
}

.assessment-question-sheet.is-collapsed .assessment-question-header-meta .pill.is-secondary {
    display: none;
}

.assessment-question-learner-preview {
    display: grid;
    gap: 1rem;
    margin-top: 1rem;
    padding: 1.1rem;
    border: 1px solid rgba(26, 107, 107, 0.18);
    border-radius: 20px;
    background: linear-gradient(180deg, rgba(245, 251, 250, 0.98), rgba(255, 255, 255, 0.98));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.82), 0 14px 28px rgba(26, 107, 107, 0.06);
}

.assessment-question-learner-preview[hidden] {
    display: none;
}

.assessment-question-learner-preview-head,
.assessment-question-learner-preview-foot {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 0.55rem;
    align-items: center;
    color: var(--mid);
    font-family: "Space Mono", monospace;
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.assessment-question-learner-preview-head small,
.assessment-question-learner-preview-foot span {
    padding: 0.3rem 0.48rem;
    border-radius: 999px;
    background: rgba(226, 241, 241, 0.9);
    color: var(--brand-deep);
}

.assessment-question-learner-preview h4 {
    margin: 0;
    color: var(--ink);
    font-family: "DM Serif Display", Georgia, serif;
    font-size: 1.32rem;
    line-height: 1.35;
}

.assessment-question-learner-preview > img {
    width: min(100%, 32rem);
    border-radius: 16px;
    border: 1px solid rgba(17, 24, 39, 0.08);
}

.assessment-question-learner-options {
    display: grid;
    gap: 0.65rem;
}

.assessment-question-learner-options label {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    min-height: 3rem;
    padding: 0.75rem 0.88rem;
    border: 1px solid rgba(17, 24, 39, 0.09);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.94);
    color: var(--ink);
}

.assessment-question-learner-options input {
    width: 1rem;
    height: 1rem;
    accent-color: var(--teal);
}

.assessment-question-learner-text-input,
.assessment-question-learner-textarea {
    width: 100%;
    border: 1px solid rgba(17, 24, 39, 0.12);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.94);
    color: var(--mid);
    font: inherit;
    line-height: 1.55;
}

.assessment-question-learner-text-input {
    min-height: 3.1rem;
    padding: 0 0.9rem;
}

.assessment-question-learner-textarea {
    padding: 0.82rem 0.9rem;
    resize: vertical;
}

.assessment-question-learner-file {
    display: inline-flex;
    align-items: center;
    gap: 0.58rem;
    min-height: 3.25rem;
    padding: 0.78rem 0.9rem;
    border: 1px dashed rgba(26, 107, 107, 0.3);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.88);
    color: var(--mid);
}

.assessment-question-learner-file i {
    color: var(--teal);
}

.assessment-question-sheet.is-previewing .assessment-inline-question-form,
.assessment-question-sheet.is-previewing .assessment-inline-config,
.assessment-question-sheet.is-previewing .assessment-question-card-copy,
.assessment-question-sheet.is-previewing .assessment-question-card-note,
.assessment-question-sheet.is-previewing .assessment-builder-question-media,
.assessment-question-sheet.is-previewing .assessment-inline-option-preview,
.assessment-question-sheet.is-previewing .assessment-flow-preview-list,
.assessment-question-sheet.is-previewing .assessment-question-footer-actions,
.assessment-question-sheet.is-previewing .assessment-question-collapsed-summary {
    display: none;
}

.assessment-question-sheet.is-collapsed:hover .assessment-question-collapsed-summary,
.assessment-question-sheet.is-collapsed:focus-within .assessment-question-collapsed-summary {
    opacity: 1;
}

.assessment-question-card,
.assessment-option-card {
    position: relative;
    gap: 0.95rem;
    padding: 1rem 1.05rem 1.05rem;
    border-radius: 20px;
    border: 1px solid rgba(17, 24, 39, 0.08);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 245, 239, 0.88));
    box-shadow: 0 14px 34px rgba(0, 0, 0, 0.04);
}

.assessment-question-card::before,
.assessment-option-card::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 0.35rem;
    border-radius: 20px 0 0 20px;
    background: linear-gradient(180deg, rgba(26, 107, 107, 0.95), rgba(201, 168, 76, 0.82));
}

.assessment-question-card.is-active {
    border-color: rgba(26, 107, 107, 0.28);
    box-shadow: 0 18px 40px rgba(26, 107, 107, 0.09);
}

.assessment-option-card.is-correct {
    border-color: rgba(122, 173, 138, 0.35);
    background: linear-gradient(180deg, rgba(245, 252, 247, 0.98), rgba(255, 255, 255, 0.92));
}

.assessment-option-card.is-correct::before {
    background: linear-gradient(180deg, rgba(122, 173, 138, 0.95), rgba(26, 107, 107, 0.85));
}

.assessment-question-card-topline {
    display: flex;
    justify-content: space-between;
    gap: 0.85rem;
    align-items: start;
}

.assessment-inline-option-preview {
    display: grid;
    gap: 0.7rem;
}

.assessment-question-sheet .assessment-builder-option-preview {
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 0;
}

.assessment-question-sheet .assessment-builder-option-card {
    position: relative;
    grid-template-columns: auto auto minmax(0, 1fr);
    cursor: default;
    padding-right: 1rem;
}

.assessment-question-sheet .assessment-builder-option-card:hover {
    transform: none;
    border-color: rgba(17, 24, 39, 0.08);
    box-shadow: none;
}

.assessment-builder-option-card.is-correct {
    border-color: rgba(122, 173, 138, 0.32);
    background: linear-gradient(180deg, rgba(245, 252, 247, 0.98), rgba(255, 255, 255, 0.94));
    box-shadow: inset 0 0 0 1px rgba(122, 173, 138, 0.12);
}

.assessment-builder-option-card.is-correct .learner-option-marker {
    background: rgba(122, 173, 138, 0.18);
    color: #2f6d40;
}

.assessment-builder-option-state {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    grid-column: 3;
    justify-self: start;
    margin-top: 0.1rem;
    padding: 0.24rem 0.55rem;
    border-radius: 999px;
    background: rgba(122, 173, 138, 0.14);
    color: #2f6d40;
    font-size: 0.72rem;
    font-weight: 700;
    white-space: nowrap;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.assessment-builder-option-state i {
    font-size: 0.78rem;
}

.assessment-option-status {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--mid);
    line-height: 1.6;
}

.assessment-option-status.is-correct {
    color: #2f6d40;
    font-weight: 700;
}

.assessment-option-status i {
    font-size: 0.78rem;
}

.assessment-inline-option-row {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.8rem;
    align-items: start;
    padding: 0.9rem 1rem;
    border-radius: 18px;
    border: 1px solid rgba(17, 24, 39, 0.08);
    background: rgba(255, 255, 255, 0.9);
}

.assessment-inline-option-row.is-correct {
    border-color: rgba(122, 173, 138, 0.32);
    background: linear-gradient(180deg, rgba(245, 252, 247, 0.98), rgba(255, 255, 255, 0.95));
}

.assessment-inline-option-marker {
    width: 2rem;
    height: 2rem;
    border-radius: 999px;
    display: inline-grid;
    place-items: center;
    background: rgba(201, 168, 76, 0.16);
    color: #8d6e19;
    font-weight: 700;
    flex-shrink: 0;
}

.assessment-inline-option-row.is-correct .assessment-inline-option-marker {
    background: rgba(122, 173, 138, 0.18);
    color: #2f6d40;
}

.assessment-inline-option-body {
    display: grid;
    gap: 0.8rem;
    min-width: 0;
}

.assessment-inline-option-headline {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.65rem;
}

.assessment-inline-option-headline strong {
    color: var(--ink);
    font-size: 0.92rem;
}

.assessment-question-card-copy {
    margin: 0;
    font-size: 1rem;
    line-height: 1.75;
    color: var(--ink);
}

.assessment-question-card-note {
    display: grid;
    gap: 0.35rem;
    padding: 0.9rem 1rem;
    border-radius: 16px;
    background: rgba(240, 247, 246, 0.72);
    border: 1px solid rgba(19, 107, 116, 0.08);
}

.assessment-question-card-note span {
    font-family: "Space Mono", monospace;
    font-size: 0.66rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--mid);
}

.assessment-question-card-note p,
.assessment-option-target p {
    margin: 0;
    color: var(--mid);
    line-height: 1.7;
}

.assessment-builder-summary-card {
    gap: 1rem;
}

.assessment-inline-config {
    display: grid;
    gap: 1rem;
    padding-top: 0.35rem;
    border-top: 1px solid rgba(17, 24, 39, 0.08);
}

.assessment-inline-config-head {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: start;
}

.assessment-inline-config-head h4 {
    margin: 0.28rem 0 0;
    font-size: 1.02rem;
    color: var(--ink);
}

.assessment-inline-config-head p {
    margin: 0.45rem 0 0;
    color: var(--mid);
    line-height: 1.7;
}

.assessment-option-target {
    display: grid;
    gap: 0.45rem;
    padding: 1rem 1.05rem;
    border-radius: 18px;
    border: 1px solid rgba(19, 107, 116, 0.12);
    background: rgba(241, 248, 247, 0.92);
}

.assessment-option-target strong {
    font-size: 1.05rem;
    color: var(--ink);
}

.assessment-settings-form {
    display: grid;
    gap: 1.1rem;
}

.assessment-settings-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.95rem;
}

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

.assessment-settings-grid .full-span {
    grid-column: 1 / -1;
}

.assessment-question-advanced-panel {
    border: 1px solid rgba(17, 24, 39, 0.08);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.84);
    overflow: hidden;
    transition: border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

.assessment-question-advanced-summary {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: center;
    padding: 0.95rem 1rem;
    cursor: pointer;
    list-style: none;
    background: rgba(250, 247, 242, 0.78);
    transition: background 0.18s ease, color 0.18s ease, border-color 0.18s ease;
}

.assessment-question-advanced-summary::-webkit-details-marker {
    display: none;
}

.assessment-question-advanced-summary span {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    font-weight: 700;
    color: var(--ink);
}

.assessment-question-advanced-summary i {
    color: var(--teal);
    transition: transform 0.18s ease, color 0.18s ease;
}

.assessment-question-advanced-summary small {
    color: var(--mid);
    line-height: 1.5;
    text-align: right;
}

.assessment-question-advanced-panel[open] .assessment-question-advanced-summary {
    border-bottom: 1px solid rgba(17, 24, 39, 0.06);
}

.assessment-question-advanced-panel[open] {
    border-color: rgba(26, 107, 107, 0.14);
    box-shadow: 0 14px 30px rgba(17, 24, 39, 0.04);
    background: rgba(255, 255, 255, 0.92);
}

.assessment-question-advanced-panel[open] .assessment-question-advanced-summary {
    background: rgba(241, 248, 247, 0.82);
}

.assessment-question-advanced-panel[open] .assessment-question-advanced-summary i {
    transform: rotate(90deg);
}

.assessment-question-advanced-body {
    display: grid;
    gap: 1rem;
    padding: 1rem;
}

.assessment-question-settings-group {
    display: grid;
    gap: 0.7rem;
    padding: 0.95rem 1rem;
    border-radius: 18px;
    border: 1px solid rgba(17, 24, 39, 0.06);
    background: rgba(255, 255, 255, 0.88);
}

.assessment-question-settings-group.is-muted {
    background: rgba(246, 248, 247, 0.72);
}

.assessment-question-settings-group-head {
    display: grid;
    gap: 0.25rem;
}

.assessment-question-settings-group-head p {
    margin: 0;
    color: var(--mid);
    line-height: 1.65;
}

.assessment-question-meta-grid {
    align-items: end;
}

.assessment-question-type-field select,
.assessment-question-meta-grid input,
.assessment-question-meta-grid select {
    min-height: 3.3rem;
}

.assessment-question-inline-meta-card {
    display: grid;
    gap: 0.4rem;
    padding: 0.9rem 1rem;
    border-radius: 18px;
    border: 1px solid rgba(17, 24, 39, 0.08);
    background: rgba(255, 255, 255, 0.92);
}

.assessment-question-inline-meta-card label {
    font-size: 0.7rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--mid);
    font-weight: 700;
}

.assessment-question-inline-meta-input {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
}

.assessment-question-inline-meta-input input {
    width: 100%;
    min-height: 2.8rem;
    border-radius: 14px;
    border: 1px solid rgba(17, 24, 39, 0.08);
    background: rgba(250, 247, 242, 0.72);
    font-size: 1rem;
    font-weight: 700;
}

.assessment-question-inline-meta-input span {
    color: var(--mid);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.assessment-question-inline-toggle-card {
    align-content: center;
}

.assessment-question-inline-toggle-card .checkbox-label {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    font-size: 0.98rem;
    color: var(--ink);
    font-weight: 700;
}

.assessment-question-inline-toggle-card input[type="checkbox"] {
    width: auto;
    margin: 0;
}

.assessment-question-inline-toggle-card small {
    color: var(--mid);
    line-height: 1.55;
}

.assessment-question-prompt-field textarea,
.assessment-question-prompt-field input,
.assessment-inline-question-form [id$="-prompt"] {
    min-height: 82px;
    border-radius: 0;
    border: none;
    border-bottom: 2px solid rgba(17, 24, 39, 0.16);
    background: transparent;
    padding: 0.65rem 0 0.8rem;
    box-shadow: none;
    font-size: 1.22rem;
    line-height: 1.55;
    resize: vertical;
}

.assessment-question-prompt-field textarea:focus,
.assessment-question-prompt-field input:focus,
.assessment-inline-question-form [id$="-prompt"]:focus {
    border-bottom-color: rgba(26, 107, 107, 0.5);
    box-shadow: none;
}

.assessment-inline-question-form.is-inline-card-edit {
    padding-top: 0.15rem;
    border-top: 1px solid rgba(17, 24, 39, 0.06);
}

.assessment-inline-question-form.is-inline-card-edit .assessment-settings-toggle-card,
.assessment-inline-question-form.is-inline-card-edit .form-field input,
.assessment-inline-question-form.is-inline-card-edit .form-field select,
.assessment-inline-question-form.is-inline-card-edit .form-field textarea {
    background: rgba(255, 255, 255, 0.96);
}

.assessment-inline-question-form.is-inline-card-edit .assessment-question-composer-actions {
    margin-top: 0.1rem;
}

.assessment-inline-question-form.is-inline-card-edit .assessment-question-advanced-panel {
    background: rgba(255, 255, 255, 0.92);
}

.assessment-question-type-field select {
    border-radius: 14px;
}

.assessment-settings-toggle-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.9rem;
}

.assessment-question-toggle-grid {
    grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.1fr) minmax(0, 1.05fr);
    align-items: stretch;
}

.assessment-settings-toggle-card {
    display: grid;
    gap: 0.55rem;
    padding: 1rem;
    border-radius: 18px;
    border: 1px solid rgba(17, 24, 39, 0.08);
    background: rgba(255, 255, 255, 0.88);
}

.assessment-settings-toggle-card .checkbox-label {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    font-weight: 700;
    color: var(--ink);
}

.assessment-settings-toggle-card input[type="checkbox"] {
    width: auto;
    margin: 0;
}

.assessment-settings-toggle-card p {
    margin: 0;
    color: var(--mid);
    line-height: 1.65;
}

.assessment-settings-toggle-card-copy {
    align-content: start;
    background:
        radial-gradient(circle at top right, rgba(201, 168, 76, 0.12), transparent 42%),
        linear-gradient(180deg, rgba(241, 248, 247, 0.96), rgba(255, 255, 255, 0.92));
    border-style: dashed;
    border-color: rgba(26, 107, 107, 0.18);
}

.assessment-flow-card-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    align-items: center;
}

.assessment-flow-card-meta span {
    display: inline-flex;
    align-items: center;
    padding: 0.35rem 0.65rem;
    border-radius: 999px;
    background: rgba(26, 107, 107, 0.08);
    color: var(--mid);
    font-size: 0.77rem;
    line-height: 1.4;
}

.assessment-flow-preview-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.assessment-builder-question-media {
    display: block;
}

.assessment-builder-question-media img {
    width: 100%;
    max-height: 280px;
    object-fit: contain;
    border-radius: 18px;
    border: 1px solid rgba(17, 24, 39, 0.08);
    background: rgba(255, 255, 255, 0.92);
}

.assessment-builder-question-media.is-compact img {
    max-height: 220px;
}

.assessment-flow-actions {
    align-items: center;
}

.assessment-flow-actions .button-small {
    min-height: 2.35rem;
}

.assessment-question-footer-actions {
    display: flex;
    justify-content: center;
    gap: 0.85rem;
    flex-wrap: wrap;
    align-items: center;
    padding-top: 0.45rem;
    border-top: 1px solid rgba(17, 24, 39, 0.06);
}

.assessment-question-sheet.is-collapsed .assessment-question-footer-actions {
    padding-top: 0.55rem;
}

.assessment-question-main-action {
    display: inline-flex;
    align-items: center;
    gap: 0.52rem;
    padding-inline: 1rem;
    box-shadow: 0 10px 24px rgba(26, 107, 107, 0.14);
    transition: transform 0.18s ease, box-shadow 0.18s ease, filter 0.18s ease;
}

.assessment-question-main-action:hover,
.assessment-question-main-action:focus-visible {
    transform: translateY(-1px);
    box-shadow: 0 14px 28px rgba(26, 107, 107, 0.18);
}

.assessment-question-main-action.is-setup {
    box-shadow: 0 16px 30px rgba(26, 107, 107, 0.2);
}

.assessment-question-main-action.is-edit-launch {
    background: linear-gradient(135deg, rgba(26, 107, 107, 0.98), rgba(43, 129, 129, 0.94));
    border-color: rgba(26, 107, 107, 0.88);
    color: #fff;
}

.assessment-question-main-action.is-edit-launch:hover,
.assessment-question-main-action.is-edit-launch:focus-visible {
    background: linear-gradient(135deg, rgba(22, 96, 96, 0.98), rgba(38, 118, 118, 0.94));
    color: #fff;
}

.assessment-question-main-action.is-editing-return {
    background: linear-gradient(135deg, #126b74, #1d7b7b);
    border-color: #126b74;
    color: #fff;
    box-shadow: 0 12px 24px rgba(18, 107, 116, 0.18);
}

.assessment-question-main-action.is-editing-return:hover,
.assessment-question-main-action.is-editing-return:focus-visible {
    background: linear-gradient(135deg, #0f5b63, #176d6d);
    border-color: #0f5b63;
    color: #fff;
}

.assessment-question-utility-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    align-items: center;
    justify-content: flex-end;
    padding: 0.45rem;
    border-radius: 18px;
    border: 1px solid rgba(17, 24, 39, 0.06);
    background: rgba(250, 247, 242, 0.62);
    backdrop-filter: blur(8px);
    transition: opacity 0.18s ease, transform 0.18s ease, background 0.18s ease, border-color 0.18s ease;
}

.assessment-question-utility-button {
    border-color: rgba(17, 24, 39, 0.12);
    color: var(--mid);
    background: rgba(255, 255, 255, 0.92);
    padding: 0.48rem 0.85rem;
    min-height: 2.15rem;
    font-size: 0.74rem;
    transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease, color 0.18s ease, background 0.18s ease;
}

.assessment-question-utility-button:hover,
.assessment-question-utility-button:focus-visible {
    color: var(--ink);
    border-color: rgba(17, 24, 39, 0.22);
    background: rgba(255, 255, 255, 0.98);
}

.assessment-question-utility-link {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.45rem 0.8rem;
    border-radius: 14px;
    border: 1px solid rgba(155, 48, 39, 0.12);
    background: rgba(255, 255, 255, 0.86);
    color: rgba(13, 13, 13, 0.56);
    text-decoration: none;
    transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease, color 0.18s ease, background 0.18s ease;
}

.assessment-question-utility-link:hover,
.assessment-question-utility-link:focus-visible {
    transform: translateY(-1px);
    color: #9b3027;
    border-color: rgba(155, 48, 39, 0.24);
    background: rgba(255, 244, 242, 0.92);
    box-shadow: 0 10px 22px rgba(155, 48, 39, 0.08);
    text-decoration: none;
}

.assessment-builder-is-loading .assessment-question-sheet.is-active {
    box-shadow:
        0 22px 40px rgba(26, 107, 107, 0.1),
        0 0 0 3px rgba(26, 107, 107, 0.06);
}

.assessment-question-sheet.is-collapsed .assessment-question-utility-actions {
    opacity: 0;
    transform: translateY(3px);
    pointer-events: none;
}

.assessment-question-sheet.is-collapsed:hover .assessment-question-utility-actions,
.assessment-question-sheet.is-collapsed:focus-within .assessment-question-utility-actions {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
    background: rgba(250, 247, 242, 0.88);
    border-color: rgba(26, 107, 107, 0.1);
}

.assessment-question-sheet.is-collapsed:hover .assessment-question-footer-actions,
.assessment-question-sheet.is-collapsed:focus-within .assessment-question-footer-actions {
    border-top-color: rgba(26, 107, 107, 0.12);
}

.assessment-flow-actions .link-button {
    align-self: center;
}

.assessment-option-panel .assessment-google-form {
    padding: 1rem;
    border-radius: 18px;
    border: 1px solid rgba(19, 107, 116, 0.1);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(245, 240, 232, 0.74));
}

.assessment-builder-save-status,
.assessment-builder-readiness,
.assessment-question-insert-row,
.assessment-question-sheet {
    animation: assessmentBuilderFadeIn 0.28s ease;
}

@keyframes assessmentBuilderFadeIn {
    from {
        opacity: 0;
        transform: translateY(6px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    .app-content,
    .button,
    .workspace-action-activated,
    .student-mobile-nav,
    .student-mobile-nav-item,
    .student-quick-card,
    .student-course-card,
    .lesson-journey-card,
    .learner-assessment-nav-button,
    .student-library-item-shell,
    .app-shell.has-student-mobile-nav .dashboard-intro,
    .app-shell.has-student-mobile-nav .student-hero-band,
    .app-shell.has-student-mobile-nav .assessment-result-band,
    .app-shell.has-student-mobile-nav .course-hero-card,
    .app-shell.has-student-mobile-nav .content-panel,
    .app-shell.has-student-mobile-nav .certificate-card,
    .app-shell.has-student-mobile-nav .student-secondary-item,
    .app-shell.has-student-mobile-nav .student-timeline-item,
    .assessment-form-sheet,
    .assessment-builder-save-status,
    .assessment-builder-readiness,
    .assessment-question-sheet,
    .assessment-question-side-rail,
    .assessment-question-rail-button,
    .assessment-question-collapsed-summary,
    .assessment-question-advanced-panel,
    .assessment-question-advanced-summary,
    .assessment-question-advanced-summary i,
    .assessment-question-utility-actions,
    .assessment-question-utility-button,
    .assessment-question-utility-link,
    .assessment-question-insert-button {
        animation: none;
        transition: none;
    }
}

.assessment-option-panel .assessment-google-form .button-row {
    margin-top: 0.15rem;
}

.assessment-inline-builder-form {
    padding: 1rem 1rem 0.95rem;
    border-radius: 18px;
    border: 1px solid rgba(19, 107, 116, 0.1);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(245, 240, 232, 0.74));
}

.assessment-choice-composer {
    gap: 0.85rem;
    background: linear-gradient(180deg, rgba(252, 252, 251, 0.98), rgba(244, 249, 248, 0.9));
}

.assessment-choice-composer-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto auto;
    gap: 0.85rem;
    align-items: center;
}

.assessment-choice-composer-field {
    min-width: 0;
}

.assessment-choice-composer-field input {
    min-height: 3.15rem;
}

.assessment-choice-composer-toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    min-height: 3.15rem;
    padding: 0.85rem 1rem;
    border-radius: 16px;
    border: 1px solid rgba(17, 24, 39, 0.08);
    background: rgba(255, 255, 255, 0.9);
    color: var(--ink);
    font-weight: 600;
    white-space: nowrap;
}

.assessment-choice-composer-toggle input[type="checkbox"] {
    width: 1rem;
    height: 1rem;
}

.assessment-choice-composer-extra,
.assessment-inline-option-extra-shell {
    border-top: 1px dashed rgba(17, 24, 39, 0.08);
    padding-top: 0.75rem;
}

.assessment-choice-composer-extra summary,
.assessment-inline-option-extra-shell summary {
    cursor: pointer;
    color: var(--mid);
    font-size: 0.8rem;
    font-weight: 600;
}

.assessment-inline-option-row-form {
    gap: 0.8rem;
}

.assessment-inline-option-edit-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 180px;
    gap: 0.8rem;
    align-items: start;
}

.assessment-inline-option-text-field input {
    min-height: 3rem;
}

.assessment-inline-option-toggle {
    display: grid;
    gap: 0.35rem;
    min-height: 3rem;
    align-content: center;
    padding: 0.8rem 0.9rem;
    border-radius: 16px;
    border: 1px solid rgba(17, 24, 39, 0.08);
    background: rgba(255, 255, 255, 0.94);
}

.assessment-inline-option-toggle .checkbox-label {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    font-weight: 700;
    color: var(--ink);
}

.assessment-inline-option-toggle input[type="checkbox"] {
    width: auto;
    margin: 0;
}

.assessment-inline-option-extra {
    display: grid;
    gap: 0.35rem;
}

.assessment-inline-option-actions {
    justify-content: flex-start;
}

.assessment-inline-option-actions-secondary {
    margin-top: -0.25rem;
}

.assessment-question-composer-actions {
    padding-top: 0.15rem;
    border-top: 1px solid rgba(17, 24, 39, 0.06);
}

.learner-assessment-shell {
    display: grid;
    gap: 1.4rem;
}

.learner-assessment-hero {
    display: grid;
    gap: 1rem;
    overflow: hidden;
    padding: 0;
}

.learner-assessment-hero-bar {
    width: 100%;
    height: 0.45rem;
    background: linear-gradient(90deg, rgba(26, 107, 107, 0.96), rgba(201, 168, 76, 0.88));
}

.learner-assessment-hero-copy,
.learner-assessment-hero-meta {
    padding: 0 1.25rem;
}

.learner-assessment-hero-copy {
    display: grid;
    gap: 0.7rem;
    min-width: 0;
}

.learner-assessment-hero-copy h2 {
    margin: 0;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.learner-assessment-hero-copy p {
    margin: 0;
    color: var(--mid);
    line-height: 1.75;
}

.learner-assessment-hero-meta {
    padding-bottom: 1.2rem;
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: center;
    min-width: 0;
}

.learner-assessment-timer {
    min-width: 132px;
    border-radius: 14px;
    background: linear-gradient(135deg, rgba(17, 24, 39, 0.98), rgba(33, 41, 54, 0.96));
    box-shadow: 0 14px 26px rgba(15, 23, 42, 0.18);
}

.learner-assessment-pulse-grid {
    margin-bottom: 0;
}

.learner-assessment-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.65fr) minmax(300px, 0.78fr);
    gap: 1.1rem;
    align-items: start;
}

.learner-assessment-main,
.learner-assessment-rail {
    display: grid;
    gap: 1rem;
}

.learner-assessment-attempt-card {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: center;
    padding: 1rem 1.1rem;
    border: 1px solid rgba(19, 107, 116, 0.14);
    background: linear-gradient(180deg, rgba(238, 247, 246, 0.98), rgba(255, 255, 255, 0.94));
}

.learner-assessment-attempt-card.is-locked {
    border-color: rgba(192, 94, 58, 0.22);
    background: linear-gradient(180deg, rgba(255, 246, 242, 0.98), rgba(255, 255, 255, 0.95));
}

.learner-assessment-attempt-copy {
    display: grid;
    gap: 0.35rem;
    min-width: 0;
}

.learner-assessment-attempt-copy strong {
    font-size: 1.15rem;
    color: var(--ink);
}

.learner-assessment-attempt-copy p {
    margin: 0;
    color: var(--mid);
}

.learner-assessment-draft-status {
    color: var(--teal);
    font-weight: 600;
}

.learner-assessment-form {
    display: grid;
    gap: 1rem;
}

.learner-assessment-mobile-console {
    display: none;
    gap: 0.9rem;
    border: 1px solid rgba(19, 107, 116, 0.16);
    background: linear-gradient(180deg, rgba(245, 250, 249, 0.98), rgba(255, 255, 255, 0.96));
}

.learner-assessment-mobile-console-head {
    display: grid;
    gap: 0.85rem;
}

.learner-assessment-mobile-console-head strong {
    display: block;
    margin-top: 0.25rem;
    font-size: 1.02rem;
    color: var(--ink);
}

.learner-assessment-mobile-console-head p {
    margin: 0.35rem 0 0;
    color: var(--mid);
}

.learner-assessment-mobile-nav {
    display: flex;
    gap: 0.65rem;
    overflow-x: auto;
    padding-bottom: 0.1rem;
    scrollbar-width: thin;
}

.learner-assessment-mobile-nav .learner-assessment-nav-button {
    flex: 0 0 50px;
}

.learner-assessment-section-break {
    overflow: hidden;
    display: grid;
    gap: 0;
    padding: 0;
}

.learner-assessment-section-break-bar {
    width: 100%;
    height: 0.35rem;
    background: linear-gradient(90deg, rgba(201, 168, 76, 0.92), rgba(26, 107, 107, 0.92));
}

.learner-assessment-section-break-copy {
    display: grid;
    gap: 0.45rem;
    padding: 1rem 1.15rem 1.05rem;
    background: linear-gradient(180deg, rgba(244, 249, 248, 0.98), rgba(255, 255, 255, 0.95));
}

.learner-assessment-section-break-copy strong {
    font-size: 1.02rem;
    color: var(--ink);
}

.learner-assessment-section-break-copy p {
    margin: 0;
    color: var(--mid);
    line-height: 1.7;
}

.learner-assessment-question-card {
    position: relative;
    overflow: hidden;
    display: grid;
    gap: 1rem;
    padding: 0;
}

.learner-assessment-question-card.is-answered {
    border-color: rgba(122, 173, 138, 0.28);
    box-shadow: 0 18px 34px rgba(122, 173, 138, 0.08);
}

.learner-assessment-question-bar {
    width: 100%;
    height: 0.35rem;
    background: linear-gradient(90deg, rgba(201, 168, 76, 0.92), rgba(26, 107, 107, 0.88));
}

.learner-assessment-question-topline,
.learner-answer-options,
.learner-assessment-response,
.learner-assessment-question-card .resource-management-actions,
.learner-assessment-question-card > p {
    padding-left: 1.2rem;
    padding-right: 1.2rem;
}

.learner-assessment-question-topline {
    padding-top: 0.05rem;
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: start;
}

.learner-assessment-question-topline h3 {
    margin: 0.35rem 0 0;
    font-size: 1.1rem;
    line-height: 1.55;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.learner-assessment-question-media {
    padding-left: 1.2rem;
    padding-right: 1.2rem;
}

.learner-assessment-question-media img {
    width: 100%;
    max-height: 340px;
    object-fit: contain;
    border-radius: 18px;
    border: 1px solid rgba(17, 24, 39, 0.08);
    background: rgba(255, 255, 255, 0.92);
}

.learner-assessment-question-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    justify-content: flex-end;
}

.learner-answer-options {
    display: grid;
    gap: 0.75rem;
    padding-bottom: 1.2rem;
}

.learner-option-card {
    display: grid;
    grid-template-columns: auto auto 1fr;
    gap: 1rem;
    align-items: center;
    padding: 1.05rem 1.05rem;
    border-radius: 18px;
    border: 1px solid rgba(17, 24, 39, 0.08);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(247, 244, 237, 0.9));
    cursor: pointer;
    transition: border-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}

.learner-assessment-question-card.is-missing {
    border-color: rgba(192, 94, 58, 0.34);
    box-shadow: 0 18px 34px rgba(192, 94, 58, 0.08);
}

.learner-assessment-nav-button.is-missing {
    border-color: rgba(192, 94, 58, 0.34);
    background: rgba(255, 246, 242, 0.95);
    color: #9b3027;
}

.learner-option-card:hover {
    border-color: rgba(26, 107, 107, 0.24);
    transform: translateY(-1px);
    box-shadow: 0 14px 24px rgba(26, 107, 107, 0.08);
}

.learner-option-card:has(input:focus-visible) {
    border-color: rgba(26, 107, 107, 0.3);
    box-shadow: 0 0 0 3px rgba(201, 168, 76, 0.22);
}

.learner-option-card input {
    width: 1.1rem;
    height: 1.1rem;
    margin: 0;
    accent-color: var(--brand-teal);
}

.learner-option-card:has(input:checked) {
    border-color: rgba(26, 107, 107, 0.3);
    background: linear-gradient(180deg, rgba(239, 249, 246, 0.98), rgba(255, 255, 255, 0.96));
    box-shadow: 0 16px 28px rgba(26, 107, 107, 0.09);
}

.learner-option-marker {
    width: 2rem;
    height: 2rem;
    display: inline-grid;
    place-items: center;
    border-radius: 999px;
    background: rgba(201, 168, 76, 0.18);
    color: #8d6e19;
    font-weight: 700;
}

.learner-option-card input:checked + .learner-option-marker {
    background: linear-gradient(135deg, rgba(26, 107, 107, 0.94), rgba(201, 168, 76, 0.88));
    color: #ffffff;
}

.learner-option-copy {
    color: var(--ink);
    line-height: 1.65;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.learner-option-card input:checked ~ .learner-option-copy {
    font-weight: 600;
}

.learner-assessment-review-flow {
    display: grid;
    gap: 1rem;
}

.learner-assessment-review-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.learner-assessment-review-heading h3 {
    margin: 0 0 0.35rem;
}

.learner-assessment-review-heading p {
    margin: 0;
}

.learner-assessment-review-question-card {
    scroll-margin-top: 1rem;
}

.learner-answer-review-options .learner-review-option {
    grid-template-columns: auto auto minmax(0, 1fr) auto;
    cursor: default;
}

.learner-answer-review-options .learner-review-option:hover {
    transform: none;
    box-shadow: none;
}

.learner-review-option input:disabled {
    opacity: 1;
}

.learner-review-option.is-review-correct {
    border-color: rgba(47, 125, 73, 0.45);
    background: linear-gradient(180deg, rgba(231, 247, 236, 0.98), rgba(247, 253, 249, 0.96));
    box-shadow: 0 12px 24px rgba(47, 125, 73, 0.09);
}

.learner-review-option.is-review-incorrect {
    border-color: rgba(181, 57, 48, 0.46);
    background: linear-gradient(180deg, rgba(255, 235, 232, 0.98), rgba(255, 248, 247, 0.96));
    box-shadow: 0 12px 24px rgba(181, 57, 48, 0.09);
}

.learner-review-option.is-review-selected {
    border-color: rgba(26, 107, 107, 0.32);
    background: linear-gradient(180deg, rgba(239, 249, 246, 0.98), rgba(255, 255, 255, 0.96));
}

.learner-review-option.is-review-correct .learner-option-marker {
    background: #2f7d49;
    color: #fff;
}

.learner-review-option.is-review-incorrect .learner-option-marker {
    background: #b53930;
    color: #fff;
}

.learner-option-review-state {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.38rem;
    color: var(--teal);
    font-family: "Space Mono", monospace;
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    white-space: nowrap;
}

.learner-option-review-state.is-correct {
    color: #2f6d40;
}

.learner-option-review-state.is-incorrect {
    color: #9b3027;
}

.learner-review-result-pill.is-correct {
    border-color: rgba(47, 125, 73, 0.26);
    background: rgba(231, 247, 236, 0.96);
    color: #2f6d40;
}

.learner-review-result-pill.is-incorrect {
    border-color: rgba(181, 57, 48, 0.26);
    background: rgba(255, 235, 232, 0.96);
    color: #9b3027;
}

.learner-assessment-review-response {
    padding-bottom: 0;
}

.learner-assessment-review-text,
.learner-assessment-review-file {
    width: 100%;
    min-height: 78px;
    padding: 1rem 1.05rem;
    border: 1px solid rgba(17, 24, 39, 0.08);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.98);
    color: var(--ink);
    line-height: 1.7;
}

.learner-assessment-review-file {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    min-height: 58px;
    color: var(--teal);
    font-weight: 700;
}

.learner-assessment-review-text.is-review-correct {
    border-color: rgba(47, 125, 73, 0.34);
    background: rgba(231, 247, 236, 0.72);
}

.learner-assessment-review-text.is-review-incorrect {
    border-color: rgba(181, 57, 48, 0.34);
    background: rgba(255, 235, 232, 0.72);
}

.learner-assessment-review-feedback {
    display: grid;
    gap: 0.4rem;
    margin: 0 1.2rem 1.2rem;
    padding: 0.95rem 1rem;
    border: 1px solid rgba(26, 107, 107, 0.16);
    border-radius: 16px;
    background: rgba(236, 247, 245, 0.76);
}

.learner-assessment-review-feedback > span {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    color: var(--teal);
    font-family: "Space Mono", monospace;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.learner-assessment-review-feedback p {
    margin: 0;
    color: var(--mid);
    line-height: 1.65;
}

.learner-assessment-review-feedback.is-correct {
    border-color: rgba(47, 125, 73, 0.22);
    background: rgba(231, 247, 236, 0.78);
}

.learner-assessment-review-feedback.is-incorrect {
    border-color: rgba(181, 57, 48, 0.22);
    background: rgba(255, 235, 232, 0.78);
}

.learner-assessment-review-feedback.is-explanation {
    border-color: rgba(190, 145, 35, 0.3);
    background: linear-gradient(135deg, rgba(255, 248, 224, 0.94), rgba(255, 255, 255, 0.94));
}

.learner-assessment-review-feedback.is-explanation > span {
    color: #8a6516;
}

.learner-assessment-review-lock-card {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.25rem;
    border-style: dashed;
    background: linear-gradient(135deg, rgba(245, 242, 234, 0.92), rgba(255, 255, 255, 0.96));
}

.learner-assessment-review-lock-card h3,
.learner-assessment-review-lock-card p {
    margin: 0;
}

.learner-assessment-review-lock-card h3 {
    margin-block: 0.25rem 0.35rem;
}

.learner-assessment-review-lock-card p {
    color: var(--mid);
    line-height: 1.6;
}

.learner-assessment-review-lock-icon {
    display: grid;
    place-items: center;
    width: 3rem;
    height: 3rem;
    flex: 0 0 3rem;
    border-radius: 50%;
    color: var(--teal);
    background: rgba(26, 107, 107, 0.12);
}

@media (max-width: 680px) {
    .learner-assessment-review-heading {
        align-items: flex-start;
    }

    .learner-answer-review-options .learner-review-option {
        grid-template-columns: auto auto minmax(0, 1fr);
    }

    .learner-option-review-state {
        grid-column: 2 / -1;
        justify-content: flex-start;
        white-space: normal;
    }
}

.learner-assessment-response {
    display: grid;
    gap: 0.55rem;
    padding-bottom: 1.2rem;
}

.learner-assessment-response textarea {
    width: 100%;
    min-height: 132px;
    border-radius: 18px;
    border: 1px solid rgba(17, 24, 39, 0.08);
    background: rgba(255, 255, 255, 0.98);
    padding: 1rem 1.05rem;
    color: var(--ink);
    font: inherit;
    line-height: 1.7;
    resize: vertical;
}

.learner-assessment-response textarea:focus {
    outline: none;
    border-color: rgba(26, 107, 107, 0.35);
    box-shadow: 0 0 0 4px rgba(26, 107, 107, 0.08);
}

.learner-answer-count {
    justify-self: end;
    color: var(--mid);
    font-family: var(--mono);
    font-size: 0.68rem;
    letter-spacing: 0.04em;
}

.learner-assessment-response input:focus-visible,
.learner-assessment-response textarea:focus-visible,
.learner-assessment-response select:focus-visible {
    outline: 3px solid rgba(201, 168, 76, 0.36);
    outline-offset: 2px;
}

.learner-assessment-submit-card {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: center;
}

.learner-assessment-submit-card > div:first-child {
    min-width: 0;
}

.learner-assessment-submit-card strong {
    display: block;
    margin-top: 0.3rem;
    font-size: 1.08rem;
    color: var(--ink);
}

.learner-assessment-submit-card p {
    margin: 0.55rem 0 0;
    color: var(--mid);
    line-height: 1.7;
}

.learner-assessment-summary-card .panel-head,
.learner-assessment-note-card .panel-head {
    margin-bottom: 0.8rem;
}

.learner-assessment-navigator-card {
    display: grid;
    gap: 0.95rem;
}

.learner-assessment-progress-track {
    position: relative;
    width: 100%;
    height: 0.5rem;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.08);
    overflow: hidden;
}

.learner-assessment-progress-fill {
    position: absolute;
    inset: 0 auto 0 0;
    width: 0;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(26, 107, 107, 0.96), rgba(201, 168, 76, 0.9));
    transition: width 0.2s ease;
}

.learner-assessment-navigator-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(52px, 1fr));
    gap: 0.7rem;
}

.learner-assessment-nav-button {
    min-height: 52px;
    border-radius: 16px;
    border: 1px solid rgba(17, 24, 39, 0.08);
    background: rgba(255, 255, 255, 0.96);
    color: var(--ink);
    font: inherit;
    font-weight: 700;
    cursor: pointer;
    transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.learner-assessment-nav-button:hover {
    transform: translateY(-1px);
    border-color: rgba(26, 107, 107, 0.22);
    box-shadow: 0 12px 24px rgba(26, 107, 107, 0.08);
}

.learner-assessment-nav-button:active {
    transform: translateY(0) scale(0.985);
}

.learner-assessment-nav-button:focus-visible {
    outline: 3px solid rgba(201, 168, 76, 0.42);
    outline-offset: 2px;
    border-color: rgba(26, 107, 107, 0.28);
    box-shadow: 0 0 0 3px rgba(15, 76, 92, 0.14);
}

.learner-assessment-nav-button.is-answered {
    background: linear-gradient(180deg, rgba(239, 249, 242, 0.98), rgba(255, 255, 255, 0.95));
    border-color: rgba(122, 173, 138, 0.28);
    color: #2f6d40;
}

.learner-assessment-latest-score {
    display: grid;
    gap: 0.35rem;
    margin-bottom: 0.75rem;
}

.learner-assessment-latest-score strong {
    font-family: "Playfair Display", serif;
    font-size: 2rem;
    line-height: 1;
    color: var(--ink);
}

.learner-assessment-latest-score span {
    color: var(--mid);
}

.learner-assessment-result-flow {
    display: grid;
    gap: 1rem;
}

.learner-assessment-followthrough-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.learner-assessment-followthrough-card {
    height: 100%;
}

.learner-assessment-note-card {
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 168, 76, 0.13), transparent 38%),
        linear-gradient(145deg, rgba(252, 254, 253, 0.98), rgba(246, 251, 250, 0.96));
}

.assessment-next-move-heading {
    align-items: flex-start;
    margin-bottom: 1rem;
}

.assessment-next-move-heading h3 {
    margin: 0.22rem 0 0.3rem;
}

.assessment-next-move-heading p {
    margin: 0;
    color: var(--mid);
    line-height: 1.55;
}

.assessment-next-move-heading > i {
    display: grid;
    place-items: center;
    width: 2.7rem;
    height: 2.7rem;
    flex: 0 0 2.7rem;
    border-radius: 50%;
    color: var(--teal);
    background: rgba(26, 107, 107, 0.1);
}

.assessment-next-move-list {
    display: grid;
    gap: 0.7rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.assessment-next-move-item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    gap: 0.8rem;
    padding: 0.85rem;
    border: 1px solid rgba(26, 107, 107, 0.12);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.78);
}

.assessment-next-move-item:nth-child(2) {
    background: rgba(250, 246, 235, 0.78);
}

.assessment-next-move-number {
    display: grid;
    place-items: center;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 12px;
    color: #fff;
    background: linear-gradient(145deg, var(--teal), #2f918d);
    font-family: var(--font-mono, monospace);
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.06em;
}

.assessment-next-move-copy {
    display: grid;
    gap: 0.25rem;
    min-width: 0;
}

.assessment-next-move-copy strong {
    line-height: 1.3;
}

.assessment-next-move-copy p {
    margin: 0;
    color: var(--mid);
    line-height: 1.55;
}

.learner-assessment-result-summary-card .button-row {
    justify-content: flex-start;
    flex-wrap: wrap;
}

.learner-assessment-focus-hero {
    width: min(100%, 980px);
    margin-inline: auto;
    border-radius: 24px;
    background:
        radial-gradient(circle at top right, rgba(201, 168, 76, 0.14), transparent 36%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(247, 252, 251, 0.94));
}

.learner-assessment-focus-hero .learner-assessment-hero-copy,
.learner-assessment-focus-hero .learner-assessment-hero-meta {
    padding-left: clamp(1rem, 2vw, 1.5rem);
    padding-right: clamp(1rem, 2vw, 1.5rem);
}

.learner-assessment-focus-hero .learner-assessment-hero-copy h2 {
    font-size: clamp(1.7rem, 3vw, 2.65rem);
    line-height: 1.08;
}

.learner-assessment-shell .learner-assessment-layout {
    width: min(100%, 980px);
    margin-inline: auto;
    display: block;
}

.learner-assessment-shell .learner-assessment-main {
    display: grid;
    gap: 1rem;
}

.learner-assessment-work-console {
    position: sticky;
    top: 0.85rem;
    z-index: 8;
    display: grid;
    gap: 0.95rem;
    border: 1px solid rgba(26, 107, 107, 0.16);
    border-radius: 22px;
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 18px 42px rgba(15, 23, 42, 0.12);
    backdrop-filter: blur(16px);
}

.learner-assessment-work-console.is-locked {
    border-color: rgba(192, 94, 58, 0.22);
    background: rgba(255, 248, 244, 0.95);
}

.learner-assessment-work-console .learner-assessment-mobile-console-head {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
}

.learner-assessment-work-console .learner-assessment-mobile-console-head p {
    max-width: 62ch;
}

.learner-assessment-console-actions {
    justify-content: flex-end;
    flex-wrap: nowrap;
}

.learner-assessment-console-actions .button {
    white-space: nowrap;
}

.learner-assessment-work-console .learner-assessment-mobile-nav {
    padding-bottom: 0.2rem;
}

.learner-assessment-nav-shell {
    display: grid;
    gap: 0.65rem;
}

.learner-assessment-nav-toggle {
    display: none;
    width: 100%;
    min-height: 44px;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.7rem 0.85rem;
    border: 1px solid rgba(26, 107, 107, 0.12);
    border-radius: 14px;
    background: linear-gradient(180deg, rgba(245, 250, 249, 0.98), rgba(255, 255, 255, 0.94));
    color: var(--ink);
    font: inherit;
    cursor: pointer;
}

.learner-assessment-nav-toggle span {
    font-family: var(--mono);
    font-size: 0.68rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--teal);
}

.learner-assessment-nav-toggle strong {
    margin-left: auto;
    white-space: nowrap;
}

.learner-assessment-nav-toggle i {
    color: var(--teal);
    transition: transform 0.18s ease;
}

.learner-assessment-nav-shell.is-open .learner-assessment-nav-toggle i {
    transform: rotate(180deg);
}

.learner-assessment-work-console .learner-assessment-nav-button {
    flex: 0 0 44px;
    min-height: 44px;
    border-radius: 14px;
}

.learner-assessment-form .learner-assessment-question-card {
    border-radius: 22px;
    scroll-margin-top: 11rem;
}

.learner-assessment-answered-badge {
    display: none;
    border-color: rgba(122, 173, 138, 0.24);
    background: rgba(239, 249, 242, 0.95);
    color: #2f6d40;
}

.learner-assessment-question-card.is-answered .learner-assessment-answered-badge {
    display: inline-flex;
}

.learner-assessment-question-controls {
    display: flex;
    justify-content: flex-end;
    gap: 0.7rem;
    padding: 0 1.2rem 1.2rem;
    border-top: 1px solid rgba(15, 23, 42, 0.06);
    margin-top: -0.15rem;
    padding-top: 1rem;
}

.learner-assessment-question-controls .button {
    min-width: 9.5rem;
    justify-content: center;
}

.learner-assessment-form .learner-assessment-submit-card {
    border-radius: 22px;
    background:
        radial-gradient(circle at bottom right, rgba(26, 107, 107, 0.08), transparent 36%),
        rgba(255, 255, 255, 0.98);
}

.learner-assessment-confirm-card {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: center;
    border-radius: 22px;
    border-color: rgba(201, 168, 76, 0.32);
    background:
        radial-gradient(circle at top right, rgba(201, 168, 76, 0.16), transparent 34%),
        linear-gradient(180deg, rgba(255, 252, 244, 0.98), rgba(255, 255, 255, 0.96));
    box-shadow: 0 18px 38px rgba(201, 168, 76, 0.12);
}

.learner-assessment-confirm-card[hidden] {
    display: none;
}

.learner-assessment-confirm-card > div:first-child {
    display: grid;
    gap: 0.35rem;
    min-width: 0;
}

.learner-assessment-confirm-card strong {
    color: var(--ink);
    font-size: 1.08rem;
}

.learner-assessment-confirm-card p {
    margin: 0;
    color: var(--mid);
    line-height: 1.6;
}

.resource-builder-panel {
    display: grid;
    gap: 1rem;
}

.resource-builder-form {
    display: grid;
    gap: 1rem;
}

.lesson-empty-state {
    display: grid;
    place-items: center;
    gap: 0.55rem;
    padding: 2.4rem 1.2rem;
    border: 1px dashed rgba(19, 107, 116, 0.22);
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.64);
    text-align: center;
}

.lesson-empty-state i {
    color: var(--teal);
    font-size: 1.3rem;
}

.lesson-empty-state strong {
    color: var(--ink);
}

.lesson-empty-state span {
    color: var(--mid);
    max-width: 38rem;
    line-height: 1.7;
}

.lesson-empty-state .button-primary,
.lesson-empty-state .button-primary i,
.lesson-empty-state .button-primary span {
    color: #fff;
}

.assessment-review-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    margin-top: 1rem;
}

.sidebar-welcome-avatar img,
.sidebar-user .s-avatar img,
.tutor-profile-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: inherit;
    display: block;
}

.sidebar-profile-line {
    display: block;
    color: rgba(255, 255, 255, 0.76);
    font-size: 0.72rem;
    line-height: 1.45;
}

.tutor-profile-grid {
    align-items: start;
}

.tutor-profile-main-column,
.tutor-profile-side-column {
    display: grid;
    gap: 1.5rem;
    align-content: start;
}

.tutor-profile-highlight-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.admin-user-record-grid {
    grid-template-columns: minmax(0, 1.35fr) minmax(300px, 0.72fr);
}

.learner-transfer-workflow-grid {
    grid-template-columns: minmax(440px, 1.18fr) minmax(300px, 0.82fr);
    align-items: start;
}

.learner-transfer-workflow-grid > .content-panel {
    min-width: 0;
}

.learner-transfer-preview-panel {
    background:
        radial-gradient(circle at top left, rgba(26, 107, 107, 0.1), transparent 32%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(244, 249, 248, 0.96));
}

.learner-transfer-confirmation-panel {
    border-top: 4px solid var(--teal);
}

.searchable-select {
    position: relative;
    min-width: 0;
}

.form-field .searchable-select-input {
    padding-right: 2.8rem;
    background:
        linear-gradient(90deg, transparent calc(100% - 2.8rem), rgba(26, 107, 107, 0.06) calc(100% - 2.8rem)),
        rgba(255, 255, 255, 0.96);
}

.searchable-select::after {
    content: "\f002";
    position: absolute;
    z-index: 2;
    top: 1rem;
    right: 1rem;
    color: var(--teal);
    font: 900 0.9rem/1 "Font Awesome 6 Free";
    pointer-events: none;
}

.searchable-select-options {
    position: absolute;
    z-index: 30;
    top: calc(100% + 0.45rem);
    left: 0;
    right: 0;
    max-height: 260px;
    overflow-y: auto;
    padding: 0.45rem;
    border: 1px solid rgba(26, 107, 107, 0.2);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.99);
    box-shadow: 0 18px 42px rgba(17, 24, 39, 0.16);
}

.searchable-select-option {
    padding: 0.75rem 0.85rem;
    border-radius: 10px;
    color: var(--ink);
    cursor: pointer;
    line-height: 1.4;
}

.searchable-select-option:hover,
.searchable-select-option.is-active,
.searchable-select-option[aria-selected="true"] {
    background: rgba(26, 107, 107, 0.1);
}

.searchable-select-option.is-active {
    outline: 2px solid rgba(26, 107, 107, 0.22);
}

.searchable-select-empty {
    margin: 0;
    padding: 0.8rem;
    color: var(--mid);
    font-size: 0.84rem;
}

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

@media (max-width: 1100px) {
    .learner-transfer-workflow-grid {
        grid-template-columns: 1fr;
    }
}

.admin-user-record-summary {
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.08), transparent 34%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(247, 244, 238, 0.94));
}

.admin-record-highlight-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin-bottom: 0;
}

.tutor-profile-highlight-card {
    position: relative;
    overflow: hidden;
    display: grid;
    gap: 0.75rem;
    min-height: 188px;
    padding: 1.15rem 1.1rem;
    border-radius: 22px;
    border: 1px solid rgba(17, 24, 39, 0.08);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(247, 242, 233, 0.92));
    box-shadow: 0 20px 36px rgba(17, 24, 39, 0.08);
}

.admin-record-highlight-card {
    min-height: 112px;
    padding: 1rem;
    border-radius: 18px;
    box-shadow: 0 14px 30px rgba(17, 24, 39, 0.06);
}

.admin-record-highlight-card .tutor-profile-highlight-value {
    font-size: clamp(1.05rem, 1.45vw, 1.32rem);
    line-height: 1.18;
}

.tutor-profile-highlight-card::after {
    content: "";
    position: absolute;
    inset: auto -16px -30px auto;
    width: 92px;
    height: 92px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.5);
    opacity: 0.55;
    pointer-events: none;
}

.tutor-profile-highlight-card.tone-teal {
    background: linear-gradient(180deg, rgba(242, 251, 250, 0.98), rgba(228, 244, 241, 0.94));
}

.tutor-profile-highlight-card.tone-gold {
    background: linear-gradient(180deg, rgba(255, 250, 241, 0.98), rgba(246, 237, 214, 0.94));
}

.tutor-profile-highlight-card.tone-ink {
    background: linear-gradient(180deg, rgba(249, 250, 252, 0.99), rgba(236, 241, 246, 0.94));
}

.tutor-profile-highlight-card.tone-sage {
    background: linear-gradient(180deg, rgba(244, 251, 248, 0.98), rgba(231, 243, 238, 0.94));
}

.tutor-profile-highlight-top {
    display: flex;
    align-items: center;
    gap: 0.7rem;
}

.tutor-profile-highlight-icon {
    width: 40px;
    height: 40px;
    border-radius: 14px;
    display: inline-grid;
    place-items: center;
    background: rgba(17, 24, 39, 0.08);
    color: var(--teal);
    flex-shrink: 0;
}

.tutor-profile-highlight-card.tone-gold .tutor-profile-highlight-icon {
    color: #b7791f;
}

.tutor-profile-highlight-card.tone-ink .tutor-profile-highlight-icon {
    color: var(--ink);
}

.tutor-profile-highlight-card.tone-sage .tutor-profile-highlight-icon {
    color: #2f855a;
}

.tutor-profile-highlight-label {
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: rgba(17, 24, 39, 0.62);
    font-weight: 700;
}

.tutor-profile-highlight-value {
    position: relative;
    z-index: 1;
    display: block;
    font-size: clamp(1.45rem, 2vw, 2.2rem);
    line-height: 0.98;
    letter-spacing: -0.03em;
    color: var(--ink);
    word-break: break-word;
    text-wrap: balance;
}

.tutor-profile-highlight-support {
    position: relative;
    z-index: 1;
    display: block;
    margin-top: auto;
    color: var(--text-soft);
    font-size: 0.85rem;
    font-weight: 600;
}

.school-access-form-grid {
    align-items: start;
}

.school-access-subject-field {
    grid-column: 1 / -1;
}

.school-access-subject-picker {
    display: grid;
    gap: 1rem;
    padding: 1rem;
    border-radius: 18px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.92);
}

.school-access-level-group {
    display: grid;
    gap: 0.8rem;
    padding: 0.95rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 18px;
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.06), transparent 34%),
        rgba(248, 250, 249, 0.92);
}

.school-access-level-group:nth-child(even) {
    background:
        radial-gradient(circle at top right, rgba(217, 170, 43, 0.08), transparent 34%),
        rgba(255, 252, 244, 0.94);
}

.school-access-level-head {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: flex-start;
}

.school-access-level-head strong {
    color: var(--ink);
    font-size: 1rem;
}

.school-access-level-head p {
    margin: 0;
    color: var(--mid);
    font-size: 0.84rem;
    line-height: 1.55;
}

.school-access-subject-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.7rem;
}

.school-access-subject-option {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.65rem;
    align-items: start;
    padding: 0.8rem 0.85rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.88);
    cursor: pointer;
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease, background 180ms ease;
}

.school-access-subject-option:hover,
.school-access-subject-option:focus-within {
    transform: translateY(-1px);
    border-color: rgba(26, 107, 107, 0.24);
    box-shadow: 0 12px 24px rgba(15, 23, 42, 0.06);
}

.school-access-subject-option.is-selected {
    border-color: rgba(26, 107, 107, 0.34);
    background: linear-gradient(135deg, rgba(226, 241, 241, 0.98), rgba(255, 255, 255, 0.94));
}

.school-access-subject-option input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.school-access-subject-check {
    width: 1rem;
    height: 1rem;
    margin-top: 0.2rem;
    border-radius: 999px;
    display: inline-grid;
    place-items: center;
    border: 1px solid rgba(26, 107, 107, 0.32);
    color: transparent;
    background: rgba(255, 255, 255, 0.95);
}

.school-access-subject-option.is-selected .school-access-subject-check {
    color: #fff;
    background: var(--teal);
    border-color: var(--teal);
}

.school-access-subject-check i {
    font-size: 0.58rem;
}

.school-access-subject-copy {
    display: grid;
    gap: 0.18rem;
    min-width: 0;
}

.school-access-subject-copy strong {
    color: var(--ink);
    line-height: 1.35;
}

.school-access-subject-copy small {
    color: var(--mid);
    line-height: 1.45;
    font-size: 0.76rem;
}

.school-access-subject-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
}

.admin-school-access-shell {
    display: grid;
    gap: 1.4rem;
}

.admin-school-access-hero {
    align-items: center;
}

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

.admin-school-access-card-grid .student-pulse-card {
    min-height: 160px;
}

.admin-school-access-card-grid .student-pulse-card p {
    margin: 0.25rem 0 0;
    color: var(--text-soft);
    line-height: 1.5;
}

.admin-school-access-main-grid {
    grid-template-columns: minmax(0, 1.35fr) minmax(320px, 0.65fr);
    align-items: start;
}

.admin-school-access-form-panel,
.admin-school-access-subject-panel,
.admin-school-access-history-panel,
.admin-school-access-links-panel {
    position: relative;
    overflow: hidden;
}

.admin-school-access-side {
    display: grid;
    gap: 1rem;
}

.admin-school-access-actions {
    grid-column: 1 / -1;
}

.admin-school-access-history-list {
    display: grid;
    gap: 0.75rem;
}

.admin-school-access-history-row {
    display: grid;
    gap: 0.7rem;
    padding: 0.95rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.86);
}

.admin-school-access-history-row.is-current {
    border-color: rgba(26, 107, 107, 0.28);
    background: linear-gradient(145deg, rgba(26, 107, 107, 0.08), rgba(255, 255, 255, 0.94));
}

.admin-school-access-history-row h3,
.admin-school-access-history-row p {
    margin: 0;
}

.admin-school-access-history-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.admin-school-access-history-meta span {
    display: inline-flex;
    align-items: center;
    min-height: 1.8rem;
    padding: 0.25rem 0.55rem;
    border-radius: 999px;
    background: rgba(26, 107, 107, 0.08);
    color: var(--brand);
    font-size: 0.72rem;
    font-weight: 800;
}

.tutor-profile-summary {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(245, 240, 232, 0.92));
    display: grid;
    gap: 1rem;
}

.admin-tutor-roster {
    display: grid;
    gap: 0.75rem;
    container-type: inline-size;
}

.admin-tutor-roster-card {
    display: grid;
    grid-template-columns: minmax(260px, 1.25fr) auto minmax(250px, 0.9fr) minmax(250px, auto);
    align-items: center;
    gap: 1rem;
    padding: 0.85rem 1rem;
    border-radius: 16px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background:
        linear-gradient(90deg, rgba(26, 107, 107, 0.04), transparent 40%),
        rgba(255, 255, 255, 0.94);
    color: inherit;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.06);
    transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease, background-color 180ms ease;
}

.admin-tutor-roster-card:nth-child(even) {
    background:
        linear-gradient(90deg, rgba(214, 180, 73, 0.08), transparent 40%),
        rgba(255, 252, 244, 0.94);
}

.admin-tutor-roster-card:hover,
.admin-tutor-roster-card:focus-visible {
    transform: translateY(-1px);
    box-shadow: 0 16px 30px rgba(15, 23, 42, 0.1);
    border-color: rgba(16, 132, 139, 0.22);
    background: rgba(247, 251, 251, 0.98);
}

.admin-tutor-roster-card.needs-attention {
    border-color: rgba(201, 86, 33, 0.18);
    background: rgba(255, 251, 248, 0.96);
}

.admin-tutor-roster-main {
    display: flex;
    align-items: center;
    gap: 0.9rem;
    min-width: 0;
}

.admin-tutor-roster-avatar {
    width: 54px;
    height: 54px;
    border-radius: 16px;
    overflow: hidden;
    background: linear-gradient(135deg, rgba(16, 132, 139, 0.14), rgba(214, 180, 73, 0.2));
    display: grid;
    place-items: center;
    flex-shrink: 0;
}

.admin-tutor-roster-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.admin-tutor-roster-avatar span {
    font-size: 1.35rem;
    font-weight: 700;
    color: #154a62;
}

.admin-tutor-roster-copy {
    display: grid;
    gap: 0.25rem;
    min-width: 0;
}

.admin-tutor-roster-copy strong {
    font-size: 1rem;
    line-height: 1.2;
    color: #10233a;
    word-break: break-word;
}

.admin-tutor-roster-copy span {
    color: var(--mid);
    font-size: 0.86rem;
    overflow-wrap: anywhere;
}

.admin-tutor-roster-copy small {
    color: var(--teal);
    font-size: 0.78rem;
    line-height: 1.45;
}

.admin-tutor-roster-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
}

.admin-tutor-scope-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.42rem 0.65rem;
    border-radius: 999px;
    font-family: "Space Mono", monospace;
    font-size: 0.66rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
}

.admin-tutor-scope-badge.tone-gold {
    background: rgba(198, 161, 74, 0.16);
    color: #8a640a;
}

.admin-tutor-scope-badge.tone-ink {
    background: rgba(18, 28, 49, 0.1);
    color: #17243f;
}

.admin-tutor-roster-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.admin-tutor-roster-stats span {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.45rem 0.6rem;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.04);
    color: var(--mid);
    font-size: 0.78rem;
}

.admin-tutor-roster-stats strong {
    color: var(--ink);
}

.admin-tutor-roster-action {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 0.65rem;
}

@container (max-width: 1050px) {
    .admin-tutor-roster-card {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .admin-tutor-roster-stats,
    .admin-tutor-roster-action {
        grid-column: 1 / -1;
        justify-content: flex-start;
    }
}

@media (max-width: 1180px) {
    .tutor-scope-compare-strip {
        grid-template-columns: 1fr;
    }

    .admin-tutor-roster-card {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .admin-tutor-roster-stats,
    .admin-tutor-roster-action {
        grid-column: 1 / -1;
        justify-content: flex-start;
    }
}

@media (max-width: 640px) {
    .admin-tutor-roster-card {
        grid-template-columns: 1fr;
        align-items: flex-start;
    }

    .admin-tutor-roster-action {
        justify-content: flex-start;
        width: 100%;
    }
}

.tutor-profile-head {
    display: flex;
    gap: 1rem;
    align-items: center;
}

.tutor-profile-avatar {
    width: 92px;
    height: 92px;
    border-radius: 28px;
    overflow: hidden;
    background: linear-gradient(135deg, rgba(26, 107, 107, 0.16), rgba(201, 168, 76, 0.22));
    display: grid;
    place-items: center;
    font-size: 2rem;
    font-weight: 700;
    color: var(--teal);
    flex-shrink: 0;
}

.tutor-profile-copy {
    display: grid;
    gap: 0.35rem;
}

.tutor-profile-copy h3,
.tutor-profile-copy p,
.tutor-profile-copy strong {
    margin: 0;
}

.tutor-profile-copy strong {
    color: var(--teal);
    font-size: 0.95rem;
}

.tutor-profile-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.tutor-profile-meta span {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.85rem;
    border-radius: 999px;
    background: rgba(26, 107, 107, 0.08);
    color: var(--ink);
    font-size: 0.8rem;
    font-weight: 600;
}

.tutor-profile-meta i {
    color: var(--teal);
}

.tutor-profile-note {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    margin-bottom: 1rem;
    padding: 0.95rem 1rem;
    border-radius: 16px;
    background: rgba(26, 107, 107, 0.08);
    color: var(--mid);
}

.tutor-profile-note i {
    color: var(--teal);
    margin-top: 0.1rem;
}

.tutor-profile-note p {
    margin: 0;
}

.tutor-profile-upload-shell {
    display: grid;
    grid-template-columns: minmax(200px, 260px) minmax(0, 1fr);
    gap: 1.25rem;
    align-items: start;
    margin-bottom: 1rem;
}

.tutor-profile-upload-preview {
    position: relative;
    overflow: hidden;
    border-radius: 28px;
    background: linear-gradient(180deg, rgba(247, 250, 252, 0.98), rgba(235, 243, 245, 0.94));
    border: 1px solid rgba(17, 24, 39, 0.08);
    min-height: 260px;
    display: grid;
    place-items: center;
    box-shadow: 0 18px 34px rgba(15, 23, 42, 0.08);
}

.tutor-profile-upload-preview img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.tutor-profile-upload-copy {
    display: grid;
    gap: 1rem;
}

.tutor-profile-upload-copy .panel-head {
    margin-bottom: 0;
}

.tutor-profile-upload-copy input[type="file"] {
    padding: 0.9rem 1rem;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.9);
}

.tutor-profile-ges-scope {
    display: grid;
    gap: 1rem;
}

.tutor-profile-ges-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.9rem;
}

.tutor-profile-ges-stat {
    padding: 1rem 1.05rem;
    border-radius: 18px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(247, 250, 252, 0.88);
    display: grid;
    gap: 0.35rem;
}

.tutor-profile-ges-stat span {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: var(--teal);
}

.tutor-profile-ges-stat strong {
    font-size: 1.2rem;
    color: var(--ink);
}

.tutor-profile-ges-groups {
    display: grid;
    gap: 0.95rem;
}

.tutor-profile-ges-group {
    display: grid;
    gap: 0.45rem;
}

.tutor-profile-ges-pill-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.school-handout-grid {
    align-items: start;
}

.school-handout-sheet {
    background:
        radial-gradient(circle at top right, rgba(213, 181, 74, 0.12), transparent 38%),
        linear-gradient(180deg, rgba(240, 247, 246, 0.98), rgba(255, 255, 255, 0.98));
    border: 1px solid rgba(26, 107, 107, 0.14);
}

.school-handout-sheet-head {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: start;
    margin-bottom: 1.5rem;
}

.school-handout-sheet-head h3 {
    margin-bottom: 0.35rem;
}

.school-handout-sheet-head p {
    margin: 0;
    color: rgba(20, 35, 34, 0.72);
}

.school-handout-code {
    padding: 1.5rem;
    border-radius: 24px;
    border: 1px dashed rgba(26, 107, 107, 0.24);
    background: rgba(255, 255, 255, 0.84);
    text-align: center;
}

.school-handout-code span,
.school-handout-link-card span {
    display: block;
    font-size: 0.78rem;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--brand-teal);
    font-family: var(--font-mono);
}

.school-handout-code strong {
    display: block;
    margin: 0.6rem 0 0.4rem;
    font-family: var(--font-display);
    font-size: clamp(2rem, 4vw, 3.25rem);
    line-height: 1;
}

.school-handout-code p {
    margin: 0;
    color: rgba(20, 35, 34, 0.74);
}

.school-handout-links {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    margin-top: 1.25rem;
}

.school-handout-link-card,
.school-handout-step-card,
.school-copy-block,
.school-handout-note {
    padding: 1.25rem;
    border-radius: 22px;
    border: 1px solid rgba(26, 107, 107, 0.12);
    background: rgba(255, 255, 255, 0.9);
}

.school-handout-link-card strong {
    display: block;
    margin-top: 0.55rem;
    word-break: break-word;
    font-size: 0.98rem;
}

.school-handout-step-grid,
.school-copy-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    margin-top: 1.25rem;
}

.school-handout-step-card p {
    margin: 0 0 1rem;
    color: rgba(20, 35, 34, 0.74);
}

.school-handout-step-list {
    margin: 0;
    padding-left: 1.15rem;
    display: grid;
    gap: 0.75rem;
}

.school-handout-note {
    margin-top: 1.25rem;
    background: rgba(26, 107, 107, 0.06);
}

.school-handout-note strong {
    display: block;
    margin-bottom: 0.4rem;
}

.school-handout-note p {
    margin: 0;
}

.school-copy-block .panel-head {
    align-items: center;
}

.school-copy-block textarea {
    width: 100%;
    min-height: 170px;
    margin-top: 0.75rem;
    padding: 1rem 1.05rem;
    border-radius: 18px;
    border: 1px solid rgba(26, 107, 107, 0.14);
    background: rgba(245, 248, 248, 0.96);
    color: var(--ink-900);
    line-height: 1.6;
    resize: vertical;
}

.school-copy-trigger.is-copied {
    border-color: rgba(26, 107, 107, 0.26);
    background: rgba(26, 107, 107, 0.1);
    color: var(--brand-teal);
}

.school-handout-preview p {
    white-space: normal;
}

.school-setup-panel {
    background:
        radial-gradient(circle at top left, rgba(26, 107, 107, 0.08), transparent 34%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(246, 249, 249, 0.94));
}

.school-setup-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.school-next-steps-panel .school-setup-grid {
    grid-template-columns: 1fr;
}

.school-priorities-panel,
.school-next-steps-panel {
    align-self: stretch;
    display: flex;
    flex-direction: column;
}

.school-priorities-panel .student-quick-grid,
.school-next-steps-panel .school-setup-grid {
    flex: 1;
}

.school-setup-card,
.school-workflow-step {
    border-radius: 22px;
    border: 1px solid rgba(17, 24, 39, 0.08);
    background: rgba(255, 255, 255, 0.88);
}

.school-setup-card {
    padding: 1.25rem;
    display: grid;
    gap: 0.8rem;
}

.school-setup-card strong {
    font-size: 1.2rem;
    line-height: 1.25;
}

.school-setup-card p {
    margin: 0;
    color: var(--mid);
    line-height: 1.7;
}

.school-setup-card.tone-teal {
    border-color: rgba(26, 107, 107, 0.18);
}

.school-setup-card.tone-gold {
    border-color: rgba(213, 181, 74, 0.22);
    background: rgba(255, 249, 238, 0.94);
}

.school-setup-card.tone-ink {
    border-color: rgba(36, 67, 111, 0.16);
    background: rgba(244, 248, 255, 0.92);
}

.school-setup-card.tone-sage {
    border-color: rgba(90, 131, 103, 0.18);
    background: rgba(245, 250, 245, 0.92);
}

.school-workflow-strip {
    margin: 0 0 1.3rem;
    padding: 1.15rem 1.2rem;
    border-radius: 24px;
    border: 1px solid rgba(17, 24, 39, 0.08);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(243, 247, 247, 0.94));
    box-shadow: 0 16px 32px rgba(15, 23, 42, 0.05);
}

.school-workflow-strip-head {
    display: grid;
    gap: 0.25rem;
    margin-bottom: 0.95rem;
}

.school-workflow-strip-head h3 {
    margin: 0;
    font-size: 1.1rem;
}

.school-workflow-step-list {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.9rem;
}

.school-workflow-step {
    display: flex;
    align-items: start;
    gap: 0.8rem;
    padding: 1rem;
    text-decoration: none;
    color: inherit;
    transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

.school-workflow-step:hover {
    transform: translateY(-2px);
    border-color: rgba(26, 107, 107, 0.22);
    box-shadow: 0 12px 24px rgba(15, 23, 42, 0.08);
}

.school-workflow-step.is-active {
    border-color: rgba(26, 107, 107, 0.24);
    background: rgba(235, 246, 245, 0.96);
}

.school-workflow-step-index {
    width: 2rem;
    height: 2rem;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(26, 107, 107, 0.1);
    color: var(--brand-teal);
    font-weight: 700;
    flex-shrink: 0;
}

.school-workflow-step-copy {
    display: grid;
    gap: 0.3rem;
}

.school-workflow-step-copy strong {
    font-size: 1rem;
    line-height: 1.2;
}

.school-workflow-step-copy small {
    color: var(--mid);
    line-height: 1.5;
}

@media (max-width: 640px) {
    .tutor-profile-highlight-card {
        min-height: 0;
    }

    .tutor-profile-highlight-value {
        font-size: 1.6rem;
    }

    .school-access-subject-grid {
        grid-template-columns: 1fr;
    }

    .tutor-profile-upload-shell {
        grid-template-columns: 1fr;
    }

    .tutor-profile-upload-preview {
        min-height: 220px;
    }

    .tutor-profile-ges-stats {
        grid-template-columns: 1fr 1fr;
    }

    .school-handout-links,
    .school-handout-step-grid,
    .school-copy-grid,
    .school-setup-grid {
        grid-template-columns: 1fr;
    }

    .school-handout-sheet-head {
        flex-direction: column;
    }

    .school-workflow-step-list {
        grid-template-columns: 1fr;
    }
}

.tutor-module-card {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(245, 240, 232, 0.92));
    display: grid;
    gap: 0.9rem;
}

.tutor-module-card p {
    margin: 0;
    color: var(--mid);
    line-height: 1.7;
}

.tutor-dashboard-stack {
    display: grid;
    gap: 1.5rem;
}

.tutor-dashboard-stack > section {
    margin: 0;
}

.tutor-hero-band {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    gap: var(--workspace-hero-gap);
    margin-bottom: 1.4rem;
    padding: var(--workspace-hero-padding);
    border-radius: var(--workspace-hero-radius);
    background: var(--workspace-tutor-hero);
    color: #fff;
    box-shadow: var(--workspace-hero-shadow);
}

.tutor-hero-copy {
    display: grid;
    gap: 0.6rem;
    max-width: 62ch;
}

.tutor-hero-band .eyebrow-inline,
.tutor-hero-band h2,
.tutor-hero-band p {
    color: #fff;
}

.tutor-hero-band p {
    color: rgba(255, 255, 255, 0.8);
    line-height: 1.75;
    margin: 0;
}

.tutor-hero-actions {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    justify-content: center;
    min-width: 210px;
}

.tutor-hero-band .text-link {
    color: rgba(255, 255, 255, 0.92);
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.tutor-hero-band .text-link:hover,
.tutor-hero-band .text-link:focus-visible {
    color: #ffffff;
}

.tutor-pulse-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.tutor-stat-grid {
    margin-bottom: 1.5rem;
}

.tutor-dashboard-grid {
    align-items: start;
    gap: 1.5rem;
}

.tutor-command-grid {
    align-items: start;
    margin-bottom: 1.1rem;
}

.tutor-action-board,
.tutor-queue-panel {
    height: 100%;
}

.tutor-priority-list {
    display: grid;
    gap: 0.8rem;
}

.tutor-priority-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.85rem;
    padding: 0.95rem 1rem;
    border-radius: 18px;
    border: 1px solid rgba(13, 13, 13, 0.08);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(248, 245, 239, 0.92));
    transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.tutor-priority-card:hover {
    transform: translateY(-2px);
    border-color: rgba(26, 107, 107, 0.18);
    box-shadow: 0 16px 30px rgba(13, 13, 13, 0.08);
}

.tutor-priority-card.tone-teal {
    background: linear-gradient(180deg, rgba(232, 244, 244, 0.98), rgba(255, 255, 255, 0.96));
}

.tutor-priority-card.tone-gold {
    background: linear-gradient(180deg, rgba(251, 245, 226, 0.98), rgba(255, 255, 255, 0.96));
}

.tutor-priority-card.tone-ink {
    background: linear-gradient(180deg, rgba(239, 239, 241, 0.98), rgba(255, 255, 255, 0.96));
}

.tutor-priority-card.tone-sage {
    background: linear-gradient(180deg, rgba(238, 247, 239, 0.98), rgba(255, 255, 255, 0.96));
}

.tutor-priority-icon {
    width: 2.7rem;
    height: 2.7rem;
    border-radius: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(26, 107, 107, 0.12);
    color: var(--teal);
    flex-shrink: 0;
}

.tutor-priority-copy {
    display: grid;
    gap: 0.22rem;
    min-width: 0;
}

.tutor-priority-copy strong {
    color: var(--ink);
    font-size: 0.95rem;
    line-height: 1.3;
}

.tutor-priority-copy p {
    color: var(--mid);
    font-size: 0.8rem;
    line-height: 1.55;
    margin: 0;
}

.tutor-priority-arrow {
    color: rgba(13, 13, 13, 0.32);
    font-size: 0.78rem;
}

.tutor-queue-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.8rem;
    margin-bottom: 1rem;
}

.tutor-queue-card {
    padding: 1rem 0.85rem;
    border-radius: 18px;
    border: 1px solid rgba(13, 13, 13, 0.08);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.88), rgba(248, 245, 239, 0.9));
    display: grid;
    gap: 0.22rem;
    justify-items: start;
    transition: transform 0.2s ease, border-color 0.2s ease;
}

.tutor-queue-card:hover {
    transform: translateY(-2px);
    border-color: rgba(26, 107, 107, 0.16);
}

.tutor-queue-icon {
    width: 2.3rem;
    height: 2.3rem;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(26, 107, 107, 0.12);
    color: var(--teal);
    margin-bottom: 0.35rem;
}

.tutor-queue-card strong {
    color: var(--ink);
    font-size: 1.15rem;
    line-height: 1;
}

.tutor-queue-card span {
    color: var(--ink);
    font-size: 0.82rem;
    font-weight: 600;
}

.tutor-queue-card small {
    color: var(--mid);
    font-size: 0.74rem;
    line-height: 1.45;
}

.tutor-management-hero {
    margin-bottom: 1.2rem;
}

.tutor-pulse-grid-expanded {
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.compact-priority-list {
    margin-top: 1rem;
}

.tutor-access-filter-bar {
    margin-bottom: 1rem;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.85rem;
    align-items: end;
}

.tutor-management-list {
    display: grid;
    gap: 1rem;
}

.tutor-management-card {
    position: relative;
    overflow: hidden;
    padding: 1.15rem;
    border-radius: 20px;
    border: 1px solid rgba(13, 13, 13, 0.08);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(248, 245, 239, 0.94));
    display: grid;
    gap: 1rem;
    box-shadow: 0 14px 32px rgba(18, 28, 49, 0.055);
    transition: transform 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease;
}

.tutor-management-card::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: linear-gradient(180deg, rgba(26, 107, 107, 0.92), rgba(201, 168, 76, 0.78));
    opacity: 0.9;
}

.tutor-management-card:hover,
.tutor-management-card:focus-within {
    transform: translateY(-2px);
    border-color: rgba(26, 107, 107, 0.2);
    box-shadow: 0 20px 42px rgba(18, 28, 49, 0.095);
}

.tutor-management-card.needs-attention {
    border-color: rgba(201, 168, 76, 0.28);
    box-shadow: 0 16px 28px rgba(201, 168, 76, 0.08);
}

.tutor-management-card.needs-attention::before {
    background: linear-gradient(180deg, rgba(201, 168, 76, 0.95), rgba(26, 107, 107, 0.82));
}

.tutor-management-top {
    display: flex;
    justify-content: space-between;
    align-items: start;
    gap: 1rem;
}

.tutor-management-top h3 {
    margin: 0 0 0.35rem;
    color: var(--ink);
    font-size: clamp(1.1rem, 1.35vw, 1.35rem);
}

.tutor-management-top p {
    margin: 0;
    color: var(--mid);
    line-height: 1.65;
}

.tutor-management-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.8rem;
}

.tutor-management-metric {
    padding: 0.85rem 0.9rem;
    border-radius: 14px;
    border: 1px solid var(--border);
    background: rgba(255, 255, 255, 0.82);
    display: grid;
    gap: 0.2rem;
}

.tutor-management-metric span {
    font-family: "Space Mono", monospace;
    font-size: 0.62rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--teal);
}

.tutor-management-metric strong {
    font-size: 1rem;
    line-height: 1.2;
    color: var(--ink);
}

.tutor-management-metric p {
    margin: 0;
    color: var(--mid);
    font-size: 0.78rem;
    line-height: 1.55;
}

.tutor-management-status-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.8rem;
    flex-wrap: wrap;
}

.tutor-management-actions {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
    padding-top: 0.25rem;
}

.tutor-management-actions .ges-action-links {
    margin-top: 0;
}

.tutor-management-updated {
    color: var(--mid);
    font-size: 0.8rem;
}

.tutor-management-module-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.8rem;
}

.tutor-management-module {
    padding: 0.85rem 0.95rem;
    border-radius: 14px;
    background: rgba(245, 240, 232, 0.7);
    border: 1px solid rgba(13, 13, 13, 0.06);
    display: grid;
    gap: 0.22rem;
}

.tutor-management-module strong {
    font-size: 0.9rem;
    color: var(--ink);
}

.tutor-management-module span {
    font-size: 0.78rem;
    color: var(--mid);
    line-height: 1.5;
}

.single-column-module-list {
    grid-template-columns: minmax(0, 1fr);
}

.admin-assignment-grid {
    grid-template-columns: minmax(0, 1.35fr) minmax(300px, 0.85fr);
    align-items: start;
}

.admin-assignment-form-panel,
.admin-assignment-side-panel {
    display: grid;
    gap: 1rem;
}

.admin-assignment-form {
    gap: 1rem;
}

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

.tutor-focus-panel {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(245, 240, 232, 0.92));
}

.tutor-focus-shell {
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) minmax(240px, 0.7fr);
    gap: 1.25rem;
}

.tutor-focus-primary {
    display: grid;
    gap: 0.9rem;
}

.tutor-focus-primary h3 {
    margin: 0;
}

.tutor-focus-primary p {
    color: var(--mid);
    line-height: 1.7;
}

.tutor-overview-actions {
    flex-wrap: nowrap;
}

.tutor-overview-actions .button {
    white-space: nowrap;
}

.tutor-focus-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem;
}

.tutor-focus-mini-card,
.tutor-focus-summary {
    padding: 1rem;
    border: 1px solid var(--workspace-card-border);
    border-radius: var(--workspace-card-radius);
    background: rgba(255, 255, 255, 0.82);
    display: grid;
    gap: 0.35rem;
    box-shadow: var(--workspace-card-shadow);
}

.tutor-focus-mini-card span,
.tutor-focus-summary span {
    font-family: "Space Mono", monospace;
    font-size: 0.62rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--teal);
}

.tutor-focus-mini-card strong,
.tutor-focus-summary strong {
    font-size: 0.96rem;
    line-height: 1.5;
}

.tutor-focus-summary p {
    color: var(--mid);
    line-height: 1.65;
    margin: 0;
}

.tutor-focus-side {
    display: grid;
    gap: 0.85rem;
}

.tutor-dashboard-course-list {
    gap: 1rem;
}

.tutor-dashboard-course-card {
    gap: 0;
}

.tutor-dashboard-course-body {
    grid-template-columns: minmax(210px, 250px) minmax(0, 1fr);
}

.tutor-dashboard-course-shell {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: center;
}

.tutor-dashboard-course-stats {
    grid-template-columns: repeat(4, minmax(110px, 1fr));
}

.tutor-dashboard-course-actions {
    justify-content: flex-end;
    align-items: center;
    flex-wrap: nowrap;
    flex-shrink: 0;
}

.tutor-management-library-body {
    gap: 1rem;
}

.tutor-management-library-shell {
    align-items: center;
}

.tutor-management-library-stats {
    grid-template-columns: repeat(4, minmax(110px, 1fr));
}

.tutor-management-library-summary {
    display: block;
    margin-top: 0.45rem;
    color: var(--mid);
    line-height: 1.65;
}

.tutor-dashboard-course-card.needs-attention {
    border-color: rgba(201, 168, 76, 0.28);
    box-shadow: 0 16px 28px rgba(201, 168, 76, 0.08);
}

.tutor-management-library-modules {
    margin-top: 1rem;
}

.tutor-monitor-note {
    display: inline-flex;
    color: var(--mid);
    line-height: 1.6;
}

.tutor-monitor-overview-grid {
    align-items: stretch;
}

.tutor-dashboard-overview-grid {
    align-items: stretch;
}

.tutor-dashboard-overview-grid .school-focus-shell {
    grid-template-columns: minmax(0, 1fr);
}

.tutor-dashboard-priorities-panel {
    align-self: start;
}

.tutor-dashboard-priorities-panel .student-quick-grid {
    gap: 0.85rem;
}

.tutor-monitor-overview-grid .school-focus-shell {
    grid-template-columns: minmax(0, 1fr);
}

.tutor-empty-overview-state {
    min-height: 15rem;
    justify-content: center;
}

.tutor-monitor-priorities-panel {
    align-self: start;
}

.tutor-monitor-priorities-panel .student-quick-grid {
    gap: 0.85rem;
}

.tutor-management-overview-grid {
    align-items: stretch;
}

.tutor-management-overview-grid .school-focus-shell {
    grid-template-columns: minmax(0, 1fr);
}

.tutor-management-priorities-panel {
    align-self: start;
}

.tutor-management-priorities-panel .student-quick-grid {
    gap: 0.85rem;
}

.tutor-submission-overview-grid {
    align-items: stretch;
}

.tutor-submission-pressure-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.tutor-submission-overview-grid .school-focus-shell {
    grid-template-columns: minmax(0, 1fr);
}

.tutor-submission-priorities-panel {
    align-self: start;
}

.tutor-submission-priorities-panel .student-quick-grid {
    gap: 0.85rem;
}

.tutor-monitor-row {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) auto auto;
    align-items: center;
    gap: 1rem;
}

.tutor-monitor-identity-line {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    flex-wrap: nowrap;
    min-width: 0;
}

.tutor-monitor-identity-line > * {
    min-width: 0;
}

.tutor-monitor-identity-line strong,
.tutor-monitor-identity-line span {
    white-space: nowrap;
}

.tutor-monitor-identity-line span {
    overflow: hidden;
    text-overflow: ellipsis;
}

.tutor-monitor-identity-line .tutor-monitor-note {
    padding: 0.28rem 0.6rem;
    border-radius: 999px;
    background: rgba(19, 107, 116, 0.08);
    max-width: 320px;
}

.submission-queue-overview-shell {
    grid-template-columns: minmax(0, 1fr);
    gap: 1.4rem;
}

.submission-queue-overview-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.submission-queue-overview-panel .school-overview-actions {
    flex-wrap: nowrap;
}

.tutor-queue-disclosure {
    display: grid;
    gap: 1rem;
}

.tutor-queue-disclosure > summary {
    list-style: none;
    cursor: pointer;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 0.85rem;
    padding-bottom: 0.9rem;
    border-bottom: 1px solid rgba(15, 23, 42, 0.08);
}

.tutor-queue-disclosure > summary::-webkit-details-marker {
    display: none;
}

.tutor-queue-disclosure > summary span {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    font-family: "Playfair Display", serif;
    font-size: clamp(1.05rem, 1.4vw, 1.25rem);
    font-weight: 800;
    color: var(--ink);
}

.tutor-queue-disclosure > summary span i {
    width: 2.25rem;
    height: 2.25rem;
    display: inline-grid;
    place-items: center;
    border-radius: 999px;
    background: rgba(19, 107, 116, 0.1);
    color: var(--brand);
    font-size: 0.9rem;
}

.tutor-queue-disclosure > summary small {
    padding: 0.35rem 0.65rem;
    border-radius: 999px;
    background: rgba(19, 107, 116, 0.1);
    color: var(--teal);
    font-family: "Space Mono", monospace;
    font-size: 0.62rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.tutor-queue-disclosure > summary > i:last-child {
    color: var(--teal);
    transition: transform 0.22s ease;
}

.tutor-queue-disclosure[open] > summary > i:last-child {
    transform: rotate(180deg);
}

.tutor-queue-compact-list {
    gap: 0.7rem;
}

.tutor-queue-course-row {
    padding: 0.9rem 1rem;
}

.tutor-queue-course-row .tutor-dashboard-course-body {
    grid-template-columns: minmax(190px, 240px) minmax(0, 1fr);
}

.tutor-queue-course-row .school-roster-stat {
    min-height: 0;
    padding: 0.72rem 0.78rem;
}

.ges-submission-context-chips {
    gap: 0.45rem;
}

.ges-submission-context-chips span {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    padding: 0.25rem 0.55rem;
    border-radius: 999px;
    background: rgba(19, 107, 116, 0.08);
    color: var(--teal);
    font-family: "Space Mono", monospace;
    font-size: 0.62rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.ges-submission-overview-actions {
    gap: 0.7rem;
    align-items: center;
}

.ges-submission-overview-actions .button {
    flex: 0 1 auto;
    min-width: 0;
    white-space: nowrap;
}

.submission-queue-overview-side {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.tutor-dashboard-support-list,
.tutor-dashboard-submission-list {
    display: grid;
    gap: 0.9rem;
}

.tutor-dashboard-watch-stats,
.tutor-dashboard-assessment-stats,
.tutor-dashboard-submission-stats {
    display: flex;
    flex-wrap: nowrap;
    gap: 0.65rem;
    align-items: stretch;
}

.tutor-dashboard-watch-stats .school-roster-stat,
.tutor-dashboard-assessment-stats .school-roster-stat,
.tutor-dashboard-submission-stats .school-roster-stat {
    min-width: 104px;
    padding: 0.72rem 0.76rem;
}

.tutor-workflow-row,
.tutor-readiness-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center;
    column-gap: 1rem;
}

.tutor-workflow-row .school-roster-main,
.tutor-readiness-row .school-roster-main {
    min-width: 0;
}

.tutor-workflow-row .school-roster-copy,
.tutor-readiness-row .school-roster-copy {
    gap: 0.28rem;
}

.tutor-workflow-actions {
    justify-content: flex-start;
    flex-wrap: nowrap;
}

.tutor-workflow-actions .button {
    white-space: nowrap;
}

.tutor-readiness-stats {
    width: 100%;
    max-width: 470px;
}

.tutor-readiness-stats .school-roster-stat {
    min-width: 0;
    width: 100%;
}

.tutor-readiness-issue-card {
    gap: 0.35rem;
    padding: 0.95rem 1rem;
    border-radius: 18px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 250, 0.94));
}

.tutor-readiness-issue-card strong {
    font-size: 0.94rem;
    line-height: 1.55;
    font-weight: 700;
}

.tutor-course-hero {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    gap: var(--workspace-hero-gap);
    margin-bottom: 1.4rem;
    padding: var(--workspace-hero-padding);
    border-radius: var(--workspace-hero-radius);
    background: var(--workspace-course-hero);
    color: #fff;
    box-shadow: var(--workspace-hero-shadow);
}

.tutor-course-hero-copy {
    display: grid;
    gap: 0.65rem;
    max-width: 68ch;
}

.tutor-course-hero .eyebrow-inline,
.tutor-course-hero h2,
.tutor-course-hero p {
    color: #fff;
}

.tutor-course-hero p {
    color: rgba(255, 255, 255, 0.84);
    line-height: 1.75;
    margin: 0;
}

.tutor-course-hero-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
}

.tutor-course-hero-meta .pill {
    background: rgba(255, 255, 255, 0.14);
    color: #fff;
}

.tutor-course-cover {
    width: min(100%, 240px);
    margin: 0.2rem 0 0;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 14px;
    background: rgba(15, 23, 42, 0.18);
}

.tutor-course-cover img {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
}

.tutor-course-hero-actions {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    justify-content: center;
    min-width: 240px;
}

.tutor-course-pulse-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.course-detail-overview-card {
    min-height: 100%;
    padding: var(--workspace-card-padding);
    border-radius: var(--workspace-card-radius);
    border: 1px solid var(--workspace-card-border);
    background: rgba(255, 255, 255, 0.9);
    display: grid;
    align-content: start;
    gap: 0.5rem;
    box-shadow: var(--workspace-card-shadow);
}

.course-detail-overview-card.tone-teal {
    background: linear-gradient(145deg, rgba(232, 244, 244, 0.98), rgba(255, 255, 255, 0.95));
}

.course-detail-overview-card.tone-gold {
    background: linear-gradient(145deg, rgba(255, 248, 229, 0.98), rgba(255, 255, 255, 0.95));
}

.course-detail-overview-card.tone-ink {
    background: linear-gradient(145deg, rgba(243, 242, 239, 0.98), rgba(255, 255, 255, 0.95));
}

.course-detail-overview-card.tone-sage {
    background: linear-gradient(145deg, rgba(239, 249, 242, 0.98), rgba(255, 255, 255, 0.95));
}

.course-detail-overview-top {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-width: 0;
}

.course-detail-overview-icon {
    width: 2.55rem;
    height: 2.55rem;
    border-radius: 999px;
    display: inline-grid;
    place-items: center;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
    flex-shrink: 0;
}

.course-detail-overview-card.tone-gold .course-detail-overview-icon {
    background: rgba(198, 161, 74, 0.16);
    color: #9a7110;
}

.course-detail-overview-card.tone-ink .course-detail-overview-icon {
    background: rgba(18, 28, 49, 0.1);
    color: #17243f;
}

.course-detail-overview-card.tone-sage .course-detail-overview-icon {
    background: rgba(73, 125, 116, 0.12);
    color: #3f7067;
}

.course-detail-overview-card strong {
    font-family: "Playfair Display", serif;
    font-size: clamp(1.45rem, 2vw, 1.85rem);
    line-height: 1;
    color: var(--ink);
    overflow-wrap: anywhere;
}

.course-detail-overview-card p {
    margin: 0;
    color: var(--mid);
    line-height: 1.55;
    font-size: 0.92rem;
}

.tutor-course-detail-grid {
    align-items: stretch;
}

.ges-assessment-library-grid {
    align-items: stretch;
}

.ges-assessment-library-grid .tutor-course-overview-panel,
.ges-assessment-library-grid .tutor-course-quick-panel {
    align-self: stretch;
    height: 100%;
}

.tutor-course-lessons-row {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: minmax(0, 1fr) clamp(270px, 30vw, 340px);
    gap: 1.65rem;
    align-items: stretch;
}

.tutor-course-lesson-focus-row {
    grid-template-columns: minmax(0, 1fr) clamp(230px, 24vw, 300px);
    gap: 1.25rem;
}

.tutor-course-lessons-row > * {
    min-width: 0;
}

.tutor-course-lessons-row .content-panel {
    margin: 0;
}

.tutor-course-lessons-panel .button-row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, max-content));
    gap: 0.7rem;
    align-items: stretch;
    padding-top: 0.85rem;
    margin-top: 0.9rem;
    border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.tutor-course-lessons-panel .button-row .button {
    flex: 0 1 auto;
    min-width: 150px;
    justify-content: center;
}

.tutor-course-lessons-panel .button-row .button span {
    white-space: nowrap;
}

.course-detail-copy-disclosure,
.course-detail-workflow-disclosure {
    border: 1px solid rgba(19, 107, 116, 0.12);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.68);
}

.course-detail-copy-disclosure {
    padding: 0.95rem 1rem;
}

.course-detail-workflow-disclosure {
    padding: 0.85rem 1rem;
}

.course-detail-copy-disclosure summary,
.course-detail-workflow-disclosure summary {
    cursor: pointer;
    list-style: none;
    color: var(--brand);
    font-size: 0.74rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.course-detail-copy-disclosure summary::-webkit-details-marker,
.course-detail-workflow-disclosure summary::-webkit-details-marker {
    display: none;
}

.course-detail-copy-disclosure .content-copy-block {
    margin-top: 0.85rem;
    padding-top: 0.85rem;
    border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.course-detail-workflow-disclosure summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.course-detail-workflow-disclosure summary i {
    transition: transform 0.2s ease;
}

.course-detail-workflow-disclosure[open] summary i {
    transform: rotate(180deg);
}

.course-detail-workflow-actions {
    padding-top: 0.85rem;
    margin-top: 0.85rem;
    border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.course-detail-workflow-actions form {
    margin: 0;
}

.tutor-structure-tree-panel {
    align-self: stretch;
    position: static;
    display: flex;
    flex-direction: column;
}

.tutor-structure-tree-panel .admin-structure-tree {
    flex: 1 1 auto;
    max-height: none;
    overflow: auto;
    padding-right: 0.7rem;
}

.ges-library-filter-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.95rem;
}

.ges-library-filter-grid .button-row {
    grid-column: 1 / -1;
    margin-top: 0.2rem;
}

.ges-page-stack {
    display: grid;
    gap: 1.55rem;
}

.ges-page-stack > section {
    margin: 0;
}

.ges-balanced-grid {
    align-items: stretch;
}

.ges-balanced-grid > .content-panel {
    height: 100%;
}

.ges-balanced-grid .school-focus-panel,
.ges-balanced-grid .tutor-course-overview-panel,
.ges-balanced-grid .school-priorities-panel,
.ges-balanced-grid .tutor-priorities-panel,
.ges-balanced-grid .tutor-course-quick-panel,
.ges-balanced-grid .tutor-structure-tree-panel {
    display: flex;
    flex-direction: column;
    align-self: stretch;
    height: 100%;
}

.ges-balanced-grid .student-quick-grid,
.ges-balanced-grid .admin-structure-tree {
    align-content: start;
}

.ges-sticky-head-panel > .panel-head {
    position: sticky;
    top: 0.35rem;
    z-index: 4;
    margin-inline: -1.5rem;
    margin-top: -0.2rem;
    padding: 0.15rem 1.5rem 0.9rem;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.95) 72%, rgba(255, 255, 255, 0));
    backdrop-filter: blur(8px);
}

.ges-library-density .tutor-management-list,
.ges-library-density .course-detail-list,
.ges-library-density .school-classroom-list,
.ges-library-density .school-roster-list {
    gap: 0.95rem;
}

.ges-library-density .tutor-management-card {
    padding: 1.05rem;
    gap: 0.8rem;
}

.ges-library-density .course-detail-row {
    padding: 1rem 1.05rem;
}

.ges-library-density .school-roster-control-card {
    padding: 0.95rem 1.05rem;
}

.ges-library-density .school-roster-row {
    padding: 0.95rem 1.05rem;
}

.ges-library-density .school-roster-stat,
.ges-library-density .tutor-management-metric,
.ges-library-density .school-focus-mini-card,
.ges-library-density .tutor-focus-mini-card {
    min-height: 0;
}

.ges-library-density .tutor-management-status-row,
.ges-library-density .ges-action-links,
.ges-library-density .button-row {
    margin-top: 0.15rem;
}

.ges-subject-record {
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.065), transparent 36%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(249, 246, 240, 0.94));
}

.ges-library-density .tutor-management-list > .ges-subject-record:nth-child(even),
.ges-library-density .school-roster-list > .tutor-monitor-row:nth-child(even),
.ges-library-density .school-classroom-list > .ges-learner-lane-row:nth-child(even) {
    background:
        radial-gradient(circle at top right, rgba(201, 168, 76, 0.08), transparent 34%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(247, 250, 250, 0.94));
}

.ges-subject-record-title {
    display: grid;
    gap: 0.45rem;
    min-width: 0;
}

.ges-subject-path-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    align-items: center;
}

.ges-subject-path-chips span {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    width: fit-content;
    max-width: 100%;
    min-height: 1.85rem;
    padding: 0.35rem 0.55rem;
    border-radius: 999px;
    background: rgba(26, 107, 107, 0.09);
    color: var(--teal-dark);
    font-family: "Space Mono", monospace;
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    line-height: 1.25;
    text-transform: uppercase;
}

.ges-subject-path-chips i {
    font-size: 0.72rem;
}

.ges-learner-lane-row {
    border-color: rgba(26, 107, 107, 0.12);
}

.ges-learner-lane-row.needs-attention {
    border-color: rgba(201, 168, 76, 0.26);
}

.ges-learner-lane-row .school-classroom-copy {
    gap: 0.45rem;
}

.tutor-monitor-row {
    display: grid;
    grid-template-columns: minmax(240px, 1.1fr) minmax(360px, 1.2fr) auto;
    align-items: center;
}

.tutor-monitor-row .school-roster-copy {
    gap: 0.45rem;
}

.tutor-monitor-row .school-classroom-actions,
.ges-learner-lane-row .school-classroom-actions {
    flex-wrap: nowrap;
    justify-content: flex-end;
}

.tutor-monitor-row .button,
.ges-learner-lane-row .button {
    white-space: nowrap;
}

.ges-subject-focus-panel {
    display: grid;
    gap: 1rem;
}

.ges-subject-focus-toolbar {
    display: grid;
    gap: 0.85rem;
}

.ges-view-toggle {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 0.55rem;
}

.ges-view-toggle-link,
.ges-focus-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 0.72rem 1rem;
    border-radius: 999px;
    border: 1px solid rgba(17, 24, 39, 0.1);
    background: rgba(255, 255, 255, 0.9);
    color: var(--text-strong);
    font-weight: 600;
    text-decoration: none;
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.ges-view-toggle-link:hover,
.ges-view-toggle-link:focus-visible,
.ges-focus-chip:hover,
.ges-focus-chip:focus-visible {
    border-color: rgba(26, 107, 107, 0.28);
    color: var(--brand-deep);
    transform: translateY(-1px);
}

.ges-view-toggle-link.is-active,
.ges-focus-chip.is-active {
    border-color: rgba(26, 107, 107, 0.24);
    background: linear-gradient(180deg, rgba(231, 244, 242, 0.98), rgba(244, 249, 248, 0.96));
    color: var(--brand-deep);
    box-shadow: inset 0 0 0 1px rgba(26, 107, 107, 0.06);
}

.ges-focus-chip-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
}

.ges-tree-summary-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.85rem 1.2rem;
    color: var(--text-soft);
    font-size: 0.96rem;
}

.ges-tree-summary-row strong {
    color: var(--text-strong);
}

.ges-progress-strip {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 0.75rem;
}

.ges-progress-step {
    display: grid;
    gap: 0.28rem;
    padding: 0.82rem 0.9rem;
    border-radius: 16px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.88);
}

.ges-progress-step.is-ready {
    border-color: rgba(122, 173, 138, 0.26);
    background: linear-gradient(180deg, rgba(245, 251, 247, 0.96), rgba(255, 255, 255, 0.94));
}

.ges-progress-step.is-pending {
    border-color: rgba(201, 168, 76, 0.18);
    background: linear-gradient(180deg, rgba(252, 249, 241, 0.96), rgba(255, 255, 255, 0.94));
}

.ges-progress-step-label {
    font-size: 0.68rem;
    text-transform: uppercase;
    letter-spacing: 0.16em;
    color: var(--teal);
}

.ges-progress-step strong {
    font-size: 0.96rem;
    line-height: 1.45;
    color: var(--text-strong);
}

.ges-lesson-hero .tutor-course-hero-meta {
    row-gap: 0.65rem;
}

.tutor-course-overview-panel.ges-lesson-overview-panel {
    display: grid;
    gap: 1.15rem;
    height: auto;
    align-self: start;
    align-content: start;
    background:
        radial-gradient(circle at 92% 6%, rgba(201, 168, 76, 0.13), transparent 28%),
        linear-gradient(155deg, rgba(255, 255, 255, 0.99), rgba(244, 249, 248, 0.96));
}

.ges-lesson-overview-head {
    align-items: flex-end;
    padding-bottom: 1rem;
    border-bottom: 1px solid rgba(15, 23, 42, 0.08);
}

.ges-lesson-overview-head > div {
    display: grid;
    gap: 0.35rem;
}

.ges-lesson-overview-head .eyebrow-inline,
.ges-lesson-overview-head h3,
.ges-lesson-overview-head p {
    margin: 0;
}

.ges-lesson-overview-layout {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr));
    gap: 1rem;
    align-items: stretch;
}

.ges-lesson-brief-card,
.ges-lesson-path-card {
    min-width: 0;
    border-radius: 22px;
}

.ges-lesson-brief-card {
    display: grid;
    align-content: start;
    gap: 0.8rem;
    padding: 1.15rem;
    border: 1px solid rgba(26, 107, 107, 0.14);
    background: rgba(255, 255, 255, 0.84);
}

.ges-lesson-overview-section-label {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    color: var(--teal);
    font-family: "Space Mono", monospace;
    font-size: 0.64rem;
    font-weight: 700;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.ges-lesson-overview-section-label > span {
    width: 2rem;
    height: 2rem;
    display: inline-grid;
    place-items: center;
    border-radius: 999px;
    background: rgba(26, 107, 107, 0.1);
}

.ges-lesson-brief-card h4 {
    margin: 0;
    color: var(--ink);
    font-family: "Playfair Display", serif;
    font-size: clamp(1.18rem, 1.7vw, 1.55rem);
    line-height: 1.2;
}

.ges-lesson-brief-card > p {
    margin: 0;
    color: var(--mid);
    font-size: 0.92rem;
    line-height: 1.7;
}

.ges-lesson-notes-disclosure {
    border-top: 1px solid rgba(15, 23, 42, 0.08);
    padding-top: 0.8rem;
}

.ges-lesson-notes-disclosure summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    cursor: pointer;
    list-style: none;
    color: var(--brand);
    font-size: 0.82rem;
    font-weight: 800;
}

.ges-lesson-notes-disclosure summary::-webkit-details-marker {
    display: none;
}

.ges-lesson-notes-disclosure summary i {
    transition: transform 0.2s ease;
}

.ges-lesson-notes-disclosure[open] summary i {
    transform: rotate(180deg);
}

.ges-lesson-notes-disclosure .content-copy-block {
    max-height: 22rem;
    margin-top: 0.8rem;
    padding: 0.9rem;
    overflow: auto;
    border-radius: 14px;
    background: rgba(245, 240, 232, 0.72);
}

.ges-lesson-path-card {
    padding: 1.15rem;
    color: #fff;
    background:
        radial-gradient(circle at 88% 8%, rgba(201, 168, 76, 0.2), transparent 32%),
        linear-gradient(145deg, #102c2f, #0d2023);
    box-shadow: 0 18px 34px rgba(13, 32, 35, 0.15);
}

.ges-lesson-path-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
    padding-bottom: 0.9rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.ges-lesson-path-head > div {
    display: grid;
    gap: 0.2rem;
}

.ges-lesson-path-head > div > span,
.ges-lesson-readiness-head > div > span {
    font-family: "Space Mono", monospace;
    font-size: 0.6rem;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.ges-lesson-path-head > div > span {
    color: rgba(255, 255, 255, 0.62);
}

.ges-lesson-path-head > div > strong {
    color: #fff;
    font-size: 1rem;
}

.ges-lesson-path-head .status-pill {
    flex: 0 1 auto;
    text-align: center;
}

.ges-lesson-path-list {
    display: grid;
    gap: 0;
    margin: 0;
    padding: 0.8rem 0 0;
    list-style: none;
}

.ges-lesson-path-list li {
    position: relative;
    display: grid;
    grid-template-columns: 2rem minmax(0, 1fr);
    gap: 0.75rem;
    align-items: start;
    padding: 0.55rem 0;
}

.ges-lesson-path-list li::before {
    content: "";
    position: absolute;
    top: 2.25rem;
    bottom: -0.55rem;
    left: 0.97rem;
    width: 1px;
    background: rgba(255, 255, 255, 0.16);
}

.ges-lesson-path-list li:last-child::before {
    display: none;
}

.ges-lesson-path-list li > span {
    width: 2rem;
    height: 2rem;
    display: inline-grid;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
    color: var(--gold);
    font-family: "Space Mono", monospace;
    font-size: 0.58rem;
}

.ges-lesson-path-list li > div {
    display: grid;
    gap: 0.12rem;
    min-width: 0;
}

.ges-lesson-path-list small {
    color: rgba(255, 255, 255, 0.58);
    font-size: 0.68rem;
    text-transform: uppercase;
    letter-spacing: 0.09em;
}

.ges-lesson-path-list strong {
    color: #fff;
    font-size: 0.9rem;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.ges-lesson-readiness-block {
    display: grid;
    gap: 0.8rem;
    padding: 1rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 20px;
    background: rgba(245, 240, 232, 0.55);
}

.ges-lesson-readiness-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 0.75rem;
}

.ges-lesson-readiness-head > div {
    display: grid;
    gap: 0.2rem;
}

.ges-lesson-readiness-head > div > span {
    color: var(--teal);
}

.ges-lesson-readiness-head h4 {
    margin: 0;
    color: var(--ink);
    font-size: 1rem;
}

.ges-lesson-overview-panel .ges-progress-strip {
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
}

.ges-lesson-overview-panel .ges-progress-step {
    grid-template-columns: auto minmax(0, 1fr);
    align-content: start;
    column-gap: 0.55rem;
}

.ges-progress-step-state {
    grid-row: 1 / span 2;
    width: 1.75rem;
    height: 1.75rem;
    display: inline-grid;
    place-items: center;
    border-radius: 999px;
    background: rgba(201, 168, 76, 0.14);
    color: #9a7110;
    font-size: 0.68rem;
}

.ges-progress-step.is-ready .ges-progress-step-state {
    background: rgba(80, 145, 105, 0.14);
    color: #3d7753;
}

.ges-lesson-overview-panel .ges-progress-step strong {
    font-size: 0.86rem;
}

.ges-lesson-workflow-disclosure {
    background: rgba(255, 255, 255, 0.76);
}

.ges-lesson-priorities-panel {
    align-self: start;
    max-height: min(32rem, calc(100vh - 8rem));
    overflow: hidden;
}

.ges-lesson-priorities-panel .panel-head {
    flex: 0 0 auto;
}

.ges-lesson-priorities-panel .student-quick-grid {
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding-right: 0.4rem;
    scrollbar-color: rgba(26, 107, 107, 0.55) rgba(26, 107, 107, 0.08);
    scrollbar-gutter: stable;
    scrollbar-width: thin;
}

.ges-lesson-priorities-panel .student-quick-grid::-webkit-scrollbar {
    width: 0.5rem;
}

.ges-lesson-priorities-panel .student-quick-grid::-webkit-scrollbar-track {
    border-radius: 999px;
    background: rgba(26, 107, 107, 0.08);
}

.ges-lesson-priorities-panel .student-quick-grid::-webkit-scrollbar-thumb {
    border: 2px solid transparent;
    border-radius: 999px;
    background: rgba(26, 107, 107, 0.55);
    background-clip: padding-box;
}

.ges-lesson-priorities-panel .student-quick-grid::-webkit-scrollbar-thumb:hover {
    background: rgba(26, 107, 107, 0.72);
    background-clip: padding-box;
}

.ges-lesson-structure-tree-panel {
    align-self: start;
    max-height: min(32rem, calc(100vh - 8rem));
    overflow: hidden;
}

.ges-lesson-structure-tree-panel > .panel-head {
    flex: 0 0 auto;
}

.ges-lesson-structure-tree-panel .admin-structure-tree {
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior-x: contain;
    overscroll-behavior-y: auto;
    scrollbar-color: rgba(26, 107, 107, 0.55) rgba(26, 107, 107, 0.08);
    scrollbar-gutter: stable;
    scrollbar-width: thin;
}

.ges-lesson-structure-tree-panel .admin-structure-tree::-webkit-scrollbar {
    width: 0.5rem;
}

.ges-lesson-structure-tree-panel .admin-structure-tree::-webkit-scrollbar-track {
    border-radius: 999px;
    background: rgba(26, 107, 107, 0.08);
}

.ges-lesson-structure-tree-panel .admin-structure-tree::-webkit-scrollbar-thumb {
    border: 2px solid transparent;
    border-radius: 999px;
    background: rgba(26, 107, 107, 0.55);
    background-clip: padding-box;
}

.ges-lesson-structure-tree-panel .admin-structure-tree::-webkit-scrollbar-thumb:hover {
    background: rgba(26, 107, 107, 0.72);
    background-clip: padding-box;
}

.ges-lesson-structure-tree-panel .admin-structure-tree-item.is-current-path > .admin-structure-tree-branch > .admin-structure-tree-summary .admin-structure-tree-node {
    border-left-color: rgba(26, 107, 107, 0.56);
}

/* Keep dense dashboard controls usable without turning full pages into nested scrollers. */
.dashboard-quick-actions-panel {
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.dashboard-contained-scroll {
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior-x: contain;
    overscroll-behavior-y: auto;
    padding-right: 0.4rem;
    scrollbar-color: rgba(26, 107, 107, 0.58) rgba(26, 107, 107, 0.08);
    scrollbar-gutter: stable;
    scrollbar-width: thin;
}

.dashboard-priority-scroll {
    max-height: min(30rem, calc(100dvh - 12rem));
}

.dashboard-structure-scroll {
    max-height: min(38rem, calc(100dvh - 10rem));
}

.dashboard-secondary-scroll {
    max-height: min(34rem, calc(100dvh - 11rem));
}

.dashboard-action-description,
.admin-today-focus-copy small,
.admin-action-lane-grid .tutor-priority-copy p,
.admin-command-panel .admin-lane-card p,
.admin-queue-compact-grid .admin-queue-card p,
.student-timeline-copy p,
.student-activity-list li > span {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.dashboard-contained-scroll::-webkit-scrollbar {
    width: 0.5rem;
}

.dashboard-contained-scroll::-webkit-scrollbar-track {
    border-radius: 999px;
    background: rgba(26, 107, 107, 0.08);
}

.dashboard-contained-scroll::-webkit-scrollbar-thumb {
    border: 2px solid transparent;
    border-radius: 999px;
    background: rgba(26, 107, 107, 0.58);
    background-clip: padding-box;
}

.dashboard-contained-scroll::-webkit-scrollbar-thumb:hover {
    background: rgba(26, 107, 107, 0.78);
    background-clip: padding-box;
}

@media (max-width: 700px), (orientation: landscape) and (max-height: 600px) and (max-width: 1100px) {
    .ges-lesson-overview-head,
    .ges-lesson-readiness-head,
    .ges-lesson-path-head {
        align-items: stretch;
        flex-direction: column;
    }

    .ges-lesson-overview-head .button {
        width: 100%;
    }

    .ges-lesson-overview-panel .ges-progress-strip {
        grid-template-columns: 1fr;
    }

    .ges-lesson-priorities-panel {
        max-height: none;
        overflow: visible;
    }

    .ges-lesson-priorities-panel .student-quick-grid {
        overflow: visible;
        padding-right: 0;
        scrollbar-gutter: auto;
    }

    .ges-lesson-structure-tree-panel {
        max-height: none;
        overflow: visible;
    }

    .ges-lesson-structure-tree-panel .admin-structure-tree {
        max-height: none;
        overflow-y: visible;
        scrollbar-gutter: auto;
    }

    .dashboard-contained-scroll {
        max-height: none;
        overflow: visible;
        padding-right: 0;
        scrollbar-gutter: auto;
    }
}

.ges-workflow-guide-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.95rem;
}

.ges-workflow-guide-card {
    display: grid;
    gap: 0.55rem;
    padding: 1rem;
    border-radius: 18px;
    border: 1px solid rgba(17, 24, 39, 0.08);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(247, 243, 235, 0.92));
}

.ges-workflow-guide-card strong {
    font-size: 1rem;
}

.ges-workflow-guide-card p {
    margin: 0;
    color: var(--text-soft);
    line-height: 1.6;
}

.ges-workflow-guide-card.tone-success {
    border-color: rgba(20, 110, 60, 0.16);
}

.ges-workflow-guide-card.tone-info {
    border-color: rgba(26, 107, 107, 0.16);
}

.ges-workflow-guide-card.tone-warning {
    border-color: rgba(201, 168, 76, 0.22);
}

.ges-workflow-guide-card.tone-error {
    border-color: rgba(185, 67, 47, 0.18);
}

.ges-readiness-chip-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.admin-ges-review-list {
    display: grid;
    gap: 1rem;
}

.admin-ges-review-card {
    display: grid;
    gap: 1rem;
    padding: 1rem 1.05rem;
    border-radius: 22px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-left: 5px solid rgba(26, 107, 107, 0.52);
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.06), transparent 38%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(247, 251, 253, 0.93));
    box-shadow: 0 16px 34px rgba(15, 23, 42, 0.055);
}

.admin-ges-review-card:nth-child(even) {
    background:
        radial-gradient(circle at top right, rgba(224, 180, 83, 0.08), transparent 36%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(251, 248, 241, 0.94));
}

.admin-ges-review-card.needs-attention,
.admin-ges-review-card.tone-warning {
    border-left-color: rgba(201, 168, 76, 0.76);
}

.admin-ges-review-card.tone-error {
    border-left-color: rgba(185, 67, 47, 0.68);
}

.admin-ges-review-card.tone-success {
    border-left-color: rgba(20, 110, 60, 0.68);
}

.admin-ges-review-main {
    display: flex;
    gap: 0.9rem;
    align-items: flex-start;
    min-width: 0;
}

.admin-ges-review-icon {
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 17px;
    display: inline-grid;
    place-items: center;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
    flex-shrink: 0;
}

.admin-ges-review-copy {
    display: grid;
    gap: 0.35rem;
    min-width: 0;
    width: 100%;
}

.admin-ges-review-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.admin-ges-review-heading h3,
.admin-ges-review-copy p,
.admin-ges-review-status p {
    margin: 0;
}

.admin-ges-review-copy > p,
.admin-ges-review-status p {
    color: var(--mid);
    line-height: 1.6;
}

.admin-ges-review-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
}

.admin-ges-review-meta span {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.36rem 0.55rem;
    border-radius: 999px;
    background: rgba(26, 107, 107, 0.08);
    color: var(--teal);
    font-size: 0.82rem;
    font-weight: 700;
}

.admin-ges-review-checks {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 0.65rem;
}

.admin-ges-review-check {
    display: grid;
    gap: 0.25rem;
    min-height: 5rem;
    padding: 0.75rem;
    border-radius: 16px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.82);
}

.admin-ges-review-check.is-ready {
    border-color: rgba(26, 107, 107, 0.18);
    background: rgba(236, 245, 244, 0.78);
}

.admin-ges-review-check.is-pending {
    border-color: rgba(201, 168, 76, 0.24);
    background: rgba(252, 249, 241, 0.82);
}

.admin-ges-check-icon {
    color: var(--teal);
}

.admin-ges-review-check span:not(.admin-ges-check-icon) {
    font-family: var(--mono);
    font-size: 0.62rem;
    letter-spacing: 0.11em;
    text-transform: uppercase;
    color: var(--muted);
}

.admin-ges-review-check strong {
    font-size: 0.96rem;
    color: var(--ink);
}

.admin-ges-review-status {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.9rem 1rem;
    border-radius: 18px;
    border: 1px solid rgba(26, 107, 107, 0.13);
    background: rgba(236, 245, 244, 0.72);
}

.admin-ges-review-status.tone-warning {
    border-color: rgba(201, 168, 76, 0.24);
    background: rgba(252, 249, 241, 0.86);
}

.admin-ges-review-status.tone-error {
    border-color: rgba(185, 67, 47, 0.2);
    background: rgba(252, 242, 239, 0.88);
}

.admin-ges-review-status.tone-success {
    border-color: rgba(20, 110, 60, 0.18);
    background: rgba(242, 250, 245, 0.88);
}

.admin-ges-review-actions,
.admin-ges-decision-form {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.65rem;
}

.admin-ges-review-actions {
    justify-content: flex-start;
    padding-top: 0.15rem;
}

.ges-readiness-support-card {
    display: grid;
    gap: 0.4rem;
    padding: 0.95rem 1rem;
    border-radius: 18px;
    border: 1px solid rgba(26, 107, 107, 0.14);
    background: linear-gradient(180deg, rgba(236, 245, 244, 0.96), rgba(255, 255, 255, 0.94));
}

.ges-readiness-support-card strong {
    font-size: 1rem;
}

.ges-readiness-support-card p {
    margin: 0;
    color: var(--text-soft);
    line-height: 1.65;
}

.ges-readiness-check-item {
    align-items: start;
}

.ges-readiness-check-item strong,
.ges-readiness-check-item span {
    display: block;
}

.ges-readiness-check-item span {
    line-height: 1.55;
}

.ges-readiness-check-item.is-ready {
    border-left: 3px solid rgba(20, 110, 60, 0.55);
    padding-left: 0.85rem;
}

.ges-readiness-check-item.is-pending {
    border-left: 3px solid rgba(201, 168, 76, 0.6);
    padding-left: 0.85rem;
}

.tutor-course-quick-panel {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.tutor-course-overview-panel {
    display: grid;
    gap: 1rem;
    height: 100%;
}

.ges-assessment-overview-panel {
    gap: 1rem;
}

.tutor-course-overview-panel .panel-head {
    align-items: start;
}

.tutor-course-overview-panel .panel-head > div {
    display: grid;
    gap: 0.35rem;
}

.tutor-course-lessons-panel {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.tutor-course-lessons-panel .course-detail-list {
    flex: 1 1 auto;
}

.tutor-course-quick-panel .student-quick-grid {
    flex: 1 1 auto;
}

.ges-assessment-priorities-panel .student-quick-grid {
    gap: 0.75rem;
}

.ges-assessment-priorities-panel .student-quick-card {
    padding: 0.9rem 0.95rem;
}

.module-empty-state .button-primary,
.module-empty-state .button-primary span,
.module-empty-state .button-primary i {
    color: #fff;
}

.course-detail-health-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem;
}

.ges-assessment-overview-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem;
}

.course-detail-health-card {
    display: grid;
    gap: 0.28rem;
    padding: 0.95rem 1rem;
    border-radius: 14px;
    border: 1px solid var(--border);
    background: linear-gradient(180deg, rgba(248, 245, 239, 0.92), rgba(255, 255, 255, 0.96));
}

.course-detail-health-card span {
    font-size: 0.72rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--mid);
}

.course-detail-health-card strong {
    color: var(--ink);
    font-size: 1rem;
    line-height: 1.35;
}

.course-detail-health-card p {
    margin: 0;
    color: var(--mid);
    font-size: 0.82rem;
    line-height: 1.55;
}

.panel-subtext {
    margin: 0;
    color: var(--text-soft);
    font-size: 0.95rem;
}

.tutor-course-workflow-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem;
}

.tutor-course-paths {
    margin-top: 0.35rem;
}

.course-detail-list {
    display: grid;
    gap: 0.95rem;
}

.course-detail-row {
    position: relative;
    overflow: hidden;
    display: grid;
    gap: 0.85rem;
    padding: 1rem 1.05rem 1.05rem 1.2rem;
    border-radius: 18px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.95), rgba(248, 245, 239, 0.93));
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.05);
    transition: transform 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease;
}

.course-detail-row::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: linear-gradient(180deg, rgba(26, 107, 107, 0.82), rgba(201, 168, 76, 0.66));
}

.course-detail-row:hover,
.course-detail-row:focus-within {
    transform: translateY(-1px);
    border-color: rgba(26, 107, 107, 0.18);
    box-shadow: 0 16px 34px rgba(15, 23, 42, 0.075);
}

.course-detail-row-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.course-detail-row-copy {
    display: grid;
    gap: 0.2rem;
}

.course-detail-row-copy h3 {
    margin: 0;
    color: var(--ink);
    font-size: clamp(1rem, 1.2vw, 1.18rem);
}

.course-detail-row-copy p {
    margin: 0;
    color: var(--mid);
}

.course-detail-row-status {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.5rem;
}

.course-detail-row-meta {
    margin-top: -0.15rem;
}

.course-module-page-grid {
    grid-template-columns: minmax(0, 1.4fr) minmax(320px, 0.88fr);
    align-items: start;
}

.course-module-builder-panel {
    display: grid;
    gap: 1rem;
    position: sticky;
    top: 1.25rem;
}

.module-library-list {
    display: grid;
    gap: 1rem;
    margin-top: 1rem;
}

.module-library-list-compact {
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

.module-library-card {
    display: grid;
    gap: 0.95rem;
    padding: 1.1rem 1.15rem;
    border: 1px solid rgba(19, 107, 116, 0.12);
    border-radius: 20px;
    background:
        radial-gradient(circle at top right, rgba(201, 168, 76, 0.08), transparent 34%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(245, 240, 232, 0.82));
}

.module-library-card-compact {
    gap: 0.8rem;
    padding: 1rem 1.05rem;
}

.course-detail-module-strip-panel .module-library-list-compact {
    grid-template-columns: 1fr;
    gap: 0.75rem;
}

.course-detail-module-strip-panel .module-library-card-compact {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    min-height: 0;
    gap: 0.8rem 1rem;
    padding: 0.95rem 1rem;
}

.course-detail-module-strip-panel .module-library-head {
    min-width: 0;
}

.course-detail-module-strip-panel .module-library-stats {
    justify-content: flex-end;
    gap: 0.5rem;
}

.course-detail-module-strip-panel .module-library-stats span {
    white-space: nowrap;
}

.module-library-head {
    display: flex;
    justify-content: space-between;
    align-items: start;
    gap: 1rem;
}

.module-library-title {
    display: grid;
    gap: 0.28rem;
}

.module-library-title strong {
    font-size: 1rem;
    color: var(--ink);
}

.module-library-title span {
    color: var(--mid);
    line-height: 1.55;
    font-size: 0.84rem;
}

.module-library-badges {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.5rem;
}

.module-library-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem 1rem;
}

.module-library-stats span {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.45rem 0.7rem;
    border-radius: 999px;
    background: rgba(19, 107, 116, 0.08);
    color: var(--mid);
    font-size: 0.82rem;
}

.module-library-stats strong {
    color: var(--ink);
}

.module-library-copy {
    margin: 0;
    color: var(--mid);
    line-height: 1.7;
}

.module-library-lesson-stack {
    display: grid;
    gap: 0.7rem;
    padding: 0.95rem 1rem;
    border-radius: 18px;
    border: 1px solid rgba(17, 24, 39, 0.08);
    background: rgba(255, 255, 255, 0.84);
}

.module-library-lesson-stack-head {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
    align-items: center;
}

.module-library-lesson-stack-head strong {
    color: var(--ink);
}

.module-library-lesson-stack-head span {
    color: var(--mid);
    font-size: 0.82rem;
}

.module-library-lesson-list {
    display: grid;
    gap: 0.55rem;
}

.module-library-lesson-item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.55rem;
    align-items: center;
}

.module-library-lesson-link {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.7rem;
    align-items: center;
    padding: 0.72rem 0.8rem;
    border-radius: 14px;
    border: 1px solid rgba(17, 24, 39, 0.06);
    background: rgba(248, 250, 249, 0.95);
    text-decoration: none;
    transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

.module-library-lesson-link:hover,
.module-library-lesson-link:focus-visible {
    transform: translateY(-1px);
    border-color: rgba(26, 107, 107, 0.18);
    box-shadow: 0 10px 22px rgba(17, 24, 39, 0.06);
}

.module-library-lesson-remove-form {
    margin: 0;
}

.module-library-lesson-remove-button {
    width: 2.5rem;
    height: 2.5rem;
    display: inline-grid;
    place-items: center;
    border-radius: 12px;
    border: 1px solid rgba(155, 48, 39, 0.12);
    background: rgba(255, 247, 245, 0.9);
    color: #9b3027;
    transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

.module-library-lesson-remove-button:hover,
.module-library-lesson-remove-button:focus-visible {
    transform: translateY(-1px);
    border-color: rgba(155, 48, 39, 0.24);
    background: rgba(255, 241, 238, 0.98);
    box-shadow: 0 10px 20px rgba(155, 48, 39, 0.1);
}

.module-library-lesson-order {
    display: inline-grid;
    place-items: center;
    min-width: 2.1rem;
    height: 2.1rem;
    padding: 0 0.4rem;
    border-radius: 999px;
    background: rgba(26, 107, 107, 0.12);
    color: var(--teal);
    font-size: 0.72rem;
    font-weight: 700;
}

.module-library-lesson-copy {
    display: grid;
    gap: 0.14rem;
    min-width: 0;
}

.module-library-lesson-copy strong {
    color: var(--ink);
    font-size: 0.92rem;
}

.module-library-lesson-copy small,
.module-library-lesson-empty {
    color: var(--mid);
    line-height: 1.5;
}

.module-library-lesson-empty {
    margin: 0;
}

.module-library-assignment-form {
    display: grid;
    gap: 0.45rem;
}

.module-library-assignment-form label {
    font-size: 0.74rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--mid);
    font-weight: 700;
}

.module-library-assignment-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.7rem;
    align-items: center;
}

.module-library-assignment-row select {
    min-height: 3rem;
    border-radius: 14px;
}

@media (max-width: 720px) {
    .module-library-assignment-row {
        grid-template-columns: 1fr;
    }
}

.module-library-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.module-library-workflow {
    display: flex;
    flex-wrap: wrap;
    gap: 0.85rem;
    padding-top: 0.25rem;
    border-top: 1px solid rgba(19, 107, 116, 0.1);
}

.module-library-workflow form {
    display: inline;
}

.module-empty-state {
    display: grid;
    gap: 0.7rem;
    justify-items: start;
    padding: 1.25rem;
    border: 1px dashed rgba(19, 107, 116, 0.24);
    border-radius: 20px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(247, 251, 253, 0.88));
}

.module-empty-state i {
    width: 2.75rem;
    height: 2.75rem;
    display: grid;
    place-items: center;
    border-radius: 999px;
    background: rgba(19, 107, 116, 0.1);
    color: var(--brand);
}

.module-empty-state strong {
    color: var(--ink);
    font-size: 1rem;
}

.module-empty-state span {
    color: var(--mid);
    line-height: 1.7;
}

.course-detail-assessment-row {
    grid-template-columns: minmax(0, 1fr) auto auto auto;
    align-items: center;
    column-gap: 1rem;
    row-gap: 0.75rem;
}

.course-detail-assessment-panel .course-detail-list {
    gap: 0.75rem;
}

.course-detail-assessment-panel .course-detail-row {
    padding: 0.95rem 1rem;
}

.ges-assessment-library-list {
    gap: 0.9rem;
}

.ges-assessment-library-row {
    padding-top: 1rem;
    padding-bottom: 1rem;
}

.ges-assessment-library-heading {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    justify-content: space-between;
}

.ges-assessment-library-heading h3 {
    margin: 0;
}

.course-detail-assessment-row .course-detail-row-copy {
    min-width: 0;
}

.course-detail-assessment-row .course-detail-row-copy p {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.course-detail-assessment-row .course-detail-row-status {
    justify-content: flex-start;
}

.course-detail-assessment-meta {
    margin-top: 0;
    white-space: nowrap;
    justify-content: flex-start;
}

.course-detail-assessment-actions {
    justify-content: flex-end;
    flex-wrap: nowrap;
    gap: 0.7rem;
}

.course-detail-assessment-actions .button {
    flex: 0 0 auto;
}

.ges-lesson-assessment-row {
    grid-template-columns: minmax(18rem, 1fr) auto;
    grid-template-areas:
        "assessment-copy assessment-actions"
        "assessment-details assessment-actions";
    column-gap: 1.5rem;
    row-gap: 1rem;
    padding: 1.2rem 1.25rem 1.25rem 1.4rem;
}

.ges-lesson-assessment-row .course-detail-row-copy {
    grid-area: assessment-copy;
    max-width: 54rem;
    gap: 0.35rem;
}

.ges-lesson-assessment-row .course-detail-row-copy h3 {
    line-height: 1.28;
    text-wrap: balance;
}

.ges-lesson-assessment-row .course-detail-row-copy p {
    white-space: normal;
    overflow: visible;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.ges-lesson-assessment-details {
    grid-area: assessment-details;
    min-width: 0;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.75rem 1rem;
}

.ges-lesson-assessment-row .course-detail-row-status,
.ges-lesson-assessment-row .course-detail-assessment-meta {
    min-width: 0;
    white-space: normal;
}

.ges-lesson-assessment-row .course-detail-assessment-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem 0.85rem;
}

.ges-lesson-assessment-row .course-detail-assessment-meta span {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.ges-lesson-assessment-row .course-detail-assessment-meta i {
    color: var(--brand);
    font-size: 0.78rem;
}

.ges-lesson-assessment-row .course-detail-assessment-actions {
    grid-area: assessment-actions;
    align-self: center;
}

.ges-assessment-shell-panel {
    display: grid;
    gap: 1rem;
}

.ges-assessment-shell-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
}

.tutor-course-assessment-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.tutor-course-assessment-grid .button-primary,
.tutor-course-assessment-grid .button-primary span,
.tutor-course-assessment-grid .button-primary i {
    color: #fff;
}

.school-hero-band {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    gap: var(--workspace-hero-gap);
    margin-bottom: 1.4rem;
    padding: var(--workspace-hero-padding);
    border-radius: var(--workspace-hero-radius);
    background: var(--workspace-school-hero);
    color: #fff;
    box-shadow: var(--workspace-hero-shadow);
}

.school-hero-copy {
    display: grid;
    gap: 0.6rem;
    max-width: 64ch;
}

.school-hero-band .eyebrow-inline,
.school-hero-band h2,
.school-hero-band p {
    color: #fff;
}

.school-hero-band p {
    color: rgba(255, 255, 255, 0.82);
    line-height: 1.75;
    margin: 0;
}

.school-hero-inline-actions {
    margin-top: 0.35rem;
    justify-content: flex-start;
    flex-wrap: wrap;
}

.school-hero-inline-actions .button {
    white-space: nowrap;
}

.school-hero-actions {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    justify-content: center;
    min-width: 220px;
}

.student-hero-copy,
.tutor-hero-copy,
.school-hero-copy,
.tutor-course-hero-copy {
    min-width: 0;
}

.student-hero-band h2,
.tutor-hero-band h2,
.school-hero-band h2,
.tutor-course-hero h2 {
    line-height: 1.08;
}

.student-hero-band p,
.tutor-hero-band p,
.school-hero-band p,
.tutor-course-hero p {
    max-width: 68ch;
}

.student-hero-actions,
.tutor-hero-actions,
.school-hero-actions,
.tutor-course-hero-actions {
    align-self: stretch;
}

.student-hero-actions .button,
.tutor-hero-actions .button,
.school-hero-actions .button,
.tutor-course-hero-actions .button {
    min-height: 46px;
    border-radius: 6px;
    white-space: normal;
}

.student-hero-actions .button span,
.tutor-hero-actions .button span,
.school-hero-actions .button span,
.tutor-course-hero-actions .button span {
    overflow-wrap: anywhere;
}

.school-hero-summary-card {
    display: grid;
    gap: 0.55rem;
    width: 100%;
    padding: 1.1rem 1.15rem;
    border-radius: 18px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.82);
}

.school-hero-summary-card span {
    font-family: "Space Mono", monospace;
    font-size: 0.62rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--teal);
}

.school-hero-summary-card strong {
    font-size: 1rem;
    line-height: 1.5;
}

.school-hero-summary-card p {
    color: var(--mid);
    line-height: 1.65;
}

.school-pulse-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.school-overview-grid {
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    margin-bottom: 1.6rem;
}

.school-stat-grid {
    margin-bottom: 1.5rem;
}

.school-dashboard-grid {
    grid-template-columns: minmax(0, 1.45fr) minmax(300px, 0.85fr);
    align-items: start;
    gap: 1.5rem;
}

.school-overview-hub,
.school-priorities-panel {
    align-self: stretch;
}

.school-focus-panel {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(243, 246, 252, 0.94));
}

.school-focus-shell {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1.25rem;
    height: 100%;
}

.school-focus-primary {
    display: grid;
    gap: 0.9rem;
    align-content: start;
}

.school-focus-primary h3 {
    margin: 0;
}

.school-focus-primary p {
    color: var(--mid);
    line-height: 1.7;
}

.school-overview-actions {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(180px, 100%), 1fr));
    width: 100%;
    align-items: stretch;
}

.school-overview-actions .button {
    width: 100%;
    min-width: 0;
    white-space: normal;
    text-align: center;
    line-height: 1.35;
}

.school-focus-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem;
}

.school-focus-mini-card,
.school-focus-summary,
.school-package-card,
.school-support-card {
    padding: 1rem;
    border: 1px solid var(--workspace-card-border);
    border-radius: var(--workspace-card-radius);
    background: rgba(255, 255, 255, 0.88);
    display: grid;
    gap: 0.35rem;
    box-shadow: var(--workspace-card-shadow);
}

.school-focus-mini-card span,
.school-focus-summary span,
.school-support-card span {
    font-family: "Space Mono", monospace;
    font-size: 0.62rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--teal);
}

.school-focus-mini-card strong,
.school-focus-summary strong,
.school-support-card strong {
    font-size: 0.96rem;
    line-height: 1.5;
}

.school-focus-summary p,
.school-package-card p {
    color: var(--mid);
    line-height: 1.65;
    margin: 0;
}

.school-focus-side {
    display: grid;
    gap: 0.85rem;
    align-content: start;
}

.school-subscription-command-panel .school-focus-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.school-subscription-command-panel .school-focus-primary p:not(.eyebrow-inline) {
    max-width: 760px;
}

.school-subject-access-disclosure {
    grid-column: 1 / -1;
    display: grid;
    gap: 0.9rem;
}

.school-subject-access-disclosure > summary,
.school-package-request-details > summary {
    list-style: none;
    cursor: pointer;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background:
        linear-gradient(135deg, rgba(232, 244, 244, 0.68), rgba(255, 255, 255, 0.94)),
        #fff;
    color: var(--ink);
    transition: border-color 0.22s ease, box-shadow 0.22s ease, transform 0.22s ease;
}

.school-subject-access-disclosure > summary::-webkit-details-marker,
.school-package-request-details > summary::-webkit-details-marker {
    display: none;
}

.school-subject-access-disclosure > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.15rem;
    border-radius: var(--workspace-card-radius);
    box-shadow: var(--workspace-card-shadow);
}

.school-subject-access-disclosure > summary span,
.school-package-request-details > summary span {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    font-weight: 800;
}

.school-subject-access-disclosure > summary small {
    margin-left: auto;
    padding: 0.35rem 0.65rem;
    border-radius: 999px;
    background: rgba(26, 107, 107, 0.1);
    font-family: "Space Mono", monospace;
    font-size: 0.62rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--teal);
}

.school-subject-access-disclosure > summary:hover,
.school-subject-access-disclosure > summary:focus-visible,
.school-package-request-details > summary:hover,
.school-package-request-details > summary:focus-visible {
    transform: translateY(-1px);
    border-color: rgba(26, 107, 107, 0.2);
    box-shadow: 0 16px 34px rgba(15, 23, 42, 0.075);
}

.school-subject-access-disclosure > summary i:last-child,
.school-package-request-details > summary i {
    transition: transform 0.22s ease;
}

.school-subject-access-disclosure[open] > summary i:last-child,
.school-package-request-details[open] > summary i {
    transform: rotate(180deg);
}

.school-subject-access-disclosure > .content-panel {
    margin: 0;
}

@media (max-width: 1180px) {
    .school-overview-actions {
        grid-template-columns: repeat(auto-fit, minmax(min(170px, 100%), 1fr));
    }
}

.school-signal-panel {
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.06), transparent 36%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(246, 242, 234, 0.94));
}

.school-roster-list,
.school-report-list,
.school-course-uptake-list,
.school-package-request-list {
    display: grid;
    gap: 0.95rem;
}

.school-bulk-action-form {
    margin-bottom: 1rem;
}

.school-bulk-action-bar {
    display: grid;
    gap: 1rem;
    padding: 1rem 1.05rem;
    border-radius: 18px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: linear-gradient(180deg, rgba(241, 248, 247, 0.98), rgba(255, 255, 255, 0.94));
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.05);
}

.school-bulk-action-copy {
    display: grid;
    gap: 0.25rem;
}

.school-bulk-action-copy strong {
    color: var(--ink);
}

.school-bulk-action-copy span {
    color: var(--mid);
    line-height: 1.6;
}

.school-bulk-action-fields {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
    gap: 0.85rem;
    align-items: end;
}

.school-bulk-field {
    display: grid;
    gap: 0.35rem;
}

.school-bulk-field label {
    font-weight: 700;
    color: var(--ink);
}

.school-bulk-field input,
.school-bulk-field select {
    width: 100%;
    padding: 0.8rem 0.9rem;
    border-radius: 12px;
    border: 1px solid rgba(15, 23, 42, 0.1);
    background: rgba(255, 255, 255, 0.96);
    color: var(--ink);
    font: inherit;
}

.school-roster-row,
.school-package-request-row {
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.05rem 1rem 1.25rem;
    border-radius: 18px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.9);
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.05);
    transition: transform 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease;
}

.school-roster-row::before,
.school-package-request-row::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: linear-gradient(180deg, rgba(26, 107, 107, 0.82), rgba(201, 168, 76, 0.66));
}

.school-roster-row:hover,
.school-roster-row:focus-within,
.school-package-request-row:hover,
.school-package-request-row:focus-within {
    transform: translateY(-1px);
    border-color: rgba(26, 107, 107, 0.18);
    box-shadow: 0 16px 34px rgba(15, 23, 42, 0.075);
}

.school-roster-row.needs-support,
.school-roster-row.low-activity {
    border-color: rgba(201, 168, 76, 0.24);
}

.school-roster-main,
.school-package-request-main {
    display: flex;
    align-items: center;
    gap: 0.95rem;
    min-width: 0;
}

.school-roster-selection {
    display: flex;
    align-items: center;
    justify-content: center;
}

.school-roster-selection-label {
    gap: 0.55rem;
    justify-content: flex-start;
    color: var(--mid);
    font-size: 0.88rem;
    cursor: pointer;
}

.school-roster-selection-label span {
    color: var(--mid);
}

.school-roster-selection input[type="checkbox"] {
    width: 1rem;
    height: 1rem;
    accent-color: var(--teal);
}

.school-roster-avatar,
.school-package-request-icon,
.school-report-icon {
    width: 2.7rem;
    height: 2.7rem;
    border-radius: 16px;
    display: inline-grid;
    place-items: center;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
    flex-shrink: 0;
    font-weight: 700;
}

.school-roster-copy,
.school-package-request-copy {
    display: grid;
    gap: 0.2rem;
    min-width: 0;
}

.school-roster-copy strong,
.school-package-request-copy strong,
.school-course-uptake-row strong {
    margin: 0;
    color: var(--ink);
}

.school-roster-copy span,
.school-package-request-copy span,
.school-course-uptake-row span,
.school-report-item p {
    margin: 0;
    color: var(--mid);
    line-height: 1.6;
}

.school-roster-stats,
.school-package-request-meta {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
}

.school-package-request-meta {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.school-package-structured-row {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(360px, 0.9fr);
    align-items: start;
}

.school-package-structured-row .school-package-request-meta {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.school-package-structured-row.status-approved {
    border-color: rgba(26, 107, 107, 0.24);
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.08), transparent 34%),
        rgba(255, 255, 255, 0.94);
}

.school-package-structured-row.status-changes_requested,
.school-package-structured-row.status-under_review,
.school-package-structured-row.status-submitted {
    border-color: rgba(201, 168, 76, 0.24);
    background:
        radial-gradient(circle at top right, rgba(201, 168, 76, 0.1), transparent 34%),
        rgba(255, 255, 255, 0.94);
}

.school-package-structured-row.status-rejected,
.school-package-structured-row.status-expired {
    border-color: rgba(148, 58, 45, 0.22);
}

.school-package-subscription-subjects {
    grid-column: 1 / -1;
    display: grid;
    gap: 0.75rem;
    padding-top: 0.75rem;
    border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.school-package-subscription-subject {
    display: grid;
    grid-template-columns: minmax(180px, 0.85fr) minmax(220px, 1fr);
    gap: 0.75rem;
    align-items: start;
    padding: 0.85rem;
    border-radius: 16px;
    border: 1px solid rgba(26, 107, 107, 0.12);
    background:
        linear-gradient(135deg, rgba(232, 244, 244, 0.62), rgba(255, 255, 255, 0.88)),
        #fff;
}

.school-package-subscription-subject span,
.school-package-allocation-chips span {
    font-family: "Space Mono", monospace;
    font-size: 0.62rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.school-package-subscription-subject span {
    color: var(--teal);
}

.school-package-subscription-subject strong {
    display: block;
    margin-top: 0.2rem;
    color: var(--ink);
}

.school-package-subscription-subject-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    justify-content: flex-end;
}

.school-package-subscription-subject-stats span,
.school-package-allocation-chips span {
    display: inline-flex;
    align-items: center;
    min-height: 2rem;
    padding: 0.35rem 0.6rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.86);
    border: 1px solid rgba(15, 23, 42, 0.07);
}

.school-package-allocation-chips {
    grid-column: 1 / -1;
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.school-package-allocation-chips span {
    color: var(--mid);
}

.school-package-request-details {
    grid-column: 1 / -1;
    display: grid;
    gap: 0.8rem;
    padding-top: 0.75rem;
    border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.school-package-request-details > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.85rem;
    padding: 0.78rem 0.9rem;
    border-radius: 16px;
    box-shadow: none;
}

.school-request-history-actions {
    justify-content: flex-end;
    margin-bottom: 0.9rem;
}

.school-package-audit-note {
    grid-column: 1 / -1;
    display: grid;
    gap: 0.35rem;
    padding: 0.85rem 0.95rem;
    border-radius: 16px;
    border: 1px solid rgba(26, 107, 107, 0.14);
    background:
        linear-gradient(135deg, rgba(232, 244, 244, 0.68), rgba(255, 255, 255, 0.9)),
        #fff;
}

.school-package-audit-note span {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-family: "Space Mono", monospace;
    font-size: 0.65rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--teal);
}

.school-package-audit-note p {
    margin: 0;
    color: var(--mid);
    line-height: 1.55;
}

.school-package-external-payment-notice {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.9rem;
    align-items: start;
    padding: 1rem;
    border: 1px solid rgba(201, 168, 76, 0.3);
    border-radius: 18px;
    background:
        radial-gradient(circle at top right, rgba(201, 168, 76, 0.14), transparent 42%),
        linear-gradient(135deg, rgba(255, 252, 242, 0.96), rgba(255, 255, 255, 0.96));
}

.school-package-external-payment-notice h4,
.school-package-external-payment-notice p {
    margin: 0;
}

.school-package-external-payment-notice h4 {
    margin-top: 0.2rem;
}

.school-package-external-payment-notice p:not(.eyebrow-inline) {
    margin-top: 0.45rem;
    color: var(--mid);
    line-height: 1.55;
}

.admin-school-package-list .admin-operational-row {
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.06), transparent 34%),
        rgba(255, 255, 255, 0.92);
}

.admin-school-package-list .admin-operational-row.status-approved {
    border-color: rgba(26, 107, 107, 0.28);
}

.admin-school-package-list .admin-operational-row.status-awaiting_external_payment {
    border-color: rgba(201, 168, 76, 0.36);
}

.admin-school-package-list .admin-operational-row.status-rejected,
.admin-school-package-list .admin-operational-row.status-cancelled {
    border-color: rgba(132, 48, 48, 0.22);
}

.admin-school-package-detail-grid {
    grid-template-columns: minmax(340px, 0.65fr) minmax(0, 1.35fr);
    align-items: start;
}

.admin-package-page {
    display: grid;
    gap: 1rem;
    min-width: 0;
}

.admin-package-case-header {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 1.25rem;
    align-items: end;
    padding: clamp(1.25rem, 2.4vw, 2rem);
    overflow: hidden;
    border: 1px solid rgba(26, 107, 107, 0.16);
    border-radius: 28px;
    background:
        radial-gradient(circle at 92% 8%, rgba(201, 168, 76, 0.2), transparent 28%),
        linear-gradient(135deg, rgba(232, 244, 244, 0.88), rgba(255, 255, 255, 0.96) 54%, rgba(255, 248, 232, 0.88));
    box-shadow: var(--workspace-card-shadow);
}

.admin-package-case-header::after {
    content: "";
    position: absolute;
    top: -70px;
    right: -55px;
    width: 190px;
    height: 190px;
    border: 1px solid rgba(26, 107, 107, 0.12);
    border-radius: 50%;
    pointer-events: none;
}

.admin-package-case-copy,
.admin-package-case-heading,
.admin-package-command-heading {
    min-width: 0;
}

.admin-package-back-link {
    display: inline-flex;
    gap: 0.45rem;
    align-items: center;
    margin-bottom: 1.15rem;
    color: var(--teal);
    font-size: 0.8rem;
    font-weight: 800;
    text-decoration: none;
}

.admin-package-case-heading {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    justify-content: space-between;
}

.admin-package-case-heading h2 {
    max-width: 760px;
    margin: 0.25rem 0 0;
    font-size: clamp(2rem, 4vw, 4rem);
    line-height: 0.98;
}

.admin-package-status-badge {
    flex: 0 0 auto;
    padding: 0.5rem 0.75rem;
    border: 1px solid rgba(201, 168, 76, 0.3);
    border-radius: 999px;
    background: rgba(255, 248, 232, 0.9);
    color: #745b14;
    font-family: "Space Mono", monospace;
    font-size: 0.64rem;
    font-weight: 800;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.admin-package-status-badge.status-active,
.admin-package-status-badge.status-approved {
    border-color: rgba(26, 107, 107, 0.22);
    background: rgba(232, 244, 244, 0.92);
    color: var(--teal);
}

.admin-package-status-badge.status-rejected,
.admin-package-status-badge.status-revoked,
.admin-package-status-badge.status-cancelled {
    border-color: rgba(132, 48, 48, 0.2);
    background: rgba(132, 48, 48, 0.07);
    color: #843030;
}

.admin-package-case-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem 1rem;
    margin-top: 1rem;
    color: var(--muted);
    font-size: 0.83rem;
}

.admin-package-case-meta span {
    display: inline-flex;
    gap: 0.42rem;
    align-items: center;
}

.admin-package-case-meta i {
    color: var(--teal);
}

.admin-package-case-actions {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 0.65rem;
    min-width: 180px;
}

.admin-package-case-actions .button {
    justify-content: center;
}

.admin-package-command-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.55fr) minmax(280px, 0.45fr);
    gap: 1rem;
}

.admin-package-commercial-summary,
.admin-package-next-action {
    min-width: 0;
    padding: 1.2rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 22px;
    background: rgba(255, 255, 255, 0.9);
    box-shadow: var(--workspace-card-shadow);
}

.admin-package-command-heading {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 1rem;
}

.admin-package-command-heading h3,
.admin-package-next-action h3,
.admin-package-next-action p {
    margin: 0;
}

.admin-package-command-heading h3 {
    margin-top: 0.2rem;
}

.admin-package-commercial-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    border: 1px solid rgba(15, 23, 42, 0.07);
    border-radius: 17px;
    background: rgba(248, 250, 250, 0.82);
}

.admin-package-commercial-metrics > div {
    display: grid;
    gap: 0.3rem;
    min-width: 0;
    padding: 0.85rem;
    border-right: 1px solid rgba(15, 23, 42, 0.07);
}

.admin-package-commercial-metrics > div:last-child {
    border-right: 0;
}

.admin-package-commercial-metrics span,
.admin-package-date-strip span {
    color: var(--teal);
    font-family: "Space Mono", monospace;
    font-size: 0.58rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.admin-package-commercial-metrics strong {
    overflow-wrap: anywhere;
    color: var(--ink);
    font-size: clamp(0.95rem, 1.7vw, 1.2rem);
}

.admin-package-commercial-metrics .is-settled {
    background: rgba(232, 244, 244, 0.72);
}

.admin-package-next-action {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.85rem;
    border-color: rgba(26, 107, 107, 0.2);
    background: linear-gradient(145deg, #0f3235, #143f42);
    color: #fff;
}

.admin-package-next-action .eyebrow-inline,
.admin-package-next-action p {
    color: rgba(255, 255, 255, 0.72);
}

.admin-package-next-action h3 {
    margin: 0.35rem 0;
    color: #fff;
}

.admin-package-next-action a {
    display: inline-flex;
    gap: 0.4rem;
    align-items: center;
    margin-top: 0.75rem;
    color: #f1d98c;
    font-size: 0.82rem;
    font-weight: 800;
    text-decoration: none;
}

.admin-package-next-icon {
    display: inline-grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.12);
    color: #f1d98c;
}

.admin-package-date-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    overflow: hidden;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.76);
}

.admin-package-date-strip > div {
    display: grid;
    gap: 0.25rem;
    padding: 0.8rem 1rem;
    border-right: 1px solid rgba(15, 23, 42, 0.07);
}

.admin-package-date-strip > div:last-child {
    border-right: 0;
}

.admin-package-date-strip strong {
    font-size: 0.88rem;
}

.admin-package-section-nav {
    position: sticky;
    z-index: 8;
    top: 0.6rem;
    display: flex;
    gap: 0.35rem;
    padding: 0.45rem;
    overflow-x: auto;
    border: 1px solid rgba(26, 107, 107, 0.13);
    border-radius: 16px;
    background: rgba(248, 250, 250, 0.94);
    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.08);
    backdrop-filter: blur(14px);
}

.admin-package-section-nav a {
    display: inline-flex;
    flex: 1 0 auto;
    gap: 0.45rem;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    padding: 0.55rem 0.75rem;
    border-radius: 11px;
    color: var(--mid);
    font-size: 0.78rem;
    font-weight: 800;
    text-decoration: none;
    transition: color 180ms ease, background-color 180ms ease, transform 180ms ease;
}

.admin-package-section-nav a:hover,
.admin-package-section-nav a:focus-visible {
    background: var(--teal);
    color: #fff;
    transform: translateY(-1px);
}

.admin-package-section-nav span {
    font-family: "Space Mono", monospace;
    font-size: 0.58rem;
    letter-spacing: 0.08em;
}

.admin-package-stage,
.admin-package-records-section {
    display: grid;
    gap: 1rem;
    padding-top: 0.5rem;
    scroll-margin-top: 5.5rem;
}

.admin-package-stage-header {
    display: grid;
    grid-template-columns: 54px minmax(0, 1fr);
    gap: 1rem;
    align-items: start;
    padding: 1rem 0.2rem 0;
}

.admin-package-stage-header > span {
    display: inline-grid;
    place-items: center;
    width: 54px;
    height: 54px;
    border: 1px solid rgba(26, 107, 107, 0.2);
    border-radius: 17px;
    background: rgba(232, 244, 244, 0.72);
    color: var(--teal);
    font-family: "Space Mono", monospace;
    font-size: 0.7rem;
    font-weight: 800;
}

.admin-package-stage-header h2,
.admin-package-stage-header p {
    margin: 0;
}

.admin-package-stage-header h2 {
    margin: 0.2rem 0 0.3rem;
    font-size: clamp(1.45rem, 2.5vw, 2.25rem);
}

.admin-package-stage-header p:not(.eyebrow-inline) {
    max-width: 820px;
    color: var(--muted);
}

.admin-package-finance-stage {
    padding-bottom: 0.25rem;
}

.admin-package-records-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 1rem;
    align-items: start;
}

.admin-package-records-grid > .content-panel {
    min-width: 0;
    margin: 0;
}

.admin-package-notification-panel .admin-package-payment-row {
    grid-template-columns: minmax(0, 1fr) auto;
}

.admin-package-page > section,
.admin-package-page > nav {
    animation: adminPackageEnter 420ms ease both;
}

.admin-package-page > :nth-child(2) { animation-delay: 45ms; }
.admin-package-page > :nth-child(3) { animation-delay: 80ms; }
.admin-package-page > :nth-child(4) { animation-delay: 115ms; }
.admin-package-page > :nth-child(n + 5) { animation-delay: 150ms; }

@keyframes adminPackageEnter {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}

.admin-package-workflow {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.8rem;
    margin-bottom: 1rem;
}

.admin-package-workflow-step {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.8rem;
    align-items: center;
    min-height: 112px;
    padding: 1rem;
    overflow: hidden;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.84);
    box-shadow: var(--workspace-card-shadow);
}

.admin-package-workflow-step::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 4px;
    background: rgba(15, 23, 42, 0.08);
}

.admin-package-workflow-step.is-current {
    border-color: rgba(201, 168, 76, 0.32);
    background: linear-gradient(135deg, rgba(255, 248, 232, 0.9), rgba(255, 255, 255, 0.9));
}

.admin-package-workflow-step.is-current::after {
    background: var(--gold);
}

.admin-package-workflow-step.is-complete,
.admin-package-workflow-step.is-ready {
    border-color: rgba(26, 107, 107, 0.25);
    background: linear-gradient(135deg, rgba(232, 244, 244, 0.9), rgba(255, 255, 255, 0.92));
}

.admin-package-workflow-step.is-complete::after,
.admin-package-workflow-step.is-ready::after {
    background: var(--teal);
}

.admin-package-workflow-step.is-locked {
    color: var(--muted);
}

.admin-package-workflow-number {
    display: inline-grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border-radius: 14px;
    background: rgba(15, 23, 42, 0.07);
    color: var(--mid);
    font-family: "Space Mono", monospace;
    font-size: 0.75rem;
    font-weight: 800;
}

.admin-package-workflow-step.is-current .admin-package-workflow-number {
    background: rgba(201, 168, 76, 0.18);
    color: #745b14;
}

.admin-package-workflow-step.is-complete .admin-package-workflow-number,
.admin-package-workflow-step.is-ready .admin-package-workflow-number {
    background: var(--teal);
    color: #fff;
}

.admin-package-workflow-step p,
.admin-package-workflow-step h3,
.admin-package-workflow-step span {
    margin: 0;
}

.admin-package-workflow-step p {
    margin-bottom: 0.2rem;
    color: var(--teal);
    font-family: "Space Mono", monospace;
    font-size: 0.62rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.admin-package-workflow-step h3 {
    font-size: clamp(1rem, 1.6vw, 1.2rem);
}

.admin-package-workflow-step div > span {
    display: block;
    margin-top: 0.25rem;
    color: var(--muted);
    font-size: 0.82rem;
    line-height: 1.45;
}

.admin-package-subject-review-list {
    display: grid;
    gap: 0.95rem;
}

.admin-package-subject-notes {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(15, 23, 42, 0.1);
}

.admin-package-subject-notes textarea {
    min-height: 128px;
}

.admin-package-subject-review-card {
    display: grid;
    gap: 0.95rem;
    padding: 1rem;
    border-radius: 22px;
    border: 1px solid rgba(26, 107, 107, 0.14);
    background:
        linear-gradient(135deg, rgba(232, 244, 244, 0.68), rgba(255, 255, 255, 0.92)),
        #fff;
    box-shadow: var(--workspace-card-shadow);
}

.admin-package-subject-review-head,
.admin-package-subject-review-stats {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.8rem;
    align-items: center;
}

.admin-package-subject-review-head h3 {
    margin: 0;
}

.admin-package-subject-review-price,
.admin-package-subject-review-stats > div:not(.form-field) {
    display: grid;
    gap: 0.2rem;
    padding: 0.75rem;
    border-radius: 16px;
    border: 1px solid rgba(15, 23, 42, 0.07);
    background: rgba(255, 255, 255, 0.82);
}

.admin-package-subject-review-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.admin-package-subject-review-price span,
.admin-package-subject-review-stats span {
    font-family: "Space Mono", monospace;
    font-size: 0.62rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--teal);
}

.admin-package-subject-review-price strong,
.admin-package-subject-review-stats strong {
    color: var(--ink);
}

.admin-package-review-panel {
    position: static;
}

.admin-package-activation-card {
    display: flex;
    gap: 0.9rem;
    align-items: flex-start;
    padding: 1rem;
    border-radius: 22px;
    border: 1px solid rgba(26, 107, 107, 0.18);
    background:
        linear-gradient(135deg, rgba(232, 244, 244, 0.78), rgba(255, 248, 232, 0.72)),
        #fff;
    box-shadow: var(--workspace-card-shadow);
}

.admin-package-activation-card h3,
.admin-package-activation-card p {
    margin: 0;
}

.admin-package-activation-card p {
    color: var(--muted);
}

.admin-package-activation-card a {
    display: inline-flex;
    gap: 0.35rem;
    align-items: center;
    margin-top: 0.65rem;
    color: var(--teal);
    font-weight: 800;
    text-decoration: none;
}

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

.admin-package-review-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.7rem;
}

.admin-package-review-actions .button {
    justify-content: center;
}

.admin-package-finance-grid {
    grid-template-columns: minmax(0, 1.2fr) minmax(320px, 0.8fr);
    align-items: start;
}

.admin-package-payment-panel,
.admin-package-activation-panel,
.admin-package-payment-form,
.admin-package-activation-form {
    display: grid;
    gap: 1rem;
}

.admin-package-payment-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
}

.admin-package-payment-summary > div {
    display: grid;
    gap: 0.3rem;
    padding: 0.85rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 16px;
    background: rgba(248, 250, 250, 0.86);
}

.admin-package-payment-summary span {
    font-family: "Space Mono", monospace;
    font-size: 0.62rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--teal);
}

.admin-package-payment-progress {
    display: grid;
    gap: 0.55rem;
    padding: 0.85rem 1rem;
    border: 1px solid rgba(26, 107, 107, 0.14);
    border-radius: 16px;
    background: rgba(232, 244, 244, 0.4);
}

.admin-package-payment-progress > div,
.admin-package-payment-progress p {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.admin-package-payment-progress p {
    justify-content: flex-start;
    margin: 0;
    color: var(--teal);
    font-size: 0.84rem;
    font-weight: 700;
}

.admin-package-payment-progress progress {
    width: 100%;
    height: 10px;
    overflow: hidden;
    border: 0;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.09);
}

.admin-package-payment-progress progress::-webkit-progress-bar {
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.09);
}

.admin-package-payment-progress progress::-webkit-progress-value {
    border-radius: 999px;
    background: linear-gradient(90deg, var(--teal), #3ca49d);
}

.admin-package-payment-progress progress::-moz-progress-bar {
    border-radius: 999px;
    background: linear-gradient(90deg, var(--teal), #3ca49d);
}

.admin-package-payment-form-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.admin-package-safety-note {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.7rem;
    align-items: start;
    padding: 0.85rem;
    border: 1px solid rgba(26, 107, 107, 0.16);
    border-radius: 16px;
    background: rgba(232, 244, 244, 0.58);
    color: var(--mid);
}

.admin-package-safety-note.is-warning {
    border-color: rgba(201, 168, 76, 0.3);
    background: rgba(255, 248, 232, 0.72);
}

.admin-package-safety-note p {
    margin: 0;
}

.admin-package-payment-history {
    display: grid;
    gap: 0.7rem;
    padding-top: 0.25rem;
}

.admin-package-payment-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 0.85rem;
    align-items: center;
    padding: 0.85rem;
    border: 1px solid rgba(26, 107, 107, 0.14);
    border-radius: 17px;
    background: rgba(255, 255, 255, 0.9);
}

.admin-package-payment-row.status-voided {
    border-color: rgba(132, 48, 48, 0.2);
    opacity: 0.76;
}

.admin-package-payment-row h4,
.admin-package-payment-row p {
    margin: 0;
}

.admin-package-payment-row p:not(.eyebrow-inline) {
    color: var(--muted);
}

.admin-package-void-payment-form {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.65rem;
    align-items: end;
    padding-top: 0.75rem;
    border-top: 1px solid rgba(132, 48, 48, 0.14);
}

.admin-package-void-payment-form label {
    grid-column: 1 / -1;
    font-size: 0.78rem;
    font-weight: 700;
}

.admin-package-void-payment-form textarea {
    min-height: 70px;
    resize: vertical;
}

.admin-package-activation-ready {
    display: flex;
    gap: 0.85rem;
    align-items: flex-start;
    padding: 1rem;
    border: 1px solid rgba(26, 107, 107, 0.2);
    border-radius: 20px;
    background: linear-gradient(135deg, rgba(232, 244, 244, 0.8), rgba(255, 255, 255, 0.92));
}

.admin-package-activation-ready h3,
.admin-package-activation-ready p {
    margin: 0;
}

.admin-package-readiness {
    display: grid;
    gap: 0.55rem;
}

.admin-package-readiness > div {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0.6rem;
    align-items: center;
    padding: 0.7rem 0.8rem;
    border: 1px solid rgba(15, 23, 42, 0.07);
    border-radius: 14px;
    background: rgba(248, 250, 250, 0.8);
    color: var(--muted);
}

.admin-package-readiness > div.is-complete {
    border-color: rgba(26, 107, 107, 0.16);
    background: rgba(232, 244, 244, 0.56);
    color: var(--teal);
}

.admin-package-readiness strong {
    color: var(--ink);
    font-size: 0.76rem;
}

.admin-package-blockers {
    padding: 0.9rem;
    border: 1px solid rgba(201, 168, 76, 0.3);
    border-radius: 16px;
    background: rgba(255, 248, 232, 0.72);
}

.admin-package-blockers ul {
    display: grid;
    gap: 0.55rem;
    margin: 0.65rem 0 0;
    padding: 0;
    list-style: none;
}

.admin-package-blockers li {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.5rem;
    align-items: start;
    color: var(--mid);
    font-size: 0.86rem;
    line-height: 1.45;
}

.admin-package-blockers li i {
    margin-top: 0.25rem;
    color: #8b6f1f;
    font-size: 0.68rem;
}

.admin-package-activation-disabled {
    width: 100%;
    justify-content: center;
    cursor: not-allowed;
    opacity: 0.5;
}

.admin-package-timeline {
    position: relative;
    display: grid;
    gap: 0;
    padding-left: 0.25rem;
}

.admin-package-timeline-event {
    position: relative;
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    gap: 0.85rem;
    padding: 0 0 1.15rem;
}

.admin-package-timeline-event::before {
    content: "";
    position: absolute;
    left: 8px;
    top: 13px;
    bottom: -2px;
    width: 1px;
    background: rgba(26, 107, 107, 0.18);
}

.admin-package-timeline-event:last-child::before {
    display: none;
}

.admin-package-timeline-marker {
    position: relative;
    z-index: 1;
    width: 17px;
    height: 17px;
    margin-top: 3px;
    border: 4px solid #fff;
    border-radius: 50%;
    background: var(--teal);
    box-shadow: 0 0 0 1px rgba(26, 107, 107, 0.22);
}

.admin-package-timeline-event.tone-warning .admin-package-timeline-marker {
    background: var(--gold);
}

.admin-package-timeline-event h4,
.admin-package-timeline-event p {
    margin: 0;
}

.admin-package-timeline-event p:not(.eyebrow-inline) {
    color: var(--muted);
}

@media (max-width: 1100px) {
    .admin-package-command-grid,
    .admin-package-records-grid {
        grid-template-columns: 1fr;
    }

    .admin-package-next-action {
        align-items: center;
    }
}

@media (max-width: 900px) {
    .admin-package-case-header {
        grid-template-columns: 1fr;
        align-items: start;
    }

    .admin-package-case-actions {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: 100%;
    }

    .admin-package-commercial-metrics,
    .admin-package-date-strip {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .admin-package-commercial-metrics > div:nth-child(2),
    .admin-package-date-strip > div:nth-child(2) {
        border-right: 0;
    }

    .admin-package-commercial-metrics > div:nth-child(-n + 2),
    .admin-package-date-strip > div:nth-child(-n + 2) {
        border-bottom: 1px solid rgba(15, 23, 42, 0.07);
    }

    .admin-package-workflow,
    .admin-package-finance-grid,
    .admin-package-payment-form-grid,
    .admin-package-payment-summary {
        grid-template-columns: 1fr;
    }

    .admin-package-payment-row {
        grid-template-columns: 1fr;
        align-items: start;
    }

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

@media (max-width: 560px) {
    .admin-package-case-heading {
        display: grid;
    }

    .admin-package-case-heading h2 {
        font-size: clamp(1.8rem, 11vw, 2.7rem);
    }

    .admin-package-status-badge {
        justify-self: start;
    }

    .admin-package-case-actions,
    .admin-package-commercial-metrics {
        grid-template-columns: 1fr;
    }

    .admin-package-commercial-metrics > div {
        border-right: 0;
        border-bottom: 1px solid rgba(15, 23, 42, 0.07);
    }

    .admin-package-commercial-metrics > div:last-child {
        border-bottom: 0;
    }

    .admin-package-stage-header {
        grid-template-columns: 42px minmax(0, 1fr);
        gap: 0.75rem;
    }

    .admin-package-stage-header > span {
        width: 42px;
        height: 42px;
        border-radius: 13px;
        font-size: 0.58rem;
    }

    .admin-package-section-nav {
        margin-inline: -0.15rem;
    }
}

/* Phase 4: mixed objective and guided-theory paper studio */
.paper-composition-choice-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.paper-shared-duration {
    max-width: 22rem;
    margin-bottom: 1rem;
}

.paper-section-rules-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.paper-section-rule-card {
    display: grid;
    gap: 1rem;
    min-width: 0;
    padding: 1rem;
    border: 1px solid rgba(18, 63, 70, 0.14);
    border-radius: 1rem;
    background: linear-gradient(145deg, rgba(238, 247, 245, 0.82), #fff);
}

.paper-section-rule-card.section-b {
    border-color: rgba(193, 137, 23, 0.24);
    background: linear-gradient(145deg, rgba(255, 247, 226, 0.9), #fff);
}

.paper-section-rule-head {
    display: flex;
    gap: 0.75rem;
    align-items: center;
}

.paper-section-rule-head > span,
.theory-preview-number {
    display: grid;
    width: 2.6rem;
    height: 2.6rem;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 0.8rem;
    color: #fff;
    background: #123f46;
    font-family: var(--font-display, Georgia, serif);
    font-size: 1.1rem;
    font-weight: 800;
}

.paper-section-rule-card.section-b .paper-section-rule-head > span,
.paper-preview-section.section-b .theory-preview-number {
    color: #332507;
    background: #edbd39;
}

.paper-section-rule-head strong,
.paper-section-rule-head small {
    display: block;
}

.paper-section-rule-head small {
    margin-top: 0.2rem;
    color: var(--muted, #686663);
}

.paper-rollout-gate {
    display: flex;
    gap: 0.8rem;
    align-items: flex-start;
    margin-top: 0.9rem;
    padding: 0.9rem 1rem;
    border-radius: 0.85rem;
    color: #62490f;
    background: #fff5d9;
}

.paper-rollout-gate p {
    margin: 0.2rem 0 0;
}

.paper-theory-add-form {
    display: flex;
    flex: 1 1 32rem;
    gap: 0.6rem;
    align-items: center;
}

.paper-theory-add-form select {
    min-width: 0;
    flex: 1 1 auto;
}

.theory-paper-item-list,
.theory-paper-preview-list {
    display: grid;
    gap: 0.9rem;
    margin-top: 1rem;
}

.theory-paper-item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0.9rem;
    align-items: start;
    padding: 1rem;
    border: 1px solid rgba(18, 63, 70, 0.13);
    border-left: 0.3rem solid #c8951c;
    border-radius: 1rem;
    background: linear-gradient(120deg, rgba(255, 249, 232, 0.72), #fff 64%);
}

.theory-paper-item-copy h4 {
    margin: 0.65rem 0;
}

.theory-paper-part-summary {
    display: grid;
    gap: 0.4rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.theory-paper-part-summary li {
    display: grid;
    grid-template-columns: 2.5rem minmax(0, 1fr) auto;
    gap: 0.6rem;
    align-items: baseline;
    padding: 0.55rem 0.65rem;
    border-radius: 0.65rem;
    background: rgba(255, 255, 255, 0.82);
}

.theory-paper-part-summary small {
    color: var(--muted, #686663);
}

.theory-paper-preview-question {
    display: grid;
    gap: 1rem;
    padding: clamp(1rem, 2.5vw, 1.5rem);
    border: 1px solid rgba(18, 63, 70, 0.13);
    border-radius: 1.1rem;
    background: #fff;
}

.theory-paper-preview-question > header {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.9rem;
    align-items: start;
}

.theory-paper-preview-question h4 {
    margin: 0.65rem 0 0;
    font-size: clamp(1.1rem, 2vw, 1.4rem);
}

.theory-paper-preview-question figure {
    margin: 0;
}

.theory-paper-preview-question img {
    display: block;
    max-width: min(100%, 48rem);
    max-height: 30rem;
    object-fit: contain;
    border-radius: 0.85rem;
}

.theory-paper-preview-question figcaption {
    margin-top: 0.35rem;
    color: var(--muted, #686663);
    font-size: 0.85rem;
}

@media (max-width: 900px) {
    .paper-composition-choice-grid,
    .paper-section-rules-grid {
        grid-template-columns: 1fr;
    }

    .theory-paper-item {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .theory-paper-item > .bece-paper-item-actions {
        grid-column: 1 / -1;
    }
}

@media (max-width: 620px) {
    .paper-theory-add-form,
    .theory-paper-item,
    .theory-paper-preview-question > header {
        display: grid;
        grid-template-columns: 1fr;
    }

    .paper-theory-add-form .button,
    .paper-theory-add-form select {
        width: 100%;
    }

    .theory-paper-part-summary li {
        grid-template-columns: 2rem minmax(0, 1fr);
    }

    .theory-paper-part-summary small {
        grid-column: 2;
    }
}

@media (prefers-reduced-motion: reduce) {
    .admin-package-page > section,
    .admin-package-page > nav {
        animation: none;
    }

    .admin-package-section-nav a {
        transition: none;
    }
}

.school-roster-stat,
.school-package-request-stat {
    display: grid;
    gap: 0.2rem;
    padding: 0.75rem 0.8rem;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.82);
    border: 1px solid rgba(15, 23, 42, 0.07);
}

.school-roster-stat span,
.school-package-request-stat span {
    font-family: "Space Mono", monospace;
    font-size: 0.62rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--teal);
}

.school-roster-stat strong,
.school-package-request-stat strong {
    font-size: 0.96rem;
    color: var(--ink);
}

.school-slot-summary-card {
    display: grid;
    gap: 0.85rem;
    margin-bottom: 1rem;
    padding: 1rem;
    border-radius: 24px;
    border: 1px solid rgba(26, 107, 107, 0.18);
    background:
        linear-gradient(135deg, rgba(232, 244, 244, 0.78), rgba(255, 255, 255, 0.94)),
        #fff;
    box-shadow: var(--workspace-card-shadow);
}

.school-slot-summary-card.is-full {
    border-color: rgba(177, 124, 35, 0.26);
    background:
        linear-gradient(135deg, rgba(255, 248, 232, 0.88), rgba(255, 255, 255, 0.94)),
        #fff;
}

.school-slot-summary-card.is-over-limit {
    border-color: rgba(132, 48, 48, 0.28);
    background:
        linear-gradient(135deg, rgba(255, 236, 232, 0.88), rgba(255, 255, 255, 0.94)),
        #fff;
}

.school-slot-summary-main {
    display: flex;
    gap: 0.85rem;
    align-items: flex-start;
}

.school-slot-summary-main h3,
.school-slot-summary-main p {
    margin: 0;
}

.school-slot-summary-main p {
    color: var(--muted);
}

.school-slot-subject-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.school-slot-subject-list span {
    padding: 0.45rem 0.65rem;
    border-radius: 999px;
    background: rgba(26, 107, 107, 0.09);
    color: var(--teal-dark);
    font-size: 0.78rem;
    font-weight: 800;
}

.school-focus-summary.is-warning {
    border-color: rgba(177, 124, 35, 0.25);
    background:
        linear-gradient(135deg, rgba(255, 248, 232, 0.84), rgba(255, 255, 255, 0.92)),
        #fff;
}

.school-roster-stats.tutor-monitor-roster-stats {
    display: flex;
    flex-wrap: nowrap;
    gap: 0.65rem;
    align-items: stretch;
}

.school-roster-stats.tutor-monitor-roster-stats .school-roster-stat {
    min-width: 92px;
    padding: 0.7rem 0.72rem;
}

.school-classroom-roster-stats {
    grid-template-columns: repeat(5, minmax(100px, 1fr));
}

.school-roster-control-card {
    display: grid;
    gap: 1rem;
    align-items: stretch;
    padding: 1.15rem 1.2rem;
    border-radius: 22px;
    border: 1px solid var(--workspace-card-border);
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.05), transparent 34%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(246, 249, 249, 0.94));
    box-shadow: var(--workspace-card-shadow);
}

.school-roster-control-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.school-roster-control-body {
    display: grid;
    grid-template-columns: minmax(200px, 240px) minmax(0, 1fr);
    gap: 1rem;
    align-items: center;
}

.school-roster-control-stats {
    grid-template-columns: repeat(3, minmax(120px, 1fr));
}

.school-roster-control-shell {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1rem;
    align-items: center;
}

.school-roster-control-actions {
    width: 100%;
    justify-content: flex-end;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.school-roster-control-actions .button,
.school-roster-control-actions form .button {
    min-height: 2.9rem;
    padding-inline: 1rem;
    box-shadow: 0 10px 22px rgba(15, 23, 42, 0.06);
}

.school-roster-control-actions .button.button-secondary {
    background: rgba(255, 255, 255, 0.95);
}

.school-membership-removal-shell {
    display: grid;
    place-items: center;
    padding-block: clamp(0.5rem, 2vw, 1.5rem);
}

.school-membership-removal-card {
    display: grid;
    gap: 1.2rem;
    width: min(100%, 760px);
    margin: 0;
    padding: clamp(1.2rem, 3vw, 2rem);
    border-color: rgba(168, 50, 50, 0.18);
    background:
        radial-gradient(circle at top right, rgba(168, 50, 50, 0.07), transparent 34%),
        linear-gradient(160deg, rgba(255, 255, 255, 0.98), rgba(253, 248, 244, 0.96));
}

.school-membership-removal-heading {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.9rem;
    align-items: center;
}

.school-membership-removal-heading h3,
.school-membership-removal-heading p {
    margin: 0;
}

.school-membership-removal-icon {
    display: inline-grid;
    place-items: center;
    width: 54px;
    height: 54px;
    border-radius: 17px;
    background: rgba(168, 50, 50, 0.1);
    color: #8c2f2f;
    font-size: 1.1rem;
}

.school-membership-removal-effects {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.7rem;
}

.school-membership-removal-effects > div {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.65rem;
    align-items: start;
    padding: 0.85rem;
    border: 1px solid rgba(168, 50, 50, 0.12);
    border-radius: 15px;
    background: rgba(255, 255, 255, 0.78);
    color: var(--mid);
}

.school-membership-removal-effects > div i {
    margin-top: 0.2rem;
    color: #8c2f2f;
}

.school-membership-removal-effects > div.is-preserved {
    border-color: rgba(26, 107, 107, 0.17);
    background: rgba(232, 244, 244, 0.58);
}

.school-membership-removal-effects > div.is-preserved i {
    color: var(--teal);
}

.school-membership-removal-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.7rem;
    justify-content: flex-end;
}

.school-membership-removal-actions .danger-button {
    border-color: #8c2f2f;
    background: #8c2f2f;
    color: #fff;
}

@media (max-width: 620px) {
    .school-membership-removal-effects {
        grid-template-columns: 1fr;
    }

    .school-membership-removal-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .school-membership-removal-actions .button {
        justify-content: center;
    }
}

.school-report-item,
.school-course-uptake-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.85rem;
    align-items: start;
    padding: 0.95rem 1rem;
    border-radius: 16px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.88);
}

.school-course-uptake-row {
    grid-template-columns: 1fr;
    gap: 0.2rem;
}

.school-subject-preview-link {
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.85rem;
    color: inherit;
    text-decoration: none;
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease, background 180ms ease;
}

.school-subject-preview-link:hover,
.school-subject-preview-link:focus-visible {
    transform: translateY(-2px);
    border-color: rgba(26, 107, 107, 0.26);
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(229, 243, 240, 0.9));
    box-shadow: 0 14px 30px rgba(15, 23, 42, 0.08);
}

.school-subject-preview-icon {
    width: 2.75rem;
    height: 2.75rem;
    display: inline-grid;
    place-items: center;
    border-radius: 14px;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
}

.school-subject-preview-copy {
    display: grid;
    gap: 0.18rem;
    min-width: 0;
}

.school-subject-preview-action {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    color: var(--teal);
    font-weight: 800;
    white-space: nowrap;
}

.school-subject-preview-shell {
    display: grid;
    gap: 1.5rem;
}

.school-subject-library-shell {
    display: grid;
    gap: 1.5rem;
}

.school-subject-library-hero {
    align-items: center;
    margin: 0;
}

.school-subject-library-summary {
    display: grid;
    grid-template-columns: repeat(2, minmax(8.5rem, 1fr));
    gap: 0.65rem;
    min-width: min(100%, 20rem);
}

.school-subject-library-summary > span {
    display: grid;
    gap: 0.3rem;
    padding: 0.9rem 1rem;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.1);
}

.school-subject-library-summary small {
    color: rgba(255, 255, 255, 0.76);
    font-size: 0.7rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.school-subject-library-summary strong {
    color: #fff;
    font-family: var(--font-display);
    font-size: 1.55rem;
}

.school-subject-library-panel {
    display: grid;
    gap: 1.2rem;
    margin: 0;
}

.school-subject-library-heading {
    align-items: flex-start;
}

.school-subject-library-heading h3 {
    margin: 0.3rem 0 0.4rem;
}

.school-subject-library-heading p {
    max-width: 72ch;
    margin: 0;
    color: var(--muted);
}

.school-subject-library-list {
    display: grid;
    gap: 0.85rem;
}

.school-subject-library-row {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(15rem, 0.7fr) auto;
    gap: 1rem;
    align-items: center;
    padding: 1rem;
    border: 1px solid rgba(15, 23, 42, 0.09);
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(237, 246, 244, 0.72));
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.045);
}

.school-subject-library-row:nth-child(even) {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(250, 244, 225, 0.64));
}

.school-subject-library-identity {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.85rem;
    align-items: center;
    min-width: 0;
}

.school-subject-library-identity div {
    min-width: 0;
}

.school-subject-library-identity small,
.school-subject-library-meta small {
    color: var(--teal);
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.school-subject-library-identity h4 {
    margin: 0.14rem 0 0.28rem;
    font-size: 1.15rem;
}

.school-subject-library-identity p {
    margin: 0;
    color: var(--muted);
    line-height: 1.55;
}

.school-subject-library-meta {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.65rem;
}

.school-subject-library-meta > span {
    display: grid;
    gap: 0.25rem;
    min-height: 4rem;
    padding: 0.75rem 0.85rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 13px;
    background: rgba(255, 255, 255, 0.74);
}

.school-subject-library-meta strong {
    overflow-wrap: anywhere;
}

.school-subject-library-row > .button {
    min-width: 10.5rem;
    white-space: nowrap;
}

.school-catalog-filter-form {
    display: grid;
    grid-template-columns: minmax(14rem, 1.4fr) minmax(12rem, 0.8fr) auto;
    gap: 0.9rem;
    align-items: end;
    padding: 1rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 16px;
    background: rgba(237, 246, 244, 0.62);
}

.school-catalog-filter-form label {
    display: grid;
    gap: 0.4rem;
}

.school-catalog-filter-form label > span {
    color: var(--teal);
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.school-catalog-row-actions {
    flex-wrap: nowrap;
    justify-content: flex-end;
}

.school-catalog-row-actions .button {
    white-space: nowrap;
}

.school-subject-library-row.is-approved {
    border-color: rgba(26, 107, 107, 0.26);
    box-shadow: inset 4px 0 0 rgba(26, 107, 107, 0.72), 0 10px 24px rgba(15, 23, 42, 0.045);
}

.school-package-payment-actions {
    justify-content: flex-end;
}

.school-subject-library-empty {
    min-height: 18rem;
}

.school-subject-preview-hero {
    margin: 0;
}

.school-subject-lesson-preview {
    display: grid;
    gap: 1.35rem;
    padding: clamp(1rem, 2.2vw, 1.6rem);
    background:
        radial-gradient(circle at top right, rgba(201, 168, 76, 0.1), transparent 34%),
        rgba(255, 255, 255, 0.96);
}

.school-subject-preview-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1.25rem;
}

.school-subject-preview-heading h3 {
    margin: 0.3rem 0 0.45rem;
    font-size: clamp(1.45rem, 2.4vw, 2.1rem);
}

.school-subject-preview-heading p {
    margin: 0;
    color: var(--muted);
}

.school-subject-preview-meta {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.5rem;
}

.school-subject-video-showcase {
    width: min(100%, 960px);
    margin-inline: auto;
}

.school-subject-preview-support-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1rem;
    align-items: start;
    min-width: 0;
}

.school-subject-preview-support-grid > .content-panel {
    margin: 0;
    min-width: 0;
}

.lesson-materials-panel .curriculum-support-list {
    display: flex;
    overflow-x: auto;
    overscroll-behavior-inline: auto;
    padding-bottom: 0.45rem;
    scroll-snap-type: x proximity;
    scrollbar-color: rgba(26, 107, 107, 0.38) transparent;
    scrollbar-width: thin;
}

.lesson-materials-panel .curriculum-resource-row,
.lesson-materials-panel .curriculum-assessment-row {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    flex: 1 0 clamp(220px, 28vw, 300px);
    max-width: min(100%, 500px);
    min-height: 184px;
    padding: 1rem;
    scroll-snap-align: start;
}

.lesson-materials-panel .curriculum-support-row-action {
    margin-top: auto;
}

.student-lesson-materials {
    min-width: 0;
}

.student-lesson-materials .curriculum-support-heading {
    align-items: flex-start;
}

.student-lesson-materials .curriculum-support-heading .pill {
    flex-shrink: 0;
}

.student-lesson-result-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.65rem;
    margin-top: 1rem;
    padding: 0.8rem 1rem;
    border-radius: 12px;
    background: rgba(26, 107, 107, 0.07);
    color: var(--ink);
    font-size: 0.88rem;
}

.student-lesson-result-link a {
    color: var(--teal);
    font-weight: 800;
}

.student-lesson-resource-notes {
    max-width: 980px;
    margin: 1rem auto 0;
    padding: 1rem 1.2rem;
    border-radius: 14px;
    background: rgba(26, 107, 107, 0.06);
}

.student-lesson-resource-notes h4 {
    margin: 0 0 0.5rem;
}

.student-lesson-resource-notes ul {
    margin: 0;
    padding-left: 1.25rem;
}

@media (max-width: 620px) {
    .student-lesson-materials .curriculum-support-heading {
        flex-wrap: wrap;
    }

    .student-lesson-materials .curriculum-support-heading .pill {
        margin-left: 0;
    }

    .lesson-notes-disclosure .school-subject-preview-notes-action .pill {
        display: none;
    }
}

.school-subject-preview-notes {
    width: 100%;
}

.lesson-notes-disclosure .school-subject-preview-notes-toggle {
    cursor: pointer;
    list-style: none;
    margin-bottom: 0;
}

.lesson-notes-disclosure .school-subject-preview-notes-toggle::-webkit-details-marker {
    display: none;
}

.lesson-notes-disclosure .school-subject-preview-notes-toggle:focus-visible {
    outline: 2px solid var(--teal);
    outline-offset: 4px;
    border-radius: 0.35rem;
}

.school-subject-preview-notes-title {
    font-size: 1.17em;
    font-weight: 700;
}

.school-subject-preview-notes-action {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--teal);
    font-size: 0.85rem;
    font-weight: 700;
    white-space: nowrap;
}

.school-subject-preview-notes-action i {
    transition: transform 180ms ease;
}

.lesson-notes-disclosure[open] .school-subject-preview-notes-toggle {
    margin-bottom: 1rem;
}

.lesson-notes-disclosure[open] .school-subject-preview-notes-action i {
    transform: rotate(180deg);
}

.lesson-notes-disclosure[open] .school-subject-preview-notes-closed-label,
.lesson-notes-disclosure:not([open]) .school-subject-preview-notes-open-label {
    display: none;
}

@media (prefers-reduced-motion: reduce) {
    .school-subject-preview-notes-action i {
        transition: none;
    }
}

.lesson-materials-panel .curriculum-assessment-row {
    border-color: rgba(182, 132, 25, 0.28);
    background: linear-gradient(145deg, #fff9e9, #fffdf7);
}

.lesson-materials-panel .curriculum-assessment-row .curriculum-support-row-icon {
    color: #92620b;
    background: rgba(201, 168, 76, 0.17);
}

.lesson-materials-panel .curriculum-assessment-row .curriculum-support-row-action {
    background: #865d12;
}

.school-subject-structure-panel {
    margin: 0;
}

.school-tree-preview-jump {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    margin-left: auto;
    color: var(--teal);
    font-weight: 800;
    text-decoration: none;
    white-space: nowrap;
}

.school-subject-empty-preview {
    min-height: 18rem;
    margin: 0;
}

@media (max-width: 760px) {
    .school-subject-library-hero,
    .school-subject-library-row {
        grid-template-columns: 1fr;
    }

    .school-subject-library-summary {
        width: 100%;
        min-width: 0;
    }

    .school-subject-library-heading {
        display: grid;
        gap: 0.75rem;
    }

    .school-subject-library-row > .button {
        width: 100%;
    }

    .school-catalog-filter-form {
        grid-template-columns: 1fr;
    }

    .school-catalog-row-actions {
        display: grid;
        grid-template-columns: 1fr;
        width: 100%;
    }

    .school-catalog-row-actions .button,
    .school-package-payment-actions .button {
        width: 100%;
    }

    .school-subject-preview-link {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .school-subject-preview-action {
        grid-column: 2;
        justify-self: start;
    }

    .school-subject-preview-heading,
    .school-subject-preview-support-grid {
        grid-template-columns: 1fr;
    }

    .school-subject-preview-heading {
        display: grid;
    }

    .school-subject-preview-meta {
        justify-content: flex-start;
    }

    .school-tree-preview-jump {
        grid-column: 2;
        margin: 0.45rem 0 0;
    }
}

.school-support-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.85rem;
}

.school-learner-hero {
    align-items: flex-start;
}

.school-learner-identity {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.school-learner-avatar,
.school-learner-avatar-image {
    width: 4.5rem;
    height: 4.5rem;
    border-radius: 22px;
    flex-shrink: 0;
}

.school-learner-avatar {
    display: inline-grid;
    place-items: center;
    background: rgba(26, 107, 107, 0.12);
    color: var(--teal);
    font-size: 1.4rem;
    font-weight: 700;
}

.school-learner-avatar-image {
    object-fit: cover;
    border: 1px solid rgba(15, 23, 42, 0.08);
}

.school-learner-identity-copy {
    display: grid;
    gap: 0.25rem;
}

.school-learner-hero-copy {
    display: grid;
    gap: 0.9rem;
}

.school-learner-meta,
.school-learner-course-meta,
.school-learner-course-top {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.school-learner-meta span,
.school-learner-course-meta span,
.school-learner-course-top span {
    color: var(--mid);
    line-height: 1.6;
}

.school-learner-detail-grid {
    grid-template-columns: minmax(0, 1fr) minmax(300px, 0.72fr);
}

.school-learner-course-list {
    gap: 1rem;
}

.school-learner-course-row {
    gap: 0.75rem;
}

.school-learner-course-top,
.school-learner-course-meta {
    justify-content: space-between;
}

.school-learner-course-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.school-classroom-list {
    display: grid;
    gap: 0.95rem;
}

.school-classroom-library-grid {
    grid-template-columns: minmax(0, 1.45fr) minmax(300px, 0.75fr);
}

.school-classroom-library-main-panel,
.school-classroom-switch-panel {
    align-self: start;
}

.school-classroom-row {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(240px, 0.8fr) auto;
    gap: 1rem;
    align-items: center;
    padding: 1rem 1.05rem;
    border-radius: 18px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.9);
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.05);
}

.school-classroom-library-card {
    grid-template-columns: 1fr;
    gap: 0;
}

.school-classroom-library-body {
    display: grid;
    grid-template-columns: minmax(220px, 260px) minmax(0, 1fr);
    gap: 1rem;
    align-items: center;
}

.school-classroom-library-shell {
    display: grid;
    grid-template-columns: auto auto;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    min-width: 0;
}

.school-classroom-library-stats {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    min-width: 0;
    flex-shrink: 0;
}

.school-classroom-meta-line {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    flex-wrap: wrap;
}

.school-classroom-mini-stat {
    display: grid;
    gap: 0.22rem;
    padding: 0.8rem 0.9rem;
    border-radius: 16px;
    border: 1px solid rgba(15, 23, 42, 0.06);
    background: rgba(255, 255, 255, 0.9);
}

.school-classroom-mini-stat span {
    font-family: "Space Mono", monospace;
    font-size: 0.62rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--teal);
}

.school-classroom-mini-stat strong {
    font-size: 0.98rem;
    color: var(--ink);
    line-height: 1.45;
}

.school-classroom-code-stat strong {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.6rem;
}

.school-classroom-code-stat strong span {
    font-size: 1rem;
    color: var(--ink);
}

.school-copy-button {
    padding-inline: 0.65rem;
    min-height: 2.1rem;
}

.school-copy-button.is-copied {
    border-color: rgba(26, 107, 107, 0.24);
    background: rgba(26, 107, 107, 0.1);
    color: var(--brand-teal);
}

.school-classroom-library-actions {
    justify-content: flex-end;
    align-items: center;
    flex-wrap: nowrap;
    flex-shrink: 0;
}

.school-classroom-library-stats .school-roster-stat {
    min-width: 132px;
    padding: 0.68rem 0.75rem;
    box-shadow: none;
}

.school-classroom-library-stats .school-classroom-code-stat {
    min-width: 132px;
}

.school-classroom-library-stats .school-classroom-learner-stat {
    min-width: 132px;
}

.school-classroom-library-actions .button,
.school-classroom-library-actions form .button {
    white-space: nowrap;
}

.school-classroom-library-actions .button,
.school-classroom-library-actions form {
    margin-top: 0;
}

.school-classroom-library-actions .button,
.school-classroom-library-actions form .button {
    min-height: 2.9rem;
    padding-inline: 1rem;
    box-shadow: 0 10px 22px rgba(15, 23, 42, 0.06);
}

.school-classroom-library-actions .button.button-secondary {
    background: rgba(255, 255, 255, 0.95);
}

.school-classroom-switch-panel {
    position: sticky;
    top: 1.25rem;
}

.school-classroom-switch-row {
    gap: 0.75rem;
}

.school-classroom-switch-row .button {
    justify-self: start;
}

.school-classroom-main,
.school-classroom-actions {
    display: flex;
    align-items: center;
    gap: 0.95rem;
}

.school-classroom-main {
    min-width: 0;
}

.school-classroom-icon {
    width: 2.7rem;
    height: 2.7rem;
    border-radius: 16px;
    display: inline-grid;
    place-items: center;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
    flex-shrink: 0;
}

.school-classroom-copy {
    display: grid;
    gap: 0.2rem;
    min-width: 0;
    align-content: center;
}

.school-classroom-copy strong {
    margin: 0;
    color: var(--ink);
}

.school-classroom-copy span {
    margin: 0;
    color: var(--mid);
    line-height: 1.6;
}

.school-classroom-reporting-row {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
}

.school-classroom-reporting-body {
    display: grid;
    gap: 0.9rem;
    min-width: 0;
}

.school-classroom-reporting-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.85rem;
    color: var(--mid);
    font-size: 0.82rem;
    line-height: 1.6;
}

.school-classroom-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.75rem;
}

.school-classroom-reporting-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.school-classroom-reporting-card {
    gap: 0;
}

.school-classroom-reporting-compact-body {
    grid-template-columns: minmax(200px, 240px) minmax(0, 1fr);
}

.school-classroom-reporting-compact-shell {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: center;
}

.school-classroom-reporting-compact-stats {
    grid-template-columns: repeat(4, minmax(110px, 1fr));
}

.school-classroom-reporting-actions {
    justify-content: flex-end;
    align-items: center;
    flex-wrap: nowrap;
    flex-shrink: 0;
}

.school-dashboard-classroom-card {
    gap: 0;
}

.school-dashboard-classroom-body {
    grid-template-columns: minmax(200px, 240px) minmax(0, 1fr);
}

.school-dashboard-classroom-shell {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: center;
}

.school-dashboard-classroom-stats {
    grid-template-columns: repeat(4, minmax(110px, 1fr));
}

.school-dashboard-classroom-actions {
    justify-content: flex-end;
    align-items: center;
    flex-wrap: nowrap;
    flex-shrink: 0;
}

.school-classroom-actions {
    justify-content: flex-end;
    flex-wrap: wrap;
}

.school-classroom-actions form,
.school-inline-actions form {
    margin: 0;
}

.school-inline-actions {
    margin-bottom: 0.95rem;
}

.student-notification-center-panel .inline-actions {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    flex-wrap: wrap;
}

.student-notification-center-panel .inline-actions form {
    margin: 0;
}

.school-roster-control-list .school-classroom-actions {
    align-self: stretch;
}

.school-classroom-builder-grid {
    grid-template-columns: minmax(0, 1.25fr) minmax(300px, 0.75fr);
}

.school-package-request-builder-grid {
    grid-template-columns: minmax(0, 1.35fr) minmax(320px, 0.65fr);
    align-items: start;
}

.school-package-request-form {
    display: grid;
    gap: 1.1rem;
}

.school-package-request-form .panel-head {
    align-items: flex-start;
}

.school-package-request-form .panel-head p,
.school-package-section-head p,
.school-package-quote-total p {
    margin: 0.35rem 0 0;
    color: var(--muted);
}

.school-package-form-section {
    display: grid;
    gap: 1rem;
    padding: 1rem;
    border: 1px solid var(--workspace-card-border);
    border-radius: 24px;
    background:
        radial-gradient(circle at top left, rgba(26, 107, 107, 0.07), transparent 34%),
        rgba(255, 255, 255, 0.72);
}

.school-package-section-head {
    display: flex;
    align-items: flex-start;
    gap: 0.85rem;
}

.school-package-section-head h4 {
    margin: 0;
    font-family: "Playfair Display", serif;
    font-size: 1.18rem;
}

.school-package-section-icon {
    width: 2.6rem;
    height: 2.6rem;
    border-radius: 17px;
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    color: var(--teal);
    background: rgba(26, 107, 107, 0.1);
}

.school-package-contact-grid,
.school-package-date-grid,
.school-package-allocation-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.9rem;
}

.school-package-duration-options {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.8rem;
}

.school-package-duration-option {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-height: 82px;
    padding: 0.9rem 1rem;
    border: 1px solid rgba(26, 107, 107, 0.18);
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.82);
    cursor: pointer;
    transition: border-color 180ms ease, background 180ms ease, transform 180ms ease;
}

.school-package-duration-option:has(input:checked) {
    border-color: var(--teal);
    background: rgba(232, 244, 244, 0.92);
    transform: translateY(-1px);
}

.school-package-duration-option input {
    width: 1.15rem;
    height: 1.15rem;
    accent-color: var(--teal);
}

.school-package-duration-option span,
.school-package-duration-summary {
    display: grid;
    gap: 0.2rem;
}

.school-package-duration-option > span {
    min-width: 0;
}

.school-package-duration-option small,
.school-package-duration-summary span {
    color: var(--muted);
}

.school-package-duration-benefit {
    display: inline-flex;
    align-items: center;
    justify-self: start;
    gap: 0.4rem;
    margin-top: 0.35rem;
    padding: 0.32rem 0.55rem;
    border-radius: 999px;
    color: #6c4a04;
    background: rgba(234, 181, 46, 0.18);
    font-family: "Space Mono", monospace;
    font-size: 0.58rem;
    font-style: normal;
    font-weight: 800;
    letter-spacing: 0.06em;
    line-height: 1.35;
    text-transform: uppercase;
}

.school-package-duration-summary {
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 0.55rem 1rem;
    padding: 1rem;
    border-radius: 20px;
    background: rgba(232, 244, 244, 0.78);
}

.yearly-assessment-benefit[hidden],
.yearly-assessment-quote-line[hidden] {
    display: none !important;
}

.yearly-assessment-benefit {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: center;
    overflow: hidden;
    padding: 1.15rem;
    border: 1px solid rgba(188, 137, 13, 0.3);
    border-radius: 22px;
    background:
        radial-gradient(circle at 96% 8%, rgba(255, 211, 92, 0.26), transparent 32%),
        linear-gradient(125deg, rgba(255, 249, 226, 0.98), rgba(232, 245, 240, 0.94));
    box-shadow: 0 18px 42px rgba(81, 66, 22, 0.09);
    animation: yearly-benefit-arrive 360ms ease both;
}

.yearly-assessment-benefit::after {
    position: absolute;
    top: -70%;
    left: -20%;
    width: 22%;
    height: 240%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.58), transparent);
    content: "";
    pointer-events: none;
    transform: rotate(18deg);
    animation: yearly-benefit-shine 900ms 180ms ease-out both;
}

.yearly-assessment-benefit-icon,
.yearly-assessment-quote-icon {
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    color: #fff;
    background: linear-gradient(145deg, #147775, #0d5354);
    box-shadow: 0 9px 22px rgba(13, 83, 84, 0.2);
}

.yearly-assessment-benefit-icon {
    width: 3.2rem;
    height: 3.2rem;
    border-radius: 18px;
    font-size: 1.15rem;
}

.yearly-assessment-benefit-copy {
    min-width: 0;
}

.yearly-assessment-benefit-copy h5,
.yearly-assessment-benefit-copy p {
    margin: 0;
}

.yearly-assessment-benefit-copy h5 {
    margin-top: 0.18rem;
    color: var(--ink);
    font-family: "Playfair Display", serif;
    font-size: clamp(1.08rem, 2vw, 1.32rem);
    line-height: 1.15;
}

.yearly-assessment-benefit-copy > p:not(.eyebrow-inline) {
    margin-top: 0.35rem;
    color: var(--muted);
    font-size: 0.9rem;
    line-height: 1.5;
}

.yearly-assessment-benefit-points {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    margin-top: 0.7rem;
}

.yearly-assessment-benefit-points span {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.34rem 0.52rem;
    border-radius: 999px;
    color: #165b59;
    background: rgba(20, 119, 117, 0.1);
    font-size: 0.72rem;
    font-weight: 800;
}

.yearly-assessment-benefit-value {
    display: grid;
    justify-items: end;
    gap: 0.12rem;
    min-width: 5.8rem;
    padding: 0.72rem 0.8rem;
    border: 1px solid rgba(188, 137, 13, 0.2);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.72);
}

.yearly-assessment-benefit-value small,
.yearly-assessment-quote-value small {
    color: var(--muted);
    font-family: "Space Mono", monospace;
    font-size: 0.56rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.yearly-assessment-benefit-value strong {
    color: #147775;
    font-size: 1.05rem;
}

.yearly-assessment-quote-line {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0.75rem;
    align-items: center;
    padding: 0.85rem;
    border: 1px solid rgba(188, 137, 13, 0.28);
    border-radius: 18px;
    background: linear-gradient(125deg, rgba(255, 248, 221, 0.95), rgba(235, 246, 242, 0.92));
    animation: yearly-benefit-arrive 320ms ease both;
}

.yearly-assessment-quote-icon {
    width: 2.45rem;
    height: 2.45rem;
    border-radius: 13px;
}

.yearly-assessment-quote-line > div:not(.yearly-assessment-quote-value) {
    display: grid;
    min-width: 0;
    gap: 0.12rem;
}

.yearly-assessment-quote-line > div > span {
    color: #76530a;
    font-family: "Space Mono", monospace;
    font-size: 0.58rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.yearly-assessment-quote-line > div > strong {
    color: var(--ink);
    line-height: 1.25;
}

.yearly-assessment-quote-line > div > small {
    color: var(--muted);
}

.yearly-assessment-quote-value {
    display: grid;
    justify-items: end;
    gap: 0.12rem;
    text-align: right;
}

.yearly-assessment-quote-value strong {
    color: #147775 !important;
}

@keyframes yearly-benefit-arrive {
    from { opacity: 0; transform: translateY(6px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes yearly-benefit-shine {
    from { left: -20%; opacity: 0; }
    35% { opacity: 1; }
    to { left: 115%; opacity: 0; }
}

.school-package-date-grid {
    display: grid;
    align-items: start;
}

.school-package-date-grid input {
    width: 100%;
}

.school-package-date-grid .is-annual {
    opacity: 0.78;
}

.school-package-subject-list {
    display: grid;
    gap: 0.95rem;
}

.school-package-subject-card {
    display: grid;
    gap: 0.85rem;
    padding: 1rem;
    border: 1px solid rgba(26, 107, 107, 0.15);
    border-radius: 22px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(232, 244, 244, 0.72)),
        #fff;
    box-shadow: 0 16px 36px rgba(13, 13, 13, 0.045);
    transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease, background 180ms ease;
}

.school-package-subject-card.is-selected {
    border-color: rgba(26, 107, 107, 0.38);
    background:
        linear-gradient(135deg, rgba(232, 244, 244, 0.95), rgba(255, 248, 229, 0.75)),
        #fff;
    box-shadow: 0 20px 46px rgba(26, 107, 107, 0.09);
    transform: translateY(-1px);
}

.school-package-subject-card.is-incomplete {
    border-color: rgba(201, 168, 76, 0.6);
}

.school-package-subject-toggle {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0.85rem;
    align-items: center;
    cursor: pointer;
}

.school-package-subject-toggle input {
    width: 1.1rem;
    height: 1.1rem;
    accent-color: var(--teal);
}

.school-package-subject-copy,
.school-package-subject-price,
.school-package-quote-total {
    display: grid;
    gap: 0.2rem;
}

.school-package-subject-copy strong,
.school-package-subject-price strong,
.school-package-quote-total strong {
    color: var(--ink);
}

.school-package-subject-copy small,
.school-package-subject-price small,
.school-package-quote-total span {
    font-family: "Space Mono", monospace;
    font-size: 0.63rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--teal);
}

.school-package-subject-price {
    justify-items: end;
    text-align: right;
    padding: 0.6rem 0.75rem;
    border-radius: 16px;
    background: rgba(201, 168, 76, 0.12);
}

.school-package-minimum-pill {
    justify-self: start;
}

.school-package-allocation-field {
    display: grid;
    gap: 0.45rem;
    transition: opacity 180ms ease, filter 180ms ease;
}

.school-package-allocation-field.is-disabled {
    opacity: 0.48;
    filter: grayscale(0.25);
}

.school-package-allocation-field label {
    font-family: "Space Mono", monospace;
    font-size: 0.62rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--teal);
}

.school-package-allocation-field input,
.school-package-contact-grid input,
.school-package-form-section textarea {
    width: 100%;
}

.school-package-slot-stepper {
    display: grid;
    grid-template-columns: 2.7rem minmax(4rem, 1fr) 2.7rem;
    align-items: stretch;
    overflow: hidden;
    min-height: 46px;
    border: 1px solid rgba(26, 107, 107, 0.2);
    border-radius: 16px;
    background: #fff;
}

.school-package-slot-stepper input {
    min-width: 0;
    padding-inline: 0.4rem;
    border: 0;
    border-inline: 1px solid rgba(26, 107, 107, 0.14);
    border-radius: 0;
    text-align: center;
    appearance: textfield;
}

.school-package-slot-stepper input::-webkit-inner-spin-button,
.school-package-slot-stepper input::-webkit-outer-spin-button {
    margin: 0;
    appearance: none;
}

.school-package-slot-stepper button {
    border: 0;
    color: var(--teal);
    background: rgba(232, 244, 244, 0.65);
    cursor: pointer;
}

.school-package-slot-stepper button:hover,
.school-package-slot-stepper button:focus-visible {
    color: #fff;
    background: var(--teal);
}

.school-package-action-row {
    margin-top: 0;
}

.school-package-renewal-note {
    display: flex;
    gap: 0.85rem;
    align-items: flex-start;
    margin-bottom: 1rem;
    padding: 1rem;
    border-radius: 24px;
    border: 1px solid rgba(26, 107, 107, 0.18);
    background:
        linear-gradient(135deg, rgba(232, 244, 244, 0.78), rgba(255, 248, 232, 0.74)),
        #fff;
    box-shadow: var(--workspace-card-shadow);
}

.school-package-renewal-note h3,
.school-package-renewal-note p {
    margin: 0;
}

.school-package-renewal-note p {
    color: var(--muted);
}

.school-package-quote-panel {
    display: grid;
    gap: 1rem;
    position: sticky;
    top: 1rem;
}

.school-package-quote-total {
    padding: 1rem;
    border-radius: 22px;
    border: 1px solid rgba(26, 107, 107, 0.14);
    background: rgba(232, 244, 244, 0.62);
}

.school-package-quote-total strong {
    font-family: "Playfair Display", serif;
    font-size: clamp(1.85rem, 4vw, 2.55rem);
    line-height: 1;
}

.school-package-quote-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.65rem;
}

.school-package-quote-stats div {
    display: grid;
    gap: 0.2rem;
    padding: 0.75rem;
    border: 1px solid var(--workspace-card-border);
    border-radius: 17px;
    background: rgba(255, 255, 255, 0.78);
}

.school-package-quote-stats span,
.school-package-quote-line span,
.school-package-warning-list p,
.school-package-empty-line {
    font-family: "Space Mono", monospace;
    font-size: 0.62rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.school-package-quote-stats span,
.school-package-quote-line span {
    color: var(--teal);
}

.school-package-quote-stats strong {
    color: var(--ink);
}

.school-package-quote-lines,
.school-package-warning-list {
    display: grid;
    gap: 0.55rem;
}

.school-package-quote-line {
    display: grid;
    gap: 0.25rem;
    padding: 0.75rem;
    border-radius: 17px;
    border: 1px solid rgba(26, 107, 107, 0.12);
    background: rgba(255, 255, 255, 0.78);
}

.school-package-quote-line strong {
    color: var(--ink);
}

.school-package-empty-line,
.school-package-warning-list p {
    margin: 0;
    padding: 0.75rem;
    border-radius: 16px;
}

.school-package-empty-line {
    color: var(--muted);
    background: rgba(13, 13, 13, 0.035);
}

.school-package-warning-list p {
    color: #7a4d00;
    background: rgba(201, 168, 76, 0.14);
    border: 1px solid rgba(201, 168, 76, 0.28);
}

.school-package-review-steps {
    display: grid;
    gap: 0.75rem;
}

.school-package-review-steps div {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem;
    border: 1px solid var(--workspace-card-border);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.78);
}

.school-package-review-steps span {
    width: 2rem;
    height: 2rem;
    border-radius: 13px;
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    color: var(--teal);
    background: rgba(26, 107, 107, 0.1);
}

.school-package-review-steps p {
    margin: 0;
}

.school-invoice-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.school-package-invoice {
    overflow: hidden;
    border: 1px solid var(--workspace-card-border);
    border-radius: 28px;
    background: #fff;
    box-shadow: var(--workspace-card-shadow);
}

.school-package-invoice-head,
.school-package-invoice-parties,
.school-package-invoice-total {
    display: grid;
    gap: 1rem;
    padding: 1.4rem;
}

.school-package-invoice-head {
    grid-template-columns: minmax(0, 1fr) auto;
    color: #fff;
    background: linear-gradient(120deg, #123f42, var(--teal));
}

.school-package-invoice-head h2,
.school-package-invoice-head p {
    margin: 0;
}

.school-package-invoice-reference,
.school-package-invoice-parties > div,
.school-package-invoice-total > div {
    display: grid;
    gap: 0.3rem;
}

.school-package-invoice-reference {
    justify-items: end;
    text-align: right;
}

.school-package-invoice-head span,
.school-package-invoice-parties span,
.school-package-invoice-total span {
    font-family: "Space Mono", monospace;
    font-size: 0.65rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.school-package-invoice-parties {
    grid-template-columns: 1.3fr 1fr 0.7fr;
    border-bottom: 1px solid var(--workspace-card-border);
}

.school-package-invoice-parties p,
.school-package-invoice-total p {
    margin: 0;
    color: var(--muted);
}

.school-package-invoice-table-wrap {
    overflow-x: auto;
    padding: 0 1.4rem;
}

.school-package-invoice-table {
    width: 100%;
    border-collapse: collapse;
}

.school-package-invoice-table th,
.school-package-invoice-table td {
    padding: 1rem 0.75rem;
    border-bottom: 1px solid var(--workspace-card-border);
    text-align: left;
}

.school-package-invoice-table td small {
    display: block;
    color: var(--muted);
}

.school-package-invoice-total {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    background: rgba(232, 244, 244, 0.52);
}

.school-package-invoice-total > div:last-child {
    justify-items: end;
}

.school-package-invoice-total > div:last-child strong {
    font-family: "Playfair Display", serif;
    font-size: clamp(1.8rem, 4vw, 2.7rem);
    color: var(--teal);
}

@media (max-width: 760px) {
    .school-package-request-form,
    .school-package-quote-panel {
        padding: 1rem;
    }

    .school-package-contact-grid,
    .school-package-date-grid,
    .school-package-duration-options,
    .school-package-allocation-grid {
        grid-template-columns: 1fr;
    }

    .school-package-subject-toggle {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .school-package-subject-price {
        grid-column: 1 / -1;
        justify-items: start;
        text-align: left;
    }

    .school-package-renewal-note {
        flex-direction: column;
    }

    .school-package-action-row {
        display: grid;
        grid-template-columns: 1fr;
    }

    .school-package-quote-stats {
        grid-template-columns: 1fr;
    }

    .yearly-assessment-benefit {
        grid-template-columns: auto minmax(0, 1fr);
        align-items: start;
    }

    .yearly-assessment-benefit-value {
        grid-column: 1 / -1;
        grid-template-columns: 1fr auto;
        justify-items: start;
        align-items: center;
        width: 100%;
    }

    .yearly-assessment-benefit-value strong {
        justify-self: end;
    }

    .yearly-assessment-quote-line {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .yearly-assessment-quote-value {
        grid-column: 2;
        grid-template-columns: auto auto;
        justify-content: start;
        gap: 0.5rem;
        text-align: left;
    }

    .school-package-invoice-head,
    .school-package-invoice-parties,
    .school-package-invoice-total {
        grid-template-columns: 1fr;
    }

    .school-package-invoice-reference,
    .school-package-invoice-total > div:last-child {
        justify-items: start;
        text-align: left;
    }

    .school-invoice-toolbar {
        display: grid;
    }

    .school-invoice-toolbar .button {
        width: 100%;
    }

    .school-package-structured-row,
    .school-package-subscription-subject {
        grid-template-columns: 1fr;
    }

    .school-package-structured-row .school-package-request-meta,
    .school-package-request-meta {
        grid-template-columns: 1fr;
    }

    .school-package-subscription-subject-stats {
        justify-content: flex-start;
    }

    .admin-package-subject-review-head,
    .admin-package-subject-review-stats,
    .admin-package-review-actions {
        grid-template-columns: 1fr;
    }

    .admin-package-activation-card {
        flex-direction: column;
    }
}

/* Phase 6: compact admin queues with details available on demand. */
.admin-progressive-row,
.admin-operational-row.admin-progressive-row,
.admin-payment-queue-row.admin-progressive-row,
.oversight-course-row.admin-progressive-row,
.admin-ges-review-card.admin-progressive-row,
.tutor-application-row.admin-progressive-row {
    display: block;
    padding: 0;
    overflow: hidden;
}

.admin-progressive-disclosure {
    display: block;
    width: 100%;
}

.admin-progressive-summary {
    display: grid;
    grid-template-columns: minmax(280px, 1.3fr) minmax(300px, 0.9fr) auto;
    gap: 1rem;
    align-items: center;
    min-height: 94px;
    padding: 1rem 1.05rem 1rem 1.2rem;
    cursor: pointer;
    list-style: none;
}

.admin-progressive-summary::-webkit-details-marker,
.admin-package-stage-disclosure > summary::-webkit-details-marker,
.admin-package-card-disclosure > summary::-webkit-details-marker {
    display: none;
}

.admin-progressive-summary::marker,
.admin-package-stage-disclosure > summary::marker,
.admin-package-card-disclosure > summary::marker {
    content: "";
}

.admin-progressive-summary:focus-visible,
.admin-package-stage-disclosure > summary:focus-visible,
.admin-package-card-disclosure > summary:focus-visible {
    outline: 3px solid rgba(26, 107, 107, 0.28);
    outline-offset: -3px;
}

.admin-progressive-summary .admin-operational-main,
.admin-progressive-summary .tutor-application-main {
    min-width: 0;
}

.admin-progressive-summary .admin-operational-main > span:last-child,
.admin-progressive-summary .tutor-application-main > span:last-child {
    display: grid;
    gap: 0.18rem;
    min-width: 0;
}

.admin-progressive-title {
    display: block;
    color: var(--ink);
    font-family: var(--font-display, Georgia, serif);
    font-size: 1.05rem;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.admin-progressive-copy {
    display: block;
    color: var(--mid);
    font-size: 0.86rem;
    line-height: 1.4;
    overflow-wrap: anywhere;
}

.admin-progressive-summary-meta {
    display: grid;
    grid-template-columns: auto repeat(2, minmax(90px, 1fr));
    gap: 0.65rem;
    align-items: center;
    min-width: 0;
}

.admin-progressive-summary-meta > span:not(.pill):not(.status-pill) {
    display: grid;
    gap: 0.15rem;
    min-width: 0;
}

.admin-progressive-summary-meta small {
    color: var(--teal);
    font-family: var(--mono);
    font-size: 0.56rem;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.admin-progressive-summary-meta strong {
    color: var(--ink);
    font-size: 0.78rem;
    line-height: 1.3;
    overflow-wrap: anywhere;
}

.admin-progressive-toggle,
.admin-package-card-toggle,
.admin-package-stage-state {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    color: #fff;
    border-radius: 12px;
    background: var(--teal);
    font-size: 0.78rem;
    font-weight: 800;
    white-space: nowrap;
}

.admin-progressive-toggle {
    min-height: 42px;
    padding: 0.7rem 0.85rem;
}

.admin-progressive-toggle i,
.admin-package-card-toggle i,
.admin-package-stage-state i:last-child {
    transition: transform 0.2s ease;
}

.admin-progressive-disclosure[open] .admin-progressive-toggle i,
.admin-package-card-disclosure[open] .admin-package-card-toggle i,
.admin-package-stage-disclosure[open] .admin-package-stage-state i:last-child {
    transform: rotate(180deg);
}

.admin-progressive-detail {
    display: grid;
    gap: 0.9rem;
    padding: 1rem 1.05rem 1.05rem 1.2rem;
    border-top: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.52);
}

.admin-progressive-detail .admin-operational-actions,
.admin-progressive-detail .admin-payment-queue-actions,
.admin-progressive-detail .admin-ges-review-actions,
.admin-progressive-detail > .button-row {
    justify-content: flex-start;
    padding-top: 0.8rem;
    border-top: 1px solid rgba(15, 23, 42, 0.07);
}

.admin-package-stage-disclosure > .admin-package-stage-header {
    grid-template-columns: 54px minmax(0, 1fr) auto;
    cursor: pointer;
    list-style: none;
}

.admin-package-stage-header > .admin-package-stage-state {
    width: auto;
    height: auto;
    min-height: 42px;
    padding: 0.65rem 0.8rem;
    align-self: center;
    border: 0;
    border-radius: 12px;
    background: var(--teal);
    color: #fff;
    font-family: inherit;
    font-size: 0.75rem;
    letter-spacing: 0;
}

.admin-package-stage-body {
    display: grid;
    gap: 1rem;
}

.admin-package-card-disclosure {
    min-width: 0;
}

.admin-package-card-disclosure > .panel-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 0.75rem;
    align-items: center;
    cursor: pointer;
    list-style: none;
}

.admin-package-card-toggle {
    min-height: 34px;
    padding: 0.52rem 0.7rem;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
    font-size: 0.7rem;
}

.admin-package-card-disclosure-body {
    display: grid;
    gap: 1rem;
    padding-top: 0.9rem;
    border-top: 1px solid rgba(15, 23, 42, 0.07);
}

.admin-package-card-disclosure:not([open]) {
    align-self: start;
}

@media (max-width: 1180px) {
    .admin-progressive-summary {
        grid-template-columns: minmax(250px, 1fr) minmax(250px, 0.85fr);
    }

    .admin-progressive-toggle {
        grid-column: 1 / -1;
        justify-self: start;
    }
}

@media (max-width: 760px) {
    .admin-progressive-summary,
    .admin-package-stage-disclosure > .admin-package-stage-header,
    .admin-package-card-disclosure > .panel-head {
        grid-template-columns: 1fr;
    }

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

    .admin-progressive-summary-meta > .pill,
    .admin-progressive-summary-meta > .status-pill {
        grid-column: 1 / -1;
        justify-self: start;
    }

    .admin-progressive-toggle,
    .admin-package-stage-header > .admin-package-stage-state,
    .admin-package-card-toggle {
        justify-self: stretch;
    }

    .admin-package-stage-disclosure > .admin-package-stage-header > span:first-child {
        width: 42px;
        height: 42px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .admin-progressive-toggle i,
    .admin-package-card-toggle i,
    .admin-package-stage-state i:last-child {
        transition: none;
    }
}

@media print {
    .school-invoice-toolbar,
    .app-sidebar,
    .dashboard-topbar,
    .dashboard-mobile-nav {
        display: none !important;
    }

    .school-package-invoice {
        border: 0;
        box-shadow: none;
    }
}

.school-classroom-detail-grid {
    grid-template-columns: minmax(0, 1fr) minmax(280px, 0.7fr);
}

.school-classroom-overview-block {
    display: grid;
    gap: 0.9rem;
    margin-top: 1rem;
}

.school-classroom-overview-grid {
    margin-top: 0.35rem;
}

.school-classroom-overview-merged-grid {
    margin-top: 0.5rem;
}

.school-classroom-overview-block .panel-head {
    margin-bottom: 0;
}

.school-classroom-distribution-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    gap: 0.85rem;
}

.school-classroom-distribution-card {
    display: grid;
    gap: 0.35rem;
    padding: 1rem;
    border-radius: var(--workspace-card-radius);
    border: 1px solid var(--workspace-card-border);
    background: rgba(255, 255, 255, 0.88);
    box-shadow: var(--workspace-card-shadow);
}

.school-classroom-distribution-icon {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 16px;
    display: inline-grid;
    place-items: center;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
}

.school-classroom-distribution-card span:not(.school-classroom-distribution-icon) {
    font-family: "Space Mono", monospace;
    font-size: 0.62rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--teal);
}

.school-classroom-distribution-card strong {
    font-size: 1.1rem;
    color: var(--ink);
}

.school-classroom-distribution-card p {
    margin: 0;
    color: var(--mid);
    line-height: 1.6;
}

.school-classroom-note-card {
    grid-column: 1 / -1;
}

.school-classroom-roster-list {
    gap: 1rem;
}

.school-classroom-roster-card {
    display: grid;
    gap: 0.9rem;
    align-items: stretch;
    padding: 1.15rem 1.2rem;
    border-radius: 22px;
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.05), transparent 34%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(246, 249, 249, 0.94));
}

.school-classroom-roster-actions {
    justify-content: flex-end;
    align-items: center;
}

.school-classroom-roster-actions .button {
    min-height: 2.85rem;
    white-space: nowrap;
}

.school-classroom-roster-shell {
    display: grid;
    grid-template-columns: minmax(180px, auto) minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: center;
}

.school-classroom-form {
    display: grid;
    gap: 1.15rem;
}

.school-classroom-form .form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.school-classroom-form .form-field {
    display: grid;
    gap: 0.45rem;
}

.school-classroom-form .form-field.full-span {
    grid-column: 1 / -1;
}

.school-classroom-form .form-field label {
    font-weight: 700;
    color: var(--ink);
}

.school-classroom-form .form-field input[type="text"],
.school-classroom-form .form-field textarea,
.school-classroom-form .form-field select {
    width: 100%;
}

.school-classroom-form .form-field small {
    color: var(--mid);
    line-height: 1.6;
}

.school-classroom-form .form-field input[type="checkbox"] {
    width: auto;
    margin: 0;
}

.school-classroom-form .form-field.checkbox-field {
    align-content: start;
    padding: 0.95rem 1rem;
    border-radius: 16px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.82);
}

.school-classroom-form .checkbox-label {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
}

.school-pricing-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.85rem;
    margin-top: 1.15rem;
}

.school-plan-compare-list,
.school-package-compare-shell {
    display: grid;
    gap: 0.95rem;
}

.school-plan-compare-item,
.school-package-compare-row {
    padding: 1rem 1.05rem;
    border-radius: 16px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.88);
    display: grid;
    gap: 0.35rem;
}

.school-plan-compare-item strong,
.school-package-compare-feature strong {
    color: var(--ink);
}

.school-plan-compare-item span,
.school-plan-compare-item p,
.school-package-compare-values span {
    color: var(--mid);
    line-height: 1.6;
    margin: 0;
}

.school-plan-compare-item.is-school-plan {
    border-color: rgba(26, 107, 107, 0.22);
    background: rgba(26, 107, 107, 0.06);
}

.school-package-compare-row {
    grid-template-columns: minmax(180px, 0.8fr) minmax(0, 1.2fr);
    align-items: center;
    gap: 1rem;
}

.school-package-compare-values {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem 1rem;
}

.form-errors,
.field-errors {
    padding: 0.85rem 1rem;
    border-radius: 14px;
    border: 1px solid rgba(168, 50, 50, 0.18);
    background: rgba(168, 50, 50, 0.08);
    color: #7a2323;
}

.form-errors p,
.field-errors p {
    margin: 0;
}

.form-error-summary {
    margin-bottom: 1rem;
}

.form-error-summary ul {
    display: grid;
    gap: 0.35rem;
    margin: 0.65rem 0 0;
    padding-left: 1.2rem;
}

.form-error-summary a {
    color: #6f1d1d;
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 0.18em;
}

[aria-invalid="true"] {
    border-color: #9b2f2f !important;
    box-shadow: 0 0 0 2px rgba(155, 47, 47, 0.12);
}

.danger-button {
    border-color: rgba(168, 50, 50, 0.2);
    color: #8c2f2f;
}

.role-summary-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    margin-bottom: 1.6rem;
}

.role-summary-card {
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.96), rgba(245, 240, 232, 0.9));
    border: 1px solid var(--border);
    border-radius: 6px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
    padding: 1.2rem 1.35rem;
    display: grid;
    gap: 0.5rem;
}

.role-summary-card strong {
    font-size: 0.96rem;
    line-height: 1.45;
}

.role-summary-card p {
    color: var(--mid);
    font-size: 0.84rem;
    line-height: 1.65;
}

.role-guide-list {
    margin-top: 1.4rem;
    display: grid;
    gap: 0.9rem;
}

.role-guide-card {
    padding: 1rem 1.05rem;
    border: 1px solid var(--border);
    background: rgba(255, 255, 255, 0.72);
}

.role-guide-card strong {
    display: block;
    margin-bottom: 0.25rem;
    font-size: 0.9rem;
}

.role-guide-card p {
    font-size: 0.84rem;
    line-height: 1.6;
    color: var(--mid);
}

.classroom-entry-section {
    padding-bottom: 4.5rem;
}

.classroom-entry-grid {
    align-items: start;
    gap: 2rem;
}

.classroom-entry-copy {
    display: grid;
    gap: 1rem;
}

.classroom-entry-copy h1 {
    margin: 0;
}

.classroom-entry-copy > p {
    margin: 0;
    color: var(--mid);
    line-height: 1.75;
    max-width: 60ch;
}

.classroom-entry-steps {
    display: grid;
    gap: 0.9rem;
    margin-top: 0.25rem;
}

.classroom-entry-step {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.85rem;
    align-items: start;
    padding: 1rem 1.05rem;
    border-radius: 18px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.82);
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.04);
}

.classroom-entry-step-number {
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 999px;
    display: inline-grid;
    place-items: center;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
    font-weight: 700;
    flex-shrink: 0;
}

.classroom-entry-step strong {
    display: block;
    margin-bottom: 0.22rem;
    color: var(--ink);
}

.classroom-entry-step p {
    margin: 0;
    color: var(--mid);
    line-height: 1.65;
    font-size: 0.9rem;
}

.classroom-entry-note {
    display: grid;
    gap: 0.32rem;
    padding: 1rem 1.05rem;
    border-radius: 18px;
    border: 1px solid rgba(26, 107, 107, 0.14);
    background: linear-gradient(180deg, rgba(232, 244, 244, 0.92), rgba(255, 255, 255, 0.94));
}

.classroom-entry-note strong {
    color: var(--ink);
}

.classroom-entry-note p {
    margin: 0;
    color: var(--mid);
    line-height: 1.65;
}

.classroom-entry-card {
    display: grid;
    gap: 1.15rem;
    padding: 1.35rem 1.35rem 1.25rem;
    border-radius: 24px;
    background:
        radial-gradient(circle at top right, rgba(201, 168, 76, 0.12), transparent 34%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(246, 242, 234, 0.96));
    box-shadow: 0 20px 44px rgba(15, 23, 42, 0.08);
}

.classroom-entry-card-head {
    display: grid;
    gap: 0.35rem;
}

.classroom-entry-card-head h2 {
    margin: 0;
}

.classroom-entry-card-head p:last-child {
    margin: 0;
    color: var(--mid);
    line-height: 1.7;
}

.classroom-entry-form {
    gap: 1rem;
}

.classroom-entry-row {
    gap: 0.85rem;
}

.classroom-entry-field {
    gap: 0.35rem;
}

.classroom-entry-field > span {
    font-size: 0.84rem;
    font-weight: 700;
    color: var(--ink);
}

.classroom-entry-field > small {
    color: var(--mid);
    font-size: 0.79rem;
    line-height: 1.55;
}

.classroom-entry-form input {
    min-height: 54px;
    padding: 0.95rem 1rem;
    border-radius: 16px;
    border-width: 1px;
    font-size: 0.98rem;
}

.classroom-entry-submit {
    width: 100%;
    min-height: 52px;
    justify-content: center;
}

.classroom-entry-links {
    display: grid;
    gap: 0.35rem;
}

.dashboard-stat-grid {
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
    margin-bottom: 1.8rem;
}

.dashboard-stat-grid .stat-card {
    padding: 1.3rem 1.5rem;
}

.dashboard-grid {
    grid-template-columns: 2fr 1fr;
    gap: 1.5rem;
}

.dashboard-grid .wide-panel {
    grid-column: 1 / -1;
}

.content-panel {
    padding: 1.2rem 1.5rem;
    overflow: hidden;
}

.panel-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1rem;
}

.panel-title-with-icon {
    display: inline-flex;
    align-items: center;
    gap: 0.7rem;
    margin: 0;
}

.panel-title-icon {
    width: 2.2rem;
    height: 2.2rem;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(230, 241, 241, 0.96);
    border: 1px solid rgba(15, 76, 92, 0.1);
    color: var(--teal);
    box-shadow: 0 10px 22px rgba(15, 76, 92, 0.08);
    flex-shrink: 0;
}

.panel-title-icon i {
    font-size: 0.95rem;
}

.progress-item + .progress-item {
    margin-top: 1rem;
}

.progress-item p {
    margin-top: 0.45rem;
    font-size: 0.8rem;
    color: var(--mid);
}

.progress-meta {
    display: flex;
    justify-content: space-between;
    font-size: 0.76rem;
    color: var(--mid);
    margin-bottom: 0.35rem;
}

.progress-bar {
    height: 6px;
    background: rgba(0, 0, 0, 0.07);
    border-radius: 3px;
    overflow: hidden;
}

.progress-bar span {
    display: block;
    height: 100%;
    background: var(--teal);
    border-radius: 3px;
}

.lesson-layout {
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
}

.lesson-player-shell {
    gap: 1.25rem;
}

.lesson-hero-band {
    display: none;
    background:
        radial-gradient(circle at top right, rgba(201, 168, 76, 0.22), transparent 34%),
        linear-gradient(135deg, rgba(18, 102, 105, 0.98), rgba(46, 158, 158, 0.96));
    box-shadow: 0 18px 48px rgba(26, 107, 107, 0.18);
}

.lesson-hero-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    margin-top: 0.9rem;
}

.lesson-hero-band .eyebrow-inline {
    color: var(--gold-light);
}

.lesson-hero-band h2,
.lesson-hero-band p {
    color: #fff;
}

.lesson-hero-band p {
    color: rgba(255, 255, 255, 0.82);
}

.lesson-hero-band .pill {
    border-color: rgba(255, 255, 255, 0.18);
    background: rgba(255, 255, 255, 0.14);
    color: #fff;
}

.lesson-hero-actions {
    align-items: flex-start;
}

.lesson-snapshot-grid {
    margin-bottom: 0;
}

.lesson-layout-revamp {
    align-items: start;
    gap: 1.25rem;
}

.lesson-player {
    display: grid;
    gap: 1.5rem;
    min-width: 0;
}

.lesson-video-showcase {
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 24px 48px rgba(15, 23, 42, 0.12);
}

@media (min-width: 961px) {
    .interactive-video-page .lesson-player-shell {
        gap: 0.9rem;
    }

    .interactive-video-page .lesson-hero-band {
        padding: 1rem 1.15rem;
    }

    .interactive-video-page .lesson-video-showcase {
        width: min(100%, 960px, calc((100vh - 200px) * 16 / 9));
        margin-inline: auto;
    }

    .interactive-video-page .lesson-video-showcase-head,
    .interactive-video-page .interactive-video-toolbar {
        padding: 0.7rem 0.95rem;
    }

    .interactive-video-page .lesson-hero-band h2 {
        font-size: clamp(1.45rem, 2vw, 2rem);
    }
}

.lesson-video-showcase-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.25rem 1.35rem 1rem;
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.94), rgba(17, 24, 39, 0.82));
}

.lesson-video-showcase-head h3 {
    margin: 0.35rem 0 0;
    font-size: 1.12rem;
    color: #fff;
}

.lesson-video-showcase-actions {
    display: flex;
    gap: 0.65rem;
    flex-wrap: wrap;
}

.lesson-video-showcase .eyebrow-inline {
    color: rgba(255, 255, 255, 0.72);
}

.lesson-journey-panel {
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.06), transparent 34%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(246, 242, 234, 0.92));
}

.lesson-insight-grid {
    display: grid;
    grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.25fr);
    gap: 1rem;
}

.lesson-journey-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.85rem;
}

.lesson-journey-card {
    display: grid;
    gap: 0.28rem;
    padding: 0.95rem 1rem;
    border-radius: 16px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.88);
    transition: transform 0.22s ease, box-shadow 0.24s ease, border-color 0.22s ease, background-color 0.22s ease;
}

.lesson-journey-card:active {
    transform: scale(0.992);
}

.lesson-journey-card span {
    font-family: "Space Mono", monospace;
    font-size: 0.66rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--teal);
}

.lesson-journey-card strong {
    font-size: 0.98rem;
    line-height: 1.45;
    color: var(--ink);
}

.lesson-journey-card p {
    margin: 0;
    color: var(--mid);
    line-height: 1.6;
    font-size: 0.84rem;
}

.lesson-journey-actions {
    margin-top: 1rem;
    gap: 0.75rem;
}

.learner-course-journey-panel {
    gap: 1rem;
}

.learner-course-journey-actions {
    gap: 0.75rem;
    width: 100%;
}

.learner-course-journey-actions .button {
    justify-content: center;
}

@media (max-width: 960px) {
    .learner-course-journey-head {
        flex-direction: column;
        align-items: flex-start;
    }
}

.learner-course-snapshot-panel {
    background:
        radial-gradient(circle at top right, rgba(201, 168, 76, 0.08), transparent 32%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(246, 242, 234, 0.92));
}

.learner-course-snapshot-grid {
    display: grid;
    gap: 0.85rem;
}

.learner-course-snapshot-card {
    display: grid;
    gap: 0.3rem;
    padding: 0.95rem 1rem;
    border-radius: 16px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.88);
}

.learner-course-snapshot-card span {
    font-family: "Space Mono", monospace;
    font-size: 0.66rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--teal);
}

.learner-course-snapshot-card strong {
    font-size: 0.98rem;
    line-height: 1.45;
    color: var(--ink);
}

.learner-course-snapshot-card p {
    margin: 0;
    color: var(--mid);
    line-height: 1.6;
    font-size: 0.84rem;
}

.video-panel {
    background: #111;
    color: #fff;
    border-radius: 6px;
    overflow: hidden;
}

.video-stage {
    background: #000;
    padding: 1.5rem;
}

.video-placeholder {
    width: 100%;
    aspect-ratio: 16 / 9;
    background: #1a1a1a;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    color: rgba(255, 255, 255, 0.5);
    border: 1.5px solid rgba(255, 255, 255, 0.07);
    text-align: center;
    padding: 2rem;
}

.video-placeholder strong {
    color: #fff;
    margin: 0.4rem 0;
}

.interactive-video-page .lesson-layout {
    align-items: start;
}

.interactive-video-stage {
    position: relative;
    background: #000;
    overflow: hidden;
    aspect-ratio: 16 / 9;
    min-height: 0;
}

.interactive-video-stage.is-manual-fullscreen {
    position: fixed;
    inset: auto;
    top: var(--interactive-video-viewport-top, 0px);
    left: var(--interactive-video-viewport-left, 0px);
    width: var(--interactive-video-viewport-width, 100dvw);
    height: var(--interactive-video-viewport-height, 100dvh);
    max-width: none;
    max-height: none;
    border-radius: 0;
    z-index: 1200;
    display: grid;
    align-content: stretch;
    background: #000;
}

.interactive-video-stage.has-active-interaction {
    min-height: 0;
}

.interactive-video-stage.is-loading-lesson::before,
.interactive-video-stage.is-loading-lesson::after {
    position: absolute;
    z-index: 8;
    pointer-events: none;
}

.interactive-video-stage.is-loading-lesson::before {
    content: "";
    inset: 0;
    background: rgba(3, 14, 17, 0.72);
    backdrop-filter: blur(4px);
}

.interactive-video-stage.is-loading-lesson::after {
    content: "Opening next lesson";
    top: 50%;
    left: 50%;
    padding: 0.72rem 1rem;
    border: 1px solid rgba(75, 173, 160, 0.34);
    border-radius: 999px;
    background: #0a2629;
    color: #fff;
    font-weight: 800;
    transform: translate(-50%, -50%);
    box-shadow: 0 16px 38px rgba(0, 0, 0, 0.34);
}

.interactive-video-element {
    width: 100%;
    display: block;
    height: 100%;
    background: #000;
    object-fit: contain;
}

.youtube-video-host {
    position: relative;
    overflow: hidden;
}

.youtube-video-host > div,
.youtube-video-host iframe {
    width: 100% !important;
    height: 100% !important;
    border: 0;
}

.youtube-video-host.has-provider-error::after {
    content: "The YouTube lesson could not be loaded. Check the video visibility and try again.";
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    padding: 1.5rem;
    background: #091b1f;
    color: #fff;
    text-align: center;
}

.interactive-video-touch-surface {
    position: absolute;
    inset: 0;
    z-index: 2;
    display: block;
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    color: transparent;
    cursor: pointer;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
}

.interactive-video-touch-surface:focus-visible {
    outline: 3px solid rgba(67, 171, 153, 0.8);
    outline-offset: -5px;
}

.interactive-video-stage.has-active-interaction .interactive-video-touch-surface {
    pointer-events: none;
}

.interactive-video-now-playing {
    position: absolute;
    top: 0.85rem;
    left: 50%;
    z-index: 4;
    display: grid;
    gap: 0.12rem;
    width: min(620px, calc(100% - 13rem));
    padding: 0.58rem 0.9rem;
    border: 1px solid rgba(75, 173, 160, 0.2);
    border-radius: 14px;
    background: linear-gradient(180deg, rgba(7, 27, 30, 0.78), rgba(5, 14, 18, 0.9));
    color: #fff;
    text-align: center;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.28);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translate(-50%, -0.55rem);
    transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease;
    backdrop-filter: blur(10px);
}

.interactive-video-now-playing span {
    font-family: "Space Mono", monospace;
    font-size: 0.58rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #9edfd3;
}

.interactive-video-now-playing strong {
    overflow: hidden;
    font-size: clamp(0.78rem, 1.35vw, 1rem);
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.interactive-video-stage:not(.is-playing):not(.is-controls-hidden):not(.has-active-interaction) .interactive-video-now-playing,
.interactive-video-stage.is-controls-visible:not(.has-active-interaction) .interactive-video-now-playing {
    opacity: 1;
    visibility: visible;
    transform: translate(-50%, 0);
}

@media (hover: hover) and (pointer: fine) {
    .interactive-video-stage:hover:not(.is-controls-hidden):not(.has-active-interaction) .interactive-video-now-playing,
    .interactive-video-stage:focus-within:not(.is-controls-hidden):not(.has-active-interaction) .interactive-video-now-playing {
        opacity: 1;
        visibility: visible;
        transform: translate(-50%, 0);
    }
}

.video-placeholder-rich {
    min-height: 420px;
}

.interactive-video-play-overlay {
    position: absolute;
    top: 50%;
    left: 50%;
    right: auto;
    bottom: auto;
    transform: translate(-50%, -50%);
    z-index: 3;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.85rem;
    align-items: center;
    width: min(420px, calc(100% - 2rem));
    padding: 0.95rem 1rem;
    border-radius: 18px;
    border: 1px solid rgba(75, 173, 160, 0.28);
    background: linear-gradient(180deg, rgba(9, 33, 35, 0.86), rgba(10, 24, 28, 0.96));
    color: #fff;
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.3);
    text-align: left;
    backdrop-filter: blur(10px);
}

.interactive-video-play-overlay-icon {
    width: 3rem;
    height: 3rem;
    display: inline-grid;
    place-items: center;
    border-radius: 999px;
    background: linear-gradient(135deg, rgba(26, 107, 107, 0.98), rgba(67, 171, 153, 0.9));
    color: #fff;
    font-size: 1rem;
    flex-shrink: 0;
}

.interactive-video-play-overlay-copy {
    display: grid;
    gap: 0.15rem;
    min-width: 0;
}

.interactive-video-play-overlay-copy strong,
.interactive-video-play-overlay-copy small {
    display: block;
}

.interactive-video-play-overlay-copy small {
    color: rgba(255, 255, 255, 0.76);
    line-height: 1.5;
}

.interactive-video-stage.is-playing .interactive-video-play-overlay,
.interactive-video-stage.has-active-interaction .interactive-video-play-overlay {
    display: none;
}

.interactive-video-stage.is-quality-switching::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 2;
    background:
        radial-gradient(circle at center, rgba(37, 118, 112, 0.18), transparent 42%),
        rgba(5, 22, 25, 0.82);
    backdrop-filter: blur(5px);
    pointer-events: none;
    animation: interactive-video-quality-veil 0.2s ease-out both;
}

.interactive-video-network-status {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 3;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.75rem;
    width: min(620px, calc(100% - 2rem));
    padding: 0.85rem 0.95rem;
    border: 1px solid rgba(75, 173, 160, 0.34);
    border-radius: 18px;
    background: linear-gradient(180deg, rgba(7, 29, 32, 0.94), rgba(5, 16, 20, 0.97));
    color: #fff;
    box-shadow: 0 20px 52px rgba(0, 0, 0, 0.42);
    transform: translate(-50%, -50%);
    backdrop-filter: blur(12px);
    pointer-events: none;
}

.interactive-video-network-status[hidden] {
    display: none !important;
}

.interactive-video-network-icon {
    position: relative;
    width: 2.7rem;
    height: 2.7rem;
    display: grid;
    place-items: center;
    border-radius: 999px;
    background: rgba(67, 171, 153, 0.18);
    color: #bff3e8;
    font-size: 1rem;
}

.interactive-video-network-status[data-state="buffering"] .interactive-video-network-icon::before,
.interactive-video-network-status[data-state="recovering"] .interactive-video-network-icon::before,
.interactive-video-network-status[data-state="quality"] .interactive-video-network-icon::before {
    content: "";
    position: absolute;
    inset: 0.22rem;
    border: 2px solid rgba(191, 243, 232, 0.22);
    border-top-color: #bff3e8;
    border-radius: 999px;
    animation: interactive-video-network-spin 0.9s linear infinite;
}

.interactive-video-network-status[data-state="buffering"] .interactive-video-network-icon i,
.interactive-video-network-status[data-state="recovering"] .interactive-video-network-icon i,
.interactive-video-network-status[data-state="quality"] .interactive-video-network-icon i {
    font-size: 0.72rem;
    opacity: 0.8;
}

.interactive-video-network-copy {
    display: grid;
    gap: 0.12rem;
    min-width: 0;
}

.interactive-video-network-copy strong,
.interactive-video-network-copy small {
    display: block;
}

.interactive-video-network-copy strong {
    color: #fff;
    font-size: 0.9rem;
}

.interactive-video-network-copy small {
    color: rgba(255, 255, 255, 0.72);
    font-size: 0.76rem;
    line-height: 1.45;
}

.interactive-video-network-actions {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    pointer-events: auto;
}

.interactive-video-network-button {
    min-height: 2.45rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    padding: 0.55rem 0.75rem;
    border: 1px solid rgba(75, 173, 160, 0.34);
    border-radius: 999px;
    background: rgba(67, 171, 153, 0.15);
    color: #fff;
    font: inherit;
    font-size: 0.74rem;
    font-weight: 800;
    cursor: pointer;
    white-space: nowrap;
}

.interactive-video-network-button:hover,
.interactive-video-network-button:focus-visible {
    border-color: rgba(126, 223, 207, 0.64);
    background: rgba(67, 171, 153, 0.28);
    outline: none;
}

.interactive-video-network-button:disabled {
    opacity: 0.58;
    cursor: wait;
}

.interactive-video-network-status[data-state="stalled"] {
    border-color: rgba(232, 201, 122, 0.54);
}

.interactive-video-network-status[data-state="stalled"] .interactive-video-network-icon {
    background: rgba(232, 201, 122, 0.16);
    color: #ffe8aa;
}

.interactive-video-network-status[data-state="offline"],
.interactive-video-network-status[data-state="error"] {
    border-color: rgba(217, 112, 86, 0.58);
}

.interactive-video-network-status[data-state="offline"] .interactive-video-network-icon,
.interactive-video-network-status[data-state="error"] .interactive-video-network-icon {
    background: rgba(217, 112, 86, 0.18);
    color: #ffd0c0;
}

@keyframes interactive-video-network-spin {
    to {
        transform: rotate(360deg);
    }
}

@keyframes interactive-video-quality-veil {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@media (max-width: 640px) {
    .interactive-video-network-status {
        grid-template-columns: auto minmax(0, 1fr);
        gap: 0.58rem 0.65rem;
        width: calc(100% - 1rem);
        padding: 0.7rem;
        border-radius: 15px;
    }

    .interactive-video-network-icon {
        width: 2.35rem;
        height: 2.35rem;
    }

    .interactive-video-network-actions {
        grid-column: 1 / -1;
        width: 100%;
    }

    .interactive-video-network-button {
        flex: 1 1 0;
        min-width: 0;
    }
}

.interactive-video-fullscreen-lock .student-mobile-nav {
    display: none !important;
}

.interactive-video-fullscreen-lock .lesson-hero-band {
    display: none !important;
}

.interactive-video-fullscreen-lock,
.interactive-video-fullscreen-lock body {
    overflow: hidden !important;
    overscroll-behavior: none;
}

body.interactive-video-fullscreen-lock {
    position: fixed;
    top: var(--interactive-video-scroll-offset, 0);
    right: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #000;
}

body.interactive-video-fullscreen-lock > .interactive-video-stage.is-manual-fullscreen {
    position: fixed !important;
    inset: auto !important;
    top: var(--interactive-video-viewport-top, 0px) !important;
    left: var(--interactive-video-viewport-left, 0px) !important;
    width: var(--interactive-video-viewport-width, 100dvw) !important;
    height: var(--interactive-video-viewport-height, 100dvh) !important;
    max-width: none !important;
    max-height: none !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    transform: none !important;
    z-index: 2147483000 !important;
    isolation: isolate;
    background: #000;
}

.interactive-video-fullscreen-lock .sidebar,
.interactive-video-fullscreen-lock .app-header {
    opacity: 0;
    pointer-events: none;
}

.interactive-video-question-lock .student-mobile-nav {
    display: none !important;
}

.interactive-video-overlay {
    position: absolute;
    inset: 0;
    display: grid;
    align-items: center;
    justify-items: center;
    padding: clamp(0.65rem, 1.6vw, 1.1rem);
    background: linear-gradient(180deg, rgba(8, 8, 8, 0.06) 0%, rgba(8, 8, 8, 0.18) 38%, rgba(8, 8, 8, 0.82) 100%);
    backdrop-filter: blur(2px);
    z-index: 4;
    overflow: hidden;
}

.interactive-video-card {
    box-sizing: border-box;
    width: min(560px, calc(100% - 1rem));
    max-width: calc(100% - 1rem);
    max-height: calc(100% - 1rem);
    display: grid;
    gap: clamp(0.55rem, 1.4vw, 0.95rem);
    padding: clamp(0.8rem, 1.8vw, 1.1rem);
    border-radius: 22px;
    border: 1px solid rgba(75, 173, 160, 0.24);
    background: linear-gradient(180deg, rgba(19, 21, 24, 0.94), rgba(12, 14, 17, 0.96));
    color: #f8f5ef;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.34);
    overflow: auto;
}

.interactive-video-overlay[data-state="neutral"] .interactive-video-card {
    border-color: rgba(75, 173, 160, 0.34);
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.34), 0 0 0 1px rgba(75, 173, 160, 0.1);
}

.interactive-video-overlay[data-state="incorrect"] .interactive-video-card {
    border-color: rgba(192, 94, 58, 0.48);
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.34), 0 0 0 1px rgba(192, 94, 58, 0.14);
}

.interactive-video-overlay[data-state="correct"] .interactive-video-card {
    border-color: rgba(122, 173, 138, 0.52);
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.34), 0 0 0 1px rgba(122, 173, 138, 0.18);
}

@media (max-width: 720px) {
    .interactive-video-now-playing {
        top: 0.55rem;
        width: min(60%, 24rem);
        padding: 0.42rem 0.65rem;
        border-radius: 11px;
    }

    .interactive-video-now-playing strong {
        font-size: 0.72rem;
    }

    .interactive-video-card {
        width: min(100%, calc(100% - 0.75rem));
        max-width: calc(100% - 0.75rem);
        max-height: calc(100% - 0.75rem);
        padding: 0.75rem;
        border-radius: 18px;
    }

    .interactive-video-card-head {
        gap: 0.5rem;
    }

    .interactive-video-question {
        line-height: 1.45;
    }

    .interactive-video-options {
        gap: 0.5rem;
    }

    .interactive-option-button,
    .interactive-video-prompt {
        padding: 0.58rem 0.65rem;
        border-radius: 12px;
    }
}

.interactive-video-card-head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.8rem;
}

.interactive-video-card-head strong {
    font-size: 1.02rem;
    color: #fff;
}

.interactive-video-card-head .pill {
    background: rgba(67, 171, 153, 0.18);
    color: #bff3e8;
}

.interactive-video-overlay[data-state="incorrect"] .interactive-video-card-head .pill {
    background: rgba(192, 94, 58, 0.16);
    color: #ffb29a;
}

.interactive-video-overlay[data-state="correct"] .interactive-video-card-head .pill {
    background: rgba(122, 173, 138, 0.18);
    color: #d7f1de;
}

.interactive-video-question {
    margin: 0;
    font-size: 1rem;
    line-height: 1.7;
    color: rgba(248, 245, 239, 0.96);
}

.interactive-video-options {
    display: grid;
    gap: 0.8rem;
}

.interactive-option-button,
.interactive-video-prompt {
    display: flex;
    align-items: flex-start;
    gap: 0.85rem;
    width: 100%;
    padding: 0.95rem 1rem;
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(255, 255, 255, 0.05);
}

.interactive-option-button {
    cursor: pointer;
    text-align: left;
    transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.interactive-option-button:hover,
.interactive-option-button.selected {
    transform: translateY(-1px);
    border-color: rgba(67, 171, 153, 0.56);
    background: rgba(67, 171, 153, 0.12);
    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.22);
}

.interactive-option-button.is-correct {
    border-color: rgba(122, 173, 138, 0.52);
    background: rgba(122, 173, 138, 0.14);
}

.interactive-option-button.is-correct strong {
    background: rgba(122, 173, 138, 0.2);
    color: #d7f1de;
}

.interactive-option-button.is-incorrect {
    border-color: rgba(192, 94, 58, 0.54);
    background: rgba(192, 94, 58, 0.12);
}

.interactive-option-button.is-incorrect strong {
    background: rgba(192, 94, 58, 0.18);
    color: #ffb29a;
}

.interactive-option-button strong {
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    border-radius: 999px;
    background: rgba(67, 171, 153, 0.18);
    color: #bff3e8;
    flex-shrink: 0;
}

.interactive-option-button span,
.interactive-video-prompt {
    color: rgba(248, 245, 239, 0.78);
    line-height: 1.65;
}

.interactive-prompt-response {
    width: 100%;
    min-height: 120px;
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    padding: 0.95rem 1rem;
    font: inherit;
    resize: vertical;
    background: rgba(255, 255, 255, 0.06);
    color: #fff;
}

.interactive-prompt-response:focus {
    outline: none;
    border-color: rgba(67, 171, 153, 0.55);
    box-shadow: 0 0 0 4px rgba(67, 171, 153, 0.12);
}

.interactive-video-feedback {
    padding: 0.9rem 1rem;
    border-radius: 14px;
    border: 1px solid rgba(67, 171, 153, 0.24);
    background: rgba(67, 171, 153, 0.12);
    color: rgba(248, 245, 239, 0.86);
    line-height: 1.65;
}

.interactive-video-feedback[data-state="incorrect"] {
    border-color: rgba(192, 94, 58, 0.4);
    background: rgba(192, 94, 58, 0.14);
    color: #ffd0c0;
}

.interactive-video-feedback[data-state="correct"] {
    border-color: rgba(122, 173, 138, 0.45);
    background: rgba(122, 173, 138, 0.16);
    color: #def5e4;
}

.interactive-video-actions {
    justify-content: flex-end;
}

.interactive-video-controls {
    position: absolute;
    left: 0.85rem;
    right: 0.85rem;
    bottom: 0.85rem;
    z-index: 3;
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) 42px 42px;
    gap: 0.5rem;
    align-items: center;
    padding: 0.44rem;
    border-radius: 999px;
    border: 1px solid rgba(75, 173, 160, 0.28);
    background:
        linear-gradient(180deg, rgba(10, 37, 40, 0.76), rgba(5, 14, 18, 0.92)),
        rgba(5, 14, 18, 0.72);
    box-shadow: 0 18px 44px rgba(0, 0, 0, 0.34);
    backdrop-filter: blur(10px);
    transition: opacity 0.22s ease, transform 0.22s ease, visibility 0.22s ease;
}

.interactive-video-stage.has-active-interaction .interactive-video-controls {
    opacity: 0;
    visibility: hidden;
    transform: translateY(1rem);
    pointer-events: none;
}

.interactive-video-control-button {
    min-width: 42px;
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0;
    border-radius: 999px;
    border: 1px solid rgba(75, 173, 160, 0.22);
    background: rgba(255, 255, 255, 0.08);
    color: #fff;
    cursor: pointer;
    transition: background 0.18s ease, border-color 0.18s ease, transform 0.18s ease;
}

.interactive-video-control-button:hover,
.interactive-video-control-button:focus-visible {
    background: rgba(67, 171, 153, 0.22);
    border-color: rgba(67, 171, 153, 0.38);
    transform: translateY(-1px);
}

.interactive-video-control-button span {
    display: none;
}

.interactive-video-control-button.is-primary {
    background: linear-gradient(135deg, rgba(26, 107, 107, 0.98), rgba(67, 171, 153, 0.9));
    border-color: rgba(67, 171, 153, 0.24);
}

.interactive-video-timeline {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.7rem;
    min-width: 0;
}

.interactive-video-time {
    font-family: "Space Mono", monospace;
    font-size: 0.72rem;
    color: rgba(255, 255, 255, 0.86);
    white-space: nowrap;
}

.interactive-video-seek,
.interactive-video-volume {
    width: 100%;
    accent-color: var(--teal);
}

.interactive-video-audio {
    display: block;
}

.interactive-video-audio .interactive-video-volume {
    display: none;
}

.interactive-video-stage.is-controls-hidden:not(.has-active-interaction) .interactive-video-controls,
.interactive-video-stage.is-controls-hidden:not(.has-active-interaction) .interactive-video-step-nav {
    opacity: 0;
    visibility: hidden;
    transform: translateY(0.65rem);
    pointer-events: none;
}

.interactive-video-stage.is-controls-hidden:not(.has-active-interaction) .interactive-video-step-nav {
    transform: translateY(-0.65rem);
}

.interactive-video-stage:not(.has-active-interaction):not(.is-controls-visible) .interactive-video-controls,
.interactive-video-stage:not(.has-active-interaction):not(.is-controls-visible) .interactive-video-step-nav {
    opacity: 0;
    visibility: hidden;
    transform: translateY(0.65rem);
    pointer-events: none;
}

.interactive-video-stage:not(.has-active-interaction):not(.is-controls-visible) .interactive-video-step-nav {
    transform: translateY(-0.65rem);
}

.interactive-video-stage:hover:not(.is-controls-hidden) .interactive-video-controls,
.interactive-video-stage:focus-within:not(.is-controls-hidden) .interactive-video-controls,
.interactive-video-stage.is-controls-visible .interactive-video-controls,
.interactive-video-stage:hover:not(.is-controls-hidden) .interactive-video-step-nav,
.interactive-video-stage:focus-within:not(.is-controls-hidden) .interactive-video-step-nav,
.interactive-video-stage.is-controls-visible .interactive-video-step-nav {
    opacity: 1;
    visibility: visible;
    transform: none;
    pointer-events: auto;
}

@media (hover: hover) and (pointer: fine) {
    .interactive-video-stage:fullscreen.is-pointer-idle:not(.has-active-interaction),
    .interactive-video-stage:-webkit-full-screen.is-pointer-idle:not(.has-active-interaction),
    .interactive-video-stage.is-manual-fullscreen.is-pointer-idle:not(.has-active-interaction),
    .interactive-video-stage:fullscreen.is-pointer-idle:not(.has-active-interaction) *,
    .interactive-video-stage:-webkit-full-screen.is-pointer-idle:not(.has-active-interaction) *,
    .interactive-video-stage.is-manual-fullscreen.is-pointer-idle:not(.has-active-interaction) * {
        cursor: none !important;
    }
}

.interactive-video-actions .button-secondary {
    border-color: rgba(67, 171, 153, 0.26);
    background: rgba(67, 171, 153, 0.14);
    color: #fff;
}

.interactive-video-actions .button-secondary:hover,
.interactive-video-actions .button-secondary:focus-visible {
    background: rgba(67, 171, 153, 0.22);
    color: #fff;
    border-color: rgba(67, 171, 153, 0.36);
}

.interactive-video-toolbar {
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.interactive-video-step-nav {
    position: absolute;
    top: 0.85rem;
    left: 0.85rem;
    right: 0.85rem;
    z-index: 5;
    display: none;
    justify-content: space-between;
    align-items: center;
    gap: 0.75rem;
    pointer-events: none;
}

.interactive-video-step-button {
    pointer-events: auto;
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    padding: 0.62rem 0.85rem;
    border-radius: 999px;
    border: 1px solid rgba(75, 173, 160, 0.28);
    background: rgba(8, 28, 31, 0.82);
    color: #fff;
    font-weight: 800;
    font-size: 0.76rem;
    text-decoration: none;
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.28);
    backdrop-filter: blur(10px);
}

.interactive-video-step-button.is-next {
    margin-left: auto;
    background: linear-gradient(135deg, rgba(26, 107, 107, 0.96), rgba(67, 171, 153, 0.9));
}

.interactive-video-stage:fullscreen .interactive-video-step-nav,
.checkpoint-video-shell:fullscreen .interactive-video-step-nav,
.interactive-video-stage:-webkit-full-screen .interactive-video-step-nav,
.checkpoint-video-shell:-webkit-full-screen .interactive-video-step-nav,
.interactive-video-stage.is-manual-fullscreen .interactive-video-step-nav {
    display: flex;
}

.lesson-video-showcase-actions [data-interactive-video-fullscreen] {
    border-color: rgba(26, 107, 107, 0.26);
    background: rgba(67, 171, 153, 0.14);
    color: #dff9f3;
}

.lesson-mobile-tabs,
.lesson-mobile-next-bar {
    display: none;
}

.lesson-video-showcase-actions [data-interactive-video-fullscreen]:hover,
.lesson-video-showcase-actions [data-interactive-video-fullscreen]:focus-visible {
    border-color: rgba(67, 171, 153, 0.42);
    background: rgba(67, 171, 153, 0.22);
    color: #fff;
}

.interactive-video-stage:fullscreen,
.checkpoint-video-shell:fullscreen,
.interactive-video-stage:-webkit-full-screen,
.checkpoint-video-shell:-webkit-full-screen {
    width: 100vw;
    height: 100vh;
    max-width: 100vw;
    max-height: 100vh;
    border-radius: 0;
    background: #000;
    display: grid;
    place-items: center;
}

.interactive-video-stage.is-manual-fullscreen .interactive-video-overlay,
.interactive-video-stage.is-manual-fullscreen .interactive-video-controls {
    width: auto;
}

.interactive-video-stage:fullscreen .interactive-video-element,
.checkpoint-video-shell:fullscreen .interactive-video-element,
.interactive-video-stage:-webkit-full-screen .interactive-video-element,
.checkpoint-video-shell:-webkit-full-screen .interactive-video-element,
.interactive-video-stage.is-manual-fullscreen .interactive-video-element {
    width: 100%;
    height: 100%;
    max-width: 100vw;
    max-height: 100vh;
    aspect-ratio: auto;
    object-fit: contain;
}

body.interactive-video-fullscreen-lock > .interactive-video-stage.is-manual-fullscreen > .interactive-video-element,
body.interactive-video-fullscreen-lock > .interactive-video-stage.is-manual-fullscreen > .youtube-video-host {
    position: absolute;
    inset: 0;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    margin: 0;
    object-fit: contain;
}

.interactive-video-stage:fullscreen .interactive-video-overlay,
.checkpoint-video-shell:fullscreen .interactive-video-overlay,
.interactive-video-stage:-webkit-full-screen .interactive-video-overlay,
.checkpoint-video-shell:-webkit-full-screen .interactive-video-overlay,
.interactive-video-stage.is-manual-fullscreen .interactive-video-overlay {
    inset: 0;
    width: 100%;
    height: 100%;
    padding: clamp(1.1rem, 2.5vw, 2rem);
}

.interactive-video-stage:fullscreen .interactive-video-card,
.checkpoint-video-shell:fullscreen .interactive-video-card,
.interactive-video-stage:-webkit-full-screen .interactive-video-card,
.checkpoint-video-shell:-webkit-full-screen .interactive-video-card,
.interactive-video-stage.is-manual-fullscreen .interactive-video-card {
    width: min(720px, 100%);
}

.interactive-video-stage:fullscreen .interactive-video-controls,
.checkpoint-video-shell:fullscreen .interactive-video-controls,
.interactive-video-stage:-webkit-full-screen .interactive-video-controls,
.checkpoint-video-shell:-webkit-full-screen .interactive-video-controls,
.interactive-video-stage.is-manual-fullscreen .interactive-video-controls {
    left: 1rem;
    right: 1rem;
    bottom: 1rem;
}

.lesson-progress-panel .interactive-progress-shell {
    display: grid;
    gap: 1rem;
}

.interactive-progress-bar span {
    background: linear-gradient(90deg, var(--teal), var(--gold));
}

.lesson-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.5rem;
    background: #151515;
    border-top: 1px solid rgba(255, 255, 255, 0.07);
}

.lesson-toolbar-copy {
    display: grid;
    gap: 0.28rem;
}

.lesson-toolbar-copy strong {
    color: #fff;
    font-size: 0.96rem;
}

.lesson-toolbar p {
    color: rgba(255, 255, 255, 0.7);
    font-size: 0.76rem;
}

.lesson-toolbar .curriculum-toolbar-progress span {
    color: rgba(255, 255, 255, 0.82);
}

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

.lesson-video-gate {
    display: grid;
    grid-template-columns: minmax(12rem, 0.6fr) minmax(14rem, 1fr) minmax(15rem, 0.8fr);
    align-items: center;
    gap: 1rem;
    padding: 0.9rem 1.5rem;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    background: linear-gradient(90deg, #102a29, #163836);
    color: #fff;
}

.lesson-video-gate-copy {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.75rem;
}

.lesson-video-gate-copy span,
.lesson-video-gate p {
    color: rgba(255, 255, 255, 0.72);
    font-size: 0.78rem;
}

.lesson-video-gate-copy strong {
    white-space: nowrap;
}

.lesson-video-gate-track {
    height: 0.48rem;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.18);
}

.lesson-video-gate-track span {
    display: block;
    width: 0;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--teal-light), var(--gold));
    transition: width 260ms ease;
}

.lesson-video-gate p {
    margin: 0;
    text-align: right;
}

@media (max-width: 760px) {
    .lesson-video-gate {
        grid-template-columns: 1fr;
        gap: 0.65rem;
        padding: 0.9rem 1rem;
    }

    .lesson-video-gate p {
        text-align: left;
    }
}

.lesson-progression-journey {
    width: min(100%, 960px);
    margin-inline: auto;
    padding: clamp(1rem, 2vw, 1.45rem);
    border: 1px solid rgba(18, 102, 105, 0.16);
    border-radius: 22px;
    background:
        radial-gradient(circle at 92% 0%, rgba(201, 168, 76, 0.15), transparent 28%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.99), rgba(245, 249, 247, 0.97));
    box-shadow: 0 18px 42px rgba(15, 23, 42, 0.09);
}

.lesson-progression-heading,
.lesson-progression-action {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.lesson-progression-heading-copy {
    display: grid;
    gap: 0.35rem;
}

.lesson-progression-kicker,
.lesson-progression-action > div > span,
.lesson-progression-metrics span,
.lesson-progression-step-copy small {
    font-family: var(--mono);
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.13em;
    text-transform: uppercase;
    color: var(--teal);
}

.lesson-progression-kicker {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
}

.lesson-progression-heading h3 {
    margin: 0;
    font-size: clamp(1.25rem, 2vw, 1.65rem);
}

.lesson-progression-heading p,
.lesson-progression-action p {
    margin: 0;
    color: var(--muted);
    font-size: 0.88rem;
}

.lesson-progression-status {
    flex: 0 0 auto;
    padding: 0.55rem 0.75rem;
    border-radius: 999px;
    background: rgba(18, 102, 105, 0.1);
    color: var(--teal-dark);
    font-size: 0.72rem;
    font-weight: 800;
}

.lesson-progression-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
    margin-top: 1.1rem;
}

.lesson-progression-metrics > div {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.6rem;
    min-width: 0;
    padding: 0.75rem 0.85rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.78);
}

.lesson-progression-metrics strong {
    color: var(--ink);
    white-space: nowrap;
}

.lesson-progression-watch-track {
    margin-top: 0.8rem;
    background: rgba(18, 102, 105, 0.12);
}

.lesson-progression-steps {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.8rem;
    margin: 1.2rem 0;
    padding: 0;
    list-style: none;
}

.lesson-progression-step {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.75rem;
    min-height: 6.2rem;
    padding: 0.9rem;
    border: 1px solid rgba(15, 23, 42, 0.09);
    border-radius: 16px;
    background: #fff;
    transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

.lesson-progression-step.is-current {
    border-color: rgba(18, 102, 105, 0.42);
    box-shadow: 0 10px 24px rgba(18, 102, 105, 0.1);
    transform: translateY(-2px);
}

.lesson-progression-step.is-complete {
    border-color: rgba(40, 145, 105, 0.25);
    background: rgba(235, 248, 241, 0.86);
}

.lesson-progression-step.is-locked {
    background: rgba(247, 246, 242, 0.78);
    color: var(--muted);
}

.lesson-progression-step-number {
    display: inline-grid;
    width: 2.35rem;
    height: 2.35rem;
    place-items: center;
    border-radius: 50%;
    background: rgba(18, 102, 105, 0.1);
    color: var(--teal-dark);
    font-weight: 900;
}

.lesson-progression-step-number i {
    display: none;
}

.lesson-progression-step.is-complete .lesson-progression-step-number {
    background: var(--teal);
    color: #fff;
}

.lesson-progression-step.is-complete .lesson-progression-step-number span {
    display: none;
}

.lesson-progression-step.is-complete .lesson-progression-step-number i {
    display: inline;
}

.lesson-progression-step-copy {
    display: grid;
    gap: 0.15rem;
    min-width: 0;
}

.lesson-progression-step-copy strong {
    color: var(--ink);
    font-size: 0.92rem;
}

.lesson-progression-step-copy > span {
    color: var(--muted);
    font-size: 0.74rem;
    line-height: 1.4;
}

.lesson-progression-lock {
    color: rgba(15, 23, 42, 0.35);
}

.lesson-progression-step:not(.is-locked) .lesson-progression-lock {
    display: none;
}

.lesson-progression-action {
    padding-top: 1rem;
    border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.lesson-progression-action > div {
    display: grid;
    gap: 0.2rem;
}

.lesson-progression-action .button {
    flex: 0 0 auto;
    min-width: 12.5rem;
    justify-content: center;
}

.lesson-progression-action .button.is-disabled {
    cursor: not-allowed;
    opacity: 0.58;
}

@media (max-width: 760px) {
    .lesson-progression-heading,
    .lesson-progression-action {
        align-items: flex-start;
    }

    .lesson-progression-metrics {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 0.45rem;
    }

    .lesson-progression-metrics > div {
        display: grid;
        gap: 0.2rem;
        padding: 0.65rem;
    }

    .lesson-progression-steps {
        grid-template-columns: 1fr;
        gap: 0.55rem;
    }

    .lesson-progression-step {
        min-height: auto;
        padding: 0.75rem;
    }

    .lesson-progression-action {
        display: grid;
    }

    .lesson-progression-action .button {
        width: 100%;
        min-width: 0;
    }
}

@media (max-width: 430px) {
    .lesson-progression-heading {
        display: grid;
    }

    .lesson-progression-status {
        justify-self: start;
    }

    .lesson-progression-metrics span {
        font-size: 0.52rem;
        letter-spacing: 0.08em;
    }
}

.lesson-side {
    display: grid;
    gap: 1.2rem;
}

.lesson-sequence-panel {
    display: grid;
    gap: 1rem;
}

.lesson-course-tree-panel {
    background:
        radial-gradient(circle at top right, rgba(67, 171, 153, 0.12), transparent 36%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 246, 240, 0.96));
}

.lesson-sequence-tree {
    max-height: none;
    overflow: auto;
    padding: 0.75rem;
}

.lesson-sequence-tree .admin-structure-tree-list .admin-structure-tree-list {
    margin-left: 0.55rem;
    padding-left: 0.65rem;
}

.lesson-sequence-tree .admin-structure-tree-node {
    grid-template-columns: auto minmax(0, 1fr) auto;
    padding: 0.58rem 0.62rem;
}

.lesson-sequence-tree .admin-structure-tree-icon {
    width: 1.55rem;
    height: 1.55rem;
    font-size: 0.66rem;
}

.lesson-sequence-tree .admin-structure-tree-link {
    font-size: 0.82rem;
}

.lesson-sequence-tree .admin-structure-tree-detail {
    font-size: 0.68rem;
}

.lesson-tree-badge {
    min-width: 1.75rem;
    min-height: 1.75rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
    padding: 0.3rem 0.45rem;
    border-radius: 999px;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
    font-family: var(--mono);
    font-size: 0.65rem;
    font-weight: 800;
}

.lesson-sequence-summary {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.8rem;
}

.lesson-sequence-summary-card {
    display: grid;
    gap: 0.3rem;
    padding: 0.9rem 0.95rem;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.08);
}

.lesson-sequence-summary-card span {
    font-family: "Space Mono", monospace;
    font-size: 0.64rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.6);
}

.lesson-sequence-summary-card strong {
    color: #fff;
    line-height: 1.45;
}

.dark-panel {
    background: #1a1a1a;
    border-color: rgba(255, 255, 255, 0.07);
}

.dark-panel h3,
.dark-panel p,
.dark-panel .eyebrow-inline {
    color: #fff;
}

.dark-panel textarea {
    background: rgba(255, 255, 255, 0.04);
    border-color: rgba(255, 255, 255, 0.18);
    color: rgba(255, 255, 255, 0.8);
}

.lesson-reading-panel {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(245, 240, 232, 0.92));
}

.lesson-reading-copy {
    display: grid;
    gap: 1rem;
}

.lesson-reading-copy p {
    color: var(--mid);
    line-height: 1.8;
    margin: 0;
}

.lesson-notes-document {
    width: min(100%, 980px);
    margin: 0 auto;
}

.lesson-notes-cover {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: 1.25rem;
    padding: 1.35rem 1.45rem;
    overflow: hidden;
    border: 1px solid rgba(26, 107, 107, 0.14);
    border-radius: 22px;
    background:
        radial-gradient(circle at 90% 10%, rgba(211, 177, 74, 0.18), transparent 34%),
        linear-gradient(135deg, rgba(230, 241, 241, 0.96), rgba(255, 252, 245, 0.98));
}

.lesson-notes-cover::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 5px;
    height: 100%;
    background: linear-gradient(180deg, var(--teal), var(--gold));
}

.lesson-notes-cover-copy {
    position: relative;
    z-index: 1;
    min-width: 0;
}

.lesson-notes-cover-copy .eyebrow-inline {
    display: inline-flex;
    align-items: center;
    gap: 0.42rem;
    margin-bottom: 0.55rem;
    color: var(--teal-dark);
}

.lesson-notes-cover-copy p {
    max-width: 66ch;
    margin: 0;
    color: var(--ink);
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.65;
}

.lesson-notes-metrics {
    position: relative;
    z-index: 1;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.45rem;
}

.lesson-notes-metrics span {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.45rem 0.62rem;
    border: 1px solid rgba(26, 107, 107, 0.12);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.78);
    color: var(--teal-dark);
    font-family: "Space Mono", monospace;
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.lesson-notes-contents {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    gap: 1rem;
    margin: 1rem auto 0;
    padding: 0.85rem 1rem;
    border: 1px solid rgba(17, 24, 39, 0.08);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.72);
}

.lesson-notes-contents > strong {
    color: var(--ink);
    font-family: "Space Mono", monospace;
    font-size: 0.64rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.lesson-notes-contents > div {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem 0.85rem;
}

.lesson-notes-contents a {
    color: var(--teal-dark);
    font-size: 0.84rem;
    font-weight: 700;
    text-decoration: none;
}

.lesson-notes-contents a::before {
    content: "";
    display: inline-block;
    width: 5px;
    height: 5px;
    margin-right: 0.38rem;
    border-radius: 50%;
    background: var(--gold);
    vertical-align: middle;
}

.lesson-notes-contents a.is-subsection {
    font-weight: 600;
    opacity: 0.82;
}

.lesson-notes-body {
    display: grid;
    gap: 1rem;
    width: min(100%, 72ch);
    margin: 1.4rem auto 0;
    padding: 0 0.4rem 0.5rem;
}

.lesson-notes-body > p {
    margin: 0;
    color: #4f555a;
    font-size: clamp(1rem, 1.1vw, 1.08rem);
    line-height: 1.82;
}

.lesson-note-heading {
    scroll-margin-top: 6rem;
    margin: 1.15rem 0 0;
    padding: 0.15rem 0 0.15rem 0.85rem;
    border-left: 4px solid var(--teal);
    color: var(--ink);
    font-size: clamp(1.28rem, 2vw, 1.7rem);
    line-height: 1.2;
}

.lesson-note-heading.is-subheading {
    margin-top: 0.75rem;
    border-left-color: var(--gold);
    font-size: clamp(1.05rem, 1.5vw, 1.25rem);
}

.lesson-note-list {
    display: grid;
    gap: 0.65rem;
    margin: 0;
    padding: 0;
    list-style: none;
    counter-reset: lesson-note-step;
}

.lesson-note-list li {
    position: relative;
    padding: 0.82rem 0.95rem 0.82rem 2.65rem;
    border: 1px solid rgba(26, 107, 107, 0.1);
    border-radius: 14px;
    background: rgba(247, 250, 249, 0.92);
    color: var(--ink);
    line-height: 1.58;
}

.lesson-note-list li::before {
    content: "";
    position: absolute;
    top: 1.16rem;
    left: 1.05rem;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--teal);
    box-shadow: 0 0 0 5px rgba(26, 107, 107, 0.1);
}

.lesson-note-list.is-ordered li {
    counter-increment: lesson-note-step;
}

.lesson-note-list.is-ordered li::before {
    content: counter(lesson-note-step);
    top: 0.68rem;
    display: grid;
    place-items: center;
    width: 1.45rem;
    height: 1.45rem;
    color: #fff;
    font-family: "Space Mono", monospace;
    font-size: 0.64rem;
    font-weight: 700;
    box-shadow: none;
}

.lesson-note-quote {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.85rem;
    margin: 0;
    padding: 1rem 1.1rem;
    border: 0;
    border-radius: 16px;
    background: #16272a;
    color: #fff;
}

.lesson-note-quote > i {
    color: var(--gold);
    font-size: 1.1rem;
}

.lesson-note-quote p {
    margin: 0;
    color: rgba(255, 255, 255, 0.9);
    font-size: 1.02rem;
    font-style: italic;
    line-height: 1.7;
}

.lesson-note-definition {
    display: grid;
    grid-template-columns: minmax(110px, 0.28fr) minmax(0, 1fr);
    gap: 0.75rem 1rem;
    margin: 0;
    padding: 0.95rem 1rem;
    border: 1px solid rgba(211, 177, 74, 0.25);
    border-radius: 15px;
    background: rgba(255, 250, 235, 0.84);
}

.lesson-note-definition dt {
    color: var(--teal-dark);
    font-weight: 800;
}

.lesson-note-definition dd {
    margin: 0;
    color: var(--mid);
    line-height: 1.6;
}

.lesson-note-formula {
    display: grid;
    gap: 0.55rem;
    padding: 1rem 1.1rem;
    overflow-x: auto;
    border: 1px solid rgba(26, 107, 107, 0.15);
    border-radius: 16px;
    background: linear-gradient(135deg, rgba(230, 241, 241, 0.82), rgba(255, 255, 255, 0.96));
}

.lesson-note-formula > span {
    color: var(--teal-dark);
    font-family: "Space Mono", monospace;
    font-size: 0.6rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.lesson-note-formula code {
    color: var(--ink);
    font-family: "Space Mono", monospace;
    font-size: clamp(0.9rem, 1.5vw, 1.05rem);
    white-space: pre-wrap;
}

.lesson-note-figure {
    margin: 0;
    overflow: hidden;
    border: 1px solid rgba(17, 24, 39, 0.1);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 14px 32px rgba(17, 24, 39, 0.08);
}

.lesson-note-figure img {
    display: block;
    width: 100%;
    max-height: 520px;
    object-fit: contain;
    background: #f4f2ed;
}

.lesson-note-figure figcaption {
    padding: 0.7rem 0.9rem;
    color: var(--mid);
    font-size: 0.78rem;
    text-align: center;
}

.lesson-note-callout {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.9rem;
    padding: 1rem 1.1rem;
    border: 1px solid rgba(26, 107, 107, 0.14);
    border-radius: 18px;
    background: rgba(230, 241, 241, 0.72);
}

.lesson-note-callout-icon {
    display: grid;
    place-items: center;
    width: 2.35rem;
    height: 2.35rem;
    border-radius: 13px;
    background: var(--teal);
    color: #fff;
}

.lesson-note-callout strong {
    display: block;
    margin-bottom: 0.3rem;
    color: var(--ink);
    font-size: 1rem;
}

.lesson-note-callout p {
    margin: 0.35rem 0 0;
    color: var(--mid);
    line-height: 1.65;
}

.lesson-note-callout.tone-example {
    border-color: rgba(211, 177, 74, 0.28);
    background: rgba(255, 249, 228, 0.88);
}

.lesson-note-callout.tone-example .lesson-note-callout-icon,
.lesson-note-callout.tone-warning .lesson-note-callout-icon {
    background: #b8871b;
}

.lesson-note-callout.tone-warning {
    border-color: rgba(177, 72, 48, 0.22);
    background: rgba(255, 241, 235, 0.9);
}

.lesson-note-callout.tone-tip {
    background: rgba(237, 248, 239, 0.92);
}

.lesson-notes-empty {
    display: flex;
    align-items: center;
    gap: 0.9rem;
    padding: 1rem;
    border: 1px dashed rgba(26, 107, 107, 0.22);
    border-radius: 17px;
    background: rgba(247, 250, 249, 0.82);
}

.lesson-notes-empty > span {
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    width: 2.7rem;
    height: 2.7rem;
    border-radius: 14px;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
}

.lesson-notes-empty strong,
.lesson-notes-empty p {
    display: block;
    margin: 0;
}

.lesson-notes-empty p {
    margin-top: 0.2rem;
    color: var(--mid);
    line-height: 1.5;
}

.ges-lesson-notes-reader {
    margin-top: 0.9rem;
}

.lesson-notes-authoring {
    display: grid;
    gap: 0.85rem;
    margin-top: 0.75rem;
    padding: 1rem;
    border: 1px solid rgba(26, 107, 107, 0.15);
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(230, 241, 241, 0.72), rgba(255, 252, 245, 0.92));
}

.lesson-notes-authoring-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.lesson-notes-authoring-head strong,
.lesson-notes-authoring-head p {
    display: block;
}

.lesson-notes-authoring-head strong {
    margin-top: 0.35rem;
    color: var(--ink);
}

.lesson-notes-authoring-head p {
    max-width: 68ch;
    margin: 0.25rem 0 0;
    color: var(--mid);
    font-size: 0.86rem;
    line-height: 1.5;
}

.lesson-notes-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.lesson-notes-toolbar button {
    display: inline-flex;
    align-items: center;
    gap: 0.42rem;
    min-height: 38px;
    padding: 0.5rem 0.68rem;
    border: 1px solid rgba(26, 107, 107, 0.16);
    border-radius: 11px;
    background: rgba(255, 255, 255, 0.92);
    color: var(--teal-dark);
    font: inherit;
    font-size: 0.78rem;
    font-weight: 750;
    cursor: pointer;
    transition: transform 160ms ease, border-color 160ms ease, background 160ms ease;
}

.lesson-notes-toolbar button:hover,
.lesson-notes-toolbar button:focus-visible {
    border-color: rgba(26, 107, 107, 0.42);
    background: #fff;
    transform: translateY(-1px);
}

.lesson-notes-format-guide {
    border-top: 1px solid rgba(26, 107, 107, 0.12);
    padding-top: 0.75rem;
}

.lesson-notes-format-guide summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    color: var(--ink);
    font-size: 0.82rem;
    font-weight: 750;
    cursor: pointer;
    list-style: none;
}

.lesson-notes-format-guide summary::-webkit-details-marker {
    display: none;
}

.lesson-notes-format-guide summary i {
    transition: transform 180ms ease;
}

.lesson-notes-format-guide[open] summary i {
    transform: rotate(180deg);
}

.lesson-notes-format-guide > div {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.45rem;
    margin-top: 0.75rem;
}

.lesson-notes-format-guide code {
    padding: 0.58rem 0.65rem;
    overflow-wrap: anywhere;
    border-radius: 9px;
    background: rgba(18, 39, 42, 0.92);
    color: rgba(255, 255, 255, 0.9);
    font-family: "Space Mono", monospace;
    font-size: 0.66rem;
}

.lesson-notes-editor-input {
    min-height: 280px;
    font-size: 0.95rem;
    line-height: 1.65;
}

@media (max-width: 720px) {
    .lesson-notes-cover {
        grid-template-columns: 1fr;
        padding: 1.05rem;
        border-radius: 17px;
    }

    .lesson-notes-metrics {
        justify-content: flex-start;
    }

    .lesson-notes-contents {
        grid-template-columns: 1fr;
    }

    .lesson-notes-contents > div {
        display: grid;
        grid-template-columns: 1fr;
    }

    .lesson-notes-body {
        margin-top: 1rem;
        padding-inline: 0;
    }

    .lesson-note-definition {
        grid-template-columns: 1fr;
    }

    .lesson-notes-authoring-head {
        display: grid;
    }

    .lesson-notes-authoring-head .pill {
        justify-self: start;
    }

    .lesson-notes-toolbar {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .lesson-notes-toolbar button {
        justify-content: flex-start;
    }

    .lesson-notes-format-guide > div {
        grid-template-columns: 1fr;
    }
}

.lesson-support-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.5rem;
}

.lesson-support-grid-revamp {
    align-items: stretch;
}

.learning-question-support {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    grid-column: 1 / -1;
    align-items: center;
    gap: 1.15rem;
    min-width: 0;
    padding: 1.15rem 1.25rem;
    overflow: hidden;
    border: 1px solid rgba(26, 107, 107, 0.18);
    border-radius: 20px;
    background:
        radial-gradient(circle at 92% 12%, rgba(211, 177, 74, 0.18), transparent 32%),
        linear-gradient(135deg, rgba(228, 244, 238, 0.98), rgba(255, 253, 246, 0.98));
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.06);
}

.learning-question-support::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: linear-gradient(180deg, #25d366, var(--teal));
}

.learning-question-support-icon {
    position: relative;
    display: grid;
    place-items: center;
    width: 3.25rem;
    height: 3.25rem;
    border-radius: 17px;
    background: #197d52;
    color: #fff;
    font-size: 1.5rem;
    box-shadow: 0 10px 24px rgba(25, 125, 82, 0.2);
}

.learning-question-support-copy {
    min-width: 0;
}

.learning-question-support-copy .eyebrow-inline,
.learning-question-support-copy h3,
.learning-question-support-copy > p,
.learning-question-support-copy small {
    margin: 0;
}

.learning-question-support-copy h3 {
    margin-top: 0.28rem;
    color: var(--ink);
    font-size: clamp(1.15rem, 1.7vw, 1.45rem);
}

.learning-question-support-copy > p:last-of-type {
    margin-top: 0.35rem;
    color: var(--mid);
    line-height: 1.6;
}

.learning-question-support-copy small {
    display: flex;
    align-items: flex-start;
    gap: 0.38rem;
    margin-top: 0.55rem;
    color: #58635f;
    font-size: 0.72rem;
    line-height: 1.5;
}

.learning-question-support-copy small i {
    margin-top: 0.18rem;
    color: var(--teal);
}

.learning-question-support-action {
    white-space: nowrap;
}

.landing-question-support-section {
    padding-block: clamp(1rem, 2vw, 1.75rem);
}

.learning-question-support.is-landing {
    padding: clamp(1.25rem, 2.8vw, 2rem);
    border-radius: 28px;
}

@media (max-width: 760px) {
    .learning-question-support {
        grid-template-columns: auto minmax(0, 1fr);
        align-items: start;
        gap: 0.85rem;
        padding: 1rem;
        border-radius: 17px;
    }

    .learning-question-support-icon {
        width: 2.75rem;
        height: 2.75rem;
        border-radius: 14px;
        font-size: 1.25rem;
    }

    .learning-question-support-action {
        grid-column: 1 / -1;
        justify-content: center;
        width: 100%;
        white-space: normal;
    }
}

.lesson-support-card {
    display: grid;
    gap: 0.9rem;
}

.lesson-support-list {
    display: grid;
    gap: 0.75rem;
}

.lesson-support-item {
    display: grid;
    gap: 0.25rem;
    padding: 0.95rem 1rem;
    border-radius: 18px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.88);
}

.lesson-support-item strong {
    color: var(--ink);
}

.lesson-support-item span {
    color: var(--mid);
    line-height: 1.6;
}

.curriculum-lesson-support-stack {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1.5rem;
    width: 100%;
}

.curriculum-support-panel {
    display: grid;
    gap: 1.15rem;
    width: 100%;
    min-width: 0;
}

.curriculum-support-heading {
    align-items: flex-start;
}

.curriculum-support-heading > div {
    display: grid;
    gap: 0.45rem;
    min-width: 0;
}

.curriculum-support-heading p {
    margin: 0;
    color: var(--mid);
    line-height: 1.6;
}

.curriculum-support-list {
    display: grid;
    gap: 0.75rem;
}

.curriculum-support-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 1rem;
    min-width: 0;
    padding: 1rem 1.1rem;
    border: 1px solid rgba(26, 107, 107, 0.14);
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(248, 252, 251, 0.98), rgba(255, 255, 255, 0.98));
    color: var(--ink);
    text-decoration: none;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.curriculum-support-row:hover,
.curriculum-support-row:focus-visible {
    border-color: rgba(26, 107, 107, 0.34);
    box-shadow: 0 14px 30px rgba(15, 23, 42, 0.08);
    transform: translateY(-2px);
}

.curriculum-assessment-row {
    grid-template-columns: auto minmax(0, 1fr) auto auto;
    background: linear-gradient(135deg, rgba(252, 249, 239, 0.98), rgba(255, 255, 255, 0.98));
}

.curriculum-assessment-row.is-locked {
    border-color: rgba(138, 104, 19, 0.24);
    background: linear-gradient(135deg, rgba(247, 243, 232, 0.96), rgba(252, 250, 244, 0.96));
}

.curriculum-assessment-row.is-locked .curriculum-support-row-action {
    background: #6f5a25;
}

.lesson-assessment-lock-button {
    cursor: not-allowed;
    opacity: 0.82;
    pointer-events: none;
}

a.curriculum-assessment-row.is-locked {
    cursor: not-allowed;
    pointer-events: none;
}

.curriculum-support-row-icon {
    display: inline-grid;
    width: 2.85rem;
    height: 2.85rem;
    place-items: center;
    border-radius: 14px;
    background: rgba(26, 107, 107, 0.11);
    color: var(--teal);
    font-size: 1rem;
}

.curriculum-assessment-row .curriculum-support-row-icon {
    background: rgba(201, 168, 76, 0.16);
    color: #8a6813;
}

.curriculum-support-row-copy {
    display: grid;
    gap: 0.18rem;
    min-width: 0;
}

.curriculum-support-row-copy small {
    font-family: var(--mono);
    color: var(--teal);
    font-size: 0.61rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.curriculum-support-row-copy strong,
.curriculum-support-row-copy span {
    overflow-wrap: anywhere;
}

.curriculum-support-row-copy strong {
    color: var(--ink);
    font-size: 0.98rem;
    line-height: 1.35;
}

.curriculum-support-row-copy span {
    color: var(--mid);
    font-size: 0.82rem;
    line-height: 1.5;
}

.curriculum-support-row-metric {
    display: grid;
    min-width: 3.9rem;
    gap: 0.05rem;
    padding: 0.55rem 0.7rem;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.74);
    text-align: center;
}

.curriculum-support-row-metric strong {
    color: var(--ink);
    font-size: 1rem;
}

.curriculum-support-row-metric small {
    color: var(--mid);
    font-size: 0.62rem;
    text-transform: uppercase;
}

.curriculum-support-row-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    min-height: 2.65rem;
    padding: 0.65rem 0.9rem;
    border-radius: 12px;
    background: var(--teal);
    color: #fff;
    font-size: 0.78rem;
    font-weight: 800;
    white-space: nowrap;
}

.curriculum-support-empty {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-height: 5rem;
    padding: 1rem 1.1rem;
    border: 1px dashed rgba(26, 107, 107, 0.2);
    border-radius: 18px;
    background: rgba(247, 250, 249, 0.82);
    color: var(--mid);
}

.curriculum-support-empty i {
    color: var(--teal);
}

.lesson-sequence-list li {
    background: rgba(255, 255, 255, 0.04);
}

.lesson-sequence-list li strong,
.lesson-sequence-list li a {
    color: rgba(255, 255, 255, 0.9);
}

.lesson-sequence-list li span {
    color: rgba(255, 255, 255, 0.5);
}

.dark-panel .text-link {
    color: var(--gold-light);
}

.lesson-module-stack {
    display: grid;
    gap: 1rem;
}

.lesson-module-card {
    padding: 0.95rem;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.03);
}

.lesson-module-head {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
    align-items: flex-start;
    margin-bottom: 0.35rem;
}

.lesson-module-head strong {
    color: #fff;
    font-size: 0.88rem;
}

.lesson-module-head span {
    font-family: "Space Mono", monospace;
    font-size: 0.62rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.46);
}

.lesson-module-card > p {
    color: rgba(255, 255, 255, 0.52);
    font-size: 0.78rem;
    line-height: 1.6;
    margin-bottom: 0.8rem;
}

.table-wrap {
    overflow-x: auto;
}

.data-table {
    width: 100%;
    border-collapse: collapse;
}

.data-table th {
    text-align: left;
    font-family: "Space Mono", monospace;
    font-size: 0.65rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--mid);
    padding: 0.7rem 1rem;
    border-bottom: 1.5px solid var(--border);
}

.data-table td {
    padding: 0.8rem 1rem;
    border-bottom: 1px solid var(--border);
    font-size: 0.87rem;
}

.question-card {
    background: rgba(0, 0, 0, 0.02);
    border-radius: 4px;
    padding: 1rem;
    margin-bottom: 0.9rem;
}

.question-card h3 {
    font-size: 0.95rem;
    margin: 0.45rem 0 0.75rem;
}

.answer-options {
    display: grid;
    gap: 0.4rem;
}

.option-card {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.5rem 0.75rem;
    border-radius: 3px;
    margin-bottom: 0.2rem;
    cursor: pointer;
    transition: background 0.2s;
    font-size: 0.83rem;
    color: var(--mid);
    background: rgba(0, 0, 0, 0.03);
}

.option-card:hover {
    background: var(--teal-pale);
    color: var(--teal);
}

.option-card input {
    width: auto;
}

.timer-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 110px;
    padding: 0.7rem 1rem;
    border-radius: 3px;
    background: var(--ink);
    color: var(--cream);
    font-family: "Space Mono", monospace;
    font-size: 0.82rem;
}

.timer-badge.is-low-time {
    background: #8a6817;
    color: #fff8df;
    box-shadow: 0 12px 24px rgba(201, 168, 76, 0.22);
}

.timer-badge.is-urgent-time {
    background: #9b3027;
    color: #fff7f5;
    box-shadow: 0 12px 24px rgba(155, 48, 39, 0.24);
    animation: assessmentTimerPulse 1s ease-in-out infinite;
}

@keyframes assessmentTimerPulse {
    0%, 100% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.035);
    }
}

.certificate-wrapper {
    display: flex;
    justify-content: center;
}

.certificate-card {
    max-width: 760px;
    width: 100%;
    text-align: center;
    padding: 3rem 2rem;
    background: var(--cream);
    border: 1px solid var(--border);
}

.certificate-card h3 {
    font-size: 2rem;
}

.certificate-card h4 {
    font-size: 1.4rem;
    color: var(--teal);
}

.certificate-meta {
    display: flex;
    justify-content: center;
    gap: 1.5rem;
    flex-wrap: wrap;
    margin: 1.5rem 0;
    color: var(--mid);
    font-size: 0.85rem;
}

.certificate-verification-note {
    margin: 1.2rem auto 1.5rem;
    padding: 1rem 1.1rem;
    border: 1px solid var(--border);
    background: rgba(255, 255, 255, 0.72);
    max-width: 640px;
    display: grid;
    gap: 0.35rem;
    font-size: 0.84rem;
    color: var(--mid);
}

.certificate-verification-note strong {
    color: var(--ink);
}

.certificate-verification-note span {
    overflow-wrap: anywhere;
    word-break: break-word;
}

.certificate-verify-card.verified {
    border-top: 4px solid var(--sage);
}

.certificate-verify-card.invalid {
    border-top: 4px solid var(--rust);
}

.attempt-banner {
    margin-bottom: 1rem;
    padding: 0.85rem 1rem;
    border: 1px solid rgba(26, 107, 107, 0.16);
    background: rgba(26, 107, 107, 0.07);
    color: var(--ink);
    font-size: 0.85rem;
}

.attempt-banner-locked {
    border-color: rgba(192, 94, 58, 0.2);
    background: rgba(192, 94, 58, 0.08);
}

.assessment-hero-meta {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.assessment-grid {
    align-items: start;
}

.assessment-result-band {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1.5rem;
    padding: 1.6rem 1.8rem;
    border-radius: 14px;
    margin-bottom: 1.5rem;
    color: #fff;
}

.assessment-result-band.passed {
    background: linear-gradient(135deg, rgba(122, 173, 138, 0.98), rgba(26, 107, 107, 0.96));
}

.assessment-result-band.retry {
    background: linear-gradient(135deg, rgba(192, 94, 58, 0.98), rgba(201, 168, 76, 0.96));
}

.assessment-result-band.info {
    background: linear-gradient(135deg, rgba(26, 107, 107, 0.98), rgba(90, 119, 160, 0.96));
}

.assessment-result-band .eyebrow-inline,
.assessment-result-band h2,
.assessment-result-band p {
    color: #fff;
}

.assessment-result-score {
    min-width: 180px;
    padding: 1rem 1.2rem;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.14);
    display: grid;
    gap: 0.25rem;
    text-align: center;
}

.assessment-result-score strong {
    font-family: "Playfair Display", serif;
    font-size: 2rem;
    line-height: 1;
}

.assessment-summary-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    margin-bottom: 1.25rem;
}

.assessment-summary-card {
    padding: 1rem 1.1rem;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.82);
    display: grid;
    gap: 0.3rem;
}

.assessment-summary-card span {
    font-family: "Space Mono", monospace;
    font-size: 0.63rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--mid);
}

.assessment-summary-card strong {
    font-size: 1.15rem;
}

.assessment-outcome-copy {
    color: var(--mid);
    line-height: 1.7;
    margin-bottom: 1.2rem;
}

.pricing-flow-grid,
.pricing-hooks-grid {
    display: grid;
    gap: 1.5rem;
}

.pricing-flow-grid {
    grid-template-columns: 1fr 1fr;
}

.pricing-hooks-grid {
    grid-template-columns: 1fr;
}

.pricing-hook-card {
    padding: 1rem 1.1rem;
    border: 1px solid var(--border);
    background: rgba(255, 255, 255, 0.72);
    display: grid;
    gap: 0.35rem;
}

.pricing-hook-card strong {
    font-size: 0.92rem;
}

.pricing-hook-card span {
    color: var(--mid);
    font-size: 0.84rem;
    line-height: 1.6;
}

.admin-hero-band {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    gap: 1.5rem;
    margin-bottom: 1.4rem;
    padding: 1.7rem 1.8rem;
    border-radius: 14px;
    background: linear-gradient(135deg, rgba(13, 13, 13, 0.99), rgba(11, 39, 82, 0.95));
    color: #fff;
    box-shadow: 0 18px 48px rgba(13, 13, 13, 0.18);
}

.admin-hero-copy {
    display: grid;
    gap: 0.6rem;
    max-width: 66ch;
}

.admin-hero-band .eyebrow-inline,
.admin-hero-band h2,
.admin-hero-band p {
    color: #fff;
}

.admin-hero-band p {
    color: rgba(255, 255, 255, 0.82);
    line-height: 1.75;
    margin: 0;
}

.admin-hero-actions {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    justify-content: center;
    min-width: 240px;
}

.admin-hero-more-actions {
    position: relative;
    display: block;
}

.admin-hero-more-actions[open] {
    z-index: 20;
}

.admin-hero-more-actions > summary {
    list-style: none;
    width: 100%;
    cursor: pointer;
}

.admin-hero-more-actions > summary::-webkit-details-marker {
    display: none;
}

.admin-hero-more-actions > summary .fa-chevron-down {
    margin-left: auto;
    transition: transform 180ms ease;
}

.admin-hero-more-actions[open] > summary .fa-chevron-down {
    transform: rotate(180deg);
}

.admin-hero-more-panel {
    position: absolute;
    top: calc(100% + 0.5rem);
    right: 0;
    display: grid;
    gap: 0.4rem;
    width: max-content;
    min-width: 260px;
    max-width: min(340px, calc(100vw - 2rem));
    padding: 0.55rem;
    border: 1px solid rgba(15, 23, 42, 0.12);
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 20px 48px rgba(15, 23, 42, 0.22);
}

.admin-hero-more-panel a {
    display: flex;
    gap: 0.7rem;
    align-items: center;
    min-height: 44px;
    padding: 0.7rem 0.8rem;
    border-radius: 11px;
    color: var(--ink);
    font-weight: 800;
    text-decoration: none;
}

.admin-hero-more-panel a:hover,
.admin-hero-more-panel a:focus-visible {
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal-dark);
}

.ges-lesson-hero .button-secondary.light,
.ges-lesson-hero .button-secondary.light i,
.ges-lesson-hero .button-secondary.light span {
    border-color: rgba(15, 23, 42, 0.34);
    color: var(--ink);
}

.ges-lesson-hero .button-secondary.light {
    background: rgba(255, 255, 255, 0.94);
}

.ges-lesson-hero .button-secondary.light:hover,
.ges-lesson-hero .button-secondary.light:focus-visible {
    border-color: var(--teal);
    color: #fff;
    background: var(--teal);
}

.ges-lesson-hero .button-secondary.light:hover i,
.ges-lesson-hero .button-secondary.light:hover span,
.ges-lesson-hero .button-secondary.light:focus-visible i,
.ges-lesson-hero .button-secondary.light:focus-visible span {
    color: #fff;
}

/* Secondary actions sit on dark admin heroes, so their labels need a deliberate light treatment. */
.admin-hero-band:not(.admin-user-directory-hero) .button-secondary {
    border-color: rgba(255, 255, 255, 0.52);
    background-color: rgba(8, 43, 54, 0.94);
    color: #fff;
}

.admin-hero-band:not(.admin-user-directory-hero) .button-secondary i,
.admin-hero-band:not(.admin-user-directory-hero) .button-secondary span {
    color: #fff;
}

.admin-hero-band:not(.admin-user-directory-hero) .button-secondary:hover,
.admin-hero-band:not(.admin-user-directory-hero) .button-secondary:focus-visible {
    border-color: rgba(255, 255, 255, 0.82);
    background-color: var(--teal);
    color: #fff;
}

.admin-user-directory-hero {
    align-items: center;
    border: 1px solid rgba(255, 255, 255, 0.16);
    background:
        radial-gradient(circle at top right, rgba(232, 201, 122, 0.3), transparent 38%),
        linear-gradient(135deg, rgba(10, 42, 55, 0.98), rgba(26, 107, 107, 0.94));
    color: #fff;
    box-shadow: 0 18px 44px rgba(10, 42, 55, 0.16);
}

.admin-user-directory-hero .eyebrow-inline,
.admin-user-directory-hero h2 {
    color: #fff;
}

.admin-user-directory-hero p {
    max-width: 68ch;
    color: rgba(255, 255, 255, 0.82);
}

.admin-user-directory-hero .admin-hero-actions {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    min-width: min(100%, 420px);
}

.admin-user-directory-hero .button-secondary {
    background: rgba(255, 255, 255, 0.92);
    color: var(--ink);
}

.admin-user-directory-hero .button-primary {
    background: var(--teal);
    color: #fff;
    border-color: rgba(255, 255, 255, 0.16);
}

.admin-directory-pagination {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0.85rem;
    align-items: center;
    margin-top: 1.1rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(15, 23, 42, 0.1);
}

.admin-directory-pagination .button.is-disabled {
    opacity: 0.48;
    cursor: not-allowed;
}

.admin-directory-page-links {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    justify-content: center;
    align-items: center;
}

.admin-directory-page-link,
.admin-directory-page-ellipsis {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.5rem;
    min-height: 2.5rem;
    padding: 0.4rem;
    border-radius: 10px;
    color: var(--ink);
    font-weight: 800;
    text-decoration: none;
}

.admin-directory-page-link {
    border: 1px solid rgba(15, 23, 42, 0.12);
    background: rgba(255, 255, 255, 0.9);
}

.admin-directory-page-link:hover,
.admin-directory-page-link:focus-visible,
.admin-directory-page-link.is-active {
    border-color: var(--teal);
    background: var(--teal);
    color: #fff;
}

@media (max-width: 760px) {
    .admin-hero-more-actions {
        width: 100%;
    }

    .admin-hero-more-panel {
        position: static;
        width: 100%;
        min-width: 0;
        max-width: none;
        margin-top: 0.5rem;
    }

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

    .admin-directory-page-links {
        grid-column: 1 / -1;
        grid-row: 1;
    }

    .admin-directory-pagination > .button {
        width: 100%;
    }
}

.admin-pulse-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.admin-stat-grid {
    margin-bottom: 1.5rem;
}

.admin-dashboard-grid {
    grid-template-columns: minmax(0, 1.35fr) minmax(320px, 0.8fr);
    align-items: start;
    gap: 1.85rem;
}

.admin-dashboard-clean-grid {
    grid-template-columns: 1fr;
    gap: 1.25rem;
}

.admin-command-card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 1rem;
}

.admin-command-card-grid .student-pulse-card {
    min-height: 132px;
    border-radius: 18px;
    align-content: start;
}

.admin-command-card-grid .student-pulse-card strong {
    font-size: 1.55rem;
}

.admin-command-card-grid .student-pulse-card strong small {
    display: inline-block;
    font-family: "Space Mono", monospace;
    font-size: 0.62rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.admin-dashboard-hero {
    margin-bottom: 1rem;
}

.admin-actionable-metric-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin-bottom: 1rem;
}

.admin-actionable-metric-grid:has(> :only-child) {
    grid-template-columns: 1fr;
}

.admin-actionable-metric-grid:has(> :nth-child(2):last-child) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.admin-actionable-metric-grid:has(> :nth-child(3):last-child) {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.admin-actionable-metric-grid .student-pulse-card {
    min-height: 112px;
}

.admin-dashboard-workbench {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(300px, 0.72fr);
    gap: 1rem;
    align-items: start;
    scroll-margin-top: 1rem;
}

.admin-priority-queue-panel,
.admin-dashboard-activity-panel {
    min-width: 0;
    border-radius: 18px;
}

.admin-priority-queue-panel {
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.08), transparent 34%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(247, 244, 238, 0.94));
}

.admin-priority-queue-head {
    align-items: flex-start;
}

.admin-priority-queue-list {
    display: grid;
    gap: 0.7rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.admin-priority-queue-row {
    --priority-accent: var(--teal);
    display: grid;
    grid-template-columns: auto auto minmax(0, 1fr) auto;
    gap: 0.8rem;
    align-items: center;
    min-width: 0;
    padding: 0.85rem;
    border: 1px solid rgba(15, 23, 42, 0.09);
    border-left: 4px solid var(--priority-accent);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.88);
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.04);
}

.admin-priority-queue-row.tone-gold {
    --priority-accent: #b78918;
}

.admin-priority-queue-row.tone-ink {
    --priority-accent: #24364b;
}

.admin-priority-queue-row.tone-sage {
    --priority-accent: #347e69;
}

.admin-priority-rank {
    color: rgba(15, 23, 42, 0.48);
    font-family: "Space Mono", monospace;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.08em;
}

.admin-priority-icon {
    display: inline-grid;
    width: 2.55rem;
    height: 2.55rem;
    place-items: center;
    border-radius: 999px;
    color: var(--priority-accent);
    background: color-mix(in srgb, var(--priority-accent) 12%, white);
}

.admin-priority-copy {
    display: grid;
    min-width: 0;
    gap: 0.22rem;
}

.admin-priority-label {
    color: var(--priority-accent);
    font-family: "Space Mono", monospace;
    font-size: 0.61rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.admin-priority-copy > strong {
    color: var(--ink);
    font-size: 0.98rem;
    line-height: 1.35;
}

.admin-priority-copy > p {
    margin: 0;
    color: var(--mid);
    font-size: 0.8rem;
    line-height: 1.45;
}

.admin-priority-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem 0.75rem;
    align-items: center;
    margin-top: 0.28rem;
}

.admin-priority-meta > span:not(.pill) {
    display: inline-flex;
    gap: 0.32rem;
    align-items: center;
    color: #67717c;
    font-size: 0.7rem;
    font-weight: 700;
}

.admin-priority-action {
    white-space: nowrap;
}

.admin-priority-clear-state {
    display: flex;
    gap: 0.9rem;
    align-items: center;
    min-height: 112px;
    padding: 1rem;
    border: 1px solid rgba(52, 126, 105, 0.2);
    border-radius: 14px;
    background: rgba(231, 243, 238, 0.72);
}

.admin-priority-clear-state > span {
    display: inline-grid;
    width: 2.8rem;
    height: 2.8rem;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 999px;
    color: #347e69;
    background: #fff;
}

.admin-priority-clear-state strong,
.admin-priority-clear-state p {
    display: block;
    margin: 0;
}

.admin-priority-clear-state p {
    margin-top: 0.25rem;
    color: var(--mid);
    line-height: 1.5;
}

.admin-dashboard-activity-panel .student-activity-list {
    gap: 0.6rem;
    max-height: 28rem;
}

.admin-dashboard-activity-panel .student-activity-list li {
    padding: 0.72rem 0.8rem;
}

.admin-activity-view-all {
    display: inline-flex;
    gap: 0.4rem;
    align-items: center;
    color: var(--teal);
    font-size: 0.78rem;
    font-weight: 800;
    text-decoration: none;
}

.admin-activity-view-all:hover,
.admin-activity-view-all:focus-visible {
    color: var(--teal-dark);
    text-decoration: underline;
    text-underline-offset: 0.2rem;
}

.school-subject-access-shell {
    display: grid;
    gap: 1rem;
}

.school-subject-access-hero {
    margin-bottom: 0;
}

.school-subject-access-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.85rem;
}

.school-subject-access-metrics article {
    display: grid;
    gap: 0.25rem;
    min-height: 116px;
    padding: 1rem 1.1rem;
    border: 1px solid rgba(15, 23, 42, 0.09);
    border-radius: 18px;
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(235, 245, 243, 0.86));
    box-shadow: 0 14px 30px rgba(15, 23, 42, 0.06);
}

.school-subject-access-metrics article.is-warning {
    border-color: rgba(183, 74, 51, 0.35);
    background: linear-gradient(145deg, #fff, #fbefeb);
}

.school-subject-access-metrics span,
.school-subject-access-metrics small {
    color: var(--mid);
}

.school-subject-access-metrics span {
    font-family: "Space Mono", monospace;
    font-size: 0.65rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.school-subject-access-metrics strong {
    align-self: end;
    color: var(--ink);
    font-family: "Playfair Display", serif;
    font-size: clamp(1.8rem, 3vw, 2.45rem);
}

.school-subject-access-workbench {
    display: grid;
    grid-template-columns: minmax(300px, 0.72fr) minmax(0, 1.28fr);
    gap: 1rem;
    align-items: start;
}

.school-subject-classroom-list,
.school-subject-assignment-form {
    display: grid;
    gap: 0.75rem;
}

.school-subject-classroom-list {
    max-height: 34rem;
    overflow-y: auto;
    padding-right: 0.2rem;
}

.school-subject-classroom-panel .panel-head > .pill {
    white-space: nowrap;
}

.school-subject-classroom-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto auto;
    gap: 0.75rem;
    align-items: center;
    padding: 0.8rem;
    border: 1px solid rgba(15, 23, 42, 0.1);
    border-radius: 14px;
    color: var(--ink);
    background: rgba(255, 255, 255, 0.82);
    text-decoration: none;
}

.school-subject-classroom-row:hover,
.school-subject-classroom-row:focus-visible,
.school-subject-classroom-row.is-current {
    border-color: rgba(26, 107, 107, 0.42);
    background: rgba(232, 244, 242, 0.92);
    box-shadow: 0 10px 24px rgba(26, 107, 107, 0.08);
}

.school-subject-classroom-icon {
    display: inline-grid;
    width: 2.5rem;
    height: 2.5rem;
    place-items: center;
    border-radius: 999px;
    color: var(--teal);
    background: #e4f1ef;
}

.school-subject-classroom-copy,
.school-subject-classroom-count {
    display: grid;
    gap: 0.12rem;
}

.school-subject-classroom-copy small,
.school-subject-classroom-count small {
    color: var(--mid);
    font-size: 0.72rem;
}

.school-subject-classroom-count {
    text-align: right;
}

.school-subject-mode-fieldset,
.school-subject-learner-fieldset {
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
}

.school-subject-mode-fieldset legend,
.school-subject-learner-fieldset legend {
    margin-bottom: 0.65rem;
    color: var(--ink);
    font-weight: 800;
}

.school-subject-mode-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.65rem;
}

.school-subject-mode-option,
.school-subject-learner-option {
    display: flex;
    gap: 0.65rem;
    align-items: flex-start;
    padding: 0.78rem;
    border: 1px solid rgba(15, 23, 42, 0.1);
    border-radius: 13px;
    background: rgba(255, 255, 255, 0.86);
    cursor: pointer;
}

.school-subject-mode-option:has(input:checked),
.school-subject-learner-option:has(input:checked) {
    border-color: var(--teal);
    background: #edf7f5;
    box-shadow: inset 0 0 0 1px rgba(26, 107, 107, 0.12);
}

.school-subject-mode-option span,
.school-subject-learner-option span {
    display: grid;
    min-width: 0;
    gap: 0.18rem;
}

.school-subject-mode-option small,
.school-subject-learner-option small,
.school-subject-learner-fieldset > p {
    margin: 0;
    color: var(--mid);
    font-size: 0.76rem;
    line-height: 1.45;
}

.school-subject-learner-fieldset > p {
    margin-bottom: 0.65rem;
}

.school-subject-learner-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.55rem;
    max-height: 23rem;
    overflow-y: auto;
    padding: 0.1rem 0.25rem 0.1rem 0;
}

.school-subject-access-audit .student-activity-list {
    max-height: 22rem;
}

.school-subject-library-actions {
    justify-content: flex-end;
}

@media (max-width: 1100px) {
    .school-subject-access-workbench {
        grid-template-columns: 1fr;
    }

    .school-subject-classroom-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        max-height: 24rem;
    }
}

@media (max-width: 700px) {
    .school-subject-access-metrics,
    .school-subject-mode-grid,
    .school-subject-learner-list,
    .school-subject-classroom-list {
        grid-template-columns: 1fr;
    }

    .school-subject-classroom-row {
        grid-template-columns: auto minmax(0, 1fr) auto;
    }

    .school-subject-classroom-count {
        grid-column: 2;
        text-align: left;
    }

    .school-subject-library-actions {
        width: 100%;
    }

    .school-subject-library-actions .button {
        width: 100%;
    }
}

@media (max-width: 1040px) {
    .admin-dashboard-workbench {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 700px) {
    .admin-priority-queue-row {
        grid-template-columns: auto minmax(0, 1fr);
        align-items: start;
    }

    .admin-priority-icon {
        display: none;
    }

    .admin-priority-action {
        grid-column: 1 / -1;
        width: 100%;
    }
}

.admin-today-focus-panel {
    display: grid;
    gap: 1rem;
    margin-bottom: 1.15rem;
    padding: 1.1rem;
    border: 1px solid rgba(26, 107, 107, 0.14);
    border-radius: 18px;
    background:
        radial-gradient(circle at top left, rgba(26, 107, 107, 0.08), transparent 34%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(246, 242, 234, 0.9));
    box-shadow: 0 18px 42px rgba(15, 23, 42, 0.06);
}

.admin-today-focus-head {
    align-items: flex-start;
    margin: 0;
}

.admin-today-focus-head h3 {
    margin: 0.2rem 0 0;
    font-size: 1.05rem;
}

.admin-today-focus-strip {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.85rem;
}

.admin-today-focus-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.85rem;
    min-height: 108px;
    padding: 0.95rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 16px;
    color: var(--ink);
    text-decoration: none;
    background: rgba(255, 255, 255, 0.88);
    box-shadow: 0 14px 30px rgba(15, 23, 42, 0.05);
    transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.admin-today-focus-card:hover,
.admin-today-focus-card:focus-visible {
    transform: translateY(-2px);
    border-color: rgba(26, 107, 107, 0.3);
    box-shadow: 0 18px 34px rgba(15, 23, 42, 0.1);
}

.admin-today-focus-icon {
    width: 2.55rem;
    height: 2.55rem;
    border-radius: 999px;
    display: inline-grid;
    place-items: center;
    color: var(--teal);
    background: rgba(26, 107, 107, 0.1);
}

.admin-today-focus-copy {
    display: grid;
    min-width: 0;
    gap: 0.25rem;
}

.admin-today-focus-label {
    font-family: "Space Mono", monospace;
    font-size: 0.62rem;
    letter-spacing: 0.13em;
    text-transform: uppercase;
    color: var(--teal);
}

.admin-today-focus-copy strong {
    color: var(--ink);
    font-size: 0.98rem;
    line-height: 1.35;
}

.admin-today-focus-copy small {
    color: var(--mid);
    font-size: 0.78rem;
    line-height: 1.45;
}

.admin-today-focus-arrow {
    color: var(--teal);
}

.admin-today-focus-card.tone-gold .admin-today-focus-icon {
    color: #8a640a;
    background: rgba(217, 170, 43, 0.16);
}

.admin-today-focus-card.tone-ink .admin-today-focus-icon {
    color: var(--ink);
    background: rgba(15, 23, 42, 0.08);
}

.admin-today-focus-card.tone-sage .admin-today-focus-icon {
    color: #22775e;
    background: rgba(34, 119, 94, 0.12);
}

.admin-command-panel {
    border-radius: 18px;
}

.admin-command-panel .panel-head {
    align-items: flex-start;
}

.admin-action-lanes-panel {
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.07), transparent 34%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(247, 244, 238, 0.92));
}

.admin-action-lane-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.9rem;
}

.admin-action-lane-grid .tutor-priority-card {
    min-height: 132px;
    align-items: start;
}

.admin-action-lane-grid .tutor-priority-copy p {
    font-size: 0.84rem;
    line-height: 1.55;
}

.admin-top-snapshot-section {
    margin-bottom: 1.2rem;
}

.admin-focus-panel {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(242, 245, 250, 0.94));
}

.admin-focus-shell {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(250px, 0.75fr);
    gap: 1.25rem;
}

.admin-focus-primary {
    display: grid;
    gap: 0.9rem;
}

.admin-focus-primary h3 {
    margin: 0;
}

.admin-focus-primary p {
    color: var(--mid);
    line-height: 1.7;
}

.admin-focus-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem;
}

.admin-focus-mini-card,
.admin-focus-summary {
    padding: 1rem;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.88);
    display: grid;
    gap: 0.35rem;
}

.admin-focus-mini-card span,
.admin-focus-summary span {
    font-family: "Space Mono", monospace;
    font-size: 0.62rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--teal);
}

.admin-focus-mini-card strong,
.admin-focus-summary strong {
    font-size: 0.96rem;
    line-height: 1.5;
}

.admin-focus-summary p {
    margin: 0;
    color: var(--mid);
    line-height: 1.65;
}

.admin-focus-side {
    display: grid;
    gap: 0.85rem;
}

.admin-panel-copy {
    margin-top: 0.35rem;
    color: var(--brand-700);
    font-size: 0.88rem;
    line-height: 1.65;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.admin-ops-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.admin-ops-card {
    border: 1px solid var(--border);
    background: rgba(255, 255, 255, 0.72);
    padding: 1rem 1.1rem;
    display: grid;
    gap: 0.55rem;
}

.admin-ops-card strong {
    font-size: 0.95rem;
    line-height: 1.5;
}

.admin-ops-card p {
    margin: 0;
    color: var(--mid);
    font-size: 0.84rem;
}

.admin-ops-card a {
    color: var(--teal);
    font-weight: 600;
}

.curriculum-summary-grid {
    margin-bottom: 0;
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.curriculum-manager-panel,
.curriculum-signal-panel {
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.06), transparent 36%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(246, 242, 234, 0.94));
}

.curriculum-manager-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.curriculum-manager-card {
    display: grid;
    gap: 0.65rem;
    padding: 1.05rem 1.1rem;
    border-radius: 18px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.9);
    box-shadow: 0 14px 30px rgba(15, 23, 42, 0.05);
}

.curriculum-manager-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.7rem;
}

.curriculum-manager-icon {
    width: 2.45rem;
    height: 2.45rem;
    border-radius: 999px;
    display: inline-grid;
    place-items: center;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
    flex-shrink: 0;
}

.curriculum-manager-card strong {
    font-size: 1.02rem;
    line-height: 1.45;
    color: var(--ink);
}

.curriculum-manager-card p {
    margin: 0;
    color: var(--mid);
    line-height: 1.65;
}

.curriculum-manager-card a {
    color: var(--teal);
    font-weight: 700;
}

.curriculum-signal-panel .tutor-priority-list {
    margin-top: 0.25rem;
}

.admin-report-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.15rem;
}

.admin-lane-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
}

.admin-command-panel .admin-lane-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.admin-queue-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

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

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

.admin-user-note-list {
    display: grid;
    gap: 0.75rem;
}

.admin-user-note-item {
    display: grid;
    gap: 0.35rem;
    padding: 0.95rem 1rem;
    border-radius: 12px;
    border: 1px solid var(--border);
    background: rgba(255, 255, 255, 0.78);
}

.admin-user-note-item strong {
    font-size: 0.92rem;
    color: var(--ink);
}

.admin-user-note-item p {
    margin: 0;
    color: var(--mid);
    font-size: 0.84rem;
    line-height: 1.6;
}

.admin-account-directory {
    display: grid;
    gap: 0.9rem;
}

.admin-directory-search {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.8rem;
    margin-bottom: 0.9rem;
    padding: 0.85rem;
    border: 1px solid rgba(26, 107, 107, 0.1);
    border-radius: 18px;
    background:
        radial-gradient(circle at top right, rgba(198, 161, 74, 0.08), transparent 35%),
        rgba(255, 255, 255, 0.74);
}

.admin-directory-search-box {
    display: grid;
    gap: 0.4rem;
    min-width: 0;
}

.admin-directory-search-field {
    color: var(--teal);
    font-family: "Space Mono", monospace;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.admin-directory-search-input-wrap {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 0.65rem;
    width: 100%;
    min-height: 2.9rem;
    padding: 0 0.95rem;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.96);
    color: var(--teal);
}

.admin-directory-search-input-wrap input {
    width: 100%;
    min-width: 0;
    min-height: 2.75rem;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--ink);
    font: inherit;
}

.admin-directory-search-input-wrap:focus-within {
    outline: none;
    border-color: rgba(26, 107, 107, 0.4);
    box-shadow: 0 0 0 4px rgba(26, 107, 107, 0.08);
}

.admin-directory-search-input-wrap input:focus {
    outline: none;
}

.admin-directory-search-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.55rem;
}

.content-panel.is-loading-directory {
    opacity: 0.72;
    pointer-events: none;
}

.admin-role-filter-bar {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    margin-bottom: 1rem;
}

.admin-role-filter-chip {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    min-width: 118px;
    padding: 0.72rem 0.85rem;
    border-radius: 999px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.86);
    color: var(--mid);
    text-decoration: none;
    transition: transform 180ms ease, border-color 180ms ease, background 180ms ease, color 180ms ease;
}

.admin-role-filter-chip:hover,
.admin-role-filter-chip:focus-visible,
.admin-role-filter-chip.is-active {
    transform: translateY(-1px);
    border-color: rgba(26, 107, 107, 0.24);
    background: rgba(226, 241, 241, 0.96);
    color: var(--teal);
}

.admin-role-filter-chip span {
    font-weight: 700;
}

.admin-role-filter-chip strong {
    font-family: "Space Mono", monospace;
    font-size: 0.78rem;
    color: var(--ink);
}

.admin-account-row {
    position: relative;
    display: grid;
    grid-template-columns: minmax(260px, 1.4fr) auto minmax(250px, auto);
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.05rem 1rem 1.15rem;
    border-radius: var(--workspace-card-radius);
    border: 1px solid var(--workspace-card-border);
    background:
        radial-gradient(circle at top right, rgba(198, 161, 74, 0.08), transparent 38%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(246, 252, 250, 0.82));
    box-shadow: var(--workspace-card-shadow);
    color: inherit;
    transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease, background-color 180ms ease;
    overflow: hidden;
}

.admin-account-row::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: rgba(26, 107, 107, 0.55);
}

.admin-account-row:nth-child(even) {
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.08), transparent 38%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(255, 250, 235, 0.8));
}

.admin-account-row.role-tutor::before {
    background: rgba(198, 161, 74, 0.75);
}

.admin-account-row.role-school::before {
    background: rgba(73, 125, 116, 0.65);
}

.admin-account-row.role-admin::before {
    background: rgba(18, 28, 49, 0.5);
}

.admin-account-row:hover,
.admin-account-row:focus-visible {
    transform: translateY(-2px);
    box-shadow: 0 18px 36px rgba(15, 23, 42, 0.09);
    border-color: rgba(16, 132, 139, 0.22);
    background: rgba(247, 251, 251, 0.98);
}

.admin-account-row.needs-attention {
    border-color: rgba(201, 86, 33, 0.18);
    background: rgba(255, 251, 248, 0.96);
}

.admin-account-row-main {
    display: flex;
    align-items: center;
    gap: 0.9rem;
    min-width: 0;
}

.admin-account-row-avatar {
    width: 50px;
    height: 50px;
    border-radius: 999px;
    overflow: hidden;
    background: linear-gradient(135deg, rgba(16, 132, 139, 0.14), rgba(214, 180, 73, 0.2));
    display: grid;
    place-items: center;
    flex-shrink: 0;
    box-shadow: inset 0 0 0 1px rgba(26, 107, 107, 0.08);
}

.admin-account-row-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.admin-account-row-avatar span {
    font-size: 1.2rem;
    font-weight: 700;
    color: #154a62;
}

.admin-account-row-copy {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    min-width: 0;
}

.admin-account-row-copy strong {
    font-size: 1rem;
    line-height: 1.2;
    color: #10233a;
    word-break: break-word;
}

.admin-account-row-copy span,
.admin-account-row-copy small {
    color: var(--mid);
    line-height: 1.55;
}

.admin-account-row-copy span {
    font-size: 0.86rem;
}

.admin-account-row-copy small {
    font-size: 0.78rem;
}

.admin-account-row-meta {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.55rem;
    flex-shrink: 0;
    color: #166e76;
    font-size: 0.84rem;
    font-weight: 600;
}

.admin-role-pill.role-student {
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
}

.admin-role-pill.role-tutor {
    background: rgba(217, 170, 43, 0.16);
    color: #8a640a;
}

.admin-role-pill.role-school {
    background: rgba(34, 119, 94, 0.12);
    color: #22775e;
}

.admin-role-pill.role-admin {
    background: rgba(15, 23, 42, 0.08);
    color: var(--ink);
}

.admin-account-row-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.65rem;
}

.admin-account-timeline-panel {
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.06), transparent 34%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(247, 244, 238, 0.92));
}

.admin-user-related-panel {
    background:
        radial-gradient(circle at top right, rgba(201, 168, 76, 0.08), transparent 34%),
        rgba(255, 255, 255, 0.96);
}

.admin-record-disclosure {
    display: grid;
    gap: 0.9rem;
}

.admin-record-disclosure > summary {
    list-style: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.85rem;
    padding: 0.05rem 0 0.85rem;
    border-bottom: 1px solid rgba(15, 23, 42, 0.08);
    color: var(--ink);
}

.admin-record-disclosure > summary::-webkit-details-marker {
    display: none;
}

.admin-record-disclosure > summary span {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    font-weight: 900;
}

.admin-record-disclosure > summary small {
    margin-left: auto;
    padding: 0.35rem 0.6rem;
    border-radius: 999px;
    background: rgba(26, 107, 107, 0.1);
    font-family: "Space Mono", monospace;
    font-size: 0.62rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--teal);
}

.admin-record-disclosure > summary i:last-child {
    color: var(--teal);
    transition: transform 0.22s ease;
}

.admin-record-disclosure[open] > summary i:last-child {
    transform: rotate(180deg);
}

.admin-record-disclosure-action {
    width: 100%;
    justify-content: center;
}

.admin-account-timeline {
    position: relative;
    display: grid;
    gap: 0.9rem;
}

.admin-account-timeline::before {
    content: "";
    position: absolute;
    top: 1.1rem;
    bottom: 1.1rem;
    left: 1.15rem;
    width: 2px;
    background: linear-gradient(180deg, rgba(26, 107, 107, 0.28), rgba(217, 170, 43, 0.16));
}

.admin-account-timeline-item {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.85rem;
    align-items: start;
    padding: 0.95rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.9);
    box-shadow: 0 12px 26px rgba(15, 23, 42, 0.05);
}

.admin-account-timeline-icon {
    position: relative;
    z-index: 1;
    width: 2.35rem;
    height: 2.35rem;
    border-radius: 999px;
    display: inline-grid;
    place-items: center;
    color: var(--teal);
    background: rgba(26, 107, 107, 0.1);
    box-shadow: 0 0 0 5px rgba(255, 255, 255, 0.92);
}

.admin-account-timeline-copy {
    display: grid;
    gap: 0.26rem;
    min-width: 0;
}

.admin-account-timeline-copy span {
    font-family: "Space Mono", monospace;
    font-size: 0.62rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--teal);
}

.admin-account-timeline-copy strong {
    color: var(--ink);
    font-size: 0.96rem;
    line-height: 1.4;
}

.admin-account-timeline-copy p,
.admin-account-timeline-copy small {
    margin: 0;
    color: var(--mid);
    line-height: 1.55;
}

.admin-account-timeline-copy small {
    font-size: 0.76rem;
}

.admin-account-timeline-item.tone-gold .admin-account-timeline-icon {
    color: #8a640a;
    background: rgba(217, 170, 43, 0.16);
}

.admin-account-timeline-item.tone-ink .admin-account-timeline-icon {
    color: var(--ink);
    background: rgba(15, 23, 42, 0.08);
}

.admin-account-timeline-item.tone-sage .admin-account-timeline-icon {
    color: #22775e;
    background: rgba(34, 119, 94, 0.12);
}

.admin-directory-links-column {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 0.65rem;
}

.commercial-overview-card {
    padding: 1.15rem 1.2rem;
    border-radius: 16px;
    border: 1px solid var(--border);
    background: rgba(255, 255, 255, 0.9);
    display: grid;
    gap: 0.55rem;
    box-shadow: 0 14px 32px rgba(0, 0, 0, 0.05);
}

.commercial-overview-card.tone-teal {
    background: linear-gradient(145deg, rgba(232, 244, 244, 0.98), rgba(255, 255, 255, 0.95));
}

.commercial-overview-card.tone-gold {
    background: linear-gradient(145deg, rgba(255, 248, 229, 0.98), rgba(255, 255, 255, 0.95));
}

.commercial-overview-card.tone-ink {
    background: linear-gradient(145deg, rgba(243, 242, 239, 0.98), rgba(255, 255, 255, 0.95));
}

.commercial-overview-card.tone-sage {
    background: linear-gradient(145deg, rgba(239, 249, 242, 0.98), rgba(255, 255, 255, 0.95));
}

.commercial-overview-top {
    display: flex;
    align-items: center;
    gap: 0.7rem;
}

.commercial-overview-icon {
    width: 2.45rem;
    height: 2.45rem;
    border-radius: 999px;
    display: inline-grid;
    place-items: center;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
    flex-shrink: 0;
}

.commercial-overview-card.tone-gold .commercial-overview-icon {
    background: rgba(198, 161, 74, 0.16);
    color: #9a7110;
}

.commercial-overview-card.tone-ink .commercial-overview-icon {
    background: rgba(18, 28, 49, 0.1);
    color: #17243f;
}

.commercial-overview-card.tone-sage .commercial-overview-icon {
    background: rgba(73, 125, 116, 0.12);
    color: #3f7067;
}

.commercial-overview-card strong {
    font-family: "Playfair Display", serif;
    font-size: 1.85rem;
    line-height: 1;
    color: var(--ink);
}

.commercial-overview-card p {
    margin: 0;
    color: var(--ink);
    line-height: 1.55;
}

.commercial-watch-list,
.commercial-course-directory {
    display: grid;
    gap: 0.9rem;
}

.commercial-watch-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.9rem;
    align-items: start;
    padding: 1rem 1.05rem;
    border-radius: 14px;
    border: 1px solid rgba(201, 86, 33, 0.14);
    background: linear-gradient(180deg, rgba(255, 250, 245, 0.98), rgba(255, 255, 255, 0.94));
}

.commercial-watch-icon {
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 999px;
    display: inline-grid;
    place-items: center;
    background: rgba(201, 86, 33, 0.1);
    color: var(--rust);
}

.commercial-watch-copy {
    display: grid;
    gap: 0.25rem;
}

.commercial-watch-copy strong {
    font-size: 0.98rem;
    color: var(--ink);
}

.commercial-watch-copy p {
    margin: 0;
    color: var(--mid);
    font-size: 0.84rem;
    line-height: 1.6;
}

.commercial-snapshot-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.commercial-lane-panel {
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.08), transparent 35%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 245, 239, 0.92));
}

.commercial-lane-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.commercial-lane-card {
    display: grid;
    gap: 1rem;
    padding: 1.05rem;
    border-radius: 20px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-left: 5px solid rgba(26, 107, 107, 0.68);
    background: rgba(255, 255, 255, 0.9);
    box-shadow: 0 14px 30px rgba(15, 23, 42, 0.055);
}

.commercial-lane-card.tone-gold {
    border-left-color: rgba(201, 168, 76, 0.76);
    background:
        radial-gradient(circle at top right, rgba(224, 180, 83, 0.1), transparent 36%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(252, 249, 241, 0.92));
}

.commercial-lane-head {
    display: flex;
    gap: 0.9rem;
    align-items: flex-start;
}

.commercial-lane-head h3,
.commercial-lane-head p {
    margin: 0;
}

.commercial-lane-head p:not(.eyebrow-inline) {
    color: var(--mid);
    line-height: 1.6;
}

.commercial-lane-icon {
    width: 2.8rem;
    height: 2.8rem;
    border-radius: 18px;
    display: inline-grid;
    place-items: center;
    flex-shrink: 0;
    background: rgba(26, 107, 107, 0.11);
    color: var(--teal);
}

.commercial-lane-card.tone-gold .commercial-lane-icon {
    background: rgba(224, 180, 83, 0.16);
    color: #7a5a0a;
}

.commercial-lane-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.65rem;
}

.commercial-lane-metric {
    display: grid;
    gap: 0.2rem;
    padding: 0.72rem;
    border-radius: 14px;
    border: 1px solid rgba(15, 23, 42, 0.07);
    background: rgba(255, 255, 255, 0.8);
}

.commercial-lane-metric span {
    font-family: var(--mono);
    font-size: 0.6rem;
    letter-spacing: 0.11em;
    text-transform: uppercase;
    color: var(--teal);
}

.commercial-lane-metric strong {
    color: var(--ink);
    font-size: 1.05rem;
}

.commercial-access-section {
    margin-top: 1.5rem;
}

.commercial-signal-strip {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 0.65rem;
}

.commercial-signal-strip > div {
    min-width: 0;
    padding: 0.7rem 0.85rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.88);
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.04);
}

.commercial-signal-strip span,
.commercial-control-value span,
.commercial-control-table-head span {
    font-family: var(--mono);
    font-size: 0.63rem;
    font-weight: 700;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    color: var(--mid);
}

.commercial-signal-strip strong {
    display: block;
    margin-top: 0.2rem;
    font-family: "Playfair Display", serif;
    font-size: 1.3rem;
    line-height: 1;
    color: var(--ink);
}

.commercial-signal-strip > .needs-attention {
    border-color: rgba(181, 71, 55, 0.24);
    background: linear-gradient(145deg, rgba(255, 244, 240, 0.98), rgba(255, 255, 255, 0.94));
}

.commercial-signal-strip > .needs-attention span,
.commercial-signal-strip > .needs-attention strong {
    color: #9c3d2f;
}

.commercial-filter-panel {
    padding-block: 1rem;
}

.commercial-filter-panel .panel-head {
    margin-bottom: 0.65rem;
}

.commercial-filter-panel .ges-library-filter-grid {
    align-items: end;
}

.commercial-control-table-head,
.commercial-control-row {
    display: grid;
    grid-template-columns:
        minmax(230px, 1.65fr)
        minmax(90px, 0.55fr)
        minmax(115px, 0.72fr)
        minmax(105px, 0.68fr)
        minmax(90px, 0.58fr)
        minmax(126px, auto);
    gap: 0.75rem;
    align-items: center;
}

.commercial-control-table-head {
    padding: 0 0.8rem 0.55rem;
    border-bottom: 1px solid rgba(15, 23, 42, 0.1);
}

.commercial-course-directory {
    gap: 0.55rem;
    margin-top: 0.55rem;
}

.commercial-control-row {
    position: relative;
    min-height: 4.5rem;
    padding: 0.68rem 0.78rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-left: 4px solid rgba(26, 107, 107, 0.42);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.9);
    transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.commercial-control-row:hover,
.commercial-control-row:focus-within {
    border-color: rgba(26, 107, 107, 0.24);
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.07);
    transform: translateY(-1px);
}

.commercial-control-row.needs-attention {
    border-color: rgba(181, 71, 55, 0.2);
    border-left-color: #b54737;
    background: linear-gradient(90deg, rgba(255, 246, 242, 0.98), rgba(255, 255, 255, 0.94) 42%);
}

.commercial-control-course {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.7rem;
    align-items: center;
    min-width: 0;
}

.commercial-control-course-icon {
    display: inline-grid;
    place-items: center;
    width: 2.35rem;
    height: 2.35rem;
    border-radius: 12px;
    color: var(--teal);
    background: rgba(26, 107, 107, 0.1);
}

.commercial-control-course h3,
.commercial-control-course p {
    margin: 0;
}

.commercial-control-course h3 {
    overflow: hidden;
    color: var(--ink);
    font-family: inherit;
    font-size: 0.92rem;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.commercial-control-course p {
    overflow: hidden;
    margin-top: 0.15rem;
    color: var(--mid);
    font-size: 0.75rem;
    line-height: 1.35;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.commercial-control-value {
    min-width: 0;
}

.commercial-control-value > span {
    display: none;
}

.commercial-control-value strong {
    display: block;
    overflow: hidden;
    color: var(--ink);
    font-size: 0.82rem;
    line-height: 1.35;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.commercial-control-warning {
    grid-column: 1 / 6;
    display: flex;
    gap: 0.45rem;
    align-items: flex-start;
    margin-top: -0.15rem;
    padding: 0.45rem 0.6rem;
    border-radius: 9px;
    color: #8e3428;
    background: rgba(181, 71, 55, 0.08);
    font-size: 0.75rem;
    font-weight: 700;
    line-height: 1.4;
}

.commercial-control-warning i {
    margin-top: 0.15rem;
}

.commercial-control-action {
    width: 100%;
    min-width: 0;
    justify-content: center;
    white-space: nowrap;
}

.commercial-course-pagination {
    margin-top: 0.85rem;
    padding-top: 0.85rem;
}

.commercial-access-layout {
    align-items: start;
}

.commercial-settings-panel {
    position: sticky;
    top: 1rem;
}

.commercial-course-row {
    display: grid;
    gap: 0.85rem;
    padding: 1rem 1.05rem;
    border-radius: 18px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-left: 5px solid rgba(26, 107, 107, 0.42);
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.05), transparent 34%),
        rgba(255, 255, 255, 0.94);
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.06);
}

.commercial-course-row:nth-child(even) {
    border-left-color: rgba(201, 168, 76, 0.62);
    background:
        radial-gradient(circle at top right, rgba(224, 180, 83, 0.08), transparent 34%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.97), rgba(252, 249, 241, 0.92));
}

.commercial-course-row.is-selected {
    border-color: rgba(16, 132, 139, 0.26);
    border-left-color: rgba(16, 132, 139, 0.72);
    box-shadow: 0 16px 34px rgba(15, 23, 42, 0.08);
    background: linear-gradient(180deg, rgba(247, 251, 251, 0.98), rgba(255, 255, 255, 0.94));
}

.commercial-course-row-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.commercial-course-row-copy {
    display: grid;
    gap: 0.2rem;
}

.commercial-course-row-copy h3,
.commercial-settings-summary h3 {
    margin: 0;
}

.commercial-course-row-copy p,
.commercial-settings-summary p {
    margin: 0;
    color: var(--mid);
}

.commercial-course-row-status {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.45rem;
}

.oversight-overview-card {
    min-height: 100%;
    padding: var(--workspace-card-padding);
    border-radius: var(--workspace-card-radius);
    border: 1px solid var(--workspace-card-border);
    background: rgba(255, 255, 255, 0.9);
    display: grid;
    align-content: start;
    gap: 0.5rem;
    box-shadow: var(--workspace-card-shadow);
}

.oversight-overview-card.tone-teal {
    background: linear-gradient(145deg, rgba(232, 244, 244, 0.98), rgba(255, 255, 255, 0.95));
}

.oversight-overview-card.tone-gold {
    background: linear-gradient(145deg, rgba(255, 248, 229, 0.98), rgba(255, 255, 255, 0.95));
}

.oversight-overview-card.tone-ink {
    background: linear-gradient(145deg, rgba(243, 242, 239, 0.98), rgba(255, 255, 255, 0.95));
}

.oversight-overview-card.tone-sage {
    background: linear-gradient(145deg, rgba(239, 249, 242, 0.98), rgba(255, 255, 255, 0.95));
}

.oversight-overview-top {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-width: 0;
}

.oversight-overview-top > div {
    display: grid;
    gap: 0.28rem;
    min-width: 0;
}

.oversight-overview-top span,
.oversight-overview-card > span,
.course-detail-overview-top span,
.student-pulse-card span,
.school-hero-summary-card span {
    font-family: "Space Mono", monospace;
    font-size: 0.62rem;
    letter-spacing: 0.14em;
    line-height: 1.35;
    text-transform: uppercase;
    color: var(--teal);
}

.oversight-overview-icon {
    width: 2.55rem;
    height: 2.55rem;
    border-radius: 999px;
    display: inline-grid;
    place-items: center;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
    flex-shrink: 0;
}

.oversight-overview-card.tone-gold .oversight-overview-icon {
    background: rgba(198, 161, 74, 0.16);
    color: #9a7110;
}

.oversight-overview-card.tone-ink .oversight-overview-icon {
    background: rgba(18, 28, 49, 0.1);
    color: #17243f;
}

.oversight-overview-card.tone-sage .oversight-overview-icon {
    background: rgba(73, 125, 116, 0.12);
    color: #3f7067;
}

.oversight-overview-card strong {
    font-family: "Playfair Display", serif;
    font-size: clamp(1.45rem, 2vw, 1.85rem);
    line-height: 1;
    color: var(--ink);
    overflow-wrap: anywhere;
}

.oversight-overview-card p {
    margin: 0;
    color: var(--mid);
    line-height: 1.55;
    font-size: 0.92rem;
}

.oversight-summary-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.oversight-section + .oversight-section {
    margin-top: 1.8rem;
}

.oversight-queue-panel {
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.1), transparent 34%),
        linear-gradient(180deg, rgba(238, 246, 246, 0.98), rgba(247, 243, 235, 0.96));
    border-color: rgba(26, 107, 107, 0.18);
    box-shadow: 0 18px 40px rgba(26, 107, 107, 0.08);
}

.oversight-watch-list,
.oversight-course-list {
    display: grid;
    gap: 0.9rem;
}

.oversight-watch-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.9rem;
    align-items: start;
    padding: 1rem 1.05rem;
    border-radius: 14px;
    border: 1px solid rgba(201, 168, 76, 0.18);
    background: linear-gradient(180deg, rgba(255, 250, 245, 0.98), rgba(255, 255, 255, 0.94));
}

.oversight-watch-icon {
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 999px;
    display: inline-grid;
    place-items: center;
    background: rgba(201, 86, 33, 0.1);
    color: var(--rust);
}

.oversight-watch-copy {
    display: grid;
    gap: 0.22rem;
}

.oversight-watch-copy strong {
    color: var(--ink);
    font-size: 0.98rem;
}

.oversight-watch-copy p {
    margin: 0;
    color: var(--mid);
    font-size: 0.84rem;
    line-height: 1.6;
}

.oversight-guide-grid {
    display: grid;
    gap: 0.85rem;
}

.oversight-guide-card {
    display: grid;
    gap: 0.35rem;
    padding: 1rem 1.05rem;
    border-radius: 14px;
    border: 1px solid var(--border);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(248, 245, 239, 0.92));
}

.oversight-guide-card p {
    margin: 0;
    color: var(--mid);
    line-height: 1.6;
}

.oversight-commercial-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.9rem;
}

.oversight-commercial-card {
    display: grid;
    gap: 0.28rem;
    padding: 1rem 1.05rem;
    border-radius: 16px;
    border: 1px solid var(--border);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(248, 245, 239, 0.92));
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.05);
}

.oversight-commercial-icon {
    width: 2.35rem;
    height: 2.35rem;
    border-radius: 999px;
    display: inline-grid;
    place-items: center;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
    margin-bottom: 0.2rem;
}

.oversight-commercial-card.tone-gold .oversight-commercial-icon {
    background: rgba(198, 161, 74, 0.16);
    color: #9a7110;
}

.oversight-commercial-card.tone-ink .oversight-commercial-icon {
    background: rgba(18, 28, 49, 0.1);
    color: #17243f;
}

.oversight-commercial-card.tone-sage .oversight-commercial-icon {
    background: rgba(73, 125, 116, 0.12);
    color: #3f7067;
}

.oversight-commercial-card span {
    font-size: 0.72rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--mid);
}

.oversight-commercial-card strong {
    font-size: 1rem;
    color: var(--ink);
}

.oversight-commercial-card p {
    margin: 0;
    color: var(--mid);
    line-height: 1.55;
}

.oversight-filter-shell {
    display: grid;
    gap: 0.9rem;
    margin: 1.15rem 0 1.35rem;
    padding: 1rem 1.05rem;
    border-radius: 16px;
    border: 1px solid var(--border);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(248, 245, 239, 0.9));
}

.admin-course-search-field {
    grid-column: span 2;
}

.admin-course-pagination-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.9rem;
    margin: 0 0 1rem;
    padding: 0.8rem 0.9rem;
    border-radius: 14px;
    border: 1px solid rgba(26, 107, 107, 0.14);
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.08), transparent 34%),
        rgba(255, 255, 255, 0.78);
}

.admin-course-pagination-row .button-row {
    justify-content: flex-end;
}

.admin-course-pagination-row-bottom {
    margin: 1rem 0 0;
}

.oversight-course-row {
    position: relative;
    display: grid;
    gap: 0.85rem;
    padding: 1.05rem 1.1rem 1.05rem 1.25rem;
    border-radius: 18px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.08), transparent 34%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(244, 250, 249, 0.9));
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.05);
    overflow: hidden;
    transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

.oversight-course-row::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 6px;
    background: rgba(26, 107, 107, 0.58);
}

.oversight-course-row:nth-child(even) {
    background:
        radial-gradient(circle at top right, rgba(198, 161, 74, 0.12), transparent 36%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(255, 250, 237, 0.9));
}

.oversight-course-row:hover,
.oversight-course-row:focus-within {
    transform: translateY(-2px);
    border-color: rgba(26, 107, 107, 0.2);
    box-shadow: 0 18px 36px rgba(15, 23, 42, 0.09);
}

.oversight-course-row.status-pending_review::before,
.oversight-course-row.status-draft::before {
    background: rgba(198, 161, 74, 0.82);
}

.oversight-course-row.status-published::before {
    background: rgba(73, 125, 116, 0.72);
}

.oversight-course-row.status-rejected::before {
    background: rgba(181, 75, 48, 0.72);
}

.oversight-course-row.needs-attention {
    border-color: rgba(201, 168, 76, 0.28);
    box-shadow: 0 16px 30px rgba(201, 168, 76, 0.1);
}

.oversight-course-row.access-premium {
    border-right: 4px solid rgba(198, 161, 74, 0.34);
}

.oversight-course-row.access-school-package {
    border-right: 4px solid rgba(73, 125, 116, 0.32);
}

.oversight-course-row.access-free-preview {
    border-right: 4px solid rgba(26, 107, 107, 0.28);
}

.oversight-course-row-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.oversight-course-row-copy {
    display: grid;
    gap: 0.2rem;
}

.oversight-course-row-copy h3 {
    margin: 0;
}

.oversight-course-row-copy p {
    margin: 0;
    color: var(--mid);
}

.oversight-course-row-status {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.45rem;
}

.oversight-course-row-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.8rem;
}

.oversight-course-stat {
    display: grid;
    gap: 0.18rem;
    padding: 0.8rem 0.85rem;
    border-radius: 12px;
    border: 1px solid var(--border);
    background: rgba(248, 245, 239, 0.62);
}

.oversight-course-stat span {
    font-size: 0.72rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--mid);
}

.oversight-course-stat strong {
    font-size: 0.95rem;
    color: var(--ink);
}

.commercial-course-row-stats,
.commercial-settings-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.8rem;
}

.commercial-course-row-stats-compact {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.commercial-course-stat,
.commercial-settings-summary-item {
    display: grid;
    gap: 0.18rem;
    padding: 0.8rem 0.85rem;
    border-radius: 12px;
    border: 1px solid var(--border);
    background: rgba(248, 245, 239, 0.62);
}

.commercial-course-stat span,
.commercial-settings-summary-item span {
    font-size: 0.72rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--mid);
}

.commercial-course-stat strong,
.commercial-settings-summary-item strong {
    font-size: 0.95rem;
    color: var(--ink);
}

.commercial-settings-summary {
    display: grid;
    gap: 0.8rem;
    padding: 1rem 1.05rem;
    border-radius: 16px;
    border: 1px solid rgba(16, 132, 139, 0.14);
    background: linear-gradient(180deg, rgba(243, 250, 250, 0.98), rgba(255, 255, 255, 0.94));
}

.commercial-settings-context-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    margin-top: 1rem;
}

.commercial-settings-context-card,
.commercial-settings-editor {
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
}

.commercial-settings-form {
    margin-top: 0.9rem;
}

.admin-lane-card,
.admin-queue-card {
    display: grid;
    gap: 0.6rem;
    padding: 1.1rem 1.15rem;
    border: 1px solid var(--border);
    border-radius: 12px;
    background:
        radial-gradient(circle at top right, rgba(198, 161, 74, 0.08), transparent 42%),
        rgba(255, 255, 255, 0.78);
    box-shadow: 0 14px 30px rgba(11, 25, 34, 0.05);
}

.admin-queue-card {
    text-decoration: none;
    color: inherit;
}

.admin-publishing-lane-grid .admin-queue-card {
    min-height: 13rem;
    border-left: 5px solid rgba(26, 107, 107, 0.52);
}

.admin-publishing-lane-grid .admin-queue-card.tone-gold {
    border-left-color: rgba(201, 168, 76, 0.76);
}

.admin-publishing-lane-grid .admin-queue-card.tone-ink {
    border-left-color: rgba(15, 23, 42, 0.28);
}

.admin-publishing-lane-grid .admin-queue-card.tone-sage {
    border-left-color: rgba(73, 125, 116, 0.6);
}

.admin-lane-card strong,
.admin-queue-card strong {
    font-size: 1rem;
    line-height: 1.45;
}

.admin-lane-card p,
.admin-queue-card p {
    margin: 0;
    color: var(--mid);
    font-size: 0.84rem;
    line-height: 1.65;
}

.admin-lane-icon,
.admin-queue-icon {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 999px;
    display: inline-grid;
    place-items: center;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
}

.admin-lane-card.tone-gold .admin-lane-icon,
.admin-queue-card.tone-gold .admin-queue-icon {
    background: rgba(198, 161, 74, 0.15);
    color: #9a7110;
}

.admin-lane-card.tone-ink .admin-lane-icon,
.admin-queue-card.tone-ink .admin-queue-icon {
    background: rgba(18, 28, 49, 0.1);
    color: #17243f;
}

.admin-lane-card.tone-sage .admin-lane-icon,
.admin-queue-card.tone-sage .admin-queue-icon {
    background: rgba(73, 125, 116, 0.12);
    color: #3f7067;
}

.admin-queue-card:hover,
.admin-queue-card:focus-visible {
    transform: translateY(-2px);
    box-shadow: 0 18px 36px rgba(11, 25, 34, 0.08);
}

.admin-queue-compact-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.admin-queue-compact-grid .admin-queue-card {
    min-height: 136px;
}

.admin-queue-list-panel {
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.055), transparent 34%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.99), rgba(247, 244, 238, 0.93));
}

.admin-queue-list-panel .admin-operational-list {
    gap: 0.85rem;
}

.admin-queue-compact-row {
    align-items: center;
    padding: 0.95rem 1rem;
}

.admin-queue-compact-row .admin-operational-main {
    align-items: center;
}

.admin-queue-compact-row .admin-operational-meta {
    align-content: center;
}

.admin-operational-row.admin-verification-queue-row {
    display: block;
    padding: 0;
    overflow: hidden;
}

.admin-operational-row.admin-verification-queue-row .admin-verification-row-summary {
    display: grid;
    gap: 0.85rem;
    padding: 1rem;
}

.admin-operational-row.admin-verification-queue-row .admin-verification-row-summary .admin-operational-main {
    padding: 0.1rem 0;
}

.admin-operational-row.admin-verification-queue-row .admin-operational-meta.admin-verification-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    width: 100%;
}

.admin-verification-stats > div {
    min-height: 4.7rem;
    align-content: center;
}

.admin-verification-stats strong {
    overflow-wrap: anywhere;
}

.admin-row-detail-disclosure.admin-verification-review-disclosure {
    margin: 0.15rem 0 0;
    padding: 0;
    border: 1px solid rgba(26, 107, 107, 0.14);
    border-radius: 16px;
    background: rgba(247, 251, 253, 0.7);
}

.admin-row-detail-disclosure.admin-verification-review-disclosure > summary {
    grid-template-columns: auto auto minmax(0, 1fr) auto;
    padding: 0.82rem 1rem;
}

.admin-verification-review-disclosure > summary > span:first-child {
    width: 1.9rem;
    height: 1.9rem;
    border-radius: 10px;
    display: inline-grid;
    place-items: center;
    background: rgba(26, 107, 107, 0.11);
    color: var(--teal);
}

.admin-verification-review-hint {
    color: var(--mid);
    font-size: 0.82rem;
    justify-self: start;
}

.admin-verification-review-panel {
    padding: 0 1rem 1rem;
}

.admin-verification-review-panel .stack-form {
    display: grid;
    gap: 0.9rem;
    max-width: none;
    padding: 1rem;
    border: 1px solid rgba(26, 107, 107, 0.14);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.88);
}

.admin-row-detail-disclosure {
    display: grid;
    gap: 0.65rem;
    margin-top: 0.7rem;
    padding: 0.72rem 0.78rem;
    border-radius: 16px;
}

.admin-row-detail-disclosure > summary {
    list-style: none;
    cursor: pointer;
    display: grid;
    grid-template-columns: auto auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.55rem;
}

.admin-row-detail-disclosure > summary::-webkit-details-marker {
    display: none;
}

.admin-row-detail-disclosure > summary > i:last-child {
    color: var(--teal);
    transition: transform 0.22s ease;
}

.admin-row-detail-disclosure[open] > summary > i:last-child {
    transform: rotate(180deg);
}

.admin-row-detail-disclosure > summary strong,
.admin-row-detail-disclosure > summary span:not(.payment-next-step-icon) {
    min-width: 0;
}

.admin-row-detail-disclosure > p {
    margin: 0;
    color: var(--mid);
    line-height: 1.55;
}

.admin-row-detail-disclosure .button {
    width: fit-content;
}

.admin-queue-compact-row .payment-next-step-card {
    box-shadow: none;
}

/* Keep manual payment decisions readable even when several actions are available. */
.admin-payment-queue-row {
    display: grid;
    grid-template-columns: minmax(240px, 1fr) minmax(360px, 1.2fr) minmax(245px, 0.8fr);
    gap: 1rem;
    align-items: center;
    padding: 1rem 1.05rem 1rem 1.2rem;
    border-radius: 18px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-left: 5px solid rgba(26, 107, 107, 0.42);
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.06), transparent 34%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(247, 251, 253, 0.92));
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.05);
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.admin-payment-queue-row.needs-attention {
    border-left-color: rgba(201, 168, 76, 0.82);
}

.admin-payment-queue-row.activation-success {
    border-left-color: rgba(26, 107, 107, 0.72);
}

.admin-payment-ledger-intro,
.admin-payment-ledger-note {
    margin: 0 0 1rem;
    color: var(--muted);
    line-height: 1.55;
}

.admin-payment-ledger-note {
    margin: 1rem 0 0;
    font-size: 0.84rem;
}

.school-external-payment-row.status-recorded {
    border-left-color: rgba(26, 107, 107, 0.82);
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.09), transparent 34%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(240, 249, 248, 0.94));
}

.school-external-payment-row.status-voided {
    border-left-color: rgba(132, 48, 48, 0.72);
    background:
        radial-gradient(circle at top right, rgba(132, 48, 48, 0.06), transparent 34%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(253, 246, 246, 0.94));
}

.admin-school-payment-ledger .admin-payment-queue-actions {
    justify-content: flex-start;
}

.admin-payment-queue-row:hover,
.admin-payment-queue-row:focus-within {
    transform: translateY(-1px);
    box-shadow: 0 18px 34px rgba(15, 23, 42, 0.08);
}

.admin-payment-queue-heading {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    column-gap: 0.85rem;
    row-gap: 0.45rem;
    align-items: start;
    min-width: 0;
}

/* Keep the identity copy readable when a request also carries a long status label. */
.admin-payment-queue-heading .pill {
    grid-column: 2;
    justify-self: start;
}

.admin-payment-queue-copy {
    display: grid;
    gap: 0.28rem;
    min-width: 0;
}

.admin-payment-queue-copy h3,
.admin-payment-queue-copy p {
    margin: 0;
}

.admin-payment-queue-copy p:not(.eyebrow-inline) {
    color: var(--mid);
    line-height: 1.45;
    overflow-wrap: anywhere;
}

.admin-payment-queue-next-step strong {
    color: var(--ink);
}

.admin-payment-queue-metrics {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.6rem;
}

.admin-payment-queue-metrics > div {
    display: grid;
    gap: 0.2rem;
    min-width: 0;
    padding: 0.65rem 0.7rem;
    border: 1px solid rgba(15, 23, 42, 0.07);
    border-radius: 13px;
    background: rgba(255, 255, 255, 0.82);
}

.admin-payment-queue-metrics span {
    font-family: var(--mono);
    font-size: 0.58rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--teal);
}

.admin-payment-queue-metrics strong {
    overflow-wrap: anywhere;
}

.admin-payment-queue-actions,
.admin-payment-queue-actions .admin-inline-form {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
}

.admin-payment-queue-actions .button {
    white-space: nowrap;
}

@media (max-width: 1180px) {
    .admin-payment-queue-row {
        grid-template-columns: minmax(0, 1fr) minmax(320px, 1fr);
    }

    .admin-payment-queue-actions {
        grid-column: 1 / -1;
        padding-top: 0.8rem;
        border-top: 1px solid rgba(15, 23, 42, 0.07);
    }
}

@media (max-width: 700px) {
    .admin-payment-queue-row,
    .admin-payment-queue-metrics {
        grid-template-columns: 1fr;
    }

    .admin-payment-queue-heading {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .admin-payment-queue-heading .pill {
        grid-column: 2;
        justify-self: start;
    }
}

.admin-bulk-policy-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.admin-bulk-policy-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.9rem;
    align-items: start;
    padding: 1.1rem;
    border: 1px solid var(--border);
    border-radius: 16px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.94), rgba(246, 252, 250, 0.72)),
        rgba(255, 255, 255, 0.8);
    box-shadow: 0 16px 32px rgba(11, 25, 34, 0.05);
}

.admin-bulk-policy-card.tone-gold {
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.94), rgba(255, 249, 232, 0.72)),
        rgba(255, 255, 255, 0.8);
}

.admin-bulk-policy-icon {
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 999px;
    display: inline-grid;
    place-items: center;
    background: rgba(26, 107, 107, 0.12);
    color: var(--teal);
}

.admin-bulk-policy-card.tone-gold .admin-bulk-policy-icon {
    background: rgba(198, 161, 74, 0.18);
    color: #9a7110;
}

.admin-bulk-policy-copy {
    display: grid;
    gap: 0.55rem;
}

.admin-bulk-policy-copy strong {
    font-size: 1rem;
}

.admin-bulk-policy-copy p {
    margin: 0;
    color: var(--mid);
    font-size: 0.86rem;
    line-height: 1.65;
}

.admin-bulk-policy-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.admin-bulk-policy-tags span {
    padding: 0.35rem 0.55rem;
    border: 1px solid rgba(26, 107, 107, 0.12);
    border-radius: 999px;
    background: rgba(239, 249, 247, 0.82);
    color: var(--ink);
    font-size: 0.73rem;
    font-weight: 800;
}

.compact-management-list {
    gap: 1rem;
}

.admin-report-card {
    display: grid;
    gap: 0.55rem;
    padding: 1.15rem 1.2rem;
    border: 1px solid var(--border);
    border-radius: 12px;
    background:
        radial-gradient(circle at top right, rgba(198, 161, 74, 0.08), transparent 42%),
        rgba(255, 255, 255, 0.78);
    box-shadow: 0 14px 30px rgba(11, 25, 34, 0.05);
}

.admin-report-card strong {
    font-size: 1.02rem;
    line-height: 1.45;
}

.admin-report-card p {
    margin: 0;
    color: var(--mid);
    font-size: 0.84rem;
    line-height: 1.65;
}

.admin-report-icon {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 999px;
    display: inline-grid;
    place-items: center;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
}

.admin-report-card.tone-gold .admin-report-icon {
    background: rgba(198, 161, 74, 0.15);
    color: #9a7110;
}

.admin-report-card.tone-ink .admin-report-icon {
    background: rgba(18, 28, 49, 0.1);
    color: #17243f;
}

.admin-report-card.tone-sage .admin-report-icon {
    background: rgba(73, 125, 116, 0.12);
    color: #3f7067;
}

.admin-report-link {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    margin-top: 0.15rem;
    color: var(--teal);
    font-weight: 700;
    text-decoration: none;
}

.admin-report-link:hover,
.admin-report-link:focus-visible {
    color: var(--ink);
}

.admin-queue-link {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    margin-top: 0.15rem;
    color: var(--teal);
    font-weight: 700;
}

.admin-queue-summary-grid .student-pulse-card {
    min-height: 118px;
    align-content: start;
}

.admin-queue-filter-panel {
    margin-bottom: 0.2rem;
}

.admin-queue-filter-panel .ges-library-filter-grid {
    margin-top: 0;
}

.admin-active-filter-strip {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.75rem;
    margin-top: 0.9rem;
    padding: 0.78rem 0.85rem;
    border: 1px solid rgba(26, 107, 107, 0.12);
    border-radius: 18px;
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.08), transparent 34%),
        rgba(255, 255, 255, 0.84);
}

.admin-active-filter-copy {
    display: grid;
    gap: 0.1rem;
}

.admin-active-filter-copy span,
.admin-active-filter-chip span {
    font-family: var(--mono);
    font-size: 0.6rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--teal);
}

.admin-active-filter-copy strong {
    color: var(--ink);
    font-size: 0.9rem;
}

.admin-active-filter-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    min-width: 0;
}

.admin-active-filter-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    min-height: 2.15rem;
    padding: 0.4rem 0.62rem;
    border-radius: 999px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(237, 247, 247, 0.86);
}

.admin-active-filter-chip strong {
    color: var(--ink);
    font-size: 0.82rem;
}

.admin-operational-list {
    display: grid;
    gap: 0.95rem;
}

.admin-operational-row {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(240px, 0.7fr) minmax(220px, auto);
    gap: 1rem;
    align-items: center;
    padding: 1rem 1.05rem 1rem 1.2rem;
    border-radius: 18px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-left: 5px solid rgba(26, 107, 107, 0.42);
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.06), transparent 34%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(247, 251, 253, 0.92));
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.05);
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.admin-operational-row.needs-attention {
    border-left-color: rgba(201, 168, 76, 0.82);
}

.admin-operational-row.trust-verified {
    border-left-color: rgba(26, 107, 107, 0.72);
}

.admin-operational-row.trust-unverified {
    border-left-color: rgba(158, 65, 52, 0.7);
    background:
        radial-gradient(circle at top right, rgba(158, 65, 52, 0.06), transparent 34%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(252, 247, 244, 0.92));
}

.admin-operational-row.trust-needs-review {
    border-left-color: rgba(201, 168, 76, 0.86);
    background:
        radial-gradient(circle at top right, rgba(201, 168, 76, 0.08), transparent 34%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(252, 249, 241, 0.94));
}

.admin-operational-row.activation-success {
    border-left-color: rgba(26, 107, 107, 0.72);
}

.admin-operational-row.activation-ink {
    border-left-color: rgba(15, 23, 42, 0.24);
}

.admin-operational-row:hover,
.admin-operational-row:focus-within {
    transform: translateY(-1px);
    box-shadow: 0 18px 34px rgba(15, 23, 42, 0.08);
}

.admin-operational-main {
    display: flex;
    align-items: flex-start;
    gap: 0.9rem;
    min-width: 0;
}

.admin-operational-icon {
    width: 2.7rem;
    height: 2.7rem;
    border-radius: 16px;
    display: inline-grid;
    place-items: center;
    flex-shrink: 0;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
}

.admin-operational-main h3 {
    margin: 0;
}

.admin-operational-main p {
    margin: 0.25rem 0 0;
    color: var(--mid);
    line-height: 1.55;
}

.payment-next-step-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0.75rem;
    align-items: center;
    margin-top: 0.85rem;
    padding: 0.78rem 0.85rem;
    border-radius: 16px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.82);
}

.payment-next-step-card.tone-warning {
    border-color: rgba(201, 168, 76, 0.26);
    background: rgba(252, 249, 241, 0.92);
}

.payment-next-step-card.tone-success {
    border-color: rgba(26, 107, 107, 0.18);
    background: rgba(236, 245, 244, 0.86);
}

.payment-next-step-card.tone-ink {
    background: rgba(15, 23, 42, 0.04);
}

.payment-next-step-icon {
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 14px;
    display: inline-grid;
    place-items: center;
    flex-shrink: 0;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
}

.payment-next-step-card.tone-warning .payment-next-step-icon {
    background: rgba(224, 180, 83, 0.16);
    color: #7a5a0a;
}

.payment-next-step-card.tone-ink .payment-next-step-icon {
    background: rgba(15, 23, 42, 0.08);
    color: var(--ink);
}

.payment-next-step-card span:not(.payment-next-step-icon) {
    font-family: var(--mono);
    font-size: 0.6rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--teal);
}

.payment-next-step-card strong {
    display: block;
    margin-top: 0.12rem;
    color: var(--ink);
}

.payment-next-step-card p {
    margin: 0.15rem 0 0;
    color: var(--mid);
    line-height: 1.5;
}

.certificate-trust-state-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.72rem;
    align-items: start;
    margin-top: 0.8rem;
    padding: 0.78rem 0.85rem;
    border-radius: 16px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.84);
}

.certificate-trust-state-card > span {
    width: 2.2rem;
    height: 2.2rem;
    border-radius: 14px;
    display: inline-grid;
    place-items: center;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
}

.certificate-trust-state-card.tone-warning {
    border-color: rgba(158, 65, 52, 0.18);
    background: rgba(252, 247, 244, 0.94);
}

.certificate-trust-state-card.tone-warning > span {
    background: rgba(158, 65, 52, 0.12);
    color: #9e4134;
}

.certificate-trust-state-card.tone-gold {
    border-color: rgba(201, 168, 76, 0.24);
    background: rgba(252, 249, 241, 0.94);
}

.certificate-trust-state-card.tone-gold > span {
    background: rgba(224, 180, 83, 0.16);
    color: #7a5a0a;
}

.certificate-trust-state-card strong {
    display: block;
    color: var(--ink);
}

.certificate-trust-state-card p {
    margin: 0.15rem 0 0;
    color: var(--mid);
    line-height: 1.5;
}

.certificate-queue-row {
    grid-template-columns: minmax(0, 1fr);
    align-items: stretch;
    gap: 0.85rem;
    padding: 1.05rem 1.1rem 1rem 1.25rem;
}

.certificate-queue-row .admin-operational-main {
    align-items: flex-start;
}

.certificate-queue-copy {
    display: grid;
    gap: 0.75rem;
    min-width: 0;
}

.certificate-queue-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.9rem;
}

.certificate-queue-heading > div {
    min-width: 0;
}

.certificate-queue-heading h3,
.certificate-queue-heading p {
    overflow-wrap: anywhere;
}

.certificate-queue-heading .pill {
    flex-shrink: 0;
}

.certificate-trust-note {
    display: grid;
    grid-template-columns: auto minmax(0, auto) minmax(0, 1fr);
    gap: 0.55rem;
    align-items: center;
    max-width: 760px;
    padding: 0.68rem 0.78rem;
    border-radius: 14px;
    border: 1px solid rgba(26, 107, 107, 0.12);
    background: rgba(236, 245, 244, 0.72);
}

.certificate-trust-note > span {
    width: 1.8rem;
    height: 1.8rem;
    border-radius: 999px;
    display: inline-grid;
    place-items: center;
    background: rgba(26, 107, 107, 0.12);
    color: var(--teal);
}

.certificate-trust-note strong {
    color: var(--ink);
    font-size: 0.92rem;
}

.certificate-trust-note p {
    margin: 0;
    color: var(--mid);
    line-height: 1.45;
}

.certificate-trust-note.tone-warning {
    border-color: rgba(158, 65, 52, 0.2);
    background: rgba(252, 247, 244, 0.86);
}

.certificate-trust-note.tone-warning > span {
    background: rgba(158, 65, 52, 0.12);
    color: #9e4134;
}

.certificate-trust-note.tone-gold {
    border-color: rgba(201, 168, 76, 0.26);
    background: rgba(252, 249, 241, 0.88);
}

.certificate-trust-note.tone-gold > span {
    background: rgba(224, 180, 83, 0.16);
    color: #7a5a0a;
}

.admin-row-detail-disclosure.certificate-trust-note,
.admin-row-detail-disclosure.payment-next-step-card {
    grid-template-columns: 1fr;
    align-items: stretch;
    max-width: 760px;
}

.admin-row-detail-disclosure.certificate-trust-note > summary {
    grid-template-columns: auto minmax(0, 1fr) auto;
}

.admin-row-detail-disclosure.payment-next-step-card > summary {
    grid-template-columns: auto auto minmax(0, 1fr) auto;
}

.admin-row-detail-disclosure.certificate-trust-note > summary > span {
    width: 1.8rem;
    height: 1.8rem;
    border-radius: 999px;
    display: inline-grid;
    place-items: center;
    background: rgba(26, 107, 107, 0.12);
    color: var(--teal);
}

.admin-row-detail-disclosure.certificate-trust-note.tone-warning > summary > span {
    background: rgba(158, 65, 52, 0.12);
    color: #9e4134;
}

.admin-row-detail-disclosure.certificate-trust-note.tone-gold > summary > span {
    background: rgba(224, 180, 83, 0.16);
    color: #7a5a0a;
}

.certificate-queue-row .admin-operational-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
}

.certificate-queue-row .admin-operational-meta > div {
    min-width: 160px;
    flex: 0 1 190px;
}

.certificate-queue-row .admin-operational-actions {
    justify-content: flex-start;
    padding-top: 0.85rem;
    border-top: 1px solid rgba(15, 23, 42, 0.07);
}

.admin-operational-meta {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.7rem;
}

.admin-operational-meta .pill {
    grid-column: 1 / -1;
    justify-self: start;
}

.admin-operational-meta > div {
    display: grid;
    gap: 0.2rem;
    padding: 0.7rem 0.75rem;
    border-radius: 14px;
    border: 1px solid rgba(15, 23, 42, 0.07);
    background: rgba(255, 255, 255, 0.82);
}

.admin-operational-meta span:not(.pill) {
    font-family: "Space Mono", monospace;
    font-size: 0.6rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--teal);
}

.admin-operational-meta strong {
    color: var(--ink);
    font-size: 0.92rem;
    line-height: 1.25;
}

.admin-operational-actions {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.55rem;
}

.admin-operational-actions .admin-inline-form {
    display: flex;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 0.55rem;
}

.admin-operational-actions .button {
    min-width: 0;
}

.finance-incident-row {
    align-items: start;
}

.finance-incident-row .admin-operational-main > div {
    min-width: 0;
}

.finance-incident-row .payment-next-step-card {
    grid-template-columns: auto minmax(0, 1fr);
    max-width: 760px;
}

.finance-incident-row .admin-operational-actions {
    align-content: start;
}

.admin-review-signal-grid {
    display: grid;
    gap: 1rem;
}

.admin-review-signal-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: start;
    padding: 1rem 1.1rem;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.78);
}

.admin-review-signal-card:nth-child(even) {
    background:
        radial-gradient(circle at top right, rgba(224, 180, 83, 0.08), transparent 34%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(252, 249, 241, 0.9));
}

.admin-review-signal-icon {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 999px;
    display: inline-grid;
    place-items: center;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
}

.admin-review-signal-card.tone-gold .admin-review-signal-icon {
    background: rgba(198, 161, 74, 0.15);
    color: #9a7110;
}

.admin-review-signal-card.tone-ink .admin-review-signal-icon {
    background: rgba(18, 28, 49, 0.1);
    color: #17243f;
}

.admin-review-signal-card.tone-sage .admin-review-signal-icon {
    background: rgba(73, 125, 116, 0.12);
    color: #3f7067;
}

.admin-review-signal-copy {
    display: grid;
    gap: 0.3rem;
}

.admin-review-signal-copy strong {
    font-size: 1rem;
    line-height: 1.4;
}

.admin-review-signal-copy p,
.admin-review-signal-copy span {
    margin: 0;
    color: var(--mid);
    font-size: 0.84rem;
    line-height: 1.6;
}

.admin-button-stack {
    display: grid;
    gap: 0.75rem;
}

.admin-inline-form {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.admin-action-stack {
    display: grid;
    gap: 0.45rem;
}

.admin-directory-links {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
}

.admin-directory-link {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.55rem 0.8rem;
    border-radius: 999px;
    border: 1px solid var(--border);
    background: rgba(255, 255, 255, 0.82);
    color: var(--teal);
    font-weight: 700;
    text-decoration: none;
}

.admin-directory-link:hover,
.admin-directory-link:focus-visible {
    color: var(--ink);
    border-color: rgba(26, 107, 107, 0.28);
}

.admin-stack-list li {
    display: grid;
    gap: 0.75rem;
}

.content-editor-form {
    display: grid;
    gap: 1.25rem;
}

.content-editor-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem 1.1rem;
}

.content-editor-field {
    display: grid;
    gap: 0.45rem;
    font-size: 0.86rem;
    color: var(--ink);
}

.content-editor-field span {
    font-weight: 700;
}

.stacked-input,
.content-editor-field input,
.content-editor-field textarea,
.content-editor-field select {
    width: 100%;
    padding: 0.85rem 0.95rem;
    border-radius: 10px;
    border: 1px solid var(--border);
    background: rgba(255, 255, 255, 0.96);
    color: var(--ink);
    font: inherit;
}

.stacked-input:focus,
.content-editor-field input:focus,
.content-editor-field textarea:focus,
.content-editor-field select:focus {
    outline: none;
    border-color: rgba(26, 107, 107, 0.45);
    box-shadow: 0 0 0 4px rgba(26, 107, 107, 0.08);
}

@media (max-width: 1100px) {
    .commercial-signal-strip {
        grid-template-columns: repeat(5, minmax(105px, 1fr));
        overflow-x: auto;
        padding-bottom: 0.25rem;
        scrollbar-width: thin;
    }

    .commercial-control-table-head {
        display: none;
    }

    .commercial-control-row {
        grid-template-columns: minmax(230px, 1.35fr) repeat(4, minmax(105px, 0.65fr));
    }

    .commercial-control-course {
        grid-row: span 2;
    }

    .commercial-control-value > span {
        display: block;
        margin-bottom: 0.18rem;
    }

    .commercial-control-warning {
        grid-column: 2 / 5;
        margin-top: 0;
    }

    .commercial-control-action {
        grid-column: 5;
    }

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

    .admin-report-grid,
    .admin-queue-grid,
    .admin-action-lane-grid,
    .admin-record-highlight-grid,
    .admin-bulk-policy-grid {
        grid-template-columns: 1fr 1fr;
    }

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

    .commercial-snapshot-grid,
    .commercial-lane-grid,
    .oversight-summary-grid,
    .commercial-course-row-stats,
    .commercial-settings-summary-grid,
    .commercial-settings-context-grid,
    .course-detail-health-grid,
    .oversight-course-row-stats,
    .oversight-commercial-grid {
        grid-template-columns: 1fr 1fr;
    }

    .admin-course-search-field {
        grid-column: 1 / -1;
    }
}

@media (max-width: 1100px) {
    .feature-grid,
    .card-grid,
    .benefit-grid,
    .testimonial-grid,
    .plan-grid,
    .plan-grid.four,
    .info-grid,
    .dashboard-stat-grid,
    .dashboard-grid {
        grid-template-columns: 1fr 1fr;
    }

    .hero-grid,
    .detail-grid,
    .contact-grid,
    .auth-grid,
    .lesson-layout,
    .catalog-learner-band,
    .student-pulse-grid,
    .tutor-pulse-grid,
    .school-pulse-grid,
    .admin-pulse-grid,
    .tutor-queue-grid,
    .tutor-management-metrics,
    .tutor-management-module-list,
    .tutor-focus-shell,
    .tutor-focus-grid,
    .school-focus-shell,
      .school-focus-grid,
      .school-support-grid,
      .learner-assessment-layout,
      .school-classroom-builder-grid,
      .school-package-request-builder-grid,
      .school-classroom-detail-grid,
      .school-classroom-distribution-grid,
      .admin-school-package-detail-grid,
    .school-learner-detail-grid,
    .admin-focus-shell,
    .admin-focus-grid,
    .content-editor-grid,
    .course-pathway-grid,
      .assessment-summary-grid,
      .assessment-settings-grid,
      .assessment-settings-toggle-grid,
      .lesson-support-grid,
      .admin-assignment-grid,
      .admin-manager-side-grid,
    .two-column,
    .utility-cta-panel,
    .pricing-flow-grid {
        grid-template-columns: 1fr;
    }

    .foot-grid {
        grid-template-columns: 1fr 1fr;
    }

    .dashboard-grid .wide-panel {
        grid-column: auto;
    }

    .school-subscription-command-panel .school-focus-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .school-package-quote-panel {
        position: static;
    }

    .admin-package-review-panel {
        position: static;
    }

    .utility-card-grid,
    .contact-support-grid,
    .admin-ops-grid,
    .admin-report-grid,
    .admin-lane-grid,
    .admin-queue-grid,
    .admin-bulk-policy-grid,
    .website-content-support-grid {
        grid-template-columns: 1fr;
    }

    .admin-command-card-grid,
    .admin-command-panel .admin-lane-grid {
        grid-template-columns: 1fr 1fr;
    }

    .admin-today-focus-strip {
        grid-template-columns: 1fr;
    }

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

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

    .admin-school-access-main-grid {
        grid-template-columns: 1fr;
    }

    .admin-review-signal-card {
        grid-template-columns: 1fr;
    }

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

    .payment-next-step-card {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .admin-active-filter-strip {
        grid-template-columns: 1fr;
        align-items: flex-start;
    }

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

    .admin-directory-search-actions {
        justify-content: flex-start;
    }

    .admin-active-filter-strip .button {
        justify-self: start;
    }

    .payment-next-step-card .button {
        grid-column: 1 / -1;
        justify-self: start;
    }

    .admin-operational-actions,
    .admin-operational-actions .admin-inline-form {
        justify-content: flex-start;
    }

    .admin-verification-row-summary {
        grid-template-columns: 1fr;
    }

    .tutor-access-filter-bar,
    .admin-linked-content-grid,
    .commercial-snapshot-grid,
    .oversight-summary-grid,
    .commercial-lane-metrics,
    .commercial-course-row-stats,
    .commercial-settings-summary-grid,
    .commercial-settings-context-grid,
    .curriculum-manager-grid,
    .course-detail-health-grid,
    .oversight-course-row-stats,
    .oversight-commercial-grid,
    .school-classroom-reporting-stats,
    .school-classroom-stats,
    .school-classroom-library-stats,
    .school-package-compare-row,
    .school-roster-control-body,
    .school-roster-control-shell,
    .tutor-monitor-row,
    .school-roster-stats,
    .school-package-request-meta,
    .school-bulk-action-fields {
        grid-template-columns: 1fr;
    }

    .contact-panel-head {
        flex-direction: column;
    }

    .school-roster-row,
    .school-package-request-row,
    .school-classroom-row {
        flex-direction: column;
        align-items: flex-start;
    }

    .school-learner-identity {
        align-items: flex-start;
    }

    .school-classroom-row,
    .school-classroom-reporting-row {
        grid-template-columns: 1fr;
    }

    .school-classroom-library-grid {
        grid-template-columns: 1fr;
    }

    .school-classroom-actions {
        justify-content: flex-start;
    }

    .tutor-monitor-row .school-classroom-actions,
    .ges-learner-lane-row .school-classroom-actions {
        flex-wrap: wrap;
        justify-content: flex-start;
    }

    .tutor-workflow-row,
    .tutor-readiness-row {
        grid-template-columns: 1fr;
        align-items: start;
    }

    .ges-sticky-head-panel > .panel-head {
        position: static;
        margin-inline: 0;
        margin-top: 0;
        padding: 0 0 0.9rem;
        background: transparent;
        backdrop-filter: none;
    }

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

    .tutor-readiness-stats {
        max-width: none;
    }

    .school-classroom-library-actions {
        justify-content: flex-start;
    }

    .school-classroom-switch-panel {
        position: static;
    }

    .tutor-monitor-priorities-panel {
        position: static;
    }

    .tutor-management-priorities-panel {
        position: static;
    }

    .tutor-submission-priorities-panel {
        position: static;
    }

    .tutor-submission-pressure-grid {
        grid-template-columns: 1fr;
    }

    .tutor-queue-disclosure > summary {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .tutor-queue-disclosure > summary small {
        justify-self: start;
    }

    .tutor-queue-course-row .tutor-dashboard-course-body {
        grid-template-columns: 1fr;
    }

    .tutor-monitor-row {
        grid-template-columns: minmax(0, 1fr);
        align-items: start;
    }

    .tutor-dashboard-watch-stats,
    .tutor-dashboard-assessment-stats,
    .tutor-dashboard-submission-stats {
        flex-wrap: wrap;
    }

    .assessment-question-composer-topline {
        grid-template-columns: 1fr;
    }

    .assessment-builder-single-column {
        padding-right: 0;
    }

    .assessment-builder-save-status,
    .assessment-builder-readiness-head {
        grid-template-columns: 1fr;
        display: grid;
    }

    .assessment-inline-option-edit-grid {
        grid-template-columns: 1fr;
    }

    .assessment-choice-composer-row {
        grid-template-columns: 1fr;
    }

    .assessment-choice-composer-toggle {
        justify-content: flex-start;
    }

    .assessment-builder-empty-preset-row {
        grid-template-columns: 1fr;
    }

    .assessment-question-advanced-summary {
        flex-direction: column;
        align-items: flex-start;
    }

    .assessment-question-advanced-summary small {
        text-align: left;
    }

    .assessment-builder-option-card {
        grid-template-columns: auto auto minmax(0, 1fr);
    }

    .assessment-builder-option-state {
        grid-column: 2 / -1;
        justify-self: start;
        white-space: normal;
    }

    .tutor-monitor-identity-line {
        flex-wrap: wrap;
    }

    .school-classroom-roster-shell {
        grid-template-columns: 1fr;
    }

    .website-content-section-row {
        flex-direction: column;
        align-items: flex-start;
    }

    .website-content-section-actions {
        justify-content: flex-start;
    }

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

      .assessment-settings-grid.compact {
          grid-template-columns: 1fr;
      }

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

@media (max-width: 960px) {
    .learner-assessment-mobile-console {
        display: grid;
        position: sticky;
        top: 0.85rem;
        z-index: 4;
        box-shadow: 0 16px 30px rgba(15, 23, 42, 0.12);
        backdrop-filter: blur(12px);
    }

    .learner-assessment-mobile-console .button {
        width: 100%;
        justify-content: center;
    }

    .learner-assessment-rail {
        display: none;
    }

    .learner-assessment-followthrough-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .tutor-course-lessons-row {
        grid-template-columns: minmax(0, 1fr);
    }

    .tutor-structure-tree-panel {
        position: static;
    }

    .course-detail-module-strip-panel .module-library-card-compact {
        grid-template-columns: 1fr;
    }

    .course-detail-module-strip-panel .module-library-stats {
        justify-content: flex-start;
    }

    .top-nav {
        padding: 1rem 0;
        flex-wrap: wrap;
    }

    .container {
        width: min(1200px, calc(100vw - 2rem));
    }

    .nav-links,
    .nav-auth {
        display: none;
    }

    .nav-links.open,
    .nav-auth.open {
        display: flex;
        width: 100%;
        flex-direction: column;
        align-items: flex-start;
        gap: 0.75rem;
        padding-top: 0.75rem;
    }

    .mobile-nav-toggle {
        display: inline-flex;
    }

    .nav-user-card {
        width: 100%;
        justify-content: flex-start;
    }

    .nav-user-menu {
        width: 100%;
    }

    .nav-user-dropdown {
        position: static;
        margin-top: 0.45rem;
        width: 100%;
        box-shadow: none;
    }

    .app-sidebar-toggle {
        display: inline-flex;
    }

    .hero-section,
    .page-hero,
    .section,
    .auth-section {
        padding-top: 6rem;
    }

    .hero-card {
        margin-left: 0;
    }

    .feature-grid,
    .card-grid,
    .benefit-grid,
    .testimonial-grid,
    .plan-grid,
    .plan-grid.four,
    .info-grid,
    .dashboard-stat-grid,
    .student-pulse-grid,
    .tutor-pulse-grid,
    .school-pulse-grid,
    .admin-command-card-grid,
    .admin-action-lane-grid,
    .admin-record-highlight-grid,
    .admin-pulse-grid,
    .curriculum-summary-grid,
    .dashboard-grid {
        grid-template-columns: 1fr;
    }

    .oversight-summary-grid {
        grid-template-columns: 1fr;
    }

    .stat-grid.compact {
        display: grid;
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .sidebar {
        transform: translateX(-100%);
        transition: transform 0.3s;
    }

    .sidebar.open {
        transform: translateX(0);
        box-shadow: 0 22px 60px rgba(13, 13, 13, 0.25);
    }

    .sidebar:not(.open) .sidebar-collapse-btn {
        visibility: hidden;
        pointer-events: none;
    }

    .app-main {
        margin-left: 0;
    }

    .app-shell.sidebar-collapsed .app-main {
        margin-left: 0;
    }

    .sidebar-brand-row {
        padding-right: 1rem;
    }

    .app-header,
    .dashboard-intro,
    .student-hero-band,
    .tutor-hero-band,
    .school-hero-band,
    .tutor-course-hero,
    .admin-hero-band,
    .assessment-result-band,
    .lesson-module-head,
    .curriculum-card-head,
    .student-course-top,
    .lesson-toolbar,
    .foot-btm {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.75rem;
        height: auto;
        padding: 1rem 1.5rem;
    }

    .catalog-learner-actions {
        width: 100%;
        justify-content: flex-start;
    }

    .header-right {
        width: 100%;
        max-width: none;
        flex-wrap: wrap;
        justify-content: flex-start;
        align-items: center;
    }

    .app-header-meta {
        min-width: min(100%, 190px);
    }

    .student-hero-actions,
    .tutor-hero-actions,
    .school-hero-actions,
    .admin-hero-actions,
    .tutor-course-hero-actions {
        width: 100%;
        min-width: 0;
    }

    .admin-command-panel .admin-lane-grid {
        grid-template-columns: 1fr;
    }

    .admin-hero-actions {
        width: 100%;
        min-width: 0;
    }

    .student-hero-actions .button,
    .tutor-hero-actions .button {
        width: 100%;
        justify-content: center;
    }

    .school-hero-actions .button,
    .tutor-course-hero-actions .button {
        width: 100%;
        justify-content: center;
    }

    .admin-hero-actions .button {
        width: 100%;
        justify-content: center;
    }

    .admin-hero-more-actions[open] {
        display: grid;
        gap: 0.5rem;
    }

    .admin-hero-more-panel {
        position: static;
        width: 100%;
        min-width: 0;
        max-width: none;
        margin-top: 0.5rem;
        box-shadow: 0 12px 28px rgba(15, 23, 42, 0.16);
    }

    .tutor-management-top,
    .tutor-management-status-row,
    .commercial-course-row-head,
    .course-detail-row-head,
    .admin-manager-relationship-row,
    .oversight-course-row-head {
        flex-direction: column;
        align-items: flex-start;
    }

    .admin-account-row {
        grid-template-columns: 1fr;
        align-items: flex-start;
    }

    .admin-account-row-meta {
        padding-left: 0;
    }

    .admin-account-row-actions {
        width: 100%;
        justify-content: flex-start;
    }

    .commercial-course-row-status,
    .course-detail-row-status,
    .oversight-course-row-status {
        justify-content: flex-start;
    }

    .course-detail-assessment-row {
        grid-template-columns: minmax(0, 1fr);
        align-items: start;
    }

    .ges-lesson-assessment-row {
        grid-template-areas:
            "assessment-copy"
            "assessment-details"
            "assessment-actions";
    }

    .ges-lesson-assessment-row .course-detail-assessment-actions {
        justify-content: flex-start;
    }

    .course-detail-assessment-row .course-detail-row-copy p {
        white-space: normal;
        overflow: visible;
        text-overflow: clip;
    }

    .course-module-page-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .course-module-builder-panel {
        position: static;
    }

    .course-detail-assessment-meta,
    .course-detail-assessment-actions {
        white-space: normal;
        flex-wrap: wrap;
    }

    .school-hero-actions {
        width: 100%;
        min-width: 0;
    }

    .school-hero-actions .button {
        width: 100%;
        justify-content: center;
    }

    .admin-inline-form .button,
    .admin-action-stack .button {
        width: 100%;
        justify-content: center;
    }

    .admin-action-stack a {
        display: inline-flex;
        width: 100%;
        justify-content: center;
    }

    .data-table th,
    .data-table td {
        font-size: 0.82rem;
        white-space: nowrap;
    }

    .admin-hero-actions {
        width: 100%;
        min-width: 0;
    }

    .admin-hero-actions .button {
        width: 100%;
        justify-content: center;
    }

    .notif-menu {
        width: 100%;
    }

    .notif-dropdown {
        position: static;
        width: 100%;
        margin-top: 0.5rem;
        box-shadow: none;
    }

    .student-hero-actions {
        width: 100%;
        min-width: 0;
    }

    .student-hero-actions .button {
        width: 100%;
        justify-content: center;
    }

    .app-content {
        padding: 1.5rem;
    }

    .lesson-side {
        display: none;
    }

    .course-hero-copy,
    .course-hero-card,
    .course-pathway-card,
    .curriculum-card,
    .lesson-player,
    .lesson-video-showcase,
    .learner-assessment-shell,
    .learner-assessment-main,
    .learner-assessment-form,
    .student-library-panel,
    .student-library-list,
    .student-library-item,
    .student-library-item-shell,
    .student-library-item-main,
    .student-profile-main,
    .student-profile-side,
    .classroom-entry-copy,
    .classroom-entry-card {
        min-width: 0;
    }

    .course-hero-copy .button-row,
    .dashboard-intro .button-row {
        width: 100%;
        display: flex;
        flex-wrap: nowrap;
        gap: 0.7rem;
        overflow-x: auto;
        padding-bottom: 0.1rem;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .course-hero-copy .button-row::-webkit-scrollbar,
    .dashboard-intro .button-row::-webkit-scrollbar {
        display: none;
    }

    .course-hero-copy .button-row .button,
    .dashboard-intro .button-row .button {
        width: auto;
        min-width: max-content;
        flex: 0 0 auto;
        justify-content: center;
    }
}

@media (max-width: 700px) {
    .curriculum-summary-grid,
    .curriculum-manager-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 960px) {
    .lesson-insight-grid {
        grid-template-columns: 1fr;
    }

    .lesson-video-showcase-head {
        flex-direction: column;
        align-items: flex-start;
    }

    .lesson-journey-grid {
        grid-template-columns: 1fr;
    }

    .lesson-journey-actions {
        flex-direction: column;
    }

    .lesson-journey-actions .button {
        width: 100%;
    }
}

@media (max-width: 520px) {
    .lesson-hero-meta,
    .student-library-item-kicker-row,
    .student-library-meta-inline {
        display: grid;
        gap: 0.45rem;
    }

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

    .student-context-stats,
    .student-pulse-grid-tight,
    .learner-assessment-pulse-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .student-pulse-grid-tight .student-pulse-card p,
    .learner-assessment-pulse-grid .student-pulse-card p {
        display: none;
    }

    .learner-assessment-pulse-grid .student-pulse-card strong {
        font-size: 1.45rem;
    }

    .student-secondary-item,
    .student-secondary-meta,
    .learner-assessment-attempt-card,
    .learner-assessment-submit-card,
    .assessment-result-band {
        flex-direction: column;
        align-items: flex-start;
    }

    .student-library-action-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .student-library-action-row .button:only-child {
        grid-column: 1 / -1;
    }

    .student-library-action-row .button:last-child:nth-child(odd) {
        grid-column: 1 / -1;
    }

    .course-hero-copy .button-row .button,
    .dashboard-intro .button-row .button {
        min-width: 152px;
    }
}

@media (max-width: 360px) {
    .student-context-stats,
    .student-pulse-grid-tight,
    .learner-assessment-pulse-grid {
        grid-template-columns: 1fr;
    }
}

/* ===== Template Fidelity Overrides ===== */
.btn {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.7rem 1.6rem;
    border-radius: 3px;
    font-size: 0.87rem;
    font-weight: 600;
    letter-spacing: 0.03em;
    border: none;
    transition: all 0.22s;
    cursor: pointer;
}

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

.btn-teal:hover {
    background: var(--teal-light);
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(26, 107, 107, 0.3);
}

.btn.primary {
    border: 1.5px solid var(--teal);
    background: var(--teal);
    color: #fff;
}

.btn.primary:hover {
    border-color: var(--teal-light);
    background: var(--teal-light);
    color: #fff;
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(26, 107, 107, 0.24);
}

.btn.ghost {
    border: 1.5px solid rgba(13, 13, 13, 0.42);
    background: transparent;
    color: var(--ink);
}

.btn.ghost:hover {
    border-color: var(--ink);
    background: var(--ink);
    color: var(--cream);
}

.btn-outline {
    background: transparent;
    border: 1.5px solid var(--ink);
    color: var(--ink);
}

.btn-outline:hover {
    background: var(--ink);
    color: var(--cream);
}

.btn-gold {
    background: var(--gold);
    color: var(--ink);
}

.btn-gold:hover {
    background: var(--gold-light);
}

.btn-ghost {
    background: transparent;
    border: 1.5px solid rgba(255, 255, 255, 0.4);
    color: #fff;
}

.btn-ghost:hover {
    background: rgba(255, 255, 255, 0.1);
    border-color: #fff;
}

.btn-sm {
    padding: 0.45rem 1rem;
    font-size: 0.78rem;
}

.btn-icon {
    padding: 0.5rem;
    border-radius: 3px;
    background: transparent;
    border: 1px solid var(--border);
    color: var(--mid);
}

.btn-icon:hover {
    background: var(--teal-pale);
    color: var(--teal);
    border-color: var(--teal);
}

.top-nav {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 200;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.9rem 3rem;
    background: rgba(245, 240, 232, 0.92);
    backdrop-filter: blur(14px);
    border-bottom: 1px solid var(--border);
}

.nav-logo {
    display: inline-flex;
    align-items: center;
    gap: 0.8rem;
    min-width: 0;
}

.nav-logo-mark {
    width: 50px;
    height: 50px;
    border-radius: 10px;
    overflow: hidden;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: relative;
    flex-shrink: 0;
    background: #fff;
    border: 1px solid rgba(13, 13, 13, 0.08);
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08);
}

.nav-logo-mark img {
    position: absolute;
    inset: 0;
    margin: auto;
    width: 88%;
    height: 88%;
    object-fit: contain;
    object-position: center center;
    display: block;
    transform: none;
}

.nav-logo-wordmark {
    display: grid;
    gap: 0.1rem;
    min-width: 0;
}

.nav-logo-wordmark strong {
    font-family: "Playfair Display", serif;
    font-size: 1.12rem;
    font-weight: 900;
    letter-spacing: -0.02em;
    color: var(--ink);
    line-height: 1;
}

.nav-logo-wordmark strong span {
    color: var(--teal);
}

.nav-logo-wordmark small {
    font-family: "Space Mono", monospace;
    font-size: 0.62rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--mid);
}

.nav-links {
    display: flex;
    align-items: center;
    gap: 2rem;
}

.nav-links a {
    font-size: 0.87rem;
    font-weight: 500;
    color: var(--mid);
    transition: color 0.2s;
}

.nav-links a:hover {
    color: var(--teal);
}

.nav-auth {
    display: flex;
    gap: 0.75rem;
    align-items: center;
}

.btn i,
.nav-links i,
.feat-ico i,
.btn-white i,
.modal-close i,
.r-ico i {
    line-height: 1;
}

.btn span,
.btn-white span {
    display: inline-block;
}

.top-nav .nav-auth .btn {
    min-height: 40px;
    padding: 0.55rem 1.15rem;
    font-size: 0.82rem;
    line-height: 1;
}

.top-nav .nav-auth .btn-outline {
    border-width: 1.5px;
    background: transparent;
}

.top-nav .nav-auth .btn-teal {
    background: var(--teal);
    color: #fff;
}

.modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.55);
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.5rem;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.25s ease;
    backdrop-filter: blur(4px);
}

.modal-overlay.open {
    opacity: 1;
    pointer-events: auto;
}

body.modal-is-open {
    overflow: hidden;
}

.modal-box {
    background: var(--off-white);
    border-radius: 10px;
    width: 100%;
    max-width: 440px;
    padding: 2.2rem;
    position: relative;
    box-shadow: 0 24px 80px rgba(0, 0, 0, 0.25);
    border: 1px solid rgba(13, 13, 13, 0.08);
}

.modal-close {
    position: absolute;
    top: 0.9rem;
    right: 0.9rem;
    width: 38px;
    height: 38px;
    border-radius: 999px;
    border: 1px solid rgba(13, 13, 13, 0.1);
    background: #fff;
    color: var(--mid);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.modal-close:hover {
    color: var(--ink);
    border-color: rgba(13, 13, 13, 0.2);
}

.modal-title {
    font-family: "Playfair Display", serif;
    font-size: 1.6rem;
    font-weight: 700;
    margin-bottom: 0.35rem;
}

.modal-sub {
    font-size: 0.88rem;
    color: var(--mid);
    margin-bottom: 1.4rem;
}

.form-group {
    margin-bottom: 1rem;
}

.form-group label {
    display: block;
    font-size: 0.82rem;
    font-weight: 600;
    margin-bottom: 0.4rem;
    color: var(--ink);
}

.form-group input,
.form-group select {
    width: 100%;
    padding: 0.75rem 1rem;
    border: 1.5px solid var(--border);
    border-radius: 3px;
    font-size: 0.9rem;
    background: #fff;
    color: var(--ink);
    outline: none;
}

.form-group input:focus,
.form-group select:focus {
    border-color: var(--teal);
    box-shadow: 0 0 0 3px rgba(26, 107, 107, 0.12);
}

.form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.9rem;
}

.modal-footer {
    margin-top: 1.3rem;
    font-size: 0.83rem;
    color: var(--mid);
    text-align: center;
}

.modal-footer a {
    color: var(--teal);
    font-weight: 600;
}

.role-select {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.6rem;
    margin-bottom: 1.2rem;
}

.role-opt,
.role-option {
    border: 1.5px solid var(--border);
    border-radius: 4px;
    padding: 0.75rem 0.5rem;
    text-align: center;
    cursor: pointer;
    transition: all 0.2s;
    background: #fff;
}

.role-opt:hover,
.role-opt.selected,
.role-option:hover,
.role-option.active {
    border-color: var(--teal);
    background: var(--teal-pale);
}

.role-opt .r-ico {
    font-size: 1.25rem;
    display: block;
    margin-bottom: 0.3rem;
    color: var(--teal);
}

.role-opt .r-label {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--ink);
}

.toast {
    position: fixed;
    bottom: 1.5rem;
    right: 1.5rem;
    background: var(--ink);
    color: var(--cream);
    padding: 0.9rem 1.2rem;
    border-radius: 16px;
    font-size: 0.88rem;
    z-index: 1100;
    transform: translateY(80px);
    opacity: 0;
    max-width: min(360px, calc(100vw - 2rem));
    line-height: 1.45;
    pointer-events: none;
    transition: transform 0.28s ease, opacity 0.28s ease;
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.24);
}

.toast.show {
    transform: translateY(0);
    opacity: 1;
}

.toast.success {
    border-left: 3px solid var(--sage);
}

.toast.info {
    border-left: 3px solid var(--teal-light);
}

.toast.warning {
    border-left: 3px solid var(--gold);
}

.toast.error {
    border-left: 3px solid #d45a4c;
}

.server-toast-payload {
    display: none !important;
}

@media (max-width: 700px) {
    .toast {
        right: 1rem;
        bottom: 1rem;
        left: 1rem;
        max-width: none;
    }

    .app-shell.has-student-mobile-nav ~ .toast,
    body:has(.student-mobile-nav) .toast {
        bottom: calc(6.35rem + env(safe-area-inset-bottom, 0px));
    }
}

.hero {
    min-height: 100vh;
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    padding: 8rem 4rem 4rem;
    position: relative;
    overflow: hidden;
}

.hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse 60% 80% at 70% 50%, rgba(26, 107, 107, 0.07) 0%, transparent 70%),
        radial-gradient(ellipse 40% 60% at 20% 80%, rgba(201, 168, 76, 0.09) 0%, transparent 60%);
}

.hero-text {
    position: relative;
    z-index: 2;
    animation: fadeUp 0.8s 0.2s ease both;
}

@keyframes fadeUp {
    from {
        opacity: 0;
        transform: translateY(28px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.eyebrow {
    font-family: "Space Mono", monospace;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.15em;
    color: var(--teal);
    text-transform: uppercase;
    margin-bottom: 1.4rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.eyebrow::before {
    content: "";
    width: 2rem;
    height: 2px;
    background: var(--teal);
    display: block;
}

.hero h1 {
    font-family: "Playfair Display", serif;
    font-size: clamp(2.6rem, 4.5vw, 4.2rem);
    font-weight: 900;
    line-height: 1.1;
    letter-spacing: -0.03em;
    margin-bottom: 1.4rem;
}

.hero h1 em {
    color: var(--teal);
    font-style: italic;
}

.hero h1 .acc {
    color: var(--gold);
}

.hero-desc {
    font-size: 1.05rem;
    line-height: 1.8;
    color: var(--mid);
    max-width: 460px;
    margin-bottom: 2.2rem;
}

.hero-actions {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
    align-items: center;
}

.hero-stats {
    display: flex;
    gap: 2.5rem;
    margin-top: 2.5rem;
    padding-top: 2rem;
    border-top: 1px solid var(--border);
}

.stat-n {
    font-family: "Playfair Display", serif;
    font-size: 1.9rem;
    font-weight: 700;
}

.stat-l {
    font-size: 0.78rem;
    color: var(--mid);
    margin-top: 0.15rem;
}

.hero-visual {
    animation: fadeUp 0.8s 0.4s ease both;
    position: relative;
    z-index: 2;
}

.demo-card {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 1.5rem;
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.08);
    max-width: 420px;
    margin-left: auto;
    position: relative;
}

.demo-back {
    position: absolute;
    top: -14px;
    right: -12px;
    width: 92%;
    height: 100%;
    background: var(--teal);
    border-radius: 8px;
    z-index: -1;
    opacity: 0.12;
}

.course-pill {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
    padding: 0.28rem 0.75rem;
    border-radius: 20px;
    font-size: 0.76rem;
    font-weight: 600;
    margin-bottom: 0.9rem;
}

.prog-wrap {
    margin: 0.9rem 0;
}

.prog-label {
    display: flex;
    justify-content: space-between;
    font-size: 0.76rem;
    color: var(--mid);
    margin-bottom: 0.35rem;
}

.prog-bar {
    height: 6px;
    background: rgba(0, 0, 0, 0.07);
    border-radius: 3px;
    overflow: hidden;
}

.prog-fill {
    height: 100%;
    background: var(--teal);
    border-radius: 3px;
}

.lesson-row {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    padding: 0.42rem 0;
    font-size: 0.83rem;
    border-bottom: 1px solid var(--border);
}

.lesson-row:last-child {
    border: none;
}

.l-dot {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.65rem;
    flex-shrink: 0;
}

.l-dot.done {
    background: var(--sage);
    color: #fff;
}

.l-dot.now {
    background: var(--teal);
    color: #fff;
}

.l-dot.lock {
    background: rgba(0, 0, 0, 0.08);
    color: var(--mid);
}

section.ms {
    padding: 6rem 4rem;
}

.sec-head {
    margin-bottom: 3.5rem;
}

.sec-title {
    font-family: "Playfair Display", serif;
    font-size: clamp(1.9rem, 3vw, 2.8rem);
    font-weight: 900;
    letter-spacing: -0.02em;
    line-height: 1.2;
    margin-bottom: 1rem;
}

.sec-sub {
    font-size: 1rem;
    color: var(--mid);
    line-height: 1.75;
    max-width: 500px;
}

.sec-dark {
    background: var(--ink);
    color: var(--cream);
}

.sec-dark .eyebrow {
    color: var(--gold);
}

.sec-dark .eyebrow::before {
    background: var(--gold);
}

.sec-dark .sec-title {
    color: var(--cream);
}

.sec-dark .sec-sub {
    color: rgba(245, 240, 232, 0.6);
}

.feat-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5px;
    background: rgba(245, 240, 232, 0.1);
    border: 1.5px solid rgba(245, 240, 232, 0.1);
}

.feat-card {
    background: var(--ink);
    padding: 2.2rem 1.8rem;
    transition: background 0.3s;
}

.feat-card:hover {
    background: #1c1c1c;
}

.feat-ico {
    width: 48px;
    height: 48px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.15rem;
    margin-bottom: 1.3rem;
}

.feat-card h3 {
    font-family: "Playfair Display", serif;
    font-size: 1.1rem;
    color: var(--cream);
    margin-bottom: 0.6rem;
}

.feat-card p {
    font-size: 0.87rem;
    line-height: 1.7;
    color: rgba(245, 240, 232, 0.58);
}

.feat-tag {
    font-family: "Space Mono", monospace;
    font-size: 0.65rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--gold);
    opacity: 0.8;
    display: inline-block;
    margin-top: 0.9rem;
}

.courses-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
}

.public-course-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.5rem;
}

.courses-results-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1.2rem;
}

.courses-results-copy {
    font-size: 0.84rem;
    color: var(--mid);
}

.courses-results-copy span {
    font-weight: 700;
    color: var(--ink);
}

.courses-results-note {
    max-width: 520px;
    text-align: right;
    font-size: 0.82rem;
    line-height: 1.6;
    color: var(--mid);
}

.role-focus-section {
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.08), transparent 35%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.7), rgba(245, 240, 232, 0.8));
}

.role-focus-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.5rem;
    align-items: stretch;
}

.role-focus-card {
    background: rgba(255, 255, 255, 0.92);
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 1.7rem;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
}

.role-focus-top {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1rem;
}

.role-focus-icon {
    width: 52px;
    height: 52px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
    font-size: 1.15rem;
    flex-shrink: 0;
}

.role-focus-copy h3 {
    margin-bottom: 0.15rem;
}

.role-focus-eyebrow {
    display: inline-block;
    font-family: "Space Mono", monospace;
    font-size: 0.66rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--teal);
    margin-bottom: 0.35rem;
}

.role-focus-card p {
    font-size: 0.88rem;
    line-height: 1.7;
    color: var(--mid);
    margin-bottom: 1rem;
}

.role-focus-list {
    list-style: none;
    display: grid;
    gap: 0.65rem;
}

.role-focus-list li {
    position: relative;
    padding-left: 1.35rem;
    font-size: 0.84rem;
    color: var(--ink);
    line-height: 1.6;
}

.role-focus-list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.62rem;
    width: 7px;
    height: 7px;
    border-radius: 999px;
    background: var(--gold);
    box-shadow: 0 0 0 4px rgba(201, 168, 76, 0.12);
}

.motto-panel {
    background: linear-gradient(145deg, rgba(26, 107, 107, 0.08), rgba(201, 168, 76, 0.14));
}

.about-pillars-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.5rem;
}

.about-pillar-card {
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 1.7rem;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
}

.about-pillar-icon {
    width: 50px;
    height: 50px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
    font-size: 1.05rem;
    margin-bottom: 1rem;
}

.about-pillar-card h3 {
    margin-bottom: 0.55rem;
}

.about-pillar-card p {
    font-size: 0.88rem;
    line-height: 1.7;
    color: var(--mid);
}

.school-fit-section {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(245, 240, 232, 0.88));
}

.school-fit-section .section-heading p {
    max-width: 520px;
}

.school-compare-table {
    border: 1px solid var(--border);
    border-radius: 10px;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.95);
    box-shadow: 0 12px 36px rgba(0, 0, 0, 0.05);
}

.school-compare-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.school-compare-head {
    background: var(--ink);
    color: var(--cream);
}

.school-compare-head > div {
    padding: 1rem 1.25rem;
    font-family: "Space Mono", monospace;
    font-size: 0.68rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.school-compare-head > div + div {
    border-left: 1px solid rgba(245, 240, 232, 0.08);
}

.school-compare-row + .school-compare-row {
    border-top: 1px solid var(--border);
}

.school-compare-cell {
    display: flex;
    align-items: flex-start;
    gap: 0.9rem;
    padding: 1.25rem;
}

.school-compare-cell + .school-compare-cell {
    border-left: 1px solid var(--border);
    background: rgba(26, 107, 107, 0.03);
}

.school-compare-cell p {
    font-size: 0.88rem;
    line-height: 1.7;
    color: var(--mid);
}

.school-compare-badge {
    width: 34px;
    height: 34px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(201, 168, 76, 0.16);
    color: #a07e20;
    flex-shrink: 0;
    margin-top: 0.05rem;
}

.success-badge {
    background: rgba(26, 107, 107, 0.12);
    color: var(--teal);
}

.trust-section {
    background:
        radial-gradient(circle at left top, rgba(201, 168, 76, 0.12), transparent 28%),
        linear-gradient(180deg, rgba(245, 240, 232, 0.9), rgba(255, 255, 255, 0.92));
}

.trust-layout {
    display: grid;
    grid-template-columns: 1.15fr 1.85fr;
    gap: 1.5rem;
    align-items: start;
}

.trust-promise-card {
    background: var(--ink);
    color: var(--cream);
    border-radius: 10px;
    padding: 2rem;
    box-shadow: 0 14px 40px rgba(0, 0, 0, 0.12);
}

.trust-promise-eyebrow {
    display: inline-block;
    font-family: "Space Mono", monospace;
    font-size: 0.66rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--gold-light);
    margin-bottom: 0.8rem;
}

.trust-promise-card h3 {
    color: var(--cream);
    font-size: 1.45rem;
    margin-bottom: 0.85rem;
}

.trust-promise-card p {
    color: rgba(245, 240, 232, 0.72);
    font-size: 0.9rem;
    line-height: 1.75;
    margin-bottom: 1.1rem;
}

.trust-promise-list {
    list-style: none;
    display: grid;
    gap: 0.8rem;
}

.trust-promise-list li {
    position: relative;
    padding-left: 1.45rem;
    color: rgba(245, 240, 232, 0.88);
    font-size: 0.84rem;
    line-height: 1.65;
}

.trust-promise-list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.58rem;
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: var(--gold-light);
}

.trust-signal-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.5rem;
}

.trust-signal-card {
    background: rgba(255, 255, 255, 0.92);
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 1.65rem;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
}

.trust-signal-icon {
    width: 48px;
    height: 48px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
    font-size: 1.05rem;
    margin-bottom: 1rem;
}

.trust-signal-card h3 {
    margin-bottom: 0.55rem;
}

.trust-signal-card p {
    font-size: 0.87rem;
    line-height: 1.7;
    color: var(--mid);
}

.home-mobile-lab-section {
    background:
        radial-gradient(circle at top left, rgba(201, 168, 76, 0.12), transparent 40%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(245, 240, 232, 0.96));
}

.home-mobile-lab-shell {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(320px, 0.8fr);
    gap: 2rem;
    align-items: stretch;
}

.home-mobile-lab-copy .sec-sub {
    max-width: 54ch;
}

.home-mobile-lab-list {
    list-style: none;
    display: grid;
    gap: 0.85rem;
    margin: 1.5rem 0 2rem;
}

.home-mobile-lab-list li {
    position: relative;
    padding-left: 1.5rem;
    color: var(--mid);
    line-height: 1.7;
}

.home-mobile-lab-list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.62rem;
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: var(--gold);
}

.home-mobile-lab-panel {
    background: linear-gradient(160deg, rgba(12, 45, 103, 0.98), rgba(18, 67, 141, 0.98));
    color: var(--cream);
    border-radius: 16px;
    padding: 2rem;
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 20px 55px rgba(12, 45, 103, 0.18);
}

.home-mobile-lab-panel-badge {
    display: inline-flex;
    align-items: center;
    padding: 0.4rem 0.75rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
    color: var(--gold-light);
    font-family: "Space Mono", monospace;
    font-size: 0.66rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    margin-bottom: 1rem;
}

.home-mobile-lab-panel h3 {
    color: var(--cream);
    font-size: 1.35rem;
    line-height: 1.35;
    margin-bottom: 1.2rem;
}

.home-mobile-lab-stats {
    display: grid;
    gap: 1rem;
}

.home-mobile-lab-stat {
    padding: 1rem 1.1rem;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.08);
}

.home-mobile-lab-stat span {
    display: block;
    font-family: "Space Mono", monospace;
    font-size: 0.66rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: rgba(245, 240, 232, 0.62);
    margin-bottom: 0.45rem;
}

.home-mobile-lab-stat strong {
    display: block;
    color: var(--cream);
    line-height: 1.55;
}

.c-card {
    border: 1px solid var(--border);
    border-radius: 4px;
    overflow: hidden;
    background: var(--card);
    transition: transform 0.25s, box-shadow 0.25s;
}

.c-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 14px 44px rgba(0, 0, 0, 0.09);
}

.c-thumb {
    height: 148px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    font-family: "Space Mono", monospace;
    letter-spacing: 0.08em;
    position: relative;
}

.c-thumb.has-course-thumbnail {
    background: rgba(15, 23, 42, 0.08);
}

.c-thumb.has-course-thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.c-thumb.sci {
    background: linear-gradient(135deg, rgba(26, 107, 107, 0.15), rgba(46, 158, 158, 0.3));
}

.c-thumb.math {
    background: linear-gradient(135deg, rgba(201, 168, 76, 0.15), rgba(232, 201, 122, 0.3));
}

.c-thumb.prac {
    background: linear-gradient(135deg, rgba(192, 94, 58, 0.15), rgba(216, 122, 90, 0.3));
}

.c-thumb.exam {
    background: linear-gradient(135deg, rgba(122, 173, 138, 0.14), rgba(201, 168, 76, 0.22));
}

.c-badge {
    position: absolute;
    top: 0.9rem;
    right: 0.9rem;
    background: rgba(0, 0, 0, 0.08);
    color: var(--mid);
    font-family: "Space Mono", monospace;
    font-size: 0.65rem;
    padding: 0.22rem 0.55rem;
    border-radius: 2px;
}

.c-badge.free {
    background: rgba(122, 173, 138, 0.2);
    color: var(--sage);
}

.c-body {
    padding: 1.4rem;
}

.public-course-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 0.55rem;
}

.public-course-path {
    font-family: "Space Mono", monospace;
    font-size: 0.62rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--mid);
}

.c-tag {
    font-family: "Space Mono", monospace;
    font-size: 0.65rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--teal);
    margin-bottom: 0.5rem;
    display: block;
}

.c-body h3 {
    font-family: "Playfair Display", serif;
    font-size: 1.05rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
}

.c-body p {
    font-size: 0.83rem;
    color: var(--mid);
    line-height: 1.6;
    margin-bottom: 1.1rem;
}

.public-course-card h3 {
    min-height: 2.5em;
}

.public-course-meta {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.85rem;
    margin-bottom: 1.1rem;
}

.public-course-meta dt {
    font-family: "Space Mono", monospace;
    font-size: 0.64rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--teal);
    margin-bottom: 0.18rem;
}

.public-course-meta dd {
    margin: 0;
    font-size: 0.82rem;
    color: var(--mid);
    line-height: 1.45;
}

.public-course-footer {
    margin-top: auto;
}

.courses-empty-state {
    text-align: center;
    padding: 3rem 1.5rem;
    border: 1px dashed rgba(13, 13, 13, 0.18);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.78);
    margin-top: 1.5rem;
}

.courses-empty-icon {
    width: 60px;
    height: 60px;
    margin: 0 auto 1rem;
    border-radius: 999px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
    font-size: 1.1rem;
}

.courses-empty-state h3 {
    margin-bottom: 0.45rem;
}

.courses-empty-state p {
    max-width: 420px;
    margin: 0 auto 1.1rem;
    color: var(--mid);
    font-size: 0.88rem;
    line-height: 1.65;
}

.c-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding-top: 0.9rem;
    border-top: 1px solid var(--border);
}

.c-price {
    font-family: "Playfair Display", serif;
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--teal);
}

.c-price small {
    font-family: "DM Sans", sans-serif;
    font-size: 0.73rem;
    color: var(--mid);
    font-weight: 400;
}

.pricing-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
    margin-top: 3rem;
}

.p-card {
    border: 1px solid var(--border);
    border-radius: 4px;
    padding: 2.2rem 1.8rem;
    background: var(--card);
    transition: all 0.25s;
}

.p-card:hover {
    box-shadow: 0 14px 44px rgba(0, 0, 0, 0.09);
    transform: translateY(-3px);
}

.p-card.feat {
    background: var(--teal);
    color: #fff;
    border-color: var(--teal);
    transform: scale(1.02);
}

.p-card.feat:hover {
    transform: scale(1.02) translateY(-3px);
}

.p-tag {
    font-family: "Space Mono", monospace;
    font-size: 0.67rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--gold);
    display: block;
    margin-bottom: 0.6rem;
}

.p-card.feat .p-tag {
    color: var(--gold-light);
}

.p-name {
    font-family: "Playfair Display", serif;
    font-size: 1.4rem;
    font-weight: 700;
}

.p-amt {
    font-family: "Playfair Display", serif;
    font-size: 2.6rem;
    font-weight: 900;
    margin: 0.9rem 0;
    line-height: 1;
}

.p-amt small {
    font-family: "DM Sans", sans-serif;
    font-size: 0.85rem;
    font-weight: 400;
    opacity: 0.7;
}

.p-desc {
    font-size: 0.87rem;
    opacity: 0.75;
    margin-bottom: 1.4rem;
    line-height: 1.6;
}

.p-list {
    list-style: none;
    margin-bottom: 1.8rem;
}

.p-list li {
    font-size: 0.84rem;
    padding: 0.45rem 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
    display: flex;
    align-items: center;
    gap: 0.55rem;
}

.p-card.feat .p-list li {
    border-color: rgba(255, 255, 255, 0.15);
}

.p-list li::before {
    content: "\2713";
    color: var(--sage);
    font-weight: 700;
    flex-shrink: 0;
}

.p-card.feat .p-list li::before {
    color: var(--gold-light);
}

.btn-plan {
    display: block;
    width: 100%;
    text-align: center;
    padding: 0.85rem;
    border-radius: 3px;
    font-size: 0.88rem;
    font-weight: 600;
    letter-spacing: 0.03em;
    border: 1.5px solid var(--teal);
    color: var(--teal);
    background: transparent;
    transition: all 0.25s;
    cursor: pointer;
}

.btn-plan:hover {
    background: var(--teal);
    color: #fff;
}

.p-card.feat .btn-plan {
    background: #fff;
    color: var(--teal);
    border-color: #fff;
}

.p-card.feat .btn-plan:hover {
    background: var(--gold-light);
    border-color: var(--gold-light);
    color: var(--ink);
}

.landing-page main {
    background:
        radial-gradient(circle at top left, rgba(26, 107, 107, 0.08), transparent 30rem),
        linear-gradient(180deg, var(--off-white), rgba(245, 240, 232, 0.72));
}

.landing-hero,
.landing-section {
    position: relative;
    padding-inline: clamp(1.25rem, 4vw, 4rem);
}

.landing-hero {
    min-height: min(860px, 100vh);
    display: grid;
    grid-template-columns: minmax(0, 1.02fr) minmax(320px, 0.88fr);
    gap: clamp(2rem, 5vw, 5rem);
    align-items: center;
    padding-top: clamp(7rem, 11vw, 9rem);
    padding-bottom: clamp(3rem, 6vw, 5rem);
    overflow: hidden;
}

.landing-orb {
    position: absolute;
    border-radius: 999px;
    filter: blur(4px);
    pointer-events: none;
    animation: landingFloat 9s ease-in-out infinite;
}

.landing-orb-teal {
    width: clamp(14rem, 30vw, 26rem);
    height: clamp(14rem, 30vw, 26rem);
    right: 5vw;
    top: 7rem;
    background: rgba(26, 107, 107, 0.1);
}

.landing-orb-gold {
    width: clamp(10rem, 22vw, 18rem);
    height: clamp(10rem, 22vw, 18rem);
    left: 8vw;
    bottom: 4rem;
    background: rgba(201, 168, 76, 0.12);
    animation-delay: -3s;
}

@keyframes landingFloat {
    0%,
    100% {
        transform: translate3d(0, 0, 0) scale(1);
    }

    50% {
        transform: translate3d(0, -16px, 0) scale(1.04);
    }
}

.landing-hero-copy,
.landing-hero-visual,
.landing-section > * {
    position: relative;
    z-index: 1;
}

.landing-hero h1 {
    max-width: 760px;
    font-size: clamp(2.65rem, 5.6vw, 5rem);
    line-height: 1;
    margin-bottom: 1.35rem;
}

.landing-hero h1 em {
    color: var(--teal);
    font-style: italic;
}

.landing-hero h1 span {
    color: var(--gold);
}

.landing-hero-lead {
    max-width: 620px;
    color: var(--mid);
    font-size: clamp(1rem, 1.55vw, 1.18rem);
    line-height: 1.75;
    margin-bottom: 1.75rem;
}

.landing-action-row,
.landing-school-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.85rem;
    align-items: center;
}

.landing-hero-visual {
    min-height: 440px;
}

.landing-preview-card {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    max-width: 500px;
    margin-left: auto;
    padding: clamp(1.35rem, 3vw, 2.15rem);
    border-radius: 30px;
    border: 1px solid rgba(26, 107, 107, 0.16);
    background:
        radial-gradient(circle at 94% 5%, rgba(232, 201, 122, 0.26), transparent 30%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(248, 246, 240, 0.94));
    box-shadow: 0 30px 72px rgba(13, 13, 13, 0.13), 0 2px 0 rgba(255, 255, 255, 0.9) inset;
}

.landing-preview-card::before {
    content: "";
    position: absolute;
    z-index: -1;
    top: -74px;
    right: -62px;
    width: 190px;
    aspect-ratio: 1;
    border: 1px solid rgba(26, 107, 107, 0.12);
    border-radius: 50%;
    box-shadow: 0 0 0 24px rgba(26, 107, 107, 0.035), 0 0 0 52px rgba(232, 201, 122, 0.04);
    pointer-events: none;
}

.landing-preview-card::after {
    content: "";
    position: absolute;
    top: 0;
    left: clamp(1.35rem, 3vw, 2.15rem);
    width: 88px;
    height: 4px;
    border-radius: 0 0 999px 999px;
    background: linear-gradient(90deg, var(--teal), var(--gold));
}

.landing-preview-topline,
.landing-progress-label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.landing-preview-card .pill {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.48rem 0.68rem;
    color: var(--teal);
    background: rgba(26, 107, 107, 0.1);
}

.landing-preview-status {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    color: var(--teal);
    font-family: var(--font-mono);
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    white-space: nowrap;
}

.landing-preview-status > span {
    width: 0.52rem;
    height: 0.52rem;
    border-radius: 50%;
    background: var(--teal-light);
    box-shadow: 0 0 0 5px rgba(58, 160, 155, 0.12);
    animation: landingStatusPulse 2.4s ease-in-out infinite;
}

.landing-preview-intro {
    margin-top: 1.45rem;
}

.landing-preview-card .landing-preview-kicker {
    margin: 0 0 0.35rem;
    color: var(--teal);
    font-family: var(--font-mono);
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    line-height: 1.2;
    text-transform: uppercase;
}

.landing-preview-card h2 {
    margin: 0 0 0.65rem;
    font-size: clamp(2rem, 3.2vw, 2.7rem);
    line-height: 1.03;
    letter-spacing: -0.035em;
}

.landing-preview-card h2 span {
    color: var(--teal);
}

.landing-preview-card p {
    margin: 0;
    color: var(--mid);
    line-height: 1.6;
}

.landing-progress-block {
    margin: 1.45rem 0 1.25rem;
    padding: 0.9rem 1rem;
    border: 1px solid rgba(13, 13, 13, 0.055);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.72);
}

.landing-progress-label {
    color: var(--mid);
    font-size: 0.78rem;
}

.landing-progress-label strong {
    color: var(--ink);
    font-family: var(--font-mono);
    font-size: 0.75rem;
}

.landing-progress-track {
    height: 8px;
    margin-top: 0.65rem;
    border-radius: 999px;
    background: rgba(13, 13, 13, 0.08);
    overflow: hidden;
}

.landing-progress-track span {
    display: block;
    width: var(--landing-progress, 0%);
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--teal), var(--teal-light));
    box-shadow: 0 0 18px rgba(58, 160, 155, 0.3);
    transform-origin: left center;
}

.landing-preview-list {
    display: grid;
    gap: 0.7rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.landing-preview-step {
    display: grid;
    grid-template-columns: 2.55rem minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.8rem;
    min-width: 0;
    padding: 0.72rem 0.82rem;
    border: 1px solid rgba(13, 13, 13, 0.055);
    border-radius: 17px;
    background: rgba(255, 255, 255, 0.72);
    color: var(--ink);
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.landing-preview-step:hover {
    transform: translateX(4px);
    border-color: rgba(26, 107, 107, 0.2);
    box-shadow: 0 10px 24px rgba(13, 13, 13, 0.07);
}

.landing-preview-step-icon {
    display: grid;
    place-items: center;
    width: 2.55rem;
    height: 2.55rem;
    border-radius: 13px;
    color: var(--teal);
    background: rgba(26, 107, 107, 0.1);
}

.landing-preview-step.is-ready .landing-preview-step-icon {
    color: #795b15;
    background: rgba(232, 201, 122, 0.25);
}

.landing-preview-step.is-upcoming .landing-preview-step-icon {
    color: #52616c;
    background: rgba(82, 97, 108, 0.1);
}

.landing-preview-step-copy {
    display: grid;
    gap: 0.12rem;
    min-width: 0;
}

.landing-preview-step-copy strong {
    font-size: 0.9rem;
    line-height: 1.2;
}

.landing-preview-step-copy small {
    overflow: hidden;
    color: var(--mid);
    font-size: 0.73rem;
    line-height: 1.35;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.landing-preview-step-state {
    padding: 0.34rem 0.5rem;
    border-radius: 999px;
    color: var(--teal);
    background: rgba(26, 107, 107, 0.08);
    font-family: var(--font-mono);
    font-size: 0.61rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.landing-preview-step.is-ready .landing-preview-step-state {
    color: #6c5010;
    background: rgba(232, 201, 122, 0.24);
}

.landing-preview-step.is-upcoming .landing-preview-step-state {
    color: #52616c;
    background: rgba(82, 97, 108, 0.08);
}

.landing-animations-ready .landing-hero-visual:not(.is-visible) .landing-preview-step {
    opacity: 0;
    transform: translateY(12px);
}

.landing-animations-ready .landing-hero-visual.is-visible .landing-progress-track span {
    animation: landingProgressGrow 1.05s 180ms cubic-bezier(0.2, 0.9, 0.2, 1) both;
}

.landing-animations-ready .landing-hero-visual.is-visible .landing-preview-step {
    animation: landingStepIn 0.48s cubic-bezier(0.2, 0.9, 0.2, 1) both;
}

.landing-animations-ready .landing-hero-visual.is-visible .landing-preview-step:nth-child(1) {
    animation-delay: 320ms;
}

.landing-animations-ready .landing-hero-visual.is-visible .landing-preview-step:nth-child(2) {
    animation-delay: 420ms;
}

.landing-animations-ready .landing-hero-visual.is-visible .landing-preview-step:nth-child(3) {
    animation-delay: 520ms;
}

@keyframes landingProgressGrow {
    from { transform: scaleX(0); }
    to { transform: scaleX(1); }
}

@keyframes landingStepIn {
    from { opacity: 0; transform: translateY(12px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes landingStatusPulse {
    0%, 100% { transform: scale(1); box-shadow: 0 0 0 5px rgba(58, 160, 155, 0.12); }
    50% { transform: scale(0.86); box-shadow: 0 0 0 8px rgba(58, 160, 155, 0.04); }
}

.landing-floating-card {
    position: absolute;
    display: grid;
    gap: 0.22rem;
    min-width: 170px;
    padding: 1rem;
    border-radius: 22px;
    border: 1px solid rgba(255, 255, 255, 0.65);
    background: rgba(255, 255, 255, 0.78);
    backdrop-filter: blur(16px);
    box-shadow: 0 18px 44px rgba(13, 13, 13, 0.1);
    animation: landingFloat 7.5s ease-in-out infinite;
}

.landing-floating-card i {
    width: 2.25rem;
    height: 2.25rem;
    display: inline-grid;
    place-items: center;
    border-radius: 999px;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
}

.landing-floating-card strong {
    color: var(--ink);
}

.landing-floating-card span {
    color: var(--mid);
    font-size: 0.82rem;
    line-height: 1.45;
}

.landing-floating-card-one {
    left: 0;
    top: 9%;
}

.landing-floating-card-two {
    right: 0.5rem;
    bottom: 5%;
    animation-delay: -2.6s;
}

.landing-section {
    padding-top: clamp(3.5rem, 7vw, 6rem);
    padding-bottom: clamp(3.5rem, 7vw, 6rem);
}

.landing-section-head {
    display: grid;
    gap: 0.35rem;
    max-width: 760px;
    margin-bottom: clamp(1.5rem, 3vw, 2.6rem);
}

.landing-section-head h2,
.landing-proof-copy h2,
.landing-school-card h2 {
    font-size: clamp(2rem, 4vw, 3.4rem);
    line-height: 1.06;
}

.landing-section-head p:not(.eyebrow),
.landing-proof-copy p,
.landing-school-card p {
    max-width: 620px;
    color: var(--mid);
    line-height: 1.72;
}

.landing-path-section,
.landing-pricing-preview {
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.07), transparent 34%),
        rgba(255, 255, 255, 0.44);
}

.landing-path-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.landing-path-card,
.landing-feature-card,
.landing-price-card,
.landing-proof-card {
    border: 1px solid rgba(13, 13, 13, 0.08);
    background: rgba(255, 255, 255, 0.86);
    box-shadow: 0 16px 42px rgba(13, 13, 13, 0.055);
    transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
}

.landing-path-card:hover,
.landing-path-card:focus-visible,
.landing-feature-card:hover,
.landing-price-card:hover,
.landing-proof-card:hover {
    transform: translateY(-4px);
    border-color: rgba(26, 107, 107, 0.22);
    box-shadow: 0 22px 54px rgba(13, 13, 13, 0.09);
}

.landing-path-card {
    --path-accent: #1d647f;
    --path-soft: #e9f4f9;
    --path-wash: rgba(76, 159, 199, 0.12);
    display: grid;
    grid-template-rows: 6.3rem auto 1fr auto;
    gap: 0.65rem;
    min-height: 17rem;
    padding: 1.2rem;
    border-radius: 24px;
    border-color: #dce7eb;
    background:
        radial-gradient(ellipse 8rem 4rem at 108% 108%, var(--path-wash), transparent 70%),
        linear-gradient(145deg, #fff 38%, #fbfdfd);
    color: #142746;
    text-decoration: none;
}

.landing-path-card--school {
    --path-accent: #176e68;
    --path-soft: #e5f3ef;
    --path-wash: rgba(64, 161, 139, 0.12);
}

.landing-path-card--tutor {
    --path-accent: #8d641c;
    --path-soft: #fbf0d9;
    --path-wash: rgba(212, 164, 69, 0.12);
}

.landing-path-card--family {
    --path-accent: #345f96;
    --path-soft: #eaf0fb;
    --path-wash: rgba(112, 146, 207, 0.12);
}

.landing-path-visual {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    min-width: 0;
    height: 6.3rem;
}

.landing-path-art {
    display: block;
    width: min(58%, 9.5rem);
    height: 6.25rem;
    object-fit: contain;
    object-position: center right;
    filter: drop-shadow(0 7px 8px rgba(20, 48, 77, 0.08));
    transition: transform 0.22s ease;
}

.landing-path-card:hover .landing-path-art,
.landing-path-card:focus-visible .landing-path-art {
    transform: translateY(-3px);
}

.landing-path-icon,
.landing-feature-icon,
.landing-proof-card span {
    width: 3rem;
    height: 3rem;
    border-radius: 18px;
    display: inline-grid;
    place-items: center;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
}

.landing-path-card strong {
    font-family: "Playfair Display", serif;
    font-size: 1.3rem;
    line-height: 1.22;
}

.landing-path-card p,
.landing-feature-card p,
.landing-price-card p,
.landing-proof-card p {
    margin: 0;
    color: var(--mid);
    line-height: 1.62;
    font-size: 0.92rem;
}

.landing-path-cta {
    margin-top: auto;
    justify-self: start;
    padding: 0.48rem 0.72rem;
    border-radius: 999px;
    background: var(--path-soft);
    color: var(--path-accent);
    font-weight: 700;
    font-size: 0.86rem;
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
}

.landing-path-card .landing-path-icon {
    flex: 0 0 3rem;
    background: var(--path-soft);
    color: var(--path-accent);
}

@media (max-width: 640px) {
    .landing-path-card {
        grid-template-rows: 5.3rem auto auto auto;
        gap: 0.55rem;
        min-height: 0;
        padding: 1rem;
    }

    .landing-path-visual {
        height: 5.3rem;
    }

    .landing-path-art {
        height: 5.3rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .landing-path-art {
        transition: none;
    }
}

.landing-feature-section,
.landing-proof-section {
    background: var(--ink);
    color: var(--cream);
}

.landing-feature-section .eyebrow,
.landing-proof-section .eyebrow {
    color: var(--gold-light);
}

.landing-feature-section .eyebrow::before,
.landing-proof-section .eyebrow::before {
    background: var(--gold-light);
}

.landing-feature-section .landing-section-head p,
.landing-proof-copy p {
    color: rgba(245, 240, 232, 0.66);
}

.landing-feature-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.landing-feature-card {
    display: grid;
    gap: 0.75rem;
    min-height: 260px;
    padding: 1.25rem;
    border-radius: 24px;
    background:
        radial-gradient(circle at top right, rgba(232, 201, 122, 0.1), transparent 35%),
        rgba(245, 240, 232, 0.055);
    border-color: rgba(245, 240, 232, 0.1);
    box-shadow: none;
}

.landing-feature-card h3,
.landing-proof-card strong {
    color: var(--cream);
}

.landing-feature-card p,
.landing-proof-card p {
    color: rgba(245, 240, 232, 0.66);
}

.landing-feature-icon,
.landing-proof-card span {
    background: rgba(232, 201, 122, 0.14);
    color: var(--gold-light);
}

.landing-courses-section {
    background: linear-gradient(180deg, rgba(245, 240, 232, 0.9), rgba(255, 255, 255, 0.86));
}

.landing-course-grid {
    align-items: stretch;
}

.landing-course-grid > .landing-reveal {
    min-width: 0;
}

.landing-center-action {
    display: flex;
    justify-content: center;
    margin-top: 1.6rem;
}

.landing-school-strip {
    padding-top: clamp(2.5rem, 5vw, 4rem);
    padding-bottom: clamp(2.5rem, 5vw, 4rem);
}

.landing-school-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 1.5rem;
    align-items: center;
    padding: clamp(1.35rem, 3vw, 2rem);
    border-radius: 28px;
    background:
        radial-gradient(circle at top right, rgba(232, 201, 122, 0.26), transparent 34%),
        linear-gradient(135deg, rgba(26, 107, 107, 0.98), rgba(9, 51, 68, 0.96));
    color: #fff;
    box-shadow: 0 24px 64px rgba(26, 107, 107, 0.18);
}

.landing-school-card .eyebrow,
.landing-school-card h2,
.landing-school-card p {
    color: #fff;
}

.landing-school-card p {
    color: rgba(255, 255, 255, 0.78);
}

.landing-school-card .btn-outline {
    border-color: rgba(255, 255, 255, 0.58);
    color: #fff;
}

.landing-school-card .btn-outline:hover {
    background: #fff;
    color: var(--teal);
}

.landing-school-actions {
    justify-content: flex-end;
}

.landing-price-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.landing-price-card {
    display: grid;
    gap: 0.72rem;
    padding: 1.35rem;
    border-radius: 24px;
}

.landing-price-card > span {
    font-family: "Space Mono", monospace;
    font-size: 0.66rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--teal);
}

.landing-price-card h3 {
    font-size: 1.45rem;
    margin: 0;
}

.landing-price-card strong {
    font-family: "Playfair Display", serif;
    font-size: 2.25rem;
    line-height: 1;
}

.landing-price-card strong small {
    font-family: "DM Sans", sans-serif;
    font-size: 0.85rem;
    color: var(--mid);
    font-weight: 500;
}

.landing-price-card .btn-plan {
    margin-top: auto;
}

.landing-price-card.is-featured {
    background:
        radial-gradient(circle at top right, rgba(232, 201, 122, 0.2), transparent 36%),
        var(--teal);
    color: #fff;
    border-color: rgba(26, 107, 107, 0.2);
}

.landing-price-card.is-featured > span,
.landing-price-card.is-featured p,
.landing-price-card.is-featured strong small {
    color: rgba(255, 255, 255, 0.76);
}

.landing-price-card.is-featured .btn-plan {
    background: #fff;
    border-color: #fff;
    color: var(--teal);
}

/* Homepage access preview follows the current course purchase and school package model. */
.home-access-preview-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.home-access-preview-card {
    display: flex;
    min-height: 100%;
    flex-direction: column;
    align-items: flex-start;
    padding: clamp(1.25rem, 2.5vw, 1.8rem);
    border: 1px solid rgba(13, 13, 13, 0.08);
    border-radius: 26px;
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.96), rgba(235, 246, 244, 0.82));
    box-shadow: 0 18px 44px rgba(13, 13, 13, 0.07);
}

.home-access-preview-card.is-school {
    background: radial-gradient(circle at top right, rgba(232, 201, 122, 0.28), transparent 34%), linear-gradient(145deg, rgba(11, 69, 72, 0.98), rgba(26, 107, 107, 0.94));
    color: #fff;
}

.home-access-preview-icon {
    display: inline-grid;
    width: 3rem;
    height: 3rem;
    margin-bottom: 1rem;
    place-items: center;
    border-radius: 18px;
    background: rgba(26, 107, 107, 0.12);
    color: var(--teal);
    font-size: 1.12rem;
}

.home-access-preview-card.is-school .home-access-preview-icon {
    background: rgba(255, 255, 255, 0.14);
    color: var(--gold-light);
}

.home-access-preview-card h3 {
    margin: 0.1rem 0 0.6rem;
    font-size: clamp(1.45rem, 2.7vw, 2rem);
    line-height: 1.08;
}

.home-access-preview-card > p:not(.eyebrow) {
    margin: 0;
    color: var(--mid);
    line-height: 1.62;
}

.home-access-preview-card.is-school .eyebrow,
.home-access-preview-card.is-school > p:not(.eyebrow),
.home-access-preview-card.is-school li {
    color: rgba(255, 255, 255, 0.82);
}

.home-access-preview-card ul {
    display: grid;
    gap: 0.62rem;
    padding: 1rem 0 1.2rem;
    margin: auto 0 0;
    list-style: none;
}

.home-access-preview-card li {
    display: flex;
    gap: 0.55rem;
    color: var(--mid);
    line-height: 1.46;
}

.home-access-preview-card li i {
    margin-top: 0.18rem;
    color: var(--teal);
}

.home-access-preview-card.is-school li i {
    color: var(--gold-light);
}

.home-access-preview-card .btn {
    width: 100%;
    justify-content: center;
}

.home-access-preview-actions {
    display: grid;
    width: 100%;
    gap: 0.65rem;
}

.home-access-preview-card.is-school .btn {
    border-color: #fff;
    background: #fff;
    color: var(--teal);
}

.home-access-preview-card.is-school .home-access-secondary {
    border-color: rgba(255, 255, 255, 0.52);
    background: transparent;
    color: #fff;
}

.home-access-preview-card.is-school .home-access-secondary:hover,
.home-access-preview-card.is-school .home-access-secondary:focus-visible {
    border-color: #fff;
    background: rgba(255, 255, 255, 0.12);
}

.landing-proof-section {
    display: grid;
    grid-template-columns: minmax(0, 0.82fr) minmax(0, 1.18fr);
    gap: 1.5rem;
    align-items: start;
}

.landing-proof-grid {
    display: grid;
    gap: 1rem;
}

.landing-proof-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.35rem 0.85rem;
    align-items: start;
    padding: 1rem;
    border-radius: 22px;
    background: rgba(245, 240, 232, 0.055);
    border-color: rgba(245, 240, 232, 0.1);
    box-shadow: none;
}

.landing-proof-card span {
    grid-row: span 2;
}

.landing-catalog-hero {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(300px, 0.5fr);
    gap: clamp(1.5rem, 4vw, 3rem);
    align-items: end;
    padding: clamp(7rem, 11vw, 9rem) clamp(1.25rem, 4vw, 4rem) clamp(2.5rem, 6vw, 4rem);
    overflow: hidden;
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.1), transparent 34rem),
        linear-gradient(180deg, rgba(245, 240, 232, 0.92), rgba(255, 255, 255, 0.72));
}

.landing-catalog-copy,
.landing-catalog-summary {
    position: relative;
    z-index: 1;
}

.landing-catalog-copy h1 {
    max-width: 860px;
    font-size: clamp(2.45rem, 5.2vw, 4.75rem);
    line-height: 1;
    margin-bottom: 1.15rem;
}

.landing-catalog-copy p:not(.eyebrow) {
    max-width: 670px;
    color: var(--mid);
    line-height: 1.74;
    margin-bottom: 1.5rem;
}

.landing-catalog-summary {
    display: grid;
    gap: 1rem;
    padding: 1.25rem;
    border-radius: 24px;
    border: 1px solid rgba(13, 13, 13, 0.08);
    background: rgba(255, 255, 255, 0.86);
    box-shadow: 0 18px 48px rgba(13, 13, 13, 0.08);
}

.landing-catalog-summary h2 {
    margin: 0;
    font-size: clamp(1.35rem, 2.4vw, 1.8rem);
    line-height: 1.18;
}

.landing-catalog-mini-grid {
    display: grid;
    gap: 0.65rem;
}

.landing-catalog-mini-grid div {
    display: grid;
    gap: 0.2rem;
    padding: 0.78rem 0.85rem;
    border-radius: 14px;
    background: rgba(245, 240, 232, 0.76);
}

.landing-catalog-mini-grid span {
    font-family: "Space Mono", monospace;
    font-size: 0.6rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--teal);
}

.landing-catalog-mini-grid strong {
    font-size: 0.95rem;
    color: var(--ink);
}

.landing-catalog-section {
    padding-top: clamp(2rem, 5vw, 4rem);
}

.landing-catalog-shell {
    display: grid;
    gap: 1.2rem;
}

.landing-course-filter {
    display: grid;
    gap: 0.9rem;
    padding: 1rem;
    border-radius: 24px;
    border: 1px solid rgba(13, 13, 13, 0.08);
    background:
        radial-gradient(circle at top right, rgba(201, 168, 76, 0.12), transparent 34%),
        rgba(255, 255, 255, 0.88);
    box-shadow: 0 16px 44px rgba(13, 13, 13, 0.055);
}

.landing-course-search {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 0.8rem;
    min-height: 56px;
    padding: 0 1rem;
    border-radius: 18px;
    border: 1px solid rgba(13, 13, 13, 0.08);
    background: #fff;
}

.landing-course-search i {
    color: var(--teal);
}

.landing-course-search input {
    width: 100%;
    border: none;
    outline: none;
    background: transparent;
    color: var(--ink);
    font: inherit;
}

.landing-filter-group {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
}

.landing-course-filter .filter-pill-button,
.landing-course-filter .access-tab-button {
    min-height: 40px;
}

.landing-access-filter {
    padding-top: 0.8rem;
    border-top: 1px solid rgba(13, 13, 13, 0.08);
}

.landing-catalog-section .courses-results-head {
    margin: 0;
    padding: 0.35rem 0;
}

.landing-catalog-section .courses-results-copy {
    font-size: 0.92rem;
}

.landing-catalog-grid {
    gap: 1rem;
}

.landing-catalog-grid > .landing-reveal {
    min-width: 0;
}

.landing-catalog-grid .c-card {
    height: 100%;
    display: flex;
    flex-direction: column;
    border-radius: 22px;
    box-shadow: 0 14px 36px rgba(13, 13, 13, 0.055);
}

.landing-catalog-grid .c-thumb {
    height: 118px;
    font-size: 1.45rem;
}

.landing-catalog-grid .c-body {
    display: flex;
    flex: 1;
    flex-direction: column;
    padding: 1.1rem;
}

.landing-catalog-grid .public-course-card h3 {
    min-height: 0;
}

.landing-catalog-grid .c-body p {
    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    margin-bottom: 0.9rem;
}

.landing-catalog-grid .public-course-meta {
    grid-template-columns: 1fr;
    gap: 0.55rem;
    margin-bottom: 0.9rem;
}

.landing-catalog-grid .public-course-meta div:nth-child(n + 3) {
    display: none;
}

.landing-catalog-grid .public-course-footer {
    margin-top: auto;
}

.landing-catalog-grid .public-course-footer .btn {
    white-space: nowrap;
}

.landing-detail-hero {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(300px, 0.44fr);
    gap: clamp(1.5rem, 4vw, 3rem);
    align-items: end;
    padding: clamp(7rem, 11vw, 9rem) clamp(1.25rem, 4vw, 4rem) clamp(2.5rem, 6vw, 4rem);
    overflow: hidden;
    background:
        radial-gradient(circle at top right, rgba(201, 168, 76, 0.12), transparent 32rem),
        linear-gradient(180deg, rgba(245, 240, 232, 0.94), rgba(255, 255, 255, 0.76));
}

.landing-detail-copy,
.landing-detail-card {
    position: relative;
    z-index: 1;
}

.landing-detail-copy h1 {
    max-width: 860px;
    font-size: clamp(2.45rem, 5.2vw, 4.75rem);
    line-height: 1;
    margin-bottom: 1.15rem;
}

.landing-detail-copy p:not(.eyebrow) {
    max-width: 700px;
    color: var(--mid);
    line-height: 1.74;
    margin-bottom: 1.5rem;
}

.landing-detail-card,
.landing-detail-overview,
.landing-detail-next,
.landing-module-card,
.landing-assessment-card {
    border: 1px solid rgba(13, 13, 13, 0.08);
    background: rgba(255, 255, 255, 0.88);
    box-shadow: 0 16px 44px rgba(13, 13, 13, 0.055);
}

.landing-detail-card {
    display: grid;
    gap: 1rem;
    padding: 1.25rem;
    border-radius: 24px;
}

.landing-detail-card h2 {
    margin: 0;
    font-size: 1.55rem;
}

.landing-detail-meta {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
}

.landing-detail-meta div {
    display: grid;
    gap: 0.22rem;
    padding: 0.82rem 0.88rem;
    border-radius: 16px;
    background: rgba(245, 240, 232, 0.74);
}

.landing-detail-meta span,
.landing-module-head span,
.landing-detail-benefits span + strong {
    font-family: "Space Mono", monospace;
    font-size: 0.62rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--teal);
}

.landing-detail-meta strong {
    color: var(--ink);
    line-height: 1.35;
}

.landing-detail-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(300px, 0.42fr);
    gap: 1rem;
    align-items: stretch;
}

.landing-detail-overview,
.landing-detail-next,
.landing-module-card {
    border-radius: 24px;
    padding: clamp(1.2rem, 2.4vw, 1.65rem);
}

.landing-detail-overview h2,
.landing-detail-next h2,
.landing-assessment-card h2 {
    font-size: clamp(1.75rem, 3.4vw, 2.7rem);
    line-height: 1.08;
}

.landing-detail-overview > p,
.landing-detail-next p,
.landing-assessment-card p {
    color: var(--mid);
    line-height: 1.7;
}

.landing-detail-benefits {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.85rem;
    margin-top: 1.2rem;
}

.landing-detail-benefits div {
    display: grid;
    gap: 0.45rem;
    padding: 1rem;
    border-radius: 18px;
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.08), transparent 34%),
        rgba(245, 240, 232, 0.72);
}

.landing-detail-benefits span {
    width: 2.7rem;
    height: 2.7rem;
    display: inline-grid;
    place-items: center;
    border-radius: 16px;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
}

.landing-detail-benefits strong {
    color: var(--ink);
}

.landing-detail-benefits p {
    margin: 0;
    color: var(--mid);
    line-height: 1.55;
    font-size: 0.9rem;
}

.landing-detail-next {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    background:
        radial-gradient(circle at top right, rgba(232, 201, 122, 0.16), transparent 34%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(232, 244, 244, 0.82));
}

.landing-detail-next .btn {
    margin-top: auto;
    justify-content: center;
}

.landing-lesson-preview-section {
    background:
        radial-gradient(circle at top left, rgba(26, 107, 107, 0.08), transparent 34%),
        rgba(245, 240, 232, 0.86);
}

.landing-lesson-preview-list {
    display: grid;
    gap: 1rem;
}

.landing-module-card {
    display: grid;
    gap: 1rem;
}

.landing-module-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.landing-module-head h3 {
    margin: 0.2rem 0 0;
    font-size: 1.45rem;
}

.landing-lesson-list {
    display: grid;
    gap: 0.65rem;
}

.landing-lesson-row {
    display: grid;
    grid-template-columns: auto auto minmax(0, 1fr) auto;
    gap: 0.75rem;
    align-items: center;
    padding: 0.82rem 0.9rem;
    border-radius: 16px;
    border: 1px solid rgba(13, 13, 13, 0.07);
    background: rgba(255, 255, 255, 0.78);
    color: var(--ink);
    transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.landing-lesson-row:hover,
.landing-lesson-row:focus-visible {
    transform: translateY(-2px);
    border-color: rgba(26, 107, 107, 0.22);
    box-shadow: 0 14px 30px rgba(13, 13, 13, 0.06);
}

.landing-lesson-number {
    width: 2.2rem;
    height: 2.2rem;
    display: inline-grid;
    place-items: center;
    border-radius: 999px;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
    font-weight: 800;
}

.landing-lesson-row strong {
    display: block;
    overflow-wrap: anywhere;
}

.landing-lesson-row small {
    display: block;
    color: var(--mid);
    margin-top: 0.12rem;
}

.landing-lesson-row > i {
    color: var(--teal);
}

.landing-lesson-row.is-locked {
    cursor: default;
    background: rgba(245, 240, 232, 0.72);
    color: rgba(13, 13, 13, 0.72);
}

.landing-lesson-row.is-locked:hover {
    transform: none;
    border-color: rgba(13, 13, 13, 0.07);
    box-shadow: none;
}

.landing-lesson-row.is-locked > i {
    color: var(--mid);
}

.landing-assessment-strip {
    padding-top: clamp(2.5rem, 5vw, 4rem);
    padding-bottom: clamp(2.5rem, 5vw, 4rem);
}

.landing-assessment-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 1.5rem;
    align-items: center;
    padding: clamp(1.35rem, 3vw, 2rem);
    border-radius: 28px;
    background:
        radial-gradient(circle at top right, rgba(232, 201, 122, 0.24), transparent 34%),
        linear-gradient(135deg, rgba(9, 51, 68, 0.98), rgba(26, 107, 107, 0.95));
    color: #fff;
    box-shadow: 0 24px 64px rgba(26, 107, 107, 0.18);
}

.landing-assessment-card .eyebrow,
.landing-assessment-card h2,
.landing-assessment-card p {
    color: #fff;
}

.landing-assessment-card p {
    color: rgba(255, 255, 255, 0.78);
}

.landing-assessment-card .btn-outline {
    border-color: rgba(255, 255, 255, 0.58);
    color: #fff;
}

.landing-assessment-card .btn-outline:hover {
    background: #fff;
    color: var(--teal);
}

.landing-pricing-hero {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(300px, 0.44fr);
    gap: clamp(1.5rem, 4vw, 3rem);
    align-items: stretch;
    padding: clamp(7rem, 11vw, 9rem) clamp(1.25rem, 4vw, 4rem) clamp(2.75rem, 6vw, 5rem);
    overflow: hidden;
}

.landing-pricing-copy,
.landing-pricing-choice-card {
    position: relative;
    z-index: 1;
}

.landing-pricing-copy {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.landing-pricing-copy h1 {
    max-width: 860px;
    font-size: clamp(2.45rem, 5.1vw, 4.7rem);
    line-height: 1;
    margin-bottom: 1.15rem;
}

.landing-pricing-copy > p:not(.eyebrow) {
    max-width: 680px;
    color: var(--mid);
    font-size: clamp(1rem, 1.45vw, 1.16rem);
    line-height: 1.76;
    margin-bottom: 1.6rem;
}

.landing-pricing-choice-card,
.landing-pricing-card,
.landing-school-pricing-card,
.landing-compare-panel,
.landing-faq-item {
    border: 1px solid rgba(13, 13, 13, 0.08);
    background: rgba(255, 255, 255, 0.9);
    box-shadow: 0 22px 54px rgba(13, 13, 13, 0.08);
}

.landing-pricing-choice-card {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 1rem;
    padding: clamp(1.25rem, 2.6vw, 1.8rem);
    border-radius: 28px;
    background:
        radial-gradient(circle at top right, rgba(232, 201, 122, 0.22), transparent 38%),
        rgba(255, 255, 255, 0.92);
}

.landing-pricing-choice-card h2 {
    margin: 0;
    font-size: clamp(1.35rem, 2.2vw, 1.85rem);
    line-height: 1.14;
}

.landing-choice-list {
    display: grid;
    gap: 0.75rem;
}

.landing-choice-list a {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.82rem;
    align-items: center;
    padding: 0.9rem;
    border: 1px solid rgba(13, 13, 13, 0.07);
    border-radius: 18px;
    background: rgba(245, 240, 232, 0.72);
    color: var(--ink);
    transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.landing-choice-list a:hover,
.landing-choice-list a:focus-visible {
    transform: translateY(-2px);
    border-color: rgba(26, 107, 107, 0.24);
    box-shadow: 0 14px 30px rgba(13, 13, 13, 0.07);
}

.landing-choice-list i,
.landing-pricing-icon,
.landing-school-pricing-points i {
    display: inline-grid;
    place-items: center;
    width: 2.65rem;
    height: 2.65rem;
    border-radius: 999px;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
}

.landing-choice-list small {
    display: block;
    margin-top: 0.14rem;
    color: var(--mid);
}

.landing-pricing-plans {
    padding-top: clamp(2.75rem, 6vw, 4.75rem);
    padding-bottom: clamp(2.75rem, 6vw, 4.75rem);
}

.landing-pricing-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.landing-pricing-card {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    min-height: 100%;
    padding: clamp(1.1rem, 2vw, 1.35rem);
    border-radius: 24px;
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.08), transparent 35%),
        rgba(255, 255, 255, 0.9);
    transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
}

.landing-pricing-card:hover {
    transform: translateY(-4px);
    border-color: rgba(26, 107, 107, 0.24);
    box-shadow: 0 28px 68px rgba(13, 13, 13, 0.11);
}

.landing-pricing-card.is-featured {
    background:
        radial-gradient(circle at top right, rgba(232, 201, 122, 0.24), transparent 38%),
        linear-gradient(145deg, rgba(9, 51, 68, 0.98), rgba(26, 107, 107, 0.96));
    color: #fff;
}

.landing-pricing-card.is-featured h3,
.landing-pricing-card.is-featured p,
.landing-pricing-card.is-featured .landing-pricing-price strong,
.landing-pricing-card.is-featured .landing-pricing-price span,
.landing-pricing-card.is-featured .landing-pricing-features li {
    color: #fff;
}

.landing-pricing-card.is-featured .pill,
.landing-pricing-card.is-featured .landing-pricing-icon {
    background: rgba(255, 255, 255, 0.14);
    color: #fff;
}

.landing-pricing-card.is-featured .btn.primary {
    background: #fff;
    border-color: #fff;
    color: var(--teal);
}

.landing-pricing-top {
    display: flex;
    justify-content: space-between;
    gap: 0.85rem;
    align-items: center;
}

.landing-pricing-card h3 {
    margin: 0;
    font-size: clamp(1.35rem, 2.4vw, 1.8rem);
    line-height: 1.12;
}

.landing-pricing-card > p {
    color: var(--mid);
    line-height: 1.58;
    margin: 0;
}

.landing-pricing-price {
    display: grid;
    gap: 0.15rem;
    padding: 0.95rem 0;
    border-top: 1px solid rgba(13, 13, 13, 0.08);
    border-bottom: 1px solid rgba(13, 13, 13, 0.08);
}

.landing-pricing-card.is-featured .landing-pricing-price {
    border-color: rgba(255, 255, 255, 0.18);
}

.landing-pricing-price strong {
    color: var(--ink);
    font-size: clamp(1.75rem, 3vw, 2.35rem);
    line-height: 1;
}

.landing-pricing-price span {
    color: var(--mid);
    font-size: 0.86rem;
}

.landing-pricing-features {
    display: grid;
    gap: 0.68rem;
    padding: 0;
    margin: 0;
    list-style: none;
}

.landing-pricing-features li {
    display: flex;
    gap: 0.6rem;
    color: var(--mid);
    line-height: 1.45;
}

.landing-pricing-features i {
    color: var(--teal);
    margin-top: 0.2rem;
}

.landing-pricing-card.is-featured .landing-pricing-features i {
    color: var(--gold-light);
}

.landing-pricing-actions {
    margin-top: auto;
}

.landing-pricing-actions .btn {
    width: 100%;
    justify-content: center;
}

.landing-school-pricing-section {
    padding-top: clamp(2.75rem, 6vw, 4.5rem);
    padding-bottom: clamp(2.75rem, 6vw, 4.5rem);
    background:
        radial-gradient(circle at top left, rgba(26, 107, 107, 0.08), transparent 34%),
        rgba(255, 255, 255, 0.42);
}

.landing-school-pricing-card {
    display: grid;
    grid-template-columns: minmax(0, 0.95fr) minmax(280px, 1fr);
    gap: clamp(1.25rem, 3vw, 2rem);
    align-items: center;
    padding: clamp(1.35rem, 3vw, 2.25rem);
    border-radius: 30px;
    background:
        radial-gradient(circle at top right, rgba(232, 201, 122, 0.2), transparent 32%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.94), rgba(232, 244, 244, 0.78));
}

.landing-school-pricing-copy h2 {
    margin: 0 0 0.8rem;
    font-size: clamp(2rem, 4.4vw, 3.45rem);
    line-height: 1.02;
}

.landing-school-pricing-copy > p:not(.eyebrow) {
    color: var(--mid);
    line-height: 1.72;
    margin-bottom: 1.25rem;
}

.landing-school-pricing-points {
    display: grid;
    gap: 0.85rem;
}

.landing-school-pricing-points article {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.4rem 0.82rem;
    padding: 1rem;
    border-radius: 18px;
    border: 1px solid rgba(13, 13, 13, 0.07);
    background: rgba(255, 255, 255, 0.72);
}

.landing-school-pricing-points i {
    grid-row: span 2;
}

.landing-school-pricing-points strong {
    color: var(--ink);
}

.landing-school-pricing-points span {
    color: var(--mid);
    line-height: 1.55;
}

.landing-compare-section {
    padding-top: clamp(2.5rem, 5vw, 3.75rem);
    padding-bottom: clamp(2.5rem, 5vw, 3.75rem);
}

.landing-compare-panel {
    border-radius: 26px;
    overflow: hidden;
}

.landing-compare-panel summary {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: 1.2rem clamp(1.15rem, 2.5vw, 1.65rem);
    cursor: pointer;
    list-style: none;
}

.landing-compare-panel summary::-webkit-details-marker {
    display: none;
}

.landing-compare-panel summary small {
    display: block;
    margin-bottom: 0.25rem;
    color: var(--teal);
    font-family: "Space Mono", monospace;
    font-size: 0.66rem;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.landing-compare-panel summary strong {
    font-size: clamp(1.25rem, 2.4vw, 1.7rem);
}

.landing-compare-panel summary i {
    width: 2.5rem;
    height: 2.5rem;
    display: inline-grid;
    place-items: center;
    border-radius: 999px;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
    transition: transform 0.22s ease;
}

.landing-compare-panel[open] summary i {
    transform: rotate(45deg);
}

.landing-compare-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem;
    padding: 0 clamp(1rem, 2.5vw, 1.65rem) clamp(1rem, 2.5vw, 1.65rem);
}

.landing-compare-card {
    padding: 1rem;
    border: 1px solid rgba(13, 13, 13, 0.07);
    border-radius: 18px;
    background: rgba(245, 240, 232, 0.66);
}

.landing-compare-card h3 {
    margin: 0 0 0.8rem;
    font-size: 1rem;
}

.landing-compare-values {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.55rem;
}

.landing-compare-values span {
    display: grid;
    gap: 0.2rem;
    padding: 0.7rem;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.72);
    color: var(--mid);
    font-size: 0.76rem;
}

.landing-compare-values strong {
    color: var(--ink);
    font-size: 0.86rem;
    line-height: 1.35;
}

.landing-compare-values .is-partial {
    color: var(--rust);
}

.landing-compare-values .is-muted {
    color: var(--mid);
}

.landing-pricing-faq-section {
    padding-top: clamp(2.75rem, 6vw, 4.5rem);
    padding-bottom: clamp(3rem, 7vw, 5rem);
    background:
        radial-gradient(circle at bottom right, rgba(232, 201, 122, 0.14), transparent 36%),
        rgba(245, 240, 232, 0.72);
}

.landing-faq-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.landing-faq-item {
    padding: 1.05rem 1.15rem;
    border-radius: 20px;
}

.landing-faq-item summary {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: center;
    cursor: pointer;
    color: var(--ink);
    font-weight: 800;
    list-style: none;
}

.landing-faq-item summary::-webkit-details-marker {
    display: none;
}

.landing-faq-item summary i {
    color: var(--teal);
    transition: transform 0.22s ease;
}

.landing-faq-item[open] summary i {
    transform: rotate(45deg);
}

.landing-faq-item p {
    margin: 0.9rem 0 0;
    color: var(--mid);
    line-height: 1.68;
}

.landing-about-hero {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(300px, 0.42fr);
    gap: clamp(1.5rem, 4vw, 3rem);
    align-items: stretch;
    padding: clamp(7rem, 11vw, 9rem) clamp(1.25rem, 4vw, 4rem) clamp(2.75rem, 6vw, 5rem);
    overflow: hidden;
}

.landing-about-copy,
.landing-about-story-card {
    position: relative;
    z-index: 1;
}

.landing-about-copy {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.landing-about-copy h1 {
    max-width: 920px;
    font-size: clamp(2.45rem, 5.2vw, 4.75rem);
    line-height: 1;
    margin-bottom: 1.15rem;
}

.landing-about-copy > p:not(.eyebrow) {
    max-width: 710px;
    color: var(--mid);
    font-size: clamp(1rem, 1.45vw, 1.16rem);
    line-height: 1.76;
    margin-bottom: 1.6rem;
}

.landing-about-story-card,
.landing-about-purpose-card,
.landing-about-mini-card,
.landing-about-pillar-card,
.landing-about-audience-card,
.landing-about-school-card,
.landing-about-cta-card {
    border: 1px solid rgba(13, 13, 13, 0.08);
    background: rgba(255, 255, 255, 0.9);
    box-shadow: 0 22px 54px rgba(13, 13, 13, 0.08);
}

.landing-about-story-card {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 1rem;
    padding: clamp(1.25rem, 2.6vw, 1.8rem);
    border-radius: 28px;
    background:
        radial-gradient(circle at top right, rgba(232, 201, 122, 0.22), transparent 38%),
        rgba(255, 255, 255, 0.92);
}

.landing-about-story-card h2 {
    margin: 0;
    font-size: clamp(1.8rem, 3vw, 2.55rem);
    line-height: 1.04;
}

.landing-about-story-card p {
    margin: 0;
    color: var(--mid);
    line-height: 1.65;
}

.landing-about-proof {
    display: grid;
    gap: 0.65rem;
}

.landing-about-proof span {
    display: grid;
    gap: 0.12rem;
    padding: 0.8rem 0.9rem;
    border: 1px solid rgba(13, 13, 13, 0.07);
    border-radius: 16px;
    background: rgba(245, 240, 232, 0.72);
}

.landing-about-proof small {
    color: var(--mid);
}

.landing-about-purpose {
    display: grid;
    grid-template-columns: minmax(0, 0.95fr) minmax(320px, 1fr);
    gap: 1rem;
    padding-top: clamp(2.75rem, 6vw, 4.75rem);
    padding-bottom: clamp(2.75rem, 6vw, 4.75rem);
}

.landing-about-purpose-card,
.landing-about-mini-card {
    border-radius: 24px;
    padding: clamp(1.2rem, 2.6vw, 1.8rem);
}

.landing-about-purpose-card {
    display: flex;
    flex-direction: column;
    justify-content: center;
    background:
        radial-gradient(circle at top left, rgba(26, 107, 107, 0.1), transparent 38%),
        rgba(255, 255, 255, 0.92);
}

.landing-about-purpose-card h2 {
    margin: 0 0 0.8rem;
    font-size: clamp(2rem, 4.3vw, 3.35rem);
    line-height: 1.04;
}

.landing-about-purpose-card p,
.landing-about-mini-card p {
    color: var(--mid);
    line-height: 1.7;
}

.landing-about-mini-grid {
    display: grid;
    gap: 1rem;
}

.landing-about-mini-card {
    display: grid;
    gap: 0.65rem;
}

.landing-about-mini-card i,
.landing-about-pillar-card span,
.landing-about-audience-card i,
.landing-about-school-list span {
    display: inline-grid;
    place-items: center;
    width: 2.8rem;
    height: 2.8rem;
    border-radius: 999px;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
}

.landing-about-mini-card > span {
    font-family: "Space Mono", monospace;
    font-size: 0.66rem;
    letter-spacing: 0.13em;
    text-transform: uppercase;
    color: var(--teal);
}

.landing-about-mini-card h3 {
    margin: 0;
    font-size: 1.35rem;
    line-height: 1.14;
}

.landing-about-pillars-section,
.landing-about-school-section {
    padding-top: clamp(2.75rem, 6vw, 4.5rem);
    padding-bottom: clamp(2.75rem, 6vw, 4.5rem);
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.07), transparent 34%),
        rgba(245, 240, 232, 0.72);
}

.landing-about-pillars-grid,
.landing-about-audience-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.landing-about-pillar-card,
.landing-about-audience-card {
    display: grid;
    gap: 0.8rem;
    padding: clamp(1.1rem, 2vw, 1.35rem);
    border-radius: 24px;
    transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
}

.landing-about-pillar-card:hover,
.landing-about-audience-card:hover {
    transform: translateY(-4px);
    border-color: rgba(26, 107, 107, 0.24);
    box-shadow: 0 28px 68px rgba(13, 13, 13, 0.11);
}

.landing-about-pillar-card h3,
.landing-about-audience-card h3 {
    margin: 0;
    font-size: 1.28rem;
    line-height: 1.15;
}

.landing-about-pillar-card p,
.landing-about-audience-card p {
    margin: 0;
    color: var(--mid);
    line-height: 1.62;
}

.landing-about-audience-section {
    padding-top: clamp(2.75rem, 6vw, 4.5rem);
    padding-bottom: clamp(2.75rem, 6vw, 4.5rem);
}

.landing-about-school-card {
    display: grid;
    grid-template-columns: minmax(0, 0.95fr) minmax(280px, 1fr);
    gap: clamp(1.2rem, 3vw, 2rem);
    align-items: center;
    padding: clamp(1.35rem, 3vw, 2.25rem);
    border-radius: 30px;
    background:
        radial-gradient(circle at top right, rgba(232, 201, 122, 0.2), transparent 32%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.94), rgba(232, 244, 244, 0.78));
}

.landing-about-school-card h2,
.landing-about-cta-card h2 {
    margin: 0 0 0.8rem;
    font-size: clamp(2rem, 4.4vw, 3.45rem);
    line-height: 1.02;
}

.landing-about-school-card p {
    color: var(--mid);
    line-height: 1.72;
}

.landing-about-school-list {
    display: grid;
    gap: 0.75rem;
}

.landing-about-school-list article {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.82rem;
    align-items: center;
    padding: 0.95rem;
    border-radius: 18px;
    border: 1px solid rgba(13, 13, 13, 0.07);
    background: rgba(255, 255, 255, 0.72);
}

.landing-about-school-list p {
    margin: 0;
    line-height: 1.55;
}

.landing-about-cta-section {
    padding-top: clamp(2.75rem, 6vw, 4.5rem);
    padding-bottom: clamp(3rem, 7vw, 5rem);
}

.landing-about-cta-card {
    display: grid;
    gap: 1.2rem;
    padding: clamp(1.35rem, 3vw, 2.25rem);
    border-radius: 30px;
    background:
        radial-gradient(circle at top right, rgba(232, 201, 122, 0.24), transparent 34%),
        linear-gradient(135deg, rgba(9, 51, 68, 0.98), rgba(26, 107, 107, 0.95));
    color: #fff;
}

.landing-about-cta-card .eyebrow,
.landing-about-cta-card h2 {
    color: #fff;
}

.landing-about-cta-card .btn.primary {
    background: #fff;
    border-color: #fff;
    color: var(--teal);
}

.landing-about-cta-card .btn.ghost {
    border-color: rgba(255, 255, 255, 0.52);
    color: #fff;
}

.landing-about-reason-strip {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
}

.landing-about-reason-strip span {
    padding: 0.7rem 0.85rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.12);
    color: rgba(255, 255, 255, 0.9);
    font-weight: 700;
}

.landing-contact-hero {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(300px, 0.42fr);
    gap: clamp(1.5rem, 4vw, 3rem);
    align-items: stretch;
    padding: clamp(7rem, 11vw, 9rem) clamp(1.25rem, 4vw, 4rem) clamp(2.75rem, 6vw, 5rem);
    overflow: hidden;
}

.landing-contact-copy,
.landing-contact-response-card {
    position: relative;
    z-index: 1;
}

.landing-contact-copy {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.landing-contact-copy h1 {
    max-width: 920px;
    font-size: clamp(2.45rem, 5.2vw, 4.75rem);
    line-height: 1;
    margin-bottom: 1.15rem;
}

.landing-contact-copy > p:not(.eyebrow) {
    max-width: 710px;
    color: var(--mid);
    font-size: clamp(1rem, 1.45vw, 1.16rem);
    line-height: 1.76;
    margin-bottom: 1.6rem;
}

.landing-contact-response-card,
.landing-contact-path-card,
.landing-contact-form-card,
.landing-contact-side-card {
    border: 1px solid rgba(13, 13, 13, 0.08);
    background: rgba(255, 255, 255, 0.9);
    box-shadow: 0 22px 54px rgba(13, 13, 13, 0.08);
}

.landing-contact-response-card {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 1rem;
    padding: clamp(1.25rem, 2.6vw, 1.8rem);
    border-radius: 28px;
    background:
        radial-gradient(circle at top right, rgba(232, 201, 122, 0.22), transparent 38%),
        rgba(255, 255, 255, 0.92);
}

.landing-contact-response-card h2 {
    margin: 0;
    font-size: clamp(1.8rem, 3vw, 2.55rem);
    line-height: 1.04;
}

.landing-contact-response-card p {
    margin: 0;
    color: var(--mid);
    line-height: 1.65;
}

.landing-contact-channel-mini {
    display: grid;
    gap: 0.65rem;
}

.landing-contact-channel-mini a,
.landing-contact-channel-list a {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.75rem;
    align-items: center;
    padding: 0.78rem 0.85rem;
    border-radius: 16px;
    border: 1px solid rgba(13, 13, 13, 0.07);
    background: rgba(245, 240, 232, 0.72);
    color: var(--ink);
    transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.landing-contact-channel-mini a:hover,
.landing-contact-channel-list a:hover,
.landing-contact-path-card:hover {
    transform: translateY(-3px);
    border-color: rgba(26, 107, 107, 0.24);
    box-shadow: 0 18px 38px rgba(13, 13, 13, 0.08);
}

.landing-contact-channel-mini i,
.landing-contact-channel-list i,
.landing-contact-path-card i,
.landing-contact-form-head > span i {
    display: inline-grid;
    place-items: center;
    width: 2.55rem;
    height: 2.55rem;
    border-radius: 999px;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
}

.landing-contact-path-section {
    padding-top: clamp(2.75rem, 6vw, 4.5rem);
    padding-bottom: clamp(2.75rem, 6vw, 4.5rem);
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.07), transparent 34%),
        rgba(245, 240, 232, 0.72);
}

.landing-contact-path-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 1rem;
}

.landing-contact-path-card {
    display: grid;
    gap: 0.72rem;
    padding: clamp(1rem, 2vw, 1.25rem);
    border-radius: 24px;
    color: var(--ink);
    transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease, background 0.22s ease;
}

.landing-contact-path-card strong {
    font-size: 1.05rem;
    line-height: 1.18;
}

.landing-contact-path-card span {
    color: var(--mid);
    line-height: 1.55;
    font-size: 0.88rem;
}

.landing-contact-path-card.is-active {
    border-color: rgba(26, 107, 107, 0.32);
    background:
        radial-gradient(circle at top right, rgba(232, 201, 122, 0.18), transparent 34%),
        rgba(232, 244, 244, 0.9);
}

.landing-contact-form-section {
    padding-top: clamp(2.75rem, 6vw, 4.75rem);
    padding-bottom: clamp(3rem, 7vw, 5rem);
}

.landing-contact-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 0.38fr);
    gap: 1rem;
}

.landing-contact-form-card,
.landing-contact-side-card {
    border-radius: 26px;
}

.landing-contact-form-card {
    padding: clamp(1.25rem, 3vw, 2rem);
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.08), transparent 34%),
        rgba(255, 255, 255, 0.92);
}

.landing-contact-form-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    margin-bottom: 1.2rem;
}

.landing-contact-form-head h2 {
    margin: 0 0 0.45rem;
    font-size: clamp(1.85rem, 4vw, 3rem);
    line-height: 1.06;
}

.landing-contact-form-head p {
    max-width: 700px;
    color: var(--mid);
    line-height: 1.7;
}

.landing-contact-form-head > span {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    white-space: nowrap;
    padding: 0.7rem 0.85rem;
    border-radius: 999px;
    background: rgba(245, 240, 232, 0.78);
    color: var(--teal);
    font-weight: 800;
}

.landing-contact-form-head > span i {
    width: 1.8rem;
    height: 1.8rem;
}

.landing-contact-form,
.landing-contact-form label {
    display: grid;
    gap: 0.65rem;
}

.landing-contact-form {
    gap: 1rem;
}

.contact-honeypot {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
}

.landing-contact-form label {
    color: var(--ink);
    font-weight: 800;
}

.landing-contact-fields.two {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.landing-contact-form input,
.landing-contact-form select,
.landing-contact-form textarea {
    width: 100%;
    border: 1px solid rgba(13, 13, 13, 0.12);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.84);
    padding: 0.95rem 1rem;
    color: var(--ink);
    font: inherit;
    font-weight: 600;
    outline: none;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.landing-contact-form textarea {
    min-height: 150px;
    resize: vertical;
}

.landing-contact-form input:focus,
.landing-contact-form select:focus,
.landing-contact-form textarea:focus {
    border-color: rgba(26, 107, 107, 0.5);
    background: #fff;
    box-shadow: 0 0 0 4px rgba(26, 107, 107, 0.1);
}

.landing-contact-form .btn {
    justify-self: start;
}

.landing-contact-note {
    padding: 0.85rem 1rem;
    border: 1px solid rgba(26, 107, 107, 0.18);
    border-radius: 16px;
    background: rgba(232, 244, 244, 0.78);
    color: var(--teal);
    font-weight: 800;
}

.landing-contact-side {
    display: grid;
    gap: 1rem;
    align-content: start;
}

.landing-contact-side-card {
    display: grid;
    gap: 0.85rem;
    padding: 1.15rem;
}

.landing-contact-side-card h3 {
    margin: 0;
    font-size: 1.2rem;
}

.landing-contact-side-card p {
    margin: 0;
    color: var(--mid);
    line-height: 1.65;
}

.landing-contact-channel-list {
    display: grid;
    gap: 0.7rem;
}

.landing-contact-channel-list small {
    display: block;
    margin-top: 0.15rem;
    color: var(--mid);
    overflow-wrap: anywhere;
}

.landing-contact-socials {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
}

.landing-contact-socials a {
    display: inline-grid;
    place-items: center;
    width: 2.7rem;
    height: 2.7rem;
    border-radius: 999px;
    border: 1px solid rgba(13, 13, 13, 0.08);
    background: rgba(232, 244, 244, 0.7);
    color: var(--teal);
    transition: transform 0.2s ease, background 0.2s ease, color 0.2s ease;
}

.landing-contact-socials a:hover {
    transform: translateY(-2px);
    background: var(--teal);
    color: #fff;
}

.landing-mobile-lab-hero {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(300px, 0.42fr);
    gap: clamp(1.5rem, 4vw, 3rem);
    align-items: stretch;
    padding: clamp(7rem, 11vw, 9rem) clamp(1.25rem, 4vw, 4rem) clamp(2.75rem, 6vw, 5rem);
    overflow: hidden;
}

.landing-mobile-lab-copy,
.landing-mobile-lab-card {
    position: relative;
    z-index: 1;
}

.landing-mobile-lab-copy {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.landing-mobile-lab-copy h1 {
    max-width: 920px;
    font-size: clamp(2.45rem, 5.2vw, 4.75rem);
    line-height: 1;
    margin-bottom: 1.15rem;
}

.landing-mobile-lab-copy > p:not(.eyebrow) {
    max-width: 710px;
    color: var(--mid);
    font-size: clamp(1rem, 1.45vw, 1.16rem);
    line-height: 1.76;
    margin-bottom: 1.6rem;
}

.landing-mobile-lab-card,
.landing-mobile-lab-step-card,
.landing-mobile-lab-service-card,
.landing-mobile-lab-benefit-panel,
.landing-mobile-lab-readiness-card,
.landing-mobile-lab-cta-card {
    border: 1px solid rgba(13, 13, 13, 0.08);
    background: rgba(255, 255, 255, 0.9);
    box-shadow: 0 22px 54px rgba(13, 13, 13, 0.08);
}

.landing-mobile-lab-card {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 1rem;
    padding: clamp(1.25rem, 2.6vw, 1.8rem);
    border-radius: 28px;
    background:
        radial-gradient(circle at top right, rgba(232, 201, 122, 0.22), transparent 38%),
        rgba(255, 255, 255, 0.92);
}

.landing-mobile-lab-card h2 {
    margin: 0;
    font-size: clamp(1.8rem, 3vw, 2.55rem);
    line-height: 1.04;
}

.landing-mobile-lab-image-frame {
    position: relative;
    display: grid;
    gap: 0.7rem;
    margin: 0;
    padding: 1rem;
    border-radius: 24px;
    overflow: hidden;
    border: 1px solid rgba(26, 107, 107, 0.12);
    background:
        radial-gradient(circle at top left, rgba(26, 107, 107, 0.16), transparent 38%),
        linear-gradient(135deg, rgba(245, 240, 232, 0.9), rgba(232, 244, 244, 0.86));
}

.landing-mobile-lab-image-frame::before {
    content: "";
    position: absolute;
    inset: auto 1rem 1rem auto;
    width: 5.5rem;
    height: 5.5rem;
    border-radius: 999px;
    background: rgba(232, 201, 122, 0.24);
    filter: blur(2px);
}

.landing-mobile-lab-image-frame img {
    position: relative;
    z-index: 1;
    width: min(100%, 580px);
    max-height: 300px;
    object-fit: contain;
    justify-self: center;
    filter: drop-shadow(0 18px 28px rgba(13, 13, 13, 0.12));
}

.landing-mobile-lab-image-frame figcaption {
    position: relative;
    z-index: 1;
    margin: 0;
    color: var(--mid);
    font-weight: 700;
    font-size: 0.86rem;
    line-height: 1.55;
    text-align: center;
}

.landing-mobile-lab-proof {
    display: grid;
    gap: 0.65rem;
}

.landing-mobile-lab-proof span {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.65rem;
    align-items: center;
    padding: 0.8rem 0.9rem;
    border: 1px solid rgba(13, 13, 13, 0.07);
    border-radius: 16px;
    background: rgba(245, 240, 232, 0.72);
    color: var(--ink);
    font-weight: 800;
}

.landing-mobile-lab-proof i,
.landing-mobile-lab-service-card i,
.landing-mobile-lab-benefit-list i {
    display: inline-grid;
    place-items: center;
    width: 2.8rem;
    height: 2.8rem;
    border-radius: 999px;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
}

.landing-mobile-lab-process,
.landing-mobile-lab-benefits {
    padding-top: clamp(2.75rem, 6vw, 4.5rem);
    padding-bottom: clamp(2.75rem, 6vw, 4.5rem);
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.07), transparent 34%),
        rgba(245, 240, 232, 0.72);
}

.landing-mobile-lab-step-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.landing-mobile-lab-step-card {
    display: grid;
    gap: 0.75rem;
    padding: clamp(1.1rem, 2vw, 1.35rem);
    border-radius: 24px;
}

.landing-mobile-lab-step-card span {
    display: inline-grid;
    place-items: center;
    width: 3rem;
    height: 3rem;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--teal), var(--teal-light));
    color: #fff;
    font-family: "Space Mono", monospace;
    font-weight: 800;
}

.landing-mobile-lab-step-card h3,
.landing-mobile-lab-service-card h3 {
    margin: 0;
    font-size: 1.25rem;
    line-height: 1.15;
}

.landing-mobile-lab-step-card p,
.landing-mobile-lab-service-card p,
.landing-mobile-lab-benefit-panel p,
.landing-mobile-lab-readiness-card p,
.landing-mobile-lab-cta-card p {
    margin: 0;
    color: var(--mid);
    line-height: 1.65;
}

.landing-mobile-lab-services {
    padding-top: clamp(2.75rem, 6vw, 4.5rem);
    padding-bottom: clamp(2.75rem, 6vw, 4.5rem);
}

.landing-mobile-lab-service-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.landing-mobile-lab-service-card {
    display: grid;
    gap: 0.8rem;
    padding: clamp(1.1rem, 2vw, 1.35rem);
    border-radius: 24px;
    transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
}

.landing-mobile-lab-service-card:hover {
    transform: translateY(-4px);
    border-color: rgba(26, 107, 107, 0.24);
    box-shadow: 0 28px 68px rgba(13, 13, 13, 0.11);
}

.landing-mobile-lab-benefit-panel {
    display: grid;
    grid-template-columns: minmax(0, 0.88fr) minmax(300px, 1fr);
    gap: clamp(1.2rem, 3vw, 2rem);
    align-items: center;
    padding: clamp(1.35rem, 3vw, 2.25rem);
    border-radius: 30px;
    background:
        radial-gradient(circle at top right, rgba(232, 201, 122, 0.2), transparent 32%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.94), rgba(232, 244, 244, 0.78));
}

.landing-mobile-lab-benefit-panel h2,
.landing-mobile-lab-readiness-card h2,
.landing-mobile-lab-cta-card h2 {
    margin: 0 0 0.8rem;
    font-size: clamp(2rem, 4.4vw, 3.45rem);
    line-height: 1.02;
}

.landing-mobile-lab-benefit-list {
    display: grid;
    gap: 0.75rem;
}

.landing-mobile-lab-benefit-list article {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.82rem;
    align-items: center;
    padding: 0.95rem;
    border-radius: 18px;
    border: 1px solid rgba(13, 13, 13, 0.07);
    background: rgba(255, 255, 255, 0.72);
}

.landing-mobile-lab-benefit-list strong,
.landing-mobile-lab-benefit-list small {
    display: block;
}

.landing-mobile-lab-benefit-list small {
    margin-top: 0.18rem;
    color: var(--mid);
    line-height: 1.48;
}

.landing-mobile-lab-readiness-section,
.landing-mobile-lab-cta-section {
    padding-top: clamp(2.75rem, 6vw, 4.5rem);
    padding-bottom: clamp(2.75rem, 6vw, 4.5rem);
}

.landing-mobile-lab-readiness-card {
    display: grid;
    grid-template-columns: minmax(0, 0.78fr) minmax(320px, 1fr);
    gap: clamp(1.2rem, 3vw, 2rem);
    align-items: center;
    padding: clamp(1.35rem, 3vw, 2.25rem);
    border-radius: 30px;
    background:
        radial-gradient(circle at top left, rgba(26, 107, 107, 0.1), transparent 38%),
        rgba(255, 255, 255, 0.92);
}

.landing-mobile-lab-readiness-grid {
    display: grid;
    gap: 0.8rem;
}

.landing-mobile-lab-readiness-grid article {
    display: grid;
    gap: 0.3rem;
    padding: 1rem;
    border-radius: 18px;
    border: 1px solid rgba(13, 13, 13, 0.07);
    background: rgba(245, 240, 232, 0.68);
}

.landing-mobile-lab-readiness-grid span {
    color: var(--teal);
    font-family: "Space Mono", monospace;
    font-size: 0.66rem;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.landing-mobile-lab-readiness-grid strong {
    line-height: 1.5;
}

.landing-mobile-lab-cta-card {
    display: grid;
    gap: 1rem;
    padding: clamp(1.35rem, 3vw, 2.25rem);
    border-radius: 30px;
    background:
        radial-gradient(circle at top right, rgba(232, 201, 122, 0.24), transparent 34%),
        linear-gradient(135deg, rgba(9, 51, 68, 0.98), rgba(26, 107, 107, 0.95));
    color: #fff;
}

.landing-mobile-lab-cta-layout {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(320px, 1fr);
    gap: clamp(1.25rem, 4vw, 3rem);
    align-items: center;
}

.landing-mobile-lab-cta-copy {
    min-width: 0;
}

.landing-mobile-lab-cta-card .eyebrow,
.landing-mobile-lab-cta-card h2 {
    color: #fff;
}

.landing-mobile-lab-cta-card p {
    color: rgba(255, 255, 255, 0.82);
}

.landing-mobile-lab-cta-card .btn.primary {
    background: #fff;
    border-color: #fff;
    color: var(--teal);
}

.landing-mobile-lab-cta-card .btn.ghost {
    border-color: rgba(255, 255, 255, 0.52);
    color: #fff;
}

.landing-mobile-lab-cta-card .landing-mobile-lab-readiness-grid article {
    border-color: rgba(255, 255, 255, 0.14);
    background: rgba(255, 255, 255, 0.08);
}

.landing-mobile-lab-cta-card .landing-mobile-lab-readiness-grid span {
    color: var(--gold-light);
}

.landing-mobile-lab-cta-card .landing-mobile-lab-readiness-grid strong {
    color: #fff;
}

.landing-animations-ready .landing-reveal {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity 0.58s ease, transform 0.58s cubic-bezier(0.2, 0.9, 0.2, 1);
    transition-delay: var(--landing-delay, var(--delay, 0s));
}

.landing-animations-ready .landing-reveal.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.landing-path-grid .landing-reveal:nth-child(2),
.landing-feature-grid .landing-reveal:nth-child(2),
.landing-price-grid .landing-reveal:nth-child(2),
.landing-proof-grid .landing-reveal:nth-child(2) {
    --landing-delay: 0.08s;
}

.landing-path-grid .landing-reveal:nth-child(3),
.landing-feature-grid .landing-reveal:nth-child(3),
.landing-price-grid .landing-reveal:nth-child(3),
.landing-proof-grid .landing-reveal:nth-child(3) {
    --landing-delay: 0.16s;
}

.landing-path-grid .landing-reveal:nth-child(4),
.landing-feature-grid .landing-reveal:nth-child(4) {
    --landing-delay: 0.24s;
}

.cta-band {
    background: var(--teal);
    color: #fff;
    padding: 5rem 4rem;
    text-align: center;
}

.cta-band .eyebrow {
    color: var(--gold-light);
    justify-content: center;
}

.cta-band .eyebrow::before {
    background: var(--gold-light);
}

.cta-band .sec-title {
    color: #fff;
    text-align: center;
    margin: 0 auto 1rem;
}

.cta-band .sec-sub {
    color: rgba(255, 255, 255, 0.75);
    text-align: center;
    margin: 0 auto 2.2rem;
}

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

.btn-white {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    background: #fff;
    color: var(--teal);
    padding: 0.85rem 2rem;
    border-radius: 3px;
    font-size: 0.92rem;
    font-weight: 600;
    letter-spacing: 0.03em;
    border: none;
    cursor: pointer;
    transition: all 0.25s;
}

.btn-white:hover {
    background: var(--gold-light);
    transform: translateY(-2px);
}

footer.mf {
    background: #080808;
    color: rgba(245, 240, 232, 0.55);
    padding: 3.5rem 4rem 2rem;
}

.foot-grid {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr;
    gap: 3rem;
    padding-bottom: 2.5rem;
    border-bottom: 1px solid rgba(245, 240, 232, 0.1);
    margin-bottom: 1.5rem;
}

.foot-brand .nav-logo {
    color: var(--cream);
    display: inline-flex;
    margin-bottom: 0.9rem;
}

.footer-logo-mark {
    width: 56px;
    height: 56px;
    background: rgba(255, 255, 255, 0.96);
}

.footer-logo-wordmark strong {
    color: var(--cream);
}

.footer-logo-wordmark small {
    color: rgba(245, 240, 232, 0.55);
}

.foot-brand p {
    font-size: 0.85rem;
    line-height: 1.7;
    max-width: 270px;
}

.foot-col h4 {
    font-family: "Space Mono", monospace;
    font-size: 0.67rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--cream);
    margin-bottom: 1.1rem;
}

.foot-col ul {
    list-style: none;
}

.foot-col ul li {
    margin-bottom: 0.5rem;
}

.foot-col ul li a {
    font-size: 0.85rem;
    color: rgba(245, 240, 232, 0.45);
    transition: color 0.2s;
}

.foot-col ul li a:hover {
    color: var(--teal-light);
}

.foot-btm {
    display: flex;
    justify-content: space-between;
    font-size: 0.8rem;
    flex-wrap: wrap;
    gap: 1rem;
}

.foot-btm a {
    color: var(--teal-light);
}

@media (max-width: 1120px) {
    .landing-hero {
        grid-template-columns: 1fr;
        min-height: auto;
    }

    .auth-page .auth-revamp-grid,
    .auth-page .auth-revamp-grid-wide {
        grid-template-columns: 1fr;
    }

    .auth-page .auth-revamp-copy {
        max-width: 760px;
    }

    .auth-page .auth-revamp-card {
        max-width: 760px;
        width: 100%;
    }

    .landing-hero-visual {
        min-height: 360px;
        max-width: 620px;
        width: 100%;
    }

    .landing-preview-card {
        margin-left: 0;
    }

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

    .landing-school-card,
    .landing-proof-section,
    .landing-catalog-hero,
    .landing-detail-hero,
    .landing-detail-grid,
    .landing-pricing-hero,
    .landing-school-pricing-card,
    .landing-about-hero,
    .landing-about-purpose,
    .landing-about-school-card,
    .landing-contact-hero,
    .landing-contact-layout,
    .landing-mobile-lab-hero,
    .landing-mobile-lab-benefit-panel,
    .landing-mobile-lab-readiness-card,
    .landing-assessment-card {
        grid-template-columns: 1fr;
    }

    .landing-about-pillars-grid,
    .landing-about-audience-grid,
    .landing-contact-path-grid,
    .landing-mobile-lab-step-grid,
    .landing-mobile-lab-service-grid,
    .landing-pricing-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .landing-school-actions {
        justify-content: flex-start;
    }
}

@media (max-width: 760px) {
    .auth-page .auth-revamp-section {
        padding: 7rem 1rem 2.5rem;
    }

    .auth-page .auth-revamp-copy h1 {
        font-size: clamp(2.35rem, 13vw, 3.65rem);
    }

    .auth-page .auth-workspace-strip,
    .auth-page .role-picker,
    .auth-page .field-row {
        grid-template-columns: 1fr;
    }

    .auth-page .auth-code-card {
        align-items: start;
    }

    .auth-page .auth-code-card > i:last-child {
        display: none;
    }

    .auth-page .auth-revamp-card {
        padding: 1.1rem;
        border-radius: 24px;
    }

    .auth-page .inline-between {
        align-items: flex-start;
        gap: 0.75rem;
    }

    .landing-hero,
    .landing-section {
        padding-inline: 1rem;
    }

    .landing-hero {
        padding-top: 6.25rem;
        gap: 1.6rem;
    }

    .landing-pricing-hero {
        padding: 6.25rem 1rem 2.5rem;
    }

    .landing-about-hero {
        padding: 6.25rem 1rem 2.5rem;
    }

    .landing-contact-hero {
        padding: 6.25rem 1rem 2.5rem;
    }

    .landing-mobile-lab-hero {
        padding: 6.25rem 1rem 2.5rem;
    }

    .landing-hero h1 {
        font-size: clamp(2.25rem, 12vw, 3.25rem);
        line-height: 1.02;
    }

    .landing-about-copy h1,
    .landing-contact-copy h1,
    .landing-mobile-lab-copy h1,
    .landing-pricing-copy h1 {
        font-size: clamp(2.1rem, 10.5vw, 3.05rem);
        line-height: 1.04;
    }

    .landing-catalog-hero {
        padding: 6.25rem 1rem 2.5rem;
    }

    .landing-catalog-copy h1 {
        font-size: clamp(2.1rem, 10.5vw, 3.05rem);
        line-height: 1.04;
    }

    .landing-detail-hero {
        padding: 6.25rem 1rem 2.5rem;
    }

    .landing-detail-copy h1 {
        font-size: clamp(2.1rem, 10.5vw, 3.05rem);
        line-height: 1.04;
    }

    .landing-action-row .btn,
    .landing-school-actions .btn,
    .landing-pricing-copy .btn,
    .landing-about-copy .btn,
    .landing-contact-copy .btn,
    .landing-mobile-lab-copy .btn,
    .landing-mobile-lab-cta-card .btn,
    .landing-contact-form .btn,
    .landing-center-action .btn {
        width: 100%;
        justify-content: center;
    }

    .landing-hero-visual {
        min-height: 0;
    }

    .landing-floating-card {
        position: static;
        margin-top: 0.8rem;
        min-width: 0;
    }

    .landing-floating-card-two {
        display: none;
    }

    .landing-path-grid,
    .landing-feature-grid,
    .landing-price-grid,
    .home-access-preview-grid,
    .landing-pricing-grid,
    .landing-about-pillars-grid,
    .landing-about-audience-grid,
    .landing-contact-path-grid,
    .landing-contact-fields.two,
    .landing-mobile-lab-step-grid,
    .landing-mobile-lab-service-grid,
    .landing-compare-grid,
    .landing-compare-values,
    .landing-faq-grid,
    .landing-proof-grid,
    .public-course-grid.landing-course-grid,
    .landing-catalog-grid,
    .landing-detail-benefits {
        grid-template-columns: 1fr;
    }

    .landing-course-filter {
        border-radius: 20px;
        padding: 0.85rem;
    }

    .landing-filter-group {
        flex-wrap: nowrap;
        overflow-x: auto;
        padding-bottom: 0.2rem;
        scrollbar-width: none;
    }

    .landing-filter-group::-webkit-scrollbar {
        display: none;
    }

    .landing-filter-group .pill,
    .landing-filter-group .access-tab-button {
        flex: 0 0 auto;
    }

    .landing-catalog-section .courses-results-head {
        align-items: stretch;
        flex-direction: column;
    }

    .landing-path-card,
    .landing-feature-card {
        min-height: 0;
    }

    .landing-section-head {
        margin-bottom: 1.3rem;
    }

    .landing-section-head h2,
    .landing-proof-copy h2,
    .landing-school-card h2 {
        font-size: clamp(1.9rem, 10vw, 2.65rem);
    }

    .landing-preview-card,
    .landing-school-card,
    .landing-price-card,
    .landing-pricing-choice-card,
    .landing-pricing-card,
    .landing-school-pricing-card,
    .landing-compare-panel,
    .landing-about-story-card,
    .landing-about-purpose-card,
    .landing-about-mini-card,
    .landing-about-pillar-card,
    .landing-about-audience-card,
    .landing-about-school-card,
    .landing-about-cta-card,
    .landing-contact-response-card,
    .landing-contact-path-card,
    .landing-contact-form-card,
    .landing-contact-side-card,
    .landing-mobile-lab-card,
    .landing-mobile-lab-step-card,
    .landing-mobile-lab-service-card,
    .landing-mobile-lab-benefit-panel,
    .landing-mobile-lab-readiness-card,
    .landing-mobile-lab-cta-card,
    .landing-path-card,
    .landing-feature-card,
    .landing-proof-card {
        border-radius: 20px;
    }

    .landing-contact-form-head {
        flex-direction: column;
    }

    .landing-contact-form-head > span {
        width: 100%;
        justify-content: center;
        white-space: normal;
    }

    .landing-school-card {
        padding: 1.2rem;
    }

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

    .landing-proof-card span {
        grid-row: auto;
    }

    .landing-detail-meta {
        grid-template-columns: 1fr;
    }

    .landing-module-head {
        flex-direction: column;
    }

    .landing-lesson-row {
        grid-template-columns: auto auto minmax(0, 1fr);
    }

    .landing-lesson-row > i {
        display: none;
    }

    .landing-assessment-card .landing-school-actions .btn {
        width: 100%;
    }
}

@media (prefers-reduced-motion: reduce) {
    .landing-orb,
    .landing-floating-card,
    .landing-preview-status > span,
    .landing-hero-visual .landing-progress-track span,
    .landing-hero-visual .landing-preview-step {
        animation: none !important;
    }

    .landing-animations-ready .landing-hero-visual .landing-progress-track span {
        transform: none !important;
    }

    .landing-animations-ready .landing-hero-visual .landing-preview-step {
        opacity: 1 !important;
        transform: none !important;
    }

    .landing-animations-ready .landing-reveal {
        opacity: 1;
        transform: none;
        transition: none;
    }
}

@media (max-width: 480px) {
    .landing-preview-topline {
        align-items: flex-start;
        flex-direction: column;
        gap: 0.7rem;
    }

    .landing-preview-intro {
        margin-top: 1.15rem;
    }

    .landing-preview-step {
        grid-template-columns: 2.4rem minmax(0, 1fr);
    }

    .landing-preview-step-icon {
        width: 2.4rem;
        height: 2.4rem;
    }

    .landing-preview-step-state {
        grid-column: 2;
        justify-self: start;
    }
}

/* BECE assessment-course discovery and permanent-access journey */
.assessment-course-page,
.assessment-course-hero,
.assessment-course-body {
    --assessment-ink: #092f38;
    --assessment-teal: #147c79;
    --assessment-gold: #d7a821;
}

.assessment-course-hero {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1.55fr) minmax(280px, 0.75fr);
    gap: clamp(1.5rem, 4vw, 4rem);
    align-items: center;
    width: min(1180px, calc(100% - 2rem));
    margin: 1.25rem auto 0;
    padding: clamp(1.5rem, 4vw, 4rem);
    overflow: hidden;
    border: 1px solid rgba(20, 124, 121, 0.18);
    border-radius: 32px;
    background:
        radial-gradient(circle at 85% 10%, rgba(215, 168, 33, 0.18), transparent 27%),
        linear-gradient(135deg, #f6fbfa 0%, #fffaf0 100%);
    box-shadow: 0 24px 70px rgba(9, 47, 56, 0.09);
}

.assessment-course-hero-copy h1 {
    max-width: 16ch;
    margin: 0.65rem 0 1rem;
    color: var(--assessment-ink);
    font-size: clamp(2.6rem, 6vw, 5.6rem);
    line-height: 0.96;
}

.assessment-course-hero-copy .lead { max-width: 66ch; }

.assessment-course-hero-facts {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.65rem;
    margin-top: 1.6rem;
}

.assessment-course-hero-facts span {
    display: grid;
    gap: 0.25rem;
    min-width: 0;
    padding: 0.85rem;
    border: 1px solid rgba(9, 47, 56, 0.1);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.74);
}

.assessment-course-hero-facts small {
    color: #617176;
    font: 700 0.64rem/1.2 var(--font-mono);
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.assessment-course-hero-facts strong { color: var(--assessment-ink); }

.assessment-course-hero-card {
    padding: clamp(1.25rem, 3vw, 2rem);
    border-radius: 24px;
    color: #fff;
    background: linear-gradient(155deg, #0b4d53, #092f38);
    box-shadow: 0 20px 40px rgba(9, 47, 56, 0.22);
}

.assessment-course-hero-card h2 { margin: 0.4rem 0 0.7rem; color: #fff; }
.assessment-course-hero-card p { color: rgba(255, 255, 255, 0.78); }
.assessment-course-hero-card .eyebrow-inline { color: #f3cf69; }

.assessment-course-mark {
    display: grid;
    width: 58px;
    height: 58px;
    margin-bottom: 1.2rem;
    place-items: center;
    border-radius: 18px;
    color: #082f37;
    background: #f3cf69;
    font-size: 1.5rem;
}

.assessment-course-readiness { display: grid; grid-template-columns: 1fr auto; gap: 0.55rem; margin-top: 1.25rem; }
.assessment-course-readiness .progress-bar { grid-column: 1 / -1; background: rgba(255, 255, 255, 0.2); }
.assessment-course-readiness .progress-bar span { background: #f3cf69; }

.assessment-course-body {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(290px, 360px);
    gap: 1.25rem;
    align-items: start;
    width: min(1180px, calc(100% - 2rem));
    margin: 1.25rem auto 4rem;
}

.assessment-course-main { display: grid; gap: 1.25rem; min-width: 0; }
.assessment-course-overview { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 1rem; align-items: end; }
.assessment-course-overview h2 { margin: 0.35rem 0 0.55rem; }

.assessment-course-overview-stats { display: flex; flex-wrap: wrap; gap: 0.55rem; }
.assessment-course-overview-stats span { display: grid; min-width: 92px; padding: 0.7rem 0.85rem; border-radius: 14px; background: #edf6f4; color: #496468; font-size: 0.78rem; }
.assessment-course-overview-stats strong { color: var(--assessment-teal); font-size: 1.05rem; }

.assessment-course-paper-section,
.assessment-course-access-card {
    padding: clamp(1rem, 2vw, 1.5rem);
    border: 1px solid rgba(9, 47, 56, 0.11);
    border-radius: 24px;
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 16px 38px rgba(9, 47, 56, 0.07);
}

.assessment-course-paper-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.85rem; margin-top: 1rem; }
.assessment-course-paper-card { display: grid; gap: 0.85rem; min-width: 0; padding: 1.1rem; border: 1px solid #dce9e7; border-radius: 18px; background: linear-gradient(155deg, #fff, #f7fbfa); }
.assessment-course-paper-card h3 { margin: 0; color: var(--assessment-ink); }
.assessment-course-paper-card > p { margin: 0; }
.assessment-course-paper-head { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; }
.assessment-course-paper-icon { display: grid; width: 42px; height: 42px; place-items: center; border-radius: 13px; color: var(--assessment-teal); background: #dff0ed; }
.assessment-course-paper-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.45rem; margin: 0; }
.assessment-course-paper-facts div { padding: 0.65rem; border-radius: 12px; background: #f0f4f3; }
.assessment-course-paper-facts dt { color: #6a797b; font-size: 0.68rem; text-transform: uppercase; }
.assessment-course-paper-facts dd { margin: 0.2rem 0 0; color: var(--assessment-ink); font-weight: 800; }
.assessment-course-paper-lock { display: flex; gap: 0.45rem; align-items: center; color: #6c7677; font-size: 0.8rem; }

.tutor-assessment-paper-tree-block {
    display: grid;
    gap: 0.85rem;
    margin-top: 1.25rem;
    padding-top: 1.25rem;
    border-top: 1px solid rgba(15, 23, 35, 0.1);
}

.tutor-assessment-paper-tree-block > .panel-head {
    margin: 0;
}

.tutor-assessment-paper-tree {
    max-height: min(68vh, 44rem);
}

.tutor-assessment-paper-tree-empty {
    margin: 0;
}

.assessment-paper-tree-head {
    align-items: end;
}

.assessment-paper-tree-head p:last-child {
    max-width: 62ch;
    margin: 0.3rem 0 0;
}

.assessment-course-paper-tree {
    max-height: min(68vh, 44rem);
    margin-top: 1rem;
    overflow: auto;
    overscroll-behavior-x: contain;
    overscroll-behavior-y: auto;
}

.assessment-course-paper-tree > .admin-structure-tree-list {
    min-width: min(100%, 34rem);
}

.assessment-course-paper-tree .admin-structure-tree-action {
    color: var(--assessment-teal);
}

.assessment-course-paper-section > .assessment-course-paper-lock {
    margin: 0.85rem 0 0;
    padding: 0.75rem 0.85rem;
    border-radius: 12px;
    background: #f5f3ed;
}

.assessment-course-access-card { position: sticky; top: calc(var(--header-height, 80px) + 1rem); display: grid; gap: 0.85rem; }
.assessment-course-access-card h2 { margin: 0; }
.assessment-course-access-card form { display: grid; }
.assessment-course-access-assurances { display: grid; gap: 0.7rem; padding-top: 1rem; border-top: 1px solid #e1e8e7; }
.assessment-course-access-assurances span { display: flex; gap: 0.65rem; align-items: flex-start; color: #38565a; font-size: 0.85rem; }
.assessment-course-access-assurances i { width: 1rem; margin-top: 0.15rem; color: var(--assessment-teal); text-align: center; }
.assessment-course-disclaimer { padding: 0.75rem; border-radius: 12px; color: #6f654c; background: #fff8e6; font-size: 0.75rem; }

@media (max-width: 950px) {
    .assessment-course-hero,
    .assessment-course-body { grid-template-columns: 1fr; }
    .assessment-course-access-card { position: static; }
}

@media (max-width: 700px) {
    .assessment-course-hero { width: calc(100% - 1rem); margin-top: 0.5rem; padding: 1.15rem; border-radius: 22px; }
    .assessment-course-hero-copy h1 { font-size: clamp(2.25rem, 13vw, 3.75rem); }
    .assessment-course-hero-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .assessment-course-body { width: calc(100% - 1rem); }
    .assessment-course-overview { grid-template-columns: 1fr; }
    .assessment-course-paper-grid { grid-template-columns: 1fr; }
    .assessment-course-paper-tree { max-height: none; padding: 0.65rem; }
}

@media (max-width: 420px) {
    .assessment-course-hero-facts,
    .assessment-course-paper-facts { grid-template-columns: 1fr; }
}

/* Keep the homepage preview support cards in the layout flow so they never cover course content. */
@media (min-width: 761px) {
    .landing-home .landing-hero-visual {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        align-content: center;
        column-gap: 0.85rem;
        row-gap: 2rem;
        min-width: 0;
    }

    .landing-home .landing-preview-card {
        grid-column: 1 / -1;
        width: min(100%, 500px);
        margin-inline: auto;
    }

    .landing-home .landing-floating-card,
    .landing-home .landing-floating-card-one,
    .landing-home .landing-floating-card-two {
        position: static;
        display: grid;
        grid-template-columns: auto minmax(0, 1fr);
        column-gap: 0.7rem;
        row-gap: 0.1rem;
        min-width: 0;
        margin: 0;
        padding: 0.8rem 0.9rem;
        animation: landingFloat 7.5s ease-in-out infinite;
    }

    .landing-home .landing-floating-card i {
        grid-row: 1 / span 2;
        width: 2rem;
        height: 2rem;
    }

    .landing-home .landing-floating-card strong,
    .landing-home .landing-floating-card span {
        grid-column: 2;
        min-width: 0;
    }

    .landing-home .landing-floating-card span {
        font-size: 0.74rem;
        line-height: 1.35;
    }

    .landing-home .landing-floating-card-two {
        animation-delay: -2.6s;
    }
}

/* Public landing polish pass: scoped so workspace dashboards keep their own rules. */
.landing-page {
    overflow-x: hidden;
}

.landing-page main {
    overflow-x: clip;
}

.landing-transition-ready.landing-page main,
.landing-transition-ready.landing-page .top-nav,
.landing-transition-ready.landing-page footer.mf {
    transition: opacity 0.18s ease, transform 0.18s ease, filter 0.18s ease;
}

.landing-is-leaving.landing-page main {
    opacity: 0;
    transform: translateY(8px);
    filter: blur(2px);
}

.landing-is-leaving.landing-page .top-nav,
.landing-is-leaving.landing-page footer.mf {
    opacity: 0.72;
}

.landing-page .top-nav {
    transition: background 0.24s ease, border-color 0.24s ease, box-shadow 0.24s ease;
}

.landing-page .nav-links a {
    min-height: 38px;
    padding: 0.45rem 0.1rem;
    border-radius: 999px;
}

.landing-page .nav-links a.active,
.landing-page .nav-links a:focus-visible,
.landing-page .nav-links a:hover {
    color: var(--teal);
}

.landing-page .nav-links a:focus-visible,
.landing-page .nav-auth a:focus-visible,
.landing-page .mobile-nav-toggle:focus-visible,
.landing-page .btn:focus-visible {
    outline: 3px solid rgba(201, 168, 76, 0.42);
    outline-offset: 3px;
}

.landing-page .mobile-nav-toggle {
    align-items: center;
    gap: 0.45rem;
    min-height: 42px;
    border-radius: 999px;
    font-weight: 800;
    color: var(--teal);
    transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.landing-page .mobile-nav-toggle:hover {
    border-color: rgba(26, 107, 107, 0.28);
    box-shadow: 0 10px 24px rgba(26, 107, 107, 0.08);
}

.landing-page .btn,
.landing-page .button,
.landing-page .btn-white {
    max-width: 100%;
    white-space: normal;
}

.landing-page .btn:active,
.landing-page .button:active,
.landing-page .btn-white:active,
.landing-page .landing-path-card:active,
.landing-page .landing-contact-path-card:active {
    transform: translateY(1px) scale(0.985);
}

.landing-page .btn:disabled,
.landing-page .button:disabled,
.landing-page [aria-busy="true"] {
    cursor: wait;
    opacity: 0.72;
}

.landing-page .landing-path-card:focus-visible,
.landing-page .landing-contact-path-card:focus-visible,
.landing-page .landing-contact-channel-mini a:focus-visible,
.landing-page .landing-contact-channel-list a:focus-visible,
.landing-page .landing-contact-socials a:focus-visible {
    outline: 3px solid rgba(201, 168, 76, 0.42);
    outline-offset: 3px;
}

.landing-page .landing-section,
.landing-page .landing-hero,
.landing-page .landing-catalog-hero,
.landing-page .landing-detail-hero,
.landing-page .landing-pricing-hero,
.landing-page .landing-about-hero,
.landing-page .landing-contact-hero,
.landing-page .landing-mobile-lab-hero {
    contain: paint;
}

.landing-reveal-fade-up,
.landing-reveal-slide-left,
.landing-reveal-slide-right,
.landing-reveal-soft-scale {
    will-change: opacity, transform;
}

.auth-page .auth-revamp-section {
    position: relative;
    min-height: 100vh;
    padding: clamp(7rem, 10vw, 9rem) clamp(1.25rem, 4vw, 4rem) clamp(3rem, 6vw, 5rem);
    overflow: hidden;
    background:
        radial-gradient(circle at top left, rgba(26, 107, 107, 0.1), transparent 32%),
        radial-gradient(circle at bottom right, rgba(232, 201, 122, 0.16), transparent 34%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(245, 240, 232, 0.82));
}

.auth-page .auth-revamp-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, 0.92fr) minmax(360px, 0.78fr);
    gap: clamp(1.5rem, 4vw, 3rem);
    align-items: center;
}

.auth-page .auth-revamp-grid-wide {
    grid-template-columns: minmax(0, 0.76fr) minmax(480px, 1fr);
}

.auth-page .auth-revamp-copy {
    display: grid;
    gap: 1.1rem;
    align-content: center;
}

.auth-page .auth-revamp-copy h1 {
    max-width: 760px;
    margin: 0;
    font-size: clamp(2.75rem, 6vw, 5.25rem);
    line-height: 0.98;
}

.auth-page .auth-revamp-copy > p:not(.eyebrow) {
    max-width: 680px;
    color: var(--mid);
    font-size: clamp(1rem, 1.4vw, 1.15rem);
    line-height: 1.78;
}

.auth-page .auth-workspace-strip {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem;
    margin-top: 0.3rem;
}

.auth-page .auth-workspace-strip article,
.auth-page .auth-role-preview-list article,
.auth-page .auth-code-card,
.auth-page .auth-revamp-card {
    border: 1px solid rgba(13, 13, 13, 0.08);
    background: rgba(255, 255, 255, 0.88);
    box-shadow: 0 22px 54px rgba(13, 13, 13, 0.08);
}

.auth-page .auth-workspace-strip article {
    display: grid;
    gap: 0.35rem;
    padding: 1rem;
    border-radius: 20px;
}

.auth-page .auth-workspace-strip span {
    color: var(--teal);
    font-family: "Space Mono", monospace;
    font-size: 0.65rem;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.auth-page .auth-code-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0.85rem;
    align-items: center;
    max-width: 620px;
    padding: 1rem;
    border-radius: 22px;
    color: var(--ink);
    text-decoration: none;
    transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.auth-page .auth-code-card:hover,
.auth-page .auth-code-card:focus-visible {
    transform: translateY(-3px);
    border-color: rgba(26, 107, 107, 0.24);
    box-shadow: 0 24px 54px rgba(13, 13, 13, 0.1);
}

.auth-page .auth-code-card > i:first-child,
.auth-page .auth-role-preview-list i {
    display: inline-grid;
    place-items: center;
    width: 2.8rem;
    height: 2.8rem;
    border-radius: 999px;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
}

.auth-page .auth-code-card small,
.auth-page .auth-role-preview-list small {
    display: block;
    margin-top: 0.18rem;
    color: var(--mid);
    line-height: 1.5;
}

.auth-page .auth-role-preview-list {
    display: grid;
    gap: 0.85rem;
    max-width: 680px;
}

.auth-page .auth-role-preview-list article {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.85rem;
    align-items: start;
    padding: 1rem;
    border-radius: 20px;
}

.auth-register-page .auth-register-signins {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.7rem;
}

.auth-register-page .auth-register-signin-card {
    min-width: 0;
    max-width: none;
    min-height: 4.6rem;
    padding: 0.8rem;
    border-radius: 18px;
}

.auth-register-page .auth-register-signin-card strong {
    display: block;
}

.auth-register-page .auth-register-signin-card small {
    margin-top: 0;
}

.auth-register-page .auth-register-signin-card > i:last-child {
    color: var(--teal);
    font-size: 0.78rem;
}

.auth-register-page .auth-register-school-link {
    max-width: none;
}

.auth-page .auth-revamp-card {
    border-radius: 30px;
    padding: clamp(1.25rem, 3vw, 2rem);
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.08), transparent 34%),
        rgba(255, 255, 255, 0.94);
}

.auth-page .auth-card-head {
    display: grid;
    gap: 0.35rem;
    margin-bottom: 1.3rem;
}

.auth-page .auth-card-head h2 {
    margin: 0;
    font-size: clamp(1.9rem, 4vw, 3rem);
    line-height: 1.04;
}

.auth-page .auth-verification-email {
    overflow-wrap: anywhere;
    word-break: break-word;
}

.auth-page .auth-card-head p:not(.eyebrow-inline) {
    margin: 0;
    color: var(--mid);
}

.auth-page .auth-revamp-form {
    gap: 1rem;
}

.auth-page .auth-revamp-form label {
    color: var(--ink);
    font-weight: 800;
}

.auth-page .auth-revamp-form input,
.auth-page .auth-revamp-form select,
.auth-page .auth-revamp-form textarea {
    width: 100%;
    border: 1px solid rgba(13, 13, 13, 0.12);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.82);
    padding: 0.95rem 1rem;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.auth-page .auth-revamp-form input:focus,
.auth-page .auth-revamp-form select:focus,
.auth-page .auth-revamp-form textarea:focus {
    border-color: rgba(26, 107, 107, 0.5);
    background: #fff;
    box-shadow: 0 0 0 4px rgba(26, 107, 107, 0.1);
    outline: none;
}

.auth-page .auth-revamp-form .small-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.9rem;
    flex-wrap: wrap;
}

.auth-page .auth-revamp-form .checkbox {
    display: inline-flex;
    align-items: center;
    gap: 0.48rem;
    margin: 0;
    color: var(--ink);
    line-height: 1.2;
}

.auth-page .auth-revamp-form .checkbox input[type="checkbox"] {
    width: 1rem;
    height: 1rem;
    min-width: 1rem;
    margin: 0;
    padding: 0;
    border-radius: 4px;
    accent-color: var(--teal);
}

.auth-page .auth-revamp-form .small-row .text-link {
    line-height: 1.2;
}

.auth-page .auth-submit-button {
    width: 100%;
    justify-content: center;
    min-height: 3.15rem;
    border-radius: 16px;
}

.auth-page .auth-card-links {
    display: grid;
    gap: 0.4rem;
    margin-top: 1.1rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(13, 13, 13, 0.08);
}

.auth-page .auth-card-links .helper-text {
    margin: 0;
    color: var(--mid);
}

.auth-page .auth-verification-grid {
    grid-template-columns: minmax(0, 0.9fr) minmax(360px, 0.78fr);
}

.auth-page .auth-verification-card {
    display: grid;
    gap: 1rem;
}

.auth-page .auth-verification-notice {
    margin: 0;
    border-radius: 16px;
    border-color: rgba(194, 91, 66, 0.28);
    background: rgba(255, 244, 240, 0.9);
}

.auth-page .auth-verification-notice p {
    margin: 0;
    line-height: 1.6;
}

.auth-page .auth-verification-safeguards {
    max-width: none;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.auth-page .auth-verification-safeguards article {
    height: 100%;
}

.auth-page .auth-verification-actions {
    padding-top: 0.25rem;
    border-top: 1px solid rgba(13, 13, 13, 0.08);
}

.auth-page .role-picker {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.65rem;
}

.auth-page .role-option {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    min-width: 0;
    min-height: 3.7rem;
    padding: 0.45rem;
    border-radius: 16px;
    border: 1px solid rgba(13, 13, 13, 0.1);
    background: rgba(255, 255, 255, 0.8);
    color: var(--ink);
    font-size: 0.78rem;
    font-weight: 900;
    line-height: 1.2;
    text-align: left;
    cursor: pointer;
    transition: transform 0.2s ease, border-color 0.2s ease, background 0.2s ease, color 0.2s ease;
}

.auth-page .role-option > i {
    display: grid;
    flex: 0 0 1.9rem;
    width: 1.9rem;
    height: 1.9rem;
    place-items: center;
    border-radius: 9px;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
}

.auth-page .role-option > span {
    min-width: 0;
}

.auth-page .role-option:hover,
.auth-page .role-option:focus-visible {
    transform: translateY(-2px);
    border-color: rgba(26, 107, 107, 0.26);
}

.auth-page .role-option.active {
    border-color: rgba(26, 107, 107, 0.4);
    background: linear-gradient(135deg, rgba(26, 107, 107, 0.98), rgba(43, 129, 129, 0.92));
    color: #fff;
}

.auth-page .role-option.active > i {
    background: rgba(255, 255, 255, 0.18);
    color: #fff;
}

@media (max-width: 760px) {
    .auth-page .auth-revamp-section {
        min-height: auto;
        padding: 6.25rem 1rem 2.25rem;
        overflow: visible;
    }

    .auth-page .auth-revamp-grid,
    .auth-page .auth-revamp-grid-wide {
        grid-template-columns: minmax(0, 1fr);
        gap: 1rem;
        width: 100%;
        max-width: 440px;
        margin-inline: auto;
        align-items: start;
    }

    .auth-register-page .auth-revamp-card {
        order: -1;
    }

    .auth-register-page .auth-register-signins {
        gap: 0.55rem;
    }

    .auth-register-page .auth-register-signin-card {
        min-height: 3.9rem;
        padding: 0.65rem;
    }

    .auth-register-page .auth-register-signin-card > i:first-child {
        width: 2.25rem;
        height: 2.25rem;
    }

    .auth-register-page .role-picker {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .auth-page .auth-revamp-copy {
        gap: 0.82rem;
        max-width: 100%;
    }

    .auth-page .auth-revamp-copy h1 {
        max-width: 100%;
        font-size: clamp(2rem, 10vw, 2.7rem);
        line-height: 1.04;
    }

    .auth-page .auth-revamp-copy > p:not(.eyebrow) {
        max-width: 100%;
        font-size: 0.94rem;
        line-height: 1.62;
    }

    .auth-page .auth-workspace-strip {
        display: none;
    }

    .auth-page .auth-verification-safeguards {
        grid-template-columns: minmax(0, 1fr);
    }

    .auth-page .auth-revamp-card {
        width: 100%;
        max-width: 100%;
        padding: 1rem;
        border-radius: 24px;
    }

    .auth-page .auth-card-head {
        margin-bottom: 1rem;
    }

    .auth-page .auth-card-head h2 {
        font-size: clamp(1.55rem, 8vw, 2.15rem);
    }

    .auth-page .auth-revamp-form {
        gap: 0.85rem;
    }

    .auth-page .auth-revamp-form input,
    .auth-page .auth-revamp-form select,
    .auth-page .auth-revamp-form textarea {
        min-height: 3rem;
        padding: 0.85rem 0.9rem;
        border-radius: 14px;
    }

    .auth-page .auth-revamp-form .small-row {
        align-items: center;
        gap: 0.65rem;
    }

    .auth-page .auth-submit-button {
        min-height: 3rem;
    }

    .auth-page .auth-card-links {
        margin-top: 0.9rem;
        padding-top: 0.9rem;
    }

    .auth-page .auth-code-card {
        grid-template-columns: auto minmax(0, 1fr);
        max-width: 100%;
        padding: 0.9rem;
        border-radius: 20px;
    }

    .auth-page .auth-code-card > i:last-child {
        display: none;
    }
}

@media (max-width: 380px) {
    .auth-page .auth-revamp-section {
        padding-inline: 0.75rem;
    }

    .auth-page .auth-revamp-copy h1 {
        font-size: clamp(1.82rem, 9.5vw, 2.35rem);
    }

    .auth-page .auth-revamp-copy > p:not(.eyebrow) {
        font-size: 0.9rem;
    }

    .auth-page .auth-revamp-form .small-row {
        display: grid;
        justify-content: stretch;
    }

    .auth-register-page .auth-register-signins {
        grid-template-columns: minmax(0, 1fr);
    }
}

.landing-animations-ready .landing-reveal-slide-left {
    transform: translateX(-28px);
}

.landing-animations-ready .landing-reveal-slide-right {
    transform: translateX(28px);
}

.landing-animations-ready .landing-reveal-soft-scale {
    transform: translateY(18px) scale(0.975);
}

.landing-animations-ready .landing-reveal.is-visible,
.landing-animations-ready .landing-reveal-slide-left.is-visible,
.landing-animations-ready .landing-reveal-slide-right.is-visible,
.landing-animations-ready .landing-reveal-soft-scale.is-visible {
    transform: none;
}

.landing-stagger > .landing-reveal:nth-child(2),
.landing-stagger > *:nth-child(2) .landing-reveal {
    --landing-delay: 80ms;
}

.landing-stagger > .landing-reveal:nth-child(3),
.landing-stagger > *:nth-child(3) .landing-reveal {
    --landing-delay: 160ms;
}

.landing-stagger > .landing-reveal:nth-child(4),
.landing-stagger > *:nth-child(4) .landing-reveal {
    --landing-delay: 240ms;
}

.landing-stagger > .landing-reveal:nth-child(n + 5),
.landing-stagger > *:nth-child(n + 5) .landing-reveal {
    --landing-delay: 320ms;
}

@media (max-width: 900px) {
    .landing-page .top-nav {
        padding: 0.75rem 1rem;
        align-items: center;
        gap: 0.8rem;
    }

    .landing-page .nav-logo-mark {
        width: 44px;
        height: 44px;
    }

    .landing-page .nav-logo-wordmark strong {
        font-size: 1rem;
    }

    .landing-page .nav-logo-wordmark small {
        font-size: 0.56rem;
    }
}

@media (max-width: 760px) {
    .landing-page .top-nav {
        left: 0.75rem;
        right: 0.75rem;
        top: 0.75rem;
        width: auto;
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        border: 1px solid rgba(13, 13, 13, 0.08);
        border-radius: 22px;
        background:
            radial-gradient(circle at top left, rgba(232, 244, 244, 0.88), transparent 42%),
            rgba(255, 255, 255, 0.96);
        box-shadow: 0 18px 44px rgba(13, 13, 13, 0.11);
        overflow: hidden;
    }

    .landing-page .nav-links:not(.open),
    .landing-page .nav-auth:not(.open) {
        display: none;
    }

    .landing-page .nav-links.open,
    .landing-page .nav-auth.open {
        grid-column: 1 / -1;
        display: grid;
        width: 100%;
        gap: 0.35rem;
        padding: 0.55rem 0.2rem 0;
        border-radius: 0;
        background: transparent;
    }

    .landing-page .nav-auth.open {
        margin-top: 0;
        padding-top: 0.55rem;
        border-top: 1px solid rgba(13, 13, 13, 0.08);
    }

    .landing-page .nav-links.open a,
    .landing-page .nav-auth.open a {
        width: 100%;
        min-height: 2.85rem;
        padding: 0.75rem 0.85rem;
        border-radius: 16px;
        justify-content: flex-start;
        background: rgba(255, 255, 255, 0.66);
        color: var(--ink);
        font-weight: 800;
    }

    .landing-page .nav-links.open a:hover,
    .landing-page .nav-links.open a:focus-visible,
    .landing-page .nav-auth.open a:hover,
    .landing-page .nav-auth.open a:focus-visible {
        background: rgba(232, 244, 244, 0.92);
        color: var(--teal);
        transform: none;
    }

    .landing-page .nav-auth.open .nav-auth-link.is-primary {
        background: rgba(26, 107, 107, 0.1);
        color: var(--teal);
    }

    .landing-page .nav-auth.open .nav-auth-link.is-primary:hover,
    .landing-page .nav-auth.open .nav-auth-link.is-primary:focus-visible {
        background: rgba(232, 201, 122, 0.2);
        color: var(--ink);
    }

    .landing-page .mobile-nav-toggle-label {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        border: 0;
    }

    .landing-page .landing-hero,
    .landing-page .landing-catalog-hero,
    .landing-page .landing-detail-hero,
    .landing-page .landing-pricing-hero,
    .landing-page .landing-about-hero,
    .landing-page .landing-contact-hero,
    .landing-page .landing-mobile-lab-hero {
        padding-top: 7rem;
    }

    .landing-page .landing-section-head {
        gap: 0.55rem;
    }

    .landing-page .landing-section-head p {
        max-width: 100%;
    }

    .landing-page .landing-action-row {
        width: 100%;
    }

    .landing-page footer.mf {
        padding: 2.5rem 1rem calc(2rem + env(safe-area-inset-bottom, 0px));
    }

    .landing-page .foot-grid {
        grid-template-columns: 1fr;
        gap: 1.35rem;
        padding-bottom: 1.8rem;
    }

    .landing-page .foot-brand p {
        max-width: none;
    }

    .landing-page .foot-col {
        padding: 1rem;
        border-radius: 18px;
        background: rgba(255, 255, 255, 0.04);
    }

    .landing-page .foot-col h4 {
        margin-bottom: 0.75rem;
    }

    .landing-page .foot-col ul {
        display: grid;
        gap: 0.2rem;
    }

    .landing-page .foot-col ul li {
        margin-bottom: 0;
    }

    .landing-page .foot-col ul li a {
        min-height: 38px;
        display: flex;
        align-items: center;
    }

    .landing-page .foot-btm {
        padding: 0;
        align-items: flex-start;
    }
}

@media (max-width: 420px) {
    .landing-page .nav-logo-wordmark {
        display: grid;
        min-width: 0;
    }

    .landing-page .nav-logo {
        gap: 0.45rem;
        min-width: 0;
    }

    .landing-page .nav-logo-mark {
        width: 36px;
        height: 36px;
        flex: 0 0 36px;
    }

    .landing-page .nav-logo-wordmark strong {
        font-size: clamp(0.72rem, 3.2vw, 0.88rem);
        line-height: 1.05;
        white-space: nowrap;
    }

    .landing-page .nav-logo-wordmark small {
        font-size: 0.5rem;
        letter-spacing: 0.08em;
        line-height: 1;
        text-transform: uppercase;
        white-space: nowrap;
    }

    .landing-page .mobile-nav-toggle {
        padding-inline: 0.72rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .landing-reveal,
    .landing-reveal-fade-up,
    .landing-reveal-slide-left,
    .landing-reveal-slide-right,
    .landing-reveal-soft-scale,
    .landing-page .top-nav,
    .landing-page .mobile-nav-toggle,
    .landing-page .mobile-nav-toggle::after {
        transition: none !important;
        animation: none !important;
        transform: none !important;
    }
}

@media (max-width: 900px) {
    .top-nav {
        padding: 1rem 1.5rem;
    }

    .nav-links {
        display: none;
    }

    .nav-logo img {
        width: 100%;
    }

    .nav-logo-mark {
        width: 44px;
        height: 44px;
    }

    .nav-logo-wordmark strong {
        font-size: 0.98rem;
    }

    .nav-logo-wordmark small {
        font-size: 0.56rem;
    }

    section.ms,
    .hero,
    footer.mf,
    .cta-band {
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }

    section.ms,
    .hero {
        padding-top: 4rem;
        padding-bottom: 4rem;
    }

    .hero {
        grid-template-columns: 1fr;
        padding-top: 5.5rem;
    }

    .hero-visual {
        display: none;
    }

    .home-mobile-lab-shell,
    .feat-grid,
    .courses-grid,
    .public-course-grid,
    .pricing-grid,
    .role-focus-grid,
    .trust-signal-grid,
    .about-pillars-grid,
    .pricing-school-highlight-grid,
    .discovery-strip,
    .pricing-faq-grid,
    .pricing-school-layout {
        grid-template-columns: 1fr;
    }

    .contact-response-note {
        min-width: 0;
        width: 100%;
    }

    .mobile-lab-hero-grid,
    .mobile-lab-readiness-layout,
    .mobile-lab-step-grid,
    .mobile-lab-service-grid,
    .mobile-lab-benefit-grid,
    .mobile-lab-value-strip,
    .mobile-lab-services-head {
        grid-template-columns: 1fr;
    }

    .mobile-lab-services-line {
        display: none;
    }

    .home-mobile-lab-panel {
        padding: 1.5rem;
    }

    .mobile-lab-value-item {
        border-right: none;
        border-top: 1px solid rgba(18, 61, 150, 0.15);
        padding-top: 1rem;
    }

    .pricing-school-hero {
        flex-direction: column;
    }

    .pricing-school-badge {
        white-space: normal;
    }

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

    .school-compare-row {
        grid-template-columns: 1fr;
    }

    .school-compare-cell + .school-compare-cell,
    .school-compare-head > div + div {
        border-left: none;
        border-top: 1px solid var(--border);
    }

    .pricing-compare-shell {
        border: none;
        background: transparent;
    }

    .pricing-compare-head {
        display: none;
    }

    .pricing-compare-row {
        grid-template-columns: 1fr;
        gap: 0;
        border: 1px solid var(--border);
        background: var(--card);
        margin-bottom: 1rem;
    }

    .pricing-compare-feature {
        background: rgba(26, 107, 107, 0.06);
    }

    .pricing-compare-value {
        border-left: none;
        border-top: 1px solid var(--border);
    }

    .foot-grid {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 900px) {
    .ges-builder-context-bar,
    .checkpoint-studio-layout {
        grid-template-columns: 1fr;
    }

    .checkpoint-studio-sidebar-under-video {
        grid-template-columns: 1fr;
    }

    .checkpoint-studio-sidebar-under-video .checkpoint-studio-copy {
        grid-template-columns: 1fr;
    }

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

    .checkpoint-studio-console {
        grid-template-columns: 1fr;
    }

    .checkpoint-current-time-readout {
        justify-self: start;
        text-align: left;
    }

    .checkpoint-studio-workflow-steps {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .lesson-builder-grid,
    .lesson-builder-two-col,
    .lesson-summary-grid,
    .resource-workspace-grid {
        grid-template-columns: 1fr;
    }

    .lesson-builder-section-head {
        display: grid;
    }

    .lesson-thumbnail-studio {
        grid-template-columns: 1fr;
    }

    .lesson-thumbnail-preview,
    .lesson-thumbnail-preview img,
    .lesson-thumbnail-placeholder {
        min-height: 220px;
    }

    .lesson-thumbnail-media-management,
    .lesson-thumbnail-media-card {
        width: 62px;
        height: 44px;
    }

    .lesson-thumbnail-media-feature {
        width: min(100%, 240px);
    }

      .checkpoint-builder-grid,
      .checkpoint-core-grid,
      .checkpoint-options-grid,
      .checkpoint-summary-grid,
      .tutor-course-pulse-grid,
    .ges-library-filter-grid,
    .tutor-course-workflow-grid,
    .tutor-course-assessment-grid,
    .ges-workflow-guide-grid {
        grid-template-columns: 1fr;
    }

      .checkpoint-copy-head,
      .checkpoint-builder-section-head {
          grid-template-columns: 1fr;
          display: grid;
      }

      .learner-assessment-question-topline,
      .learner-assessment-submit-card,
      .learner-assessment-attempt-card {
          display: grid;
      }

      .learner-assessment-question-meta {
          justify-content: flex-start;
      }

      .checkpoint-pill-row {
          justify-content: flex-start;
    }

    .tutor-course-hero,
    .tutor-course-hero-actions {
        display: grid;
    }

    .checkpoint-studio-actions .button {
        width: auto;
        justify-content: center;
    }

    .interactive-video-card {
        padding: 1rem;
    }

    .interactive-video-controls {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.7rem;
    }

    .interactive-video-timeline {
        grid-column: 1 / -1;
    }

    .interactive-video-audio {
        grid-column: 1 / -1;
        grid-template-columns: auto minmax(0, 1fr);
    }

    .ges-readiness-chip-list {
        gap: 0.4rem;
    }

    .video-placeholder-rich {
        min-height: 280px;
    }

    .interactive-video-actions .button {
        width: 100%;
        justify-content: center;
    }

    .learner-assessment-mobile-console {
        top: 0.6rem;
        padding: 0.95rem;
    }

    .learner-assessment-mobile-nav .learner-assessment-nav-button {
        min-height: 46px;
        border-radius: 14px;
        flex-basis: 46px;
    }
}

.admin-structure-tree {
    position: relative;
    padding: 1rem;
    border: 1px solid rgba(26, 107, 107, 0.16);
    border-radius: 1.1rem;
    background:
        radial-gradient(circle at top right, rgba(224, 180, 83, 0.12), transparent 42%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(247, 251, 253, 0.94));
    width: 100%;
    overflow-x: auto;
}

.admin-structure-tree-list {
    list-style: none;
    margin: 0;
    padding-left: 0;
}

.admin-structure-tree-list .admin-structure-tree-list {
    margin-left: 0.7rem;
    padding-left: 0.9rem;
    border-left: 1px solid rgba(26, 107, 107, 0.18);
}

.admin-structure-tree-item {
    position: relative;
    margin: 0.45rem 0;
}

.admin-structure-tree-item.is-current > .admin-structure-tree-node {
    border-color: rgba(26, 107, 107, 0.34);
    box-shadow: 0 10px 24px rgba(10, 19, 28, 0.07);
    background: linear-gradient(145deg, rgba(26, 107, 107, 0.08), rgba(255, 255, 255, 0.98));
}

.admin-structure-tree-item.is-current > .admin-structure-tree-branch > .admin-structure-tree-summary .admin-structure-tree-node {
    border-color: rgba(26, 107, 107, 0.34);
    box-shadow: 0 10px 24px rgba(10, 19, 28, 0.07);
    background: linear-gradient(145deg, rgba(26, 107, 107, 0.08), rgba(255, 255, 255, 0.98));
}

.admin-structure-tree-branch {
    display: grid;
    gap: 0.45rem;
}

.admin-structure-tree-summary {
    list-style: none;
    cursor: pointer;
}

.admin-structure-tree-summary::-webkit-details-marker {
    display: none;
}

.admin-structure-tree-node {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 0.55rem;
    align-items: start;
    padding: 0.72rem 0.78rem;
    border: 1px solid rgba(15, 23, 35, 0.08);
    border-radius: 0.9rem;
    background: rgba(255, 255, 255, 0.94);
    min-width: 0;
}

.admin-structure-tree-icon {
    width: 1.7rem;
    height: 1.7rem;
    display: grid;
    place-items: center;
    border-radius: 999px;
    background: rgba(26, 107, 107, 0.12);
    color: var(--brand);
    font-size: 0.72rem;
}

.admin-structure-tree-copy {
    display: grid;
    gap: 0.16rem;
    min-width: 0;
}

.admin-structure-tree-meta {
    font-size: 0.58rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--muted);
    font-family: var(--mono);
}

.admin-structure-tree-link {
    color: var(--ink);
    font-weight: 700;
    text-decoration: none;
    font-size: 0.88rem;
    line-height: 1.3;
}

a.admin-structure-tree-link:hover,
a.admin-structure-tree-link:focus-visible {
    color: var(--brand);
}

.admin-structure-tree-detail {
    color: var(--muted);
    font-size: 0.74rem;
    line-height: 1.35;
}

.admin-structure-tree-lock {
    width: 2rem;
    height: 2rem;
    display: inline-grid;
    place-items: center;
    align-self: center;
    flex: 0 0 auto;
    border: 1px solid rgba(118, 95, 36, 0.12);
    border-radius: 999px;
    font-size: 0.72rem;
}

.admin-structure-tree-item.is-locked .admin-structure-tree-detail {
    color: #655c4f;
}

.admin-structure-tree-links {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin-top: 0.3rem;
}

.admin-structure-tree-action {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    min-height: 1.75rem;
    padding: 0.28rem 0.52rem;
    border-radius: 999px;
    border: 1px solid rgba(26, 107, 107, 0.16);
    background: rgba(26, 107, 107, 0.07);
    color: var(--brand);
    font-size: 0.68rem;
    font-weight: 800;
    text-decoration: none;
    transition: transform 0.18s ease, background 0.18s ease, border-color 0.18s ease;
}

.admin-structure-tree-action:hover,
.admin-structure-tree-action:focus-visible {
    transform: translateY(-1px);
    border-color: rgba(26, 107, 107, 0.32);
    background: rgba(26, 107, 107, 0.13);
}

.admin-structure-tree-toggle {
    width: 1.45rem;
    height: 1.45rem;
    display: inline-grid;
    place-items: center;
    border-radius: 999px;
    background: rgba(26, 107, 107, 0.08);
    color: var(--teal);
    font-size: 0.72rem;
    transition: transform 0.2s ease, background 0.2s ease;
}

.admin-structure-tree-branch[open] > .admin-structure-tree-summary .admin-structure-tree-toggle {
    transform: rotate(0deg);
}

.admin-structure-tree-branch:not([open]) > .admin-structure-tree-summary .admin-structure-tree-toggle {
    transform: rotate(-90deg);
}

.admin-structure-tree-summary:hover .admin-structure-tree-toggle,
.admin-structure-tree-summary:focus-visible .admin-structure-tree-toggle {
    background: rgba(26, 107, 107, 0.14);
}

.admin-structure-tree-item.is-branch > .admin-structure-tree-branch > .admin-structure-tree-summary .admin-structure-tree-node {
    background: linear-gradient(180deg, rgba(244, 249, 250, 0.96), rgba(255, 255, 255, 0.94));
}

.admin-structure-tree-item.is-leaf > .admin-structure-tree-node {
    background: rgba(255, 255, 255, 0.82);
}

.admin-manager-shell {
    display: grid;
    gap: 1rem;
}

.admin-manager-breadcrumbs {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.45rem;
    font-family: var(--mono);
    font-size: 0.78rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--muted);
}

.admin-manager-breadcrumbs a {
    color: var(--brand);
    text-decoration: none;
}

.admin-manager-breadcrumbs strong {
    color: var(--ink);
}

.admin-manager-hero {
    position: relative;
    overflow: hidden;
}

.admin-manager-hero::after {
    content: "";
    position: absolute;
    inset: auto -2rem -3rem auto;
    width: 12rem;
    height: 12rem;
    border-radius: 999px;
    background: radial-gradient(circle, rgba(224, 180, 83, 0.18), transparent 68%);
    pointer-events: none;
}

.admin-manager-guidance-panel,
.admin-manager-library-panel,
.admin-manager-overview-panel,
.admin-manager-tree-panel {
    position: relative;
    overflow: hidden;
}

.admin-manager-side-grid {
    grid-template-columns: minmax(0, 1.45fr) minmax(260px, 0.55fr);
    align-items: start;
    margin-top: 1rem;
}

.admin-manager-tree-detail-grid {
    grid-template-columns: 1fr;
}

.admin-manager-tree-detail-grid .admin-manager-actions-panel {
    padding-top: 1rem;
}

.admin-manager-tree-detail-grid .admin-manager-action-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.admin-readiness-checklist-panel {
    border-color: rgba(201, 168, 76, 0.18);
    background:
        radial-gradient(circle at top right, rgba(224, 180, 83, 0.1), transparent 32%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(251, 248, 241, 0.92));
}

.admin-readiness-checklist-panel.is-ready {
    border-color: rgba(26, 107, 107, 0.18);
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.08), transparent 32%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(239, 248, 247, 0.92));
}

.admin-readiness-check-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.85rem;
}

.admin-readiness-check-card {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    min-height: 8rem;
    padding: 0.9rem;
    border-radius: 18px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.84);
}

.admin-readiness-check-card.is-ready {
    border-color: rgba(26, 107, 107, 0.16);
    background: rgba(236, 245, 244, 0.82);
}

.admin-readiness-check-card.is-pending {
    border-color: rgba(201, 168, 76, 0.24);
    background: rgba(252, 249, 241, 0.86);
}

.admin-readiness-check-icon {
    width: 2.35rem;
    height: 2.35rem;
    border-radius: 15px;
    display: inline-grid;
    place-items: center;
    flex-shrink: 0;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
}

.admin-readiness-check-card.is-pending .admin-readiness-check-icon {
    background: rgba(224, 180, 83, 0.16);
    color: #7a5a0a;
}

.admin-readiness-check-card > div {
    display: grid;
    gap: 0.25rem;
}

.admin-readiness-check-card strong {
    font-size: 1.12rem;
    color: var(--ink);
}

.admin-readiness-check-card span:not(.admin-readiness-check-icon) {
    color: var(--mid);
    line-height: 1.45;
}

.admin-manager-action-list,
.admin-manager-relationship-list {
    display: grid;
    gap: 0.9rem;
}

.admin-manager-action-card {
    display: grid;
    gap: 0.45rem;
    padding: 1rem 1.05rem;
    border-radius: 16px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.95), rgba(248, 245, 239, 0.93));
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.05);
}

.admin-manager-action-card h3,
.admin-manager-relationship-row h3 {
    margin: 0;
}

.admin-manager-action-card p,
.admin-manager-relationship-row p {
    margin: 0;
    color: var(--mid);
    line-height: 1.6;
}

.admin-manager-relationship-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.05rem;
    border-radius: 16px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.95), rgba(248, 245, 239, 0.93));
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.05);
}

.admin-manager-relationship-copy {
    display: flex;
    align-items: flex-start;
    gap: 0.85rem;
    min-width: 0;
}

.admin-manager-relationship-copy > div {
    display: grid;
    gap: 0.2rem;
}

.admin-manager-relationship-icon {
    width: 2.45rem;
    height: 2.45rem;
    border-radius: 16px;
    display: inline-grid;
    place-items: center;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
    flex-shrink: 0;
}

.admin-manager-guidance-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.9rem;
}

.admin-manager-card {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(247, 251, 253, 0.92));
}

.admin-manager-filter-shell {
    display: grid;
    gap: 0.95rem;
    margin: 1rem 0 1.35rem;
    padding: 1rem 1.05rem;
    border-radius: 16px;
    border: 1px solid var(--border);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(248, 245, 239, 0.9));
}

.admin-manager-filter-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.9rem;
    align-items: end;
}

.admin-manager-filter-grid.has-search {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.admin-manager-search-field {
    grid-column: 1 / -1;
}

.admin-manager-filter-actions {
    flex-wrap: nowrap;
    align-items: center;
}

.admin-manager-filter-actions .button {
    white-space: nowrap;
}

.dashboard-filter-note {
    margin: -0.2rem 0 1rem;
    color: var(--mid);
    line-height: 1.65;
}

.admin-manager-library-list {
    display: grid;
    gap: 0.95rem;
}

.admin-manager-library-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0.9rem;
    align-items: stretch;
    padding: 1rem 1.05rem 1rem 1.2rem;
    border-radius: 18px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-left: 5px solid rgba(26, 107, 107, 0.42);
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.06), transparent 34%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(247, 251, 253, 0.92));
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.05);
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.admin-manager-library-row:nth-child(even) {
    background:
        radial-gradient(circle at top right, rgba(224, 180, 83, 0.08), transparent 34%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(251, 248, 241, 0.94));
}

.admin-manager-library-row.needs-attention {
    border-color: rgba(201, 168, 76, 0.26);
    border-left-color: rgba(201, 168, 76, 0.78);
}

.admin-manager-library-row.tone-success {
    border-left-color: rgba(26, 107, 107, 0.74);
}

.admin-manager-library-row.tone-ink {
    border-left-color: rgba(15, 23, 42, 0.22);
}

.admin-manager-library-row:hover,
.admin-manager-library-row:focus-within {
    transform: translateY(-1px);
    box-shadow: 0 18px 34px rgba(15, 23, 42, 0.08);
}

.admin-manager-library-main {
    display: flex;
    align-items: flex-start;
    gap: 0.9rem;
    min-width: 0;
}

.admin-manager-library-icon {
    width: 2.7rem;
    height: 2.7rem;
    border-radius: 16px;
    display: inline-grid;
    place-items: center;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
    flex-shrink: 0;
}

.admin-manager-library-copy {
    display: grid;
    flex: 1 1 auto;
    gap: 0.25rem;
    width: 100%;
    min-width: 0;
}

.admin-manager-library-copy h3 {
    margin: 0;
}

.admin-manager-library-copy p:last-child {
    margin: 0;
    color: var(--mid);
    line-height: 1.6;
}

.admin-manager-health-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    margin-top: 0.35rem;
}

.curriculum-health-badge {
    display: inline-flex;
    align-items: center;
    min-height: 1.65rem;
    padding: 0.34rem 0.58rem;
    border-radius: 999px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: rgba(241, 245, 249, 0.82);
    color: var(--ink);
    font-family: var(--mono);
    font-size: 0.62rem;
    letter-spacing: 0.1em;
    line-height: 1;
    text-transform: uppercase;
    white-space: nowrap;
}

.curriculum-health-badge.tone-success {
    border-color: rgba(26, 107, 107, 0.18);
    background: rgba(26, 107, 107, 0.11);
    color: var(--teal);
}

.curriculum-health-badge.tone-warning,
.curriculum-health-badge.tone-draft {
    border-color: rgba(224, 180, 83, 0.28);
    background: rgba(224, 180, 83, 0.15);
    color: #7a5a0a;
}

.curriculum-health-badge.tone-empty,
.curriculum-health-badge.tone-setup {
    border-color: rgba(15, 23, 42, 0.1);
    background: rgba(15, 23, 42, 0.06);
    color: var(--muted);
}

.admin-manager-library-footer {
    display: grid;
    grid-template-columns: minmax(260px, 0.72fr) minmax(0, 1.28fr);
    gap: 1rem;
    align-items: center;
    padding-left: 3.6rem;
}

.admin-manager-library-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
}

.admin-manager-library-stat {
    display: grid;
    gap: 0.2rem;
    padding: 0.75rem 0.8rem;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.8);
    border: 1px solid rgba(15, 23, 42, 0.07);
}

.admin-manager-library-stat span {
    font-family: "Space Mono", monospace;
    font-size: 0.62rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--teal);
}

.admin-manager-library-stat strong {
    font-size: 0.98rem;
    color: var(--ink);
}

.admin-manager-library-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.65rem;
}

.admin-manager-library-actions .button {
    min-width: 0;
}

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

.admin-empty-state {
    display: grid;
    justify-items: start;
    gap: 0.8rem;
    padding: 1.25rem;
    border: 1px dashed rgba(26, 107, 107, 0.28);
    border-radius: 1.1rem;
    background: rgba(255, 255, 255, 0.72);
}

.admin-empty-state.compact {
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
}

.admin-empty-state i {
    width: 2.7rem;
    height: 2.7rem;
    display: grid;
    place-items: center;
    border-radius: 999px;
    background: rgba(26, 107, 107, 0.12);
    color: var(--brand);
}

.admin-empty-copy {
    display: grid;
    gap: 0.28rem;
}

.admin-empty-copy h3,
.admin-empty-copy p {
    margin: 0;
}

.admin-empty-copy p {
    color: var(--mid);
    line-height: 1.6;
}

.admin-empty-actions {
    margin-top: 0.1rem;
}

.admin-builder-stage-bar {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    margin-bottom: 1rem;
}

.admin-builder-stage-bar span {
    padding: 0.5rem 0.85rem;
    border-radius: 999px;
    border: 1px solid rgba(26, 107, 107, 0.14);
    background: rgba(26, 107, 107, 0.06);
    color: var(--ink);
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    font-family: var(--mono);
}

.admin-builder-stage-bar span.is-active {
    background: rgba(224, 180, 83, 0.14);
    border-color: rgba(224, 180, 83, 0.3);
}

@media (max-width: 900px) {
    .admin-manager-guidance-grid {
        grid-template-columns: 1fr;
    }

    .admin-manager-filter-grid,
    .admin-manager-library-row,
    .admin-manager-library-footer {
        grid-template-columns: 1fr;
    }

    .admin-manager-library-footer {
        padding-left: 3.6rem;
    }

    .admin-manager-search-field {
        grid-column: auto;
    }

    .admin-manager-filter-actions {
        flex-wrap: wrap;
    }

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

    .admin-empty-state.compact {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .admin-empty-state.compact .admin-empty-actions {
        grid-column: 1 / -1;
    }

    .admin-manager-library-stats {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .admin-ges-review-checks {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .admin-manager-library-actions {
        justify-content: flex-start;
    }

    .panel-head-actions {
        width: 100%;
        justify-content: flex-start;
    }

    .admin-structure-tree {
        padding: 0.85rem;
    }

    .admin-structure-tree-list .admin-structure-tree-list {
        margin-left: 0.7rem;
        padding-left: 0.8rem;
    }

    .admin-structure-tree-node {
        padding: 0.8rem;
    }
}

@media (max-width: 700px) {
    .commercial-lane-head {
        flex-direction: column;
    }

    .commercial-lane-metrics {
        grid-template-columns: 1fr;
    }

    .commercial-lane-card .button-row .button {
        flex: 1 1 100%;
    }

    .admin-manager-library-stats {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .admin-manager-library-footer {
        padding-left: 0;
    }

    .admin-manager-library-stat {
        padding: 0.7rem 0.55rem;
    }

    .admin-manager-library-actions .button {
        flex: 1 1 min(100%, 10.5rem);
    }

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

    .admin-row-detail-disclosure.admin-verification-review-disclosure > summary {
        grid-template-columns: auto minmax(0, 1fr) auto;
    }

    .admin-verification-review-hint {
        display: none;
    }

    .admin-verification-review-panel .field-row {
        grid-template-columns: 1fr;
    }

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

    .admin-manager-tree-detail-grid .admin-manager-action-list {
        grid-template-columns: 1fr;
    }

    .admin-school-access-card-grid {
        grid-template-columns: 1fr;
    }

    .admin-ges-review-heading,
    .admin-ges-review-main {
        flex-direction: column;
    }

    .admin-ges-review-checks {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .admin-ges-review-actions,
    .admin-ges-decision-form {
        align-items: stretch;
    }

    .admin-ges-review-actions .button,
    .admin-ges-decision-form .button {
        flex: 1 1 100%;
    }
}

.student-library-filter-panel,
.student-library-panel {
    display: grid;
    gap: 1rem;
}

.student-library-filter-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.85rem;
}

.student-library-filter-row .text-link.active {
    color: var(--brand-700);
    font-weight: 700;
}

.student-library-list {
    display: grid;
    gap: 1rem;
}

.student-library-item {
    display: grid;
    gap: 0.9rem;
    align-items: start;
}

.student-library-item-shell {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.95rem;
    align-items: start;
    padding: 1.2rem 1.25rem;
    border: 1px solid rgba(15, 76, 92, 0.12);
    border-radius: 24px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(245, 249, 249, 0.92));
    box-shadow: 0 20px 36px rgba(15, 23, 42, 0.06);
    transition: transform 0.24s ease, box-shadow 0.26s ease, border-color 0.22s ease, background-color 0.22s ease;
}

.student-library-item-shell:active {
    transform: scale(0.994);
}

.student-library-item-main {
    display: grid;
    gap: 0.85rem;
    min-width: 0;
}

.student-library-item-teal {
    border-color: rgba(26, 107, 107, 0.16);
}

.student-library-item-gold,
.student-library-item-steady {
    border-color: rgba(201, 168, 76, 0.18);
}

.student-library-item-watch {
    border-color: rgba(116, 90, 31, 0.18);
}

.student-library-item-success {
    border-color: rgba(72, 146, 89, 0.22);
}

.student-library-item-warning {
    border-color: rgba(192, 94, 58, 0.22);
}

.student-library-item-title-row {
    display: flex;
    justify-content: space-between;
    align-items: start;
    gap: 0.85rem;
}

.student-library-title-block {
    display: grid;
    gap: 0.55rem;
    min-width: 0;
}

.student-library-item-title-row h3 {
    margin: 0;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.student-library-item-kicker-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.55rem;
}

.student-library-summary-line {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    align-items: center;
}

.student-library-result-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.5rem 0.78rem;
    border-radius: 999px;
    background: rgba(230, 241, 241, 0.94);
    color: var(--teal);
    font-size: 0.76rem;
    font-weight: 700;
    white-space: nowrap;
}

.student-library-status-pill {
    display: inline-flex;
    align-items: center;
    gap: 0.42rem;
    padding: 0.46rem 0.72rem;
    border-radius: 999px;
    border: 1px solid rgba(15, 76, 92, 0.12);
    background: rgba(255, 255, 255, 0.94);
    color: var(--ink);
    font-size: 0.74rem;
    font-weight: 700;
}

.student-library-status-pill i {
    font-size: 0.48rem;
}

.student-library-status-pill.tone-success {
    border-color: rgba(72, 146, 89, 0.22);
    background: rgba(245, 252, 246, 0.95);
    color: #2f6d40;
}

.student-library-status-pill.tone-watch {
    border-color: rgba(201, 168, 76, 0.24);
    background: rgba(255, 251, 241, 0.96);
    color: #8d6e19;
}

.student-library-status-pill.tone-warning {
    border-color: rgba(192, 94, 58, 0.2);
    background: rgba(255, 245, 241, 0.96);
    color: #9a4524;
}

.student-library-status-pill.tone-steady,
.student-library-status-pill.tone-teal {
    border-color: rgba(15, 76, 92, 0.14);
    background: rgba(241, 248, 247, 0.96);
    color: var(--teal);
}

.student-library-metric-row {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.85rem;
}

.student-library-metric-pill {
    padding: 0.78rem 0.88rem;
    border: 1px solid rgba(15, 76, 92, 0.08);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.82);
}

.student-library-metric-pill span {
    display: block;
    margin-bottom: 0.25rem;
    color: var(--brand-700);
    font-size: 0.67rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.student-library-metric-pill strong {
    font-size: 0.96rem;
}

.student-library-meta-inline {
    display: flex;
    flex-wrap: wrap;
    gap: 0.85rem 1rem;
    color: var(--mid);
    font-size: 0.84rem;
}

.student-library-meta-inline span {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.student-library-action-row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 0.8rem;
    padding-top: 0.9rem;
    border-top: 1px solid rgba(15, 76, 92, 0.08);
}

.student-library-action-row .button {
    width: 100%;
    justify-content: center;
}

.student-empty-state {
    padding: 1.2rem;
    border: 1px dashed rgba(15, 76, 92, 0.2);
    border-radius: 22px;
    background: rgba(241, 248, 247, 0.72);
}

.student-empty-state strong,
.student-empty-state p {
    display: block;
}

.student-empty-state p {
    margin: 0.45rem 0 0;
}

.app-shell.has-student-mobile-nav .course-hero-copy {
    padding: 1.45rem 1.55rem;
    border-radius: 24px;
    background:
        radial-gradient(circle at top right, rgba(201, 168, 76, 0.24), transparent 34%),
        linear-gradient(135deg, rgba(18, 102, 105, 0.98), rgba(46, 158, 158, 0.96));
    box-shadow: 0 18px 42px rgba(26, 107, 107, 0.16);
    color: #fff;
}

.app-shell.has-student-mobile-nav .course-hero-copy .eyebrow,
.app-shell.has-student-mobile-nav .course-hero-copy h1 {
    color: #fff;
}

.app-shell.has-student-mobile-nav .course-hero-copy .eyebrow {
    color: var(--gold-light);
}

.app-shell.has-student-mobile-nav .course-hero-copy .lead {
    color: rgba(255, 255, 255, 0.84);
}

.app-shell.has-student-mobile-nav .course-hero-card {
    border: 1px solid rgba(15, 76, 92, 0.1);
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.08), transparent 34%),
        linear-gradient(180deg, rgba(244, 250, 249, 0.98), rgba(255, 255, 255, 0.94));
    box-shadow: 0 18px 34px rgba(15, 23, 42, 0.08);
}

.app-shell.has-student-mobile-nav .dashboard-intro,
.app-shell.has-student-mobile-nav .student-hero-band,
.app-shell.has-student-mobile-nav .assessment-result-band,
.app-shell.has-student-mobile-nav .course-hero-card,
.app-shell.has-student-mobile-nav .content-panel,
.app-shell.has-student-mobile-nav .student-library-item-shell,
.app-shell.has-student-mobile-nav .certificate-card,
.app-shell.has-student-mobile-nav .student-course-card,
.app-shell.has-student-mobile-nav .student-quick-card,
.app-shell.has-student-mobile-nav .lesson-journey-card,
.app-shell.has-student-mobile-nav .student-secondary-item,
.app-shell.has-student-mobile-nav .student-timeline-item {
    animation: studentSurfaceIn 0.3s ease both;
}

.app-shell.has-student-mobile-nav .student-pulse-grid > *:nth-child(1),
.app-shell.has-student-mobile-nav .student-stat-grid > *:nth-child(1),
.app-shell.has-student-mobile-nav .student-library-list > *:nth-child(1) {
    animation-delay: 0.02s;
}

.app-shell.has-student-mobile-nav .student-pulse-grid > *:nth-child(2),
.app-shell.has-student-mobile-nav .student-stat-grid > *:nth-child(2),
.app-shell.has-student-mobile-nav .student-library-list > *:nth-child(2) {
    animation-delay: 0.05s;
}

.app-shell.has-student-mobile-nav .student-pulse-grid > *:nth-child(3),
.app-shell.has-student-mobile-nav .student-stat-grid > *:nth-child(3),
.app-shell.has-student-mobile-nav .student-library-list > *:nth-child(3) {
    animation-delay: 0.08s;
}

.app-shell.has-student-mobile-nav .student-pulse-grid > *:nth-child(4),
.app-shell.has-student-mobile-nav .student-stat-grid > *:nth-child(4),
.app-shell.has-student-mobile-nav .student-library-list > *:nth-child(4) {
    animation-delay: 0.11s;
}

@media (hover: hover) and (pointer: fine) {
    .app-shell.has-student-mobile-nav .content-panel:hover,
    .app-shell.has-student-mobile-nav .student-library-item-shell:hover,
    .app-shell.has-student-mobile-nav .student-course-card:hover,
    .app-shell.has-student-mobile-nav .student-secondary-item:hover,
    .app-shell.has-student-mobile-nav .student-timeline-item:hover,
    .app-shell.has-student-mobile-nav .lesson-journey-card:hover {
        transform: translateY(-2px);
        box-shadow: 0 18px 34px rgba(15, 23, 42, 0.09);
    }
}

.student-profile-grid {
    align-items: stretch;
}

.student-profile-overview-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(360px, 0.85fr);
    gap: 1rem;
    align-items: stretch;
}

.student-profile-overview-grid > .content-panel {
    height: 100%;
}

.student-profile-identity-panel {
    align-content: start;
}

.student-profile-identity-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.student-profile-hub-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(280px, 0.8fr);
    gap: 1rem;
    align-items: start;
}

.student-profile-main,
.student-profile-side {
    display: grid;
    gap: 1rem;
}

.student-profile-side {
    align-self: stretch;
}

.student-profile-shortcuts-panel,
.student-profile-details-panel,
.student-profile-notification-panel,
.student-profile-activity-panel {
    height: auto;
}

.student-profile-activity-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr);
    gap: 1rem;
    align-items: start;
}

.student-profile-activity-panel .student-activity-list {
    margin: 0;
    padding: 0;
}

.student-profile-activity-panel .student-activity-list li {
    gap: 0.3rem;
}

.student-profile-activity-panel .student-activity-list .text-link {
    margin-top: 0.1rem;
}

.student-profile-notes {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 0.9rem;
}

.student-profile-details-panel .student-profile-notes {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.student-profile-details-panel .student-focus-mini-card {
    min-width: 0;
}

.student-profile-details-panel .student-focus-mini-card strong {
    overflow-wrap: anywhere;
    word-break: break-word;
}

.student-profile-subject-progress-panel {
    display: grid;
    gap: 1rem;
    background:
        radial-gradient(circle at 100% 0%, rgba(201, 168, 76, 0.12), transparent 32%),
        linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(243, 250, 249, 0.96));
}

.student-profile-progress-head {
    align-items: center;
}

.student-profile-progress-head h3 {
    margin: 0.2rem 0 0.25rem;
}

.student-profile-progress-head p {
    margin: 0;
    color: var(--mid);
}

.student-profile-progress-total {
    display: grid;
    justify-items: end;
    gap: 0.1rem;
    min-width: 5rem;
}

.student-profile-progress-total strong {
    font-family: var(--font-display);
    font-size: clamp(1.8rem, 3vw, 2.6rem);
    line-height: 1;
    color: var(--teal);
}

.student-profile-progress-total span {
    font-family: "Space Mono", monospace;
    font-size: 0.62rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--mid);
}

.student-profile-subject-progress-list {
    display: grid;
    gap: 0.75rem;
}

.student-profile-subject-progress-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 0.9rem;
    padding: 0.9rem 1rem;
    border: 1px solid rgba(26, 107, 107, 0.14);
    border-radius: 17px;
    background: rgba(255, 255, 255, 0.82);
}

.student-profile-subject-icon {
    display: grid;
    place-items: center;
    width: 2.7rem;
    height: 2.7rem;
    border-radius: 14px;
    color: var(--teal);
    background: rgba(26, 107, 107, 0.1);
}

.student-profile-subject-copy {
    display: grid;
    gap: 0.55rem;
    min-width: 0;
}

.student-profile-subject-copy > div {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.8rem;
}

.student-profile-subject-copy span {
    color: var(--mid);
    font-size: 0.82rem;
}

.student-profile-subject-copy .curriculum-row-progress {
    max-width: none;
}

.student-profile-subject-percent {
    min-width: 3.4rem;
    text-align: right;
    font-family: var(--font-display);
    font-size: 1.3rem;
}

.student-profile-activity-grid > :only-child {
    grid-column: 1 / -1;
}

.student-profile-exit-panel {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.student-profile-exit-copy {
    display: grid;
    gap: 0.35rem;
}

.student-profile-exit-copy h3,
.student-profile-exit-copy p {
    margin: 0;
}

.student-profile-exit-copy > p:last-child {
    color: var(--mid);
}

.student-profile-logout-button {
    flex: 0 0 auto;
}

@media (max-width: 900px) {
    .student-notification-preview-list {
        grid-template-columns: 1fr;
    }

    .student-notification-preview-item {
        align-items: stretch;
        flex-direction: column;
    }

    .student-notification-preview-item .text-link {
        align-self: flex-start;
    }

    .student-hero-band {
        flex-direction: column;
        align-items: stretch;
        min-width: 0;
        overflow: hidden;
    }

    .student-hero-copy {
        max-width: none;
    }

    .app-shell.has-student-mobile-nav .sidebar,
    .app-shell.has-student-mobile-nav .app-sidebar-toggle {
        display: none;
    }

    .app-shell.has-student-mobile-nav .app-header-main {
        width: 100%;
    }

    body.interactive-video-page .app-shell.has-student-mobile-nav:not(.has-guardian-mobile-nav) .app-header {
        display: none;
    }

    .app-shell.has-student-mobile-nav .app-main,
    .app-shell.has-student-mobile-nav.sidebar-collapsed .app-main {
        margin-left: 0;
        width: 100%;
    }

    .app-shell.has-student-mobile-nav .app-content {
        padding-bottom: calc(6.7rem + env(safe-area-inset-bottom, 0px));
    }

    .app-shell.has-workspace-mobile-nav {
        --workspace-mobile-nav-clearance: calc(6.5rem + env(safe-area-inset-bottom, 0px));
    }

    .app-shell.has-student-mobile-nav .lesson-player-shell {
        gap: 0.9rem;
    }

    .app-shell.has-student-mobile-nav .lesson-hero-band {
        display: grid;
        padding: 1rem;
        gap: 0.85rem;
    }

    .app-shell.has-student-mobile-nav .lesson-layout,
    .app-shell.has-student-mobile-nav .interactive-lesson-layout,
    .app-shell.has-student-mobile-nav .lesson-layout-revamp {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        grid-template-columns: minmax(0, 1fr);
        overflow-x: hidden;
    }

    .app-shell.has-student-mobile-nav .lesson-player,
    .app-shell.has-student-mobile-nav .lesson-video-showcase,
    .app-shell.has-student-mobile-nav .interactive-video-stage {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        overflow-x: hidden;
    }

    .app-shell.has-student-mobile-nav .lesson-side {
        display: grid;
        width: 100%;
        max-width: 100%;
    }

    .app-shell.has-student-mobile-nav .lesson-course-tree-panel {
        display: grid;
        scroll-margin-top: 1rem;
    }

    .app-shell.has-student-mobile-nav .lesson-sequence-tree {
        max-height: none;
        overflow-x: clip;
        overflow-y: visible;
        overscroll-behavior-y: auto;
        touch-action: pan-y;
        -webkit-overflow-scrolling: touch;
    }

    .app-shell.has-student-mobile-nav .student-curriculum-tree-panel,
    .app-shell.has-student-mobile-nav .student-curriculum-tree {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    .app-shell.has-student-mobile-nav .student-curriculum-tree {
        max-height: none;
        overflow-x: clip;
        overflow-y: visible;
        overscroll-behavior-y: auto;
        touch-action: pan-y;
        -webkit-overflow-scrolling: touch;
        padding-right: 0;
        scrollbar-gutter: auto;
    }

    .app-shell.has-student-mobile-nav .student-curriculum-tree .admin-structure-tree-list .admin-structure-tree-list,
    .app-shell.has-student-mobile-nav .lesson-sequence-tree .admin-structure-tree-list .admin-structure-tree-list {
        margin-left: 0.2rem;
        padding-left: 0.42rem;
    }

    .app-shell.has-student-mobile-nav .student-curriculum-tree .admin-structure-tree-node,
    .app-shell.has-student-mobile-nav .lesson-sequence-tree .admin-structure-tree-node {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    .app-shell.has-student-mobile-nav .student-curriculum-tree .admin-structure-tree-link,
    .app-shell.has-student-mobile-nav .student-curriculum-tree .admin-structure-tree-detail,
    .app-shell.has-student-mobile-nav .lesson-sequence-tree .admin-structure-tree-link,
    .app-shell.has-student-mobile-nav .lesson-sequence-tree .admin-structure-tree-detail {
        overflow-wrap: anywhere;
    }

    .app-shell.has-student-mobile-nav .lesson-reading-panel,
    .app-shell.has-student-mobile-nav .lesson-support-grid {
        scroll-margin-top: 1rem;
    }

    .app-shell.has-student-mobile-nav #lesson-resources-panel,
    .app-shell.has-student-mobile-nav #lesson-notes-panel,
    .app-shell.has-student-mobile-nav #lesson-sequence-panel {
        scroll-margin-top: 5rem;
    }

    .app-shell.has-student-mobile-nav .lesson-mobile-tabs {
        position: sticky;
        top: 0.6rem;
        z-index: 18;
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 0.4rem;
        padding: 0.42rem;
        border: 1px solid rgba(26, 107, 107, 0.12);
        border-radius: 18px;
        background: rgba(255, 255, 255, 0.94);
        box-shadow: 0 14px 30px rgba(15, 23, 42, 0.1);
        backdrop-filter: blur(12px);
    }

    .app-shell.has-student-mobile-nav .lesson-mobile-tabs a {
        min-height: 42px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 0.4rem;
        border-radius: 14px;
        color: var(--mid);
        font-size: 0.72rem;
        font-weight: 800;
        text-decoration: none;
    }

    .app-shell.has-student-mobile-nav .lesson-mobile-tabs a:first-child {
        background: rgba(26, 107, 107, 0.12);
        color: var(--teal);
    }

    .app-shell.has-student-mobile-nav .lesson-mobile-next-bar {
        position: sticky;
        bottom: calc(5.95rem + env(safe-area-inset-bottom, 0px));
        z-index: 19;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.75rem;
        padding: 0.72rem;
        border: 1px solid rgba(26, 107, 107, 0.14);
        border-radius: 18px;
        background: rgba(255, 255, 255, 0.96);
        box-shadow: 0 18px 40px rgba(15, 23, 42, 0.14);
        backdrop-filter: blur(14px);
    }

    .app-shell.has-student-mobile-nav .lesson-mobile-next-bar div {
        display: grid;
        gap: 0.1rem;
        min-width: 0;
    }

    .app-shell.has-student-mobile-nav .lesson-mobile-next-bar span:first-child {
        font-family: var(--mono);
        font-size: 0.58rem;
        letter-spacing: 0.14em;
        text-transform: uppercase;
        color: var(--teal);
    }

    .app-shell.has-student-mobile-nav .lesson-mobile-next-bar strong {
        overflow: hidden;
        color: var(--ink);
        font-size: 0.82rem;
        line-height: 1.2;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .app-shell.has-student-mobile-nav .lesson-mobile-next-bar .button {
        flex: 0 0 auto;
        min-width: 5.4rem;
        justify-content: center;
    }

    .app-shell.has-student-mobile-nav .lesson-mobile-next-bar .button-primary {
        background-color: #0f5d5f;
        color: #fff;
    }

    .app-shell.has-student-mobile-nav .lesson-mobile-next-bar .button-primary span,
    .app-shell.has-student-mobile-nav .lesson-mobile-next-bar .button-primary i {
        color: #fff;
    }

    .student-mobile-nav {
        position: fixed;
        left: max(0.85rem, calc(0.5rem + env(safe-area-inset-left, 0px)));
        right: max(0.85rem, calc(0.5rem + env(safe-area-inset-right, 0px)));
        bottom: calc(0.85rem + env(safe-area-inset-bottom, 0px));
        z-index: 48;
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        gap: 0.28rem;
        padding: 0.42rem;
        border: 1px solid rgba(26, 107, 107, 0.14);
        border-radius: 22px;
        background: rgba(255, 255, 255, 0.96);
        box-shadow: 0 18px 40px rgba(15, 23, 42, 0.14);
        backdrop-filter: blur(14px);
        animation: studentNavIn 0.2s ease both;
    }

    .app-shell.has-workspace-mobile-nav .workspace-mobile-nav {
        z-index: 60;
    }

    .student-mobile-nav-item {
        min-height: 54px;
        display: grid;
        gap: 0.2rem;
        place-items: center;
        padding: 0.4rem 0.18rem;
        border-radius: 14px;
        color: var(--mid);
        text-decoration: none;
        font-size: 0.58rem;
        font-weight: 700;
        text-align: center;
        line-height: 1.1;
        transition: background 0.2s ease, color 0.2s ease, transform 0.2s ease;
    }

    .student-mobile-nav-item:focus-visible {
        outline: 3px solid rgba(201, 168, 76, 0.42);
        outline-offset: 2px;
        background: rgba(232, 244, 244, 0.96);
        color: var(--teal);
    }

    .student-mobile-nav-item i {
        font-size: 0.88rem;
    }

    .student-mobile-nav-item span {
        white-space: nowrap;
    }

    .student-mobile-nav-item.active {
        background: linear-gradient(180deg, rgba(26, 107, 107, 0.14), rgba(255, 255, 255, 0.96));
        color: #0b5054;
    }

    .student-mobile-nav-item.is-danger {
        color: #9b3027;
    }

    .student-mobile-nav-item.is-danger:focus-visible,
    .student-mobile-nav-item.is-danger:active {
        background: rgba(212, 90, 76, 0.1);
        color: #8f261f;
    }

    .student-mobile-nav-item.is-disabled {
        opacity: 0.45;
    }

    .student-mobile-nav-item:not(.is-disabled):active {
        transform: translateY(1px) scale(0.98);
    }

    .student-detail-grid,
    .student-summary-shell,
    .student-workspace-grid,
    .student-profile-overview-grid,
    .student-profile-hub-grid,
    .student-profile-activity-grid {
        grid-template-columns: 1fr;
    }

    .student-profile-subject-progress-row {
        grid-template-columns: auto minmax(0, 1fr) auto;
    }

    .student-profile-subject-progress-row > .button {
        grid-column: 2 / -1;
        justify-self: start;
    }

    .student-profile-exit-panel {
        align-items: stretch;
        flex-direction: column;
    }

    .student-profile-logout-button {
        width: 100%;
        justify-content: center;
    }

    .student-course-top,
    .student-context-head,
    .student-secondary-item,
    .student-secondary-meta {
        min-width: 0;
    }

    .student-secondary-copy,
    .student-context-copy,
    .student-subject-scope-copy,
    .student-course-top > div {
        min-width: 0;
    }

    .catalog-learner-band {
        grid-template-columns: 1fr;
        align-items: start;
    }

    .app-shell.has-student-mobile-nav .student-hero-actions,
    .app-shell.has-student-mobile-nav .dashboard-intro .button-row,
    .app-shell.has-student-mobile-nav .course-hero-copy .button-row,
    .app-shell.has-student-mobile-nav .student-primary-actions,
    .app-shell.has-student-mobile-nav .student-course-actions,
    .app-shell.has-student-mobile-nav .lesson-journey-actions,
    .app-shell.has-student-mobile-nav .learner-assessment-result-summary-card .button-row,
    .app-shell.has-student-mobile-nav .certificate-card .button-row {
        width: 100%;
        flex-direction: row;
        flex-wrap: nowrap;
        justify-content: flex-start;
        overflow-x: auto;
        gap: 0.7rem;
        padding-bottom: 0.15rem;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .app-shell.has-student-mobile-nav .student-hero-actions::-webkit-scrollbar,
    .app-shell.has-student-mobile-nav .dashboard-intro .button-row::-webkit-scrollbar,
    .app-shell.has-student-mobile-nav .course-hero-copy .button-row::-webkit-scrollbar,
    .app-shell.has-student-mobile-nav .student-primary-actions::-webkit-scrollbar,
    .app-shell.has-student-mobile-nav .student-course-actions::-webkit-scrollbar,
    .app-shell.has-student-mobile-nav .lesson-journey-actions::-webkit-scrollbar,
    .app-shell.has-student-mobile-nav .learner-assessment-result-summary-card .button-row::-webkit-scrollbar,
    .app-shell.has-student-mobile-nav .certificate-card .button-row::-webkit-scrollbar {
        display: none;
    }

    .app-shell.has-student-mobile-nav .student-hero-actions .button,
    .app-shell.has-student-mobile-nav .dashboard-intro .button-row .button,
    .app-shell.has-student-mobile-nav .course-hero-copy .button-row .button,
    .app-shell.has-student-mobile-nav .student-primary-actions .button,
    .app-shell.has-student-mobile-nav .student-course-actions .button,
    .app-shell.has-student-mobile-nav .lesson-journey-actions .button,
    .app-shell.has-student-mobile-nav .learner-assessment-result-summary-card .button-row .button,
    .app-shell.has-student-mobile-nav .certificate-card .button-row .button {
        width: auto;
        min-width: max-content;
        flex: 0 0 auto;
        justify-content: center;
    }

    .app-shell.has-student-mobile-nav .catalog-learner-actions {
        width: 100%;
        display: grid;
        grid-template-columns: 1fr;
        gap: 0.75rem;
        justify-content: stretch;
        overflow: visible;
        padding-bottom: 0;
    }

    .app-shell.has-student-mobile-nav .catalog-learner-actions .button {
        width: 100%;
        min-width: 0;
        justify-content: center;
    }

    .student-mobile-duplicate-action {
        display: none !important;
    }

    .student-library-item-title-row {
        flex-direction: column;
    }

    .student-library-metric-row,
    .student-profile-notes {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 520px) {
    .student-library-metric-row,
    .student-profile-notes {
        grid-template-columns: 1fr 1fr;
    }

    .student-library-action-row {
        grid-template-columns: 1fr 1fr;
    }

    .student-profile-identity-stats,
    .student-profile-details-panel .student-profile-notes {
        grid-template-columns: 1fr;
    }

    .student-profile-progress-head {
        align-items: flex-start;
    }

    .student-profile-progress-total {
        justify-items: start;
    }

    .student-profile-subject-progress-row {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .student-profile-subject-copy > div {
        display: grid;
        gap: 0.2rem;
    }

    .student-profile-subject-percent {
        grid-column: 1;
        text-align: left;
    }

    .student-profile-subject-progress-row > .button {
        grid-column: 2;
        width: 100%;
    }

    .student-library-meta-inline {
        display: grid;
        gap: 0.45rem;
    }

    .app-shell.has-student-mobile-nav .student-hero-actions .button,
    .app-shell.has-student-mobile-nav .dashboard-intro .button-row .button,
    .app-shell.has-student-mobile-nav .course-hero-copy .button-row .button,
    .app-shell.has-student-mobile-nav .student-primary-actions .button,
    .app-shell.has-student-mobile-nav .student-course-actions .button,
    .app-shell.has-student-mobile-nav .lesson-journey-actions .button,
    .app-shell.has-student-mobile-nav .learner-assessment-result-summary-card .button-row .button,
    .app-shell.has-student-mobile-nav .certificate-card .button-row .button {
        padding: 0.78rem 1rem;
        font-size: 0.78rem;
    }

    .student-library-item {
        gap: 0.75rem;
    }

    .student-library-item-shell {
        padding: 1rem;
    }

    .student-library-result-chip {
        white-space: normal;
    }

    .student-library-summary-line {
        gap: 0.5rem;
    }

    .app-shell.has-student-mobile-nav .app-content {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .app-shell.has-student-mobile-nav .dashboard-intro,
    .app-shell.has-student-mobile-nav .student-hero-band,
    .app-shell.has-student-mobile-nav .assessment-result-band,
    .app-shell.has-student-mobile-nav .content-panel,
    .app-shell.has-student-mobile-nav .certificate-card,
    .app-shell.has-student-mobile-nav .student-library-item-shell {
        border-radius: 18px;
    }

    .app-shell.has-student-mobile-nav .dashboard-intro,
    .app-shell.has-student-mobile-nav .student-hero-band,
    .app-shell.has-student-mobile-nav .assessment-result-band,
    .app-shell.has-student-mobile-nav .content-panel,
    .app-shell.has-student-mobile-nav .certificate-card {
        padding: 1rem;
    }

    .app-shell.has-student-mobile-nav .course-hero {
        gap: 1rem;
    }

    .app-shell.has-student-mobile-nav .course-hero-card {
        gap: 0.85rem;
    }

    .app-shell.has-student-mobile-nav .meta-pairs {
        gap: 0.65rem 0.85rem;
        margin: 0.85rem 0 1rem;
    }

    .app-shell.has-student-mobile-nav .student-detail-grid,
    .app-shell.has-student-mobile-nav .student-summary-shell,
    .app-shell.has-student-mobile-nav .student-workspace-grid,
    .app-shell.has-student-mobile-nav .learner-assessment-result-flow,
    .app-shell.has-student-mobile-nav .lesson-player,
    .app-shell.has-student-mobile-nav .lesson-insight-grid,
    .app-shell.has-student-mobile-nav .lesson-support-grid {
        gap: 0.9rem;
    }

    .app-shell.has-student-mobile-nav .student-secondary-item,
    .app-shell.has-student-mobile-nav .student-timeline-item,
    .app-shell.has-student-mobile-nav .lesson-journey-card,
    .app-shell.has-student-mobile-nav .learner-course-snapshot-card,
    .app-shell.has-student-mobile-nav .student-context-stat,
    .app-shell.has-student-mobile-nav .student-subject-scope-row,
    .app-shell.has-student-mobile-nav .assessment-question-card-note {
        border-radius: 16px;
    }

    .app-shell.has-student-mobile-nav .lesson-video-showcase {
        border-radius: 12px;
        background: #050505;
        box-shadow: 0 18px 38px rgba(15, 23, 42, 0.2);
    }

    .app-shell.has-student-mobile-nav .lesson-video-showcase-head,
    .app-shell.has-student-mobile-nav .interactive-video-toolbar {
        padding: 0.78rem 0.9rem;
    }

    .app-shell.has-student-mobile-nav .lesson-video-showcase-head {
        display: none;
    }

    .app-shell.has-student-mobile-nav .lesson-video-showcase-head .eyebrow-inline {
        font-size: 0.62rem;
        letter-spacing: 0.16em;
    }

    .app-shell.has-student-mobile-nav .interactive-video-stage {
        min-height: auto;
        aspect-ratio: 16 / 9;
    }

    .app-shell.has-student-mobile-nav .interactive-video-stage.has-active-interaction {
        min-height: auto;
        aspect-ratio: 16 / 9;
    }

    .app-shell.has-student-mobile-nav .interactive-video-card {
        width: min(100%, calc(100% - 0.25rem));
        max-height: calc(100% - 0.25rem);
        padding: 1rem;
        border-radius: 20px;
    }

    .app-shell.has-student-mobile-nav .interactive-video-controls {
        left: 0.55rem;
        right: 0.55rem;
        bottom: 0.55rem;
        gap: 0.36rem;
        padding: 0.38rem;
        grid-template-columns: 38px minmax(0, 1fr) 38px 38px;
        grid-template-areas: "play timeline audio fullscreen";
        align-items: center;
        border-radius: 999px;
        background: linear-gradient(180deg, rgba(10, 45, 43, 0.86), rgba(7, 22, 24, 0.94));
    }

    .app-shell.has-student-mobile-nav .interactive-video-stage.is-manual-fullscreen {
        position: fixed;
        inset: auto;
        top: var(--interactive-video-viewport-top, 0px);
        left: var(--interactive-video-viewport-left, 0px);
        width: var(--interactive-video-viewport-width, 100dvw);
        height: var(--interactive-video-viewport-height, 100dvh);
        max-width: none;
        max-height: none;
        min-height: 0;
        transform: none;
        border-radius: 0;
        z-index: 1400;
        overflow: hidden;
        aspect-ratio: auto;
    }

    .app-shell.has-student-mobile-nav .interactive-video-stage:fullscreen,
    .app-shell.has-student-mobile-nav .interactive-video-stage:-webkit-full-screen {
        width: 100vw;
        height: 100dvh;
        max-width: 100vw;
        max-height: 100dvh;
        aspect-ratio: auto;
    }

    .app-shell.has-student-mobile-nav .interactive-video-stage:fullscreen .interactive-video-element,
    .app-shell.has-student-mobile-nav .interactive-video-stage:-webkit-full-screen .interactive-video-element,
    .app-shell.has-student-mobile-nav .interactive-video-stage.is-manual-fullscreen .interactive-video-element {
        width: 100%;
        height: 100%;
        max-width: none;
        max-height: none;
        object-fit: cover;
    }

    .app-shell.has-student-mobile-nav .interactive-video-stage:fullscreen .interactive-video-overlay,
    .app-shell.has-student-mobile-nav .interactive-video-stage:-webkit-full-screen .interactive-video-overlay,
    .app-shell.has-student-mobile-nav .interactive-video-stage.is-manual-fullscreen .interactive-video-overlay {
        width: 100%;
        height: 100%;
    }

    .app-shell.has-student-mobile-nav .interactive-video-stage.is-manual-fullscreen .interactive-video-controls {
        left: calc(0.7rem + env(safe-area-inset-left, 0px));
        right: calc(0.7rem + env(safe-area-inset-right, 0px));
        bottom: calc(0.7rem + env(safe-area-inset-bottom, 0px));
    }

    .app-shell.has-student-mobile-nav .interactive-video-stage.is-manual-fullscreen .interactive-video-step-nav {
        top: calc(0.7rem + env(safe-area-inset-top, 0px));
        left: calc(0.7rem + env(safe-area-inset-left, 0px));
        right: calc(0.7rem + env(safe-area-inset-right, 0px));
    }

    .app-shell.has-student-mobile-nav .interactive-video-stage.is-manual-fullscreen .interactive-video-step-button {
        min-height: 36px;
        padding: 0.48rem 0.68rem;
        font-size: 0.68rem;
    }

    .app-shell.has-student-mobile-nav .lesson-video-showcase-actions [data-interactive-video-fullscreen] {
        display: none;
    }

    .app-shell.has-student-mobile-nav .interactive-video-controls #interactive-video-play-toggle {
        grid-area: play;
        min-width: 38px;
    }

    .app-shell.has-student-mobile-nav .interactive-video-controls .interactive-video-timeline {
        grid-area: timeline;
        width: 100%;
        min-width: 0;
        grid-template-columns: auto minmax(0, 1fr);
        gap: 0.34rem;
    }

    .app-shell.has-student-mobile-nav .interactive-video-controls .interactive-video-audio {
        grid-area: audio;
        display: block;
        width: auto;
        min-width: 0;
    }

    .app-shell.has-student-mobile-nav .interactive-video-controls [data-interactive-video-fullscreen] {
        grid-area: fullscreen;
        justify-self: end;
    }

    .app-shell.has-student-mobile-nav .interactive-video-control-button {
        width: 38px;
        min-width: 38px;
        min-height: 38px;
        padding: 0;
        border-radius: 12px;
        box-shadow: none;
    }

    .app-shell.has-student-mobile-nav .interactive-video-controls #interactive-video-play-toggle span,
    .app-shell.has-student-mobile-nav .interactive-video-controls [data-interactive-video-fullscreen] span {
        display: none;
    }

    .app-shell.has-student-mobile-nav .interactive-video-controls .interactive-video-time {
        font-size: 0.62rem;
        min-width: 2.1rem;
        text-align: right;
    }

    .app-shell.has-student-mobile-nav .interactive-video-controls #interactive-video-duration {
        display: none;
    }

    .app-shell.has-student-mobile-nav .interactive-video-controls .interactive-video-seek,
    .app-shell.has-student-mobile-nav .interactive-video-controls .interactive-video-volume {
        width: 100%;
    }

    .app-shell.has-student-mobile-nav .interactive-video-controls .interactive-video-audio .interactive-video-control-button {
        min-width: 38px;
        padding-inline: 0;
    }

    .app-shell.has-student-mobile-nav .interactive-video-controls .interactive-video-volume {
        display: none;
    }

    .app-shell.has-student-mobile-nav .interactive-video-play-overlay {
        width: 4.15rem;
        height: 4.15rem;
        grid-template-columns: 1fr;
        place-items: center;
        padding: 0;
        border-radius: 999px;
        background: rgba(9, 33, 35, 0.72);
    }

    .app-shell.has-student-mobile-nav .interactive-video-play-overlay-icon {
        width: 3.45rem;
        height: 3.45rem;
        font-size: 1rem;
    }

    .app-shell.has-student-mobile-nav .interactive-video-play-overlay-copy {
        display: none;
    }

    .app-shell.has-student-mobile-nav .interactive-video-overlay {
        inset: 0;
        width: 100%;
        height: 100%;
        padding: 0.45rem;
        align-items: center;
        overflow-x: hidden;
    }

    .app-shell.has-student-mobile-nav .interactive-video-actions {
        flex-direction: row;
        flex-wrap: nowrap;
        gap: 0.55rem;
    }

    .app-shell.has-student-mobile-nav .interactive-video-actions .button {
        width: auto;
        flex: 1 1 0;
        min-width: 0;
        min-height: 34px;
        padding: 0.42rem 0.55rem;
        justify-content: center;
        color: #fff;
    }

    .app-shell.has-student-mobile-nav .interactive-video-actions .button span {
        display: inline !important;
        color: inherit;
        white-space: nowrap;
        font-size: 0.7rem;
    }

    .app-shell.has-student-mobile-nav .interactive-video-card {
        box-sizing: border-box;
        max-height: calc(100% - 0.25rem);
        gap: 0.28rem;
        padding: 0.45rem;
        border-radius: 12px;
    }

    .app-shell.has-student-mobile-nav .interactive-video-card-head {
        gap: 0.38rem;
    }

    .app-shell.has-student-mobile-nav .interactive-video-card-head strong {
        font-size: 0.74rem;
        line-height: 1.25;
    }

    .app-shell.has-student-mobile-nav .interactive-video-card-head .pill {
        font-size: 0.5rem;
        letter-spacing: 0.08em;
        padding: 0.22rem 0.38rem;
    }

    .app-shell.has-student-mobile-nav .interactive-video-question {
        font-size: 0.72rem;
        line-height: 1.25;
    }

    .app-shell.has-student-mobile-nav .interactive-video-options {
        gap: 0.26rem;
    }

    .app-shell.has-student-mobile-nav .interactive-option-button,
    .app-shell.has-student-mobile-nav .interactive-video-prompt {
        gap: 0.34rem;
        padding: 0.3rem 0.4rem;
        border-radius: 9px;
    }

    .app-shell.has-student-mobile-nav .interactive-option-button strong {
        width: 1.35rem;
        height: 1.35rem;
        font-size: 0.64rem;
    }

    .app-shell.has-student-mobile-nav .interactive-option-button span,
    .app-shell.has-student-mobile-nav .interactive-video-prompt,
    .app-shell.has-student-mobile-nav .interactive-video-feedback {
        font-size: 0.66rem;
        line-height: 1.25;
    }

    .app-shell.has-student-mobile-nav .interactive-video-feedback {
        padding: 0.5rem 0.58rem;
        border-radius: 10px;
    }

    .app-shell.has-student-mobile-nav .interactive-video-toolbar {
        align-items: flex-start;
        gap: 0.6rem;
        background: #0d0d0d;
    }

    .app-shell.has-student-mobile-nav .lesson-toolbar-copy strong {
        font-size: 0.9rem;
    }

    .app-shell.has-student-mobile-nav .lesson-toolbar-copy p {
        font-size: 0.68rem;
    }

    .app-shell.has-student-mobile-nav .assessment-question-card-topline {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.55rem;
    }

    .app-shell.has-student-mobile-nav .certificate-card h3 {
        font-size: 1.55rem;
        line-height: 1.2;
    }

    .app-shell.has-student-mobile-nav .certificate-card h4 {
        font-size: 1.08rem;
        line-height: 1.35;
    }

    .app-shell.has-student-mobile-nav .certificate-meta {
        justify-content: flex-start;
        gap: 0.55rem 1rem;
        margin: 1rem 0;
        text-align: left;
    }

    .app-shell.has-student-mobile-nav .certificate-verification-note {
        margin: 1rem 0 1.2rem;
        max-width: none;
        text-align: left;
    }

    .classroom-entry-card-head p:last-child,
    .classroom-entry-field > small,
    .learner-assessment-attempt-copy p,
    .learner-assessment-submit-card p,
    .learner-assessment-section-break-copy p,
    .learner-assessment-latest-score + p {
        line-height: 1.6;
    }
}

@media (max-width: 768px) and (orientation: portrait) {
    .app-shell.has-student-mobile-nav .interactive-video-stage.is-manual-fullscreen {
        inset: auto;
        top: var(--interactive-video-viewport-center-y, 50%);
        left: var(--interactive-video-viewport-center-x, 50%);
        width: var(--interactive-video-viewport-height, 100dvh);
        height: var(--interactive-video-viewport-width, 100dvw);
        max-width: none;
        max-height: none;
        transform: translate(-50%, -50%) rotate(90deg);
        transform-origin: center;
    }

    body.interactive-video-fullscreen-lock > .interactive-video-stage.is-manual-fullscreen {
        inset: auto !important;
        top: var(--interactive-video-viewport-center-y, 50%) !important;
        left: var(--interactive-video-viewport-center-x, 50%) !important;
        width: var(--interactive-video-viewport-height, 100dvh) !important;
        height: var(--interactive-video-viewport-width, 100dvw) !important;
        max-width: none !important;
        max-height: none !important;
        transform: translate(-50%, -50%) rotate(90deg) !important;
        transform-origin: center;
    }
}

@media (max-width: 1100px) {
    body.interactive-video-fullscreen-lock > .interactive-video-stage.is-manual-fullscreen .interactive-video-controls {
        left: calc(0.55rem + env(safe-area-inset-left, 0px));
        right: calc(0.55rem + env(safe-area-inset-right, 0px));
        bottom: calc(0.5rem + env(safe-area-inset-bottom, 0px));
        display: grid;
        grid-template-columns: 34px minmax(0, 1fr) 34px 34px;
        grid-template-areas: "play timeline audio fullscreen";
        align-items: center;
        gap: 0.3rem;
        width: auto;
        min-height: 0;
        padding: 0.28rem 0.34rem;
        border-radius: 16px;
        box-sizing: border-box;
    }

    body.interactive-video-fullscreen-lock > .interactive-video-stage.is-manual-fullscreen .interactive-video-control-button {
        width: 34px;
        min-width: 34px;
        min-height: 34px;
        padding: 0;
        border-radius: 10px;
    }

    body.interactive-video-fullscreen-lock > .interactive-video-stage.is-manual-fullscreen #interactive-video-play-toggle {
        grid-area: play;
    }

    body.interactive-video-fullscreen-lock > .interactive-video-stage.is-manual-fullscreen .interactive-video-timeline {
        grid-area: timeline;
        grid-column: auto;
        grid-template-columns: auto minmax(0, 1fr);
        gap: 0.32rem;
        width: 100%;
        min-width: 0;
    }

    body.interactive-video-fullscreen-lock > .interactive-video-stage.is-manual-fullscreen .interactive-video-audio {
        grid-area: audio;
        grid-column: auto;
        display: block;
        width: 34px;
        min-width: 34px;
    }

    body.interactive-video-fullscreen-lock > .interactive-video-stage.is-manual-fullscreen [data-interactive-video-fullscreen] {
        grid-area: fullscreen;
        justify-self: end;
    }

    body.interactive-video-fullscreen-lock > .interactive-video-stage.is-manual-fullscreen .interactive-video-control-button span,
    body.interactive-video-fullscreen-lock > .interactive-video-stage.is-manual-fullscreen .interactive-video-volume,
    body.interactive-video-fullscreen-lock > .interactive-video-stage.is-manual-fullscreen #interactive-video-duration {
        display: none;
    }

    body.interactive-video-fullscreen-lock > .interactive-video-stage.is-manual-fullscreen .interactive-video-time {
        min-width: 2rem;
        font-size: 0.56rem;
        text-align: right;
    }

    body.interactive-video-fullscreen-lock > .interactive-video-stage.is-manual-fullscreen .interactive-video-step-nav {
        top: calc(0.5rem + env(safe-area-inset-top, 0px));
        left: calc(0.55rem + env(safe-area-inset-left, 0px));
        right: calc(0.55rem + env(safe-area-inset-right, 0px));
    }

    body.interactive-video-fullscreen-lock > .interactive-video-stage.is-manual-fullscreen .interactive-video-step-button {
        min-height: 34px;
        padding: 0.42rem 0.62rem;
        font-size: 0.64rem;
    }

    body.interactive-video-fullscreen-lock > .interactive-video-stage.is-manual-fullscreen .interactive-video-now-playing {
        top: calc(0.5rem + env(safe-area-inset-top, 0px));
        width: min(52%, 23rem);
        padding: 0.38rem 0.6rem;
    }
}

@media (orientation: landscape) and (max-height: 600px) and (max-width: 1100px) {
    .interactive-video-controls,
    .app-shell.has-student-mobile-nav .interactive-video-controls {
        left: calc(0.7rem + env(safe-area-inset-left, 0px));
        right: calc(0.7rem + env(safe-area-inset-right, 0px));
        bottom: calc(0.55rem + env(safe-area-inset-bottom, 0px));
        display: grid;
        grid-template-columns: 40px minmax(0, 1fr) 40px 40px;
        grid-template-areas: "play timeline audio fullscreen";
        align-items: center;
        gap: 0.42rem;
        width: auto;
        padding: 0.38rem 0.48rem;
        border-radius: 18px;
        box-sizing: border-box;
    }

    .interactive-video-controls #interactive-video-play-toggle,
    .app-shell.has-student-mobile-nav .interactive-video-controls #interactive-video-play-toggle {
        grid-area: play;
        width: 40px;
        min-width: 40px;
    }

    .interactive-video-controls .interactive-video-timeline,
    .app-shell.has-student-mobile-nav .interactive-video-controls .interactive-video-timeline {
        grid-area: timeline;
        grid-column: auto;
        grid-template-columns: auto minmax(0, 1fr) auto;
        width: 100%;
        min-width: 0;
        gap: 0.38rem;
    }

    .interactive-video-controls .interactive-video-audio,
    .app-shell.has-student-mobile-nav .interactive-video-controls .interactive-video-audio {
        grid-area: audio;
        grid-column: auto;
        display: block;
        width: 40px;
        min-width: 40px;
    }

    .interactive-video-controls [data-interactive-video-fullscreen],
    .app-shell.has-student-mobile-nav .interactive-video-controls [data-interactive-video-fullscreen] {
        grid-area: fullscreen;
        width: 40px;
        min-width: 40px;
        justify-self: end;
    }

    .interactive-video-controls .interactive-video-control-button,
    .app-shell.has-student-mobile-nav .interactive-video-controls .interactive-video-control-button {
        min-height: 40px;
        padding: 0;
        border-radius: 12px;
    }

    .interactive-video-controls .interactive-video-control-button span,
    .app-shell.has-student-mobile-nav .interactive-video-controls .interactive-video-control-button span,
    .interactive-video-controls .interactive-video-volume,
    .app-shell.has-student-mobile-nav .interactive-video-controls .interactive-video-volume {
        display: none;
    }

    .interactive-video-controls .interactive-video-time,
    .app-shell.has-student-mobile-nav .interactive-video-controls .interactive-video-time {
        min-width: auto;
        font-size: 0.62rem;
        text-align: center;
    }
}

@media (max-width: 960px) {
    .learner-assessment-work-console {
        top: 0.65rem;
    }

    .learner-assessment-work-console .learner-assessment-mobile-console-head {
        grid-template-columns: 1fr;
    }

    .learner-assessment-console-actions {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(8.5rem, 1fr));
        width: 100%;
    }

    .learner-assessment-work-console .learner-assessment-console-actions .button {
        width: auto;
        justify-content: center;
    }

    .learner-assessment-nav-toggle {
        display: flex;
    }

    .learner-assessment-nav-shell .learner-assessment-mobile-nav {
        max-height: 0;
        opacity: 0;
        overflow: hidden;
        padding-bottom: 0;
        pointer-events: none;
        transition: max-height 0.22s ease, opacity 0.18s ease, padding 0.18s ease;
    }

    .learner-assessment-nav-shell.is-open .learner-assessment-mobile-nav {
        max-height: 10rem;
        opacity: 1;
        overflow-x: auto;
        padding-bottom: 0.2rem;
        pointer-events: auto;
    }

    .learner-assessment-form .learner-assessment-question-card {
        scroll-margin-top: 1rem;
    }

    .learner-assessment-question-controls {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(8.5rem, 1fr));
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .learner-assessment-question-controls .button {
        min-width: 0;
        width: 100%;
    }

    .learner-assessment-confirm-card {
        display: grid;
    }

    .learner-assessment-confirm-card .button-row {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(8.5rem, 1fr));
        width: 100%;
    }

    .assessment-text-entry-active .learner-assessment-work-console {
        position: static;
        top: auto;
        z-index: 1;
        box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08);
        backdrop-filter: none;
    }

    .assessment-text-entry-active .learner-assessment-work-console .learner-assessment-mobile-nav,
    .assessment-text-entry-active .learner-assessment-work-console .learner-assessment-console-actions {
        display: none;
    }

    .assessment-text-entry-active .student-mobile-nav {
        opacity: 0;
        visibility: hidden;
        transform: translateY(1.25rem);
        pointer-events: none;
    }

    .assessment-text-entry-active .learner-assessment-response textarea {
        min-height: 180px;
        scroll-margin-top: 1rem;
    }
}

@media (max-width: 560px) {
    .learner-assessment-focus-hero .learner-assessment-hero-meta {
        gap: 0.45rem;
    }

    .learner-assessment-focus-hero .pill {
        flex: 1 1 auto;
        justify-content: center;
    }

    .learner-assessment-work-console {
        margin-inline: -0.15rem;
        border-radius: 18px;
    }

    .learner-assessment-work-console .learner-assessment-mobile-nav {
        gap: 0.45rem;
    }

    .learner-assessment-work-console .learner-assessment-nav-button {
        flex-basis: 40px;
        min-height: 40px;
    }
}

@media (min-width: 761px) and (max-width: 1100px) {
    .oversight-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .oversight-summary-grid {
        grid-template-columns: 1fr;
    }

    .admin-course-pagination-row {
        align-items: stretch;
        flex-direction: column;
    }

    .admin-course-pagination-row .button-row {
        justify-content: stretch;
    }

    .admin-course-pagination-row .button {
        flex: 1 1 0;
    }

    .certificate-queue-heading {
        flex-direction: column;
    }

    .certificate-trust-note {
        grid-template-columns: auto minmax(0, 1fr);
        align-items: start;
    }

    .certificate-trust-note p {
        grid-column: 2;
    }

    .certificate-queue-row .admin-operational-meta > div,
    .certificate-queue-row .admin-operational-actions .button,
    .certificate-queue-row .admin-operational-actions .admin-inline-form {
        flex: 1 1 100%;
    }
}

/* Final landing-page hero balance: keep the homepage dramatic, but make inner pages tighter. */
.landing-page .landing-catalog-hero,
.landing-page .landing-detail-hero,
.landing-page .landing-pricing-hero,
.landing-page .landing-about-hero,
.landing-page .landing-contact-hero,
.landing-page .landing-mobile-lab-hero {
    align-items: start;
    padding-top: clamp(6rem, 8vw, 7.25rem);
    padding-bottom: clamp(2.4rem, 5vw, 3.75rem);
}

.landing-page .landing-catalog-copy,
.landing-page .landing-detail-copy,
.landing-page .landing-pricing-copy,
.landing-page .landing-about-copy,
.landing-page .landing-contact-copy,
.landing-page .landing-mobile-lab-copy {
    align-self: start;
    justify-content: start;
    padding-top: clamp(0.45rem, 1.4vw, 1.1rem);
}

.landing-page .landing-catalog-summary,
.landing-page .landing-detail-card,
.landing-page .landing-pricing-choice-card,
.landing-page .landing-about-story-card,
.landing-page .landing-contact-response-card,
.landing-page .landing-mobile-lab-card {
    align-self: start;
}

.landing-page .landing-catalog-copy h1,
.landing-page .landing-detail-copy h1,
.landing-page .landing-pricing-copy h1,
.landing-page .landing-about-copy h1,
.landing-page .landing-contact-copy h1,
.landing-page .landing-mobile-lab-copy h1 {
    max-width: 780px;
    font-size: clamp(2.05rem, 3.7vw, 3.45rem);
    line-height: 1.03;
    margin-bottom: 0.95rem;
}

.landing-page .landing-catalog-copy p:not(.eyebrow),
.landing-page .landing-detail-copy p:not(.eyebrow),
.landing-page .landing-pricing-copy > p:not(.eyebrow),
.landing-page .landing-about-copy > p:not(.eyebrow),
.landing-page .landing-contact-copy > p:not(.eyebrow),
.landing-page .landing-mobile-lab-copy > p:not(.eyebrow) {
    max-width: 620px;
    margin-bottom: 1.15rem;
    font-size: clamp(0.95rem, 1.18vw, 1.05rem);
    line-height: 1.66;
}

.landing-page .landing-pricing-choice-card h2,
.landing-page .landing-about-story-card h2,
.landing-page .landing-contact-response-card h2,
.landing-page .landing-mobile-lab-card h2 {
    font-size: clamp(1.35rem, 2vw, 1.85rem);
    line-height: 1.12;
}

/* Pricing now mirrors the live product: individual course purchase or annual school subject access. */
.pricing-system-hero-actions {
    margin-bottom: 1rem;
}

.pricing-system-assurance {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem 1rem;
    color: var(--mid);
    font-size: 0.82rem;
    font-weight: 700;
}

.pricing-system-assurance span {
    display: inline-flex;
    align-items: center;
    gap: 0.42rem;
}

.pricing-system-assurance i {
    color: var(--teal);
}

.pricing-system-flow-list {
    display: grid;
    gap: 0.7rem;
}

.pricing-system-flow-list article,
.pricing-system-school-steps article {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.72rem;
    align-items: start;
}

.pricing-system-flow-list article {
    padding: 0.75rem 0;
    border-top: 1px solid rgba(13, 13, 13, 0.08);
}

.pricing-system-flow-list span,
.pricing-system-school-steps > article > span {
    display: inline-grid;
    width: 2rem;
    height: 2rem;
    place-items: center;
    border-radius: 999px;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
    font-family: "Space Mono", monospace;
    font-size: 0.68rem;
    font-weight: 700;
}

.pricing-system-flow-list strong,
.pricing-system-flow-list small,
.pricing-system-school-steps strong,
.pricing-system-school-steps small {
    display: block;
}

.pricing-system-flow-list small,
.pricing-system-school-steps small {
    margin-top: 0.14rem;
    color: var(--mid);
    line-height: 1.45;
}

.pricing-system-paths {
    padding-top: clamp(2.8rem, 6vw, 4.5rem);
    padding-bottom: clamp(2.8rem, 6vw, 4.5rem);
}

.pricing-system-path-grid,
.pricing-system-course-grid,
.pricing-system-answer-grid {
    display: grid;
    gap: 1rem;
}

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

.pricing-system-path-card,
.pricing-system-course-card,
.pricing-system-empty,
.pricing-system-school-card,
.pricing-system-answer-card {
    border: 1px solid rgba(13, 13, 13, 0.08);
    box-shadow: 0 20px 48px rgba(13, 13, 13, 0.07);
}

.pricing-system-path-card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-height: 100%;
    padding: clamp(1.3rem, 2.8vw, 2rem);
    border-radius: 26px;
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.96), rgba(235, 246, 244, 0.82));
}

.pricing-system-path-card.is-school {
    background: radial-gradient(circle at top right, rgba(232, 201, 122, 0.3), transparent 33%), linear-gradient(145deg, rgba(11, 69, 72, 0.98), rgba(26, 107, 107, 0.94));
    color: #fff;
}

.pricing-system-path-icon {
    display: inline-grid;
    width: 3rem;
    height: 3rem;
    margin-bottom: 1.15rem;
    place-items: center;
    border-radius: 18px;
    background: rgba(26, 107, 107, 0.12);
    color: var(--teal);
    font-size: 1.15rem;
}

.pricing-system-path-card.is-school .pricing-system-path-icon {
    background: rgba(255, 255, 255, 0.14);
    color: var(--gold-light);
}

.pricing-system-path-card .eyebrow,
.pricing-system-path-card h3,
.pricing-system-path-card p {
    margin-top: 0;
}

.pricing-system-path-card h3 {
    margin-bottom: 0.6rem;
    font-size: clamp(1.55rem, 2.8vw, 2.2rem);
    line-height: 1.06;
}

.pricing-system-path-card > p:not(.eyebrow) {
    color: var(--mid);
    line-height: 1.65;
}

.pricing-system-path-card.is-school .eyebrow,
.pricing-system-path-card.is-school > p:not(.eyebrow),
.pricing-system-path-card.is-school li {
    color: rgba(255, 255, 255, 0.82);
}

.pricing-system-path-card ul {
    display: grid;
    gap: 0.72rem;
    padding: 1rem 0 1.2rem;
    margin: auto 0 0;
    list-style: none;
}

.pricing-system-path-card li {
    display: flex;
    gap: 0.58rem;
    color: var(--mid);
    line-height: 1.45;
}

.pricing-system-path-card li i {
    margin-top: 0.16rem;
    color: var(--teal);
}

.pricing-system-path-card.is-school li i {
    color: var(--gold-light);
}

.pricing-system-path-card .btn {
    width: 100%;
    justify-content: center;
}

.pricing-system-path-card.is-school .btn.primary {
    border-color: #fff;
    background: #fff;
    color: var(--teal);
}

.pricing-system-course-section {
    padding-top: clamp(2.8rem, 6vw, 4.5rem);
    padding-bottom: clamp(2.8rem, 6vw, 4.5rem);
    background: radial-gradient(circle at 90% 10%, rgba(232, 201, 122, 0.14), transparent 27%), rgba(245, 240, 232, 0.5);
}

.pricing-system-course-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.pricing-system-course-card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 1.25rem;
    border-radius: 22px;
    background: rgba(255, 255, 255, 0.92);
}

.pricing-system-course-card-top {
    display: flex;
    width: 100%;
    justify-content: space-between;
    gap: 0.65rem;
    align-items: center;
}

.pricing-system-course-access {
    color: var(--teal);
    font-family: "Space Mono", monospace;
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.pricing-system-course-access.is-free {
    color: #5e8f68;
}

.pricing-system-course-card h3 {
    margin: 1.15rem 0 0.55rem;
    font-size: 1.35rem;
    line-height: 1.12;
}

.pricing-system-course-card > p {
    margin: 0;
    color: var(--mid);
    line-height: 1.55;
}

.pricing-system-course-price {
    display: grid;
    gap: 0.18rem;
    width: 100%;
    padding: 1rem 0;
    margin-top: auto;
}

.pricing-system-course-price strong {
    font-family: "Playfair Display", serif;
    font-size: 1.72rem;
    line-height: 1;
}

.pricing-system-course-price span {
    color: var(--mid);
    font-size: 0.82rem;
}

.pricing-system-course-card .btn {
    width: 100%;
    justify-content: center;
}

.pricing-system-empty {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.25rem;
    border-radius: 22px;
    background: rgba(255, 255, 255, 0.88);
}

.pricing-system-empty > i {
    display: inline-grid;
    width: 3rem;
    height: 3rem;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 16px;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
}

.pricing-system-empty div {
    display: grid;
    gap: 0.18rem;
    min-width: 0;
}

.pricing-system-empty span {
    color: var(--mid);
}

.pricing-system-empty .btn {
    margin-left: auto;
    white-space: nowrap;
}

.pricing-system-school-section {
    padding-top: clamp(2.8rem, 6vw, 4.5rem);
    padding-bottom: clamp(3rem, 7vw, 5rem);
}

.pricing-system-school-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(300px, 0.84fr);
    gap: clamp(1.2rem, 4vw, 3rem);
    padding: clamp(1.4rem, 3.5vw, 2.5rem);
    border-radius: 30px;
    background: radial-gradient(circle at top left, rgba(75, 173, 160, 0.16), transparent 34%), linear-gradient(135deg, rgba(9, 45, 48, 0.98), rgba(15, 94, 95, 0.94));
    color: #fff;
}

.pricing-system-school-copy h2 {
    max-width: 650px;
    margin: 0 0 0.75rem;
    font-size: clamp(2rem, 4vw, 3.25rem);
    line-height: 1.02;
}

.pricing-system-school-copy > p:not(.eyebrow) {
    max-width: 660px;
    color: rgba(255, 255, 255, 0.78);
    line-height: 1.68;
    margin-bottom: 1.25rem;
}

.pricing-system-school-copy .eyebrow {
    color: #a7e7da;
}

.pricing-system-school-copy .btn.primary {
    background: #fff;
    border-color: #fff;
    color: var(--teal);
}

.pricing-system-school-steps {
    display: grid;
    align-content: center;
    gap: 0.75rem;
}

.pricing-system-school-steps article {
    padding: 0.9rem;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.08);
}

.pricing-system-school-steps > article > span {
    background: rgba(232, 201, 122, 0.18);
    color: #ffe7a0;
}

.pricing-system-school-steps small {
    color: rgba(255, 255, 255, 0.72);
}

.pricing-system-answers-section {
    padding-top: clamp(2.8rem, 6vw, 4.5rem);
    padding-bottom: clamp(3rem, 7vw, 5rem);
    background: rgba(245, 240, 232, 0.6);
}

.pricing-system-answer-grid {
    max-width: 900px;
}

.pricing-system-answer-card {
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.9);
    overflow: hidden;
}

.pricing-system-answer-card summary {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0.85rem;
    align-items: center;
    min-height: 64px;
    padding: 1rem 1.15rem;
    cursor: pointer;
    list-style: none;
}

.pricing-system-answer-card summary::-webkit-details-marker {
    display: none;
}

.pricing-system-answer-card summary:focus-visible {
    outline: 3px solid rgba(26, 107, 107, 0.24);
    outline-offset: -3px;
}

.pricing-system-answer-card summary i:first-child {
    color: var(--teal);
}

.pricing-system-answer-card summary i:last-child {
    color: var(--mid);
    transition: transform 0.2s ease;
}

.pricing-system-answer-card[open] summary i:last-child {
    transform: rotate(180deg);
}

.pricing-system-answer-card summary strong {
    font-size: 1.12rem;
}

.pricing-system-answer-card p {
    margin: 0;
    padding: 0 1.15rem 1.1rem 3rem;
    color: var(--mid);
    line-height: 1.58;
}

@media (max-width: 900px) {
    .pricing-system-course-grid,
    .pricing-system-answer-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .pricing-system-school-card,
    .landing-mobile-lab-cta-layout {
        grid-template-columns: 1fr;
    }

    .pricing-system-answer-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 620px) {
    .pricing-system-path-grid,
    .pricing-system-course-grid,
    .pricing-system-answer-grid {
        grid-template-columns: 1fr;
    }

    .pricing-system-empty {
        align-items: flex-start;
        flex-direction: column;
    }

    .pricing-system-empty .btn {
        width: 100%;
        margin-left: 0;
        justify-content: center;
    }

    .pricing-system-answer-card summary {
        min-height: 58px;
        padding: 0.9rem;
    }

    .pricing-system-answer-card p {
        padding: 0 0.9rem 1rem;
    }
}

@media (max-width: 1120px) {
    .landing-page .landing-catalog-hero,
    .landing-page .landing-detail-hero,
    .landing-page .landing-pricing-hero,
    .landing-page .landing-about-hero,
    .landing-page .landing-contact-hero,
    .landing-page .landing-mobile-lab-hero {
        gap: 1.25rem;
    }
}

@media (max-width: 760px) {
    .landing-page .landing-catalog-hero,
    .landing-page .landing-detail-hero,
    .landing-page .landing-pricing-hero,
    .landing-page .landing-about-hero,
    .landing-page .landing-contact-hero,
    .landing-page .landing-mobile-lab-hero {
        padding-top: 6.4rem;
        padding-bottom: 2.15rem;
    }

    .landing-page .landing-catalog-copy,
    .landing-page .landing-detail-copy,
    .landing-page .landing-pricing-copy,
    .landing-page .landing-about-copy,
    .landing-page .landing-contact-copy,
    .landing-page .landing-mobile-lab-copy {
        padding-top: 0;
    }

    .landing-page .landing-catalog-copy h1,
    .landing-page .landing-detail-copy h1,
    .landing-page .landing-pricing-copy h1,
    .landing-page .landing-about-copy h1,
    .landing-page .landing-contact-copy h1,
    .landing-page .landing-mobile-lab-copy h1 {
        font-size: clamp(2rem, 9vw, 2.85rem);
        line-height: 1.05;
    }
}

/* Keep workspace metric rows deliberate instead of letting auto-fit leave uneven 6 + 2 endings. */
@media (min-width: 901px) {
    :is(
        .student-pulse-grid,
        .tutor-pulse-grid,
        .school-pulse-grid,
        .admin-pulse-grid,
        .tutor-course-pulse-grid,
        .dashboard-stat-grid,
        .oversight-summary-grid,
        .curriculum-summary-grid
    ) {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        grid-auto-flow: row;
    }

    :is(
        .student-pulse-grid,
        .tutor-pulse-grid,
        .school-pulse-grid,
        .admin-pulse-grid,
        .tutor-course-pulse-grid,
        .dashboard-stat-grid,
        .oversight-summary-grid,
        .curriculum-summary-grid
    ):has(> :nth-child(5)):not(:has(> :nth-child(7))) {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    :is(
        .student-pulse-grid,
        .tutor-pulse-grid,
        .school-pulse-grid,
        .admin-pulse-grid,
        .tutor-course-pulse-grid,
        .dashboard-stat-grid,
        .oversight-summary-grid,
        .curriculum-summary-grid
    ):has(> :nth-child(9)):not(:has(> :nth-child(11))) {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }
}

/* Compact desktop keeps laptop workspaces comfortable without switching to tablet layouts. */
@media (min-width: 901px) and (max-width: 1440px) {
    :root {
        --sidebar-w: 280px;
        --workspace-hero-padding: clamp(1rem, 2vw, 1.45rem);
        --workspace-hero-gap: 0.95rem;
        --workspace-card-padding: 0.9rem;
    }

    .app-content {
        padding: 1.35rem;
    }

    .content-panel {
        padding: 1rem 1.15rem;
    }

    .dashboard-grid,
    .school-dashboard-grid {
        gap: 1.1rem;
    }

    .admin-dashboard-grid {
        grid-template-columns: minmax(0, 1.25fr) minmax(280px, 0.75fr);
        gap: 1.25rem;
    }

    .school-dashboard-grid {
        grid-template-columns: minmax(0, 1.3fr) minmax(270px, 0.8fr);
    }

    .tutor-course-hero-actions,
    .student-hero-actions {
        min-width: 195px;
    }

    .student-pulse-grid,
    .tutor-pulse-grid,
    .school-pulse-grid,
    .admin-pulse-grid,
    .tutor-course-pulse-grid,
    .dashboard-stat-grid {
        gap: 0.8rem;
        margin-bottom: 1.2rem;
    }

    /* Keep six-card tutor summaries balanced without disrupting four-card subject summaries. */
    .tutor-course-pulse-grid:has(> :nth-child(6)) {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .student-pulse-card {
        padding: 0.9rem 1rem;
    }

    .student-pulse-card strong {
        font-size: 1.55rem;
    }

    .button-row,
    .admin-operational-actions,
    .school-classroom-actions,
    .tutor-course-hero-actions {
        gap: 0.65rem;
    }

    .button-row .button,
    .admin-operational-actions .button,
    .school-classroom-actions .button {
        min-height: 42px;
    }

    .learner-course-journey-actions .button {
        min-width: 0;
        padding-inline: 1rem;
    }

    .learner-course-journey-actions .button span {
        white-space: normal;
        overflow-wrap: anywhere;
    }
}

@media print {
    .app-sidebar,
    .app-header,
    .school-print-hide {
        display: none !important;
    }

    .app-main,
    .app-content {
        padding: 0 !important;
        margin: 0 !important;
    }

    .school-handout-grid {
        display: block;
    }

    .school-handout-sheet {
        border: 0 !important;
        box-shadow: none !important;
        background: #fff !important;
        padding: 0 !important;
    }

    .school-handout-link-card,
    .school-handout-step-card,
    .school-handout-note,
    .school-handout-code {
        break-inside: avoid;
        background: #fff !important;
    }
}

/* Shared cinematic lesson controls: one compact system for every video workspace. */
.interactive-video-controls.interactive-video-controls-modern {
    --player-control-height: 38px;
    position: absolute;
    z-index: 8;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    min-height: 64px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: 14px minmax(0, 1fr) !important;
    grid-template-areas: "progress" "controls" !important;
    gap: 0 !important;
    align-items: stretch !important;
    padding: 0 0.7rem 0.45rem !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: linear-gradient(180deg, rgba(5, 14, 18, 0), rgba(5, 14, 18, 0.72) 30%, rgba(5, 14, 18, 0.96)) !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    box-sizing: border-box;
}

/* Checkpoint actions must stay above the cinematic controls, even when touch
   or focus events try to reveal the player chrome. */
.interactive-video-stage.has-active-interaction .interactive-video-controls.interactive-video-controls-modern,
.interactive-video-stage.has-active-interaction .interactive-video-step-nav {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

.interactive-video-stage.has-active-interaction .interactive-video-overlay {
    z-index: 9;
}

.interactive-video-controls-modern .interactive-video-progress-track {
    grid-area: progress;
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    min-width: 0;
}

.interactive-video-controls-modern .interactive-video-progress-track.is-seek-locked .interactive-video-seek {
    cursor: default;
    pointer-events: none;
}

.interactive-video-controls-modern .interactive-video-progress-track.is-seek-locked .interactive-video-seek::-webkit-slider-thumb {
    opacity: 0;
}

.interactive-video-controls-modern .interactive-video-progress-track.is-seek-locked .interactive-video-seek::-moz-range-thumb {
    opacity: 0;
}

.interactive-video-controls-modern .interactive-video-control-button:disabled {
    border-color: rgba(255, 255, 255, 0.08);
    background: rgba(255, 255, 255, 0.06);
    color: rgba(255, 255, 255, 0.45);
    cursor: not-allowed;
    opacity: 1;
    transform: none;
}

.interactive-video-seek-lock {
    position: absolute;
    right: 0.15rem;
    top: 50%;
    display: inline-flex;
    align-items: center;
    gap: 0.28rem;
    min-height: 18px;
    padding: 0.12rem 0.42rem;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 999px;
    background: rgba(7, 24, 27, 0.9);
    color: rgba(255, 255, 255, 0.92);
    font-family: "Space Mono", monospace;
    font-size: 0.5rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    line-height: 1;
    text-transform: uppercase;
    transform: translateY(-50%);
    pointer-events: none;
}

.interactive-video-seek-lock[hidden] {
    display: none !important;
}

@media (max-width: 560px) {
    .interactive-video-seek-lock span {
        display: none;
    }
}

.interactive-video-controls-modern .interactive-video-control-row {
    grid-area: controls;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    min-width: 0;
}

.interactive-video-controls-modern .interactive-video-control-cluster {
    display: flex;
    align-items: center;
    gap: 0.28rem;
    min-width: 0;
}

.interactive-video-controls-modern .interactive-video-utility-cluster {
    justify-content: flex-end;
    flex: 0 0 auto;
}

.interactive-video-quality {
    position: relative;
    display: inline-flex;
    flex: 0 0 auto;
}

.interactive-video-quality[hidden],
.interactive-video-quality-menu[hidden] {
    display: none !important;
}

.interactive-video-quality-menu {
    position: absolute;
    right: 0;
    bottom: calc(100% + 0.7rem);
    z-index: 14;
    width: max-content;
    min-width: 132px;
    padding: 0.35rem;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 12px;
    background: rgba(7, 24, 27, 0.97);
    box-shadow: 0 16px 38px rgba(0, 0, 0, 0.38);
    backdrop-filter: blur(14px);
    transform: translateY(var(--interactive-video-quality-shift-y, 0));
}

.interactive-video-quality-option {
    width: 100%;
    min-height: 38px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.25rem;
    padding: 0.55rem 0.7rem;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: rgba(255, 255, 255, 0.84);
    font: 700 0.72rem/1.2 "Space Mono", monospace;
    cursor: pointer;
    transition: background-color 0.16s ease, color 0.16s ease;
}

.interactive-video-quality-option:hover,
.interactive-video-quality-option:focus-visible {
    background: rgba(51, 151, 143, 0.24);
    color: #fff;
    outline: none;
}

.interactive-video-quality-option i {
    visibility: hidden;
    color: var(--gold);
}

.interactive-video-quality-option.is-selected {
    background: rgba(51, 151, 143, 0.34);
    color: #fff;
}

.interactive-video-quality-option.is-selected i {
    visibility: visible;
}

.interactive-video-controls-modern .interactive-video-control-button,
.interactive-video-controls-modern .interactive-video-speed-button {
    position: relative;
    width: var(--player-control-height) !important;
    min-width: var(--player-control-height) !important;
    height: var(--player-control-height) !important;
    min-height: var(--player-control-height) !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    flex: 0 0 var(--player-control-height);
    padding: 0 !important;
    border: 0 !important;
    border-radius: 7px !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #fff !important;
    cursor: pointer;
    transform: none !important;
    transition: color 0.18s ease, background-color 0.18s ease, transform 0.18s ease !important;
}

.interactive-video-controls-modern .interactive-video-control-button:hover,
.interactive-video-controls-modern .interactive-video-control-button:focus-visible,
.interactive-video-controls-modern .interactive-video-speed-button:hover,
.interactive-video-controls-modern .interactive-video-speed-button:focus-visible {
    color: #fff !important;
    background: rgba(51, 151, 143, 0.34) !important;
    outline: 2px solid transparent;
    transform: translateY(-1px) !important;
}

.interactive-video-controls-modern .interactive-video-control-button.is-primary {
    color: #fff !important;
    background: transparent !important;
}

.interactive-video-controls-modern .interactive-video-control-button.is-primary:hover,
.interactive-video-controls-modern .interactive-video-control-button.is-primary:focus-visible {
    background: rgba(51, 151, 143, 0.38) !important;
}

.interactive-video-controls-modern .interactive-video-control-button > span:not(.interactive-video-skip-value) {
    display: none !important;
}

.interactive-video-controls-modern .interactive-video-quality-toggle {
    width: auto !important;
    min-width: 84px !important;
    flex: 0 0 auto;
    gap: 0.38rem;
    padding-inline: 0.5rem !important;
}

.interactive-video-controls-modern .interactive-video-quality-toggle > .interactive-video-quality-copy {
    display: inline-flex !important;
    align-items: baseline;
    gap: 0.24rem;
    color: #fff;
    white-space: nowrap;
}

.interactive-video-quality-copy small,
.interactive-video-quality-copy strong {
    font-family: "Space Mono", monospace;
    line-height: 1;
}

.interactive-video-quality-copy small {
    color: rgba(255, 255, 255, 0.68);
    font-size: 0.49rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.interactive-video-quality-copy strong {
    color: #fff;
    font-size: 0.59rem;
    font-weight: 800;
}

.interactive-video-controls-modern .interactive-video-control-button i {
    font-size: 0.92rem;
}

.interactive-video-controls-modern .interactive-video-skip-button i {
    font-size: 1rem;
}

.interactive-video-controls-modern .interactive-video-skip-value {
    position: absolute;
    top: 50%;
    left: 50%;
    display: block !important;
    transform: translate(-50%, -46%);
    font-family: "Space Mono", monospace;
    font-size: 0.43rem;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    pointer-events: none;
}

.interactive-video-controls-modern .interactive-video-speed-button {
    width: auto !important;
    min-width: 35px !important;
    flex-basis: 35px;
    height: 24px !important;
    min-height: 24px !important;
    margin-inline: 0.08rem;
    border-radius: 2px !important;
    background: #fff !important;
    color: #0a2528 !important;
    font-family: "Space Mono", monospace;
    font-size: 0.65rem;
    font-weight: 800;
}

.interactive-video-controls-modern .interactive-video-speed-button:hover,
.interactive-video-controls-modern .interactive-video-speed-button:focus-visible {
    background: #dcefed !important;
    color: #0a2528 !important;
}

.interactive-video-controls-modern .interactive-video-time-group {
    display: inline-flex;
    align-items: center;
    gap: 0.24rem;
    flex: 0 0 auto;
    margin-inline: 0.22rem 0.1rem;
    white-space: nowrap;
}

.interactive-video-controls-modern .interactive-video-time,
.interactive-video-controls-modern .interactive-video-time-separator {
    min-width: 0 !important;
    color: rgba(255, 255, 255, 0.96) !important;
    font-family: "Space Mono", monospace;
    font-size: 0.68rem !important;
    font-weight: 700;
    line-height: 1;
    text-align: left !important;
}

.interactive-video-controls-modern .interactive-video-seek,
.interactive-video-controls-modern .interactive-video-volume {
    --interactive-video-range-progress: 0%;
    width: 100% !important;
    height: 24px;
    margin: 0;
    appearance: none;
    -webkit-appearance: none;
    border: 0;
    border-radius: 0;
    outline: none;
    background: transparent;
    cursor: pointer;
}

.interactive-video-controls-modern .interactive-video-seek::-webkit-slider-runnable-track,
.interactive-video-controls-modern .interactive-video-volume::-webkit-slider-runnable-track {
    height: 4px;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--gold) 0 var(--interactive-video-range-progress), rgba(255, 255, 255, 0.62) var(--interactive-video-range-progress) 100%);
}

.interactive-video-controls-modern .interactive-video-seek::-moz-range-track,
.interactive-video-controls-modern .interactive-video-volume::-moz-range-track {
    height: 4px;
    border: 0;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.62);
}

.interactive-video-controls-modern .interactive-video-seek::-moz-range-progress,
.interactive-video-controls-modern .interactive-video-volume::-moz-range-progress {
    height: 4px;
    border-radius: 999px;
    background: var(--gold);
}

.interactive-video-controls-modern .interactive-video-seek::-webkit-slider-thumb,
.interactive-video-controls-modern .interactive-video-volume::-webkit-slider-thumb {
    width: 12px;
    height: 12px;
    margin-top: -4px;
    appearance: none;
    -webkit-appearance: none;
    border: 2px solid #fff;
    border-radius: 50%;
    background: var(--teal);
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.38);
}

.interactive-video-controls-modern .interactive-video-seek::-moz-range-thumb,
.interactive-video-controls-modern .interactive-video-volume::-moz-range-thumb {
    width: 10px;
    height: 10px;
    border: 2px solid #fff;
    border-radius: 50%;
    background: var(--teal);
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.38);
}

.interactive-video-controls-modern .interactive-video-audio {
    display: flex !important;
    align-items: center;
    width: auto !important;
    min-width: 0 !important;
}

.interactive-video-controls-modern .interactive-video-audio .interactive-video-volume {
    display: block !important;
    width: 0 !important;
    opacity: 0;
    overflow: hidden;
    pointer-events: none;
    transition: width 0.2s ease, opacity 0.2s ease;
}

.interactive-video-controls-modern .interactive-video-audio:hover .interactive-video-volume,
.interactive-video-controls-modern .interactive-video-audio:focus-within .interactive-video-volume {
    width: 72px !important;
    margin-right: 0.35rem;
    opacity: 1;
    pointer-events: auto;
}

.interactive-video-stage:fullscreen .interactive-video-controls-modern,
.interactive-video-stage:-webkit-full-screen .interactive-video-controls-modern,
.interactive-video-stage.is-manual-fullscreen .interactive-video-controls-modern,
body.interactive-video-fullscreen-lock > .interactive-video-stage.is-manual-fullscreen .interactive-video-controls-modern {
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    padding-inline: max(0.85rem, env(safe-area-inset-left, 0px)) max(0.85rem, env(safe-area-inset-right, 0px)) !important;
    padding-bottom: max(0.55rem, env(safe-area-inset-bottom, 0px)) !important;
    border-radius: 0 !important;
}

@media (max-width: 700px), (orientation: landscape) and (max-height: 600px) and (max-width: 1100px) {
    .interactive-video-controls.interactive-video-controls-modern,
    .app-shell.has-student-mobile-nav .interactive-video-controls.interactive-video-controls-modern,
    body.interactive-video-fullscreen-lock > .interactive-video-stage.is-manual-fullscreen .interactive-video-controls-modern {
        --player-control-height: 32px;
        min-height: 54px !important;
        grid-template-columns: minmax(0, 1fr) !important;
        grid-template-rows: 12px minmax(0, 1fr) !important;
        grid-template-areas: "progress" "controls" !important;
        padding: 0 0.42rem max(0.3rem, env(safe-area-inset-bottom, 0px)) !important;
        border-radius: 0 !important;
    }

    .interactive-video-controls-modern .interactive-video-control-row {
        gap: 0.2rem;
    }

    .interactive-video-controls-modern .interactive-video-control-cluster {
        gap: 0.04rem;
    }

    .interactive-video-controls-modern .interactive-video-speed-button {
        min-width: 30px !important;
        flex-basis: 30px;
        height: 24px !important;
        min-height: 24px !important;
        font-size: 0.56rem;
    }

    .interactive-video-controls-modern .interactive-video-time-group {
        gap: 0.14rem;
        margin-inline: 0.12rem 0;
    }

    .interactive-video-controls-modern .interactive-video-time,
    .interactive-video-controls-modern .interactive-video-time-separator {
        display: inline !important;
        font-size: 0.56rem !important;
    }

    .interactive-video-controls-modern .interactive-video-audio .interactive-video-volume {
        display: none !important;
    }

    .interactive-video-controls-modern .interactive-video-control-button i {
        font-size: 0.82rem;
    }
}

@media (max-width: 340px) and (orientation: portrait) {
    .app-shell.has-student-mobile-nav .student-primary-actions {
        flex-wrap: wrap;
        overflow-x: visible;
    }

    .app-shell.has-student-mobile-nav .student-primary-actions .button {
        width: 100%;
        min-width: 0;
    }
}

@media (max-width: 380px) and (orientation: portrait) {
    .interactive-video-controls-modern .interactive-video-notes-control {
        display: none !important;
    }

    .interactive-video-quality-menu {
        right: -2.1rem;
    }

    .interactive-video-controls-modern .interactive-video-quality-toggle {
        min-width: 56px !important;
        padding-inline: 0.38rem !important;
    }

    .interactive-video-quality-copy small {
        display: none;
    }

    .interactive-video-controls-modern .interactive-video-time,
    .interactive-video-controls-modern .interactive-video-time-separator {
        font-size: 0.51rem !important;
    }
}

/* Learner assessment overview and attempt history */
.assessment-overview-shell {
    max-width: 1120px;
    margin-inline: auto;
}

.assessment-overview-hero {
    grid-template-columns: minmax(0, 1.45fr) minmax(270px, 0.55fr);
    grid-template-areas:
        "accent accent"
        "copy meta";
    gap: 0;
    align-items: stretch;
    min-height: 0;
    padding: 0;
}

.app-shell.has-student-mobile-nav .assessment-overview-hero {
    padding: 0;
}

.assessment-overview-hero .learner-assessment-hero-bar {
    grid-area: accent;
}

.assessment-overview-hero .learner-assessment-hero-copy {
    grid-area: copy;
    align-content: center;
    padding: clamp(1.35rem, 3vw, 2.15rem);
}

.assessment-overview-hero .learner-assessment-hero-copy h2 {
    max-width: 18ch;
    font-size: clamp(2rem, 4vw, 3.25rem);
    line-height: 0.98;
    overflow-wrap: normal;
    word-break: normal;
}

.assessment-overview-hero-meta {
    grid-area: meta;
    display: grid;
    align-content: center;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.7rem;
    padding: clamp(1.35rem, 2.6vw, 2rem);
    border-left: 1px solid rgba(24, 76, 75, 0.1);
    background: linear-gradient(145deg, rgba(235, 246, 244, 0.72), rgba(255, 250, 239, 0.62));
}

.assessment-overview-hero-meta .pill {
    display: grid;
    place-items: center;
    min-width: 0;
    min-height: 3.25rem;
    padding: 0.65rem 0.55rem;
    border: 1px solid rgba(24, 76, 75, 0.12);
    border-radius: 14px;
    text-align: center;
    white-space: normal;
    background: rgba(255, 255, 255, 0.82);
}

.assessment-overview-grid {
    display: grid;
    gap: 1.35rem;
}

.assessment-overview-launch {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 1.15rem;
    padding: 1.35rem;
    background:
        radial-gradient(circle at 100% 0%, rgba(211, 178, 79, 0.14), transparent 34%),
        linear-gradient(135deg, rgba(236, 247, 245, 0.98), rgba(255, 252, 244, 0.98));
}

.assessment-overview-launch-icon,
.assessment-attempt-number {
    display: grid;
    place-items: center;
    width: 3rem;
    height: 3rem;
    flex: 0 0 3rem;
    border-radius: 50%;
    color: #fff;
    background: var(--teal, #177b79);
    box-shadow: 0 10px 24px rgba(20, 103, 101, 0.18);
}

.assessment-overview-launch-copy h3 {
    margin: 0.25rem 0 0.35rem;
    font-size: clamp(1.15rem, 2vw, 1.45rem);
}

.assessment-overview-launch-copy p,
.assessment-attempt-empty p {
    margin: 0;
    color: var(--muted, #6f6963);
}

.assessment-overview-launch-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.65rem;
    max-width: 470px;
}

.assessment-attempt-history {
    padding: 1.35rem;
}

.assessment-attempt-history-head {
    align-items: flex-start;
    margin-bottom: 1rem;
}

.assessment-attempt-history-head h2 {
    margin: 0.2rem 0 0.3rem;
}

.assessment-attempt-history-head p {
    margin: 0;
    color: var(--muted, #6f6963);
}

.assessment-overview-shell .status-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    min-height: 1.8rem;
    padding: 0.35rem 0.65rem;
    border-radius: 999px;
    color: #1c5d5b;
    background: rgba(32, 121, 117, 0.1);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.assessment-overview-shell .status-chip-success {
    color: #256d52;
    background: rgba(50, 147, 111, 0.14);
}

.assessment-overview-shell .status-chip-warning {
    color: #8a5812;
    background: rgba(201, 142, 45, 0.15);
}

.assessment-overview-shell .status-chip-watch {
    color: #765d10;
    background: rgba(207, 173, 73, 0.17);
}

.assessment-attempt-list {
    display: grid;
    gap: 0.75rem;
}

.assessment-attempt-row {
    display: grid;
    grid-template-columns: auto minmax(180px, 1fr) minmax(150px, auto) auto;
    align-items: center;
    gap: 1rem;
    padding: 0.95rem 1rem;
    border: 1px solid rgba(24, 76, 75, 0.14);
    border-left: 4px solid rgba(24, 123, 121, 0.48);
    border-radius: 18px;
    background: linear-gradient(100deg, rgba(247, 252, 251, 0.98), rgba(255, 255, 255, 0.98));
}

.assessment-attempt-row-success {
    border-left-color: #32936f;
}

.assessment-attempt-row-warning {
    border-left-color: #c98e2d;
}

.assessment-attempt-row-watch {
    border-left-color: #cfad49;
}

.assessment-attempt-copy {
    display: grid;
    gap: 0.2rem;
}

.assessment-attempt-copy strong {
    font-size: 0.94rem;
}

.assessment-attempt-result {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.65rem;
}

.assessment-attempt-result > strong {
    font-family: var(--font-display, Georgia, serif);
    font-size: 1.35rem;
}

.assessment-attempt-empty {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.3rem;
    border: 1px dashed rgba(24, 76, 75, 0.24);
    border-radius: 18px;
    background: rgba(239, 247, 246, 0.5);
}

.assessment-attempt-empty > i {
    color: var(--teal, #177b79);
    font-size: 1.6rem;
}

.assessment-attempt-empty strong {
    display: block;
    margin-bottom: 0.2rem;
}

@media (max-width: 960px) {
    .assessment-overview-launch {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .assessment-overview-launch-actions {
        grid-column: 1 / -1;
        justify-content: flex-start;
        max-width: none;
    }

    .assessment-attempt-row {
        grid-template-columns: auto minmax(0, 1fr) auto;
    }

    .assessment-attempt-result {
        grid-column: 2;
        grid-row: 2;
        justify-content: flex-start;
    }

    .assessment-attempt-row > .button {
        grid-column: 3;
        grid-row: 1 / span 2;
    }
}

@media (max-width: 840px) {
    .assessment-overview-hero {
        grid-template-columns: 1fr;
        grid-template-areas:
            "accent"
            "copy"
            "meta";
    }

    .assessment-overview-hero-meta {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        border-top: 1px solid rgba(24, 76, 75, 0.1);
        border-left: 0;
    }

    .assessment-overview-hero .learner-assessment-hero-copy h2 {
        max-width: 22ch;
    }

    .assessment-overview-launch {
        grid-template-columns: 1fr;
        text-align: left;
    }

    .assessment-overview-launch-icon {
        width: 2.65rem;
        height: 2.65rem;
    }

    .assessment-overview-launch-actions {
        grid-column: auto;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .assessment-overview-launch-actions .button:first-child:last-child,
    .assessment-overview-launch-actions .button:first-child:nth-last-child(3) {
        grid-column: 1 / -1;
    }

    .assessment-attempt-history-head {
        display: flex;
    }

    .assessment-attempt-row {
        grid-template-columns: auto minmax(0, 1fr);
        gap: 0.75rem;
    }

    .assessment-attempt-result {
        grid-column: 2;
        grid-row: auto;
        flex-wrap: wrap;
    }

    .assessment-attempt-row > .button {
        grid-column: 1 / -1;
        grid-row: auto;
        width: 100%;
    }
}

@media (max-width: 700px) {
    .assessment-overview-hero .learner-assessment-hero-copy,
    .assessment-overview-hero-meta {
        padding: 1.15rem;
    }

    .assessment-overview-hero .learner-assessment-hero-copy h2 {
        font-size: clamp(1.8rem, 9vw, 2.55rem);
    }
}

@media (max-width: 420px) {
    .assessment-overview-launch-actions {
        grid-template-columns: 1fr;
    }

    .assessment-overview-launch-actions .button {
        grid-column: auto !important;
    }
}
/* Phase 9: shared learner progression monitoring */
.progression-monitor-filter {
    display: flex;
    align-items: end;
    gap: 0.85rem;
    padding: 0.85rem 0 1rem;
    border-bottom: 1px solid rgba(15, 92, 90, 0.12);
    margin-bottom: 1rem;
}

.progression-monitor-filter .form-field {
    flex: 1 1 18rem;
    max-width: 30rem;
    margin: 0;
}

.progression-monitor-filter .button-row {
    flex: 0 0 auto;
    margin: 0;
}

.progression-monitor-pill {
    display: inline-flex;
    align-items: center;
    gap: 0.38rem;
    width: max-content;
    padding: 0.35rem 0.58rem;
    border-radius: 999px;
    background: rgba(15, 92, 90, 0.09);
    color: var(--brand-teal, #0f5c5a);
    font-size: 0.72rem;
    font-weight: 800;
    line-height: 1;
}

.progression-monitor-pill.tone-gold,
.progression-monitor-pill.tone-watch {
    background: rgba(196, 145, 33, 0.14);
    color: #76520b;
}

.progression-monitor-pill.tone-warning {
    background: rgba(175, 55, 45, 0.11);
    color: #9a3028;
}

.progression-monitor-pill.tone-success {
    background: rgba(35, 125, 84, 0.12);
    color: #1b714b;
}

.progression-report-row {
    border-left: 4px solid rgba(15, 92, 90, 0.35);
}

.progression-report-row.needs-support {
    border-left-color: #c49121;
}

.progression-report-row.low-activity {
    border-left-color: #a83d33;
}

.progression-report-stats {
    grid-template-columns: repeat(5, minmax(6.75rem, 1fr));
}

@media (max-width: 860px) {
    .progression-monitor-filter {
        align-items: stretch;
        flex-direction: column;
    }

    .progression-monitor-filter .form-field {
        flex-basis: auto;
        max-width: none;
    }

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

/* Public trust and registered-business identity */
.landing-business-identity {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.75rem;
    align-items: center;
    margin-top: 1rem;
    padding: 0.85rem;
    border: 1px solid rgba(26, 107, 107, 0.16);
    border-radius: 18px;
    background: rgba(232, 244, 244, 0.7);
}

.landing-business-identity > i {
    display: grid;
    place-items: center;
    width: 2.6rem;
    height: 2.6rem;
    border-radius: 999px;
    background: var(--teal);
    color: #fff;
}

.landing-business-identity span {
    display: grid;
    gap: 0.16rem;
}

.landing-business-identity strong {
    color: var(--ink);
    line-height: 1.25;
}

.landing-business-identity small {
    color: var(--mid);
    line-height: 1.45;
}

.footer-business-identity {
    display: grid;
    gap: 0.2rem;
    margin-top: 0.85rem;
    padding-top: 0.85rem;
    border-top: 1px solid rgba(245, 240, 232, 0.1);
}

.footer-business-identity strong {
    color: rgba(245, 240, 232, 0.82);
}

.footer-business-identity span {
    color: rgba(245, 240, 232, 0.46);
    font-size: 0.76rem;
}

.foot-brand .footer-developer-credit {
    margin-top: 0.8rem;
    color: rgba(245, 240, 232, 0.58);
    font-size: 0.78rem;
}

.footer-developer-credit strong {
    color: var(--gold-light);
}

.pricing-system-school-assurance {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    margin-top: 1rem;
}

.pricing-system-school-assurance article {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.85rem;
    align-items: start;
    padding: clamp(1rem, 2vw, 1.25rem);
    border: 1px solid rgba(13, 13, 13, 0.08);
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.9);
    box-shadow: 0 14px 34px rgba(13, 13, 13, 0.055);
}

.pricing-system-school-assurance i {
    display: grid;
    place-items: center;
    width: 2.65rem;
    height: 2.65rem;
    border-radius: 999px;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
}

.pricing-system-school-assurance strong {
    display: block;
    margin-bottom: 0.25rem;
    color: var(--ink);
}

.pricing-system-school-assurance p {
    margin: 0;
    color: var(--mid);
    font-size: 0.9rem;
    line-height: 1.6;
}

@media (max-width: 700px) {
    .pricing-system-school-assurance {
        grid-template-columns: 1fr;
    }
}

/* Phase 4: conversion paths */
.public-course-outcome {
    min-height: 4.8rem;
}

.public-course-outcome > span {
    display: block;
    margin-bottom: 0.28rem;
    color: var(--teal);
    font-family: "Space Mono", monospace;
    font-size: 0.61rem;
    font-weight: 700;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.public-course-tutor {
    display: flex;
    align-items: center;
    gap: 0.58rem;
    margin: 0 0 1rem;
    color: var(--mid);
    font-size: 0.8rem;
}

.public-course-tutor i {
    display: inline-flex;
    width: 1.85rem;
    height: 1.85rem;
    flex: 0 0 1.85rem;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
}

.public-course-tutor strong {
    color: var(--ink);
}

.public-course-footer .c-price small {
    display: block;
    margin-top: 0.08rem;
}

.public-course-footer .btn {
    min-height: 2.5rem;
    text-align: center;
}

.course-access-state-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.9rem;
    margin-bottom: 1rem;
    padding: 1rem;
    border: 1px solid rgba(26, 107, 107, 0.16);
    border-radius: 16px;
    background: linear-gradient(135deg, rgba(26, 107, 107, 0.08), rgba(255, 255, 255, 0.86));
}

.course-access-state-card h3 {
    margin: 0.12rem 0 0.38rem;
    font-size: 1.08rem;
}

.course-access-state-card p:last-child {
    margin: 0;
}

.course-access-state-icon {
    display: inline-flex;
    width: 2.55rem;
    height: 2.55rem;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: var(--teal);
    color: #fff;
}

.course-preview-unavailable {
    display: flex;
    align-items: flex-start;
    gap: 0.55rem;
    margin: 0 0 1rem;
    padding: 0.8rem 0.9rem;
    border-radius: 12px;
    background: rgba(201, 168, 76, 0.12);
    color: var(--mid);
    font-size: 0.84rem;
}

.course-preview-unavailable i {
    margin-top: 0.14rem;
    color: var(--gold-dark, #8b6a18);
}

.school-access-lane-guide {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    gap: 0.85rem;
    align-items: stretch;
    margin: 0 0 1.15rem;
}

.school-access-lane-guide > i {
    align-self: center;
    color: var(--teal);
}

.school-access-lane-guide article {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.8rem;
    padding: 1rem;
    border: 1px solid rgba(13, 13, 13, 0.1);
    border-radius: 17px;
    background: rgba(255, 255, 255, 0.76);
}

.school-access-lane-guide article.is-current {
    border-color: rgba(26, 107, 107, 0.32);
    background: linear-gradient(135deg, rgba(26, 107, 107, 0.1), rgba(255, 255, 255, 0.92));
    box-shadow: 0 12px 28px rgba(13, 13, 13, 0.05);
}

.school-access-lane-guide article > span {
    display: inline-flex;
    width: 2.35rem;
    height: 2.35rem;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: rgba(26, 107, 107, 0.11);
    color: var(--teal);
}

.school-access-lane-guide small,
.school-access-lane-guide strong,
.school-access-lane-guide p {
    display: block;
}

.school-access-lane-guide small {
    margin-bottom: 0.16rem;
    color: var(--teal);
    font-family: "Space Mono", monospace;
    font-size: 0.6rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.school-access-lane-guide strong {
    margin-bottom: 0.26rem;
}

.school-access-lane-guide p {
    margin: 0;
    color: var(--mid);
    font-size: 0.78rem;
    line-height: 1.5;
}

.school-package-next-steps {
    display: grid;
    grid-template-columns: minmax(220px, 0.56fr) minmax(0, 1.44fr);
    gap: 1rem;
    margin-bottom: 1rem;
    padding: 1.1rem;
    border: 1px solid rgba(26, 107, 107, 0.16);
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(26, 107, 107, 0.08), rgba(245, 240, 232, 0.78));
}

.school-package-next-steps h3 {
    margin: 0.25rem 0 0;
    font-size: clamp(1.05rem, 1.5vw, 1.35rem);
}

.school-package-next-steps ol {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 0.55rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.school-package-next-steps li {
    min-width: 0;
    padding: 0.72rem;
    border: 1px solid rgba(13, 13, 13, 0.08);
    border-radius: 13px;
    background: rgba(255, 255, 255, 0.8);
}

.school-package-next-steps li > span {
    display: inline-flex;
    width: 1.55rem;
    height: 1.55rem;
    align-items: center;
    justify-content: center;
    margin-bottom: 0.48rem;
    border-radius: 999px;
    background: var(--teal);
    color: #fff;
    font-family: "Space Mono", monospace;
    font-size: 0.66rem;
}

.school-package-next-steps strong,
.school-package-next-steps small {
    display: block;
}

.school-package-next-steps strong {
    margin-bottom: 0.24rem;
    font-size: 0.78rem;
}

.school-package-next-steps small {
    color: var(--mid);
    font-size: 0.68rem;
    line-height: 1.45;
}

@media (max-width: 1180px) {
    .school-package-next-steps {
        grid-template-columns: 1fr;
    }

    .school-package-next-steps ol {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 700px) {
    .public-course-outcome {
        min-height: 0;
    }

    .public-course-footer {
        align-items: stretch;
        flex-direction: column;
    }

    .public-course-footer .btn {
        width: 100%;
    }

    .course-access-state-card,
    .school-access-lane-guide {
        grid-template-columns: 1fr;
    }

    .school-access-lane-guide > i {
        justify-self: center;
        transform: rotate(90deg);
    }

    .school-package-next-steps ol {
        grid-template-columns: 1fr;
    }
}

/* Phase 5: accessible public navigation and resilient content states */
.skip-link {
    position: fixed;
    z-index: 10000;
    top: 0.75rem;
    left: 0.75rem;
    padding: 0.75rem 1rem;
    border: 2px solid #fff;
    border-radius: 10px;
    background: var(--ink);
    color: #fff;
    font-weight: 800;
    text-decoration: none;
    transform: translateY(-160%);
    transition: transform 0.18s ease;
}

.skip-link:focus {
    transform: translateY(0);
}

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
    outline: 3px solid #0b6668;
    outline-offset: 3px;
}

.sidebar :where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
    outline-color: #f4cf6a;
}

#main-content:focus {
    outline: none;
}

.public-error-page {
    min-height: 100vh;
    display: grid;
    grid-template-rows: auto 1fr auto;
    margin: 0;
    background: var(--off-white);
    color: var(--ink);
}

.public-error-header,
.public-error-footer {
    position: relative;
    z-index: 3;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.8rem clamp(1rem, 4vw, 3rem);
    border-color: rgba(13, 13, 13, 0.09);
    background: rgba(255, 255, 255, 0.92);
}

.public-error-header {
    border-bottom: 1px solid rgba(13, 13, 13, 0.09);
}

.public-error-brand {
    display: inline-flex;
    align-items: center;
    gap: 0.7rem;
    color: var(--ink);
    text-decoration: none;
}

.public-error-brand img {
    width: 46px;
    height: 46px;
    border-radius: 12px;
    object-fit: contain;
}

.public-error-brand span {
    display: grid;
    line-height: 1;
}

.public-error-brand strong {
    font-family: "Playfair Display", serif;
    font-size: 1.08rem;
}

.public-error-brand small {
    margin-top: 0.25rem;
    color: var(--mid);
    font-size: 0.62rem;
    font-weight: 800;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

.public-error-help {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    color: var(--teal-dark);
    font-weight: 800;
    text-decoration: none;
}

.public-error-shell {
    position: relative;
    display: grid;
    width: 100%;
    min-height: clamp(480px, calc(100svh - 150px), 760px);
    place-items: center;
    overflow: hidden;
    padding: clamp(3rem, 9vw, 7rem) clamp(1rem, 7vw, 6rem);
    background:
        radial-gradient(circle at 18% 18%, rgba(46, 158, 158, 0.2), transparent 28%),
        radial-gradient(circle at 88% 72%, rgba(232, 201, 122, 0.24), transparent 30%),
        linear-gradient(rgba(247, 243, 234, 0.72), rgba(247, 243, 234, 0.72)),
        url("../images/landing-pattern-tile.6b38640f527d.webp") top left / 560px 560px repeat,
        var(--off-white);
}

.public-error-code {
    position: absolute;
    color: rgba(26, 107, 107, 0.07);
    font-family: "Playfair Display", serif;
    font-size: clamp(12rem, 34vw, 30rem);
    font-weight: 900;
    line-height: 0.8;
    user-select: none;
}

.public-error-copy {
    position: relative;
    z-index: 1;
    width: min(760px, 100%);
    padding: clamp(1.5rem, 4vw, 3rem);
    border: 1px solid rgba(13, 13, 13, 0.1);
    border-radius: 28px;
    background: rgba(255, 255, 255, 0.9);
    box-shadow: 0 28px 80px rgba(13, 13, 13, 0.1);
    text-align: center;
    animation: public-error-arrive 0.55s cubic-bezier(0.2, 0.7, 0.2, 1) both;
}

.public-error-symbol {
    position: relative;
    display: grid;
    width: 84px;
    height: 84px;
    margin: 0 auto 1rem;
    place-items: center;
}

.public-error-symbol::before {
    position: absolute;
    inset: 0;
    border: 2px dashed rgba(26, 107, 107, 0.32);
    border-radius: 50%;
    content: "";
    animation: public-error-orbit 12s linear infinite;
}

.public-error-symbol span {
    display: grid;
    width: 58px;
    height: 58px;
    place-items: center;
    border-radius: 19px;
    background: linear-gradient(145deg, var(--teal-dark), #2e9e9e);
    box-shadow: 0 14px 30px rgba(26, 107, 107, 0.24);
    color: #fff;
    font-size: 1.45rem;
}

.public-error-copy h1 {
    margin: 0.55rem auto 1rem;
    font-family: "Playfair Display", serif;
    font-size: clamp(2rem, 5vw, 4.5rem);
    line-height: 0.98;
}

.public-error-copy > p:not(.eyebrow) {
    max-width: 640px;
    margin: 0 auto;
    color: var(--mid);
    line-height: 1.7;
}

.public-error-copy .landing-action-row {
    justify-content: center;
    margin-top: 1.5rem;
}

.public-error-reference {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    margin-top: 1rem !important;
    padding: 0.55rem 0.75rem;
    border: 1px solid rgba(26, 107, 107, 0.14);
    border-radius: 10px;
    background: rgba(224, 241, 239, 0.55);
    font-size: 0.82rem;
}

.public-error-reference span {
    color: var(--mid);
}

.public-error-reference strong {
    color: var(--teal-dark);
    font-family: monospace;
    letter-spacing: 0.12em;
}

.public-error-footer {
    border-top: 1px solid rgba(13, 13, 13, 0.09);
    color: var(--mid);
    font-size: 0.8rem;
}

.public-error-footer span:first-child {
    color: var(--ink);
    font-weight: 800;
}

@keyframes public-error-arrive {
    from {
        opacity: 0;
        transform: translateY(18px) scale(0.985);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes public-error-orbit {
    to {
        transform: rotate(360deg);
    }
}

@media (max-width: 620px) {
    .public-error-header {
        padding: 0.65rem 0.85rem;
    }

    .public-error-help span {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0 0 0 0);
        clip-path: inset(50%);
        white-space: nowrap;
    }

    .public-error-help {
        display: grid;
        width: 42px;
        height: 42px;
        place-items: center;
        border: 1px solid rgba(26, 107, 107, 0.18);
        border-radius: 50%;
    }

    .public-error-shell {
        min-height: calc(100svh - 132px);
        padding: 2rem 0.8rem;
    }

    .public-error-copy {
        padding: 1.4rem 1rem;
        border-radius: 22px;
    }

    .public-error-copy .landing-action-row {
        display: grid;
        grid-template-columns: 1fr;
    }

    .public-error-copy .landing-action-row .btn {
        width: 100%;
        justify-content: center;
    }

    .public-error-footer {
        justify-content: center;
        text-align: center;
    }

    .public-error-footer span:last-child {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    .skip-link {
        transition: none;
    }

    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

/* Shared public-page canvas and desktop rhythm. */
.landing-page:not(.auth-page):not(.legal-page) main {
    background-color: #f7f3ea;
    background-image:
        radial-gradient(circle at 12% 4%, rgba(26, 107, 107, 0.08), transparent 26rem),
        linear-gradient(rgba(247, 243, 234, 0.46), rgba(247, 243, 234, 0.46)),
        url("../images/landing-pattern-tile.6b38640f527d.webp");
    background-position: top left, top left, top left;
    background-repeat: no-repeat, no-repeat, repeat;
    background-size: auto, auto, 560px 560px;
}

@media (min-width: 901px) {
    .landing-page:not(.auth-page):not(.legal-page) .landing-section {
        padding-top: clamp(2.25rem, 2.8vw, 2.5rem);
        padding-bottom: clamp(2.25rem, 2.8vw, 2.5rem);
    }

    .landing-page:not(.auth-page):not(.legal-page) .landing-catalog-hero,
    .landing-page:not(.auth-page):not(.legal-page) .landing-detail-hero,
    .landing-page:not(.auth-page):not(.legal-page) .landing-pricing-hero,
    .landing-page:not(.auth-page):not(.legal-page) .landing-about-hero,
    .landing-page:not(.auth-page):not(.legal-page) .landing-contact-hero,
    .landing-page:not(.auth-page):not(.legal-page) .landing-mobile-lab-hero {
        padding-bottom: 2rem;
    }

    .landing-home .landing-hero {
        min-height: 0;
        gap: clamp(2rem, 4vw, 4rem);
        padding-top: clamp(6rem, 8vw, 7rem);
        padding-bottom: 2.75rem;
    }

    .landing-page:not(.auth-page):not(.legal-page) .landing-section-head {
        margin-bottom: clamp(1.25rem, 1.8vw, 1.7rem);
    }
}
/* Classroom archiving keeps paid capacity visible and reusable. */
.school-classroom-archive-grid {
    grid-template-columns: minmax(0, 1fr);
}

.school-archive-impact-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    margin-bottom: 1rem;
}

.school-released-slot-list {
    display: grid;
    gap: 0.65rem;
    margin: 1rem 0 1.25rem;
    max-height: 22rem;
    overflow-y: auto;
    padding-right: 0.35rem;
}

.school-released-slot-row {
    align-items: center;
    background: var(--surface-soft, #f7f5ef);
    border: 1px solid rgba(24, 91, 91, 0.14);
    border-radius: 1rem;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    padding: 0.9rem 1rem;
}

.school-released-slot-row > div {
    display: grid;
    gap: 0.2rem;
    min-width: 0;
}

.school-released-slot-row span:not(.pill) {
    color: var(--muted, #6d6a64);
    font-size: 0.86rem;
}

@media (max-width: 720px) {
    .school-archive-impact-grid {
        grid-template-columns: 1fr;
    }

    .school-released-slot-row {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* Phase 3: one calm hub for tutor applications, scope, and verification. */
.admin-tutor-management-tabs {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
    padding: 0.75rem;
    border: 1px solid rgba(26, 107, 107, 0.12);
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.78);
    box-shadow: 0 16px 34px rgba(15, 23, 42, 0.06);
}

.admin-tutor-management-tab {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.75rem;
    min-height: 4.25rem;
    padding: 0.8rem 0.9rem;
    border: 1px solid transparent;
    border-radius: 15px;
    background: rgba(247, 245, 239, 0.72);
    color: var(--ink);
    text-decoration: none;
    transition: transform 180ms ease, border-color 180ms ease, background 180ms ease, box-shadow 180ms ease;
}

.admin-tutor-management-tab:hover,
.admin-tutor-management-tab:focus-visible {
    transform: translateY(-2px);
    border-color: rgba(26, 107, 107, 0.24);
    background: #fff;
    box-shadow: 0 12px 24px rgba(15, 23, 42, 0.07);
}

.admin-tutor-management-tab.is-active {
    border-color: rgba(26, 107, 107, 0.25);
    background: linear-gradient(135deg, rgba(226, 241, 241, 0.96), rgba(255, 255, 255, 0.98));
    box-shadow: inset 0 -3px 0 var(--teal);
}

.admin-tutor-management-tab-icon {
    display: inline-grid;
    width: 2.4rem;
    height: 2.4rem;
    place-items: center;
    border-radius: 12px;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
}

.admin-tutor-management-tab.needs-attention:not(.is-active) .admin-tutor-management-tab-icon {
    background: rgba(198, 161, 74, 0.16);
    color: #87630f;
}

.admin-tutor-management-tab-copy {
    display: grid;
    gap: 0.18rem;
    min-width: 0;
}

.admin-tutor-management-tab-copy strong {
    font-size: 0.92rem;
    line-height: 1.25;
}

.admin-tutor-management-tab-copy small {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    color: var(--mid);
    font-size: 0.68rem;
}

.admin-tutor-management-tab-count {
    display: inline-grid;
    min-width: 2rem;
    min-height: 2rem;
    place-items: center;
    padding: 0.25rem 0.5rem;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.07);
    font-family: "Space Mono", monospace;
    font-size: 0.72rem;
    font-weight: 800;
}

.admin-directory-context-actions {
    display: grid;
    grid-template-columns: auto repeat(3, minmax(0, 1fr));
    align-items: stretch;
    gap: 0.65rem;
    padding: 0.7rem;
    border: 1px solid rgba(26, 107, 107, 0.12);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.78);
}

.admin-directory-context-label {
    align-self: center;
    padding: 0 0.55rem;
    color: var(--teal);
    font-family: "Space Mono", monospace;
    font-size: 0.65rem;
    font-weight: 800;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.admin-directory-context-actions a {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.65rem;
    min-width: 0;
    padding: 0.72rem 0.78rem;
    border-radius: 13px;
    background: rgba(247, 245, 239, 0.78);
    color: var(--ink);
    text-decoration: none;
    transition: transform 180ms ease, background 180ms ease, color 180ms ease;
}

.admin-directory-context-actions a:hover,
.admin-directory-context-actions a:focus-visible {
    transform: translateY(-1px);
    background: rgba(226, 241, 241, 0.94);
    color: var(--teal);
}

.admin-directory-context-actions a > i:first-child {
    color: var(--teal);
}

.admin-directory-context-actions a span {
    display: grid;
    gap: 0.1rem;
    min-width: 0;
}

.admin-directory-context-actions a strong,
.admin-directory-context-actions a small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-directory-context-actions a strong {
    font-size: 0.84rem;
}

.admin-directory-context-actions a small {
    color: var(--mid);
    font-size: 0.68rem;
}

@media (max-width: 1100px) {
    .admin-directory-context-actions {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .admin-directory-context-label {
        grid-column: 1 / -1;
        padding: 0.15rem 0.35rem;
    }
}

@media (max-width: 760px) {
    .commercial-signal-strip {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        overflow: visible;
    }

    .commercial-signal-strip > div:last-child {
        grid-column: 1 / -1;
    }

    .commercial-control-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.7rem;
        padding: 0.85rem;
    }

    .commercial-control-course,
    .commercial-control-warning,
    .commercial-control-action {
        grid-column: 1 / -1;
    }

    .commercial-control-course {
        grid-row: auto;
    }

    .commercial-control-course h3,
    .commercial-control-course p,
    .commercial-control-value strong {
        overflow: visible;
        text-overflow: clip;
        white-space: normal;
    }

    .admin-tutor-management-tabs,
    .admin-directory-context-actions {
        grid-template-columns: 1fr;
    }

    .admin-tutor-management-tab {
        min-height: 3.8rem;
    }

    .admin-directory-context-label {
        grid-column: auto;
    }
}

@media (prefers-reduced-motion: reduce) {
    .admin-tutor-management-tab,
    .admin-directory-context-actions a {
        transition: none;
    }
}

.finance-snapshot-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.7rem;
    margin-top: 1.15rem;
}

.finance-snapshot-strip > div {
    min-width: 0;
    padding: 0.78rem 0.9rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.88);
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.04);
}

.finance-snapshot-strip span,
.finance-policy-strip span,
.finance-priority-copy > span,
.finance-priority-impact span,
.finance-rule-row span {
    font-family: var(--mono);
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    color: var(--teal);
}

.finance-snapshot-strip strong {
    display: block;
    overflow: hidden;
    margin-top: 0.22rem;
    color: var(--ink);
    font-family: "Playfair Display", serif;
    font-size: clamp(1.05rem, 1.6vw, 1.35rem);
    line-height: 1.15;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.finance-overview-control {
    display: grid;
    gap: 0.8rem;
    margin-top: 1rem;
    padding: 1rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 18px;
    background:
        linear-gradient(120deg, rgba(239, 248, 247, 0.96), rgba(255, 252, 243, 0.94)),
        rgba(255, 255, 255, 0.94);
    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.05);
}

.finance-period-summary {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: flex-start;
}

.finance-period-summary h3,
.finance-period-summary p {
    margin: 0;
}

.finance-period-summary h3 {
    margin-top: 0.2rem;
    font-family: "Playfair Display", serif;
    font-size: clamp(1.25rem, 2vw, 1.7rem);
}

.finance-period-summary > div:first-child > p:last-child {
    margin-top: 0.18rem;
    color: var(--mid);
    font-size: 0.78rem;
}

.finance-reconciliation-state {
    display: grid;
    max-width: 27rem;
    gap: 0.1rem;
    padding: 0.65rem 0.75rem;
    border: 1px solid rgba(26, 107, 107, 0.16);
    border-radius: 13px;
    background: rgba(255, 255, 255, 0.72);
}

.finance-reconciliation-state > span {
    color: var(--teal);
    font-family: var(--mono);
    font-size: 0.62rem;
    font-weight: 800;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.finance-reconciliation-state strong {
    color: var(--ink);
    font-size: 0.78rem;
}

.finance-reconciliation-state small {
    color: var(--mid);
    font-size: 0.69rem;
    line-height: 1.4;
}

.finance-reconciliation-state.tone-attention {
    border-color: rgba(181, 71, 55, 0.2);
    background: rgba(255, 244, 240, 0.82);
}

.finance-reconciliation-state.tone-attention > span {
    color: #9c3d2f;
}

.finance-reconciliation-state.tone-clear {
    border-color: rgba(34, 119, 94, 0.2);
    background: rgba(239, 249, 242, 0.82);
}

.finance-period-presets {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.finance-period-presets a {
    padding: 0.48rem 0.72rem;
    border: 1px solid rgba(15, 23, 42, 0.1);
    border-radius: 999px;
    color: var(--mid);
    font-size: 0.72rem;
    font-weight: 800;
    text-decoration: none;
    background: rgba(255, 255, 255, 0.78);
}

.finance-period-presets a:hover,
.finance-period-presets a:focus-visible,
.finance-period-presets a.is-active {
    border-color: var(--teal);
    color: #fff;
    background: var(--teal);
}

.finance-custom-period {
    display: grid;
    grid-template-columns: minmax(12rem, 1.2fr) minmax(9rem, 0.7fr) minmax(9rem, 0.7fr) auto;
    gap: 0.6rem;
    align-items: end;
    max-width: 58rem;
}

.finance-custom-period .field-group {
    min-width: 0;
}

.finance-custom-period label {
    display: block;
    margin-bottom: 0.22rem;
    color: var(--mid);
    font-family: var(--mono);
    font-size: 0.59rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.finance-custom-period input,
.finance-custom-period select {
    width: 100%;
    min-width: 0;
    min-height: 2.35rem;
    padding: 0.48rem 0.58rem;
    border: 1px solid rgba(15, 23, 42, 0.14);
    border-radius: 9px;
    color: var(--ink);
    background: #fff;
}

.finance-custom-period .button {
    min-height: 2.35rem;
    justify-content: center;
}

.finance-period-error {
    margin: 0;
    color: #9c3d2f;
    font-size: 0.75rem;
    font-weight: 700;
}

.finance-overview-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
    margin-top: 0.85rem;
}

.finance-overview-card {
    position: relative;
    display: grid;
    min-width: 0;
    min-height: 13rem;
    gap: 0.5rem;
    overflow: hidden;
    padding: 0.9rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.92);
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.045);
}

.finance-overview-card::before {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 4px;
    content: "";
    background: linear-gradient(90deg, var(--teal), #3aa9a0);
}

.finance-overview-card.tone-primary::before,
.finance-overview-card.tone-ink::before {
    background: linear-gradient(90deg, #102f50, #247b9a);
}

.finance-overview-card.tone-gold::before,
.finance-overview-card.tone-sand::before {
    background: linear-gradient(90deg, #c58d1f, #e9be56);
}

.finance-overview-card.tone-mist::before {
    background: linear-gradient(90deg, #64748b, #a8b4c2);
}

.finance-overview-card-head {
    display: flex;
    align-items: center;
    gap: 0.55rem;
}

.finance-overview-card-head > span {
    display: inline-grid;
    flex: 0 0 auto;
    width: 2.25rem;
    height: 2.25rem;
    place-items: center;
    border-radius: 11px;
    color: var(--teal);
    background: rgba(26, 107, 107, 0.1);
}

.finance-overview-card-head p {
    margin: 0;
    color: var(--mid);
    font-family: var(--mono);
    font-size: 0.64rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.finance-overview-value {
    color: var(--ink);
    font-family: "Playfair Display", serif;
    font-size: clamp(1.45rem, 2.5vw, 2.1rem);
    line-height: 1;
    overflow-wrap: anywhere;
}

.finance-overview-value span {
    font-family: var(--mono);
    font-size: 0.64rem;
    letter-spacing: 0.08em;
}

.finance-overview-comparison,
.finance-overview-description {
    margin: 0;
}

.finance-overview-comparison {
    display: flex;
    align-items: center;
    gap: 0.3rem;
    color: var(--teal);
    font-size: 0.69rem;
    font-weight: 800;
}

.finance-overview-comparison.direction-down {
    color: #8b5b12;
}

.finance-overview-comparison.direction-flat {
    color: var(--mid);
}

.finance-overview-description {
    color: var(--mid);
    font-size: 0.74rem;
    line-height: 1.45;
}

.finance-overview-card > a {
    align-self: end;
    color: var(--teal);
    font-size: 0.72rem;
    font-weight: 800;
    text-decoration: none;
}

.finance-overview-card > a:hover,
.finance-overview-card > a:focus-visible {
    text-decoration: underline;
}

.finance-source-section {
    display: grid;
    gap: 0.85rem;
    margin-top: 1rem;
}

.finance-section-heading,
.finance-chart-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem;
}

.finance-section-heading h3,
.finance-section-heading p,
.finance-chart-head h4,
.finance-chart-head p {
    margin: 0;
}

.finance-section-heading h3,
.finance-chart-head h4 {
    font-family: "Playfair Display", serif;
    color: var(--ink);
}

.finance-section-heading h3 {
    margin-top: 0.18rem;
    font-size: clamp(1.35rem, 2.2vw, 1.85rem);
}

.finance-section-heading > div > p:last-child {
    max-width: 48rem;
    margin-top: 0.25rem;
    color: var(--mid);
    font-size: 0.76rem;
    line-height: 1.5;
}

.finance-source-grid {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 0.75rem;
}

.finance-source-card {
    position: relative;
    display: grid;
    grid-column: span 4;
    min-width: 0;
    gap: 0.8rem;
    padding: 0.9rem;
    overflow: hidden;
    border: 1px solid rgba(15, 23, 42, 0.09);
    border-radius: 16px;
    color: inherit;
    text-decoration: none;
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(239, 248, 247, 0.72));
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.045);
}

.finance-source-card:nth-child(n + 4) {
    grid-column: span 6;
}

.finance-source-card::before {
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    content: "";
    background: var(--teal);
}

.finance-source-card.tone-gold::before { background: #c58d1f; }
.finance-source-card.tone-ink::before { background: #183b5b; }
.finance-source-card.tone-sage::before { background: #4f8d72; }
.finance-source-card.tone-mist::before { background: #83909e; }

.finance-source-card:hover,
.finance-source-card:focus-visible {
    border-color: rgba(26, 107, 107, 0.28);
    box-shadow: 0 14px 30px rgba(15, 23, 42, 0.09);
    transform: translateY(-2px);
}

.finance-source-card.is-empty {
    background: rgba(249, 250, 251, 0.88);
}

.finance-source-card-head {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0.6rem;
    align-items: center;
}

.finance-source-card-head > span {
    display: inline-grid;
    width: 2.35rem;
    height: 2.35rem;
    place-items: center;
    border-radius: 11px;
    color: var(--teal);
    background: rgba(26, 107, 107, 0.1);
}

.finance-source-card-head p,
.finance-source-card-head h4 {
    margin: 0;
}

.finance-source-card-head p {
    color: var(--mid);
    font-family: var(--mono);
    font-size: 0.57rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.finance-source-card-head h4 {
    margin-top: 0.08rem;
    color: var(--ink);
    font-size: 0.88rem;
    line-height: 1.25;
}

.finance-source-card-head > strong {
    color: var(--teal);
    font-family: "Playfair Display", serif;
    font-size: 1.15rem;
}

.finance-source-metrics {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.45rem;
    margin: 0;
}

.finance-source-metrics > div {
    padding: 0.5rem;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.68);
}

.finance-source-metrics dt {
    color: var(--mid);
    font-size: 0.61rem;
}

.finance-source-metrics dd {
    margin: 0.14rem 0 0;
    color: var(--ink);
    font-size: 0.77rem;
    font-weight: 800;
}

.finance-source-empty-copy {
    min-height: 3rem;
    margin: 0;
    color: var(--mid);
    font-size: 0.72rem;
    line-height: 1.45;
}

.finance-source-card-foot {
    display: flex;
    justify-content: space-between;
    gap: 0.6rem;
    align-items: center;
    padding-top: 0.55rem;
    border-top: 1px solid rgba(15, 23, 42, 0.07);
}

.finance-source-card-foot > span:last-child {
    color: var(--teal);
    font-size: 0.68rem;
    font-weight: 800;
    white-space: nowrap;
}

.finance-chart-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
}

.finance-chart-panel {
    display: grid;
    min-width: 0;
    gap: 0.85rem;
    padding: 1rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 17px;
    background: rgba(255, 255, 255, 0.92);
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.04);
}

.finance-chart-head h4 {
    margin-top: 0.15rem;
    font-size: 1.08rem;
}

.finance-chart-head > strong {
    color: var(--teal);
    font-size: 0.9rem;
    white-space: nowrap;
}

.finance-source-bars {
    display: grid;
    gap: 0.65rem;
}

.finance-source-bar-row {
    display: grid;
    gap: 0.25rem;
}

.finance-source-bar-row > div:first-child {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
    color: var(--mid);
    font-size: 0.68rem;
}

.finance-source-bar-row > div:first-child strong {
    color: var(--ink);
}

.finance-source-bar-track {
    height: 0.55rem;
    overflow: hidden;
    border-radius: 999px;
    background: #e8ecee;
}

.finance-source-bar-track span {
    display: block;
    height: 100%;
    min-width: 0;
    border-radius: inherit;
    background: repeating-linear-gradient(135deg, var(--teal) 0 7px, #3aa9a0 7px 14px);
}

.finance-chart-empty {
    display: flex;
    min-height: 7rem;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    color: var(--mid);
    font-size: 0.75rem;
    text-align: center;
}

.finance-trend-chart {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    min-height: 11rem;
    gap: 0.28rem;
    align-items: end;
    padding-top: 0.3rem;
    border-bottom: 1px solid rgba(15, 23, 42, 0.12);
}

.finance-trend-column {
    display: grid;
    min-width: 0;
    height: 10.5rem;
    grid-template-rows: auto minmax(0, 1fr) auto;
    gap: 0.25rem;
    align-items: end;
    text-align: center;
}

.finance-trend-value {
    overflow: hidden;
    color: var(--mid);
    font-family: var(--mono);
    font-size: 0.48rem;
    text-overflow: ellipsis;
}

.finance-trend-column > div {
    position: relative;
    width: 100%;
    height: 100%;
}

.finance-trend-column > div > span {
    position: absolute;
    right: 16%;
    bottom: 0;
    left: 16%;
    min-height: 2px;
    border-radius: 5px 5px 0 0;
    background: linear-gradient(180deg, #d7ad47, var(--teal));
}

.finance-trend-column > strong {
    color: var(--mid);
    font-size: 0.55rem;
    text-transform: uppercase;
}

.finance-data-table {
    padding-top: 0.65rem;
    border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.finance-data-table summary {
    width: max-content;
    max-width: 100%;
    cursor: pointer;
    color: var(--teal);
    font-size: 0.69rem;
    font-weight: 800;
}

.finance-data-table .table-scroll {
    margin-top: 0.65rem;
}

.finance-data-table table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.67rem;
}

.finance-data-table caption {
    padding-bottom: 0.4rem;
    color: var(--mid);
    text-align: left;
}

.finance-data-table th,
.finance-data-table td {
    padding: 0.45rem;
    border-bottom: 1px solid rgba(15, 23, 42, 0.08);
    text-align: left;
    white-space: nowrap;
}

.finance-reconciliation-filter {
    display: grid;
    grid-template-columns: repeat(4, minmax(9rem, 1fr)) auto;
    gap: 0.7rem;
    align-items: end;
}

.finance-reconciliation-filter .button-row {
    flex-wrap: nowrap;
}

.finance-filter-state {
    display: flex;
    gap: 0.45rem;
    align-items: center;
    margin: 0.65rem 0;
    padding: 0.55rem 0.7rem;
    border-radius: 10px;
    color: var(--teal);
    background: rgba(26, 107, 107, 0.08);
    font-size: 0.74rem;
}

.finance-filter-state a {
    margin-left: auto;
    color: inherit;
    font-weight: 800;
}

.finance-transaction-filter-panel,
.finance-transaction-panel {
    margin-top: 0.85rem;
}

.finance-transaction-filter-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(8.5rem, 1fr));
    gap: 0.65rem;
    align-items: end;
}

.finance-transaction-filter-grid .form-field,
.finance-transaction-filter-grid input,
.finance-transaction-filter-grid select {
    min-width: 0;
    width: 100%;
}

.finance-transaction-filter-grid label {
    display: block;
    margin-bottom: 0.25rem;
    color: var(--mid);
    font-family: var(--mono);
    font-size: 0.58rem;
    font-weight: 800;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.finance-transaction-filter-grid input,
.finance-transaction-filter-grid select {
    min-height: 2.55rem;
    padding: 0.55rem 0.65rem;
    border: 1px solid rgba(15, 23, 42, 0.14);
    border-radius: 9px;
    color: var(--ink);
    background: #fff;
}

.finance-transaction-filter-grid .transaction-reference-field {
    grid-column: span 2;
}

.finance-transaction-filter-grid .button-row {
    grid-column: span 3;
    align-self: end;
    flex-wrap: nowrap;
}

.finance-transaction-summary {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 0.55rem;
    margin-top: 0.75rem;
}

.finance-transaction-summary article {
    display: grid;
    min-width: 0;
    gap: 0.2rem;
    padding: 0.72rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 13px;
    background: rgba(255, 255, 255, 0.9);
}

.finance-transaction-summary span {
    color: var(--mid);
    font-size: 0.62rem;
}

.finance-transaction-summary strong {
    overflow-wrap: anywhere;
    color: var(--ink);
    font-size: 0.8rem;
}

.finance-transaction-list {
    display: grid;
    gap: 0.65rem;
}

.finance-transaction-row {
    position: relative;
    display: grid;
    grid-template-columns: minmax(13rem, 1.1fr) minmax(14rem, 1fr) minmax(18rem, 1.25fr) minmax(10rem, auto);
    gap: 0.85rem;
    align-items: center;
    min-width: 0;
    padding: 0.85rem;
    overflow: hidden;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 14px;
    background: linear-gradient(120deg, rgba(255, 255, 255, 0.98), rgba(239, 248, 247, 0.58));
}

.finance-transaction-row::before {
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    content: "";
    background: var(--teal);
}

.finance-transaction-row.type-refund::before {
    background: #c58d1f;
}

.finance-transaction-identity {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.6rem;
    align-items: center;
    min-width: 0;
}

.finance-transaction-icon {
    display: inline-grid;
    width: 2.4rem;
    height: 2.4rem;
    place-items: center;
    border-radius: 11px;
    color: var(--teal);
    background: rgba(26, 107, 107, 0.1);
}

.type-refund .finance-transaction-icon {
    color: #8b5b12;
    background: rgba(197, 141, 31, 0.12);
}

.finance-transaction-identity h4,
.finance-transaction-identity p {
    margin: 0;
}

.finance-transaction-identity h4 {
    margin: 0.12rem 0;
    color: var(--ink);
    font-size: 0.85rem;
}

.finance-transaction-identity > div:last-child > p:last-child {
    overflow-wrap: anywhere;
    color: var(--mid);
    font-size: 0.66rem;
}

.finance-transaction-parties {
    display: grid;
    gap: 0.38rem;
    min-width: 0;
}

.finance-transaction-parties > div {
    display: grid;
    gap: 0.05rem;
}

.finance-transaction-parties span,
.finance-transaction-amounts dt {
    color: var(--mid);
    font-size: 0.56rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.finance-transaction-parties strong {
    overflow-wrap: anywhere;
    color: var(--ink);
    font-size: 0.69rem;
}

.finance-transaction-amounts {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.4rem;
    margin: 0;
}

.finance-transaction-amounts > div {
    min-width: 0;
    padding: 0.42rem;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.72);
}

.finance-transaction-amounts dd {
    margin: 0.08rem 0 0;
    overflow-wrap: anywhere;
    color: var(--ink);
    font-size: 0.68rem;
    font-weight: 800;
}

.finance-transaction-status {
    display: grid;
    gap: 0.35rem;
    justify-items: end;
    min-width: 0;
    text-align: right;
}

.finance-transaction-status small {
    color: var(--mid);
    font-size: 0.61rem;
}

.finance-transaction-status .button {
    width: 100%;
    justify-content: center;
}

.finance-transaction-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.65rem;
    margin-top: 0.85rem;
}

.finance-transaction-pagination > span {
    color: var(--mid);
    font-size: 0.7rem;
    font-weight: 800;
}

.finance-overview-empty,
.finance-data-warning {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0.75rem;
    align-items: center;
    margin-top: 0.8rem;
    padding: 0.8rem 0.9rem;
    border: 1px solid rgba(26, 107, 107, 0.14);
    border-radius: 14px;
    background: rgba(239, 248, 247, 0.82);
}

.finance-overview-empty > span,
.finance-data-warning > span {
    display: inline-grid;
    width: 2.35rem;
    height: 2.35rem;
    place-items: center;
    border-radius: 999px;
    color: var(--teal);
    background: rgba(26, 107, 107, 0.1);
}

.finance-overview-empty strong,
.finance-overview-empty p,
.finance-data-warning strong,
.finance-data-warning ul {
    margin: 0;
}

.finance-overview-empty p,
.finance-data-warning li {
    color: var(--mid);
    font-size: 0.74rem;
    line-height: 1.45;
}

.finance-data-warning {
    border-color: rgba(181, 71, 55, 0.2);
    background: rgba(255, 244, 240, 0.88);
}

.finance-data-warning > span {
    color: #9c3d2f;
    background: rgba(181, 71, 55, 0.1);
}

.finance-data-warning ul {
    padding-left: 1rem;
}

.finance-monitor-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 1rem;
    margin-top: 1rem;
}

.finance-attention-panel {
    border-color: rgba(181, 71, 55, 0.12);
    background:
        radial-gradient(circle at top right, rgba(181, 71, 55, 0.06), transparent 32%),
        rgba(255, 255, 255, 0.94);
}

.finance-attention-head {
    align-items: flex-start;
}

.finance-attention-head h3 {
    margin: 0.18rem 0 0;
}

.finance-attention-totals {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.5rem;
}

.finance-attention-totals span {
    display: inline-flex;
    align-items: baseline;
    gap: 0.3rem;
    padding: 0.46rem 0.62rem;
    border-radius: 999px;
    background: rgba(181, 71, 55, 0.08);
    color: #8e3428;
    font-size: 0.72rem;
}

.finance-priority-list {
    display: grid;
    gap: 0.55rem;
}

.finance-priority-row {
    display: grid;
    grid-template-columns: auto minmax(240px, 1fr) minmax(105px, auto) minmax(160px, auto);
    gap: 0.8rem;
    align-items: center;
    padding: 0.72rem 0.78rem;
    border: 1px solid rgba(203, 145, 34, 0.2);
    border-left: 4px solid #c58d1f;
    border-radius: 13px;
    background: rgba(255, 252, 243, 0.9);
}

.finance-priority-row.tone-critical {
    border-color: rgba(181, 71, 55, 0.2);
    border-left-color: #b54737;
    background: linear-gradient(90deg, rgba(255, 244, 240, 0.96), rgba(255, 255, 255, 0.92) 50%);
}

.finance-priority-icon {
    display: inline-grid;
    place-items: center;
    width: 2.35rem;
    height: 2.35rem;
    border-radius: 12px;
    color: #8a640a;
    background: rgba(203, 145, 34, 0.12);
}

.finance-priority-row.tone-critical .finance-priority-icon {
    color: #9c3d2f;
    background: rgba(181, 71, 55, 0.1);
}

.finance-priority-copy {
    display: grid;
    min-width: 0;
    gap: 0.14rem;
}

.finance-priority-copy strong,
.finance-priority-copy p {
    margin: 0;
}

.finance-priority-copy small {
    color: #775b20;
    font-size: 0.66rem;
    font-weight: 800;
}

.finance-priority-copy strong {
    color: var(--ink);
    font-size: 0.9rem;
}

.finance-priority-copy p {
    color: var(--mid);
    font-size: 0.76rem;
    line-height: 1.4;
}

.finance-priority-impact {
    display: grid;
    justify-items: end;
    gap: 0.05rem;
    text-align: right;
}

.finance-priority-impact > strong {
    color: var(--ink);
    font-size: 1.15rem;
}

.finance-priority-impact small {
    color: #8e3428;
    font-size: 0.7rem;
    font-weight: 800;
}

.finance-priority-row .button {
    width: 100%;
    justify-content: center;
    white-space: nowrap;
}

.finance-clear-state {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.75rem;
    align-items: center;
    padding: 0.85rem;
    border: 1px solid rgba(34, 119, 94, 0.15);
    border-radius: 13px;
    background: rgba(239, 249, 242, 0.72);
}

.finance-clear-state > span {
    display: inline-grid;
    place-items: center;
    width: 2.3rem;
    height: 2.3rem;
    border-radius: 999px;
    color: #22775e;
    background: rgba(34, 119, 94, 0.1);
}

.finance-clear-state strong,
.finance-clear-state p {
    margin: 0;
}

.finance-clear-state p {
    margin-top: 0.15rem;
    color: var(--mid);
    font-size: 0.8rem;
    line-height: 1.45;
}

.finance-clear-state.compact {
    padding: 0.7rem;
}

.finance-policy-strip {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 0.6rem;
}

.finance-policy-strip > div {
    min-width: 0;
    padding: 0.68rem 0.72rem;
    border-radius: 11px;
    background: rgba(247, 245, 239, 0.78);
}

.finance-policy-strip strong {
    display: block;
    overflow: hidden;
    margin-top: 0.15rem;
    color: var(--ink);
    font-size: 0.85rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.finance-operation-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.65rem;
}

.finance-operation-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0.65rem;
    align-items: center;
    min-width: 0;
    padding: 0.78rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 13px;
    color: var(--ink);
    text-decoration: none;
    background: rgba(255, 255, 255, 0.88);
    transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

.finance-operation-card:hover,
.finance-operation-card:focus-visible {
    transform: translateY(-1px);
    border-color: rgba(26, 107, 107, 0.28);
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.07);
}

.finance-operation-card > span {
    display: inline-grid;
    place-items: center;
    width: 2.2rem;
    height: 2.2rem;
    border-radius: 11px;
    color: var(--teal);
    background: rgba(26, 107, 107, 0.1);
}

.finance-operation-card > div {
    display: grid;
    min-width: 0;
    gap: 0.08rem;
}

.finance-operation-card strong,
.finance-operation-card small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.finance-operation-card strong {
    font-size: 0.82rem;
}

.finance-operation-card small {
    color: var(--mid);
    font-size: 0.69rem;
}

.finance-audit-list {
    max-height: 24rem;
    overflow-y: auto;
    padding-right: 0.25rem;
    scrollbar-width: thin;
}

.finance-settings-grid {
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
    align-items: start;
    margin-top: 1rem;
}

.finance-settings-warning {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.7rem;
    align-items: start;
    margin-bottom: 1rem;
    padding: 0.78rem;
    border: 1px solid rgba(203, 145, 34, 0.2);
    border-radius: 12px;
    color: #6e510c;
    background: rgba(255, 249, 231, 0.8);
}

.finance-settings-warning p {
    margin: 0;
    font-size: 0.8rem;
    line-height: 1.5;
}

.finance-commission-form {
    gap: 0.8rem;
}

.finance-rule-history {
    display: grid;
    gap: 0.5rem;
    max-height: 30rem;
    overflow-y: auto;
    padding-right: 0.25rem;
    scrollbar-width: thin;
}

.finance-rule-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.8rem;
    align-items: center;
    padding: 0.72rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.86);
}

.finance-rule-row.is-active {
    border-color: rgba(26, 107, 107, 0.26);
    background: rgba(237, 248, 248, 0.88);
}

.finance-rule-row > div {
    display: grid;
    gap: 0.12rem;
}

.finance-rule-row > div:last-child {
    justify-items: end;
    text-align: right;
}

.finance-rule-row strong {
    color: var(--ink);
    font-size: 1.05rem;
}

.finance-rule-row p,
.finance-rule-row small {
    margin: 0;
    color: var(--mid);
    font-size: 0.72rem;
    line-height: 1.4;
}

@media (max-width: 1100px) {
    .finance-overview-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

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

    .finance-source-card,
    .finance-source-card:nth-child(n + 4) {
        grid-column: span 6;
    }

    .finance-source-card:last-child:nth-child(odd) {
        grid-column: 1 / -1;
    }

    .finance-chart-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .finance-transaction-filter-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .finance-transaction-filter-grid .transaction-reference-field,
    .finance-transaction-filter-grid .button-row {
        grid-column: span 3;
    }

    .finance-transaction-summary {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .finance-transaction-row {
        grid-template-columns: minmax(13rem, 1fr) minmax(13rem, 1fr);
    }

    .finance-transaction-status {
        justify-items: stretch;
        text-align: left;
    }

    .finance-settings-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .finance-priority-row {
        grid-template-columns: auto minmax(220px, 1fr) minmax(90px, auto);
    }

    .finance-priority-row .button {
        grid-column: 2 / -1;
        width: max-content;
        justify-self: end;
    }
}

@media (max-width: 760px) {
    .finance-period-summary {
        display: grid;
    }

    .finance-reconciliation-state {
        max-width: none;
    }

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

    .finance-custom-period .button {
        grid-column: 1 / -1;
    }

    .finance-overview-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .finance-overview-card {
        min-height: 0;
    }

    .finance-section-heading,
    .finance-chart-head {
        align-items: flex-start;
        flex-direction: column;
    }

    .finance-source-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .finance-source-card,
    .finance-source-card:nth-child(n + 4),
    .finance-source-card:last-child:nth-child(odd) {
        grid-column: auto;
    }

    .finance-source-card-foot {
        align-items: flex-start;
        flex-direction: column;
    }

    .finance-reconciliation-filter {
        grid-template-columns: minmax(0, 1fr);
    }

    .finance-reconciliation-filter .button-row {
        width: 100%;
    }

    .finance-reconciliation-filter .button {
        flex: 1 1 0;
        justify-content: center;
    }

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

    .finance-transaction-filter-grid .transaction-reference-field,
    .finance-transaction-filter-grid .button-row {
        grid-column: 1 / -1;
    }

    .finance-transaction-filter-grid .button-row .button {
        flex: 1 1 0;
        justify-content: center;
    }

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

    .finance-transaction-row {
        grid-template-columns: minmax(0, 1fr);
    }

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

    .finance-transaction-status {
        justify-items: stretch;
    }

    .finance-data-warning {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .finance-data-warning .button {
        grid-column: 1 / -1;
        width: 100%;
        justify-content: center;
    }

    .finance-snapshot-strip,
    .finance-policy-strip,
    .finance-operation-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .finance-attention-head,
    .finance-attention-totals {
        justify-content: flex-start;
    }

    .finance-priority-row {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .finance-priority-impact {
        grid-column: 2;
        justify-items: start;
        text-align: left;
    }

    .finance-priority-row .button {
        grid-column: 1 / -1;
        width: 100%;
    }
}

@media (max-width: 480px) {
    .finance-custom-period {
        grid-template-columns: minmax(0, 1fr);
    }

    .finance-custom-period .button {
        grid-column: auto;
        width: 100%;
    }

    .finance-transaction-filter-grid,
    .finance-transaction-summary {
        grid-template-columns: minmax(0, 1fr);
    }

    .finance-transaction-filter-grid .transaction-reference-field,
    .finance-transaction-filter-grid .button-row {
        grid-column: auto;
    }

    .finance-transaction-pagination {
        align-items: stretch;
        flex-direction: column;
        text-align: center;
    }

    .finance-snapshot-strip,
    .finance-policy-strip,
    .finance-operation-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .finance-rule-row {
        grid-template-columns: minmax(0, 1fr);
    }

    .finance-rule-row > div:last-child {
        justify-items: start;
        text-align: left;
    }
}

@media (prefers-reduced-motion: reduce) {
    .finance-operation-card {
        transition: none;
    }
}

/* Phase 7: high-contrast keyboard focus across workspace controls. */
.dashboard-page .app-main :where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
    outline: 3px solid #ffffff !important;
    outline-offset: 2px;
    box-shadow: 0 0 0 5px #0b6668 !important;
}

.dashboard-page .sidebar :where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
    outline-color: #ffffff !important;
    box-shadow: 0 0 0 5px #f4cf6a !important;
}

/* Shared workspace overflow menu for secondary page-level actions. */
:is(.student-hero-band, .tutor-hero-band, .school-hero-band, .admin-hero-band, .tutor-course-hero):has(.workspace-more-actions[open], .admin-hero-more-actions[open]) {
    position: relative;
    z-index: 5;
}

.workspace-more-actions {
    position: relative;
    display: block;
    width: 100%;
}

.workspace-more-actions[open] {
    z-index: 40;
}

.workspace-more-actions > summary {
    width: 100%;
    list-style: none;
    cursor: pointer;
}

.workspace-more-actions > summary::-webkit-details-marker {
    display: none;
}

.workspace-more-trigger .fa-chevron-down,
.workspace-more-actions > summary .fa-chevron-down {
    margin-left: auto;
    transition: transform 180ms ease;
}

.workspace-more-actions[open] > summary .fa-chevron-down {
    transform: rotate(180deg);
}

.workspace-more-panel {
    position: absolute;
    top: calc(100% + 0.5rem);
    right: 0;
    display: grid;
    gap: 0.3rem;
    width: max-content;
    min-width: 260px;
    max-width: min(360px, calc(100vw - 2rem));
    padding: 0.55rem;
    border: 1px solid rgba(15, 23, 42, 0.12);
    border-radius: 16px;
    background: #ffffff;
    box-shadow: 0 20px 48px rgba(15, 23, 42, 0.22);
}

.workspace-more-panel > .workspace-more-action,
.workspace-more-panel > .button.workspace-more-action,
.workspace-more-panel > .text-link.workspace-more-action {
    display: flex !important;
    align-items: center;
    justify-content: flex-start !important;
    gap: 0.7rem;
    width: 100% !important;
    min-height: 44px;
    margin: 0;
    padding: 0.7rem 0.8rem;
    border: 0 !important;
    border-radius: 11px;
    background: transparent !important;
    box-shadow: none !important;
    color: var(--ink) !important;
    font-weight: 800;
    text-align: left;
    text-decoration: none;
    transform: none !important;
}

.workspace-more-panel > .workspace-more-action :where(i, span) {
    color: inherit !important;
}

.workspace-more-panel > .workspace-more-action:hover,
.workspace-more-panel > .workspace-more-action:focus-visible {
    background: rgba(26, 107, 107, 0.1) !important;
    color: var(--teal-dark) !important;
}

@media (max-width: 760px) {
    .workspace-more-panel {
        position: static;
        width: 100%;
        min-width: 0;
        max-width: none;
        margin-top: 0.5rem;
        box-shadow: 0 12px 28px rgba(15, 23, 42, 0.16);
    }
}

@media (prefers-reduced-motion: reduce) {
    .workspace-more-actions > summary .fa-chevron-down {
        transition: none;
    }
}
.guardian-consent-panel {
    display: grid;
    gap: 0.85rem;
    padding: 1.15rem;
    border: 1px solid rgba(22, 123, 121, 0.22);
    border-radius: 1rem;
    background: linear-gradient(135deg, rgba(22, 123, 121, 0.07), rgba(208, 174, 78, 0.08));
}

.guardian-consent-option {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    gap: 0.7rem;
    margin: 0;
    font-weight: 600;
    line-height: 1.5;
}

.guardian-consent-option input[type="checkbox"] {
    width: 1.1rem;
    height: 1.1rem;
    margin: 0.15rem 0 0;
    accent-color: var(--teal, #167b79);
}

.guardian-consent-option .field-error {
    grid-column: 2;
}

.guardian-quote-builder-grid {
    align-items: start;
}

.guardian-quote-preview.has-selections {
    position: sticky;
    top: 1rem;
}

.guardian-catalogue-subject-list {
    display: grid;
    gap: 1rem;
}

.guardian-catalogue-subject-card {
    border: 1px solid rgba(17, 92, 91, 0.18);
    border-radius: 1.25rem;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(246, 243, 235, 0.8));
    padding: 1.1rem;
    transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

.guardian-catalogue-subject-card.is-selected {
    border-color: var(--color-primary, #177574);
    box-shadow: 0 16px 35px rgba(17, 92, 91, 0.11);
    transform: translateY(-2px);
}

.guardian-catalogue-subject-card > header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1.25rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid rgba(20, 36, 40, 0.1);
}

.guardian-catalogue-subject-card h4,
.guardian-invoice-ward-section h3 {
    margin: 0.45rem 0 0.25rem;
}

.guardian-catalogue-subject-card p {
    margin: 0;
    color: var(--muted, #6c6a66);
}

.guardian-catalogue-price {
    min-width: 9rem;
    text-align: right;
}

.guardian-catalogue-price strong,
.guardian-catalogue-price span {
    display: block;
}

.guardian-catalogue-price strong {
    color: var(--color-primary, #177574);
    font-size: 1.05rem;
}

.guardian-catalogue-price span,
.guardian-ward-choice small,
.guardian-invoice-ward-section small {
    color: var(--muted, #6c6a66);
    font-size: 0.78rem;
}

.guardian-ward-picker {
    margin: 1rem 0 0;
    padding: 0;
    border: 0;
}

.guardian-ward-picker legend {
    margin-bottom: 0.7rem;
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.guardian-ward-picker-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.7rem;
}

.guardian-ward-choice {
    display: grid;
    grid-template-columns: auto auto minmax(0, 1fr);
    align-items: center;
    gap: 0.7rem;
    min-width: 0;
    min-height: 64px;
    padding: 0.75rem;
    border: 1px solid rgba(20, 36, 40, 0.12);
    border-radius: 1rem;
    background: rgba(255, 255, 255, 0.75);
    cursor: pointer;
    transition: background 160ms ease, border-color 160ms ease, transform 160ms ease;
}

.guardian-ward-choice:has(input:checked) {
    border-color: var(--color-primary, #177574);
    background: rgba(23, 117, 116, 0.09);
    transform: translateY(-1px);
}

.guardian-ward-choice input {
    width: 1.35rem;
    height: 1.35rem;
    accent-color: var(--color-primary, #177574);
}

.guardian-ward-choice > span:last-child {
    min-width: 0;
}

.guardian-ward-choice strong,
.guardian-ward-choice small {
    display: block;
    overflow-wrap: anywhere;
}

.guardian-quote-mobile-summary {
    display: none;
}

.guardian-ward-choice-avatar {
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    width: 2.35rem;
    height: 2.35rem;
    border-radius: 0.85rem;
    background: linear-gradient(145deg, rgba(23, 117, 116, 0.18), rgba(218, 177, 74, 0.2));
    color: #115c5b;
    font-weight: 800;
}

.guardian-quote-date-summary {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.7rem;
    margin: 1rem 0;
}

.guardian-quote-date-summary div {
    padding: 0.8rem;
    border-radius: 0.9rem;
    background: rgba(23, 117, 116, 0.07);
}

.guardian-quote-date-summary span,
.guardian-quote-date-summary strong {
    display: block;
}

.guardian-quote-date-summary span {
    margin-bottom: 0.3rem;
    color: var(--muted, #6c6a66);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.guardian-quote-assurance {
    display: flex;
    gap: 0.75rem;
    align-items: flex-start;
    margin-top: 1rem;
    padding: 0.9rem;
    border-radius: 1rem;
    background: #f4f1e9;
}

.guardian-quote-assurance i {
    color: var(--color-primary, #177574);
    margin-top: 0.2rem;
}

.guardian-quote-assurance p {
    margin: 0;
}

.guardian-recent-quotes {
    margin-top: 1.25rem;
}

.guardian-quote-state {
    display: flex;
    gap: 0.85rem;
    align-items: flex-start;
    margin: 1.25rem 1.4rem 0;
    padding: 1rem;
    border: 1px solid rgba(23, 117, 116, 0.2);
    border-radius: 1rem;
    background: rgba(23, 117, 116, 0.07);
}

.guardian-quote-state > i {
    display: grid;
    place-items: center;
    flex: 0 0 2.4rem;
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 0.8rem;
    color: #fff;
    background: var(--teal, #177574);
}

.guardian-quote-state strong,
.guardian-quote-state p {
    display: block;
    margin: 0;
}

.guardian-quote-state p {
    margin-top: 0.2rem;
    color: var(--muted, #6c6a66);
}

.guardian-quote-state--checkout_pending {
    border-color: rgba(177, 126, 17, 0.25);
    background: rgba(218, 177, 74, 0.1);
}

.guardian-quote-state--checkout_pending > i {
    background: #9b6a0a;
}

.guardian-invoice-ward-section {
    margin-top: 1.5rem;
    border: 1px solid rgba(20, 36, 40, 0.12);
    border-radius: 1.2rem;
    overflow: hidden;
}

.guardian-invoice-ward-section > header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.2rem;
    background: linear-gradient(100deg, rgba(23, 117, 116, 0.1), rgba(218, 177, 74, 0.09));
}

.guardian-invoice-ward-section > header > div {
    display: flex;
    align-items: center;
    gap: 0.8rem;
}

.guardian-invoice-ward-section .school-package-invoice-table-wrap {
    margin: 0;
    border: 0;
    border-radius: 0;
}

.guardian-invoice-mobile-lines {
    display: none;
}

.guardian-checkout-grid {
    grid-template-columns: minmax(0, 1.35fr) minmax(320px, 0.65fr);
    align-items: start;
}

.guardian-checkout-review,
.guardian-checkout-action-panel {
    min-width: 0;
}

.guardian-checkout-action-panel {
    position: sticky;
    top: 1rem;
}

.guardian-checkout-facts {
    display: grid;
    gap: 0;
    margin: 1.15rem 0;
}

.guardian-checkout-facts > div {
    display: grid;
    grid-template-columns: minmax(110px, 0.36fr) minmax(0, 1fr);
    gap: 0.8rem;
    padding: 0.85rem 0;
    border-top: 1px solid rgba(20, 36, 40, 0.1);
}

.guardian-checkout-facts dt {
    color: var(--muted, #6c6a66);
    font-family: "Space Mono", monospace;
    font-size: 0.66rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.guardian-checkout-facts dd {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    margin: 0;
    min-width: 0;
}

.guardian-checkout-facts dd > strong,
.guardian-checkout-facts dd > span:not(.guardian-checkout-chip) {
    display: block;
    flex-basis: 100%;
}

.guardian-checkout-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    max-width: 100%;
    min-height: 34px;
    padding: 0.42rem 0.65rem;
    border-radius: 999px;
    color: #105655;
    background: rgba(23, 117, 116, 0.1);
    overflow-wrap: anywhere;
}

.guardian-checkout-chip--subject {
    color: #6f4b08;
    background: rgba(218, 177, 74, 0.14);
}

.guardian-checkout-total {
    display: grid;
    gap: 0.15rem;
    padding: 1rem;
    border-radius: 1.1rem;
    color: #fff;
    background: linear-gradient(125deg, #123f42, var(--teal, #177574));
}

.guardian-checkout-total span,
.guardian-checkout-total small {
    color: rgba(255, 255, 255, 0.78);
}

.guardian-checkout-total strong {
    font-family: "Playfair Display", serif;
    font-size: clamp(1.8rem, 5vw, 2.8rem);
}

.guardian-checkout-actions {
    display: grid;
    gap: 0.65rem;
    margin-top: 1rem;
}

.guardian-checkout-actions .button,
.guardian-checkout-actions form,
.guardian-checkout-actions form .button {
    width: 100%;
}

.guardian-payment-status-card {
    border-top: 5px solid var(--teal, #177574);
}

.guardian-payment-status-card--cancelled,
.guardian-payment-status-card--failed {
    border-top-color: #b6493b;
}

.guardian-payment-status-card--pending {
    border-top-color: #c18c1d;
}

@media (max-width: 760px) {
    .guardian-quote-builder-grid {
        display: block;
    }

    .guardian-quote-builder-grid .guardian-quote-preview {
        position: static;
        margin-top: 1rem;
    }

    .guardian-ward-picker-grid {
        grid-template-columns: 1fr;
    }

    .guardian-catalogue-subject-card > header,
    .guardian-invoice-ward-section > header {
        align-items: flex-start;
        flex-direction: column;
    }

    .guardian-catalogue-price {
        text-align: left;
    }

    .guardian-quote-desktop-actions {
        margin-bottom: 0;
    }

    .guardian-quote-desktop-actions .button-primary {
        display: none;
    }

    .guardian-quote-mobile-summary:not([hidden]) {
        position: sticky;
        z-index: 22;
        bottom: var(--workspace-mobile-nav-clearance, 6.5rem);
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 0.75rem;
        align-items: center;
        margin: 1rem -0.25rem 0;
        padding: 0.7rem;
        border: 1px solid rgba(255, 255, 255, 0.2);
        border-radius: 1rem;
        color: #fff;
        background: rgba(13, 52, 55, 0.97);
        box-shadow: 0 18px 40px rgba(7, 34, 37, 0.24);
        backdrop-filter: blur(14px);
    }

    .guardian-quote-mobile-summary > div {
        display: grid;
        min-width: 0;
    }

    .guardian-quote-mobile-summary span,
    .guardian-quote-mobile-summary small {
        color: rgba(255, 255, 255, 0.76);
    }

    .guardian-quote-mobile-summary strong {
        overflow-wrap: anywhere;
    }

    .guardian-quote-mobile-summary .button {
        min-width: 96px;
        min-height: 48px;
    }

    .guardian-quote-state {
        margin: 1rem;
    }

    .guardian-curriculum-invoice .school-package-invoice-table-wrap {
        display: none;
    }

    .guardian-invoice-mobile-lines {
        display: grid;
        gap: 0.75rem;
        padding: 0.8rem;
    }

    .guardian-invoice-mobile-line {
        display: grid;
        gap: 0.85rem;
        padding: 0.9rem;
        border: 1px solid rgba(20, 36, 40, 0.1);
        border-radius: 1rem;
        background: #fff;
    }

    .guardian-invoice-mobile-line > div > span,
    .guardian-invoice-mobile-line > div > strong,
    .guardian-invoice-mobile-line > div > small {
        display: block;
    }

    .guardian-invoice-mobile-line > div > span,
    .guardian-invoice-mobile-line dt {
        color: var(--muted, #6c6a66);
        font-size: 0.68rem;
        font-weight: 800;
        letter-spacing: 0.08em;
        text-transform: uppercase;
    }

    .guardian-invoice-mobile-line dl {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.65rem;
        margin: 0;
    }

    .guardian-invoice-mobile-line dl > div:last-child {
        grid-column: 1 / -1;
        padding-top: 0.6rem;
        border-top: 1px solid rgba(20, 36, 40, 0.1);
    }

    .guardian-invoice-mobile-line dd {
        margin: 0.2rem 0 0;
        overflow-wrap: anywhere;
    }

    .guardian-checkout-grid,
    .guardian-checkout-facts > div {
        grid-template-columns: 1fr;
    }

    .guardian-checkout-action-panel {
        position: static;
    }

    .guardian-payment-status-grid {
        display: grid;
        grid-template-columns: 1fr;
    }
}

@media print {
    .guardian-quote-state,
    .guardian-invoice-mobile-lines,
    .guardian-quote-mobile-summary {
        display: none !important;
    }

    .guardian-curriculum-invoice .school-package-invoice-table-wrap {
        display: block !important;
    }
}
/* Guardian checkout keeps the beneficiary choice explicit before payment. */
.guardian-checkout-selection {
    max-width: 860px;
}

.guardian-ward-checkout-form {
    display: grid;
    gap: 0.85rem;
}

.guardian-ward-checkout-choice {
    align-items: center;
    background: color-mix(in srgb, var(--surface, #fff) 92%, var(--brand-teal, #197a78));
    border: 1px solid rgba(20, 83, 81, 0.18);
    border-radius: 18px;
    cursor: pointer;
    display: grid;
    gap: 0.85rem;
    grid-template-columns: auto auto 1fr auto;
    padding: 1rem;
    transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

.guardian-ward-checkout-choice:hover,
.guardian-ward-checkout-choice:has(input:focus-visible) {
    border-color: var(--brand-teal, #197a78);
    box-shadow: 0 12px 30px rgba(15, 66, 65, 0.1);
    transform: translateY(-2px);
}

.guardian-ward-checkout-choice:has(input:checked) {
    border-color: var(--brand-teal, #197a78);
    box-shadow: inset 4px 0 0 var(--brand-teal, #197a78);
}

.guardian-ward-checkout-choice small,
.guardian-ward-checkout-choice strong {
    display: block;
}

.guardian-ward-checkout-choice > i {
    color: var(--brand-teal, #197a78);
    opacity: 0;
}

.guardian-ward-checkout-choice:has(input:checked) > i {
    opacity: 1;
}

.guardian-checkout-total {
    align-items: center;
    border-top: 1px solid rgba(20, 33, 36, 0.12);
    display: flex;
    justify-content: space-between;
    margin-top: 0.35rem;
    padding-top: 1rem;
}

.guardian-checkout-total strong {
    font-family: var(--font-display, Georgia, serif);
    font-size: clamp(1.35rem, 2vw, 2rem);
}

@media (max-width: 620px) {
    .guardian-ward-checkout-choice {
        grid-template-columns: auto auto 1fr;
    }

    .guardian-ward-checkout-choice > i {
        display: none;
    }
}

/* Guardian monitoring keeps learning evidence readable without exposing learner controls. */
.guardian-create-hero,
.guardian-monitor-hero {
    background:
        radial-gradient(circle at 88% 12%, rgba(219, 180, 73, 0.22), transparent 30%),
        linear-gradient(125deg, #113f49, #1a716d);
    border: 1px solid rgba(255, 255, 255, 0.14);
}

.guardian-create-hero .school-hero-copy,
.guardian-monitor-hero .school-hero-copy {
    max-width: 58ch;
}

.guardian-monitor-back {
    align-items: center;
    color: var(--teal-dark);
    display: inline-flex;
    font-size: 0.82rem;
    font-weight: 800;
    gap: 0.45rem;
    margin-bottom: 0.8rem;
    text-decoration: none;
}

.guardian-monitor-back:hover,
.guardian-monitor-back:focus-visible {
    text-decoration: underline;
}

.guardian-monitor-jump-nav {
    display: flex;
    gap: 0.55rem;
    margin: -0.2rem 0 1.2rem;
    overflow-x: auto;
    padding: 0.2rem 0.1rem 0.55rem;
    scrollbar-width: thin;
}

.guardian-monitor-jump-nav a {
    align-items: center;
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid rgba(26, 107, 107, 0.16);
    border-radius: 999px;
    color: var(--teal-dark);
    display: inline-flex;
    flex: 0 0 auto;
    font-size: 0.78rem;
    font-weight: 800;
    gap: 0.5rem;
    min-height: 44px;
    padding: 0.55rem 0.85rem;
    text-decoration: none;
}

.guardian-monitor-jump-nav a:hover,
.guardian-monitor-jump-nav a:focus-visible {
    background: var(--teal-pale);
    border-color: rgba(26, 107, 107, 0.35);
}

.guardian-monitor-learner-id {
    display: inline-grid;
    gap: 0.1rem;
    width: fit-content;
    max-width: 100%;
    padding: 0.55rem 0.8rem;
    border: 1px solid rgba(255, 255, 255, 0.34);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.12);
}

.guardian-monitor-learner-id span {
    color: rgba(255, 255, 255, 0.75);
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.guardian-monitor-learner-id strong {
    color: #fff;
    font-family: var(--font-mono, monospace);
    font-size: 0.9rem;
    overflow-wrap: anywhere;
}

.guardian-monitor-hero .guardian-status {
    margin-top: 0.85rem;
}

.guardian-monitor-hero .school-hero-actions {
    min-width: min(230px, 100%);
}

.guardian-status {
    align-items: center;
    border: 1px solid transparent;
    border-radius: 999px;
    display: inline-flex;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    line-height: 1.2;
    padding: 0.42rem 0.7rem;
    text-transform: uppercase;
    width: fit-content;
}

.guardian-status-success {
    background: rgba(76, 151, 105, 0.13);
    border-color: rgba(76, 151, 105, 0.25);
    color: #286b42;
}

.guardian-status-watch {
    background: rgba(201, 168, 76, 0.14);
    border-color: rgba(201, 168, 76, 0.3);
    color: #816411;
}

.guardian-status-warning {
    background: rgba(192, 94, 58, 0.12);
    border-color: rgba(192, 94, 58, 0.26);
    color: #983e25;
}

.guardian-status-neutral {
    background: rgba(107, 101, 96, 0.1);
    border-color: rgba(107, 101, 96, 0.2);
    color: var(--mid);
}

.guardian-monitor-last-seen {
    color: var(--mid);
    display: block;
    font-size: 0.8rem;
    margin-top: 0.35rem;
}

.guardian-monitor-progress {
    background: rgba(13, 13, 13, 0.08);
    border-radius: 999px;
    height: 7px;
    overflow: hidden;
    width: 100%;
}

.guardian-monitor-progress > span {
    background: linear-gradient(90deg, var(--teal), var(--teal-light));
    border-radius: inherit;
    display: block;
    height: 100%;
    min-width: 0;
    transition: width 420ms cubic-bezier(0.22, 0.78, 0.22, 1);
}

.guardian-monitor-card .guardian-monitor-progress {
    grid-column: 1 / -1;
    margin-top: 0.15rem;
}

.guardian-attention-panel {
    background: linear-gradient(135deg, rgba(255, 252, 243, 0.98), rgba(255, 255, 255, 0.98));
    border-color: rgba(201, 168, 76, 0.28);
}

.guardian-attention-grid {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.guardian-attention-grid > div {
    align-items: flex-start;
    background: rgba(201, 168, 76, 0.08);
    border: 1px solid rgba(201, 168, 76, 0.18);
    border-radius: 14px;
    display: flex;
    gap: 0.7rem;
    line-height: 1.5;
    padding: 0.9rem 1rem;
}

.guardian-attention-grid i {
    color: #9a7412;
    margin-top: 0.2rem;
}

.guardian-learning-list {
    display: grid;
    gap: 0.8rem;
}

.guardian-learning-row {
    align-items: center;
    background: linear-gradient(120deg, rgba(232, 244, 244, 0.54), rgba(255, 255, 255, 0.95));
    border: 1px solid rgba(26, 107, 107, 0.14);
    border-radius: 18px;
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(0, 1fr) minmax(220px, 32%);
    padding: 1rem;
}

.guardian-learning-copy {
    align-items: flex-start;
    display: flex;
    gap: 0.85rem;
    min-width: 0;
}

.guardian-learning-copy > div {
    min-width: 0;
}

.guardian-learning-copy strong,
.guardian-learning-copy p,
.guardian-learning-copy small {
    display: block;
}

.guardian-learning-copy strong {
    font-size: 0.96rem;
}

.guardian-learning-copy p {
    color: var(--mid);
    line-height: 1.45;
    margin: 0.3rem 0;
}

.guardian-learning-copy small {
    color: var(--mid);
}

.guardian-learning-icon {
    align-items: center;
    background: var(--teal-pale);
    border-radius: 13px;
    color: var(--teal);
    display: inline-flex;
    flex: 0 0 42px;
    height: 42px;
    justify-content: center;
}

.guardian-learning-progress {
    display: grid;
    gap: 0.55rem;
}

.guardian-learning-progress > div:first-child {
    align-items: center;
    color: var(--mid);
    display: flex;
    font-size: 0.78rem;
    justify-content: space-between;
}

.guardian-learning-progress strong {
    color: var(--ink);
    font-family: "Cormorant Garamond", Georgia, serif;
    font-size: 1.25rem;
}

.guardian-assessment-grid {
    display: grid;
    gap: 0.9rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-height: 620px;
    overflow: auto;
    padding-right: 0.2rem;
}

.guardian-assessment-card {
    background: #fff;
    border: 1px solid var(--border);
    border-left: 4px solid var(--teal);
    border-radius: 16px;
    display: grid;
    gap: 0.65rem;
    padding: 1rem;
}

.guardian-assessment-warning {
    border-left-color: var(--rust);
}

.guardian-assessment-watch {
    border-left-color: var(--gold);
}

.guardian-assessment-top,
.guardian-assessment-meta {
    align-items: center;
    display: flex;
    gap: 0.75rem;
    justify-content: space-between;
}

.guardian-assessment-top > span:first-child,
.guardian-assessment-meta {
    color: var(--mid);
    font-size: 0.76rem;
}

.guardian-assessment-card h4 {
    font-family: "Cormorant Garamond", Georgia, serif;
    font-size: 1.28rem;
}

.guardian-assessment-card > p {
    color: var(--mid);
}

.guardian-review-state {
    align-items: flex-start;
    border-radius: 12px;
    display: flex;
    font-size: 0.8rem;
    gap: 0.55rem;
    line-height: 1.45;
    padding: 0.75rem;
}

.guardian-review-state.is-ready {
    background: rgba(76, 151, 105, 0.1);
    color: #286b42;
}

.guardian-review-state.is-locked {
    background: rgba(13, 13, 13, 0.055);
    color: var(--mid);
}

.guardian-monitor-secondary-grid .activity-list,
.guardian-owner-controls .activity-list {
    max-height: 440px;
    overflow: auto;
}

.guardian-profile-exit-panel {
    margin-bottom: 0;
}

/* Phase 5: phone-first guardian management forms and protected account actions. */
.guardian-create-layout {
    align-items: start;
    display: grid;
    gap: 1.15rem;
    grid-template-columns: minmax(0, 1fr) minmax(250px, 0.36fr);
}

.guardian-create-card {
    margin: 0;
    min-width: 0;
    padding: clamp(1.1rem, 2.4vw, 1.8rem);
}

.guardian-create-card-heading {
    align-items: center;
    display: flex;
    gap: 0.85rem;
    margin-bottom: 0.3rem;
}

.guardian-create-card-heading h3,
.guardian-create-card-heading p,
.guardian-create-step-head h4,
.guardian-create-step-head p {
    margin: 0;
}

.guardian-create-heading-icon {
    align-items: center;
    background: var(--teal-pale);
    border-radius: 15px;
    color: var(--teal-dark);
    display: inline-flex;
    flex: 0 0 48px;
    height: 48px;
    justify-content: center;
}

.guardian-create-step {
    border-top: 1px solid rgba(26, 107, 107, 0.12);
    display: grid;
    gap: 1rem;
    padding-top: 1.2rem;
}

.guardian-create-step-head {
    align-items: start;
    display: flex;
    gap: 0.75rem;
}

.guardian-create-step-head > span {
    align-items: center;
    background: rgba(26, 107, 107, 0.1);
    border-radius: 10px;
    color: var(--teal-dark);
    display: inline-flex;
    flex: 0 0 34px;
    font-family: var(--font-mono, monospace);
    font-size: 0.7rem;
    font-weight: 800;
    height: 34px;
    justify-content: center;
}

.guardian-create-step-head h4 {
    color: var(--ink);
    font-family: var(--font-display, Georgia, serif);
    font-size: 1.18rem;
    line-height: 1.25;
}

.guardian-create-step-head p {
    color: var(--mid);
    font-size: 0.82rem;
    line-height: 1.5;
    margin-top: 0.18rem;
}

.guardian-create-fields {
    display: grid;
    gap: 0.85rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.guardian-create-form .guardian-consent-panel {
    background: transparent;
    border: 0;
    gap: 0.55rem;
    padding: 0;
}

.guardian-create-form .guardian-consent-option {
    background: rgba(242, 249, 247, 0.72);
    border: 1px solid rgba(26, 107, 107, 0.14);
    border-radius: 13px;
    cursor: pointer;
    font-size: 0.81rem;
    min-height: 54px;
    padding: 0.8rem;
}

.guardian-create-form .guardian-consent-option:has(input:checked) {
    background: rgba(226, 244, 240, 0.88);
    border-color: rgba(26, 107, 107, 0.35);
}

.guardian-create-form .guardian-consent-option .field-errors {
    grid-column: 2;
}

.guardian-create-actions {
    border-top: 1px solid rgba(26, 107, 107, 0.12);
    padding-top: 1.1rem;
}

.guardian-create-guide {
    background:
        radial-gradient(circle at 100% 0%, rgba(229, 191, 81, 0.2), transparent 40%),
        linear-gradient(145deg, #123f49, #196760);
    border-radius: 22px;
    color: #fff;
    padding: 1.4rem;
}

.guardian-create-guide-icon {
    align-items: center;
    background: rgba(255, 255, 255, 0.14);
    border-radius: 13px;
    display: inline-flex;
    height: 44px;
    justify-content: center;
    margin-bottom: 1rem;
    width: 44px;
}

.guardian-create-guide .eyebrow-inline,
.guardian-create-guide h3 {
    color: #fff;
    margin: 0;
}

.guardian-create-guide h3 {
    font-family: var(--font-display, Georgia, serif);
    font-size: 1.45rem;
    line-height: 1.2;
    margin-top: 0.4rem;
}

.guardian-create-guide ol {
    counter-reset: guardian-guide;
    display: grid;
    gap: 0.9rem;
    list-style: none;
    margin: 1.3rem 0;
    padding: 0;
}

.guardian-create-guide li {
    counter-increment: guardian-guide;
    display: grid;
    gap: 0.15rem 0.65rem;
    grid-template-columns: 28px minmax(0, 1fr);
}

.guardian-create-guide li::before {
    color: #e7c561;
    content: "0" counter(guardian-guide);
    font-family: var(--font-mono, monospace);
    font-size: 0.7rem;
    font-weight: 800;
    grid-row: 1 / span 2;
    padding-top: 0.14rem;
}

.guardian-create-guide li strong,
.guardian-create-guide li span {
    grid-column: 2;
}

.guardian-create-guide li span,
.guardian-create-guide-note {
    color: rgba(255, 255, 255, 0.78);
    font-size: 0.78rem;
    line-height: 1.5;
}

.guardian-create-guide-note {
    align-items: start;
    border-top: 1px solid rgba(255, 255, 255, 0.18);
    display: flex;
    gap: 0.55rem;
    margin: 0;
    padding-top: 1rem;
}

.guardian-create-guide-note i {
    color: #e7c561;
    margin-top: 0.2rem;
}

.guardian-form-stage {
    margin-inline: auto;
    max-width: 880px;
}

.guardian-form-card,
.guardian-profile-card {
    min-width: 0;
}

.guardian-form-card-head {
    align-items: flex-start;
    display: flex;
    gap: 0.9rem;
    margin-bottom: 1.2rem;
}

.guardian-form-card-head > span {
    align-items: center;
    background: var(--teal-pale);
    border-radius: 15px;
    color: var(--teal-dark);
    display: inline-flex;
    flex: 0 0 48px;
    height: 48px;
    justify-content: center;
}

.guardian-form-card-head h3,
.guardian-form-card-head p {
    margin: 0;
}

.guardian-form-card-head h3 {
    margin-top: 0.15rem;
}

.guardian-form-card-head p:last-child {
    color: var(--mid);
    line-height: 1.5;
    margin-top: 0.3rem;
}

.guardian-management-form {
    min-width: 0;
    scroll-padding-bottom: 8rem;
}

.guardian-form-field {
    display: grid;
    gap: 0.42rem;
    min-width: 0;
}

.guardian-form-field > label {
    color: var(--ink);
    font-size: 0.82rem;
    font-weight: 800;
    letter-spacing: 0.02em;
}

.guardian-form-field > input,
.guardian-form-field > select,
.guardian-form-field > textarea {
    background: #fff;
    border: 1px solid rgba(20, 36, 40, 0.18);
    border-radius: 13px;
    font: inherit;
    min-height: 50px;
    padding: 0.78rem 0.85rem;
    width: 100%;
}

.guardian-form-field > textarea {
    min-height: 110px;
    resize: vertical;
}

.guardian-form-field > input:focus,
.guardian-form-field > select:focus,
.guardian-form-field > textarea:focus {
    border-color: var(--teal);
    box-shadow: 0 0 0 3px rgba(26, 107, 107, 0.13);
    outline: 0;
}

.guardian-form-field > small,
.guardian-account-email small {
    color: var(--mid);
    line-height: 1.45;
}

.guardian-form-field.has-errors > input,
.guardian-form-field.has-errors > select,
.guardian-form-field.has-errors > textarea {
    border-color: var(--rust);
    background: rgba(192, 94, 58, 0.035);
}

.guardian-management-form .field-errors {
    margin: 0;
}

.guardian-management-form .field-errors p {
    margin: 0;
}

.guardian-security-note,
.guardian-account-email {
    align-items: flex-start;
    background: rgba(232, 244, 244, 0.62);
    border: 1px solid rgba(26, 107, 107, 0.16);
    border-radius: 15px;
    display: flex;
    gap: 0.7rem;
    padding: 0.85rem;
}

.guardian-security-note i {
    color: var(--teal-dark);
    margin-top: 0.2rem;
}

.guardian-security-note p,
.guardian-account-email span,
.guardian-account-email strong,
.guardian-account-email small {
    margin: 0;
}

.guardian-account-email {
    display: grid;
    gap: 0.18rem;
}

.guardian-account-email span {
    color: var(--mid);
    font-family: var(--mono);
    font-size: 0.63rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.guardian-account-email strong {
    overflow-wrap: anywhere;
}

.guardian-preference-form {
    gap: 0.65rem;
}

.guardian-preference-option {
    align-items: start;
    background: rgba(13, 13, 13, 0.025);
    border: 1px solid rgba(13, 13, 13, 0.08);
    border-radius: 14px;
    cursor: pointer;
    display: grid;
    gap: 0.75rem;
    grid-template-columns: auto minmax(0, 1fr);
    margin: 0;
    min-height: 64px;
    padding: 0.85rem;
}

.guardian-preference-option:has(input:checked) {
    background: rgba(26, 107, 107, 0.07);
    border-color: rgba(26, 107, 107, 0.28);
}

.guardian-preference-option input {
    accent-color: var(--teal);
    height: 1.35rem;
    margin-top: 0.05rem;
    width: 1.35rem;
}

.guardian-preference-option strong,
.guardian-preference-option small {
    display: block;
}

.guardian-preference-option small {
    color: var(--mid);
    margin-top: 0.15rem;
}

.guardian-danger-hero {
    border-color: rgba(192, 94, 58, 0.2);
}

.guardian-danger-card {
    border-color: rgba(192, 94, 58, 0.25);
    box-shadow: 0 22px 55px rgba(100, 39, 22, 0.09);
}

.guardian-danger-card .guardian-form-card-head > span {
    background: rgba(192, 94, 58, 0.11);
    color: var(--rust);
}

.guardian-confirmation-code {
    display: grid;
    gap: 0.25rem;
    margin-bottom: 1rem;
    padding: 0.9rem;
    border: 1px dashed rgba(192, 94, 58, 0.4);
    border-radius: 14px;
    background: rgba(192, 94, 58, 0.05);
}

.guardian-confirmation-code span {
    color: var(--mid);
    font-size: 0.72rem;
    font-weight: 800;
    text-transform: uppercase;
}

.guardian-confirmation-code strong {
    font-family: var(--mono);
    overflow-wrap: anywhere;
}

.guardian-danger-zone {
    align-items: center;
    border-top: 1px solid rgba(192, 94, 58, 0.16);
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    margin-top: 1.15rem;
    padding-top: 1.15rem;
}

.guardian-danger-zone > div {
    align-items: flex-start;
    display: flex;
    gap: 0.7rem;
}

.guardian-danger-zone > div > span {
    align-items: center;
    background: rgba(192, 94, 58, 0.1);
    border-radius: 11px;
    color: var(--rust);
    display: inline-flex;
    flex: 0 0 40px;
    height: 40px;
    justify-content: center;
}

.guardian-danger-zone strong,
.guardian-danger-zone p {
    display: block;
    margin: 0;
}

.guardian-danger-zone p {
    color: var(--mid);
    font-size: 0.8rem;
    line-height: 1.45;
    margin-top: 0.2rem;
    max-width: 620px;
}

.guardian-inline-invite-form {
    align-items: end;
    display: grid;
    gap: 0.7rem;
    grid-template-columns: minmax(0, 1fr) auto;
    margin-bottom: 1rem;
}

.guardian-inline-invite-form .button {
    min-height: 50px;
}

.guardian-management-form[aria-busy="true"] {
    cursor: progress;
}

.guardian-management-form[aria-busy="true"] .button:disabled {
    cursor: progress;
    opacity: 0.8;
}

.admin-test-school-purge-hero {
    border-color: rgba(192, 94, 58, 0.24);
}

.admin-test-school-purge-grid {
    grid-template-columns: minmax(0, 1fr);
}

.admin-test-school-purge-summary {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-bottom: 1rem;
}

.admin-test-school-purge-summary article {
    background: rgba(245, 241, 233, 0.72);
    border: 1px solid rgba(19, 92, 91, 0.12);
    border-radius: 16px;
    display: grid;
    gap: 0.25rem;
    min-width: 0;
    padding: 1rem;
}

.admin-test-school-purge-summary span,
.admin-test-school-purge-summary small {
    color: var(--mid);
}

.admin-test-school-purge-summary span {
    font-family: var(--mono);
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.admin-test-school-purge-summary strong {
    font-family: var(--display);
    font-size: 1.65rem;
}

.admin-test-school-purge-note {
    margin-bottom: 1rem;
}

.admin-test-school-purge-form {
    max-width: 760px;
}

.admin-test-school-purge-acknowledgement {
    align-items: flex-start;
    background: rgba(192, 94, 58, 0.06);
    border: 1px solid rgba(192, 94, 58, 0.2);
    border-radius: 14px;
    cursor: pointer;
    display: flex;
    gap: 0.7rem;
    padding: 0.9rem;
}

.admin-test-school-purge-acknowledgement input {
    flex: 0 0 auto;
    margin-top: 0.2rem;
}

@media (max-width: 760px) {
    .admin-test-school-purge-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 480px) {
    .admin-test-school-purge-summary {
        grid-template-columns: minmax(0, 1fr);
    }
}

.guardian-monitoring-boundary {
    align-items: flex-start;
    background: rgba(232, 244, 244, 0.68);
    border: 1px solid rgba(26, 107, 107, 0.2);
    border-radius: 18px;
    display: flex;
    gap: 0.85rem;
    margin-bottom: 1.25rem;
    padding: 1rem;
}

.guardian-monitoring-boundary > span {
    align-items: center;
    background: rgba(26, 107, 107, 0.12);
    border-radius: 12px;
    color: var(--teal-dark);
    display: inline-flex;
    flex: 0 0 42px;
    height: 42px;
    justify-content: center;
}

.guardian-monitoring-boundary p {
    color: var(--mid);
    line-height: 1.55;
    margin: 0.25rem 0 0;
}

.guardian-ward-command-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(0, 1.35fr) minmax(280px, 0.65fr);
    margin-bottom: 1.25rem;
}

.guardian-current-snapshot,
.guardian-next-action {
    margin: 0;
}

.guardian-current-snapshot {
    background: linear-gradient(140deg, rgba(245, 252, 250, 0.98), rgba(255, 255, 255, 0.97));
    border-color: rgba(26, 107, 107, 0.18);
}

.guardian-command-heading {
    align-items: center;
    display: flex;
    gap: 0.85rem;
    margin-bottom: 1rem;
}

.guardian-command-heading h3,
.guardian-next-action h3,
.guardian-next-action p,
.guardian-owner-management .panel-head p {
    margin: 0;
}

.guardian-command-icon,
.guardian-next-action-icon {
    align-items: center;
    background: var(--teal-pale);
    border-radius: 15px;
    color: var(--teal-dark);
    display: inline-flex;
    flex: 0 0 48px;
    height: 48px;
    justify-content: center;
}

.guardian-current-facts {
    display: grid;
    gap: 0.65rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 1rem;
}

.guardian-current-facts > div {
    background: rgba(13, 13, 13, 0.035);
    border: 1px solid rgba(13, 13, 13, 0.055);
    border-radius: 13px;
    display: grid;
    gap: 0.25rem;
    padding: 0.75rem;
}

.guardian-current-facts span,
.guardian-current-facts small {
    color: var(--mid);
    font-size: 0.72rem;
}

.guardian-current-facts strong {
    overflow-wrap: anywhere;
}

.guardian-ward-weekly {
    align-items: flex-start;
    border-top: 1px solid rgba(26, 107, 107, 0.15);
    color: var(--teal-dark);
    display: flex;
    gap: 0.65rem;
    margin-top: 1rem;
    padding-top: 0.9rem;
}

.guardian-ward-weekly p {
    display: grid;
    gap: 0.15rem;
    margin: 0;
}

.guardian-ward-weekly span {
    color: var(--mid);
}

.guardian-next-action {
    align-content: start;
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.11), transparent 42%),
        linear-gradient(150deg, rgba(239, 248, 247, 0.98), rgba(255, 255, 255, 0.98));
    border-color: rgba(26, 107, 107, 0.22);
    display: grid;
    gap: 0.9rem;
}

.guardian-next-action-warning,
.guardian-next-action-watch {
    background:
        radial-gradient(circle at top right, rgba(201, 168, 76, 0.15), transparent 42%),
        linear-gradient(150deg, rgba(255, 251, 239, 0.98), rgba(255, 255, 255, 0.98));
    border-color: rgba(201, 168, 76, 0.28);
}

.guardian-next-action-warning .guardian-next-action-icon,
.guardian-next-action-watch .guardian-next-action-icon {
    background: rgba(201, 168, 76, 0.14);
    color: #85640f;
}

.guardian-next-action > div > p:last-child {
    color: var(--mid);
    line-height: 1.55;
    margin-top: 0.45rem;
}

.guardian-next-action .button {
    justify-self: start;
}

.guardian-ward-stat-grid {
    display: grid;
    gap: 0.9rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin: 1.25rem 0;
}

.guardian-ward-stat-grid .oversight-overview-card {
    border-top: 3px solid rgba(26, 107, 107, 0.55);
}

.guardian-ward-stat-grid .tone-gold {
    border-top-color: var(--gold);
}

.guardian-ward-stat-grid .tone-sage {
    border-top-color: #4b9273;
}

.guardian-ward-stat-grid .tone-ink {
    border-top-color: #62718a;
}

.guardian-current-learning {
    display: grid;
    gap: 1.25rem;
    scroll-margin-top: 1rem;
}

.guardian-learning-copy .pill + strong {
    margin-top: 0.5rem;
}

.guardian-learning-facts {
    display: grid;
    gap: 0.5rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.guardian-learning-facts span {
    background: rgba(13, 13, 13, 0.035);
    border-radius: 10px;
    color: var(--mid);
    font-size: 0.72rem;
    padding: 0.55rem;
    text-align: center;
}

.guardian-learning-facts strong {
    color: var(--ink);
    display: block;
}

.guardian-curriculum-progress-row {
    grid-template-columns: minmax(0, 1.05fr) minmax(210px, 0.75fr) minmax(220px, 0.7fr);
}

.guardian-learning-access {
    align-items: stretch;
    background: rgba(76, 151, 105, 0.08);
    border: 1px solid rgba(76, 151, 105, 0.18);
    border-radius: 14px;
    display: grid;
    gap: 0.7rem;
    padding: 0.75rem;
}

.guardian-learning-access-expired {
    background: rgba(201, 168, 76, 0.09);
    border-color: rgba(201, 168, 76, 0.22);
}

.guardian-learning-access > div {
    display: grid;
    gap: 0.45rem;
}

.guardian-learning-access strong {
    font-size: 0.8rem;
    line-height: 1.45;
}

.guardian-learning-access small {
    color: var(--muted, #66706f);
    font-size: 0.82rem;
    line-height: 1.5;
}

.guardian-learning-access .text-link {
    font-size: 0.84rem;
    justify-self: center;
}

.guardian-quote-notice {
    margin-bottom: 1rem;
}

.guardian-learning-access .button {
    justify-content: center;
    width: 100%;
}

.guardian-assessment-panel {
    margin-top: 1.25rem;
    scroll-margin-top: 1rem;
}

.guardian-assessment-score {
    align-items: center;
    background: rgba(13, 13, 13, 0.035);
    border-radius: 12px;
    display: grid;
    gap: 0.25rem;
    grid-template-columns: minmax(0, 1fr) auto;
    padding: 0.7rem;
}

.guardian-assessment-score span,
.guardian-assessment-score small {
    color: var(--mid);
    font-size: 0.72rem;
}

.guardian-assessment-score strong {
    font-family: var(--font-display, Georgia, serif);
    font-size: 1.35rem;
    grid-row: 1 / 3;
    grid-column: 2;
}

.guardian-monitor-disclosures {
    display: grid;
    gap: 0.85rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: 1.25rem;
}

.guardian-monitor-disclosure {
    margin: 0;
    padding: 0;
}

.guardian-monitor-disclosure > summary {
    align-items: center;
    cursor: pointer;
    display: grid;
    gap: 0.75rem;
    grid-template-columns: auto minmax(0, 1fr) auto auto;
    list-style: none;
    min-height: 70px;
    padding: 1rem;
}

.guardian-monitor-disclosure > summary::-webkit-details-marker {
    display: none;
}

.guardian-monitor-disclosure > summary > span:first-child {
    align-items: center;
    background: var(--teal-pale);
    border-radius: 12px;
    color: var(--teal-dark);
    display: inline-flex;
    height: 42px;
    justify-content: center;
    width: 42px;
}

.guardian-monitor-disclosure > summary h3,
.guardian-monitor-disclosure > summary p {
    margin: 0;
}

.guardian-disclosure-chevron {
    color: var(--mid);
    transition: transform 180ms ease;
}

.guardian-monitor-disclosure[open] .guardian-disclosure-chevron {
    transform: rotate(180deg);
}

.guardian-disclosure-body {
    border-top: 1px solid var(--border);
    padding: 1rem;
}

.guardian-owner-management {
    background:
        radial-gradient(circle at top right, rgba(201, 168, 76, 0.09), transparent 34%),
        linear-gradient(160deg, rgba(255, 255, 255, 0.99), rgba(249, 247, 241, 0.96));
    border-color: rgba(201, 168, 76, 0.24);
    margin-top: 1.25rem;
    scroll-margin-top: 1rem;
}

.guardian-owner-management .panel-head > div > p:last-child {
    color: var(--mid);
    line-height: 1.5;
    margin-top: 0.35rem;
}

.guardian-owner-access-grid {
    margin: 1rem 0;
}

.guardian-owner-action-row form {
    margin: 0;
}

.guardian-owner-disclosures {
    margin-bottom: 0;
}

/* Keep the family overview readable before the detailed ward list. */
.guardian-home-flow {
    display: grid;
    gap: 1.25rem;
}

.guardian-weekly-brief {
    align-items: center;
    background: linear-gradient(110deg, #eaf5f2, #ffffff 78%);
    border: 1px solid rgba(26, 107, 107, 0.2);
    border-radius: 18px;
    display: flex;
    gap: 0.9rem;
    margin: 0 0 1.25rem;
    padding: 1rem 1.15rem;
}

.guardian-weekly-brief-icon {
    align-items: center;
    background: var(--teal-dark);
    border-radius: 12px;
    color: #fff;
    display: inline-flex;
    flex: 0 0 42px;
    height: 42px;
    justify-content: center;
}

.guardian-weekly-brief > div {
    min-width: 0;
    flex: 1;
}

.guardian-weekly-brief h3,
.guardian-weekly-brief p {
    margin: 0;
}

.guardian-weekly-brief h3 {
    font-size: 1.05rem;
    margin: 0.15rem 0 0.25rem;
}

.guardian-weekly-brief > div > p:last-child {
    color: var(--mid);
    line-height: 1.5;
}

.guardian-weekly-brief > a {
    white-space: nowrap;
}

@media (max-width: 640px) {
    .guardian-weekly-brief {
        align-items: start;
        display: grid;
        grid-template-columns: 42px minmax(0, 1fr);
    }

    .guardian-weekly-brief > div {
        grid-column: 2;
        min-width: 0;
    }

    .guardian-weekly-brief > a {
        grid-column: 2;
        justify-self: start;
        white-space: normal;
    }
}

.guardian-home-flow > .guardian-home-attention,
.guardian-home-flow > .guardian-home-calm {
    margin-bottom: 0;
}

.guardian-home-attention {
    margin-bottom: 1.25rem;
}

.guardian-home-attention {
    background:
        radial-gradient(circle at top right, rgba(201, 168, 76, 0.13), transparent 36%),
        linear-gradient(150deg, rgba(255, 253, 247, 0.98), rgba(255, 255, 255, 0.98));
    border-color: rgba(201, 168, 76, 0.26);
}

.guardian-home-attention-grid {
    display: grid;
    gap: 0.8rem;
    grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr));
}

.guardian-home-alert {
    align-items: center;
    background: rgba(255, 255, 255, 0.86);
    border: 1px solid rgba(13, 13, 13, 0.08);
    border-left: 4px solid var(--gold);
    border-radius: 17px;
    display: grid;
    gap: 0.8rem;
    grid-template-columns: auto minmax(0, 1fr) auto;
    padding: 0.9rem;
}

.guardian-home-alert-warning {
    border-left-color: var(--rust);
}

.guardian-home-alert-icon {
    align-items: center;
    background: rgba(201, 168, 76, 0.13);
    border-radius: 13px;
    color: #866612;
    display: inline-flex;
    height: 44px;
    justify-content: center;
    width: 44px;
}

.guardian-home-alert-warning .guardian-home-alert-icon {
    background: rgba(192, 94, 58, 0.11);
    color: var(--rust);
}

.guardian-home-alert h4,
.guardian-home-alert p,
.guardian-home-calm p,
.guardian-home-ward-card h4,
.guardian-home-ward-card p {
    margin: 0;
}

.guardian-home-alert h4 {
    font-family: var(--font-display, Georgia, serif);
    font-size: 1.18rem;
    margin-top: 0.4rem;
    overflow-wrap: anywhere;
}

.guardian-home-alert p {
    color: var(--mid);
    font-size: 0.84rem;
    line-height: 1.5;
    margin-top: 0.25rem;
}

.guardian-home-attention-more {
    color: var(--mid);
    margin: 0.85rem 0 0;
}

.guardian-home-calm {
    align-items: center;
    background: rgba(76, 151, 105, 0.1);
    border: 1px solid rgba(76, 151, 105, 0.22);
    border-radius: 18px;
    display: flex;
    gap: 0.85rem;
    margin-bottom: 1.25rem;
    padding: 0.9rem 1rem;
}

.guardian-home-calm > span {
    color: #286b42;
    font-size: 1.25rem;
}

.guardian-home-calm p {
    color: var(--mid);
    margin-top: 0.15rem;
}

.guardian-family-summary-grid {
    display: grid;
    gap: 0.9rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-bottom: 1.25rem;
}

.guardian-family-summary-grid .oversight-overview-card {
    border-top: 3px solid var(--teal);
    box-shadow: 0 14px 34px rgba(18, 47, 47, 0.07);
}

.guardian-family-summary-grid .tone-gold {
    border-top-color: var(--gold);
}

.guardian-family-summary-grid .tone-sage {
    border-top-color: #4b9273;
}

.guardian-family-summary-grid .oversight-overview-card > strong {
    font-size: clamp(1.8rem, 3vw, 2.4rem);
}

.guardian-home-ward-list {
    display: grid;
    gap: 0.9rem;
    grid-template-columns: repeat(auto-fit, minmax(min(360px, 100%), 1fr));
}

.guardian-home-ward-card {
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.06), transparent 34%),
        rgba(255, 255, 255, 0.96);
    border: 1px solid rgba(26, 107, 107, 0.13);
    border-left: 4px solid var(--teal);
    border-radius: 20px;
    display: grid;
    gap: 0.9rem;
    padding: 1rem;
}

.guardian-home-ward-warning {
    border-left-color: var(--rust);
}

.guardian-home-ward-watch {
    border-left-color: var(--gold);
}

.guardian-home-ward-neutral {
    border-left-color: rgba(107, 101, 96, 0.45);
}

.guardian-home-ward-head {
    align-items: center;
    display: grid;
    gap: 0.75rem;
    grid-template-columns: auto minmax(0, 1fr) auto;
}

.guardian-home-ward-head h4 {
    font-family: var(--font-display, Georgia, serif);
    font-size: 1.22rem;
    overflow-wrap: anywhere;
}

.guardian-home-ward-head p {
    color: var(--mid);
    font-size: 0.8rem;
    margin-top: 0.2rem;
}

.guardian-home-progress-copy {
    align-items: center;
    color: var(--mid);
    display: flex;
    font-size: 0.8rem;
    justify-content: space-between;
}

.guardian-home-progress-copy strong {
    color: var(--ink);
    font-family: var(--font-display, Georgia, serif);
    font-size: 1.35rem;
}

.guardian-home-ward-facts {
    display: grid;
    gap: 0.5rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.guardian-home-ward-facts span {
    background: rgba(13, 13, 13, 0.035);
    border-radius: 11px;
    color: var(--mid);
    font-size: 0.74rem;
    padding: 0.6rem;
    text-align: center;
}

.guardian-home-ward-facts strong {
    color: var(--ink);
    display: block;
    font-size: 0.9rem;
}

.guardian-home-ward-card footer {
    align-items: center;
    display: flex;
    gap: 0.75rem;
    justify-content: space-between;
}

.guardian-home-ward-card footer .button {
    min-height: 45px;
}

.guardian-history-panel {
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.08), transparent 34%),
        rgba(255, 255, 255, 0.97);
    overflow: hidden;
}

.guardian-history-head {
    align-items: center;
    border-bottom: 1px solid rgba(13, 13, 13, 0.08);
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    margin-bottom: 1rem;
    padding-bottom: 1rem;
}

.guardian-history-head h3,
.guardian-history-head p,
.guardian-history-copy strong,
.guardian-history-detail,
.guardian-history-empty p {
    margin: 0;
}

.guardian-history-head h3 {
    font-family: var(--font-display, Georgia, serif);
    font-size: clamp(1.35rem, 2vw, 1.7rem);
    margin-top: 0.2rem;
}

.guardian-history-head > div > p:last-child {
    color: var(--mid);
    font-size: 0.82rem;
    line-height: 1.5;
    margin-top: 0.3rem;
}

.guardian-history-head .button {
    flex: 0 0 auto;
    min-height: 44px;
}

.guardian-history-list {
    display: grid;
    gap: 0.65rem;
}

.guardian-history-item {
    align-items: center;
    background: rgba(250, 250, 248, 0.9);
    border: 1px solid rgba(13, 13, 13, 0.08);
    border-left: 4px solid rgba(26, 107, 107, 0.55);
    border-radius: 16px;
    color: var(--ink);
    display: grid;
    gap: 0.8rem;
    grid-template-columns: auto minmax(0, 1fr) auto;
    min-width: 0;
    padding: 0.85rem;
    text-decoration: none;
    transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

a.guardian-history-item:hover,
a.guardian-history-item:focus-visible {
    border-color: rgba(26, 107, 107, 0.3);
    box-shadow: 0 12px 26px rgba(15, 23, 42, 0.08);
    color: var(--ink);
    transform: translateY(-1px);
}

.guardian-history-item-critical {
    border-left-color: var(--rust);
}

.guardian-history-item-warning {
    border-left-color: var(--gold);
}

.guardian-history-item-assessment {
    border-left-color: var(--teal);
}

.guardian-history-icon,
.guardian-history-empty > span {
    align-items: center;
    background: rgba(26, 107, 107, 0.1);
    border-radius: 13px;
    color: var(--teal);
    display: inline-flex;
    flex: 0 0 42px;
    height: 42px;
    justify-content: center;
    width: 42px;
}

.guardian-history-item-critical .guardian-history-icon {
    background: rgba(192, 94, 58, 0.11);
    color: var(--rust);
}

.guardian-history-item-warning .guardian-history-icon {
    background: rgba(201, 168, 76, 0.14);
    color: #806212;
}

.guardian-history-copy,
.guardian-history-copy > span,
.guardian-history-copy strong {
    display: block;
    min-width: 0;
}

.guardian-history-meta {
    align-items: center;
    color: var(--mid);
    display: flex !important;
    flex-wrap: wrap;
    font-family: var(--font-mono, monospace);
    font-size: 0.6rem;
    gap: 0.35rem 0.7rem;
    justify-content: space-between;
    letter-spacing: 0.08em;
    margin-bottom: 0.28rem;
    text-transform: uppercase;
}

.guardian-history-copy strong {
    font-size: 0.94rem;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.guardian-history-detail {
    color: var(--mid);
    font-size: 0.8rem;
    line-height: 1.5;
    margin-top: 0.22rem;
    overflow-wrap: anywhere;
}

.guardian-history-arrow {
    color: var(--teal);
    font-size: 0.78rem;
}

.guardian-history-empty {
    align-items: center;
    background: rgba(232, 244, 244, 0.48);
    border: 1px dashed rgba(26, 107, 107, 0.22);
    border-radius: 16px;
    display: flex;
    gap: 0.8rem;
    padding: 1rem;
}

.guardian-history-empty p {
    color: var(--mid);
    font-size: 0.82rem;
    line-height: 1.5;
    margin-top: 0.2rem;
}

@media (max-width: 900px) {
    .guardian-create-layout {
        grid-template-columns: minmax(0, 1fr);
    }

    .guardian-learning-row,
    .guardian-assessment-grid,
    .guardian-attention-grid,
    .guardian-ward-command-grid,
    .guardian-curriculum-progress-row,
    .guardian-monitor-disclosures {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 620px) {
    .guardian-create-fields {
        grid-template-columns: minmax(0, 1fr);
    }

    .guardian-create-card,
    .guardian-create-guide {
        padding: 1rem;
    }

    .guardian-mobile-form-actions.guardian-create-actions {
        background: none;
        bottom: auto;
        margin: 0;
        padding: 1rem 0 0;
        position: static;
    }

    .guardian-monitor-jump-nav {
        margin-bottom: 1rem;
    }

    .guardian-learning-row {
        align-items: stretch;
    }

    .guardian-assessment-top,
    .guardian-assessment-meta {
        align-items: flex-start;
        flex-direction: column;
    }

    .guardian-profile-exit-panel {
        align-items: stretch;
        flex-direction: column;
    }

    .guardian-profile-exit-panel .student-profile-logout-button {
        justify-content: center;
        width: 100%;
    }

    .guardian-management-hero .school-hero-actions,
    .guardian-management-hero .school-hero-actions .button,
    .guardian-danger-zone,
    .guardian-danger-zone .button,
    .guardian-inline-invite-form,
    .guardian-inline-invite-form .button {
        width: 100%;
    }

    .guardian-danger-zone {
        align-items: stretch;
        flex-direction: column;
    }

    .guardian-danger-zone .button,
    .guardian-inline-invite-form .button {
        justify-content: center;
    }

    .guardian-inline-invite-form {
        align-items: stretch;
        grid-template-columns: minmax(0, 1fr);
    }

    .guardian-mobile-form-actions {
        bottom: var(--workspace-mobile-nav-clearance, 6.5rem);
        display: grid;
        gap: 0.55rem;
        grid-template-columns: minmax(0, 1fr);
        margin: 0.35rem -0.4rem -0.4rem;
        padding: 0.7rem 0.4rem 0.4rem;
        position: sticky;
        z-index: 18;
        background: linear-gradient(to bottom, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.98) 24%);
    }

    .guardian-mobile-form-actions .button {
        justify-content: center;
        min-height: 48px;
        width: 100%;
    }

    .guardian-form-card,
    .guardian-profile-card {
        padding: 1rem;
    }

    .guardian-form-card-head {
        gap: 0.7rem;
    }

    .guardian-form-card-head > span {
        flex-basis: 42px;
        height: 42px;
    }

    .guardian-home-hero .school-hero-actions {
        display: none;
    }

    .guardian-home-attention-grid,
    .guardian-home-ward-list {
        grid-template-columns: minmax(0, 1fr);
    }

    .guardian-home-alert {
        align-items: start;
        grid-template-columns: auto minmax(0, 1fr);
    }

    .guardian-home-alert .button {
        grid-column: 1 / -1;
        justify-content: center;
        width: 100%;
    }

    .guardian-family-summary-grid {
        gap: 0.55rem;
    }

    .guardian-family-summary-grid .oversight-overview-card {
        min-width: 0;
        padding: 0.75rem;
    }

    .guardian-family-summary-grid .oversight-overview-top {
        align-items: flex-start;
        flex-direction: column;
    }

    .guardian-family-summary-grid .oversight-overview-icon {
        height: 36px;
        width: 36px;
    }

    .guardian-family-summary-grid .student-pulse-label {
        font-size: 0.56rem;
        overflow-wrap: anywhere;
    }

    .guardian-home-ward-head {
        align-items: start;
        grid-template-columns: auto minmax(0, 1fr);
    }

    .guardian-home-ward-head .guardian-status {
        grid-column: 1 / -1;
    }

    .guardian-home-ward-card footer {
        align-items: stretch;
        flex-direction: column;
    }

    .guardian-home-ward-card footer .button {
        justify-content: center;
        width: 100%;
    }

    .guardian-history-head {
        align-items: stretch;
        flex-direction: column;
    }

    .guardian-history-head .button {
        justify-content: center;
        width: 100%;
    }

    .guardian-history-item {
        align-items: start;
        gap: 0.65rem;
        grid-template-columns: auto minmax(0, 1fr);
        padding: 0.75rem;
    }

    .guardian-history-arrow {
        display: none;
    }

    .guardian-history-meta {
        align-items: flex-start;
        flex-direction: column;
        gap: 0.15rem;
    }

    .guardian-current-facts {
        grid-template-columns: minmax(0, 1fr);
    }

    .guardian-ward-stat-grid {
        gap: 0.55rem;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .guardian-ward-stat-grid .oversight-overview-card {
        min-width: 0;
        padding: 0.75rem;
    }

    .guardian-learning-row {
        padding: 0.85rem;
    }

    .guardian-learning-copy {
        align-items: flex-start;
    }

    .guardian-monitor-disclosure > summary {
        grid-template-columns: auto minmax(0, 1fr) auto;
    }

    .guardian-monitor-disclosure > summary .pill {
        display: none;
    }

    .guardian-owner-access-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .guardian-owner-action-row,
    .guardian-owner-action-row form,
    .guardian-owner-action-row .button,
    .guardian-next-action .button {
        justify-content: center;
        width: 100%;
    }
}

/* Guardian phones reserve a real navigation row so controls never sit beneath it. */
@media (max-width: 900px) {
    .app-shell.has-guardian-mobile-nav .app-main,
    .app-shell.has-guardian-mobile-nav.sidebar-collapsed .app-main {
        display: grid;
        grid-template-rows: minmax(0, 1fr) auto;
        height: 100vh;
        height: 100dvh;
        min-height: 0;
        overflow: hidden;
    }

    .app-shell.has-guardian-mobile-nav .workspace-scroll-region {
        display: block;
        min-height: 0;
        overflow-x: hidden;
        overflow-y: auto;
        overscroll-behavior-y: contain;
        scroll-padding-bottom: 1rem;
        -webkit-overflow-scrolling: touch;
    }

    .app-shell.has-workspace-mobile-nav .app-header {
        position: relative;
        top: auto;
        align-items: start;
        display: grid;
        gap: 0.75rem;
        grid-template-columns: minmax(0, 1fr) auto;
        min-height: 0;
        padding: 0.75rem max(0.85rem, env(safe-area-inset-right, 0px)) 0.8rem max(0.85rem, env(safe-area-inset-left, 0px));
        background:
            radial-gradient(circle at 8% 0%, rgba(26, 107, 107, 0.1), transparent 55%),
            rgba(255, 255, 255, 0.96);
    }

    .app-shell.has-guardian-mobile-nav .app-header-main {
        gap: 0.16rem;
        width: 100%;
    }

    .app-shell.has-guardian-mobile-nav .guardian-mobile-brand {
        align-items: center;
        display: inline-flex;
        gap: 0.55rem;
        min-height: 42px;
        min-width: 0;
        width: fit-content;
        max-width: 100%;
        color: var(--ink);
        text-decoration: none;
    }

    .guardian-mobile-brand img {
        flex: 0 0 40px;
        width: 40px;
        height: 40px;
        padding: 3px;
        border: 1px solid rgba(26, 107, 107, 0.12);
        border-radius: 12px;
        background: #fff;
        object-fit: contain;
    }

    .guardian-mobile-brand-copy {
        display: grid;
        gap: 0.05rem;
        min-width: 0;
    }

    .guardian-mobile-brand-copy strong {
        font-family: var(--font-display, Georgia, serif);
        font-size: 0.98rem;
        line-height: 1.05;
        white-space: nowrap;
    }

    .guardian-mobile-brand-copy small {
        color: var(--teal);
        font-size: 0.57rem;
        font-weight: 700;
        letter-spacing: 0.09em;
        text-transform: uppercase;
        white-space: nowrap;
    }

    .app-shell.has-workspace-mobile-nav .app-header-badge-row,
    .app-shell.has-workspace-mobile-nav .app-shell-chip,
    .app-shell.has-workspace-mobile-nav .app-header-copy,
    .app-shell.has-workspace-mobile-nav .student-header-primary-action,
    .app-shell.has-workspace-mobile-nav .app-header-meta {
        display: none;
    }

    .app-shell.has-guardian-mobile-nav .app-header h1 {
        font-size: clamp(1.04rem, 2.4vw, 1.2rem);
        line-height: 1.18;
        margin-top: 0.28rem;
    }

    .app-shell.has-guardian-mobile-nav .app-header-mobile-identity {
        align-items: baseline;
        color: var(--mid);
        display: flex;
        gap: 0.35rem;
        min-width: 0;
        margin: 0;
    }

    .app-shell.has-guardian-mobile-nav .app-header-mobile-identity span {
        flex: 0 0 auto;
        font-family: "Space Mono", monospace;
        font-size: 0.52rem;
        letter-spacing: 0.06em;
        text-transform: uppercase;
    }

    .app-shell.has-guardian-mobile-nav .app-header-mobile-identity strong {
        min-width: 0;
        overflow: hidden;
        color: var(--ink);
        font-size: 0.7rem;
        line-height: 1.3;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .app-shell.has-workspace-mobile-nav .header-right {
        align-items: start;
        flex-wrap: nowrap;
        justify-content: flex-end;
        max-width: none;
        width: auto;
    }

    .app-shell.has-guardian-mobile-nav .app-content {
        min-height: auto;
        overflow: visible;
        padding-bottom: 1rem;
    }

    .app-shell.has-guardian-mobile-nav .workspace-mobile-nav {
        bottom: auto;
        left: auto;
        margin: 0.45rem max(0.7rem, env(safe-area-inset-right, 0px)) max(0.55rem, env(safe-area-inset-bottom, 0px)) max(0.7rem, env(safe-area-inset-left, 0px));
        position: relative;
        right: auto;
        width: auto;
    }

    .app-shell.has-guardian-mobile-nav .student-mobile-nav-item span {
        white-space: normal;
    }

    .app-shell.has-guardian-mobile-nav .guardian-notification-toolbar,
    .app-shell.has-guardian-mobile-nav .guardian-quote-mobile-summary:not([hidden]),
    .app-shell.has-guardian-mobile-nav .guardian-mobile-form-actions {
        bottom: 0.5rem;
    }
}

@media (max-width: 620px) {
    .app-shell.has-workspace-mobile-nav .notif-dropdown {
        position: absolute;
        right: -1.75rem;
        top: calc(100% + 0.55rem);
        width: min(340px, calc(100vw - 1.5rem));
    }
}

/* Keep authentication and compact-header overrides last in the cascade. */
.auth-page main {
    background-color: #f7f3ea;
    background-image:
        radial-gradient(circle at 12% 4%, rgba(26, 107, 107, 0.1), transparent 26rem),
        linear-gradient(rgba(247, 243, 234, 0.54), rgba(247, 243, 234, 0.54)),
        url("../images/landing-pattern-tile.6b38640f527d.webp");
    background-position: top left, top left, top left;
    background-repeat: no-repeat, no-repeat, repeat;
    background-size: auto, auto, 560px 560px;
}

.auth-page .auth-revamp-section,
.auth-page .classroom-entry-section,
.auth-page main > .auth-section {
    background-color: transparent;
    background-image:
        radial-gradient(circle at top left, rgba(26, 107, 107, 0.1), transparent 32%),
        radial-gradient(circle at bottom right, rgba(232, 201, 122, 0.17), transparent 34%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.76), rgba(245, 240, 232, 0.62)),
        url("../images/landing-pattern-tile.6b38640f527d.webp");
    background-position: top left, bottom right, top left, top left;
    background-repeat: no-repeat, no-repeat, no-repeat, repeat;
    background-size: auto, auto, auto, 560px 560px;
}

@media (min-width: 901px) and (max-width: 1180px) {
    .landing-page .top-nav {
        gap: 0.55rem;
        padding-inline: 1rem;
    }

    .landing-page .nav-links {
        gap: 0.8rem;
    }

    .landing-page .nav-links a {
        font-size: 0.79rem;
    }

    .landing-page .nav-links a i,
    .landing-page .nav-auth-link i,
    .landing-page .nav-logo-wordmark small {
        display: none;
    }

    .landing-page .nav-auth {
        gap: 0.25rem;
    }

    .landing-page .nav-auth-link {
        padding-inline: 0.62rem;
        font-size: 0.76rem;
    }
}

/* Keep the shared learning pattern visible across the public catalogue and guide pages. */
.landing-courses .course-discovery-hero,
.platform-guides-page .platform-guides-hero {
    background-color: #f7f3ea;
    background-image:
        radial-gradient(circle at 82% 18%, rgba(46, 158, 158, 0.17), transparent 28rem),
        linear-gradient(rgba(247, 243, 234, 0.38), rgba(247, 243, 234, 0.38)),
        url("../images/landing-pattern-tile.6b38640f527d.webp");
    background-position: top left, top left, top left;
    background-repeat: no-repeat, no-repeat, repeat;
    background-size: auto, auto, 560px 560px;
}

.platform-guides-page .platform-guide-library {
    background: rgba(255, 255, 255, 0.2);
}

@media (max-width: 640px) {
    .landing-courses .course-discovery-hero,
    .platform-guides-page .platform-guides-hero {
        background-image:
            radial-gradient(circle at 88% 12%, rgba(46, 158, 158, 0.14), transparent 18rem),
            linear-gradient(rgba(247, 243, 234, 0.34), rgba(247, 243, 234, 0.34)),
            url("../images/landing-pattern-tile.6b38640f527d.webp");
        background-size: auto, auto, 430px 430px;
    }
}

/* Public course marketplace and preview refresh. */
.course-discovery-hero {
    grid-template-columns: minmax(0, 1.15fr) minmax(320px, 0.58fr);
    align-items: center;
    border-bottom: 1px solid rgba(13, 13, 13, 0.07);
}

.course-discovery-assurances {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
}

.course-discovery-assurances span {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    min-height: 2.4rem;
    padding: 0.55rem 0.78rem;
    border: 1px solid rgba(26, 107, 107, 0.14);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.68);
    color: var(--ink);
    font-size: 0.78rem;
    font-weight: 700;
}

.course-discovery-assurances i {
    color: var(--teal);
}

.course-discovery-summary {
    grid-template-columns: minmax(0, 1fr);
    align-content: center;
    gap: 1.15rem;
    padding: clamp(1.15rem, 2vw, 1.55rem);
    border-radius: 28px;
    background:
        radial-gradient(circle at top right, rgba(232, 201, 122, 0.2), transparent 42%),
        rgba(255, 255, 255, 0.9);
}

.course-discovery-paths {
    display: grid;
    gap: 0.55rem;
}

.course-discovery-path {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.8rem;
    min-height: 4.2rem;
    padding: 0.72rem 0.9rem;
    border: 1px solid rgba(26, 107, 107, 0.14);
    border-radius: 17px;
    background: #eef7f4;
    color: #123d43;
    text-decoration: none;
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.course-discovery-path.is-independent {
    border-color: rgba(195, 149, 43, 0.2);
    background: #fcf7eb;
}

.course-discovery-path:is(:hover, :focus-visible) {
    transform: translateY(-2px);
    border-color: var(--teal);
    box-shadow: 0 8px 20px rgba(13, 69, 83, 0.1);
}

.course-discovery-path-icon {
    display: grid;
    width: 2.65rem;
    height: 2.65rem;
    place-items: center;
    border-radius: 12px;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
}

.course-discovery-path.is-independent .course-discovery-path-icon {
    background: rgba(195, 149, 43, 0.13);
    color: #815a11;
}

.course-discovery-path-copy {
    display: flex;
    align-items: baseline;
    gap: 0.6rem;
    min-width: 0;
    font-size: 0.83rem;
    font-weight: 700;
    line-height: 1.3;
}

.course-discovery-path-copy strong {
    font-family: "Playfair Display", serif;
    font-size: 2rem;
    line-height: 1;
}

.course-discovery-path-arrow {
    color: var(--teal);
    font-size: 0.8rem;
}

.course-discovery-summary-copy h2 {
    margin: 0.35rem 0 0.55rem;
    font-size: clamp(1.35rem, 2.2vw, 1.85rem);
}

.course-discovery-summary-copy > p:last-child {
    margin: 0;
    color: var(--mid);
    font-size: 0.83rem;
    line-height: 1.55;
}

.course-marketplace-layout {
    display: grid;
    grid-template-columns: minmax(230px, 0.3fr) minmax(0, 1fr);
    gap: clamp(1.1rem, 2.4vw, 2rem);
    align-items: start;
    scroll-margin-top: 5rem;
}

#curriculum-catalog-title {
    scroll-margin-top: 5rem;
}

.curriculum-catalog-section {
    display: grid;
    gap: clamp(1.15rem, 2.6vw, 1.75rem);
    padding: clamp(1.1rem, 3vw, 2rem);
    border: 1px solid rgba(26, 107, 107, 0.12);
    border-radius: 28px;
    background: linear-gradient(145deg, rgba(237, 248, 245, 0.94), rgba(255, 252, 244, 0.92));
    box-shadow: 0 18px 46px rgba(13, 69, 83, 0.055);
}

.curriculum-catalog-heading,
.curriculum-catalog-level-heading,
.curriculum-catalog-card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.curriculum-catalog-heading h2 {
    margin: 0.25rem 0 0;
    font-size: clamp(1.55rem, 3vw, 2.15rem);
}

.curriculum-catalog-heading p:last-child {
    margin: 0.4rem 0 0;
    color: var(--mid);
}

.curriculum-catalog-total,
.curriculum-catalog-level-heading span {
    flex: none;
    color: var(--teal);
    font-size: 0.76rem;
    font-weight: 800;
}

.curriculum-catalog-total {
    padding: 0.5rem 0.8rem;
    border-radius: 999px;
    background: rgba(26, 107, 107, 0.1);
}

.curriculum-catalog-level {
    display: grid;
    gap: 0.75rem;
}

.curriculum-catalog-level + .curriculum-catalog-level {
    padding-top: 1rem;
    border-top: 1px solid rgba(26, 107, 107, 0.13);
}

.curriculum-catalog-level-heading h3 {
    margin: 0;
    font-family: "Space Mono", monospace;
    font-size: 0.82rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.curriculum-catalog-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.8rem;
}

.curriculum-catalog-card {
    padding: 0;
}

.curriculum-catalog-card .curriculum-subject-cover {
    background: linear-gradient(135deg, #d8eeeb, #b9d7d2 56%, #e7ca79);
}

.curriculum-catalog-card .public-course-facts span:first-child {
    flex-basis: auto;
}

.curriculum-catalog-card .curriculum-access-label {
    font-size: clamp(1.08rem, 1.7vw, 1.25rem);
}

.admin-subject-cover-preview {
    display: grid;
    gap: 0.35rem;
    width: min(100%, 280px);
    color: var(--mid);
    font-size: 0.78rem;
}

.admin-subject-cover-preview img {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    border: 1px solid rgba(13, 69, 83, 0.14);
    border-radius: 12px;
}

@media (max-width: 1000px) {
    .curriculum-catalog-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .curriculum-catalog-heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .curriculum-catalog-grid {
        grid-template-columns: 1fr;
    }
}

.course-filter-panel {
    position: sticky;
    top: 6.2rem;
    display: grid;
    gap: 1.15rem;
    padding: 1.2rem;
    border: 1px solid rgba(13, 13, 13, 0.09);
    border-radius: 24px;
    background:
        radial-gradient(circle at top right, rgba(26, 107, 107, 0.08), transparent 38%),
        rgba(255, 255, 255, 0.9);
    box-shadow: 0 18px 45px rgba(13, 13, 13, 0.06);
}

.course-filter-panel-head,
.course-results-panel .courses-results-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem;
}

.course-filter-panel-head h2,
.course-results-panel .courses-results-head h2 {
    margin: 0.22rem 0 0;
    font-size: clamp(1.45rem, 2vw, 2rem);
}

.course-filter-clear {
    border: 0;
    background: transparent;
    color: var(--teal);
    font: inherit;
    font-size: 0.78rem;
    font-weight: 800;
    cursor: pointer;
}

.course-filter-clear:hover,
.course-filter-clear:focus-visible {
    text-decoration: underline;
    text-underline-offset: 0.22em;
}

.course-filter-panel .landing-course-search {
    min-height: 50px;
    padding-inline: 0.85rem;
    border-radius: 15px;
}

.course-filter-block {
    display: grid;
    gap: 0.65rem;
}

.course-filter-block + .course-filter-block {
    padding-top: 1rem;
    border-top: 1px solid rgba(13, 13, 13, 0.08);
}

.course-filter-label {
    color: var(--ink);
    font-family: "Space Mono", monospace;
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.course-filter-panel .landing-filter-group {
    display: grid;
    gap: 0.45rem;
}

.course-filter-panel .landing-access-filter {
    padding-top: 0;
    border-top: 0;
}

.course-filter-panel :is(.filter-pill-button, .access-tab-button) {
    width: 100%;
    justify-content: flex-start;
    min-height: 2.55rem;
    padding-inline: 0.8rem;
    text-align: left;
}

.course-results-panel {
    min-width: 0;
}

.course-results-panel .courses-results-head {
    margin-bottom: 1rem;
    padding: 0 0 0.7rem;
    border-bottom: 1px solid rgba(13, 13, 13, 0.08);
}

.course-results-panel .courses-results-copy {
    white-space: nowrap;
}

.course-results-panel .landing-catalog-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.15rem;
}

.public-course-card {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    border: 1px solid rgba(13, 69, 83, 0.13);
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 14px 32px rgba(13, 69, 83, 0.075);
}

.public-course-card:hover {
    transform: translateY(-4px);
    border-color: rgba(26, 107, 107, 0.3);
    box-shadow: 0 22px 42px rgba(13, 69, 83, 0.13);
}

.landing-catalog-grid .public-course-card .c-thumb,
.public-course-card .c-thumb {
    height: 185px;
    flex: none;
    overflow: hidden;
}

.public-course-card .c-thumb:not(.has-course-thumbnail)::before {
    content: "";
    position: absolute;
    width: 15rem;
    height: 15rem;
    right: -3rem;
    top: -7rem;
    border: 1px solid rgba(255, 255, 255, 0.55);
    border-radius: 50%;
    box-shadow: 0 0 0 2.7rem rgba(255, 255, 255, 0.09), 0 0 0 5.4rem rgba(255, 255, 255, 0.07);
}

.public-course-card .c-thumb::after {
    content: "";
    position: absolute;
    inset: auto 0 0;
    height: 55%;
    background: linear-gradient(180deg, transparent, rgba(9, 51, 68, 0.24));
    pointer-events: none;
}

.course-card-code {
    position: relative;
    z-index: 1;
    display: inline-grid;
    width: 6.5rem;
    height: 6.5rem;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.8);
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.72);
    color: #0d4553;
    font-size: 1.5rem;
    font-weight: 800;
    box-shadow: 0 18px 32px rgba(13, 69, 83, 0.14);
}

.course-cover-level {
    position: absolute;
    z-index: 2;
    bottom: 0.85rem;
    left: 0.95rem;
    max-width: calc(100% - 1.9rem);
    overflow: hidden;
    padding: 0.38rem 0.7rem;
    border: 1px solid rgba(255, 255, 255, 0.45);
    border-radius: 999px;
    background: rgba(13, 52, 62, 0.78);
    color: #fff;
    font-family: "Space Mono", monospace;
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-overflow: ellipsis;
    white-space: nowrap;
    backdrop-filter: blur(8px);
}

.public-course-card .c-badge {
    z-index: 1;
    top: 0.85rem;
    right: 0.85rem;
    padding: 0.42rem 0.65rem;
    border: 1px solid rgba(255, 255, 255, 0.58);
    border-radius: 999px;
    background: rgba(13, 13, 13, 0.72);
    color: #fff;
    backdrop-filter: blur(10px);
}

.public-course-card .c-badge.free {
    background: rgba(13, 69, 83, 0.86);
    color: #fff;
}

.landing-catalog-grid .public-course-card .c-body,
.public-course-card .c-body {
    display: flex;
    flex: 1;
    flex-direction: column;
    min-width: 0;
    padding: 1.2rem;
}

.public-course-card .public-course-head {
    align-items: flex-start;
    flex-direction: column;
    gap: 0.4rem;
    margin-bottom: 0.8rem;
}

.public-course-card .c-tag {
    margin: 0;
    font-weight: 800;
}

.public-course-card .public-course-path {
    letter-spacing: 0;
    line-height: 1.4;
    text-transform: none;
}

.public-course-card h3 {
    min-height: 0;
    margin-bottom: 0.6rem;
    font-size: clamp(1.35rem, 2vw, 1.65rem);
    line-height: 1.2;
    overflow-wrap: break-word;
}

.landing-catalog-grid .public-course-card .public-course-outcome,
.public-course-card .public-course-outcome {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    min-height: 0;
    margin-bottom: 1rem;
    font-size: 0.86rem;
    line-height: 1.6;
}

.public-course-facts {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    margin: 0 0 1rem;
    padding: 0;
    border: 0;
}

.public-course-facts span {
    display: inline-flex;
    min-width: 0;
    align-items: center;
    gap: 0.45rem;
    padding: 0.42rem 0.6rem;
    border-radius: 9px;
    background: #f1f6f4;
    color: #365356;
    font-size: 0.73rem;
    line-height: 1.35;
}

.public-course-facts span:first-child {
    flex-basis: 100%;
}

.public-course-facts strong {
    min-width: 0;
    overflow-wrap: break-word;
}

.public-course-facts i {
    color: var(--teal);
}

.public-course-footer {
    display: grid;
    gap: 0.75rem;
    width: 100%;
    margin-top: auto;
    padding-top: 0.9rem;
    border-top: 1px solid rgba(13, 69, 83, 0.1);
}

.public-course-price-block {
    display: grid;
    gap: 0.15rem;
    min-width: 0;
}

.public-course-price-label {
    color: var(--mid);
    font-family: "Space Mono", monospace;
    font-size: 0.61rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.public-course-footer .c-price {
    overflow-wrap: break-word;
    color: var(--ink);
    font-family: "Playfair Display", serif;
    font-size: clamp(1.12rem, 1.7vw, 1.3rem);
    font-weight: 700;
    line-height: 1.3;
}

.landing-catalog-grid .public-course-footer .btn,
.public-course-footer .btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.6rem;
    width: 100%;
    min-height: 2.8rem;
    padding: 0.7rem 0.9rem;
    border-radius: 12px;
    text-align: left;
    white-space: normal;
}

.public-course-footer .btn i {
    flex: none;
}

@media (prefers-reduced-motion: reduce) {
    .course-discovery-path {
        transition: none;
    }

    .course-discovery-path:is(:hover, :focus-visible) {
        transform: none;
    }

    .curriculum-catalog-card,
    .public-course-card {
        transition: none;
    }

    .curriculum-catalog-card:hover,
    .public-course-card:hover {
        transform: none;
    }
}

.course-preview-hero {
    grid-template-columns: minmax(0, 1.15fr) minmax(340px, 0.55fr);
    align-items: center;
    border-bottom: 1px solid rgba(13, 13, 13, 0.07);
}

.public-curriculum-hero .course-preview-cover-media {
    background: linear-gradient(135deg, #d8eeeb, #b9d7d2 56%, #e7ca79);
}

.public-curriculum-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.7rem;
    margin-top: 1.5rem;
}

.public-curriculum-cover-caption {
    display: grid;
    gap: 0.25rem;
    padding: 1rem 1.2rem;
}

.public-curriculum-cover-caption span {
    color: var(--teal);
    font-family: "Space Mono", monospace;
    font-size: 0.66rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.public-curriculum-cover-caption strong {
    font-family: "Playfair Display", serif;
    font-size: 1.15rem;
}

.public-curriculum-structure-section {
    padding-top: clamp(2rem, 4vw, 3rem);
}

.public-curriculum-structure-shell {
    display: grid;
    gap: 1.2rem;
    max-width: 1180px;
    margin-inline: auto;
}

.public-curriculum-section-head h2 {
    margin: 0.25rem 0 0.5rem;
}

.public-curriculum-section-head p:last-child {
    max-width: 690px;
    margin: 0;
    color: var(--mid);
    line-height: 1.6;
}

.public-curriculum-tree {
    max-height: min(70vh, 730px);
    overflow: auto;
    border: 1px solid rgba(13, 69, 83, 0.14);
    border-radius: 22px;
    background: #fff;
    scrollbar-gutter: stable;
}

.public-curriculum-tree .admin-structure-tree-link {
    overflow-wrap: break-word;
}

.public-curriculum-next {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.15rem 1.4rem;
    border: 1px solid rgba(26, 107, 107, 0.15);
    border-radius: 20px;
    background: linear-gradient(120deg, #e8f4f4, #fff9eb);
}

.public-curriculum-next p {
    margin: 0.2rem 0 0;
    color: var(--mid);
}

@media (max-width: 700px) {
    .public-curriculum-next {
        align-items: stretch;
        flex-direction: column;
    }

    .public-curriculum-next .button {
        justify-content: center;
    }

    .public-curriculum-tree {
        max-height: 65vh;
    }
}

.course-preview-back {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    width: fit-content;
    margin-bottom: 1.25rem;
    color: var(--ink);
    font-size: 0.78rem;
    font-weight: 800;
    text-decoration: none;
}

.course-preview-back:hover,
.course-preview-back:focus-visible {
    color: var(--teal);
}

.course-preview-hero-facts {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
}

.course-preview-hero-facts > span {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.08rem 0.55rem;
    min-width: 8.5rem;
    padding: 0.72rem 0.85rem;
    border: 1px solid rgba(13, 13, 13, 0.08);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.68);
}

.course-preview-hero-facts i {
    grid-row: span 2;
    align-self: center;
    color: var(--teal);
}

.course-preview-hero-facts small {
    color: var(--mid);
    font-size: 0.65rem;
}

.course-preview-hero-facts strong {
    overflow: hidden;
    color: var(--ink);
    font-size: 0.82rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.course-preview-cover {
    overflow: hidden;
    border: 1px solid rgba(13, 13, 13, 0.09);
    border-radius: 28px;
    background: rgba(255, 255, 255, 0.92);
    box-shadow: 0 24px 55px rgba(13, 13, 13, 0.1);
}

.course-preview-cover-media {
    position: relative;
    display: grid;
    aspect-ratio: 16 / 10;
    place-items: center;
    overflow: hidden;
    background: linear-gradient(135deg, rgba(26, 107, 107, 0.18), rgba(46, 158, 158, 0.34));
}

.course-preview-cover-media.math {
    background: linear-gradient(135deg, rgba(201, 168, 76, 0.18), rgba(232, 201, 122, 0.38));
}

.course-preview-cover-media.prac {
    background: linear-gradient(135deg, rgba(192, 94, 58, 0.18), rgba(216, 122, 90, 0.36));
}

.course-preview-cover-media.exam {
    background: linear-gradient(135deg, rgba(122, 173, 138, 0.18), rgba(201, 168, 76, 0.3));
}

.course-preview-cover-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.course-preview-cover-media > span {
    color: #0d4553;
    font-family: "Space Mono", monospace;
    font-size: clamp(2.2rem, 5vw, 4rem);
    font-weight: 800;
    letter-spacing: 0.08em;
}

.course-preview-cover-media > i {
    position: absolute;
    right: 1.3rem;
    bottom: 1rem;
    color: rgba(13, 69, 83, 0.2);
    font-size: 4.5rem;
    transform: rotate(-8deg);
}

.course-preview-cover-caption {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.1rem;
}

.course-preview-cover-caption strong {
    font-size: 0.84rem;
}

.course-preview-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(300px, 0.34fr);
    gap: clamp(1.1rem, 2.4vw, 2rem);
    align-items: start;
}

.course-preview-main {
    display: grid;
    gap: 1.25rem;
    min-width: 0;
}

.course-preview-overview,
.course-preview-curriculum,
.course-preview-access {
    border: 1px solid rgba(13, 13, 13, 0.09);
    border-radius: 26px;
    background: rgba(255, 255, 255, 0.92);
    box-shadow: 0 18px 46px rgba(13, 13, 13, 0.055);
}

.course-preview-overview,
.course-preview-curriculum {
    padding: clamp(1.25rem, 2.5vw, 1.8rem);
}

.course-preview-overview h2,
.course-preview-section-head h2 {
    margin: 0.35rem 0 0.7rem;
    font-size: clamp(1.75rem, 3vw, 2.55rem);
    line-height: 1.08;
}

.course-preview-description {
    max-width: 72ch;
    color: var(--mid);
    line-height: 1.75;
}

.course-preview-value-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
    margin-top: 1.25rem;
}

.course-preview-value-grid > div {
    display: grid;
    gap: 0.45rem;
    padding: 1rem;
    border-radius: 18px;
    background: rgba(245, 240, 232, 0.72);
}

.course-preview-value-grid span {
    display: inline-grid;
    width: 2.5rem;
    height: 2.5rem;
    place-items: center;
    border-radius: 13px;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
}

.course-preview-value-grid p {
    margin: 0;
    color: var(--mid);
    font-size: 0.84rem;
    line-height: 1.55;
}

.course-preview-section-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
}

.course-preview-section-head > span {
    padding-bottom: 0.55rem;
    color: var(--mid);
    font-size: 0.78rem;
    white-space: nowrap;
}

.course-preview-modules {
    display: grid;
    gap: 0.75rem;
}

.course-preview-module {
    overflow: hidden;
    border: 1px solid rgba(13, 13, 13, 0.08);
    border-radius: 18px;
    background: rgba(245, 240, 232, 0.48);
}

.course-preview-module summary {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto auto;
    gap: 0.8rem;
    align-items: center;
    min-height: 4.8rem;
    padding: 0.85rem 1rem;
    cursor: pointer;
    list-style: none;
}

.course-preview-module summary::-webkit-details-marker {
    display: none;
}

.course-preview-module-number {
    display: inline-grid;
    width: 2.7rem;
    height: 2.7rem;
    place-items: center;
    border-radius: 14px;
    background: #0d4553;
    color: #fff;
    font-family: "Space Mono", monospace;
    font-size: 0.72rem;
}

.course-preview-module-title {
    min-width: 0;
}

.course-preview-module-title small,
.course-preview-module-title strong {
    display: block;
}

.course-preview-module-title small {
    margin-bottom: 0.15rem;
    color: var(--teal);
    font-family: "Space Mono", monospace;
    font-size: 0.58rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.course-preview-module-title strong {
    overflow-wrap: anywhere;
}

.course-preview-module-count {
    color: var(--mid);
    font-size: 0.74rem;
}

.course-preview-module summary > i {
    color: var(--teal);
    transition: transform 0.2s ease;
}

.course-preview-module[open] summary > i {
    transform: rotate(180deg);
}

.course-preview-module .landing-lesson-list {
    padding: 0 0.75rem 0.75rem;
}

.course-preview-module .landing-lesson-row {
    background: rgba(255, 255, 255, 0.88);
}

.course-preview-lesson-state {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    color: var(--mid);
    font-size: 0.72rem;
    font-weight: 800;
}

.course-preview-module .is-preview .course-preview-lesson-state {
    color: var(--teal);
}

.course-preview-empty {
    display: flex;
    gap: 0.9rem;
    align-items: center;
    padding: 1.1rem;
    border-radius: 18px;
    background: rgba(245, 240, 232, 0.72);
}

.course-preview-empty > i {
    color: var(--teal);
    font-size: 1.5rem;
}

.course-preview-empty h3,
.course-preview-empty p {
    margin: 0;
}

.course-preview-empty p {
    margin-top: 0.2rem;
    color: var(--mid);
}

.course-preview-access {
    position: sticky;
    top: 6.2rem;
    display: grid;
    gap: 0.85rem;
    padding: 1.3rem;
    background:
        radial-gradient(circle at top right, rgba(232, 201, 122, 0.2), transparent 38%),
        rgba(255, 255, 255, 0.96);
}

.course-preview-access-price {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid rgba(13, 13, 13, 0.08);
}

.course-preview-access-price span {
    max-width: 11rem;
    color: var(--mid);
    font-size: 0.76rem;
    line-height: 1.35;
}

.course-preview-access-price strong {
    color: var(--ink);
    font-family: "Playfair Display", serif;
    font-size: 1.8rem;
    white-space: nowrap;
}

.course-preview-access.landing-detail-next h2 {
    margin: 0;
    font-size: clamp(1.35rem, 2vw, 1.8rem);
}

.course-preview-access.landing-detail-next p {
    margin: 0;
}

.course-preview-access .btn {
    width: 100%;
    margin-top: 0.2rem;
}

.course-preview-access-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.6rem;
    padding: 0.75rem 0.2rem;
    color: var(--teal);
    font-size: 0.82rem;
    font-weight: 800;
    text-decoration: none;
}

.course-preview-access-details {
    display: grid;
    gap: 0.65rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(13, 13, 13, 0.08);
}

.course-preview-access-details > div {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.7rem;
    align-items: center;
}

.course-preview-access-details > div > i {
    display: inline-grid;
    width: 2.25rem;
    height: 2.25rem;
    place-items: center;
    border-radius: 11px;
    background: rgba(26, 107, 107, 0.1);
    color: var(--teal);
}

.course-preview-access-details small,
.course-preview-access-details strong {
    display: block;
}

.course-preview-access-details small {
    color: var(--mid);
    font-size: 0.65rem;
}

.course-preview-access-details strong {
    margin-top: 0.08rem;
    font-size: 0.8rem;
}

.course-preview-account-note {
    padding-top: 0.85rem;
    border-top: 1px solid rgba(13, 13, 13, 0.08);
    color: var(--mid);
    font-size: 0.76rem;
    text-align: center;
}

.course-preview-account-note a {
    color: var(--teal);
    font-weight: 800;
}

@media (max-width: 1180px) {
    .course-marketplace-layout {
        grid-template-columns: minmax(210px, 0.28fr) minmax(0, 1fr);
    }

    .course-results-panel .landing-catalog-grid {
        grid-template-columns: 1fr;
    }

    .course-preview-layout {
        grid-template-columns: minmax(0, 1fr) minmax(280px, 0.36fr);
    }

    .course-preview-value-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 900px) {
    .course-discovery-hero,
    .course-preview-hero,
    .course-marketplace-layout,
    .course-preview-layout {
        grid-template-columns: 1fr;
    }

    .course-filter-panel,
    .course-preview-access {
        position: static;
    }

    .course-filter-panel .landing-filter-group {
        display: flex;
        flex-wrap: wrap;
        overflow-x: visible;
    }

    .course-filter-panel :is(.filter-pill-button, .access-tab-button) {
        width: auto;
    }

    .course-filter-clear {
        min-width: 44px;
        min-height: 44px;
        padding: 0.45rem;
    }

    .course-results-panel .landing-catalog-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .course-preview-access {
        order: -1;
    }
}

@media (max-width: 700px) {
    .course-filter-panel .landing-filter-group {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: 100%;
        overflow: visible;
    }

    .course-filter-panel :is(.filter-pill-button, .access-tab-button) {
        width: 100%;
        min-width: 0;
        white-space: normal;
    }

    .course-discovery-assurances {
        display: grid;
        grid-template-columns: 1fr;
    }

    .course-discovery-assurances span {
        width: fit-content;
    }

    .course-discovery-summary {
        padding: 1rem;
    }

    .course-discovery-path-copy {
        flex-wrap: wrap;
        gap: 0.15rem 0.55rem;
    }

    .course-filter-panel {
        padding: 1rem;
        border-radius: 20px;
    }

    .course-filter-panel .landing-filter-group {
        flex-wrap: nowrap;
        overflow-x: auto;
        padding-bottom: 0.15rem;
        scrollbar-width: none;
    }

    .course-results-panel .landing-catalog-grid {
        grid-template-columns: 1fr;
    }

    .landing-catalog-grid .public-course-card .c-thumb,
    .public-course-card .c-thumb {
        height: 175px;
    }

    .public-course-card .public-course-outcome {
        min-height: 0;
    }

    .course-preview-hero-facts {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .course-preview-hero-facts > span {
        min-width: 0;
    }

    .course-preview-cover {
        border-radius: 22px;
    }

    .course-preview-overview,
    .course-preview-curriculum,
    .course-preview-access {
        border-radius: 20px;
    }

    .course-preview-value-grid {
        grid-template-columns: 1fr;
    }

    .course-preview-section-head {
        align-items: flex-start;
        flex-direction: column;
    }

    .course-preview-section-head > span {
        padding: 0;
        white-space: normal;
    }

    .course-preview-module summary {
        grid-template-columns: auto minmax(0, 1fr) auto;
    }

    .course-preview-module-count {
        display: none;
    }

    .course-preview-module .landing-lesson-row {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .course-preview-module .lesson-thumbnail-media,
    .course-preview-lesson-state {
        display: none;
    }

    .course-preview-access-price strong {
        font-size: 1.55rem;
    }
}
/* Timed BECE paper attempts */
.exam-launch-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 380px);
    gap: clamp(1rem, 2.5vw, 2rem);
    padding: clamp(1.35rem, 3vw, 2.6rem);
    border: 1px solid rgba(24, 108, 107, 0.18);
    border-radius: 28px;
    background:
        radial-gradient(circle at 92% 10%, rgba(222, 172, 40, 0.18), transparent 30%),
        linear-gradient(135deg, #f7fbfa 0%, #fffaf0 100%);
    box-shadow: 0 20px 55px rgba(22, 40, 48, 0.08);
}

.exam-launch-copy h2,
.exam-attempt-heading h2,
.exam-review-screen h3 {
    margin: 0.35rem 0 0.65rem;
    font-family: var(--font-display);
    color: var(--ink);
}

.exam-launch-copy > p {
    max-width: 760px;
    color: var(--muted);
    line-height: 1.7;
}

.exam-paper-facts {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    margin-top: 1.4rem;
}

.exam-paper-facts span {
    display: inline-flex;
    align-items: baseline;
    gap: 0.35rem;
    padding: 0.65rem 0.8rem;
    border: 1px solid rgba(24, 108, 107, 0.15);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.76);
    color: var(--muted);
}

.exam-paper-facts strong {
    color: var(--teal);
    font-size: 1.2rem;
}

.exam-launch-action-card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 0.75rem;
    padding: 1.25rem;
    border: 1px solid rgba(19, 40, 49, 0.1);
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.9);
}

.exam-launch-action-card > strong {
    font-size: 1.08rem;
}

.exam-launch-action-card p {
    margin: 0;
    color: var(--muted);
}

.exam-status-badge {
    display: inline-flex;
    padding: 0.42rem 0.62rem;
    border-radius: 999px;
    background: rgba(222, 172, 40, 0.15);
    color: #74550a;
    font: 700 0.72rem/1 var(--font-mono);
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.exam-status-badge.is-active {
    background: rgba(24, 108, 107, 0.13);
    color: var(--teal);
}

.exam-rule-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.85rem;
}

.exam-rule-grid article {
    display: grid;
    align-content: start;
    gap: 0.55rem;
    min-height: 170px;
    padding: 1rem;
    border: 1px solid rgba(19, 40, 49, 0.09);
    border-radius: 16px;
    background: #fbfcfb;
}

.exam-rule-grid i {
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border-radius: 12px;
    background: rgba(24, 108, 107, 0.1);
    color: var(--teal);
}

.exam-rule-grid p,
.exam-attempt-history span {
    margin: 0;
    color: var(--muted);
    line-height: 1.55;
}

.exam-attempt-history {
    display: grid;
    gap: 0.6rem;
}

.exam-attempt-history article {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.85rem 1rem;
    border: 1px solid rgba(19, 40, 49, 0.09);
    border-radius: 14px;
    background: #fff;
}

.exam-attempt-history article > div {
    display: grid;
    gap: 0.2rem;
}

.exam-attempt-shell {
    display: grid;
    gap: 1rem;
    max-width: 1260px;
    margin: 0 auto;
}

.exam-attempt-toolbar {
    position: sticky;
    z-index: 25;
    top: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 1rem;
    padding: 0.9rem 1rem;
    border: 1px solid rgba(19, 40, 49, 0.12);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 14px 34px rgba(14, 34, 42, 0.1);
    backdrop-filter: blur(16px);
}

.exam-attempt-heading h2 {
    margin: 0.15rem 0;
    font-size: clamp(1.1rem, 2.4vw, 1.55rem);
}

.exam-attempt-heading > span {
    color: var(--muted);
    font-size: 0.88rem;
}

.exam-timer,
.exam-save-state {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    min-height: 52px;
    padding: 0.55rem 0.75rem;
    border-radius: 13px;
    background: #eef7f6;
    color: var(--teal);
}

.exam-timer > i,
.exam-save-state > i {
    font-size: 1.05rem;
}

.exam-timer div {
    display: grid;
}

.exam-timer span {
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.exam-timer strong {
    font: 800 1.15rem/1.1 var(--font-mono);
}

.exam-timer.is-warning {
    background: #fff3cf;
    color: #7a5700;
}

.exam-timer.is-critical {
    background: #fbe5e1;
    color: #a33729;
    animation: exam-timer-pulse 1s ease-in-out infinite alternate;
}

@keyframes exam-timer-pulse {
    to { box-shadow: 0 0 0 4px rgba(184, 65, 49, 0.12); }
}

.exam-save-state {
    min-width: 170px;
    font-size: 0.82rem;
    font-weight: 700;
}

.exam-save-state[data-state="saving"] {
    background: #fff6dc;
    color: #795900;
}

.exam-save-state[data-state="queued"] {
    background: #fbe9e5;
    color: #9b392d;
}

.exam-progress-strip {
    display: grid;
    grid-template-columns: repeat(3, auto) minmax(180px, 1fr);
    align-items: center;
    gap: 1rem;
    padding: 0.75rem 1rem;
    border-radius: 16px;
    background: #102b33;
    color: #fff;
}

.exam-progress-strip > div:not(.exam-progress-track) {
    display: flex;
    align-items: baseline;
    gap: 0.35rem;
}

.exam-progress-strip span {
    color: rgba(255, 255, 255, 0.7);
    font-size: 0.78rem;
}

.exam-progress-track {
    height: 8px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.15);
}

.exam-progress-track span {
    display: block;
    width: 0;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #2db4aa, #e5b83b);
    transition: width 180ms ease;
}

.exam-attempt-form {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    gap: 1rem;
    align-items: start;
}

.exam-question-map {
    position: sticky;
    top: 92px;
    padding: 1rem;
    border: 1px solid rgba(19, 40, 49, 0.1);
    border-radius: 18px;
    background: #fff;
}

.exam-question-map-head {
    display: grid;
    gap: 0.2rem;
    margin-bottom: 0.8rem;
}

.exam-question-map-head span,
.exam-map-legend {
    color: var(--muted);
    font-size: 0.76rem;
}

.exam-question-map-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 0.42rem;
}

.exam-question-map-grid button {
    position: relative;
    display: grid;
    min-width: 0;
    aspect-ratio: 1;
    place-items: center;
    border: 1px solid rgba(19, 40, 49, 0.16);
    border-radius: 9px;
    background: #f7f8f7;
    color: var(--ink);
    font: 700 0.78rem/1 var(--font-mono);
    cursor: pointer;
}

.exam-question-map-grid button.is-answered {
    border-color: rgba(24, 108, 107, 0.45);
    background: #dcefed;
    color: var(--teal);
}

.exam-question-map-grid button.is-viewed {
    border-color: rgba(24, 108, 107, 0.42);
    background: #eef6f5;
}

.exam-question-map-grid button.is-attempted {
    border-color: rgba(35, 130, 93, 0.5);
    background: #dff2e9;
    color: #185f45;
}

.exam-question-map-grid button.is-selected {
    box-shadow: inset 0 0 0 2px #c29215;
}

.exam-question-map-grid button.is-flagged::after {
    position: absolute;
    top: 3px;
    right: 3px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #d9a817;
    content: "";
}

.exam-question-map-grid button[aria-current="step"] {
    outline: 3px solid rgba(24, 108, 107, 0.2);
    border-color: var(--teal);
}

.exam-map-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    margin-top: 0.85rem;
}

.exam-map-legend span {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
}

.exam-map-legend i {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #dcefed;
}

.exam-map-legend i.is-flagged { background: #d9a817; }
.exam-map-legend i.is-viewed { border: 1px solid rgba(24, 108, 107, 0.55); background: #eef6f5; }
.exam-map-legend i.is-attempted { background: #39a879; }

.exam-question-stage {
    min-width: 0;
}

.exam-live-question,
.exam-review-screen {
    padding: clamp(1.1rem, 3vw, 2rem);
    border: 1px solid rgba(19, 40, 49, 0.1);
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 16px 40px rgba(21, 39, 46, 0.07);
}

.exam-live-question-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid rgba(19, 40, 49, 0.09);
}

.exam-live-question-head > div {
    display: flex;
    align-items: center;
    gap: 0.55rem;
}

.exam-live-question-head > div span {
    color: var(--teal);
    font: 700 0.76rem/1 var(--font-mono);
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.exam-flag-control input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.exam-flag-control span {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.55rem 0.7rem;
    border: 1px solid rgba(19, 40, 49, 0.14);
    border-radius: 10px;
    cursor: pointer;
}

.exam-flag-control input:checked + span {
    border-color: #d9a817;
    background: #fff6d8;
    color: #6f5000;
}

.exam-flag-control input:focus-visible + span {
    outline: 3px solid rgba(24, 108, 107, 0.25);
    outline-offset: 2px;
}

.exam-question-prompt {
    margin: clamp(1.2rem, 3vw, 2rem) 0;
    color: var(--ink);
    font-size: clamp(1.05rem, 2vw, 1.3rem);
    font-weight: 700;
    line-height: 1.65;
    overflow-wrap: anywhere;
}

.exam-theory-section-label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-top: 1.2rem;
    color: var(--teal);
    font: 700 0.72rem/1.25 var(--font-mono);
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.formal-theory-part-list {
    display: grid;
    gap: 0.8rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.formal-theory-part-list > li {
    padding: 1rem;
    border: 1px solid rgba(19, 40, 49, 0.1);
    border-radius: 16px;
    background: #fbfcfb;
}

.theory-response-guidance {
    display: flex;
    gap: 0.5rem;
    margin: 0.7rem 0 0;
    color: var(--muted);
    font-size: 0.86rem;
}

.formal-theory-state-controls {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.7rem;
    margin-top: 1.2rem;
}

.formal-theory-state-controls label > input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.formal-theory-state-controls label > span {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    min-height: 54px;
    padding: 0.75rem 0.85rem;
    border: 1px solid rgba(19, 40, 49, 0.15);
    border-radius: 13px;
    background: #f7f9f8;
    cursor: pointer;
    line-height: 1.4;
}

.formal-theory-state-controls label > input:checked + span {
    border-color: rgba(24, 108, 107, 0.55);
    background: #e4f3ef;
    color: var(--teal);
}

.formal-theory-state-controls label > input:focus-visible + span {
    outline: 3px solid rgba(24, 108, 107, 0.25);
    outline-offset: 2px;
}

.bece-question-image {
    display: block;
    max-width: 100%;
    height: auto;
    margin: 0 auto 1.25rem;
    border-radius: 14px;
}

.exam-supporting-table,
.exam-math-expression,
.exam-code-snippet {
    max-width: 100%;
    overflow: auto;
    overscroll-behavior-inline: contain;
}

.exam-supporting-table pre,
.exam-math-expression,
.exam-code-snippet {
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.exam-option-list {
    display: grid;
    gap: 0.7rem;
    margin: 0;
    padding: 0;
    border: 0;
    counter-reset: exam-option;
}

.exam-option-list label {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    align-items: center;
    gap: 0.8rem;
    min-height: 62px;
    padding: 0.75rem;
    border: 1px solid rgba(19, 40, 49, 0.13);
    border-radius: 14px;
    background: #fbfcfb;
    cursor: pointer;
    counter-increment: exam-option;
    transition: border-color 150ms ease, background 150ms ease, transform 150ms ease;
}

.exam-option-list label:hover {
    border-color: rgba(24, 108, 107, 0.45);
    transform: translateY(-1px);
}

.exam-option-list label:has(input:checked) {
    border-color: var(--teal);
    background: #e8f4f2;
}

.exam-option-list input {
    position: absolute;
    opacity: 0;
}

.exam-option-letter {
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border-radius: 11px;
    background: #e8ecec;
    color: var(--ink);
    font-weight: 800;
}

.exam-option-letter::before { content: counter(exam-option, upper-alpha); }

.exam-option-list input:checked + .exam-option-letter {
    background: var(--teal);
    color: #fff;
}

.exam-option-list input:focus-visible + .exam-option-letter {
    outline: 3px solid rgba(24, 108, 107, 0.3);
    outline-offset: 3px;
}

.exam-option-text {
    line-height: 1.55;
}

.exam-question-controls {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-top: 1.4rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(19, 40, 49, 0.09);
}

.exam-question-controls .button,
.exam-question-map-grid button,
.exam-flag-control span {
    min-height: 44px;
}

.exam-review-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
    margin: 1.25rem 0;
}

.exam-review-summary article {
    display: grid;
    gap: 0.25rem;
    padding: 1rem;
    border-radius: 14px;
    background: #f2f6f5;
}

.exam-review-summary strong {
    color: var(--teal);
    font-family: var(--font-display);
    font-size: 1.7rem;
}

.exam-review-map {
    grid-template-columns: repeat(10, minmax(36px, 1fr));
}

@media (max-width: 1000px) {
    .exam-rule-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .exam-attempt-toolbar { grid-template-columns: minmax(0, 1fr) auto; }
    .exam-save-state { grid-column: 1 / -1; min-height: 40px; }
    .exam-attempt-form { grid-template-columns: 180px minmax(0, 1fr); }
    .exam-question-map-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .exam-review-map { grid-template-columns: repeat(8, minmax(36px, 1fr)); }
}

@media (max-width: 760px) {
    .exam-launch-hero { grid-template-columns: 1fr; border-radius: 20px; }
    .exam-rule-grid { grid-template-columns: 1fr; }
    .exam-rule-grid article { min-height: 0; }
    .exam-attempt-toolbar { position: relative; grid-template-columns: 1fr auto; border-radius: 16px; }
    .exam-attempt-heading { grid-column: 1 / -1; }
    .exam-timer,
    .exam-save-state { min-width: 0; }
    .exam-save-state { grid-column: auto; }
    .exam-progress-strip { grid-template-columns: repeat(3, 1fr); gap: 0.55rem; }
    .exam-progress-strip > div:not(.exam-progress-track) { display: grid; gap: 0.1rem; }
    .exam-progress-track { grid-column: 1 / -1; }
    .exam-attempt-form { grid-template-columns: 1fr; }
    .exam-question-map { position: relative; top: auto; }
    .exam-question-map-grid { grid-template-columns: repeat(8, minmax(44px, 1fr)); overflow-x: auto; padding: 0.15rem 0.1rem 0.45rem; scrollbar-gutter: stable; }
    .exam-live-question-head { align-items: flex-start; }
    .exam-review-map { grid-template-columns: repeat(5, minmax(36px, 1fr)); }
}

@media (max-width: 480px) {
    .exam-attempt-toolbar { grid-template-columns: 1fr; }
    .exam-save-state { min-height: 42px; }
    .exam-question-map-grid { grid-template-columns: repeat(5, minmax(44px, 1fr)); }
    .exam-live-question-head { display: grid; }
    .exam-flag-control span { width: 100%; justify-content: center; }
    .exam-option-list label { grid-template-columns: 34px minmax(0, 1fr); padding: 0.65rem; }
    .exam-option-letter { width: 34px; height: 34px; }
    .exam-question-controls { display: grid; grid-template-columns: 1fr; align-items: stretch; }
    .exam-question-controls .button { width: 100%; padding-inline: 0.65rem; }
    .exam-review-summary { gap: 0.45rem; }
    .exam-review-summary article { padding: 0.75rem; }
    .exam-theory-section-label,
    .formal-theory-state-controls { grid-template-columns: 1fr; }
    .exam-theory-section-label { display: grid; }
}

@media (prefers-reduced-motion: reduce) {
    .exam-timer.is-critical { animation: none; }
    .exam-progress-track span,
    .exam-option-list label { transition: none; }
}

@media (prefers-contrast: more) {
    .exam-attempt-toolbar,
    .exam-question-map,
    .exam-live-question,
    .exam-review-screen,
    .exam-option-list label,
    .exam-question-map-grid button {
        border-color: currentColor;
    }

    .exam-option-list label:has(input:checked),
    .exam-question-map-grid button[aria-current="step"] {
        outline: 3px solid currentColor;
        outline-offset: 2px;
    }
}

@media (forced-colors: active) {
    .exam-progress-track,
    .exam-progress-track span,
    .exam-question-map-grid button,
    .exam-option-letter {
        border: 1px solid CanvasText;
    }

    .exam-progress-track span,
    .exam-option-list input:checked + .exam-option-letter,
    .exam-question-map-grid button[aria-current="step"] {
        background: Highlight;
        color: HighlightText;
    }
}

/* BECE results, reviews, and readiness */
.exam-launch-action-grid {
    display: grid;
    gap: 0.8rem;
    align-content: center;
}

.exam-launch-action-grid .exam-launch-action-card {
    min-width: 0;
}

.theory-guided-action-card {
    border-color: rgba(24, 108, 107, 0.24);
    background: linear-gradient(145deg, #ffffff, #eff8f6);
}

.theory-practice-shell {
    display: grid;
    gap: 1rem;
    max-width: 1280px;
    margin: 0 auto;
}

.theory-practice-toolbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(210px, 290px) auto;
    align-items: center;
    gap: 1rem;
    padding: 1rem;
    border: 1px solid rgba(19, 40, 49, 0.12);
    border-radius: 20px;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(240, 248, 246, 0.98));
    box-shadow: 0 16px 38px rgba(14, 34, 42, 0.08);
}

.theory-practice-toolbar h2 {
    margin: 0.2rem 0;
    font-family: var(--font-display);
}

.theory-practice-toolbar > div:first-child > span,
.theory-practice-progress span,
.theory-practice-map > p {
    color: var(--muted);
    font-size: 0.84rem;
}

.theory-practice-progress {
    display: grid;
    gap: 0.55rem;
}

.theory-practice-progress > div:first-child {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.75rem;
}

.theory-practice-progress strong {
    color: var(--teal);
    font: 800 1.1rem/1 var(--font-mono);
}

.theory-practice-progress .exam-progress-track {
    background: rgba(19, 40, 49, 0.1);
}

.theory-practice-complete {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    padding: 0.9rem 1rem;
    border: 1px solid rgba(24, 108, 107, 0.2);
    border-radius: 16px;
    background: #eaf6f3;
    color: var(--teal);
}

.theory-practice-complete > i {
    font-size: 1.35rem;
}

.theory-practice-complete > div {
    display: grid;
    gap: 0.15rem;
}

.theory-practice-complete span {
    color: var(--muted);
}

.theory-practice-layout {
    display: grid;
    grid-template-columns: 230px minmax(0, 1fr);
    gap: 1rem;
    align-items: start;
}

.theory-practice-map {
    position: sticky;
    top: 1rem;
    padding: 1rem;
    border: 1px solid rgba(19, 40, 49, 0.1);
    border-radius: 18px;
    background: #fff;
}

.theory-practice-map-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.45rem;
}

.theory-practice-map-grid a {
    position: relative;
    display: grid;
    min-height: 48px;
    place-items: center;
    border: 1px solid rgba(19, 40, 49, 0.15);
    border-radius: 10px;
    background: #f7f8f7;
    color: var(--ink);
    font: 800 0.78rem/1 var(--font-mono);
    text-decoration: none;
}

.theory-practice-map-grid a.is-current {
    outline: 3px solid rgba(24, 108, 107, 0.18);
    border-color: var(--teal);
}

.theory-practice-map-grid a.is-reviewed {
    background: #dcefeb;
    color: var(--teal);
}

.theory-practice-map-grid a i {
    position: absolute;
    top: 4px;
    right: 4px;
    font-size: 0.55rem;
}

.theory-practice-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    margin-top: 0.8rem;
    color: var(--muted);
    font-size: 0.74rem;
}

.theory-practice-legend span {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
}

.theory-practice-legend i {
    width: 9px;
    height: 9px;
    border: 1px solid var(--teal);
    border-radius: 50%;
}

.theory-practice-legend i.is-reviewed {
    background: var(--teal);
}

.theory-practice-question {
    min-width: 0;
    padding: clamp(1rem, 3vw, 2rem);
    border: 1px solid rgba(19, 40, 49, 0.1);
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 18px 46px rgba(21, 39, 46, 0.07);
}

.theory-practice-question > header,
.theory-practice-solution-head,
.theory-practice-part-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.theory-practice-question > header {
    padding-bottom: 1rem;
    border-bottom: 1px solid rgba(19, 40, 49, 0.09);
}

.theory-practice-question h3 {
    margin: 0.2rem 0 0;
    font-family: var(--font-display);
}

.theory-practice-main-prompt {
    margin: 1.3rem 0;
    font-size: clamp(1.05rem, 2vw, 1.25rem);
    font-weight: 700;
    line-height: 1.65;
}

.theory-practice-question figure,
.theory-practice-part-list figure,
.theory-practice-solution-list figure {
    margin: 1rem 0;
}

.theory-practice-question figure img,
.theory-practice-part-list img,
.theory-practice-solution-list img {
    display: block;
    max-width: 100%;
    height: auto;
    border-radius: 14px;
}

.theory-practice-question figcaption {
    margin-top: 0.4rem;
    color: var(--muted);
    font-size: 0.8rem;
}

.theory-practice-part-list,
.theory-practice-solution-list {
    display: grid;
    gap: 0.8rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.theory-practice-part-list > li,
.theory-practice-solution-list > li {
    padding: 1rem;
    border: 1px solid rgba(19, 40, 49, 0.1);
    border-radius: 16px;
    background: #fbfcfb;
}

.theory-practice-part-heading span {
    color: var(--teal);
    font: 700 0.74rem/1 var(--font-mono);
    text-transform: uppercase;
}

.theory-practice-part-prompt,
.theory-practice-solution-copy {
    margin-top: 0.7rem;
    line-height: 1.65;
}

.theory-practice-reveal,
.theory-practice-solution,
.theory-practice-rating {
    margin-top: 1.2rem;
    padding: clamp(1rem, 2.4vw, 1.4rem);
    border-radius: 18px;
}

.theory-practice-reveal {
    border: 1px solid rgba(222, 172, 40, 0.35);
    background: #fff9e9;
}

.theory-practice-reveal > div p,
.theory-practice-rating > div p {
    color: var(--muted);
}

.theory-practice-reveal form {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.8rem;
    margin-top: 1rem;
}

.theory-practice-reveal label > input,
.theory-practice-rating-options input {
    position: absolute;
    opacity: 0;
}

.theory-practice-reveal label > span,
.theory-practice-rating-options label > span {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    min-height: 46px;
    padding: 0.65rem 0.8rem;
    border: 1px solid rgba(19, 40, 49, 0.16);
    border-radius: 12px;
    background: #fff;
    cursor: pointer;
}

.theory-practice-reveal label > input:checked + span,
.theory-practice-rating-options input:checked + span {
    border-color: var(--teal);
    background: #e5f3f0;
    color: var(--teal);
}

.theory-practice-reveal label > input:focus-visible + span,
.theory-practice-rating-options input:focus-visible + span {
    outline: 3px solid rgba(24, 108, 107, 0.24);
    outline-offset: 2px;
}

.theory-practice-solution {
    border: 1px solid rgba(24, 108, 107, 0.22);
    background: linear-gradient(145deg, #f3faf8, #ffffff);
}

.theory-practice-solution-list {
    margin-top: 1rem;
}

.theory-practice-marking-points,
.theory-practice-accepted {
    margin-top: 0.8rem;
    padding: 0.8rem;
    border-left: 3px solid #d9a817;
    background: rgba(255, 255, 255, 0.8);
}

.theory-practice-marking-points p,
.theory-practice-accepted ul {
    margin: 0.4rem 0 0;
}

.theory-practice-rating {
    border: 1px solid rgba(19, 40, 49, 0.1);
    background: #f6f7f6;
}

.theory-practice-rating form {
    display: grid;
    gap: 0.8rem;
    margin-top: 1rem;
}

.theory-practice-rating-options {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
}

.theory-practice-controls {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.8rem;
    margin-top: 1.3rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(19, 40, 49, 0.09);
}

@media (max-width: 900px) {
    .theory-practice-toolbar {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .theory-practice-progress {
        grid-column: 1 / -1;
        grid-row: 2;
    }

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

    .theory-practice-map {
        position: relative;
        top: auto;
    }

    .theory-practice-map-grid {
        display: flex;
        overflow-x: auto;
        padding-bottom: 0.4rem;
        scrollbar-gutter: stable;
    }

    .theory-practice-map-grid a {
        flex: 0 0 48px;
    }
}

@media (max-width: 560px) {
    .theory-practice-toolbar {
        grid-template-columns: 1fr;
    }

    .theory-practice-toolbar > .button {
        width: 100%;
    }

    .theory-practice-question > header,
    .theory-practice-solution-head,
    .theory-practice-part-heading,
    .theory-practice-controls {
        align-items: flex-start;
    }

    .theory-practice-reveal form,
    .theory-practice-rating-options,
    .theory-practice-controls {
        display: grid;
        grid-template-columns: 1fr;
    }

    .theory-practice-reveal label > span,
    .theory-practice-reveal .button,
    .theory-practice-rating-options label > span,
    .theory-practice-rating .button,
    .theory-practice-controls .button {
        width: 100%;
        justify-content: center;
    }
}

@media print {
    .theory-practice-shell,
    .formal-review-shell,
    .exam-attempt-shell.has-theory {
        display: none !important;
    }
}

.exam-readiness-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: clamp(1rem, 2.5vw, 2rem);
    padding: clamp(1rem, 2.5vw, 1.5rem);
    border: 1px solid rgba(24, 108, 107, 0.18);
    border-radius: 22px;
    background: linear-gradient(135deg, #f4faf9, #fffaf0);
    box-shadow: 0 14px 34px rgba(22, 40, 48, 0.07);
}

.exam-readiness-card.tone-success { border-color: rgba(38, 132, 92, 0.32); }
.exam-readiness-card.tone-watch { border-color: rgba(201, 168, 76, 0.42); }
.exam-readiness-card.tone-warning { border-color: rgba(192, 94, 58, 0.32); }

.exam-readiness-score {
    display: grid;
    width: 104px;
    height: 104px;
    place-items: center;
    align-content: center;
    border-radius: 50%;
    background: #12333a;
    color: #fff;
    box-shadow: inset 0 0 0 8px rgba(255, 255, 255, 0.08);
}

.exam-readiness-score span {
    color: rgba(255, 255, 255, 0.68);
    font: 700 0.64rem/1 var(--font-mono);
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.exam-readiness-score strong {
    margin-top: 0.25rem;
    font-size: 1.65rem;
}

.exam-readiness-copy h3 {
    margin: 0.25rem 0 0.4rem;
    font-family: var(--font-display);
    font-size: clamp(1.2rem, 2.3vw, 1.6rem);
}

.exam-readiness-copy > p:last-child {
    max-width: 680px;
    margin: 0;
    color: var(--muted);
    line-height: 1.55;
}

.exam-readiness-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(86px, 1fr));
    gap: 0.55rem;
}

.exam-readiness-metrics span {
    display: grid;
    gap: 0.25rem;
    min-width: 90px;
    padding: 0.75rem;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.86);
}

.exam-readiness-metrics small {
    color: var(--muted);
    font-size: 0.68rem;
}

.exam-readiness-metrics strong { color: var(--teal); }

.exam-history-result {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.75rem;
}

.exam-history-result > strong {
    color: var(--teal);
    font-family: var(--font-display);
    font-size: 1.3rem;
}

.exam-history-result > a {
    color: var(--teal);
    font-weight: 800;
    text-decoration: none;
}

.exam-attempt-history article.is-current {
    border-color: rgba(24, 108, 107, 0.42);
    background: #f0f8f7;
}

.exam-result-locked {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 1.25rem;
    min-height: 280px;
    padding: clamp(1.4rem, 4vw, 3rem);
    border: 1px solid rgba(19, 40, 49, 0.12);
    border-radius: 26px;
    background:
        radial-gradient(circle at 10% 10%, rgba(24, 108, 107, 0.12), transparent 34%),
        linear-gradient(135deg, #f8fbfa, #fffaf2);
}

.exam-result-lock-icon {
    display: grid;
    width: 76px;
    height: 76px;
    place-items: center;
    border-radius: 22px;
    background: #12333a;
    color: #fff;
    font-size: 1.5rem;
}

.exam-result-locked h2 {
    margin: 0.25rem 0 0.55rem;
    font-family: var(--font-display);
    font-size: clamp(1.8rem, 4vw, 3rem);
}

.exam-result-locked p {
    max-width: 720px;
    color: var(--muted);
    line-height: 1.6;
}

.exam-result-locked > div > strong { color: var(--teal); }

.exam-result-hero {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: clamp(1.25rem, 3vw, 2.5rem);
    padding: clamp(1.25rem, 3vw, 2rem);
    border-radius: 26px;
    background:
        radial-gradient(circle at 90% 20%, rgba(230, 185, 55, 0.17), transparent 30%),
        #12333a;
    color: #fff;
}

.exam-theory-result-icon {
    display: grid;
    width: 112px;
    height: 112px;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 28px;
    background: rgba(255, 255, 255, 0.09);
    color: #e7c763;
    font-size: 2rem;
}

.formal-theory-result-summary .exam-review-summary {
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}

.formal-theory-result-note {
    display: flex;
    align-items: flex-start;
    gap: 0.55rem;
    margin: 1rem 0 0;
    color: var(--muted);
}

.formal-theory-result-note i {
    margin-top: 0.15rem;
    color: var(--teal);
}

.formal-theory-review-map {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.7rem;
    margin-top: 1rem;
}

.formal-theory-review-map a {
    display: grid;
    gap: 0.25rem;
    min-width: 0;
    padding: 0.85rem;
    border: 1px solid rgba(19, 40, 49, 0.12);
    border-radius: 14px;
    background: #fff;
    color: var(--ink);
    text-decoration: none;
}

.formal-theory-review-map a:hover,
.formal-theory-review-map a:focus-visible {
    border-color: var(--teal);
}

.formal-theory-review-map a.is-reviewed {
    background: #eaf6f3;
}

.formal-theory-review-map span,
.formal-theory-review-map small {
    color: var(--muted);
    font-size: 0.76rem;
}

.formal-theory-review-map small {
    color: var(--teal);
    font-weight: 800;
}

.formal-review-shell {
    display: grid;
    gap: 1rem;
    max-width: 1280px;
    margin: 0 auto;
}

.formal-review-toolbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(210px, 290px) auto;
    align-items: center;
    gap: 1rem;
    padding: 1rem;
    border: 1px solid rgba(19, 40, 49, 0.12);
    border-radius: 20px;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(239, 248, 246, 0.98));
    box-shadow: 0 16px 38px rgba(14, 34, 42, 0.08);
}

.formal-review-toolbar h2 {
    margin: 0.2rem 0;
    font-family: var(--font-display);
}

.formal-review-toolbar > div:first-child > span,
.formal-review-progress span,
.formal-review-map > p {
    color: var(--muted);
    font-size: 0.84rem;
}

.formal-review-progress {
    display: grid;
    gap: 0.55rem;
}

.formal-review-progress > div:first-child {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
}

.formal-review-progress strong {
    color: var(--teal);
    font: 800 1.05rem/1 var(--font-mono);
}

.formal-review-progress .exam-progress-track {
    background: rgba(19, 40, 49, 0.1);
}

.formal-review-layout {
    display: grid;
    grid-template-columns: 230px minmax(0, 1fr);
    gap: 1rem;
    align-items: start;
}

.formal-review-map {
    position: sticky;
    top: 1rem;
    padding: 1rem;
    border: 1px solid rgba(19, 40, 49, 0.1);
    border-radius: 18px;
    background: #fff;
}

.formal-review-map > p {
    line-height: 1.5;
}

.formal-review-map nav {
    display: grid;
    gap: 0.5rem;
}

.formal-review-map nav a {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.55rem;
    min-height: 48px;
    padding: 0.45rem;
    border: 1px solid rgba(19, 40, 49, 0.12);
    border-radius: 11px;
    background: #f8faf9;
    color: var(--ink);
    text-decoration: none;
}

.formal-review-map nav a > span {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;
    border-radius: 9px;
    background: #e9eeee;
    font: 800 0.76rem/1 var(--font-mono);
}

.formal-review-map nav a.is-reviewed > span {
    background: #dcefeb;
    color: var(--teal);
}

.formal-review-map nav a.is-current {
    outline: 3px solid rgba(24, 108, 107, 0.17);
    border-color: var(--teal);
}

.formal-review-map nav a > i {
    color: var(--teal);
}

.formal-review-question {
    min-width: 0;
    padding: clamp(1rem, 3vw, 2rem);
    border: 1px solid rgba(19, 40, 49, 0.1);
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 18px 46px rgba(21, 39, 46, 0.07);
}

.formal-review-question > header,
.formal-review-solution-heading,
.formal-review-controls {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.formal-review-question > header {
    padding-bottom: 1rem;
    border-bottom: 1px solid rgba(19, 40, 49, 0.09);
}

.formal-review-question h3 {
    margin: 0.2rem 0 0;
    font-family: var(--font-display);
}

.formal-review-prompt {
    margin-top: 1.2rem;
    padding: 1rem;
    border-radius: 17px;
    background: #f6f8f7;
}

.formal-review-prompt h4 {
    margin: 0;
    color: var(--teal);
    font: 800 0.74rem/1 var(--font-mono);
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.formal-review-part-list {
    display: grid;
    gap: 1rem;
    margin: 1rem 0 0;
    padding: 0;
    list-style: none;
}

.formal-review-part-list > li {
    overflow: hidden;
    border: 1px solid rgba(19, 40, 49, 0.1);
    border-radius: 18px;
}

.formal-review-part-question,
.formal-review-part-solution {
    padding: clamp(1rem, 2.5vw, 1.35rem);
}

.formal-review-part-question {
    background: #fff;
}

.formal-review-part-solution {
    border-top: 1px solid rgba(24, 108, 107, 0.16);
    background: linear-gradient(145deg, #edf8f5, #fffaf0);
}

.formal-review-solution-heading {
    justify-content: flex-start;
    color: var(--teal);
}

.formal-review-video-link {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    margin-top: 1rem;
    padding: 0.9rem 1rem;
    border-radius: 14px;
    background: #12333a;
    color: #fff;
    font-weight: 800;
    text-decoration: none;
}

.formal-review-video-link span {
    flex: 1;
}

.formal-review-video-link > i:first-child {
    color: #e7c763;
}

.formal-review-controls {
    margin-top: 1.3rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(19, 40, 49, 0.09);
}

@media (max-width: 900px) {
    .formal-review-toolbar { grid-template-columns: minmax(0, 1fr) auto; }
    .formal-review-progress { grid-column: 1 / -1; grid-row: 2; }
    .formal-review-layout { grid-template-columns: 1fr; }
    .formal-review-map { position: relative; top: auto; }
    .formal-review-map nav { display: flex; overflow-x: auto; padding: 0.2rem 0.1rem 0.5rem; scrollbar-gutter: stable; }
    .formal-review-map nav a { flex: 0 0 min(180px, 70vw); }
}

@media (max-width: 700px) {
    .formal-review-toolbar { grid-template-columns: 1fr; }
    .formal-review-progress { grid-column: auto; grid-row: auto; }
    .formal-review-toolbar > .button { width: 100%; }
    .formal-review-question > header,
    .formal-review-controls { align-items: stretch; display: grid; grid-template-columns: 1fr; }
    .formal-review-controls .button { width: 100%; }
}

.exam-result-score-ring {
    display: grid;
    width: 152px;
    height: 152px;
    place-items: center;
    border-radius: 50%;
    background:
        radial-gradient(circle closest-side, #12333a 77%, transparent 79% 100%),
        conic-gradient(#35b8ad calc(var(--score) * 1%), rgba(255, 255, 255, 0.14) 0);
}

.exam-result-score-ring > div {
    display: grid;
    place-items: center;
}

.exam-result-score-ring strong {
    font-family: var(--font-display);
    font-size: 2.2rem;
}

.exam-result-score-ring span {
    color: rgba(255, 255, 255, 0.7);
    font-size: 0.74rem;
}

.exam-result-heading .eyebrow-inline { color: #e7c763; }

.exam-result-heading h2 {
    margin: 0.3rem 0 0.55rem;
    color: #fff;
    font-family: var(--font-display);
    font-size: clamp(1.7rem, 3.5vw, 2.7rem);
}

.exam-result-heading > p:last-child {
    max-width: 680px;
    margin: 0;
    color: rgba(255, 255, 255, 0.72);
    line-height: 1.6;
}

.exam-result-facts {
    display: grid;
    gap: 0.55rem;
}

.exam-result-facts span {
    display: grid;
    min-width: 130px;
    gap: 0.2rem;
    padding: 0.7rem 0.8rem;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.07);
}

.exam-result-facts small { color: rgba(255, 255, 255, 0.62); }

.exam-topic-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.7rem;
}

.exam-topic-grid article {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.65rem 1rem;
    padding: 0.9rem;
    border: 1px solid rgba(19, 40, 49, 0.09);
    border-radius: 14px;
    background: #fbfcfb;
}

.exam-topic-grid article > div:first-child {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
    grid-column: 1 / -1;
}

.exam-topic-grid article span {
    color: var(--muted);
    font-size: 0.78rem;
}

.exam-topic-grid article > b {
    color: var(--teal);
    font-family: var(--font-mono);
}

.exam-topic-progress {
    height: 8px;
    overflow: hidden;
    border-radius: 999px;
    background: #e5e9e8;
}

.exam-topic-progress span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--teal), #39aaa1);
}

.exam-result-question-list {
    display: grid;
    gap: 1rem;
}

.exam-result-question {
    overflow: hidden;
    padding: clamp(1rem, 2.5vw, 1.5rem);
    border: 1px solid rgba(19, 40, 49, 0.11);
    border-left: 5px solid #b94b3b;
    border-radius: 17px;
    background: #fff;
}

.exam-result-question.is-correct { border-left-color: #23825d; }

.exam-result-question > header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.exam-result-question > header > div {
    display: flex;
    align-items: center;
    gap: 0.55rem;
}

.exam-result-question > header > div span {
    color: var(--muted);
    font: 700 0.76rem/1 var(--font-mono);
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.exam-result-verdict {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    color: #a13c30;
    font-weight: 800;
}

.is-correct .exam-result-verdict { color: #1f7554; }

.exam-result-question h4 {
    margin: 1.25rem 0 1rem;
    font-size: 1.08rem;
    line-height: 1.6;
}

.exam-review-options {
    display: grid;
    gap: 0.55rem;
    margin: 0;
    padding-left: 2rem;
}

.exam-review-options li {
    padding: 0.7rem 0.85rem;
    border: 1px solid rgba(19, 40, 49, 0.1);
    border-radius: 11px;
    background: #fafbfa;
}

.exam-review-options li::marker { font-weight: 800; }

.exam-review-options li.tone-correct {
    border-color: rgba(35, 130, 93, 0.42);
    background: #e7f5ee;
    color: #165c41;
}

.exam-review-options li.tone-incorrect {
    border-color: rgba(185, 75, 59, 0.4);
    background: #fbecea;
    color: #873428;
}

.exam-review-options li small {
    display: block;
    margin-top: 0.2rem;
    color: currentColor;
    font-weight: 800;
}

.exam-answer-feedback {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.75rem;
    margin-top: 1rem;
    padding: 0.9rem;
    border-radius: 13px;
    background: #fff7dc;
    color: #5d480c;
}

.exam-answer-feedback > i { margin-top: 0.15rem; color: #b88905; }
.exam-answer-feedback p { margin: 0.25rem 0 0; line-height: 1.55; }

.exam-question-topics {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-top: 0.8rem;
}

.exam-question-topics span {
    padding: 0.35rem 0.5rem;
    border-radius: 999px;
    background: #edf3f2;
    color: var(--teal);
    font: 700 0.67rem/1 var(--font-mono);
}

@media (max-width: 1000px) {
    .exam-readiness-card { grid-template-columns: auto minmax(0, 1fr); }
    .exam-readiness-metrics { grid-column: 1 / -1; }
    .exam-result-hero { grid-template-columns: auto minmax(0, 1fr); }
    .exam-result-facts { grid-column: 1 / -1; grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 700px) {
    .exam-readiness-card,
    .exam-result-locked,
    .exam-result-hero { grid-template-columns: 1fr; }
    .exam-readiness-score { width: 86px; height: 86px; }
    .exam-readiness-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .exam-readiness-metrics span { min-width: 0; padding: 0.6rem; }
    .exam-result-score-ring { width: 128px; height: 128px; }
    .exam-topic-grid { grid-template-columns: 1fr; }
    .exam-result-question > header { align-items: flex-start; }
}

@media (max-width: 480px) {
    .exam-readiness-metrics,
    .exam-result-facts { grid-template-columns: 1fr; }
    .exam-attempt-history article { align-items: flex-start; }
    .exam-history-result { align-items: flex-end; flex-direction: column; }
    .exam-result-question > header { display: grid; }
    .exam-theory-result-icon { width: 76px; height: 76px; border-radius: 20px; }
    .formal-theory-result-summary .exam-review-summary { grid-template-columns: 1fr; }
    .formal-theory-review-map { grid-template-columns: 1fr; }
}

/* Phase 7: monthly finance close and management reporting. */
.finance-scope-notice {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.7rem;
    align-items: start;
    margin-top: 0.8rem;
    padding: 0.75rem 0.85rem;
    border: 1px solid rgba(26, 107, 107, 0.18);
    border-radius: 14px;
    color: var(--ink);
    background: linear-gradient(135deg, rgba(235, 247, 245, 0.96), rgba(255, 250, 236, 0.92));
}

.finance-scope-notice > span {
    display: grid;
    width: 2rem;
    height: 2rem;
    place-items: center;
    border-radius: 9px;
    color: var(--teal);
    background: rgba(26, 107, 107, 0.1);
}

.finance-scope-notice strong,
.finance-scope-notice p {
    margin: 0;
}

.finance-scope-notice strong {
    font-size: 0.78rem;
}

.finance-scope-notice p {
    margin-top: 0.12rem;
    color: var(--mid);
    font-size: 0.7rem;
    line-height: 1.5;
}

.finance-management-summary,
.finance-exception-register,
.finance-monthly-close {
    margin-top: 0.85rem;
}

.finance-close-metric-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 0.55rem;
}

.finance-close-metric-grid article {
    display: grid;
    min-width: 0;
    gap: 0.3rem;
    padding: 0.75rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 13px;
    background: linear-gradient(145deg, rgba(239, 248, 247, 0.88), rgba(255, 255, 255, 0.96));
}

.finance-close-metric-grid span,
.finance-close-record span,
.finance-liability-summary dt {
    color: var(--mid);
    font-family: var(--mono);
    font-size: 0.58rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.finance-close-metric-grid strong {
    color: var(--ink);
    font-size: 0.82rem;
    overflow-wrap: anywhere;
}

.finance-management-columns {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(15rem, 1fr);
    gap: 0.8rem;
    margin-top: 0.8rem;
}

.finance-management-columns h4 {
    margin: 0 0 0.55rem;
    color: var(--ink);
    font-family: "Playfair Display", serif;
}

.finance-management-table-wrap {
    min-width: 0;
    overflow-x: auto;
}

.finance-management-table-wrap table {
    width: 100%;
    min-width: 36rem;
    border-collapse: collapse;
    font-size: 0.7rem;
}

.finance-management-table-wrap th,
.finance-management-table-wrap td {
    padding: 0.55rem;
    border-bottom: 1px solid rgba(15, 23, 42, 0.08);
    text-align: left;
}

.finance-liability-summary {
    padding: 0.8rem;
    border-radius: 14px;
    background: #f7f3e9;
}

.finance-liability-summary dl {
    display: grid;
    gap: 0.4rem;
    margin: 0;
}

.finance-liability-summary dl div {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
    padding-bottom: 0.4rem;
    border-bottom: 1px solid rgba(15, 23, 42, 0.08);
}

.finance-liability-summary dd {
    margin: 0;
    color: var(--ink);
    font-size: 0.74rem;
    font-weight: 800;
    text-align: right;
}

.finance-exception-list {
    display: grid;
    gap: 0.55rem;
}

.finance-exception-list article {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0.65rem;
    align-items: center;
    padding: 0.7rem;
    border-left: 4px solid #c58d1f;
    border-radius: 12px;
    background: #fff9eb;
}

.finance-exception-list article.tone-critical {
    border-left-color: #a64235;
    background: #fff2ef;
}

.finance-exception-list article > span {
    display: grid;
    width: 2rem;
    height: 2rem;
    place-items: center;
    border-radius: 9px;
    color: #8b5b12;
    background: rgba(197, 141, 31, 0.14);
}

.finance-exception-list article.tone-critical > span {
    color: #8e352b;
    background: rgba(166, 66, 53, 0.12);
}

.finance-exception-list strong,
.finance-exception-list p,
.finance-exception-list small {
    margin: 0;
}

.finance-exception-list p {
    margin-top: 0.15rem;
    color: var(--mid);
    font-size: 0.72rem;
}

.finance-exception-list small {
    color: var(--mid);
    font-family: var(--mono);
    font-size: 0.56rem;
}

.finance-exception-list b {
    color: var(--ink);
    font-family: "Playfair Display", serif;
    font-size: 1.2rem;
}

.finance-close-record {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.55rem;
}

.finance-close-record > div {
    display: grid;
    gap: 0.25rem;
    padding: 0.7rem;
    border-radius: 12px;
    background: #eef7f5;
}

.finance-close-record .finance-close-note {
    grid-column: 1 / -1;
}

.finance-close-record p,
.finance-close-guidance p {
    margin: 0;
    color: var(--mid);
    font-size: 0.74rem;
    line-height: 1.5;
}

.finance-close-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(12rem, 0.4fr) auto;
    gap: 0.7rem;
    align-items: end;
    margin-top: 0.8rem;
}

.finance-close-form .form-field:first-of-type:last-of-type {
    grid-column: span 2;
}

.finance-close-form textarea {
    min-height: 4.8rem;
    resize: vertical;
}

.finance-close-form small {
    color: #8b5b12;
    font-size: 0.65rem;
}

.finance-close-guidance {
    display: flex;
    gap: 0.6rem;
    align-items: flex-start;
    padding: 0.75rem;
    border-radius: 12px;
    background: #f4f6f7;
}

.finance-close-guidance i {
    margin-top: 0.15rem;
    color: var(--teal);
}

.finance-close-history {
    margin-top: 0.8rem;
    padding-top: 0.65rem;
    border-top: 1px solid rgba(15, 23, 42, 0.08);
}

.finance-close-history summary {
    cursor: pointer;
    color: var(--teal);
    font-size: 0.72rem;
    font-weight: 800;
}

.finance-close-history ol {
    display: grid;
    gap: 0.5rem;
    margin: 0.7rem 0 0;
    padding-left: 1.25rem;
}

.finance-close-history li,
.finance-close-history p {
    color: var(--mid);
    font-size: 0.7rem;
}

.finance-close-history p { margin: 0.15rem 0 0; }

@media (max-width: 1100px) {
    .finance-close-metric-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
    .finance-management-columns,
    .finance-close-form { grid-template-columns: 1fr; }
    .finance-close-form .form-field:first-of-type:last-of-type { grid-column: auto; }
    .finance-close-record { grid-template-columns: 1fr; }
    .finance-close-record .finance-close-note { grid-column: auto; }
}

@media (max-width: 520px) {
    .finance-close-metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .finance-exception-list article { align-items: start; }
}
.guardian-trial-callout {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 1.25rem;
    overflow: hidden;
    background:
        radial-gradient(circle at 92% 12%, rgba(228, 179, 47, 0.2), transparent 28%),
        linear-gradient(135deg, rgba(19, 112, 108, 0.1), rgba(255, 255, 255, 0.96));
}

.guardian-trial-callout-icon {
    display: grid;
    width: 3.5rem;
    height: 3.5rem;
    place-items: center;
    border-radius: 1rem;
    color: #fff;
    background: var(--teal, #167873);
    box-shadow: 0 0.75rem 1.5rem rgba(19, 112, 108, 0.2);
}

.guardian-trial-callout h3,
.guardian-trial-callout p {
    margin: 0;
}

.guardian-trial-callout .eyebrow-inline {
    margin-bottom: 0.35rem;
}

.guardian-trial-pill {
    margin-left: 0.35rem;
    color: #654500;
    background: rgba(239, 190, 52, 0.2);
}

.guardian-trial-start-grid {
    grid-template-columns: minmax(0, 56rem);
    justify-content: center;
}

.guardian-trial-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
}

.guardian-trial-summary > span {
    display: grid;
    gap: 0.25rem;
    padding: 1rem;
    border: 1px solid rgba(20, 92, 89, 0.14);
    border-radius: 1rem;
    background: rgba(238, 247, 245, 0.72);
}

.guardian-trial-summary i {
    color: var(--teal, #167873);
}

.guardian-trial-summary small {
    color: var(--muted, #686663);
}

@media (max-width: 720px) {
    .guardian-trial-callout {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .guardian-trial-callout .button {
        grid-column: 1 / -1;
        width: 100%;
    }

    .guardian-trial-summary {
        grid-template-columns: 1fr;
    }
}

/* Structured Section B workbook import */
.theory-import-hero {
    overflow: hidden;
    color: #fff;
    background:
        radial-gradient(circle at 88% 18%, rgba(244, 190, 45, 0.28), transparent 25%),
        linear-gradient(132deg, #123f46 0%, #176f6c 62%, #22857d 100%);
}

.theory-import-hero p,
.theory-import-hero .eyebrow-inline {
    color: rgba(255, 255, 255, 0.84);
}

.theory-import-upload-panel,
.theory-import-preview-panel {
    display: grid;
    gap: 1rem;
}

.theory-import-contract-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.8rem;
}

.theory-import-contract-grid article {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.8rem;
    align-items: start;
    padding: 1rem;
    border: 1px solid rgba(18, 63, 70, 0.12);
    border-radius: 1rem;
    background: linear-gradient(145deg, rgba(239, 248, 246, 0.88), #fff);
}

.theory-import-contract-grid article > span {
    display: grid;
    width: 2.5rem;
    height: 2.5rem;
    place-items: center;
    border-radius: 0.75rem;
    color: #fff;
    background: #146d69;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.08em;
}

.theory-import-contract-grid strong,
.theory-import-contract-grid p {
    margin: 0;
}

.theory-import-contract-grid p {
    margin-top: 0.3rem;
    color: var(--muted, #686663);
    font-size: 0.88rem;
}

.theory-import-hierarchy {
    display: grid;
    gap: 1rem;
}

.theory-import-question {
    overflow: hidden;
    border: 1px solid rgba(18, 63, 70, 0.15);
    border-radius: 1.15rem;
    background: #fff;
}

.theory-import-question.has-errors {
    border-color: rgba(172, 59, 47, 0.35);
}

.theory-import-question > header {
    display: grid;
    gap: 0.55rem;
    padding: 1rem 1.15rem;
    background: linear-gradient(120deg, rgba(226, 243, 240, 0.88), rgba(255, 255, 255, 0.95));
}

.theory-import-question > header > div {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.theory-import-question h3,
.theory-import-question header p {
    margin: 0;
}

.theory-import-question header p {
    color: var(--muted, #686663);
}

.theory-import-part-list {
    display: grid;
    gap: 0.75rem;
    margin: 0;
    padding: 1rem 1.15rem 1.15rem;
    list-style: none;
}

.theory-import-part-list > li {
    display: grid;
    gap: 0.7rem;
    padding: 0.9rem;
    border: 1px solid rgba(18, 63, 70, 0.11);
    border-radius: 0.9rem;
    background: rgba(248, 250, 249, 0.84);
}

.theory-import-part-list > li.has-errors {
    border-color: rgba(172, 59, 47, 0.32);
    background: rgba(255, 244, 241, 0.7);
}

.theory-import-part-head {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.75rem;
    align-items: center;
}

.theory-import-part-head div,
.theory-import-part-head small {
    display: grid;
    gap: 0.2rem;
}

.theory-import-part-head small {
    color: var(--muted, #686663);
}

.theory-import-part-label {
    display: grid;
    width: 2.75rem;
    height: 2.75rem;
    place-items: center;
    border-radius: 50%;
    color: #fff;
    background: #123f46;
    font-weight: 800;
}

.theory-import-part-list details {
    padding: 0.75rem;
    border-radius: 0.75rem;
    background: #fff;
}

.theory-import-part-list summary {
    cursor: pointer;
    font-weight: 750;
}

.theory-import-part-list pre {
    overflow: auto;
    white-space: pre-wrap;
}

.theory-import-row-messages,
.theory-import-row-warnings,
.theory-import-answer-list {
    padding: 0.75rem 0.9rem;
    border-radius: 0.75rem;
}

.theory-import-row-messages {
    color: #842f27;
    background: #fff0ed;
}

.theory-import-row-warnings {
    color: #684b0e;
    background: #fff6df;
}

.theory-import-answer-list {
    color: #174e4d;
    background: #eaf6f3;
}

.theory-import-row-messages ul,
.theory-import-row-warnings ul,
.theory-import-answer-list ul {
    margin: 0.4rem 0 0;
    padding-left: 1.2rem;
}

.theory-import-error-index {
    display: grid;
    gap: 0.8rem;
    padding: 1rem;
    border: 1px solid rgba(172, 59, 47, 0.24);
    border-radius: 1rem;
    background: rgba(255, 244, 241, 0.62);
}

.theory-import-error-index h3,
.theory-import-error-index p {
    margin: 0;
}

.theory-import-confirm-bar {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: center;
    padding: 1rem;
    border: 1px solid rgba(18, 63, 70, 0.14);
    border-radius: 1rem;
    background: linear-gradient(120deg, rgba(233, 247, 243, 0.88), #fff);
}

.theory-import-confirm-bar p,
.theory-import-confirm-bar form {
    margin: 0;
}

.theory-accepted-answer-preview {
    margin-top: 0.75rem;
    padding: 0.8rem;
    border-radius: 0.75rem;
    background: #eaf6f3;
}

.theory-accepted-answer-preview ul {
    margin: 0.45rem 0 0;
    padding-left: 1.2rem;
}

.theory-answer-guidance-editor {
    display: grid;
    gap: 0.9rem;
    margin-top: 1rem;
    padding: 1rem;
    border: 1px solid rgba(18, 63, 70, 0.14);
    border-radius: 1rem;
    background: linear-gradient(125deg, rgba(233, 247, 243, 0.8), #fff 72%);
}

.theory-answer-guidance-editor .section-heading,
.theory-answer-guidance-editor h4,
.theory-answer-guidance-editor p,
.theory-answer-guidance-form {
    margin: 0;
}

.theory-answer-guidance-list {
    display: grid;
    gap: 0.55rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.theory-answer-guidance-list > li {
    display: flex;
    justify-content: space-between;
    gap: 0.8rem;
    align-items: center;
    padding: 0.75rem 0.85rem;
    border: 1px solid rgba(18, 63, 70, 0.1);
    border-radius: 0.75rem;
    background: #fff;
}

.theory-answer-guidance-list strong,
.theory-answer-guidance-list small {
    display: block;
}

.theory-answer-guidance-list small {
    margin-top: 0.18rem;
    color: var(--muted, #686663);
}

.theory-answer-guidance-list form {
    margin: 0;
}

.theory-answer-guidance-form {
    display: grid;
    gap: 0.8rem;
}

@media (max-width: 820px) {
    .theory-import-contract-grid {
        grid-template-columns: 1fr;
    }

    .theory-import-confirm-bar {
        align-items: stretch;
        flex-direction: column;
    }
}

@media (max-width: 560px) {
    .theory-import-confirm-bar .button-row,
    .theory-import-confirm-bar form,
    .theory-import-confirm-bar .button {
        width: 100%;
    }

    .theory-answer-guidance-list > li {
        align-items: stretch;
        flex-direction: column;
    }
}

.auth-signin-page .auth-signin-copy {
    grid-column: 1;
    grid-row: 1;
    align-self: end;
}

.auth-signin-page .auth-signin-card {
    grid-column: 2;
    grid-row: 1 / span 2;
    align-self: center;
}

.auth-signin-page .auth-signin-steps {
    grid-column: 1;
    grid-row: 2;
    align-self: start;
    margin-top: 0;
}

@media (max-width: 1100px) {
    .auth-classroom-page.auth-signin-page .auth-signin-copy,
    .auth-classroom-page.auth-signin-page .auth-signin-card,
    .auth-classroom-page.auth-signin-page .auth-signin-steps {
        grid-column: 1;
        grid-row: auto;
        align-self: stretch;
    }
}

@media (max-width: 760px) {
    .auth-login-page.auth-signin-page .auth-signin-copy,
    .auth-login-page.auth-signin-page .auth-signin-card,
    .auth-login-page.auth-signin-page .auth-signin-steps {
        grid-column: 1;
        grid-row: auto;
        align-self: stretch;
    }
}

/* Guardian learning checkout keeps discovery and learner assignment in distinct blocks. */
.guardian-learning-choice-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    margin-block: 1.25rem;
}
.guardian-learning-choice {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .75rem;
    min-width: 0;
    color: inherit;
    text-decoration: none;
    border: 1px solid rgba(16, 103, 103, .18);
    background: linear-gradient(145deg, #ffffff, #f1f7f3);
}
.guardian-learning-choice:nth-child(2) { background: linear-gradient(145deg, #fffdf8, #f7f1df); }
.guardian-learning-choice:hover { border-color: #177575; transform: translateY(-2px); }
.guardian-learning-choice-icon {
    display: grid;
    place-items: center;
    width: 3rem;
    height: 3rem;
    border-radius: 1rem;
    color: #ffffff;
    background: #176c6e;
}
.guardian-learning-choice:nth-child(2) .guardian-learning-choice-icon { background: #b68a24; }
.guardian-learning-choice > strong { font-family: var(--font-display, Georgia, serif); font-size: clamp(1.5rem, 2vw, 2rem); }
.guardian-learning-choice-link { margin-top: auto; padding-top: .6rem; color: #176c6e; font-weight: 700; }
.guardian-purchase-hero {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 1rem;
    margin-bottom: .85rem;
    padding: clamp(1.15rem, 2.5vw, 1.8rem);
    border: 1px solid rgba(23, 108, 110, .2);
    border-radius: 1.25rem;
    background: linear-gradient(115deg, #eaf5f3, #ffffff 76%);
    box-shadow: var(--workspace-card-shadow);
    scroll-margin-top: 5rem;
}
.guardian-purchase-hero-icon {
    display: grid;
    place-items: center;
    width: 3.5rem;
    height: 3.5rem;
    border-radius: 1rem;
    color: #fff;
    background: #176c6e;
    font-size: 1.25rem;
}
.guardian-purchase-hero-copy { min-width: 0; }
.guardian-purchase-hero-copy .eyebrow-inline { display: flex; align-items: center; flex-wrap: wrap; gap: .65rem; margin: 0 0 .4rem; }
.guardian-purchase-hero-copy [data-purchase-step-number] { padding: .25rem .55rem; border-radius: 999px; color: #155e60; background: #dcefeb; }
.guardian-purchase-hero-copy h2 { margin: 0; font-family: var(--font-display, Georgia, serif); font-size: clamp(1.55rem, 3vw, 2.2rem); line-height: 1.12; }
.guardian-purchase-hero-copy > p:last-child { margin: .45rem 0 0; color: #52676a; line-height: 1.45; }
.guardian-purchase-progress { margin-bottom: 1.1rem; }
[hidden][data-guardian-quote-preview] { display: none !important; }
.guardian-quote-builder-grid.estimate-hidden { grid-template-columns: minmax(0, 1fr); }
.guardian-running-estimate { position: sticky; top: 1rem; padding: 1.15rem; }
.guardian-running-estimate h3 { margin: 0; color: #153043; font-size: 1.05rem; line-height: 1.2; }
.guardian-estimate-intro { margin: .35rem 0 1rem; color: #607780; font-size: .8rem; line-height: 1.4; }
.guardian-estimate-total { display: grid; gap: .35rem; padding: 1rem; border: 1px solid #cce6df; border-radius: .9rem; background: linear-gradient(140deg, #eef9f5, #fafdfb); }
.guardian-estimate-total > span { color: #157273; font: 800 .64rem 'Space Mono', monospace; letter-spacing: .11em; text-transform: uppercase; }
.guardian-estimate-total > strong { color: #153043; font-family: var(--font-display, Georgia, serif); font-size: clamp(1.65rem, 2.4vw, 2rem); line-height: 1.1; }
.guardian-estimate-total > small { color: #607780; font-size: .74rem; line-height: 1.4; }
.guardian-estimate-breakdown { margin: 1rem 0; }
.guardian-estimate-breakdown > div { display: flex; justify-content: space-between; align-items: baseline; gap: .75rem; padding: .65rem 0; border-bottom: 1px solid #e2eae9; }
.guardian-estimate-breakdown dt { flex: 0 0 auto; color: #607780; font-size: .79rem; }
.guardian-estimate-breakdown dd { margin: 0; color: #153043; font-size: .79rem; font-weight: 750; text-align: right; overflow-wrap: anywhere; }
@media (max-width: 760px) {
    .guardian-quote-builder-grid { display: flex; flex-direction: column; }
    .guardian-quote-builder-grid .guardian-quote-preview { order: -1; width: 100%; position: static; }
    .guardian-quote-builder-grid .school-package-request-form { width: 100%; }
}
.guardian-checkout-stepbar {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: .4rem;
    margin: 0;
    padding: 0;
    list-style: none;
}
.guardian-checkout-stepbar.is-overview { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 900px) {
    .guardian-checkout-stepbar { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .guardian-checkout-stepbar.is-overview { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.guardian-checkout-stepbar li {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: .4rem;
    min-width: 0;
    min-height: 62px;
    padding: .5rem;
    overflow: hidden;
    border: 1px solid #d9e5e3;
    border-radius: 1rem;
    background: rgba(255, 255, 255, .9);
    color: #263d3f;
}
.guardian-checkout-stepbar li::after { content: ''; position: absolute; inset: auto 0 0; height: 3px; background: #d9e5e3; }
.guardian-checkout-stepbar li.is-done { border-color: #bddbd5; background: linear-gradient(120deg, #e8f4f1, #fff); }
.guardian-checkout-stepbar li.is-done::after { background: #176c6e; }
.guardian-checkout-stepbar li.is-current { border-color: #176c6e; background: linear-gradient(120deg, #e6f4f1, #fff); }
.guardian-checkout-stepbar li.is-current::after { background: #176c6e; }
.guardian-checkout-stepbar li.is-upcoming { color: #627579; }
.guardian-checkout-step-icon { display: grid; place-items: center; width: 1.7rem; height: 1.7rem; border-radius: .52rem; background: #ecf1ef; color: #537174; font-family: 'Space Mono', monospace; font-size: .68rem; font-weight: 800; }
.guardian-checkout-stepbar .is-done .guardian-checkout-step-icon { background: #176c6e; color: #fff; }
.guardian-checkout-stepbar .is-current .guardian-checkout-step-icon { background: #176c6e; color: #fff; }
.guardian-checkout-stepbar li > span:nth-child(2) { display: grid; gap: .1rem; min-width: 0; }
.guardian-checkout-stepbar small { color: #287375; font-family: 'Space Mono', monospace; font-size: .53rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.guardian-checkout-stepbar strong { font-size: .72rem; line-height: 1.17; }
.guardian-wizard-actions { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: .75rem; margin-top: 1.4rem; }
.guardian-wizard-actions .button { min-height: 44px; }
.guardian-wizard-error { margin: 1rem 0; padding: .85rem 1rem; border: 1px solid #d6a297; border-radius: .75rem; background: #fff2ee; color: #873d31; }
.guardian-wizard-review { display: grid; gap: 1rem; margin-top: 1rem; }
.guardian-wizard-review .school-package-quote-total { margin: 0; }
[hidden][data-guardian-quote-step], [hidden][data-course-step], [hidden][data-purchase-branch], [hidden][data-purchase-type-stage] { display: none !important; }
.guardian-course-builder-panel { margin-bottom: 1rem; }
.guardian-course-checkout-layout.has-estimate { display: grid; grid-template-columns: minmax(0, 1fr) minmax(250px, .4fr); align-items: start; gap: 1rem; }
[hidden][data-course-estimate-panel] { display: none !important; }
[hidden][data-course-mobile-estimate] { display: none !important; }
.guardian-course-estimate-panel { position: sticky; top: 1rem; padding: 1.1rem; }
.guardian-course-estimate-panel .eyebrow-inline { margin: 0 0 .3rem; }
.guardian-course-estimate-panel h3 { margin: 0 0 .8rem; font-family: var(--font-display, Georgia, serif); font-size: 1.15rem; }
.guardian-course-estimate-panel > strong { display: block; color: #155e60; font-family: var(--font-display, Georgia, serif); font-size: clamp(1.45rem, 2.3vw, 2rem); }
.guardian-course-estimate-panel > p:last-child { margin: .55rem 0 0; color: #52676a; font-size: .83rem; line-height: 1.45; }
.guardian-course-mobile-estimate { display: none; }
.guardian-course-review-total { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: .5rem; margin-top: 1rem; padding: .85rem 1rem; border-radius: .8rem; background: #eaf5f2; color: #154f51; }
.guardian-course-review-total strong { font-size: 1.25rem; }
.guardian-course-estimate-note { color: #52676a; font-size: .83rem; }
.guardian-course-line-amount { color: #155e60; white-space: nowrap; }
.guardian-course-filter-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .85rem; margin: 1rem 0 1.25rem; }
.guardian-course-filter-row select, .guardian-course-filter-row input { width: 100%; }
.guardian-course-choice-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; }
.guardian-course-choice {
    display: flex;
    align-items: center;
    gap: .8rem;
    min-width: 0;
    padding: .8rem;
    border: 1px solid #d8e4e1;
    border-radius: 1rem;
    background: #fff;
    cursor: pointer;
}
.guardian-course-choice:has(input:checked) { border-color: #176c6e; background: #f0f8f5; box-shadow: inset 0 0 0 1px #176c6e; }
.guardian-course-choice img, .guardian-course-choice-placeholder { flex: 0 0 4.5rem; width: 4.5rem; height: 4.5rem; border-radius: .7rem; object-fit: cover; }
.guardian-course-choice-placeholder { display: grid; place-items: center; color: #176c6e; background: #e8f3ef; font-size: 1.5rem; }
.guardian-course-choice-copy { display: flex; flex-direction: column; min-width: 0; gap: .15rem; }
.guardian-course-choice-copy small { color: #4a797a; font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
.guardian-course-choice-copy strong { line-height: 1.25; }
.guardian-course-choice-copy > span { color: #4a5e61; font-size: .85rem; }
.guardian-course-choice-check { margin-left: auto; color: #176c6e; opacity: 0; }
.guardian-course-choice:has(input:checked) .guardian-course-choice-check { opacity: 1; }
.guardian-course-assignment { margin: 0 0 1rem; padding: 1rem; border: 1px solid #d8e4e1; border-radius: 1rem; }
.guardian-course-assignment legend { padding-inline: .4rem; font-weight: 700; }
.guardian-course-assignment > p { margin: 0 0 .6rem; color: #52676a; font-size: .87rem; }
.guardian-course-assignment-wards { display: grid; gap: .6rem; }
.guardian-course-assignment-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .6rem .75rem; border-radius: .7rem; background: #f5f8f6; }
.guardian-course-assignment-row > label { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; cursor: pointer; }
.guardian-course-assignment-row small { color: #5a6e70; }
.guardian-course-assignment-row .form-field { min-width: 11rem; }
.guardian-course-assignment-row .form-field label { font-size: .74rem; }
.guardian-course-assignment-row select { width: 100%; }
.guardian-course-builder-actions, .guardian-order-total { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1rem; margin: 1rem 0; padding: 1rem 1.2rem; border-radius: 1rem; color: #fff; background: linear-gradient(120deg, #124a50, #187d7a); }
.guardian-course-builder-actions p { margin: 0; }
.guardian-order-line { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .9rem 0; border-bottom: 1px solid #e1e8e5; }
.guardian-order-line > div { display: flex; flex-direction: column; gap: .2rem; }
.guardian-order-line span { color: #586a6a; font-size: .88rem; }
.guardian-order-total { font-size: 1.1rem; }
.guardian-order-confirmation { color: #176c6e; font-weight: 700; }
[hidden].guardian-course-choice, [hidden].guardian-course-assignment { display: none !important; }
.guardian-subject-pick { display: inline-flex; align-items: center; gap: .55rem; margin: .5rem 0; padding: .55rem .8rem; border: 1px solid #bdd7d2; border-radius: .7rem; color: #145a5d; background: #edf7f4; font-weight: 700; cursor: pointer; }
.guardian-subject-pick:has(input:checked) { background: #176c6e; color: #fff; }
[hidden].guardian-catalogue-subject-card, [hidden].guardian-ward-picker { display: none !important; }
@media (max-width: 800px) {
    .guardian-learning-choice-grid, .guardian-course-choice-grid { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
    .guardian-course-checkout-layout.has-estimate { display: block; }
    .guardian-course-estimate-panel { display: none !important; }
    .guardian-course-mobile-estimate { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: .6rem; margin-top: 1rem; padding: .8rem 1rem; border: 1px solid #bddbd5; border-radius: .8rem; background: #eef7f4; }
    .guardian-course-mobile-estimate > span { display: grid; gap: .1rem; }
    .guardian-course-mobile-estimate small { color: #4f6c6e; }
    .guardian-course-mobile-estimate strong { color: #155e60; font-size: 1.2rem; }
}
@media (max-width: 560px) {
    .guardian-purchase-hero { grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: .7rem; padding: .95rem; }
    .guardian-purchase-hero-icon { width: 2.5rem; height: 2.5rem; border-radius: .75rem; font-size: .95rem; }
    .guardian-purchase-hero-copy h2 { font-size: 1.35rem; }
    .guardian-purchase-hero-copy > p:last-child { font-size: .85rem; }
    .guardian-checkout-stepbar, .guardian-checkout-stepbar.is-overview { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .35rem; }
    .guardian-checkout-stepbar li { grid-template-columns: 1fr; gap: .25rem; min-height: 66px; padding: .4rem; }
    .guardian-checkout-step-icon { width: 1.3rem; height: 1.3rem; border-radius: .38rem; font-size: .58rem; }
    .guardian-checkout-stepbar small { font-size: .47rem; }
    .guardian-checkout-stepbar strong { font-size: .66rem; }
    .guardian-wizard-actions .button { flex: 1 1 100%; justify-content: center; }
    .guardian-course-filter-row { grid-template-columns: 1fr; }
    .guardian-course-assignment-row { align-items: stretch; flex-direction: column; }
    .guardian-course-assignment-row .form-field { min-width: 0; }
    .guardian-order-line { align-items: flex-start; flex-direction: column; gap: .25rem; }
}

/* Guardian purchase: one calm, consistent visual language across both paths. */
.guardian-purchase-experience {
    --purchase-teal: #176c6e;
    --purchase-ink: #173b3f;
    --purchase-border: #d9e8e4;
    color: var(--purchase-ink);
}
.guardian-purchase-experience .guardian-purchase-hero {
    position: relative;
    overflow: hidden;
    margin-bottom: 1rem;
    border-color: #c7e0da;
    background: radial-gradient(circle at 93% 10%, #d5eee8 0, transparent 30%), linear-gradient(115deg, #edf7f3, #fffdf8 75%);
    box-shadow: 0 18px 40px rgba(30, 91, 87, .07);
}
.guardian-purchase-experience .guardian-purchase-hero::after {
    content: '';
    position: absolute;
    right: -2rem;
    bottom: -4.5rem;
    width: 11rem;
    aspect-ratio: 1;
    border: 1px solid rgba(23, 108, 110, .13);
    border-radius: 50%;
    pointer-events: none;
}
.guardian-purchase-experience .guardian-purchase-hero-icon {
    position: relative;
    z-index: 1;
    box-shadow: 0 8px 20px rgba(23, 108, 110, .15);
}
.guardian-purchase-experience .guardian-purchase-hero-copy { position: relative; z-index: 1; }
.guardian-purchase-experience .guardian-purchase-hero-copy [data-purchase-step-number] {
    color: #176c6e;
    background: #fff;
    border: 1px solid #cce4df;
    letter-spacing: .04em;
}
.guardian-purchase-experience .guardian-purchase-progress { margin-bottom: 1.25rem; }
.guardian-purchase-experience .guardian-checkout-stepbar { gap: .35rem; }
.guardian-purchase-experience .guardian-checkout-stepbar li {
    min-height: 58px;
    padding: .45rem;
    border-radius: .75rem;
    background: #fff;
    transition: background 160ms ease, border-color 160ms ease;
}
.guardian-purchase-experience .guardian-checkout-stepbar li::after { height: 2px; }
.guardian-purchase-experience .guardian-checkout-stepbar li.is-current {
    background: #eaf6f2;
    box-shadow: 0 4px 14px rgba(23, 108, 110, .09);
}
.guardian-purchase-experience .guardian-checkout-stepbar li.is-done { background: #f4faf7; }
.guardian-purchase-experience .guardian-checkout-stepbar li.is-upcoming { background: rgba(255, 255, 255, .68); }
.guardian-checkout-step-jump { position: absolute; z-index: 1; inset: 0; width: 100%; padding: 0; border: 0; background: transparent; cursor: pointer; }
.guardian-purchase-experience .guardian-checkout-stepbar li:has(.guardian-checkout-step-jump):hover { border-color: #176c6e; background: #eaf6f2; }
.guardian-purchase-experience .guardian-checkout-stepbar li:focus-within { outline: 3px solid #176c6e; outline-offset: 2px; }
.guardian-purchase-experience .guardian-learning-choice-grid { gap: 1rem; margin-block: 0; }
.guardian-purchase-experience .guardian-learning-choice {
    min-height: 225px;
    padding: clamp(1.25rem, 2.5vw, 1.8rem);
    border-radius: 1.25rem;
    background: linear-gradient(145deg, #fff, #eaf6f2);
    box-shadow: 0 14px 36px rgba(30, 91, 87, .06);
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}
.guardian-purchase-experience [data-choose-purchase-type="independent"] { border-color: #eadcb9; background: linear-gradient(145deg, #fffdf8, #f7f1df); }
.guardian-purchase-experience [data-choose-purchase-type="independent"] .guardian-learning-choice-icon { background: #b68a24; }
.guardian-purchase-experience [data-choose-purchase-type="independent"] .eyebrow-inline,
.guardian-purchase-experience [data-choose-purchase-type="independent"] .guardian-learning-choice-link { color: #8a661a; }
.guardian-purchase-experience [data-choose-purchase-type="independent"] .guardian-learning-choice-link { border-top-color: #eadcb9; }
.guardian-purchase-experience .guardian-learning-choice:hover,
.guardian-purchase-experience .guardian-learning-choice:focus-visible { transform: translateY(-3px); border-color: #176c6e; box-shadow: 0 18px 40px rgba(30, 91, 87, .12); }
.guardian-purchase-experience [data-choose-purchase-type="independent"]:hover,
.guardian-purchase-experience [data-choose-purchase-type="independent"]:focus-visible { border-color: #b68a24; box-shadow: 0 18px 40px rgba(161, 118, 25, .14); }
.guardian-purchase-experience .guardian-learning-choice-link { display: inline-flex; align-items: center; gap: .65rem; border-top: 1px solid #d9e8e4; width: 100%; }
.guardian-purchase-experience .guardian-learning-choice-grid { align-items: stretch; }
.guardian-purchase-experience .guardian-learning-choice.illustrated-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(5.5rem, 30%);
    grid-template-rows: auto 1fr auto;
    align-items: start;
    column-gap: .75rem;
    row-gap: .85rem;
    min-height: 15.5rem;
    overflow: hidden;
}
.guardian-purchase-experience .guardian-learning-choice > .guardian-learning-choice-top {
    display: flex;
    grid-column: 1 / -1;
    align-items: center;
    gap: .7rem;
    max-width: none;
}
.guardian-purchase-experience .guardian-learning-choice-top .eyebrow-inline {
    margin: 0;
    font-size: .67rem;
}
.guardian-purchase-experience .guardian-learning-choice > .guardian-learning-choice-copy {
    display: grid;
    grid-column: 1;
    grid-row: 2;
    align-content: start;
    gap: .45rem;
    min-width: 0;
    max-width: none;
    line-height: 1.45;
}
.guardian-purchase-experience .guardian-learning-choice-copy > strong {
    color: var(--ink);
    font-family: var(--font-display);
    font-size: clamp(1.35rem, 2vw, 1.75rem);
    line-height: 1.15;
}
.guardian-purchase-experience .guardian-learning-choice-copy > span {
    color: #53696a;
    font-size: .88rem;
}
.guardian-purchase-experience .guardian-learning-choice-art {
    display: block;
    grid-column: 2;
    grid-row: 2;
    align-self: center;
    width: 100%;
    height: 9rem;
    object-fit: contain;
    filter: drop-shadow(0 10px 13px rgba(18, 76, 82, .12));
}
.guardian-purchase-experience .guardian-learning-choice > .guardian-learning-choice-link {
    grid-column: 1 / -1;
    grid-row: 3;
    justify-content: space-between;
    min-height: 44px;
    margin-top: 0;
    padding-top: .8rem;
    font-size: .86rem;
}
@media (max-width: 430px) {
    .guardian-purchase-experience .guardian-learning-choice.illustrated-card {
        column-gap: .45rem;
        row-gap: .6rem;
        padding: 1rem;
    }
    .guardian-purchase-experience .guardian-learning-choice-art { height: 7.4rem; }
    .guardian-purchase-experience .guardian-learning-choice-copy > strong { font-size: 1.35rem; }
    .guardian-purchase-experience .guardian-learning-choice-copy > span { font-size: .82rem; }
}
.guardian-purchase-experience .guardian-quote-builder-grid,
.guardian-purchase-experience .guardian-course-checkout-layout { align-items: start; }
.guardian-purchase-experience .school-package-request-form,
.guardian-purchase-experience .guardian-course-builder-panel {
    border: 1px solid var(--purchase-border);
    border-radius: 1.25rem;
    background: #fff;
    box-shadow: 0 12px 34px rgba(30, 91, 87, .06);
}
.guardian-purchase-experience .school-package-request-form { padding: clamp(1rem, 2vw, 1.5rem); }
.guardian-purchase-experience .guardian-course-builder-panel { padding: clamp(1rem, 2vw, 1.5rem); }
.guardian-purchase-experience .school-package-form-section[data-guardian-quote-step],
.guardian-purchase-experience [data-guardian-quote-step="3"] > .school-package-form-section {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: none;
}
.guardian-purchase-experience .guardian-purchase-section-head {
    display: flex;
    align-items: flex-start;
    gap: .85rem;
    margin-bottom: 1.2rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--purchase-border);
}
.guardian-purchase-experience .guardian-purchase-section-head .school-package-section-icon { border-radius: .85rem; color: #176c6e; background: #e9f4f1; }
.guardian-purchase-experience .guardian-purchase-section-head > div { min-width: 0; }
.guardian-purchase-experience .guardian-purchase-section-kicker { display: block; margin-bottom: .2rem; color: #247576; font: 700 .66rem 'Space Mono', monospace; letter-spacing: .12em; text-transform: uppercase; }
.guardian-purchase-experience .guardian-purchase-section-head h3 { margin: 0; color: var(--purchase-ink); font-family: var(--font-display, Georgia, serif); font-size: clamp(1.3rem, 2.5vw, 1.75rem); line-height: 1.2; }
.guardian-purchase-experience .guardian-purchase-section-head p { margin: .35rem 0 0; color: #587073; font-size: .9rem; line-height: 1.45; }
.guardian-purchase-experience .guardian-course-filter-row { margin: 0 0 1.25rem; }
.guardian-purchase-experience .guardian-course-filter-row .form-field { max-width: 30rem; }
.guardian-purchase-experience .guardian-course-filter-row select,
.guardian-purchase-experience .guardian-course-filter-row input { min-height: 48px; border-radius: .8rem; }
.guardian-purchase-experience .guardian-catalogue-subject-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; }
.guardian-purchase-experience .guardian-catalogue-subject-card { display: flex; flex-direction: column; gap: .85rem; padding: 0 0 1rem; overflow: hidden; border-color: var(--purchase-border); background: #fff; cursor: pointer; }
.guardian-purchase-experience .guardian-catalogue-subject-cover { position: relative; display: grid; place-items: center; aspect-ratio: 16 / 8; overflow: hidden; background: radial-gradient(circle at 75% 20%, #d6eee6, transparent 50%), linear-gradient(125deg, #0e5057, #21817b); }
.guardian-purchase-experience .guardian-catalogue-subject-cover img { display: block; width: 100%; height: 100%; object-fit: cover; }
.guardian-purchase-experience .guardian-catalogue-subject-cover-fallback { color: #fff; font-size: 3.25rem; opacity: .86; }
.guardian-purchase-experience .guardian-catalogue-subject-cover-level { position: absolute; left: .8rem; bottom: .75rem; padding: .3rem .6rem; border-radius: .4rem; background: rgba(8, 45, 50, .88); color: #fff; font: 700 .67rem 'Space Mono', monospace; letter-spacing: .07em; text-transform: uppercase; }
.guardian-purchase-experience .guardian-catalogue-subject-card > header { display: grid; gap: .7rem; padding: 0; border: 0; }
.guardian-purchase-experience .guardian-catalogue-subject-card > header,
.guardian-purchase-experience .guardian-catalogue-subject-card > .guardian-subject-pick { margin-left: 1rem; margin-right: 1rem; }
.guardian-purchase-experience .guardian-catalogue-price { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .5rem; min-width: 0; text-align: left; }
.guardian-purchase-experience .guardian-catalogue-price > .button { margin-top: .3rem; }
.guardian-purchase-experience .guardian-subject-pick { justify-content: center; width: auto; margin-top: auto; margin-bottom: 0; min-height: 44px; }
.guardian-purchase-experience .guardian-subject-pick-selected { display: none; }
.guardian-purchase-experience .guardian-subject-pick:has(input:checked) .guardian-subject-pick-unselected { display: none; }
.guardian-purchase-experience .guardian-subject-pick:has(input:checked) .guardian-subject-pick-selected { display: inline; }
.guardian-purchase-experience .guardian-course-choice { min-height: 94px; border-color: var(--purchase-border); transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease; }
.guardian-purchase-experience .guardian-course-choice:hover,
.guardian-purchase-experience .guardian-catalogue-subject-card:hover { border-color: #80b8ac; }
.guardian-purchase-experience .guardian-course-choice:has(input:checked),
.guardian-purchase-experience .guardian-catalogue-subject-card.is-selected { background: #f0f8f5; border-color: #176c6e; box-shadow: inset 0 0 0 2px #176c6e, 0 12px 28px rgba(23, 108, 110, .1); transform: none; }
.guardian-purchase-experience .guardian-course-choice input { flex: 0 0 auto; accent-color: #176c6e; }
.guardian-purchase-experience .school-package-duration-option { align-items: flex-start; border-radius: 1rem; }
.guardian-purchase-experience .school-package-duration-option:has(input:checked) { box-shadow: inset 0 0 0 1px #176c6e; transform: none; }
.guardian-purchase-experience .guardian-ward-picker,
.guardian-purchase-experience .guardian-course-assignment { margin: 0 0 .9rem; padding: .9rem; border: 1px solid var(--purchase-border); border-radius: 1rem; background: #f9fcfa; }
.guardian-purchase-experience .guardian-ward-picker legend,
.guardian-purchase-experience .guardian-course-assignment legend { padding: 0 .35rem; color: #176c6e; font-size: .85rem; font-weight: 750; letter-spacing: 0; text-transform: none; }
.guardian-purchase-experience .guardian-ward-choice,
.guardian-purchase-experience .guardian-course-assignment-row { background: #fff; border: 1px solid var(--purchase-border); }
.guardian-purchase-experience .guardian-course-assignment-row:has(input:checked) { border-color: #176c6e; background: #eff8f4; }
.guardian-purchase-experience .guardian-wizard-review .school-package-quote-total,
.guardian-purchase-experience .guardian-course-review-total { border-radius: .9rem; background: #e8f4ef; }
.guardian-purchase-experience .guardian-wizard-actions { padding-top: 1rem; border-top: 1px solid var(--purchase-border); }
.guardian-purchase-experience .guardian-wizard-actions .button { border-radius: .75rem; }
.guardian-purchase-experience .guardian-running-estimate,
.guardian-purchase-experience .guardian-course-estimate-panel { border: 1px solid var(--purchase-border); border-radius: 1rem; background: #f6fbf8; box-shadow: 0 12px 34px rgba(30, 91, 87, .06); }
@media (max-width: 820px) {
    .guardian-purchase-experience .guardian-catalogue-subject-list { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
    .guardian-purchase-experience .guardian-purchase-hero { padding: 1rem; }
    .guardian-purchase-experience .guardian-purchase-hero::after { width: 7rem; bottom: -3rem; }
    .guardian-purchase-experience .guardian-checkout-stepbar { grid-template-columns: repeat(7, minmax(0, 1fr)); gap: .2rem; }
    .guardian-purchase-experience .guardian-checkout-stepbar.is-overview { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .guardian-purchase-experience .guardian-checkout-stepbar li { justify-items: center; align-content: center; min-height: 62px; padding: .25rem .1rem; text-align: center; border-radius: .55rem; }
    .guardian-purchase-experience .guardian-checkout-step-icon { width: 1.2rem; height: 1.2rem; }
    .guardian-purchase-experience .guardian-checkout-stepbar li > span:nth-child(2) { width: 100%; }
    .guardian-purchase-experience .guardian-checkout-stepbar small { display: none; }
    .guardian-purchase-experience .guardian-checkout-stepbar strong { font-size: clamp(.47rem, 2.05vw, .62rem); line-height: 1.1; overflow-wrap: anywhere; }
    .guardian-purchase-experience .guardian-learning-choice { min-height: 0; }
    .guardian-purchase-experience .guardian-purchase-section-head { gap: .65rem; }
    .guardian-purchase-experience .guardian-purchase-section-head .school-package-section-icon { width: 2.25rem; height: 2.25rem; }
    .guardian-purchase-experience .guardian-wizard-actions { flex-direction: column; align-items: stretch; }
    .guardian-purchase-experience .guardian-wizard-actions .button { flex: 0 0 auto; width: 100%; justify-content: center; }
}
@media (prefers-reduced-motion: reduce) {
    .guardian-purchase-experience .guardian-learning-choice,
    .guardian-purchase-experience .guardian-course-choice { transition: none; }
}

/* Guardian-facing exam readiness keeps scored and self-reported activity distinct. */
.guardian-readiness-page {
    --readiness-border: #d9e8e3;
    --readiness-teal: #176c6e;
    --readiness-ink: #173b3f;
    display: grid;
    gap: 1.2rem;
    min-width: 0;
}
.guardian-readiness-page .guardian-monitor-back { justify-self: start; margin: 0; }
.guardian-readiness-hero {
    position: relative;
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 1.4rem;
    overflow: hidden;
    padding: clamp(1.3rem, 3vw, 2.1rem);
    border: 1px solid #b7dcd3;
    border-radius: 1.35rem;
    background: radial-gradient(circle at 88% 18%, rgba(155, 217, 201, .45), transparent 30%), linear-gradient(125deg, #e9f5ef, #fffdf8 76%);
    box-shadow: 0 15px 38px rgba(24, 87, 83, .07);
}
.guardian-readiness-hero::after {
    content: '';
    position: absolute;
    right: -4rem;
    bottom: -6rem;
    width: 15rem;
    aspect-ratio: 1;
    border: 1px solid rgba(23, 108, 110, .15);
    border-radius: 50%;
    pointer-events: none;
}
.guardian-readiness-hero-copy,
.guardian-readiness-hero-note { position: relative; z-index: 1; }
.guardian-readiness-hero .eyebrow-inline { margin: 0 0 .5rem; color: var(--readiness-teal); }
.guardian-readiness-hero h2 { max-width: 20ch; margin: 0; color: var(--readiness-ink); font-family: var(--font-display, Georgia, serif); font-size: clamp(1.8rem, 3.4vw, 2.85rem); line-height: 1.08; }
.guardian-readiness-hero-copy > p:last-child { max-width: 52ch; margin: .75rem 0 0; color: #526c6b; line-height: 1.5; }
.guardian-readiness-hero-note { display: flex; align-items: center; gap: .6rem; flex: 0 0 min(15rem, 32%); padding: .8rem .9rem; border: 1px solid #c8e3dc; border-radius: .9rem; color: #235f5f; background: rgba(255, 255, 255, .82); font-size: .84rem; font-weight: 650; line-height: 1.4; }
.guardian-readiness-hero-note i { font-size: 1.1rem; }
.guardian-readiness-nav { display: flex; flex-wrap: wrap; gap: .55rem; }
.guardian-readiness-nav a { display: inline-flex; align-items: center; gap: .5rem; min-height: 42px; padding: .55rem .8rem; border: 1px solid var(--readiness-border); border-radius: .75rem; color: var(--readiness-ink); background: #fff; font-size: .84rem; font-weight: 700; text-decoration: none; transition: background 160ms ease, border-color 160ms ease; }
.guardian-readiness-nav a:hover,
.guardian-readiness-nav a:focus-visible { border-color: #83bcb0; background: #eff8f4; }
.guardian-readiness-nav i { color: var(--readiness-teal); }
.guardian-readiness-snapshot { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; }
.guardian-readiness-stat { display: flex; align-items: start; gap: .85rem; min-width: 0; padding: 1rem; border: 1px solid var(--readiness-border); border-radius: 1rem; background: #fff; box-shadow: 0 10px 25px rgba(24, 87, 83, .04); }
.guardian-readiness-stat-featured { border-color: #acd3c8; background: #edf7f2; }
.guardian-readiness-stat-icon { display: grid; place-items: center; flex: 0 0 2.5rem; width: 2.5rem; height: 2.5rem; border-radius: .75rem; color: var(--readiness-teal); background: #e5f2ee; }
.guardian-readiness-stat-featured .guardian-readiness-stat-icon { color: #fff; background: var(--readiness-teal); }
.guardian-readiness-stat > div { display: grid; gap: .1rem; min-width: 0; }
.guardian-readiness-stat > div > span { color: #3c6767; font-size: .75rem; font-weight: 750; }
.guardian-readiness-stat strong { color: var(--readiness-ink); font-family: var(--font-display, Georgia, serif); font-size: clamp(1.65rem, 3vw, 2.3rem); line-height: 1.1; }
.guardian-readiness-stat strong small { color: #547272; font-family: inherit; font-size: .5em; }
.guardian-readiness-stat > div > small { color: #617474; font-size: .75rem; line-height: 1.35; }
.guardian-readiness-section { min-width: 0; padding: clamp(1rem, 2vw, 1.5rem); border: 1px solid var(--readiness-border); border-radius: 1.2rem; background: #fff; box-shadow: 0 12px 30px rgba(24, 87, 83, .045); scroll-margin-top: 1rem; }
.guardian-readiness-section-head { display: flex; justify-content: space-between; align-items: start; flex-wrap: wrap; gap: .65rem 1rem; margin-bottom: 1.15rem; }
.guardian-readiness-section-head .eyebrow-inline { margin: 0 0 .25rem; color: var(--readiness-teal); }
.guardian-readiness-section-head h3 { margin: 0; color: var(--readiness-ink); font-family: var(--font-display, Georgia, serif); font-size: clamp(1.4rem, 2.6vw, 1.9rem); line-height: 1.18; }
.guardian-readiness-section-head p:last-child { margin: .35rem 0 0; color: #5b7070; font-size: .88rem; }
.guardian-readiness-section-head .pill { white-space: nowrap; }
.guardian-readiness-course-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; }
.guardian-readiness-course { display: flex; flex-direction: column; gap: .9rem; min-width: 0; padding: 1.1rem; border: 1px solid var(--readiness-border); border-top: 3px solid var(--readiness-teal); border-radius: 1rem; background: linear-gradient(155deg, #fff, #f8fcfa); }
.guardian-readiness-course.tone-warning,
.guardian-readiness-course.tone-watch { border-top-color: #b18b39; }
.guardian-readiness-course.tone-muted { border-top-color: #9caead; }
.guardian-readiness-course-top { display: flex; align-items: center; gap: .55rem; }
.guardian-readiness-course-icon { display: grid; place-items: center; width: 2rem; height: 2rem; border-radius: .65rem; color: var(--readiness-teal); background: #e8f4ef; }
.guardian-readiness-course-subject { color: #337778; font: 700 .68rem 'Space Mono', monospace; letter-spacing: .05em; text-transform: uppercase; }
.guardian-readiness-course-summary { display: flex; justify-content: space-between; align-items: start; gap: 1rem; }
.guardian-readiness-course-summary > div:first-child { min-width: 0; }
.guardian-readiness-course h4 { margin: 0 0 .35rem; color: var(--readiness-ink); font-family: var(--font-display, Georgia, serif); font-size: 1.18rem; line-height: 1.25; }
.guardian-readiness-course-summary p { margin: 0; color: #5c7070; font-size: .84rem; line-height: 1.45; }
.guardian-readiness-course-score { display: grid; justify-items: end; gap: .15rem; flex: 0 0 auto; text-align: right; }
.guardian-readiness-course-score span { color: #477879; font-size: .72rem; font-weight: 700; }
.guardian-readiness-course-score strong { color: var(--readiness-teal); font-family: var(--font-display, Georgia, serif); font-size: 1.7rem; line-height: 1; }
.guardian-readiness-course .guardian-monitor-progress { margin: 0; }
.guardian-readiness-course-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .4rem; margin: auto 0 0; padding: .8rem 0 0; border-top: 1px solid var(--readiness-border); }
.guardian-readiness-course-metrics div { display: grid; gap: .18rem; min-width: 0; }
.guardian-readiness-course-metrics dt { color: #6a7c7a; font-size: .68rem; }
.guardian-readiness-course-metrics dd { margin: 0; color: var(--readiness-ink); font-size: .94rem; font-weight: 750; }
.guardian-readiness-topic-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem; }
.guardian-readiness-topic { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .55rem; min-width: 0; padding: .9rem; border: 1px solid var(--readiness-border); border-radius: .85rem; background: #f9fcfa; }
.guardian-readiness-topic > div:first-child { display: grid; gap: .15rem; min-width: 0; }
.guardian-readiness-topic > div:first-child strong { overflow-wrap: anywhere; }
.guardian-readiness-topic > div:first-child span { color: #637775; font-size: .76rem; }
.guardian-readiness-topic-score { color: var(--readiness-teal); font-family: var(--font-display, Georgia, serif); font-size: 1.25rem; }
.guardian-readiness-topic .guardian-monitor-progress { grid-column: 1 / -1; margin: 0; }
.guardian-readiness-empty { display: flex; align-items: center; gap: .8rem; padding: 1.2rem; border: 1px dashed #bfd9d2; border-radius: 1rem; background: #f7fbf8; }
.guardian-readiness-empty > span { display: grid; place-items: center; flex: 0 0 2.7rem; width: 2.7rem; height: 2.7rem; border-radius: .8rem; color: var(--readiness-teal); background: #e3f1eb; }
.guardian-readiness-empty strong { color: var(--readiness-ink); }
.guardian-readiness-empty p { margin: .2rem 0 0; color: #607473; font-size: .86rem; }
.guardian-readiness-theory { display: grid; gap: 1rem; scroll-margin-top: 1rem; }
.guardian-readiness-theory > .content-panel { margin: 0; border: 1px solid var(--readiness-border); border-radius: 1.2rem; box-shadow: 0 12px 30px rgba(24, 87, 83, .045); }
.guardian-readiness-theory .theory-engagement-panel { background: linear-gradient(145deg, #f1f7f5, #fff); }
.guardian-readiness-theory .theory-report-note { color: #315d61; background: #fff; }
@media (max-width: 900px) {
    .guardian-readiness-course-grid { grid-template-columns: 1fr; }
}
@media (max-width: 700px) {
    .guardian-readiness-hero { align-items: start; flex-direction: column; gap: .85rem; }
    .guardian-readiness-hero-note { flex: 0 1 auto; width: 100%; }
    .guardian-readiness-snapshot { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .guardian-readiness-stat-featured { grid-column: 1 / -1; }
    .guardian-readiness-topic-grid { grid-template-columns: 1fr; }
}
@media (max-width: 420px) {
    .guardian-readiness-page { gap: .85rem; }
    .guardian-readiness-hero { padding: 1.1rem; }
    .guardian-readiness-hero h2 { font-size: 1.65rem; }
    .guardian-readiness-stat { gap: .5rem; padding: .75rem; }
    .guardian-readiness-stat-icon { flex-basis: 2rem; width: 2rem; height: 2rem; }
    .guardian-readiness-stat > div > small { font-size: .68rem; }
    .guardian-readiness-course-summary { flex-wrap: wrap; }
    .guardian-readiness-course-score { justify-items: start; text-align: left; }
    .guardian-readiness-course-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
}
@media (prefers-reduced-motion: reduce) {
    .guardian-readiness-nav a { transition: none; }
}

/* Compact guardian header: brand, ward finder, updates, and profile. */
.guardian-header-action, .guardian-profile-menu, .guardian-desktop-purchase, .workspace-desktop-action, .workspace-header-brand { display: none; }
.guardian-profile-dropdown[hidden] { display: none !important; }
.workspace-push-control[hidden],
.workspace-push-control button[hidden] { display: none !important; }
.workspace-push-control { margin: .45rem .15rem; padding: .55rem; border-top: 1px solid #d6e5e8; border-bottom: 1px solid #d6e5e8; }
.workspace-push-control button { display: flex; align-items: center; gap: .55rem; width: 100%; min-height: 44px; padding: .55rem .5rem; border: 0; border-radius: .65rem; background: #eaf4f2; color: #155f70; font: inherit; font-size: .85rem; font-weight: 750; text-align: left; cursor: pointer; }
.workspace-push-control button:hover, .workspace-push-control button:focus-visible { background: #dcece8; }
.workspace-push-control button[aria-checked="true"] { background: #e1f3ed; color: #176447; }
.workspace-push-control button:disabled { opacity: .65; cursor: wait; }
.workspace-push-label { display: inline-flex; align-items: center; gap: .55rem; min-width: 0; flex: 1; }
.workspace-push-state { color: #567072; font-size: .76rem; }
.workspace-push-track { display: inline-flex; align-items: center; width: 2.45rem; height: 1.4rem; padding: .17rem; border-radius: 999px; background: #9fb3b0; transition: background .2s ease; }
.workspace-push-thumb { width: 1.05rem; height: 1.05rem; border-radius: 50%; background: #fff; box-shadow: 0 1px 4px rgba(0, 0, 0, .18); transition: transform .2s ease; }
.workspace-push-control button[aria-checked="true"] .workspace-push-track { background: #18785b; }
.workspace-push-control button[aria-checked="true"] .workspace-push-thumb { transform: translateX(1.05rem); }
@media (prefers-reduced-motion: reduce) { .workspace-push-track, .workspace-push-thumb { transition: none; } }
#guardian-ward-finder { scroll-margin-top: 1rem; }
.guardian-ward-search-field { display: grid; gap: .4rem; max-width: 25rem; margin: 0 0 1rem; }
.guardian-ward-search-field label { color: #315f62; font-size: .78rem; font-weight: 750; }
.guardian-ward-search-field > div { position: relative; }
.guardian-ward-search-field i { position: absolute; top: 50%; left: .9rem; color: #557b7e; transform: translateY(-50%); pointer-events: none; }
.guardian-ward-search-field input { width: 100%; min-height: 44px; padding: .65rem .85rem .65rem 2.5rem; border: 1px solid #cbdedb; border-radius: .8rem; background: #fff; }
.guardian-ward-search-field input:focus-visible { outline: 2px solid #176c6e; outline-offset: 2px; }
.guardian-ward-search-empty { margin: .8rem 0 0; padding: .9rem 1rem; border-radius: .8rem; color: #456668; background: #edf7f3; }
[hidden][data-guardian-ward-card], [hidden][data-guardian-ward-search-empty] { display: none !important; }
@media (max-width: 900px) {
    .app-shell.has-workspace-mobile-nav .app-header {
        align-items: center;
        column-gap: .35rem;
        padding: .6rem max(.75rem, env(safe-area-inset-right, 0px)) .6rem max(.75rem, env(safe-area-inset-left, 0px));
        border-bottom-color: rgba(15, 54, 70, .1);
        background: rgba(255, 255, 255, .98);
    }
    .app-shell.has-workspace-mobile-nav .app-header-main { display: flex; flex-direction: column; justify-content: center; gap: .15rem; min-width: 0; width: auto; }
    .app-shell.has-workspace-mobile-nav .guardian-mobile-brand { gap: .4rem; min-height: 46px; }
    .app-shell.has-workspace-mobile-nav .guardian-mobile-brand-art { position: relative; display: block; flex: 0 0 46px; width: 46px; height: 46px; overflow: hidden; }
    .app-shell.has-workspace-mobile-nav .guardian-mobile-brand-art img { position: absolute; top: -8px; left: -16px; width: 78px; height: 78px; max-width: none; padding: 0; border: 0; border-radius: 0; background: none; object-fit: initial; }
    .app-shell.has-workspace-mobile-nav .guardian-mobile-brand-copy strong { color: #10264f; font-family: var(--font-display, Georgia, serif); font-size: clamp(.98rem, 3vw, 1.2rem); font-weight: 800; letter-spacing: -.035em; }
    .app-shell.has-workspace-mobile-nav .guardian-mobile-brand-copy small { color: #146bc0; font-size: .57rem; font-weight: 800; letter-spacing: .26em; }
    .app-shell.has-workspace-mobile-nav .app-header h1 { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
    .app-shell.has-workspace-mobile-nav .app-header-mobile-identity { gap: .25rem; margin-left: 3.25rem; }
    .app-shell.has-workspace-mobile-nav .app-header-mobile-identity span { font-size: .5rem; }
    .app-shell.has-workspace-mobile-nav .app-header-mobile-identity strong { max-width: 13rem; font-size: .64rem; }
    .app-shell.has-workspace-mobile-nav .header-right { align-items: center; gap: .15rem; }
    .app-shell.has-workspace-mobile-nav .notif-menu { flex: 0 0 42px; width: 42px; }
    .app-shell.has-workspace-mobile-nav .guardian-profile-menu { position: relative; display: block; flex: 0 0 42px; width: 42px; }
    .app-shell.has-workspace-mobile-nav .guardian-header-action { display: inline-grid; place-items: center; flex: 0 0 42px; width: 42px; height: 42px; border-radius: 50%; color: #10264f; font-size: 1.15rem; text-decoration: none; }
    .app-shell.has-workspace-mobile-nav .guardian-header-action:hover,
    .app-shell.has-workspace-mobile-nav .guardian-header-action:focus-visible { background: #edf5f8; outline-offset: 2px; }
    .app-shell.has-workspace-mobile-nav .guardian-header-profile { padding: 0; border: 0; color: #1671d0; background: #e5f1fc; cursor: pointer; }
    .app-shell.has-workspace-mobile-nav .guardian-header-profile .workspace-header-avatar-initial { display: none; }
    .app-shell.has-workspace-mobile-nav .guardian-header-profile .workspace-header-avatar { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; }
    .app-shell.has-workspace-mobile-nav .guardian-profile-menu.open .guardian-header-profile { background: #d7eafc; }
    .app-shell.has-workspace-mobile-nav .guardian-profile-dropdown { position: absolute; z-index: 60; top: calc(100% + .7rem); right: 0; width: min(260px, calc(100vw - 1rem)); padding: .55rem; border: 1px solid #d6e5e8; border-radius: 1rem; background: #fff; box-shadow: 0 18px 42px rgba(12, 41, 64, .17); }
    .app-shell.has-workspace-mobile-nav .guardian-profile-greeting { display: grid; gap: .1rem; padding: .75rem .75rem .85rem; border-bottom: 1px solid #e0e9eb; }
    .app-shell.has-workspace-mobile-nav .guardian-profile-greeting span { color: #587479; font-size: .78rem; }
    .app-shell.has-workspace-mobile-nav .guardian-profile-greeting strong { color: #10264f; font-family: var(--font-display, Georgia, serif); font-size: 1.2rem; line-height: 1.2; overflow-wrap: anywhere; }
    .app-shell.has-workspace-mobile-nav .guardian-profile-dropdown a { display: flex; align-items: center; gap: .65rem; min-height: 44px; margin-top: .3rem; padding: .55rem .65rem; border-radius: .65rem; color: #155f70; font-size: .86rem; font-weight: 750; text-decoration: none; }
    .app-shell.has-workspace-mobile-nav .guardian-profile-dropdown a i:last-child { margin-left: auto; }
    .app-shell.has-workspace-mobile-nav .guardian-profile-dropdown a:hover,
    .app-shell.has-workspace-mobile-nav .guardian-profile-dropdown a:focus-visible { background: #edf6f7; }
    .app-shell.has-workspace-mobile-nav .notif-btn { width: 42px; height: 42px; border: 0; color: #10264f; background: transparent; font-size: 1.2rem; }
    .app-shell.has-workspace-mobile-nav .notif-btn:hover,
    .app-shell.has-workspace-mobile-nav .notif-btn:focus-visible { background: #edf5f8; }
    .app-shell.has-workspace-mobile-nav .notif-dot { top: 6px; right: 7px; background: #e84938; }
}
@media (max-width: 360px) {
    .app-shell.has-workspace-mobile-nav .app-header { column-gap: .1rem; padding-inline: .45rem; }
    .app-shell.has-workspace-mobile-nav .guardian-mobile-brand { gap: .25rem; }
    .app-shell.has-workspace-mobile-nav .guardian-mobile-brand-art { flex-basis: 40px; width: 40px; height: 40px; }
    .app-shell.has-workspace-mobile-nav .guardian-mobile-brand-art img { top: -7px; left: -14px; width: 70px; height: 70px; }
    .app-shell.has-workspace-mobile-nav .guardian-mobile-brand-copy strong { font-size: .95rem; }
    .app-shell.has-workspace-mobile-nav .guardian-mobile-brand-copy small { font-size: .52rem; letter-spacing: .2em; }
    .app-shell.has-workspace-mobile-nav .app-header-mobile-identity { margin-left: 2.8rem; }
    .app-shell.has-workspace-mobile-nav .guardian-header-action,
    .app-shell.has-workspace-mobile-nav .notif-btn { width: 40px; height: 40px; }
    .app-shell.has-workspace-mobile-nav .guardian-header-action { flex-basis: 40px; }
    .app-shell.has-workspace-mobile-nav .notif-menu { flex-basis: 40px; width: 40px; }
    .app-shell.has-workspace-mobile-nav .guardian-profile-menu { flex-basis: 40px; width: 40px; }
}

/* Keep the desktop rail full height; each state shows its brand beside its toggle. */
@media (min-width: 901px) {
    .app-shell {
        --sidebar-w: clamp(248px, 20vw, 280px);
        --workspace-header-h: 70px;
    }
    .app-shell .app-main { padding-top: var(--workspace-header-h); }
    .app-shell .app-header,
    .app-shell.has-student-mobile-nav .app-header {
        position: fixed;
        inset: 0 0 auto;
        left: var(--sidebar-w);
        z-index: 110;
        align-items: center;
        min-height: var(--workspace-header-h);
        padding: .7rem clamp(1rem, 2vw, 1.7rem);
        border-bottom: 1px solid #dbe8e7;
        background: rgba(255, 255, 255, .98);
        box-shadow: 0 6px 24px rgba(22, 67, 72, .06);
        transition: left var(--sidebar-motion-duration) var(--sidebar-motion-ease);
    }
    .app-shell.sidebar-collapsed .app-header { left: var(--sidebar-collapsed-w); }
    .app-shell.sidebar-state-pending .app-header { transition: none; }
    .app-shell .app-header-main { display: flex; align-items: center; gap: .75rem; }
    .app-shell .app-sidebar-toggle {
        display: grid;
        place-items: center;
        flex: 0 0 42px;
        width: 42px;
        height: 42px;
        padding: 0;
        border: 1px solid #dce7ed;
        border-radius: 50%;
        background: #fff;
        color: #183653;
        font-size: 0;
        cursor: pointer;
    }
    .app-shell .app-sidebar-toggle:hover,
    .app-shell .app-sidebar-toggle:focus-visible { border-color: #9fbfc9; background: #eff7f8; }
    .app-shell.sidebar-collapsed .app-sidebar-toggle {
        position: absolute;
        top: 10px;
        left: calc(15px - var(--sidebar-collapsed-w));
        width: 50px;
        height: 50px;
        border-color: rgba(255, 255, 255, .12);
        border-radius: 16px;
        background: rgba(255, 255, 255, .05);
        color: var(--cream);
    }
    .app-shell.sidebar-collapsed .app-sidebar-toggle:hover,
    .app-shell.sidebar-collapsed .app-sidebar-toggle:focus-visible {
        border-color: rgba(46, 158, 158, .4);
        background: rgba(46, 158, 158, .18);
    }
    .app-shell .app-sidebar-toggle-bars { display: none; }
    .app-shell .app-sidebar-toggle-label { display: none; }
    .app-shell .app-sidebar-toggle-chevron { display: grid; place-items: center; width: 1.2rem; height: 1.2rem; font-size: 1rem; line-height: 1; transition: transform var(--sidebar-motion-duration) var(--sidebar-motion-ease); }
    .app-shell.sidebar-collapsed .app-sidebar-toggle-chevron { transform: rotate(180deg); }
    .app-shell .sidebar-collapse-btn { display: none; }
    .app-shell:not(.sidebar-collapsed) .sidebar-collapse-btn { display: grid; place-items: center; flex: 0 0 42px; }
    .app-shell:not(.sidebar-collapsed) .app-sidebar-toggle,
    .app-shell:not(.sidebar-collapsed) .workspace-header-brand { display: none; }
    .app-shell .sidebar-collapse-btn i { position: static; display: grid; place-items: center; width: 1.2rem; height: 1.2rem; font-size: 1rem; line-height: 1; transform: none; }
    .app-shell .workspace-header-brand { display: inline-flex; align-items: center; gap: .45rem; min-width: 0; color: #10264f; text-decoration: none; }
    .app-shell .guardian-mobile-brand-art { position: relative; display: block; flex: 0 0 44px; width: 44px; height: 44px; overflow: hidden; }
    .app-shell .guardian-mobile-brand-art img { position: absolute; top: -8px; left: -15px; width: 76px; height: 76px; max-width: none; padding: 0; border: 0; border-radius: 0; background: none; object-fit: initial; }
    .app-shell .guardian-mobile-brand-copy { display: grid; gap: .05rem; }
    .app-shell .guardian-mobile-brand-copy strong { font-family: var(--font-display, Georgia, serif); font-size: 1.12rem; line-height: 1.05; white-space: nowrap; }
    .app-shell .guardian-mobile-brand-copy small { color: #146bc0; font-size: .57rem; font-weight: 800; letter-spacing: .25em; text-transform: uppercase; }
    .app-shell .app-header-badge-row,
    .app-shell .app-header-copy,
    .app-shell .app-header-meta,
    .app-shell .student-header-primary-action { display: none; }
    .app-shell .app-header h1 {
        position: static;
        display: flex;
        align-items: center;
        gap: .6rem;
        width: auto;
        height: auto;
        min-width: 0;
        max-width: 100%;
        color: #183653;
        font-family: var(--font-display, Georgia, serif);
        font-size: clamp(1.05rem, 1.6vw, 1.3rem);
        line-height: 1.2;
        overflow: hidden;
        clip-path: none;
        text-overflow: ellipsis;
    }
    .app-shell.sidebar-collapsed .app-header h1 { padding-left: .85rem; border-left: 1px solid #dbe8e7; }
    .app-shell .app-header-title-icon {
        display: inline-grid;
        place-items: center;
        flex: 0 0 2rem;
        width: 2rem;
        height: 2rem;
        border-radius: .6rem;
        color: #176c6e;
        background: #e6f3ef;
        font-size: .9rem;
    }
    .app-shell .app-header-title-text { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .app-shell .header-right { align-items: center; gap: .65rem; max-width: min(65vw, 720px); }
    .app-shell.has-guardian-mobile-nav .guardian-desktop-purchase { display: inline-flex; align-items: center; gap: .55rem; min-height: 40px; border-radius: .55rem; background: #176c6e; white-space: nowrap; }
    .app-shell.has-guardian-mobile-nav .guardian-desktop-purchase:hover,
    .app-shell.has-guardian-mobile-nav .guardian-desktop-purchase:focus-visible { background: #105759; }
    .app-shell .workspace-desktop-action { display: inline-flex; align-items: center; gap: .55rem; min-height: 40px; max-width: min(30vw, 250px); overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
    .app-shell .workspace-desktop-action span { overflow: hidden; text-overflow: ellipsis; }
    .app-shell .notif-menu { flex: 0 0 42px; width: 42px; }
    .app-shell .notif-btn { width: 42px; height: 42px; border-color: #e0e9ed; color: #183653; background: #fff; }
    .app-shell .guardian-profile-menu { position: relative; display: block; flex: 0 0 42px; width: 42px; }
    .app-shell .guardian-header-profile { display: inline-grid; place-items: center; width: 42px; height: 42px; padding: 0; border: 0; border-radius: 50%; color: #1671d0; background: #e5f1fc; cursor: pointer; }
    .app-shell .guardian-header-profile > i { display: none; }
    .app-shell .workspace-header-avatar { width: 42px; height: 42px; border-radius: 50%; object-fit: cover; }
    .app-shell .workspace-header-avatar-initial { font-size: .82rem; font-weight: 800; }
    .app-shell .guardian-header-profile:hover,
    .app-shell .guardian-header-profile:focus-visible { background: #d7eafc; }
    .app-shell .guardian-profile-dropdown { position: absolute; z-index: 60; top: calc(100% + .7rem); right: 0; width: 260px; padding: .55rem; border: 1px solid #d6e5e8; border-radius: 1rem; background: #fff; box-shadow: 0 18px 42px rgba(12, 41, 64, .17); }
    .app-shell .guardian-profile-greeting { display: grid; gap: .1rem; padding: .75rem .75rem .85rem; border-bottom: 1px solid #e0e9eb; }
    .app-shell .guardian-profile-greeting span { color: #587479; font-size: .78rem; }
    .app-shell .guardian-profile-greeting strong { color: #10264f; font-family: var(--font-display, Georgia, serif); font-size: 1.2rem; line-height: 1.2; overflow-wrap: anywhere; }
    .app-shell .guardian-profile-dropdown a { display: flex; align-items: center; gap: .65rem; min-height: 44px; margin-top: .3rem; padding: .55rem .65rem; border-radius: .65rem; color: #155f70; font-size: .86rem; font-weight: 750; text-decoration: none; }
    .app-shell .guardian-profile-dropdown a i:last-child { margin-left: auto; }
    .app-shell .guardian-profile-dropdown a:hover,
    .app-shell .guardian-profile-dropdown a:focus-visible { background: #edf6f7; }

    .app-shell .sidebar { top: 0; z-index: 90; }
    .app-shell .sidebar-shell { gap: .7rem; padding: 1rem .75rem 1rem; }
    .app-shell.sidebar-collapsed .sidebar-topbar { display: none; }
    .app-shell .sidebar-body { gap: .7rem; padding-right: 0; }
    .app-shell .sidebar-welcome-card { padding: .75rem; border-radius: .9rem; }
    .app-shell .sidebar-nav-panel { padding: .3rem; border: 0; border-radius: .9rem; background: transparent; box-shadow: none; }
    .app-shell .dashboard-nav { gap: .2rem; }
    .app-shell .sidebar-item { min-height: 46px; padding: .42rem .55rem; border-radius: .75rem; }
    .app-shell .sidebar-nav-group-links .sidebar-item { min-height: 42px; padding: .35rem .45rem; }
    .app-shell .sidebar-nav-group-links .s-ico { width: 1.9rem; height: 1.9rem; }
    .app-shell .sidebar-item:hover { transform: none; }
    .app-shell .sidebar-item.active::after { left: 0; height: 22px; }
    .app-shell .s-ico { width: 2rem; height: 2rem; border-radius: .6rem; }
    .app-shell .sidebar-item:hover .s-ico,
    .app-shell .sidebar-item.active .s-ico { transform: none; }
    .app-shell .sidebar-action-card,
    .app-shell .sidebar-utility-link { border-radius: .8rem; }
    .app-shell .sidebar-footer { padding: .75rem; border-radius: .9rem; }
    .app-shell.sidebar-collapsed .sidebar-shell { padding: calc(var(--workspace-header-h) + .35rem) .55rem .9rem; }
    .app-shell.sidebar-collapsed .sidebar-nav-panel,
    .app-shell.sidebar-collapsed .sidebar-collapsed-shortcuts-panel { background: transparent; }
    .app-shell.sidebar-collapsed .sidebar-item { min-height: 50px; padding: 0; }
    .app-shell.sidebar-collapsed .s-ico { width: 2.3rem; height: 2.3rem; }
}
@media (max-width: 900px) {
    .app-shell .workspace-header-brand { display: inline-flex; align-items: center; gap: .45rem; min-width: 0; color: #10264f; text-decoration: none; }
    .app-shell .guardian-mobile-brand-art { position: relative; display: block; flex: 0 0 44px; width: 44px; height: 44px; overflow: hidden; }
    .app-shell .guardian-mobile-brand-art img { position: absolute; top: -8px; left: -15px; width: 76px; height: 76px; max-width: none; padding: 0; border: 0; border-radius: 0; background: none; object-fit: initial; }
    .app-shell .guardian-mobile-brand-copy { display: grid; gap: .05rem; }
    .app-shell .guardian-mobile-brand-copy strong { font-family: var(--font-display, Georgia, serif); font-size: 1.05rem; line-height: 1.05; white-space: nowrap; }
    .app-shell .guardian-mobile-brand-copy small { color: #146bc0; font-size: .57rem; font-weight: 800; letter-spacing: .25em; text-transform: uppercase; }
    .app-shell .app-header h1,
    .app-shell.has-guardian-mobile-nav .app-header h1 {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: 0;
        overflow: hidden;
        clip-path: inset(50%);
        white-space: nowrap;
    }
    .app-shell.has-guardian-mobile-nav .app-header .app-header-main { align-items: flex-start; }
    .app-shell.has-guardian-mobile-nav .app-header .header-right { align-self: start; }
}

.guardian-quote-builder-grid .school-package-date-grid .form-field { min-width: 0; }
.guardian-quote-builder-grid .school-package-date-grid input[type="date"] {
    box-sizing: border-box;
    min-width: 0;
    height: 48px;
    min-height: 48px;
    padding: .65rem .9rem;
    font-size: 16px;
    line-height: 1.25;
    text-align: left;
}
.guardian-quote-builder-grid .school-package-date-grid input[type="date"]::-webkit-date-and-time-value { min-height: 1.25em; text-align: left; }
.guardian-quote-builder-grid .school-package-date-grid input[type="date"]::-webkit-datetime-edit { padding: 0; }
.guardian-date-picker { display: block; min-width: 0; }
.guardian-date-picker-face { display: none; }
@media (max-width: 760px) {
    .guardian-quote-builder-grid .guardian-date-picker.is-enhanced {
        position: relative;
        display: block;
        width: 100%;
        height: 52px;
        border: 1px solid var(--border);
        border-radius: 12px;
        background: #fff;
    }
    .guardian-quote-builder-grid .guardian-date-picker.is-enhanced:focus-within {
        border-color: rgba(26, 107, 107, .5);
        box-shadow: 0 0 0 3px rgba(26, 107, 107, .12);
    }
    .guardian-quote-builder-grid .guardian-date-picker.is-enhanced .guardian-date-picker-face {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: .7rem;
        height: 100%;
        padding: 0 .9rem;
        color: var(--ink);
        font-size: 1rem;
        white-space: nowrap;
        pointer-events: none;
    }
    .guardian-quote-builder-grid .guardian-date-picker.is-enhanced .guardian-date-picker-face i { color: #176c6e; }
    .guardian-quote-builder-grid .guardian-date-picker.is-enhanced input[type="date"] {
        position: absolute;
        z-index: 1;
        inset: 0;
        width: 100%;
        height: 100%;
        min-height: 0;
        margin: 0;
        opacity: 0;
        cursor: pointer;
    }
}

/* Shared workspace motion: orientation on entry and feedback during navigation. */
.dashboard-page {
    --workspace-motion-ease: cubic-bezier(.2, .8, .2, 1);
}

.dashboard-page.workspace-transition-ready .app-content > :not(.server-toast-payload, .student-dashboard-stack, .tutor-dashboard-stack):nth-child(-n+3),
.dashboard-page.workspace-transition-ready .app-content > :is(.student-dashboard-stack, .tutor-dashboard-stack) > :nth-child(-n+3) {
    animation: workspaceSectionEnter .4s var(--workspace-motion-ease) both;
}

.dashboard-page.workspace-transition-ready .app-content > :not(.server-toast-payload, .student-dashboard-stack, .tutor-dashboard-stack):nth-child(2),
.dashboard-page.workspace-transition-ready .app-content > :is(.student-dashboard-stack, .tutor-dashboard-stack) > :nth-child(2) {
    animation-delay: 55ms;
}

.dashboard-page.workspace-transition-ready .app-content > :not(.server-toast-payload, .student-dashboard-stack, .tutor-dashboard-stack):nth-child(3),
.dashboard-page.workspace-transition-ready .app-content > :is(.student-dashboard-stack, .tutor-dashboard-stack) > :nth-child(3) {
    animation-delay: 105ms;
}

@keyframes workspaceSectionEnter {
    from { opacity: .9; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}

.dashboard-page.workspace-transition-ready .app-content :is(
    .student-pulse-grid,
    .guardian-family-summary-grid,
    .tutor-pulse-grid,
    .school-pulse-grid,
    .admin-pulse-grid,
    .admin-command-card-grid,
    .dashboard-stat-grid,
    .oversight-summary-grid,
    .curriculum-summary-grid
) > :nth-child(-n+4) {
    animation: workspaceMetricEnter .42s var(--workspace-motion-ease) backwards;
}

.dashboard-page.workspace-transition-ready .app-content :is(
    .student-pulse-grid,
    .guardian-family-summary-grid,
    .tutor-pulse-grid,
    .school-pulse-grid,
    .admin-pulse-grid,
    .admin-command-card-grid,
    .dashboard-stat-grid,
    .oversight-summary-grid,
    .curriculum-summary-grid
) > :nth-child(2) { animation-delay: 55ms; }

.dashboard-page.workspace-transition-ready .app-content :is(
    .student-pulse-grid,
    .guardian-family-summary-grid,
    .tutor-pulse-grid,
    .school-pulse-grid,
    .admin-pulse-grid,
    .admin-command-card-grid,
    .dashboard-stat-grid,
    .oversight-summary-grid,
    .curriculum-summary-grid
) > :nth-child(3) { animation-delay: 105ms; }

.dashboard-page.workspace-transition-ready .app-content :is(
    .student-pulse-grid,
    .guardian-family-summary-grid,
    .tutor-pulse-grid,
    .school-pulse-grid,
    .admin-pulse-grid,
    .admin-command-card-grid,
    .dashboard-stat-grid,
    .oversight-summary-grid,
    .curriculum-summary-grid
) > :nth-child(4) { animation-delay: 155ms; }

@keyframes workspaceMetricEnter {
    from { opacity: .62; transform: translateY(10px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

.dashboard-page .app-header h1.workspace-title-updated .app-header-title-icon {
    animation: workspaceTitleIconEnter .34s var(--workspace-motion-ease);
}

.dashboard-page .app-header h1.workspace-title-updated .app-header-title-text {
    animation: workspaceTitleTextEnter .3s var(--workspace-motion-ease);
}

@keyframes workspaceTitleIconEnter {
    from { opacity: .55; transform: translateY(4px) scale(.88); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes workspaceTitleTextEnter {
    from { opacity: .5; transform: translateY(5px); }
    to { opacity: 1; transform: translateY(0); }
}

.dashboard-page .app-header::after {
    content: "";
    position: absolute;
    inset: auto 0 -1px;
    height: 3px;
    background: linear-gradient(90deg, #176c6e, #29a7af);
    transform: scaleX(0);
    transform-origin: left;
    pointer-events: none;
}

.dashboard-page.workspace-navigation-pending .app-header::after {
    animation: workspaceNavigationProgress 1.2s ease-out .12s both;
}

@keyframes workspaceNavigationProgress {
    from { transform: scaleX(0); }
    to { transform: scaleX(.9); }
}

.dashboard-page .notif-menu.open .notif-dropdown,
.dashboard-page .guardian-profile-menu.open .guardian-profile-dropdown:not([hidden]),
.dashboard-page .workspace-more-actions[open] > .workspace-more-panel {
    animation: workspacePopoverEnter .2s var(--workspace-motion-ease) both;
    transform-origin: top right;
}

@keyframes workspacePopoverEnter {
    from { opacity: .88; transform: translateY(-5px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

.dashboard-page .sidebar-item.active::after {
    animation: workspaceActiveMarker .26s var(--workspace-motion-ease) both;
}

@keyframes workspaceActiveMarker {
    from { opacity: .4; transform: translateY(-50%) scaleY(.55); }
    to { opacity: 1; transform: translateY(-50%) scaleY(1); }
}

.dashboard-page .student-quick-card:focus-visible {
    transform: translateY(-2px);
    border-color: rgba(26, 107, 107, .35);
    box-shadow: 0 0 0 3px rgba(26, 107, 107, .12);
}

@media (prefers-reduced-motion: reduce) {
    .dashboard-page.workspace-transition-ready .app-content,
    .dashboard-page.workspace-transition-ready .app-content > *,
    .dashboard-page.workspace-transition-ready .app-content > :is(.student-dashboard-stack, .tutor-dashboard-stack) > *,
    .dashboard-page .notif-menu.open .notif-dropdown,
    .dashboard-page .guardian-profile-menu.open .guardian-profile-dropdown:not([hidden]),
    .dashboard-page .workspace-more-actions[open] > .workspace-more-panel,
    .dashboard-page .sidebar-item.active::after {
        animation: none !important;
    }

    .dashboard-page.workspace-transition-ready .app-content :is(
        .student-pulse-grid,
        .guardian-family-summary-grid,
        .tutor-pulse-grid,
        .school-pulse-grid,
        .admin-pulse-grid,
        .admin-command-card-grid,
        .dashboard-stat-grid,
        .oversight-summary-grid,
        .curriculum-summary-grid
    ) > :nth-child(-n+4),
    .dashboard-page .app-header h1.workspace-title-updated .app-header-title-icon,
    .dashboard-page .app-header h1.workspace-title-updated .app-header-title-text {
        animation: none !important;
    }

    .dashboard-page.workspace-navigation-pending .app-header::after {
        animation: none;
        transform: scaleX(1);
    }

    .dashboard-page .student-quick-card:focus-visible {
        transform: none;
    }
}
.school-trial-panel {
    margin-block: 1rem;
    border: 1px solid #d8e6df;
    border-radius: 1.25rem;
}

.school-trial-classroom-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 26rem), 1fr));
    gap: 1rem;
    align-items: start;
}

.school-trial-request-form,
.school-trial-seat-form {
    display: grid;
    gap: 1.25rem;
}

.school-trial-request-form fieldset {
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
}

.school-trial-request-form legend,
.school-trial-note {
    display: block;
    margin-bottom: .7rem;
    color: #154e48;
    font-weight: 700;
}

.school-trial-choices {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr));
    gap: .7rem;
    max-height: 28rem;
    overflow-y: auto;
}

.school-trial-choice {
    display: flex;
    align-items: center;
    gap: .8rem;
    min-height: 3.25rem;
    padding: .8rem 1rem;
    border: 1px solid #cdded5;
    border-radius: .9rem;
    background: #fff;
    cursor: pointer;
    transition: border-color .18s ease, background-color .18s ease;
}

.school-trial-choice:hover,
.school-trial-choice:has(input:checked) {
    border-color: #267b6b;
    background: #edf7f1;
}

.school-trial-choice input {
    width: 1.1rem;
    height: 1.1rem;
    accent-color: #17675b;
    flex: 0 0 auto;
}

.school-trial-choice small {
    display: block;
    color: #5b7068;
}

.school-trial-note textarea {
    display: block;
    width: 100%;
    margin-top: .5rem;
    padding: .8rem;
    border: 1px solid #cdded5;
    border-radius: .75rem;
    resize: vertical;
}

@media (max-width: 900px) {
    html.ios-home-screen-app {
        --ios-home-screen-top-inset: env(safe-area-inset-top, 0px);
    }

    html.ios-home-screen-app .dashboard-page .app-shell .app-header {
        padding-top: calc(.6rem + var(--ios-home-screen-top-inset));
    }
}

@media (max-width: 760px) {
    html.ios-home-screen-app .landing-page .top-nav {
        top: calc(.75rem + var(--ios-home-screen-top-inset));
    }

    html.ios-home-screen-app .landing-page main {
        padding-top: var(--ios-home-screen-top-inset);
    }
}

.learning-achievements-page {
    display: grid;
    gap: 1.25rem;
    width: min(100%, 70rem);
    margin-inline: auto;
}

.learning-achievements-page .guardian-monitor-back {
    justify-self: start;
}

.learning-achievements-hero {
    align-items: center;
    margin-bottom: 0;
}

.learning-achievements-hero-mark {
    display: grid;
    place-items: center;
    flex: 0 0 5rem;
    width: 5rem;
    height: 5rem;
    border: 1px solid rgba(255, 255, 255, .35);
    border-radius: 1.25rem;
    background: rgba(255, 255, 255, .12);
    color: #f8da89;
    font-size: 2.3rem;
}

.learning-achievements-pending {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: 1rem 1.25rem;
    color: #275c52;
}

.learning-achievements-pending p,
.learning-achievements-stat p,
.learning-achievements-footnote {
    margin: 0;
}

.learning-achievements-stats,
.learning-achievements-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.learning-achievements-stat {
    display: flex;
    gap: 1rem;
    min-width: 0;
    padding: 1.25rem;
}

.learning-achievements-stat-icon,
.learning-achievement-badge-art,
.learning-achievement-upcoming-art {
    display: grid;
    place-items: center;
    flex: 0 0 2.75rem;
    width: 2.75rem;
    height: 2.75rem;
    border-radius: .9rem;
    background: #e7f3ed;
    color: #176b5f;
}

.learning-achievements-stat span:not(.learning-achievements-stat-icon) {
    display: block;
    color: #52716b;
    font-size: .85rem;
    font-weight: 700;
}

.learning-achievements-stat strong {
    display: block;
    margin: .15rem 0;
    color: #183e3d;
    font-size: clamp(1.6rem, 3vw, 2.1rem);
}

.learning-achievements-stat strong small {
    font-size: .75rem;
}

.learning-achievements-stat p,
.learning-achievement-badge span,
.learning-achievement-upcoming span {
    color: #61736c;
    font-size: .88rem;
    line-height: 1.5;
}

.learning-achievements-panel {
    padding: clamp(1rem, 2.5vw, 1.7rem);
}

.learning-achievements-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
}

.learning-achievements-heading h3 {
    margin: .2rem 0 0;
}

.learning-achievement-badge,
.learning-achievement-upcoming {
    display: flex;
    align-items: center;
    gap: .85rem;
    min-width: 0;
    padding: 1rem;
    border: 1px solid #d7e6de;
    border-radius: 1rem;
    background: #fbfdfb;
}

.learning-achievement-badge-art {
    background: #fff3d5;
    color: #916713;
}

.learning-achievement-badge strong,
.learning-achievement-upcoming strong {
    display: block;
    color: #183e3d;
}

.learning-achievement-check {
    margin-left: auto;
    color: #208a71;
}

.learning-achievement-upcoming {
    border-style: dashed;
    background: #f7faf7;
}

.learning-achievement-upcoming-art {
    background: #e9eeeb;
    color: #74877c;
}

.learning-achievements-empty {
    display: flex;
    align-items: center;
    gap: .8rem;
    padding: 1rem;
    border-radius: .8rem;
    background: #f5f9f5;
    color: #52716b;
}

.learning-achievements-empty p {
    margin: 0;
}

.learning-achievements-footnote {
    color: #61736c;
    font-size: .87rem;
}

.learning-achievements-entry {
    display: inline-flex;
    align-items: center;
    gap: .65rem;
    width: fit-content;
    max-width: 100%;
    color: #176b5f;
    font-weight: 700;
    text-decoration: none;
}

.learning-achievements-entry:hover {
    text-decoration: underline;
}

@media (max-width: 900px) {
    .learning-achievements-stats,
    .learning-achievements-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    .learning-achievements-stats,
    .learning-achievements-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .learning-achievements-hero-mark {
        display: none;
    }

    .learning-achievements-stat {
        align-items: center;
    }
}

.student-dashboard-refresh {
    gap: 1.2rem;
}

.learning-dashboard-fallback {
    display: grid;
    gap: 1rem;
}

.learning-dashboard-fallback h2 {
    margin: 0;
    font-size: clamp(1.25rem, 2vw, 1.6rem);
}

.learning-dashboard-fallback-links {
    display: flex;
    flex-wrap: wrap;
    gap: .7rem;
}

.learning-dashboard-fallback-links .button {
    min-height: 2.75rem;
}

.student-dashboard-refresh .student-hero-band {
    align-items: center;
    min-height: 9rem;
    margin-bottom: 0;
}

.student-dashboard-refresh .student-hero-copy {
    max-width: 78ch;
}

.illustrated-card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr));
    gap: .9rem;
}

.illustrated-card {
    --illustrated-card-accent: var(--action-accent, #235f95);
    --illustrated-card-tint: var(--action-tint, #eff6fd);
    position: relative;
    display: flex;
    min-width: 0;
    overflow: hidden;
    border: 1px solid #dce7e8;
    border-radius: 1.25rem;
    background: #fff;
    box-shadow: 0 10px 28px rgba(13, 53, 65, .055);
    color: #173e4a;
    text-decoration: none;
    transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}

a.illustrated-card:hover,
button.illustrated-card:hover {
    transform: translateY(-3px);
    border-color: color-mix(in srgb, var(--illustrated-card-accent) 34%, #dce7e8);
    box-shadow: 0 16px 34px rgba(13, 53, 65, .11);
}

.illustrated-card:focus-visible {
    outline: 3px solid var(--illustrated-card-accent);
    outline-offset: 3px;
}

.illustrated-card.tone-violet { --action-accent: #6254a9; --action-tint: #f1eefe; }
.illustrated-card.tone-mint { --action-accent: #176b5f; --action-tint: #e8f8f0; }
.illustrated-card.tone-gold { --action-accent: #805507; --action-tint: #fff4d7; }
.illustrated-card.tone-teal { --action-accent: #176b6a; --action-tint: #e7f5f2; }

.illustrated-card--action {
    flex-direction: column;
    align-items: flex-start;
    min-height: 13rem;
    padding: 1.15rem;
    background: radial-gradient(circle at 98% 100%, var(--illustrated-card-tint), transparent 68%), #fff;
}

.illustrated-card--cover {
    flex-direction: column;
}

.illustrated-card-media {
    display: grid;
    place-items: center;
    width: 100%;
    aspect-ratio: 16 / 10;
    overflow: hidden;
    background: var(--illustrated-card-tint);
}

.illustrated-card-media img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.illustrated-card-media.is-illustration img {
    width: min(72%, 12rem);
    height: min(78%, 9rem);
    object-fit: contain;
}

.illustrated-card-body {
    display: grid;
    align-content: start;
    gap: .55rem;
    min-width: 0;
    padding: 1rem 1.15rem 1.15rem;
}

.illustrated-card-body > :is(h2, h3, p) {
    margin: 0;
}

.illustrated-card--status {
    align-items: center;
    gap: 1rem;
    min-height: 8.5rem;
    padding: 1.1rem;
    background: linear-gradient(120deg, #fff, var(--illustrated-card-tint));
}

.illustrated-card--status .illustrated-card-art {
    width: clamp(3.5rem, 22%, 6rem);
    height: auto;
    max-height: 6rem;
    flex: 0 0 auto;
    object-fit: contain;
}

.student-subject-library {
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 16rem), 1fr));
    gap: 1rem;
}

.student-subject-card {
    min-height: 20rem;
}

.student-subject-card-media {
    position: relative;
    aspect-ratio: 16 / 9;
    max-height: 14rem;
    background: linear-gradient(130deg, #e8f3f6, #f4f8f3);
}

.student-subject-card-media.is-illustration {
    background: radial-gradient(circle at 50% 90%, #d9edf2, #f3f8f7 72%);
}

.student-subject-card-level {
    position: absolute;
    top: .75rem;
    left: .75rem;
    padding: .3rem .6rem;
    border: 1px solid rgba(21, 88, 100, .13);
    border-radius: 999px;
    background: rgba(255, 255, 255, .94);
    color: #135c67;
    font-family: var(--font-mono);
    font-size: .66rem;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.student-subject-card-body {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: .6rem;
    width: 100%;
}

.student-subject-card-title {
    color: var(--ink);
    font-family: var(--font-display);
    font-size: clamp(1.25rem, 2vw, 1.55rem);
    line-height: 1.2;
}

.student-subject-card-count {
    color: var(--muted);
    font-size: .86rem;
    line-height: 1.45;
}

.student-subject-card-progress-line {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: .75rem;
    margin-top: .35rem;
    color: #315d63;
    font-size: .82rem;
}

.student-subject-card-progress-line strong {
    color: #125e67;
    font-size: .95rem;
}

.student-subject-card .curriculum-row-progress {
    max-width: none;
    margin-top: 0;
}

.student-subject-card-action {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: .75rem;
    width: 100%;
    min-height: 2.5rem;
    margin-top: auto;
    padding-top: .65rem;
    border-top: 1px solid #e5eeee;
    color: #135c67;
    font-size: .82rem;
    font-weight: 700;
}

.student-progress-summary {
    border-color: #d8e8e7;
    border-radius: 1.25rem;
    background: linear-gradient(115deg, #fff, #f2f8f7);
    box-shadow: 0 10px 28px rgba(13, 53, 65, .045);
}

.student-context-stat.illustrated-card--status {
    display: grid;
    align-content: center;
    min-height: 5.2rem;
    padding: .85rem 1rem;
    border-color: #e0ecea;
    box-shadow: none;
    background: rgba(255, 255, 255, .85);
}

.student-context-stat.illustrated-card--status:nth-child(even) {
    background: #f0f8f7;
}

@media (max-width: 640px) {
    .student-subject-library {
        grid-template-columns: minmax(0, 1fr);
    }

    .student-subject-card-media {
        max-height: 12rem;
    }
}

.student-action-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .9rem;
}

.student-action-card {
    --action-accent: #235f95;
    --action-tint: #eff6fd;
}

:is(.student-action-icon, .illustrated-card-action-icon) {
    display: grid;
    place-items: center;
    width: 2.45rem;
    height: 2.45rem;
    flex: 0 0 auto;
    border-radius: .78rem;
    background: var(--action-tint);
    color: var(--action-accent);
    font-size: 1.05rem;
}

:is(.student-action-copy, .illustrated-card-action-copy) {
    position: relative;
    z-index: 1;
    display: flex;
    flex: 1;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    min-width: 0;
    margin-top: .62rem;
}

:is(.student-action-copy, .illustrated-card-action-copy) > strong {
    color: #173249;
    font-size: 1.02rem;
    line-height: 1.25;
}

:is(.student-action-detail, .illustrated-card-action-detail) {
    display: -webkit-box;
    max-width: calc(100% - 5rem);
    margin-top: .26rem;
    overflow: hidden;
    color: #62717c;
    font-size: .79rem;
    line-height: 1.38;
    overflow-wrap: anywhere;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

:is(.student-action-cta, .illustrated-card-action-cta) {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    min-height: 2.1rem;
    margin-top: auto;
    padding: .42rem .68rem;
    border-radius: 999px;
    background: var(--action-tint);
    color: var(--action-accent);
    font-size: .77rem;
    font-weight: 800;
    white-space: nowrap;
}

:is(.student-action-art, .illustrated-card-action-art) {
    position: absolute;
    right: -.55rem;
    bottom: -.7rem;
    width: clamp(5.5rem, 38%, 8.5rem);
    height: auto;
    max-height: 8.2rem;
    object-fit: contain;
    pointer-events: none;
}

.workspace-entry-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .8rem;
    margin-bottom: 1.45rem;
}

.school-home-hero {
    margin-bottom: .85rem;
}

.tutor-dashboard-stack > .tutor-hero-band {
    margin-bottom: 0;
}

.tutor-entry-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr));
    margin-bottom: 0;
}

.workspace-entry-card.illustrated-card--action {
    min-height: 11.4rem;
    padding: 1rem;
    border-radius: 1.15rem;
}

.workspace-entry-card .illustrated-card-action-copy {
    margin-top: .48rem;
}

.workspace-entry-card .illustrated-card-action-detail {
    max-width: calc(100% - 4.5rem);
}

.workspace-entry-card .illustrated-card-action-art {
    right: -.3rem;
    bottom: -.4rem;
    width: min(34%, 6rem);
    max-height: 6rem;
}

@media (max-width: 1000px) {
    .school-entry-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    .school-entry-grid,
    .tutor-entry-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .workspace-entry-card.illustrated-card--action {
        min-height: 10.5rem;
    }
}

.student-achievement-preview {
    display: flex;
    align-items: center;
    gap: .95rem;
    min-width: 0;
    padding: .85rem 1.2rem;
    border: 1px solid #d9e6dd;
    border-radius: 1.1rem;
    background: linear-gradient(115deg, #fffdf6, #edf6f1);
}

.student-achievement-preview > img {
    width: 4.1rem;
    height: 4.1rem;
    object-fit: contain;
    flex: 0 0 auto;
}

.student-achievement-copy {
    min-width: 0;
    flex: 1;
}

.student-achievement-copy .eyebrow-inline {
    margin: 0 0 .2rem;
    color: #227366;
}

.student-achievement-copy h3 {
    margin: 0;
    color: #194441;
    font-size: clamp(1rem, 1.8vw, 1.25rem);
}

.student-achievement-copy p:last-child {
    margin: .2rem 0 0;
    color: #61736c;
    font-size: .84rem;
}

.student-achievement-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .55rem;
    min-height: 2.75rem;
    padding: .5rem .85rem;
    border: 1px solid #b9d2c8;
    border-radius: .75rem;
    background: #fff;
    color: #176b5f;
    font-size: .82rem;
    font-weight: 800;
    text-decoration: none;
    white-space: nowrap;
}

.student-achievement-link:hover {
    border-color: #176b5f;
    background: #f4fbf7;
}

.student-dashboard-metrics .student-pulse-grid {
    gap: .7rem;
    margin-bottom: 0;
}

.student-dashboard-metrics .student-pulse-card {
    padding: .82rem .95rem;
    box-shadow: none;
}

.student-dashboard-metrics .student-pulse-icon {
    width: 2rem;
    height: 2rem;
}

.student-dashboard-refresh #student-progress,
.student-dashboard-refresh #student-courses {
    scroll-margin-top: 6rem;
}

.student-dashboard-refresh .student-support-grid {
    grid-template-columns: minmax(0, 1fr);
}

.student-achievement-dialog {
    position: fixed;
    width: min(26rem, calc(100% - 2rem));
    max-height: calc(100dvh - 2rem);
    overflow-y: auto;
    padding: 1.4rem;
    border: 1px solid #d8e5dd;
    border-radius: 1.4rem;
    background: radial-gradient(circle at 50% 0, #fff4d7, #fff 62%);
    box-shadow: 0 24px 75px rgba(8, 31, 44, .24);
    color: #173249;
    text-align: center;
}

.student-achievement-dialog[open] {
    animation: student-achievement-arrive .28s ease-out both;
}

.student-achievement-dialog::backdrop {
    background: rgba(8, 31, 44, .55);
}

.student-achievement-dialog > img {
    display: block;
    width: 7rem;
    height: 7rem;
    margin: .2rem auto .6rem;
    object-fit: contain;
}

.student-achievement-dialog .eyebrow-inline {
    color: #176b5f;
}

.student-achievement-dialog h2 {
    margin: .3rem 0;
    color: #173249;
}

.student-achievement-dialog p:not(.eyebrow-inline) {
    margin: 0 auto 1.2rem;
    max-width: 30ch;
    color: #5f7074;
}

.student-achievement-dialog-close {
    position: absolute;
    top: .65rem;
    right: .65rem;
    display: grid;
    place-items: center;
    width: 2.75rem;
    height: 2.75rem;
    border: 0;
    border-radius: 999px;
    background: #f1f5f2;
    color: #173249;
    cursor: pointer;
}

.student-achievement-dialog-actions {
    display: flex;
    justify-content: center;
    gap: .6rem;
    flex-wrap: wrap;
}

@keyframes student-achievement-arrive {
    from { opacity: 0; transform: translateY(12px) scale(.98); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@media (max-width: 1120px) {
    .student-action-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 600px) {
    .student-action-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .student-action-card {
        min-height: 10.8rem;
    }

    :is(.student-action-art, .illustrated-card-action-art) {
        width: min(36%, 8rem);
    }

    .student-achievement-preview {
        flex-wrap: wrap;
        padding: .85rem;
    }

    .student-achievement-preview > img {
        width: 3.25rem;
        height: 3.25rem;
    }

    .student-achievement-link {
        width: 100%;
    }

    .student-achievement-dialog-actions .button {
        flex: 1 1 10rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .illustrated-card {
        transition: none;
    }

    a.illustrated-card:hover,
    button.illustrated-card:hover {
        transform: none;
    }

    .student-achievement-dialog[open] {
        animation: none;
    }
}

.guardian-action-grid {
    margin: 0 0 1.25rem;
}

.guardian-action-card {
    min-height: 12rem;
}

.guardian-action-card :is(.student-action-detail, .illustrated-card-action-detail) {
    max-width: calc(100% - 3.5rem);
}

.guardian-ward-achievements {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) auto;
    align-items: center;
    gap: 1rem 1.25rem;
    min-width: 0;
    margin: 0 0 1.25rem;
    padding: 1rem 1.25rem;
    border: 1px solid #cfe2d8;
    border-radius: 1.2rem;
    background: linear-gradient(115deg, #fffdf7, #eff8f3);
    box-shadow: 0 10px 28px rgba(13, 53, 65, .045);
}

.guardian-ward-achievement-heading {
    display: flex;
    align-items: center;
    gap: .8rem;
    min-width: 0;
}

.guardian-ward-achievement-heading img {
    width: 3.7rem;
    height: 3.7rem;
    flex: 0 0 auto;
    object-fit: contain;
}

.guardian-ward-achievement-heading > div {
    min-width: 0;
}

.guardian-ward-achievement-heading .eyebrow-inline {
    margin: 0 0 .2rem;
    color: #247568;
}

.guardian-ward-achievement-heading h3 {
    margin: 0;
    color: #194441;
    font-size: clamp(1rem, 1.7vw, 1.25rem);
}

.guardian-ward-achievement-heading p:last-child {
    margin: .2rem 0 0;
    color: #61736c;
    font-size: .8rem;
    line-height: 1.4;
}

.guardian-ward-achievement-stats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .55rem;
}

.guardian-ward-achievement-stats > div {
    min-width: 0;
    padding: .65rem .75rem;
    border: 1px solid #dbe9e0;
    border-radius: .75rem;
    background: rgba(255, 255, 255, .78);
}

.guardian-ward-achievement-stats span,
.guardian-ward-achievement-stats strong {
    display: block;
}

.guardian-ward-achievement-stats span {
    color: #5d716a;
    font-size: .72rem;
}

.guardian-ward-achievement-stats strong {
    margin-top: .1rem;
    color: #194441;
    font-size: .96rem;
    overflow-wrap: anywhere;
}

.guardian-ward-badge-list {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .45rem;
    grid-column: 1 / -1;
}

.guardian-ward-badge,
.guardian-ward-badge-more {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .38rem .65rem;
    border: 1px solid #b8d8c8;
    border-radius: 999px;
    background: #fff;
    color: #1d6656;
    font-size: .77rem;
    font-weight: 750;
}

.guardian-ward-badge-more {
    border-color: transparent;
    background: transparent;
}

@media (max-width: 1180px) {
    .guardian-ward-achievements {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    }

    .guardian-ward-achievements > .student-achievement-link {
        grid-column: 1 / -1;
        justify-self: start;
    }
}

@media (max-width: 700px) {
    .guardian-ward-achievements {
        grid-template-columns: minmax(0, 1fr);
        padding: .9rem;
    }

    .guardian-ward-achievements > .student-achievement-link {
        width: 100%;
    }

    .guardian-action-card {
        min-height: 9.8rem;
    }
}

.sidebar-streak-panel {
    display: none;
}

@media (min-width: 901px) {
    .sidebar.role-student {
        border-right-color: rgba(91, 205, 199, .25);
        background:
            radial-gradient(circle at 12% 0, rgba(31, 123, 130, .23), transparent 17rem),
            radial-gradient(circle at 100% 100%, rgba(14, 99, 111, .17), transparent 18rem),
            linear-gradient(165deg, #0d1e2c 0%, #071725 65%, #0b2530 100%);
        box-shadow: 14px 0 38px rgba(4, 24, 36, .2);
    }

    .sidebar.role-student .sidebar-shell {
        gap: .62rem;
    }

    .sidebar.role-student .sidebar-body {
        gap: .62rem;
    }

    .sidebar.role-student .sidebar-topbar-copy strong {
        color: #f3f8f5;
    }

    .sidebar.role-student .sidebar-collapse-btn {
        border-color: rgba(101, 198, 194, .32);
        background: rgba(14, 79, 87, .37);
        color: #e2f5f2;
    }

    .sidebar.role-student .sidebar-collapse-btn:hover,
    .sidebar.role-student .sidebar-collapse-btn:focus-visible {
        border-color: #78d4cc;
        background: rgba(25, 112, 119, .45);
    }

    .sidebar.role-student .sidebar-welcome-card,
    .sidebar.role-student .sidebar-footer {
        border-color: rgba(145, 207, 206, .17);
        background: linear-gradient(145deg, rgba(30, 75, 82, .43), rgba(11, 34, 49, .65));
        box-shadow: inset 0 1px 0 rgba(231, 251, 248, .08);
    }

    .sidebar.role-student .sidebar-welcome-copy strong,
    .sidebar.role-student .sidebar-user strong {
        color: #f3f8f5;
    }

    .sidebar.role-student .sidebar-label {
        color: #a7caca;
    }

    .sidebar.role-student .sidebar-label::after {
        background: linear-gradient(90deg, rgba(132, 201, 198, .35), transparent);
    }

    .sidebar.role-student .sidebar-streak-panel {
        display: flex;
        align-items: center;
        gap: .78rem;
        min-width: 0;
        padding: .8rem;
        border: 1px solid rgba(112, 207, 199, .33);
        border-radius: 1rem;
        background: linear-gradient(115deg, rgba(34, 99, 104, .43), rgba(15, 35, 51, .9));
        box-shadow: inset 0 1px 0 rgba(231, 251, 248, .1), 0 9px 20px rgba(2, 13, 24, .13);
    }

    .sidebar.role-student .sidebar-streak-icon {
        display: grid;
        place-items: center;
        width: 2.5rem;
        height: 2.5rem;
        flex: 0 0 auto;
        border: 1px solid rgba(252, 192, 109, .34);
        border-radius: .8rem;
        background: rgba(175, 97, 40, .23);
        color: #ffbd6d;
        font-size: 1.08rem;
    }

    .sidebar.role-student .sidebar-streak-copy {
        display: grid;
        gap: .08rem;
        min-width: 0;
    }

    .sidebar.role-student .sidebar-streak-copy span {
        color: #bcd9d8;
        font-size: .69rem;
        font-weight: 700;
    }

    .sidebar.role-student .sidebar-streak-copy strong {
        color: #fff7e9;
        font-family: var(--font-display, Georgia, serif);
        font-size: 1.3rem;
        line-height: 1.12;
    }

    .sidebar.role-student .sidebar-streak-copy small {
        color: #b6cccf;
        font-size: .68rem;
        line-height: 1.32;
    }

    .sidebar.role-student .sidebar-nav-group-toggle {
        min-height: 43px;
        color: #d3e4e8;
    }

    .sidebar.role-student .sidebar-nav-group-toggle:hover,
    .sidebar.role-student .sidebar-nav-group-toggle:focus-visible,
    .sidebar.role-student .sidebar-nav-group.has-active-item > .sidebar-nav-group-toggle {
        border-color: rgba(95, 193, 188, .25);
        background: rgba(25, 93, 100, .3);
        color: #f3fbf8;
    }

    .sidebar.role-student .sidebar-nav-group-links {
        border-left-color: rgba(102, 203, 197, .3);
    }

    .sidebar.role-student .sidebar-item {
        min-height: 43px;
        color: #cadfe3;
        background: transparent;
    }

    .sidebar.role-student .sidebar-nav-group-links .sidebar-item {
        min-height: 40px;
    }

    .sidebar.role-student .sidebar-item:hover {
        border-color: rgba(121, 194, 191, .21);
        background: rgba(36, 105, 112, .23);
        color: #fff;
    }

    .sidebar.role-student .sidebar-item.active {
        border-color: rgba(85, 214, 201, .48);
        background: linear-gradient(110deg, rgba(23, 116, 116, .62), rgba(20, 86, 98, .38));
        box-shadow: inset 3px 0 0 #4be0cc, 0 5px 16px rgba(1, 33, 42, .15);
        color: #fff;
    }

    .sidebar.role-student .sidebar-item.active::after {
        display: none;
    }

    .sidebar.role-student .s-ico {
        border: 1px solid rgba(179, 224, 224, .08);
        background: rgba(208, 238, 238, .09);
        color: #dbf0ef;
    }

    .sidebar.role-student .sidebar-item.active .s-ico {
        border-color: rgba(112, 233, 216, .34);
        background: rgba(20, 148, 142, .43);
        color: #fff;
    }

    .sidebar.role-student .sidebar-action-card {
        border-color: rgba(128, 202, 199, .27);
        background: rgba(18, 63, 76, .53);
    }

    .sidebar.role-student .sidebar-action-card:hover,
    .sidebar.role-student .sidebar-action-card:focus-visible {
        border-color: rgba(93, 219, 207, .55);
        background: rgba(22, 99, 110, .55);
    }

    .sidebar.role-student .sidebar-action-icon {
        background: rgba(27, 141, 138, .29);
        color: #87e3d6;
    }

    .sidebar.role-student .sidebar-action-card small,
    .sidebar.role-student .sidebar-user small {
        color: #bbd2d4;
    }

    .sidebar.role-student .sidebar-utility-link {
        border-color: rgba(145, 207, 206, .14);
        background: rgba(35, 90, 99, .17);
        color: #d3e5e4;
    }

    .sidebar.role-student .sidebar-utility-link:hover,
    .sidebar.role-student .sidebar-utility-link:focus-visible {
        border-color: rgba(106, 221, 207, .42);
        background: rgba(35, 113, 117, .33);
        color: #fff;
    }

    .sidebar.role-student a:focus-visible,
    .sidebar.role-student button:focus-visible,
    .sidebar.role-student summary:focus-visible {
        outline: 2px solid #8ff0e1;
        outline-offset: 2px;
    }

    .app-shell.sidebar-collapsed .sidebar.role-student .sidebar-streak-panel {
        display: none;
    }

    .app-shell.sidebar-collapsed .sidebar.role-student .sidebar-item {
        min-height: 50px;
        border-radius: .85rem;
    }

    .app-shell.sidebar-collapsed .sidebar.role-student .sidebar-nav-group-toggle {
        min-height: 50px;
        border-radius: .85rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .sidebar.role-student .sidebar-item,
    .sidebar.role-student .sidebar-action-card,
    .sidebar.role-student .sidebar-nav-group-toggle,
    .sidebar.role-student .sidebar-streak-panel {
        transition: none;
    }
}

.guardian-home-ward-list {
    grid-template-columns: repeat(auto-fit, minmax(min(19rem, 100%), 1fr));
    align-items: stretch;
}

.guardian-home-ward-card.illustrated-card--status {
    display: grid;
    grid-template-rows: auto auto auto 1fr auto;
    align-items: stretch;
    gap: .9rem;
    min-height: 18.5rem;
    padding: 1.1rem;
    border: 1px solid #dce9e6;
    background: linear-gradient(150deg, #fff, #f7fbf9);
    box-shadow: 0 10px 28px rgba(13, 53, 65, .055);
}

.guardian-home-ward-card .guardian-home-ward-facts span {
    min-width: 0;
    padding: .65rem .45rem;
    border: 1px solid #e4eeeb;
    background: rgba(238, 248, 245, .72);
    line-height: 1.3;
    overflow-wrap: anywhere;
}

.guardian-home-ward-card footer {
    align-self: end;
    padding-top: .8rem;
    border-top: 1px solid #e3ece9;
}

.guardian-home-ward-card footer .button {
    gap: .55rem;
}

.guardian-current-snapshot.illustrated-card--status {
    display: grid;
    align-items: stretch;
    gap: 0;
    min-width: 0;
    min-height: 0;
    padding: 1.25rem;
    border: 1px solid #dce9e6;
    border-top: 3px solid #398a70;
    background: linear-gradient(145deg, #fff, #f2f9f6);
    box-shadow: 0 10px 28px rgba(13, 53, 65, .055);
}

.guardian-current-snapshot .guardian-current-facts > div {
    border-color: #dcebe7;
    background: rgba(255, 255, 255, .82);
}

@media (max-width: 620px) {
    .guardian-home-ward-card.illustrated-card--status {
        min-height: 0;
        padding: .95rem;
    }
}

/* Achievements share one visual treatment across learner and guardian views. */
.learning-achievements-page {
    padding: .1rem clamp(0rem, 1vw, .5rem) 1.5rem;
    background: radial-gradient(circle at 94% 18%, rgba(239, 212, 147, .14), transparent 32%),
                radial-gradient(circle at 3% 72%, rgba(96, 162, 148, .09), transparent 35%);
}

.learning-achievements-page .learning-achievements-hero {
    position: relative;
    display: flex;
    min-height: 11rem;
    padding: clamp(1.25rem, 3vw, 2rem);
    overflow: hidden;
    border: 1px solid rgba(225, 244, 234, .2);
    background: radial-gradient(circle at 87% 22%, rgba(227, 187, 107, .22), transparent 26%),
                linear-gradient(115deg, #123d3e, #1b665e);
    box-shadow: 0 18px 38px rgba(20, 71, 69, .13);
}

.learning-achievements-hero .school-hero-copy {
    position: relative;
    z-index: 1;
    max-width: 62ch;
}

.learning-achievements-hero .school-hero-copy h2 {
    margin-block: .25rem .5rem;
}

.learning-achievements-hero .school-hero-copy > p:last-child {
    max-width: 62ch;
    margin-bottom: 0;
}

.learning-achievements-page .learning-achievements-hero-mark {
    display: grid;
    flex: 0 0 clamp(5.5rem, 11vw, 8.5rem);
    width: clamp(5.5rem, 11vw, 8.5rem);
    height: clamp(5.5rem, 11vw, 8.5rem);
    margin-left: auto;
    border: 1px solid rgba(255, 255, 255, .25);
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 250, 221, .23), rgba(255, 255, 255, .07));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .18);
}

.learning-achievements-hero-mark img {
    display: block;
    width: 76%;
    height: 76%;
    object-fit: contain;
}

.learning-achievements-pending {
    border: 1px solid #d9e8df;
    border-left: 3px solid #7ba596;
    border-radius: .9rem;
    background: #f4faf6;
}

.learning-achievements-pending i {
    flex: 0 0 auto;
}

.learning-achievements-stat.illustrated-card--status {
    display: flex;
    align-items: flex-start;
    min-height: 9rem;
    padding: 1.2rem;
    border: 1px solid #e5e8df;
    border-top: 3px solid #c99c4e;
    border-radius: 1.1rem;
    background: linear-gradient(145deg, #fff, #fffaf0);
    box-shadow: 0 9px 25px rgba(55, 61, 44, .055);
}

.learning-achievements-stat.illustrated-card--status.is-longest {
    border-top-color: #61a99b;
    background: linear-gradient(145deg, #fff, #f4faf7);
}

.learning-achievements-stat.illustrated-card--status.is-badges {
    border-top-color: #bf9b64;
    background: linear-gradient(145deg, #fff, #f9f7f0);
}

.learning-achievements-stat > div {
    min-width: 0;
}

.learning-achievements-stat-icon {
    background: #fff0d5;
    color: #8a6224;
}

.learning-achievements-stat.is-longest .learning-achievements-stat-icon {
    background: #e2f2eb;
    color: #236e5d;
}

.learning-achievements-stat.is-badges .learning-achievements-stat-icon {
    background: #f2eada;
    color: #79613c;
}

.learning-achievements-stat strong {
    line-height: 1.15;
}

.learning-achievements-stat strong small {
    font-size: .42em;
    font-weight: 600;
}

.learning-achievements-panel {
    border: 1px solid #e0e8e2;
    border-radius: 1.25rem;
    background: rgba(255, 255, 255, .94);
    box-shadow: 0 12px 30px rgba(17, 67, 64, .045);
}

.learning-achievements-heading .pill {
    flex: 0 0 auto;
    background: #fff2d8;
    color: #795b23;
}

.learning-achievement-badge {
    position: relative;
    align-items: flex-start;
    border-color: #eadbbd;
    background: linear-gradient(135deg, #fffdfa, #fff5df);
    box-shadow: 0 7px 18px rgba(111, 83, 32, .07);
}

.learning-achievement-badge > div,
.learning-achievement-upcoming > div {
    display: grid;
    gap: .2rem;
    min-width: 0;
}

.learning-achievement-badge-art {
    flex-basis: 3.4rem;
    width: 3.4rem;
    height: 3.4rem;
    border: 1px solid #f3e4c0;
    background: #fff9eb;
}

.learning-achievement-badge-art img {
    display: block;
    width: 86%;
    height: 86%;
    object-fit: contain;
}

.learning-achievement-badge .learning-achievement-state-label,
.learning-achievement-upcoming .learning-achievement-state-label {
    color: #75603d;
    font-size: .67rem;
    font-weight: 800;
    letter-spacing: .1em;
    line-height: 1.3;
    text-transform: uppercase;
}

.learning-achievement-badge strong,
.learning-achievement-upcoming strong {
    font-family: var(--font-display);
    font-size: 1.15rem;
    line-height: 1.25;
}

.learning-achievement-badge time {
    color: #687570;
    font-size: .84rem;
}

.learning-achievement-check {
    align-self: flex-start;
    font-size: .85rem;
}

.learning-achievement-upcoming {
    align-items: flex-start;
    border: 1px dashed #d5e0da;
    background: #f8faf8;
    box-shadow: none;
}

.learning-achievement-upcoming .learning-achievement-state-label {
    color: #53695f;
}

.learning-achievement-upcoming strong {
    color: #39514a;
}

.learning-achievements-empty {
    gap: 1.1rem;
    padding: 1.15rem;
    border: 1px solid #e2ebe5;
    border-radius: 1rem;
    background: linear-gradient(125deg, #f5faf6, #fffdf7);
}

.learning-achievements-empty img {
    flex: 0 0 5.25rem;
    width: 5.25rem;
    height: 5.25rem;
    object-fit: contain;
}

.learning-achievements-empty strong {
    display: block;
    margin-bottom: .2rem;
    color: #234d43;
    font-family: var(--font-display);
    font-size: 1.1rem;
}

/* The guardian's ward choice and progress now live in one destination grid. */
.guardian-ward-overview {
    min-width: 0;
    margin-bottom: 1.25rem;
    padding: 0 0 clamp(1rem, 2vw, 1.5rem);
    overflow: hidden;
    border: 1px solid #dfe7ef;
    border-radius: 1.6rem;
    background: linear-gradient(135deg, #fff 28%, #f5f3ff);
    box-shadow: 0 18px 38px rgba(38, 48, 96, .075);
}

.guardian-ward-overview-hero {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: clamp(.8rem, 2vw, 1.4rem);
    min-height: 8.6rem;
    padding: 1rem clamp(1rem, 2vw, 1.5rem);
    overflow: hidden;
    background: radial-gradient(circle at 83% 9%, rgba(139, 111, 221, .13), transparent 27%),
                linear-gradient(110deg, #fff 35%, #f0eeff);
}

.guardian-ward-overview-hero::after {
    position: absolute;
    right: 7%;
    bottom: -5.7rem;
    width: 20rem;
    height: 11rem;
    border-radius: 50%;
    background: rgba(255, 255, 255, .46);
    content: '';
    transform: rotate(-12deg);
    pointer-events: none;
}

.guardian-ward-overview-icon {
    display: grid;
    place-items: center;
    width: clamp(3.4rem, 6vw, 4.8rem);
    height: clamp(3.4rem, 6vw, 4.8rem);
    border-radius: 1.25rem;
    background: #ece9fb;
    color: #295c71;
    font-size: clamp(1.3rem, 2.5vw, 1.8rem);
}

.guardian-ward-overview-hero > div {
    position: relative;
    z-index: 1;
    min-width: 0;
}

.guardian-ward-overview-hero h3 {
    margin: 0;
    color: #142b51;
    font-family: var(--font-display, Georgia, serif);
    font-size: clamp(1.55rem, 3vw, 2.15rem);
    line-height: 1.12;
}

.guardian-ward-overview-hero p {
    margin: .35rem 0 0;
    color: #3e5470;
    font-size: clamp(.9rem, 1.5vw, 1.05rem);
    line-height: 1.35;
}

.guardian-ward-overview-hero > img {
    position: relative;
    z-index: 1;
    width: clamp(5.5rem, 12vw, 9rem);
    height: clamp(5.5rem, 12vw, 9rem);
    object-fit: contain;
}

.guardian-ward-overview-tools {
    display: flex;
    align-items: end;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: .7rem 1rem;
    padding: 1rem clamp(1rem, 2vw, 1.5rem) 0;
}

.guardian-ward-overview-tools > .pill {
    margin-block: .3rem;
    background: #e8f3f2;
    color: #1e6265;
}

.guardian-ward-overview .guardian-ward-search-field {
    flex: 0 1 17rem;
    width: min(100%, 17rem);
    margin: 0;
}

.guardian-ward-overview .guardian-home-ward-list {
    grid-template-columns: repeat(auto-fit, minmax(min(16.25rem, 100%), 1fr));
    gap: .8rem;
    padding: 1rem clamp(1rem, 2vw, 1.5rem) 0;
}

.guardian-ward-overview .guardian-home-ward-card.illustrated-card--status {
    display: grid;
    grid-template-rows: auto auto auto 1fr auto;
    align-items: stretch;
    gap: .75rem;
    min-width: 0;
    min-height: 20rem;
    padding: 1rem;
    border: 1px solid #e2e9ed;
    border-radius: 1.35rem;
    background: linear-gradient(145deg, #fff, #fcfefe);
    box-shadow: 0 10px 25px rgba(23, 48, 83, .065);
    color: #162947;
    text-decoration: none;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.guardian-ward-overview .guardian-home-ward-card:hover,
.guardian-ward-overview .guardian-home-ward-card:focus-visible {
    border-color: #7fb8b2;
    box-shadow: 0 16px 28px rgba(24, 66, 83, .13);
    transform: translateY(-2px);
}

.guardian-ward-overview .guardian-home-ward-card:focus-visible {
    outline: 3px solid #176c6e;
    outline-offset: 3px;
}

.guardian-ward-overview .guardian-home-ward-card.is-priority {
    border-color: #ab91e5;
    background: linear-gradient(145deg, #fff, #f8f5ff);
    box-shadow: 0 14px 28px rgba(95, 66, 167, .12);
}

.guardian-ward-overview .guardian-home-ward-head {
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    gap: .5rem .7rem;
    min-width: 0;
}

.guardian-ward-overview .guardian-home-ward-head > div {
    min-width: 0;
}

.guardian-ward-card-avatar {
    display: grid;
    place-items: center;
    grid-row: span 2;
    flex: 0 0 2.8rem;
    width: 2.8rem;
    height: 2.8rem;
    border-radius: 50%;
    background: #dff2f4;
    color: #126274;
    font-family: var(--font-display, Georgia, serif);
    font-size: 1.15rem;
    font-weight: 800;
}

.guardian-home-ward-card.is-priority .guardian-ward-card-avatar {
    background: #e9dfff;
    color: #5835ae;
}

.guardian-home-ward-card.guardian-home-ward-neutral .guardian-ward-card-avatar {
    background: #f4eddf;
    color: #886127;
}

.guardian-ward-overview .guardian-home-ward-head h4 {
    color: #182b48;
    font-family: var(--font-display, Georgia, serif);
    font-size: 1.12rem;
    line-height: 1.2;
}

.guardian-ward-overview .guardian-home-ward-head p {
    color: #526277;
    font-size: .78rem;
    line-height: 1.35;
}

.guardian-ward-overview .guardian-home-ward-head .guardian-status {
    grid-column: 2;
    max-width: 100%;
    padding: .25rem .55rem;
    font-size: .65rem;
    line-height: 1.3;
    overflow-wrap: anywhere;
}

.guardian-ward-overview .guardian-home-progress-copy {
    color: #354c62;
    font-size: .84rem;
}

.guardian-ward-overview .guardian-home-progress-copy strong {
    color: #11243c;
    font-size: 1.4rem;
}

.guardian-ward-overview .guardian-monitor-progress {
    margin: -.3rem 0 0;
    background: #e7ebf1;
}

.guardian-ward-overview .guardian-home-ward-card.is-priority .guardian-monitor-progress > span {
    background: #7754c9;
}

.guardian-ward-overview .guardian-home-ward-facts {
    gap: .4rem;
}

.guardian-ward-overview .guardian-home-ward-facts .guardian-ward-metric {
    display: grid;
    grid-template-rows: auto auto 1fr;
    justify-items: center;
    gap: .2rem;
    min-width: 0;
    padding: .55rem .25rem;
    border: 1px solid #dcebf0;
    border-radius: .8rem;
    background: #f5fafb;
    color: #385161;
    text-align: center;
}

.guardian-ward-overview .guardian-home-ward-card.is-priority .guardian-ward-metric {
    border-color: #e6ddfa;
    background: #f4f0ff;
}

.guardian-ward-metric i {
    color: #1d7180;
    font-size: .95rem;
}

.guardian-home-ward-card.is-priority .guardian-ward-metric i {
    color: #6040bb;
}

.guardian-ward-overview .guardian-ward-metric strong {
    color: #14243a;
    font-size: 1rem;
    line-height: 1.1;
}

.guardian-ward-metric small {
    font-size: .68rem;
    line-height: 1.22;
    overflow-wrap: anywhere;
}

.guardian-ward-overview .guardian-home-ward-card footer {
    align-self: end;
    gap: .5rem;
    justify-content: flex-end;
    padding-top: .7rem;
    border-top: 1px solid #e7edf0;
}

.guardian-ward-overview .guardian-home-ward-card footer .guardian-ward-open {
    flex: 0 0 auto;
    min-height: 44px;
    padding: .55rem .75rem;
    white-space: nowrap;
}

.guardian-ward-overview .guardian-home-ward-card.is-priority .guardian-ward-open {
    background: #6541c4;
    border-color: #6541c4;
}

.guardian-ward-overview .guardian-ward-search-empty {
    margin: .7rem clamp(1rem, 2vw, 1.5rem) 0;
}

.guardian-ward-overview > .empty-state {
    margin: 1rem clamp(1rem, 2vw, 1.5rem) 0;
}

@media (max-width: 620px) {
    .guardian-ward-overview {
        border-radius: 1.25rem;
    }

    .guardian-ward-overview-hero {
        grid-template-columns: auto minmax(0, 1fr);
        min-height: 7rem;
    }

    .guardian-ward-overview-hero > img {
        position: absolute;
        right: .1rem;
        bottom: -.8rem;
        width: 5rem;
        height: 5rem;
        opacity: .3;
    }

    .guardian-ward-overview-hero > div {
        padding-right: 2.7rem;
    }

    .guardian-ward-overview-tools {
        align-items: stretch;
    }

    .guardian-ward-overview .guardian-ward-search-field {
        flex-basis: 100%;
        width: 100%;
    }

    .guardian-ward-overview .guardian-home-ward-card.illustrated-card--status {
        min-height: 0;
    }

    .guardian-ward-overview .guardian-home-ward-card footer {
        flex-direction: row;
        align-items: center;
    }
}

@media (max-width: 360px) {
    .guardian-ward-overview .guardian-home-ward-card footer {
        align-items: stretch;
        flex-direction: column;
    }

    .guardian-ward-overview .guardian-home-ward-card footer .guardian-ward-open {
        justify-content: center;
    }
}

@media (prefers-reduced-motion: reduce) {
    .guardian-ward-overview .guardian-home-ward-card.illustrated-card--status {
        transition: none;
    }
}

@media (max-width: 620px) {
    .learning-achievements-page {
        gap: 1rem;
    }

    .learning-achievements-page .learning-achievements-hero {
        min-height: 0;
        padding: 1.2rem;
    }

    .learning-achievements-page .learning-achievements-hero-mark {
        flex-basis: 4.25rem;
        width: 4.25rem;
        height: 4.25rem;
        align-self: flex-start;
        margin-left: .3rem;
    }

    .learning-achievements-stat.illustrated-card--status {
        min-height: 0;
        padding: 1rem;
    }

    .learning-achievements-panel {
        padding: 1rem;
    }

    .learning-achievements-empty img {
        flex-basis: 4rem;
        width: 4rem;
        height: 4rem;
    }
}

@media (max-width: 360px) {
    .learning-achievements-page .learning-achievements-hero-mark {
        flex-basis: 3.5rem;
        width: 3.5rem;
        height: 3.5rem;
    }

    .learning-achievement-badge,
    .learning-achievement-upcoming {
        gap: .6rem;
        padding: .85rem;
    }
}

/* Shared KPI treatment for learner, guardian, tutor, school, and admin workspaces. */
.dashboard-page :is(
    .oversight-overview-card,
    .student-pulse-card,
    .student-context-stat,
    .student-subject-scope-metric,
    .learning-achievements-stat
) {
    --kpi-ink: #10264f;
    --kpi-accent: #176f6b;
    --kpi-icon-bg: #e2f2ee;
    --kpi-tint: #fbfefd;
    --kpi-wave: rgba(89, 179, 164, .11);
    --kpi-wave-strong: rgba(89, 179, 164, .1);
    --kpi-border: #d9e7e5;
    position: relative;
    isolation: isolate;
    min-width: 0;
    border: 1px solid var(--kpi-border);
    border-radius: 1.35rem;
    background:
        radial-gradient(ellipse 9rem 4rem at 107% 112%, var(--kpi-wave-strong) 0 60%, transparent 61%),
        radial-gradient(ellipse 12rem 5rem at 105% 110%, var(--kpi-wave) 0 59%, transparent 60%),
        linear-gradient(145deg, #fff 30%, var(--kpi-tint));
    box-shadow: 0 12px 28px rgba(21, 46, 66, .075);
    color: var(--kpi-ink);
}

.dashboard-page :is(.oversight-overview-card, .student-pulse-card).tone-gold,
.dashboard-page .learning-achievements-stat.is-current {
    --kpi-accent: #94641b;
    --kpi-icon-bg: #fff0d5;
    --kpi-tint: #fffdf8;
    --kpi-wave: rgba(233, 189, 103, .13);
    --kpi-wave-strong: rgba(233, 189, 103, .11);
    --kpi-border: #f0dfc2;
}

.dashboard-page :is(.oversight-overview-card, .student-pulse-card).tone-sage,
.dashboard-page .learning-achievements-stat.is-longest {
    --kpi-accent: #277353;
    --kpi-icon-bg: #e1f2e8;
    --kpi-tint: #f9fcfa;
    --kpi-wave: rgba(119, 183, 141, .13);
    --kpi-wave-strong: rgba(119, 183, 141, .1);
    --kpi-border: #dcebdc;
}

.dashboard-page :is(.oversight-overview-card, .student-pulse-card).tone-ink {
    --kpi-accent: #294f79;
    --kpi-icon-bg: #e8eef8;
    --kpi-tint: #fafbfd;
    --kpi-wave: rgba(124, 153, 196, .13);
    --kpi-wave-strong: rgba(124, 153, 196, .1);
    --kpi-border: #dce4ef;
}

.dashboard-page .oversight-overview-card.tone-alert {
    --kpi-accent: #a14232;
    --kpi-icon-bg: #fbe8e2;
    --kpi-tint: #fffaf8;
    --kpi-wave: rgba(220, 137, 111, .13);
    --kpi-wave-strong: rgba(220, 137, 111, .1);
    --kpi-border: #f0dad2;
}

.dashboard-page :is(.oversight-overview-card, .student-pulse-card) {
    display: grid;
    align-content: start;
    gap: .7rem;
    min-height: 9.5rem;
    padding: clamp(1rem, 1.8vw, 1.3rem);
}

.dashboard-page :is(.oversight-overview-card, .student-pulse-card) > strong {
    align-self: end;
    margin-top: .3rem;
    color: var(--kpi-ink);
    font-family: var(--font-display, Georgia, serif);
    font-size: clamp(1.85rem, 2.7vw, 2.55rem);
    font-weight: 800;
    letter-spacing: -.035em;
    line-height: 1.08;
    overflow-wrap: anywhere;
}

.dashboard-page .oversight-overview-top {
    align-items: center;
    gap: .8rem;
}

.dashboard-page :is(.oversight-overview-icon, .student-pulse-icon) {
    display: inline-grid;
    place-items: center;
    flex: 0 0 3.2rem;
    width: 3.2rem;
    height: 3.2rem;
    border: 0;
    border-radius: 1rem;
    background: var(--kpi-icon-bg);
    box-shadow: none;
    color: var(--kpi-accent);
    font-size: 1.25rem;
}

.dashboard-page .oversight-overview-card.tone-gold .oversight-overview-icon,
.dashboard-page .oversight-overview-card.tone-sage .oversight-overview-icon,
.dashboard-page .oversight-overview-card.tone-ink .oversight-overview-icon {
    background: var(--kpi-icon-bg);
    color: var(--kpi-accent);
}

.dashboard-page :is(
    .oversight-overview-top .student-pulse-label,
    .student-pulse-card > span:not(.student-pulse-icon),
    .student-context-stat > span,
    .student-subject-scope-metric > span
) {
    color: var(--kpi-ink);
    font-family: var(--font-display, Georgia, serif);
    font-size: clamp(1rem, 1.5vw, 1.2rem);
    font-weight: 700;
    letter-spacing: -.015em;
    line-height: 1.2;
    text-transform: none;
}

.dashboard-page .student-pulse-card {
    grid-template-columns: auto minmax(0, 1fr);
    grid-template-rows: auto 1fr auto;
    column-gap: .8rem;
}

.dashboard-page .student-pulse-card > .student-pulse-icon {
    grid-column: 1;
    grid-row: 1;
}

.dashboard-page .student-pulse-card > span:not(.student-pulse-icon) {
    grid-column: 2;
    grid-row: 1;
    align-self: center;
    min-width: 0;
}

.dashboard-page .student-pulse-card > span:first-child:not(.student-pulse-icon) {
    grid-column: 1 / -1;
}

.dashboard-page .student-pulse-card > strong,
.dashboard-page .student-pulse-card > p {
    grid-column: 1 / -1;
}

.dashboard-page .student-pulse-card > strong {
    grid-row: 2;
}

.dashboard-page .student-pulse-card > p {
    grid-row: 3;
    color: #526575;
}

.dashboard-page .student-pulse-card strong small {
    color: #526575;
    font-size: .42em;
    font-weight: 600;
    letter-spacing: 0;
    text-transform: none;
}

.dashboard-page .student-pulse-card:is(a):hover {
    border-color: var(--kpi-accent);
    box-shadow: 0 16px 30px rgba(21, 46, 66, .12);
}

.dashboard-page .student-pulse-card:is(a):focus-visible {
    outline: 3px solid var(--kpi-accent);
    outline-offset: 3px;
}

.dashboard-page .admin-command-card-grid .student-pulse-card {
    min-height: 8.5rem;
}

.workspace-kpi-progress {
    display: flex;
    align-items: center;
    gap: .55rem;
    margin-top: auto;
    color: var(--kpi-ink);
    font-size: .78rem;
    font-weight: 800;
}

.workspace-kpi-progress > div {
    height: .55rem;
    flex: 1;
    min-width: 0;
    overflow: hidden;
    border-radius: 999px;
    background: #e5eaf0;
}

.workspace-kpi-progress > div > span {
    display: block;
    height: 100%;
    max-width: 100%;
    border-radius: inherit;
    background: var(--kpi-accent);
}

.dashboard-page .guardian-family-summary-grid .oversight-overview-card,
.dashboard-page .guardian-ward-stat-grid .oversight-overview-card {
    border: 1px solid var(--kpi-border);
    padding: clamp(1rem, 1.8vw, 1.3rem);
    box-shadow: 0 12px 28px rgba(21, 46, 66, .075);
}

.dashboard-page :is(.student-context-stat, .student-subject-scope-metric) {
    display: grid;
    align-content: space-between;
    gap: .65rem;
    min-height: 7rem;
    padding: 1rem;
}

.dashboard-page :is(.student-context-stat, .student-subject-scope-metric) > strong {
    color: var(--kpi-ink);
    font-family: var(--font-display, Georgia, serif);
    font-size: clamp(1.2rem, 1.8vw, 1.55rem);
    line-height: 1.2;
    overflow-wrap: anywhere;
}

.dashboard-page .student-context-stat.illustrated-card--status:nth-child(even) {
    background:
        radial-gradient(ellipse 10rem 4rem at 105% 110%, var(--kpi-wave), transparent 60%),
        linear-gradient(145deg, #fff, var(--kpi-tint));
}

.dashboard-page .learning-achievements-stat.illustrated-card--status {
    border: 1px solid var(--kpi-border);
    background:
        radial-gradient(ellipse 10rem 4rem at 105% 110%, var(--kpi-wave), transparent 60%),
        linear-gradient(145deg, #fff, var(--kpi-tint));
    box-shadow: 0 12px 28px rgba(21, 46, 66, .075);
}

.dashboard-page .learning-achievements-stat-icon {
    background: var(--kpi-icon-bg);
    color: var(--kpi-accent);
}

.dashboard-page .learning-achievements-stat > div > span {
    color: var(--kpi-ink);
    font-family: var(--font-display, Georgia, serif);
    font-size: 1.1rem;
    font-weight: 700;
}

.dashboard-page :is(
    .checkpoint-summary-card,
    .lesson-summary-card,
    .assessment-summary-card,
    .role-summary-card,
    .school-hero-summary-card,
    .stat-card
) {
    min-width: 0;
    border: 1px solid #dfe8e6;
    border-radius: 1rem;
    background:
        radial-gradient(ellipse 8rem 3rem at 110% 110%, rgba(102, 176, 160, .1), transparent 65%),
        linear-gradient(145deg, #fff, #fbfefd);
    box-shadow: 0 8px 20px rgba(21, 46, 66, .045);
}

.dashboard-page :is(
    .checkpoint-summary-card,
    .lesson-summary-card,
    .assessment-summary-card,
    .school-hero-summary-card
) > span {
    color: #10264f;
    font-family: var(--font-display, Georgia, serif);
    font-size: .95rem;
    font-weight: 700;
    letter-spacing: 0;
    line-height: 1.25;
    text-transform: none;
}

.dashboard-page :is(
    .checkpoint-summary-card,
    .lesson-summary-card,
    .assessment-summary-card,
    .school-hero-summary-card,
    .stat-card
) > strong {
    color: #10264f;
    font-family: var(--font-display, Georgia, serif);
    font-size: clamp(1.05rem, 1.6vw, 1.35rem);
    line-height: 1.2;
    overflow-wrap: anywhere;
}

@media (max-width: 640px) {
    .dashboard-page .guardian-family-summary-grid {
        grid-template-columns: minmax(0, 1fr);
        gap: .7rem;
    }

    .dashboard-page :is(.oversight-overview-card, .student-pulse-card) {
        min-height: 8.2rem;
        padding: 1rem;
    }

    .dashboard-page .guardian-family-summary-grid .oversight-overview-top {
        flex-direction: row;
        align-items: center;
    }

    .dashboard-page .guardian-family-summary-grid .student-pulse-label {
        font-size: 1.08rem;
    }
}