/* Shared light theme for AI video creation tools. */
body.ai-tools-unified {
    --ait-bg: #f4f7fb;
    --ait-surface: #ffffff;
    --ait-surface-soft: #f8fafc;
    --ait-border: #e2e8f0;
    --ait-border-strong: #cbd5e1;
    --ait-text: #172033;
    --ait-muted: #64748b;
    --ait-primary: #2563eb;
    --ait-primary-dark: #1d4ed8;
    --ait-primary-soft: #eff6ff;
    --ait-success: #059669;
    --ait-danger: #dc2626;
    --ait-radius: 16px;
    --ait-radius-sm: 10px;
    --ait-shadow: 0 12px 32px rgba(15, 23, 42, 0.07);
    --ait-shadow-sm: 0 4px 14px rgba(15, 23, 42, 0.06);
    background: var(--ait-bg) !important;
    color: var(--ait-text) !important;
    font-family: Inter, "Segoe UI", Arial, sans-serif !important;
}

body.ai-tools-unified,
body.ai-tools-unified * {
    box-sizing: border-box;
}

body.ai-tools-unified .blog-area {
    padding-top: 24px !important;
    padding-bottom: 32px !important;
}

body.ai-tools-unified .blog-area > .container {
    width: 100% !important;
    max-width: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

body.ai-tools-unified .page,
body.ai-tools-unified .app-container,
body.ai-tools-unified .ai-video-generator-ui {
    width: min(100% - 48px, 1440px) !important;
    max-width: 1440px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

body.ai-tools-unified .page {
    margin-top: 24px !important;
    margin-bottom: 40px !important;
    padding: 0 !important;
}

body.ai-tools-unified .app-container {
    display: grid !important;
    grid-template-columns: minmax(340px, 0.9fr) minmax(480px, 1.1fr) !important;
    align-items: start !important;
    gap: 24px !important;
    margin-top: 24px !important;
    margin-bottom: 24px !important;
    padding: 0 !important;
    min-height: 0 !important;
    background: transparent !important;
}

body.ai-tools-unified .page .layout,
body.ai-tools-unified .page .hf-layout-row {
    display: grid !important;
    grid-template-columns: minmax(340px, 0.9fr) minmax(480px, 1.1fr) !important;
    align-items: start !important;
    gap: 24px !important;
}

body.ai-tools-unified .ai-video-generator-ui {
    display: grid !important;
    grid-template-columns: minmax(340px, 0.9fr) minmax(480px, 1.1fr) !important;
    align-items: start !important;
    gap: 24px !important;
    margin-top: 24px !important;
    margin-bottom: 24px !important;
    padding: 0 !important;
    min-height: 0 !important;
    background: transparent !important;
}

body.ai-tools-unified .controls-panel,
body.ai-tools-unified .preview-panel,
body.ai-tools-unified .ai-video-generator-ui .input-panel,
body.ai-tools-unified .ai-video-generator-ui .preview-panel {
    width: auto !important;
    min-width: 0 !important;
}

body.ai-tools-unified .preview-panel,
body.ai-tools-unified .ai-video-generator-ui .preview-panel {
    position: sticky !important;
    top: 24px !important;
    height: fit-content !important;
}

body.ai-tools-unified .seo-intro,
body.ai-tools-unified .seo-faq,
body.ai-tools-unified .page > .panel,
body.ai-tools-unified .page > .layout > .panel,
body.ai-tools-unified .page > .hf-layout-row > .panel,
body.ai-tools-unified .app-container .control-section,
body.ai-tools-unified .app-container .preview-box,
body.ai-tools-unified .ai-video-generator-ui .input-panel,
body.ai-tools-unified .ai-video-generator-ui .preview-panel,
body.ai-tools-unified .ai-video-generator-ui .style-card,
body.ai-tools-unified .ai-video-generator-ui .result-card {
    background: var(--ait-surface) !important;
    border: 1px solid var(--ait-border) !important;
    border-radius: var(--ait-radius) !important;
    box-shadow: var(--ait-shadow) !important;
}

body.ai-tools-unified .seo-intro,
body.ai-tools-unified .seo-faq {
    width: min(100% - 48px, 1440px) !important;
    max-width: 1440px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 24px 28px !important;
}

body.ai-tools-unified .seo-intro {
    margin-top: 0 !important;
    margin-bottom: 24px !important;
}

body.ai-tools-unified .seo-faq {
    margin-top: 24px !important;
    margin-bottom: 12px !important;
}

body.ai-tools-unified .title,
body.ai-tools-unified .seo-page-title,
body.ai-tools-unified .controls-panel > header h1,
body.ai-tools-unified .app-title {
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--ait-text) !important;
    font-size: 24px !important;
    font-weight: 750 !important;
    letter-spacing: -0.03em !important;
    line-height: 1.2 !important;
    margin: 0 0 8px !important;
}

body.ai-tools-unified .sub,
body.ai-tools-unified .seo-page-subtitle,
body.ai-tools-unified .app-subtitle {
    color: var(--ait-muted) !important;
    font-size: 14px !important;
    line-height: 1.65 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

body.ai-tools-unified .section,
body.ai-tools-unified .page .summary-card,
body.ai-tools-unified .page .quick-preset,
body.ai-tools-unified .page .preview-action,
body.ai-tools-unified .page .tool-btn {
    background: var(--ait-surface-soft) !important;
    border-color: var(--ait-border) !important;
    color: var(--ait-text) !important;
    border-radius: var(--ait-radius-sm) !important;
}

body.ai-tools-unified .page .section {
    box-shadow: none !important;
}

body.ai-tools-unified .section-title,
body.ai-tools-unified .section h3,
body.ai-tools-unified .control-section h2,
body.ai-tools-unified .control-section h3,
body.ai-tools-unified .preview-box h2,
body.ai-tools-unified .preview-box h3 {
    color: var(--ait-text) !important;
}

body.ai-tools-unified .studio-tabs-inline,
body.ai-tools-unified .mode-tabs,
body.ai-tools-unified .rv-stepper,
body.ai-tools-unified .studio-toolbar {
    background: var(--ait-surface-soft) !important;
    border: 1px solid var(--ait-border) !important;
    border-radius: var(--ait-radius-sm) !important;
}

body.ai-tools-unified .studio-link,
body.ai-tools-unified .mode-tab,
body.ai-tools-unified .rv-step {
    color: var(--ait-muted) !important;
}

body.ai-tools-unified .studio-link.active,
body.ai-tools-unified .mode-tab.active,
body.ai-tools-unified .rv-step.active {
    color: var(--ait-primary) !important;
    border-color: var(--ait-primary) !important;
}

body.ai-tools-unified input[type="text"],
body.ai-tools-unified input[type="number"],
body.ai-tools-unified input[type="url"],
body.ai-tools-unified input[type="email"],
body.ai-tools-unified input[type="search"],
body.ai-tools-unified input[type="date"],
body.ai-tools-unified input[type="time"],
body.ai-tools-unified select,
body.ai-tools-unified textarea {
    color: var(--ait-text) !important;
    background: var(--ait-surface) !important;
    border: 1px solid var(--ait-border-strong) !important;
    border-radius: var(--ait-radius-sm) !important;
    box-shadow: none !important;
}

body.ai-tools-unified input[type="text"]:focus,
body.ai-tools-unified input[type="number"]:focus,
body.ai-tools-unified input[type="url"]:focus,
body.ai-tools-unified input[type="email"]:focus,
body.ai-tools-unified input[type="search"]:focus,
body.ai-tools-unified input[type="date"]:focus,
body.ai-tools-unified input[type="time"]:focus,
body.ai-tools-unified select:focus,
body.ai-tools-unified textarea:focus {
    outline: none !important;
    border-color: var(--ait-primary) !important;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12) !important;
}

body.ai-tools-unified input::placeholder,
body.ai-tools-unified textarea::placeholder {
    color: #94a3b8 !important;
}

body.ai-tools-unified button.button,
body.ai-tools-unified button.primary-btn,
body.ai-tools-unified button.btn-primary,
body.ai-tools-unified button.generate-btn,
body.ai-tools-unified .studio-action.primary,
body.ai-tools-unified .preview-action.primary,
body.ai-tools-unified .button:not(.secondary) {
    background: var(--ait-primary) !important;
    border: 1px solid var(--ait-primary) !important;
    color: #ffffff !important;
    border-radius: var(--ait-radius-sm) !important;
    box-shadow: 0 7px 16px rgba(37, 99, 235, 0.18) !important;
}

body.ai-tools-unified button.button:hover:not(:disabled),
body.ai-tools-unified button.primary-btn:hover:not(:disabled),
body.ai-tools-unified button.btn-primary:hover:not(:disabled),
body.ai-tools-unified button.generate-btn:hover:not(:disabled),
body.ai-tools-unified .studio-action.primary:hover:not(:disabled),
body.ai-tools-unified .preview-action.primary:hover:not(:disabled),
body.ai-tools-unified .button:not(.secondary):hover:not(:disabled) {
    background: var(--ait-primary-dark) !important;
    border-color: var(--ait-primary-dark) !important;
    transform: translateY(-1px);
}

body.ai-tools-unified button.button.secondary,
body.ai-tools-unified button.tool-btn,
body.ai-tools-unified .studio-action:not(.primary):not(.danger),
body.ai-tools-unified .preview-action:not(.primary),
body.ai-tools-unified .button.secondary {
    background: var(--ait-surface) !important;
    border: 1px solid var(--ait-border-strong) !important;
    color: var(--ait-text) !important;
    border-radius: var(--ait-radius-sm) !important;
    box-shadow: none !important;
}

body.ai-tools-unified button.button.secondary:hover:not(:disabled),
body.ai-tools-unified button.tool-btn:hover:not(:disabled),
body.ai-tools-unified .studio-action:not(.primary):not(.danger):hover:not(:disabled),
body.ai-tools-unified .preview-action:not(.primary):hover:not(:disabled),
body.ai-tools-unified .button.secondary:hover:not(:disabled) {
    background: var(--ait-primary-soft) !important;
    border-color: #93c5fd !important;
    color: var(--ait-primary-dark) !important;
}

body.ai-tools-unified .studio-action.danger,
body.ai-tools-unified .tool-btn.danger {
    color: var(--ait-danger) !important;
    border-color: #fecaca !important;
    background: #fffafa !important;
}

body.ai-tools-unified .app-container .control-section,
body.ai-tools-unified .app-container .preview-box {
    box-shadow: var(--ait-shadow-sm) !important;
}

body.ai-tools-unified .placeholder,
body.ai-tools-unified .video-placeholder,
body.ai-tools-unified .preview-content,
body.ai-tools-unified .preview-box-content {
    background: var(--ait-surface-soft) !important;
    border-color: var(--ait-border) !important;
    color: var(--ait-muted) !important;
}

body.ai-tools-unified #outputVideo,
body.ai-tools-unified video {
    border-radius: 12px !important;
}

body.ai-tools-unified .info,
body.ai-tools-unified .msg-info,
body.ai-tools-unified .success,
body.ai-tools-unified .msg-ok,
body.ai-tools-unified .warning,
body.ai-tools-unified .error,
body.ai-tools-unified .msg-err {
    border-radius: var(--ait-radius-sm) !important;
    box-shadow: none !important;
}

body.ai-tools-unified details {
    border-color: var(--ait-border) !important;
    border-radius: var(--ait-radius-sm) !important;
}

body.ai-tools-unified details summary {
    color: var(--ait-text) !important;
}

body.ai-tools-unified .seo-faq h2,
body.ai-tools-unified .seo-faq summary {
    color: var(--ait-text) !important;
}

body.ai-tools-unified .seo-faq .faq-intro,
body.ai-tools-unified .seo-faq details p {
    color: var(--ait-muted) !important;
}

body.ai-tools-unified .ai-video-generator-ui .panel-section {
    border-bottom-color: var(--ait-border) !important;
}

body.ai-tools-unified .ai-video-generator-ui .section-header {
    background: var(--ait-surface-soft) !important;
    border-radius: var(--ait-radius-sm) !important;
    color: var(--ait-text) !important;
}

body.ai-tools-unified .ai-video-generator-ui .section-content {
    background: var(--ait-surface) !important;
}

body.ai-tools-unified table {
    border-color: var(--ait-border) !important;
}

body.ai-tools-unified th {
    background: var(--ait-surface-soft) !important;
    color: var(--ait-text) !important;
}

body.ai-tools-unified td {
    border-color: var(--ait-border) !important;
}

@media (max-width: 1100px) {
    body.ai-tools-unified .app-container,
    body.ai-tools-unified .page .layout,
    body.ai-tools-unified .page .hf-layout-row,
    body.ai-tools-unified .ai-video-generator-ui {
        grid-template-columns: 1fr !important;
    }

    body.ai-tools-unified .preview-panel,
    body.ai-tools-unified .ai-video-generator-ui .preview-panel {
        position: static !important;
    }
}

@media (max-width: 640px) {
    body.ai-tools-unified .page,
    body.ai-tools-unified .app-container,
    body.ai-tools-unified .ai-video-generator-ui,
    body.ai-tools-unified .seo-intro,
    body.ai-tools-unified .seo-faq {
        width: calc(100% - 24px) !important;
    }

    body.ai-tools-unified .seo-intro,
    body.ai-tools-unified .seo-faq {
        padding: 18px !important;
    }

    body.ai-tools-unified .page .layout,
    body.ai-tools-unified .page .hf-layout-row,
    body.ai-tools-unified .app-container,
    body.ai-tools-unified .ai-video-generator-ui {
        gap: 14px !important;
    }

    body.ai-tools-unified .app-container .control-section,
    body.ai-tools-unified .app-container .preview-box {
        padding: 16px !important;
    }

    body.ai-tools-unified .title,
    body.ai-tools-unified .seo-page-title,
    body.ai-tools-unified .controls-panel > header h1,
    body.ai-tools-unified .app-title {
        font-size: 22px !important;
    }
}

/* Shared light theme for AI audio tools. */
body.ai-tools-unified.audio-tool-page {
    --ait-bg: #f4f7fb;
    --ait-surface: #ffffff;
    --ait-surface-soft: #f8fafc;
    --ait-border: #e2e8f0;
    --ait-border-strong: #cbd5e1;
    --ait-text: #172033;
    --ait-muted: #64748b;
    --ait-primary: #2563eb;
    --ait-primary-dark: #1d4ed8;
    --ait-primary-soft: #eff6ff;
    --ait-success: #059669;
    --ait-danger: #dc2626;
    --ait-radius: 16px;
    --ait-radius-sm: 10px;
    --ait-shadow: 0 12px 32px rgba(15, 23, 42, 0.07);
    --ait-shadow-sm: 0 4px 14px rgba(15, 23, 42, 0.06);
    --bg: var(--ait-bg);
    --bg-light: var(--ait-bg);
    --bg-lighter: var(--ait-surface-soft);
    --card: var(--ait-surface);
    --text: var(--ait-text);
    --text-dark: var(--ait-text);
    --text-medium: var(--ait-muted);
    --text-muted: var(--ait-muted);
    --text-gray: var(--ait-muted);
    --text-light: #94a3b8;
    --border: var(--ait-border);
    --border-soft: var(--ait-border);
    --border-light: var(--ait-border);
    --primary: var(--ait-primary);
    --accent: var(--ait-primary);
    --accent-strong: var(--ait-primary-dark);
    --accent-light: var(--ait-primary-soft);
    --secondary: var(--ait-primary-dark);
    --model-color: var(--ait-primary);
    --vc-bg: var(--ait-bg);
    --vc-bg-2: var(--ait-surface);
    --vc-card: var(--ait-surface);
    --vc-card-2: var(--ait-surface-soft);
    --vc-border: var(--ait-border);
    --vc-border-hover: var(--ait-primary);
    --vc-text: var(--ait-text);
    --vc-muted: var(--ait-muted);
    --vc-accent: var(--ait-primary);
    --vc-accent-2: #0ea5e9;
    --vc-accent-3: #7c3aed;
    --tr-bg: var(--ait-bg);
    --tr-bg-2: var(--ait-surface);
    --tr-card: var(--ait-surface);
    --tr-card-2: var(--ait-surface-soft);
    --tr-border: var(--ait-border);
    --tr-border-hover: var(--ait-primary);
    --tr-text: var(--ait-text);
    --tr-muted: var(--ait-muted);
    --tr-accent: var(--ait-primary);
    --tr-accent-2: #0ea5e9;
    --tr-accent-3: #7c3aed;
    --tr-accent-4: #f59e0b;
    background: var(--ait-bg) !important;
    color: var(--ait-text) !important;
    font-family: Inter, "Segoe UI", Arial, sans-serif !important;
}

body.ai-tools-unified.audio-tool-page,
body.ai-tools-unified.audio-tool-page * {
    box-sizing: border-box;
}

body.ai-tools-unified.audio-tool-page .app-wrap,
body.ai-tools-unified.audio-tool-page .vc-wrap,
body.ai-tools-unified.audio-tool-page .tr-wrap,
body.ai-tools-unified.audio-tool-page .app {
    width: min(calc(100% - 48px), 1440px) !important;
    max-width: 1440px !important;
    margin: 24px auto 40px !important;
    padding: 0 !important;
    background: transparent !important;
}

body.ai-tools-unified.audio-tool-page .app,
body.ai-tools-unified.audio-tool-page .main-layout,
body.ai-tools-unified.audio-tool-page .vc-main,
body.ai-tools-unified.audio-tool-page .tr-main {
    display: grid !important;
    grid-template-columns: minmax(340px, .9fr) minmax(480px, 1.1fr) !important;
    align-items: start !important;
    gap: 24px !important;
    min-height: 0 !important;
}

body.ai-tools-unified.audio-tool-page .app-header,
body.ai-tools-unified.audio-tool-page .seo-intro,
body.ai-tools-unified.audio-tool-page .vc-hero,
body.ai-tools-unified.audio-tool-page .tr-hero {
    background: var(--ait-surface) !important;
    border: 1px solid var(--ait-border) !important;
    border-radius: var(--ait-radius) !important;
    box-shadow: var(--ait-shadow) !important;
}

body.ai-tools-unified.audio-tool-page .app-header {
    padding: 22px 24px !important;
    margin: 0 0 24px !important;
}

body.ai-tools-unified.audio-tool-page .seo-intro,
body.ai-tools-unified.audio-tool-page .vc-hero,
body.ai-tools-unified.audio-tool-page .tr-hero {
    margin-top: 0 !important;
    margin-bottom: 24px !important;
    padding: 24px 28px !important;
}

body.ai-tools-unified.audio-tool-page .app-header::before,
body.ai-tools-unified.audio-tool-page .app-header::after,
body.ai-tools-unified.audio-tool-page .vc-hero::before,
body.ai-tools-unified.audio-tool-page .vc-hero::after,
body.ai-tools-unified.audio-tool-page .tr-hero::before,
body.ai-tools-unified.audio-tool-page .tr-hero::after {
    opacity: 0 !important;
}

body.ai-tools-unified.audio-tool-page .header-title h1,
body.ai-tools-unified.audio-tool-page .seo-intro .seo-page-title,
body.ai-tools-unified.audio-tool-page .vc-hero-left h1,
body.ai-tools-unified.audio-tool-page .tr-hero-left h1,
body.ai-tools-unified.audio-tool-page .app-title {
    color: var(--ait-text) !important;
    background: none !important;
    -webkit-text-fill-color: currentColor !important;
    font-size: 24px !important;
    font-weight: 750 !important;
    letter-spacing: -0.03em !important;
    line-height: 1.2 !important;
    margin: 0 0 8px !important;
}

body.ai-tools-unified.audio-tool-page .header-title p,
body.ai-tools-unified.audio-tool-page .seo-intro .seo-page-subtitle,
body.ai-tools-unified.audio-tool-page .vc-hero-left p,
body.ai-tools-unified.audio-tool-page .tr-hero-left p {
    color: var(--ait-muted) !important;
    font-size: 14px !important;
    line-height: 1.65 !important;
}

body.ai-tools-unified.audio-tool-page .header-icon {
    width: 42px !important;
    height: 42px !important;
    border-radius: 12px !important;
    background: var(--ait-primary) !important;
    box-shadow: 0 8px 18px rgba(37, 99, 235, .18) !important;
    font-size: 19px !important;
}

body.ai-tools-unified.audio-tool-page .card,
body.ai-tools-unified.audio-tool-page .sidebar,
body.ai-tools-unified.audio-tool-page .main,
body.ai-tools-unified.audio-tool-page .vc-card,
body.ai-tools-unified.audio-tool-page .tr-card,
body.ai-tools-unified.audio-tool-page .player-card,
body.ai-tools-unified.audio-tool-page .vc-player,
body.ai-tools-unified.audio-tool-page .tr-player {
    background: var(--ait-surface) !important;
    border: 1px solid var(--ait-border) !important;
    border-radius: var(--ait-radius) !important;
    box-shadow: var(--ait-shadow-sm) !important;
}

body.ai-tools-unified.audio-tool-page .card,
body.ai-tools-unified.audio-tool-page .vc-card,
body.ai-tools-unified.audio-tool-page .tr-card {
    padding: 20px !important;
}

body.ai-tools-unified.audio-tool-page .form-area,
body.ai-tools-unified.audio-tool-page .main-content {
    background: transparent !important;
}

body.ai-tools-unified.audio-tool-page .card-header,
body.ai-tools-unified.audio-tool-page .vc-card-h,
body.ai-tools-unified.audio-tool-page .tr-card-h,
body.ai-tools-unified.audio-tool-page .main-header {
    border-bottom-color: var(--ait-border) !important;
}

body.ai-tools-unified.audio-tool-page .main-header {
    background: var(--ait-surface-soft) !important;
    border-radius: var(--ait-radius) var(--ait-radius) 0 0 !important;
}

body.ai-tools-unified.audio-tool-page .card-title,
body.ai-tools-unified.audio-tool-page .vc-card-title,
body.ai-tools-unified.audio-tool-page .tr-card-title,
body.ai-tools-unified.audio-tool-page .main-header h2,
body.ai-tools-unified.audio-tool-page .model-info-name,
body.ai-tools-unified.audio-tool-page .advanced-header h4,
body.ai-tools-unified.audio-tool-page label {
    color: var(--ait-text) !important;
}

body.ai-tools-unified.audio-tool-page .card-title i,
body.ai-tools-unified.audio-tool-page .vc-card-title i,
body.ai-tools-unified.audio-tool-page .tr-card-title i,
body.ai-tools-unified.audio-tool-page .advanced-header h4 i,
body.ai-tools-unified.audio-tool-page .section-label,
body.ai-tools-unified.audio-tool-page .form-label {
    color: var(--ait-primary) !important;
}

body.ai-tools-unified.audio-tool-page input[type="text"],
body.ai-tools-unified.audio-tool-page input[type="number"],
body.ai-tools-unified.audio-tool-page input[type="search"],
body.ai-tools-unified.audio-tool-page input[type="url"],
body.ai-tools-unified.audio-tool-page select,
body.ai-tools-unified.audio-tool-page textarea,
body.ai-tools-unified.audio-tool-page .text-area,
body.ai-tools-unified.audio-tool-page .form-select,
body.ai-tools-unified.audio-tool-page .prompt-area,
body.ai-tools-unified.audio-tool-page .lyrics-area,
body.ai-tools-unified.audio-tool-page .vc-textarea,
body.ai-tools-unified.audio-tool-page .tr-textarea,
body.ai-tools-unified.audio-tool-page .pron-input,
body.ai-tools-unified.audio-tool-page .param-select,
body.ai-tools-unified.audio-tool-page .param-text-input,
body.ai-tools-unified.audio-tool-page .voice-search-input {
    color: var(--ait-text) !important;
    background: var(--ait-surface) !important;
    border: 1px solid var(--ait-border-strong) !important;
    border-radius: var(--ait-radius-sm) !important;
    box-shadow: none !important;
}

body.ai-tools-unified.audio-tool-page input[type="text"]:focus,
body.ai-tools-unified.audio-tool-page input[type="number"]:focus,
body.ai-tools-unified.audio-tool-page input[type="search"]:focus,
body.ai-tools-unified.audio-tool-page select:focus,
body.ai-tools-unified.audio-tool-page textarea:focus,
body.ai-tools-unified.audio-tool-page .text-area:focus,
body.ai-tools-unified.audio-tool-page .vc-textarea:focus,
body.ai-tools-unified.audio-tool-page .tr-textarea:focus {
    outline: none !important;
    border-color: var(--ait-primary) !important;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, .12) !important;
}

