:root {
  --study-ink: #233936;
  --study-muted: #5d6f63;
  --study-green: #206d5c;
  --study-paper: #fffefb;
  --study-soft: #f3f5ee;
  --study-line: #e0e5da;
  --study-radius: 22px;
}
.study-home, .study-panel { color: var(--study-ink); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft JhengHei", sans-serif; }
.study-home *, .study-panel * { box-sizing: border-box; }
.study-home button, .study-panel button, .study-home input, .study-panel input { font: inherit; }
.study-home-intro { margin: 22px 0 26px; }
.study-eyebrow { margin: 0 0 10px; color: var(--study-green); font-size: 11px; font-weight: 750; letter-spacing: .16em; }
.study-home-intro h1 { margin: 0 0 13px; font-size: clamp(25px, 3vw, 38px); letter-spacing: -.045em; line-height: 1.4; }
.study-muted { color: var(--study-muted); line-height: 1.75; font-size: 14px; }
.study-home p, .study-panel p { line-height: 1.7; }
.study-today-grid { display: grid; grid-template-columns: 1.35fr 1fr; gap: 20px; }
.study-daily-card { position: relative; overflow: hidden; min-height: 310px; padding: 28px 30px; border-radius: var(--study-radius); color: #fff; background: #2d6e5c; }
.study-daily-card::after { content: ""; position: absolute; width: 220px; height: 220px; border-radius: 50%; border: 1px solid #ffffff19; right: -74px; bottom: -83px; box-shadow: 0 0 0 35px #ffffff06, 0 0 0 70px #ffffff05; pointer-events: none; }
.study-card-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.study-tag { display: inline-flex; border-radius: 30px; font-size: 11px; font-weight: 700; padding: 5px 11px; background: #e7eee6; color: #466052; white-space: nowrap; }
.study-daily-card .study-tag { background: #ffffff1a; color: #fff; }
.study-date { font-size: 12px; letter-spacing: .06em; color: #d5e8df; }
.study-daily-en { font-family: Georgia, "Times New Roman", serif; font-size: 29px; line-height: 1.2 !important; margin: 24px 0 3px; letter-spacing: -.03em; }
.study-daily-card h2 { font-size: 21px; font-weight: 600; margin: 5px 0 14px; }
.study-daily-excerpt { max-width: 360px; color: #eef4ed; font-size: 14px; }
.study-daily-meta { margin: 18px 0 16px; color: #e2f2e9; font-size: 12px; }
.study-daily-note { color: #d1e4da; font-size: 11px; margin: 12px 0 0; }
.study-route-card { padding: 28px; border: 1px solid var(--study-line); border-radius: var(--study-radius); background: var(--study-paper); }
.study-route-card h2 { font-size: 22px; margin: 13px 0 10px; letter-spacing: -.025em; }
.study-route-card p { margin: 10px 0; }
.study-mini-steps { counter-reset: steps; list-style: none; padding: 0; margin: 20px 0; }
.study-mini-steps li { counter-increment: steps; display: flex; align-items: center; gap: 12px; padding: 8px 0; font-size: 14px; }
.study-mini-steps li::before { content: counter(steps); display: grid; place-items: center; width: 24px; height: 24px; flex: 0 0 24px; border-radius: 50%; background: var(--study-soft); font-size: 11px; font-weight: 700; }
.study-progress-note { color: var(--study-muted); font-size: 12px; }
.study-button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 11px 18px; border-radius: 12px; border: 1px solid transparent; background: var(--study-green); color: white; font-size: 14px; font-weight: 650; cursor: pointer; text-decoration: none; }
.study-button:hover { filter: brightness(.95); }
.study-button-light { background: #fffef7; color: #245946; }
.study-button-outline { color: var(--study-ink); background: var(--study-paper); border-color: var(--study-line); }
.study-button:disabled, .study-choice:disabled { cursor: default; opacity: .7; }
.study-text-button { border: 0; padding: 8px 0; color: var(--study-green); background: transparent; font-weight: 600; cursor: pointer; font-size: 13px; min-height: 36px; }
.study-home button:focus-visible, .study-panel button:focus-visible, .study-panel input:focus-visible, .study-panel a:focus-visible { outline: 3px solid #7fb2a4; outline-offset: 3px; }
.study-path-section { margin: 30px 0; }
.study-section-title { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.study-section-title h2 { margin: 0; font-size: 18px; }
.study-category-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.study-category-card { display: grid; text-align: left; gap: 8px; padding: 18px; border: 1px solid var(--study-line); border-radius: 16px; background: var(--study-paper); color: var(--study-ink); cursor: pointer; }
.study-category-card:hover { border-color: #8caba0; transform: translateY(-1px); }
.study-category-card strong { font-size: 16px; }
.study-category-card > span:last-child { font-size: 12px; color: var(--study-muted); line-height: 1.7; }
.study-category-number { font: 24px Georgia, serif; color: #678e79; letter-spacing: -.03em; }
.study-category-card.blue .study-category-number { color: #7395b0; }
.study-category-card.violet .study-category-number { color: #9389af; }
.study-category-card.amber .study-category-number { color: #947b40; }
.study-category-card.coral .study-category-number { color: #b68676; }
.study-category-card.teal .study-category-number { color: #538e86; }
.study-panel { max-width: 100%; padding: 10px 0 36px; scroll-margin-top: 85px; }
.study-heading { padding: 8px 0 18px; }
.study-heading h2 { margin: 0 0 8px; font-size: clamp(24px, 3vw, 33px); letter-spacing: -.035em; line-height: 1.45; }
.study-heading p { margin: 6px 0; }
.study-catalog-tools { display: flex; gap: 14px; margin-bottom: 18px; align-items: center; }
.study-search, .study-gap-input { border: 1px solid var(--study-line); border-radius: 12px; background: var(--study-paper); color: var(--study-ink); min-height: 45px; padding: 11px 14px; font: inherit; min-width: 0; }
.study-search { flex: 1; }
.study-filters { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0 22px; }
.study-filter { border: 1px solid var(--study-line); border-radius: 30px; background: var(--study-paper); color: var(--study-muted); padding: 8px 13px; font-size: 13px; cursor: pointer; }
.study-filter.active { background: #e3efe7; color: #2a6b54; border-color: #93b09f; }
.study-catalog-grid, .study-word-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin: 18px 0 24px; }
.study-lesson-card { background: var(--study-paper); border: 1px solid var(--study-line); border-radius: 17px; padding: 21px; display: flex; flex-direction: column; }
.study-lesson-card .study-card-top { gap: 6px; }
.study-lesson-card .study-muted { font-size: 11px; }
.study-lesson-card h3 { margin: 23px 0 7px; font-size: 19px; line-height: 1.55; }
.study-card-en { font: 16px Georgia, serif; color: #596f60; margin: 0 0 17px; }
.study-card-note { color: var(--study-muted); font-size: 12px; margin: 0 0 21px; }
.study-lesson-card .study-button { margin-top: auto; width: 100%; font-size: 12px; }
.study-step-nav { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border: 1px solid var(--study-line); padding: 6px; gap: 5px; border-radius: 15px; margin: 0 0 24px; background: var(--study-paper); }
.study-step { display: flex; align-items: center; justify-content: center; gap: 10px; min-height: 45px; background: transparent; border: 0; border-radius: 10px; color: var(--study-muted); cursor: pointer; }
.study-step span { font-size: 10px; opacity: 1; }
.study-step strong { font-size: 13px; }
.study-step.active { background: #e6efe7; color: #245b45; }
.study-reading, .study-dialogue, .study-quiz, .study-summary { background: var(--study-paper); border: 1px solid var(--study-line); border-radius: 20px; padding: 27px; }
.study-objective { color: var(--study-muted); font-size: 13px; margin: 0 0 17px; }
.study-reading-controls { display: flex; justify-content: space-between; align-items: center; gap: 12px; border-bottom: 1px solid var(--study-line); padding-bottom: 13px; margin-bottom: 8px; }
.study-pair { position: relative; padding: 18px 0 18px 33px; border-bottom: 1px solid var(--study-line); }
.study-pair:last-of-type { border-bottom: 0; }
.study-line-number { position: absolute; top: 24px; left: 0; font-size: 10px; color: var(--study-muted); }
.study-en { font-family: Georgia, "Times New Roman", serif; font-size: 20px; line-height: 1.8 !important; margin: 0 0 10px; letter-spacing: .004em; }
.study-zh { color: var(--study-muted); margin: 0; font-size: 14px; line-height: 1.85 !important; }
.study-hide-translation .study-zh { display: none; }
.study-stage-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin: 22px 0 0; }
.study-sound { border: 1px solid var(--study-line); border-radius: 9px; background: var(--study-soft); color: var(--study-ink); padding: 7px 11px; min-height: 35px; font-size: 12px; cursor: pointer; white-space: nowrap; }
.study-word-card { padding: 20px; background: var(--study-paper); border: 1px solid var(--study-line); border-radius: 17px; }
.study-word-title { display: flex; justify-content: space-between; gap: 8px; align-items: center; }
.study-word-title h3 { font: 22px Georgia, serif; margin: 0; overflow-wrap: anywhere; }
.study-word-meaning { color: #50745b; font-weight: 650; margin: 13px 0 16px; }
.study-word-example { font-family: Georgia, serif; margin: 0 0 5px; line-height: 1.7; }
.study-word-card .study-muted { font-size: 12px; margin: 0; }
.study-word-actions { display: grid; gap: 1px; margin-top: 13px; }
.study-word-actions .study-text-button { text-align: left; font-size: 11px; }
.study-dialogue-controls { display: flex; gap: 10px; margin-bottom: 19px; }
.study-dialogue-line { display: grid; grid-template-columns: 26px minmax(0, 1fr) auto; align-items: start; gap: 13px; background: #f1f5ee; border-radius: 15px; padding: 18px; margin: 14px 30px 14px 0; }
.study-dialogue-other { margin: 14px 0 14px 30px; background: #eef2f7; }
.study-speaker { font-size: 11px; font-weight: 800; padding-top: 8px; color: #5c7867; }
.study-dialogue-line .study-en { font-size: 17px; }
.study-reveal-turn { display: none; grid-column: 2 / -1; background: transparent; color: var(--study-green); border: 0; padding: 7px 0; cursor: pointer; text-align: left; }
.study-hidden-turn .study-dialogue-body { visibility: hidden; }
.study-hidden-turn .study-sound { visibility: hidden; }
.study-hidden-turn .study-reveal-turn { display: block; }
.study-question-title { font-size: 21px; font-weight: 650; line-height: 1.8; margin: 22px 0 24px; }
.study-quiz-progress { margin: 16px 0; height: 4px; border-radius: 4px; background: #edf0e8; overflow: hidden; }
.study-quiz-progress span { display: block; height: 100%; background: #7da38a; }
.study-choices { display: grid; gap: 11px; margin: 18px 0 24px; }
.study-choice { display: flex; text-align: left; align-items: center; gap: 15px; width: 100%; padding: 16px 17px; border: 1px solid var(--study-line); border-radius: 12px; background: var(--study-paper); color: var(--study-ink); cursor: pointer; font-size: 15px; line-height: 1.65; }
.study-choice.selected { background: #eaf3ed; border: 2px solid #80a88c; padding: 15px 16px; }
.study-choice-letter { display: grid; flex: 0 0 27px; place-items: center; height: 27px; border-radius: 7px; background: var(--study-soft); font-size: 11px; color: var(--study-muted); }
.study-gap-sentence { font-family: Georgia, serif; font-size: 21px; line-height: 1.9 !important; }
.study-gap-form { margin: 16px 0 9px; }
.study-gap-input { width: 100%; max-width: 430px; font-size: 18px; }
.study-feedback { margin: 19px 0; border-radius: 12px; padding: 16px 18px; background: #edf4e9; color: #315837; font-size: 13px; }
.study-feedback.try-again { background: #faf1df; color: #7c6535; }
.study-feedback p { margin: 8px 0 0; }
.study-hint { color: #807044; font-size: 13px; }
.study-summary > h3 { font-size: 25px; line-height: 1.5; }
.study-summary-score { font: 60px Georgia, serif; color: #54795e; margin: 24px 0 4px; }
.study-save-note, .study-success-note { font-size: 13px; color: #577364; }
.study-answer-review { margin-top: 26px; border-top: 1px solid var(--study-line); }
.study-review-row { padding: 19px 0; border-bottom: 1px solid var(--study-line); }
.study-review-row strong { font-size: 14px; }
.study-review-row p { font-size: 13px; color: var(--study-muted); margin: 9px 0 0; }
.study-error { padding: 15px; background: #fff0e8; color: #8b462c; border-radius: 10px; font-size: 13px; line-height: 1.8; }
.study-empty, .study-footnote { color: var(--study-muted); font-size: 12px; line-height: 1.8; }
.study-selected-unit, .study-show-more { grid-column: 1 / -1; }
.study-selected-unit { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.study-selected-unit h3 { font-size: 18px; margin: 0; }
.study-unit-card h3 { margin-top: 18px; }
.study-unit-card .study-progress-note { margin-bottom: 18px; }
.study-unit-card .study-text-button { margin-top: 10px; }
.study-lesson-goals { background: var(--study-soft); border-radius: 12px; padding: 15px 18px 15px 36px; margin-bottom: 19px; }
.study-lesson-goals li { font-size: 14px; line-height: 1.8; margin: 4px 0; }
.study-grammar { margin: 20px 0; border: 1px solid var(--study-line); border-radius: 12px; padding: 16px 18px; }
.study-grammar summary { cursor: pointer; font-weight: 650; min-height: 28px; }
.study-grammar p { font-size: 14px; }
.study-listening-controls { display: flex; gap: 12px; flex-wrap: wrap; background: var(--study-soft); padding: 17px; border-radius: 12px; margin: 18px 0; }
.study-audio-transcript { font-family: Georgia, serif; font-size: 18px; line-height: 1.8; }
.study-order-answer, .study-order-bank { display: flex; gap: 9px; flex-wrap: wrap; min-height: 66px; padding: 15px; border-radius: 12px; margin: 15px 0; }
.study-order-answer { background: var(--study-soft); border: 1px dashed var(--study-line); }
.study-order-bank { border: 1px solid var(--study-line); }
.study-order-token { min-height: 44px; padding: 9px 13px; border-radius: 9px; border: 1px solid var(--study-line); color: var(--study-ink); background: var(--study-paper); cursor: pointer; font: 18px Georgia, serif; }
.study-order-token:disabled { opacity: .45; cursor: default; }
.study-speech-status { min-height: 20px; color: var(--study-muted); font-size: 12px; }
.halo-app-nav { position: sticky; bottom: 10px; z-index: 20; margin-top: 25px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; border: 1px solid var(--study-line); background: var(--study-paper); border-radius: 17px; box-shadow: 0 6px 28px #27392c13; padding: 7px; }
.halo-app-nav button { padding: 12px 3px; border: 0; border-radius: 11px; background: transparent; color: var(--study-muted); font-size: 13px; cursor: pointer; }
.halo-app-nav button[aria-current="page"] { color: var(--study-green); background: #e9f2e9; font-weight: 700; }
.reader-focus-deep .halo-app-nav { display: none; }
.home-reading-heading { margin: 38px 0 16px; padding-top: 25px; border-top: 1px solid var(--study-line); }
.home-reading-heading h2 { margin: 0; font-size: 19px; }
.home-reading-heading p { color: var(--study-muted); font-size: 13px; }
@media (max-width: 800px) {
  .study-catalog-grid, .study-word-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .study-today-grid { gap: 14px; }
  .study-route-card { padding: 23px; }
}
@media (max-width: 600px) {
  .study-home-intro { margin: 16px 0 22px; }
  .study-home-intro h1 { font-size: 27px; }
  .study-today-grid { grid-template-columns: 1fr; }
  .study-daily-card { min-height: 290px; padding: 24px; }
  .study-route-card { padding: 23px; }
  .study-category-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .study-category-card { padding: 17px; }
  .study-category-card strong { font-size: 15px; }
  .study-category-card > span:last-child { font-size: 11px; }
  .study-catalog-grid, .study-word-grid { grid-template-columns: 1fr; }
  .study-catalog-tools { gap: 9px; }
  .study-catalog-tools .study-button { font-size: 12px; padding: 11px; }
  .study-search { width: 100px; font-size: 13px; }
  .study-step-nav { padding: 4px; gap: 3px; }
  .study-step { flex-direction: column; gap: 4px; padding: 7px 2px; }
  .study-step strong { font-size: 12px; }
  .study-reading, .study-dialogue, .study-quiz, .study-summary { padding: 20px; }
  .study-en { font-size: 18px; }
  .study-zh { font-size: 13px; }
  .study-pair { padding-left: 25px; }
  .study-dialogue-line { margin-right: 10px; padding: 15px; grid-template-columns: 20px minmax(0, 1fr); gap: 9px; }
  .study-dialogue-other { margin-left: 10px; margin-right: 0; }
  .study-dialogue-line .study-sound { grid-column: 2; justify-self: start; }
  .study-dialogue-line .study-en { font-size: 17px; }
  .study-stage-actions .study-button { width: 100%; }
  .study-question-title { font-size: 19px; }
  .study-choice { padding: 14px; font-size: 14px; }
  .study-choice.selected { padding: 13px; }
  .halo-app-nav { position: fixed; bottom: max(10px, env(safe-area-inset-bottom)); left: 12px; right: 12px; margin: 0; }
  .app-shell { padding-bottom: 105px !important; }
}
@media (prefers-reduced-motion: reduce) {.study-category-card:hover {transform: none;}}
[data-theme="night"] { --study-ink: #e3ece2; --study-muted: #a5b5a7; --study-green: #95c5ad; --study-paper: #202d29; --study-soft: #2f3d35; --study-line: #3d4b41; }
[data-theme="night"] .study-button:not(.study-button-outline):not(.study-button-light) { color: #182a21; }
[data-theme="night"] .study-filter.active, [data-theme="night"] .study-step.active, [data-theme="night"] .study-choice.selected, [data-theme="night"] .halo-app-nav button[aria-current="page"] { background: #314e3e; color: #d1ebda; }
[data-theme="night"] .study-dialogue-line { background: #293d30; }
[data-theme="night"] .study-dialogue-other { background: #2b3741; }
[data-theme="night"] .study-feedback { background: #2d4434; color: #cce2c7; }
[data-theme="night"] .study-feedback.try-again { background: #463c27; color: #ead5a9; }
[data-theme="night"] .study-word-meaning, [data-theme="night"] .study-card-en, [data-theme="night"] .study-save-note, [data-theme="night"] .study-success-note { color: #aec9b5; }
