:root{color-scheme:light;--bg:#f8f6ef;--panel:#fffdf7;--ink:#20271e;--sub:#4e5a4e;--line:#d4d9cd;--green:#dff0d9;--accent:#205a3b;--button:#205a3b;--on:#fff;--coral:#9b3e2e;--art:#c3e3b7}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]){color-scheme:dark;--bg:#171d18;--panel:#212922;--ink:#f1f4e9;--sub:#bbc8ba;--line:#47564a;--green:#243c2d;--accent:#a4dfb6;--button:#bce9c8;--on:#17271b;--coral:#ffac93;--art:#9cca99}}
:root[data-theme=dark]{color-scheme:dark;--bg:#171d18;--panel:#212922;--ink:#f1f4e9;--sub:#bbc8ba;--line:#47564a;--green:#243c2d;--accent:#a4dfb6;--button:#bce9c8;--on:#17271b;--coral:#ffac93;--art:#9cca99}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.55 system-ui,sans-serif}a{color:var(--accent)}button,.button{font:inherit;font-weight:750;cursor:pointer;border-radius:12px;min-height:44px;padding:9px 15px;display:inline-flex;gap:12px;align-items:center;justify-content:center;text-decoration:none}.outline{border:1px solid var(--line);background:var(--panel);color:var(--ink)}.primary{border:1px solid transparent;background:var(--button);color:var(--on)}:focus-visible{outline:3px solid var(--coral);outline-offset:4px}.skip{position:absolute;left:12px;top:8px;transform:translateY(-150%);background:var(--panel);padding:8px;z-index:5}.skip:focus{transform:none}
.wrap{width:min(1120px,calc(100% - 40px));margin-inline:auto}header{border-bottom:1px solid var(--line)}.top{height:74px;display:flex;justify-content:space-between;align-items:center;gap:12px}.brand{color:var(--ink);text-decoration:none;font-weight:850;font-size:1.15rem;display:flex;align-items:center;gap:10px}.brand span{background:var(--button);color:var(--on);border-radius:9px;width:35px;height:35px;display:grid;place-items:center}main{padding-block:32px 55px}
.hero{border:1px solid var(--line);border-radius:28px;overflow:hidden;display:grid;grid-template-columns:1.5fr 1fr;background:var(--green)}.hero-copy{padding:clamp(22px,5vw,62px);padding-right:16px}.eyebrow{color:var(--accent);font-size:.73rem;letter-spacing:.14em;font-weight:850;text-transform:uppercase;margin:0 0 9px}h1,h2,h3,p{margin-top:0}h1,h2{font-family:Georgia,serif;letter-spacing:-.047em;line-height:1.03;font-weight:700}h1{font-size:clamp(2.55rem,5.4vw,4.7rem);margin-bottom:20px}h1 span{color:var(--coral)}h2{font-size:clamp(2.05rem,4.5vw,3.15rem);margin-bottom:13px}h3{line-height:1.18;margin-bottom:8px}p{color:var(--sub);margin-bottom:16px}.hero-copy>p:not(.eyebrow){max-width:37ch}.art{display:grid;place-content:center;grid-template-columns:repeat(2,clamp(63px,9vw,105px));gap:9px;position:relative;isolation:isolate;overflow:hidden;padding:35px 12px 57px;background:var(--art);color:#163623}.orbit{position:absolute;inset:0;z-index:-1;background:repeating-radial-gradient(circle at 55% 45%,transparent 0 27px,#235b3529 28px 29px)}.stamp{display:grid;place-items:center;aspect-ratio:1;border-radius:17px;border:1px solid #274b37;font-size:clamp(2.1rem,5vw,3.9rem);font-weight:800;box-shadow:3px 4px #21462e55;background:#f7f1dc}.s1{transform:rotate(-9deg)}.s2{transform:rotate(8deg);background:#f6cbb5}.s3{transform:rotate(5deg);background:#d9edcf}.s4{transform:rotate(-7deg);background:#21543a;color:white}.art-note{position:absolute;bottom:14px;right:16px;font:800 .64rem/1.2 system-ui;letter-spacing:.12em}
.status,.grid{display:grid;gap:14px}.status{grid-template-columns:1fr 1fr;margin-block:16px 44px}.status>div,.month,.sheet,.example,.practice{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:19px}.status p:last-child{margin:4px 0 0;font-size:.88rem}progress{width:100%;height:10px;display:block;margin-top:12px;accent-color:var(--accent)}.grid{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:22px}.month-head{display:flex;align-items:center;justify-content:space-between}.glyph{display:grid;place-items:center;width:42px;height:42px;border-radius:10px;background:var(--green);color:var(--accent);font-weight:750;font-size:1.25rem}.month p:not(.eyebrow){font-size:.92rem;min-height:4.3em}.month ul{list-style:none;margin:0;padding:0}.month li a{border-top:1px solid var(--line);display:flex;gap:10px;align-items:center;min-height:44px;text-decoration:none;color:var(--ink);font-size:.9rem}.month li a:hover{text-decoration:underline}.num{color:var(--accent);font-size:.72rem;min-width:23px;font-weight:800}.check{margin-left:auto;color:var(--accent)}footer{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:16px 0 24px;border-top:1px solid var(--line);color:var(--sub);font-size:.85rem}
#lesson{max-width:840px;margin:auto}.back{display:inline-flex;align-items:center;min-height:44px;margin-bottom:13px}.sheet{padding:clamp(18px,5vw,40px);background:var(--green)}.sheet h1{font-size:clamp(2.35rem,6vw,4rem);margin-bottom:12px}.sheet p:last-child,.practice p:last-child{margin:0}.lesson-section{margin-top:29px}.examples{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.example{display:flex;gap:8px;align-items:center;justify-content:space-between;padding:13px}.example strong{display:block;font-size:1.1rem;overflow-wrap:anywhere}.example small{display:block;color:var(--sub);overflow-wrap:anywhere}.sound{flex-shrink:0;width:44px;padding:0}.choices,.lesson-nav{display:flex;gap:8px;flex-wrap:wrap}.choices button[aria-pressed=true]{border:2px solid var(--accent);background:var(--green)}.lesson-nav{margin-top:18px;justify-content:space-between}.audio-status,.feedback{margin:8px 0 0}.audio-status:empty,.feedback:empty{display:none}
@media(max-width:800px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.wrap{width:calc(100% - 26px)}main{padding-top:17px}.top{height:62px}.hero{grid-template-columns:1fr}.hero-copy{padding:24px 18px}.art{grid-template-columns:repeat(4,minmax(42px,62px));gap:7px;padding:16px 10px 32px}.stamp{border-radius:10px}.art-note{bottom:7px}.status,.grid,.examples{grid-template-columns:1fr}.month p:not(.eyebrow){min-height:0}.status{margin-bottom:35px}}
[hidden]{display:none!important}