body.ai-tools-unified.audio-tool-page input::placeholder,
body.ai-tools-unified.audio-tool-page textarea::placeholder {
    color: #94a3b8 !important;
}

body.ai-tools-unified.audio-tool-page .model-selector-section,
body.ai-tools-unified.audio-tool-page .presets-section,
body.ai-tools-unified.audio-tool-page .advanced-section,
body.ai-tools-unified.audio-tool-page .tab-nav,
body.ai-tools-unified.audio-tool-page .vc-tabs,
body.ai-tools-unified.audio-tool-page .tr-tabs {
    background: var(--ait-surface-soft) !important;
    border-color: var(--ait-border) !important;
}

body.ai-tools-unified.audio-tool-page .model-info-card,
body.ai-tools-unified.audio-tool-page .model-params,
body.ai-tools-unified.audio-tool-page .param-group,
body.ai-tools-unified.audio-tool-page .preview-area,
body.ai-tools-unified.audio-tool-page .player-visual,
body.ai-tools-unified.audio-tool-page .vc-info-row,
body.ai-tools-unified.audio-tool-page .tr-info-row,
body.ai-tools-unified.audio-tool-page .vc-pstat,
body.ai-tools-unified.audio-tool-page .tr-pstat,
body.ai-tools-unified.audio-tool-page .pstat {
    background: var(--ait-surface-soft) !important;
    border-color: var(--ait-border) !important;
    color: var(--ait-text) !important;
}

