.App{min-height:100vh;display:flex;flex-direction:column}.fade-enter{opacity:0;transform:translateY(20px)}.fade-enter-active{opacity:1;transform:translateY(0);transition:opacity .3s ease,transform .3s ease}.fade-exit{opacity:1}.fade-exit-active{opacity:0;transform:translateY(-20px);transition:opacity .3s ease,transform .3s ease}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Hiragino Sans,Noto Sans JP,Yu Gothic,Meiryo,sans-serif;line-height:1.6;color:#333;background-color:#f8f9fa;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{min-height:100vh;display:flex;flex-direction:column}.hiragana,.katakana{font-family:Hiragino Mincho ProN,Yu Mincho,YuMincho,HG Mincho E,MS PMincho,serif;font-size:2.5rem;font-weight:400}.romaji{font-family:SF Pro Text,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:1.5rem;font-weight:500}.btn{border:none;border-radius:12px;padding:12px 24px;font-size:1.2rem;cursor:pointer;transition:all .2s ease;min-width:60px;min-height:60px;display:flex;align-items:center;justify-content:center}.btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.btn:active{transform:translateY(0)}.btn-correct{background-color:#28a745;color:#fff}.btn-incorrect{background-color:#dc3545;color:#fff}.btn-primary{background-color:#007bff;color:#fff}.btn-secondary{background-color:#6c757d;color:#fff}.container{max-width:480px;margin:0 auto;padding:16px;width:100%}.nav{background-color:#fff;box-shadow:0 2px 4px #0000001a;padding:12px 0;position:sticky;top:0;z-index:100}.nav-content{display:flex;justify-content:space-between;align-items:center;max-width:480px;margin:0 auto;padding:0 16px}.nav-title{font-size:1.5rem;font-weight:700;color:#333;text-decoration:none}.nav-links{display:flex;gap:16px}.nav-link{text-decoration:none;color:#666;font-size:1.2rem;padding:8px;border-radius:8px;transition:background-color .2s ease}.nav-link:hover,.nav-link.active{background-color:#e9ecef;color:#333}.main-content{flex:1;display:flex;flex-direction:column;min-height:calc(100vh - 80px)}.card{background:#fff;border-radius:16px;padding:24px;margin:16px 0;box-shadow:0 2px 8px #0000001a;text-align:center}.practice-card{display:flex;flex-direction:column;align-items:center;gap:24px;min-height:300px;justify-content:center}.answer-buttons{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}.kana-display{min-height:80px;display:flex;align-items:center;justify-content:center;gap:24px}.audio-btn{background:none;border:none;font-size:2rem;cursor:pointer;padding:8px;border-radius:50%;transition:background-color .2s ease}.audio-btn:hover{background-color:#e9ecef}.stats{display:flex;justify-content:space-around;margin:16px 0;text-align:center}.stat-item{flex:1}.stat-number{font-size:2rem;font-weight:700;color:#007bff}.stat-label{font-size:.9rem;color:#666;margin-top:4px}.error-list{max-height:400px;overflow-y:auto;padding:0}.error-item{display:flex;align-items:center;justify-content:space-between;padding:16px;border-bottom:1px solid #eee;transition:background-color .2s ease}.error-item:hover{background-color:#f8f9fa}.error-kana{display:flex;align-items:center;gap:12px}.error-count{background-color:#dc3545;color:#fff;border-radius:50%;width:32px;height:32px;display:flex;align-items:center;justify-content:center;font-size:.9rem;font-weight:700}.dictionary-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;padding:0}.gojuon-chart{padding:0 8px;width:100%}.gojuon-table{width:100%;border-collapse:collapse;margin:0 auto;table-layout:fixed}.gojuon-table th,.gojuon-table td{border:1px solid #e9ecef;text-align:center;vertical-align:middle}.gojuon-table th{background-color:#f8f9fa;font-weight:700;padding:4px;font-size:.9rem;color:#495057}.gojuon-table .row-header{background-color:#f8f9fa;font-weight:700;padding:4px;font-size:.8rem;color:#495057;white-space:nowrap;width:15%}.gojuon-table .kana-cell{padding:0;position:relative;width:auto;height:60px}.gojuon-table .kana-item{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;width:100%;padding:8px;cursor:pointer;transition:all .2s ease;position:relative;background:#fff}.gojuon-table .kana-item:hover{background-color:#f8f9fa;transform:scale(1.05)}.gojuon-table .kana-item .audio-indicator{position:absolute;top:4px;right:4px;font-size:.7rem;opacity:.7}.gojuon-table .kana-item .hiragana{font-size:1.2rem;font-weight:700;margin-bottom:1px;line-height:1}.gojuon-table .kana-item .katakana{font-size:.8rem;color:#666;margin-bottom:1px;line-height:1}.gojuon-table .kana-item .romaji{font-size:.65rem;color:#007bff;font-weight:700;line-height:1}.gojuon-table .kana-item.selected{background-color:#007bff;color:#fff;transform:scale(1.05)}.gojuon-table .kana-item.selected .romaji{color:#cce7ff}.writing-animation-display{display:flex;justify-content:center;align-items:center;min-height:200px}.gojuon-table .empty-cell{height:60px;background-color:#f8f9fa}@media (min-width: 480px){.dictionary-grid{grid-template-columns:repeat(3,1fr);gap:14px}.gojuon-table .kana-cell{height:70px}.gojuon-table .row-header{font-size:.9rem;padding:6px}.gojuon-table th{font-size:1rem;padding:6px}.gojuon-table .kana-item .hiragana{font-size:1.4rem}.gojuon-table .kana-item .katakana{font-size:.9rem}.gojuon-table .kana-item .romaji{font-size:.75rem}.gojuon-table .empty-cell{height:70px}}@media (min-width: 768px){.container{max-width:600px;padding:24px}.dictionary-grid{grid-template-columns:repeat(5,1fr);gap:16px}.gojuon-table .kana-cell{height:90px}.gojuon-table .row-header{font-size:1rem;padding:8px}.gojuon-table th{font-size:1.2rem;padding:8px}.gojuon-table .kana-item .hiragana{font-size:1.8rem}.gojuon-table .kana-item .katakana{font-size:1.2rem}.gojuon-table .kana-item .romaji{font-size:.9rem}.gojuon-table .empty-cell{height:90px}.hiragana,.katakana{font-size:3rem}.romaji{font-size:1.8rem}.btn{min-width:80px;min-height:80px;font-size:1.5rem}}