/* App composition. Controllers retain state, docking and answer feedback.
   Active Flashcards hides its setup blurb and redundant global navigation;
   the complete current-deck bar and main-menu destinations remain available. */
.student-workspace {
    --workspace-line: #dedfdf;
    --workspace-control: #8c929b;
    --workspace-surface: #fff;
    --workspace-inset: #f5f5f2;
    --workspace-accent: #5b50e8;
    --workspace-soft: rgba(91, 80, 232, .07);
    --workspace-depth: 0 2px 8px rgba(14, 18, 32, .04);
    font-family: var(--font-body);
}
[data-dark] .student-workspace {
    --workspace-line: #343840;
    --workspace-control: #85858F;
    --workspace-surface: #202329;
    --workspace-inset: #1b1e24;
    --workspace-accent: #8b7cf8;
    --workspace-soft: rgba(255, 255, 255, 0.08);
    --workspace-depth: 0 2px 8px rgba(0, 0, 0, .12);
}
.student-workspace .study-tool-page .tool-hero {
    margin-bottom: 24px;
    padding-bottom: 18px;
    border-bottom: 1px solid var(--workspace-line);
}
.student-workspace .study-tool-page .tool-hero h2,
.student-workspace .generator-card-head h1 {
    font-family: var(--font-display);
    font-size: clamp(1.75rem, 2.5vw, 2rem);
    font-weight: 600;
    letter-spacing: -.02em;
    line-height: 1.18;
}
.student-workspace .study-tool-page .tool-hero p {
    margin-top: 8px;
    max-width: 65ch;
    font-size: .95rem;
    line-height: 1.5;
}
.student-workspace .generator-kicker {
    font-family: var(--font-ui);
    font-size: .8rem;
    font-weight: 800;
    color: var(--text-secondary);
}

/* One work surface around the builder; individual fields stay unboxed groups. */
.student-workspace #inputSection {
    padding: 24px;
    border: 1px solid var(--workspace-line);
    border-radius: 16px;
    background: var(--workspace-surface);
    box-shadow: 0 2px 4px rgba(14, 18, 32, .03);
}
.student-workspace #inputSection .generator-card-head {
    margin-bottom: 20px;
}
.student-workspace #inputSection .generator-card-head h1 { margin-top: 5px; }
.student-workspace #inputSection .tabs,
.student-workspace #flashcardsPage #fcTabs {
    border-radius: 10px;
    background: var(--workspace-inset);
    border-color: var(--workspace-line);
}
.student-workspace #inputSection .tab-slider,
.student-workspace #flashcardsPage #fcTabSlider {
    border-radius: 8px;
    background: var(--workspace-surface);
    border-color: var(--workspace-control);
    box-shadow: 0 1px 3px rgba(14, 18, 32, .08);
}
.student-workspace #inputSection :is(.csel-trigger, .input-text, select),
.student-workspace #flashcardsPage :is(.csel-trigger, .input-text, select),
.student-workspace #testPage :is(select, .tst-primary) {
    min-height: 48px;
    border-radius: 8px;
    border-color: var(--workspace-control);
    font-family: var(--font-ui);
}
.student-workspace #inputSection .preset-opt {
    min-height: 48px;
    border-radius: 8px;
    font-weight: 800;
}
.student-workspace #inputSection .preset-opt[aria-checked="true"] {
    border-color: var(--workspace-accent);
    background: var(--workspace-soft);
    box-shadow: inset 0 -2px 0 var(--workspace-accent);
}
.student-workspace #generateBtn,
.student-workspace #fcGenerateBtn {
    min-height: 48px;
    border-radius: 8px;
    font-family: var(--font-ui);
    font-weight: 800;
    box-shadow: none;
}
.student-workspace #todayStrip .today-daily,
.student-workspace #todayStrip #upNext {
    border-radius: 12px;
    border-color: var(--workspace-line);
    background: var(--workspace-surface);
}
.student-workspace #todayStrip .un-title { font-size: 1rem; font-weight: 800; }
.student-workspace #todayStrip .un-reason { font-size: .875rem; }
.student-workspace #guestLimitBanner { border-radius: 12px; }

/* Auth and results use the same control geometry as the study surface. */
.student-workspace #authModalOverlay .auth-modal { border-radius: 16px; }
.student-workspace #authModalOverlay :is(.auth-tabs, .auth-tab, .auth-field input, .btn-google, .btn-microsoft, .auth-submit) {
    border-radius: 8px;
}
.student-workspace #authModalOverlay :is(.auth-field input, .auth-submit, .btn-google, .btn-microsoft) { min-height: 48px; }
.student-workspace #authModalOverlay .auth-tab { min-height: 44px; }
.student-workspace #authModalOverlay .auth-submit,
.student-workspace #authModalOverlay .auth-submit:hover,
.student-workspace #authModalOverlay .auth-submit:active {
    background: #5b50e8;
    box-shadow: none;
    transform: none;
}
.student-workspace #quizSection #scoreCard .score-actions button {
    min-height: 48px;
    border-radius: 8px;
    box-shadow: none;
}

/* Progress: recommendation, standing, then paired analytical sections. */
.student-workspace #dashHistory[hidden] { display: none; }
.student-workspace #scoreCard .score-partial-note { margin: 8px 0 0; font-size: .875rem; line-height: 1.5; color: var(--text-secondary); }
.student-workspace #statsPage:has(#dashHistory[hidden]) #dashUpNext {
    max-width: 1080px;
}

/* Settings share the tool heading and a quiet list of preferences. */
.student-workspace #settingsPage .settings-group-title { margin-top: 26px; }
.student-workspace #settingsPage .set-row {
    margin: 0;
    padding: 18px 0;
    border: 0;
    border-bottom: 1px solid var(--workspace-line);
    border-radius: 0;
    background: none;
    box-shadow: none;
}
.student-workspace #settingsPage .set-row-ico { display: none; }
.student-workspace #settingsPage .set-row-title { font-weight: 700; }
.student-workspace #settingsPage .toggle-switch[aria-checked="true"] {
    background: #5b50e8;
    box-shadow: none;
}
.student-workspace #settingsPage .toggle-thumb { box-shadow: none; }

/* Marking remains dense enough to compare criteria, with an explicit estimate. */
.student-workspace #essayFeedback .essay-course { max-width: 460px; margin-bottom: 20px; }
.student-workspace #essayFeedback .essay-course select { width: 100%; min-height: 48px; }
.student-workspace #essayFeedback .essay-type-chip { min-height: 44px; }
.student-workspace #essayResult { scroll-margin-top: 88px; }
.student-workspace #essayResultTitle { margin: 0 0 8px; font-size: 1.25rem; }
.student-workspace #essayFeedback .essay-estimate-note {
    margin: 0 0 20px;
    color: var(--text-secondary);
    font-size: .875rem;
    line-height: 1.5;
}
.student-workspace #essayFeedback .essay-error {
    padding: 12px 0;
    color: #b42318;
    font-size: .9rem;
    line-height: 1.5;
}
[data-dark] .student-workspace #essayFeedback .essay-error { color: #fda4af; }

