:root{--paper:#f7f5f0;--ink:#272322;--muted:#726d68;--red:#a13732;--line:#ddd8ce;--jp:'Noto Sans JP',sans-serif;--body:'Libre Baskerville',Georgia,serif;--display:'Cormorant Garamond',Georgia,serif}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.75 var(--body)}a{color:inherit}a:focus-visible,select:focus-visible{outline:3px solid var(--red);outline-offset:5px}.shell{max-width:1400px;margin:auto;padding:0 clamp(20px,4vw,64px)}.topbar{display:flex;justify-content:space-between;align-items:center;gap:20px;min-height:92px;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;font:700 25px/1 var(--display);letter-spacing:.1em}.brand img{width:58px;height:58px;object-fit:contain}.brand small{display:block;margin-top:6px;font:12px/1.4 var(--jp);letter-spacing:0;color:var(--muted)}.site-link{font:500 14px var(--jp);text-decoration:none;border-bottom:1px solid var(--red);padding:7px 0}.intro{display:flex;align-items:center;justify-content:space-between;gap:35px;padding:42px 0 32px}.eyebrow{font:700 12px var(--jp);letter-spacing:.14em;color:var(--red);margin:0 0 12px}h1{font:600 clamp(44px,5vw,64px)/1.05 var(--display);letter-spacing:-.025em;margin:0 0 15px}h1 em{font-weight:500;color:var(--red)}.intro p:not(.eyebrow){font-size:16px;line-height:1.75;color:var(--muted);margin:0}.resume{font:600 15px/1.5 var(--jp);text-decoration:none;border-left:3px solid var(--red);padding:12px 18px;min-width:215px}.resume span{display:block;font-size:13px;font-weight:400;color:var(--muted);margin-top:5px}.section-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:10px 0 18px}.section-head h2{font:600 30px var(--display);margin:0}.section-head>span{font:13px var(--jp);color:var(--muted)}.collections{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.collection{background:white;border:1px solid var(--line);padding:25px clamp(20px,2.4vw,34px) 24px;display:flex;flex-direction:column;position:relative;border-top:4px solid var(--ink)}.collection.complete{border-top-color:var(--red)}.card-meta{display:flex;align-items:center;justify-content:space-between;gap:8px;font:600 11px var(--jp);letter-spacing:.07em;color:var(--muted)}.badge{border:1px solid var(--line);padding:4px 7px;font-size:12px;letter-spacing:0;color:var(--red)}.jp{font:400 31px var(--jp);color:var(--red);margin-top:26px}.collection h3{font:600 38px/1.08 var(--display);margin:13px 0 20px}.collection p{font-size:14px;line-height:1.85;color:#625d57;margin:0 0 28px}.card-bottom{margin-top:auto;border-top:1px solid var(--line);padding-top:19px}.card-bottom>span{display:block;color:var(--muted);font:12px var(--jp);margin-bottom:13px}.card-bottom a{display:block;font:600 14px/1.5 var(--jp);color:var(--red);text-decoration:none}.card-bottom a:hover{text-decoration:underline}.lesson-section{display:grid;grid-template-columns:1fr 1fr;gap:40px;border:1px solid var(--line);padding:28px 34px;margin:30px 0;background:#eeeae2}.lesson-section h2,.how h2,.learn h2{font:600 34px/1.15 var(--display);margin:0 0 13px}.lesson-section p:not(.eyebrow){font-size:14px;color:var(--muted);margin:0}.lesson-controls{display:grid;grid-template-columns:1fr;align-content:center;gap:9px}.lesson-controls label{font:600 14px var(--jp)}select{width:100%;min-width:0;background:white;border:1px solid #c9c2b7;padding:13px 10px;font:14px var(--jp);color:var(--ink)}.button{justify-self:start;background:var(--red);color:white;padding:11px 18px;text-decoration:none;font:600 14px var(--jp);margin-top:3px;border-radius:3px}.button:hover{background:#842723}.how{padding:26px 0 34px}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}.steps p{font-size:14px;color:var(--muted);margin:12px 0}.steps b{display:block;font:600 14px var(--jp);color:var(--ink);margin-bottom:8px}.storage-note{font:13px/1.7 var(--jp);color:var(--muted);margin:20px 0 0}.learn{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:32px 0;display:grid;grid-template-columns:1fr auto;align-items:center;gap:45px}.learn p:not(.eyebrow){font-size:14px;color:var(--muted);max-width:670px;margin:0}.learn>a{font:600 15px/1.6 var(--jp);text-decoration:none;color:var(--red);border-bottom:1px solid var(--red);padding:8px 0}.learn>a span{display:block;font-size:12px;font-weight:400;color:var(--muted);margin-top:4px}footer{display:flex;justify-content:space-between;gap:20px;padding:23px 0 30px;font:12px/1.5 var(--jp);color:var(--muted)}footer a{text-decoration:none}@media(max-width:950px){.collections{gap:12px}.collection{padding:20px 18px}.card-meta{font-size:10px}.collection h3{font-size:33px}.learn{grid-template-columns:1fr;gap:12px}.learn>a{justify-self:start}}@media(max-width:720px){.intro{display:block;padding-top:30px}.resume{display:block;margin-top:22px}.collections{grid-template-columns:1fr}.collection{padding:24px}.collection h3 br{display:none}.collection h3{font-size:35px}.jp{margin-top:15px;font-size:28px}.collection p{margin-bottom:18px}.card-bottom{display:flex;justify-content:space-between;align-items:center;gap:10px}.card-bottom>span{margin:0;white-space:nowrap}.card-bottom a{text-align:right}.section-head{align-items:start;flex-direction:column;gap:4px}.lesson-section{grid-template-columns:1fr;padding:25px;gap:20px}.steps{grid-template-columns:1fr;gap:5px}.brand{font-size:21px;letter-spacing:.06em;gap:8px}.brand img{width:46px;height:46px}.brand small{font-size:10px}.site-link{font-size:12px;text-align:right}.topbar{min-height:78px}.intro p br{display:none}footer{flex-direction:column;gap:7px}}@media(prefers-reduced-motion:no-preference){.collection{transition:transform .2s,box-shadow .2s}.collection:hover{transform:translateY(-3px);box-shadow:0 10px 35px #2723220a}}
