/* A quiet, consistent frame for the task, with detail available on demand. */
.boot-splash, .auth-progress-overlay {
  background: var(--surface, #fff); color: var(--ink, #182638);
}
.boot-splash-inner { gap: 16px; }
.boot-logo-loader { width: 76px; height: 76px; margin-bottom: 4px; }
.boot-splash .boot-splash-mark { width: 60px; height: 60px; box-shadow: none; }
.boot-splash-title { font: 700 19px/1.4 var(--sans); letter-spacing: -.02em; }
.boot-progress-label { color: var(--muted); font: 400 14px/1.5 var(--sans); }
.boot-splash .boot-progress-ring { box-shadow: none; }
.boot-splash .boot-progress-ring::after { background: var(--surface); box-shadow: none; inset: 3px; }
.auth-progress-overlay .boot-progress-ring::after { display: none; }
.auth-progress-overlay .boot-progress-ring {
  background: transparent; border: 3px solid var(--line); border-top-color: var(--blue);
  animation: studio-loading 1s linear infinite;
}
.auth-progress-complete .boot-progress-ring { animation: none; border-color: var(--line); }
@keyframes studio-loading { to { transform: rotate(360deg); } }

.view:not(#practice-view) { max-width: 1184px; }
.page-heading { margin-bottom: 24px; }
.page-heading h1 { margin-bottom: 8px; }
.topbar .profile-badge { border-color: transparent; background: transparent; padding-inline: 8px; }
.topbar .profile-badge:hover { border-color: var(--line); background: var(--surface-2); }
.topbar .profile-badge #profile-initials { background: var(--surface-2); color: var(--blue); }
.topbar .search-box { background: var(--paper); border-color: var(--line); }
.question-panel, .panel { box-shadow: 0 2px 8px rgba(20, 36, 58, .025); }
.choice { border-color: var(--line); background: var(--surface); }
.choice:hover { border-color: var(--blue); background: var(--surface-2); }
.choice.selected { border-color: var(--blue); box-shadow: inset 0 0 0 1px var(--blue); }

.home-quiet { gap: 24px; }
.home-quiet-head { margin-bottom: 0; }
.home-quiet-head h1 { margin: 8px 0; font-size: clamp(28px, 3vw, 36px); }
.dashboard-greeting { color: var(--muted); font-size: 14px; font-weight: 500; }
.home-strip { padding: 0 0 24px; margin-bottom: 0; background: transparent; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; }
.home-strip-stats { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); width: 100%; gap: 24px; }
.home-strip-stats > div { padding: 0; }
.home-strip-stats > div + div { border: 0; padding-left: 0; }
.home-strip-stats strong { font-size: 30px; color: var(--ink); }
.dashboard-study-grid { display: grid; grid-template-columns: minmax(0,1.15fr) minmax(0,1fr); gap: 24px; margin-bottom: 0; }
.next-best { display: flex; flex-direction: column; align-items: start; padding: 28px; margin: 0; border: 1px solid var(--line); border-radius: 14px; }
.next-best > small { text-transform: none; letter-spacing: 0; font-size: 13px; }
.next-best > strong { margin-top: 18px; font-size: 27px; line-height: 1.25; }
.next-best > p { margin: 12px 0 24px; max-width: 44ch; font-size: 15px; }
.next-best .next-best-actions { display: flex; flex-direction: column; align-items: start; align-self: stretch; gap: 6px; margin-top: auto; }
.next-best .next-best-actions .text-button { font-size: 12px; padding-inline: 0; color: var(--muted); }
.study-paths { display: flex; flex-direction: column; gap: 0; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); overflow: hidden; }
.study-path { display: grid; grid-template-columns: 38px minmax(0,1fr) 20px; gap: 4px 14px; border: 0; border-radius: 0; padding: 22px; flex: 1; align-content: center; }
.study-path + .study-path { border-top: 1px solid var(--line); }
.study-path:hover { background: var(--surface-2); box-shadow: none; }
.study-path-icon { grid-column: 1; grid-row: 1/3; background: var(--surface-2); align-self: center; }
.study-path strong { grid-column: 2; font-size: 16px; }
.study-path-copy { grid-column: 2; font-size: 13px; line-height: 1.5; }
.study-path-link { grid-column: 3; grid-row: 1/3; align-self: center; font-size: 0; margin: 0; }
.study-path-link svg { width: 18px; height: 18px; }
.home-more { border: 1px solid var(--line); border-radius: 12px; background: var(--surface); padding: 0 20px; }
.home-more > summary { padding: 18px 0; font-size: 14px; min-height: 52px; }

.adaptive-welcome { max-width: none; padding: 36px; }
.adaptive-welcome-icon { display: none; }
.adaptive-welcome h2 { margin-top: 14px; font-size: 28px; max-width: 25ch; line-height: 1.3; }
.adaptive-welcome p { max-width: 62ch; margin-block: 14px 26px; }
.adaptive-simple-actions { border-top: 1px solid var(--line); padding-top: 20px; gap: 10px; }
.adaptive-simple-actions [data-hint] { margin-right: auto; border-color: transparent; }
.adaptive-simple-actions [data-adaptive-submit]:disabled { border-color: var(--line); }
.adaptive-question-panel .question-meta .tag:not(.tei-badge) { padding: 0; background: transparent; }
.adaptive-question-panel .question-meta .tag:not(.tei-badge) + .tag:not(.tei-badge)::before { content: "·"; margin-right: 8px; color: var(--muted); }
.practice-coach > summary { min-height: 52px; }