body.ai-tools-unified.audio-tool-page .custom-dropdown-button,
body.ai-tools-unified.audio-tool-page .custom-dropdown-menu,
body.ai-tools-unified.audio-tool-page .voice-selector-btn,
body.ai-tools-unified.audio-tool-page .voice-item,
body.ai-tools-unified.audio-tool-page .audio-upload-box {
    background: var(--ait-surface) !important;
    border-color: var(--ait-border-strong) !important;
    color: var(--ait-text) !important;
    box-shadow: none !important;
}

body.ai-tools-unified.audio-tool-page .voice-selector-btn:hover,
body.ai-tools-unified.audio-tool-page .voice-selector-btn.selected,
body.ai-tools-unified.audio-tool-page .voice-item:hover,
body.ai-tools-unified.audio-tool-page .voice-item.selected,
body.ai-tools-unified.audio-tool-page .audio-upload-box:hover {
    background: var(--ait-primary-soft) !important;
    border-color: var(--ait-primary) !important;
}

body.ai-tools-unified.audio-tool-page .voice-selector-icon,
body.ai-tools-unified.audio-tool-page .header-icon,
body.ai-tools-unified.audio-tool-page .btn-generate:not(:disabled),
body.ai-tools-unified.audio-tool-page .vc-gen-btn:not(:disabled),
body.ai-tools-unified.audio-tool-page .tr-gen-btn:not(:disabled),
body.ai-tools-unified.audio-tool-page .vc-btn-primary:not(:disabled),
body.ai-tools-unified.audio-tool-page .tr-btn-primary:not(:disabled) {
    background: var(--ait-primary) !important;
    border-color: var(--ait-primary) !important;
    color: #ffffff !important;
    box-shadow: 0 7px 16px rgba(37, 99, 235, .18) !important;
}

