*{box-sizing:border-box;margin:0;padding:0}:root{--color-bg: #121212;--color-text: #E1E1E1;--color-text-secondary: #A8A8A8;--color-accent: #82aaff;--color-recording: #ff453a;--color-border: rgba(255, 255, 255, .12);--font-primary: "Inter", sans-serif}body{font-family:var(--font-primary);background-color:var(--color-bg);color:var(--color-text);display:flex;justify-content:center;align-items:center;min-height:100vh;text-align:center}.app-container{padding:20px}.main-content{display:flex;flex-direction:column;align-items:center}.recording-interface{padding:20px;border-radius:8px;background-color:#1e1e1e;box-shadow:0 4px 12px #0000004d;display:flex;flex-direction:column;align-items:center}.status-indicator{margin-bottom:20px}.status-text{font-size:1em;color:var(--color-text-secondary)}.recording-controls{margin-bottom:20px}.record-button{position:relative;width:100px;height:100px;border-radius:50%;border:none;background-color:var(--color-accent);color:#fff;cursor:pointer;display:flex;flex-direction:column;justify-content:center;align-items:center;transition:background-color .3s ease;padding:10px}.record-button:hover{background-color:#6c8edf}.record-button.recording{background-color:var(--color-recording)}.record-button.recording:hover{background-color:#e0342a}.record-button-content-wrapper{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.record-button #micIcon{font-size:2.5em;margin-bottom:8px}.record-text{display:block;font-size:.9em;color:var(--color-text);font-weight:500}.record-waves{position:absolute;width:150px;height:150px;top:50%;left:50%;transform:translate(-50%,-50%);pointer-events:none;z-index:-1}.wave{fill:none;stroke:var(--color-accent);stroke-width:2px;opacity:0;transform-origin:center}.record-button.recording .wave{stroke:var(--color-recording)}.record-button.recording .record-waves{display:block!important}.record-button.recording .wave1{animation:wave 2s infinite ease-out}@keyframes wave{0%{transform:scale(.5) translate(-50%,-50%);opacity:.7}to{transform:scale(1.5) translate(-50%,-50%);opacity:0}}.transcription-display{margin-top:20px;padding:15px;background-color:#2a2a2a;border-radius:8px;min-height:100px;max-height:300px;overflow-y:auto;width:100%;max-width:500px;text-align:left;border:1px solid var(--color-border)}.transcription-display p{margin-bottom:8px;padding-bottom:8px;border-bottom:1px solid var(--color-border);font-size:.95em;line-height:1.5}.transcription-display p:last-child{border-bottom:none;margin-bottom:0}.image-upload-area{margin-top:25px;padding:15px;background-color:#2a2a2a;border-radius:8px;width:100%;max-width:350px;display:flex;flex-direction:column;align-items:center;gap:15px;border:1px solid var(--color-border)}.image-upload-label{display:inline-flex;align-items:center;padding:10px 15px;background-color:var(--color-accent);color:#fff;border-radius:6px;cursor:pointer;transition:background-color .2s ease;font-size:.9em}.image-upload-label:hover{background-color:#6c8edf}.image-upload-label i{margin-right:8px}.image-preview-container{position:relative;border:2px dashed var(--color-border);padding:5px;border-radius:4px;max-width:100%}#imagePreview{display:block;max-width:100%;max-height:200px;border-radius:4px;object-fit:contain}.remove-image-button{position:absolute;top:-10px;right:-10px;background-color:var(--color-recording);color:#fff;border:none;border-radius:50%;width:24px;height:24px;font-size:14px;font-weight:700;line-height:22px;text-align:center;cursor:pointer;box-shadow:0 2px 4px #0000004d}.send-image-button{padding:8px 12px;background-color:#4caf50;color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:.9em;transition:background-color .2s ease}.send-image-button:hover{background-color:#45a049}.send-image-button:disabled{background-color:#555;cursor:not-}.app-title{font-size:2em;font-weight:600;color:var(--color-text);margin-bottom:30px;text-align:center}.app-container{padding:20px;display:flex;flex-direction:column;align-items:center}