/* Mobile composition uses the supplied prototype; desktop studio rules keep
   their original selectors and sizing. Existing forms and media remain live. */
@layer fuuvo-mobile-design {
.creation-mobile-tabs,
.creation-mobile-result-status { display: none; }

@media (max-width: 920px) {
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] {
        --creation-ink: #171821 !important;
        --creation-muted: #676976 !important;
        --creation-line: #dddfe6 !important;
        --creation-blue: #635079 !important;
        --creation-soft: #eeeafa !important;
        --mobile-creation-surface: #fff !important;
        --mobile-creation-field: #fff !important;
        --mobile-creation-tint: #f6f3fa !important;
        --mobile-creation-action: #202027 !important;
        --mobile-creation-action-ink: #fff !important;
        --podcast-ink: var(--creation-ink) !important;
        --podcast-muted: var(--creation-muted) !important;
        --podcast-line: var(--creation-line) !important;
        --podcast-blue: var(--creation-blue) !important;
        --podcast-soft: var(--mobile-creation-tint) !important;
        color-scheme: light !important;
        background: var(--mobile-creation-surface) !important;
        color: var(--creation-ink) !important;
    }

    html:is([data-ui-theme="dark"], [data-theme="dark"]) body.fuuvo-mobile-prototype #creation-app[data-creation-page],
    html body.fuuvo-mobile-prototype:is([data-ui-theme="dark"], [data-theme="dark"]) #creation-app[data-creation-page] {
        --creation-ink: #f1edf7 !important;
        --creation-muted: #afa8ba !important;
        --creation-line: #393541 !important;
        --creation-blue: #c9b5e0 !important;
        --creation-soft: #302939 !important;
        --mobile-creation-surface: #18161d !important;
        --mobile-creation-field: #201d26 !important;
        --mobile-creation-tint: #29232f !important;
        --mobile-creation-action: #eee8f5 !important;
        --mobile-creation-action-ink: #241d2c !important;
        color-scheme: dark !important;
    }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.creation-workspace, .creation-main) {
        background: var(--mobile-creation-surface) !important;
        color: var(--creation-ink) !important;
    }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-main,
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page].studio-workspace .creation-main,
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page][data-creation-page="home"] .creation-main {
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 12px 20px calc(24px + env(safe-area-inset-bottom)) !important;
        min-height: 0 !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        overscroll-behavior-y: contain !important;
        scroll-padding-block: 12px 24px !important;
    }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page].studio-workspace .creation-workspace {
        height: 100dvh !important;
        min-height: 0 !important;
        overflow: hidden !important;
    }

    /* The main region owns the complete form scroll. A non-shrinking main
       grows past the viewport and is clipped by the workspace; focusing a
       lower field then scrolls that hidden ancestor instead of the form. */
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page].studio-workspace .creation-main {
        flex: 1 1 0 !important;
        display: block !important;
    }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-main :is(h1, h2, h3, p, small, span, strong, label, a) {
        -webkit-text-fill-color: currentColor !important;
        overflow-wrap: anywhere !important;
    }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-heading h1,
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-home-hero h1,
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-category-hero h1,
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .podcast-hero h1 {
        color: var(--creation-ink) !important;
        font-size: 27px !important;
        font-weight: 600 !important;
        line-height: 1.2 !important;
        letter-spacing: -.6px !important;
    }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.creation-heading p, .creation-home-hero p, .creation-category-hero p, .podcast-hero p) {
        color: var(--creation-muted) !important;
        font-size: 14px !important;
        line-height: 1.5 !important;
    }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.creation-home-kicker, .creation-home-section-eyebrow, .project-ai-kicker, .podcast-eyebrow, .podcast-hero-mark, .creation-history-shortcut) {
        display: none !important;
    }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-breadcrumb,
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page].studio-workspace .creation-main > .creation-breadcrumb {
        display: flex !important;
        min-height: 40px !important;
        margin: 0 0 8px !important;
        font-size: 12px !important;
        color: var(--creation-muted) !important;
    }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-breadcrumb > :not(.back) { display: none !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-breadcrumb .back { min-height: 40px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-breadcrumb .fuuvo-design-icon { width: 18px !important; height: 18px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page="works"] .creation-main > .creation-breadcrumb { display: none !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-heading { margin-bottom: 18px !important; gap: 10px !important; }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-mobile-tabs {
        display: flex !important;
        flex: 0 0 auto !important;
        padding: 4px !important;
        gap: 4px !important;
        margin: 0 0 16px !important;
        border-radius: 11px !important;
        background: var(--mobile-creation-tint) !important;
        scroll-margin-top: 10px !important;
    }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-mobile-tabs button {
        min-width: 0 !important;
        min-height: 40px !important;
        flex: 1 !important;
        padding: 10px 8px !important;
        border: 0 !important;
        border-radius: 8px !important;
        background: transparent !important;
        color: var(--creation-muted) !important;
        font-size: 13px !important;
        font-weight: 500 !important;
        cursor: pointer !important;
    }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-mobile-tabs [aria-selected="true"] {
        background: var(--mobile-creation-surface) !important;
        color: var(--creation-ink) !important;
        box-shadow: 0 1px 5px #45325110 !important;
    }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-mobile-tabs .is-working::after {
        display: inline-block !important;
        width: 6px !important;
        height: 6px !important;
        margin-left: 7px !important;
        border-radius: 50% !important;
        background: var(--creation-blue) !important;
        content: '' !important;
    }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-mobile-workflow[data-mobile-creation-panel="form"] > :is(.detail-preview-card, .podcast-result-panel),
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-mobile-workflow[data-mobile-creation-panel="result"] > :is(.detail-controls, .podcast-input-panel) {
        display: none !important;
    }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-detail-layout,
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page].studio-workspace .studio-layout,
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .podcast-workspace-grid,
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .project-result-layout,
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .result-layout {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 18px !important;
        margin: 0 !important;
        height: auto !important;
        min-height: 0 !important;
    }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page].studio-workspace .studio-controls,
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page].studio-workspace .studio-layout .detail-preview-card,
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.creation-detail-card, .podcast-panel, .image-form, .settings-panel, .result-actions) {
        position: static !important;
        top: auto !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        overflow: visible !important;
        background: var(--mobile-creation-surface) !important;
        color: var(--creation-ink) !important;
    }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page].studio-workspace .studio-control-scroll,
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page].studio-workspace .studio-composer-controls .studio-control-scroll {
        display: flex !important;
        flex-direction: column !important;
        gap: 0 !important;
        flex: 0 0 auto !important;
        padding: 0 !important;
        overflow: visible !important;
    }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page].studio-workspace .studio-controls {
        display: flex !important;
        flex-direction: column !important;
        grid-template-columns: none !important;
        grid-template-rows: none !important;
        gap: 0 !important;
    }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page].studio-workspace :is(.studio-layout, .studio-controls, .studio-control-scroll, .studio-control-footer, .studio-composer, .detail-preview-card) {
        box-shadow: none !important;
        background-image: none !important;
    }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page].studio-workspace :is(.studio-layout, .studio-control-scroll, .studio-composer) {
        background-color: transparent !important;
    }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page].studio-workspace .studio-control-footer {
        display: flex !important;
        max-height: none !important;
        padding: 18px 0 0 !important;
        margin-top: 16px !important;
        border-top: 1px solid var(--creation-line) !important;
        background: var(--mobile-creation-surface) !important;
        box-shadow: none !important;
        overflow: visible !important;
    }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-mobile-action-dock,
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page].studio-workspace .studio-control-footer.creation-mobile-action-dock {
        position: fixed !important;
        inset: auto 0 var(--creation-mobile-keyboard-offset, 0px) !important;
        z-index: 85 !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 8px !important;
        width: 100% !important;
        max-height: 35dvh !important;
        overflow-y: auto !important;
        padding: 12px max(20px, env(safe-area-inset-right)) calc(12px + env(safe-area-inset-bottom)) max(20px, env(safe-area-inset-left)) !important;
        margin: 0 !important;
        border: 0 !important;
        border-top: 1px solid var(--creation-line) !important;
        border-radius: 0 !important;
        background: var(--mobile-creation-surface) !important;
        box-shadow: none !important;
    }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page].has-mobile-creation-action .creation-main {
        padding-bottom: var(--creation-mobile-action-space, 112px) !important;
        scroll-padding-bottom: var(--creation-mobile-action-space, 112px) !important;
    }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-mobile-action-dock :is(.creation-primary, .detail-submit, .podcast-generate) { width: 100% !important; margin: 0 !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-mobile-action-dock :is(.creation-primary, .detail-submit, .podcast-generate) :is(img, svg, .fuuvo-linear-icon) { display: none !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-mobile-action-dock :is([data-form-status], [data-audio-status], [data-podcast-status], .creation-form-status) { margin: 0 !important; font-size: 12px !important; line-height: 1.4 !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-mobile-action-dock :is([data-form-status], [data-audio-status], [data-podcast-status], .creation-form-status):empty { display: none !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-mobile-action-dock .animate-generation-actions { width: 100% !important; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr) !important; margin: 0 !important; }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page].studio-workspace .studio-mode-nav,
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page].studio-workspace .studio-gallery,
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .studio-video-status-panel { display: none !important; }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page].studio-workspace .studio-composer {
        display: flex !important;
        flex-direction: column !important;
        flex: none !important;
        min-height: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
    }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page].studio-workspace .studio-composer .studio-reference-input { order: 3 !important; margin-top: 18px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page].studio-workspace .studio-composer .studio-reference-input > :is(h3, .detail-label) { display: block !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page].studio-workspace .studio-composer [data-video-prompt-label] { display: block !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page].studio-workspace .studio-composer .prompt-counter { order: 1 !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .studio-composer .detail-textarea-wrap { flex: none !important; min-height: 0 !important; }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-main :is(textarea, .detail-select, .detail-input-wrap input, .project-field input:not([type="color"]), .project-field select, .podcast-control select),
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page].studio-workspace .studio-composer textarea,
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page][data-creation-page="video"].studio-workspace .studio-composer .video-prompt-box {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 48px !important;
        max-height: none !important;
        padding: 12px 13px !important;
        border: 1px solid var(--creation-line) !important;
        border-radius: 12px !important;
        background: var(--mobile-creation-field) !important;
        color: var(--creation-ink) !important;
        font-size: 16px !important;
        line-height: 1.5 !important;
        box-shadow: none !important;
        box-sizing: border-box !important;
    }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-main textarea,
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page].studio-workspace .studio-composer textarea,
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page][data-creation-page="video"].studio-workspace .studio-composer .video-prompt-box {
        flex: none !important;
        height: 144px !important;
        min-height: 128px !important;
        resize: vertical !important;
    }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-main :is(textarea, input)::placeholder,
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page][data-creation-page="video"].studio-workspace .studio-composer .video-prompt-box::placeholder {
        color: var(--creation-muted) !important;
        opacity: .8 !important;
    }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.detail-label, .setting-label, .project-field > span, .podcast-label, .podcast-control > span) {
        color: var(--creation-ink) !important;
        margin: 18px 0 8px !important;
        font-size: 12px !important;
        font-weight: 600 !important;
        line-height: 1.4 !important;
    }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.prompt-counter, .detail-preview-note, .audio-field-help, .works-note, .project-field small, .podcast-field-foot, .podcast-note) {
        color: var(--creation-muted) !important;
        font-size: 11px !important;
        line-height: 1.5 !important;
    }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.detail-dropzone, .upload-box, .podcast-upload),
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page].studio-workspace .studio-composer :is(.detail-dropzone, .upload-box) {
        width: 100% !important;
        min-height: 116px !important;
        height: auto !important;
        padding: 20px 16px !important;
        margin: 0 0 16px !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 8px !important;
        border: 1px dashed var(--creation-line) !important;
        border-radius: 15px !important;
        background: var(--mobile-creation-tint) !important;
        color: var(--creation-ink) !important;
    }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page].studio-workspace .studio-composer .detail-dropzone small { display: block !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.detail-dropzone, .upload-box, .podcast-upload) :is(strong, span) { font-size: 13px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.detail-dropzone, .upload-box, .podcast-upload) small { font-size: 11px !important; color: var(--creation-muted) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.detail-dropzone, .upload-box) > img { width: 27px !important; height: 27px !important; }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.detail-option, .setting-option, .creation-pill, .edit-tool, .project-visual-option) {
        min-height: 40px !important;
        padding: 9px 11px !important;
        border: 1px solid var(--creation-line) !important;
        border-radius: 10px !important;
        background: var(--mobile-creation-field) !important;
        color: var(--creation-ink) !important;
        font-size: 12px !important;
        font-weight: 500 !important;
        line-height: 1.3 !important;
    }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.detail-option, .setting-option, .creation-pill, .edit-tool, .project-visual-option):is(.active, .is-selected) {
        background: var(--creation-soft) !important;
        border-color: var(--creation-blue) !important;
        color: var(--creation-blue) !important;
    }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .detail-option-grid.cols-3 {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 8px !important;
    }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .detail-option-grid.cols-2 {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
    }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .detail-option-grid > .detail-option {
        min-width: 0 !important;
        max-width: 100% !important;
        gap: 5px !important;
    }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .video-desktop-option-grid { display: grid !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .video-mobile-select { display: none !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.audio-field-grid, .audio-advanced-grid, .project-field-grid, .podcast-settings-grid) { grid-template-columns: minmax(0, 1fr) !important; gap: 0 !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .podcast-control-wide { grid-column: auto !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .detail-input-wrap input { padding-right: 55px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.project-visual-type-grid, .edit-tools, .edit-toolbar) { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 8px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.detail-advanced, .studio-prompt-suggestions) { padding: 12px 0 !important; border-color: var(--creation-line) !important; color: var(--creation-ink) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.detail-advanced, .studio-prompt-suggestions) > summary { min-height: 40px !important; color: var(--creation-ink) !important; font-size: 13px !important; }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.creation-primary, .detail-submit, .podcast-generate) {
        width: 100% !important;
        min-height: 48px !important;
        height: auto !important;
        padding: 12px 15px !important;
        border: 1px solid var(--mobile-creation-action) !important;
        border-radius: 13px !important;
        background: var(--mobile-creation-action) !important;
        color: var(--mobile-creation-action-ink) !important;
        font-size: 14px !important;
        font-weight: 600 !important;
        white-space: normal !important;
        line-height: 1.3 !important;
        gap: 8px !important;
    }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-primary:disabled { opacity: .45 !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.creation-outline, .creation-inspiration-secondary, .brand-file-button, .brand-editor-action) {
        min-height: 44px !important;
        padding: 10px 12px !important;
        border: 1px solid var(--creation-line) !important;
        border-radius: 12px !important;
        background: var(--mobile-creation-field) !important;
        color: var(--creation-ink) !important;
        font-size: 13px !important;
        line-height: 1.3 !important;
        white-space: normal !important;
    }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-mobile-result-status:not([hidden]) {
        display: block !important;
        padding: 12px 13px !important;
        margin: 0 0 16px !important;
        background: var(--mobile-creation-tint) !important;
        border-radius: 10px !important;
        color: var(--creation-muted) !important;
        font-size: 12px !important;
        line-height: 1.5 !important;
    }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-mobile-result-status[data-state="error"] { border: 1px solid #c85d73 !important; color: #c85d73 !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.detail-result-actions, .result-bottom-actions, .result-actions, .audio-result-actions, .podcast-result-actions, .project-inline-actions) {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 8px !important;
        margin-top: 16px !important;
    }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.detail-result-actions, .result-bottom-actions, .audio-result-actions, .podcast-result-actions, .project-inline-actions) > :is(a, button) { flex: 1 1 calc(50% - 8px) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .result-actions { flex-direction: column !important; align-items: stretch !important; gap: 14px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .result-actions :is(h2, .setting-group, hr) { width: 100% !important; margin: 0 !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .result-actions :is(button, a) { justify-content: center !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .result-actions > :is(button, a) { width: 100% !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .result-actions .setting-options { display: flex !important; flex-wrap: wrap !important; gap: 8px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .result-status { max-width: 100% !important; background: var(--mobile-creation-tint) !important; color: var(--creation-blue) !important; font-size: 11px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .result-status.failed { color: #c85d73 !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.detail-result-actions, .audio-result-actions, .podcast-result-actions, .project-inline-actions)[hidden] { display: none !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.detail-media, .edit-result-stage, .project-preview-canvas, .project-result-media, .result-main-image) {
        max-width: 100% !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: 65dvh !important;
        margin: 12px 0 !important;
        border-radius: 13px !important;
        object-fit: contain !important;
        background: var(--mobile-creation-tint) !important;
    }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.detail-media, .edit-result-stage, .project-result-media) :is(img, video) { max-height: 65dvh !important; object-fit: contain !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page].studio-workspace .detail-preview-card > .detail-media.is-empty { display: flex !important; min-height: 200px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.audio-result-stage, .podcast-empty) { min-height: 260px !important; padding: 24px 16px !important; border-radius: 16px !important; background: var(--mobile-creation-tint) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .audio-player-shell { width: 100% !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .audio-waveform { height: 140px !important; color: var(--creation-blue) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .studio-result-images { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .studio-result-image { max-width: 100% !important; height: auto !important; border-radius: 13px !important; object-fit: contain !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-model-picker > summary,
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .audio-model-picker > summary { min-height: 48px !important; padding: 10px 12px !important; border-color: var(--creation-line) !important; border-radius: 12px !important; background: var(--mobile-creation-field) !important; color: var(--creation-ink) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .audio-model-summary-copy strong { font-size: 14px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .audio-model-summary-copy small { font-size: 11px !important; color: var(--creation-muted) !important; white-space: normal !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.creation-model-menu, .audio-model-menu) { max-height: 55dvh !important; background: var(--mobile-creation-field) !important; border-color: var(--creation-line) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.creation-model-option, .audio-model-option) { min-width: 0 !important; min-height: 48px !important; color: var(--creation-ink) !important; background: var(--mobile-creation-field) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.creation-model-option, .audio-model-option).is-selected { background: var(--creation-soft) !important; border-color: var(--creation-blue) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.creation-model-menu, .audio-model-menu) strong { color: var(--creation-ink) !important; font-size: 13px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.creation-model-menu, .audio-model-menu) :is(small, em, p) { color: var(--creation-muted) !important; font-size: 11px !important; white-space: normal !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] [data-audio-model-option] { min-height: 48px !important; border-color: var(--creation-line) !important; border-radius: 10px !important; color: var(--creation-ink) !important; background: var(--mobile-creation-field) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] [data-audio-model-option].is-selected { background: var(--creation-soft) !important; border-color: var(--creation-blue) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] [data-audio-model-option] strong { color: var(--creation-ink) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] [data-audio-model-option] :is(small, em) { color: var(--creation-muted) !important; }
    /* Actual model controls include provider headers and capability copy, not
       just the menu shell. Keep the open catalog in the phone scroll flow. */
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.creation-model-picker, .audio-model-picker) { min-width: 0 !important; width: 100% !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.creation-model-picker, .audio-model-picker)[open] > summary { border-color: var(--creation-blue) !important; box-shadow: none !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.creation-model-menu, .audio-model-menu) { position: static !important; inset: auto !important; box-sizing: border-box !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; max-height: min(55dvh, 430px) !important; margin: 7px 0 0 !important; padding: 8px !important; overflow-x: hidden !important; overflow-y: auto !important; overscroll-behavior: contain !important; scrollbar-width: thin !important; scrollbar-color: var(--creation-line) var(--mobile-creation-field) !important; background: var(--mobile-creation-field) !important; color: var(--creation-ink) !important; border: 1px solid var(--creation-line) !important; border-radius: 12px !important; box-shadow: none !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.creation-model-option, [data-audio-model-option], .audio-auto-model-option) { box-sizing: border-box !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; min-height: 56px !important; padding: 10px !important; gap: 8px !important; border: 1px solid transparent !important; border-radius: 10px !important; background: var(--mobile-creation-field) !important; color: var(--creation-ink) !important; text-align: left !important; box-shadow: none !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.creation-model-option, [data-audio-model-option], .audio-auto-model-option):is(:hover, .is-selected, [aria-pressed="true"]) { background: var(--creation-soft) !important; border-color: var(--creation-blue) !important; color: var(--creation-ink) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.creation-model-option, [data-audio-model-option], .audio-auto-model-option):is(:disabled, [aria-disabled="true"]) { background: var(--mobile-creation-tint) !important; border-color: var(--creation-line) !important; color: var(--creation-muted) !important; cursor: not-allowed !important; opacity: .65 !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.creation-model-provider, .audio-provider-group) { border-color: var(--creation-line) !important; background: transparent !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.creation-model-provider, .audio-provider-group) > header { color: var(--creation-ink) !important; background: transparent !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.creation-model-summary-mark, .creation-model-option-mark, .creation-model-provider > header > span, .audio-model-summary-mark, .audio-auto-model-mark, .audio-provider-mark) { background: var(--mobile-creation-tint) !important; color: var(--creation-muted) !important; border-color: var(--creation-line) !important; font-size: 11px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.audio-model-summary-icon, .audio-model-summary-mark) { width: 34px !important; height: 34px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.creation-model-summary-copy, .audio-model-summary-copy, .creation-model-option > span:nth-child(2), .audio-model-option-copy) { min-width: 0 !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.creation-model-summary-copy, .audio-model-summary-copy, .creation-model-option, [data-audio-model-option], .audio-auto-model-option, .creation-model-provider > header, .audio-provider-group > header) strong { color: var(--creation-ink) !important; font-size: 13px !important; font-weight: 600 !important; line-height: 1.4 !important; white-space: normal !important; overflow-wrap: anywhere !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.creation-model-label > small, .creation-model-summary-copy small, .audio-model-summary-copy small, .creation-model-option small, [data-audio-model-option] small, .audio-auto-model-option small, .creation-model-empty, .audio-model-empty) { color: var(--creation-muted) !important; font-size: 11px !important; line-height: 1.5 !important; white-space: normal !important; overflow-wrap: anywhere !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.creation-model-menu, .audio-model-menu) em { color: var(--creation-blue) !important; font-size: 11px !important; font-style: normal !important; line-height: 1.4 !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .audio-toggle { padding: 13px !important; border-color: var(--creation-line) !important; border-radius: 12px !important; background: var(--mobile-creation-field) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .audio-toggle > b { color: var(--creation-ink) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .audio-toggle > small { color: var(--creation-muted) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .audio-toggle > span { background: var(--creation-line) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .audio-toggle > input:checked + span { background: var(--creation-blue) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .audio-mode-switch { width: 100% !important; background: var(--mobile-creation-tint) !important; border-color: var(--creation-line) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .audio-mode-switch a { min-width: 0 !important; flex: 1 !important; min-height: 40px !important; color: var(--creation-muted) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .audio-mode-switch a.active { background: var(--mobile-creation-surface) !important; color: var(--creation-ink) !important; box-shadow: none !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.audio-preview-heading p, .audio-model-empty, .audio-result-empty p, .audio-result-progress p, .audio-result-copy small) { color: var(--creation-muted) !important; font-size: 12px !important; line-height: 1.6 !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.audio-result-empty strong, .audio-result-progress strong, .audio-result-copy strong, .audio-preview-heading h2) { color: var(--creation-ink) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .audio-preview-heading > span { background: var(--mobile-creation-tint) !important; color: var(--creation-muted) !important; border-color: var(--creation-line) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.poster-size-grid, .poster-style-grid) { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 8px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.poster-option, .poster-style) { min-width: 0 !important; min-height: 72px !important; padding: 12px 9px !important; border-color: var(--creation-line) !important; border-radius: 12px !important; background: var(--mobile-creation-field) !important; color: var(--creation-ink) !important; font-size: 12px !important; box-shadow: none !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.poster-option, .poster-style).active { background: var(--creation-soft) !important; border-color: var(--creation-blue) !important; color: var(--creation-ink) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .poster-option strong { color: var(--creation-ink) !important; font-size: 12px !important; white-space: normal !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .poster-option small { color: var(--creation-muted) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.poster-preview, .edit-source-stage, .animate-source) { width: 100% !important; max-width: 100% !important; margin: 12px 0 !important; border-color: var(--creation-line) !important; border-radius: 13px !important; background: var(--mobile-creation-tint) !important; box-shadow: none !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.edit-source-stage, .animate-source) > [data-source-preview] { width: 100% !important; background: var(--mobile-creation-tint) !important; object-fit: contain !important; max-height: 45dvh !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.generation-preview-empty, .edit-empty-state, .animate-source-empty) :is(strong, p, small) { color: var(--creation-muted) !important; font-size: 12px !important; line-height: 1.6 !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .generation-preview-empty > span { background: var(--creation-soft) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .edit-reference-item { background: var(--mobile-creation-field) !important; border-color: var(--creation-line) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .edit-reference-item img { background: var(--mobile-creation-tint) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .edit-reference-item p { color: var(--creation-muted) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .animate-motion-option { background: var(--mobile-creation-field) !important; border-color: var(--creation-line) !important; border-radius: 12px !important; min-height: 64px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .animate-motion-option.active { background: var(--creation-soft) !important; border-color: var(--creation-blue) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.animate-motion-copy strong, .animate-motion-heading strong, .animate-current-effects-heading strong, .animate-current-meta strong) { color: var(--creation-ink) !important; font-size: 13px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.animate-motion-copy small, .animate-motion-heading > span, .animate-current-effects-heading > span, .animate-current-meta small) { color: var(--creation-muted) !important; font-size: 11px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.animate-current-effects, .video-edit-context) { background: var(--mobile-creation-tint) !important; border-color: var(--creation-line) !important; color: var(--creation-ink) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .animate-current-effects-list > span { background: var(--creation-soft) !important; color: var(--creation-ink) !important; border-color: var(--creation-line) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .project-preview-canvas > img[data-generated-image][src="/static/creation-demo/result-main.png"] { display: none !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .project-preview-canvas:not(.is-ready) { aspect-ratio: auto !important; min-height: 220px !important; max-height: none !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .project-preview-canvas::after { display: none !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.project-preview-overlay, .project-preview-meta, .project-live-status) { color: var(--creation-ink) !important; background: var(--mobile-creation-tint) !important; border-color: var(--creation-line) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .project-preview-overlay { position: relative !important; inset: auto !important; transform: none !important; max-width: 100% !important; padding: 20px 18px 72px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .project-preview-overlay strong { color: var(--creation-ink) !important; font-size: 24px !important; line-height: 1.3 !important; text-shadow: none !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .project-preview-overlay p { color: var(--creation-muted) !important; font-size: 13px !important; line-height: 1.6 !important; text-shadow: none !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .project-preview-type { color: var(--creation-blue) !important; font-size: 11px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .project-preview-meta { flex-wrap: wrap !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .project-preview-meta > span { background: var(--mobile-creation-field) !important; color: var(--creation-ink) !important; border-color: var(--creation-line) !important; backdrop-filter: none !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .project-preview-generation { padding: 20px !important; background: var(--mobile-creation-tint) !important; color: var(--creation-ink) !important; backdrop-filter: none !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .project-preview-generation strong { color: var(--creation-ink) !important; font-size: 15px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .project-preview-generation p { color: var(--creation-muted) !important; font-size: 12px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .project-preview-spinner { border-color: var(--creation-line) !important; border-top-color: var(--creation-blue) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .project-preview-generation[data-phase="failed"] .project-preview-spinner { border-color: #c85d73 !important; }

    /* Hubs keep real destinations but present them as the prototype's rows. */
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-home-shell { width: 100% !important; padding-top: 0 !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page="voice"] .creation-category-shell { padding-top: 0 !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page="voice"] .creation-category-shell > .creation-subpage-categories { margin-top: 0 !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-home-hero { display: block !important; margin: 12px 0 18px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-home-hero > .creation-home-history { display: none !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.creation-home-categories, .creation-category-tabs) {
        display: flex !important;
        width: 100% !important;
        padding: 4px !important;
        margin: 12px 0 18px !important;
        gap: 4px !important;
        border: 0 !important;
        border-radius: 11px !important;
        background: var(--mobile-creation-tint) !important;
    }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.creation-home-categories, .creation-category-tabs) > a {
        min-width: 0 !important;
        min-height: 44px !important;
        flex: 1 !important;
        padding: 8px 6px !important;
        gap: 5px !important;
        border: 0 !important;
        border-radius: 8px !important;
        color: var(--creation-muted) !important;
        background: transparent !important;
        font-size: 12px !important;
        box-shadow: none !important;
        white-space: normal !important;
        text-align: center !important;
    }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.creation-home-categories, .creation-category-tabs) > a.active { background: var(--mobile-creation-surface) !important; color: var(--creation-ink) !important; box-shadow: 0 1px 5px #45325110 !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.creation-home-categories, .creation-category-tabs) :is(img, .creation-category-icon) { display: none !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-home-more-tools { display: none !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.creation-home-tools, .creation-category-section) > .creation-home-section-head { display: none !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-category-heading { margin: 14px 0 !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.creation-category-card-grid, .creation-category-card-grid-visual, .creation-category-card-grid-writing, .creation-category-card-grid-voice) {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 0 !important;
        margin: 0 !important;
    }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-category-card {
        display: grid !important;
        grid-template-columns: 26px minmax(0, 1fr) 20px !important;
        align-items: center !important;
        gap: 12px !important;
        min-height: 72px !important;
        height: auto !important;
        aspect-ratio: auto !important;
        padding: 12px 0 !important;
        border: 0 !important;
        border-bottom: 1px solid var(--creation-line) !important;
        border-radius: 0 !important;
        background: transparent !important;
        color: var(--creation-ink) !important;
        box-shadow: none !important;
        transform: none !important;
    }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-category-card-media {
        position: static !important;
        inset: auto !important;
        display: block !important;
        width: 26px !important;
        height: 26px !important;
        aspect-ratio: auto !important;
        min-height: 0 !important;
        border-radius: 6px !important;
        background: transparent !important;
    }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-category-card-media img { position: static !important; width: 26px !important; height: 26px !important; object-fit: contain !important; transform: none !important; filter: none !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.creation-category-card, .creation-category-card-media)::after { display: none !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-category-card-media :is(.creation-category-card-shade, .creation-category-card-label) { display: none !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-category-card > .creation-category-card-label { display: none !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-category-card-copy { position: static !important; inset: auto !important; display: flex !important; flex-direction: column !important; min-width: 0 !important; min-height: 0 !important; padding: 0 !important; gap: 4px !important; background: transparent !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page="home"] .creation-quick-start-grid .creation-category-card-copy { background: transparent !important; }
    html body.fuuvo-mobile-prototype #creation-app .has-mobile-hub-icon > img { display: none !important; }
    html body.fuuvo-mobile-prototype #creation-app .creation-mobile-hub-icon { display: flex; width: 26px; height: 26px; align-items: center; justify-content: center; color: var(--creation-muted); }
    html body.fuuvo-mobile-prototype #creation-app .creation-mobile-hub-icon[hidden] { display: none !important; }
    html body.fuuvo-mobile-prototype #creation-app .creation-mobile-hub-icon svg { width: 24px; height: 24px; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-category-card-copy strong { color: var(--creation-ink) !important; font-size: 14px !important; font-weight: 550 !important; line-height: 1.4 !important; white-space: normal !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-category-card-copy small { color: var(--creation-muted) !important; font-size: 11px !important; line-height: 1.5 !important; margin: 0 !important; white-space: normal !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-category-card-arrow { position: static !important; inset: auto !important; width: 20px !important; height: 24px !important; padding: 0 !important; border: 0 !important; background: none !important; color: var(--creation-muted) !important; font-size: 18px !important; transform: none !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-category-hero { display: block !important; margin: 16px 0 !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-category-primary { display: inline-flex !important; min-height: 44px !important; margin-top: 12px !important; padding: 10px 13px !important; border-radius: 12px !important; background: var(--mobile-creation-tint) !important; color: var(--creation-ink) !important; font-size: 13px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .edit-tool-row { display: flex !important; flex-wrap: wrap !important; gap: 8px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .edit-tool-row button { flex: 1 1 40% !important; min-height: 40px !important; padding: 9px 11px !important; border: 1px solid var(--creation-line) !important; border-radius: 10px !important; background: var(--mobile-creation-field) !important; color: var(--creation-ink) !important; font-size: 12px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-home-inspiration { margin-top: 24px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-home-section-head h2 { font-size: 18px !important; color: var(--creation-ink) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-home-section-head p { font-size: 12px !important; color: var(--creation-muted) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-inspiration-history { display: none !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.creation-inspiration-tabs, .works-tabs) { gap: 6px !important; border: 0 !important; overflow-x: auto !important; scrollbar-width: none !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.creation-inspiration-tabs, .works-tabs) > button { flex: 0 0 auto !important; min-height: 40px !important; padding: 8px 11px !important; border: 1px solid var(--creation-line) !important; border-radius: 10px !important; font-size: 12px !important; color: var(--creation-muted) !important; background: var(--mobile-creation-field) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.creation-inspiration-tabs, .works-tabs) > button.active { border-color: var(--creation-blue) !important; color: var(--creation-blue) !important; background: var(--creation-soft) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-inspiration-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 12px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-inspiration-card { background: var(--mobile-creation-surface) !important; border: 1px solid var(--creation-line) !important; border-radius: 13px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-inspiration-card-1 { grid-column: auto !important; grid-row: auto !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.creation-inspiration-card, .creation-inspiration-card-1) .creation-inspiration-card-media { height: auto !important; min-height: 0 !important; aspect-ratio: 16 / 9 !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-inspiration-card-copy { padding: 11px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-inspiration-card-copy strong { font-size: 12px !important; color: var(--creation-ink) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-inspiration-card-copy small { color: var(--creation-muted) !important; font-size: 11px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-inspiration-dialog { width: 100% !important; max-height: 94dvh !important; margin: auto 0 0 !important; border-radius: 25px 25px 0 0 !important; background: var(--mobile-creation-surface) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-inspiration-dialog-grid { display: flex !important; flex-direction: column !important; overflow-y: auto !important; max-height: 90dvh !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-inspiration-viewer { min-height: 220px !important; padding: 20px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-inspiration-brief-panel { padding: 20px !important; background: var(--mobile-creation-surface) !important; color: var(--creation-ink) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-inspiration-dialog-actions { flex-wrap: wrap !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-inspiration-dialog-actions > :is(a, button) { flex: 1 1 40% !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-inspiration-modal { padding: 0 !important; z-index: 10040 !important; align-items: end !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-inspiration-modal-backdrop { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; background: #24202b60 !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-inspiration-dialog { box-sizing: border-box !important; border-color: var(--creation-line) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-inspiration-dialog-grid { min-height: 0 !important; overscroll-behavior: contain !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-inspiration-viewer { min-height: 0 !important; padding: 56px 20px 0 !important; background: var(--mobile-creation-surface) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-inspiration-viewer-frame { min-height: 0 !important; height: auto !important; aspect-ratio: 16 / 9 !important; max-height: 45dvh !important; border-radius: 13px !important; background: var(--mobile-creation-tint) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-inspiration-viewer-frame :is(img, video) { max-height: 45dvh !important; object-fit: contain !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-inspiration-close { width: 44px !important; height: 44px !important; top: 8px !important; right: 12px !important; border: 0 !important; background: var(--mobile-creation-tint) !important; color: var(--creation-ink) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-inspiration-close svg { width: 22px !important; height: 22px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-inspiration-brief-heading h2 { color: var(--creation-ink) !important; font-size: 23px !important; font-weight: 600 !important; line-height: 1.3 !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.creation-inspiration-brief-heading p, .creation-inspiration-brief-scroll p) { color: var(--creation-muted) !important; -webkit-text-fill-color: currentColor !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-inspiration-brief-label { color: var(--creation-muted) !important; font-weight: 600 !important; text-transform: none !important; letter-spacing: 0 !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-inspiration-dialog-type { background: var(--creation-soft) !important; color: var(--creation-blue) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-inspiration-brief-scroll { overflow: visible !important; border-color: var(--creation-line) !important; margin-top: 18px !important; padding-top: 16px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-inspiration-brief-panel { padding-bottom: calc(26px + env(safe-area-inset-bottom)) !important; }

    /* Real revision history is kept; its comparison dialog is mounted on body. */
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-version-history { border-color: var(--creation-line) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-version-header { display: grid !important; grid-template-columns: minmax(0, 1fr) !important; gap: 12px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-version-header h2 { color: var(--creation-ink) !important; font-size: 18px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.creation-version-header p, .creation-version-body > p, .creation-version-body > small) { color: var(--creation-muted) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-version-list { grid-template-columns: minmax(0, 1fr) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-version-item { grid-template-columns: 80px minmax(0, 1fr) !important; background: var(--mobile-creation-field) !important; border-color: var(--creation-line) !important; border-radius: 13px !important; box-shadow: none !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-version-item:is(.is-current, .is-compare-selected) { background: var(--creation-soft) !important; border-color: var(--creation-blue) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-version-thumb { width: 80px !important; height: 80px !important; background: var(--mobile-creation-tint) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-version-title-row strong { color: var(--creation-ink) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-version-title-row span { background: var(--creation-soft) !important; color: var(--creation-blue) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-version-actions { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-version-action { min-height: 44px !important; background: var(--mobile-creation-field) !important; border-color: var(--creation-line) !important; color: var(--creation-ink) !important; font-size: 12px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-version-action.is-primary { background: var(--mobile-creation-action) !important; color: var(--mobile-creation-action-ink) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-version-status { color: var(--creation-muted) !important; background: var(--mobile-creation-tint) !important; border-color: var(--creation-line) !important; }

    html body.fuuvo-mobile-prototype :is(.creation-version-compare-dialog, .creation-mobile-work-confirm) { position: fixed !important; inset: auto 0 0 !important; transform: none !important; margin: auto 0 0 !important; width: 100% !important; max-width: none !important; box-sizing: border-box !important; max-height: 92dvh !important; padding: 0 !important; border: 1px solid var(--mobile-line, #dddfe6) !important; border-radius: 25px 25px 0 0 !important; background: var(--mobile-paper, #fff) !important; color: var(--mobile-ink, #171821) !important; overflow: hidden !important; }
    html body.fuuvo-mobile-prototype :is(.creation-version-compare-dialog, .creation-mobile-work-confirm)::backdrop { background: #24202b60 !important; backdrop-filter: none !important; }
    html body.fuuvo-mobile-prototype .creation-version-compare-shell > header { padding: 12px 20px !important; border-color: var(--mobile-line, #dddfe6) !important; }
    html body.fuuvo-mobile-prototype .creation-version-compare-shell h3 { color: var(--mobile-ink, #171821) !important; font-size: 19px !important; }
    html body.fuuvo-mobile-prototype .creation-version-dialog-close { width: 44px !important; height: 44px !important; color: var(--mobile-ink, #171821) !important; background: transparent !important; }
    html body.fuuvo-mobile-prototype .creation-version-compare-grid { grid-template-columns: minmax(0, 1fr) !important; max-height: calc(92dvh - 70px) !important; padding: 16px 20px calc(26px + env(safe-area-inset-bottom)) !important; overscroll-behavior: contain !important; }
    html body.fuuvo-mobile-prototype .creation-version-compare-grid figure { border-color: var(--mobile-line, #dddfe6) !important; background: var(--mobile-surface, #f6f6f8) !important; border-radius: 13px !important; }
    html body.fuuvo-mobile-prototype .creation-version-compare-grid figure > img { min-height: 160px !important; max-height: 40dvh !important; background: var(--mobile-surface, #f6f6f8) !important; }
    html body.fuuvo-mobile-prototype .creation-version-compare-grid figcaption strong { color: var(--mobile-ink, #171821) !important; }
    html body.fuuvo-mobile-prototype .creation-version-compare-grid figcaption span { color: var(--mobile-muted, #676976) !important; }
    html body.fuuvo-mobile-prototype .creation-mobile-work-confirm { padding: 24px 20px calc(26px + env(safe-area-inset-bottom)) !important; overflow-y: auto !important; z-index: 10041 !important; }
    html body.fuuvo-mobile-prototype .creation-mobile-work-confirm h2 { margin: 0 0 12px !important; color: var(--mobile-ink, #171821) !important; font-size: 21px !important; line-height: 1.3 !important; }
    html body.fuuvo-mobile-prototype .creation-mobile-work-confirm p { color: var(--mobile-muted, #676976) !important; font-size: 14px !important; line-height: 1.65 !important; margin: 0 0 18px !important; }
    html body.fuuvo-mobile-prototype .creation-mobile-work-confirm button { width: 100% !important; min-height: 48px !important; margin: 10px 0 0 !important; border: 1px solid var(--mobile-line, #dddfe6) !important; border-radius: 13px !important; background: var(--mobile-paper, #fff) !important; color: var(--mobile-ink, #171821) !important; font: inherit !important; font-size: 14px !important; }
    html body.fuuvo-mobile-prototype .creation-mobile-work-confirm .creation-mobile-work-hide { color: var(--mobile-danger, #b53650) !important; }
    body.creation-mobile-work-confirm-open { overflow: hidden !important; }
    html body.fuuvo-mobile-prototype .creation-mobile-work-actions-dialog { position: fixed !important; inset: auto 0 0 !important; transform: none !important; margin: auto 0 0 !important; box-sizing: border-box !important; width: 100% !important; max-width: none !important; max-height: 92dvh !important; padding: 22px 20px calc(26px + env(safe-area-inset-bottom)) !important; border: 1px solid var(--mobile-line, #dddfe6) !important; border-radius: 25px 25px 0 0 !important; background: var(--mobile-paper, #fff) !important; color: var(--mobile-ink, #171821) !important; overflow-y: auto !important; z-index: 10040 !important; }
    html body.fuuvo-mobile-prototype .creation-mobile-work-actions-dialog::backdrop { background: #24202b60 !important; backdrop-filter: none !important; }
    html body.fuuvo-mobile-prototype .creation-mobile-work-actions-dialog h2 { margin: 0 44px 16px 0 !important; color: var(--mobile-ink, #171821) !important; font-size: 21px !important; line-height: 1.3 !important; }
    html body.fuuvo-mobile-prototype .creation-mobile-work-actions-close { position: absolute !important; top: 12px !important; right: 14px !important; width: 44px !important; height: 44px !important; border: 0 !important; border-radius: 12px !important; background: var(--mobile-surface, #f6f6f8) !important; color: var(--mobile-muted, #676976) !important; font-size: 25px !important; }
    html body.fuuvo-mobile-prototype .creation-mobile-work-actions-dialog .work-card-menu { position: static !important; inset: auto !important; display: grid !important; width: 100% !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; background: transparent !important; }
    html body.fuuvo-mobile-prototype .creation-mobile-work-actions-dialog .work-card-menu[hidden],
    html body.fuuvo-mobile-prototype .creation-mobile-work-actions-dialog .work-card-menu button[hidden] { display: none !important; }
    html body.fuuvo-mobile-prototype .creation-mobile-work-actions-dialog .work-card-menu button { min-height: 56px !important; width: 100% !important; padding: 15px 0 !important; text-align: left !important; border: 0 !important; border-bottom: 1px solid var(--mobile-line, #dddfe6) !important; border-radius: 0 !important; background: transparent !important; color: var(--mobile-ink, #171821) !important; font: inherit !important; font-size: 14px !important; }
    html body.fuuvo-mobile-prototype .creation-mobile-work-actions-dialog .work-card-menu [data-work-action="delete"] { color: var(--mobile-danger, #b53650) !important; }
    body.creation-mobile-work-actions-open { overflow: hidden !important; }
    body.creation-mobile-work-actions-fallback-open::after { position: fixed !important; inset: 0 !important; z-index: 10039 !important; content: '' !important; background: #24202b60 !important; }
    html body.fuuvo-mobile-prototype .creation-login-required-overlay { z-index: 10040 !important; align-items: end !important; padding: 0 !important; background: #24202b60 !important; }
    html body.fuuvo-mobile-prototype .creation-login-required-dialog { box-sizing: border-box !important; width: 100% !important; max-height: 92dvh !important; overflow-y: auto !important; padding: 24px 20px calc(26px + env(safe-area-inset-bottom)) !important; border: 1px solid var(--mobile-line, #dddfe6) !important; border-radius: 25px 25px 0 0 !important; background: var(--mobile-paper, #fff) !important; color: var(--mobile-ink, #171821) !important; }
    html body.fuuvo-mobile-prototype .creation-login-required-dialog h2 { color: var(--mobile-ink, #171821) !important; font-size: 21px !important; }
    html body.fuuvo-mobile-prototype .creation-login-required-dialog p { color: var(--mobile-muted, #676976) !important; }
    html body.fuuvo-mobile-prototype .creation-login-required-close { width: 44px !important; height: 44px !important; color: var(--mobile-muted, #676976) !important; }
    html body.fuuvo-mobile-prototype .creation-login-required-cancel { border-color: var(--mobile-line, #dddfe6) !important; background: var(--mobile-surface, #f6f6f8) !important; color: var(--mobile-ink, #171821) !important; }
    html body.fuuvo-mobile-prototype .creation-login-required-login { background: var(--mobile-ink, #171821) !important; color: var(--mobile-paper, #fff) !important; }

    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .podcast-hero { margin: 8px 0 18px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.podcast-panel-heading, .podcast-settings-heading) { margin: 14px 0 !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .podcast-panel h2 { font-size: 16px !important; font-weight: 600 !important; color: var(--creation-ink) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.podcast-step, .podcast-panel-hint) { display: none !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .podcast-source-tabs { padding: 4px !important; border: 0 !important; border-radius: 11px !important; background: var(--mobile-creation-tint) !important; gap: 4px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .podcast-source-tabs button { flex: 1 !important; min-height: 40px !important; padding: 8px !important; border: 0 !important; border-radius: 8px !important; font-size: 12px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .podcast-source-tabs button { background: transparent !important; color: var(--creation-muted) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .podcast-source-tabs button.is-active { background: var(--mobile-creation-surface) !important; color: var(--creation-ink) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .podcast-result-title { grid-template-columns: 48px minmax(0, 1fr) 44px !important; gap: 10px !important; background: var(--mobile-creation-surface) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .podcast-cover { width: 48px !important; height: 48px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .podcast-icon-button { width: 44px !important; height: 44px !important; border-color: var(--creation-line) !important; border-radius: 12px !important; background: var(--mobile-creation-field) !important; color: var(--creation-ink) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .podcast-player { padding: 12px !important; border-radius: 13px !important; background: var(--mobile-creation-tint) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .podcast-play { width: 44px !important; height: 44px !important; flex-basis: 44px !important; background: var(--mobile-creation-action) !important; color: var(--mobile-creation-action-ink) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .podcast-track-meta { color: var(--creation-muted) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .podcast-track-line { background: var(--creation-line) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .podcast-track-line span { background: var(--creation-blue) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .podcast-script { max-height: none !important; padding: 14px 0 !important; color: var(--creation-ink) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .podcast-line { border-left-color: var(--creation-blue) !important; background: var(--mobile-creation-tint) !important; color: var(--creation-ink) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .podcast-line p { color: var(--creation-ink) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .podcast-result { min-height: 0 !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .podcast-status-badge { background: var(--mobile-creation-tint) !important; color: var(--creation-muted) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .podcast-status-badge.is-ready { color: #338e75 !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .podcast-status-badge.is-working { color: var(--creation-blue) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .podcast-empty-disc { background: var(--creation-soft) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .podcast-empty-bars { background: var(--creation-blue) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .podcast-checkbox > span { background: var(--mobile-creation-field) !important; border-color: var(--creation-line) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .podcast-checkbox input:checked + span { background: var(--creation-blue) !important; border-color: var(--creation-blue) !important; box-shadow: inset 0 0 0 3px var(--mobile-creation-field) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .works-grid { grid-template-columns: minmax(0, 1fr) !important; gap: 0 !important; margin-top: 16px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .work-card { display: grid !important; grid-template-columns: 80px minmax(0, 1fr) !important; align-items: center !important; gap: 14px !important; min-height: 98px !important; padding: 14px 0 !important; border: 0 !important; border-bottom: 1px solid var(--creation-line) !important; border-radius: 0 !important; background: var(--mobile-creation-surface) !important; color: var(--creation-ink) !important; box-shadow: none !important; overflow: visible !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .work-card[hidden] { display: none !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .work-card { position: relative !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .work-thumb-wrap { position: static !important; padding: 0 !important; min-width: 0 !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .work-card :is(h2, h3, strong) { color: var(--creation-ink) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .work-card :is(p, small) { color: var(--creation-muted) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .work-thumb { width: 80px !important; height: 70px !important; aspect-ratio: auto !important; object-fit: cover !important; border-radius: 10px !important; background: var(--mobile-creation-tint) !important; color: var(--creation-muted) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .work-thumb[hidden] { display: none !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .work-card-body { min-width: 0 !important; padding: 0 44px 0 0 !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .work-card-title { color: var(--creation-ink) !important; font-size: 14px !important; line-height: 1.4 !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .work-card-meta { gap: 8px !important; margin-top: 8px !important; color: var(--creation-muted) !important; font-size: 11px !important; flex-wrap: wrap !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .work-type-icon { width: 14px !important; height: 14px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .work-menu { top: 14px !important; right: 0 !important; width: 40px !important; height: 40px !important; border: 0 !important; background: var(--mobile-creation-surface) !important; color: var(--creation-muted) !important; box-shadow: none !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .work-card-menu { top: 56px !important; right: 0 !important; border-color: var(--creation-line) !important; background: var(--mobile-creation-field) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .work-card-menu button { color: var(--creation-ink) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .work-card-menu button:last-child { color: #c85d73 !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .work-thumb-placeholder { gap: 4px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .work-thumb-placeholder img { width: 28px !important; height: 28px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .work-thumb-placeholder strong { font-size: 10px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .work-status { top: 4px !important; left: 4px !important; min-height: 16px !important; padding: 3px 4px !important; font-size: 9px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .work-card:has(.work-audio-preview) { grid-template-columns: minmax(0, 1fr) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .work-audio-preview { width: 100% !important; height: auto !important; min-height: 104px !important; padding: 12px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .work-audio-preview audio { width: 100% !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .project-live-brief { grid-template-columns: minmax(0, 1fr) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.project-result-status, .project-result-story-card, .project-brief-summary) { background: var(--mobile-creation-tint) !important; border-color: var(--creation-line) !important; border-radius: 15px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.project-ai-section-head, .project-preview-heading) h2,
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.detail-preview-card, .project-result-brief-card, .result-actions) > h2 { color: var(--creation-ink) !important; font-size: 17px !important; line-height: 1.4 !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .project-ai-section-head > span { background: var(--creation-soft) !important; color: var(--creation-blue) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.project-ai-section-head p, .project-preview-heading p, .project-rights-note, .project-visual-option small, .project-result-status > small, .project-result-tip p) { color: var(--creation-muted) !important; font-size: 11px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.project-live-brief, .project-result-brief) > div { grid-template-columns: 76px minmax(0, 1fr) !important; border-color: var(--creation-line) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .project-result-brief > div.wide { grid-template-columns: minmax(0, 1fr) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.project-live-brief, .project-result-brief) dt { color: var(--creation-muted) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.project-live-brief, .project-result-brief) dd { color: var(--creation-ink) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .project-result-tip { padding: 14px !important; border-radius: 12px !important; background: var(--mobile-creation-tint) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .project-result-tip strong { color: var(--creation-ink) !important; font-size: 13px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .project-result-status { grid-template-columns: 10px minmax(0, 1fr) !important; gap: 10px !important; padding: 14px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .project-result-status > small { grid-column: 2 !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .project-result-status strong { color: var(--creation-ink) !important; font-size: 14px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .project-result-actions { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 8px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.works-empty, .result-initial-waiting, .result-media-state, .project-result-waiting) { min-height: 230px !important; max-width: 100% !important; padding: 24px 18px !important; border-color: var(--creation-line) !important; border-radius: 14px !important; background: var(--mobile-creation-tint) !important; color: var(--creation-muted) !important; aspect-ratio: auto !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.works-empty h2, .result-initial-waiting strong, .result-media-state strong, .project-result-waiting strong) { color: var(--creation-ink) !important; font-size: 17px !important; line-height: 1.4 !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.works-empty p, .result-initial-waiting p, .result-media-state p, .project-result-waiting p) { color: var(--creation-muted) !important; font-size: 12px !important; line-height: 1.6 !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.result-spinner, .project-result-spinner) { border-color: var(--creation-line) !important; border-top-color: var(--creation-blue) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.audio-result-status, .studio-result-status):not(:empty) { padding: 12px !important; margin: 0 0 12px !important; border-radius: 12px !important; background: var(--mobile-creation-tint) !important; color: var(--creation-muted) !important; font-size: 12px !important; line-height: 1.5 !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(.detail-form-status.error, .creation-form-status.error, .audio-result-status[data-state="error"]) { color: #c85d73 !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .audio-result-status[data-state="error"] { border-color: #c85d73 !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page].has-mobile-creation-empty :is(.result-layout, .result-status, .project-result-page) { display: none !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-mobile-empty-result { display: grid !important; gap: 12px !important; min-height: 240px !important; margin: 20px 0 !important; padding: 28px 20px !important; border-radius: 15px !important; background: var(--mobile-creation-tint) !important; text-align: center !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-mobile-empty-result h2 { margin: 0 !important; color: var(--creation-ink) !important; font-size: 19px !important; line-height: 1.4 !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-mobile-empty-result p { margin: 0 !important; color: var(--creation-muted) !important; font-size: 13px !important; line-height: 1.6 !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-mobile-empty-actions { display: flex !important; flex-direction: column !important; gap: 10px !important; margin-top: 8px !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] img.fuuvo-detail-icon,
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] img.creation-inline-icon { filter: brightness(0) !important; }
    html:is([data-ui-theme="dark"], [data-theme="dark"]) body.fuuvo-mobile-prototype #creation-app[data-creation-page] :is(img.fuuvo-detail-icon, img.creation-inline-icon),
    html body.fuuvo-mobile-prototype:is([data-ui-theme="dark"], [data-theme="dark"]) #creation-app[data-creation-page] :is(img.fuuvo-detail-icon, img.creation-inline-icon) { filter: brightness(0) invert(1) !important; }
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page] .creation-main [hidden],
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page].studio-workspace .studio-composer :is(.detail-dropzone, .upload-box)[hidden],
    html body.fuuvo-mobile-prototype #creation-app[data-creation-page].studio-workspace .detail-preview-card > .detail-media.is-empty[hidden] { display: none !important; }
}
}