body.ai-tools-unified.audio-tool-page .btn-generate:hover:not(:disabled),
body.ai-tools-unified.audio-tool-page .vc-gen-btn:hover:not(:disabled),
body.ai-tools-unified.audio-tool-page .tr-gen-btn:hover:not(:disabled),
body.ai-tools-unified.audio-tool-page .vc-btn-primary:hover:not(:disabled),
body.ai-tools-unified.audio-tool-page .tr-btn-primary:hover:not(:disabled) {
    background: var(--ait-primary-dark) !important;
    border-color: var(--ait-primary-dark) !important;
    transform: translateY(-1px);
}

body.ai-tools-unified.audio-tool-page .btn-generate:disabled,
body.ai-tools-unified.audio-tool-page .vc-gen-btn:disabled,
body.ai-tools-unified.audio-tool-page .tr-gen-btn:disabled {
    background: #cbd5e1 !important;
    border-color: #cbd5e1 !important;
    color: #ffffff !important;
    box-shadow: none !important;
}

body.ai-tools-unified.audio-tool-page .header-btn,
body.ai-tools-unified.audio-tool-page .quick-btn,
body.ai-tools-unified.audio-tool-page .add-pron-btn,
body.ai-tools-unified.audio-tool-page .action-btn,
body.ai-tools-unified.audio-tool-page .vc-btn:not(.vc-btn-primary):not(.vc-btn-success):not(.vc-btn-danger),
body.ai-tools-unified.audio-tool-page .tr-btn:not(.tr-btn-primary):not(.tr-btn-success):not(.tr-btn-danger),
body.ai-tools-unified.audio-tool-page .vc-sample-btn,
body.ai-tools-unified.audio-tool-page .tr-chip,
body.ai-tools-unified.audio-tool-page .tr-lyrics-tag,
body.ai-tools-unified.audio-tool-page .preset-btn,
body.ai-tools-unified.audio-tool-page .btn-action {
    background: var(--ait-surface) !important;
    border: 1px solid var(--ait-border-strong) !important;
    color: var(--ait-text) !important;
    border-radius: var(--ait-radius-sm) !important;
    box-shadow: none !important;
}

