/* Study views share the existing palette and native device theme. */
[hidden] { display: none !important; }
button, input, select, textarea { font: inherit; }
button:disabled { opacity: .45; cursor: not-allowed; }
main { padding-top: 1.7rem; }
main:focus, h1:focus { outline: none; }
select, textarea { max-width: 100%; color: var(--ink); background: var(--surface); }
input { accent-color: var(--forest); }
textarea { width: 100%; padding: .9rem 1rem; border: 1px solid var(--line); border-radius: .7rem; resize: vertical; line-height: 1.6; }
textarea:focus-visible, select:focus-visible, input:focus-visible, summary:focus-visible, .nav-item:focus-visible, .question-nav button:focus-visible, .confidence-button:focus-visible, .text-link:focus-visible, .history-open:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
textarea[readonly] { background: var(--surface-soft); }
summary { cursor: pointer; font-weight: 750; }
.muted, .field-hint { color: var(--muted); }
.field-hint { font-size: .8rem; line-height: 1.6; }
.study-nav { display: flex; width: fit-content; max-width: 100%; padding: .3rem; gap: .3rem; border: 1px solid var(--line); border-radius: .8rem; background: var(--surface-soft); }
.nav-item { padding: .7rem 1.35rem; border: 0; border-radius: .55rem; background: transparent; color: var(--muted); cursor: pointer; font-size: .88rem; font-weight: 750; }
.nav-item.active { background: var(--forest); color: white; }
.study-hero { padding: 2.35rem 0 1.5rem; }
.study-hero h1 { max-width: 100%; font-size: clamp(2rem, 4vw, 3.4rem); line-height: 1.07; letter-spacing: -.045em; }
.study-hero .hero-copy { margin-top: .85rem; max-width: 750px; font-size: 1.02rem; }
.bank-label { display: inline-block; margin: -.1rem 0 1.8rem; color: var(--muted); font-size: .79rem; }
.setup-layout { display: grid; grid-template-columns: minmax(0, 2.05fr) minmax(260px, 1fr); gap: 1.5rem; align-items: start; }
.panel { border: 1px solid var(--line); border-radius: 1.1rem; padding: 1.6rem; background: var(--surface); }
.panel h2, .next-step h2, .resume-card h2 { margin: 0; font-size: 1.35rem; line-height: 1.3; letter-spacing: -.025em; }
.panel > p.muted { font-size: .88rem; }
.focus-options { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; margin: 1.2rem 0 1.4rem; }
.focus-option { position: relative; display: flex; align-items: start; gap: .65rem; padding: .95rem .8rem; border: 1px solid var(--line); border-radius: .7rem; cursor: pointer; background: var(--surface); }
.focus-option:has(input:checked) { border-color: var(--forest); background: var(--surface-soft); box-shadow: inset 0 0 0 1px var(--forest); }
.focus-option input, .topic-chips input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.focus-option:has(input:focus-visible), .topic-chips label:has(input:focus-visible) { outline: 3px solid var(--focus); outline-offset: 3px; border-radius: .7rem; }
.focus-icon { font-size: 1.2rem; line-height: 1.2; color: var(--forest); }
.focus-option strong, .focus-option small { display: block; }
.focus-option strong { font-size: .86rem; }
.focus-option small { color: var(--muted); line-height: 1.4; margin-top: .22rem; font-size: .75rem; }
.topic-picker legend, .field, .reflection-box > label { font-size: .85rem; font-weight: 750; }
.topic-chips { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .65rem; }
.topic-chips label { position: relative; cursor: pointer; }
.topic-chips span { display: block; border: 1px solid var(--line); border-radius: .5rem; padding: .45rem .6rem; font-size: .74rem; color: var(--muted); }
.topic-chips input:checked + span { color: var(--ink); border-color: var(--forest); background: var(--surface-soft); }
.topic-chips input:checked + span::before { content: "✓ "; color: var(--forest); }
.settings-row { display: grid; grid-template-columns: minmax(0, .7fr) minmax(0, 1.3fr); gap: 1rem; margin-top: 1.45rem; }
.field { display: grid; gap: .45rem; }
.field select { min-height: 46px; width: 100%; padding: .55rem .6rem; border: 1px solid var(--line); border-radius: .6rem; font-size: .87rem; }
.setup-panel > .button { margin-top: .55rem; }
.next-step { position: relative; padding: 1.6rem; background: var(--lime-soft); border: 1px solid var(--line); border-radius: 1.1rem; }
.next-step .eyebrow { margin-top: 1.2rem; }
.next-step h2 { font-size: 1.6rem; }
.next-step p:not(.eyebrow) { font-size: .87rem; color: var(--muted); }
.step-icon { display: grid; place-items: center; height: 38px; width: 38px; border-radius: 50%; background: var(--forest); color: var(--lime); font-size: 1.5rem; }
.score-info { padding: 1.15rem 0; font-size: .83rem; color: var(--muted); line-height: 1.6; }
.score-info summary { color: var(--ink); }
.score-info code { display: block; white-space: normal; overflow-wrap: anywhere; padding: .8rem; border-radius: .5rem; background: var(--surface-soft); font-size: .79rem; }
.resume-card { display: flex; align-items: center; justify-content: space-between; gap: 1rem; border: 1px solid var(--forest); border-radius: .85rem; background: var(--surface-soft); padding: 1rem 1.25rem; margin-bottom: 1.5rem; }
.resume-card p { margin: .3rem 0 0; font-size: .85rem; color: var(--muted); }
.resume-card .eyebrow { margin: 0 0 .2rem; }
.completed-resume { font-size: .85rem; border-color: var(--line); }
.exam-outline { display: flex; flex-wrap: wrap; gap: .8rem 2rem; padding: 1.1rem 0; margin: 1rem 0; border-block: 1px solid var(--line); font-size: .82rem; }
.exam-outline b { font-size: 1.6rem; margin-right: .4rem; color: var(--forest); }
.notice { padding: .9rem 1rem; background: var(--lime-soft); border-left: 3px solid var(--forest); border-radius: .4rem; font-size: .88rem; }
.form-message { color: var(--wrong); font-size: .88rem; }
.session-top { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.5rem; }
.save-state { font-size: .75rem; color: var(--muted); }
.session-layout { display: grid; grid-template-columns: 210px minmax(0, 1fr); gap: 2rem; align-items: start; }
.session-sidebar { position: sticky; top: 100px; }
.session-sidebar h2 { margin: 0; font-size: 1.4rem; }
.confirmed-counter { color: var(--muted); font-size: .85rem; }
.question-nav { display: flex; flex-wrap: wrap; gap: .4rem; margin: 1rem 0; }
.question-nav button { position: relative; width: 40px; height: 40px; border: 1px solid var(--line); border-radius: .55rem; color: var(--ink); background: var(--surface); cursor: pointer; }
.question-nav button.current { border-color: var(--forest); background: var(--forest); color: white; }
.question-nav button.done::after { content: ""; position: absolute; width: 5px; height: 5px; background: var(--correct); bottom: 3px; left: calc(50% - 2.5px); border-radius: 50%; }
.question-nav button.current.done::after { background: var(--lime); }
.timer-box { display: grid; gap: .25rem; padding: 1rem 0; border-block: 1px solid var(--line); }
.timer-box span, .sidebar-note { color: var(--muted); font-size: .78rem; }
.timer-box strong { font-size: 1.6rem; font-variant-numeric: tabular-nums; line-height: 1.2; }
.timer-box .urgent { color: var(--wrong); }
.question-workspace { min-width: 0; }
.question-card { box-shadow: none; border-radius: 1rem; }
.question-heading { align-items: center; }
h1.question-topic { font-size: 1.45rem; letter-spacing: -.025em; line-height: 1.2; }
.pill { display: inline-block; flex-shrink: 0; background: var(--surface-soft); padding: .35rem .6rem; border-radius: .4rem; font-size: .7rem; color: var(--muted); }
.confidence-hint { color: var(--muted); font-size: .78rem; padding: 0 1.45rem 1rem; margin: -.4rem 0 0; }
.study-statement { border-bottom: 1px solid var(--line); }
.study-statement:last-child { border-bottom: 0; }
.study-statement .statement { border: 0; padding-bottom: .5rem; gap: .8rem; }
.statement-text { font-size: .94rem; }
.confidence-control { display: flex; flex-wrap: wrap; gap: .4rem; padding: 0 1.45rem .85rem 3.6rem; }
.confidence-button { min-height: 34px; padding: .3rem .65rem; background: transparent; border: 1px solid var(--line); color: var(--muted); border-radius: .45rem; font-size: .73rem; cursor: pointer; }
.confidence-button[aria-pressed="true"] { border-color: var(--forest); color: var(--ink); background: var(--surface-soft); font-weight: 750; }
.question-feedback { margin: 0 1.45rem 1rem; padding: .75rem; border-radius: .5rem; font-size: .85rem; }
.positive, .answer-right { background: var(--correct-bg); }
.negative, .answer-wrong { background: var(--wrong-bg); }
.answer-right .statement:hover, .answer-wrong .statement:hover { background: transparent; }
.answer-feedback { padding: 0 1.45rem 1rem 3.6rem; font-size: .84rem; }
.answer-verdict { font-weight: 800; }
.answer-wrong .answer-verdict { color: var(--wrong); }
.answer-right .answer-verdict { color: var(--correct); }
.confidence-tag { display: inline-block; margin-left: .7rem; color: var(--muted); font-size: .73rem; }
.answer-feedback p { margin: .5rem 0; }
.explanation { margin-top: .6rem; }
.explanation small { color: var(--muted); }
.reasoning-prompt { font-style: italic; color: var(--muted); }
.reflection-box, .open-question-body { padding: 1.25rem 1.45rem; }
.reflection-box { border-top: 1px solid var(--line); background: var(--surface-soft); }
.original-prompt { white-space: pre-line; margin-top: 0; }
.open-question-body textarea { margin-top: .5rem; }
.self-review { border-top: 1px solid var(--line); margin-top: 1.5rem; padding-top: 1.2rem; }
.self-review h2 { font-size: 1.1rem; }
.self-review label { display: flex; align-items: start; gap: .7rem; font-size: .9rem; margin: .85rem 0; }
.self-review input { margin-top: .3rem; flex-shrink: 0; }
.session-actions { position: sticky; bottom: .7rem; z-index: 3; display: flex; flex-wrap: wrap; justify-content: space-between; gap: .6rem; padding: .6rem; background: var(--surface); border: 1px solid var(--line); border-radius: .85rem; margin: 1rem 0; box-shadow: var(--shadow); }
.session-actions .button { font-size: .83rem; }
.session-bottom, .report-actions { display: flex; flex-wrap: wrap; gap: .7rem; justify-content: space-between; }
.session-bottom .button { font-size: .8rem; }
.report-summary { display: grid; grid-template-columns: 240px 1fr; border: 1px solid var(--line); border-radius: 1rem; overflow: hidden; background: var(--surface); }
.report-score { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 1.5rem; background: var(--forest); color: white; }
.report-score p { font-size: .8rem; margin: 0 0 .6rem; }
.report-score > strong { font-size: 4rem; line-height: 1.2; letter-spacing: -.05em; }
.report-score small { font-size: 1.5rem; margin-left: .3rem; color: var(--lime); letter-spacing: normal; }
.report-score span { font-size: .75rem; margin-top: .6rem; }
.report-metrics { display: grid; grid-template-columns: repeat(3, 1fr); padding: 1rem; gap: 1.5rem 1rem; }
.metric { display: flex; flex-direction: column; gap: .3rem; padding: .8rem; }
.metric > strong { font-size: 1.8rem; line-height: 1.2; letter-spacing: -.03em; }
.metric > span { font-size: .75rem; color: var(--muted); }
.report-actions { margin: 1.5rem 0; justify-content: start; }
.open-report { margin-top: 1.25rem; }
.text-link { display: block; background: none; border: 0; text-align: left; color: var(--ink); font-size: .9rem; padding: .6rem 0; text-decoration: underline; text-underline-offset: .2rem; cursor: pointer; }
.progress-metrics { display: grid; grid-template-columns: repeat(4, 1fr); gap: .8rem; }
.progress-metrics .metric { padding: 1.2rem; border: 1px solid var(--line); border-radius: .8rem; background: var(--surface); }
.section-title { display: flex; justify-content: space-between; gap: 1rem; align-items: center; }
.section-title > span { font-size: .77rem; }
.topic-progress { margin-top: 1.5rem; }
.topic-progress-row { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 1.4rem; align-items: center; padding: 1rem 0; border-bottom: 1px solid var(--line); }
.topic-progress-row:last-child { border-bottom: 0; padding-bottom: 0; }
.topic-progress-row h3 { font-size: .95rem; margin: 0; }
.topic-progress-row .muted { font-size: .76rem; }
progress { display: block; appearance: none; width: 100%; height: 5px; border: 0; border-radius: 5px; overflow: hidden; background: var(--surface-soft); color: var(--forest); margin-top: .55rem; }
progress::-webkit-progress-bar { background: var(--surface-soft); }
progress::-webkit-progress-value { background: var(--forest); }
progress::-moz-progress-bar { background: var(--forest); }
.due-chip { font-size: .75rem; color: var(--muted); }
.progress-detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; margin-top: 1.5rem; }
.recurring-error { padding: 1rem 0; border-bottom: 1px solid var(--line); font-size: .84rem; }
.recurring-error p { margin: .55rem 0 0; }
.history-row { display: flex; align-items: center; gap: .75rem; padding: 1rem 0; border-bottom: 1px solid var(--line); font-size: .85rem; }
.history-row > div { flex: 1; }
.history-row small { display: block; margin-top: .2rem; color: var(--muted); }
.history-row > span { font-weight: 800; white-space: nowrap; }
.history-open { border: 1px solid var(--line); border-radius: .4rem; min-width: 40px; min-height: 40px; background: var(--surface-soft); color: var(--ink); cursor: pointer; }
.storage-warning { padding: 1rem; margin: 1rem; border: 1px solid var(--wrong); color: var(--wrong); border-radius: .6rem; }
.sync-notice { width: min(1120px, calc(100% - 2rem)); margin: 1rem auto 0; padding: .8rem 1rem; border: 1px solid var(--line); border-radius: .6rem; background: var(--surface-soft); color: var(--ink); font-size: .85rem; }
dialog { width: min(480px, calc(100% - 2rem)); padding: 1.6rem; background: var(--surface); color: var(--ink); border: 1px solid var(--line); border-radius: 1rem; box-shadow: var(--shadow); }
dialog::backdrop { background: rgba(0, 0, 0, .5); }
dialog h2 { font-size: 1.4rem; line-height: 1.3; margin-top: 0; }
dialog p { color: var(--muted); }
.dialog-actions { display: flex; flex-wrap: wrap; gap: .7rem; justify-content: end; margin-top: 1.3rem; }
@media (max-width: 760px) {
  main { padding-top: 1.1rem; }
  .header-actions { flex-shrink: 0; }
  .study-nav { width: 100%; }
  .nav-item { flex: 1; padding-inline: .35rem; font-size: .79rem; }
  .study-hero { padding-top: 1.7rem; }
  .study-hero h1 { font-size: 2.25rem; }
  .study-hero .hero-copy { font-size: .94rem; }
  .setup-layout, .session-layout, .progress-detail-grid { grid-template-columns: minmax(0, 1fr); }
  .panel, .next-step { padding: 1.2rem; }
  .study-aside { display: grid; grid-template-columns: minmax(0, 1fr); }
  .focus-option { padding: .75rem .6rem; gap: .45rem; }
  .focus-icon { font-size: 1rem; }
  .focus-option strong { font-size: .8rem; }
  .focus-option small { font-size: .72rem; }
  .resume-card { align-items: start; flex-direction: column; }
  .session-top { flex-wrap: wrap; gap: .4rem; }
  .session-top .button { font-size: .8rem; }
  .session-sidebar { position: static; display: grid; grid-template-columns: 1fr auto; gap: .2rem .75rem; }
  .session-sidebar h2, .sidebar-note { display: none; }
  .session-sidebar > .eyebrow, .confirmed-counter { margin: 0; grid-column: 1; }
  .question-nav { grid-column: 1 / -1; margin: .6rem 0 0; }
  .timer-box { grid-column: 2; grid-row: 1 / 3; padding: 0; border: 0; text-align: right; }
  .timer-box strong { font-size: 1.3rem; }
  .session-layout { gap: 1rem; }
  .question-heading { flex-direction: column; align-items: start; gap: .55rem; }
  h1.question-topic { font-size: 1.3rem; }
  .confidence-control, .answer-feedback { padding-left: 3.15rem; padding-right: 1rem; }
  .confidence-hint, .open-question-body, .reflection-box { padding-left: 1rem; padding-right: 1rem; }
  .confidence-button { min-height: 38px; }
  .session-actions { bottom: max(.5rem, env(safe-area-inset-bottom)); gap: .35rem; padding: .4rem; }
  .session-actions .button { flex: 1; padding-inline: .4rem; font-size: .75rem; }
  .report-summary { grid-template-columns: 1fr; }
  .report-score { padding: 1.25rem; }
  .report-score > strong { font-size: 3.2rem; }
  .report-metrics { grid-template-columns: 1fr 1fr; gap: .5rem; }
  .progress-metrics { grid-template-columns: 1fr 1fr; gap: .55rem; }
  .progress-metrics .metric { padding: 1rem; }
  .metric > strong { font-size: 1.55rem; }
  .section-title { align-items: start; flex-direction: column; gap: .4rem; }
  .topic-progress-row { grid-template-columns: minmax(0,1fr) auto; gap: .7rem; }
  .topic-progress-row > div { grid-column: 1 / -1; }
  .topic-progress-row .button { font-size: .78rem; }
}
@media (max-width: 360px) {
  .settings-row { grid-template-columns: 1fr; }
  .focus-options { grid-template-columns: 1fr; }
}
@media (prefers-color-scheme: dark) {
  .button-quiet { color: var(--ink); }
  .eyebrow, .focus-icon, .exam-outline b, footer .credit a { color: var(--lime); }
}