.student-workspace #statsPage .dash-link { color: var(--workspace-accent); }
.student-workspace #statsPage #dashUpNext {
    padding: 22px 24px;
    border-radius: 14px;
    border-color: var(--workspace-line);
    border-left: 4px solid var(--workspace-accent);
    background: var(--workspace-inset);
    box-shadow: none;
}
.student-workspace #dashUpNext .un-primary { gap: 10px; }
.student-workspace #dashUpNext .un-title {
    font-size: 1.3rem;
    line-height: 1.3;
    font-weight: 800;
}
.student-workspace #dashUpNext .un-reason,
.student-workspace #dashUpNext .un-row-reason { font-size: .9rem; line-height: 1.45; }
.student-workspace #dashUpNext .un-cta {
    min-height: 44px;
    padding: 10px 18px;
    border-radius: 8px;
    background: #5b50e8;
    border-color: #5b50e8;
    color: #fff;
    font-weight: 800;
}
.student-workspace #dashStanding .ds-cell { padding: 20px 18px; }
.student-workspace #dashStanding .ds-cell:first-child { padding-left: 0; }
.student-workspace #dashStanding .ds-val { font-size: 2.5rem; font-weight: 600; }
.student-workspace #dashStanding :is(.ds-label, .ds-note) { font-size: .85rem; }
.student-workspace #statsPage .student-progress-columns {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 32px;
    padding-bottom: 24px;
    border-bottom: 1px solid var(--workspace-line);
}
.student-workspace .student-progress-columns > div { min-width: 0; }
.student-workspace #statsPage .dash-sec-title {
    font: 800 1rem/1.3 var(--font-ui);
    letter-spacing: 0;
}
.student-workspace #statsPage .dash-sec-head { margin-top: 28px; }
.student-workspace #statsPage .trend-chart-card {
    padding: 16px;
    border-radius: 12px;
    border-color: var(--workspace-line);
    background: var(--workspace-inset);
    box-shadow: none;
}

/* The question is the focus, with a quiet persistent progress header. */
.student-workspace .quiz-generation-notice {
    padding: 14px 16px;
    margin: 0 0 16px;
    border-left: 3px solid #b45309;
    background: #fffbeb;
    color: #78350f;
    font-size: .875rem;
    line-height: 1.5;
}
[data-dark] .student-workspace .quiz-generation-notice {
    background: #292116;
    border-color: #fbbf24;
    color: #fde68a;
}
.student-workspace #quizSection .progress-wrap {
    border-radius: 10px;
    box-shadow: 0 2px 8px rgba(14, 18, 32, .06);
}
.student-workspace #quizSection :is(.question-card, #scoreCard) {
    border-radius: 16px;
    border-color: var(--workspace-line);
    box-shadow: var(--workspace-depth);
}
.student-workspace #quizSection .question-card { padding: clamp(20px, 3vw, 32px); }
.student-workspace #quizSection .question-num {
    font: 800 .8rem/1.4 var(--font-ui);
    letter-spacing: .035em;
}
.student-workspace #quizSection :is(.question-num, .score-chip strong) { color: var(--workspace-accent); }
[data-dark] .student-workspace #quizSection .diff-badge.standard { color: var(--workspace-accent); }
.student-workspace #quizSection .diff-badge.hard { color: #92400e; }
.student-workspace #quizSection .diff-badge.exam { color: #be123c; }
[data-dark] .student-workspace #quizSection .diff-badge.hard { color: #fbbf24; }
[data-dark] .student-workspace #quizSection .diff-badge.exam { color: #fda4af; }
.student-workspace #quizSection .question-text {
    font-family: var(--font-ui);
    font-size: clamp(1.1rem, 1.7vw, 1.3rem);
    font-style: normal;
    font-weight: 700;
    line-height: 1.55;
}
.student-workspace #quizSection .option {
    min-height: 60px;
    border-radius: 10px;
    padding: 14px 16px;
}
/* Only unanswered choices receive neutral borders; graded colours remain intact. */
.student-workspace #quizSection .option:not(.correct):not(.wrong):not(.timeout-correct):not(.selected) {
    border-color: var(--workspace-control);
}
.student-workspace #quizSection .opt-letter { width: 32px; height: 32px; border-radius: 6px; }
.student-workspace #quizSection .opt-text { font-size: 1rem; line-height: 1.5; }
.student-workspace #quizSection :is(.btn-next, .btn-prev, .btn-grade) {
    min-height: 48px;
    border-radius: 8px;
    font-family: var(--font-ui);
}
.student-workspace #quizSection .explanation-box { border-radius: 10px; line-height: 1.55; }
.student-workspace #quizSection #scoreCard :is(.exam-marks-section-score, .exam-marks-total span:last-child) {
    color: var(--workspace-accent);
}

/* Flashcards have depth on the actual study object, not on its navigation. */
.student-workspace #flashcardsPage:has(> #fcDeck[style*="display: block"]) > .tool-hero {
    margin-bottom: 16px;
    padding-bottom: 12px;
}
.student-workspace #flashcardsPage:has(> #fcDeck[style*="display: block"]) > .tool-hero > p { display: none; }
/* The mode bar used to be hidden here, on the reasoning that "global modes
   remain in the main menu" and an in-deck row switched the open deck. Neither
   holds: the rail no longer lists Learn, Test, Match and Write, and the row it
   referred to (.fc-modes) only ever existed as CSS — nothing in the markup uses
   it. So an open deck was the one screen with NO way to reach the four modes,
   which is exactly the screen you would want them from: you are looking at the
   set you want to Learn or Test. The bar stays. */
.student-workspace #flashcardsPage #fcSetup {
    padding: 24px;
    border: 1px solid var(--workspace-line);
    border-radius: 16px;
    background: var(--workspace-surface);
}
.student-workspace #flashcardsPage .set-modes {
    grid-template-columns: 1.4fr repeat(4, minmax(0, 1fr));
    gap: 0;
    padding: 0;
    border: 0;
    border-bottom: 1px solid var(--workspace-line);
    border-radius: 0;
    background: transparent;
}
.student-workspace #flashcardsPage .set-mode {
    min-height: 48px;
    padding: 8px 4px;
    border-radius: 0;
    border-bottom: 3px solid transparent;
    font-size: .85rem;
    font-weight: 800;
}
.student-workspace #flashcardsPage .set-mode-current {
    background: transparent;
    border-bottom-color: var(--workspace-accent);
    color: var(--workspace-accent);
    box-shadow: none;
}
.student-workspace #flashcardsPage .fc-card {
    border: 0;
    border-radius: 16px;
    box-shadow: none;
}
.student-workspace #flashcardsPage .fc-face {
    border-radius: 16px;
    border: 1px solid var(--workspace-line);
    box-shadow: var(--workspace-depth);
    background: var(--workspace-surface);
}
.student-workspace #flashcardsPage .fc-back { background: var(--workspace-inset); }
/* Keep the learned state above the neutral face border in both themes. */
.student-workspace #flashcardsPage .fc-card.known .fc-front {
    border-color: var(--emerald);
}
.student-workspace #flashcardsPage .fc-face-label {
    color: var(--text-secondary);
    opacity: 1;
    font-size: .8rem;
}
.student-workspace #flashcardsPage .fc-face-text {
    font-family: var(--font-ui);
    font-weight: 700;
}
.student-workspace #flashcardsPage .fc-corner { width: 44px; height: 44px; }
.student-workspace #flashcardsPage :is(.fc-btn, .fc-nav-btn) { min-height: 44px; border-radius: 8px; }
.student-workspace #testPage .tst-card { border-radius: 16px; box-shadow: var(--workspace-depth); }

