*{box-sizing:border-box;margin:0;padding:0}:root{color:#333;background-color:#f5f5f5;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-weight:400;line-height:1.5}body{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);min-width:320px;min-height:100vh;margin:0}#app{background:#fffffff2;border:none;border-radius:15px;max-width:1200px;min-height:auto;margin:2rem auto;padding:2rem;display:block;box-shadow:0 10px 30px #0000001a}.header{text-align:center;color:#fff;background:linear-gradient(90deg,#3498db,#9b59b6);border-radius:10px;margin-bottom:2rem;padding:1.5rem;box-shadow:0 4px 15px #0000001a}.header h1{margin-bottom:.5rem;font-size:2rem;font-weight:600}.header p{opacity:.9;font-size:1rem}.input-section{background:#f8f9fa;border-radius:10px;margin-bottom:2rem;padding:1.5rem;box-shadow:0 2px 10px #0000000d}.input-section h2{color:#2c3e50;margin-bottom:1rem;font-size:1.2rem;font-weight:600}.input-controls{flex-wrap:wrap;gap:1rem;margin-bottom:1rem;display:flex}.upload-btn,.confirm-btn,.reset-btn{cursor:pointer;border:none;border-radius:6px;padding:.75rem 1.5rem;font-size:.9rem;font-weight:500;transition:all .2s}.upload-btn{color:#fff;background:#3498db}.upload-btn:hover{background:#2980b9;transform:translateY(-2px)}.confirm-btn{color:#fff;background:#9b59b6}.confirm-btn:hover{background:#8e44ad;transform:translateY(-2px)}.reset-btn{color:#fff;background:#95a5a6}.reset-btn:hover{background:#7f8c8d;transform:translateY(-2px)}.input-section textarea{resize:vertical;border:2px solid #e9ecef;border-radius:6px;width:100%;min-height:120px;padding:1rem;font-family:inherit;font-size:1rem;transition:border-color .2s}.input-section textarea:focus{border-color:#3498db;outline:none;box-shadow:0 0 0 3px #3498db1a}.evaluation-section{background:#f8f9fa;border-radius:10px;margin-bottom:2rem;padding:1.5rem;box-shadow:0 2px 10px #0000000d}.evaluation-section h2{color:#2c3e50;margin-bottom:1rem;font-size:1.2rem;font-weight:600}.result-container{position:relative}.recording-area{background:#fff;border:2px dashed #e9ecef;border-radius:10px;flex-direction:column;justify-content:center;align-items:center;min-height:120px;margin-bottom:1.5rem;padding:1.5rem;display:flex}.mic-icon{color:#3498db;margin-bottom:1rem;font-size:3rem}.processing,.recording{margin-bottom:1rem;font-size:1.1rem;font-weight:500}.processing{color:#f39c12}.recording{color:#e74c3c;animation:1.5s infinite pulse}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.recording-area p{color:#7f8c8d;text-align:center}.control-buttons{flex-wrap:wrap;gap:1rem;margin-bottom:1rem;display:flex}.start-btn,.stop-btn,.reset-eval-btn{cursor:pointer;border:none;border-radius:6px;padding:.75rem 1.5rem;font-size:.9rem;font-weight:500;transition:all .2s}.start-btn{color:#fff;background:#27ae60}.start-btn:hover:not(:disabled){background:#229954;transform:translateY(-2px)}.stop-btn{color:#fff;background:#e74c3c}.stop-btn:hover:not(:disabled){background:#c0392b;transform:translateY(-2px)}.reset-eval-btn{color:#fff;background:#f39c12}.reset-eval-btn:hover:not(:disabled){background:#e67e22;transform:translateY(-2px)}button:disabled{opacity:.6;cursor:not-allowed;transform:none}.timer{text-align:center;color:#7f8c8d;margin-top:1rem;font-size:.9rem}.details-section{background:#f8f9fa;border-radius:10px;margin-bottom:2rem;padding:1.5rem;box-shadow:0 2px 10px #0000000d}.details-section h2{color:#2c3e50;margin-bottom:1rem;font-size:1.2rem;font-weight:600}.score-card{background:#fff;border-radius:10px;padding:1.5rem;box-shadow:0 2px 10px #0000000d}.total-score{text-align:center;border-bottom:1px solid #e9ecef;margin-bottom:1.5rem;padding-bottom:1.5rem}.score-label{color:#7f8c8d;margin-bottom:.5rem;font-size:1rem;display:block}.score-value{color:#3498db;font-size:3rem;font-weight:700;display:block}.detail-scores{border-bottom:1px solid #e9ecef;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1rem;margin-bottom:1.5rem;padding-bottom:1.5rem;display:grid}.score-item{text-align:center;background:#f8f9fa;border-radius:6px;padding:1rem}.score-name{color:#7f8c8d;margin-bottom:.5rem;font-size:.9rem;display:block}.score-number{color:#27ae60;font-size:1.5rem;font-weight:700;display:block}.suggestions{margin-top:1.5rem}.suggestions h3{color:#2c3e50;margin-bottom:.5rem;font-size:1rem;font-weight:600}.suggestions p{color:#555;line-height:1.5}@media (width<=768px){#app{margin-top:1rem;margin-bottom:1rem;padding:1rem}.header h1{font-size:1.5rem}.input-controls,.control-buttons{flex-direction:column}.recording-area{padding:2rem}.detail-scores{grid-template-columns:1fr}}@media (width<=480px){.header h1{font-size:1.3rem}.header p{font-size:.9rem}.input-section textarea{min-height:100px}.recording-area{padding:1.5rem}.mic-icon,.score-value{font-size:2rem}}