html{scroll-behavior:smooth}body{margin:0;font-family:Crimson Pro,Georgia,serif;background:linear-gradient(135deg,#fff8e7,bisque,#ffdab9);min-height:100vh}.demo-container.svelte-1du1zi4{min-height:100vh;display:flex;flex-direction:column}.demo-header.svelte-1du1zi4{background:#fffc;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid rgba(184,216,190,.3);padding:1.5rem 2rem}.header-content.svelte-1du1zi4{text-align:center}.header-content.svelte-1du1zi4 h1:where(.svelte-1du1zi4){font-family:Quicksand,sans-serif;font-size:clamp(2rem,5vw,3rem);font-weight:700;color:#8b6f5c;margin:0 0 .5rem}.demo-main.svelte-1du1zi4{flex:1;max-width:900px;margin:0 auto;padding:3rem 2rem;width:100%;box-sizing:border-box}.demo-card.svelte-1du1zi4{background:#fff;border-radius:30px;box-shadow:0 10px 40px #b8d8be40;padding:3rem 4rem;max-width:100%;width:100%;margin:0 auto;box-sizing:border-box}.tab-nav.svelte-1du1zi4{display:flex;gap:.5rem;margin-bottom:2rem;background:#f5f5f5;border-radius:15px;padding:.25rem}.tab-btn.svelte-1du1zi4{flex:1;padding:1rem;border:none;background:transparent;border-radius:12px;font-family:Quicksand,sans-serif;font-weight:600;font-size:1rem;color:#8b6f5c;cursor:pointer;transition:all .3s ease}.tab-btn.svelte-1du1zi4:hover{background:#ffb0881a}.tab-btn.active.svelte-1du1zi4{background:#fff;color:#ff8b7d;box-shadow:0 2px 10px #0000001a}.tab-content.svelte-1du1zi4{animation:svelte-1du1zi4-fadeIn .3s ease}@keyframes svelte-1du1zi4-fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.section.svelte-1du1zi4{margin-bottom:2rem}.section.svelte-1du1zi4:last-child{margin-bottom:0}.section.svelte-1du1zi4 h2:where(.svelte-1du1zi4){font-family:Quicksand,sans-serif;font-size:1.3rem;font-weight:600;color:#8b6f5c;margin:0 0 .5rem}.section-desc.svelte-1du1zi4{font-size:.95rem;color:#8b7355;margin:0 0 1rem}.script-selector.svelte-1du1zi4{margin-bottom:1rem}.script-selector.svelte-1du1zi4 select:where(.svelte-1du1zi4){width:100%;padding:.75rem 1rem;font-size:1rem;font-family:Quicksand,sans-serif;border:2px solid #e5e7eb;border-radius:10px;background:#fff;color:#374151;cursor:pointer;transition:all .2s ease}.script-selector.svelte-1du1zi4 select:where(.svelte-1du1zi4):hover{border-color:#8b6f5c}.script-selector.svelte-1du1zi4 select:where(.svelte-1du1zi4):focus{outline:none;border-color:#8b6f5c;box-shadow:0 0 0 3px #8b6f5c1a}.script-preview-box.svelte-1du1zi4{background:#f9fafb;border:1px solid #e5e7eb;border-radius:10px;padding:1rem;margin-bottom:1rem}.script-preview-box.svelte-1du1zi4 .preview-label:where(.svelte-1du1zi4){font-size:.8rem;font-weight:600;color:#8b6f5c;margin:0 0 .5rem;text-transform:uppercase;letter-spacing:.5px}.script-content.svelte-1du1zi4{font-size:.95rem;color:#4b5563;line-height:1.6;margin:0;font-style:italic}.language-selector.svelte-1du1zi4{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem;margin-bottom:1rem}.language-option.svelte-1du1zi4{padding:1rem .5rem;border:2px solid #B8D8BE;border-radius:15px;background:#fff;cursor:pointer;transition:all .3s ease;display:flex;flex-direction:column;align-items:center;gap:.25rem}.language-option.svelte-1du1zi4:hover{border-color:#ffb088;background:#ffb0880d}.language-option.active.svelte-1du1zi4{border-color:#ff8b7d;background:linear-gradient(135deg,#ffb08826,#ff8b7d26)}.lang-flag.svelte-1du1zi4{font-size:1.75rem}.lang-name.svelte-1du1zi4{font-family:Quicksand,sans-serif;font-weight:500;font-size:.8rem;color:#8b6f5c}.language-note.svelte-1du1zi4{font-size:.85rem;color:#8b7355;text-align:center;margin:.5rem 0 0}.upload-area.svelte-1du1zi4{border:2px dashed #B8D8BE;border-radius:15px;padding:1.5rem;background:#fafafa;transition:all .3s ease;margin-bottom:1rem}.upload-area.dragging.svelte-1du1zi4{border-color:#ff8b7d;background:#ff8b7d1a;transform:scale(1.02)}.upload-area.has-file.svelte-1du1zi4{border-color:#4caf50;background:#4caf500d}.drop-zone.svelte-1du1zi4{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:1.5rem;min-height:80px;margin-bottom:1rem}.drop-icon.svelte-1du1zi4{font-size:2.5rem;margin-bottom:.5rem}.drop-text.svelte-1du1zi4{font-size:1rem;color:#8b7355;font-weight:500}.file-selected.svelte-1du1zi4{display:flex;flex-direction:column;align-items:center;gap:.25rem}.file-selected.svelte-1du1zi4 .file-icon:where(.svelte-1du1zi4){font-size:2rem}.file-selected.svelte-1du1zi4 .file-name:where(.svelte-1du1zi4){font-weight:600;color:#2d3748;font-size:.95rem}.file-selected.svelte-1du1zi4 .file-size:where(.svelte-1du1zi4){font-size:.8rem;color:#718096}.recording-indicator.svelte-1du1zi4{display:flex;flex-direction:column;align-items:center;gap:.5rem}.recording-icon.svelte-1du1zi4{font-size:2rem;animation:svelte-1du1zi4-pulse 1s infinite}@keyframes svelte-1du1zi4-pulse{0%,to{opacity:1}50%{opacity:.5}}.recording-text.svelte-1du1zi4{font-weight:600;color:#e53e3e}.recording-time.svelte-1du1zi4{font-size:.85rem;color:#718096}.upload-actions.svelte-1du1zi4{display:flex;justify-content:center;gap:1rem;flex-wrap:wrap}.upload-option.svelte-1du1zi4{position:relative}.file-input.svelte-1du1zi4{display:none}.action-btn.svelte-1du1zi4{display:flex;align-items:center;gap:.5rem;padding:.75rem 1.25rem;border:none;border-radius:10px;font-family:Quicksand,sans-serif;font-weight:600;font-size:.95rem;cursor:pointer;transition:all .2s ease}.upload-btn.svelte-1du1zi4{background:linear-gradient(135deg,#8b6f5c,#6b5344);color:#fff}.upload-btn.svelte-1du1zi4:hover{background:linear-gradient(135deg,#9b7f6c,#7b6354);transform:translateY(-2px)}.record-btn.svelte-1du1zi4{background:linear-gradient(135deg,#ff8b7d,#ff6b5d);color:#fff}.record-btn.svelte-1du1zi4:hover:not(:disabled){background:linear-gradient(135deg,#ff9b8d,#ff7b6d);transform:translateY(-2px)}.record-btn.recording.svelte-1du1zi4{background:linear-gradient(135deg,#e53e3e,#c53030)}.record-btn.svelte-1du1zi4:disabled{opacity:.6;cursor:not-allowed}.action-btn.svelte-1du1zi4 .btn-icon:where(.svelte-1du1zi4){font-size:1.1rem}.file-name.svelte-1du1zi4{font-family:Quicksand,sans-serif;font-weight:600;color:#4caf50}.audio-preview.svelte-1du1zi4{margin-top:1rem;padding:1rem;background:#f5f5f5;border-radius:15px}.audio-preview.svelte-1du1zi4 audio:where(.svelte-1du1zi4){width:100%;margin-top:.5rem}textarea.svelte-1du1zi4{width:100%;padding:1rem;border:2px solid #B8D8BE;border-radius:15px;font-family:Crimson Pro,Georgia,serif;font-size:1rem;color:#8b6f5c;background:#fff;resize:vertical;transition:all .3s ease;box-sizing:border-box}textarea.svelte-1du1zi4:focus{outline:none;border-color:#ff8b7d;box-shadow:0 0 0 3px #ff8b7d1a}.char-count.svelte-1du1zi4{font-size:.8rem;color:#8b7355;text-align:right;margin:.5rem 0 0}.error-banner.svelte-1du1zi4{display:flex;align-items:center;gap:.75rem;padding:1rem 1.5rem;background:#ff8b7d26;border:1px solid rgba(255,139,125,.3);border-radius:15px;margin-bottom:1.5rem;font-family:Quicksand,sans-serif;color:#8b6f5c}.success-banner.svelte-1du1zi4{display:flex;align-items:center;gap:.75rem;padding:1rem 1.5rem;background:#4caf5026;border:1px solid rgba(76,175,80,.3);border-radius:15px;margin-bottom:1.5rem;font-family:Quicksand,sans-serif;color:#4caf50}.info-banner.svelte-1du1zi4{display:flex;align-items:center;gap:.75rem;padding:1rem 1.5rem;background:#2196f31a;border:1px solid rgba(33,150,243,.3);border-radius:15px;margin-bottom:1.5rem;font-family:Quicksand,sans-serif;color:#1976d2}.server-status-banner.svelte-1du1zi4{display:flex;align-items:center;gap:.75rem;padding:1rem 1.5rem;background:#ff980026;border:1px solid rgba(255,152,0,.3);border-radius:15px;margin:1rem;font-family:Quicksand,sans-serif;color:#e65100}.server-status-banner.svelte-1du1zi4 .status-icon:where(.svelte-1du1zi4){font-size:1.5rem}.server-status-banner.svelte-1du1zi4 .status-text:where(.svelte-1du1zi4){font-size:.95rem}.error-icon.svelte-1du1zi4,.success-icon.svelte-1du1zi4,.info-icon.svelte-1du1zi4{font-size:1.2rem}.script-selector.svelte-1du1zi4{margin-bottom:1.5rem}.script-selector.svelte-1du1zi4 select:where(.svelte-1du1zi4){width:100%;padding:.875rem 1rem;border:2px solid #B8D8BE;border-radius:15px;font-family:Quicksand,sans-serif;font-size:1rem;color:#8b6f5c;background:#fff;transition:all .3s ease;box-sizing:border-box}.script-selector.svelte-1du1zi4 select:where(.svelte-1du1zi4):focus{outline:none;border-color:#ff8b7d}.script-preview.svelte-1du1zi4{padding:1rem;background:#f5f5f5;border-radius:15px;margin-bottom:1.5rem}.preview-label.svelte-1du1zi4{font-family:Quicksand,sans-serif;font-weight:600;font-size:.85rem;color:#8b7355;margin:0 0 .5rem}.script-preview.svelte-1du1zi4 p:where(.svelte-1du1zi4){margin:0;color:#8b6f5c;font-style:italic}.controls-section.svelte-1du1zi4{margin-top:2rem;display:flex;gap:1rem;flex-wrap:wrap}.btn.svelte-1du1zi4{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:1rem 2rem;border:none;border-radius:15px;font-family:Quicksand,sans-serif;font-weight:600;font-size:1rem;cursor:pointer;transition:all .3s ease}.btn.svelte-1du1zi4:disabled{opacity:.6;cursor:not-allowed}.btn.primary.svelte-1du1zi4{background:linear-gradient(135deg,#ff8b7d,#ffb088);color:#fff}.btn.primary.svelte-1du1zi4:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 5px 20px #ff8b7d66}.btn.secondary.svelte-1du1zi4{background:#b8d8be;color:#5a7a60}.btn.secondary.svelte-1du1zi4:hover:not(:disabled){background:#a5c9ad}.btn.play.svelte-1du1zi4{background:linear-gradient(135deg,#ff8b7d,#ffb088);color:#fff}.btn.play.svelte-1du1zi4:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 5px 20px #ff8b7d66}.btn.stop.svelte-1du1zi4{background:#8b7355;color:#fff}.btn.stop.svelte-1du1zi4:hover{background:#6d5a45}.btn.loading.svelte-1du1zi4{background:#f5f5f5;color:#8b7355}.btn-icon.svelte-1du1zi4{font-size:1.2rem}.spinner.svelte-1du1zi4{animation:svelte-1du1zi4-spin 1s linear infinite}@keyframes svelte-1du1zi4-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media(max-width:768px){.demo-main.svelte-1du1zi4{grid-template-columns:1fr;padding:1.5rem 1rem}.tab-nav.svelte-1du1zi4{flex-direction:column}.language-selector.svelte-1du1zi4{grid-template-columns:repeat(2,1fr)}.speaker-grid.svelte-1du1zi4{grid-template-columns:repeat(3,1fr)}.demo-card.svelte-1du1zi4{padding:2rem;border-radius:20px;box-shadow:0 4px 16px #b8d8be33}.section.svelte-1du1zi4 h2:where(.svelte-1du1zi4){font-size:1.2rem}}@media(max-width:480px){.demo-main.svelte-1du1zi4{padding:1rem .75rem}.demo-card.svelte-1du1zi4{padding:1.5rem 1rem;border-radius:16px}.demo-header.svelte-1du1zi4{padding:1rem}.tab-nav.svelte-1du1zi4{gap:.25rem;padding:.5rem}.tab-btn.svelte-1du1zi4{font-size:.9rem;padding:.75rem 1rem;min-height:48px}.language-selector.svelte-1du1zi4{grid-template-columns:repeat(2,1fr);gap:.4rem}.language-option.svelte-1du1zi4{padding:.7rem .4rem}.speaker-grid.svelte-1du1zi4{grid-template-columns:repeat(2,1fr)}.speaker-option.svelte-1du1zi4{padding:.7rem .4rem}.upload-actions.svelte-1du1zi4{flex-direction:column;align-items:stretch;gap:.5rem}.action-btn.svelte-1du1zi4{width:100%;padding:.85rem 1rem;min-height:48px}.controls-section.svelte-1du1zi4 .btn:where(.svelte-1du1zi4){width:100%;padding:.85rem 1rem;min-height:48px}.audio-player-container.svelte-1du1zi4{flex-direction:column;align-items:stretch}.section.svelte-1du1zi4 h2:where(.svelte-1du1zi4){font-size:1.1rem}.style-preset.svelte-1du1zi4{padding:.65rem .9rem;font-size:.85rem;min-height:44px}.style-presets.svelte-1du1zi4{gap:.4rem}.replay-btn.svelte-1du1zi4,.download-btn.svelte-1du1zi4{padding:.65rem .9rem;min-height:44px}textarea.svelte-1du1zi4{font-size:16px;min-height:100px;max-height:200px}.script-selector.svelte-1du1zi4 select:where(.svelte-1du1zi4){font-size:16px;padding:.85rem .75rem}}.tts-section.svelte-1du1zi4{background:#fafafa;border-radius:16px;padding:1.5rem;margin-bottom:1.5rem;border:1px solid #eee}.speaker-grid.svelte-1du1zi4{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem;margin-top:1rem}.speaker-option.svelte-1du1zi4{display:flex;flex-direction:column;align-items:center;padding:1rem .5rem;border:2px solid #e5e7eb;border-radius:12px;background:#fff;cursor:pointer;transition:all .2s ease}.speaker-option.svelte-1du1zi4:hover{border-color:#ff8b7d;background:#fff8f6}.speaker-option.active.svelte-1du1zi4{border-color:#ff8b7d;background:linear-gradient(135deg,#fff8f6,#ffe8e4);box-shadow:0 4px 12px #ff8b7d33}.speaker-icon.svelte-1du1zi4{font-size:1.75rem;margin-bottom:.25rem}.speaker-name.svelte-1du1zi4{font-family:Quicksand,sans-serif;font-weight:600;font-size:.9rem;color:#4b5563}.speaker-gender.svelte-1du1zi4{font-size:.75rem;color:#9ca3af}.style-presets.svelte-1du1zi4{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1rem}.style-preset.svelte-1du1zi4{padding:.5rem 1rem;border:2px solid #e5e7eb;border-radius:20px;background:#fff;font-family:Quicksand,sans-serif;font-size:.9rem;font-weight:500;color:#6b7280;cursor:pointer;transition:all .2s ease}.style-preset.svelte-1du1zi4:hover{border-color:#ff8b7d;color:#ff8b7d}.style-preset.active.svelte-1du1zi4{border-color:#ff8b7d;background:#ff8b7d;color:#fff}.style-input.svelte-1du1zi4{width:100%;padding:.75rem 1rem;font-size:1rem;font-family:Quicksand,sans-serif;border:2px solid #e5e7eb;border-radius:10px;background:#fff;color:#374151;transition:all .2s ease;box-sizing:border-box}.style-input.svelte-1du1zi4:hover{border-color:#8b6f5c}.style-input.svelte-1du1zi4:focus{outline:none;border-color:#8b6f5c;box-shadow:0 0 0 3px #8b6f5c1a}.generated-audio-section.svelte-1du1zi4{background:linear-gradient(135deg,#f0fdf4,#dcfce7);border-color:#86efac}.audio-player-container.svelte-1du1zi4{display:flex;align-items:center;gap:1rem;padding:1rem;background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000000d}.audio-player.svelte-1du1zi4{flex:1;height:40px;border-radius:8px}.audio-player.svelte-1du1zi4::-webkit-media-controls-panel{background:#f9fafb}.audio-controls.svelte-1du1zi4{display:flex;gap:.75rem;margin-top:.75rem}.replay-btn.svelte-1du1zi4{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem 1rem;background:#7c9e7e;color:#fff;border:none;border-radius:8px;font-family:Quicksand,sans-serif;font-weight:600;font-size:.9rem;cursor:pointer;transition:all .2s ease}.replay-btn.svelte-1du1zi4:hover{background:#6b8e6f;transform:translateY(-1px)}.download-btn.svelte-1du1zi4{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem 1rem;background:#ff8b7d;color:#fff;text-decoration:none;border-radius:8px;font-family:Quicksand,sans-serif;font-weight:600;font-size:.9rem;transition:all .2s ease}.download-btn.svelte-1du1zi4:hover{background:#ff7a6a;transform:translateY(-1px)}.audio-placeholder.svelte-1du1zi4{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem;text-align:center;color:#6b7280}.placeholder-icon.svelte-1du1zi4{font-size:3rem;margin-bottom:.5rem;opacity:.5}.audio-placeholder.svelte-1du1zi4 p:where(.svelte-1du1zi4){margin:0;font-size:.95rem}.social-gate-overlay.svelte-1du1zi4{position:fixed;inset:0;background:#0009;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:1rem;animation:svelte-1du1zi4-fadeIn .3s ease}.social-gate-modal.svelte-1du1zi4{background:#fff;border-radius:24px;padding:2.5rem 2rem;max-width:480px;width:100%;text-align:center;box-shadow:0 20px 60px #0000004d;animation:svelte-1du1zi4-scaleIn .3s ease;max-height:90vh;overflow-y:auto}@keyframes svelte-1du1zi4-fadeIn{0%{opacity:0}to{opacity:1}}@keyframes svelte-1du1zi4-scaleIn{0%{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}.social-gate-modal.svelte-1du1zi4 h3:where(.svelte-1du1zi4){font-family:Quicksand,sans-serif;font-size:1.5rem;color:#8b6f5c;margin:0 0 .75rem}.social-gate-desc.svelte-1du1zi4{font-family:Quicksand,sans-serif;font-size:1rem;color:#6b7280;margin:0 0 2rem;line-height:1.5}.social-gate-platforms.svelte-1du1zi4{display:flex;flex-direction:column;gap:.75rem;margin-bottom:1.5rem}.social-btn.svelte-1du1zi4{display:flex;align-items:center;gap:1rem;padding:1rem 1.25rem;border:2px solid #e5e7eb;border-radius:16px;background:#fff;cursor:pointer;transition:all .2s ease;text-align:left;width:100%;font-family:Quicksand,sans-serif}.social-btn.svelte-1du1zi4:hover{border-color:#ff8b7d;background:#fff5f5;transform:translateY(-2px);box-shadow:0 4px 12px #ff8b7d33}.social-icon.svelte-1du1zi4{font-size:1.75rem;flex-shrink:0}.social-label.svelte-1du1zi4{font-weight:600;font-size:.95rem;color:#1a1a1a;flex:1}.social-hint.svelte-1du1zi4{font-size:.8rem;color:#9ca3af;flex-shrink:0}.social-gate-shared.svelte-1du1zi4{background:#f0fdf4;border:2px solid #86efac;border-radius:12px;padding:1.25rem;margin-bottom:1rem;text-align:center}.social-gate-shared.svelte-1du1zi4 p:where(.svelte-1du1zi4){margin:0 0 1rem;font-family:Quicksand,sans-serif;font-weight:600;color:#166534;font-size:.95rem}.social-gate-shared.svelte-1du1zi4 .btn:where(.svelte-1du1zi4){font-size:1rem;padding:.85rem 2rem}.social-gate-close.svelte-1du1zi4{display:block;width:100%;padding:.75rem;background:none;border:none;color:#9ca3af;font-family:Quicksand,sans-serif;font-size:.9rem;cursor:pointer;margin-top:.5rem;transition:color .2s}.social-gate-close.svelte-1du1zi4:hover{color:#6b7280}.social-gate-modal.svelte-1du1zi4 .btn.primary.large:where(.svelte-1du1zi4){width:100%;font-size:1.15rem;padding:1rem 2rem}@media(max-width:480px){.social-gate-modal.svelte-1du1zi4{padding:2rem 1.25rem;border-radius:20px}.social-gate-modal.svelte-1du1zi4 h3:where(.svelte-1du1zi4){font-size:1.3rem}.social-btn.svelte-1du1zi4{padding:.85rem 1rem;gap:.75rem}.social-icon.svelte-1du1zi4{font-size:1.5rem}.social-label.svelte-1du1zi4{font-size:.9rem}}