*{box-sizing:border-box}html,body,.container{height:100%}body{font-family:Arial,sans-serif;font-size:16px;margin:0;padding:0;background-color:#01030b;color:#fff}.container{padding:0 20px;border-radius:8px;max-width:520px;margin:0 auto;display:flex;flex-direction:column;overflow:hidden}textarea{width:100%;height:100px;margin:10px 0;padding:10px;border:1px solid #ddd;border-radius:4px;resize:vertical;font-family:monospace}button,[role=button]{cursor:pointer;user-select:none;-webkit-user-select:none}button{background:#007cba;color:#fff;border:none;padding:10px 20px;border-radius:4px;margin:5px}button:hover{background:#005a87}button:disabled{background:#ccc;cursor:not-allowed}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}.dots{display:none;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);margin-top:20px;font-weight:700;color:#575f71;text-align:center;font-size:14px}.dots i{animation-name:blink2;animation-duration:1.4s;animation-iteration-count:infinite;animation-fill-mode:both;margin:0 10px 20px;display:inline-block;vertical-align:top;width:24px;height:24px;border-radius:50%;background:#4989d2}.dots i:nth-child(2){animation-delay:.2s}.dots i:nth-child(3){animation-delay:.4s}@keyframes blink2{0%{opacity:.2}20%{opacity:1}to{opacity:.2}}.voice-controls{min-height:60px}#recordBtn{font-size:16px;position:fixed;bottom:-150px;width:550px;height:550px;left:50%;margin-left:-275px;overflow:hidden;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}#recordBtn:before{content:"";position:absolute;bottom:150px;left:0;width:100%;height:184px;background:linear-gradient(to top,#01030b 0% 40%,#01030b00)}#speech-container{position:relative}#recordBtn .text,#recordBtn .disabled-text{pointer-events:none;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);margin-top:60px;font-weight:700}#recordBtn .disabled-text{display:none;font-size:14px;color:#575f71}#recordBtn.recording .text,#recordBtn.disabled .text{display:none}#recordBtn.disabled{pointer-events:none}#recordBtn.disabled .disabled-text{display:block}.transcription{background:#e3f2fd;border:1px solid #90caf9;border-radius:4px;padding:10px;margin:10px 0}.status{padding:10px;border-radius:4px;margin:10px 0}.connected{background:#d4edda;color:#155724;border:1px solid #c3e6cb}.disconnected{background:#f8d7da;color:#721c24;border:1px solid #f5c6cb}.processing{background:#fff3cd;color:#856404;border:1px solid #ffeeba}#messages{margin:20px 0;display:flex;flex-direction:column;gap:16px;height:100%;min-height:200px;overflow-y:auto;padding-bottom:60px}.message{display:flex;gap:8px}.message .text{white-space:pre-wrap;padding:12px 16px;border-radius:20px;background:#222833}.message.sent{align-self:flex-end}.message.sent .text{background:#4a5771;text-align:right}.processing-msg{background:#fff3cd;font-style:italic}#rive-container canvas{width:100%!important;height:100%!important}#processingStatus{display:none;padding:10px;background:#fff3cd;border:1px solid #ffeeba;border-radius:4px;margin:10px 0;text-align:center}#processingStatus.active{display:block}.spinner{display:inline-block;width:16px;height:16px;border:2px solid #856404;border-radius:50%;border-top-color:transparent;animation:spin 1s linear infinite;margin-right:8px;vertical-align:middle}@keyframes spin{to{transform:rotate(360deg)}}.star-result{display:none;background:linear-gradient(135deg,#1a1a2e,#16213e);border-radius:12px;padding:24px;margin:20px 0;color:#fff;text-align:center}.result-header{font-size:24px;font-weight:700;margin-bottom:16px}.stars{font-size:36px;margin:12px 0}.star{color:#ffc107;margin:0 2px}.star.empty{color:#555}.total-score{font-size:20px;font-weight:700;margin:16px 0}.scores-table{display:flex;justify-content:center;gap:40px;margin:20px 0;padding:16px;background:#ffffff1a;border-radius:8px}.score-item{display:flex;flex-direction:column;align-items:center;gap:8px}.score-label{font-size:16px;opacity:.9}.score-value{font-size:24px;font-weight:700}.feedback-box{margin-top:20px;padding:16px;background:#ffffff0d;border-left:4px solid #ffc107;border-radius:0 8px 8px 0;text-align:left}.feedback-author{display:block;font-weight:700;margin-bottom:8px}.feedback-text{font-style:italic;opacity:.9;line-height:1.5}.prompt-editor{margin-top:10px}#promptInput{width:100%;height:300px;font-family:monospace;font-size:13px;line-height:1.4;padding:12px;border:1px solid #ddd;border-radius:4px;resize:vertical}.prompt-buttons{display:flex;align-items:center;gap:10px;margin-top:10px}#promptStatus{font-size:14px;margin-left:10px}#promptStatus.success{color:#28a745}#promptStatus.error{color:#dc3545}#promptSection{display:none;position:relative;z-index:1;margin-top:20px;padding:10px;border-radius:8px}#promptSection summary{padding:5px;-webkit-user-select:none;user-select:none}.typing-cursor:after{content:"▋";animation:blink .7s infinite;color:#007cba;font-weight:400}@keyframes blink{0%,50%{opacity:1}51%,to{opacity:0}}