:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg:#f6f3ec;--fg:#1f1c18;--muted:#625c53;--card:#fffdf9;--raised:#fff;--line:#e5dfd3;--ctl:#b9b1a3;--accent:#c8372d;--accent-press:#9b2a22;--accent-soft:#fbe9e5;--on-accent:#fff;--indigo:#2f4a7a;--indigo-soft:#e6ecf6;--good:#24723f;--good-soft:#e3f3e8;--bad:#b3261e;--bad-soft:#fbe7e6;--gold:#94600f;--radius:18px;--radius-s:12px;--shadow:0 1px 2px #3c28140f, 0 4px 14px #3c28140f;--dur-1:.12s;--dur-2:.22s;--ease-out:cubic-bezier(.2, .8, .2, 1);--z-nav:10;--z-feedback:20;--sidebar:15rem;-webkit-tap-highlight-color:transparent;font-family:system-ui,-apple-system,Hiragino Sans,Hiragino Kaku Gothic ProN,Noto Sans JP,Yu Gothic UI,sans-serif;line-height:1.45}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#141312;--fg:#efebe4;--muted:#aaa398;--card:#1e1c1a;--raised:#262321;--line:#36322d;--ctl:#5d574f;--accent:#f0675a;--accent-press:#b8483e;--accent-soft:#3b2220;--on-accent:#1a0f0d;--indigo:#9db4e0;--indigo-soft:#222b3b;--good:#6bc48a;--good-soft:#1c2e22;--bad:#f2837a;--bad-soft:#3a1f1d;--gold:#e3b062;--shadow:none}}:root[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#141312;--fg:#efebe4;--muted:#aaa398;--card:#1e1c1a;--raised:#262321;--line:#36322d;--ctl:#5d574f;--accent:#f0675a;--accent-press:#b8483e;--accent-soft:#3b2220;--on-accent:#1a0f0d;--indigo:#9db4e0;--indigo-soft:#222b3b;--good:#6bc48a;--good-soft:#1c2e22;--bad:#f2837a;--bad-soft:#3a1f1d;--gold:#e3b062;--shadow:none}*{box-sizing:border-box}body{background:var(--bg);color:var(--fg);margin:0}main{max-width:34rem;padding:max(1rem, env(safe-area-inset-top)) max(1rem, env(safe-area-inset-right)) calc(5.75rem + env(safe-area-inset-bottom)) max(1rem, env(safe-area-inset-left));margin:0 auto}main.focused{padding-bottom:calc(9rem + env(safe-area-inset-bottom))}h1{letter-spacing:.02em;margin:0;font-size:1.15rem}h1 small{color:var(--muted);font-size:.8rem;font-weight:500}h2{letter-spacing:-.01em;margin:0;font-size:1.3rem}h3,p[role=status],p[role=alert]{margin:0}.visually-hidden{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.icon{flex:none}ruby rt{color:var(--muted);font-size:.45em}kbd{opacity:.55;margin-left:.35em;font-family:inherit;font-size:.7em}@media (pointer:coarse){kbd{display:none}}button,select,input{font:inherit;color:var(--fg);min-height:2.75rem}button{cursor:pointer;touch-action:manipulation;border:1.5px solid var(--line);border-radius:var(--radius-s);background:var(--raised);box-shadow:0 2px 0 var(--line);padding:.6rem 1.1rem;font-weight:500;transition:transform 60ms,box-shadow 60ms,background .15s,border-color .15s}button:hover:not(:disabled){border-color:var(--ctl)}button:active:not(:disabled){box-shadow:0 0 0 var(--line);transform:translateY(2px)}button:disabled{opacity:.5;cursor:default}button.primary{background:var(--accent);border-color:var(--accent);color:var(--on-accent);box-shadow:0 3px 0 var(--accent-press);font-weight:650}button.primary:hover:not(:disabled){border-color:var(--accent);filter:brightness(1.04)}button.primary:active:not(:disabled){box-shadow:0 0 0 var(--accent-press);transform:translateY(3px)}button.big{min-height:3.5rem;font-size:1.1rem}.speak-btns{align-items:center;gap:.35rem;display:inline-flex}button.icon-btn.slow{min-width:2.4rem;padding:.4rem}button.icon-btn{min-width:2.75rem;color:var(--indigo);border-radius:999px;justify-content:center;align-items:center;padding:.5rem;display:inline-flex}button.ghost{box-shadow:none;color:var(--muted);background:0 0;border-color:#0000}select,input{border:1.5px solid var(--line);border-radius:var(--radius-s);background:var(--raised);padding:.6rem 1rem}input{text-align:center;width:100%;font-size:1.3rem}input:focus{border-color:var(--indigo)}input[type=search]{text-align:left;font-size:1.1rem}input[type=file]{text-align:left;padding:.5rem;font-size:1rem}input[type=file]::file-selector-button{font:inherit;border:1.5px solid var(--line);background:var(--bg);color:var(--fg);cursor:pointer;border-radius:10px;margin-right:.75rem;padding:.45rem .9rem}button:focus-visible,select:focus-visible,input:focus-visible,summary:focus-visible,a:focus-visible{outline:3px solid var(--indigo);outline-offset:2px}label{flex-direction:column;gap:.3rem;width:100%;font-size:.9rem;font-weight:500;display:flex}label.check{flex-direction:row;align-items:center;gap:.6rem;font-weight:400}label.check input{width:1.2rem;height:1.2rem;min-height:0;accent-color:var(--accent);flex:none}label.grow{gap:.35rem;width:100%}progress{appearance:none;background:var(--line);border:0;border-radius:999px;width:100%;height:.7rem;overflow:hidden}progress::-webkit-progress-bar{background:var(--line);border-radius:999px}progress::-webkit-progress-value{background:var(--accent);border-radius:999px;transition:width .3s}progress::-moz-progress-bar{background:var(--accent);border-radius:999px}a{color:var(--accent)}.brand{letter-spacing:-.01em;white-space:nowrap;align-items:center;gap:.5rem;font-size:1.1rem;font-weight:750;display:flex}.brand small{color:var(--muted);font-size:.8rem;font-weight:500}header.appbar{z-index:var(--z-nav);min-height:3.5rem;padding:max(.5rem, env(safe-area-inset-top)) max(1rem, env(safe-area-inset-right)) .5rem max(1rem, env(safe-area-inset-left));background:color-mix(in srgb, var(--bg) 85%, transparent);-webkit-backdrop-filter:blur(12px);justify-content:space-between;align-items:center;gap:.75rem;display:flex;position:sticky;top:0}header.appbar+main{padding-top:.5rem}button.account-btn:not(.icon-btn){white-space:nowrap;border-radius:999px;min-height:2.5rem;padding:.35rem 1rem;font-size:.92rem;font-weight:650}button.account-btn.icon-btn{color:var(--fg)}button.account-btn[aria-current=page]{border-color:var(--accent);color:var(--accent)}nav.tabs{z-index:var(--z-nav);background:color-mix(in srgb, var(--card) 92%, transparent);-webkit-backdrop-filter:blur(12px);border-top:1px solid var(--line);padding:.3rem max(.5rem, env(safe-area-inset-right)) max(.3rem, env(safe-area-inset-bottom)) max(.5rem, env(safe-area-inset-left));grid-template-columns:repeat(5,1fr);display:grid;position:fixed;inset:auto 0 0}nav.tabs .brand{display:none}nav.tabs button:not(.account-btn){box-shadow:none;color:var(--muted);min-height:3.25rem;transition:background var(--dur-1), color var(--dur-1);background:0 0;border:0;border-radius:14px;flex-direction:column;align-items:center;gap:.1rem;padding:.3rem .25rem;font-size:.72rem;display:flex}nav.tabs button:active{transform:none}nav.tabs button[aria-current=page]{color:var(--accent);font-weight:650}nav.tabs button[aria-current=page] .icon{background:var(--accent-soft);box-sizing:content-box;border-radius:999px;padding:2px 14px}@media (width>=48rem){nav.tabs{border-top:0;border-bottom:1px solid var(--line);align-items:center;gap:.25rem;padding:.45rem 1.25rem;display:flex;inset:0 0 auto}nav.tabs .brand{margin-right:auto;display:flex}nav.tabs .brand small{display:none}nav.tabs .account-btn{margin-left:auto}nav.tabs button:not(.account-btn){flex-direction:row;justify-content:center;gap:.45rem;min-height:2.75rem;padding:.5rem .8rem;font-size:.95rem}nav.tabs button:not(.account-btn):hover{background:color-mix(in srgb, var(--fg) 5%, transparent);color:var(--fg)}nav.tabs button[aria-current=page],nav.tabs button[aria-current=page]:hover{background:var(--accent-soft);color:color-mix(in srgb, var(--accent) 75%, var(--fg))}nav.tabs button[aria-current=page] .icon{background:0 0;padding:0}html{scroll-padding-top:5rem}main{max-width:42rem;padding-top:5.25rem;padding-bottom:2.5rem}main.focused{padding-top:1.5rem;padding-bottom:10rem}.prompt.gloss{font-size:2.4rem}.kana{font-size:7rem}}@media (width>=64rem){nav.tabs{width:var(--sidebar);border-bottom:0;border-right:1px solid var(--line);background:var(--card);flex-direction:column;align-items:stretch;gap:.15rem;padding:1.25rem .85rem;inset:0 auto 0 0;overflow-y:auto}nav.tabs .brand{margin:0 0 1.25rem .55rem}nav.tabs .brand small{display:inline}nav.tabs button:not(.account-btn){justify-content:flex-start;gap:.7rem}.nav-more{border-top:1px solid var(--line);gap:.15rem;margin-top:.9rem;padding-top:.9rem;display:grid}.nav-more button:not(.account-btn){min-height:2.5rem;padding-left:1rem;font-size:.92rem}nav.tabs{-webkit-backdrop-filter:none}nav.tabs .account-btn{margin:0;position:fixed;top:1rem;right:1.5rem}html{scroll-padding-top:1.5rem}main.with-nav{max-width:46rem;margin-left:max(calc(var(--sidebar) + 1rem), calc(var(--sidebar) + (100vw - var(--sidebar) - 46rem) / 2));padding-top:4.5rem}}.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);flex-direction:column;align-items:center;gap:1rem;padding:1.25rem;display:flex}.card+.card,.card+details.card,section+.card,.card+section{margin-top:1rem}.card.form{align-items:stretch}.card.form h2{text-align:left}.card.form>p{margin:0}.card.form>button.primary,.card.form .row2{align-self:flex-start}.hero{text-align:center;align-items:stretch}.hero p{margin:0}.eyebrow{letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0;font-size:.75rem;font-weight:700}.row,.grid{gap:.6rem;width:100%;display:grid}.row{grid-template-columns:repeat(4,1fr)}.grid{grid-template-columns:1fr 1fr}@media (width<=400px){.row{grid-template-columns:1fr 1fr}}.row2{flex-wrap:wrap;justify-content:center;gap:.6rem;display:flex}.good{color:var(--good)}.bad{color:var(--bad)}dl{grid-template-columns:1fr auto;gap:.5rem 1rem;width:100%;margin:0;display:grid}dd{text-align:right;font-variant-numeric:tabular-nums;margin:0;font-weight:600}.hint{text-align:center;color:var(--muted);margin:0}.counts{margin:0;font-size:1.2rem;font-weight:600}.greeting{justify-content:space-between;align-items:center;gap:.75rem;margin-bottom:1rem;display:flex}.greeting h2{font-size:1.6rem}.greeting .sub{color:var(--muted);margin:.1rem 0 0}.chips-row{flex-wrap:wrap;gap:.5rem;display:flex}.chip{background:var(--card);border:1px solid var(--line);font-variant-numeric:tabular-nums;border-radius:999px;align-items:center;gap:.3rem;padding:.3rem .7rem;font-weight:650;display:inline-flex}.chip.streak{color:var(--accent)}.chip.streak.off{color:var(--muted)}.goal{align-items:center;gap:1rem;width:100%;display:flex}.streak-badge{background:color-mix(in srgb, var(--accent) 14%, transparent);width:3.5rem;height:3.5rem;color:var(--accent);border-radius:50%;flex:none;place-items:center;display:grid}.streak-badge.off{background:var(--line);color:var(--muted)}.ring{--p:0;font-variant-numeric:tabular-nums;background:radial-gradient(closest-side, var(--card) 76%, transparent 77% 100%), conic-gradient(var(--accent) calc(var(--p) * 1%), var(--line) 0);border-radius:50%;flex:none;place-items:center;width:4.5rem;height:4.5rem;font-weight:700;display:grid}.ring.met{background:radial-gradient(closest-side, var(--card) 76%, transparent 77% 100%), conic-gradient(var(--good) 100%, var(--line) 0);color:var(--good)}.goal p{text-align:left;margin:0}.next-card{text-align:left;align-items:stretch;gap:.75rem}.next-card .title{align-items:center;gap:.9rem;display:flex}.next-card .title strong{font-size:1.25rem;display:block}.next-card .title small{color:var(--muted)}.badge{background:var(--accent-soft);width:3.25rem;height:3.25rem;color:var(--accent);border-radius:16px;flex:none;place-items:center;font-size:1.6rem;font-weight:700;display:grid}.badge.k-kanji{background:var(--indigo-soft);color:var(--indigo)}.badge.k-grammar{background:color-mix(in srgb, var(--gold) 18%, var(--card));color:var(--gold)}.review-card{text-align:left;flex-direction:row;align-items:center;gap:.9rem}.review-text{flex:1;min-width:0}.review-card .review-text strong{font-size:1.1rem;display:block}.review-card small{color:var(--muted)}.review-count{background:var(--good-soft);width:3.25rem;height:3.25rem;color:var(--good);border-radius:16px;flex:none;place-items:center;display:grid}.review-count strong{font-variant-numeric:tabular-nums;font-size:1.35rem}.review-card.due .review-count{background:var(--accent-soft);color:var(--accent)}.streak-card{align-items:stretch}ol.week{border-top:1px solid var(--line);grid-template-columns:repeat(7,1fr);gap:.25rem;margin:0;padding:.9rem 0 0;list-style:none;display:grid}ol.week li{flex-direction:column;align-items:center;gap:.3rem;display:flex}ol.week .dot{border:2px solid var(--line);width:2rem;height:2rem;color:var(--on-accent);border-radius:50%;place-items:center;display:grid}ol.week li.on .dot{background:var(--accent);border-color:var(--accent)}ol.week li.today:not(.on) .dot{border-color:var(--accent);border-style:dashed}ol.week small{color:var(--muted);font-size:.72rem;font-weight:600}ol.week li.today small{color:var(--fg)}details.section{margin-top:1.25rem}details.section>summary{cursor:pointer;justify-content:space-between;align-items:baseline;gap:.5rem;padding:.25rem .25rem .6rem;list-style:none;display:flex}details.section>summary::-webkit-details-marker{display:none}details.section>summary h2{font-size:1.15rem}details.section>summary h2:before{content:"▸ " / "";color:var(--muted)}details.section[open]>summary h2:before{content:"▾ " / ""}details.section>summary small{color:var(--muted);font-weight:600}details.section>.card+.card{margin-top:.75rem}details.unit{align-items:stretch;gap:.75rem}details.unit:not([open]){padding-block:.9rem}details.unit summary{cursor:pointer;align-items:center;gap:.6rem;list-style:none;display:flex}details.unit summary::-webkit-details-marker{display:none}details.unit summary strong{flex:1}details.unit summary small{color:var(--muted);font-variant-numeric:tabular-nums;font-weight:600}details.unit summary .mini{width:3.5rem;height:.4rem}details.unit>p{color:var(--muted);margin:0;font-size:.9rem}ul.lessons{gap:.45rem;margin:0;padding:0;list-style:none;display:grid}ul.lessons button{text-align:left;align-items:center;gap:.75rem;width:100%;padding:.5rem .8rem .5rem .5rem;display:flex}ul.lessons .node{background:var(--bg);border:2px solid var(--line);width:2.4rem;height:2.4rem;color:var(--muted);border-radius:50%;flex:none;place-items:center;font-weight:700;display:grid}ul.lessons .label{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}ul.lessons small{white-space:nowrap;color:var(--muted);font-size:.8rem;font-weight:600}ul.lessons button.done .node{background:var(--good-soft);border-color:var(--good);color:var(--good)}ul.lessons button.done small{color:var(--good)}ul.lessons button.primary .node{background:var(--on-accent);border-color:var(--on-accent);color:var(--accent)}ul.lessons button.primary small{color:var(--on-accent)}ul.lessons button:disabled{opacity:.6;box-shadow:none}button.test-out{box-shadow:none;color:var(--indigo);border-style:dashed;align-self:flex-start}ul.menu{gap:.6rem;margin:0;padding:0;list-style:none;display:grid}ul.menu button{text-align:left;background:var(--card);border-radius:var(--radius);flex-direction:column;gap:.1rem;width:100%;padding:1rem 1.1rem;display:flex}ul.menu small{color:var(--muted);font-weight:400}.bar{align-items:center;gap:.75rem;margin-bottom:1rem;display:flex}.bar progress{flex:1;height:.9rem}.bar .left{color:var(--muted);font-variant-numeric:tabular-nums;font-weight:600}.q{text-align:center;color:var(--muted);margin:0;font-size:1.05rem;font-weight:600}.kana{font-size:6rem;line-height:1.1}.prompt.gloss{text-align:center;overflow-wrap:anywhere;font-size:2rem;font-weight:600}.prompt.sentence{font-size:1.6rem;line-height:1.5}.reading{color:var(--muted);font-size:1.2rem}.kanji-readings{color:var(--muted);text-align:center;margin:0;font-size:1.1rem}.kanji-example{flex-wrap:wrap;justify-content:center;align-items:center;gap:.5rem;margin:0;display:flex}.kanji-example [lang]{font-size:1.4rem}.answer{text-align:center;flex-wrap:wrap;justify-content:center;align-items:center;gap:.5rem;font-size:1.6rem;display:flex}.note{text-align:center;color:var(--muted);margin:0;font-size:.9rem}.mnemonic{border-radius:var(--radius-s);background:var(--accent-soft);color:var(--fg);text-align:center;text-wrap:balance;margin:0;padding:.45rem .75rem;font-size:.95rem}.example{border-left:3px solid var(--indigo);border-radius:0 var(--radius-s) var(--radius-s) 0;background:var(--indigo-soft);text-align:left;box-sizing:border-box;width:100%;margin:0;padding:.55rem .8rem}.example p{flex-wrap:wrap;align-items:center;gap:.25rem .5rem;margin:0;font-size:1.15rem;display:flex}.example .speak-btns{margin-left:auto}.example figcaption{color:var(--muted);margin-top:.15rem;font-size:.95rem}.card.weak ul{gap:.1rem;margin:0;padding:0;list-style:none;display:grid}.card.weak li{text-align:left;border-bottom:1px solid var(--line);grid-template-columns:auto 1fr auto;align-items:baseline;gap:.75rem;padding:.5rem 0;display:grid}.card.weak li:last-child{border-bottom:0}.card.weak .jp{font-size:1.3rem;font-weight:600}.card.weak .gloss{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.card.weak small{color:var(--muted);white-space:nowrap}.mnemonic p{margin:0}.mnemonic p+p{margin-top:.25rem}.mnemonic .label{color:var(--muted)}.mnemonic [lang=ja]{font-size:1.15em;font-weight:600}.jp-option{font-size:1.5rem}.grid button,.match button{border-width:2px;min-height:3.5rem}.grid.wide{grid-template-columns:1fr}.grid.wide button{text-align:left}button.good,.grid button.good,.match button.good{background:var(--good-soft);border-color:var(--good);color:var(--good);opacity:1}button.bad,.grid button.bad{background:var(--bad-soft);border-color:var(--bad);color:var(--bad);opacity:1}button.selected,button[aria-pressed=true]{border-color:var(--indigo);background:var(--indigo-soft);box-shadow:0 2px 0 var(--indigo)}.match{grid-template-columns:1fr 1fr;gap:.6rem;width:100%;display:grid}.match>div{align-content:start;gap:.6rem;display:grid}.feedback{z-index:var(--z-feedback);padding:1rem max(1rem, env(safe-area-inset-right)) calc(1rem + env(safe-area-inset-bottom)) max(1rem, env(safe-area-inset-left));border-top:2px solid;gap:.25rem;font-size:1.1rem;font-weight:650;animation:.18s ease-out rise;display:grid;position:fixed;bottom:0;left:0;right:0}.feedback>*{width:100%;max-width:40rem;margin-inline:auto}.feedback small{display:block}.feedback .memo-hint{margin-top:.25rem;font-style:italic}.feedback small{color:var(--fg);opacity:.9;font-size:.9rem;font-weight:400}.feedback.good{background:var(--good-soft);border-color:var(--good);color:var(--good)}.feedback.bad{background:var(--bad-soft);border-color:var(--bad);color:var(--bad)}.feedback button.primary{justify-self:center;width:100%;max-width:40rem;min-height:3.25rem;margin-top:.5rem;font-size:1.05rem}.feedback.good button.primary{background:var(--good);border-color:var(--good);box-shadow:0 3px 0 color-mix(in srgb, var(--good) 70%, black);color:var(--card)}.match .feedback,.match+.feedback.inline{position:static}.feedback.inline{border-radius:var(--radius-s);border:2px solid;font-size:1rem;animation:none;position:static}@keyframes rise{0%{transform:translateY(100%)}}@media (prefers-reduced-motion:reduce){.feedback{animation:none}}.answer-slot{flex-direction:column;align-items:center;gap:1rem;width:100%;display:flex}.answer-slot:focus{outline:none}.preview{text-align:center;min-height:1.6em;font-size:1.6rem}.preview .pending{opacity:.6}.chips{flex-wrap:wrap;justify-content:center;gap:.5rem;width:100%;display:flex}.chips button{font-size:1.25rem}.chips button.used{opacity:.3;box-shadow:none}.answer-row{border-bottom:2px solid var(--line);align-items:center;min-height:3.75rem;padding-bottom:.6rem}.answer-row .placeholder{color:var(--muted)}.prompt.sentence,ul.examples .jp,.preview,.feedback small{word-break:keep-all;overflow-wrap:anywhere}.explain h2{text-align:center;margin:0}.explain p{text-align:left;width:100%;margin:0;line-height:1.55}ul.examples{gap:.6rem;width:100%;margin:0;padding:0;list-style:none;display:grid}ul.examples li{border:1px solid var(--line);border-radius:var(--radius-s);background:var(--raised);flex-direction:column;gap:.15rem;padding:.7rem .9rem;display:flex}ul.examples .jp{font-size:1.25rem}.jpline{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.5rem;display:flex}.heard{text-align:center;min-height:1.5em;color:var(--muted)}button.mic{align-items:center;gap:.5rem;display:inline-flex}.test-label{margin:0 0 .75rem}@media (width<=47.99rem){main.focused:has(>.lesson){padding-bottom:calc(1rem + env(safe-area-inset-bottom))}.lesson{min-height:calc(100dvh - max(1rem, env(safe-area-inset-top)) - 1rem - env(safe-area-inset-bottom));transition:padding-bottom var(--dur-2) var(--ease-out);flex-direction:column;display:flex}.lesson>.card:not(form){flex:1}.lesson>.card:not(form)>:is(.kana,.prompt,.strokes){margin-block:auto}.lesson>.card>:is(.kana,.strokes):has(+.answer,+.reading){margin-block:auto 0}.lesson>.card>.match{margin-top:auto}.lesson>.card>:has(+button.primary:last-child){margin-bottom:auto}.lesson>.card>button.primary:last-child{align-self:stretch;min-height:3.5rem;font-size:1.1rem}.lesson>.card>.grid button,.lesson>.card>.match button{min-height:3.75rem}.lesson:has(.feedback:not(.inline).good,.feedback:not(.inline).bad){padding-bottom:11rem}}@media (width<=47.99rem) and (prefers-reduced-motion:reduce){.lesson{transition:none}}.done-card{text-align:center;padding-block:2rem;position:relative;overflow:hidden}.done-card h2{font-size:1.8rem}.tiles{grid-template-columns:repeat(3,1fr);gap:.6rem;width:100%;display:grid}.tile{border:2px solid var(--line);border-radius:var(--radius-s);gap:.1rem;padding:.6rem .25rem;display:grid}.tile strong{font-variant-numeric:tabular-nums;font-size:1.4rem}.tile small{color:var(--muted);text-transform:uppercase;letter-spacing:.05em;font-size:.75rem;font-weight:600}.tile.xp strong{color:var(--gold)}.tile.acc strong{color:var(--good)}.tile.streak strong{color:var(--accent)}.done-card .actions{gap:.6rem;width:100%;display:grid}.confetti{pointer-events:none;position:absolute;inset:0}.confetti i{border-radius:2px;width:8px;height:14px;animation:1.6s ease-in forwards fall;position:absolute;top:-10px}@keyframes fall{to{opacity:0;transform:translateY(26rem)rotate(540deg)}}@media (prefers-reduced-motion:reduce){.confetti{display:none}}.grades{grid-template-columns:repeat(4,1fr);gap:.5rem;width:100%;display:grid}.grades button{border-width:2px;gap:.05rem;padding:.5rem .25rem;font-weight:650;display:grid}.grades button small{font-size:.75rem;font-weight:500}.grades .again{color:var(--bad);border-color:color-mix(in srgb, var(--bad) 45%, var(--line))}.grades .hard{color:var(--gold);border-color:color-mix(in srgb, var(--gold) 45%, var(--line))}.grades .good-g{color:var(--good);border-color:color-mix(in srgb, var(--good) 45%, var(--line))}.grades .easy{color:var(--indigo);border-color:color-mix(in srgb, var(--indigo) 45%, var(--line))}@media (width<=360px){.grades{grid-template-columns:1fr 1fr}}.html{text-align:center;overflow-wrap:anywhere;width:100%;font-size:1.5rem}.html img{object-fit:contain;width:auto;max-width:100%;height:auto;max-height:40vh}.html audio{width:100%}.html .cloze{color:var(--accent);font-weight:600}.html rt{font-size:.5em}ul.decks{gap:.5rem;width:100%;margin:0;padding:0;list-style:none;display:grid}ul.decks li{justify-content:space-between;align-items:center;gap:.5rem;display:flex}ul.links li{flex-direction:column;align-items:flex-start;gap:.15rem}ul.links a{font-weight:650}ul.results{gap:.5rem;width:100%;margin:0;padding:0;list-style:none;display:grid}ul.results details{border:1px solid var(--line);border-radius:var(--radius-s);background:var(--raised);padding:.6rem .8rem}ul.results summary{cursor:pointer;flex-wrap:wrap;align-items:baseline;gap:.25rem .5rem;display:flex}ul.results summary .jp{font-size:1.4rem}ul.results .gloss{flex:10rem}ul.results .tags{gap:.25rem;display:flex}ul.results a{font-weight:650}.tag{border:1px solid var(--line);color:var(--muted);white-space:nowrap;border-radius:999px;padding:.05rem .55rem;font-size:.72rem;font-weight:600}.tag.guru,.tag.master,.tag.burned{color:var(--good);border-color:var(--good)}.tag.apprentice{color:var(--accent);border-color:var(--accent)}.detail{flex-direction:column;align-items:center;gap:.3rem;margin-top:.6rem;display:flex}.detail p{margin:0}.grammar-level h3{color:var(--muted);text-transform:uppercase;letter-spacing:.08em;margin:.5rem 0;font-size:.8rem}.explain-body{flex-direction:column;gap:.6rem;margin-top:.6rem;display:flex}.explain-body p{margin:0;line-height:1.55}.levels{gap:1rem;width:100%;display:grid}.levels h3{margin:0 0 .25rem;font-size:1rem}label.meter{flex-direction:row;grid-template-columns:4.5rem 1fr auto;align-items:center;gap:.6rem;font-weight:500;display:grid}label.meter small{color:var(--muted);font-variant-numeric:tabular-nums;text-align:right;min-width:6.5rem}ul.stages{grid-template-columns:repeat(4,1fr);gap:.5rem;margin:0;padding:0;list-style:none;display:grid}ul.stages li{border-radius:var(--radius-s);background:var(--raised);border:1px solid var(--line);text-align:center;flex-direction:column;align-items:center;gap:.1rem;padding:.7rem .25rem;display:flex}ul.stages strong{font-size:1.5rem}ul.stages small{color:var(--muted);font-size:.7rem;line-height:1.2}.stage.apprentice strong{color:#c2185b}.stage.guru strong{color:#7b1fa2}.stage.master strong{color:#1565c0}.stage.burned strong{color:var(--fg)}:root[data-theme=dark] .stage strong{filter:brightness(1.6)}@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .stage strong{filter:brightness(1.6)}}@media (width<=400px){ul.stages{grid-template-columns:1fr 1fr}}ol.forecast{grid-template-columns:repeat(7,1fr);align-items:end;gap:.35rem;height:8rem;margin:0;padding:0;list-style:none;display:grid}ol.forecast li{flex-direction:column;justify-content:flex-end;align-items:center;gap:.15rem;height:100%;display:flex}ol.forecast .bar{background:var(--indigo);border-radius:6px 6px 0 0;width:70%;min-height:2px;margin:0}ol.forecast small{color:var(--muted);font-size:.75rem}.heatmap{grid-template-rows:repeat(7,1fr);grid-auto-flow:column;gap:3px;width:100%;display:grid}.heatmap span{aspect-ratio:1;background:var(--line);border-radius:3px}.heatmap .future{background:0 0}.heatmap .l1{background:color-mix(in srgb, var(--accent) 30%, var(--card))}.heatmap .l2{background:color-mix(in srgb, var(--accent) 55%, var(--card))}.heatmap .l3{background:color-mix(in srgb, var(--accent) 80%, var(--card))}.heatmap .l4{background:var(--accent)}.kanji-readings{grid-template-columns:auto 1fr;gap:.25rem .75rem;width:100%;margin:0;display:grid}.kanji-readings dt{color:var(--muted)}.kanji-readings dd{text-align:left;margin:0;font-size:1.15rem;font-weight:500}.strokes{flex-direction:column;align-items:center;gap:.5rem;display:flex}.strokes svg{fill:none;stroke-linecap:round;stroke-linejoin:round;border:1px dashed var(--line);border-radius:var(--radius-s);background:var(--raised);width:9rem;height:9rem}.strokes .guide{stroke:var(--line);stroke-width:3.5px}.strokes .stroke{stroke:var(--fg);stroke-width:3.5px;stroke-dasharray:1;animation:.5s ease-in both draw}@keyframes draw{0%{stroke-dashoffset:1px;opacity:0}1%{opacity:1}to{stroke-dashoffset:0;opacity:1}}@media (prefers-reduced-motion:reduce){.strokes .stroke{stroke-dashoffset:0;animation:none}}.writeboard{flex-direction:column;align-items:center;gap:.5rem;width:100%;display:flex}.writeboard svg{aspect-ratio:1;touch-action:none;border:1.5px solid var(--line);border-radius:var(--radius);background:var(--raised);fill:none;stroke-linecap:round;stroke-linejoin:round;cursor:crosshair;width:min(80vw,18rem)}.writeboard .grid{stroke:var(--line);stroke-width:.6px;stroke-dasharray:2 2}.writeboard .guide{stroke:var(--line);stroke-width:4px}.writeboard .hint-stroke{stroke:var(--accent);stroke-width:4px;opacity:.35}.writeboard .start{fill:var(--accent);stroke:none}.writeboard .ink{stroke:var(--fg);stroke-width:4px}.writeboard .pen{stroke:var(--accent);stroke-width:4px}.writeboard p{min-height:1.5em;margin:0}.page-head{margin:.25rem 0 1rem}.page-head h2{font-size:1.6rem}.page-head p{color:var(--muted);margin:.2rem 0 0}.section-title{text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin:1.5rem 0 .6rem;font-size:.8rem}.hint.left,.row2.left{text-align:left;justify-content:flex-start}.review-hero{align-items:stretch}.review-hero .due{align-items:center;gap:1rem;display:flex}.big-number{color:var(--accent);font-variant-numeric:tabular-nums;text-align:center;min-width:3.5rem;font-size:3rem;font-weight:750;line-height:1}details.options summary{cursor:pointer;color:var(--muted);font-size:.9rem;font-weight:600}details.options[open]{gap:.75rem;display:grid}ul.tiles-grid{grid-template-columns:repeat(auto-fill,minmax(10rem,1fr));gap:.75rem;margin:0;padding:0;list-style:none;display:grid}button.tile-btn{text-align:left;border-radius:var(--radius);background:var(--card);align-content:start;gap:.3rem;width:100%;height:100%;padding:1rem;display:grid}button.tile-btn small{color:var(--muted);font-weight:400;line-height:1.35}button.tile-btn{transition:border-color var(--dur-1), transform var(--dur-1), box-shadow var(--dur-1)}button.tile-btn:disabled{opacity:1;box-shadow:none;background:0 0;border-style:dashed}button.tile-btn:disabled strong,button.tile-btn:disabled .tile-icon{opacity:.6}button.tile-btn .why{color:var(--muted);align-items:flex-start;gap:.3rem;display:inline-flex}.tile-icon{background:var(--indigo-soft);width:2.5rem;height:2.5rem;color:var(--indigo);border-radius:12px;place-items:center;margin-bottom:.2rem;display:grid}.form-label{color:var(--indigo);margin:0;font-weight:650}.skeleton{border-radius:var(--radius);background:linear-gradient(90deg, var(--line) 25%, var(--card) 50%, var(--line) 75%);background-size:200% 100%;height:6rem;animation:1.2s linear infinite shimmer}.skeleton.tall{height:18rem}.skeleton+.skeleton{margin-top:1rem}@keyframes shimmer{to{background-position:-200% 0}}@media (prefers-reduced-motion:reduce){.skeleton{animation:none}}.card.empty{text-align:center;padding-block:2rem}ul.story-list{gap:.75rem;margin:0;padding:0;list-style:none;display:grid}.story-card{align-items:stretch}.story-head{text-align:center}.story-head h2{font-size:1.6rem}ol.story{gap:.9rem;margin:0;padding:0;list-style:none;display:grid}ol.story li{border-radius:var(--radius-s);padding:.6rem .7rem;transition:background .2s}ol.story li.playing{background:var(--indigo-soft)}.jp-line{word-break:keep-all;overflow-wrap:anywhere;margin:0;font-size:1.35rem;line-height:2.1}button.word{all:unset;cursor:pointer;border-radius:6px;padding:0 .05em}button.word:hover{background:var(--accent-soft)}button.word:focus-visible{outline:2px solid var(--indigo)}.line-tools{align-items:center;gap:.5rem;min-height:2.75rem;display:flex}.line-tools .en{color:var(--muted);margin:0}.lookup-pop{z-index:5;border-radius:var(--radius-s);background:var(--raised);border:1.5px solid var(--indigo);box-shadow:var(--shadow);align-items:center;gap:.75rem;padding:.6rem .8rem;display:flex;position:sticky;top:.5rem}.lookup-pop .jp{font-size:1.5rem;font-weight:600}.lookup-pop span:nth-child(2){flex:1}fieldset.question{border:0;gap:.5rem;margin:0;padding:0;display:grid}fieldset.question legend{margin-bottom:.4rem;font-weight:650}.segmented{background:var(--line);border-radius:14px;grid-auto-flow:column;gap:.25rem;margin-bottom:1rem;padding:.25rem;display:grid}.segmented button{box-shadow:none;color:var(--muted);background:0 0;border:0;border-radius:11px;font-weight:600}.segmented button[aria-selected=true]{background:var(--card);color:var(--fg);box-shadow:var(--shadow)}.kana-block{width:100%}.kana-block .section-title{margin-top:.25rem}.kana-grid{gap:.4rem;display:grid}button.kana-cell{place-items:center;gap:0;min-height:3.6rem;padding:.4rem .2rem;display:grid}button.kana-cell span{font-size:1.5rem;line-height:1.1}button.kana-cell small{color:var(--muted);font-size:.72rem}button.kana-cell.known{background:var(--good-soft);border-color:color-mix(in srgb, var(--good) 45%, var(--line))}.card.account{text-align:center;align-items:center;gap:.9rem;max-width:26rem;margin:1rem auto 0}.card.account h2{margin:0}.account-icon{background:var(--accent-soft);width:3.5rem;height:3.5rem;color:var(--accent);border-radius:50%;place-items:center;display:grid}.card.account form{text-align:left;flex-direction:column;gap:.9rem;width:100%;display:flex}.card.account .field{flex-direction:column;gap:.35rem;display:flex}.card.account label{flex-direction:column;gap:.35rem;font-size:.95rem;font-weight:600;display:flex}.card.account .big{width:100%}.card.account .note{color:var(--fg);background:var(--accent-soft);border-radius:var(--radius-s);padding:.6rem .8rem}input[type=email],input[type=password]{text-align:left;font-size:1rem}input:-webkit-autofill{-webkit-box-shadow:0 0 0 100px var(--raised,var(--card)) inset;-webkit-text-fill-color:var(--fg);caret-color:var(--fg)}.password{display:block;position:relative}.password input{padding-right:4.5rem}.password button{min-height:2.25rem;box-shadow:none;color:var(--indigo);background:0 0;border:0;padding:.2rem .7rem;font-size:.85rem;font-weight:650;position:absolute;top:50%;right:.3rem;transform:translateY(-50%)}.password button:active:not(:disabled){transform:translateY(-50%)}.link-btn{box-shadow:none;min-height:0;color:var(--accent);font:inherit;text-underline-offset:2px;cursor:pointer;background:0 0;border:0;padding:0;font-weight:650;text-decoration:underline}.logo{border-radius:7px;flex:none}.about-head{align-items:center;gap:.9rem;display:flex}.about-head .logo{border-radius:12px}.about-head h2 small{color:var(--muted);font-size:.9rem;font-weight:500}.welcome{max-width:28rem;margin:0 auto;padding-top:1rem}.welcome .dots{justify-content:center;gap:.4rem;margin-bottom:1.5rem;display:flex}.welcome .dots span{background:var(--line);border-radius:50%;width:.5rem;height:.5rem;transition:width .2s}.welcome .dots span.on{background:var(--accent);border-radius:999px;width:1.5rem}.welcome-step{text-align:center;flex-direction:column;align-items:center;gap:1.25rem;animation:.25s ease-out fade;display:flex}.welcome-step h2{font-size:1.8rem;line-height:1.2}.welcome-step .logo{box-shadow:var(--shadow);border-radius:18px}ul.features{text-align:left;gap:.9rem;width:100%;margin:0;padding:0;list-style:none;display:grid}ul.features li{align-items:flex-start;gap:.9rem;display:flex}ul.features strong{display:block}ul.features small{color:var(--muted)}.welcome-step>button.big{width:100%}.choices{gap:.6rem;width:100%;display:grid}button.choice{text-align:left;border-radius:var(--radius);background:var(--card);gap:.15rem;padding:1rem 1.1rem;display:grid}button.choice small{color:var(--muted);font-weight:400}button.choice.on{border-color:var(--indigo);background:var(--indigo-soft);box-shadow:0 2px 0 var(--indigo)}@keyframes fade{0%{opacity:0;transform:translateY(6px)}}@media (prefers-reduced-motion:reduce){.welcome-step{animation:none}}.big-number.done{color:var(--good);place-items:center;display:grid}