:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;--font-ui:system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--font-jp:"Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", "Meiryo", "MS Gothic", var(--font-ui);--radius-sm:8px;--radius-md:14px;--radius-lg:22px;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;--space-6:32px;--shadow-sm:0 1px 2px #1e140a0f, 0 1px 1px #1e140a0a;--shadow-md:0 8px 24px #1e140a14, 0 2px 6px #1e140a0d;--shadow-lift:0 14px 32px #1e140a1f, 0 4px 10px #1e140a0f;--color-brand-bg-start:#2c4767;--color-brand-bg-end:#192a41;--color-brand-text:#f4f1e8d9;--color-brand-text-strong:#fdfaf2;--color-brand-active-bg:#e88fa3;--color-brand-active-text:#3a1420}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}:root,:root[data-theme=light]{--color-bg:#fbf6ec;--color-surface:#fffdf9;--color-surface-raised:#fff;--color-border:#e7dcc4;--color-text:#2a231a;--color-text-muted:#756a58;--color-accent:#bd3b2e;--color-accent-strong:#9c2e23;--color-accent-contrast:#fffaf4;--color-indigo:#274060;--color-indigo-strong:#1b2e47;--color-sakura:#e88fa3;--color-sakura-soft:#fbe4e9;--color-success:#2f7a4f;--color-danger:#b3392a;--color-focus:#2f6fa6;--color-supplementary-bg:#eef2f6;--color-supplementary-border:#c6d3e0;--pattern-opacity:.05}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--color-bg:#14171f;--color-surface:#1b1f2a;--color-surface-raised:#222735;--color-border:#333a4a;--color-text:#f1ede3;--color-text-muted:#a7a3b3;--color-accent:#e2836c;--color-accent-strong:#ef9c85;--color-accent-contrast:#1c1108;--color-indigo:#7fa0d6;--color-indigo-strong:#a8c1ea;--color-sakura:#f2a8bb;--color-sakura-soft:#33202a;--color-success:#6fbf8b;--color-danger:#e08678;--color-focus:#7db4e0;--color-supplementary-bg:#1b232c;--color-supplementary-border:#33455a;--pattern-opacity:.06}}:root[data-theme=light]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}:root[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--color-bg:#14171f;--color-surface:#1b1f2a;--color-surface-raised:#222735;--color-border:#333a4a;--color-text:#f1ede3;--color-text-muted:#a7a3b3;--color-accent:#e2836c;--color-accent-strong:#ef9c85;--color-accent-contrast:#1c1108;--color-indigo:#7fa0d6;--color-indigo-strong:#a8c1ea;--color-sakura:#f2a8bb;--color-sakura-soft:#33202a;--color-success:#6fbf8b;--color-danger:#e08678;--color-focus:#7db4e0;--color-supplementary-bg:#1b232c;--color-supplementary-border:#33455a;--pattern-opacity:.06}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--color-bg);color:var(--color-text);font-family:var(--font-ui);font-size:16px;line-height:1.5}.app-shell{position:relative}.app-shell:before{content:"";z-index:-1;pointer-events:none;opacity:var(--pattern-opacity);background-color:var(--color-bg);background-image:radial-gradient(circle at 0 100%, transparent 23%, var(--color-indigo) 24%, var(--color-indigo) 27%, transparent 28%, transparent 100%), radial-gradient(circle at 50% 100%, transparent 23%, var(--color-indigo) 24%, var(--color-indigo) 27%, transparent 28%, transparent 100%), radial-gradient(circle at 100% 100%, transparent 23%, var(--color-indigo) 24%, var(--color-indigo) 27%, transparent 28%, transparent 100%);background-size:64px 32px;position:fixed;inset:0}.page-hero{border-radius:var(--radius-lg);background:linear-gradient(135deg, var(--color-brand-bg-start) 0%, var(--color-brand-bg-end) 100%);color:var(--color-brand-text-strong);padding:var(--space-5);margin-bottom:var(--space-5);position:relative;overflow:hidden}.page-hero__petals{pointer-events:none;opacity:.7;color:var(--color-brand-text-strong);position:absolute;inset:0}.page-hero__content{position:relative}.page-hero__title{margin:0;font-size:1.5rem}.page-hero__description{margin:var(--space-2) 0 0;color:var(--color-brand-text);max-width:60ch}a{color:var(--color-accent)}button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit}:where(select,input[type=text],input[type=search]){background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:var(--space-1) var(--space-2)}:focus-visible{outline:3px solid var(--color-focus);outline-offset:2px}.jp-text{font-family:var(--font-jp)}.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-4);box-shadow:var(--shadow-sm);transition:box-shadow .2s,transform .2s}.card--interactive:hover{box-shadow:var(--shadow-lift);border-color:var(--color-accent);transform:translateY(-2px)}.badge{border:1px solid var(--color-border);color:var(--color-text-muted);border-radius:999px;padding:2px 10px;font-size:.75rem;display:inline-block}.badge--supplementary{background:var(--color-supplementary-bg);border-color:var(--color-supplementary-border);color:var(--color-text-muted)}.btn{cursor:pointer;border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text);padding:var(--space-2) var(--space-4);border-radius:999px;font-weight:500;transition:border-color .15s,transform .15s,box-shadow .15s,background .15s}.btn:hover:not(:disabled){border-color:var(--color-accent);box-shadow:var(--shadow-sm);transform:translateY(-1px)}.btn:active:not(:disabled){transform:translateY(0)}.btn:disabled{opacity:.55;cursor:not-allowed}.btn--primary{background:linear-gradient(135deg, var(--color-accent), var(--color-accent-strong));color:var(--color-accent-contrast);border-color:#0000}.btn--primary:hover:not(:disabled){box-shadow:var(--shadow-md)}.visually-hidden{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.illustration-badge{background:var(--color-sakura-soft);border:1px solid var(--color-border);width:3.5rem;height:3.5rem;margin:0 auto var(--space-3);border-radius:50%;justify-content:center;align-items:center;font-size:1.9rem;animation:.25s illustration-pop;display:flex}@keyframes illustration-pop{0%{opacity:0;transform:scale(.6)}to{opacity:1;transform:scale(1)}}.app-shell{grid-template-columns:260px 1fr;min-height:100vh;display:grid}.app-nav{background:linear-gradient(180deg, var(--color-brand-bg-start) 0%, var(--color-brand-bg-end) 100%);color:var(--color-brand-text-strong);padding:var(--space-4);flex-direction:column;display:flex}.app-nav__brand{align-items:center;gap:var(--space-2);margin-bottom:var(--space-4);color:var(--color-brand-text-strong);display:flex}.app-nav__brand-mark{color:var(--color-brand-active-bg);flex-shrink:0}.app-nav__title{letter-spacing:.01em;font-size:1.05rem;font-weight:700}.app-nav__search{margin-bottom:var(--space-4);position:relative}.app-nav__search-icon{left:var(--space-2);opacity:.7;pointer-events:none;font-size:.85rem;position:absolute;top:50%;transform:translateY(-50%)}.app-nav__search input{box-sizing:border-box;width:100%;padding:var(--space-2) var(--space-2) var(--space-2) 30px;color:var(--color-brand-text-strong);background:#ffffff1a;border:1px solid #ffffff2e;border-radius:999px}.app-nav__search input::placeholder{color:var(--color-brand-text)}.app-nav__search input:focus-visible{outline-color:var(--color-brand-active-bg)}.app-nav ul{flex-direction:column;gap:2px;margin:0;padding:0;list-style:none;display:flex;overflow-y:auto}.app-nav__icon{flex-shrink:0;justify-content:center;align-items:center;width:1.4em;display:inline-flex}.app-nav a{align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);color:var(--color-brand-text);border-radius:999px;font-size:.92rem;text-decoration:none;transition:background .15s,color .15s;display:flex}.app-nav a:hover{color:var(--color-brand-text-strong);background:#ffffff1a}.app-nav a.active{background:var(--color-brand-active-bg);color:var(--color-brand-active-text);font-weight:600}.app-main{padding:var(--space-6);max-width:960px}@media (width<=720px){.app-shell{grid-template-columns:1fr}.app-nav{border-radius:0}.app-nav ul{flex-flow:wrap;overflow-y:visible}.app-main{padding:var(--space-4)}}.stat-grid{gap:var(--space-4);margin-bottom:var(--space-5);grid-template-columns:repeat(auto-fit,minmax(200px,1fr));display:grid}.stat-card{align-items:flex-start;gap:var(--space-3);display:flex}.stat-card__icon{background:var(--color-sakura-soft);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:2.5rem;height:2.5rem;font-size:1.6rem;display:flex}.stat-card__label{color:var(--color-text-muted);margin:0;font-size:.85rem}.stat-card__value{margin:var(--space-1) 0 0;font-size:1.75rem;font-weight:700}.stat-card__hint{color:var(--color-text-muted);font-size:.8rem}.quick-start__grid{gap:var(--space-3);flex-wrap:wrap;display:flex}.quick-start__grid a{align-items:center;gap:var(--space-2);text-decoration:none;display:inline-flex}.progress-grid{gap:var(--space-3);grid-template-columns:repeat(auto-fit,minmax(180px,1fr));margin:0;padding:0;list-style:none;display:grid}.progress-grid li{align-items:center;gap:var(--space-2);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:var(--space-2) var(--space-3);display:flex}.progress-grid__icon{font-size:1.2rem}.progress-grid__count{margin-left:auto;font-weight:700}.kanji-filters{gap:var(--space-4);margin-bottom:var(--space-4);flex-wrap:wrap;display:flex}.kanji-card{text-align:center}.kanji-card__character{margin-bottom:var(--space-3);font-size:5rem;line-height:1.1}.kanji-card__uncertainty{color:var(--color-text-muted);max-width:480px;margin:0 auto var(--space-3);font-size:.85rem}.kanji-card__details{text-align:left;margin-top:var(--space-4);padding-top:var(--space-4);border-top:1px solid var(--color-border)}.kanji-card__source{color:var(--color-text-muted);font-size:.8rem}.kanji-card__actions{gap:var(--space-2);margin-top:var(--space-4);flex-wrap:wrap;justify-content:center;display:flex}.test-question{text-align:center;padding:var(--space-6) var(--space-4)}.test-question__prompt{margin-bottom:var(--space-2);font-size:3.5rem}.test-question__reading{color:var(--color-text-muted);margin-bottom:var(--space-4);font-size:1.25rem}.test-question__input{padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);border:1px solid var(--color-border);background:var(--color-bg);width:100%;max-width:360px;color:var(--color-text);font-size:1.25rem}.test-question__result{margin-top:var(--space-4);font-size:1.1rem}.test-question__result--correct{color:var(--color-success)}.test-question__result--wrong{color:var(--color-danger)}.test-question__actions{margin-top:var(--space-4);gap:var(--space-2);flex-wrap:wrap;justify-content:center;display:flex}.test-config{gap:var(--space-4);margin-bottom:var(--space-4);flex-wrap:wrap;display:flex}.test-summary{text-align:center}.kanji-grid{gap:var(--space-2);grid-template-columns:repeat(auto-fill,minmax(70px,1fr));display:grid}