.project-page header{position:relative;background:var(--paper)}nav a[aria-current]{color:var(--accent)}.project-main{max-width:1440px;padding:0 6%}.project-intro{padding:54px 0 32px}.article-meta,.intro-baseline{display:flex;justify-content:space-between;font-size:11px;letter-spacing:.08em;color:var(--muted)}.project-intro h1{font-weight:400;font-size:clamp(42px,5.3vw,76px);line-height:1.27;letter-spacing:-.04em;margin:65px 0 30px}.article-lead{font-size:17px;line-height:1.95;color:#60635b}.intro-baseline{margin-top:48px;padding-top:22px;border-top:1px solid var(--line)}.opening-specimen{margin:0;background:#e9ece3;padding:50px 7% 25px}.opening-ruby{display:flex;justify-content:center;gap:65px;padding:22px 0 50px;font:clamp(100px,13vw,190px) IntroKai,serif}.opening-ruby ruby,.reading-example ruby{ruby-align:center}.opening-ruby rt,.reading-example rt{font-family:Bopo,sans-serif;font-size:.37em;letter-spacing:normal;color:var(--accent)}.specimen-bottom{display:flex;justify-content:space-between;border-top:1px solid #cbd1c3;padding-top:20px;font-size:11px;color:#686f61}.article-layout{display:grid;grid-template-columns:200px minmax(0,1fr);gap:8%;margin-top:100px}.article-toc{align-self:start;position:sticky;top:35px;display:flex;flex-direction:column;gap:20px;font-size:12px;color:var(--muted);padding-top:7px}.article-toc>span{color:var(--ink);margin-bottom:10px}.article-toc a:hover{color:var(--accent)}.article-body{max-width:780px;min-width:0}.article-body section{margin-bottom:100px;scroll-margin-top:40px}.chapter{color:var(--accent);font-size:11px;letter-spacing:.06em}.article-body h2{font-size:clamp(28px,3vw,40px);line-height:1.5;margin:20px 0 30px;font-weight:400;letter-spacing:-.025em}.article-body p{font-size:16px;line-height:2.05;color:#55594f;margin:20px 0;max-width:660px}.article-body figure{margin:42px 0}.article-body img{display:block;width:100%;height:auto}figcaption{font-size:11px;line-height:1.8;color:#767a70;margin-top:15px}figcaption span{display:block;color:#41483c;margin-bottom:3px}.letter-study>div{font-size:clamp(65px,8vw,130px);text-align:center;padding:38px 10px;background:repeating-linear-gradient(transparent 0,transparent 48px,#d5dacd 49px,transparent 50px),#eceee6}.tone-study>div{font-size:clamp(65px,8vw,120px);text-align:center;padding:25px 12px 0;background:#eeeae3}.tone-study .secondary-tones{font-size:clamp(26px,3.8vw,55px);padding:15px 12px 35px;color:#75776f}.outline-study{background:#eff1ed;padding:20px 9% 25px}.outline-study img{max-height:620px;object-fit:contain}.reading-example{display:flex;gap:.3em;justify-content:center;font:clamp(42px,6vw,80px) IntroKai,serif;padding:55px 12px 30px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.book-figure{background:#f3f4f4}.book-figure img{max-height:920px;object-fit:contain}.book-figure figcaption{padding:0 20px 20px}.article-link{display:flex;justify-content:space-between;max-width:660px;border-bottom:1px solid #b4b9ab;padding:16px 0;font-size:14px}.article-link:hover{color:var(--accent)}.article-body .article-ending{font-family:IntroKai,serif;font-size:34px;line-height:1.7;margin:40px 0}.editorial-note{font-size:12px;color:#777b70;border-top:1px solid var(--line);padding:25px 0 60px;line-height:1.9}.project-page footer{margin-top:20px}
@media(max-width:760px){.project-page header{padding:0 5%;height:76px}.project-page .logo span{display:none}.project-page nav{gap:17px}.project-page nav a{font-size:11px}.project-page nav a span{display:none}.project-page nav .download{padding:10px}.project-main{padding:0 6%}.project-intro{padding-top:30px}.project-intro h1{margin-top:42px}.article-lead{font-size:15px}.desktop-break{display:none}.article-meta{font-size:9px}.opening-specimen{padding:30px 7% 20px}.opening-ruby{gap:35px;padding:10px 0 35px}.specimen-bottom{font-size:9px;gap:15px}.article-layout{grid-template-columns:1fr;gap:45px;margin-top:40px}.article-toc{position:static;display:grid;grid-template-columns:1fr 1fr;gap:16px;border-bottom:1px solid var(--line);padding-bottom:25px}.article-toc>span{grid-column:1/-1}.article-body section{margin-bottom:70px}.article-body p{font-size:15px}.article-body figure{margin:30px 0}.project-page footer{gap:20px;padding:25px 6%;font-size:10px}}
@media(max-width:600px){body:not(.project-page) header nav{gap:14px}body:not(.project-page) header nav a{font-size:11px}body:not(.project-page) header nav a span{display:none}body:not(.project-page) header .download{padding:10px}body:not(.project-page) header .logo span{display:none}}