body.ai-tools-unified.audio-tool-page .header-btn:hover,
body.ai-tools-unified.audio-tool-page .quick-btn:hover,
body.ai-tools-unified.audio-tool-page .action-btn:hover,
body.ai-tools-unified.audio-tool-page .vc-btn:hover,
body.ai-tools-unified.audio-tool-page .tr-btn:hover,
body.ai-tools-unified.audio-tool-page .vc-sample-btn:hover,
body.ai-tools-unified.audio-tool-page .tr-chip:hover,
body.ai-tools-unified.audio-tool-page .preset-btn:hover,
body.ai-tools-unified.audio-tool-page .btn-action:hover {
    background: var(--ait-primary-soft) !important;
    border-color: #93c5fd !important;
    color: var(--ait-primary-dark) !important;
    transform: none;
}

body.ai-tools-unified.audio-tool-page .vc-tab.active,
body.ai-tools-unified.audio-tool-page .tr-tab.active,
body.ai-tools-unified.audio-tool-page .tab-btn.active {
    background: var(--ait-primary) !important;
    border-color: var(--ait-primary) !important;
    color: #ffffff !important;
    box-shadow: 0 7px 16px rgba(37, 99, 235, .18) !important;
}

body.ai-tools-unified.audio-tool-page .vc-tab,
body.ai-tools-unified.audio-tool-page .tr-tab,
body.ai-tools-unified.audio-tool-page .tab-btn {
    color: var(--ait-muted) !important;
}