/* Study controls: task first, display preferences on request. */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.button, .icon-button, .collection-button, summary, .choice { touch-action: manipulation; }
:where(button, a, input, select, textarea, summary):focus-visible { outline: 3px solid var(--blue); outline-offset: 4px; }
.question-panel :where(button, input, select, textarea, summary) { scroll-margin-block: 100px 24px; }
:is(#practice-view, #adaptive-view) .question-panel .question-meta { gap: 8px 12px; padding-bottom: 18px; border-bottom: 1px solid var(--line); margin-bottom: 24px; }
.question-panel .question-meta .tag:not(.tei-badge):not(.bookmark-tag) { background: transparent; border: 0; padding: 0; color: var(--muted); font-size: 12px; }
.question-context { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; flex: 1; min-width: 0; }
.question-panel .question-meta .attempt-tag { margin-left: auto; }
#practice-view .question-meta .bookmark-tag:nth-child(n) { border-color: var(--line); min-height: 44px; background: transparent; }
/* One answer component across practice, adaptive, and timed tests. Keep geometry
   identical when selecting so long answers do not rewrap or move the page. */
:is(#practice-view, #adaptive-view, #tests-view) .choice-list { gap: 10px; }
:is(#practice-view, #adaptive-view, #tests-view) .choice:nth-child(n) { display: grid; grid-template-columns: 32px minmax(0,1fr); min-height: 64px; padding: 15px 18px; gap: 4px 14px; align-items: center; border: 1px solid var(--control-line, var(--line)); border-radius: 10px; background: var(--surface); box-shadow: none; transform: none; }
:is(#practice-view, #adaptive-view, #tests-view) .choice:nth-child(n):hover:not(:disabled) { border-color: var(--blue); background: var(--surface-2); }
:is(#practice-view, #adaptive-view, #tests-view) .choice:nth-child(n).selected { border-color: var(--blue); background: var(--blue-soft); box-shadow: inset 0 0 0 1px var(--blue); }
:is(#practice-view, #adaptive-view, #tests-view) .choice .choice-label { display: grid; place-items: center; grid-column: 1; grid-row: 1; width: 32px; height: 32px; margin: 0; padding: 0; border: 1px solid var(--muted); border-radius: 50%; color: var(--ink); background: transparent; font: 650 13px/1 var(--sans); text-align: center; letter-spacing: 0; }
:is(#practice-view, #adaptive-view, #tests-view) .choice.selected .choice-label { color: #fff; background: var(--blue); border-color: var(--blue); }
body.theme-dark :is(#practice-view, #adaptive-view, #tests-view) .choice.selected:not(.correct):not(.incorrect) .choice-label { color: #14243a; }
:is(#practice-view, #adaptive-view, #tests-view) .choice .choice-value { grid-column: 2; min-width: 0; font-size: max(16px, calc(var(--question-size) - 5px)); line-height: 1.6; overflow-wrap: anywhere; }
:is(#practice-view, #adaptive-view, #tests-view) .choice .choice-result { grid-column: 2; min-width: 0; margin: 0; text-align: left; font: 600 12px/1.4 var(--sans); }
:is(#practice-view, #adaptive-view, #tests-view) .choice:nth-child(n).correct { border-color: var(--green); background: var(--green-soft); box-shadow: inset 0 0 0 1px var(--green); }
:is(#practice-view, #adaptive-view, #tests-view) .choice.correct .choice-label { color: var(--green); background: var(--surface); border-color: var(--green); }
:is(#practice-view, #adaptive-view, #tests-view) .choice:nth-child(n).incorrect { opacity: 1; border-color: var(--coral); background: var(--coral-soft); box-shadow: none; }
:is(#practice-view, #adaptive-view, #tests-view) .choice.incorrect .choice-label { color: var(--coral); background: var(--surface); border-color: var(--coral); }
:is(#practice-view, #adaptive-view, #tests-view) .choice.eliminated::after { display: none; }
:is(#practice-view, #adaptive-view, #tests-view) .choice.eliminated .choice-value { text-decoration: line-through; text-decoration-thickness: 1px; }
:is(#practice-view, #adaptive-view) .question-stem { max-width: 72ch; }
:is(#practice-view, #adaptive-view) .tei-multi-option { min-width: 0; overflow-wrap: anywhere; transform: none; }
:is(#practice-view, #adaptive-view) .tei-multi-option::before { display: grid; place-items: center; line-height: 1; }
.question-feedback { display: flex; align-items: center; gap: 10px; min-height: 64px; padding: 14px 0; margin-top: 10px; color: var(--muted); font-size: 14px; line-height: 1.5; }
.question-feedback > svg { flex: 0 0 18px; width: 18px; height: 18px; }
.question-feedback.correct { color: var(--green); font-weight: 600; }
.question-feedback.retry, .question-feedback.review { color: var(--ink); }
#practice-view .question-actions, #adaptive-view .question-actions { border-top: 1px solid var(--line); padding-top: 18px; margin-top: 0; }
.question-actions .button { min-height: 46px; }
.practice-reading-bar { align-items: start; }
.reading-options { margin-left: auto; font-size: 13px; }
.reading-options > summary { display: flex; align-items: center; gap: 8px; list-style: none; cursor: pointer; min-height: 44px; color: var(--muted); }
.reading-options > summary::-webkit-details-marker { display: none; }
.reading-options > summary svg { width: 16px; height: 16px; }
.reading-options[open] > summary { color: var(--ink); }
.reading-options-body { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; padding: 16px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); margin-block: 6px 10px; }
.practice-reading-bar .question-position { padding-block: 13px; }
.practice-coach > summary { color: var(--ink); font-size: 14px; }
.practice-coach > summary span { color: var(--muted); font-size: 12px; font-weight: 400; }
.practice-coach .coach-actions [data-hint] { display: none; }
.diagnostic-next { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 24px 0; margin-top: 12px; }
.diagnostic-next h2 { margin: 0 0 6px; font-size: 16px; }
.diagnostic-next p { margin: 0; color: var(--muted); font-size: 14px; }
.diagnostic-next .button { flex-shrink: 0; white-space: nowrap; }
.test-library-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 24px; font-size: 13px; }
.test-library-bar .collection-button { min-height: 44px; display: flex; align-items: center; gap: 8px; }
.test-library-bar .collection-button > span { font-size: 11px; border-radius: 20px; padding: 2px 6px; background: var(--surface-2); color: var(--muted); }
.test-card-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 18px; }
.test-card { display: flex; flex-direction: column; align-items: start; padding: 24px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); }
.test-card.in-progress { border-color: var(--blue); }
.test-card-heading { display: flex; align-items: center; gap: 16px; margin-bottom: 22px; }
.test-card .test-letter { width: 44px; height: 44px; border-radius: 10px; background: var(--surface-2); color: var(--blue); font: 600 18px var(--sans); box-shadow: none; }
.test-card h2 { margin: 0 0 4px; font-size: 19px; }
.test-card-heading p { margin: 0; font-size: 13px; color: var(--muted); }
.test-card-status { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--muted); margin-bottom: 20px; }
.test-card-status svg { width: 16px; height: 16px; }
.test-card-status.completed { color: var(--ink); }
.test-card .button { margin-top: auto; width: 100%; justify-content: space-between; min-height: 46px; }
.test-progress { display: block; width: 100%; height: 4px; border: 0; border-radius: 4px; background: var(--surface-2); color: var(--blue); margin: -6px 0 20px; }
.test-progress::-webkit-progress-bar { background: var(--surface-2); border-radius: 4px; }
.test-progress::-webkit-progress-value { background: var(--blue); border-radius: 4px; }
.test-progress::-moz-progress-bar { background: var(--blue); border-radius: 4px; }
.mistake-summary { background: transparent; box-shadow: none; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; padding: 0 0 20px; margin-bottom: 24px; }
#review-view .mistake-summary { grid-template-columns: repeat(3, minmax(0,1fr)); gap: 20px; }
#review-view .mistake-summary > div { background: transparent; border: 0; border-radius: 0; padding: 0; box-shadow: none; }
#review-view .mistake-summary small { font-size: 12px; text-transform: none; letter-spacing: 0; }
.mistake-summary strong { color: var(--ink); }
.review-heading > div { width: 100%; }
.review-title-row { display: flex; align-items: start; justify-content: space-between; flex-wrap: wrap; gap: 8px 18px; }
.review-options > summary { display: flex; gap: 8px; align-items: center; min-height: 44px; cursor: pointer; font-size: 13px; color: var(--muted); list-style: none; }
.review-options > summary::-webkit-details-marker { display: none; }
.review-options > summary svg { width: 16px; height: 16px; }
.review-options .button { margin-block: 8px; }
.mistake-topic-card[class] { border: 1px solid var(--line); border-radius: 14px; box-shadow: none; background: var(--surface); }
.mistake-topic-card > header { padding: 20px; background: transparent; }
.mistake-topic-card > header strong { font-size: 18px; }
.mistake-topic-card[class] .mistake-count-pill { background: var(--surface-2); color: var(--muted); }
#review-view .mistake-item-list { padding: 0; gap: 0; }
#review-view .mistake-item { align-items: start; padding: 20px; gap: 12px; margin: 0; border: 0; border-top: 1px solid var(--line); border-radius: 0; background: transparent; box-shadow: none; }
#review-view .mistake-item.due { background: transparent; border-left: 3px solid var(--blue); padding-left: 17px; }
.mistake-item-copy { min-width: 0; flex: 1; }
.mistake-item-copy strong { font-size: 14px; line-height: 1.5; }
.mistake-item-copy small { margin-top: 4px; color: var(--muted); font-size: 12px; line-height: 1.5; }
.mistake-preview { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; margin: 12px 0 0; font-size: 14px; line-height: 1.7; color: var(--muted); }
.mistake-preview mjx-container { font-size: 100% !important; }
.mistake-more > summary { min-height: 48px; padding: 15px 20px; color: var(--blue); cursor: pointer; border-top: 1px solid var(--line); font-size: 13px; font-weight: 600; }
.mistake-item .button { min-height: 44px; flex-shrink: 0; }

.public-hero { border-radius: 0 0 22px 22px; }
.public-nav .text-button { color: #e4eeff; text-decoration: none; }
.public-nav .text-button:hover { color: #fff; text-decoration: underline; text-underline-offset: 4px; }
.public-intro h1 { max-width: 15ch; font-size: clamp(34px, 4.4vw, 54px); line-height: 1.1; }
.public-intro > p { max-width: 52ch; font-size: 17px; line-height: 1.7; }
.public-section { padding-block: 36px; }
.public-section .section-heading h2 { font-size: clamp(25px, 3vw, 32px); max-width: 32ch; }
.studio-plan { border-radius: 14px; box-shadow: none; }
.plan-footer { min-height: 126px; margin-top: auto; }
.plan-footer .button { margin-top: 0; }
.plan-footer .plan-fine-print { margin: 12px 0 0; }
.plan-footer .plan-next-price { margin: 8px 0 0; }
.sample-report-details, .book-sample-details { border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.sample-report-details > summary, .book-sample-details > summary { padding: 18px 22px; min-height: 52px; cursor: pointer; color: var(--ink); font-weight: 600; font-size: 15px; }
.sample-report-details > summary svg { width: 18px; height: 18px; vertical-align: middle; float: right; }
.sample-report-details[open] > summary, .book-sample-details[open] > summary { border-bottom: 1px solid var(--line); }
.sample-report-details .readiness-report { border: 0; box-shadow: none; margin: 0; }
.book-sample-details .book-preview-gallery { padding: 20px; }
.steps-grid { grid-template-columns: repeat(3, minmax(0,1fr)); }
.step-card { box-shadow: none; border-radius: 12px; }
.feature-proof-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
.feature-proof-card { padding: 22px; }

@media (min-width: 1101px) {
  body:not(.public-landing-mode):not(.practice-focus-mode) .app-shell { grid-template-columns: 244px minmax(0,1fr); }
  .sidebar .brand strong { font-size: 16px; }
  .topbar { padding-inline: 28px; gap: 20px; }
}
@media (max-width: 900px) {
  .dashboard-study-grid { grid-template-columns: minmax(0,1fr); gap: 16px; }
  .next-best { padding: 24px; }
  .study-path { padding: 18px 22px; }
  .public-nav-actions { gap: 4px; }
}
@media (max-width: 600px) {
  #command-palette-button { display: none; }
  .question-panel input, .question-panel select, .reading-options .select { font-size: 16px !important; }
  :is(#practice-view, #adaptive-view) .question-panel .question-meta { margin-bottom: 20px; padding-bottom: 14px; }
  #practice-view .question-meta { display: grid; grid-template-columns: minmax(0,1fr) 44px; gap: 10px 12px; }
  #practice-view .question-context { grid-column: 1; grid-row: 1; }
  #practice-view .question-meta .attempt-tag:nth-child(n) { margin-left: 0; grid-column: 1; grid-row: 2; }
  #practice-view .question-meta .bookmark-tag:nth-child(n) { grid-column: 2; grid-row: 1/3; align-self: start; padding: 0; width: 44px; justify-content: center; }
  :is(#practice-view, #adaptive-view, #tests-view) .choice:nth-child(n) { padding: 13px 12px; min-height: 62px; gap: 4px 12px; }
  #adaptive-view .adaptive-simple-actions { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 10px; }
  #adaptive-view .adaptive-simple-actions [data-hint] { grid-column: 1/-1; justify-self: start; margin: 0; padding-left: 0; }
  #adaptive-view .adaptive-simple-actions [data-adaptive-submit], #adaptive-view .adaptive-simple-actions [data-adaptive-next] { justify-content: center; padding-inline: 8px; }
  #adaptive-view .adaptive-simple-actions > button[data-adaptive-submit] { grid-column: 1; grid-row: 2; width: 100%; min-width: 0; }
  #adaptive-view .adaptive-simple-actions > button[data-adaptive-next] { grid-column: 2; grid-row: 2; width: 100%; min-width: 0; }
  .question-feedback { font-size: 13px; min-height: 72px; }
  #practice-view .question-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 10px; }
  #practice-view .question-actions > [data-prev] { grid-column: 1; grid-row: 1; justify-self: start; min-height: 44px; border: 0; padding-left: 0; }
  #practice-view .question-actions > .action-cluster { display: contents; }
  #practice-view .question-actions [data-hint] { grid-column: 2; grid-row: 1; border: 0; justify-self: end; padding-right: 0; }
  #practice-view .question-actions [data-submit], #practice-view .question-actions [data-next] { grid-row: 2; justify-content: center; padding-inline: 10px; }
  .practice-reading-bar .question-position { flex-basis: auto; font-size: 12px; }
  #practice-view .question-meta .tag.attempt-tag:nth-child(n)::before { content: none; }
  .reading-options > summary { font-size: 12px; }
  .reading-options[open] { width: 100%; }
  .reading-options-body { gap: 12px; }
  .reading-options-body label { width: 100%; }
  .reading-options-body .select { flex: 1; min-height: 44px; }
  .practice-coach > summary span { display: none; }
  .diagnostic-next { align-items: start; flex-direction: column; gap: 16px; }
  .test-library-bar > .muted { display: none; }
  .test-library-bar .practice-collections { width: 100%; display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); }
  .test-library-bar .collection-button { padding: 10px 6px; font-size: 12px; justify-content: center; gap: 4px; }
  .test-card-grid { grid-template-columns: minmax(0,1fr); gap: 14px; }
  .test-card { padding: 20px; }
  #review-view .mistake-item { flex-wrap: wrap; }
  .mistake-item-copy { flex-basis: 100%; }
  .mistake-item .button { margin-left: auto; }
  .view:not(#practice-view) { padding: 24px 16px; }
  .home-quiet-head { gap: 16px; margin-bottom: 0; }
  .home-quiet-actions { width: 100%; }
  .home-quiet-actions .button { width: 100%; justify-content: center; }
  .home-strip-stats { gap: 12px; }
  .home-strip-stats small { font-size: 11px; line-height: 1.4; }
  .home-strip-stats strong { font-size: 26px; }
  .next-best > strong { font-size: 24px; }
  .next-best .next-best-actions { flex-direction: column; align-items: stretch; }
  .next-best .next-best-actions .button { justify-content: center; }
  .next-best .next-best-actions .text-button { text-align: center; }
  .adaptive-welcome { padding: 24px; }
  .adaptive-welcome h2 { font-size: 25px; }
  .adaptive-welcome .button { width: 100%; justify-content: center; }
  .adaptive-simple-actions { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); }
  .adaptive-simple-actions [data-hint] { grid-column: 1/-1; margin: 0; justify-self: start; }
  .adaptive-simple-actions .button { justify-content: center; }
  .public-intro h1 { font-size: 36px; }
  .public-intro > p { font-size: 16px; }
  .public-section { padding-block: 28px; }
  .plan-footer { min-height: 0; }
  .steps-grid, .feature-proof-grid { grid-template-columns: minmax(0,1fr); }
  .sample-report-details > summary, .book-sample-details > summary { padding: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .auth-progress-overlay .boot-progress-ring { animation: none; }
  .boot-splash { transition: none; }
}

.mobile-study-nav { display: none; }
.active-practice-filters .filter-chip { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; max-width: 100%; padding: 8px 12px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); color: var(--ink); font: 500 12px/1.4 var(--sans); cursor: pointer; }
.active-practice-filters .filter-chip > span { background: transparent; padding: 0; border: 0; white-space: normal; overflow-wrap: anywhere; }
.active-practice-filters .filter-chip svg { width: 15px; height: 15px; flex-shrink: 0; color: var(--muted); }
.active-practice-filters .filter-chip:hover { border-color: var(--blue); }
.review-library-bar { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 24px; }
.review-library-bar .collection-button { min-height: 44px; gap: 8px; }
.review-library-bar .collection-button > span { font-size: 12px; color: var(--muted); }
.review-clear-today { border: 1px solid var(--line); border-radius: 14px; padding: 28px; background: var(--surface); }
.review-clear-today h2 { font-size: 22px; margin: 0 0 12px; }
.review-clear-today p { line-height: 1.65; max-width: 55ch; margin-bottom: 20px; }
.review-context-bar { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px 20px; border: 1px solid var(--line); border-radius: 10px; padding: 10px 16px; background: var(--surface); margin: 0 0 20px; }
.review-context-bar > span { display: flex; gap: 8px; align-items: center; font-size: 13px; color: var(--muted); }
.review-context-bar .text-button { font-size: 13px; min-height: 44px; display: flex; align-items: center; gap: 8px; }
.review-context-bar svg { width: 16px; height: 16px; }
@media (max-width: 768px) {
  body.has-mobile-study-nav #main-content { padding-bottom: calc(76px + env(safe-area-inset-bottom, 0px)); }
  .mobile-study-nav:not([hidden]) { display: flex; position: fixed; inset: auto 0 0; z-index: 60; border-top: 1px solid var(--line); background: var(--surface); padding: 6px 8px calc(6px + env(safe-area-inset-bottom, 0px)); }
  .mobile-study-nav > button { flex: 1; min-width: 0; min-height: 54px; padding: 6px 2px; border: 0; border-radius: 8px; background: transparent; color: var(--muted); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; font: 600 11px/1.2 var(--sans); cursor: pointer; touch-action: manipulation; }
  .mobile-study-nav > button svg { width: 20px; height: 20px; stroke-width: 1.8; }
  .mobile-study-nav > button[aria-current="page"] { color: var(--blue); background: var(--surface-2); }
  .mobile-study-nav > button:focus-visible { outline: 2px solid var(--blue); outline-offset: -2px; }
  body.mobile-keyboard-open .mobile-study-nav, body.sidebar-open .mobile-study-nav, body.modal-open .mobile-study-nav { display: none; }
  body.has-mobile-study-nav #toast { bottom: calc(86px + env(safe-area-inset-bottom, 0px)); }
  .review-heading { align-items: stretch; }
  .review-heading > .button { justify-content: center; }
  .review-context-bar { gap: 4px; padding: 8px 12px; }
  .review-clear-today { padding: 20px; }
}

/* Calendar planning is a quiet, separate workspace, with no third-party embeds. */
.planner-layout { display: grid; grid-template-columns: minmax(280px,.85fr) minmax(0,1.15fr); gap: 24px; align-items: start; }
.planner-card { border: 1px solid var(--line); background: var(--surface); border-radius: 16px; padding: 28px; min-width: 0; }
.planner-card h2 { font: 700 21px/1.3 var(--sans); margin: 0 0 12px; letter-spacing: -.025em; }
.planner-card p { font-size: 14px; line-height: 1.65; }
.planner-form { display: grid; gap: 20px; margin-top: 24px; }
.planner-form label { display: grid; gap: 8px; font-size: 13px; font-weight: 600; min-width: 0; }
.planner-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
.planner-form .text-input, .planner-form .select { width: 100%; min-width: 0; min-height: 48px; padding: 10px 12px; font: 400 16px/1.4 var(--sans); color: var(--ink); background: var(--surface); border: 1px solid var(--line); border-radius: 10px; }
.planner-days { border: 0; padding: 0; margin: 0; min-width: 0; }
.planner-days legend { font-size: 13px; font-weight: 600; padding: 0; margin-bottom: 10px; }
.planner-days > div { display: flex; gap: 6px; flex-wrap: wrap; }
.planner-days label { position: relative; cursor: pointer; }
.planner-days input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.planner-days span { display: grid; place-items: center; min-height: 44px; min-width: 44px; padding: 7px; border: 1px solid var(--line); border-radius: 8px; color: var(--muted); background: var(--surface); }
.planner-days input:checked + span { color: var(--blue); border-color: var(--blue); background: var(--surface-2); box-shadow: inset 0 0 0 1px var(--blue); }
.planner-days input:focus-visible + span { outline: 2px solid var(--blue); outline-offset: 3px; }
.planner-options { border-top: 1px solid var(--line); padding-top: 16px; }
.planner-options summary, .planner-import summary { cursor: pointer; font-size: 13px; font-weight: 600; min-height: 44px; padding-block: 10px; }
.planner-options label { margin-top: 12px; }
.planner-options small { color: var(--muted); font-weight: 400; }
.planner-form .planner-check { display: flex; flex-direction: row; align-items: center; min-height: 44px; gap: 10px; }
.planner-check input { width: 18px; height: 18px; accent-color: var(--blue); }
.planner-timezone, .planner-local { font-size: 12px !important; line-height: 1.6; color: var(--muted); margin: 0; }
.planner-status { font-size: 13px; color: var(--ink); margin: 0; }
.planner-status:empty { display: none; }
.planner-preview-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px; justify-content: space-between; }
.planner-preview-head > span { color: var(--muted); font-size: 12px; }
.planner-sessions { list-style: none; margin: 20px 0; padding: 0; max-height: 480px; overflow-y: auto; scrollbar-gutter: stable; }
.planner-sessions li { display: flex; align-items: center; gap: 14px; padding: 17px 0; border-top: 1px solid var(--line); }
.planner-sessions li > div { display: grid; gap: 5px; min-width: 0; }
.planner-sessions strong { font-size: 14px; line-height: 1.4; }
.planner-sessions time { color: var(--muted); font-size: 12px; line-height: 1.5; }
.planner-sessions .text-button { margin-left: auto; min-height: 44px; padding: 8px; font-size: 13px; flex-shrink: 0; }
.planner-session-symbol { color: var(--blue); width: 20px; flex-shrink: 0; }
.planner-session-symbol svg { width: 18px; height: 18px; }
.planner-export { display: flex; gap: 10px; flex-wrap: wrap; margin: 20px 0 14px; }
.planner-export .button { min-height: 48px; font-size: 13px; }
.planner-import { margin-top: 20px; border-top: 1px solid var(--line); padding-top: 10px; }
.planner-import p { font-size: 13px; }
.planner-empty { padding: 28px 4px; }
.planner-empty > strong { font-size: 20px; display: block; margin-block: 16px 8px; }
.planner-empty-icon { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 12px; color: var(--blue); background: var(--surface-2); }
.planner-recipe-list { display: grid; gap: 12px; color: var(--muted); font-size: 13px; margin-top: 24px; }
.planner-recipe-list span::before { content: "—"; margin-right: 12px; color: var(--blue); }
.planner-share { margin-top: 24px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.planner-share > summary { display: flex; justify-content: space-between; gap: 12px; cursor: pointer; padding: 20px 24px; min-height: 64px; }
.planner-share > summary > span { display: flex; gap: 12px; align-items: center; font-size: 14px; font-weight: 600; }
.planner-share > summary small { color: var(--muted); font-size: 12px; }
.planner-share > summary svg { width: 18px; height: 18px; color: var(--blue); }
.planner-share > div { padding: 0 24px 24px; }
.planner-share p { font-size: 14px; line-height: 1.7; }
.planner-share .parent-snapshot { max-height: 340px; white-space: pre-wrap; overflow: auto; overflow-wrap: anywhere; }
.planner-share .planner-status { margin-top: 14px; }
.planned-next { display: flex; align-items: center; gap: 20px; justify-content: space-between; padding: 16px 20px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); margin: 16px 0 24px; }
.planned-next > div { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px 16px; }
.planned-next small { color: var(--muted); font-size: 12px; }
.planned-next strong { font-size: 14px; }
.planned-next span { color: var(--muted); font-size: 12px; }
.planned-next .text-button { flex-shrink: 0; min-height: 44px; font-size: 13px; }
.dashboard-plan-link { margin-top: 20px; }
.dashboard-plan-link .text-button { min-height: 44px; display: flex; gap: 8px; font-size: 13px; }
@media (max-width: 1000px) { .planner-layout { grid-template-columns: minmax(0,1fr); } }
@media (max-width: 600px) {
  .planner-layout { gap: 16px; }
  .planner-card { padding: 20px; border-radius: 12px; }
  .planner-fields { gap: 10px; }
  .planner-days > div { gap: 6px; }
  .planner-days span { min-width: 44px; }
  .planner-form > .button, .planner-export .button { width: 100%; justify-content: center; }
  .planner-sessions { max-height: none; overflow: visible; }
  .planner-sessions li { gap: 10px; }
  .planner-share > summary { padding: 18px; }
  .planner-share > summary small { display: none; }
  .planner-share > div { padding: 0 18px 18px; }
  .planned-next { padding: 12px 16px; gap: 12px; }
  .planned-next > div { display: grid; gap: 6px; }
}

/* Requested help stays one click away; completed questions have an active
   solution action instead of a disabled check button. */
.adaptive-simple-actions [data-view-hints] { margin-right: auto; border-color: transparent; }
.question-help-actions { align-items: center; justify-content: space-between; gap: 12px; }
.practice-coach .question-help-actions [data-hint] { display: inline-flex; }
.question-help-actions [data-return-answer] { margin-left: auto; min-height: 44px; }
.practice-coach .requested-hints li, .practice-coach [data-worked-solution], .question-stem { scroll-margin-block: 100px 90px; }
.practice-coach .requested-hints p, .practice-coach .solution-steps { max-width: 68ch; }
.question-feedback { min-height: 54px; }
@media (max-width: 600px) {
  .question-feedback { min-height: 58px; }
  #adaptive-view .adaptive-simple-actions [data-view-hints] { grid-column: 1/-1; grid-row: 1; justify-self: start; margin: 0; padding-left: 0; }
  #adaptive-view .adaptive-simple-actions > [data-full-explanation] { grid-column: 1; grid-row: 1; width: 100%; min-width: 0; justify-content: center; padding-inline: 8px; }
  #adaptive-view .adaptive-simple-actions.is-complete > [data-adaptive-next] { grid-row: 1; }
  #practice-view .question-actions [data-view-hints] { grid-column: 2; grid-row: 1; border: 0; justify-self: end; padding-right: 0; }
  #practice-view .question-actions [data-full-explanation] { grid-column: 1; grid-row: 2; min-width: 0; justify-content: center; padding-inline: 8px; }
  #practice-view .question-actions [data-submit] { min-width: 0; }
  .question-help-actions .button, .question-help-actions .text-button { padding-inline: 10px; font-size: 13px; }
}

/* Personal notebook: secondary tools live outside the question workspace. */
#notebook-view { max-width: 1040px; }
.notebook-tabs { display: flex; flex-wrap: wrap; gap: 8px; border-bottom: 1px solid var(--line); padding-bottom: 16px; }
.notebook-tabs .collection-button { min-height: 46px; }
.notebook-tabs [aria-pressed="true"] { color: var(--blue); background: var(--blue-soft); border-color: var(--blue); }
.notebook-storage { color: var(--muted); font-size: 12px; line-height: 1.6; margin: 16px 0 0; max-width: 78ch; }
.notebook-status { font-size: 13px; color: var(--ink); min-height: 24px; margin-block: 8px 16px; }
.notebook-toolbar { display: flex; flex-wrap: wrap; align-items: end; gap: 16px; margin-bottom: 18px; }
.notebook-toolbar > label:first-child { display: grid; gap: 6px; font-size: 13px; font-weight: 600; }
.notebook-toolbar .select { min-width: 220px; }
.notebook-archive-toggle { display: flex; gap: 8px; align-items: center; min-height: 46px; font-size: 13px; }
.notebook-toolbar > button { margin-left: auto; }
.notebook-editor, .notebook-starters { background: var(--surface); border: 1px solid var(--line); border-radius: 12px; padding: 0 22px; margin-bottom: 18px; }
.notebook-editor > summary, .notebook-starters > summary { min-height: 54px; display: flex; gap: 10px; align-items: center; cursor: pointer; font-size: 14px; font-weight: 600; list-style: none; }
.notebook-editor > summary svg { width: 18px; height: 18px; }
.notebook-editor form { display: grid; gap: 16px; padding: 8px 0 22px; }
.notebook-editor label { display: grid; gap: 8px; font-size: 13px; font-weight: 600; }
.notebook-editor .text-input, .notebook-editor .select, .notebook-app textarea { width: 100%; min-width: 0; font-size: 16px; }
.notebook-editor textarea { resize: vertical; line-height: 1.7; }
.notebook-editor small { color: var(--muted); font-size: 12px; }
.notebook-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.notebook-starters p { color: var(--muted); font-size: 13px; line-height: 1.6; }
.notebook-starters > div { display: flex; flex-wrap: wrap; gap: 8px; padding: 0 0 20px; }
.notebook-items { display: grid; gap: 16px; }
.notebook-item, .notebook-app, .notebook-empty, .notebook-draft-notice { background: var(--surface); border: 1px solid var(--line); border-radius: 12px; padding: 24px; min-width: 0; }
.notebook-item-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 8px; margin-bottom: 14px; }
.notebook-item-head > span { font-size: 12px; color: var(--muted); }
.notebook-item-head > div { display: flex; gap: 14px; }
.notebook-item .text-button { min-height: 44px; font-size: 13px; }
.notebook-item h2, .notebook-app h2, .notebook-empty h2 { font-size: 19px; line-height: 1.5; margin: 0 0 12px; letter-spacing: -.015em; overflow-wrap: anywhere; }
.notebook-note-body, .notebook-recall-back { font-size: 16px; line-height: 1.8; white-space: pre-wrap; overflow-wrap: anywhere; max-width: 72ch; }
.notebook-answer { border-top: 1px solid var(--line); padding-top: 8px; margin-top: 18px; }
.notebook-answer > summary { cursor: pointer; min-height: 44px; padding-block: 10px; font-size: 14px; color: var(--blue); }
.notebook-answer > div { font-size: 16px; line-height: 1.8; padding: 14px 0 4px; white-space: pre-wrap; overflow-wrap: anywhere; }
.notebook-empty p, .notebook-draft-notice p { color: var(--muted); line-height: 1.7; max-width: 62ch; margin-bottom: 0; }
.notebook-draft-notice { margin-bottom: 18px; display: flex; align-items: center; flex-wrap: wrap; gap: 18px; }
.notebook-draft-notice p { margin: 0; }
.notebook-app-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; }
.notebook-app-symbol { display: grid; place-items: center; width: 40px; height: 40px; color: var(--blue); background: var(--blue-soft); border-radius: 10px; margin-bottom: 18px; }
.notebook-app-symbol svg { width: 20px; height: 20px; }
.notebook-app p { font-size: 14px; line-height: 1.7; color: var(--muted); }
.notebook-app details { border-top: 1px solid var(--line); margin-top: 20px; padding-top: 8px; }
.notebook-app summary { min-height: 44px; padding-block: 12px; font-size: 13px; cursor: pointer; }
.notebook-app details a { color: var(--blue); }
.notebook-app-note { font-size: 12px !important; margin-top: 20px; }
#quizlet-preview, #notebook-import-preview { padding-top: 16px; }
#quizlet-preview label { display: grid; gap: 10px; font-size: 13px; }
.notebook-session:not([hidden]) { border: 2px solid var(--blue); border-radius: 14px; background: var(--surface); padding: 28px; margin-top: 24px; scroll-margin-block: 96px; }
.notebook-session-head { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; justify-content: space-between; color: var(--muted); font-size: 13px; margin-bottom: 20px; }
.notebook-session h2 { font-size: 23px; line-height: 1.6; margin-bottom: 24px; overflow-wrap: anywhere; }
.notebook-session .notebook-recall-back { border-top: 1px solid var(--line); padding-top: 18px; margin-bottom: 24px; }
.question-help-actions { flex-wrap: wrap; }
.question-help-actions [data-notebook-takeaway] { min-height: 44px; font-size: 13px; }
@media (max-width: 700px) {
  .notebook-app-grid { grid-template-columns: minmax(0,1fr); }
  .notebook-tabs { gap: 6px; }
  .notebook-tabs .collection-button { flex: 1; justify-content: center; font-size: 12px; gap: 6px; padding-inline: 8px; }
  .notebook-tabs svg { width: 16px; height: 16px; }
  .notebook-item, .notebook-app, .notebook-empty { padding: 20px; }
  .notebook-editor, .notebook-starters { padding-inline: 18px; }
  .notebook-toolbar .select { min-width: 0; width: 100%; }
  .notebook-toolbar > label:first-child { flex: 1; }
  .notebook-toolbar > button { width: 100%; margin: 0; justify-content: center; }
  .notebook-session:not([hidden]) { padding: 20px; }
  .notebook-session h2 { font-size: 20px; }
}

.notebook-editor > summary::after, .notebook-starters > summary::after { content: "⌄"; margin-left: auto; font-size: 18px; color: var(--muted); }
.notebook-editor[open] > summary::after, .notebook-starters[open] > summary::after { transform: rotate(180deg); }
