body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.App{background-color:#f5f7fa;color:#333;display:flex;flex-direction:column;font-family:Noto Sans TC,Microsoft JhengHei,sans-serif;min-height:100vh;text-align:center}.App-header{background-color:#4a6fa5;box-shadow:0 2px 10px #0000001a;color:#fff;padding:1.5rem 0}.App-header h1{font-size:2rem;font-weight:700;margin:0}.App-main{flex:1 1;margin:0 auto;max-width:1200px;padding:2rem;width:100%}.start-screen{background-color:#fff;border-radius:10px;box-shadow:0 4px 15px #0000000d;margin:2rem auto;max-width:600px;padding:2rem}.start-screen h2{color:#4a6fa5;margin-bottom:1.5rem}.character-display{font-size:48px;margin-bottom:16px}.character-info{font-size:16px}.character-info p{margin:8px 0}.character-display,.symbol-display{min-height:48px}.mode-buttons{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-bottom:20px}.mode-buttons button{font-size:16px;min-width:120px;padding:10px 20px}.time-settings{margin-bottom:20px;margin-top:20px}.time-buttons{display:flex;gap:10px;justify-content:center}.time-buttons button{background-color:#f0f0f0;border:none;border-radius:4px;cursor:pointer;margin:0 4px;padding:8px 16px}.time-buttons button.active{background-color:#4a6fa5;color:#fff}.time-buttons button:hover{font-size:14px;padding:8px 16px}.last-score{background-color:#f0f0f0;border-radius:8px;margin-top:20px;padding:15px;text-align:center}.game-screen{display:flex;flex-direction:column;gap:2rem}.game-info{background-color:#fff;border-radius:10px;box-shadow:0 2px 10px #0000000d;display:flex;justify-content:space-between;padding:1rem}.score-info{align-items:center;display:flex;flex-direction:column}.symbol-info p{margin:4px 0}.timer{align-items:center;display:flex;gap:1rem}.score-info p,.timer p{font-weight:500;margin:.3rem 0}.timer p{color:#e74c3c;font-weight:700}.time-adjust-btn{background-color:#4a6fa5;border:none;border-radius:5px;color:#fff;cursor:pointer;font-size:.9rem;padding:.3rem .8rem;transition:all .2s}.time-adjust-btn:hover{background-color:#3a5a8c}.typing-area{background-color:#fff;border-radius:10px;box-shadow:0 4px 15px #0000000d;padding:2rem}.current-symbol,.typing-area{margin-bottom:2rem}.symbol-display{color:#4a6fa5;font-size:5rem;font-weight:700;margin-bottom:.5rem}.symbol-info p{color:#666;font-size:1.2rem}.typing-area input{border:2px solid #ddd;border-radius:5px;font-size:1.2rem;max-width:300px;padding:.8rem 1rem;text-align:center;transition:border-color .3s;width:100%}.typing-area input:focus{border-color:#4a6fa5;outline:none}.keyboard-layout{grid-gap:1.5rem;background-color:#fff;border-radius:10px;box-shadow:0 4px 15px #0000000d;display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));padding:1.5rem}.keyboard-section h3{color:#4a6fa5;font-size:1.2rem;margin-bottom:1rem;margin-top:0}.key-grid{grid-gap:.8rem;display:grid;gap:.8rem;grid-template-columns:repeat(auto-fill,minmax(60px,1fr))}.key-item{align-items:center;background-color:#f0f4f8;border-radius:5px;display:flex;flex-direction:column;padding:.8rem .5rem;transition:all .3s}.key-item.active{background-color:#4a6fa5;box-shadow:0 2px 10px #4a6fa54d;color:#fff;transform:scale(1.05)}.key-item .symbol{font-size:1.5rem;font-weight:700;margin-bottom:.3rem}.key-item .key-name{color:#666;font-size:.8rem}.key-item.active .key-name{color:#fffc}.App-footer{background-color:#4a6fa5;color:#fff;font-size:.9rem;margin-top:auto;padding:1rem 0}.App-footer p{margin:0;opacity:.8}.virtual-keyboard{background-color:#fff;border-radius:10px;box-shadow:0 4px 15px #0000000d;margin-bottom:2rem;padding:1.5rem}.virtual-keyboard h3{color:#4a6fa5;font-size:1.2rem;margin-bottom:1rem;margin-top:0;text-align:center}.keyboard-container{display:flex;flex-direction:column;gap:.5rem;margin:0 auto;max-width:800px}.keyboard-row{gap:.3rem}.keyboard-key,.keyboard-row{display:flex;justify-content:center}.keyboard-key{align-items:center;background-color:#f0f4f8;border:1px solid #ddd;border-radius:5px;box-shadow:0 2px 4px #0000001a;cursor:pointer;flex-direction:column;height:50px;position:relative;transition:all .2s;user-select:none;-webkit-user-select:none;-moz-user-select:none;width:50px}.keyboard-key.left-pinky{background-color:#d6ffd6!important}.keyboard-key.left-ring{background-color:#d6eaff!important}.keyboard-key.left-middle{background-color:#fff7d6!important}.keyboard-key.left-index,.keyboard-key.right-index{background-color:#ffd6d6!important}.keyboard-key.right-middle{background-color:#fff7d6!important}.keyboard-key.right-ring{background-color:#d6eaff!important}.keyboard-key.right-pinky{background-color:#d6ffd6!important}.keyboard-key.right-thumb{background-color:#fff!important}.keyboard-key.active{background-color:#4a6fa5!important;box-shadow:0 0 2px #0003;color:#fff;transform:translateY(2px)}.keyboard-key.has-symbol{background-color:#e8f0fe;border-color:#4a6fa5}.key-label{font-size:1rem;font-weight:500}.key-symbol{color:#4a6fa5;font-size:.9rem;font-weight:700;position:absolute;right:3px;top:2px}.keyboard-key.active .key-symbol{color:#fff}.space-key{height:40px;margin-top:.5rem;width:300px}.key-spacer{width:25px}.keyboard-note{color:#666;font-size:.9rem;margin-top:1rem;text-align:center}@media (max-width:768px){.App-header h1{font-size:1.5rem}.App-main{padding:1rem}.keyboard-layout{grid-template-columns:1fr}.symbol-display{font-size:4rem}.keyboard-key{font-size:.8rem;height:40px;width:32px}.space-key{height:35px;width:180px}.key-spacer{width:16px}}
/*# sourceMappingURL=main.b9dca33d.css.map*/