:root{color-scheme:dark;--bg: #1f1f28;--bg-dark: #16161d;--bg-highlight: #2a2a37;--muted: #54546d;--fg-dim: #727169;--fg: #dcd7ba;--fg-light: #c8c093;--red: #e46876;--orange: #ffa066;--yellow: #e6c384;--green: #98bb6c;--blue: #7fb4ca;--purple: #957fb8}*{box-sizing:border-box}html,body{margin:0;padding:0;min-height:100%;background:var(--bg);color:var(--fg);font-family:ui-monospace,SF Mono,Menlo,Consolas,monospace}.kana-text{font-family:Hiragino Kaku Gothic ProN,Yu Gothic,Noto Sans JP,Noto Sans CJK JP,sans-serif}#app{max-width:560px;margin:0 auto;padding:1rem 1rem 3rem;display:flex;flex-direction:column;align-items:stretch;gap:1rem;min-height:100dvh}header{display:flex;align-items:baseline;justify-content:space-between;border-bottom:1px solid var(--muted);padding-bottom:.6rem}header h1{margin:0;font-size:1.3rem;color:var(--fg-light);cursor:pointer}header .sub{color:var(--fg-dim);font-size:.8rem}button{font-family:inherit;font-size:.95rem;background:var(--bg-highlight);color:var(--fg);border:1px solid var(--muted);border-radius:8px;padding:.65rem 1rem;cursor:pointer;touch-action:manipulation}button:hover{border-color:var(--fg-dim)}button:disabled{opacity:.4;cursor:default}button.primary{border-color:var(--yellow);color:var(--yellow)}button.ghost{background:none;border-color:transparent;color:var(--fg-dim)}.deck-card{background:var(--bg-highlight);border:1px solid var(--muted);border-radius:10px;padding:1rem;display:flex;flex-direction:column;gap:.7rem}.deck-card h2{margin:0;font-size:1.05rem;color:var(--fg-light)}.deck-card .counts{color:var(--fg-dim);font-size:.85rem}.deck-card .counts b{color:var(--fg);font-weight:600}.deck-card .counts .due-n{color:var(--orange)}.deck-card .row{display:flex;gap:.6rem;flex-wrap:wrap}.deck-card .row button{flex:1 1 10rem}.progress-bar{height:6px;border-radius:3px;background:var(--bg-dark);overflow:hidden}.progress-bar>div{height:100%;background:var(--green)}.hint{color:var(--fg-dim);font-size:.8rem;line-height:1.5}.intro-note{color:var(--fg-dim);font-size:.9rem;line-height:1.5;margin:0}.intro-card{display:flex;align-items:center;gap:1rem;background:var(--bg-highlight);border:1px solid var(--muted);border-radius:10px;padding:.8rem 1rem}.intro-card .big{font-size:2.6rem;min-width:4.5rem;text-align:center;color:var(--fg-light)}.intro-card .info{display:flex;flex-direction:column;gap:.2rem}.intro-card .romaji{color:var(--yellow);font-size:1.1rem}.intro-card .meaning{color:var(--blue);font-size:.9rem}.intro-card .mnemonic{color:var(--fg-dim);font-size:.8rem;line-height:1.4}.session-top{display:flex;justify-content:space-between;color:var(--fg-dim);font-size:.8rem}.card-front{text-align:center;font-size:clamp(3rem,16vw,5rem);color:var(--fg-light);padding:2rem .5rem;line-height:1.2;word-break:keep-all;overflow-wrap:anywhere}.card-front.word{font-size:clamp(2rem,10vw,3.2rem)}.answer-row{display:flex;gap:.6rem}.answer-row input{flex:1;font-family:inherit;font-size:1.15rem;padding:.7rem .9rem;background:var(--bg-dark);border:1px solid var(--muted);border-radius:8px;color:var(--fg);min-width:0}.answer-row input:focus{outline:none;border-color:var(--yellow)}.result{text-align:center;display:flex;flex-direction:column;gap:.5rem;padding:.4rem 0}.result .verdict{font-size:1.1rem}.result .verdict.ok{color:var(--green)}.result .verdict.bad{color:var(--red)}.result .correct-answer{font-size:1.6rem;color:var(--yellow)}.result .meaning{color:var(--blue)}.result .mnemonic{color:var(--fg-dim);font-size:.85rem}.grade-row{display:flex;gap:.6rem}.grade-row button{flex:1;display:flex;flex-direction:column;gap:.15rem;align-items:center}.grade-row .ivl{font-size:.75rem;color:var(--fg-dim)}.grade-row button.hard{border-color:var(--orange)}.grade-row button.good{border-color:var(--green)}.grade-row button.easy{border-color:var(--blue)}.key-hint{text-align:center;color:var(--fg-dim);font-size:.75rem}.summary{text-align:center;display:flex;flex-direction:column;gap:.8rem;padding:2rem 0}.summary .big-num{font-size:2.2rem;color:var(--green)}.chart-group h3{margin:.8rem 0 .4rem;font-size:.85rem;color:var(--fg-dim);font-weight:400}.chart-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(3.4rem,1fr));gap:.4rem}.chart-cell{background:var(--bg-highlight);border:1px solid var(--muted);border-radius:8px;padding:.35rem .2rem;text-align:center;display:flex;flex-direction:column;gap:.1rem}.chart-cell .k{font-size:1.25rem}.chart-cell .r{font-size:.65rem;color:var(--fg-dim)}.chart-cell.state-new{opacity:.45}.chart-cell.state-learning{border-color:var(--yellow)}.chart-cell.state-learning .k{color:var(--yellow)}.chart-cell.state-known{border-color:var(--green)}.chart-cell.state-known .k{color:var(--green)}@media(max-width:420px){#app{padding:.8rem .7rem 2.5rem}.grade-row button{padding:.65rem .3rem}}