:root{--red: #E63946;--dark: #1A1A2E;--mid: #555577;--light: #F7F4F0;--white: #FFFFFF;--pink: #FFE4EC;--green: #22C55E;--orange: #F97316;--blue: #3B82F6;--border: #E8E4E0;--radius: 14px;--shadow: 0 4px 20px rgba(0,0,0,.08);--nav-h: 60px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:Inter,system-ui,sans-serif;color:var(--dark);background:var(--light);min-height:100vh}input,button,textarea{font-family:inherit}.page{padding:calc(var(--nav-h) + 36px) 5% 60px;max-width:900px;margin:0 auto}.card{background:var(--white);border-radius:var(--radius);border:1px solid var(--border);box-shadow:var(--shadow)}.input{width:100%;padding:12px 16px;border:1.5px solid var(--border);border-radius:10px;font-size:1rem;outline:none;background:var(--white);transition:border-color .2s;color:var(--dark)}.input:focus{border-color:var(--red)}.btn{border:none;border-radius:10px;padding:12px 24px;font-size:.95rem;font-weight:600;cursor:pointer;transition:transform .15s,box-shadow .15s}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none!important}.btn-red{background:var(--red);color:#fff}.btn-gray{background:var(--light);color:var(--dark);border:1.5px solid var(--border)}.btn-red:hover{transform:translateY(-1px);box-shadow:0 4px 16px #e639464d}.btn-gray:hover{background:var(--border)}.error{color:var(--red);font-size:.85rem;margin-top:2px}.noto{font-family:Noto Sans JP,sans-serif}.grade-btns{display:grid;grid-template-columns:1fr 1fr 1fr 1fr;gap:10px}.grade-btn{padding:12px 8px;border-radius:10px;border:none;font-size:.85rem;font-weight:600;cursor:pointer;transition:transform .15s,box-shadow .15s}.grade-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.grade-forgot{background:#fee2e2;color:#991b1b}.grade-hard{background:#fef3c7;color:#92400e}.grade-good{background:#dbeafe;color:#1e40af}.grade-easy{background:#dcfce7;color:#166534}.kana-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.kana-cell{aspect-ratio:1;border-radius:10px;border:1.5px solid var(--border);display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;transition:all .15s;background:var(--white);gap:2px}.kana-cell:hover{border-color:var(--red);transform:scale(1.04)}.kana-cell.mastered{background:#dcfce7;border-color:#86efac}.kana-cell.attempted{background:#fef9c3;border-color:#fde047}.kana-cell .char{font-size:1.3rem;font-family:Noto Sans JP}.kana-cell .rom{font-size:.65rem;color:var(--mid)}