/* Paper setup stays on the page ground; the two upload targets are its controls. */
.student-workspace #paperPage .tool-hero h2 {
    font-size: clamp(1.75rem, 2.5vw, 2rem);
    font-weight: 600;
    letter-spacing: -.02em;
    line-height: 1.18;
}
.student-workspace #paperPage .field-label {
    color: var(--text-secondary);
    font-family: var(--font-ui);
    font-size: .8rem;
    letter-spacing: .035em;
}
.student-workspace #paperPage .upload-area {
    border-radius: 10px;
    border-color: var(--workspace-control);
    background: var(--workspace-surface);
}
.student-workspace #paperPage .upload-area.drag-over {
    border-color: var(--workspace-accent);
    background: var(--workspace-soft);
}
.student-workspace #paperPage .upload-area:has(input:focus-visible) {
    outline: 3px solid var(--workspace-accent);
    outline-offset: 3px;
}
.student-workspace #paperPage .upload-icon { border-radius: 8px; }
.student-workspace #paperPage .upload-icon svg { stroke: var(--workspace-accent); }
.student-workspace #paperPage .upload-title { font-size: 1rem; }
.student-workspace #paperPage :is(.upload-sub, .pp-file-caption, .pp-row-sub) {
    color: var(--text-secondary);
    font-size: .85rem;
    line-height: 1.5;
}
.student-workspace #paperPage .upload-preview {
    border-color: var(--workspace-line);
    border-radius: 8px;
    background: var(--workspace-inset);
}
.student-workspace #paperPage :is(.pp-link, .upload-clear) { min-height: 44px; }
.student-workspace #paperPage .pp-link { color: var(--workspace-accent); }
.student-workspace #paperPage .pp-row { border-bottom-color: var(--workspace-line); }
.student-workspace #paperPage #paperSitBtn,
.student-workspace #learnPage :is(#learnGenBtn, #learnCheckBtn, #learnDone button) {
    min-height: 48px;
    border-radius: 8px;
    font-family: var(--font-ui);
    font-size: 1rem;
    font-weight: 800;
    box-shadow: none;
}

/* Learn's setup is an open form, with the same controls as the quiz builder. */
.student-workspace #learnPage > :is(.tool-hero, .mode-bar, .study-deck-bar, .study-gen, .study-hint, .write-bar, #learnArea, #learnDone, .tool-steps) {
    max-width: 760px;
}
/* Same reconciliation for the two panels under the selector. Learn showed an
   open form — a plain label and control on the page ground — while Match and
   Write wrapped the identical controls in a tinted 16px card and a filled
   generator panel, so the same three steps read as two different products.
   Flattened on all five: the set picker and the generator are page furniture,
   not cards to look at, and the study surface below them is what should carry
   the weight. */
.student-workspace :is(#flashcardsPage, #learnPage, #testPage, #matchPage, #writePage) .study-gen {
    padding: 0 0 24px;
    border-bottom-color: var(--workspace-line);
    background: transparent;
}
.student-workspace :is(#flashcardsPage, #learnPage, #testPage, #matchPage, #writePage) .study-gen-title {
    font-family: var(--font-ui);
    font-weight: 800;
}
.student-workspace :is(#flashcardsPage, #learnPage, #testPage, #matchPage, #writePage) .study-deck-bar {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
}
.student-workspace #learnPage :is(#learnGenSubject, #learnDeckBar .csel-trigger, #learnDeckSel, #learnInput) {
    min-height: 48px;
    border-radius: 8px;
    background: var(--workspace-surface);
    color: var(--text-primary);
    font-family: var(--font-ui);
    font-size: 1rem;
}
.student-workspace #learnPage :is(#learnGenSubject, #learnDeckSel, #learnInput):not(:focus),
.student-workspace #learnPage #learnDeckBar .csel:not(.open) .csel-trigger:not(:focus-visible) {
    border-color: var(--workspace-control);
}
.student-workspace #learnPage #learnDeckBar :is(.csel.open .csel-trigger, .csel-trigger:focus-visible) {
    border-color: var(--workspace-accent);
}
.student-workspace #learnPage #learnHint {
    padding: 0;
    border-radius: 0;
    background: transparent;
    color: var(--text-secondary);
    line-height: 1.5;
}

/* The existing active-area state compacts the introduction without moving or
   hiding any generator, deck or mode action. Completion restores the blurb. */
.student-workspace #learnPage:has(> #learnArea[style*="display: block"]) > .tool-hero {
    margin-bottom: 12px;
    padding-bottom: 12px;
}
.student-workspace #learnPage:has(> #learnArea[style*="display: block"]) > .tool-hero > p { display: none; }
.student-workspace #learnPage .tool-hero .match-head {
    flex-direction: row;
    align-items: flex-end;
    margin-bottom: 0;
    gap: 12px;
}
.student-workspace #learnPage .learn-counts {
    color: var(--text-secondary);
    font: 800 .8rem/1.4 var(--font-ui);
    text-align: right;
}
/* ── The mode selector, one treatment on all five surfaces ──
   These rules were scoped to #learnPage, which made Learn the only page whose
   selector read as tabs while Cards, Test, Match and Write showed pills sitting
   in a tinted band. The band was not even deliberate: ensureModeBar builds the
   bar as a <nav>, so it inherited the global "nav glass" background, and Learn
   was simply the only page that had overridden it.

   Tabs rather than pills is also the more truthful shape now: these five are
   views OF one flashcard set, not five separate places, and that is what a tab
   row says. Applied to the five study surfaces only. */
.student-workspace :is(#flashcardsPage, #learnPage, #testPage, #matchPage, #writePage) .mode-bar {
    gap: 0;
    margin-bottom: 12px;
    padding: 0;
    border: 0;
    border-bottom: 1px solid var(--workspace-line);
    background: transparent;
}
.student-workspace :is(#flashcardsPage, #learnPage, #testPage, #matchPage, #writePage) .mode-bar a {
    min-height: 44px;
    padding: 10px 12px;
    border: 0;
    border-bottom: 3px solid transparent;
    border-radius: 0;
    background: transparent;
    color: var(--text-secondary);
}
.student-workspace :is(#flashcardsPage, #learnPage, #testPage, #matchPage, #writePage) .mode-bar a[aria-current="page"] {
    border-bottom-color: var(--workspace-accent);
    color: var(--workspace-accent);
}
.student-workspace #learnPage:has(> #learnArea[style*="display: block"]) .study-gen {
    margin-block: 12px;
    padding-bottom: 12px;
}
.student-workspace #learnPage:has(> #learnArea[style*="display: block"]) .study-gen-title {
    margin-bottom: 8px;
    font-size: .85rem;
}
.student-workspace #learnPage:has(> #learnArea[style*="display: block"]) .study-gen-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
}
.student-workspace #learnPage:has(> #learnArea[style*="display: block"]) #learnGenBtn {
    min-width: 0;
    padding-inline: 16px;
}
.student-workspace #learnPage #learnGenSubject { max-width: none; }
.student-workspace #learnPage .write-bar { background: var(--workspace-soft); }
.student-workspace #learnPage .write-bar-fill { background: var(--workspace-accent); }
.student-workspace #learnPage .write-card {
    padding: clamp(20px, 3vw, 32px);
    border-color: var(--workspace-line);
    border-radius: 16px;
    background: var(--workspace-surface);
    box-shadow: var(--workspace-depth);
}
.student-workspace #learnPage .write-prompt {
    font-family: var(--font-ui);
    font-size: clamp(1.1rem, 1.7vw, 1.3rem);
    font-weight: 700;
    line-height: 1.55;
}
.student-workspace #learnPage .learn-choice {
    min-height: 60px;
    padding: 14px 16px;
    border-radius: 10px;
    font-size: 1rem;
    line-height: 1.5;
    box-shadow: none;
}
.student-workspace #learnPage .learn-choice:not(.correct):not(.wrong) {
    border-color: var(--workspace-control);
    background: var(--workspace-surface);
}
.student-workspace #learnPage .learn-choice::before { width: 32px; height: 32px; border-radius: 6px; }
.student-workspace #learnPage .learn-choice:not(.correct):not(.wrong)::before {
    border-color: var(--workspace-line);
    background: var(--workspace-inset);
    color: var(--workspace-accent);
}
.student-workspace #learnPage .learn-choice.correct { background: var(--emerald-dim); }
.student-workspace #learnPage .learn-choice:is(.correct, .wrong)::before { background: transparent; }
.student-workspace #learnPage #learnFeedback {
    margin-top: 16px;
    padding: 12px 16px;
    border-radius: 10px;
    background: var(--workspace-inset);
    font-size: .95rem;
    line-height: 1.55;
}
.student-workspace #learnPage #learnFeedback.ok { color: var(--emerald-dim); }
.student-workspace #learnPage #learnFeedback.no { color: #be123c; }
[data-dark] .student-workspace #learnPage #learnFeedback.ok { color: #6ee7b7; }
[data-dark] .student-workspace #learnPage #learnFeedback.no { color: #fda4af; }
.student-workspace #learnPage .wf-override {
    min-height: 44px;
    padding: 8px 12px;
    border: 1px solid var(--workspace-control);
    border-radius: 8px;
    background: var(--workspace-surface);
    color: var(--workspace-accent);
}
.student-workspace #learnPage #learnDone .wd-score { color: var(--workspace-accent); }
.student-workspace #learnPage #learnDone .tt-secondary {
    border-color: var(--workspace-control);
    background: var(--workspace-surface);
    color: var(--text-primary);
}