body.ai-tools-unified.audio-tool-page input[type="range"],
body.ai-tools-unified.audio-tool-page .slider,
body.ai-tools-unified.audio-tool-page .vc-slider,
body.ai-tools-unified.audio-tool-page .tr-slider {
    accent-color: var(--ait-primary) !important;
    background: #dbe5f0 !important;
}

body.ai-tools-unified.audio-tool-page .slider::-webkit-slider-thumb,
body.ai-tools-unified.audio-tool-page .vc-slider::-webkit-slider-thumb,
body.ai-tools-unified.audio-tool-page .tr-slider::-webkit-slider-thumb {
    background: var(--ait-primary) !important;
    border-color: var(--ait-primary) !important;
    box-shadow: none !important;
}

body.ai-tools-unified.audio-tool-page .player-visual,
body.ai-tools-unified.audio-tool-page .preview-area {
    min-height: 300px !important;
}

body.ai-tools-unified.audio-tool-page .wave-bar,
body.ai-tools-unified.audio-tool-page .vc-wave-bar,
body.ai-tools-unified.audio-tool-page .tr-eq-bar,
body.ai-tools-unified.audio-tool-page .player-progress-fill,
body.ai-tools-unified.audio-tool-page .progress-thumb,
body.ai-tools-unified.audio-tool-page .vc-progress-fill,
body.ai-tools-unified.audio-tool-page .tr-progress-fill {
    background: var(--ait-primary) !important;
}

