:root{--bg: #fafaf9;--fg: #1c1917;--muted: #78716c;--accent: #b91c1c;--accent-dark: #991b1b;--accent-soft: #fef2f2;--card: #ffffff;--border: #e7e5e4;--ok: #16a34a;font-family:system-ui,-apple-system,Segoe UI,Hiragino Kaku Gothic ProN,Noto Sans JP,sans-serif}*{box-sizing:border-box}html,body,#root{margin:0;min-height:100%;background:var(--bg);color:var(--fg)}body{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}a{color:inherit;text-decoration:none}.app-shell{max-width:680px;margin:0 auto;padding:1rem 1rem 5rem}.brand{display:flex;align-items:baseline;gap:.5rem}.brand .jp{color:var(--accent)}.brand--lg{justify-content:center;margin-top:3rem}.brand--lg .jp{font-size:2.6rem}.brand--lg h1{margin:0;font-size:2.4rem;letter-spacing:-.02em}.brand--sm .jp{font-size:1.3rem}.brand--sm strong{font-size:1.15rem}.splash{min-height:100vh;display:grid;place-items:center}.splash .jp{font-size:3rem;color:var(--accent);animation:pulse 1.2s ease-in-out infinite}@keyframes pulse{0%,to{opacity:.3}50%{opacity:1}}.header{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;padding:.7rem 1rem;background:#fafaf9e6;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--border)}.header__right{display:flex;align-items:center;gap:.75rem}.header__email{color:var(--muted);font-size:.8rem;max-width:40vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.link-btn{background:none;border:none;color:var(--accent);padding:0;font-size:.9rem}.auth-screen{max-width:380px;margin:0 auto;padding:1rem 1.25rem 3rem;text-align:center}.auth-tag{color:var(--muted);margin:.5rem 0 2rem}.auth-card{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:1.5rem;text-align:left;display:flex;flex-direction:column;gap:.85rem;box-shadow:0 1px 3px #0000000a}.auth-card h2{margin:0 0 .25rem;font-size:1.2rem}.auth-card label{display:flex;flex-direction:column;gap:.3rem;font-size:.85rem;color:var(--muted)}.auth-card input{padding:.65rem .75rem;border:1px solid var(--border);border-radius:10px;font-size:1rem;color:var(--fg);background:#fff}.auth-card input:focus{outline:2px solid var(--accent);border-color:transparent}.hint{color:var(--muted);font-size:.78rem;margin-top:-.4rem}.auth-error{background:var(--accent-soft);color:var(--accent-dark);padding:.6rem .75rem;border-radius:10px;font-size:.88rem}.btn-primary{margin-top:.4rem;background:var(--accent);color:#fff;border:none;padding:.75rem;border-radius:10px;font-size:1rem;font-weight:600}.btn-primary:disabled{opacity:.6}.auth-screen .link-btn{margin-top:1.25rem}.page__title{margin:0;font-size:1.5rem;letter-spacing:-.01em}.page__sub{color:var(--muted);margin:.35rem 0 1.25rem;font-size:.95rem}.muted{color:var(--muted)}.back{display:inline-block;color:var(--accent);margin-bottom:1rem;font-size:.9rem}.scenario-grid{display:grid;grid-template-columns:1fr;gap:.85rem}@media(min-width:520px){.scenario-grid{grid-template-columns:1fr 1fr}}.scenario-tile{display:flex;flex-direction:column;gap:.3rem;background:var(--card);border:1px solid var(--border);border-radius:14px;padding:1rem;transition:transform .08s ease,box-shadow .08s ease}.scenario-tile:active{transform:scale(.99)}.scenario-tile:hover{box-shadow:0 2px 10px #0000000f}.scenario-tile__icon{font-size:1.8rem}.scenario-tile__title{font-weight:600;font-size:1.05rem}.scenario-tile__desc{color:var(--muted);font-size:.85rem;line-height:1.35}.scenario-tile__count{color:var(--accent);font-size:.8rem;margin-top:.25rem}.scenario-head{display:flex;gap:.75rem;align-items:flex-start}.scenario-head__icon{font-size:2.2rem}.progress-bar{position:relative;height:26px;background:#f0eeec;border-radius:999px;margin:1rem 0;overflow:hidden}.progress-bar__fill{height:100%;background:var(--accent);transition:width .3s ease}.progress-bar__text{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;font-size:.78rem;color:var(--fg);font-weight:600}.toggles{position:sticky;top:52px;z-index:5;display:flex;align-items:center;gap:.4rem;flex-wrap:wrap;padding:.6rem 0;background:var(--bg)}.toggles__label{color:var(--muted);font-size:.8rem;margin-right:.15rem}.chip{border:1px solid var(--border);background:#fff;color:var(--muted);padding:.3rem .7rem;border-radius:999px;font-size:.82rem}.chip--on{background:var(--accent);border-color:var(--accent);color:#fff}.phrase-list{display:flex;flex-direction:column;gap:.7rem;margin-top:.5rem}.card{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.85rem;background:var(--card);border:1px solid var(--border);border-radius:14px;padding:.85rem 1rem}.card--learned{border-color:#bbf7d0;background:#f6fdf8}.play{width:44px;height:44px;border-radius:50%;border:none;background:var(--accent-soft);color:var(--accent);font-size:1.1rem;display:grid;place-items:center;flex-shrink:0}.play--on{background:var(--accent);color:#fff}.card__body{min-width:0}.line{line-height:1.3}.line--kanji{font-size:1.4rem}.line--kana{font-size:1.15rem;color:#44403c}.line--romaji{font-size:1rem;color:var(--accent-dark);font-weight:600;margin-top:.1rem}.line--english{font-size:.92rem;color:var(--muted);margin-top:.15rem}.notes-toggle{margin-top:.5rem;background:none;border:none;color:var(--accent);font-size:.78rem;padding:0}.notes{margin-top:.5rem;font-size:.85rem;color:#57534e;line-height:1.45;background:#faf9f8;border-radius:8px;padding:.5rem .65rem}.notes__literal{margin-bottom:.3rem}.notes__label{color:var(--muted);font-weight:600}.got-it{align-self:stretch;min-width:64px;border:1px solid var(--border);background:#fff;color:var(--muted);border-radius:10px;font-size:.82rem;padding:0 .6rem}.got-it--done{background:var(--ok);border-color:var(--ok);color:#fff;font-weight:600}.mic{margin-top:.6rem;display:flex;align-items:center;gap:.6rem;flex-wrap:wrap}.mic__btn{border:1px solid var(--accent);background:#fff;color:var(--accent);padding:.35rem .8rem;border-radius:999px;font-size:.85rem;font-weight:600}.mic__btn--on{background:var(--accent);color:#fff;animation:blink 1s steps(2) infinite}.mic__btn:disabled{opacity:.9}@keyframes blink{50%{opacity:.55}}.mic__result{display:flex;flex-direction:column;line-height:1.15;font-size:.85rem;font-weight:700}.mic__result--great{color:var(--ok)}.mic__result--good{color:#ca8a04}.mic__result--poor{color:var(--accent)}.mic__heard{font-weight:400;font-size:.72rem;color:var(--muted)}.mic__err{font-size:.8rem;color:var(--accent)}.mic--unsupported{font-size:.76rem;color:var(--muted);line-height:1.35}.review-link{position:relative;color:var(--accent);font-size:.9rem;font-weight:600}.badge{display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 5px;margin-left:4px;border-radius:999px;background:var(--accent);color:#fff;font-size:.7rem;font-weight:700}.review-banner{display:flex;align-items:center;gap:.6rem;background:var(--accent);color:#fff;border-radius:14px;padding:.85rem 1rem;margin-bottom:1.25rem}.review-banner__icon{font-size:1.3rem}.review-banner__go{margin-left:auto;font-weight:700;white-space:nowrap}.btn-inline{display:inline-block;width:auto;text-align:center}.review-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem}.review-count{color:var(--muted);font-size:.85rem}.review-card{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:2rem 1.25rem;text-align:center;display:flex;flex-direction:column;align-items:center;gap:1.1rem;min-height:260px;justify-content:center}.play--lg{width:64px;height:64px;font-size:1.5rem}.review-prompt{font-size:1.3rem;font-weight:600}.review-answer{display:flex;flex-direction:column;gap:.25rem}.review-answer .line--kanji{font-size:1.8rem}.review-answer .line--kana{font-size:1.25rem}.review-answer .line--romaji{font-size:1.05rem}.grade-row{display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem;margin-top:1rem}.grade{border:none;border-radius:10px;padding:.85rem 0;font-size:.92rem;font-weight:600;color:#fff}.grade--again{background:#dc2626}.grade--hard{background:#ea580c}.grade--good{background:#16a34a}.grade--easy{background:#0891b2}.review-empty{text-align:center;padding-top:3rem}.review-empty__icon{font-size:3rem}.review-empty h2{margin:.5rem 0}.review-empty .btn-inline{margin-top:1.5rem}.icon-link{font-size:1.15rem;line-height:1;color:var(--muted)}.icon-link:hover{color:var(--fg)}.got-it--done:hover{filter:brightness(.92)}.settings-section{margin-top:1.5rem;padding-top:1.25rem;border-top:1px solid var(--border)}.settings-section:first-of-type{border-top:none}.settings-h3{margin:0 0 .5rem;font-size:1rem}.settings-note{color:var(--muted);font-size:.85rem;margin:0 0 .6rem}.settings-account{display:flex;align-items:center;gap:.5rem;margin:0;font-size:.95rem}.admin-tag{background:var(--accent);color:#fff;font-size:.68rem;font-weight:700;padding:.1rem .45rem;border-radius:999px;text-transform:uppercase;letter-spacing:.03em}.settings-form{display:flex;flex-direction:column;gap:.85rem;max-width:360px}.settings-form label{display:flex;flex-direction:column;gap:.3rem;font-size:.85rem;color:var(--muted)}.settings-form input{padding:.65rem .75rem;border:1px solid var(--border);border-radius:10px;font-size:1rem;color:var(--fg);background:#fff}.settings-form input:focus{outline:2px solid var(--accent);border-color:transparent}.settings-ok{background:#f0fdf4;color:#15803d;padding:.6rem .75rem;border-radius:10px;font-size:.88rem}