.typing-page{--card:var(--sheet);--line:var(--rule);--line2:var(--rule);--muted:var(--soft);--vermilion:var(--gold);--bad:var(--danger)}
.typing-page .layout{display:grid;grid-template-columns:310px minmax(0,1fr);gap:30px;align-items:start;padding:40px 0 30px}.typing-page .panel,.typing-page .arena,.typing-page .end{background:var(--sheet);border:1px solid var(--rule)}
.typing-page .settings{padding:24px;position:sticky;top:100px;border-top:3px solid var(--gold)}
.typing-page .section-index{font-size:10px;letter-spacing:.2em;font-weight:800;color:var(--gold);margin-bottom:7px}.typing-page h2{font-size:26px;font-weight:500;margin:0 0 8px}.typing-page .fine{font-size:12px;color:var(--soft);margin:0 0 18px}.select-wrap{display:grid;gap:6px;margin-bottom:16px}.select-wrap label,.typing-page .eyebrow{font-size:10px;letter-spacing:.13em;color:var(--soft)}
.typing-page select{width:100%;padding:11px;border:1px solid var(--rule);border-radius:4px;background:var(--sheet);color:var(--ink)}.rows{display:grid;gap:5px}.row-option{width:100%;display:grid;grid-template-columns:16px 38px 1fr;gap:8px;align-items:center;text-align:left;border:1px solid transparent;background:transparent;color:var(--ink);padding:10px 8px;border-radius:3px}.row-option.checked{border-color:var(--rule);background:var(--pale)}.row-option input{accent-color:var(--forest);pointer-events:none}.row-label{font-size:11px;font-weight:700}.kana{font:18px 'Noto Sans JP',sans-serif}.pronounce{display:none}.selection-info{border-top:1px solid var(--rule);margin-top:17px;padding-top:15px;font-size:12px}.selection-info strong,.selection-info .note{display:block}.selection-info .note{background:none;border:0;padding:0;margin:5px 0;color:var(--soft);font-size:11px}
.practice{min-width:0}.practice-head{display:flex;align-items:center;justify-content:space-between;gap:15px;flex-wrap:wrap;margin-bottom:14px}.controls,.durations{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.duration,.reset{border:1px solid var(--rule);border-radius:3px;background:var(--sheet);color:var(--ink);padding:9px 10px;font-size:11px;font-weight:700}.duration.active,#timerToggle[aria-pressed="true"]{background:var(--forest);color:var(--sheet);border-color:var(--forest)}
.stats{display:grid;grid-template-columns:repeat(4,1fr);margin:18px 0;border:1px solid var(--rule);background:var(--sheet)}.stat{text-align:center;padding:16px 8px;border-right:1px solid var(--rule)}.stat:last-child{border:0}.stat b{display:block;font:32px 'Playfair Display',Georgia,serif}.stat small{font-size:11px;color:var(--soft)}.progress-track{height:4px;background:var(--rule)}.progress-fill{height:100%;background:var(--gold);transition:width .1s linear}.arena-label{padding:18px 22px 0;font-size:10px;letter-spacing:.18em;color:var(--gold)}.word-cloud{display:flex;gap:6px 14px;flex-wrap:wrap;min-height:150px;max-height:240px;overflow:hidden;padding:20px 22px}.word{font:30px/1.6 'Noto Sans JP',sans-serif;padding:0 4px;border-bottom:2px solid transparent;color:var(--soft)}.word.current{background:var(--pale);color:var(--ink);border-color:var(--gold)}.word.ok{color:var(--ok)}.word.fail{color:var(--danger);text-decoration:line-through}.empty{display:none;padding:20px;color:var(--soft)}.entry{display:grid;grid-template-columns:minmax(150px,.8fr) minmax(0,1fr);gap:22px;padding:24px;background:var(--pale);border-top:1px solid var(--rule)}.current-area{border-right:1px solid var(--rule);padding-right:20px}.current-jp{font:44px/1.4 'Noto Sans JP',sans-serif;overflow-wrap:anywhere}.translation{font-size:13px;color:var(--soft)}.type-area input{width:100%;background:var(--sheet);color:var(--ink);border:1px solid var(--rule);border-bottom:2px solid var(--gold);border-radius:3px;padding:12px;font-size:20px;margin-top:9px}.type-area input::placeholder{font-size:14px;color:var(--soft)}.type-area input.mismatch{border-color:var(--danger)}.type-note{font-size:11px;color:var(--soft);margin-top:8px}.feedback{padding:15px 22px;min-height:52px;font-size:12px;color:var(--soft);border-top:1px solid var(--rule)}.feedback.ok{color:var(--ok)}.feedback.fail{color:var(--danger)}.arena-foot{padding:16px 22px;border-top:1px solid var(--rule);display:flex;align-items:center;gap:10px;flex-wrap:wrap}.arena-foot small{font-size:10px;color:var(--soft);margin-right:auto}.start,.again{background:var(--forest);color:var(--sheet);border:1px solid var(--forest);border-radius:3px;padding:11px 17px;font-size:12px;font-weight:700}.end{display:none;padding:28px;margin-top:20px;text-align:center}.end.show{display:block}.summary{display:grid;grid-template-columns:repeat(3,1fr);margin:20px 0}.summary strong{display:block;font:30px 'Playfair Display',Georgia,serif}.summary small{font-size:10px;color:var(--soft)}.footnote{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:24px}.help,.quote{padding:20px;border-top:1px solid var(--rule)}.footnote h3{font:22px 'Playfair Display',Georgia,serif;margin:0 0 8px}.footnote p{font-size:12px;color:var(--soft);margin:0}
@media(max-width:950px){.typing-page .layout{grid-template-columns:1fr}.typing-page .settings{position:static}.rows{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.typing-page .layout{gap:24px;padding-top:24px}.typing-page .settings{padding:18px}.rows{grid-template-columns:1fr}.entry{grid-template-columns:1fr;padding:18px}.current-area{border-right:0;border-bottom:1px solid var(--rule);padding:0 0 15px}.stats{grid-template-columns:repeat(2,1fr)}.stat:nth-child(2){border-right:0}.stat:nth-child(-n+2){border-bottom:1px solid var(--rule)}.word-cloud{padding:16px;min-height:120px}.word{font-size:26px}.footnote{grid-template-columns:1fr}.controls{width:100%}.arena-foot{padding:14px}.arena-foot small{width:100%}}@media(prefers-reduced-motion:reduce){.progress-fill{transition:none}}