body.ai-tools-unified.audio-tool-page .ctrl-btn.primary,
body.ai-tools-unified.audio-tool-page .vc-ctrl-btn.primary,
body.ai-tools-unified.audio-tool-page .tr-ctrl-btn.primary {
    background: var(--ait-primary) !important;
    color: #ffffff !important;
    box-shadow: 0 7px 16px rgba(37, 99, 235, .18) !important;
}

body.ai-tools-unified.audio-tool-page .seo-faq {
    width: min(calc(100% - 48px), 1440px) !important;
    max-width: 1440px !important;
    margin: 24px auto 12px !important;
    padding: 24px 28px !important;
    background: var(--ait-surface) !important;
    border: 1px solid var(--ait-border) !important;
    border-radius: var(--ait-radius) !important;
    box-shadow: var(--ait-shadow) !important;
}

body.ai-tools-unified.audio-tool-page .seo-faq h2,
body.ai-tools-unified.audio-tool-page .seo-faq summary {
    color: var(--ait-text) !important;
}

body.ai-tools-unified.audio-tool-page .seo-faq .faq-intro,
body.ai-tools-unified.audio-tool-page .seo-faq details p,
body.ai-tools-unified.audio-tool-page .vc-card-sub,
body.ai-tools-unified.audio-tool-page .tr-card-sub,
body.ai-tools-unified.audio-tool-page .vc-slider-hint,
body.ai-tools-unified.audio-tool-page .tr-slider-hint,
body.ai-tools-unified.audio-tool-page .prompt-tips {
    color: var(--ait-muted) !important;
}

