:root{--paper:#f5f1e8;--ink:#263c38;--red:#b94232;--muted:#687069;--line:#d7d7c9}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:35px}body{margin:0;background:var(--paper);color:var(--ink);font:17px/1.65 system-ui,-apple-system,Segoe UI,sans-serif}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer;color:inherit}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid var(--red);outline-offset:5px}header,main,footer{max-width:1320px;margin:auto;padding:0 5%}header{display:flex;justify-content:space-between;align-items:center;padding-top:27px;padding-bottom:27px;border-bottom:1px solid var(--line)}.brand{display:flex;gap:12px;align-items:center;line-height:1.1;font-size:17px;font-weight:600}.brand b{font-size:10px;letter-spacing:3px}.seal{display:grid;place-items:center;width:43px;height:48px;background:var(--red);color:var(--paper);font:29px serif;border-radius:3px;transform:rotate(-5deg)}nav{display:flex;gap:25px;font-size:14px}header button{border:1px solid var(--line);border-radius:100px;padding:9px 18px;background:transparent;font-size:13px}.hero{display:grid;grid-template-columns:1.1fr 1fr;gap:5%;padding:70px 0 40px;align-items:center}.eyebrow{font:11px/1.5 monospace;letter-spacing:2.5px;color:var(--red)}h1,h2{font-family:Georgia,'Times New Roman',serif;font-weight:400;letter-spacing:-2px;line-height:1.13}h1{font-size:clamp(42px,4.5vw,67px);margin:26px 0}h1 em{font-weight:400;color:var(--red)}h2{font-size:clamp(32px,3.3vw,47px);margin:17px 0 25px}h3{line-height:1.4}.lead{max-width:530px;color:var(--muted);margin-bottom:30px}.cta{display:inline-block;background:var(--ink);color:var(--paper);padding:14px 24px;border-radius:2px}.cta:hover{background:var(--red)}.small{font-size:12px;color:var(--muted);margin-top:20px}.cover{margin:0;animation:appear 1s ease both}.cover img{width:100%;height:auto}.cover figcaption{display:flex;justify-content:space-between;font:10px monospace;letter-spacing:1px;padding:12px 16px}.ticker{display:flex;justify-content:space-around;gap:20px;flex-wrap:wrap;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:24px 0;font:23px serif;color:#5f7167}section:not(.hero){padding:80px 0;border-bottom:1px solid var(--line)}.section-head{display:grid;grid-template-columns:1.3fr 1fr;gap:10%;align-items:end;margin-bottom:25px}.section-head>p{color:var(--muted);max-width:430px}.lesson-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.lesson{display:flex;flex-direction:column;align-items:start;text-align:left;min-height:240px;padding:22px;border:1px solid var(--line);background:transparent;transition:transform .25s,background .25s}.lesson:hover{transform:translateY(-6px);background:#e9e9dc}.lesson .symbol{font:50px serif;margin:20px 0;color:var(--red)}.lesson b{font:22px Georgia,serif}.lesson small{margin-top:7px;color:var(--muted)}.lesson .arrow{align-self:end;margin-top:auto}.phrase-section{display:grid;grid-template-columns:1fr 1fr;gap:10%;align-items:center}.phrase-section p{max-width:450px;color:var(--muted)}.arrows{display:flex;align-items:center;gap:25px;margin-top:30px}.arrows button{background:transparent;border:1px solid var(--line);border-radius:50%;width:43px;height:43px}.flashcard{border:0;border-radius:3px;background:#e4e7d7;min-height:350px;padding:40px;display:flex;gap:10px;flex-direction:column;align-items:center;justify-content:center;box-shadow:10px 12px 0 #eae8df;transform:rotate(2deg);transition:transform .2s}.flashcard:hover{transform:rotate(0)}.flashcard strong{font:42px Georgia,serif;overflow-wrap:anywhere;line-height:1.25;margin:30px 0 15px}.kana-row{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}.kana-row button{border:1px solid var(--line);background:transparent;min-height:160px;display:grid;place-content:center}.kana-row strong{font:60px serif;display:block}.kana-row button.active{background:var(--ink);color:var(--paper)}.kana-test{margin-top:20px;padding:25px;background:#ebe7dc;display:flex;gap:20px;align-items:center;flex-wrap:wrap}.kana-test button{border:1px solid var(--line);padding:6px 18px;background:var(--paper);margin:3px}.notes-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:35px}.notes-grid article{border-top:2px solid var(--ink);padding-top:20px}.notes-grid article>span{font:44px serif;color:var(--red)}.notes-grid p{font-size:15px;color:var(--muted)}details{border-top:1px solid var(--line);padding:22px 0}summary{cursor:pointer;font-weight:500}details p{max-width:850px;color:var(--muted)}#reset{background:transparent;border:1px solid var(--line);padding:10px}footer{display:flex;justify-content:space-between;align-items:center;gap:25px;padding-top:40px;padding-bottom:45px;font-size:12px}dialog{width:min(700px,92vw);border:0;padding:40px;background:var(--paper);color:var(--ink);max-height:90vh}dialog::backdrop{background:#132b27aa;backdrop-filter:blur(4px)}#close-dialog{float:right;background:transparent;border:0;font-size:30px}.phrase{border-bottom:1px solid var(--line);padding:14px 0}.phrase b{font-size:23px;display:block}.phrase span{display:block;color:var(--muted);font-size:14px}.answers{display:flex;gap:10px;flex-wrap:wrap}.answers button{border:1px solid var(--line);padding:10px 15px;background:transparent}.answers .correct{background:#d8e2cb}.answers .incorrect{background:#f0d0c5}.feedback{min-height:30px;font-size:14px;color:var(--red)}@keyframes appear{from{opacity:0;transform:translateY(25px)}to{opacity:1;transform:translateY(0)}}@media(max-width:750px){header,main,footer{padding-left:6%;padding-right:6%}nav{display:none}.hero{grid-template-columns:1fr;padding-top:40px}.cover{max-width:390px;margin:25px auto 0}.hero h1{font-size:45px}.section-head,.phrase-section{grid-template-columns:1fr;gap:20px}.lesson-grid{grid-template-columns:1fr 1fr}.lesson{min-height:210px;padding:17px}.lesson b{font-size:20px}.notes-grid{grid-template-columns:1fr;gap:20px}.kana-row{gap:6px}.kana-row button{min-height:105px}.kana-row strong{font-size:39px}.flashcard{margin-top:25px;min-height:300px;padding:20px}.flashcard strong{font-size:34px}section:not(.hero){padding:50px 0}footer{align-items:start;flex-direction:column}.ticker{font-size:18px}dialog{padding:24px}h2{letter-spacing:-1px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}