/* Saved work uses rows: title and context retain priority over utility actions. */
.student-workspace #libraryPage > :is(.tool-hero, .lib-chips, .lib-pane) { max-width: 920px; }
.student-workspace #libraryPage .lib-chips {
    gap: 4px 16px;
    border-bottom: 1px solid var(--workspace-line);
}
.student-workspace #libraryPage .lib-chip {
    min-height: 48px;
    padding: 10px 2px;
    border: 0;
    border-bottom: 3px solid transparent;
    border-radius: 0;
    background: transparent;
    color: var(--text-secondary);
}
.student-workspace #libraryPage .lib-chip[aria-selected="true"] {
    border-bottom-color: var(--workspace-accent);
    color: var(--workspace-accent);
}
.student-workspace #libraryPage .lib-list { grid-template-columns: minmax(0, 1fr); gap: 0; }
.student-workspace #libraryPage .lib-row {
    gap: 10px;
    padding: 20px 4px;
    border: 0;
    border-bottom: 1px solid var(--workspace-line);
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}
.student-workspace #libraryPage .lib-row-info { flex: 1 1 300px; }
.student-workspace #libraryPage .lib-row-title { font-size: 1rem; font-weight: 800; }
.student-workspace #libraryPage .lib-row-sub { font-size: .85rem; }
.student-workspace #libraryPage .lib-row-resume {
    padding: 18px;
    border-left: 3px solid var(--workspace-accent);
    border-radius: 8px;
    background: var(--workspace-soft);
}
.student-workspace #libraryPage .lib-act { min-height: 44px; border-radius: 8px; }
.student-workspace #libraryPage .lib-act:not(.lib-act-primary) { color: var(--workspace-accent); }

@media (min-width: 1280px) and (min-height: 600px) and (hover: hover) {
    body.student-workspace.rail-left .study-rail {
        top: 76px;
        bottom: 0;
        left: 16px;
        border: 0;
        border-right: 1px solid var(--workspace-line);
        border-radius: 0;
        padding: 8px 14px 24px 0;
        background: transparent;
        box-shadow: none;
    }
    body.student-workspace.rail-left .study-rail-btn {
        border-radius: 8px;
        font-family: var(--font-ui);
        font-weight: 700;
    }
    body.student-workspace.rail-left .study-rail-btn.is-active {
        background: var(--workspace-soft);
        color: var(--workspace-accent);
        box-shadow: inset 3px 0 0 var(--workspace-accent);
    }
    body.student-workspace.rail-left .study-rail-heading { font-family: var(--font-ui); }
}
@media (max-width: 900px) {
    .student-workspace #statsPage .student-progress-columns { grid-template-columns: minmax(0, 1fr); gap: 0; }
}
@media (max-width: 1279px), (max-height: 599px), (hover: none) {
    /* Start the scrolling surface below Back, so keyboard focus/flip scrolling
       cannot carry the page heading underneath that fixed control. */
    .student-workspace #flashcardsPage:has(> #fcDeck[style*="display: block"]),
    .student-workspace #learnPage:has(> #learnArea[style*="display: block"]) {
        top: max(124px, calc(env(safe-area-inset-top) + 116px));
        padding-top: 4px;
    }
    .student-workspace:has(#flashcardsPage[style*="display: block"] > #fcDeck[style*="display: block"], #learnPage[style*="display: block"] > #learnArea[style*="display: block"]) #sectionBack::before {
        content: "";
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        height: max(124px, calc(env(safe-area-inset-top) + 116px));
        z-index: -1;
        background: #fff;
        pointer-events: none;
    }
    .student-workspace:has(#flashcardsPage[style*="display: block"] > #fcDeck[style*="display: block"], #learnPage[style*="display: block"] > #learnArea[style*="display: block"]) #sectionBack,
    .student-workspace:has(#flashcardsPage[style*="display: block"] > #fcDeck[style*="display: block"], #learnPage[style*="display: block"] > #learnArea[style*="display: block"]) #sectionBack:hover {
        transform: none;
    }
    [data-dark] .student-workspace:has(#flashcardsPage[style*="display: block"] > #fcDeck[style*="display: block"], #learnPage[style*="display: block"] > #learnArea[style*="display: block"]) #sectionBack::before {
        background: #111113;
    }
}
@media (max-width: 600px) {
    .student-workspace #guestLimitBanner {
        flex-wrap: nowrap;
        gap: 10px;
        padding: 12px;
        margin-block: 12px 18px;
    }
    .student-workspace #guestLimitBanner .glb-icon {
        width: 28px;
        height: 28px;
    }
    .student-workspace #guestLimitBanner .glb-icon svg { width: 18px; height: 18px; }
    .student-workspace #guestLimitBanner .glb-sub { line-height: 1.4; }
    .student-workspace #guestLimitBanner .glb-cta {
        width: auto;
        min-width: 64px;
        min-height: 44px;
        padding: 10px;
    }
    .student-workspace #inputSection,
    .student-workspace #flashcardsPage #fcSetup {
        padding: 0;
        border: 0;
        border-radius: 0;
        background: transparent;
        box-shadow: none;
    }
    .student-workspace #inputSection .generator-card-head { margin-bottom: 16px; }
    .student-workspace #inputSection #quizPreset { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .student-workspace #inputSection .preset-long { display: inline; }
    .student-workspace #inputSection .preset-short { display: none; }
    .student-workspace #statsPage #dashUpNext { padding: 18px; }
    .student-workspace #dashStanding .ds-cell { padding: 18px 12px; }
    .student-workspace #dashStanding .ds-cell:nth-child(odd) { padding-left: 0; }
    .student-workspace #dashStanding .ds-val { font-size: 2.2rem; }
    .student-workspace #quizSection .question-card { padding: 20px 16px; }
    .student-workspace #quizSection .option { gap: 10px; padding: 12px; }
    .student-workspace #learnPage .write-card { padding: 20px 16px; }
    .student-workspace #learnPage .learn-choice { gap: 10px; padding: 12px; }
    .student-workspace #libraryPage .lib-chips { gap: 0 14px; }
    .student-workspace #libraryPage .lib-row-info { flex-basis: 100%; }
    /* Existing fixed CTA rules and page bottom reserves intentionally remain
       unchanged. Do not put transforms/containment on either builder ancestor. */
}
@media (hover: hover) {
    .student-workspace #paperPage .upload-area:hover {
        border-color: var(--workspace-accent);
        background: var(--workspace-soft);
    }
    .student-workspace #libraryPage .lib-row:hover { background: var(--workspace-soft); }
    .student-workspace #quizSection .option:not(.disabled):not(.correct):not(.wrong):not(.timeout-correct):hover {
        border-color: var(--workspace-accent);
        background: var(--workspace-soft);
    }
    .student-workspace #learnPage .learn-choice:not(:disabled):not(.correct):not(.wrong):hover {
        border-color: var(--workspace-accent);
        background: var(--workspace-soft);
    }
}
@media (hover: none) {
    .student-workspace #paperPage .upload-area:hover:not(.drag-over) {
        border-color: var(--workspace-control);
        background: var(--workspace-surface);
    }
}

