@import url('https://fonts.googleapis.com/css2?family=DotGothic16&family=Manrope:wght@500;600;700;800&family=Noto+Sans+JP:wght@400;500;600;700&display=swap');
:root{--ink:#33264d;--muted:#716486;--paper:#f7efff;--card:#fffdf8;--pink:#ff3e9d;--cyan:#aeeff3;--lemon:#ffe39b;--lime:#dff4a8;--purple:#d8cdfb;--soft:#d8cce6;--shadow:5px 7px 18px rgba(51,38,77,.14);--focus:0 0 0 3px #fff,0 0 0 6px #9a7bff}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px;scrollbar-color:#9a7bff var(--paper)}body{margin:0;min-width:320px;background:var(--paper);color:var(--ink);font:600 16px/1.7 Manrope,"Noto Sans JP",sans-serif;-webkit-font-smoothing:antialiased}button{font:inherit;color:inherit;cursor:pointer}button:disabled{cursor:default}a{color:inherit;text-underline-offset:4px}a:focus-visible,button:focus-visible,summary:focus-visible{outline:0;box-shadow:var(--focus)}::selection{background:var(--lemon)}
.topbar{width:min(100% - 38px,1240px);height:80px;display:flex;align-items:center;justify-content:space-between;margin:auto;border-bottom:2px solid var(--ink)}.brand{display:flex;align-items:center;gap:10px;text-decoration:none}.brand>b{width:40px;height:40px;display:grid;place-items:center;border:3px solid var(--ink);border-radius:12px 12px 12px 4px;background:var(--pink);color:white;font-size:10px;box-shadow:3px 4px 9px rgba(51,38,77,.18)}.brand>span{display:flex;flex-direction:column;line-height:1.1}.brand strong{font-size:14px}.brand small{margin-top:4px;color:var(--muted);font-size:10px}.top-actions{display:flex;gap:7px}.top-actions button{min-width:88px;border:2px solid var(--ink);border-radius:9px;padding:7px 10px;background:white;font-size:11px;font-weight:800}.top-actions button[aria-pressed="true"]{background:var(--lemon)}
.demo-notice{width:min(100% - 38px,1240px);display:flex;align-items:center;gap:12px;margin:14px auto 0;border:2px solid var(--ink);border-radius:10px;padding:8px 12px;background:var(--lemon);font-size:11px}.demo-notice strong{border-radius:6px;padding:2px 6px;background:var(--ink);color:white}.reader{width:min(100% - 38px,1080px);display:grid;grid-template-columns:minmax(0,760px) 220px;gap:70px;margin:auto;padding:56px 0 100px}.article-head h1{max-width:18ch;margin:22px 0 15px;font:800 clamp(40px,4.7vw,58px)/1.18 "Noto Sans JP",sans-serif;letter-spacing:0}.article-head>p{max-width:640px;margin:0;color:var(--muted);font-size:17px;line-height:1.75}.badges{display:flex;gap:7px}.badges span{border:2px solid var(--ink);border-radius:999px;padding:4px 9px;background:white;font-size:10px}.badges span:first-child{background:var(--pink);color:white}.source-line{display:flex;flex-wrap:wrap;gap:6px 15px;margin-top:24px;border-block:1px solid var(--soft);padding:11px 0;color:var(--muted);font-size:11px}.source-line a{color:inherit;text-decoration-color:var(--pink);text-decoration-thickness:2px;text-underline-offset:3px}.source-line a:hover{color:var(--ink)}.source-line a:focus-visible{border-radius:3px;outline:3px solid var(--lemon);outline-offset:3px}.audio-band{display:grid;grid-template-columns:1fr auto;align-items:center;gap:25px;margin-top:36px;border:3px solid var(--ink);border-radius:16px;padding:20px 22px;background:var(--cyan);box-shadow:var(--shadow)}.audio-band h2{margin:0;font:800 19px "DotGothic16"}.audio-band p{margin:4px 0 0;color:#55466a;font-size:12px}.audio-source{border:2px solid var(--ink);border-radius:8px;padding:9px 14px;background:rgba(255,255,255,.76);font-size:11px;font-weight:800;text-decoration:none}.audio-source:hover{background:white;color:#c42d77}
.study-section{margin-top:72px}.section-title{display:grid;grid-template-columns:auto 1fr;align-items:end;column-gap:11px;margin-bottom:24px}.section-title>span{grid-row:1/3;align-self:start;border:2px solid var(--ink);border-radius:7px;padding:4px 7px;background:var(--pink);color:white;font-size:9px}.section-title h2{margin:0;font:800 30px "DotGothic16","Noto Sans JP"}.section-title p{margin:3px 0 0;color:var(--muted);font-size:12px}.bilingual-list{border-top:3px solid var(--ink)}.bilingual-row{display:grid;grid-template-columns:38px 1fr 1fr;column-gap:22px;padding:28px 0;border-bottom:1px solid var(--soft)}.bilingual-row>b{width:32px;height:32px;display:grid;place-items:center;border:2px solid var(--ink);border-radius:8px;background:var(--cyan);font-size:11px}.bilingual-row p{margin:0}.bilingual-row .ja{font:500 18px/2.25 "Noto Sans JP",sans-serif}.bilingual-row .zh{border-left:1px solid var(--soft);padding-left:22px;color:#5f5273;font-size:14px;line-height:1.9}.hide-zh .bilingual-row{grid-template-columns:38px 1fr}.hide-zh .zh{display:none}ruby{white-space:nowrap;ruby-align:center;ruby-position:over}rt{color:#c42d77;font-size:.68em;font-weight:700;line-height:1;letter-spacing:0}.hide-ruby rt{display:none}
.vocab-table{overflow:hidden;border:3px solid var(--ink);border-radius:14px;background:var(--card)}.vocab-head,.vocab-row{display:grid;grid-template-columns:180px 160px 1fr}.vocab-head{background:var(--ink);color:white;font-size:10px}.vocab-head span,.vocab-row>*{margin:0;border-left:1px solid var(--soft);padding:11px 13px}.vocab-head span:first-child,.vocab-row>*:first-child{border-left:0}.vocab-row+.vocab-row{border-top:1px solid var(--soft)}.vocab-row strong{font-family:"Noto Sans JP"}.vocab-row span,.vocab-row p{font-size:12px}.vocab-row p{color:var(--muted)}.grammar-list{display:grid;grid-template-columns:1fr 1fr;gap:12px}.grammar-list article{border:3px solid var(--ink);border-radius:14px;padding:18px;background:var(--card)}.grammar-list h3{margin:0;color:#c42d77;font:700 22px "Noto Sans JP"}.grammar-list>article>p{margin:8px 0;color:var(--muted);font-size:14px}.grammar-list blockquote{display:grid;gap:7px;margin:14px 0 0;border:0;border-radius:8px;padding:13px;background:var(--purple)}.grammar-list blockquote span{font:600 15px/2 "Noto Sans JP"}.grammar-list blockquote small{border-top:1px solid rgba(51,38,77,.16);padding-top:7px;color:#55466a;font:600 12px/1.65 Manrope,"Noto Sans JP",sans-serif}.split-notes dl{margin:0;border-top:3px solid var(--ink)}.split-notes dl>div{display:grid;grid-template-columns:210px 1fr;gap:25px;border-bottom:1px solid var(--soft);padding:16px 4px}.split-notes dt{font-family:"Noto Sans JP";font-weight:800}.split-notes dd{display:grid;gap:4px;margin:0}.split-notes dd span{font:600 15px/1.8 "Noto Sans JP"}.split-notes dd small{color:var(--muted);font-size:12px}.breakdown-list{display:grid;gap:12px}.breakdown-list article{border:2px solid var(--ink);border-radius:12px;padding:18px;background:var(--card)}.breakdown-list h3{margin:0;font:700 15px/1.8 "Noto Sans JP"}.breakdown-list p{margin:10px 0 0;color:var(--muted);font-size:13px}.breakdown-list mark{border-radius:4px;padding:2px 4px;background:var(--lemon);color:var(--ink)}.jlpt-quiz{display:grid;gap:14px}.jlpt-quiz fieldset{margin:0;border:2px solid var(--ink);border-radius:12px;padding:18px;background:var(--card)}.jlpt-quiz legend{width:100%;padding:0 0 13px;font:700 15px/1.8 "Noto Sans JP"}.jlpt-quiz legend b{margin-right:9px;color:#c42d77;font:800 10px Manrope,sans-serif}.choices{display:grid;grid-template-columns:1fr 1fr;gap:8px}.choices label{display:flex;align-items:center;gap:9px;border:2px solid var(--soft);border-radius:8px;padding:10px;background:white;font:600 13px "Noto Sans JP";cursor:pointer}.choices label:hover{border-color:var(--ink);background:var(--lemon)}.choices input{position:absolute;opacity:0}.choices label:has(input:checked){border-color:var(--ink);background:var(--lemon)}.choices label span{width:24px;height:24px;display:grid;place-items:center;flex:0 0 auto;border:2px solid var(--ink);border-radius:6px;font-size:9px}.jlpt-quiz fieldset.is-correct{background:var(--lime)}.jlpt-quiz fieldset.is-wrong{background:#ffe1ee}.explanation{margin:14px 0 0;border-top:1px solid var(--soft);padding-top:13px;color:#55466a;font-size:13px}.explanation .chosen{margin:0 0 9px;color:var(--muted);font-size:11px}.explanation h4{margin:0 0 9px;color:var(--ink);font:800 15px "Noto Sans JP"}.explanation p{margin:7px 0;line-height:1.75}.explanation strong{color:var(--ink)}.explanation ul{display:grid;gap:6px;margin:12px 0 0;padding:12px 12px 12px 30px;border-radius:8px;background:rgba(255,255,255,.72)}.explanation li{padding-left:3px;line-height:1.65}.explanation li b{color:var(--ink)}.quiz-submit{display:flex;align-items:center;justify-content:space-between;gap:15px}.quiz-submit button{border:3px solid var(--ink);border-radius:10px;padding:11px 20px;background:var(--ink);color:white;font-weight:800}.quiz-submit button:hover{background:var(--pink)}.quiz-submit output{color:var(--muted);font-size:12px}.review-band{margin-top:72px;border:3px solid var(--ink);border-radius:16px;padding:24px;background:var(--lime);box-shadow:var(--shadow)}.review-band h2{margin:0 0 12px;font:800 26px "DotGothic16"}.review-band p{margin:8px 0;font-size:13px}.review-band button{width:100%;margin-top:16px;border:3px solid var(--ink);border-radius:10px;padding:12px;background:white;font-weight:800}.review-band button:hover{background:var(--lemon)}.review-band button:disabled{opacity:.65}
.jlpt-quiz fieldset.is-correct{border-color:#759a3a;background:var(--card)}
.jlpt-quiz fieldset.is-wrong{border-color:#c75a82;background:var(--card)}
.explanation .chosen{display:inline-block;margin-bottom:10px;border-radius:6px;padding:3px 8px}
.is-correct .explanation .chosen{background:#e6f2cf;color:#405c1f}
.is-wrong .explanation .chosen{background:#f9e2eb;color:#96385d}
.explanation ul{background:#f8f5fb}
.vocab-head,.vocab-row{grid-template-columns:176px 152px minmax(0,1fr)}
.vocab-head{font-size:11px}
.vocab-head span{padding:12px 17px}
.vocab-row{align-items:start}
.vocab-row>*{padding:17px}
.vocab-row strong{font-size:15px;line-height:2.25}
.vocab-row>span{font-size:13px;line-height:1.9}
.vocab-row p{color:#625574;font-size:14px;line-height:2.3}
.vocab-row p [lang="ja"]{display:inline-block;margin-inline:2px;color:var(--ink);font-weight:700}
.vocab-table rt{font-size:.8em}
.grammar-list{grid-template-columns:1fr;gap:18px}
.grammar-list article{display:grid;grid-template-columns:160px minmax(0,1fr);column-gap:28px;row-gap:14px;padding:26px 28px}
.grammar-list h3{grid-column:1;grid-row:1/3;align-self:start;font-size:23px;line-height:1.55}
.grammar-list>article>p{grid-column:2;margin:0;font-size:15px;line-height:1.95}
.grammar-list blockquote{grid-column:2;gap:8px;margin:0;border-top:1px solid var(--soft);border-radius:0;padding:16px 0 0;background:transparent}
.grammar-list blockquote span{font-size:16px;line-height:2.35}
.grammar-list blockquote small{border-top:0;padding-top:0;font-size:13px;line-height:1.85}
.grammar-list rt{font-size:.78em}
.split-notes dt{line-height:2.1}
.split-notes dd span{line-height:2.25}
.split-notes rt{font-size:.8em}
.breakdown-list{gap:20px}
.breakdown-list article{padding:26px 28px}
.breakdown-list h3{font-size:17px;line-height:2.35}
.breakdown-list h3 rt{font-size:.78em}
.chunk-line{display:flex;align-items:flex-start;flex-wrap:wrap;gap:10px;margin-top:18px}
.chunk-line>span{display:grid;gap:7px}
.chunk-line mark{width:max-content;padding:3px 6px;font:700 14px/1.65 "Noto Sans JP"}
.chunk-line small{color:var(--muted);font-size:12px}
.chunk-line i{padding-top:4px;color:#b4a9c3;font-style:normal}
.sentence-notes{display:grid;margin:22px 0 0;border-top:1px solid var(--soft)}
.sentence-notes>div{display:grid;grid-template-columns:92px 1fr;gap:18px;padding:14px 0;border-bottom:1px solid var(--soft)}
.sentence-notes>div:last-child{border-bottom:0;padding-bottom:0}
.sentence-notes dt{color:#c42d77;font-size:12px;font-weight:800}
.sentence-notes dd{margin:0;color:#55466a;font-size:14px;line-height:1.9}
.sentence-notes dd b{color:var(--ink)}
.rail{position:sticky;top:24px;align-self:start;display:grid;border:3px solid var(--ink);border-radius:14px;padding:15px;background:var(--card);box-shadow:var(--shadow)}.rail strong{margin-bottom:9px}.rail a{border-top:1px solid var(--soft);padding:8px 2px;text-decoration:none;font-size:12px}.rail a:hover{color:#c42d77}.toast{position:fixed;left:50%;bottom:22px;z-index:20;transform:translate(-50%,15px);border:2px solid white;border-radius:10px;padding:9px 14px;background:var(--ink);color:white;font-size:12px;opacity:0;pointer-events:none;transition:.18s ease-out}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:900px){.reader{grid-template-columns:1fr;gap:25px}.rail{position:static;grid-template-columns:repeat(3,1fr);order:-1}.rail strong{grid-column:1/-1}.bilingual-row{grid-template-columns:34px 1fr}.bilingual-row .zh{grid-column:2;margin-top:13px;border-top:1px solid var(--soft);border-left:0;padding:13px 0 0}.grammar-list{grid-template-columns:1fr}}
@media(max-width:620px){.topbar,.demo-notice,.reader{width:min(100% - 24px,1080px)}.topbar{height:66px}.brand>b{width:34px;height:34px}.brand small{display:none}.top-actions button{min-width:76px;padding-inline:7px;font-size:10px}.demo-notice{align-items:flex-start;flex-direction:column;gap:5px}.reader{padding:34px 0 70px}.article-head h1{font-size:36px;line-height:1.25}.article-head>p{font-size:15px}.audio-band{grid-template-columns:1fr}.audio-missing{text-align:center}.study-section{margin-top:56px}.section-title h2{font-size:26px}.bilingual-row{column-gap:10px;padding:23px 0}.bilingual-row .ja{font-size:17px;line-height:2.3}.vocab-head{display:none}.vocab-row{grid-template-columns:1fr 1fr}.vocab-row p{grid-column:1/-1;border-top:1px solid var(--soft);border-left:0}.split-notes dl>div{grid-template-columns:1fr;gap:4px}.rail{grid-template-columns:1fr 1fr}.choices{grid-template-columns:1fr}.quiz-submit{align-items:stretch;flex-direction:column}.quiz-submit button{width:100%}.quiz-submit output{text-align:center}.review-band{padding:18px}}
@media(max-width:620px){.vocab-row{grid-template-columns:1fr}.vocab-row>*{border-left:0;padding:15px 17px}.vocab-row>span{border-top:1px solid var(--soft)}.vocab-row p{grid-column:1;border-top:1px solid var(--soft);font-size:14px;line-height:2.35}}
@media(max-width:620px){.grammar-list article{grid-template-columns:1fr;gap:10px;padding:22px 18px}.grammar-list h3{grid-column:1;grid-row:auto}.grammar-list>article>p,.grammar-list blockquote{grid-column:1}.grammar-list blockquote span{font-size:15px}}
@media(max-width:620px){.breakdown-list article{padding:22px 18px}.chunk-line{display:grid;grid-template-columns:1fr}.chunk-line i{display:none}.chunk-line>span{padding-bottom:10px;border-bottom:1px dashed var(--soft)}.sentence-notes>div{grid-template-columns:1fr;gap:5px}.sentence-notes dt{font-size:11px}}
.jlpt-quiz{gap:22px}.quiz-intro{display:flex;align-items:baseline;justify-content:space-between;gap:20px;margin:0;border-block:1px solid var(--soft);padding:14px 2px;color:var(--muted);font-size:12px}.quiz-intro strong{color:var(--ink);font-size:14px}.quiz-question{display:grid;gap:20px;margin:0;border:2px solid var(--ink);border-radius:14px;padding:26px 28px;background:var(--card)}.question-heading{display:grid;gap:11px;border-bottom:1px solid var(--soft);padding-bottom:20px}.question-meta{display:flex;align-items:baseline;gap:12px}.question-meta b{color:#c42d77;font-size:11px;font-weight:800}.question-meta span{color:var(--muted);font-size:12px}.question-heading>p{margin:0;color:var(--muted);font-size:12px}.question-heading h3{margin:0;font:700 17px/2.3 "Noto Sans JP"}.reading-passage{border-radius:10px;padding:17px 19px;background:#f5f0fa;color:#55466a;font:600 14px/2.3 "Noto Sans JP"}.quiz-question .choices{gap:10px}.quiz-question .choices label{gap:11px;min-height:52px;border-radius:10px;padding:11px 13px;font-size:14px;line-height:2}.quiz-question .choices label:hover{background:#fff9df}.quiz-question .choices label:has(input:focus-visible){box-shadow:var(--focus)}.quiz-question .choices label>span{width:28px;height:28px;border-radius:7px;font:800 10px/1 Manrope,sans-serif}.choices label>i{font-style:normal}.choices-sentences label{align-items:flex-start}.choices-sentences label>span{margin-top:5px}.jlpt-quiz rt{font-size:.8em}.quiz-question.is-correct{border-color:#759a3a}.quiz-question.is-wrong{border-color:#c75a82}.quiz-question .explanation{margin:0;padding-top:18px}.quiz-question .explanation h4{line-height:2}.quiz-question .explanation p{line-height:1.85}.quiz-question .explanation ul{gap:7px;margin-top:14px;padding:14px 16px 14px 34px;border-radius:9px}.quiz-question .explanation li{line-height:1.75}.quiz-submit{margin-top:4px}.quiz-submit button{padding:12px 22px}
.jlpt-quiz:not(.is-graded) .question-heading rt,.jlpt-quiz:not(.is-graded) .choices rt{display:none}.jlpt-quiz.is-graded .question-heading rt,.jlpt-quiz.is-graded .choices rt{display:ruby-text}.hide-ruby .jlpt-quiz.is-graded .question-heading rt,.hide-ruby .jlpt-quiz.is-graded .choices rt{display:none}
@media(max-width:620px){.quiz-intro{align-items:flex-start;flex-direction:column;gap:3px}.quiz-question{padding:22px 18px}.question-meta{align-items:flex-start;flex-direction:column;gap:3px}.question-heading h3{font-size:16px}.reading-passage{margin-inline:-2px;padding:15px}.quiz-question .choices label{min-height:54px}}
.split-notes ruby{position:static;display:ruby;line-height:inherit;white-space:nowrap;ruby-align:center;ruby-overhang:auto}.split-notes ruby>rt{position:static;display:ruby-text;width:auto;transform:none;font-size:.68em;line-height:1;letter-spacing:0;pointer-events:auto}.split-notes dt{line-height:2.25}.split-notes dd span{font-size:16px;line-height:2.35}.hide-ruby .split-notes ruby>rt{display:none}
.article-head h1{max-width:760px;margin:30px 0 18px;font-size:50px;line-height:1.52}.headline-line{display:block}.headline-keep{white-space:nowrap}.article-head h1 rt{color:#c42d77;font-size:.38em;font-weight:700;line-height:1}
.audio-player{min-width:310px;display:grid;gap:7px}.audio-player span{color:#55466a;font-size:10px;font-weight:800}.audio-player audio{width:310px;height:42px;display:block;accent-color:var(--pink)}
@media(max-width:620px){.article-head h1{margin-top:26px;font-size:34px;line-height:1.55}.headline-line{display:inline}.headline-line:first-child::after{content:" "}.article-head h1 rt{font-size:.42em}.audio-player{min-width:0}.audio-player audio{width:100%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}