@media (max-width: 1100px) {
    body.ai-tools-unified.audio-tool-page .app,
    body.ai-tools-unified.audio-tool-page .main-layout,
    body.ai-tools-unified.audio-tool-page .vc-main,
    body.ai-tools-unified.audio-tool-page .tr-main {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 640px) {
    body.ai-tools-unified.audio-tool-page .app-wrap,
    body.ai-tools-unified.audio-tool-page .vc-wrap,
    body.ai-tools-unified.audio-tool-page .tr-wrap,
    body.ai-tools-unified.audio-tool-page .app,
    body.ai-tools-unified.audio-tool-page .seo-intro,
    body.ai-tools-unified.audio-tool-page .vc-hero,
    body.ai-tools-unified.audio-tool-page .tr-hero,
    body.ai-tools-unified.audio-tool-page .seo-faq {
        width: calc(100% - 24px) !important;
    }

    body.ai-tools-unified.audio-tool-page .app-header,
    body.ai-tools-unified.audio-tool-page .seo-intro,
    body.ai-tools-unified.audio-tool-page .vc-hero,
    body.ai-tools-unified.audio-tool-page .tr-hero,
    body.ai-tools-unified.audio-tool-page .seo-faq {
        padding: 18px !important;
    }

    body.ai-tools-unified.audio-tool-page .header-title h1,
    body.ai-tools-unified.audio-tool-page .seo-intro .seo-page-title,
    body.ai-tools-unified.audio-tool-page .vc-hero-left h1,
    body.ai-tools-unified.audio-tool-page .tr-hero-left h1,
    body.ai-tools-unified.audio-tool-page .app-title {
        font-size: 22px !important;
    }
}