/* Study studio: hierarchy comes from reading order and a single work surface. */
.student-workspace .study-tool-page .tool-hero {
    padding-bottom: 24px;
    margin-bottom: 28px;
}
.student-workspace .study-tool-page .tool-hero h2,
.student-workspace .generator-card-head h1 {
    font-size: clamp(1.85rem, 2.7vw, 2.45rem);
    font-weight: 650;
    letter-spacing: -.045em;
}
.student-workspace .study-tool-page .tool-hero h2::before {
    margin-bottom: 12px;
    color: var(--text-secondary);
    font-size: .7rem;
    font-weight: 700;
    letter-spacing: .11em;
    text-transform: uppercase;
}
.student-workspace :is(#inputSection, #flashcardsPage #fcSetup) {
    border-radius: 12px;
    padding: clamp(24px, 3vw, 38px);
    box-shadow: none;
}
.student-workspace #inputSection .generator-card-head {
    margin-bottom: 26px;
    padding-bottom: 22px;
    border-bottom: 1px solid var(--workspace-line);
}
.student-workspace :is(#inputSection, #flashcardsPage) .builder-group-label {
    color: var(--text-primary);
    font-size: .8rem;
    font-weight: 700;
    letter-spacing: .025em;
}
.student-workspace :is(#inputSection, #flashcardsPage) .tabs {
    background: transparent;
    border: 0;
    border-bottom: 1px solid var(--workspace-line);
    border-radius: 0;
    padding: 0 0 8px;
}
.student-workspace #inputSection .tab-slider,
.student-workspace #flashcardsPage #fcTabSlider {
    box-shadow: none;
    border-color: var(--workspace-line);
    background: var(--workspace-inset);
}

/* Dashboard: the next session leads; history becomes the supporting ledger. */
.student-workspace #statsPage #dashUpNext {
    max-width: 1080px;
    margin: 0 auto 20px;
    padding: 30px 32px;
    border: 1px solid var(--workspace-line);
    border-radius: 12px;
    background: var(--workspace-surface);
    box-shadow: none;
}
.student-workspace #dashUpNext .un-eyebrow {
    font-size: .7rem;
    text-transform: uppercase;
    letter-spacing: .1em;
    color: var(--text-secondary);
}
.student-workspace #dashUpNext .un-title {
    max-width: 24ch;
    font: 650 clamp(1.65rem, 2.4vw, 2.1rem)/1.2 var(--font-display);
    letter-spacing: -.035em;
    color: var(--text-primary);
}
.student-workspace #dashUpNext .un-primary {
    padding: 0;
    gap: 14px;
    background: transparent;
}
.student-workspace #dashUpNext .un-reason { max-width: 50ch; font-size: .95rem; line-height: 1.65; }
.student-workspace #dashUpNext .un-cta { margin-top: 8px; min-height: 48px; padding: 12px 22px; }
.student-workspace #dashUpNext .un-alts { padding-left: 24px; border-left: 1px solid var(--workspace-line); }
.student-workspace #dashUpNext .un-row { padding: 14px 0; min-height: 72px; }
.student-workspace #dashUpNext .un-row-title { font-size: .9rem; font-weight: 650; color: var(--text-primary); }
.student-workspace #dashUpNext .un-row-reason { font-size: .8rem; }
.student-workspace #statsPage .dash-links { align-items: center; gap: 22px; margin: 0 auto 20px; }
.student-workspace #statsPage .dash-link { display: inline-flex; align-items: center; min-height: 44px; margin: 0; padding: 0; color: var(--text-secondary); font-size: .85rem; font-weight: 600; line-height: 1.5; }
.student-workspace #dashStartGuide { display: none; }
.student-workspace #statsPage:has(#dashHistory[hidden]) #dashStartGuide {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 28px;
    margin: 30px auto 24px;
    padding: 26px 0 0;
    border-top: 1px solid var(--workspace-line);
}
.student-workspace #dashStartGuide { list-style: none; }
.student-workspace #dashStartGuide > li { min-width: 0; }
.student-workspace #dashStartGuide > li > span { display: block; margin-bottom: 14px; font-size: .75rem; color: var(--text-secondary); font-variant-numeric: tabular-nums; }
.student-workspace #dashStartGuide h3 { margin: 0 0 8px; font-size: .95rem; font-weight: 650; }
.student-workspace #dashStartGuide p { margin: 0; font-size: .875rem; line-height: 1.65; color: var(--text-secondary); }
.student-workspace #dashStanding { border-top: 0; padding-top: 0; }
.student-workspace #dashStanding .ds-val { font-size: 2.2rem; letter-spacing: -.05em; }
.student-workspace #dashStanding .ds-cell { border: 0; }
.student-workspace #dashStanding .ds-label { color: var(--text-secondary); font-size: .75rem; }
.student-workspace #statsPage .trend-chart-card { border: 0; border-radius: 0; padding: 0; background: transparent; }
.student-workspace #statsPage .dash-sec-head > svg { display: none; }
.student-workspace #statsPage .dash-sec-title { font-size: 1.05rem; font-weight: 650; }
.student-workspace #statsPage #dashLevel { border-radius: 0; background: transparent; padding-inline: 0; box-shadow: none; }
.student-workspace #statsPage .dash-upsell { padding: 18px 0; border-width: 1px 0; border-radius: 0; background: transparent; }

/* Milestones retain their real unlock conditions, with a visible earned state. */
.student-workspace :is(#dashAchGrid, #achievementsGrid) {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0 28px;
}
.student-workspace :is(#dashAchGrid, #achievementsGrid) .ach-card {
    align-items: flex-start;
    gap: 12px;
    padding: 20px 0;
    border: 0;
    border-bottom: 1px solid var(--workspace-line);
    border-radius: 0;
    background: transparent;
    opacity: 1;
    box-shadow: none;
    transform: none;
}
.student-workspace .ach-card .ach-icon {
    width: 36px;
    height: 36px;
    border: 1px solid var(--workspace-line);
    border-radius: 8px;
    background: transparent;
    color: var(--text-secondary);
    animation: none;
}
.student-workspace .ach-card.unlocked .ach-icon { color: var(--workspace-accent); background: var(--workspace-soft); border-color: transparent; }
.student-workspace .ach-card .ach-name,
.student-workspace .ach-card.unlocked .ach-name { color: var(--text-primary); font-size: .85rem; font-weight: 650; }
.student-workspace .ach-card .ach-desc { margin-top: 5px; font-size: .78rem; line-height: 1.5; color: var(--text-secondary); }
.student-workspace .ach-state { display: block; margin-top: 8px; font-size: .66rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--text-secondary); }
.student-workspace .ach-card.unlocked .ach-state { color: var(--workspace-accent); }

