:root{--paper: #fbfaf6;--paper-soft: #f3f0e8;--card: #fffefb;--ink: #1f2428;--muted: #6b6f6a;--zh: #54595a;--line: #ded9cc;--line-soft: #ebe7db;--indigo: #263f73;--indigo-soft: #e9edf7;--vermilion: #b84a37;--vermilion-soft: #f6e7e2;--matcha: #5f7f55;--matcha-soft: #edf3e8;--sky-soft: #e8f1f4;--bg: var(--paper);--bg2: var(--paper-soft);--accent: var(--indigo);--accent-soft: var(--indigo-soft);--maxw: 920px;--r-lg: 12px;--r-md: 9px;--r-sm: 6px;--shadow: 0 1px 2px rgba(31,36,40,.04);--font: "Noto Sans SC", "Noto Sans JP", -apple-system, "Hiragino Sans", system-ui, sans-serif;--font-ja: "Noto Sans JP", "Hiragino Sans", "Noto Sans SC", system-ui, sans-serif;--header-h: 56px;--secnav-h: 46px;font-family:var(--font)}@media (prefers-color-scheme: dark){:root{--paper: #16140f;--paper-soft: #1d1a13;--card: #201d16;--ink: #ece7da;--muted: #a39d8e;--zh: #c7c1b2;--line: #36322a;--line-soft: #2a2720;--indigo: #9db4e0;--indigo-soft: #222a3b;--vermilion: #df8b75;--vermilion-soft: #2e211c;--matcha: #a3bf93;--matcha-soft: #202a1d;--sky-soft: #1b2730}}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + var(--secnav-h) + 12px)}body{margin:0;color:var(--ink);line-height:1.75;background-color:var(--paper);background-image:repeating-linear-gradient(to bottom,transparent,transparent 31px,color-mix(in srgb,var(--line) 40%,transparent) 31px,color-mix(in srgb,var(--line) 40%,transparent) 32px);background-attachment:fixed;-webkit-font-smoothing:antialiased}a{color:var(--indigo);text-decoration:none}.wrap{width:min(100% - 32px,var(--maxw));margin-inline:auto}.ja-line{font-family:var(--font-ja);font-size:16.5px;line-height:1.85;color:var(--ink)}.reading{color:var(--muted);font-size:13px;font-family:var(--font-ja);line-height:1.6}.zh-line{color:var(--zh);font-size:14.5px;line-height:1.7}body.hide-reading .reading{display:none}header.site{border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--paper) 82%,transparent);backdrop-filter:saturate(150%) blur(10px);position:sticky;top:0;z-index:30}header.site .wrap{display:flex;align-items:center;gap:14px;min-height:var(--header-h)}header.site .brand-wrap{display:flex;flex-direction:column;line-height:1.15}header.site .brand{font-weight:800;font-size:18px;color:var(--ink);letter-spacing:0}header.site .brand .jp{font-family:var(--font-ja);color:var(--indigo)}header.site .brand-sub{font-family:var(--font-ja);font-size:11px;color:var(--muted);margin-top:1px}.toggle-bar{display:flex;gap:6px;align-items:center;font-size:12.5px;color:var(--muted);margin-left:auto}.toggle-bar .tlabel{display:none}.toggle-bar button{font:inherit;border:1px solid var(--line);background:var(--card);color:var(--muted);padding:5px 11px;border-radius:var(--r-sm);cursor:pointer;transition:all .15s;font-weight:600;min-height:30px}.toggle-bar button.on{background:var(--indigo);color:var(--paper);border-color:var(--indigo)}.lv-badge{display:inline-flex;align-items:center;justify-content:center;font-weight:800;font-size:12px;color:var(--paper);background:var(--indigo);min-width:32px;height:23px;padding:0 8px;border-radius:var(--r-sm);letter-spacing:.03em}.lv-badge.muted{background:var(--muted)}.hero{padding:40px 0 8px}.hero .eyebrow{display:inline-block;font-size:12px;font-weight:700;color:var(--indigo);border-left:3px solid var(--vermilion);padding:2px 0 2px 10px;margin-bottom:14px;letter-spacing:.02em}.hero h1{font-size:clamp(26px,6vw,34px);margin:0 0 10px;font-weight:800;line-height:1.25}.hero h1 .grad{color:var(--indigo)}.hero p{color:var(--muted);margin:0;max-width:560px;font-size:15px}.feature-row{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0 0}.feature-row span{font-size:12.5px;color:var(--muted);background:var(--card);border:1px solid var(--line);padding:5px 12px;border-radius:var(--r-sm)}.level-grid{display:grid;grid-template-columns:1fr;gap:10px;padding:24px 0 12px}.level-card{position:relative;display:flex;align-items:center;gap:14px;background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);padding:16px 18px 16px 20px;transition:border-color .18s,transform .15s;overflow:hidden}.level-card:before{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:var(--indigo)}.level-card:hover{border-color:color-mix(in srgb,var(--indigo) 45%,var(--line));transform:translate(3px);text-decoration:none}.level-card h2{margin:0;font-size:18px}.level-card .sub{color:var(--muted);font-size:13.5px;flex:1}.level-card .cnt{color:var(--indigo);font-size:13px;font-weight:700;white-space:nowrap}.level-card.disabled{opacity:.6;pointer-events:none}.level-card.disabled:before{background:var(--muted)}.level-card.disabled .cnt{color:var(--muted)}.page-head{padding:26px 0 4px}.page-head .crumb{font-size:12.5px;color:var(--muted);margin-bottom:10px}.page-head .crumb a{color:var(--muted)}.page-head h1{margin:0;font-size:24px;display:flex;align-items:center;gap:11px}.page-head .zh{color:var(--muted);margin:6px 0 0;font-size:14px}.level-switch{display:flex;gap:7px;flex-wrap:wrap;margin:16px 0 4px}.level-switch a,.level-switch span{font-size:13px;font-weight:700;padding:6px 13px;border-radius:var(--r-sm);border:1px solid var(--line);color:var(--muted);background:var(--card)}.level-switch a:hover{border-color:var(--indigo);color:var(--indigo);text-decoration:none}.level-switch .cur{background:var(--indigo);color:var(--paper);border-color:var(--indigo)}.level-switch .off{opacity:.5}.unit-h{margin:26px 0 2px;font-size:12px;color:var(--muted);font-weight:700;letter-spacing:.06em;padding-bottom:6px;border-bottom:1px solid var(--line)}.lesson-row{display:flex;gap:14px;align-items:center;padding:13px 6px 13px 4px;border-bottom:1px solid var(--line-soft);transition:background .15s,padding-left .15s}.lesson-row:hover{background:var(--paper-soft);padding-left:10px;text-decoration:none}.lesson-row .no{color:var(--indigo);background:var(--indigo-soft);font-weight:800;font-size:13px;min-width:30px;height:26px;display:flex;align-items:center;justify-content:center;border-radius:var(--r-sm);font-variant-numeric:tabular-nums;flex:none}.lesson-row .ja{font-weight:700;color:var(--ink);font-family:var(--font-ja);font-size:15.5px}.lesson-row .zh{color:var(--muted);font-size:13px;margin-left:auto;text-align:right}.lesson-hero{position:relative;margin:18px 0 6px;padding:20px 20px 18px;background:var(--paper-soft);border:1px solid var(--line);border-radius:var(--r-lg);border-left:4px solid var(--vermilion);overflow:hidden}.lesson-hero .crumb{font-size:12.5px;color:var(--muted);margin-bottom:10px;position:relative;z-index:1}.lesson-hero .crumb a{color:var(--muted)}.lesson-hero h1{margin:0;font-size:26px;font-family:var(--font-ja);font-weight:800;position:relative;z-index:1}.lesson-hero .zh{color:var(--muted);margin:5px 0 0;font-size:15px;position:relative;z-index:1}.lesson-hero .crumb,.lesson-hero h1,.lesson-hero .zh{padding-right:112px}.lesson-hero .hero-art{position:absolute;right:18px;top:50%;transform:translateY(-50%);width:104px;height:70px;opacity:.92;color:var(--indigo);pointer-events:none}.lesson-hero .hero-art .ha-accent{stroke:var(--vermilion)}.lesson-hero .hero-art .ha-dot{fill:var(--vermilion);stroke:none}.cando{background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);padding:14px 18px;margin:16px 0}.cando h3{margin:0 0 8px;font-size:12.5px;color:var(--vermilion);font-weight:700;letter-spacing:.02em}.cando ul{margin:0;padding-left:18px}.cando li{margin:4px 0;font-size:14px}.secnav{position:sticky;top:var(--header-h);z-index:20;display:flex;gap:7px;overflow-x:auto;padding:8px 0;min-height:var(--secnav-h);align-items:center;background:color-mix(in srgb,var(--paper) 88%,transparent);backdrop-filter:blur(8px);margin:6px 0;-ms-overflow-style:none;scrollbar-width:none;border-bottom:1px solid var(--line-soft)}.secnav::-webkit-scrollbar{display:none}.secnav a{white-space:nowrap;font-size:13px;font-weight:600;color:var(--muted);background:var(--card);border:1px solid var(--line);padding:5px 13px;border-radius:var(--r-sm)}.secnav a:hover{color:var(--indigo);border-color:var(--indigo);text-decoration:none}section.block{margin:30px 0;scroll-margin-top:calc(var(--header-h) + var(--secnav-h) + 12px)}section.block>h2{font-size:19px;font-weight:800;margin:0 0 14px;padding-bottom:9px;border-bottom:2px solid var(--ink);display:flex;align-items:baseline;gap:9px}section.block>h2 small{color:var(--muted);font-weight:500;font-size:13.5px}.play{flex:none;border:1px solid var(--indigo);background:var(--card);color:var(--indigo);width:26px;height:26px;border-radius:50%;cursor:pointer;font-size:10px;line-height:1;display:inline-flex;align-items:center;justify-content:center;transition:all .15s;padding:0}.play:hover{background:var(--indigo);color:var(--paper)}.play.sm{width:22px;height:22px;font-size:9px}.ja-line .play.sm{margin-right:7px;vertical-align:middle}.play.playing{background:var(--vermilion);border-color:var(--vermilion);color:var(--paper)}.play.noaudio{opacity:.35;border-color:var(--line);color:var(--muted)}.vocab-list{display:flex;flex-direction:column}.vocab-entry{padding:14px 0;border-bottom:1px solid var(--line-soft)}.vocab-entry:first-child{padding-top:2px}.vocab-entry .vhead{display:flex;align-items:baseline;gap:10px}.vocab-entry .word{font-size:20px;font-weight:800;font-family:var(--font-ja);color:var(--ink)}.vocab-entry .vr{color:var(--muted);font-family:var(--font-ja);font-size:13.5px}.vocab-entry .pos{font-size:11px;color:var(--muted);border:1px solid var(--line);padding:1px 7px;border-radius:var(--r-sm)}.vocab-entry .tier{font-size:10.5px;padding:1px 8px;border-radius:var(--r-sm);font-weight:700;margin-left:auto;align-self:center}.tier-core{background:var(--matcha-soft);color:var(--matcha)}.tier-expansion{background:var(--indigo-soft);color:var(--indigo)}.vocab-entry .mean{margin:5px 0 0;color:var(--ink);font-weight:600;font-size:14.5px}.vocab-entry .ex{margin:9px 0 0;padding:2px 0 2px 12px;border-left:2px solid var(--line)}.vocab-entry .tip{font-size:13px;color:var(--muted);margin-top:8px;background:var(--paper-soft);padding:7px 11px;border-radius:var(--r-md)}.gcard{padding:18px 0;border-bottom:1px solid var(--line)}.gcard:last-child{border-bottom:none}.gcard .pat{font-size:19px;font-weight:800;font-family:var(--font-ja);color:var(--ink)}.gcard .struct{font-family:var(--font-ja);font-size:13px;background:var(--indigo-soft);color:var(--indigo);padding:7px 11px;border-radius:var(--r-md);margin:9px 0;display:inline-block}.gcard .exp{white-space:pre-line;color:var(--zh);font-size:14.5px}.gcard .sub{margin-top:13px}.gcard .sub h4{margin:0 0 5px;font-size:12px;color:var(--vermilion);font-weight:700;letter-spacing:.02em}.gcard .tip{font-size:13px;color:var(--muted);margin-top:8px;background:var(--paper-soft);padding:8px 12px;border-radius:var(--r-md)}.mistake .row{background:var(--paper-soft);border-radius:var(--r-md);padding:8px 12px;margin-bottom:6px}.mistake .w{color:var(--vermilion)}.mistake .c{color:var(--matcha);font-weight:600}.dialogue-wrap{margin-top:4px}.dline{display:flex;gap:9px;margin-bottom:12px;max-width:90%}.dline.right{margin-left:auto;flex-direction:row-reverse}.dline .avatar{flex:none;width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:var(--paper);background:var(--indigo);font-family:var(--font-ja)}.dline.right .avatar{background:var(--vermilion)}.dline .bubble{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);padding:9px 13px}.dline.right .bubble{background:var(--indigo-soft)}.dline .who{font-size:11.5px;color:var(--muted);margin-bottom:3px;font-family:var(--font-ja);display:flex;align-items:center;gap:7px}.culture{background:var(--paper-soft);border:1px solid var(--line);border-left:3px solid var(--vermilion);border-radius:var(--r-md);padding:13px 16px;font-size:14px;color:var(--zh);margin-top:12px}.quiz-item{padding:16px 0;border-bottom:1px solid var(--line)}.quiz-item:last-child{border-bottom:none}.quiz-item .q{font-weight:700;font-size:15px}.quiz-item .opt{display:block;width:100%;text-align:left;font:inherit;margin:8px 0;padding:11px 14px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--card);color:var(--ink);cursor:pointer;transition:all .14s;min-height:44px}.quiz-item .opt:hover{border-color:var(--indigo)}.quiz-item .opt.correct{background:var(--matcha-soft);border-color:var(--matcha);color:var(--matcha);font-weight:600}.quiz-item .opt.wrong{background:var(--vermilion-soft);border-color:var(--vermilion);color:var(--vermilion)}.quiz-item .expl{display:none;margin-top:9px;font-size:13.5px;color:var(--muted);background:var(--paper-soft);padding:10px 13px;border-radius:var(--r-md)}.quiz-item.answered .expl{display:block}.fill{font-family:var(--font-ja)}.fill-ans{cursor:pointer;padding:1px 4px;border-radius:var(--r-sm);background:var(--paper-soft)}.read-block{padding:4px 0}.read-block .ja-line{margin-bottom:2px}.listen-item{padding:12px 0;border-bottom:1px solid var(--line-soft)}.listen-item:last-child{border-bottom:none}.listen-head{display:flex;align-items:center;gap:9px;font-size:12.5px;color:var(--muted);margin-bottom:6px}.navfoot{display:flex;justify-content:space-between;margin:38px 0 60px;gap:12px}.navfoot a{background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);padding:13px 16px;font-size:14px;max-width:48%;font-family:var(--font-ja);transition:border-color .15s}.navfoot a:hover{border-color:var(--indigo);text-decoration:none}.navfoot .dir{display:block;font-size:11.5px;color:var(--muted);font-family:var(--font);margin-bottom:2px}footer.site{border-top:1px solid var(--line);color:var(--muted);font-size:12.5px;padding:26px 0;text-align:center}@media (min-width: 600px){.level-grid{grid-template-columns:1fr 1fr}.hero{padding:52px 0 8px}.lesson-hero{padding:26px 26px 22px}.lesson-hero h1{font-size:30px}}@media (min-width: 1024px){.toggle-bar .tlabel{display:inline}header.site .brand{font-size:19px}.page-head h1{font-size:28px}section.block>h2{font-size:20px}}@media (max-width: 599px){.wrap{width:min(100% - 28px,100%)}.lesson-hero .hero-art{width:76px;height:52px;right:12px}.lesson-hero .crumb,.lesson-hero h1,.lesson-hero .zh{padding-right:80px}.vocab-entry .mean{margin-left:0}}