:root{--color-primary:#7c3aed;--color-primary-hover:#6d28d9;--color-secondary:#e11d48;--color-secondary-hover:#be123c;--color-accent:#2563eb;--color-accent-hover:#1d4ed8;--bg-main:#0f172a;--bg-surface:#1e293bb3;--bg-surface-hover:#1e293be6;--border-subtle:#ffffff1a;--text-main:#f8fafc;--text-muted:#cbd5e1;--font-family:"Outfit", system-ui, -apple-system, sans-serif;--radius-lg:1.5rem;--radius-md:1rem;--radius-sm:.5rem;--spacing-base:1.5rem;--transition-fast:.2s cubic-bezier(.4, 0, .2, 1);--transition-spring:.5s cubic-bezier(.34, 1.56, .64, 1)}body{font-family:var(--font-family);background:var(--bg-main) radial-gradient(circle at top right, #7c3aed26 0%, transparent 40%), radial-gradient(circle at bottom left, #e11d4826 0%, transparent 40%);color:var(--text-main);-webkit-font-smoothing:antialiased;background-attachment:fixed;min-height:100vh;margin:0;padding:0;line-height:1.6}h1,h2,h3,h4{letter-spacing:-.02em;margin:0 0 1rem;font-weight:600;line-height:1.2}h1{background:linear-gradient(135deg,#a78bfa,#f43f5e);-webkit-text-fill-color:transparent;text-shadow:0 4px 12px #7c3aed4d;-webkit-background-clip:text;font-size:clamp(2.5rem,5vw,4rem)}h2{font-size:clamp(2rem,4vw,3rem)}p{color:var(--text-muted);margin-bottom:2rem;font-size:clamp(1.2rem,2vw,1.5rem)}.glass-panel{background:var(--bg-surface);-webkit-backdrop-filter:blur(16px);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);transition:transform var(--transition-spring), box-shadow var(--transition-fast);padding:clamp(2rem,5vw,4rem);box-shadow:0 25px 50px -12px #00000080}button,.btn{background:var(--color-primary);color:#fff;font-size:clamp(1.2rem,2vw,1.5rem);font-weight:600;font-family:var(--font-family);cursor:pointer;transition:all var(--transition-spring);border:none;border-radius:99px;justify-content:center;align-items:center;gap:.75rem;padding:1.25rem 2.5rem;text-decoration:none;display:inline-flex;box-shadow:0 4px 14px #7c3aed66}button:hover,.btn:hover{background:var(--color-primary-hover);transform:translateY(-4px)scale(1.02);box-shadow:0 8px 24px #7c3aed99}button:active,.btn:active{transform:translateY(0)scale(.98)}button.btn-danger,.btn.btn-danger{background:var(--color-secondary);box-shadow:0 4px 14px #e11d4866}button.btn-danger:hover,.btn.btn-danger:hover{background:var(--color-secondary-hover);box-shadow:0 8px 24px #e11d4899}button.btn-outline,.btn.btn-outline{border:2px solid var(--border-subtle);box-shadow:none;background:0 0}button.btn-outline:hover,.btn.btn-outline:hover{background:#ffffff1a;border-color:#ffffff4d;box-shadow:0 8px 24px #0003}input,textarea{border:1px solid var(--border-subtle);border-radius:var(--radius-md);color:#fff;width:100%;font-size:1.2rem;font-family:var(--font-family);transition:all var(--transition-fast);box-sizing:border-box;background:#0003;padding:1.25rem}input:focus,textarea:focus{border-color:var(--color-primary);outline:none;box-shadow:0 0 0 3px #7c3aed4d}::placeholder{color:#ffffff4d}.container{flex-direction:column;max-width:1000px;min-height:100vh;margin:0 auto;padding:2rem;display:flex}.center-content{text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;display:flex}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{animation:.6s cubic-bezier(.2,.8,.2,1) forwards fadeIn}@keyframes pulse{0%{box-shadow:0 0 #e11d48b3}70%{box-shadow:0 0 0 20px #e11d4800}to{box-shadow:0 0 #e11d4800}}.is-recording{animation:2s infinite pulse}