/* Exam paper, answer and feedback read as a deliberate sequence. */
.student-workspace #quizSection { max-width: 900px; }
.student-workspace #quizSection .progress-wrap { border: 0; border-bottom: 1px solid var(--workspace-line); border-radius: 0; background: transparent; box-shadow: none; }
.student-workspace #quizSection .question-card { padding: clamp(24px, 4vw, 48px); border-radius: 12px; box-shadow: none; }
.student-workspace #quizSection .timer-row { float: right; margin: 0 0 12px 12px !important; padding: 0 !important; border: 0 !important; }
.student-workspace #quizSection :is(.question-num, .diff-badge, .qtype-badge, .score-chip) { border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.student-workspace #quizSection :is(.diff-badge, .qtype-badge, .score-chip) { color: var(--text-secondary); font-size: .7rem; }
.student-workspace #quizSection :is(.btn-next, .btn-prev, .btn-grade) { box-shadow: none; }
.student-workspace #quizSection .question-num { color: var(--text-secondary); font-size: .72rem; letter-spacing: .08em; }
.student-workspace #quizSection .question-text { max-width: 65ch; margin-block: 22px 28px; font-size: clamp(1.16rem, 1.7vw, 1.4rem); font-weight: 600; line-height: 1.6; letter-spacing: -.015em; }
.student-workspace #quizSection .option:not(.correct):not(.wrong):not(.timeout-correct):not(.selected) { border-color: var(--workspace-line); background: transparent; }
.student-workspace #quizSection .option { border-radius: 8px; }
.student-workspace #quizSection .opt-letter { border: 0; background: var(--workspace-inset); color: var(--text-secondary); font-weight: 600; }
.student-workspace #quizSection :is(.grade-result, .explanation-box) { margin-top: 26px; padding: 22px 0 0; border-width: 2px 0 0; border-radius: 0; background: transparent; color: var(--text-primary); box-shadow: none; }
.student-workspace .examiner-report .mark-report-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin: 0 0 8px; }
.student-workspace .examiner-report .mark-report-label { display: block; margin-bottom: 4px; font-size: .65rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--text-secondary); }
.student-workspace .examiner-report .mark-report-score { font: 650 2.2rem/1 var(--font-display); letter-spacing: -.055em; }
.student-workspace .examiner-report .mark-report-score small { margin-left: 3px; font-size: 1rem; font-weight: 500; color: var(--text-secondary); }
.student-workspace #quizSection .grade-badge { border-radius: 4px; padding: 5px 8px; box-shadow: none; }
.student-workspace #quizSection .mark-report-why { font-size: 1rem; line-height: 1.75; }
.student-workspace #quizSection .mark-report-model { margin-top: 22px; padding: 18px 20px; border-left: 2px solid var(--workspace-line); background: var(--workspace-inset); font-size: .95rem; line-height: 1.7; }
.student-workspace #quizSection .sm-compare { margin-bottom: 14px; font-size: .8rem; color: var(--text-secondary); }
.student-workspace #quizSection .sm-model { border-radius: 0; background: transparent; padding: 0 0 20px; font-size: 1rem; line-height: 1.75; }
.student-workspace #quizSection #scoreCard { padding: clamp(24px, 4vw, 44px); border-radius: 12px; box-shadow: none; }
.student-workspace #quizSection #scoreCard .score-actions { padding-top: 20px; border-top: 1px solid var(--workspace-line); }

/* Essay feedback is a marking sheet, not a stack of coloured callouts. */
.student-workspace #essayFeedback > :not(.tool-hero):not(.tool-steps):not(svg) { max-width: 860px; }
.student-workspace #essayFeedback .essay-course { max-width: 860px; }
.student-workspace #essayFeedback .essay-course select { max-width: 420px; border-radius: 8px; border-color: var(--workspace-control); background: var(--workspace-surface); }
.student-workspace #essayFeedback .essay-type-row { gap: 6px; padding-bottom: 22px; }
.student-workspace #essayFeedback .essay-type-chip { border-radius: 6px; border-color: transparent; background: transparent; color: var(--text-secondary); animation: none; }
.student-workspace #essayFeedback .essay-type-chip.active { border-color: var(--workspace-accent); background: var(--workspace-soft); color: var(--workspace-accent); }
.student-workspace #essayFeedback #essayText { max-width: 860px; margin-inline: auto; padding: 22px; border-radius: 10px; border-color: var(--workspace-line); background: var(--workspace-surface); font-size: 1rem; line-height: 1.8; }
.student-workspace #essayFeedback .btn-essay { min-height: 48px; border-radius: 8px; font-size: .95rem; font-weight: 700; }
.student-workspace #essayFeedback #essayResult { padding: 32px; border: 1px solid var(--workspace-line); border-radius: 12px; background: var(--workspace-surface); box-shadow: none; }
.student-workspace #essayResultTitle { font-size: .75rem; text-transform: uppercase; letter-spacing: .08em; color: var(--text-secondary); }
.student-workspace #essayFeedback .essay-estimate-note { max-width: 65ch; font-size: .8rem; }
.student-workspace #essayFeedback .essay-band { display: block; padding: 0; margin: 24px 0 12px; border: 0; border-radius: 0; background: transparent; color: var(--text-primary); font: 650 clamp(1.6rem, 2.3vw, 2rem)/1.25 var(--font-display); letter-spacing: -.035em; }
.student-workspace #essayFeedback .essay-band svg { display: none; }
.student-workspace #essayFeedback .essay-summary { max-width: 65ch; margin-bottom: 30px; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; font-size: 1rem; line-height: 1.75; }
.student-workspace #essayCriteria { padding: 22px 0; border-block: 1px solid var(--workspace-line); }
.student-workspace #essayFeedback .ec-row { padding: 12px 0; margin: 0; }
.student-workspace #essayFeedback .ec-head { margin-bottom: 8px; }
.student-workspace #essayFeedback .ec-score { background: transparent; font-size: 1rem; }
.student-workspace #essayFeedback .ec-bar { height: 3px; background: var(--workspace-line); }
.student-workspace #essayFeedback .ec-fill { background: var(--workspace-accent); }
.student-workspace #essayFeedback .ec-comment { margin-top: 8px; font-size: .85rem; line-height: 1.6; color: var(--text-secondary); }
.student-workspace #essayFeedback .essay-fb-block { padding-top: 12px; margin-bottom: 24px; }
.student-workspace #essayFeedback .essay-fb-heading { font-size: .75rem; letter-spacing: .055em; }
.student-workspace #essayFeedback .essay-fb-item { padding: 8px 0; border: 0; border-radius: 0; background: transparent; font-size: .95rem; line-height: 1.7; }
.student-workspace #essayFeedback .essay-fb-icon { padding-top: 3px; }
.student-workspace #essayFeedback .ec-rw { margin: 14px 0 0; padding: 16px 20px; border-width: 0 0 0 2px; border-radius: 0; background: var(--workspace-inset); line-height: 1.75; }
.student-workspace #essayFeedback .ec-rw-before { border-color: var(--workspace-line); text-decoration: none; }
.student-workspace #essayFeedback .ec-rw-after { border-color: var(--workspace-accent); }
.student-workspace #essayFeedback .ec-rw-label { display: block; margin: 0 0 8px; padding: 0; border: 0; border-radius: 0; background: transparent; font-size: .7rem; letter-spacing: .07em; color: var(--text-secondary); }
.student-workspace #essayFeedback .essay-next-step { padding: 20px 0 0; border-width: 1px 0 0; border-color: var(--workspace-line); border-radius: 0; background: transparent; font-size: 1rem; line-height: 1.7; }
.student-workspace #essayFeedback .essay-next-step b { display: block; margin-bottom: 6px; font-size: .75rem; text-transform: uppercase; letter-spacing: .07em; }

