.learning-page { color-scheme: dark; }
.learning-page .site-header { background: #1b1c1a; }
.learning-page .button { background: var(--accent); color: #14231f; }
.learning-main { max-width: 920px; margin: 0 auto; padding: 52px 24px 64px; }
.learning-main h1 { max-width: 22ch; font-size: clamp(2rem, 5vw, 3.5rem); line-height: 1.1; letter-spacing: -.035em; }
.learning-main h2 { font-size: clamp(1.35rem, 3vw, 1.8rem); line-height: 1.25; margin-top: 2rem; }
.learning-main h3 { font-size: 1.25rem; }
.learning-main p, .learning-main li { max-width: 76ch; }
.learning-main p, .learning-main li, .learning-main td { color: #d5d7d2; }
.learning-main a { text-underline-offset: .2em; }
.learning-main .lead { font-size: 1.15rem; color: #bdbfba; max-width: 68ch; }
.learning-main .byline, .breadcrumbs { font-size: .9rem; color: #bdbfba; }
.learning-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 36px 0; }
.learning-grid .feature { background: #242622; border: 1px solid #4b4e47; color: #e1e3e8; border-radius: 16px; padding: 24px; }
.learning-grid .feature h2 { margin-top: .65rem; font-size: 1.4rem; }
.learning-grid .feature strong { color: var(--accent); }
.learning-grid .text-link { display: inline-block; margin-top: 12px; font-weight: 700; }
.learning-note, .dialogue { background: #262823; border: 1px solid #4b5144; padding: 22px; border-radius: 14px; margin: 28px 0; }
.learning-note h2 { margin-top: 0; }
.dialogue p:last-child, .learning-note p:last-child { margin-bottom: 0; }
.learning-main li { margin-bottom: .6rem; }
.table-scroll { overflow-x: auto; margin: 24px 0; }
.learning-main table { width: 100%; border-collapse: collapse; font-size: .98rem; }
.learning-main th, .learning-main td { padding: 14px; border: 1px solid #51544d; text-align: left; vertical-align: top; }
.learning-main th { background: #292b27; }
.answer-key { border: 1px solid #7eaaa0; border-radius: 12px; padding: 18px 22px; margin: 28px 0; }
.answer-key summary { cursor: pointer; font-weight: 700; min-height: 28px; }
.lesson-next { display: flex; gap: 24px; justify-content: space-between; border-top: 1px solid #51544d; padding-top: 28px; margin-top: 40px; }
.learning-page .site-footer { background: #101110; color: #e1e3e8; }
.learning-page .footer-inner { flex-wrap: wrap; gap: 18px; }
a:focus-visible, summary:focus-visible { outline: 3px solid var(--accent); outline-offset: 4px; }
@media (max-width: 820px) { .learning-page .nav-links { flex-wrap: wrap; overflow-x: visible; } }
@media (max-width: 600px) { .learning-grid { grid-template-columns: 1fr; } .learning-main { padding: 32px 18px 48px; } .lesson-next { flex-direction: column; } .learning-main th, .learning-main td { padding: 10px; } }