/* Forest palette and scenery: specificity keeps this separate from legacy themes. */
body { --ink:#294b3d; --muted:#6d8071; --teal:#387554; --pale:#edf4e8; --line:#dce6d5; --paper:#fff; --coral:#b37d4c; background:#fff; color:var(--ink); }
body .sidebar { background:#fff; border-color:#dce6d5; }
body .sidebar .brand { color:#335f43; letter-spacing:-1px; }
body .nav-item { color:#64755e; border-radius:15px; }
body .nav-item.active { color:#315f3e; background:#e1edd5; border-color:#bfd3ae; }
body .nav-icon { color:#668653; }
body .topbar { background:#fffffff5; border-color:#e2e9d9; backdrop-filter:blur(14px); }
body .main-wrap { background:#fff; }
body .main-wrap > main { padding-top:24px; }
body .button { background:#467a50; border-color:#37633f; box-shadow:0 3px 0 #315b39; color:white; }
body .button.secondary { background:#f6f9f0; border-color:#c9d9bd; color:#426443; box-shadow:0 2px 0 #d9e3ce; }
body .panel,body .settings-card,body .progress-summary,body .progress-lessons { border-color:#dce5d3; background:#fff; }
body .moko-guide { display:flex; align-items:center; gap:22px; max-width:900px; margin:0 auto 28px; padding:24px 30px; border:1px solid #dce6d1; border-radius:25px; background:linear-gradient(115deg,#edf4e3,#fbfcf5); }
body .moko-guide .moko-character { width:130px; height:130px; }
body .moko-bubble { position:relative; border-radius:19px 19px 19px 4px; padding:17px 23px; background:#fffef8; border:1px solid #dce7ce; flex:1; }
body .moko-bubble strong { color:#4f7946; font-size:12px; letter-spacing:.08em; }
body .moko-bubble p { margin:8px 0 0; color:#385541; font-size:15px; line-height:1.85; }
body .moko-guide-compact { padding:14px 22px; }
body .moko-guide-compact .moko-character { width:80px; height:80px; }
body .forest-intro { max-width:900px; margin:6px auto 24px; }
body .forest-intro .eyebrow { color:#75865f; letter-spacing:.18em; }
body .forest-intro h1 { margin:10px 0; font-size:clamp(24px,4vw,34px); color:#2d5138; }
body .forest-intro p { color:#76826a; line-height:1.8; }
body .forest-pass { max-width:680px; margin:0 auto 22px; border:1px dashed #c4d3b2; border-radius:16px; padding:16px 22px; background:#f0f4e7; }
body .forest-pass summary { cursor:pointer; font-weight:700; color:#536c42; }
body .forest-pass p { font-size:13px; line-height:1.8; color:#6c7b60; }
body .forest-pass .button { margin:4px; }
body .journey-map { position:relative; padding:0; background:transparent; border:0; border-radius:0; overflow:visible; }
body .unit-picker { position:relative; z-index:1; }
body .unit-jump button { border-color:#c0d3ac; color:#52704b; background:#fbfcf6; }
body .unit-jump button.active { background:#598049; border-color:#598049; color:white; box-shadow:0 3px 0 #416334; }
body .path-unit { --unit:#658b50; --unit-dark:#43643c; --unit-pale:#e7efda; }
body .unit-banner { background:linear-gradient(120deg,#64864f,#466c48); box-shadow:0 5px 0 #385a37; border:1px solid #789665; border-radius:18px; }
body .unit-banner > button { background:#ffffff18; border-color:#ffffff40; }
body .unit-locked .unit-banner { background:#dce5cf; color:#66745d; border-color:#c6d4b8; box-shadow:0 4px 0 #bbcba9; }
body .unit-locked .unit-banner small,body .unit-locked .unit-banner h2 { color:#66745d; }
body .unit-meter > span { background:#e5cb79; }
body .unit-trail { height:520px; margin-top:42px; }
body .trail-line { height:430px; width:100%; }
body .trail-line path { stroke:#d9ca9d; stroke-width:25px; stroke-dasharray:2 9; stroke-linecap:round; }
body .unit-trail::before,body .unit-trail::after { content:''; position:absolute; pointer-events:none; width:110px; height:150px; border-radius:48% 52% 40% 40%; background:radial-gradient(ellipse at 45% 35%,#b7cc99 0 30%,transparent 31%),radial-gradient(ellipse at 60% 55%,#9ab983 0 38%,transparent 39%),linear-gradient(90deg,transparent 45%,#a08e68 46% 53%,transparent 54%); opacity:.7; }
body .unit-trail::before { left:-28px; top:142px; transform:rotate(-6deg); }
body .unit-trail::after { right:-18px; top:12px; transform:scale(.8) rotate(9deg); }
body .path-stop { z-index:1; }
body .path-node,body .path-node.review { --tile:#79a05e; --tile-bottom:#526f43; width:96px; height:96px; filter:drop-shadow(0 5px 2px #3d5a2e16); }
body .path-node::before,body .path-node::after { clip-path:none; border-radius:48% 48% 44% 44%; }
body .path-node.node-done { --tile:#81a86a; --tile-bottom:#567b45; }
body .path-node.node-locked { --tile:#d8dfca; --tile-bottom:#bbc7aa; color:#88967c; }
body .path-stop.stop-current .path-node { --tile:#e4c875; --tile-bottom:#b39745; color:#5b542f; }
body .path-stop.stop-current::before { content:none; }
body .start-label { background:#fffbed; color:#736335; box-shadow:0 2px 0 #ded1a5; border:1px solid #e3d7b3; }
body .start-label::after { background:#fffbed; }
body .node-caption strong { color:#385637; background:#e5edd9; font-size:14px; }
body .node-caption small { color:#4e6248; font-size:12px; line-height:1.5; }
body .node-stars { color:#b8a05b; }
body .unit-end { color:#7b886f; bottom:8px; }
body .path-decoration { display:block; top:295px; left:auto; right:-8px; width:105px; opacity:1; }
body .path-unit:nth-of-type(even) .path-decoration { top:295px; right:-8px; left:auto; }
body .path-decoration .moko-character { width:90px; height:90px; }
body .path-decoration small { display:block; text-align:center; font-size:9px; color:#7c8a6b; letter-spacing:0; }
body .section-preview { border-color:#d9e4cc; background:#eef4e5; }
body .section-preview-art { color:#64804d; }
body .exercise-screen { background:#fff; }
body .exercise-progress > span { background:#7c9d61; }
body .exercise-options > button.selected { background:#eaf2df; border-color:#91ac75; }
body .exercise-options > button.selected.correct { background:#eaf2df; border-color:#5b8147; color:#355b32; }
body .exercise-options > button.selected.correct > span { border-color:#5b8147; color:#355b32; }
body .exercise-options > button.selected.incorrect { background:#fff0ed; border-color:#b35b4d; color:#843c32; }
body .exercise-options > button.selected.incorrect > span { border-color:#b35b4d; color:#843c32; }
body .exercise-screen .exercise-help { color:#53634f; font-size:13px; line-height:1.65; }
body .exercise-screen .exercise-close { min-width:44px; min-height:44px; flex-shrink:0; border-radius:10px; }
body .exercise-screen .exercise-close:focus-visible { outline:3px solid #659453; outline-offset:2px; }
body .exercise-screen .feedback-inner p { font-size:14px; line-height:1.65; }
body .exercise-screen .feedback-inner small { font-size:12px; line-height:1.6; }
body .exercise-screen .feedback-wrong .check-button { background:#a3483d; border-color:#81392f; box-shadow:0 3px 0 #71352e; }
body .exercise-screen .feedback-wrong .check-button:hover:not(:disabled) { background:#8f3f35; }
body .exercise-screen > .lesson-save-status { flex:none; max-height:30dvh; overflow-y:auto; box-sizing:border-box; margin:0; padding:6px 16px max(6px,env(safe-area-inset-bottom)); }
body .exercise-feedback.feedback-correct { background:#e2efd4; border-color:#cadfb6; }
body .exercise-feedback.feedback-wrong { background:#f5edda; border-color:#e6d6af; }
body .exercise-feedback .check-button { background:#467a50; border-color:#37633f; box-shadow:0 3px 0 #315b39; }
body .talk-session { background:#fff; }
body .talk-session-header { background:#fff; border-color:#dce5cf; }
body .talk-session .learning-layout { align-items:stretch; }
body .talk-session .talk-panel { height:100%; }
body .talk-session .voice-stage { min-height:230px; }
body .talk-session .voice-person { display:flex; }
body .talk-session.has-draft .voice-person { display:none; }
body .voice-person .moko-character { width:clamp(100px,18vh,170px); height:auto; aspect-ratio:1; }
body .talk-session .voice-stage { padding:16px; gap:12px; }
body .voice-person-name { font-size:20px; margin-top:5px; }
body .talk-heading .moko-character { width:58px; height:58px; }
body .voice-person-name { color:#436740; }
body .message.assistant > div { background:#e9f1df; border-color:#d7e5c9; }
body .moko-character[data-mood="thinking"] .moko-body { animation:moko-tilt 3s ease-in-out infinite; }
body .moko-character[data-mood="speaking"] .moko-body,body.moko-speaking .voice-person .moko-body { animation:moko-listen 1.2s ease-in-out infinite; }
@media(max-width:700px) {
 body .moko-guide { gap:8px; padding:14px 12px; margin-bottom:20px; border-radius:20px; }
 body .moko-guide .moko-character { width:88px; height:88px; }
 body .moko-bubble { padding:12px 14px; } body .moko-bubble p { font-size:13px; }
 body .journey-map { padding:0; } body .unit-banner { flex-wrap:wrap; }
 body .unit-banner { display:grid; grid-template-columns:minmax(45px,1fr) auto auto auto; padding:16px; gap:12px 8px; }
 body .unit-banner > div:first-child { grid-column:1 / -1; width:100%; }
 body .unit-banner h2 { font-size:17px; line-height:1.6; }
 body .unit-banner .unit-meter { width:100%; min-width:45px; }
 body .unit-banner > button { font-size:10px; padding:8px; }
 body .journey-map .unit-trail { width:min(330px,100%); height:640px; }
 body .trail-line { height:550px; }
 body .stop-1 { top:195px; }
 body .stop-2 { top:390px; }
 body .node-caption { left:-20px; top:108px; width:140px; text-align:center; }
 body .node-caption small { padding-left:0; }
 body .path-decoration { right:0; } body .forest-intro { margin-top:0; }
 body .forest-pass { padding:14px; } body .sidebar { background:#fff; }
 body .unit-trail::before { left:-15px; width:80px; } body .unit-trail::after { right:-10px; width:80px; }
 body .voice-person .moko-character { width:110px; }
 body .talk-session .voice-stage { min-height:190px; }
}
@media(prefers-reduced-motion:reduce) { body .moko-character[data-mood] .moko-body { animation:none; } }
body .page { --blue:#47734c; --ink:#2c4a38; --muted:#74816b; --warm:#e5cc86; --line:#dce5d2; }
body .forest-welcome-art { position:relative; background:radial-gradient(ellipse at 50% 28%,#edf6de,#d5e5bf); border-radius:45% 45% 22px 22px; min-height:490px; overflow:hidden; }
body .forest-welcome-art > img { position:absolute; width:72%; height:65%; top:3%; left:14%; object-fit:contain; opacity:1; }
body .forest-welcome-art .story-label,body .forest-welcome-art > div { bottom:30px; left:30px; right:25px; color:#36553a; }
body .forest-welcome-art .story-label span,body .forest-welcome-art .eyebrow { color:#587344; }
body .forest-welcome-art .story-label strong { color:#36553a; }
body .forest-welcome-art::after { display:none; }
body .page .button { background:#467a50; border-color:#37633f; }
body .closing { background:#e9f0df; }
body .hero-copy h1 span { color:#7c9b5e; }
@media(max-width:800px) { body .hero-art.forest-welcome-art { min-height:430px; } }
/* Keep the next step above the forest path, with Moko as a quiet companion. */
body .course-resume { max-width:680px; margin:0 auto 22px; padding:26px 28px 0; border:1px solid #dce6d1; border-radius:24px; background:linear-gradient(120deg,#edf4e3,#fbfcf5); overflow:hidden; }
body .resume-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; }
body .resume-heading .eyebrow { color:#617e50; font-size:11px; letter-spacing:.09em; }
body .resume-units { color:#52704b; font-size:13px; white-space:nowrap; text-underline-offset:4px; }
body .course-resume h1 { margin:14px 0 8px; font-size:clamp(23px,4vw,30px); line-height:1.3; color:#2d5138; overflow-wrap:anywhere; }
body .resume-goal { margin:0 0 16px; color:#61735e; font-size:14px; line-height:1.6; }
body .resume-progress { display:flex; align-items:center; gap:12px; margin:16px 0 20px; color:#61735e; font-size:12px; }
body .resume-progress progress { appearance:none; border:0; border-radius:8px; overflow:hidden; width:160px; max-width:65%; height:8px; background:#dce6d1; }
body .resume-progress progress::-webkit-progress-bar { background:#dce6d1; }
body .resume-progress progress::-webkit-progress-value { background:#7f9f60; border-radius:8px; }
body .resume-progress progress::-moz-progress-bar { background:#7f9f60; border-radius:8px; }
body .resume-actions { display:flex; flex-wrap:wrap; align-items:center; gap:18px; }
body .resume-actions .button { min-height:48px; padding:12px 24px; }
body .resume-actions .text-button { color:#52704b; }
body .review-schedule { padding:14px 0 20px; border-top:1px solid #dce6d1; color:#52704b; }
body .review-schedule .resume-lesson { margin:0 0 7px; font-weight:700; }
body .review-schedule small { display:block; line-height:1.6; }
body .lesson-celebration .review-timing { margin:12px auto; color:#52704b; }
body .talk-practice h3 { line-height:1.5; }
body .talk-practice blockquote, body .talk-practice-history blockquote { margin:12px 0; padding:12px 16px; border-left:3px solid #a6be91; background:#f6f9ef; overflow-wrap:anywhere; white-space:pre-wrap; }
body .talk-practice label { display:block; margin:18px 0 8px; font-weight:700; }
body .talk-practice textarea { box-sizing:border-box; width:100%; resize:vertical; margin-bottom:12px; }
body .talk-practice small { display:block; margin-top:12px; line-height:1.6; color:#61735e; }
body .talk-practice-saved { color:#486e3d; font-weight:700; }
body .talk-practice-history ul { list-style:none; margin:0; padding:0; }
body .talk-practice-history li { padding:20px 0; border-top:1px solid #e8eddf; }
body .talk-practice-history time { display:block; margin-top:12px; font-size:12px; color:#61735e; }
body .speech-controls { position:fixed; z-index:1000; bottom:20px; right:20px; box-sizing:border-box; width:min(420px,calc(100vw - 32px)); padding:16px 18px; border:1px solid #cddcbe; border-radius:18px; background:#fffef8; color:#2d5138; box-shadow:0 8px 32px #263c2929; }
body .speech-controls p { margin:0 0 10px; line-height:1.5; }
body .speech-controls small { display:block; margin:0 0 12px; overflow-wrap:anywhere; }
body .speech-controls > div { display:flex; flex-wrap:wrap; gap:8px; }
body .speech-controls button { min-height:44px; padding:8px 14px; border:1px solid #cddcbe; border-radius:10px; background:#f6f9ef; color:#365d3c; font:inherit; cursor:pointer; }
body .speech-controls button[aria-pressed="true"] { background:#486e3d; color:white; }
body .speech-controls button:focus-visible { outline:3px solid #82a859; outline-offset:3px; }
body .lesson-next-step { max-width:560px; margin:24px auto; padding:20px; border:1px solid #dce6d1; border-radius:18px; background:#f6f9ef; text-align:left; }
body .lesson-next-step small { color:#617e50; font-weight:700; letter-spacing:.06em; }
body .lesson-next-step h2 { margin:8px 0; font-size:20px; line-height:1.5; color:#2d5138; }
body .lesson-next-step p { margin:8px 0 0; line-height:1.6; color:#61735e; }
body .course-return-current { margin:0 0 20px; padding:0 0 20px; border-bottom:1px solid #dce6d1; }
body .course-return-current p { margin:0 0 12px; font-size:14px; line-height:1.6; color:#52704b; }
body .course-return-current small { display:block; margin-top:10px; color:#61735e; overflow-wrap:anywhere; }
body .account-status { min-height:28px; font-size:12px; color:#61735e; }
body .account-status.save-error { padding:14px 20px; line-height:1.6; border:1px solid #e9c8b6; border-radius:12px; background:#fff5ed; color:#84462c; }
body .save-retry { display:inline-block; min-height:44px; margin:8px 0 0 12px; padding:8px 14px; font:inherit; border:1px solid #c9a48d; border-radius:10px; background:white; color:#84462c; cursor:pointer; }
body .save-retry:disabled { opacity:.6; cursor:wait; }
body .save-retry:focus-visible { outline:3px solid #82a859; outline-offset:3px; }
body .resume-lesson { margin:12px 0 18px; font-size:12px; color:#61735e; overflow-wrap:anywhere; }
body .resume-moko { display:flex; align-items:center; gap:12px; border-top:1px solid #dce6d1; min-height:76px; }
body .resume-moko .moko-character { flex:0 0 66px; width:66px; height:66px; }
body .resume-moko p { margin:0; font-size:13px; line-height:1.6; color:#52704b; }
body #course-units { scroll-margin-top:100px; }
/* A quiet woodland setting for the learner's growing record. */
body .progress-page { color:#344d38; }
body .progress-page > h1 { display:flex; align-items:center; gap:12px; color:#34563c; }
body .progress-page > h1::before { content:""; width:23px; height:15px; flex-shrink:0; border-radius:3px 18px 3px 18px; background:linear-gradient(145deg,#a9c58a 46%,#72965e 48% 53%,#8eaf72 55%); transform:rotate(-25deg); }
body .progress-summary { position:relative; overflow:hidden; background:linear-gradient(115deg,#edf4e3,#f9fbf4 65%,#f1f5e7); border:1px solid #d7e3c9; border-radius:20px; padding:26px 0; box-shadow:0 4px 16px #36533905; }
body .progress-summary::after { content:""; position:absolute; right:-12px; bottom:-24px; width:100px; height:90px; background:radial-gradient(ellipse at 30% 55%,#a4bf7d26 0 26%,transparent 27%),radial-gradient(ellipse at 70% 25%,#8eae7020 0 29%,transparent 30%); transform:rotate(-20deg); pointer-events:none; }
body .progress-summary > div { position:relative; z-index:1; }
body .progress-summary > div + div { border-left-color:#d7e2cc; }
body .progress-summary dt { color:#617355; }
body .progress-summary dd { color:#365c3f; }
body .progress-summary dd small { color:#6b7e60; }
body .progress-section-heading h2 { color:#425d3e; }
body .progress-section-heading > span { color:#74816b; }
body .progress-list { border-color:#dce5d3; border-radius:18px; background:#fffefa; }
body .progress-list li { position:relative; }
body .progress-list li::before { content:""; position:absolute; left:0; top:23px; bottom:23px; width:3px; border-radius:0 3px 3px 0; background:#b2c995; }
body .progress-list li + li { border-top-color:#e8eddf; }
body .progress-check { background:#eaf2df; color:#5b8147; border:1px solid #d7e5c7; }
body .progress-entry p { color:#718069; }
body .progress-review { color:#486e3d; border-color:#cddcbe; background:#f6f9ef; }
body .progress-review:hover { background:#e9f1dc; border-color:#a6be91; }
body .progress-review:focus-visible { outline:3px solid #72965e; outline-offset:3px; }
body .progress-empty { color:#617355; background:#f6f9ef; border:1px dashed #cddcbe; border-radius:18px; }
@media(max-width:600px) {
 body .progress-summary { padding:20px 0; }
 body .progress-page > h1 { gap:10px; }
}
body .unit-picker .forest-pass { margin:16px 0 8px; padding:14px; }
@media(max-width:640px) {
 body .course-resume { padding:20px 18px 0; margin-bottom:16px; border-radius:20px; }
 body .resume-actions { gap:12px; }
 body .resume-actions .button { flex:1; padding:12px; }
 body .resume-moko { gap:8px; }
}

/* Account support */
.support-card details > summary { cursor: pointer; padding: 14px 0; color: var(--ink, #16454a); font-weight: 700; }
.support-card form { display: grid; gap: 14px; margin: 20px 0; }
.support-card label { display: grid; gap: 7px; font-weight: 700; }
.support-card input, .support-card select, .support-card textarea { width: 100%; min-width: 0; box-sizing: border-box; padding: 12px; border: 1px solid #d7e3cd; border-radius: 12px; background: #fff; color: #16454a; font: inherit; }
.support-card textarea { resize: vertical; }
.support-card :is(input,select,textarea,button,summary):focus-visible { outline: 3px solid #659453; outline-offset: 3px; }
.support-ticket { border-top: 1px solid #d7e3cd; padding: 18px 0; overflow-wrap: anywhere; }
.support-ticket h4 { margin: 0; }
.support-ticket small { color: #60716c; }
.support-text { white-space: pre-wrap; }
.support-reply { background: #f2f7ed; padding: 14px; border-radius: 12px; margin-top: 12px; }
.support-card [data-support-status] { min-height: 1.5em; }
/* Shared woodland surfaces and a clear, readable learning hierarchy. */
body { --muted:#596d57; background:#faf9f2; }
body .main-wrap { background:linear-gradient(155deg,#f1f5e9 0,#faf9f2 380px); }
body .journey-map { background:transparent; }
body .course-section-picker { gap:6px; margin-bottom:24px; }
body .course-section-picker > span { color:#65765d; font-size:12px; }
body .course-section-trigger { padding:14px 16px; border:1px solid #d5dfcb; border-radius:16px; background:transparent; }
body .course-section-trigger:hover { background:transparent; border-color:#799b68; }
body .course-section-trigger strong { font-size:16px; line-height:1.6; }
body .course-section-trigger .course-section-copy { display:grid; gap:4px; min-width:0; flex:1; color:#245348; }
body .course-section-caption { color:#8b9981; font-size:11px; font-weight:500; line-height:1.3; }
body .course-section-trigger .course-section-change { flex-shrink:0; font-size:22px; line-height:1; }
body details.path-unit { margin-bottom:20px; }
body details.path-unit > summary.unit-banner { display:grid; grid-template-columns:minmax(0,1fr) auto 32px; gap:10px 12px; align-items:center; cursor:pointer; list-style:none; }
body details.path-unit > summary::-webkit-details-marker { display:none; }
body details.path-unit > summary::marker { content:''; }
body details.path-unit > summary:focus-visible { outline:3px solid #a98936; outline-offset:5px; }
body details.path-unit > summary.unit-banner > div:first-child { grid-column:1 / 3; grid-row:1; }
body details.path-unit > summary .unit-meter { grid-column:1; grid-row:2; width:100%; max-width:150px; }
body details.path-unit > summary .unit-count { grid-column:2; grid-row:2; }
body details.path-unit:not([open]) > summary { background:#edf1e3; border-color:#ccd8c0; box-shadow:none; color:#3c573b; }
body details.path-unit:not([open]) > summary :is(h2,small) { color:#3c573b; }
body details.path-unit:not([open]) > summary .unit-goal { display:none; }
body .unit-banner small { font-size:12px; letter-spacing:.02em; }
body .unit-banner h2 { line-height:1.55; }
body .unit-disclosure { grid-column:3; grid-row:1 / 3; display:flex; align-items:center; justify-content:center; width:32px; height:32px; border-radius:50%; background:#ffffff24; transition:transform .18s; }
body details.path-unit[open] > summary .unit-disclosure { transform:rotate(180deg); }
body .unit-unlock-note { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px 16px; padding:14px 4px 0; color:#52634b; font-size:13px; }
body .unit-unlock-note p { margin:0; }
body .unit-unlock-note .unit-pass { min-height:44px; padding:8px; font-size:14px; color:#355b3d; text-decoration:underline; text-underline-offset:4px; }
body .node-caption small { color:#52634b; font-size:13px; line-height:1.65; }
body .node-caption strong { line-height:1.6; }
body .path-decoration small { font-size:12px; color:#52634b; line-height:1.7; }
body .unit-novel-shortcut strong { font-size:14px; line-height:1.65; overflow-wrap:break-word; }
body .unit-novel-shortcut small { font-size:12px; color:#52634b; }
body .unit-novels { flex-basis:140px; }
body .unit-novel-shortcut { min-width:0; }
body .exercise-screen { background:radial-gradient(ellipse at 100% 0,#edf3df 0,transparent 38%),#faf9f2; }
body .exercise-screen .exercise-top { background:transparent; }
body .exercise-screen .exercise-progress { background:#dfe7d4; }
body .exercise-screen .exercise-progress > span { background:#6f9356; }
body .exercise-screen .exercise-feedback:not(.feedback-correct):not(.feedback-wrong) { background:#f3f5e9; border-color:#dce5d3; }
body .exercise-screen .exercise-options > button { background:#fffefa; border-color:#d4deca; color:#294b3d; }
body .exercise-screen .exercise-options > button:hover:not(:disabled):not(.selected) { background:#f0f5e6; border-color:#71945c; }
body .exercise-screen .exercise-options > button.selected:not(.incorrect) { color:#294b3d; background:#e7efda; border-color:#6f9356; }
body .exercise-screen .exercise-options > button.selected:not(.incorrect) > span { color:#355c3a; border-color:#6f9356; }
body .exercise-screen .exercise-help { font-size:14px; color:#52634b; }
body .exercise-screen .feedback-tip { color:#52634b; font-size:14px; }
body .exercise-screen .check-button:disabled { opacity:1; background:#e2e6d9; color:#65715f; border-color:#ccd5c1; box-shadow:none; cursor:default; }
body .exercise-screen :is(button,.word-bank button):focus-visible { outline:3px solid #a98936; outline-offset:4px; }
body .talk-session { background:#faf9f2; }
body .talk-session .talk-session-header { background:#f4f6eb; }
body .forest-expansion { padding:0 24px 16px; }
body .forest-expansion > summary { min-height:44px; padding:12px 0; cursor:pointer; font-weight:600; color:#41623e; }
body .forest-expansion > summary:focus-visible { outline:3px solid #a98936; outline-offset:3px; }
body .forest-growth { padding-top:20px; }
body .auth-page { --blue:#386b45; --muted:#596d57; }
body:has(.auth-page) { background:radial-gradient(ellipse at 0 0,#e9efdb,transparent 55%),#faf9f2; }
body .auth-panel { padding:28px; border:1px solid #dce5d3; border-radius:24px; background:#fffefa; max-width:460px; }
body .auth-panel h1::before { content:''; display:inline-block; width:18px; height:12px; margin-right:12px; border-radius:2px 16px 2px 16px; background:#8ca971; transform:rotate(-25deg); }
body .auth-panel :is(input,select) { border-color:#c6d4ba; border-radius:12px; min-height:48px; }
body .auth-panel .caption { font-size:13px; color:#596d57; }
body .auth-story.forest-welcome-art { background:#dce8c6 url('/forest-landscape.svg') center/cover; }
body .auth-story.forest-welcome-art > div { background:#fffdf0ed; border-radius:18px; padding:18px; }
body .auth-story.forest-welcome-art > img { top:4%; height:60%; }
@media(max-width:700px) {
 body details.path-unit > summary.unit-banner { grid-template-columns:minmax(0,1fr) auto 32px; padding:16px; gap:10px; }
 body details.path-unit > summary.unit-banner > div:first-child { grid-column:1 / 3; }
 body details.path-unit > summary .unit-meter { max-width:150px; min-width:0; }
 body .unit-banner small > span { display:inline; }
 body .unit-learning-layout { flex-direction:column; }
 body .unit-learning-layout .unit-trail { flex:none; }
 body .unit-novels { flex:0 1 auto; flex-direction:row; justify-content:center; flex-wrap:wrap; gap:24px; margin:0 0 28px; }
 body .unit-novel-shortcut { width:140px; max-width:100%; }
 body .path-decoration { right:0; top:285px; }
 body .path-decoration small { max-width:100px; }
 body .forest-growth { padding:18px; }
 body .forest-expansion { padding:0 18px 14px; }
 body .auth-layout { padding:24px 0; min-height:calc(100dvh - 170px); }
 body .auth-panel { padding:24px 20px; }
}
@media(prefers-reduced-motion:reduce) { body .unit-disclosure { transition:none; } }

body .exercise-screen :is(.check-button,.exercise-continue) { background:#467a50; border-color:#37633f; box-shadow:0 3px 0 #315b39; }
body .exercise-screen :is(.check-button,.exercise-continue):hover:not(:disabled) { background:#386540; }
body .exercise-screen .feedback-wrong .check-button { background:#a3483d; border-color:#81392f; box-shadow:0 3px 0 #71352e; }
body .exercise-screen .feedback-wrong .check-button:hover:not(:disabled) { background:#8f3f35; }

/* Keep unlock requirements and skip action inside the unit card. */
body details.path-unit > summary.unit-banner > .unit-unlock-note { grid-column:1 / -1; grid-row:3; border-top:1px solid #66745d30; padding:10px 0 0; line-height:1.6; }
body .unit-unlock-note > span { flex:1 1 180px; min-width:0; overflow-wrap:anywhere; }
body .unit-banner .unit-unlock-note .unit-pass {
 display:inline-flex;
 align-items:center;
 justify-content:center;
 min-height:44px;
 padding:10px 18px;
 border:1px solid #37633f;
 border-radius:12px;
 margin:0 0 0 auto;
 background:#467a50;
 color:#fff;
 font-weight:700;
 line-height:1.4;
 text-decoration:none;
 white-space:nowrap;
 flex:0 0 auto;
 cursor:pointer;
}
body .unit-banner .unit-unlock-note .unit-pass:hover { background:#386540; }
body .unit-banner .unit-unlock-note .unit-pass:focus-visible { outline:3px solid #315b39; outline-offset:3px; }

/* Keep the next lesson identifiable even when its unit is collapsed. */
body details.path-unit.unit-next > summary.unit-banner {
 border:2px solid #467a50;
 box-shadow:0 0 0 3px #467a501a;
}
body details.path-unit.unit-next:not([open]) > summary.unit-banner {
 background:#e4edd9;
}
body .unit-next-label {
 display:table;
 margin-bottom:8px;
 padding:4px 10px;
 border-radius:999px;
 background:#37633f;
 color:#fff;
 font-size:12px;
 font-weight:700;
 line-height:1.5;
}