/* In a live deck the study object owns the space; tools sit quietly around it. */
.student-workspace #flashcardsPage:has(> #fcDeck[style*="display: block"]) > .tool-hero h2 { font-size: 1.3rem; letter-spacing: -.025em; }
.student-workspace #flashcardsPage:has(> #fcDeck[style*="display: block"]) > .tool-hero h2::before { display: none; }
.student-workspace #flashcardsPage:has(> #fcDeck[style*="display: block"]) > .mode-bar { display: none; }
.student-workspace #flashcardsPage .fc-deck-title { font-size: 1.2rem; font-weight: 650; letter-spacing: -.025em; }
.student-workspace #flashcardsPage .fc-deck-progress { font-size: .75rem; }
.student-workspace #flashcardsPage .fc-progress-bar { height: 3px; margin: 18px 0 22px; background: var(--workspace-line); }
.student-workspace #flashcardsPage .fc-progress-fill { background: var(--workspace-accent); }
.student-workspace #flashcardsPage .fc-card-wrap { max-width: 760px; }
.student-workspace #flashcardsPage .fc-card { height: clamp(320px, 43vh, 440px); }
.student-workspace #flashcardsPage .fc-face { border-radius: 12px; padding: 24px 36px; justify-content: flex-start; overflow: hidden; box-shadow: 0 2px 5px rgba(14, 18, 32, .04); }
.student-workspace #flashcardsPage .fc-face-label { position: static; align-self: flex-start; flex-shrink: 0; margin: 0 90px 16px 0; font-size: .65rem; letter-spacing: .12em; }
/* Text scrolls independently of the label and flip hint. Safe alignment keeps
   the beginning of a long answer reachable while centring short prompts. */
.student-workspace #flashcardsPage .fc-face-text { flex: 1 1 auto; min-height: 0; width: 100%; max-width: 28ch; overflow-y: auto; overscroll-behavior: contain; display: flex; align-items: safe center; justify-content: center; font-size: clamp(1.35rem, 2.2vw, 1.85rem); font-weight: 550; line-height: 1.55; letter-spacing: -.025em; }
.student-workspace #flashcardsPage .fc-hint { position: static; flex-shrink: 0; margin: 16px 0 0; font-size: .75rem; color: var(--text-secondary); }
/* A backface can be visually hidden yet still expose its scrolling region to
   Tab. Only the currently revealed side may receive keyboard focus. */
.student-workspace #flashcardsPage .fc-card:not(.flipped) .fc-back,
.student-workspace #flashcardsPage .fc-card.flipped .fc-front { visibility: hidden; }
.student-workspace #flashcardsPage .fc-nav { margin: 16px 0; gap: 22px; }
.student-workspace #flashcardsPage .fc-round { width: 44px; height: 44px; border-radius: 8px; box-shadow: none; border-color: var(--workspace-line); background: transparent; }
.student-workspace #flashcardsPage .fc-controls { gap: 10px; }
.student-workspace #flashcardsPage .fc-btn-again { border-color: var(--workspace-line); background: transparent; color: var(--text-primary); }
.student-workspace #flashcardsPage .fc-btn-know { background: #5b50e8; color: #fff; border-color: #5b50e8; box-shadow: none; }
.student-workspace #flashcardsPage .fc-controls-sub { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--workspace-line); gap: 4px; }
.student-workspace #flashcardsPage .fc-btn-ghost { padding: 8px 12px; border-color: transparent; background: transparent; color: var(--text-secondary); font-size: .8rem; }
.student-workspace #flashcardsPage .fc-corner { top: 14px; border-radius: 8px; border-color: transparent; background: transparent; box-shadow: none; }
.student-workspace #flashcardsPage .fc-corner-left { left: auto; right: 58px; }
.student-workspace #flashcardsPage .set-terms { margin-top: 32px; }
.student-workspace #achievementsPanel { padding: 28px 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }

