.stefai-demo.svelte-257rbh{width:100%;max-width:500px;margin:0 auto}.stefai-demo.compact.svelte-257rbh{max-width:400px}.demo-card.svelte-257rbh{background:var(--color-surface);border-radius:16px;box-shadow:var(--elevation-2);overflow:hidden;border:1px solid var(--color-border)}.demo-header.svelte-257rbh{display:flex;align-items:center;gap:12px;padding:16px 20px;background:var(--color-surface-container);border-bottom:1px solid var(--color-border)}.product-icon.svelte-257rbh{width:40px;height:40px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden}.header-avatar.svelte-257rbh{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;border-radius:12px}.product-info.svelte-257rbh{flex:1}.product-name.svelte-257rbh{font-size:1rem;font-weight:600;color:var(--color-on-surface-high);margin:0}.product-tagline.svelte-257rbh{font-size:.875rem;color:var(--color-on-surface-medium);margin:0}.restart-button.svelte-257rbh{background:none;border:none;color:var(--color-on-surface-medium);cursor:pointer;padding:8px;border-radius:8px;transition:all .2s ease}.restart-button.svelte-257rbh:hover{background:var(--color-surface-container-high);color:var(--color-primary)}.conversation-demo.svelte-257rbh{height:300px;overflow-y:auto;padding:20px;display:flex;flex-direction:column;gap:16px;scroll-behavior:smooth}.compact.svelte-257rbh .conversation-demo:where(.svelte-257rbh){height:250px;padding:16px}.chat-bubble.svelte-257rbh{animation:svelte-257rbh-slideIn .5s ease-out forwards;opacity:0;transform:translateY(20px)}.chat-bubble.user.svelte-257rbh{align-self:flex-end}.chat-bubble.ai.svelte-257rbh{align-self:flex-start}.user-message.svelte-257rbh{background:var(--color-primary);color:#fff;padding:12px 16px;border-radius:18px 18px 4px;max-width:280px;font-size:.9rem;line-height:1.4}.message-content.svelte-257rbh{display:flex;align-items:center;gap:8px}.user-waveform.svelte-257rbh .wave-bar:where(.svelte-257rbh){background:#fffc}.ai-message-content.svelte-257rbh{display:flex;align-items:center;gap:8px;width:100%}.audio-waveform.svelte-257rbh{display:flex;align-items:center;gap:2px;height:12px;flex-shrink:0}.wave-bar.svelte-257rbh{width:2px;background:var(--color-primary);border-radius:1px;animation:svelte-257rbh-wave 1.5s ease-in-out infinite}.wave-bar.svelte-257rbh:nth-child(1){height:4px;animation-delay:0s}.wave-bar.svelte-257rbh:nth-child(2){height:8px;animation-delay:.2s}.wave-bar.svelte-257rbh:nth-child(3){height:6px;animation-delay:.4s}.wave-bar.svelte-257rbh:nth-child(4){height:10px;animation-delay:.6s}@keyframes svelte-257rbh-wave{0%,to{transform:scaleY(.3);opacity:.5}50%{transform:scaleY(1);opacity:1}}.feedback-chips.svelte-257rbh{display:flex;gap:6px;margin-top:8px;flex-wrap:wrap}.chip.svelte-257rbh{background:#fff3;color:#fff;padding:4px 8px;border-radius:12px;font-size:.75rem;font-weight:500}.ai-message.svelte-257rbh{display:flex;gap:12px;align-items:flex-start;max-width:320px}.ai-avatar.svelte-257rbh{width:32px;height:32px;border-radius:50%;background:var(--color-surface-container);display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden}.avatar-image.svelte-257rbh{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.ai-avatar.svelte-257rbh .material-icons-round:where(.svelte-257rbh){font-size:18px;color:var(--color-primary)}.ai-response.svelte-257rbh{background:var(--color-surface-container);color:var(--color-on-surface-high);padding:12px 16px;border-radius:18px 18px 18px 4px;font-size:.9rem;line-height:1.4}.demo-placeholder.svelte-257rbh{display:flex;align-items:center;justify-content:center;height:100%;color:var(--color-on-surface-medium)}.typing-indicator.svelte-257rbh{display:flex;align-items:center;gap:8px;font-size:.9rem}@keyframes svelte-257rbh-slideIn{to{opacity:1;transform:translateY(0)}}.tool-display.svelte-257rbh{max-width:320px;margin:8px 0;align-self:flex-start}.demo-card.svelte-257rbh{background:#fff;border:1px solid #e5e7eb;border-radius:1rem;padding:1rem;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;position:relative;overflow:hidden;font-size:.85rem}.demo-card.svelte-257rbh:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;opacity:.8}.pronunciation-demo.svelte-257rbh:before{background:linear-gradient(90deg,#3b82f6,#06b6d4)}.grammar-demo.svelte-257rbh:before{background:linear-gradient(90deg,#059669,#10b981)}.demo-title.svelte-257rbh{display:flex;align-items:center;gap:.5rem;margin-bottom:1rem}.demo-icon.svelte-257rbh{width:1.5rem;height:1.5rem;border-radius:.5rem;display:flex;align-items:center;justify-content:center;color:#fff}.demo-icon.svelte-257rbh svg:where(.svelte-257rbh){width:.875rem;height:.875rem}.pronunciation-icon.svelte-257rbh{background:#3b82f6}.grammar-icon.svelte-257rbh{background:#059669}.demo-title.svelte-257rbh h4:where(.svelte-257rbh){font-size:.875rem;font-weight:600;color:#1f2937;margin:0}.word-display.svelte-257rbh{text-align:center;margin-bottom:.75rem}.word.svelte-257rbh{display:block;font-size:1.125rem;font-weight:600;color:#1f2937;margin-bottom:.25rem}.phonetic.svelte-257rbh{font-size:.875rem;color:#6b7280;font-family:Courier New,monospace}.accuracy-display.svelte-257rbh{display:flex;align-items:center;gap:.75rem;margin-bottom:.75rem}.accuracy-circle.svelte-257rbh{position:relative;display:flex;align-items:center;justify-content:center}.accuracy-svg.svelte-257rbh{transform:rotate(-90deg)}.accuracy-progress.excellent.svelte-257rbh{color:#059669}.accuracy-number.svelte-257rbh{position:absolute;font-size:.75rem;font-weight:600;color:#1f2937}.accuracy-label.svelte-257rbh{font-size:.75rem;color:#6b7280}.feedback-section.svelte-257rbh{margin-bottom:.75rem}.feedback-text.svelte-257rbh{font-size:.75rem;color:#374151;line-height:1.4;margin:0}.phonetic-breakdown.svelte-257rbh h5:where(.svelte-257rbh){font-size:.75rem;font-weight:600;color:#374151;margin:0 0 .5rem}.segments.svelte-257rbh{display:flex;gap:.375rem;flex-wrap:wrap}.segment.svelte-257rbh{display:flex;align-items:center;gap:.25rem;padding:.25rem .5rem;background:#f3f4f6;border-radius:.375rem;font-family:Courier New,monospace;font-size:.625rem}.segment-text.svelte-257rbh{color:#374151}.check-icon.svelte-257rbh{width:.625rem;height:.625rem;color:#059669}.grammar-badges-demo.svelte-257rbh{display:flex;gap:.25rem;justify-content:flex-end;margin-bottom:.75rem;flex-wrap:wrap}.badge.svelte-257rbh{font-size:.625rem;font-weight:500;padding:.125rem .375rem;border-radius:.375rem;white-space:nowrap}.badge.category.svelte-257rbh{background:#dbeafe;color:#1e40af}.badge.difficulty.svelte-257rbh{background:#dcfce7;color:#166534}.badge.error-type.svelte-257rbh{background:#fce7f3;color:#be185d}.sentence-section-demo.svelte-257rbh h5:where(.svelte-257rbh),.correction-section-demo.svelte-257rbh h5:where(.svelte-257rbh){font-size:.75rem;font-weight:600;color:#374151;margin:0 0 .375rem}.sentence-highlight.svelte-257rbh{background:#f9fafb;border:1px solid #e5e7eb;border-radius:.5rem;padding:.5rem;line-height:1.4;font-size:.75rem}.normal-text.svelte-257rbh{color:#374151}.error-text.svelte-257rbh{background:#fee2e2;color:#dc2626;padding:.125rem .25rem;border-radius:.25rem;text-decoration:underline;text-decoration-color:#dc2626;text-decoration-style:wavy}.highlight-text.svelte-257rbh{padding:.125rem .25rem;border-radius:.25rem}.bg-blue-200.svelte-257rbh{background:#dbeafe}.text-blue-800.svelte-257rbh{color:#1e40af}.bg-green-200.svelte-257rbh{background:#dcfce7}.text-green-800.svelte-257rbh{color:#166534}.bg-orange-200.svelte-257rbh{background:#fed7aa}.text-orange-800.svelte-257rbh{color:#9a3412}.correction-text.svelte-257rbh{background:#f0fdf4;border:1px solid #bbf7d0;border-radius:.5rem;padding:.5rem;color:#166534;font-weight:500;font-size:.75rem}.explanation-section-demo.svelte-257rbh{background:#eff6ff;border:1px solid #bfdbfe;border-radius:.75rem;padding:.75rem;margin-top:.5rem}.explanation-content.svelte-257rbh{display:flex;gap:.5rem;align-items:flex-start}.explanation-icon.svelte-257rbh{flex-shrink:0;margin-top:.125rem}.explanation-icon.svelte-257rbh svg:where(.svelte-257rbh){width:.875rem;height:.875rem;color:#1d4ed8}.explanation-content.svelte-257rbh p:where(.svelte-257rbh){font-size:.75rem;color:#1e40af;line-height:1.4;margin:0}@media (max-width: 768px){.stefai-demo.svelte-257rbh{max-width:100%}.conversation-demo.svelte-257rbh{height:250px;padding:16px}.user-message.svelte-257rbh,.ai-response.svelte-257rbh{max-width:240px;font-size:.85rem}.ai-message.svelte-257rbh{max-width:280px}}@media (max-width: 480px){.demo-header.svelte-257rbh{padding:12px 16px}.conversation-demo.svelte-257rbh{height:220px;padding:12px}.user-message.svelte-257rbh,.ai-response.svelte-257rbh{max-width:200px;padding:10px 14px}}