@media (max-width: 900px) {
    .student-workspace #dashUpNext .un-alts { border-left: 0; padding-left: 0; margin-top: 12px; }
    .student-workspace :is(#dashAchGrid, #achievementsGrid) { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 24px; }
}
@media (max-width: 600px) {
    .student-workspace .study-tool-page .tool-hero { padding-bottom: 20px; margin-bottom: 22px; }
    .student-workspace :is(#inputSection, #flashcardsPage #fcSetup) { padding: 0; border: 0; background: transparent; }
    .student-workspace #statsPage #dashUpNext { padding: 24px 20px; }
    .student-workspace #dashUpNext .un-title { font-size: 1.75rem; }
    .student-workspace #dashUpNext .un-cta { width: 100%; text-align: center; }
    .student-workspace #statsPage:has(#dashHistory[hidden]) #dashStartGuide { grid-template-columns: minmax(0, 1fr); gap: 22px; margin-top: 26px; }
    .student-workspace #dashStartGuide > li { display: grid; grid-template-columns: 28px minmax(0, 1fr); column-gap: 12px; }
    .student-workspace #dashStartGuide > li > span { padding-top: 3px; }
    .student-workspace #statsPage .dash-links { gap: 18px; }
    .student-workspace #statsPage .dash-link { font-size: .78rem; }
    .student-workspace :is(#dashAchGrid, #achievementsGrid) { grid-template-columns: minmax(0, 1fr); }
    .student-workspace :is(#dashAchGrid, #achievementsGrid) .ach-card { padding: 18px 0; }
    .student-workspace .ach-card .ach-desc { font-size: .8rem; }
    .student-workspace #quizSection .question-card { padding: 24px 18px; }
    .student-workspace #quizSection .question-text { margin-block: 20px 24px; }
    .student-workspace #quizSection .mark-report-model { padding: 16px; }
    .student-workspace #essayFeedback .essay-course select { max-width: none; }
    .student-workspace #essayFeedback #essayText { padding: 16px; }
    .student-workspace #essayFeedback #essayResult { padding: 24px 0; border-width: 1px 0; border-radius: 0; background: transparent; }
    .student-workspace #essayFeedback .essay-type-row { gap: 4px; }
    .student-workspace #essayFeedback .essay-type-chip { padding-inline: 10px; }
    .student-workspace #flashcardsPage .fc-card { height: clamp(300px, 40vh, 360px); }
    .student-workspace #flashcardsPage .fc-face { padding: 24px; }
    .student-workspace #flashcardsPage .fc-face-text { font-size: 1.3rem; }
    .student-workspace #flashcardsPage .fc-controls-sub { display: grid; grid-template-columns: 1fr 1fr; }
}

/* Account and first-session overlays belong to the same quiet study surface. */
.student-workspace #badgeToast:not(.show) { visibility: hidden; }
.student-workspace #badgeToast { border-radius: 8px; white-space: normal; max-width: calc(100vw - 32px); }
.student-workspace .auth-modal { border-radius: 12px; box-shadow: 0 20px 60px rgba(0,0,0,.18); }
.student-workspace :is(.auth-submit,.btn-google,.btn-microsoft,.auth-tab,.onboard-next) { border-radius: 8px; }
.student-workspace .auth-field input { border-radius: 8px; }
.student-workspace #onboardCard { border: 1px solid var(--workspace-line); border-radius: 12px; box-shadow: 0 8px 30px rgba(0,0,0,.16); }
.student-workspace .onboard-text { font-size: .875rem; font-weight: 500; line-height: 1.6; }
.student-workspace #onboardAvi { animation: none; width: 38px; }
.student-workspace :is(.onboard-next,.onboard-skip) { min-height: 44px; }
@media (min-width:900px) {
    .student-workspace .auth-aside { background: var(--workspace-inset); color: var(--text-primary); border-right: 1px solid var(--workspace-line); padding: 32px 26px; }
    .student-workspace .auth-aside-avi { width: 40px; height: 40px; border-radius: 10px; box-shadow: none; }
    .student-workspace .auth-aside-title { font-size: 1.6rem; font-weight: 600; line-height: 1.15; letter-spacing: -.03em; }
    .student-workspace .auth-aside-list { gap: 22px; }
    .student-workspace .auth-aside-list li { color: var(--text-secondary); font-size: .8125rem; line-height: 1.65; }
    .student-workspace .auth-aside-list b { color: var(--text-primary); font-weight: 650; }
    .student-workspace .auth-aside-tick { background: none; color: var(--workspace-accent); }
}
/* Small feedback labels need text contrast, not just a coloured status fill. */
html:not([data-dark]) .student-workspace .grade-badge.partial { color: #8a4308; background: #fbefde; }
[data-dark] .student-workspace #quizSection .explain-differently-btn { color: #b9b2ff; }
.student-workspace #flashcardsPage .fc-face-text:focus-visible { outline: 2px solid var(--workspace-accent); outline-offset: -2px; border-radius: 4px; }

/* In a single column, build first; the same recommendations follow the form.
   DOM order also keeps keyboard navigation aligned with the reading order. */
@media (max-width: 1099px) {
    .student-workspace #todayStrip { margin-top: 24px; align-items: start; }
}

/* Examiner reports use the same hierarchy in the question and its debrief. */
.student-workspace .examiner-report { --mark-earned: #166534; --mark-partial: #854d0e; --mark-missed: #b42318; --mark-earned-bg: #edf8f0; --mark-partial-bg: #fff7dd; --mark-missed-bg: #fff0ee; color: var(--text-primary); overflow-wrap: anywhere; }
[data-dark] .student-workspace .examiner-report { --mark-earned: #86efac; --mark-partial: #fcd34d; --mark-missed: #fca5a5; --mark-earned-bg: #153425; --mark-partial-bg: #3c2e10; --mark-missed-bg: #3c2023; }
.student-workspace #quizSection .grade-result.examiner-report { margin-top: 16px; padding-top: 16px; }
.student-workspace .examiner-report .mark-report-head { flex-wrap: wrap; }
.student-workspace .examiner-report [data-status="earned"] { --mark-status: var(--mark-earned); --mark-status-bg: var(--mark-earned-bg); }
.student-workspace .examiner-report [data-status="partial"] { --mark-status: var(--mark-partial); --mark-status-bg: var(--mark-partial-bg); }
.student-workspace .examiner-report [data-status="missed"] { --mark-status: var(--mark-missed); --mark-status-bg: var(--mark-missed-bg); }
.student-workspace .examiner-verdict { color: var(--mark-status); background: var(--mark-status-bg); border: 1px solid currentColor; border-radius: 6px; padding: 5px 8px; font-size: .75rem; font-weight: 700; }
.student-workspace .examiner-source,
.student-workspace .examiner-reference-note { color: var(--text-secondary); font-size: .75rem; line-height: 1.5; margin: 6px 0; }
.student-workspace .examiner-report .sm-compare { margin: 6px 0; font-size: .75rem; line-height: 1.5; }
.student-workspace .examiner-update { padding: 12px 14px; border-left: 3px solid var(--workspace-accent); background: var(--workspace-inset); font-size: .875rem; line-height: 1.6; }
.student-workspace .examiner-section { margin-top: 16px; }
.student-workspace .examiner-section-title { margin: 0 0 6px; font-size: .9375rem; font-weight: 700; line-height: 1.45; }
.student-workspace .examiner-criteria { list-style: none; margin: 0; padding: 0; }
.student-workspace .examiner-criterion { padding: 8px 0 8px 10px; margin: 5px 0; border-left: 2px solid var(--mark-status); border-bottom: 1px solid var(--workspace-line); }
.student-workspace .examiner-criterion-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: .875rem; font-weight: 650; line-height: 1.45; }
.student-workspace .examiner-award { display: flex; flex-direction: column; align-items: flex-end; flex-shrink: 0; gap: 2px; color: var(--mark-status); }
.student-workspace .examiner-status { font-size: .625rem; font-weight: 750; line-height: 1.3; white-space: nowrap; }
.student-workspace .examiner-fraction { font-variant-numeric: tabular-nums; font-size: .875rem; }
.student-workspace .examiner-criterion p { margin: 5px 0 0; font-size: .8125rem; line-height: 1.5; color: var(--text-secondary); }
.student-workspace .examiner-evidence { margin: 12px 0 0; padding-left: 12px; border-left: 2px solid var(--workspace-line); font-size: .875rem; line-height: 1.6; white-space: pre-wrap; }
.student-workspace .examiner-evidence-label { display: block; font-size: .7rem; font-weight: 650; color: var(--text-secondary); margin-bottom: 4px; }
.student-workspace .examiner-improvements { padding-left: 22px; margin: 0; }
.student-workspace .examiner-improvements li { padding-left: 2px; margin: 6px 0; font-size: .875rem; line-height: 1.5; }
.student-workspace .examiner-full { margin: 12px 0; font-size: .875rem; line-height: 1.5; }
.student-workspace .examiner-notes { margin-top: 14px; padding-top: 4px; border-top: 1px solid var(--workspace-line); }
.student-workspace .examiner-notes > summary { min-height: 44px; display: flex; align-items: center; gap: 10px; cursor: pointer; font-size: .8125rem; font-weight: 650; }
.student-workspace .examiner-notes > summary::after { content: '+'; margin-left: auto; }
.student-workspace .examiner-notes[open] > summary::after { content: '−'; }
.student-workspace .examiner-notes > summary:focus-visible { outline: 2px solid var(--workspace-accent); outline-offset: 3px; }
.student-workspace .examiner-note { padding-block: 12px; font-size: .8125rem; line-height: 1.5; }
.student-workspace .examiner-note p { margin: 4px 0; }
.student-workspace .examiner-note-title { font-weight: 650; }
.student-workspace .mark-report-model summary { min-height: 44px; display: flex; align-items: center; cursor: pointer; font-weight: 650; }
.student-workspace .mark-report-model summary::after { content: '+'; margin-left: auto; padding-left: 12px; }
.student-workspace .mark-report-model[open] summary::after { content: '−'; }
.student-workspace .mark-report-model summary:focus-visible { outline: 2px solid var(--workspace-accent); outline-offset: 3px; }
.student-workspace .wm-row > .examiner-report { margin-top: 24px; }
.student-workspace .sm-select-wrap { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; margin-top: 14px; }
.student-workspace .sm-select-wrap label { grid-column: 1 / -1; font-size: .875rem; font-weight: 650; }
.student-workspace .sm-select-wrap :is(select, button) { min-height: 44px; border: 1px solid var(--workspace-line); border-radius: 6px; background: var(--workspace-inset); color: var(--text-primary); padding: 8px 12px; font: inherit; }
.student-workspace .sm-select-wrap :is(select, button):focus-visible { outline: 2px solid var(--workspace-accent); outline-offset: 3px; }
.student-workspace .sm-select-wrap button:disabled { opacity: .5; }
@media (max-width: 480px) {
    .student-workspace .examiner-criterion-head { align-items: flex-start; }
    .student-workspace .sm-select-wrap { grid-template-columns: minmax(0, 1fr); }
}