@media (hover: hover) and (pointer: fine){html body.chat-landing[data-mode="chat"]
    nav[data-fuuvo-workspace-rail="1"] .home-rail-logo.is-english {
        isolation: isolate !important;
    }
html body.chat-landing[data-mode="chat"]
    nav[data-fuuvo-workspace-rail="1"] .home-rail-logo.is-english::before,
    html body.chat-landing[data-mode="chat"]
    nav[data-fuuvo-workspace-rail="1"] .home-rail-logo.is-english::after {
        display: none !important;
        content: none !important;
    }
html body.chat-landing[data-mode="chat"]
    nav[data-fuuvo-workspace-rail="1"] .home-rail-logo-wordmark-hover {
        display: none !important;
        position: absolute !important;
        top: 50% !important;
        left: 50% !important;
        width: 50px !important;
        height: auto !important;
        max-width: none !important;
        max-height: none !important;
        object-fit: contain !important;
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
        filter: contrast(1.08) saturate(1.04)
            drop-shadow(0 1px 1px rgba(32, 42, 56, .2)) !important;
        transform: translate(-50%, -50%) !important;
        animation: none !important;
    }
html body.chat-landing[data-mode="chat"]
    nav[data-fuuvo-workspace-rail="1"] .home-rail-logo.is-english:is(:hover, :focus-visible)
    .home-rail-logo-wordmark-static {
        opacity: 0 !important;
        visibility: hidden !important;
        animation: none !important;
    }
html body.chat-landing[data-mode="chat"]
    nav[data-fuuvo-workspace-rail="1"] .home-rail-logo.is-english:is(:hover, :focus-visible)
    .home-rail-logo-wordmark-hover {
        display: block !important;
        opacity: 1 !important;
        visibility: visible !important;
    }}
@media (prefers-reduced-motion: reduce){html body.chat-landing[data-mode="chat"]
    nav[data-fuuvo-workspace-rail="1"] .home-rail-logo.is-english:is(:hover, :focus-visible)
    .home-rail-logo-wordmark-hover {
        display: none !important;
        opacity: 0 !important;
        visibility: hidden !important;
    }
html body.chat-landing[data-mode="chat"]
    nav[data-fuuvo-workspace-rail="1"] .home-rail-logo.is-english:is(:hover, :focus-visible)
    .home-rail-logo-wordmark-static {
        opacity: 1 !important;
        visibility: visible !important;
        animation: none !important;
    }}
@media (hover: hover) and (pointer: fine){html body.chat-landing[data-mode="chat"]
    nav[data-fuuvo-workspace-rail="1"] .home-rail-logo.is-fuuvo-v2 {
        transform: none !important;
    }
html body.chat-landing[data-mode="chat"]
    nav[data-fuuvo-workspace-rail="1"] .home-rail-logo.is-fuuvo-v2::before,
    html body.chat-landing[data-mode="chat"]
    nav[data-fuuvo-workspace-rail="1"] .home-rail-logo.is-fuuvo-v2::after {
        display: none !important;
        content: none !important;
    }
html body.chat-landing[data-mode="chat"]
    nav[data-fuuvo-workspace-rail="1"] .home-rail-logo.is-fuuvo-v2
    .home-rail-logo-wordmark {
        position: absolute !important;
        top: 50% !important;
        left: 50% !important;
        width: 50px !important;
        height: 27px !important;
        max-width: none !important;
        max-height: none !important;
        object-fit: contain !important;
        object-position: center !important;
        transform: translate(-50%, -50%) !important;
        animation: none !important;
        transition: opacity 120ms ease, visibility 120ms ease !important;
        pointer-events: none !important;
    }
html body.chat-landing[data-mode="chat"]
    nav[data-fuuvo-workspace-rail="1"] .home-rail-logo.is-fuuvo-v2
    .home-rail-logo-wordmark-static {
        position: relative !important;
        top: auto !important;
        left: auto !important;
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        transform: none !important;
    }
html body.chat-landing[data-mode="chat"]
    nav[data-fuuvo-workspace-rail="1"] .home-rail-logo.is-fuuvo-v2
    .home-rail-logo-wordmark-hover {
        display: block !important;
        visibility: hidden !important;
        opacity: 0 !important;
    }
html body.chat-landing[data-mode="chat"]
    nav[data-fuuvo-workspace-rail="1"] .home-rail-logo.is-fuuvo-v2.is-fuuvo-video-playing
    .home-rail-logo-wordmark-static {
        visibility: hidden !important;
        opacity: 0 !important;
    }
html body.chat-landing[data-mode="chat"]
    nav[data-fuuvo-workspace-rail="1"] .home-rail-logo.is-fuuvo-v2.is-fuuvo-video-playing
    .home-rail-logo-wordmark-hover {
        visibility: visible !important;
        opacity: 1 !important;
    }}
@media (prefers-reduced-motion: reduce){html body.chat-landing[data-mode="chat"]
    nav[data-fuuvo-workspace-rail="1"] .home-rail-logo.is-fuuvo-v2.is-fuuvo-video-playing
    .home-rail-logo-wordmark-static {
        visibility: visible !important;
        opacity: 1 !important;
    }
html body.chat-landing[data-mode="chat"]
    nav[data-fuuvo-workspace-rail="1"] .home-rail-logo.is-fuuvo-v2.is-fuuvo-video-playing
    .home-rail-logo-wordmark-hover {
        visibility: hidden !important;
        opacity: 0 !important;
    }}
@keyframes fuuvo-text-logo-sheen {
    0% {
        opacity: 0;
        transform: translateX(-130%) skewX(-16deg);
    }
    18% {
        opacity: 1;
    }
    72% {
        opacity: .72;
    }
    100% {
        opacity: 0;
        transform: translateX(130%) skewX(-16deg);
    }
}
@keyframes fuuvo-text-logo-split {
    0%,
    100% {
        background-position: 50% 0%;
        filter: drop-shadow(0 1px 0 rgba(84, 84, 84, .2));
        transform: translateY(0) scale(1);
    }
    35% {
        background-position: 50% 100%;
        filter: drop-shadow(0 0 5px rgba(240, 75, 54, .45));
        transform: translateY(-1px) scale(1.04);
    }
    62% {
        background-position: 50% 42%;
        filter: drop-shadow(0 0 3px rgba(255, 255, 255, .8));
        transform: translateY(0) scale(1.01);
    }
}
@keyframes fuuvo-composer-logo-rays {
    0%,
    100% {
        opacity: 0;
        transform: translateX(7px) scale(.72);
    }
    24% {
        opacity: 1;
        transform: translateX(0) scale(1);
    }
    64% {
        opacity: .82;
        transform: translateX(-2px) scale(1.08);
    }
}
@keyframes fuuvo-logo-sheen {
    0% {
        opacity: 0;
        transform: translateX(-125%) skewX(-18deg);
    }
    18% {
        opacity: .95;
    }
    72% {
        opacity: .72;
    }
    100% {
        opacity: 0;
        transform: translateX(125%) skewX(-18deg);
    }
}
@keyframes fuuvo-logo-spark {
    0% {
        opacity: 0;
        transform: scale(.35) rotate(-18deg);
    }
    22% {
        opacity: 1;
        transform: scale(1) rotate(8deg);
    }
    58% {
        opacity: .9;
        transform: scale(.8) rotate(34deg);
    }
    100% {
        opacity: 0;
        transform: translate(-4px, -2px) scale(1.35) rotate(52deg);
    }
}
@keyframes fuuvo-logo-color-surge {
    0%,
    100% {
        filter: none;
    }
    32% {
        filter: hue-rotate(158deg) saturate(1.85) contrast(1.06) brightness(1.08);
    }
    57% {
        filter: hue-rotate(115deg) saturate(1.42) contrast(1.03) brightness(1.18);
    }
    78% {
        filter: hue-rotate(35deg) saturate(1.16) brightness(1.04);
    }
}
@keyframes fuuvo-logo-text-surge {
    0%,
    100% {
        color: inherit;
        text-shadow: none;
    }
    32% {
        color: #f04b36;
        text-shadow: 0 0 12px rgba(240, 75, 54, .24);
    }
    58% {
        color: #f18a36;
        text-shadow: 0 0 10px rgba(241, 138, 54, .18);
    }
}
@media (prefers-reduced-motion: reduce){.fuuvo-logo-motion,
    .fuuvo-logo-motion:is(:hover, :focus-visible) {
        transform: none;
        transition: none;
    }
.fuuvo-logo-motion::before,
    .fuuvo-logo-motion::after,
    .fuuvo-logo-motion:is(:hover, :focus-visible) img,
    .fuuvo-logo-motion:is(:hover, :focus-visible) .home-brand-letter > span,
    .fuuvo-logo-motion:is(img):is(:hover, :focus-visible),
    .fuuvo-logo-motion:is(:hover, :focus-visible) .brand-wordmark,
    .fuuvo-logo-motion:is(:hover, :focus-visible) .home-living-brand,
    .fuuvo-logo-motion:is(:hover, :focus-visible) .auth-brand-en-word,
    .fuuvo-logo-motion:is(:hover, :focus-visible).kc-brand > span {
        animation: none;
    }
.composer-title-logo-link:is(:hover, :focus-visible)::before,
    .composer-title-logo-link:is(:hover, :focus-visible)::after,
    .composer-title-logo-link:is(:hover, :focus-visible) .composer-logo-letter {
        animation: none;
    }}
@supports ((-webkit-mask-image: url("")) or (mask-image: url(""))){.fuuvo-logo-motion.is-chinese::before,
    .fuuvo-logo-motion.is-chinese::after {
        inset: 0;
        width: auto;
        height: auto;
        border: 0;
        border-radius: 0;
        box-shadow: none;
        pointer-events: none;
        -webkit-mask: url("/static/branding/duoyiding-home-title-v2.svg?v=20260929-brand-zh1") center / contain no-repeat;
        mask: url("/static/branding/duoyiding-home-title-v2.svg?v=20260929-brand-zh1") center / contain no-repeat;
    }
.fuuvo-logo-motion.is-chinese::before {
        z-index: 4;
        opacity: 1;
        background: linear-gradient(180deg, #ef4038 0 46%, #eef1f5 48% 100%);
        filter:
            drop-shadow(0 1px 0 rgba(255, 255, 255, .86))
            drop-shadow(0 2px 0 rgba(48, 57, 70, .18))
            drop-shadow(0 4px 4px rgba(77, 30, 29, .24));
        transform: translateY(0);
    }
.fuuvo-logo-motion.is-chinese::after {
        z-index: 5;
        opacity: 0;
        background: linear-gradient(
            112deg,
            transparent 33%,
            rgba(255, 255, 255, .12) 42%,
            rgba(255, 255, 255, .94) 49%,
            rgba(255, 118, 96, .68) 56%,
            transparent 68%
        );
        filter: blur(1px);
        transform: translateX(-125%) skewX(-16deg);
    }
.fuuvo-logo-motion.is-chinese > :is(img, .brand-logo, .brand-head, .brand-icon, .brand-icon-fallback) {
        opacity: 0;
    }
@media (hover: hover) and (pointer: fine){.fuuvo-logo-motion.is-chinese:is(:hover, :focus-visible)::before {
            animation: fuuvo-zh-brand-bounce 820ms cubic-bezier(.2, .8, .2, 1) both;
        }
.fuuvo-logo-motion.is-chinese:is(:hover, :focus-visible)::after {
            animation: fuuvo-zh-brand-sheen 920ms cubic-bezier(.2, .7, .2, 1) both;
        }}
body[data-ui-theme="dark"] .fuuvo-logo-motion.is-chinese::before {
        background: linear-gradient(180deg, #ff6258 0 46%, #eef3fb 48% 100%);
        filter:
            drop-shadow(0 1px 0 rgba(255, 255, 255, .18))
            drop-shadow(0 5px 5px rgba(0, 0, 0, .48))
            drop-shadow(0 0 8px rgba(255, 77, 67, .18));
    }
body[data-ui-theme="dark"] .fuuvo-logo-motion.is-chinese::after {
        background: linear-gradient(
            112deg,
            transparent 33%,
            rgba(255, 255, 255, .08) 42%,
            rgba(255, 255, 255, .88) 49%,
            rgba(255, 126, 112, .62) 56%,
            transparent 68%
        );
    }
@keyframes fuuvo-zh-brand-bounce {
        0%,
        100% {
            transform: translateY(0) rotate(0) scale(1);
        }
        28% {
            transform: translateY(-2px) rotate(-1deg) scale(1.035, .975);
        }
        55% {
            transform: translateY(1px) rotate(.8deg) scale(.985, 1.025);
        }
        78% {
            transform: translateY(-.5px) rotate(-.3deg) scale(1.012, .995);
        }
    }
@keyframes fuuvo-zh-brand-sheen {
        0% {
            opacity: 0;
            transform: translateX(-125%) skewX(-16deg);
        }
        18% {
            opacity: 1;
        }
        72% {
            opacity: .68;
        }
        100% {
            opacity: 0;
            transform: translateX(125%) skewX(-16deg);
        }
    }
@media (prefers-reduced-motion: reduce){.fuuvo-logo-motion.is-chinese:is(:hover, :focus-visible)::before,
        .fuuvo-logo-motion.is-chinese:is(:hover, :focus-visible)::after {
            animation: none;
        }}}
:root {
    --fuuvo-font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", "Noto Sans SC Variable", "Noto Sans SC", sans-serif;
    font-size: 16px;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    font-synthesis: none;
}
html,
body {
    font-family: var(--fuuvo-font-sans) !important;
    font-kerning: normal;
}
button,
input,
textarea,
select,
optgroup {
    font-family: var(--fuuvo-font-sans) !important;
    font-size: inherit;
}
:root {
            --bg: #f5f7fb;
            --panel: rgba(255, 255, 255, 0.94);
            --panel-strong: #ffffff;
            --line: rgba(15, 23, 42, 0.08);
            --line-strong: rgba(15, 23, 42, 0.14);
            --text: #141826;
            --muted: #6a7386;
            --brand: #2563ff;
            --brand-strong: #173da6;
            --brand-soft: rgba(37, 99, 255, 0.1);
            --success: #0f7a50;
            --warning: #b7791f;
            --danger: #cf3f4f;
            --shadow: 0 24px 60px rgba(15, 23, 42, 0.08);
            --shadow-soft: 0 12px 24px rgba(15, 23, 42, 0.06);
            --radius-xl: 28px;
            --radius-lg: 22px;
            --radius-md: 16px;
            --radius-sm: 12px;
            --chat-sidebar-width: 272px;
            --chat-sidebar-resizer-width: 10px;
        }
* {
            box-sizing: border-box;
        }
html,
        body {
            min-height: 100%;
        }
body {
            margin: 0;
            font-family: "PingFang SC", "Microsoft YaHei", sans-serif;
            color: var(--text);
            background:
                radial-gradient(circle at top left, rgba(37, 99, 255, 0.12), transparent 24%),
                radial-gradient(circle at top right, rgba(16, 185, 129, 0.08), transparent 16%),
                linear-gradient(180deg, #fbfcfe 0%, #f4f6fa 100%);
        }
body[data-ui-theme="dark"] {
            --bg: #09111f;
            --panel: rgba(13, 22, 38, 0.92);
            --panel-strong: #0f1b2f;
            --line: rgba(148, 163, 184, 0.16);
            --line-strong: rgba(148, 163, 184, 0.22);
            --text: #edf2ff;
            --muted: #98a6bf;
            --brand: #6aa1ff;
            --brand-strong: #bfd3ff;
            --brand-soft: rgba(92, 140, 255, 0.16);
            --shadow: 0 24px 60px rgba(2, 6, 23, 0.46);
            --shadow-soft: 0 12px 24px rgba(2, 6, 23, 0.28);
            background:
                radial-gradient(circle at top left, rgba(54, 92, 183, 0.34), transparent 26%),
                radial-gradient(circle at top right, rgba(26, 146, 130, 0.2), transparent 18%),
                linear-gradient(180deg, #08101d 0%, #0d1626 100%);
        }
.site-topbar {
            display: none;
        }
a {
            color: inherit;
            text-decoration: none;
        }
button,
        input,
        select,
        textarea {
            font: inherit;
        }
.hidden {
            display: none !important;
        }
.app {
            width: 100%;
            margin: 0;
            padding: 0;
            min-height: 100vh;
            display: grid;
            grid-template-columns: 260px minmax(0, 1fr);
            gap: 0;
            align-items: stretch;
            background: #f8f9fb;
        }
.desktop-sidebar-resizer {
            display: none;
        }
.card {
            background: var(--panel);
            backdrop-filter: blur(20px);
            border: 1px solid var(--line);
            border-radius: var(--radius-xl);
            box-shadow: var(--shadow);
        }
.rail {
            display: none;
        }
.history {
            position: sticky;
            top: 0;
            min-height: 100vh;
            max-height: 100vh;
            padding: 12px 10px 10px;
            display: grid;
            grid-template-rows: auto minmax(0, 1fr) auto auto;
            gap: 6px;
            overflow: hidden;
            background: #f7f7f8;
            border-radius: 0;
            border-top: none;
            border-bottom: none;
            border-left: none;
            border-right: 1px solid rgba(15, 23, 42, 0.05);
            box-shadow: none;
        }
.sidebar-shell {
            display: grid;
            gap: 8px;
            align-content: start;
            min-height: 0;
        }
.sidebar-search-trigger {
            width: 100%;
            min-height: 44px;
            padding: 0 12px 0 14px;
            border-radius: 16px;
            border: 1px solid rgba(15, 23, 42, 0.06);
            background: rgba(255, 255, 255, 0.96);
            color: #637086;
            display: grid;
            grid-template-columns: auto minmax(0, 1fr) auto;
            align-items: center;
            gap: 10px;
            cursor: pointer;
            box-shadow: 0 10px 24px rgba(15, 23, 42, 0.04);
            transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
        }
.sidebar-search-trigger svg {
            width: 18px;
            height: 18px;
            color: #8c97aa;
            flex: 0 0 18px;
        }
.sidebar-search-trigger-label {
            min-width: 0;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            font-size: 14px;
            text-align: left;
        }
.sidebar-search-trigger-shortcut {
            min-height: 24px;
            padding: 0 8px;
            border-radius: 999px;
            background: rgba(15, 23, 42, 0.05);
            color: #8c97aa;
            font-size: 11px;
            font-weight: 700;
            display: inline-flex;
            align-items: center;
            justify-content: center;
        }
.history-main {
            min-height: 0;
            overflow-y: auto;
            overflow-x: hidden;
            display: grid;
            align-content: start;
            gap: 10px;
            padding-right: 4px;
        }
.history-account {
            margin-top: 0;
            padding-top: 10px;
        }
.history-account .workspace-account-menu {
            width: 100%;
            display: grid;
            gap: 8px;
        }
.workspace-account-card {
            width: 100%;
            min-height: 68px;
            padding: 0 10px 0 12px;
            display: flex;
            align-items: center;
            gap: 6px;
            border: 1px solid #dfe7f2;
            border-radius: 11px;
            background: #fff;
            box-sizing: border-box;
        }
.workspace-account-card .workspace-account-toggle {
            flex: 1 1 auto;
            min-width: 0;
            min-height: 66px;
            padding: 0;
            border: 0;
            border-radius: 0;
            background: transparent;
            justify-content: flex-start;
            gap: 11px;
            color: #1f2937;
        }
.workspace-account-card .workspace-account-toggle::after {
            margin-left: 8px;
        }
.workspace-account-settings {
            width: 32px;
            height: 32px;
            padding: 0;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border: 0;
            border-radius: 8px;
            background: transparent;
            color: #6c7b91;
            cursor: pointer;
            transition: color .18s ease, background .18s ease;
        }
.workspace-header-user-fallback.guest-avatar {
            width: 42px;
            height: 42px;
            background: #e7f0ff;
            color: #2877ee;
        }
.workspace-header-user-fallback.guest-avatar svg {
            width: 24px;
            height: 24px;
            display: block;
        }
.sidebar-safety-link {
            width: 100%;
            min-height: 40px;
            padding: 0 12px;
            display: inline-flex;
            align-items: center;
            gap: 9px;
            border: 1px solid transparent;
            border-radius: 9px;
            color: #71809a;
            font-size: 13px;
            text-decoration: none;
            box-sizing: border-box;
            transition: color .18s ease, background .18s ease;
        }
.history-account .workspace-account-dropdown {
            left: 0;
            right: auto;
            top: auto;
            bottom: calc(100% + 10px);
            min-width: 188px;
        }
.sidebar-brand {
            display: flex;
            align-items: center;
            gap: 10px;
            min-width: 0;
            padding: 4px 8px 8px;
        }
.sidebar-brand img {
            width: 30px;
            height: 30px;
            flex: 0 0 24px;
            object-fit: contain;
            display: block;
            background: transparent;
            border: 0;
            border-radius: 0;
        }
.sidebar-brand-row {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 8px;
        }
body[data-ui-theme="dark"] .sidebar-toggle-slot .desktop-history-toggle {
            color: #8b9ab5;
        }
body[data-ui-theme="dark"] .sidebar-toggle-slot .desktop-history-toggle:hover {
            background: rgba(148, 163, 184, 0.1);
            color: #e2e8f0;
        }
.sidebar-nav {
            display: grid;
            gap: 4px;
        }
.sidebar-section-label {
            padding: 8px 4px 0;
            color: #9aa3b2;
            font-size: 12px;
            line-height: 1.2;
        }
.history-composer-slot {
            display: none;
            min-height: 0;
            gap: 18px;
            align-content: start;
        }
.workspace {
            min-width: 0;
            min-height: 100vh;
            display: grid;
            grid-template-rows: auto minmax(0, 1fr) auto;
            gap: 16px;
            padding: 0 28px 0 20px;
        }
body[data-mode="chat"] .workspace {
            display: flex;
            flex-direction: column;
            min-height: 0;
            gap: 0;
            height: 100vh;
            min-height: 100vh;
            max-height: 100vh;
            overflow: hidden;
        }
body[data-mode="chat"] .workspace-records {
            display: none;
        }
.hero {
            padding: 18px 22px;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 18px;
            background:
                radial-gradient(circle at top left, rgba(37, 99, 255, 0.1), transparent 24%),
                linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(248, 250, 252, 0.98) 100%);
        }
body[data-mode="chat"] .hero {
            display: none;
        }
.toast-stack {
            position: fixed;
            right: 24px;
            bottom: 24px;
            z-index: 90;
            display: flex;
            flex-direction: column;
            gap: 10px;
            pointer-events: none;
        }
.auth-overlay {
            position: fixed;
            inset: 0;
            z-index: 120;
        }
.legal-doc-overlay {
            z-index: 160;
        }
@keyframes status-spin {
            from { transform: rotate(0deg); }
            to { transform: rotate(360deg); }
        }
@keyframes toast-in {
            from {
                opacity: 0;
                transform: translateY(10px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }
.user-links,
        .task-actions,
        .history-actions,
        .pagination-actions,
        .upload-actions,
        .result-actions,
        .mode-switch,
        .mobile-actions {
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            gap: 10px;
        }
.history-head,
        .section-head {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 12px;
        }
.history-head {
            padding-bottom: 12px;
            border-bottom: 1px solid rgba(15, 23, 42, 0.05);
        }
.history.is-conversation-view .history-head,
        .history.is-conversation-view .history-search,
        .history.is-conversation-view .history-actions {
            display: none !important;
        }
.history.is-conversation-view .history-main {
            gap: 8px;
        }
.history.is-conversation-view .sidebar-section-label {
            margin: 2px 0 4px;
            padding: 0 4px;
            font-size: 12px;
            font-weight: 600;
            color: #8a94a6;
            letter-spacing: 0;
        }
.history-search {
            display: grid;
            grid-template-columns: minmax(0, 1fr) auto;
            gap: 8px;
            align-items: center;
            padding: 8px;
            border-radius: 18px;
            background: rgba(244, 247, 252, 0.92);
            border: 1px solid rgba(15, 23, 42, 0.05);
        }
.conversation-list,
        .task-list {
            display: grid;
            gap: 12px;
            overflow: visible;
            padding-right: 0;
            min-width: 0;
        }
.rail,
        .history,
        .workspace,
        .result-card,
        .result-content,
        .composer,
        .task-item,
        .conversation-item {
            min-width: 0;
        }
.conversation-list {
            max-height: none;
        }
.history.is-conversation-view .conversation-list {
            gap: 4px;
        }
body[data-mode="chat"] .conversation-list {
            max-height: none;
            padding-bottom: 8px;
        }
.task-list {
            min-height: 0;
        }
.conversation-menu {
            position: absolute;
            top: calc(100% + 8px);
            right: 4px;
            z-index: 25;
            min-width: 162px;
            padding: 8px;
            border-radius: 18px;
            border: 1px solid rgba(15, 23, 42, 0.06);
            background: rgba(255, 255, 255, 0.98);
            box-shadow: 0 20px 48px rgba(15, 23, 42, 0.16);
            backdrop-filter: blur(16px);
        }
.conversation-menu.conversation-menu-floating {
            position: fixed;
            top: 0;
            right: auto;
            left: 0;
            z-index: 180;
        }
.conversation-menu.hidden {
            display: none;
        }
.pagination {
            margin-top: auto;
            padding-top: 12px;
            border-top: 1px solid var(--line);
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 12px;
        }
.stage {
            min-height: 0;
            display: grid;
            grid-template-rows: auto auto minmax(0, 1fr);
            gap: 16px;
        }
body[data-mode="chat"] .stage {
            display: flex;
            flex: 1 1 auto;
            min-height: 0;
            height: 0;
            overflow: hidden;
        }
.ui-language-switch {
            display: inline-flex;
            align-items: center;
            gap: 0;
            padding: 0;
            border: 0;
            border-radius: 0;
            background: transparent;
            box-shadow: none;
        }
.ui-language-switch-btn {
            min-width: auto;
            min-height: 36px;
            padding: 0 8px;
            border: none;
            border-radius: 0;
            background: transparent;
            color: #8a95a6;
            font-size: 15px;
            font-weight: 600;
            cursor: pointer;
            transition: color .18s ease;
        }
.ui-language-switch-btn.active {
            background: transparent;
            color: #111827;
            box-shadow: none;
            font-weight: 700;
        }
.ui-language-switch-btn + .ui-language-switch-btn {
            border-left: 1px solid #d8e1ee;
        }
body[data-ui-theme="dark"] .core-feature-add-menu {
            border-color: rgba(148, 163, 184, .2);
            background: #111a2b;
            box-shadow: 0 18px 44px rgba(2, 6, 23, .42);
        }
body[data-ui-theme="dark"] .home-favorite-menu-head strong {
            color: #f1f5ff;
        }
body[data-ui-theme="dark"] .home-favorite-option {
            border-color: rgba(148, 163, 184, .18);
            background: rgba(15, 23, 42, .72);
            color: #e4ecfb;
        }
body[data-ui-theme="dark"] .home-favorite-option:hover,
        body[data-ui-theme="dark"] .home-favorite-option:focus-visible {
            border-color: rgba(96, 165, 250, .42);
            background: rgba(30, 41, 59, .94);
            color: #dce8ff;
        }
@media (max-width: 920px){.fuuvo-icon-writing { --fuuvo-icon-url: url('/static/icons/fuuvo-home-capabilities/fuuvo-writing.png'); }
.fuuvo-icon-image-generation { --fuuvo-icon-url: url('/static/icons/fuuvo-home-capabilities/fuuvo-generate-image.png'); }
.fuuvo-icon-translate { --fuuvo-icon-url: url('/static/icons/fuuvo-home-capabilities/fuuvo-translate.png'); }
.fuuvo-icon-core-upload-analysis { --fuuvo-icon-url: url('/static/icons/fuuvo-home-capabilities/fuuvo-core-upload-analysis.png'); }
.fuuvo-icon-core-office-efficiency { --fuuvo-icon-url: url('/static/icons/fuuvo-home-capabilities/fuuvo-core-office-efficiency.png'); }
.fuuvo-icon-core-local-food { --fuuvo-icon-url: url('/static/icons/fuuvo-home-capabilities/fuuvo-core-local-food.png'); }
.fuuvo-icon-core-fortune-zodiac { --fuuvo-icon-url: url('/static/icons/fuuvo-home-capabilities/fuuvo-core-fortune-zodiac.png'); }}
@media (hover: none), (pointer: coarse){.conversation-item:hover:not(.active),
            .conversation-item.menu-open:not(.active),
            .conversation-item.menu-open:not(.active):hover {
                transform: none !important;
                border-color: transparent !important;
                background: transparent !important;
                box-shadow: none !important;
            }}
@media (max-width: 720px){.core-feature-actions {
                width: 100%;
                gap: 8px;
                margin-top: 2px;
                flex-wrap: wrap;
            }
.core-feature-btn {
                min-height: 48px;
                padding: 0 10px;
                flex: 1 1 calc(50% - 4px);
                border-radius: 12px;
                font-size: 12px;
            }
.core-feature-add-wrap {
                flex: 1 1 calc(50% - 4px);
            }
.core-feature-add-menu {
                position: fixed;
                top: 50%;
                right: auto;
                left: 50%;
                width: min(360px, calc(100vw - 24px));
                max-width: none !important;
                max-height: calc(100vh - 32px);
                padding: 12px;
                transform: translate(-50%, -50%);
            }
.home-favorite-option-grid {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }
.core-feature-btn-icon,
            .core-feature-btn-icon svg,
            .core-feature-btn-icon .home-core-feature-icon {
                width: 24px;
                height: 24px;
            }
.core-feature-btn-icon .fuuvo-icon {
                width: 24px;
                height: 24px;
            }}
@keyframes quick-prompt-shimmer {
            100% {
                transform: translateX(100%);
            }
        }
body[data-ui-theme="dark"] .chat-followup-title {
            color: #91a0b5;
        }
body[data-ui-theme="dark"] .chat-followup-discovery-lead {
            color: #b8c5d8;
        }
body[data-ui-theme="dark"] .chat-followup-title::before,
        body[data-ui-theme="dark"] .chat-followup-title::after {
            background: rgba(148, 163, 184, 0.18);
        }
body[data-ui-theme="dark"] .chat-followup-topic {
            border-color: rgba(148, 163, 184, 0.2);
            background: #151f2e;
            color: #dbe5f3;
            box-shadow: none;
        }
body[data-ui-theme="dark"] .chat-followup-topic > .chat-followup-arrow {
            color: #86b9ff;
        }
body[data-ui-theme="dark"] .chat-followup-topic:hover,
        body[data-ui-theme="dark"] .chat-followup-topic:focus-visible {
            border-color: rgba(96, 165, 250, 0.48);
            background: #1a2a41;
            color: #f3f7fd;
        }
body[data-ui-theme="dark"] .chat-followup-confirm-lead {
            color: #dbe5f3;
        }
body[data-ui-theme="dark"] .chat-followup-confirm-action {
            border-color: rgba(148, 163, 184, 0.18);
            background: #182333;
            color: #e7eef8;
        }
body[data-ui-theme="dark"] .chat-followup-confirm-action:hover,
        body[data-ui-theme="dark"] .chat-followup-confirm-action:focus-visible {
            border-color: rgba(96, 165, 250, 0.42);
            background: #1d304a;
            color: #f7fbff;
        }
body[data-ui-theme="dark"] .chat-bubble.user.is-editing {
            color: #eef2f7;
        }
body[data-ui-theme="dark"] .chat-message-inline-editor {
            border-color: #5a8dff;
            background: #151922;
            box-shadow: 0 12px 34px rgba(0, 0, 0, 0.24);
        }
body[data-ui-theme="dark"] .chat-message-edit-textarea {
            color: #f4f7fb;
        }
body[data-ui-theme="dark"] .chat-message-edit-textarea::placeholder,
        body[data-ui-theme="dark"] .chat-message-edit-attachments .chat-attachment-meta {
            color: #aeb9c9;
        }
body[data-ui-theme="dark"] .chat-message-edit-cancel {
            border-color: #3b4657;
            background: #1b202a;
            color: #eef2f7;
        }
body[data-ui-theme="dark"] .chat-message-edit-cancel:hover {
            border-color: #526178;
            background: #242b37;
        }
@media (max-width: 720px){.chat-message-inline-editor {
                padding: 12px 12px 10px;
                border-radius: 18px;
            }
.chat-message-edit-textarea {
                min-height: 62px;
                font-size: 15px;
            }
.chat-message-edit-actions {
                gap: 8px;
            }
.chat-message-edit-cancel,
            .chat-message-edit-send {
                min-height: 36px;
                padding: 0 16px;
            }
.chat-message-edit-attachments .chat-attach-grid {
                grid-template-columns: minmax(0, 1fr);
            }}
@media (max-width: 920px){body.chat-detail-open.chat-inline-message-editing .composer,
            body.chat-detail-open.chat-inline-message-editing .workspace-disclaimer,
            body.chat-detail-open.chat-inline-message-editing .workspace > .fuuvo-ai-disclaimer {
                display: none !important;
            }}
.clarification-banner {
            position: relative;
            display: none;
            align-items: flex-start;
            gap: 10px;
            margin-top: 10px;
            padding: 12px 44px 12px 14px;
            border-radius: 16px;
            border: 1px solid rgba(245, 158, 11, 0.24);
            background: linear-gradient(180deg, rgba(255, 251, 235, 0.98) 0%, rgba(255, 255, 255, 0.98) 100%);
            color: #8a5a10;
        }
.chat-upload-entry {
            position: relative;
            display: inline-flex;
        }
.chat-upload-popover {
            position: fixed;
            left: 12px;
            top: 12px;
            width: min(312px, calc(100vw - 24px));
            max-height: min(430px, calc(100vh - 24px));
            padding: 10px;
            border-radius: 18px;
            border: 1px solid rgba(15, 23, 42, 0.08);
            background: rgba(255, 255, 255, 0.98);
            box-shadow: 0 20px 38px rgba(15, 23, 42, 0.12);
            backdrop-filter: blur(18px);
            display: grid;
            gap: 6px;
            overflow-x: hidden;
            overflow-y: auto;
            overscroll-behavior: contain;
            z-index: 120;
        }
body[data-ui-theme="dark"] .chat-upload-popover {
            border-color: rgba(148, 163, 184, 0.22);
            background: rgba(12, 20, 34, 0.98);
            box-shadow: 0 22px 48px rgba(2, 6, 23, 0.46);
        }
body[data-ui-theme="dark"] .chat-upload-popover-head strong,
        body[data-ui-theme="dark"] .chat-upload-option,
        body[data-ui-theme="dark"] .chat-upload-option-copy strong {
            color: #edf2ff;
        }
body[data-ui-theme="dark"] .chat-upload-popover-head span,
        body[data-ui-theme="dark"] .chat-upload-option-copy span {
            color: #a8b7cf;
        }
body[data-ui-theme="dark"] .chat-upload-option:hover {
            background: rgba(37, 99, 255, 0.16);
            border-color: rgba(96, 165, 250, 0.28);
        }
body[data-ui-theme="dark"] .chat-markdown .table-scroll {
            border-color: rgba(148, 163, 184, 0.24);
            background: #111827;
            scrollbar-color: rgba(148, 163, 184, 0.55) transparent;
        }
body[data-ui-theme="dark"] .chat-markdown .table-scroll :is(th, td) {
            border-color: rgba(148, 163, 184, 0.2);
            color: #dbe4f0;
        }
body[data-ui-theme="dark"] .chat-markdown .table-scroll th,
        body[data-ui-theme="dark"] .chat-markdown .table-scroll thead th:first-child {
            background: #1b2535;
            color: #f1f5f9;
        }
body[data-ui-theme="dark"] .chat-markdown .table-scroll tbody td,
        body[data-ui-theme="dark"] .chat-markdown .table-scroll tbody td:first-child {
            background: #111827;
        }
@keyframes research-progress-pulse {
            0%, 100% { opacity: .45; transform: scale(.86); }
            50% { opacity: 1; transform: scale(1); }
        }
@keyframes pulse {
            0%, 80%, 100% { transform: scale(.72); opacity: .35; }
            40% { transform: scale(1); opacity: 1; }
        }
@keyframes chat-stream-caret {
            0%, 48% { opacity: 1; }
            49%, 100% { opacity: 0; }
        }
@media (prefers-reduced-motion: reduce){.chat-bubble.is-streaming .chat-markdown > p:last-child::after,
            .chat-bubble.is-streaming .chat-markdown > h1:last-child::after,
            .chat-bubble.is-streaming .chat-markdown > h2:last-child::after,
            .chat-bubble.is-streaming .chat-markdown > h3:last-child::after,
            .chat-bubble.is-streaming .chat-markdown > ul:last-child > li:last-child::after,
            .chat-bubble.is-streaming .chat-markdown > ol:last-child > li:last-child::after,
            .chat-bubble.is-streaming .chat-markdown > pre:last-child::after,
            .chat-bubble.is-streaming .chat-markdown:empty::after {
                animation: none;
            }}
.composer {
            padding: 12px 0 20px;
            display: flex;
            flex-direction: column;
            gap: 14px;
            background: transparent;
            border: none;
            box-shadow: none;
        }
.workspace-composer-anchor {
            display: none;
        }
.workspace-records {
            display: none;
            padding: 18px;
            gap: 14px;
        }
.composer-top {
            display: none;
        }
.btn {
            border: none;
            border-radius: 14px;
            padding: 12px 16px;
            font-size: 14px;
            font-weight: 700;
            cursor: pointer;
            transition: transform .18s ease, box-shadow .18s ease, opacity .18s ease;
        }
.btn.primary {
            color: #fff;
            background: linear-gradient(135deg, #2563ff 0%, #173da6 100%);
        }
.composer-actions {
            display: flex;
            align-items: center;
            gap: 10px;
            flex-wrap: wrap;
        }
#media-compose {
            display: grid;
            gap: 14px;
            margin-top: 2px;
            padding: 14px 16px 0;
            border-top: 1px solid rgba(15, 23, 42, 0.06);
        }
.field {
            display: flex;
            flex-direction: column;
            gap: 8px;
        }
.field label {
            color: #516073;
            font-size: 13px;
            font-weight: 700;
        }
.field input,
        .field select,
        .field textarea {
            width: 100%;
            border: 1px solid var(--line-strong);
            border-radius: 16px;
            padding: 12px 14px;
            background: #fff;
            color: var(--text);
            font-size: 14px;
            line-height: 1.7;
        }
.chat-input-wrap {
            position: relative;
            border-radius: 24px;
            overflow: hidden;
            background: var(--panel-strong);
            isolation: isolate;
        }
.chat-input-hint {
            position: absolute;
            top: 16px;
            left: 16px;
            right: 136px;
            z-index: 4;
            font-size: 15px;
            line-height: 1.7;
            color: #8b95a7;
            pointer-events: none;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }
.free-media-experience-notice {
            display: flex;
            align-items: flex-start;
            gap: 8px;
            margin: 8px 6px 0;
            padding: 8px 10px;
            border: 1px solid rgba(217, 119, 6, 0.24);
            border-radius: 8px;
            background: #fff7ed;
            color: #92400e;
            font-size: 13px;
            font-weight: 550;
            line-height: 1.5;
            text-align: left;
        }
.free-media-experience-notice.hidden {
            display: none;
        }
.chat-skill-mention-menu {
            position: absolute;
            left: 12px;
            bottom: calc(100% + 10px);
            z-index: 60;
            width: min(420px, calc(100% - 24px));
            max-height: min(390px, 52dvh);
            padding: 8px;
            overflow-x: hidden;
            overflow-y: auto;
            overscroll-behavior: contain;
            border: 1px solid rgba(15, 23, 42, 0.1);
            border-radius: 18px;
            background: rgba(255, 255, 255, 0.98);
            box-shadow: 0 22px 58px rgba(15, 23, 42, 0.18);
            backdrop-filter: blur(18px);
        }
.chat-skill-mention-menu.hidden {
            display: none;
        }
.chat-input-wrap textarea {
            display: block;
            min-height: 120px;
            resize: vertical;
            padding: 16px 136px 18px 16px;
            border-radius: inherit;
            background: transparent;
            color: #141826;
            caret-color: var(--brand);
            -webkit-text-fill-color: #141826;
            position: relative;
            z-index: 1;
        }
.chat-input-tools {
            position: absolute;
            left: 12px;
            right: 12px;
            bottom: 12px;
            display: flex;
            align-items: center;
            justify-content: space-between;
            z-index: 3;
            pointer-events: auto;
        }
.chat-input-action-group {
            display: inline-flex;
            align-items: center;
            gap: 6px;
        }
.chat-tool-btn,
        .send-btn,
        .chat-voice-btn {
            width: 42px;
            height: 42px;
            padding: 0;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 14px;
        }
.chat-tool-btn {
            border: 1px solid rgba(15, 23, 42, 0.06);
            background: #f8fafc;
            color: #475569;
            cursor: pointer;
            transition: background .18s ease, transform .18s ease, color .18s ease;
        }
@media (max-width: 920px){.chat-voice-btn.is-hold-to-talk {
                touch-action: none;
                -webkit-user-select: none;
                user-select: none;
                -webkit-touch-callout: none;
            }
.chat-voice-btn.is-hold-to-talk.is-hold-active {
                background: rgba(37, 99, 235, 0.14);
                color: #2563eb;
                box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.14);
                transform: scale(0.96);
            }
body[data-ui-theme="dark"] .chat-voice-btn.is-hold-to-talk.is-hold-active {
                background: rgba(96, 165, 250, 0.18) !important;
                color: #93c5fd !important;
                box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.16) !important;
            }}
.chat-voice-status {
            width: fit-content;
            max-width: calc(100% - 8px);
            min-height: 28px;
            margin: 8px 4px 0;
            padding: 5px 10px;
            display: inline-flex;
            align-items: center;
            gap: 8px;
            border-radius: 999px;
            background: rgba(37, 99, 235, 0.08);
            color: #475569;
            font-size: 12px;
            line-height: 1.45;
        }
body[data-ui-theme="dark"] .chat-voice-status {
            color: #cbd5e1;
            background: rgba(148, 163, 184, 0.12);
        }
body[data-ui-theme="dark"] .chat-voice-status.is-loading {
            color: #bfdbfe;
            background: rgba(59, 130, 246, 0.14);
        }
body[data-ui-theme="dark"] .chat-voice-status.is-success {
            color: #86efac;
            background: rgba(34, 197, 94, 0.12);
        }
body[data-ui-theme="dark"] .chat-voice-status.is-warning,
        body[data-ui-theme="dark"] .chat-voice-status.is-error {
            color: #fde68a;
            background: rgba(245, 158, 11, 0.14);
        }
.chat-tool-btn svg,
        .chat-voice-btn svg,
        .send-btn svg {
            width: 22px;
            height: 22px;
        }
.send-btn {
            position: relative;
            overflow: visible;
            transition: background .18s ease, color .18s ease, box-shadow .18s ease, transform .18s ease;
        }
.send-btn::before {
            content: attr(data-tooltip);
            position: absolute;
            right: 2px;
            bottom: calc(100% + 10px);
            padding: 6px 10px;
            border-radius: 10px;
            background: rgba(15, 23, 42, 0.96);
            color: #fff;
            font-size: 12px;
            font-weight: 600;
            line-height: 1;
            white-space: nowrap;
            opacity: 0;
            transform: translateY(4px);
            pointer-events: none;
            transition: opacity .16s ease, transform .16s ease;
            box-shadow: 0 12px 28px rgba(15, 23, 42, 0.22);
        }
.send-btn::after {
            content: '';
            position: absolute;
            right: 14px;
            bottom: calc(100% + 4px);
            width: 10px;
            height: 10px;
            background: rgba(15, 23, 42, 0.96);
            transform: rotate(45deg) translateY(4px);
            opacity: 0;
            pointer-events: none;
            transition: opacity .16s ease, transform .16s ease;
        }
.send-btn:not([data-tooltip])::before,
        .send-btn:not([data-tooltip])::after,
        .send-btn[data-tooltip=""]::before,
        .send-btn[data-tooltip=""]::after {
            display: none;
        }
@keyframes chat-send-spin {
            from {
                transform: rotate(0deg);
            }
            to {
                transform: rotate(360deg);
            }
        }
@keyframes chat-voice-pulse {
            0%, 100% {
                transform: scale(1);
            }
            50% {
                transform: scale(0.88);
            }
        }
.chat-attachment-bar {
            display: grid;
            gap: 7px;
            margin: 0;
            padding: 10px 12px 6px;
            width: 100%;
            min-width: 0;
            box-sizing: border-box;
            position: relative;
            z-index: 3;
            background: rgba(248, 250, 252, 0.82);
            border-bottom: 1px solid rgba(15, 23, 42, 0.06);
        }
.chat-quote-bar {
            display: grid;
            gap: 12px;
            margin-bottom: 12px;
            padding: 12px 14px;
            border-radius: 20px;
            border: 1px solid rgba(15, 23, 42, 0.08);
            background: linear-gradient(180deg, rgba(248, 250, 252, 0.98) 0%, rgba(255,255,255,0.98) 100%);
        }
body[data-mode="chat"] .composer {
            position: relative;
            z-index: 8;
            flex: 0 0 auto;
            width: min(804px, calc(100% - 88px));
            margin: auto auto 18px;
            padding: 10px 12px 10px;
            border-radius: 30px;
            border: 1px solid rgba(62, 92, 147, 0.16);
            box-shadow: 0 10px 28px rgba(52, 77, 118, 0.1);
            background: rgba(255, 255, 255, 0.98);
            -webkit-backdrop-filter: none;
            backdrop-filter: none;
        }
body[data-mode="chat"] .composer-top,
        body[data-mode="chat"] .composer-actions {
            display: none;
        }
body[data-mode="chat"] #chat-compose-field {
            display: block !important;
            margin: 0;
        }
body[data-mode="chat"] #chat-compose-field label {
            display: none;
        }
body[data-mode="chat"] .chat-input-wrap {
            border-radius: 24px;
            overflow: hidden;
            background: var(--panel-strong);
        }
body[data-mode="chat"] .chat-input-wrap textarea {
            min-height: 88px;
            border: none;
            border-radius: inherit;
            background: transparent;
            box-shadow: none;
            padding: 14px 136px 8px 18px;
            font-size: 15px;
            line-height: 1.7;
            color: #141826;
            caret-color: var(--brand);
            -webkit-text-fill-color: #141826;
        }
body[data-mode="chat"] .chat-input-hint {
            top: 14px;
            left: 18px;
            right: 136px;
            color: #8b95a7;
        }
body[data-mode="chat"] .chat-input-wrap textarea::placeholder {
            color: #b4bcc9;
            opacity: 1;
        }
body[data-mode="chat"] .chat-input-tools {
            left: 14px;
            right: 14px;
            bottom: 14px;
            gap: 0;
        }
body[data-mode="chat"] .chat-tool-btn {
            width: 40px;
            height: 40px;
            border-radius: 14px;
            border: 1px solid rgba(15, 23, 42, 0.06);
            background: #f8fafc;
            color: #64748b;
        }
body[data-mode="chat"] .send-btn {
            width: 44px;
            height: 44px;
            border-radius: 16px;
            background: linear-gradient(135deg, #2f6bff 0%, #2150d8 100%);
            box-shadow: 0 8px 18px rgba(47, 107, 255, 0.22);
        }
body[data-mode="chat"] .site-topbar {
            display: none;
        }
body[data-mode="chat"] .app,
        body[data-mode="image"] .app,
        body[data-mode="video"] .app {
            width: 100%;
            grid-template-columns: var(--chat-sidebar-width) var(--chat-sidebar-resizer-width) minmax(0, 1fr);
            gap: 0;
            padding: 0;
        }
body[data-mode="chat"] .rail {
            display: none;
        }
body[data-mode="chat"] .history {
            padding: 12px 8px 10px 10px;
            gap: 8px;
            border-radius: 0;
            background: #f8f8f8;
            border-right: 1px solid rgba(15, 23, 42, 0.06);
            border-color: rgba(15, 23, 42, 0.04);
            box-shadow: none;
            border-left: none;
            border-top: none;
            border-bottom: none;
        }
body[data-mode="chat"] .desktop-sidebar-resizer,
        body[data-mode="image"] .desktop-sidebar-resizer,
        body[data-mode="video"] .desktop-sidebar-resizer {
            display: flex;
            align-items: stretch;
            justify-content: center;
            position: relative;
            cursor: col-resize;
            user-select: none;
            touch-action: none;
            background: transparent;
        }
body[data-mode="chat"] .sidebar-shell {
            display: grid;
            gap: 8px;
            padding-bottom: 0;
        }
body[data-mode="chat"] .sidebar-brand {
            gap: 8px;
            padding: 2px 4px 8px;
            align-items: center;
        }
body[data-mode="chat"] .sidebar-brand-mark,
        body[data-mode="chat"] .sidebar-brand img {
            width: 28px;
            height: 28px;
            border-radius: 10px;
            flex: 0 0 22px;
        }
body[data-mode="chat"] .history-head,
        body[data-mode="chat"] .history-chat-summary {
            display: none;
        }
body[data-mode="chat"] .history-actions {
            display: none !important;
        }
body[data-mode="chat"] .history-search {
            display: none;
        }
body[data-mode="chat"] .history-search button,
        body[data-mode="chat"] #history-subtitle,
        body[data-mode="chat"] .pagination,
        body[data-mode="chat"] .task-list {
            display: none !important;
        }
.work-skill-bar {
            position: relative;
            display: none;
            align-items: center;
            gap: 10px;
            margin-top: 8px;
            padding-top: 8px;
            border-top: 1px solid rgba(15, 23, 42, 0.05);
            overflow: visible;
            z-index: 36;
        }
.chat-media-toolbar-host {
            display: none;
            margin-top: 10px;
            position: relative;
        }
@media (max-width: 920px){#chat-compose-field.is-media-mode .studio-reference-bar.is-compact-reference-picker {
                margin-bottom: 6px;
                padding: 0 10px;
            }
#chat-compose-field.is-media-mode .is-compact-reference-picker .studio-reference-list {
                gap: 8px;
                padding: 2px 1px;
            }
#chat-compose-field.is-media-mode .compact-reference-chip,
            #chat-compose-field.is-media-mode .studio-reference-add {
                width: 66px;
                min-width: 66px;
                max-width: 66px;
                height: 66px;
                min-height: 66px;
                flex-basis: 66px;
                border-radius: 12px;
            }
#chat-compose-field.is-media-mode .compact-reference-chip img {
                border-radius: 11px;
            }
#chat-compose-field.is-media-mode .compact-reference-chip .studio-reference-remove {
                top: 4px;
                right: 4px;
                width: 22px;
                height: 22px;
                font-size: 15px;
            }
#chat-compose-field.is-media-mode .studio-reference-add-icon {
                width: 25px;
                height: 25px;
            }
#chat-compose-field.is-media-mode .studio-reference-add-label {
                font-size: 11px;
            }
body.chat-landing[data-mode="chat"] #chat-compose-field.is-media-mode .chat-media-toolbar-host {
                margin-top: 10px;
            }}
body[data-mode="chat"] .conversation-list {
            display: grid !important;
            flex: 1 1 auto;
            max-height: none;
            gap: 2px;
            padding-right: 1px;
            align-content: start;
        }
body[data-mode="chat"] .sidebar-section-label {
            margin-top: 12px;
            padding-top: 14px;
            border-top: 1px solid rgba(15, 23, 42, 0.08);
        }
@media (max-width: 920px){body[data-mode="chat"] .conversation-more-btn {
                opacity: 1 !important;
                pointer-events: auto !important;
            }
.conversation-menu.conversation-menu-floating {
                z-index: 4600 !important;
            }}
body[data-mode="chat"] .conversation-menu {
            min-width: 144px;
            padding: 6px;
            border-radius: 14px;
            top: 50%;
            right: auto;
            left: calc(100% + 10px);
            transform: translateY(-50%);
        }
body[data-mode="chat"] .sidebar-section-label {
            padding: 6px 6px 2px;
            font-size: 11px;
            color: #a0a9b8;
            letter-spacing: .02em;
        }
body[data-mode="chat"] .workspace {
            min-height: 100vh;
            height: 100vh;
            max-height: 100vh;
            padding: 0 0 0 0;
        }
body[data-mode="chat"] .stage {
            flex: 1 1 auto;
            min-height: 0;
            padding-top: 0;
        }
#media-compose {
            margin-top: 6px;
            padding: 14px 14px 0;
            border-top: 1px solid rgba(15, 23, 42, 0.05);
        }
body[data-mode="chat"] #media-compose {
            margin-top: 8px;
            padding: 12px 4px 0;
            border-top: 1px solid rgba(15, 23, 42, 0.05);
            gap: 12px;
        }
body[data-mode="chat"] .field input,
        body[data-mode="chat"] .field select,
        body[data-mode="chat"] .field textarea {
            border-radius: 14px;
            border-color: rgba(15, 23, 42, 0.06);
            background: #fff;
        }
@media (min-width: 921px){.chat-media-grid.has-document {
                grid-template-columns: repeat(auto-fit, minmax(280px, 320px));
            }
.chat-media-grid.has-document .chat-media-actions {
                overflow-x: visible;
            }}
@media (max-width: 560px){.chat-media-actions.is-document-actions,
            .asset-result-actions.is-document-actions {
                grid-template-columns: minmax(0, 1fr);
            }
.chat-media-actions.is-document-actions .is-document-action,
            .asset-result-actions.is-document-actions .is-document-action {
                min-height: 38px;
                height: auto;
                padding: 7px 10px;
            }
.chat-media-actions.is-document-actions .asset-action-label,
            .asset-result-actions.is-document-actions .asset-action-label {
                max-width: 100%;
                white-space: normal;
                overflow-wrap: anywhere;
                text-align: center;
                line-height: 1.25;
            }}
@media (max-width: 720px){.chat-image-preview-badge {
                right: 8px;
                bottom: 8px;
                width: 32px;
                height: 32px;
            }
.chat-image-lightbox {
                padding: 0;
            }
.chat-image-lightbox-dialog {
                width: 100vw;
                height: 100vh;
                height: 100dvh;
                min-height: 100vh;
                min-height: 100dvh;
                border: 0;
                border-radius: 0;
            }
.chat-image-lightbox-header {
                min-height: calc(56px + env(safe-area-inset-top));
                padding: calc(8px + env(safe-area-inset-top)) max(8px, env(safe-area-inset-right)) 8px max(12px, env(safe-area-inset-left));
            }
.chat-image-lightbox-heading {
                gap: 7px;
            }
.chat-image-lightbox-heading strong {
                font-size: 14px;
            }
.chat-image-lightbox-heading span {
                max-width: 28vw;
                font-size: 11px;
            }
.chat-image-lightbox-actions {
                gap: 4px;
            }
.chat-image-lightbox-actions button,
            .chat-image-lightbox-actions a {
                width: 36px;
                min-width: 36px;
                height: 36px;
                min-height: 36px;
            }
.chat-image-lightbox-canvas {
                padding: 10px max(10px, env(safe-area-inset-right)) max(10px, env(safe-area-inset-bottom)) max(10px, env(safe-area-inset-left));
            }
.chat-image-lightbox-canvas img {
                max-width: calc(100vw - 20px);
                max-height: calc(100vh - 82px - env(safe-area-inset-top));
                max-height: calc(100dvh - 82px - env(safe-area-inset-top));
            }}
body[data-ui-theme="dark"] .chat-bubble.user .chat-attach-card {
            border-color: rgba(111, 165, 255, 0.3);
            background: #17243a;
            box-shadow: 0 9px 24px rgba(0, 0, 0, 0.2);
        }
body[data-ui-theme="dark"] .chat-bubble.user .chat-attach-thumb.is-file {
            background: linear-gradient(145deg, #1c2b43 0%, #142035 100%);
        }
body[data-ui-theme="dark"] .chat-bubble.user .chat-attach-thumb.is-file .chat-file-card {
            border: 0 !important;
            background: transparent !important;
        }
body[data-ui-theme="dark"] .chat-bubble.user .chat-attach-thumb.is-file .chat-file-icon {
            background: linear-gradient(145deg, #4a91ff 0%, #2466d7 100%);
            color: #fff;
        }
body[data-ui-theme="dark"] .chat-bubble.user .chat-attach-thumb.is-file .chat-file-name {
            color: #f1f6ff !important;
        }
body[data-ui-theme="dark"] .chat-bubble.user .chat-attach-thumb.is-file .chat-file-desc {
            color: #b4c1d4 !important;
        }
body[data-ui-theme="dark"] .chat-bubble.user .chat-attach-body {
            border-top-color: rgba(111, 165, 255, 0.2);
            background: #1a2941;
        }
body[data-ui-theme="dark"] .chat-bubble.user .chat-attach-body .chat-media-note {
            color: #b9d4ff !important;
        }
body[data-ui-theme="dark"] .chat-bubble.user .chat-attach-body .chat-media-note::before {
            background: rgba(100, 157, 255, 0.18);
            color: #c9deff;
        }
@media (max-width: 560px){.chat-bubble.user .chat-attach-grid {
                grid-template-columns: minmax(0, 1fr);
            }
.chat-bubble.user .chat-attach-card {
                width: 100%;
                max-width: 100%;
            }}
.mobile-chat-topbar {
            display: none;
        }
.mobile-nav-trigger {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border: none;
            background: transparent;
            padding: 0;
            cursor: pointer;
        }
.mobile-nav-pill {
            display: inline-flex;
            align-items: center;
            gap: 12px;
            min-height: 38px;
            padding: 0 12px 0 11px;
            border-radius: 999px;
            border: 1px solid rgba(15, 23, 42, 0.08);
            background: rgba(255, 255, 255, 0.96);
            box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08);
        }
.mobile-nav-bars {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 18px;
            height: 18px;
            color: #121826;
            flex: 0 0 18px;
        }
.mobile-nav-title {
            color: #121826;
            font-size: 14px;
            font-weight: 700;
            line-height: 1;
        }
.file-input {
            display: none;
        }
.file-drop-overlay {
            position: fixed;
            inset: 14px;
            z-index: 300;
            display: grid;
            place-items: center;
            border: 2px dashed rgba(37, 99, 235, 0.5);
            border-radius: 28px;
            background: rgba(239, 246, 255, 0.9);
            backdrop-filter: blur(12px);
            pointer-events: none;
            opacity: 0;
            visibility: hidden;
            transform: scale(0.985);
            transition: opacity .16s ease, visibility .16s ease, transform .16s ease;
        }
.file-drop-card {
            width: min(420px, calc(100vw - 56px));
            padding: 28px 24px;
            border: 1px solid rgba(37, 99, 235, 0.16);
            border-radius: 24px;
            background: rgba(255, 255, 255, 0.96);
            box-shadow: 0 24px 60px rgba(37, 99, 235, 0.18);
            text-align: center;
        }
.file-drop-icon {
            width: 54px;
            height: 54px;
            margin: 0 auto 14px;
            border-radius: 18px;
            display: grid;
            place-items: center;
            background: linear-gradient(135deg, #2f6bff 0%, #2150d8 100%);
            color: #fff;
            box-shadow: 0 14px 28px rgba(37, 99, 235, 0.22);
        }
.file-drop-icon svg {
            width: 26px;
            height: 26px;
        }
.file-drop-card strong {
            display: block;
            color: #152238;
            font-size: 18px;
            line-height: 1.4;
        }
.file-drop-card span {
            display: block;
            margin-top: 6px;
            color: #718096;
            font-size: 13px;
            line-height: 1.6;
        }
body[data-ui-theme="dark"] .file-drop-overlay {
            background: rgba(9, 16, 30, 0.88);
        }
body[data-ui-theme="dark"] .file-drop-card {
            border-color: rgba(96, 165, 250, 0.24);
            background: rgba(20, 29, 46, 0.96);
        }
body[data-ui-theme="dark"] .file-drop-card strong {
            color: #eef4ff;
        }
body[data-ui-theme="dark"] .file-drop-card span {
            color: #9aa9bf;
        }
.image-studio-popover-backdrop {
            display: none;
        }
.mobile-sheet,
        .backdrop {
            display: none;
        }
.mobile-account-sheet {
            position: fixed;
            top: 14px;
            right: 14px;
            width: min(360px, calc(100vw - 28px));
            padding: 18px;
            z-index: 60;
            background: rgba(255, 255, 255, 0.98);
            backdrop-filter: blur(18px);
            border: 1px solid var(--line);
            border-radius: 24px;
            box-shadow: var(--shadow);
            transform: translateX(calc(100% + 24px));
            transition: transform .24s ease;
            display: block;
        }
.backdrop {
            position: fixed;
            inset: 0;
            z-index: 50;
            background: rgba(15, 23, 42, 0.16);
            backdrop-filter: blur(4px);
        }
@media (max-width: 1420px){.app {
                grid-template-columns: 104px 296px minmax(0, 1fr);
            }
body[data-mode="image"] .app,
            body[data-mode="video"] .app {
                grid-template-columns: 104px 296px minmax(0, 1fr);
            }
body.show-record-history[data-mode="image"] .app,
            body.show-record-history[data-mode="video"] .app {
                grid-template-columns: 104px 296px minmax(0, 1fr);
            }
body[data-mode="image"] .workspace-records .task-list,
            body[data-mode="video"] .workspace-records .task-list {
                grid-template-columns: repeat(4, minmax(0, 1fr));
            }
.field-grid {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }}
@media (max-width: 1360px){.app {
                width: min(100vw - 18px, 100%);
                grid-template-columns: 92px 276px minmax(0, 1fr);
                gap: 12px;
                padding: 9px 0;
            }
body[data-mode="image"] .app,
            body[data-mode="video"] .app,
            body.show-record-history[data-mode="image"] .app,
            body.show-record-history[data-mode="video"] .app {
                grid-template-columns: 92px 276px minmax(0, 1fr);
            }
body[data-tool-mode="image"] .app,
            body[data-tool-mode="video"] .app {
                grid-template-columns: var(--chat-sidebar-width) var(--chat-sidebar-resizer-width) minmax(0, 1fr);
            }
.rail {
                top: 9px;
                min-height: calc(100vh - 18px);
                padding: 12px 8px;
            }
.history {
                top: 9px;
                min-height: calc(100vh - 18px);
                max-height: calc(100vh - 18px);
                padding: 14px;
                gap: 12px;
            }
.workspace,
            body[data-mode="chat"] .workspace {
                min-height: calc(100vh - 18px);
                height: calc(100vh - 18px);
                max-height: calc(100vh - 18px);
            }
.rail-icon {
                padding: 0 6px;
                gap: 6px;
                font-size: 12px;
            }
.composer,
            .result-card {
                border-radius: 22px;
            }}
@media (max-width: 1160px){.hero {
                flex-direction: column;
                align-items: stretch;
            }
.hero-user {
                min-width: 0;
            }
.asset-grid {
                grid-template-columns: 1fr;
            }}
@media (max-width: 920px){html,
            body {
                width: 100%;
                max-width: 100vw;
                overflow-x: hidden;
            }
.site-topbar {
                display: none;
            }
.app {
                width: 100%;
                max-width: 100vw;
                grid-template-columns: 1fr;
                gap: 10px;
                padding: 0;
                overflow-x: hidden;
            }
body[data-mode="chat"] .app {
                width: 100%;
                grid-template-columns: 1fr;
                gap: 0;
                padding: 0;
            }
body[data-tool-mode="image"] .app,
            body[data-tool-mode="video"] .app {
                width: 100%;
                grid-template-columns: 1fr;
                gap: 10px;
                padding: 0;
            }
.rail {
                display: none !important;
            }
.workspace {
                order: 1;
                min-height: 100vh;
                grid-template-rows: auto minmax(0, 1fr) auto;
                width: 100%;
                max-width: 100vw;
                padding: 0;
                gap: 0;
                overflow-x: hidden;
            }
body[data-tool-mode="image"] .workspace,
            body[data-tool-mode="video"] .workspace {
                display: grid;
            }
body[data-mode="chat"] .workspace {
                width: 100%;
                min-width: 0;
                height: 100vh;
                max-height: 100vh;
                padding: 0;
            }
body[data-mode="chat"] .result-content,
            body[data-mode="chat"] .chat-area,
            body[data-mode="chat"] #chat-compose-field,
            body[data-mode="chat"] .chat-thread-card,
            body[data-mode="chat"] .chat-thread {
                width: 100% !important;
                max-width: 100% !important;
                min-width: 0 !important;
                margin-left: 0 !important;
                margin-right: 0 !important;
                box-sizing: border-box;
            }
body[data-mode="chat"] .chat-area {
                padding-right: 0;
            }
body[data-mode="chat"] .chat-bubble {
                max-width: min(100%, 100%) !important;
                min-width: 0;
                width: fit-content;
            }
body[data-mode="chat"] .chat-followup-suggestions {
                width: 100%;
                max-width: 100%;
                margin-top: -6px;
            }
body[data-mode="chat"] .chat-followup-list {
                gap: 7px;
            }
body[data-mode="chat"] .chat-followup-topic {
                width: 100%;
                min-height: 42px;
                padding: 10px 11px 10px 12px;
                border-radius: 8px;
                font-size: 13px;
            }
body[data-mode="chat"] .chat-bubble.user {
                margin-left: auto;
            }
body[data-mode="chat"] .bubble-actions,
            body[data-mode="chat"] .chat-message-media,
            body[data-mode="chat"] .chat-message-attachments {
                width: 100%;
                max-width: 100%;
                min-width: 0;
            }
body[data-mode="chat"] .chat-bubble.user > .bubble-actions {
                width: max-content !important;
                max-width: none !important;
                min-width: 0 !important;
                margin-left: auto !important;
                gap: 8px !important;
            }
.workspace-records {
                display: none !important;
            }
body.workspace-creations-open[data-tool-mode="image"] .workspace-records,
            body.workspace-creations-open[data-tool-mode="video"] .workspace-records {
                display: grid !important;
                position: fixed;
                inset: 0;
                z-index: 70;
                grid-template-rows: auto minmax(0, 1fr) auto;
                width: 100vw;
                max-width: 100vw;
                height: 100vh;
                padding: calc(env(safe-area-inset-top, 0px) + 10px) 12px calc(env(safe-area-inset-bottom, 0px) + 12px);
                box-sizing: border-box;
                gap: 12px;
                margin: 0;
                border-radius: 0;
                background: rgba(248, 250, 252, 0.98);
                overflow: hidden;
            }
body.workspace-creations-open[data-tool-mode="image"] .workspace-disclaimer,
            body.workspace-creations-open[data-tool-mode="video"] .workspace-disclaimer {
                display: none;
            }
body.workspace-creations-open[data-tool-mode="image"] .workspace-records .section-head,
            body.workspace-creations-open[data-tool-mode="video"] .workspace-records .section-head {
                display: flex;
                align-items: center;
                justify-content: flex-start;
                gap: 10px;
                padding: 2px 2px 0;
                flex: 0 0 auto;
            }
body.workspace-creations-open[data-tool-mode="image"] .workspace-records .section-head > div,
            body.workspace-creations-open[data-tool-mode="video"] .workspace-records .section-head > div {
                min-width: 0;
            }
body.workspace-creations-open[data-tool-mode="image"] #mobile-workspace-creations-back,
            body.workspace-creations-open[data-tool-mode="video"] #mobile-workspace-creations-back {
                display: inline-flex;
                min-height: 34px;
                padding: 0 12px;
                border-radius: 999px;
                flex: 0 0 auto;
            }
body.workspace-creations-open[data-tool-mode="image"] .workspace-records .task-list,
            body.workspace-creations-open[data-tool-mode="video"] .workspace-records .task-list {
                display: grid !important;
                grid-template-columns: repeat(2, minmax(0, 1fr));
                gap: 10px;
            }
body.workspace-creations-open[data-tool-mode="image"] .workspace-records-slot,
            body.workspace-creations-open[data-tool-mode="video"] .workspace-records-slot {
                min-height: 0;
                overflow-y: auto;
                overflow-x: hidden;
                padding: 0 0 6px;
                align-content: start;
            }
body.workspace-creations-open[data-tool-mode="image"] .workspace-records .task-date-group,
            body.workspace-creations-open[data-tool-mode="video"] .workspace-records .task-date-group {
                gap: 10px;
            }
body.workspace-creations-open[data-tool-mode="image"] .workspace-records .task-date-group-list,
            body.workspace-creations-open[data-tool-mode="video"] .workspace-records .task-date-group-list {
                display: grid;
                grid-template-columns: repeat(2, minmax(0, 1fr));
                gap: 10px;
            }
body.workspace-creations-open[data-tool-mode="image"] .workspace-records .task-item,
            body.workspace-creations-open[data-tool-mode="video"] .workspace-records .task-item {
                grid-template-columns: 1fr;
                gap: 8px;
                min-height: 196px;
                padding: 10px;
            }
body.workspace-creations-open[data-tool-mode="image"] .workspace-records .task-thumb,
            body.workspace-creations-open[data-tool-mode="video"] .workspace-records .task-thumb {
                height: 106px;
                min-height: 106px;
            }
body.workspace-creations-open[data-tool-mode="image"] .workspace-records .task-thumb img,
            body.workspace-creations-open[data-tool-mode="image"] .workspace-records .task-thumb video,
            body.workspace-creations-open[data-tool-mode="video"] .workspace-records .task-thumb img,
            body.workspace-creations-open[data-tool-mode="video"] .workspace-records .task-thumb video {
                width: 100%;
                height: 100%;
                object-fit: contain;
                background: #f3f6fb;
            }
body.workspace-creations-open[data-tool-mode="image"] .workspace-records .task-main,
            body.workspace-creations-open[data-tool-mode="video"] .workspace-records .task-main {
                display: grid;
                grid-template-rows: minmax(2.9em, auto) auto;
                align-content: start;
                gap: 6px;
            }
body.workspace-creations-open[data-tool-mode="image"] .workspace-records .task-headline,
            body.workspace-creations-open[data-tool-mode="video"] .workspace-records .task-headline {
                gap: 6px;
                margin-bottom: 0;
            }
body.workspace-creations-open[data-tool-mode="image"] .workspace-records .task-title,
            body.workspace-creations-open[data-tool-mode="video"] .workspace-records .task-title {
                display: block;
                color: #182235;
                line-height: 1.45;
                min-height: 2.9em;
                white-space: normal;
                display: -webkit-box;
                -webkit-line-clamp: 2;
                -webkit-box-orient: vertical;
                overflow: hidden;
                text-overflow: ellipsis;
                font-size: 13px;
            }
body.workspace-creations-open[data-tool-mode="image"] .workspace-records .task-main .task-meta,
            body.workspace-creations-open[data-tool-mode="video"] .workspace-records .task-main .task-meta {
                display: none;
            }
body.workspace-creations-open[data-tool-mode="image"] .workspace-records .task-status-line,
            body.workspace-creations-open[data-tool-mode="video"] .workspace-records .task-status-line {
                margin-top: 2px;
            }
body.workspace-creations-open[data-tool-mode="image"] .workspace-records .pagination,
            body.workspace-creations-open[data-tool-mode="video"] .workspace-records .pagination {
                display: grid !important;
                grid-template-columns: 1fr;
                gap: 10px;
                margin-top: 0;
                padding: 10px 2px 0;
                align-items: stretch;
                justify-items: stretch;
                flex: 0 0 auto;
                border-top: 1px solid rgba(15, 23, 42, 0.08);
                background: rgba(248, 250, 252, 0.98);
            }
body.workspace-creations-open[data-tool-mode="image"] .workspace-records #task-pagination-text,
            body.workspace-creations-open[data-tool-mode="video"] .workspace-records #task-pagination-text {
                text-align: center;
                line-height: 1.6;
                font-size: 11px;
                white-space: normal;
                word-break: keep-all;
            }
body.workspace-creations-open[data-tool-mode="image"] .workspace-records .pagination-actions,
            body.workspace-creations-open[data-tool-mode="video"] .workspace-records .pagination-actions {
                display: grid;
                grid-template-columns: repeat(2, minmax(0, 1fr));
                gap: 8px;
                width: 100%;
            }
body.workspace-creations-open[data-tool-mode="image"] .workspace-records .pagination-actions .btn,
            body.workspace-creations-open[data-tool-mode="video"] .workspace-records .pagination-actions .btn {
                width: 100%;
                min-width: 0;
                justify-content: center;
            }
.mobile-chat-topbar {
                display: grid;
                grid-template-columns: auto 1fr auto;
                align-items: center;
                gap: 10px;
                width: 100vw;
                max-width: 100vw;
                box-sizing: border-box;
                padding: 10px 12px 16px;
                position: sticky;
                top: 0;
                z-index: 20;
                background: linear-gradient(180deg, rgba(251,252,254,0.98) 0%, rgba(251,252,254,0.92) 100%);
                backdrop-filter: blur(12px);
                border-bottom: 1px solid rgba(15, 23, 42, 0.06);
                overflow: hidden;
            }
body[data-ui-theme="dark"] .mobile-chat-topbar {
                background: linear-gradient(180deg, rgba(8, 15, 28, 0.98) 0%, rgba(8, 15, 28, 0.84) 100%);
                border-bottom: 1px solid rgba(148, 163, 184, 0.12);
            }
.mobile-chat-topbar .mobile-topbar-spacer {
                display: none;
            }
.mobile-chat-bar {
                display: flex;
                align-items: center;
                justify-content: flex-start;
                min-width: 0;
                width: 100%;
                overflow: hidden;
            }
.mobile-chat-brand {
                display: none;
            }
.mobile-chat-brand strong {
                display: block;
                font-size: 14px;
                line-height: 1.2;
                color: #121826;
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
            }
.mobile-chat-brand span {
                display: none;
                margin-top: 2px;
                color: #9aa3b2;
                font-size: 10px;
                line-height: 1.2;
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
            }
.mobile-chat-actions {
                display: inline-flex;
                align-items: center;
                gap: 8px;
                flex: 0 0 auto;
                justify-self: end;
                position: fixed;
                top: 10px;
                right: 12px;
                z-index: 32;
            }
.mobile-chat-link,
            .mobile-chat-btn {
                min-height: 34px;
                padding: 0 14px;
                border-radius: 999px;
                font-size: 12px;
                font-weight: 700;
            }
.mobile-chat-link {
                color: #121826;
                background: rgba(255, 255, 255, 0.94);
                border: 1px solid rgba(15, 23, 42, 0.08);
            }
.mobile-chat-link[data-safety-center-link] {
                min-height: 30px;
                padding: 0;
                border: 0;
                border-radius: 0;
                background: transparent;
                color: #71809a;
                font-size: 13px;
                font-weight: 600;
            }
.mobile-chat-link.active {
                color: #1d4ed8;
                background: rgba(219, 234, 254, 0.96);
                border-color: rgba(59, 130, 246, 0.22);
            }
.mobile-chat-btn {
                border: none;
                color: #fff;
                background: linear-gradient(135deg, #1c2430 0%, #111827 100%);
            }
.mobile-nav-trigger,
            .mobile-chat-btn {
                flex: 0 0 auto;
            }
.hero {
                padding: 16px;
            }
.hero-brand-text strong {
                font-size: 14px;
            }
.hero-brand-text span,
            .hero-desc {
                display: none;
            }
.hero-title {
                margin-top: 10px;
                font-size: 16px;
            }
.history {
                position: fixed;
                left: 0;
                top: 0;
                bottom: 0;
                width: min(84vw, 340px);
                min-height: 100vh;
                max-height: 100vh;
                padding: 18px 14px 20px;
                border-radius: 0 28px 28px 0;
                z-index: 80;
                background: #f5f6f8;
                transform: translateX(calc(-100% - 12px));
                transition: transform .26s ease;
                overflow: hidden;
                box-shadow: 0 24px 54px rgba(15, 23, 42, 0.16);
            }
.hero-user {
                display: none;
            }
body.mobile-nav-open .history {
                transform: translateX(0);
            }
body.mobile-nav-open .backdrop {
                display: block;
            }
.history-switch {
                align-self: flex-start;
            }
.history-head {
                margin-bottom: 4px;
                align-items: flex-start;
            }
.history-title {
                font-size: 15px;
            }
.history-subtitle,
            #history-subtitle {
                display: none;
            }
.history-actions {
                display: grid !important;
                gap: 10px;
                margin-bottom: 8px;
            }
.history-actions .btn {
                width: 100%;
                justify-content: flex-start;
                border-radius: 20px;
                padding: 14px 16px;
                background: #fff;
            }
.mobile-history-inline {
                display: flex;
                align-items: center;
                justify-content: flex-end;
                gap: 8px;
                flex: 0 0 auto;
                max-width: 52%;
                min-width: 0;
            }
.mobile-history-inline-name {
                display: inline-flex;
                align-items: center;
                gap: 4px;
                font-size: 10px;
                line-height: 1.2;
                color: #8a94a6;
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
                max-width: 100%;
                min-width: 0;
            }
.mobile-history-inline-label {
                color: #a2acbb;
                flex: 0 0 auto;
            }
.mobile-history-inline-value {
                overflow: hidden;
                text-overflow: ellipsis;
            }
.mobile-history-inline .btn {
                min-height: 0;
                padding: 0;
                border: none;
                background: transparent;
                box-shadow: none;
                border-radius: 999px;
                font-size: 10px;
                font-weight: 600;
                line-height: 1.2;
                color: #5f6f86;
            }
.mobile-history-inline .btn:active,
            .mobile-history-inline .btn:hover {
                color: #1f4fd6;
                background: transparent;
            }
.mobile-history-account {
                display: none;
            }
body.mobile-record-history #new-conversation-btn,
            body.mobile-record-history .conversation-list {
                display: none !important;
            }
body.mobile-record-history .task-list,
            body.mobile-record-history .pagination {
                display: grid !important;
            }
body.mobile-record-history .pagination {
                display: flex !important;
            }
body.mobile-record-history .task-list {
                grid-template-columns: repeat(2, minmax(0, 1fr));
                gap: 10px;
            }
body.mobile-record-history.mobile-creations-history .task-list {
                grid-template-columns: 1fr;
                gap: 16px;
            }
body.mobile-record-history.mobile-creations-history .task-date-group {
                gap: 10px;
            }
body.mobile-record-history.mobile-creations-history .task-date-group-list {
                display: grid;
                grid-template-columns: repeat(2, minmax(0, 1fr));
                gap: 10px;
            }
body.mobile-record-history .task-item {
                grid-template-columns: 1fr;
                gap: 10px;
                min-height: 210px;
            }
body.mobile-record-history .task-thumb {
                height: 124px;
                min-height: 124px;
            }
body.mobile-record-history .task-thumb img,
            body.mobile-record-history .task-thumb video {
                width: 100%;
                height: 100%;
                object-fit: contain;
                background: #f3f6fb;
            }
body.mobile-record-history .task-title {
                display: block;
                line-height: 1.45;
                height: 1.45em;
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
            }
.conversation-list,
            .task-list {
                max-height: none;
                overflow: visible;
                padding-right: 0;
            }
.conversation-list {
                gap: 10px;
            }
.pagination {
                margin-top: 0;
            }
.mobile-account-sheet {
                top: 10px;
                left: 10px;
                right: 10px;
                padding: 16px;
                transform: translateY(calc(-100% - 16px));
                transition: transform .24s ease;
            }
body.mobile-account-open .mobile-account-sheet {
                transform: translateY(0);
            }
.panel-toggle {
                display: inline-flex;
                align-items: center;
                justify-content: center;
                border: none;
                background: transparent;
                color: #788295;
                font-size: 12px;
                font-weight: 700;
                cursor: pointer;
                padding: 0;
            }
.composer {
                padding: 14px;
            }
.composer-top {
                flex-direction: column;
                align-items: stretch;
            }
.toolbar-group {
                width: 100%;
                justify-content: space-between;
                gap: 8px;
            }
.field-grid {
                grid-template-columns: 1fr 1fr;
            }
.mode-switch {
                display: none;
            }
.composer-actions {
                justify-content: space-between;
            }
.status-text {
                width: 100%;
            }
.toast-stack {
                right: 12px;
                left: 12px;
                bottom: 14px;
            }
.toast {
                min-width: 0;
                max-width: none;
            }
.result-card {
                padding: 0;
                border-radius: 0;
                border: none;
                background: transparent;
                box-shadow: none;
            }
body[data-mode="chat"] .result-card {
                min-height: calc(100vh - 142px);
            }
body[data-mode="chat"] .section-head {
                display: none;
            }
body[data-mode="chat"] .result-content {
                height: calc(100vh - 174px);
                max-height: calc(100vh - 174px);
                padding: 16px 12px 0;
                scroll-padding-top: 18px;
            }
body[data-mode="chat"] .chat-area,
            body[data-mode="chat"] .chat-thread-card,
            body[data-mode="chat"] .chat-thread {
                padding-top: 0;
                box-sizing: border-box;
            }
body[data-mode="chat"] .chat-area:not(.hidden) {
                padding-top: calc(env(safe-area-inset-top, 0px) + 56px);
                scroll-padding-top: calc(env(safe-area-inset-top, 0px) + 72px);
            }
body.mobile-record-history[data-mode="chat"] .section-head {
                display: flex;
            }
.chat-bubble {
                max-width: 100%;
                font-size: 16px;
                line-height: 1.7;
            }
.chat-bubble .chat-markdown h1,
            .chat-bubble .chat-markdown h2,
            .chat-bubble .chat-markdown h3,
            .chat-bubble .chat-markdown h4,
            .chat-bubble .chat-markdown h5,
            .chat-bubble .chat-markdown h6 {
                margin: 18px 0 10px;
                line-height: 1.4;
                font-weight: 700;
                letter-spacing: -0.01em;
            }
.chat-bubble .chat-markdown > :is(h1, h2, h3, h4, h5, h6):first-child {
                margin-top: 0;
            }
.chat-bubble .chat-markdown h1 {
                font-size: 24px;
            }
.chat-bubble .chat-markdown h2 {
                font-size: 22px;
            }
.chat-bubble .chat-markdown h3 {
                font-size: 20px;
            }
.chat-bubble .chat-markdown h4 {
                font-size: 18px;
            }
.chat-bubble .chat-markdown h5 {
                font-size: 17px;
            }
.chat-bubble .chat-markdown h6 {
                font-size: 16px;
            }
.chat-bubble .chat-markdown p,
            .chat-bubble .chat-markdown ul,
            .chat-bubble .chat-markdown ol {
                margin-bottom: 14px;
            }
.chat-bubble .chat-markdown ul,
            .chat-bubble .chat-markdown ol {
                padding-left: 24px;
            }
.chat-bubble .chat-markdown li + li {
                margin-top: 7px;
            }
.chat-bubble .chat-markdown code {
                padding: 2px 5px;
                font-size: 14px;
                line-height: 1.55;
            }
.chat-bubble .chat-markdown table {
                font-size: 14px;
                line-height: 1.55;
            }
.chat-bubble .chat-markdown th,
            .chat-bubble .chat-markdown td {
                padding: 9px 10px;
            }
.chat-empty {
                width: 100%;
                gap: 16px;
            }
body[data-mode="chat"] .chat-empty {
                min-height: auto;
                align-content: start;
                padding-top: 20px;
            }
.chat-empty-title {
                font-size: 18px;
            }
.chat-empty-desc {
                font-size: 13px;
            }
.chat-empty-actions {
                width: 100%;
            }
.chat-empty-grid {
                grid-template-columns: repeat(2, minmax(0, 1fr));
                justify-content: stretch;
                gap: 10px;
            }
.office-task-grid {
                width: 100%;
                grid-template-columns: repeat(2, minmax(0, 1fr));
                gap: 10px;
            }
.office-task-card {
                gap: 10px;
                padding: 13px 12px 12px;
                border-radius: 18px;
            }
.office-task-card-head {
                gap: 8px;
            }
.office-task-card-format {
                min-width: 46px;
                min-height: 24px;
                padding: 0 9px;
                font-size: 11px;
            }
.office-task-card-arrow {
                font-size: 15px;
            }
.office-task-card-copy {
                gap: 5px;
            }
.office-task-card-title {
                font-size: 14px;
                line-height: 1.35;
            }
.office-task-card-desc {
                font-size: 12px;
                line-height: 1.5;
                display: -webkit-box;
                -webkit-line-clamp: 2;
                -webkit-box-orient: vertical;
                overflow: hidden;
            }
.office-task-card-foot {
                font-size: 11px;
            }
body[data-mode="chat"] .office-task-grid .office-task-card:nth-child(n+5) {
                display: none;
            }
.chat-empty-chip {
                width: 100%;
                min-width: 0;
                min-height: 42px;
                padding: 10px 14px;
                border-radius: 16px;
            }
.chat-input-wrap textarea {
                min-height: 92px;
                border-radius: 24px;
                padding: 14px 112px 12px 16px;
                font-size: 14px;
            }
.chat-input-hint {
                top: 14px;
                left: 16px;
                right: 92px;
                font-size: 14px;
            }
.chat-quick-actions,
            .composer-capability-bar {
                display: none !important;
            }
body[data-mode="chat"][data-chat-entry-mode="work"] .work-skill-bar {
                display: flex !important;
                margin-top: 8px;
                padding: 0 4px;
                border-top: none;
            }
.work-skill-menu {
                left: 4px;
                min-width: 152px;
            }
.mobile-chat-toolbar {
                position: relative;
                display: inline-flex;
                align-items: center;
                gap: 8px;
                margin-top: 8px;
                padding: 0 4px;
            }
.mobile-chat-toolbar-btn {
                min-height: 34px;
                padding: 0 14px;
                border-radius: 999px;
                background: rgba(255, 255, 255, 0.92);
                border: 1px solid rgba(15, 23, 42, 0.06);
                box-shadow: 0 4px 10px rgba(15, 23, 42, 0.04);
            }
.manual-model-list {
                grid-template-columns: 1fr;
            }
.auth-dialog {
                width: min(680px, calc(100vw - 20px));
                padding: 22px;
            }
.auth-layout {
                grid-template-columns: 1fr;
                gap: 18px;
            }
.auth-dialog-head h3 {
                font-size: 20px;
            }
.auth-aside {
                padding: 0;
                border-left: none;
            }
.auth-preview-card {
                min-height: 0;
            }
.send-btn {
                width: 38px;
                height: 38px;
            }
#mobile-history-sheet,
            #mobile-composer-sheet {
                display: none !important;
            }
#mobile-history-shortcut,
            #mobile-composer-shortcut,
            #mobile-account-open,
            #mobile-history-open,
            #mobile-composer-open {
                display: none !important;
            }
body[data-mode="chat"] .composer {
                width: 100%;
                margin: auto auto 0;
                padding: 8px 8px 10px;
                border-radius: 0;
            }}
@media (max-width: 560px){.hero {
                padding: 16px;
            }
.hero-brand-text strong {
                font-size: 14px;
            }
.hero-title {
                font-size: 22px;
            }
.chat-empty-title {
                font-size: 24px;
            }
body[data-mode="chat"] .chat-empty {
                gap: 14px;
                padding-top: 12px;
            }
body[data-mode="chat"] .chat-empty-copy {
                gap: 8px;
                margin-bottom: 16px;
            }
body[data-mode="chat"] .chat-empty-desc {
                max-width: 300px;
                font-size: 12px;
            }
body[data-mode="chat"] .chat-empty-grid {
                width: min(320px, 100%);
                gap: 8px;
            }
body[data-mode="chat"] .chat-empty-chip {
                min-height: 36px;
                padding: 9px 11px;
                border-radius: 12px;
                font-size: 11px;
            }
.chat-empty-suggestions {
                grid-template-columns: 1fr 1fr;
            }
.result-card,
            .composer {
                padding: 14px;
            }
.workspace-disclaimer {
                padding: 0 6px 16px;
                font-size: 11px;
                line-height: 1.45;
            }
.field-grid {
                grid-template-columns: 1fr;
            }
.task-list {
                grid-template-columns: 1fr;
            }
.task-item {
                grid-template-columns: 1fr;
            }
.task-thumb {
                min-height: 156px;
            }}
.workspace-chat-header {
            position: sticky;
            top: 0;
            z-index: 18;
            display: grid;
            grid-template-columns: 52px minmax(0, 1fr) auto;
            align-items: center;
            gap: 12px;
            min-height: 86px;
            padding: 0;
            background: linear-gradient(180deg, rgba(255,255,255,0.98) 0%, rgba(255,255,255,0.92) 82%, rgba(255,255,255,0) 100%);
            backdrop-filter: blur(14px);
        }
body[data-ui-theme="dark"] .workspace-chat-header {
            background: linear-gradient(180deg, rgba(8, 15, 28, 0.96) 0%, rgba(8, 15, 28, 0.84) 82%, rgba(8, 15, 28, 0) 100%);
        }
.image-create-studio {
            display: none;
            padding: 18px 0 8px;
        }
.workspace-chat-header-left,
        .workspace-chat-header-center,
        .workspace-chat-header-right {
            display: flex;
            align-items: center;
        }
.chat-detail-back {
            min-height: 36px;
            padding: 0 11px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 5px;
            border: 0;
            border-radius: 9px;
            background: transparent;
            color: #53627c;
            font-size: 13px;
            font-weight: 500;
            line-height: 1;
            cursor: pointer;
            transition: background-color .18s ease, color .18s ease;
        }
.chat-detail-back-mobile {
            display: none;
        }
.desktop-action-icon {
            width: 36px;
            height: 36px;
            border: 1px solid rgba(15, 23, 42, 0.08);
            border-radius: 12px;
            background: #fff;
            color: #111827;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            box-shadow: 0 8px 24px rgba(15, 23, 42, 0.05);
            transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease, box-shadow 0.18s ease;
        }
.workspace-chat-header-center {
            flex-direction: column;
            justify-content: center;
            gap: 3px;
            min-width: 0;
            text-align: center;
        }
.workspace-chat-header-right {
            gap: 10px;
            justify-content: flex-end;
        }
.desktop-media-drawer-backdrop {
            display: none;
            position: fixed;
            inset: 0;
            background: rgba(15, 23, 42, 0.18);
            backdrop-filter: blur(4px);
            opacity: 0;
            pointer-events: none;
            transition: opacity .22s ease;
            z-index: 28;
        }
.workspace-header-link {
            min-height: 36px;
            padding: 0;
            border: 0;
            border-radius: 0;
            background: transparent;
            color: #71809a;
            font-size: 15px;
            font-weight: 600;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            white-space: nowrap;
        }
.workspace-header-login {
            min-width: 96px;
            min-height: 44px;
            padding: 0 22px;
            border-radius: 999px;
            border: 0;
            background: #102746;
            color: #fff;
            font-size: 15px;
            font-weight: 700;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            white-space: nowrap;
        }
body[data-ui-theme="dark"] .workspace-chat-header {
            background: linear-gradient(180deg, rgba(8, 15, 28, 0.98) 0%, rgba(8, 15, 28, 0.9) 74%, rgba(8, 15, 28, 0) 100%) !important;
        }
body[data-ui-theme="dark"] .desktop-history-toggle,
        body[data-ui-theme="dark"] .desktop-action-icon,
        body[data-ui-theme="dark"] .workspace-header-login {
            border-color: rgba(148, 163, 184, 0.14);
            background: rgba(15, 23, 42, 0.82);
            color: #edf2ff;
            box-shadow: 0 10px 24px rgba(2, 6, 23, 0.24);
        }
body[data-ui-theme="dark"] .workspace-header-link {
            border-color: transparent;
            background: transparent;
            color: #dbeafe;
            box-shadow: none;
        }
body[data-ui-theme="dark"] .workspace-header-link.active {
            color: #dbeafe;
        }
body[data-ui-theme="dark"] .desktop-history-toggle:hover,
        body[data-ui-theme="dark"] .desktop-action-icon:hover {
            background: rgba(30, 41, 59, 0.96);
            border-color: rgba(96, 165, 250, 0.32);
            color: #93c5fd;
        }
body[data-ui-theme="dark"] .desktop-history-toggle.active {
            background: rgba(30, 64, 175, 0.18);
            border-color: rgba(96, 165, 250, 0.4);
            color: #93c5fd;
        }
body[data-ui-theme="dark"] .legal-doc-head h3 {
            color: #edf2ff;
        }
body[data-ui-theme="dark"] .legal-doc-head span {
            color: #8fa0bc;
        }
body[data-ui-theme="dark"] .legal-doc-content {
            color: #c7d2e5;
        }
.workspace-header-user {
            min-height: 36px;
            padding: 0 10px 0 8px;
            border-radius: 16px;
            background: #f8fafc;
            color: #111827;
            display: inline-flex;
            align-items: center;
            gap: 8px;
            font-size: 13px;
            font-weight: 600;
            border: 1px solid rgba(15, 23, 42, 0.06);
            cursor: pointer;
        }
.workspace-header-user img,
        .workspace-header-user-fallback {
            width: 24px;
            height: 24px;
            border-radius: 50%;
            flex: 0 0 24px;
        }
.workspace-header-user-fallback {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: linear-gradient(135deg, #2f6bff 0%, #5c89ff 100%);
            color: #fff;
            font-size: 12px;
        }
.workspace-account-menu {
            position: relative;
            display: inline-flex;
            align-items: center;
        }
.workspace-account-toggle {
            border: 1px solid rgba(15, 23, 42, 0.06);
        }
.workspace-account-toggle::after {
            content: "";
            width: 8px;
            height: 8px;
            margin-left: 2px;
            border-right: 1.8px solid currentColor;
            border-bottom: 1.8px solid currentColor;
            transform: rotate(45deg) translateY(-1px);
            opacity: .6;
            flex: 0 0 auto;
        }
.workspace-account-dropdown {
            position: absolute;
            right: 0;
            top: calc(100% + 10px);
            min-width: 180px;
            padding: 10px;
            border-radius: 18px;
            border: 1px solid rgba(15, 23, 42, 0.08);
            background: rgba(255, 255, 255, 0.98);
            box-shadow: 0 18px 40px rgba(15, 23, 42, 0.12);
            display: grid;
            gap: 8px;
            z-index: 40;
        }
.settings-overlay {
            position: fixed;
            inset: 0;
            z-index: 125;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 18px;
            overflow: hidden;
        }
body[data-ui-theme="dark"] .workspace-account-dropdown,
        body[data-ui-theme="dark"] .workspace-account-action,
        body[data-ui-theme="dark"] .settings-dialog,
        body[data-ui-theme="dark"] .settings-sidebar,
        body[data-ui-theme="dark"] .settings-card,
        body[data-ui-theme="dark"] .settings-password-form,
        body[data-ui-theme="dark"] .settings-profile-form,
        body[data-ui-theme="dark"] .settings-select,
        body[data-ui-theme="dark"] .toast,
        body[data-ui-theme="dark"] .auth-dialog {
            border-color: rgba(148, 163, 184, 0.14);
            background: rgba(10, 18, 32, 0.96);
            color: var(--text);
            box-shadow: 0 18px 42px rgba(2, 6, 23, 0.34);
        }
body[data-ui-theme="dark"] .app {
            background: #0a1220;
        }
body[data-ui-theme="dark"] .history {
            background: #0b1322;
            border-right-color: rgba(148, 163, 184, 0.12);
        }
body[data-ui-theme="dark"] .history-account .workspace-account-toggle,
        body[data-ui-theme="dark"] .workspace-account-card,
        body[data-ui-theme="dark"] .sidebar-search-trigger,
        body[data-ui-theme="dark"] .sidebar-nav-btn,
        body[data-ui-theme="dark"] .chat-empty-chip {
            background: rgba(15, 23, 42, 0.46);
            border-color: rgba(148, 163, 184, 0.12);
            color: #dbe7ff;
        }
body[data-ui-theme="dark"] .sidebar-safety-link,
        body[data-ui-theme="dark"] .workspace-account-settings {
            color: #9aabc5;
        }
body[data-ui-theme="dark"] .sidebar-safety-link:hover,
        body[data-ui-theme="dark"] .workspace-account-settings:hover {
            background: rgba(30, 41, 59, 0.88);
            color: #93c5fd;
        }
body[data-ui-theme="dark"] .office-task-card {
            background: linear-gradient(180deg, rgba(15, 23, 42, 0.76) 0%, rgba(15, 23, 42, 0.92) 100%);
            border-color: rgba(148, 163, 184, 0.16);
            color: #dbe7ff;
        }
body[data-ui-theme="dark"] .office-task-card:hover {
            border-color: rgba(96, 165, 250, 0.24);
            box-shadow: 0 18px 40px rgba(2, 6, 23, 0.26);
        }
body[data-ui-theme="dark"] .office-task-card-title {
            color: #eef4ff;
        }
body[data-ui-theme="dark"] .office-task-card-desc {
            color: #93a4c0;
        }
body[data-ui-theme="dark"] .office-task-card-format {
            background: rgba(59, 130, 246, 0.16);
            color: #bfdbfe;
        }
body[data-ui-theme="dark"] .office-task-card-arrow {
            color: #7f90ad;
        }
body[data-ui-theme="dark"] .sidebar-search-trigger:hover,
        body[data-ui-theme="dark"] .sidebar-nav-btn:hover,
        body[data-ui-theme="dark"] .workspace-account-card:hover,
        body[data-ui-theme="dark"] .chat-empty-chip:hover {
            background: rgba(30, 41, 59, 0.88);
            border-color: rgba(96, 165, 250, 0.18);
            color: #edf2ff;
            box-shadow: 0 10px 22px rgba(2, 6, 23, 0.26);
        }
body[data-ui-theme="dark"] .sidebar-nav-btn.active {
            background: rgba(30, 41, 59, 0.96);
            border-color: rgba(96, 165, 250, 0.18);
            color: #edf2ff;
            box-shadow: 0 10px 22px rgba(2, 6, 23, 0.26);
        }
body[data-ui-theme="dark"] .sidebar-brand-copy strong,
        body[data-ui-theme="dark"] .hero-brand-text strong,
        body[data-ui-theme="dark"] .hero-title,
        body[data-ui-theme="dark"] .section-head h3,
        body[data-ui-theme="dark"] .chat-empty-title,
        body[data-ui-theme="dark"] .composer-title,
        body[data-ui-theme="dark"] .viewer-name {
            color: #edf2ff;
        }
body[data-ui-theme="dark"] .sidebar-brand-copy span,
        body[data-ui-theme="dark"] .sidebar-search-trigger-label,
        body[data-ui-theme="dark"] .sidebar-section-label,
        body[data-ui-theme="dark"] .hero-brand-text span,
        body[data-ui-theme="dark"] .hero-desc,
        body[data-ui-theme="dark"] .viewer-meta,
        body[data-ui-theme="dark"] .section-head .tiny,
        body[data-ui-theme="dark"] .chat-empty-desc,
        body[data-ui-theme="dark"] .composer-desc,
        body[data-ui-theme="dark"] .status-text {
            color: #8fa0bc;
        }
body[data-ui-theme="dark"] .auth-legal-check,
        body[data-ui-theme="dark"] .auth-legal-note {
            color: #8fa0bc;
        }
body[data-ui-theme="dark"] .auth-legal-link {
            color: #edf2ff;
        }
body[data-ui-theme="dark"] .auth-legal-link:hover {
            color: #93c5fd;
        }
body[data-ui-theme="dark"] .workspace-disclaimer {
            color: #6f829f;
        }
body[data-ui-theme="dark"] .ui-language-switch {
            border-color: rgba(96, 165, 250, 0.14);
            background: rgba(15, 23, 42, 0.82);
            box-shadow: 0 10px 24px rgba(2, 6, 23, 0.24);
        }
body[data-ui-theme="dark"] .ui-language-switch-btn {
            color: #9fb0cb;
        }
body[data-ui-theme="dark"] .ui-language-switch-btn:hover {
            color: #edf2ff;
        }
body[data-ui-theme="dark"] .ui-language-switch-btn.active {
            background: linear-gradient(135deg, #2a62f4 0%, #0ea5a2 100%);
            color: #fff;
        }
body[data-ui-theme="dark"] .conversation-empty-state {
            color: #8fa0bc;
        }
body[data-ui-theme="dark"] .conversation-list-retry {
            border-color: rgba(105, 145, 255, 0.34);
            background: rgba(48, 88, 190, 0.22);
            color: #a9c1ff;
        }
body[data-ui-theme="dark"] .conversation-list-retry:hover {
            background: rgba(62, 106, 214, 0.32);
        }
body[data-ui-theme="dark"] .workspace,
        body[data-ui-theme="dark"] .result-card,
        body[data-ui-theme="dark"] .composer,
        body[data-ui-theme="dark"] .guest-hero-main,
        body[data-ui-theme="dark"] .guest-preview-shell,
        body[data-ui-theme="dark"] .guest-preview-sidebar,
        body[data-ui-theme="dark"] .guest-preview-main,
        body[data-ui-theme="dark"] .chat-empty,
        body[data-ui-theme="dark"] .chat-area {
            color: var(--text);
        }
body[data-ui-theme="dark"] .workspace {
            background:
                radial-gradient(circle at 100% 0%, rgba(54, 102, 255, 0.12), transparent 34%),
                linear-gradient(180deg, #0a1220 0%, #0d1626 100%);
        }
body[data-ui-theme="dark"] .settings-sidebar {
            background: rgba(7, 13, 24, 0.94);
        }
body[data-ui-theme="dark"] .settings-about-copy strong,
        body[data-ui-theme="dark"] .settings-field label,
        body[data-ui-theme="dark"] .settings-legal-head h5,
        body[data-ui-theme="dark"] .settings-legal-copy strong,
        body[data-ui-theme="dark"] .workspace-account-action,
        body[data-ui-theme="dark"] .auth-close {
            color: var(--text);
        }
body[data-ui-theme="dark"] .workspace-account-action:hover,
        body[data-ui-theme="dark"] .settings-nav-btn.active {
            background: rgba(92, 140, 255, 0.16);
            color: #dce7ff;
        }
body[data-ui-theme="dark"] .settings-account-name-field input[readonly],
        body[data-ui-theme="dark"] .settings-account-name-field input[readonly]:focus {
            border-color: rgba(148, 163, 184, 0.14);
            background: rgba(15, 23, 42, 0.7);
            color: #aab8cc;
        }
body[data-ui-theme="dark"] .settings-account-name-help {
            color: #8494ad;
        }
body[data-ui-theme="dark"] .auth-close,
        body[data-ui-theme="dark"] .settings-select {
            background: rgba(15, 23, 42, 0.7);
        }
body[data-ui-theme="dark"] .settings-select option {
            background: #0f172a;
            color: #edf2ff;
        }
body[data-ui-theme="dark"] .settings-legal-item {
            border-color: rgba(148, 163, 184, 0.14);
            background: rgba(15, 23, 42, 0.62);
        }
body[data-ui-theme="dark"] .settings-legal-copy span {
            color: #8fa0bc;
        }
body[data-ui-theme="dark"] .settings-about-copy span {
            color: #8fa0bc;
        }
body[data-ui-theme="dark"] .chat-input-wrap {
            background: rgba(10, 18, 32, 0.96);
            border-color: rgba(148, 163, 184, 0.14);
            box-shadow: 0 18px 42px rgba(2, 6, 23, 0.34);
        }
body[data-ui-theme="dark"] .chat-input-wrap textarea {
            color: #edf2ff;
            caret-color: #6aa1ff;
            -webkit-text-fill-color: #edf2ff;
        }
body[data-ui-theme="dark"] .chat-input-wrap textarea::placeholder {
            color: #8f9bb0;
            opacity: 1;
        }
body[data-ui-theme="dark"] .chat-input-hint {
            color: #8f9bb0;
        }
body[data-ui-theme="dark"] .free-media-experience-notice {
            border-color: rgba(251, 191, 36, 0.24);
            background: #211d17;
            color: #f8d48a;
        }
body[data-ui-theme="dark"] .chat-skill-mention-menu {
            border-color: rgba(148, 163, 184, 0.18);
            background: rgba(20, 27, 39, 0.98);
            box-shadow: 0 24px 62px rgba(0, 0, 0, 0.42);
        }
body[data-ui-theme="dark"] .chat-skill-mention-head,
        body[data-ui-theme="dark"] .chat-skill-mention-copy span,
        body[data-ui-theme="dark"] .chat-skill-mention-empty {
            color: #98a5b8;
        }
body[data-ui-theme="dark"] .chat-skill-mention-option {
            color: #dce5f2;
        }
body[data-ui-theme="dark"] .chat-skill-mention-option:hover,
        body[data-ui-theme="dark"] .chat-skill-mention-option.is-active {
            background: rgba(96, 165, 250, 0.12);
            color: #f4f8ff;
        }
body[data-ui-theme="dark"] .chat-skill-mention-icon {
            background: rgba(148, 163, 184, 0.1);
        }
@media (max-width: 600px){.chat-skill-mention-menu {
                left: 0;
                bottom: calc(100% + 8px);
                width: 100%;
                max-height: min(330px, 44dvh);
                border-radius: 17px;
            }
.chat-skill-mention-option {
                min-height: 54px;
            }}
body[data-ui-theme="dark"] .sidebar-search-trigger-shortcut {
            background: rgba(148, 163, 184, 0.12);
            color: #9fb1cb;
        }
body[data-ui-theme="dark"] .image-create-studio,
        body[data-ui-theme="dark"] .image-studio-template-panel,
        body[data-ui-theme="dark"] .image-studio-prompt-card,
        body[data-ui-theme="dark"] .image-studio-summary,
        body[data-ui-theme="dark"] .image-studio-tool-card,
        body[data-ui-theme="dark"] .image-studio-preset-card,
        body[data-ui-theme="dark"] .workspace-records,
        body[data-ui-theme="dark"] .image-studio-popover {
            border-color: rgba(148, 163, 184, 0.14);
            background: #0a1220;
            color: var(--text);
            box-shadow: 0 18px 42px rgba(2, 6, 23, 0.34);
        }
body[data-ui-theme="dark"] .image-studio-template-panel.is-compact {
            background: rgba(8, 15, 28, 0.97);
            box-shadow: 0 28px 64px rgba(2, 6, 23, 0.5);
        }
body[data-ui-theme="dark"] .image-studio-template-compact {
            background: rgba(148, 163, 184, 0.08);
        }
body[data-ui-theme="dark"] .image-studio-template-compact-head strong {
            color: #edf2ff;
        }
body[data-ui-theme="dark"] .image-studio-template-compact-head span {
            color: #94a3b8;
        }
body[data-ui-theme="dark"] .image-studio-template-refresh {
            background: rgba(15, 23, 42, 0.72);
            border-color: rgba(148, 163, 184, 0.16);
            color: #dbe6ff;
        }
body[data-ui-theme="dark"] .image-studio-template-refresh-icon {
            background: rgba(59, 130, 246, 0.14);
            color: #a5c8ff;
        }
body[data-ui-theme="dark"] .image-studio-template-refresh:hover {
            background: rgba(37, 99, 255, 0.18);
            color: #9fc0ff;
        }
body[data-ui-theme="dark"] .image-studio-template-refresh:hover .image-studio-template-refresh-icon {
            background: rgba(96, 165, 250, 0.18);
            color: #cfe2ff;
        }
body[data-ui-theme="dark"] .image-studio-template-mini-copy {
            background: rgba(8, 15, 28, 0.72);
            color: #e5edf9;
        }
body[data-ui-theme="dark"] .image-studio-template-spotlight-badge {
            background: rgba(8, 15, 28, 0.58);
            color: rgba(255,255,255,0.9);
        }
body[data-ui-theme="dark"] .image-create-studio {
            background: transparent;
            border-color: transparent;
            box-shadow: none;
        }
body[data-ui-theme="dark"] .image-studio-shell,
        body[data-ui-theme="dark"] .image-studio-content,
        body[data-ui-theme="dark"] .image-studio-main,
        body[data-ui-theme="dark"] .image-studio-gallery-shell {
            background: transparent;
            border-color: transparent;
            box-shadow: none;
        }
body[data-ui-theme="dark"] .image-studio-input,
        body[data-ui-theme="dark"] .image-studio-tool-meta,
        body[data-ui-theme="dark"] .image-studio-tool-title,
        body[data-ui-theme="dark"] .image-studio-tool-desc,
        body[data-ui-theme="dark"] .image-studio-gallery-head strong,
        body[data-ui-theme="dark"] .image-studio-summary strong,
        body[data-ui-theme="dark"] .image-studio-preset-overlay strong,
        body[data-ui-theme="dark"] .image-studio-template-head strong,
        body[data-ui-theme="dark"] .workspace-records h3,
        body[data-ui-theme="dark"] .task-date-group-title {
            color: #edf2ff;
        }
body[data-ui-theme="dark"] .image-studio-input::placeholder,
        body[data-ui-theme="dark"] .image-studio-gallery-head span,
        body[data-ui-theme="dark"] .image-studio-summary p,
        body[data-ui-theme="dark"] .image-studio-sidecard-tip,
        body[data-ui-theme="dark"] .image-studio-preset-overlay p,
        body[data-ui-theme="dark"] .image-studio-preset-meta,
        body[data-ui-theme="dark"] .image-studio-template-head span,
        body[data-ui-theme="dark"] .workspace-records .tiny {
            color: #8fa0bc;
        }
body[data-ui-theme="dark"] .image-studio-toolbar {
            border-top-color: rgba(148, 163, 184, 0.12);
            background: rgba(7, 13, 24, 0.76);
        }
body[data-ui-theme="dark"] .image-studio-inline-btn,
        body[data-ui-theme="dark"] .image-studio-gallery-filter,
        body[data-ui-theme="dark"] .image-studio-template-filter,
        body[data-ui-theme="dark"] .composer-capability-btn,
        body[data-ui-theme="dark"] .work-skill-btn,
        body[data-ui-theme="dark"] .chat-followup-chip,
        body[data-ui-theme="dark"] .chat-quick-action {
            background: rgba(15, 23, 42, 0.7);
            border-color: rgba(148, 163, 184, 0.16);
            color: #dbe7ff;
        }
body[data-ui-theme="dark"] .image-studio-inline-btn.active,
        body[data-ui-theme="dark"] .image-studio-gallery-filter.active,
        body[data-ui-theme="dark"] .image-studio-template-filter.active,
        body[data-ui-theme="dark"] .composer-capability-btn.active,
        body[data-ui-theme="dark"] .work-skill-btn.is-open,
        body[data-ui-theme="dark"] .chat-followup-chip:hover,
        body[data-ui-theme="dark"] .chat-quick-action:hover {
            background: rgba(37, 99, 255, 0.18);
            border-color: rgba(96, 165, 250, 0.28);
            color: #dce7ff;
        }
body[data-ui-theme="dark"] .work-skill-btn-value {
            color: rgba(191, 219, 254, 0.78);
        }
body[data-ui-theme="dark"] .work-skill-menu {
            background: rgba(9, 15, 27, 0.98);
            border-color: rgba(148, 163, 184, 0.16);
            box-shadow: 0 18px 42px rgba(2, 6, 23, 0.45);
        }
body[data-ui-theme="dark"] .work-skill-option {
            color: #dbe7ff;
        }
body[data-ui-theme="dark"] .work-skill-option:hover,
        body[data-ui-theme="dark"] .work-skill-option.active {
            background: rgba(37, 99, 255, 0.18);
            color: #dce7ff;
        }
body[data-ui-theme="dark"] .image-studio-template-filter:hover {
            background: rgba(22, 32, 52, 0.92);
            border-color: rgba(96, 165, 250, 0.24);
        }
body[data-ui-theme="dark"] .image-studio-template-filter.active {
            box-shadow: none;
        }
body[data-ui-theme="dark"] .image-studio-tool-link {
            background: rgba(15, 23, 42, 0.78);
            border-color: rgba(148, 163, 184, 0.16);
            color: #e2e8f0;
        }
body[data-ui-theme="dark"] .image-studio-tool-link-label {
            color: #8fa0bc;
        }
body[data-ui-theme="dark"] .image-studio-tool-link-value {
            color: #edf2ff;
        }
body[data-ui-theme="dark"] .image-studio-tool-icon {
            color: #93a4bf;
        }
body[data-ui-theme="dark"] .image-studio-tool-link.active .image-studio-tool-link-label,
        body[data-ui-theme="dark"] .image-studio-tool-link.active .image-studio-tool-link-value {
            color: #bfd3ff;
        }
body[data-ui-theme="dark"] .image-studio-more-panel {
            border-color: rgba(148, 163, 184, 0.14);
            background: rgba(12, 20, 34, 0.96);
            box-shadow: 0 22px 48px rgba(2, 6, 23, 0.42);
        }
body[data-ui-theme="dark"] .mobile-chat-more-menu {
            border-color: rgba(148, 163, 184, 0.14);
            background: rgba(12, 20, 34, 0.96);
            box-shadow: 0 22px 48px rgba(2, 6, 23, 0.42);
        }
body[data-ui-theme="dark"] .mobile-chat-more-item,
        body[data-ui-theme="dark"] .mobile-chat-toolbar-btn {
            color: #dbe7ff;
        }
body[data-ui-theme="dark"] .mobile-chat-more-item:hover,
        body[data-ui-theme="dark"] .mobile-chat-toolbar-btn:hover {
            background: rgba(30, 41, 59, 0.92);
        }
body[data-ui-theme="dark"] .image-studio-toolbar-divider {
            background: rgba(148, 163, 184, 0.18);
        }
body[data-ui-theme="dark"] .studio-reference-bar {
            border-color: rgba(148, 163, 184, 0.14);
            background: rgba(15, 23, 42, 0.72);
        }
body[data-ui-theme="dark"] .studio-reference-meta,
        body[data-ui-theme="dark"] .studio-reference-chip-label,
        body[data-ui-theme="dark"] .studio-reference-chip-kind {
            color: #dbe7ff;
        }
body[data-ui-theme="dark"] .image-studio-popover-item {
            border-color: rgba(148, 163, 184, 0.12);
            background: #0f172a;
            color: #ffffff;
            -webkit-text-fill-color: #ffffff;
        }
body[data-ui-theme="dark"] .image-studio-popover-item:hover {
            border-color: rgba(96, 165, 250, 0.28);
            background: rgba(30, 41, 59, 0.92);
            color: #ffffff;
            -webkit-text-fill-color: #ffffff;
        }
body[data-ui-theme="dark"] .image-studio-popover-item.active {
            border-color: rgba(96, 165, 250, 0.42);
            background: linear-gradient(135deg, rgba(30, 41, 59, 0.98) 0%, rgba(23, 37, 84, 0.94) 100%);
            color: #ffffff;
            -webkit-text-fill-color: #ffffff;
        }
body[data-ui-theme="dark"] .image-studio-popover-item-title,
        body[data-ui-theme="dark"] .image-studio-popover-item-desc {
            color: #ffffff;
            -webkit-text-fill-color: #ffffff;
        }
body[data-ui-theme="dark"] .image-studio-popover-thumb {
            box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);
        }
body[data-ui-theme="dark"] .image-studio-send-btn {
            box-shadow: 0 10px 20px rgba(30, 64, 175, 0.16);
        }
body[data-ui-theme="dark"] .image-studio-preset-card {
            background: rgba(15, 23, 42, 0.76);
            border-color: rgba(148, 163, 184, 0.12);
        }
body[data-ui-theme="dark"] .image-studio-preset-stage {
            background: #0f172a;
        }
body[data-ui-theme="dark"] .image-studio-template-card {
            background: #172036;
            box-shadow: 0 16px 32px rgba(2, 6, 23, 0.3);
        }
body[data-ui-theme="dark"] .image-studio-template-overlay p {
            color: rgba(226, 232, 240, 0.82);
        }
body[data-ui-theme="dark"] .image-studio-template-action,
        body[data-ui-theme="dark"] .image-studio-preset-action button {
            background: rgba(15, 23, 42, 0.42);
            border-color: rgba(148, 163, 184, 0.22);
            color: #f8fbff;
        }
body[data-ui-theme="dark"] .image-studio-template-action:hover,
        body[data-ui-theme="dark"] .image-studio-template-action:focus-visible,
        body[data-ui-theme="dark"] .image-studio-preset-action button:hover,
        body[data-ui-theme="dark"] .image-studio-preset-action button:focus-visible {
            background: rgba(30, 41, 59, 0.62);
            border-color: rgba(148, 163, 184, 0.3);
        }
body[data-ui-theme="dark"] .image-studio-template-panel,
        body[data-ui-theme="dark"] .image-studio-quickcard,
        body[data-ui-theme="dark"] .image-studio-tool-card,
        body[data-ui-theme="dark"] .image-studio-sidecard,
        body[data-ui-theme="dark"] .image-studio-sidecard-item,
        body[data-ui-theme="dark"] .image-studio-template-card,
        body[data-ui-theme="dark"] .image-studio-preset-card,
        body[data-ui-theme="dark"] .image-studio-prompt-card {
            border-color: rgba(71, 85, 105, 0.34);
        }
body[data-ui-theme="dark"] .image-studio-tool-thumb {
            box-shadow: inset 0 0 0 1px rgba(15, 23, 42, 0.34);
        }
@media (max-width: 860px){.settings-overlay {
                align-items: stretch;
                padding: 8px;
                padding-top: max(8px, env(safe-area-inset-top));
                padding-bottom: max(8px, env(safe-area-inset-bottom));
            }
.settings-dialog {
                width: 100%;
                height: 100%;
                max-height: 100%;
                border-radius: 24px;
            }
.settings-shell {
                grid-template-columns: minmax(0, 1fr);
                grid-template-rows: auto minmax(0, 1fr);
                width: 100%;
                height: 100%;
                min-height: 0;
                max-height: none;
            }
.settings-sidebar {
                border-right: none;
                border-bottom: 1px solid rgba(15, 23, 42, 0.06);
                padding: 20px 52px 14px 20px;
                gap: 12px;
                overflow: hidden;
            }
.settings-sidebar h3 {
                font-size: 22px;
            }
.settings-nav {
                display: flex;
                gap: 8px;
                overflow-x: auto;
                overflow-y: hidden;
                scrollbar-width: none;
                overscroll-behavior-inline: contain;
                -webkit-overflow-scrolling: touch;
            }
.settings-nav::-webkit-scrollbar {
                display: none;
            }
.settings-nav-btn {
                min-height: 42px;
                padding: 0 15px;
                border-radius: 14px;
                flex: 0 0 auto;
                white-space: nowrap;
            }
.settings-content {
                padding: 22px 18px calc(28px + env(safe-area-inset-bottom));
                overflow-y: auto;
                overflow-x: hidden;
                overscroll-behavior-y: contain;
                -webkit-overflow-scrolling: touch;
            }
.settings-dialog .password-toggle {
                bottom: 5px;
            }
.settings-grid {
                grid-template-columns: minmax(0, 1fr);
            }
.settings-profile-head {
                align-items: flex-start;
            }
.settings-profile-avatar-wrap,
            .settings-profile-avatar {
                width: 64px;
                height: 64px;
                flex-basis: 64px;
            }
.settings-profile-avatar {
                border-radius: 20px;
                font-size: 24px;
            }
.settings-form-actions .btn,
            .settings-form-actions .auth-submit-btn {
                max-width: 100%;
            }}
@media (max-height: 760px) and (min-width: 861px){.settings-overlay {
                align-items: flex-start;
                padding-top: 12px;
                padding-bottom: 12px;
            }
.settings-dialog {
                max-height: calc(100vh - 24px);
            }
.settings-shell {
                min-height: 0;
                max-height: calc(100vh - 24px);
            }
.settings-sidebar,
            .settings-content {
                padding-top: 22px;
                padding-bottom: 22px;
            }}
body[data-ui-theme="dark"] .settings-dialog .auth-field label {
            color: #b7c5d9;
        }
body[data-ui-theme="dark"] .settings-dialog .auth-field input,
        body[data-ui-theme="dark"] .settings-dialog .auth-field input:focus {
            border-color: rgba(148, 163, 184, 0.2);
            background: rgba(15, 23, 42, 0.82);
            color: #f1f5ff;
            caret-color: #8cb8ff;
            -webkit-text-fill-color: #f1f5ff;
            box-shadow: none;
        }
body[data-ui-theme="dark"] .settings-dialog .auth-field input::placeholder {
            color: #a7b5c9;
            opacity: 1;
            -webkit-text-fill-color: #a7b5c9;
        }
body[data-ui-theme="dark"] .settings-dialog .password-toggle {
            color: #b8c7dc;
        }
body[data-ui-theme="dark"] .settings-dialog .password-toggle:hover,
        body[data-ui-theme="dark"] .settings-dialog .password-toggle:focus-visible {
            color: #f1f5ff;
            background: rgba(96, 165, 250, 0.16);
        }
body[data-mode="chat"] .workspace {
            position: relative;
            overflow: hidden;
            background:
                radial-gradient(circle at top, rgba(73, 110, 255, 0.08), transparent 26%),
                linear-gradient(180deg, #ffffff 0%, #fbfbfd 100%);
        }
body[data-mode="chat"] .workspace-chat-header {
            display: grid;
            grid-template-columns: 52px minmax(0, 1fr) auto;
            align-items: center;
            gap: 10px;
            padding: 12px 22px 8px;
            border-bottom: none;
            background: linear-gradient(180deg, rgba(255,255,255,0.98) 0%, rgba(255,255,255,0.92) 82%, rgba(255,255,255,0) 100%);
            backdrop-filter: blur(14px);
        }
body[data-mode="chat"] .hero,
        body[data-mode="chat"] .guest-hero,
        body[data-mode="chat"] .workspace-records,
        body[data-mode="chat"] .composer-top,
        body[data-mode="chat"] .composer-actions,
        body[data-mode="chat"] .chat-quick-actions {
            display: none;
        }
body[data-mode="chat"] .history,
        body[data-mode="image"] .history,
        body[data-mode="video"] .history {
            width: var(--chat-sidebar-width);
            min-width: var(--chat-sidebar-width);
            transition: opacity .22s ease, transform .22s ease, width .22s ease, padding .22s ease, box-shadow .22s ease;
        }
body[data-mode="chat"] .composer {
            position: sticky;
            bottom: 0;
            z-index: 12;
            width: 100%;
            max-width: none;
            margin: 0;
            padding: 0 22px 14px;
            background: transparent;
            border: none;
            box-shadow: none;
            background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(252,253,255,0.84) 12%, rgba(252,253,255,0.98) 34%, #fbfbfd 100%);
        }
body[data-mode="chat"] #chat-compose-field {
            width: min(900px, calc(100vw - var(--chat-sidebar-width) - 108px));
            margin: 0 auto;
        }
body[data-mode="chat"] .chat-input-wrap {
            border-radius: 24px;
            border: 1px solid rgba(15, 23, 42, 0.08);
            overflow: hidden;
            background: var(--panel-strong);
            box-shadow: 0 18px 42px rgba(15, 23, 42, 0.06);
            padding-bottom: 8px;
        }
body[data-mode="chat"] .chat-input-wrap textarea {
            min-height: 74px;
            padding: 16px 124px 10px 20px;
            color: #141826;
            -webkit-text-fill-color: #141826;
        }
body[data-ui-theme="dark"][data-mode="chat"] .chat-input-wrap textarea {
            color: #edf2ff;
            caret-color: #6aa1ff;
            -webkit-text-fill-color: #edf2ff;
        }
body[data-ui-theme="dark"][data-mode="chat"] .chat-input-wrap textarea::placeholder {
            color: #8f9bb0;
            opacity: 1;
        }
body[data-ui-theme="dark"][data-mode="chat"] .chat-input-hint {
            color: #8f9bb0;
        }
body[data-mode="chat"] .chat-input-tools {
            left: 12px;
            right: 12px;
            bottom: 10px;
            gap: 0;
        }
body[data-mode="chat"] .chat-tool-btn {
            width: 34px;
            height: 34px;
            border: none;
            border-radius: 50%;
            background: transparent;
            color: #111827;
            box-shadow: none;
        }
body[data-mode="chat"] .chat-input-action-group {
            gap: 6px;
        }
body[data-mode="chat"] .chat-voice-btn {
            width: 34px;
            height: 34px;
            border: none;
            border-radius: 50%;
            background: transparent;
            color: #111827;
            box-shadow: none;
        }
body[data-mode="chat"] .send-btn {
            width: 38px;
            height: 38px;
            border-radius: 50%;
            background: #f3f4f6;
            color: #111827;
            box-shadow: none;
        }
body[data-ui-theme="dark"][data-mode="chat"] .workspace {
            background: linear-gradient(180deg, rgba(10, 18, 32, 0.94) 0%, rgba(13, 22, 38, 0.98) 100%);
        }
body[data-ui-theme="dark"][data-mode="chat"] .chat-empty-title {
            color: #edf2ff;
        }
body[data-ui-theme="dark"][data-mode="chat"] .chat-empty-desc {
            color: #8fa0bc;
        }
body[data-ui-theme="dark"][data-mode="chat"] .chat-empty-chip {
            background: rgba(15, 23, 42, 0.72);
            border-color: rgba(148, 163, 184, 0.16);
            color: #dbe7ff;
        }
body[data-ui-theme="dark"][data-mode="chat"] .chat-empty-chip:hover {
            background: rgba(30, 41, 59, 0.92);
            color: #edf2ff;
            border-color: rgba(96, 165, 250, 0.2);
            box-shadow: 0 10px 22px rgba(2, 6, 23, 0.26);
        }
body[data-ui-theme="dark"][data-mode="chat"] .office-task-card {
            background: linear-gradient(180deg, rgba(15, 23, 42, 0.82) 0%, rgba(15, 23, 42, 0.96) 100%);
        }
body[data-ui-theme="dark"][data-mode="chat"] .composer {
            background: rgba(10, 18, 32, 0.94);
            border-color: rgba(148, 163, 184, 0.16);
            box-shadow: 0 20px 42px rgba(2, 6, 23, 0.34);
        }
body[data-ui-theme="dark"] .conversation-more-btn {
            background: rgba(71, 85, 105, 0.18);
            color: #94a3b8;
        }
body[data-ui-theme="dark"] .conversation-more-btn:hover,
        body[data-ui-theme="dark"] .conversation-item.menu-open .conversation-more-btn {
            background: rgba(100, 116, 139, 0.22);
            color: #e2e8f0;
        }
body[data-ui-theme="dark"] .conversation-menu {
            border-color: rgba(148, 163, 184, 0.12);
            background: rgba(12, 20, 34, 0.96);
            box-shadow: 0 24px 50px rgba(2, 6, 23, 0.44);
        }
body[data-ui-theme="dark"] .conversation-menu-item {
            color: #dbe7ff;
        }
body[data-ui-theme="dark"] .conversation-menu-item:hover {
            background: rgba(30, 41, 59, 0.9);
        }
body[data-ui-theme="dark"] .conversation-menu-item.is-divider {
            border-top-color: rgba(148, 163, 184, 0.12);
        }
body[data-ui-theme="dark"] .conversation-menu-item.is-danger {
            color: #fca5a5;
        }
body[data-ui-theme="dark"] .conversation-menu-item.is-danger:hover {
            background: rgba(127, 29, 29, 0.32);
        }
body[data-ui-theme="dark"] .conversation-pinned-chip {
            background: rgba(59, 130, 246, 0.16);
            color: #bfdbfe;
        }
body[data-ui-theme="dark"] #chat-compose-field.is-media-mode .chat-input-wrap textarea {
            color: #edf2ff;
            -webkit-text-fill-color: #edf2ff;
        }
body[data-ui-theme="dark"] #chat-compose-field.is-media-mode .chat-input-wrap textarea::placeholder {
            color: #8f9bb0;
            opacity: 1;
        }
body[data-ui-theme="dark"] #chat-compose-field.is-media-mode .chat-input-hint {
            color: #8f9bb0;
        }
body[data-ui-theme="dark"] #chat-compose-field.is-media-mode .studio-reference-bar.is-compact-reference-picker {
            border-color: transparent;
            background: transparent;
        }
body[data-ui-theme="dark"] #chat-compose-field.is-media-mode .compact-reference-chip {
            border-color: rgba(148, 163, 184, 0.22);
            background: #172235;
        }
body[data-ui-theme="dark"] #chat-compose-field.is-media-mode .compact-reference-chip img {
            background: #172235;
        }
body[data-ui-theme="dark"] #chat-compose-field.is-media-mode .studio-reference-add {
            border-color: rgba(96, 165, 250, 0.34);
            background: rgba(30, 41, 59, 0.86);
            color: #93c5fd;
        }
body[data-ui-theme="dark"] #chat-compose-field.is-media-mode .studio-reference-add:hover {
            border-color: rgba(96, 165, 250, 0.58);
            background: rgba(37, 52, 76, 0.96);
            color: #bfdbfe;
        }
body[data-ui-theme="dark"].is-file-dragging #chat-compose-field.is-media-mode .studio-reference-bar.is-compact-reference-picker {
            background: rgba(59, 130, 246, 0.1);
            box-shadow: inset 0 0 0 1px rgba(96, 165, 250, 0.28);
        }
body[data-ui-theme="dark"][data-mode="chat"] .composer-capability-btn {
            background: rgba(15, 23, 42, 0.76);
            border-color: rgba(148, 163, 184, 0.14);
            color: #dbe7ff;
        }
body[data-ui-theme="dark"][data-mode="chat"] .composer-capability-btn:hover,
        body[data-ui-theme="dark"][data-mode="chat"] .composer-capability-btn.active {
            background: rgba(30, 41, 59, 0.94);
            color: #bfd3ff;
            border-color: rgba(96, 165, 250, 0.2);
            box-shadow: 0 8px 18px rgba(2, 6, 23, 0.24);
        }
body[data-ui-theme="dark"] .composer-capability-btn .capability-icon {
            color: #dbe7ff;
        }
body[data-ui-theme="dark"] .composer-capability-btn.active .capability-icon {
            color: #bfd3ff;
        }
body[data-ui-theme="dark"][data-mode="chat"] .workspace-chat-header {
            background: rgba(8, 15, 28, 0.82);
            border-bottom-color: rgba(148, 163, 184, 0.1);
            box-shadow: 0 10px 26px rgba(2, 6, 23, 0.18);
        }
body[data-ui-theme="dark"][data-mode="chat"] .workspace-chat-header-center strong,
        body[data-ui-theme="dark"][data-mode="chat"] .conversation-title,
        body[data-ui-theme="dark"][data-mode="chat"] .chat-tool-btn,
        body[data-ui-theme="dark"][data-mode="chat"] .send-btn,
        body[data-ui-theme="dark"][data-mode="chat"] .sidebar-account strong {
            color: #edf2ff;
        }
body[data-ui-theme="dark"] .sidebar-brand-copy strong {
            color: #67a8ff;
        }
body[data-ui-theme="dark"][data-mode="chat"] .workspace-chat-header-center span,
        body[data-ui-theme="dark"][data-mode="chat"] .sidebar-section-label,
        body[data-ui-theme="dark"][data-mode="chat"] .sidebar-account span,
        body[data-ui-theme="dark"][data-mode="chat"] .chat-quick-actions-label {
            color: #8fa0bc;
        }
body[data-ui-theme="dark"][data-mode="chat"] .sidebar-brand-copy span {
            color: #67a8ff;
        }
body[data-ui-theme="dark"] .conversation-item-icon {
            color: #d7e4ff;
        }
body[data-ui-theme="dark"] .conversation-time {
            color: #91a1bc;
        }
body[data-ui-theme="dark"][data-mode="chat"] .composer {
            background: linear-gradient(180deg, rgba(8, 15, 28, 0) 0%, rgba(8, 15, 28, 0.78) 16%, rgba(8, 15, 28, 0.94) 38%, rgba(8, 15, 28, 0.98) 100%);
        }
body[data-ui-theme="dark"][data-mode="chat"] .chat-input-wrap {
            background: rgba(10, 18, 32, 0.96);
            border-color: rgba(148, 163, 184, 0.14);
            box-shadow: 0 18px 42px rgba(2, 6, 23, 0.34);
        }
body[data-ui-theme="dark"][data-mode="chat"] .chat-capability-pill {
            background: rgba(37, 99, 255, 0.18);
            color: #dbeafe;
            box-shadow: inset 0 0 0 1px rgba(96, 165, 250, 0.16);
        }
body[data-ui-theme="dark"][data-mode="chat"] .chat-capability-target-btn {
            background: rgba(15, 23, 42, 0.7);
            color: #dbe7ff;
            border-color: rgba(148, 163, 184, 0.16);
        }
body[data-ui-theme="dark"][data-mode="chat"] .chat-tool-btn {
            background: rgba(15, 23, 42, 0.76);
            color: #dbe7ff;
            border: 1px solid rgba(148, 163, 184, 0.12);
        }
body[data-ui-theme="dark"][data-mode="chat"] .chat-tool-btn:hover,
        body[data-ui-theme="dark"][data-mode="chat"] .chat-capability-target-btn:hover {
            background: rgba(30, 41, 59, 0.94);
            color: #edf2ff;
            border-color: rgba(96, 165, 250, 0.18);
        }
body[data-ui-theme="dark"][data-mode="chat"] .send-btn {
            background: rgba(226, 232, 240, 0.1);
            color: #edf2ff;
        }
body[data-ui-theme="dark"][data-mode="chat"] .send-btn.is-busy {
            background: #edf2ff;
            color: #0f172a;
        }
body[data-ui-theme="dark"][data-mode="chat"] .send-btn.has-text,
        body[data-ui-theme="dark"][data-mode="chat"] .send-btn.is-listening {
            background: #1e293b;
            color: #93c5fd;
        }
body[data-ui-theme="dark"][data-mode="chat"] .send-btn::before,
        body[data-ui-theme="dark"][data-mode="chat"] .send-btn::after {
            background: rgba(2, 6, 23, 0.96);
        }
@media (max-width: 768px){.send-btn::before,
            .send-btn::after {
                display: none;
            }}
body[data-ui-theme="dark"][data-mode="chat"] .chat-quick-action {
            background: transparent;
            color: #c7d2e5;
        }
body[data-ui-theme="dark"][data-mode="chat"] .chat-quick-action:hover {
            background: rgba(30, 41, 59, 0.92);
            color: #edf2ff;
        }
body[data-ui-theme="dark"][data-mode="chat"] .history {
            background: #0b1322;
            border-right-color: rgba(148, 163, 184, 0.12);
        }
body[data-ui-theme="dark"][data-mode="chat"] .desktop-sidebar-resizer::before,
        body[data-ui-theme="dark"][data-mode="image"] .desktop-sidebar-resizer::before,
        body[data-ui-theme="dark"][data-mode="video"] .desktop-sidebar-resizer::before {
            background: rgba(148, 163, 184, 0.14);
        }
body[data-ui-theme="dark"][data-mode="chat"] .desktop-sidebar-resizer::after,
        body[data-ui-theme="dark"][data-mode="image"] .desktop-sidebar-resizer::after,
        body[data-ui-theme="dark"][data-mode="video"] .desktop-sidebar-resizer::after {
            background: rgba(148, 163, 184, 0.2);
        }
body[data-ui-theme="dark"][data-mode="chat"] .conversation-item {
            color: #dbe7ff;
        }
body[data-ui-theme="dark"][data-mode="chat"] .conversation-item:hover,
        body[data-ui-theme="dark"][data-mode="chat"] .conversation-item.active {
            background: rgba(15, 23, 42, 0.82);
            border-color: rgba(148, 163, 184, 0.1);
            box-shadow: 0 8px 18px rgba(2, 6, 23, 0.22);
        }
body[data-ui-theme="dark"] .history.is-conversation-view .sidebar-section-label {
            color: #8ea0bb;
        }
body[data-ui-theme="dark"] .history.is-conversation-view .conversation-item {
            color: #dbe7ff;
        }
body[data-ui-theme="dark"] .history.is-conversation-view .conversation-item:hover,
        body[data-ui-theme="dark"] .history.is-conversation-view .conversation-item.active {
            background: rgba(15, 23, 42, 0.82);
            border-color: rgba(148, 163, 184, 0.1);
            box-shadow: 0 8px 18px rgba(2, 6, 23, 0.22) !important;
        }
body[data-ui-theme="dark"] .history.is-conversation-view .conversation-title,
        body[data-ui-theme="dark"] .history.is-conversation-view .conversation-item.active .conversation-title,
        body[data-ui-theme="dark"] .history.is-conversation-view .conversation-item:hover .conversation-title {
            color: #edf2ff;
        }
body[data-ui-theme="dark"][data-mode="chat"] .sidebar-footer {
            border-top-color: rgba(148, 163, 184, 0.08);
        }
body[data-ui-theme="dark"][data-mode="chat"] .media-drawer-section {
            border-color: rgba(148, 163, 184, 0.12);
            background: linear-gradient(180deg, rgba(10, 18, 32, 0.98) 0%, rgba(12, 22, 36, 0.98) 100%);
            box-shadow: 0 16px 32px rgba(2, 6, 23, 0.18);
        }
body[data-ui-theme="dark"][data-mode="chat"] .media-options-card {
            background: linear-gradient(180deg, rgba(10, 18, 32, 0.99) 0%, rgba(12, 22, 36, 0.99) 100%);
            border-color: rgba(148, 163, 184, 0.12);
            box-shadow: 0 26px 60px rgba(2, 6, 23, 0.42);
        }
body[data-ui-theme="dark"][data-mode="chat"] #media-compose .field > label,
        body[data-ui-theme="dark"][data-mode="chat"] #media-compose .tiny,
        body[data-ui-theme="dark"][data-mode="chat"] .media-section-head p {
            color: #8fa0bc;
        }
body[data-ui-theme="dark"][data-mode="chat"] .field input,
        body[data-ui-theme="dark"][data-mode="chat"] .field select,
        body[data-ui-theme="dark"][data-mode="chat"] .field textarea {
            background: rgba(15, 23, 42, 0.82);
            border-color: rgba(148, 163, 184, 0.12);
            color: #edf2ff;
        }
body[data-ui-theme="dark"][data-mode="chat"] #media-compose .advanced-controls {
            background: rgba(15, 23, 42, 0.72);
            border-color: rgba(148, 163, 184, 0.12);
        }
@media (max-width: 920px){body[data-mode="chat"] .app {
                grid-template-columns: minmax(0, 1fr);
            }
body[data-mode="chat"] .desktop-sidebar-resizer {
                display: none !important;
            }
.auth-layout {
                grid-template-columns: 1fr;
            }
.auth-aside {
                padding-left: 0;
                border-left: none;
                border-top: 1px solid rgba(148, 163, 184, 0.18);
                padding-top: 16px;
            }
body[data-mode="chat"] .workspace-chat-header {
                display: none;
            }
body.compact-media-mode[data-mode="chat"] .media-options-card {
                position: static;
                width: auto;
                max-height: none;
                overflow: visible;
                transform: none;
                opacity: 1;
                pointer-events: auto;
                box-shadow: none;
            }
body.compact-media-mode[data-mode="chat"] .desktop-media-drawer-backdrop {
                display: none;
            }
body[data-mode="chat"] .chat-empty-suggestions {
                width: 100%;
                grid-template-columns: 1fr;
            }
body[data-mode="chat"] .chat-empty-grid {
                width: min(100%, calc(100vw - 28px));
                margin: 8px auto 0;
                padding-right: 0;
                overflow-x: hidden;
                touch-action: pan-y;
            }
body[data-mode="chat"] .chat-empty-track {
                width: 100%;
                min-width: 0;
                gap: 9px;
            }
body[data-mode="chat"] .chat-empty-row {
                width: 100%;
                min-width: 0;
                flex-wrap: wrap;
                justify-content: center;
                gap: 8px;
            }
body[data-mode="chat"] .chat-empty-chip {
                width: calc((100% - 16px) / 3);
                max-width: 100%;
                min-width: 0;
                min-height: 38px;
                padding: 10px 12px;
                border-radius: 12px;
                font-size: 11.5px;
                line-height: 1.4;
                justify-content: flex-start;
                align-items: flex-start;
                text-align: left;
                background: rgba(246, 247, 249, 0.9);
                border-color: rgba(15, 23, 42, 0.035);
            }
body[data-mode="chat"] #chat-compose-field,
            body.sidebar-collapsed[data-mode="chat"] #chat-compose-field {
                width: 100%;
            }
body[data-mode="chat"] .workspace {
                height: 100dvh;
                min-height: 100dvh;
                max-height: 100dvh;
            }
body[data-mode="chat"] .stage,
            body[data-mode="chat"] .result-card {
                min-height: 0;
                height: 100%;
            }
body[data-mode="chat"] .result-card {
                display: flex;
                flex-direction: column;
            }
body[data-mode="chat"] .result-content {
                flex: 1 1 auto;
                min-height: 0;
                height: auto;
                max-height: none;
                padding: 6px 14px 18px;
                overflow-y: auto;
                overflow-x: hidden;
                scroll-padding-top: 16px;
                scroll-padding-bottom: 24px;
            }
body[data-mode="chat"] .empty-state {
                min-height: 100%;
                height: 100%;
                align-items: center;
                justify-content: center;
                padding: 0 10px clamp(20px, 6vh, 52px);
            }
body[data-mode="chat"] .chat-empty {
                min-height: 0;
                padding-top: 0;
                gap: 12px;
            }
body[data-mode="chat"] .chat-empty-copy {
                margin-bottom: 10px;
            }
body[data-mode="chat"] .chat-empty-title {
                font-size: clamp(26px, 7.2vw, 30px);
            }
body[data-mode="chat"] .chat-area,
            body[data-mode="chat"] .chat-thread-card,
            body[data-mode="chat"] .chat-thread {
                min-height: 0;
            }
body[data-mode="chat"] .chat-area:not(.hidden) {
                padding-top: 4px;
                padding-bottom: 28px;
                scroll-padding-top: 16px;
            }
body[data-mode="chat"] .composer {
                padding: 8px 10px calc(env(safe-area-inset-bottom, 0px) + 12px);
            }}
.image-create-studio {
            display: flex;
            align-items: flex-end;
            min-height: calc(100vh - 122px);
            width: 100%;
            max-width: 100%;
            min-width: 0;
            box-sizing: border-box;
            padding: 0 0 16px;
        }
body[data-ui-theme="dark"] .image-studio-prompt-card {
            border-color: rgba(148, 163, 184, 0.14);
            background: rgba(10, 18, 32, 0.98) !important;
            box-shadow: 0 24px 60px rgba(2, 6, 23, 0.32);
        }
body[data-ui-theme="dark"] .image-studio-input-shell {
            background: rgba(15, 23, 42, 0.38);
            border-color: rgba(96, 165, 250, 0.24);
            box-shadow: inset 0 0 0 1px rgba(148, 163, 184, 0.12);
        }
body[data-ui-theme="dark"] .image-studio-input,
        body[data-ui-theme="dark"] #image-studio-input {
            background: transparent !important;
            background-color: transparent !important;
            color: #edf2ff !important;
            -webkit-text-fill-color: #edf2ff !important;
            caret-color: #6aa1ff;
            box-shadow: none;
        }
body[data-ui-theme="dark"] .image-studio-input::placeholder {
            color: #8f9bb0;
            opacity: 1;
        }
body[data-ui-theme="dark"] .image-studio-toolbar {
            background: transparent;
        }
body[data-ui-theme="dark"] .image-studio-tool-link.active {
            color: #dce7ff;
            border-color: rgba(96, 165, 250, 0.28);
            background: linear-gradient(180deg, rgba(22, 32, 52, 0.98) 0%, rgba(15, 23, 42, 0.96) 100%);
            box-shadow: inset 0 0 0 1px rgba(96, 165, 250, 0.12);
        }
body[data-ui-theme="dark"] .image-studio-tool-link.active .image-studio-tool-link-label,
        body[data-ui-theme="dark"] .image-studio-tool-link.active .image-studio-tool-link-value {
            color: #bfd3ff;
        }
body[data-ui-theme="dark"] .image-studio-tool-link.active .image-studio-tool-icon {
            color: #9fc0ff;
        }
.mobile-chat-toolbar {
            display: none;
        }
.mobile-chat-more-item,
        .mobile-chat-toolbar-btn {
            border: none;
            background: transparent;
            color: #111827;
            font-size: 13px;
            font-weight: 600;
            border-radius: 14px;
        }
.mobile-chat-toolbar-btn {
            min-height: 34px;
            padding: 0 12px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 6px;
            flex: 0 0 auto;
            width: max-content;
            min-width: max-content;
            white-space: nowrap;
        }
body[data-ui-theme="dark"] .manual-model-card.is-disabled {
            border-color: rgba(148, 163, 184, 0.12);
            background: #111827;
        }
body[data-ui-theme="dark"] .manual-model-card.is-disabled .manual-model-name,
        body[data-ui-theme="dark"] .manual-model-card.is-disabled .manual-model-access-state {
            color: #94a3b8;
        }
body[data-ui-theme="dark"] .image-studio-popover-item.is-disabled,
        body[data-ui-theme="dark"] .image-studio-popover-item:disabled,
        body[data-ui-theme="dark"] .image-studio-popover-item.is-disabled:hover,
        body[data-ui-theme="dark"] .image-studio-popover-item:disabled:hover {
            border-color: rgba(148, 163, 184, 0.1);
            background: #111827;
            color: #94a3b8;
            -webkit-text-fill-color: #94a3b8;
        }
body[data-ui-theme="dark"] .image-studio-popover-item.is-disabled .image-studio-popover-item-title,
        body[data-ui-theme="dark"] .image-studio-popover-item.is-disabled .image-studio-popover-item-desc,
        body[data-ui-theme="dark"] .image-studio-popover-item:disabled .image-studio-popover-item-title,
        body[data-ui-theme="dark"] .image-studio-popover-item:disabled .image-studio-popover-item-desc {
            color: #94a3b8;
            -webkit-text-fill-color: #94a3b8;
        }
@keyframes imageStudioTemplateReveal {
            0% {
                opacity: 0;
                transform: translateY(10px) scale(0.985);
            }
            100% {
                opacity: 1;
                transform: translateY(0) scale(1);
            }
        }
body[data-ui-theme="dark"] .image-studio-quickcard,
        body[data-ui-theme="dark"] .image-studio-tool-card,
        body[data-ui-theme="dark"] .image-studio-sidecard,
        body[data-ui-theme="dark"] .image-studio-sidecard-item,
        body[data-ui-theme="dark"] .image-studio-template-card {
            border-color: rgba(148, 163, 184, 0.12) !important;
            background: rgba(10, 18, 32, 0.96) !important;
            box-shadow: 0 18px 36px rgba(2, 6, 23, 0.28);
        }
body[data-ui-theme="dark"] .image-studio-quickcard strong,
        body[data-ui-theme="dark"] .image-studio-tool-card strong,
        body[data-ui-theme="dark"] .image-studio-sidecard h3,
        body[data-ui-theme="dark"] .image-studio-sidecard-item strong {
            color: #edf2ff;
        }
body[data-ui-theme="dark"] .image-studio-quickcard p,
        body[data-ui-theme="dark"] .image-studio-quickcard-meta,
        body[data-ui-theme="dark"] .image-studio-sidecard p,
        body[data-ui-theme="dark"] .image-studio-sidecard-item span,
        body[data-ui-theme="dark"] .image-studio-tool-card span {
            color: #8fa0bc;
        }
body[data-ui-theme="dark"] .image-studio-quickcard-tag,
        body[data-ui-theme="dark"] .image-studio-sidecard-badge,
        body[data-ui-theme="dark"] .image-studio-tool-card.active .image-studio-tool-tag {
            background: rgba(37, 99, 255, 0.18);
            color: #bfd3ff;
        }
body[data-ui-theme="dark"] .image-studio-tool-card.active {
            border-color: rgba(96, 165, 250, 0.24) !important;
            background: linear-gradient(180deg, rgba(17, 24, 39, 0.98) 0%, rgba(12, 33, 67, 0.98) 100%);
            box-shadow: 0 18px 34px rgba(30, 64, 175, 0.18);
        }
body[data-ui-theme="dark"] .upload-panel.is-emphasized {
            border-color: rgba(96, 165, 250, 0.28);
            background: linear-gradient(135deg, rgba(15, 23, 42, 0.96) 0%, rgba(15, 30, 54, 0.98) 100%);
            box-shadow: 0 20px 40px rgba(15, 23, 42, 0.34);
        }
body[data-ui-theme="dark"] .image-studio-preset-card {
            border-color: rgba(148, 163, 184, 0.14) !important;
            background: #101722 !important;
            box-shadow: 0 24px 48px rgba(2, 6, 23, 0.34);
        }
body[data-ui-theme="dark"] .image-studio-preset-stage {
            background: #0b1220;
        }
body[data-ui-theme="dark"] .image-studio-preset-stage::before {
            box-shadow: inset 0 0 0 1px rgba(148, 163, 184, 0.12);
        }
body[data-ui-theme="dark"] .image-studio-preset-action button {
            border-color: rgba(148, 163, 184, 0.18);
            background: rgba(15, 23, 42, 0.74);
            color: #edf2ff;
            box-shadow: 0 14px 30px rgba(2, 6, 23, 0.24);
        }
@media (max-width: 920px){body.workspace-creations-open[data-tool-mode="image"] .workspace-records,
            body.workspace-creations-open[data-tool-mode="video"] .workspace-records {
                padding-top: calc(env(safe-area-inset-top, 0px) + 10px);
                padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 12px);
            }
body.workspace-creations-open[data-tool-mode="image"] .workspace-records .task-list,
            body.workspace-creations-open[data-tool-mode="video"] .workspace-records .task-list {
                grid-template-columns: repeat(2, minmax(0, 1fr));
                gap: 10px;
            }
body.workspace-creations-open[data-tool-mode="image"] .workspace-records .pagination,
            body.workspace-creations-open[data-tool-mode="video"] .workspace-records .pagination {
                display: grid !important;
                grid-template-columns: 1fr;
                gap: 10px;
                padding-left: 2px;
                padding-right: 2px;
            }
body.workspace-creations-open[data-tool-mode="image"] .workspace-records .pagination-actions,
            body.workspace-creations-open[data-tool-mode="video"] .workspace-records .pagination-actions {
                display: grid;
                grid-template-columns: repeat(2, minmax(0, 1fr));
                gap: 8px;
                width: 100%;
            }}
body[data-ui-theme="dark"][data-tool-mode="image"] .workspace,
        body[data-ui-theme="dark"][data-tool-mode="video"] .workspace {
            background:
                radial-gradient(circle at top right, rgba(54, 102, 255, 0.16), transparent 34%),
                linear-gradient(180deg, #0a1220 0%, #0d1626 100%);
        }
@media (min-width: 921px){body.studio-advanced-open[data-tool-mode="image"] .media-drawer-shell,
            body.studio-advanced-open[data-tool-mode="video"] .media-drawer-shell {
                position: fixed;
                left: 50%;
                top: 256px;
                transform: translateX(-50%);
                grid-template-columns: minmax(320px, 360px) minmax(0, 1fr);
                z-index: 48;
            }}
@media (max-width: 1200px){.image-studio-gallery {
                grid-template-columns: repeat(3, minmax(0, 1fr));
            }}
@media (max-width: 920px){.image-create-studio {
                min-height: calc(100vh - 112px);
                width: 100%;
                max-width: 100%;
                min-width: 0;
                align-items: stretch;
                padding: 12px 12px 18px;
            }
body[data-tool-mode="image"],
            body[data-tool-mode="video"] {
                overflow-x: hidden;
            }
body[data-tool-mode="image"] .workspace,
            body[data-tool-mode="video"] .workspace {
                width: 100%;
                min-width: 0;
                padding: 0;
                gap: 12px;
                overflow-x: hidden;
            }
body[data-tool-mode="image"] .workspace-chat-header,
            body[data-tool-mode="video"] .workspace-chat-header {
                display: none;
            }
body[data-tool-mode="image"] .image-studio-shell,
            body[data-tool-mode="video"] .image-studio-shell,
            body[data-tool-mode="image"] .image-studio-content,
            body[data-tool-mode="video"] .image-studio-content,
            body[data-tool-mode="image"] .image-studio-main,
            body[data-tool-mode="video"] .image-studio-main,
            body[data-tool-mode="image"] .image-studio-prompt-card,
            body[data-tool-mode="video"] .image-studio-prompt-card {
                width: 100%;
                min-width: 0;
                max-width: 100%;
                overflow-x: hidden;
                -webkit-text-size-adjust: 100%;
            }
.image-studio-shell {
                gap: 12px;
                width: 100%;
                max-width: 100%;
                min-width: 0;
            }
.image-studio-mobile-hero {
                display: grid;
                gap: 8px;
                justify-items: center;
                text-align: center;
                padding: 42px 10px 6px;
                position: relative;
                z-index: 1;
            }
.image-studio-mobile-hero strong {
                display: block;
                color: #0f172a;
                font-size: 16px;
                line-height: 1.2;
                letter-spacing: -0.03em;
            }
.image-studio-mobile-hero span {
                display: block;
                color: #9aa6b8;
                font-size: 14px;
                line-height: 1.5;
            }
body[data-ui-theme="dark"] .image-studio-mobile-hero strong {
                color: #eef2ff;
            }
body[data-ui-theme="dark"] .image-studio-mobile-hero span {
                color: #8a9bb4;
            }
.image-studio-prompt-card {
                border-radius: 28px;
                padding: 0;
                border: 1px solid rgba(96, 135, 255, 0.22);
                box-shadow: 0 18px 38px rgba(37, 99, 255, 0.1);
                overflow: hidden;
            }
.studio-reference-bar {
                padding: 14px 16px 0;
            }
.image-studio-input-shell {
                border-radius: 0;
                background: transparent;
                box-shadow: none;
            }
.image-studio-input {
                min-height: 114px;
                padding: 16px 132px 18px 18px;
                font-size: 16px;
                line-height: 1.65;
            }
.image-studio-input::placeholder {
                color: #b4bcc9;
                opacity: 1;
            }
.image-studio-input-tools {
                left: 12px;
                right: 12px;
                bottom: 12px;
                gap: 0;
            }
.image-studio-toolbar {
                align-items: center;
                justify-content: space-between;
                gap: 10px;
                padding: 8px 12px 12px;
                position: relative;
                background: rgba(255, 255, 255, 0.92);
                border-top: 1px solid rgba(15, 23, 42, 0.05);
            }
.image-studio-toolbar-left {
                width: 100%;
                flex-wrap: nowrap;
                overflow-x: auto;
                overflow-y: visible;
                padding-bottom: 0;
                scrollbar-width: none;
            }
.image-studio-toolbar-left::-webkit-scrollbar {
                display: none;
            }
.image-studio-toolbar-right {
                width: auto;
                justify-content: flex-end;
                align-items: center;
                gap: 0;
            }
.image-studio-toolbar-control,
            .image-studio-inline-btn,
            .image-studio-tool-link,
            .image-studio-toolbar-divider {
                flex: 0 0 auto;
            }
.image-studio-toolbar-control {
                position: relative;
            }
.image-studio-more-panel {
                display: contents;
            }
.image-studio-toolbar-left > .image-studio-toolbar-control,
            .image-studio-toolbar-left > #image-studio-template-btn,
            .image-studio-toolbar-left > #image-studio-advanced-btn {
                display: inline-flex !important;
            }
.image-studio-tool-meta {
                display: none;
            }
.image-studio-toolbar-left > #image-studio-mode-image,
            .image-studio-toolbar-left > #image-studio-mode-video,
            .image-studio-toolbar-left > #image-studio-upload-btn {
                display: inline-flex;
            }
.image-studio-toolbar-left > #image-studio-upload-btn {
                order: 4;
            }
#chat-compose-field.is-media-mode .image-studio-toolbar-left > .image-studio-toolbar-control,
            #chat-compose-field.is-media-mode .image-studio-toolbar-left > #image-studio-template-btn,
            #chat-compose-field.is-media-mode .image-studio-toolbar-left > #image-studio-advanced-btn {
                display: inline-flex !important;
            }
#chat-compose-field.is-media-mode .image-studio-toolbar-left > #image-studio-mode-image,
            #chat-compose-field.is-media-mode .image-studio-toolbar-left > #image-studio-mode-video,
            #chat-compose-field.is-media-mode .image-studio-toolbar-left > #image-studio-upload-btn {
                display: inline-flex;
            }
.image-studio-toolbar-left > #image-studio-template-btn,
            .image-studio-toolbar-left > #image-studio-advanced-btn,
            #chat-compose-field.is-media-mode .image-studio-toolbar-left > #image-studio-template-btn,
            #chat-compose-field.is-media-mode .image-studio-toolbar-left > #image-studio-advanced-btn {
                display: none !important;
            }
.image-studio-gallery-shell,
            .image-studio-template-panel,
            #image-studio-template-btn {
                display: none !important;
            }
.image-studio-popover {
                position: fixed;
                left: 12px;
                right: 12px;
                top: auto;
                bottom: 12px;
                min-width: 0;
                max-width: none;
                max-height: min(52vh, 420px);
                padding: 12px;
                border-radius: 22px;
                z-index: 120;
            }
.image-studio-popover-backdrop {
                position: fixed;
                inset: 0;
                z-index: 218;
                border: none;
                padding: 0;
                background: rgba(15, 23, 42, 0.42);
                backdrop-filter: blur(3px);
            }
body.mobile-studio-popover-open .image-studio-popover-backdrop {
                display: block;
            }
.image-studio-popover.is-mobile-sheet {
                position: fixed;
                left: 10px;
                right: 10px;
                top: auto;
                bottom: max(20px, env(safe-area-inset-bottom, 0px));
                z-index: 220;
                width: auto;
                min-width: 0;
                max-width: none;
                max-height: min(68vh, 560px);
                max-height: min(68dvh, 560px);
                padding: 12px;
                border-radius: 24px;
                overflow-x: hidden;
                overflow-y: auto;
                overscroll-behavior: contain;
                box-shadow: 0 26px 72px rgba(15, 23, 42, 0.28);
                animation: mobile-studio-sheet-in .2s ease-out;
            }
.image-studio-popover.is-mobile-sheet::before {
                content: attr(data-mobile-title);
                display: block;
                position: sticky;
                top: -12px;
                z-index: 2;
                margin: -12px -12px 10px;
                padding: 16px 16px 12px;
                border-bottom: 1px solid rgba(15, 23, 42, 0.06);
                background: rgba(255, 255, 255, 0.98);
                color: #111827;
                font-size: 16px;
                font-weight: 750;
                line-height: 1.4;
            }
.image-studio-popover.is-mobile-sheet[data-mobile-kind="duration"] .image-studio-popover-grid,
            .image-studio-popover.is-mobile-sheet[data-mobile-kind="ratio"] .image-studio-popover-grid {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }
.image-studio-popover.is-mobile-sheet[data-mobile-kind="duration"] .image-studio-popover-item {
                min-height: 48px;
                text-align: center;
            }
body[data-ui-theme="dark"] .image-studio-popover.is-mobile-sheet::before {
                border-bottom-color: rgba(148, 163, 184, 0.1);
                background: rgba(10, 18, 32, 0.98);
                color: #eef4ff;
            }
@keyframes mobile-studio-sheet-in {
                from {
                    opacity: 0;
                    transform: translateY(18px);
                }
                to {
                    opacity: 1;
                    transform: translateY(0);
                }
            }
#image-studio-style-menu {
                min-width: 0;
            }
.image-studio-popover-grid {
                gap: 8px;
            }
.image-studio-popover-item.has-detail {
                min-height: 58px;
            }
.image-studio-template-panel {
                padding: 12px;
                border-radius: 24px;
                max-height: min(44vh, 460px);
            }
.image-studio-template-panel.is-compact {
                padding: 10px;
            }
.image-studio-template-compact-head {
                padding: 2px 0 10px;
            }
.image-studio-template-masonry {
                grid-template-columns: repeat(3, minmax(0, 1fr));
                gap: 10px;
            }
.image-studio-template-compact-grid {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }
.image-studio-template-column {
                display: block;
            }
.image-studio-template-spotlight {
                min-height: 184px;
            }
.image-studio-template-mini {
                min-height: 60px;
                height: 60px;
            }
.image-studio-template-card.hero,
            .image-studio-template-card.landscape,
            .image-studio-template-card.wide {
                grid-column: span 2;
            }
.image-studio-template-card.hero {
                grid-row: span 1;
            }
.image-studio-quickbar,
            .image-studio-summary {
                display: none;
            }
.image-studio-send-btn {
                width: 44px;
                min-width: 44px;
                padding: 0;
                justify-content: center;
                min-height: 44px;
                border-radius: 999px;
            }
.image-studio-send-btn span {
                display: none;
            }
.image-studio-gallery {
                grid-template-columns: repeat(2, minmax(0, 1fr));
                gap: 12px;
            }
.image-studio-tools {
                display: grid;
                grid-template-columns: repeat(3, minmax(0, 1fr));
                grid-auto-flow: initial;
                overflow: visible;
                gap: 10px;
                padding-bottom: 0;
                width: 100%;
            }
.image-studio-tools::-webkit-scrollbar {
                display: none;
            }
.image-studio-tool-card {
                min-width: 0;
                min-height: 96px;
                width: 100%;
                grid-template-columns: 1fr;
                justify-items: center;
                align-content: center;
                text-align: center;
                padding: 12px 8px;
                row-gap: 8px;
                border-radius: 20px;
            }
.image-studio-tool-copy {
                width: 100%;
                display: grid;
                justify-items: center;
                gap: 2px;
            }
.image-studio-tool-copy-top {
                display: block;
                width: 100%;
            }
.image-studio-tool-card strong {
                display: block;
                font-size: 13px;
                line-height: 1.35;
                text-align: center;
            }
.image-studio-tool-card .image-studio-tool-tag,
            .image-studio-tool-card .image-studio-tool-copy > span:last-child {
                display: none;
            }
.image-studio-tool-thumb {
                width: 52px;
                height: 52px;
                margin: 0 auto;
            }
.mobile-chat-toolbar {
                display: inline-flex;
            }}
@media (max-width: 560px){.image-studio-mobile-hero {
                padding-top: 48px;
            }
.image-studio-mobile-hero strong {
                font-size: 22px;
            }
.image-studio-gallery {
                grid-template-columns: repeat(2, minmax(0, 1fr));
                gap: 10px;
            }
.image-studio-template-panel {
                padding: 10px;
                border-radius: 22px;
            }
.image-studio-template-panel.is-compact {
                padding: 8px;
                border-radius: 20px;
            }
.image-studio-template-compact-head {
                align-items: flex-start;
                gap: 10px;
            }
.image-studio-template-refresh {
                min-height: 28px;
                padding: 0 10px;
                font-size: 11px;
            }
.image-studio-template-head {
                flex-direction: column;
                align-items: flex-start;
                gap: 10px;
            }
.image-studio-template-filters {
                gap: 6px;
                margin-bottom: 10px;
            }
.image-studio-template-filter {
                min-height: 30px;
                padding: 0 10px;
                font-size: 11px;
            }
.image-studio-template-masonry {
                grid-template-columns: repeat(2, minmax(0, 1fr));
                gap: 10px;
            }
.image-studio-template-spotlight-copy {
                padding: 14px 12px 12px;
            }
.image-studio-template-spotlight-copy strong {
                font-size: 14px;
            }
.image-studio-template-spotlight-copy p {
                font-size: 11px;
            }
.image-studio-template-mini-copy {
                padding: 5px 8px;
                font-size: 10px;
            }
.image-studio-template-spotlight-hover {
                padding: 20px 10px 10px;
            }
.image-studio-template-card.landscape,
            .image-studio-template-card.wide,
            .image-studio-template-card.hero {
                grid-column: span 2;
                grid-row: span 1;
            }}
@media (max-width: 920px){body[data-tool-mode="image"] .image-create-studio,
            body[data-tool-mode="video"] .image-create-studio {
                padding: 10px 12px 24px;
            }
body[data-tool-mode="image"] .image-studio-shell,
            body[data-tool-mode="video"] .image-studio-shell {
                gap: 16px;
            }
body[data-tool-mode="image"] .image-studio-mobile-hero,
            body[data-tool-mode="video"] .image-studio-mobile-hero {
                padding: 36px 8px 8px;
            }
body[data-tool-mode="image"] .image-studio-prompt-card,
            body[data-tool-mode="video"] .image-studio-prompt-card {
                position: relative;
                border-radius: 26px;
                overflow: visible;
                box-shadow: 0 18px 40px rgba(15, 23, 42, 0.08);
            }
body[data-tool-mode="image"] .image-studio-input,
            body[data-tool-mode="video"] .image-studio-input {
                min-height: 124px;
                padding: 18px 18px 72px;
                font-size: 16px;
                line-height: 1.65;
            }
body[data-tool-mode="image"] .image-studio-toolbar,
            body[data-tool-mode="video"] .image-studio-toolbar {
                position: absolute;
                left: 14px;
                right: 14px;
                bottom: 12px;
                padding: 0;
                gap: 0;
                background: transparent;
                border-top: none;
            }
body[data-tool-mode="image"] .image-studio-toolbar-left,
            body[data-tool-mode="video"] .image-studio-toolbar-left {
                position: relative;
                width: 100%;
                gap: 8px;
                padding-right: 58px;
                overflow: visible;
                align-items: center;
            }
body[data-tool-mode="image"] .image-studio-toolbar-right,
            body[data-tool-mode="video"] .image-studio-toolbar-right {
                position: absolute;
                right: 0;
                bottom: 0;
                width: auto;
            }
body[data-tool-mode="image"] .image-studio-toolbar-divider,
            body[data-tool-mode="video"] .image-studio-toolbar-divider {
                display: none !important;
            }
body[data-tool-mode="image"] .image-studio-inline-btn,
            body[data-tool-mode="video"] .image-studio-inline-btn,
            body[data-tool-mode="image"] .image-studio-tool-link,
            body[data-tool-mode="video"] .image-studio-tool-link {
                min-height: 34px;
                padding: 0 12px;
                border-radius: 12px;
                font-size: 14px;
                gap: 6px;
                box-shadow: none;
            }
body[data-tool-mode="image"] .image-studio-inline-btn,
            body[data-tool-mode="video"] .image-studio-inline-btn {
                background: #f3f4f6;
                border-color: rgba(15, 23, 42, 0.04);
            }
body[data-tool-mode="image"] .image-studio-inline-btn.active,
            body[data-tool-mode="video"] .image-studio-inline-btn.active {
                background: #ffffff;
                color: #111827;
                border-color: rgba(37, 99, 255, 0.14);
                box-shadow: 0 8px 18px rgba(15, 23, 42, 0.05);
            }
body[data-tool-mode="image"] .image-studio-inline-close,
            body[data-tool-mode="video"] .image-studio-inline-close {
                display: none !important;
            }
body[data-tool-mode="image"] #image-studio-upload-btn,
            body[data-tool-mode="video"] #image-studio-upload-btn {
                background: rgba(255, 255, 255, 0.96);
                border-color: rgba(15, 23, 42, 0.06);
            }
body[data-tool-mode="image"] #image-studio-upload-btn .image-studio-tool-icon,
            body[data-tool-mode="video"] #image-studio-upload-btn .image-studio-tool-icon {
                width: 14px;
                height: 14px;
                flex: 0 0 14px;
            }
body[data-tool-mode="image"] #image-studio-upload-btn .image-studio-tool-icon svg,
            body[data-tool-mode="video"] #image-studio-upload-btn .image-studio-tool-icon svg {
                width: 14px;
                height: 14px;
            }
body[data-tool-mode="image"] #image-studio-mobile-more-btn,
            body[data-tool-mode="video"] #image-studio-mobile-more-btn {
                display: inline-flex !important;
                width: 34px;
                min-width: 34px;
                padding: 0;
                justify-content: center;
                background: rgba(244, 244, 245, 0.96);
                border-color: rgba(15, 23, 42, 0.04);
            }
#chat-compose-field.is-media-mode #image-studio-mobile-more-btn {
                display: none !important;
            }
body[data-tool-mode="image"] #image-studio-mobile-more-btn.active,
            body[data-tool-mode="video"] #image-studio-mobile-more-btn.active {
                background: #ffffff;
                border-color: rgba(37, 99, 255, 0.14);
            }
body[data-tool-mode="image"] .image-studio-toolbar-left > .image-studio-toolbar-control,
            body[data-tool-mode="video"] .image-studio-toolbar-left > .image-studio-toolbar-control {
                display: none !important;
            }
body[data-tool-mode="image"] .image-studio-more-panel,
            body[data-tool-mode="video"] .image-studio-more-panel {
                display: none !important;
                position: absolute;
                left: 0;
                right: 0;
                bottom: calc(100% + 10px);
                width: auto;
                max-width: none;
                transform: none;
                max-height: min(42vh, 320px);
                overflow-y: auto;
                overflow-x: hidden;
                padding: 8px;
                border-radius: 18px;
                border: 1px solid rgba(15, 23, 42, 0.08);
                background: rgba(255, 255, 255, 0.98);
                box-shadow: 0 18px 40px rgba(15, 23, 42, 0.14);
                z-index: 160;
                grid-template-columns: 1fr;
                gap: 8px;
                pointer-events: auto;
            }
body[data-tool-mode="image"] .image-studio-more-panel.open,
            body[data-tool-mode="video"] .image-studio-more-panel.open {
                display: grid !important;
            }
body[data-tool-mode="image"] .image-studio-more-panel .image-studio-toolbar-control,
            body[data-tool-mode="video"] .image-studio-more-panel .image-studio-toolbar-control {
                display: block !important;
                position: relative;
            }
body[data-tool-mode="image"] .image-studio-more-panel .image-studio-tool-link,
            body[data-tool-mode="video"] .image-studio-more-panel .image-studio-tool-link {
                width: 100%;
                min-height: 42px;
                justify-content: space-between;
                padding: 0 12px;
                border: none;
                border-radius: 14px;
                background: #ffffff;
                box-shadow: inset 0 0 0 1px rgba(15, 23, 42, 0.06);
            }
body[data-tool-mode="image"] .image-studio-more-panel .image-studio-tool-link-copy,
            body[data-tool-mode="video"] .image-studio-more-panel .image-studio-tool-link-copy {
                display: inline-flex;
                align-items: center;
                gap: 6px;
            }
body[data-tool-mode="image"] .image-studio-more-panel .image-studio-tool-link-label,
            body[data-tool-mode="video"] .image-studio-more-panel .image-studio-tool-link-label {
                color: #111827;
                font-size: 14px;
            }
body[data-tool-mode="image"] .image-studio-more-panel .image-studio-tool-link-value,
            body[data-tool-mode="video"] .image-studio-more-panel .image-studio-tool-link-value {
                max-width: 80px;
                color: #64748b;
                font-size: 14px;
                font-weight: 600;
            }
body[data-tool-mode="image"] .image-studio-gallery-shell,
            body[data-tool-mode="video"] .image-studio-gallery-shell {
                display: block !important;
            }
body[data-tool-mode="image"] .image-studio-gallery-head,
            body[data-tool-mode="video"] .image-studio-gallery-head,
            body[data-tool-mode="image"] .image-studio-gallery-filters,
            body[data-tool-mode="video"] .image-studio-gallery-filters {
                display: none !important;
            }
body[data-tool-mode="image"] .image-studio-tools,
            body[data-tool-mode="video"] .image-studio-tools {
                display: flex;
                gap: 10px;
                overflow-x: auto;
                overflow-y: hidden;
                padding: 0 2px 2px;
                scroll-snap-type: x proximity;
            }
body[data-tool-mode="image"] .image-studio-tools::-webkit-scrollbar,
            body[data-tool-mode="video"] .image-studio-tools::-webkit-scrollbar {
                display: none;
            }
body[data-tool-mode="image"] .image-studio-tool-card,
            body[data-tool-mode="video"] .image-studio-tool-card {
                flex: 0 0 102px;
                min-width: 102px;
                min-height: 76px;
                padding: 10px 8px 12px;
                border-radius: 16px;
                display: grid;
                grid-template-columns: 1fr;
                justify-items: center;
                align-content: flex-start;
                gap: 8px;
                scroll-snap-align: start;
            }
body[data-tool-mode="image"] .image-studio-tool-copy,
            body[data-tool-mode="video"] .image-studio-tool-copy {
                width: 100%;
                display: grid;
                justify-items: center;
                gap: 2px;
            }
body[data-tool-mode="image"] .image-studio-tool-copy-top,
            body[data-tool-mode="video"] .image-studio-tool-copy-top {
                width: 100%;
            }
body[data-tool-mode="image"] .image-studio-tool-card strong,
            body[data-tool-mode="video"] .image-studio-tool-card strong {
                font-size: 12px;
                line-height: 1.35;
                text-align: center;
            }
body[data-tool-mode="image"] .image-studio-tool-card .image-studio-tool-tag,
            body[data-tool-mode="video"] .image-studio-tool-card .image-studio-tool-tag,
            body[data-tool-mode="image"] .image-studio-tool-card .image-studio-tool-copy > span:last-child,
            body[data-tool-mode="video"] .image-studio-tool-card .image-studio-tool-copy > span:last-child {
                display: none;
            }
body[data-tool-mode="image"] .image-studio-tool-thumb,
            body[data-tool-mode="video"] .image-studio-tool-thumb {
                grid-column: auto;
                grid-row: auto;
                width: 38px;
                height: 38px;
                margin: 0 auto;
                border-radius: 10px;
                padding: 7px;
                display: inline-flex !important;
            }
body[data-tool-mode="image"] .image-studio-send-btn,
            body[data-tool-mode="video"] .image-studio-send-btn {
                width: 44px;
                min-width: 44px;
                min-height: 44px;
                padding: 0;
                border-radius: 999px;
                justify-content: center;
                background: linear-gradient(135deg, #2563eb 0%, #4f7cff 100%);
                color: #ffffff;
                box-shadow: 0 14px 28px rgba(37, 99, 235, 0.22);
            }
body[data-tool-mode="image"] .image-studio-send-btn svg,
            body[data-tool-mode="video"] .image-studio-send-btn svg {
                width: 22px;
                height: 22px;
            }
body[data-tool-mode="image"] .image-studio-send-btn.is-busy svg,
            body[data-tool-mode="video"] .image-studio-send-btn.is-busy svg {
                animation: chat-send-spin .9s linear infinite;
            }
body[data-tool-mode="image"] .image-studio-send-btn.has-text,
            body[data-tool-mode="video"] .image-studio-send-btn.has-text {
                background: linear-gradient(135deg, #2563eb 0%, #4f7cff 100%);
                color: #ffffff;
                box-shadow: 0 14px 28px rgba(37, 99, 235, 0.22);
            }
body[data-tool-mode="image"] .image-studio-send-btn.is-voice,
            body[data-tool-mode="video"] .image-studio-send-btn.is-voice {
                background: #eef3fb;
                color: #1d4ed8;
                box-shadow: 0 0 0 1.5px rgba(37, 99, 235, 0.18);
            }
body[data-tool-mode="image"] .image-studio-send-btn.is-listening,
            body[data-tool-mode="video"] .image-studio-send-btn.is-listening {
                background: #eef3fb;
                color: #1d4ed8;
                box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.18);
            }
body[data-tool-mode="image"] .image-studio-send-btn.is-listening svg,
            body[data-tool-mode="video"] .image-studio-send-btn.is-listening svg {
                animation: chat-voice-pulse 1.1s ease-in-out infinite;
            }
body[data-tool-mode="image"] .image-studio-gallery,
            body[data-tool-mode="video"] .image-studio-gallery {
                grid-template-columns: repeat(2, minmax(0, 1fr));
                gap: 12px;
            }
body[data-tool-mode="image"] .image-studio-preset-card,
            body[data-tool-mode="video"] .image-studio-preset-card {
                display: block;
                border-radius: 18px;
                overflow: hidden;
                position: relative;
            }
body[data-tool-mode="image"] .image-studio-preset-card.large,
            body[data-tool-mode="video"] .image-studio-preset-card.large {
                grid-column: span 1;
            }
body[data-tool-mode="image"] .image-studio-preset-stage,
            body[data-tool-mode="video"] .image-studio-preset-stage {
                min-height: 180px;
            }
body[data-tool-mode="image"] .image-studio-preset-card.portrait .image-studio-preset-stage,
            body[data-tool-mode="video"] .image-studio-preset-card.portrait .image-studio-preset-stage {
                min-height: 214px;
            }
body[data-tool-mode="image"] .image-studio-preset-card.square .image-studio-preset-stage,
            body[data-tool-mode="video"] .image-studio-preset-card.square .image-studio-preset-stage {
                min-height: 212px;
            }
body[data-tool-mode="image"] .image-studio-preset-overlay,
            body[data-tool-mode="video"] .image-studio-preset-overlay {
                position: absolute;
                inset: auto 0 0 0;
                padding: 18px 12px 12px;
                background: linear-gradient(180deg, rgba(9, 14, 26, 0) 0%, rgba(9, 14, 26, 0.2) 18%, rgba(9, 14, 26, 0.9) 100%);
                color: #ffffff;
                gap: 6px;
                opacity: 0;
                transform: translateY(10px);
                transition: opacity .2s ease, transform .2s ease;
                pointer-events: none;
            }
body[data-tool-mode="image"] .image-studio-preset-overlay strong,
            body[data-tool-mode="video"] .image-studio-preset-overlay strong {
                color: #ffffff;
                font-size: 14px;
            }
body[data-tool-mode="image"] .image-studio-preset-overlay p,
            body[data-tool-mode="video"] .image-studio-preset-overlay p {
                color: rgba(255, 255, 255, 0.84);
                font-size: 11px;
                line-height: 1.5;
            }
body[data-tool-mode="image"] .image-studio-preset-action,
            body[data-tool-mode="video"] .image-studio-preset-action {
                position: static;
                opacity: 1;
                transform: none;
                justify-content: flex-start;
                pointer-events: auto;
            }
body[data-tool-mode="image"] .image-studio-preset-action button,
            body[data-tool-mode="video"] .image-studio-preset-action button {
                min-height: 30px;
                padding: 0 12px;
                background: rgba(255, 255, 255, 0.96);
                color: #111827;
                box-shadow: none;
            }
body[data-tool-mode="image"] .image-studio-preset-card.is-revealed .image-studio-preset-overlay,
            body[data-tool-mode="video"] .image-studio-preset-card.is-revealed .image-studio-preset-overlay {
                opacity: 1;
                transform: translateY(0);
                pointer-events: auto;
            }
body[data-tool-mode="image"] .image-studio-preset-card.is-revealed .image-studio-preset-action,
            body[data-tool-mode="video"] .image-studio-preset-card.is-revealed .image-studio-preset-action {
                pointer-events: auto;
            }
body[data-ui-theme="dark"][data-tool-mode="image"] .image-studio-prompt-card,
            body[data-ui-theme="dark"][data-tool-mode="video"] .image-studio-prompt-card {
                box-shadow: 0 18px 40px rgba(2, 6, 23, 0.28);
            }
body[data-ui-theme="dark"][data-tool-mode="image"] .image-studio-inline-btn,
            body[data-ui-theme="dark"][data-tool-mode="video"] .image-studio-inline-btn {
                background: rgba(15, 23, 42, 0.72);
                border-color: rgba(148, 163, 184, 0.08);
            }
body[data-ui-theme="dark"][data-tool-mode="image"] .image-studio-inline-btn.active,
            body[data-ui-theme="dark"][data-tool-mode="video"] .image-studio-inline-btn.active {
                background: rgba(22, 32, 52, 0.98);
            }
body[data-ui-theme="dark"][data-tool-mode="image"] #image-studio-upload-btn,
            body[data-ui-theme="dark"][data-tool-mode="video"] #image-studio-upload-btn,
            body[data-ui-theme="dark"][data-tool-mode="image"] #image-studio-mobile-more-btn,
            body[data-ui-theme="dark"][data-tool-mode="video"] #image-studio-mobile-more-btn {
                background: rgba(15, 23, 42, 0.82);
                border-color: rgba(148, 163, 184, 0.08);
            }
body[data-ui-theme="dark"][data-tool-mode="image"] .image-studio-more-panel,
            body[data-ui-theme="dark"][data-tool-mode="video"] .image-studio-more-panel {
                background: rgba(10, 18, 32, 0.98);
                border-color: rgba(148, 163, 184, 0.12);
                box-shadow: 0 18px 40px rgba(2, 6, 23, 0.34);
            }
body[data-ui-theme="dark"][data-tool-mode="image"] .image-studio-more-panel .image-studio-tool-link,
            body[data-ui-theme="dark"][data-tool-mode="video"] .image-studio-more-panel .image-studio-tool-link {
                background: rgba(15, 23, 42, 0.92);
                box-shadow: inset 0 0 0 1px rgba(148, 163, 184, 0.08);
            }}
@media (min-width: 921px) and (hover: hover) and (pointer: fine){.mobile-chat-toolbar,
            .mobile-chat-more-menu {
                display: none !important;
            }
body[data-tool-mode="image"] #image-studio-mobile-more-btn,
            body[data-tool-mode="video"] #image-studio-mobile-more-btn {
                display: none !important;
            }}
@media (min-width: 921px){#image-studio-mobile-more-btn {
                display: none !important;
            }}
@media (max-width: 920px){html {
                width: 100%;
                height: 100%;
                min-height: 100%;
                max-width: 100%;
                overflow: hidden;
                overscroll-behavior: none;
            }
body {
                position: fixed;
                inset: 0;
                width: 100%;
                height: 100vh;
                height: var(--mobile-viewport-height, 100dvh);
                min-height: 0;
                max-width: 100%;
                overflow: hidden;
                overscroll-behavior: none;
            }
.app {
                width: 100%;
                height: 100%;
                min-height: 0;
                max-height: 100%;
                max-width: 100%;
                overflow: hidden;
                overscroll-behavior: none;
            }
.workspace,
            body[data-mode="chat"] .workspace {
                width: 100%;
                height: 100%;
                min-height: 0;
                max-height: 100%;
                max-width: 100%;
                overflow: hidden;
                overscroll-behavior: none;
            }
body[data-mode="chat"] .stage,
            body[data-mode="chat"] .result-card {
                min-height: 0;
                max-height: 100%;
                overflow: hidden;
            }
body[data-mode="chat"] .result-content {
                min-height: 0;
                overflow-y: auto;
                overflow-x: hidden;
                overscroll-behavior-y: contain;
                -webkit-overflow-scrolling: touch;
            }
body[data-tool-mode="image"] .workspace,
            body[data-tool-mode="video"] .workspace {
                overflow-y: auto;
                overflow-x: hidden;
                overscroll-behavior-y: contain;
                -webkit-overflow-scrolling: touch;
            }
.history {
                height: 100vh;
                height: var(--mobile-viewport-height, 100dvh);
                min-height: 0;
                max-height: var(--mobile-viewport-height, 100dvh);
                overflow: hidden;
                overscroll-behavior: none;
            }
.history-main,
            .workspace-records-slot,
            .legal-doc-content {
                min-height: 0;
                overflow-y: auto;
                overflow-x: hidden;
                overscroll-behavior-y: contain;
                -webkit-overflow-scrolling: touch;
            }
.auth-overlay,
            .legal-doc-overlay,
            .user-settings-overlay {
                position: fixed;
                inset: 0;
                width: 100%;
                height: 100vh;
                height: var(--mobile-viewport-height, 100dvh);
                max-width: 100%;
                overflow: hidden;
                overscroll-behavior: none;
            }
.auth-mask {
                touch-action: none;
                -webkit-text-size-adjust: 100%;
            }
html {
                touch-action: none;
            }
body input,
            body textarea,
            body [contenteditable="true"] {
                -webkit-user-select: text;
                user-select: text;
            }
.auth-dialog {
                top: 50%;
                left: 50%;
                width: calc(100% - 16px);
                max-width: 520px;
                height: auto;
                max-height: calc(var(--mobile-viewport-height, 100dvh) - 16px);
                padding: 18px 16px 16px;
                border-radius: 24px;
                overflow: hidden;
            }
.auth-layout {
                display: block;
                width: 100%;
                min-width: 0;
                min-height: 0;
                max-height: calc(var(--mobile-viewport-height, 100dvh) - 50px);
                overflow: hidden;
            }
.auth-main {
                width: 100%;
                min-width: 0;
                min-height: 0;
                max-height: calc(var(--mobile-viewport-height, 100dvh) - 50px);
                padding: 2px 2px 4px;
                overflow-y: auto;
                overflow-x: hidden;
                overscroll-behavior-y: contain;
                -webkit-overflow-scrolling: touch;
            }
.auth-aside {
                display: none;
            }
.auth-dialog-head {
                gap: 6px;
                padding-right: 34px;
            }
.auth-dialog-head h3 {
                font-size: 20px;
            }
.auth-dialog-head p {
                font-size: 13px;
                line-height: 1.55;
            }
.auth-dialog-badge {
                min-height: 26px;
                padding: 0 10px;
                font-size: 11px;
            }
.auth-mode-tabs {
                margin-top: 12px;
            }
.auth-form {
                gap: 12px;
            }
.auth-field {
                gap: 6px;
            }
.auth-field input {
                min-height: 44px;
                font-size: 16px;
            }
.chat-input-wrap textarea {
                font-size: 16px;
            }
.auth-legal-copy {
                line-height: 1.55;
            }
.auth-submit-btn {
                min-height: 44px;
            }
.legal-doc-dialog {
                width: calc(100% - 16px);
                max-height: calc(var(--mobile-viewport-height, 100dvh) - 16px);
            }}
@media (max-width: 920px){html,
            body {
                width: 100%;
                max-width: 100%;
                min-width: 0;
                overflow-x: clip;
            }
.app,
            .workspace,
            .stage,
            .result-card,
            .result-content,
            .composer,
            #chat-compose-field,
            .field,
            .chat-input-wrap {
                min-width: 0;
                max-width: 100%;
                box-sizing: border-box;
            }
.mobile-chat-topbar {
                position: relative;
                top: auto;
                width: 100%;
                max-width: 100%;
                backdrop-filter: none;
            }
.mobile-chat-actions {
                position: absolute;
                top: 10px;
                right: 12px;
            }
body[data-mode="chat"] .chat-bubble,
            body[data-mode="chat"] .chat-bubble * {
                max-width: 100%;
                min-width: 0;
                overflow-wrap: anywhere;
                word-break: break-word;
            }
body[data-mode="chat"] .chat-input-wrap {
                width: 100%;
                overflow: visible;
            }
body[data-mode="chat"] .chat-input-wrap textarea {
                width: 100%;
                max-width: 100%;
                box-sizing: border-box;
                padding-bottom: 58px;
            }
body[data-mode="chat"] .chat-input-wrap + .mobile-chat-toolbar {
                position: relative;
                z-index: 4;
                width: max-content;
                max-width: calc(100% - 24px);
                height: 34px;
                margin: -44px 0 10px 12px;
                padding: 0;
                pointer-events: none;
            }
body[data-mode="chat"] .chat-input-wrap + .mobile-chat-toolbar .mobile-chat-toolbar-btn {
                pointer-events: auto;
                min-height: 34px;
                padding: 0 12px;
            }
body[data-mode="chat"] .chat-input-wrap + .mobile-chat-toolbar .mobile-chat-more-menu {
                max-width: calc(100vw - 24px);
                max-height: min(46vh, 360px);
                overflow-x: hidden;
                overflow-y: auto;
                pointer-events: auto;
            }}
@media (max-width: 560px){.mobile-chat-topbar {
                padding-left: 8px;
                padding-right: 8px;
            }
.mobile-chat-actions {
                right: 8px;
            }
body[data-mode="chat"] .composer {
                padding-left: 8px;
                padding-right: 8px;
            }
body[data-mode="chat"] .chat-input-wrap + .mobile-chat-toolbar {
                margin-left: 10px;
            }}
@media (max-width: 920px){html,
            body {
                width: 100%;
                height: 100%;
                min-width: 0;
                max-width: 100%;
                overflow-x: hidden;
            }
body[data-mode="chat"] {
                height: 100%;
                overflow: hidden;
                overscroll-behavior: none;
                overscroll-behavior-x: none;
            }
body[data-mode="chat"] .app,
            body[data-mode="chat"] .workspace {
                width: 100%;
                min-width: 0;
                max-width: 100%;
                height: 100vh;
                min-height: 100vh;
                max-height: 100vh;
                height: var(--mobile-viewport-height, 100dvh);
                min-height: var(--mobile-viewport-height, 100dvh);
                max-height: var(--mobile-viewport-height, 100dvh);
                overflow: hidden;
            }
body[data-mode="chat"] .mobile-chat-topbar {
                display: grid !important;
                grid-template-columns: max-content minmax(0, 1fr) max-content;
                width: 100%;
                min-width: 0;
                max-width: 100%;
                flex: 0 0 auto;
                padding-top: calc(env(safe-area-inset-top, 0px) + 10px);
                padding-right: calc(env(safe-area-inset-right, 0px) + 12px);
                padding-bottom: 10px;
                padding-left: calc(env(safe-area-inset-left, 0px) + 12px);
                overflow: visible;
            }
body[data-mode="chat"] .mobile-nav-trigger {
                display: inline-flex !important;
                visibility: visible !important;
                opacity: 1 !important;
                min-width: 66px;
                width: auto;
                flex: 0 0 auto;
                position: relative;
                z-index: 33;
            }
body[data-mode="chat"] .mobile-nav-pill {
                max-width: 100%;
                white-space: nowrap;
            }
body[data-mode="chat"] .mobile-chat-bar {
                min-width: 0;
                max-width: 100%;
                overflow: hidden;
            }
body[data-mode="chat"] .mobile-chat-actions {
                position: absolute;
                top: calc(env(safe-area-inset-top, 0px) + 10px);
                right: calc(env(safe-area-inset-right, 0px) + 12px);
                max-width: calc(100% - 84px);
                overflow: hidden;
            }
body[data-mode="chat"] .stage {
                flex: 1 1 auto;
                min-height: 0;
                height: auto;
                overflow: hidden;
            }
body[data-mode="chat"] .result-card {
                min-width: 0;
                min-height: 0;
                width: 100%;
                max-width: 100%;
                height: 100%;
                overflow: hidden;
            }
body[data-mode="chat"] .result-content {
                min-width: 0;
                min-height: 0;
                width: 100%;
                max-width: 100%;
                overflow-x: hidden;
                overflow-y: auto;
                overscroll-behavior: contain;
                -webkit-overflow-scrolling: touch;
            }
body[data-mode="chat"] .composer {
                flex: 0 0 auto;
                width: 100%;
                min-width: 0;
                max-width: 100%;
                margin: 0;
                border-radius: 20px 20px 0 0;
                padding-right: calc(env(safe-area-inset-right, 0px) + 10px);
                padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 10px);
                padding-left: calc(env(safe-area-inset-left, 0px) + 10px);
            }
body[data-mode="chat"] .workspace-disclaimer {
                flex: 0 0 auto;
                width: 100%;
                max-width: 100%;
                padding-right: calc(env(safe-area-inset-right, 0px) + 8px);
                padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 5px);
                padding-left: calc(env(safe-area-inset-left, 0px) + 8px);
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
            }}
@media (max-width: 920px){body[data-tool-mode="image"] .image-studio-gallery-shell,
            body[data-tool-mode="image"] .image-studio-gallery-head {
                display: grid !important;
            }
body[data-tool-mode="image"] .image-studio-gallery-head {
                grid-template-columns: minmax(0, 1fr) auto;
                align-items: start;
                gap: 10px;
            }
body[data-tool-mode="image"] .image-studio-gallery-refresh {
                display: inline-flex !important;
                align-items: center;
                justify-content: center;
                min-height: 32px;
                padding: 0 11px;
                white-space: nowrap;
                font-size: 12px;
            }
body[data-tool-mode="image"] .image-studio-gallery {
                grid-template-columns: repeat(2, minmax(0, 1fr));
                gap: 10px;
            }
body[data-mode="chat"] .workspace-disclaimer {
                min-height: 0;
                padding: 0 6px 5px;
                font-size: 10px;
                line-height: 1.2;
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
            }
body[data-mode="chat"] .chat-input-wrap {
                overflow: visible;
                border-radius: 20px;
                padding-bottom: 0;
                min-height: 64px !important;
                height: auto !important;
                box-sizing: border-box;
            }
body[data-mode="chat"] .chat-input-wrap textarea {
                min-height: 64px !important;
                height: 64px !important;
                max-height: 64px !important;
                resize: none;
                padding: 10px 112px 38px 14px;
                line-height: 1.45;
                font-size: 14px;
                overflow-x: hidden;
                overflow-y: auto;
                white-space: pre-wrap;
                overflow-wrap: anywhere;
                box-sizing: border-box;
            }
body[data-mode="chat"] .chat-input-hint {
                top: 12px;
                left: 14px;
                right: 88px;
                height: 22px;
                line-height: 22px;
                font-size: 14px;
                color: #94a3b8;
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
            }
body[data-mode="chat"] .chat-input-tools {
                right: 10px;
                bottom: 7px;
                gap: 6px;
                z-index: 5;
            }
body[data-mode="chat"] .mobile-chat-toolbar {
                display: flex;
                width: auto;
                min-height: 32px;
                box-sizing: border-box;
                align-items: center;
                gap: 4px;
                margin: 0;
                padding: 0 88px 5px 10px;
                position: absolute;
                left: 0;
                right: 0;
                bottom: 0;
                z-index: 4;
            }
body[data-mode="chat"] .mobile-chat-toolbar-btn {
                min-height: 28px;
                padding: 0 10px;
                border-radius: 999px;
                background: rgba(248, 250, 252, 0.92);
                border-color: rgba(15, 23, 42, 0.06);
                box-shadow: none;
                font-size: 12px;
            }
body[data-mode="chat"] .mobile-chat-toolbar .mobile-chat-more-menu {
                max-width: calc(100vw - 24px);
                max-height: min(46vh, 360px);
                overflow-x: hidden;
                overflow-y: auto;
            }
#chat-compose-field.is-media-mode .mobile-chat-toolbar,
            body[data-chat-entry-mode="work"] .mobile-chat-toolbar {
                display: none !important;
            }}
@media (max-width: 920px){html,
            body {
                position: fixed;
                inset: 0;
                width: 100%;
                max-width: 100%;
                min-width: 0;
                height: 100%;
                min-height: 0;
                max-height: 100%;
                overflow: hidden !important;
                overscroll-behavior: none;
                overscroll-behavior-x: none;
                touch-action: none;
            }
body[data-mode="chat"] .app,
            body[data-mode="chat"] .workspace,
            body[data-mode="chat"] .stage,
            body[data-mode="chat"] .result-card {
                width: 100%;
                max-width: 100%;
                min-width: 0;
                box-sizing: border-box;
                overflow-x: hidden !important;
            }
body[data-mode="chat"] .app,
            body[data-mode="chat"] .workspace,
            body[data-mode="chat"] .stage,
            body[data-mode="chat"] .result-card,
            body[data-mode="chat"] .result-content,
            body[data-mode="chat"] .composer,
            body[data-mode="chat"] .workspace-disclaimer,
            body[data-mode="chat"] .mobile-chat-topbar,
            body[data-mode="chat"] .mobile-chat-bar,
            body[data-mode="chat"] .mobile-chat-actions {
                min-width: 0;
                max-width: 100%;
                flex-shrink: 1;
            }
body[data-mode="chat"] * {
                min-width: 0;
                overflow-wrap: anywhere;
            }
body[data-mode="chat"] .app,
            body[data-mode="chat"] .workspace {
                height: var(--mobile-viewport-height, 100dvh);
                min-height: 0;
                max-height: var(--mobile-viewport-height, 100dvh);
                padding: 0 !important;
                margin: 0 !important;
                overflow-y: hidden !important;
            }
body[data-mode="chat"] .mobile-chat-topbar {
                position: relative !important;
                inset: auto !important;
                display: grid !important;
                grid-template-columns: max-content minmax(0, 1fr) max-content;
                width: 100% !important;
                max-width: 100% !important;
                min-width: 0;
                box-sizing: border-box;
                overflow: hidden !important;
                background: transparent;
                border: 0;
                box-shadow: none;
                backdrop-filter: none;
            }
body[data-mode="chat"] .mobile-nav-trigger,
            body[data-mode="chat"] .mobile-chat-actions {
                min-width: 0;
                max-width: 100%;
                box-sizing: border-box;
                overflow: hidden;
            }
body[data-mode="chat"] .mobile-nav-trigger,
            body[data-mode="chat"] .mobile-nav-pill,
            body[data-mode="chat"] .ui-language-switch,
            body[data-mode="chat"] .ui-language-switch-btn {
                -webkit-appearance: none;
                appearance: none;
                -webkit-tap-highlight-color: transparent;
            }
body[data-mode="chat"] .mobile-chat-actions {
                position: relative !important;
                top: auto !important;
                right: auto !important;
                justify-self: end;
                gap: 6px;
            }
body[data-mode="chat"] .mobile-nav-pill,
            body[data-mode="chat"] .ui-language-switch {
                overflow: hidden;
                isolation: isolate;
                box-shadow: none;
                background-clip: padding-box;
            }
body[data-mode="chat"] .mobile-nav-pill {
                max-width: 100%;
            }
body[data-mode="chat"] .ui-language-switch {
                flex: 0 1 auto;
                max-width: 100%;
                border-color: rgba(15, 23, 42, 0.08);
            }
body[data-mode="chat"] .result-content {
                width: 100%;
                max-width: 100%;
                min-width: 0;
                overflow-x: hidden !important;
                overflow-y: auto;
                overscroll-behavior: contain;
                touch-action: pan-y;
                -webkit-overflow-scrolling: touch;
            }
body[data-mode="chat"] .workspace-disclaimer {
                width: 100%;
                max-width: 100%;
                min-width: 0;
                box-sizing: border-box;
                display: flex;
                align-items: center;
                justify-content: center;
                flex-wrap: nowrap;
                gap: 6px;
                overflow: hidden;
                white-space: nowrap;
                text-overflow: clip;
            }
body[data-mode="chat"] .workspace-disclaimer > span {
                min-width: 0;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
            }
body[data-mode="chat"] .workspace-disclaimer > a {
                flex: 0 0 auto;
            }
body[data-mode="chat"] * {
                max-width: 100%;
                box-sizing: border-box;
            }
body[data-mode="chat"] .mobile-chat-more-menu {
                max-width: calc(100% - 16px) !important;
                overflow-x: hidden;
            }
body[data-mode="chat"][data-chat-entry-mode="work"] .empty-state {
                align-items: flex-start;
                justify-content: flex-start;
                padding-top: max(30px, calc(env(safe-area-inset-top, 0px) + 24px));
                padding-bottom: 28px;
                overflow-y: auto;
            }
body[data-mode="chat"][data-chat-entry-mode="work"] .chat-empty {
                width: 100%;
                min-height: 0;
                align-content: start;
                padding-top: 0;
                padding-bottom: 8px;
            }
body[data-tool-mode="image"] .image-studio-prompt-card {
                border: 0;
                border-radius: 0;
                background: transparent;
                box-shadow: none;
                overflow: visible;
            }
body[data-tool-mode="image"] .image-studio-input-shell {
                margin: 0;
                border: 1px solid rgba(96, 135, 255, 0.24);
                border-radius: 24px;
                background: rgba(248, 250, 252, 0.96);
                box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.48);
                overflow: hidden;
            }
body[data-tool-mode="image"] .image-studio-input {
                width: 100%;
                height: clamp(138px, 22vh, 182px);
                min-height: 0;
                max-height: 210px;
                resize: none;
                overflow-x: hidden;
                overflow-y: auto;
                box-sizing: border-box;
                padding: 16px 108px 68px 18px;
                line-height: 1.65;
            }
body[data-tool-mode="image"] .image-studio-toolbar {
                margin-top: 10px;
                padding: 0 4px;
                border: 0;
                background: transparent;
            }
body[data-ui-theme="dark"][data-tool-mode="image"] .image-studio-input-shell {
                background: rgba(15, 23, 42, 0.72);
                border-color: rgba(96, 165, 250, 0.28);
                box-shadow: inset 0 0 0 1px rgba(148, 163, 184, 0.12);
            }}
body.chat-landing[data-mode="chat"] .stage {
            display: none;
        }
body.chat-landing[data-mode="chat"] .workspace-chat-header-center {
            visibility: hidden;
            pointer-events: none;
        }
body.chat-landing[data-mode="chat"] .composer {
            position: absolute;
            top: 50%;
            left: 50%;
            z-index: 14;
            width: min(900px, calc(100% - 72px));
            max-width: 900px;
            margin: 0;
            padding: 0 0 18px;
            transform: translate(-50%, -40%);
            background: transparent;
            border: none;
            box-shadow: none;
        }
body.chat-landing[data-mode="chat"] .composer-top {
            display: block;
            margin-bottom: 14px;
            text-align: center;
        }
body.chat-landing[data-mode="chat"] #chat-compose-field {
            width: 100%;
            margin: 0;
        }
@media (max-width: 920px){body.chat-landing[data-mode="chat"] .composer {
                --landing-composer-head-space: 48px;
                --landing-input-center-offset: calc(var(--landing-composer-head-space) + 62px);
                top: calc(50% - var(--landing-input-center-offset));
                width: calc(100% - 20px);
                padding-bottom: 8px;
                transform: translateX(-50%);
            }
body.chat-landing[data-mode="chat"] .composer-title {
                font-size: 17px;
            }
body.chat-landing[data-mode="chat"] .workspace-disclaimer {
                right: 10px;
                bottom: 4px;
                left: 10px;
            }}
@media (min-width: 921px){body.chat-landing[data-mode="chat"] {
                --chat-sidebar-width: 370px;
                --chat-sidebar-resizer-width: 1px;
                background: #fff;
            }
body.chat-landing[data-mode="chat"] .app {
                background: #fff;
            }
body.chat-landing[data-mode="chat"] .history {
                padding: 30px 22px 18px;
                background: #fff;
                border-right: 1px solid #edf1f7;
            }
body.chat-landing[data-mode="chat"] .desktop-sidebar-resizer {
                display: flex;
                opacity: 0;
                pointer-events: none;
            }
body.chat-landing[data-mode="chat"] .sidebar-search-trigger {
                display: grid;
                min-height: 40px;
                padding: 0 10px;
                border-radius: 8px;
                box-shadow: none;
            }
body.chat-landing[data-mode="chat"] .sidebar-shell {
                gap: 22px;
                padding: 0 2px;
            }
body.chat-landing[data-mode="chat"] .sidebar-brand {
                display: grid;
                gap: 2px;
                align-items: start;
                padding: 0 10px;
            }
body.chat-landing[data-mode="chat"] .sidebar-brand-mark {
                display: none;
            }
body.chat-landing[data-mode="chat"] .sidebar-brand img {
                display: block;
                width: 160px;
                height: auto;
                max-height: 32px;
                border: 0;
                border-radius: 0;
                background: transparent;
                object-fit: contain;
                object-position: left center;
            }
body.chat-landing[data-mode="chat"] .sidebar-brand-wordmark {
                display: block;
                color: #0b73e8;
                font-family: Arial, sans-serif;
                font-size: 43px;
                font-weight: 800;
                letter-spacing: -2px;
                line-height: .92;
            }
body.chat-landing[data-mode="chat"] .sidebar-brand-wordmark span {
                display: inline-block;
                margin-left: 4px;
                color: #0688ea;
                font-size: 22px;
                font-weight: 700;
                letter-spacing: -4px;
                transform: translateY(-6px);
            }
body.chat-landing[data-mode="chat"] .sidebar-brand-copy {
                display: flex;
                align-items: baseline;
                gap: 2px;
                padding-top: 3px;
            }
body.chat-landing[data-mode="chat"] .sidebar-brand-copy strong,
            body.chat-landing[data-mode="chat"] .sidebar-brand-copy .sidebar-brand-suffix {
                display: inline;
                overflow: visible;
                font-size: 16px;
                font-weight: 700;
                line-height: 1.2;
                white-space: nowrap;
            }
body.chat-landing[data-mode="chat"] .sidebar-brand-copy strong {
                color: #0a70e5;
            }
body.chat-landing[data-mode="chat"] .sidebar-brand-copy .sidebar-brand-suffix {
                color: #0d72f5;
                font-size: 13px;
                font-weight: 600;
            }
body.chat-landing[data-mode="chat"] .sidebar-nav {
                gap: 4px;
            }
body.chat-landing[data-mode="chat"] .sidebar-nav-btn {
                min-height: 30px;
                padding: 0 10px;
                border-radius: 8px;
                color: #182b4c;
                font-size: 12px;
                font-weight: 600;
            }
body.chat-landing[data-mode="chat"] #sidebar-new-chat {
                width: calc(100% + 8px);
                margin-left: -4px;
                min-height: 54px;
                justify-content: center;
                border: 1px solid #126fff;
                color: #0b6ff0;
                background: #fff;
                font-size: 18px;
            }
body.chat-landing[data-mode="chat"] #sidebar-new-chat .rail-icon {
                display: inline-flex;
                align-items: center;
                gap: 12px;
            }
body.chat-landing[data-mode="chat"] #sidebar-new-chat .rail-icon::before {
                content: "+";
                display: inline-flex;
                align-items: center;
                justify-content: center;
                width: 24px;
                height: 24px;
                font-size: 30px;
                font-weight: 300;
                line-height: 1;
            }
body.chat-landing[data-mode="chat"] #sidebar-new-chat .rail-glyph {
                display: none;
            }
body.chat-landing[data-mode="chat"] .sidebar-nav-btn:not(#sidebar-new-chat) {
                justify-content: flex-start;
            }
body.chat-landing[data-mode="chat"] .sidebar-nav-btn:not(#sidebar-new-chat):hover,
            body.chat-landing[data-mode="chat"] .sidebar-nav-btn:not(#sidebar-new-chat).active {
                background: #f4f8ff;
                border-color: transparent;
                box-shadow: none;
                color: #0b6ff0;
            }
body.chat-landing[data-mode="chat"] .sidebar-nav-btn .rail-icon {
                color: currentColor;
            }
body.chat-landing[data-mode="chat"] .sidebar-nav-btn .rail-glyph {
                width: 14px;
                height: 14px;
            }
body.chat-landing[data-mode="chat"] .history-main {
                padding-top: 22px;
            }
body.chat-landing[data-mode="chat"] .sidebar-section-label {
                padding: 14px 10px 8px;
                color: #7b8ba5;
                font-size: 14px;
                font-weight: 600;
            }
body.chat-landing[data-mode="chat"] .conversation-list {
                gap: 2px;
            }
body.chat-landing[data-mode="chat"] .conversation-item {
                min-height: 30px;
                padding: 4px 10px;
                border-radius: 8px;
            }
body[data-mode="chat"] .conversation-item {
                min-height: 30px !important;
                padding: 4px 10px !important;
            }
body.chat-landing[data-mode="chat"] .conversation-title,
            body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .conversation-title {
                color: #273447;
            }
body.chat-landing[data-mode="chat"] .conversation-item-icon {
                color: #223b63;
            }
body.chat-landing[data-mode="chat"] .conversation-time {
                color: #7d899e;
            }
body.chat-landing[data-mode="chat"] .conversation-item:hover,
            body.chat-landing[data-mode="chat"] .conversation-item.active {
                background: #f6f9ff;
                border-color: transparent;
                box-shadow: none;
            }
body.chat-landing[data-mode="chat"] .conversation-item::before {
                display: none;
            }
body.chat-landing[data-mode="chat"] .history-account {
                padding: 18px 0 0;
                border-top: 1px solid #edf1f7;
            }
body.chat-landing[data-mode="chat"] .workspace-account-card {
                min-height: 68px;
            }
body.chat-landing[data-mode="chat"] .workspace-account-card .workspace-account-toggle {
                min-height: 66px;
                padding: 0;
                border-radius: 0;
                background: transparent;
                font-size: 15px;
            }
body.chat-landing[data-mode="chat"] .workspace-chat-header {
                min-height: 84px;
                padding: 0 32px;
                border-bottom: 1px solid #edf1f7;
                background: #fff;
                backdrop-filter: none;
            }
body.chat-landing[data-mode="chat"] .desktop-history-toggle {
                width: 28px;
                height: 28px;
                border: 0;
                border-radius: 0;
                background: transparent;
                color: #182b4c;
                padding: 0;
            }
body.chat-landing[data-mode="chat"] .desktop-history-toggle svg {
                display: block;
                width: 24px;
                height: 24px;
                margin: 0;
            }
body.chat-landing[data-mode="chat"] .workspace-chat-header-center strong {
                color: #122746;
                font-size: 14px;
                font-weight: 600;
                line-height: 1.2;
                letter-spacing: 0;
            }
body.chat-landing[data-mode="chat"] .workspace-chat-header-center span {
                display: none;
            }
body.chat-landing[data-mode="chat"] .workspace-chat-header-right {
                gap: 18px;
            }
body.chat-landing[data-mode="chat"] .workspace-header-link,
            body.chat-landing[data-mode="chat"] .ui-language-switch-btn {
                color: #8a95a6;
                font-size: 15px;
            }
body.chat-landing[data-mode="chat"] .ui-language-switch {
                gap: 0;
                padding: 0;
                border: 0;
                border-radius: 0;
                background: transparent;
                box-shadow: none;
            }
body.chat-landing[data-mode="chat"] .ui-language-switch-btn {
                min-width: auto;
                min-height: 30px;
                padding: 0 8px;
                border-radius: 0;
                background: transparent;
                color: #71809a;
                box-shadow: none;
            }
body.chat-landing[data-mode="chat"] .ui-language-switch-btn + .ui-language-switch-btn {
                border-left: 1px solid #d8e1ee;
            }
body.chat-landing[data-mode="chat"] .ui-language-switch-btn.active {
                background: transparent;
                color: #111827 !important;
                box-shadow: none;
            }
body.chat-landing[data-mode="chat"] .ui-language-switch-btn:not(.active) {
                color: #71809a !important;
            }
body.chat-landing[data-mode="chat"] .workspace-header-link {
                color: #71809a;
            }
body.chat-landing[data-mode="chat"] .workspace-header-login {
                min-width: 96px;
                min-height: 44px;
                padding: 0 22px;
                border-radius: 999px;
                background: #102746;
                color: #fff;
                font-size: 15px;
            }
body.chat-landing[data-mode="chat"] .workspace {
                position: relative;
                background: #fff;
            }
body.chat-landing[data-mode="chat"] .composer {
                --landing-composer-head-space: 68px;
                --landing-input-center-offset: calc(var(--landing-composer-head-space) + 62px);
                top: calc(50% - var(--landing-input-center-offset));
                bottom: auto;
                left: 50%;
                width: min(880px, calc(100% - 96px));
                height: auto;
                margin: 0;
                padding: 0 0 18px;
                transform: translateX(-50%);
            }
body.chat-landing[data-mode="chat"] .composer-top {
                width: 100%;
                display: block;
                margin: 0 auto 20px;
                text-align: center;
            }
body.chat-landing[data-mode="chat"] .composer-title {
                color: #122746;
                font-size: 22px;
                font-weight: 700;
                line-height: 1.35;
            }
body.chat-landing[data-mode="chat"] .composer-desc {
                display: block;
                max-width: 680px;
                margin: 8px auto 0;
                color: #71809a;
                font-size: 11px;
                line-height: 1.55;
                white-space: pre-line;
            }
body.chat-landing[data-mode="chat"] #core-feature-slot,
            body.chat-landing[data-mode="chat"] #chat-compose-field,
            body.chat-landing[data-mode="chat"] .composer-capability-bar {
                margin-right: auto;
                margin-left: auto;
            }
body.chat-landing[data-mode="chat"] #core-feature-slot {
                width: 100%;
                min-width: 0;
                max-width: 100%;
            }
body.chat-landing[data-mode="chat"] .chat-input-wrap {
                min-height: 124px;
                border: 1px solid #dbe5f3;
                border-radius: 17px;
                background: #fff;
                box-shadow: 0 8px 24px rgba(36, 71, 118, .05);
            }
body.chat-landing[data-mode="chat"] .chat-input-wrap textarea {
                min-height: 122px;
                padding: 16px 108px 50px 20px;
                font-size: 14px;
            }
body.chat-landing[data-mode="chat"] .chat-input-hint {
                top: 18px;
                left: 20px;
                right: 108px;
                color: #8c9ab0;
                font-size: 14px;
            }
body.chat-landing[data-mode="chat"] .chat-input-tools {
                right: 14px;
                bottom: 12px;
                gap: 8px;
            }
body.chat-landing[data-mode="chat"] .chat-tool-btn,
            body.chat-landing[data-mode="chat"] .send-btn {
                width: 38px;
                height: 38px;
                border-radius: 50%;
            }
body.chat-landing[data-mode="chat"] .chat-tool-btn {
                border: 1px solid #dbe5f3;
                background: #fff;
                color: #1d365d;
            }
body.chat-landing[data-mode="chat"] .send-btn {
                background: #0d72f5;
                box-shadow: 0 8px 18px rgba(13, 114, 245, .2);
            }
body.chat-landing[data-mode="chat"] .chat-quick-actions,
            body.chat-landing[data-mode="chat"] .work-skill-bar,
            body.chat-landing[data-mode="chat"] .clarification-banner,
            body.chat-landing[data-mode="chat"] .mobile-chat-toolbar {
                display: none !important;
            }
body.chat-landing[data-mode="chat"] .composer-capability-bar {
                display: flex;
                justify-content: center;
                width: 100%;
                gap: 5px;
                margin-top: 24px;
                overflow: hidden;
                flex-wrap: nowrap;
            }
body.chat-landing[data-mode="chat"] .composer-capability-btn {
                width: 0;
                min-width: 0;
                min-height: 34px;
                padding: 0 7px;
                border: 1px solid #bccde7;
                border-radius: 8px;
                background: #fff;
                color: #193257;
                font-size: 11px;
                font-weight: 600;
                line-height: 1;
                gap: 4px;
                flex: 1 1 0;
                justify-content: center;
                white-space: nowrap;
                box-shadow: none;
            }
body.chat-landing[data-mode="chat"] .composer-capability-btn .capability-icon,
            body.chat-landing[data-mode="chat"] .composer-capability-btn .capability-icon svg,
            body.chat-landing[data-mode="chat"] .composer-capability-btn .capability-icon .fuuvo-icon,
            body.chat-landing[data-mode="chat"] .composer-capability-btn .capability-icon .home-capability-icon {
                width: 17px;
                height: 17px;
            }
@media (max-width: 1100px){body.chat-landing[data-mode="chat"] .composer-capability-bar {
                    gap: 3px;
                }
body.chat-landing[data-mode="chat"] .composer-capability-btn {
                    min-height: 32px;
                    padding: 0 3px;
                    font-size: 10px;
                    gap: 3px;
                }
body.chat-landing[data-mode="chat"] .composer-capability-btn .capability-icon,
                body.chat-landing[data-mode="chat"] .composer-capability-btn .capability-icon svg,
                body.chat-landing[data-mode="chat"] .composer-capability-btn .capability-icon .fuuvo-icon,
                body.chat-landing[data-mode="chat"] .composer-capability-btn .capability-icon .home-capability-icon {
                    width: 14px;
                    height: 14px;
                }}
body.chat-landing[data-mode="chat"] .composer-capability-btn:hover,
            body.chat-landing[data-mode="chat"] .composer-capability-btn.active {
                border-color: #0d72f5;
                background: #f3f8ff;
                color: #0d72f5;
                box-shadow: none;
            }
body.chat-landing[data-mode="chat"] .composer-capability-btn .capability-icon {
                color: #0d72f5;
            }
@media (max-width: 720px){body.chat-landing[data-mode="chat"] .composer-capability-btn .capability-icon,
                body.chat-landing[data-mode="chat"] .composer-capability-btn .capability-icon svg,
                body.chat-landing[data-mode="chat"] .composer-capability-btn .capability-icon .fuuvo-icon,
                body.chat-landing[data-mode="chat"] .composer-capability-btn .capability-icon .home-capability-icon {
                    width: 24px;
                    height: 24px;
                }}
body.chat-landing[data-mode="chat"] .workspace-disclaimer {
                position: static;
                margin-top: 26px;
                padding: 0;
                color: #93a0b4;
                font-size: 13px;
            }
body.chat-landing[data-mode="chat"] .workspace-disclaimer a {
                color: #0d72f5;
            }}
@media (max-width: 920px){body.chat-landing[data-mode="chat"] .sidebar-brand-wordmark {
                display: none;
            }
body.chat-landing[data-mode="chat"] .sidebar-brand-suffix {
                display: inline !important;
            }
body.chat-landing[data-mode="chat"] .composer-desc {
                display: block;
                margin-top: 10px;
                color: #71809a;
                font-size: 13px;
                line-height: 1.7;
                white-space: pre-line;
            }}
body[data-mode="chat"] .workspace > .fuuvo-ai-disclaimer {
            flex: 0 0 auto;
            position: relative;
            z-index: 15;
            margin-top: auto;
            padding: 8px 10px max(6px, env(safe-area-inset-bottom));
        }
body.chat-landing[data-mode="chat"] .workspace > .fuuvo-ai-disclaimer {
            position: absolute;
            right: 18px;
            bottom: 0;
            left: 18px;
            width: auto;
            margin: 0;
        }
@media (max-width: 920px){body.chat-landing[data-mode="chat"] .workspace > .fuuvo-ai-disclaimer {
                right: 8px;
                left: 8px;
                font-size: 9px;
            }}
@media (max-width: 920px){body.chat-landing[data-mode="chat"] .landing-workspace-disclaimer {
                gap: 6px;
                margin-top: 8px;
                padding: 0 12px;
                font-size: 9px;
                line-height: 1.3;
                white-space: normal;
            }
body.chat-landing[data-mode="chat"] .landing-workspace-disclaimer > span {
                overflow: visible;
                text-overflow: clip;
                white-space: normal;
            }}
@media (min-width: 921px){body[data-mode="chat"] .history.is-conversation-view .conversation-list {
                gap: 0 !important;
                padding-bottom: 4px !important;
            }
body[data-mode="chat"] .history.is-conversation-view .conversation-item {
                min-height: 24px !important;
                padding: 1px 6px 1px 10px !important;
                border-radius: 7px !important;
                margin: 0 !important;
                line-height: 1.35 !important;
            }
body[data-mode="chat"] .history.is-conversation-view .conversation-head {
                display: grid !important;
                grid-template-columns: 16px minmax(0, 1fr) auto auto !important;
                align-items: center !important;
                gap: 6px !important;
            }
body[data-mode="chat"] .history.is-conversation-view .conversation-item-icon,
            body[data-mode="chat"] .history.is-conversation-view .conversation-item-icon svg {
                width: 16px !important;
                height: 16px !important;
                flex-basis: 16px !important;
            }
body[data-mode="chat"] .history.is-conversation-view .conversation-title {
                font-size: 12px !important;
                line-height: 1.35 !important;
            }
body[data-mode="chat"] .history.is-conversation-view .conversation-time {
                min-width: 38px !important;
                font-size: 11px !important;
                line-height: 1.35 !important;
            }}
body[data-ui-theme="dark"][data-mode="chat"] .conversation-item.active {
            background: rgba(37, 99, 255, 0.2) !important;
            border-color: rgba(96, 165, 250, 0.16) !important;
        }
@media (max-width: 920px) and (hover: none){body[data-mode="chat"] .conversation-item:hover:not(.active) {
                background: transparent !important;
                border-color: transparent !important;
                box-shadow: none !important;
                transform: none !important;
            }
body[data-mode="chat"] .conversation-more-btn,
            body[data-mode="chat"] .conversation-item.menu-open .conversation-more-btn {
                width: 24px !important;
                height: 24px !important;
                min-width: 24px !important;
                padding: 0 !important;
                border: 0 !important;
                border-radius: 8px !important;
                background: transparent !important;
                box-shadow: none !important;
                color: #91a2bb !important;
            }
body[data-ui-theme="dark"][data-mode="chat"] .conversation-more-btn,
            body[data-ui-theme="dark"][data-mode="chat"] .conversation-item.menu-open .conversation-more-btn {
                background: transparent !important;
                color: #9fb3d2 !important;
            }
body[data-mode="chat"] .conversation-more-btn:active {
                background: rgba(96, 165, 250, .14) !important;
            }}
body[data-ui-theme="dark"][data-mode="chat"] .conversation-item.active .conversation-title,
        body[data-ui-theme="dark"][data-mode="chat"] .conversation-item.active .conversation-item-icon {
            color: #8fc1ff !important;
        }
@media (min-width: 921px){body[data-mode="chat"] .history .conversation-list .conversation-item {
                width: 100% !important;
                min-height: 36px !important;
                padding: 4px 6px 4px 8px !important;
                display: block !important;
                box-sizing: border-box !important;
                border-radius: 8px !important;
            }
body[data-mode="chat"] .history .conversation-list .conversation-head {
                width: 100% !important;
                min-height: 28px !important;
                display: grid !important;
                grid-template-columns: 18px minmax(0, 1fr) auto 28px !important;
                align-items: center !important;
                gap: 7px !important;
            }
body[data-mode="chat"] .history .conversation-list .conversation-actions {
                width: 28px !important;
                height: 28px !important;
                min-width: 28px !important;
                min-height: 28px !important;
                margin: 0 !important;
                padding: 0 !important;
                position: relative !important;
                align-self: center !important;
                justify-self: end !important;
                display: inline-flex !important;
                align-items: center !important;
                justify-content: center !important;
            }
body[data-mode="chat"] .history .conversation-list .conversation-more-btn {
                width: 28px !important;
                height: 28px !important;
                min-width: 28px !important;
                min-height: 28px !important;
                max-width: 28px !important;
                max-height: 28px !important;
                margin: 0 !important;
                padding: 0 !important;
                position: static !important;
                inset: auto !important;
                box-sizing: border-box !important;
                align-self: center !important;
            }
body[data-mode="chat"] .history .conversation-list .conversation-item.active::before {
                top: 7px !important;
                bottom: 7px !important;
            }}
body[data-ui-theme="dark"] .work-task-back { border-color: rgba(148, 163, 184, .22); background: rgba(15, 23, 42, .72); color: #a8b8cf; }
body[data-ui-theme="dark"] .work-task-back:hover { border-color: rgba(96, 165, 250, .42); background: rgba(37, 99, 255, .14); color: #8fc1ff; }
@media (max-width: 920px){.work-task-back { width: 30px; height: 30px; min-height: 30px; }}
@media (min-width: 921px){body[data-mode="chat"] .chat-input-wrap.has-attachments {
                padding-bottom: 0;
            }
body[data-mode="chat"] .chat-input-wrap.has-attachments textarea {
                padding: 14px 18px 10px;
            }
body[data-mode="chat"] .chat-input-wrap.has-attachments .chat-input-tools {
                position: relative;
                left: auto;
                right: auto;
                bottom: auto;
                min-height: 44px;
                padding: 0 12px 8px;
            }}
@media (max-width: 720px){body[data-mode="chat"] .core-feature-actions {
                gap: 5px;
                margin-top: 0;
            }
body[data-mode="chat"] .core-feature-btn {
                min-height: 34px;
                padding: 3px 6px;
                gap: 4px;
                border-radius: 8px;
                font-size: 10.5px;
                line-height: 1.1;
            }
body[data-mode="chat"] .core-feature-btn-icon,
            body[data-mode="chat"] .core-feature-btn-icon svg,
            body[data-mode="chat"] .core-feature-btn-icon .home-core-feature-icon,
            body[data-mode="chat"] .core-feature-btn-icon .fuuvo-icon {
                width: 17px;
                height: 17px;
                flex-basis: 17px;
            }}
@media (max-width: 920px){body[data-mode="chat"] .send-btn {
                width: 34px;
                height: 34px;
                min-width: 34px;
                min-height: 34px;
                flex: 0 0 34px;
            }}
@media (max-width: 920px){body.chat-landing[data-mode="chat"] .composer-title {
                font-size: 15px !important;
                line-height: 1.28;
            }
body.chat-landing[data-mode="chat"] .composer-title.has-fuuvo-slogan {
                gap: 5px;
            }
body.chat-landing[data-mode="chat"] .composer-title-logo {
                max-height: 20px;
                width: auto;
            }
body.chat-landing[data-mode="chat"] #mobile-new-chat-trigger {
                display: none !important;
            }
body.chat-landing[data-mode="chat"] .ui-language-switch-btn + .ui-language-switch-btn {
                position: relative;
                border-left: 0;
            }
body.chat-landing[data-mode="chat"] .ui-language-switch-btn + .ui-language-switch-btn::before {
                content: "";
                position: absolute;
                top: 50%;
                left: 0;
                width: 1px;
                height: 18px;
                background: #d8e1ee;
                transform: translateY(-50%);
                pointer-events: none;
            }
body[data-ui-theme="dark"].chat-landing[data-mode="chat"],
            body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .app,
            body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .workspace,
            body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .stage,
            body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .result-card {
                background: linear-gradient(180deg, #080f1c 0%, #0d1728 100%) !important;
                color: #edf2ff;
            }
body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .mobile-chat-topbar {
                background: linear-gradient(180deg, rgba(8, 15, 28, 0.98) 0%, rgba(8, 15, 28, 0.9) 100%) !important;
                border-bottom-color: rgba(148, 163, 184, 0.12);
            }
body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .mobile-nav-pill,
            body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .ui-language-switch {
                background: transparent;
                border-color: rgba(148, 163, 184, 0.16);
                color: #dbe7ff;
            }
body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .mobile-nav-trigger,
            body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .mobile-chat-link,
            body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .ui-language-switch-btn {
                color: #dbe7ff;
            }
body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .ui-language-switch-btn.active,
            body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .ui-language-switch-btn:hover {
                color: #ffffff;
            }
body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .ui-language-switch-btn + .ui-language-switch-btn::before {
                background: rgba(148, 163, 184, 0.32);
            }
body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .composer {
                background: transparent !important;
                box-shadow: none !important;
            }
body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .composer-title,
            body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .composer-title.has-fuuvo-slogan > span,
            body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .mobile-home-scenes-title {
                color: #edf2ff !important;
            }
body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .chat-input-wrap {
                background: rgba(16, 24, 39, 0.98) !important;
                border-color: rgba(148, 163, 184, 0.24) !important;
                box-shadow: 0 18px 42px rgba(2, 6, 23, 0.38) !important;
            }
body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .chat-input-wrap textarea {
                color: #edf2ff !important;
                caret-color: #7db5ff;
                -webkit-text-fill-color: #edf2ff !important;
            }
body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .chat-input-wrap textarea::placeholder,
            body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .chat-input-hint {
                color: #a8b7cf !important;
                -webkit-text-fill-color: #a8b7cf !important;
            }
body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .chat-tool-btn,
            body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .chat-voice-btn,
            body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .mobile-chat-toolbar-btn {
                background: rgba(15, 23, 42, 0.92) !important;
                border: 1px solid rgba(148, 163, 184, 0.22) !important;
                color: #edf2ff !important;
                box-shadow: none !important;
            }
body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .chat-tool-btn:hover,
            body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .chat-voice-btn:hover,
            body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .mobile-chat-toolbar-btn:hover {
                background: rgba(30, 41, 59, 0.96) !important;
                color: #ffffff !important;
            }
body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .send-btn.has-text {
                background: #0d72f5 !important;
                color: #ffffff !important;
            }
body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .mobile-chat-more-menu,
            body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .chat-upload-popover {
                background: rgba(12, 20, 34, 0.98) !important;
                border-color: rgba(148, 163, 184, 0.22) !important;
                box-shadow: 0 22px 48px rgba(2, 6, 23, 0.46) !important;
            }
body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .mobile-chat-more-item,
            body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .chat-upload-option,
            body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .chat-upload-option-copy strong {
                color: #edf2ff !important;
            }
body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .chat-upload-option-copy span,
            body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .chat-upload-popover-head span {
                color: #a8b7cf !important;
            }
body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .core-feature-btn {
                background: rgba(15, 23, 42, 0.88) !important;
                border-color: rgba(148, 163, 184, 0.2) !important;
                color: #edf2ff !important;
            }
body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .core-feature-btn:hover,
            body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .core-feature-btn:focus-visible {
                background: rgba(30, 41, 59, 0.98) !important;
                border-color: rgba(96, 165, 250, 0.34) !important;
                color: #ffffff !important;
            }}
.chat-voice-label {
            display: none;
            min-width: 0;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }
body[data-mode="chat"] .chat-input-wrap textarea {
            padding-right: 174px;
        }
body[data-mode="chat"] .chat-input-hint {
            right: 174px;
        }
body[data-ui-theme="dark"][data-mode="chat"] .chat-voice-btn.is-hold-to-talk {
            border-color: rgba(125, 181, 255, 0.28) !important;
            background: rgba(59, 130, 246, 0.13) !important;
            color: #bfdbfe !important;
            box-shadow: none !important;
        }
body[data-ui-theme="dark"][data-mode="chat"] .chat-voice-btn.is-hold-to-talk.is-hold-active,
        body[data-ui-theme="dark"][data-mode="chat"] .chat-voice-btn.is-hold-to-talk.is-listening {
            border-color: rgba(147, 197, 253, 0.55) !important;
            background: #2563eb !important;
            color: #fff !important;
            box-shadow: 0 0 0 4px rgba(96, 165, 250, 0.18) !important;
        }
body[data-ui-theme="dark"][data-mode="chat"] .chat-voice-btn.is-hold-to-talk.is-processing {
            border-color: rgba(125, 181, 255, 0.3) !important;
            background: rgba(59, 130, 246, 0.16) !important;
            color: #bfdbfe !important;
        }
@media (max-width: 920px){body.chat-detail-open[data-mode="chat"] .chat-input-wrap {
                display: flex !important;
                flex-direction: column !important;
                min-height: 116px !important;
                height: auto !important;
                padding: 0 !important;
                overflow: visible !important;
            }
body.chat-detail-open[data-mode="chat"] .chat-input-wrap textarea {
                position: relative !important;
                width: 100% !important;
                min-height: 68px !important;
                height: auto !important;
                max-height: 168px !important;
                padding: 14px 16px 8px !important;
                overflow-y: auto !important;
                overflow-wrap: normal !important;
                word-break: normal !important;
                white-space: pre-wrap !important;
                flex: 1 1 auto;
            }
body.chat-detail-open[data-mode="chat"] .chat-input-hint {
                top: 14px !important;
                left: 16px !important;
                right: 16px !important;
                width: auto !important;
            }
body.chat-detail-open[data-mode="chat"] .chat-input-tools {
                position: relative !important;
                inset: auto !important;
                width: 100% !important;
                min-height: 44px;
                padding: 2px 10px 8px !important;
                display: flex !important;
                align-items: center !important;
                justify-content: space-between !important;
                flex: 0 0 auto;
            }
body[data-mode="chat"] .chat-voice-btn.is-hold-to-talk {
                min-width: 92px;
                height: 34px;
                padding: 0 10px;
                font-size: 11.5px;
            }
body[data-mode="chat"] .chat-input-wrap textarea,
            body.chat-landing[data-mode="chat"] .chat-input-wrap textarea {
                min-height: 104px;
                padding: 14px 16px 58px;
            }
body[data-mode="chat"] .chat-input-hint,
            body.chat-landing[data-mode="chat"] .chat-input-hint {
                left: 16px;
                right: 16px;
            }
body[data-mode="chat"] .chat-voice-status {
                margin-right: auto;
                margin-left: auto;
            }}
aside[data-fuuvo-shared-sidebar="1"] .sidebar-shell,
        body.chat-landing[data-mode="chat"] .sidebar-shell {
            gap: 10px;
        }
aside[data-fuuvo-shared-sidebar="1"] .sidebar-brand-row,
        body.chat-landing[data-mode="chat"] .sidebar-brand-row {
            min-height: 76px;
            align-items: center;
        }
aside[data-fuuvo-shared-sidebar="1"] .sidebar-brand,
        body.chat-landing[data-mode="chat"] .sidebar-brand {
            align-items: center;
            padding-top: 0;
            padding-bottom: 0;
        }
@media (min-width: 921px){body.chat-landing[data-mode="chat"] .sidebar-brand {
                padding: 0 10px;
            }}
@media (max-width: 920px){aside[data-fuuvo-shared-sidebar="1"] .sidebar-shell,
            body.chat-landing[data-mode="chat"] .sidebar-shell {
                gap: 8px;
            }
aside[data-fuuvo-shared-sidebar="1"] .sidebar-brand-row,
            body.chat-landing[data-mode="chat"] .sidebar-brand-row {
                min-height: 68px;
            }}
@media (min-width: 921px){body.chat-detail-open[data-mode="chat"] .app {
                grid-template-columns: var(--chat-sidebar-width) minmax(0, 1fr);
            }
body.chat-detail-open.sidebar-collapsed[data-mode="chat"] .app {
                grid-template-columns: 0 minmax(0, 1fr);
            }}
body[data-mode="chat"] .history.is-conversation-view .task-list,
        body[data-mode="chat"] .history.is-conversation-view #task-pagination {
            display: none !important;
        }
body[data-mode="chat"] .history.is-conversation-view .history-main {
            overflow-y: scroll;
            scrollbar-gutter: stable;
        }
body[data-mode="chat"] .history.is-conversation-view .conversation-list::after {
            content: "";
            display: block;
            min-height: max(320px, 42vh);
            pointer-events: none;
        }
@media (max-width: 920px){body[data-mode="chat"] .chat-bubble .chat-markdown .table-scroll {
                width: 100%;
                max-width: 100%;
                overflow-x: auto;
                overflow-y: hidden;
                touch-action: pan-x pan-y;
                -webkit-overflow-scrolling: touch;
            }}
@media (max-width: 430px){body[data-mode="chat"] .chat-followup-list {
                grid-template-columns: minmax(0, 1fr);
            }
body[data-mode="chat"] .chat-followup-topic {
                height: auto;
                min-height: 44px;
            }
body[data-mode="chat"] .chat-followup-topic > span {
                display: block;
                max-height: none;
                white-space: normal;
                overflow: visible;
                overflow-wrap: anywhere;
                text-overflow: clip;
                -webkit-line-clamp: unset;
                -webkit-box-orient: initial;
            }
body[data-mode="chat"] .chat-followup-confirm-action {
                min-width: 62px;
                height: 38px;
                padding: 0 15px;
            }}
body[data-ui-theme="dark"][data-mode="chat"]:not(.chat-landing) .chat-message-model-meta {
            border-color: #384353;
            background: #1d2633;
            color: #b3bdcc;
        }
body[data-ui-theme="dark"][data-mode="chat"]:not(.chat-landing) .chat-message-model-label {
            color: #9da9ba;
        }
body[data-ui-theme="dark"][data-mode="chat"]:not(.chat-landing) .chat-message-model-provider {
            color: #a9c4ee;
        }
body[data-ui-theme="dark"][data-mode="chat"]:not(.chat-landing) .chat-message-model-name {
            color: #d8e5ff;
        }
body[data-ui-theme="dark"][data-mode="chat"]:not(.chat-landing) .chat-message-model-separator {
            color: #728096;
        }
body[data-ui-theme="dark"][data-mode="chat"]:not(.chat-landing) .chat-message-model-meta code {
            color: #b7c8e1;
        }
@media (max-width: 720px){body[data-mode="chat"]:not(.chat-landing) .chat-message-model-meta {
                max-width: calc(100vw - 52px);
            }
body[data-mode="chat"]:not(.chat-landing) .chat-message-model-name {
                max-width: 34vw;
            }
body[data-mode="chat"]:not(.chat-landing) .chat-message-model-meta code {
                max-width: 38vw;
            }}
html,
body {
    width: 100%;
    height: 100%;
    margin: 0;
    overflow: hidden !important;
}
*,
*::before,
*::after {
    box-sizing: border-box;
}
.shell-topbar-left,
.shell-topbar-center,
.shell-topbar-right {
    min-width: 0;
}
.shell-topbar-left {
    justify-self: start;
    display: flex;
    align-items: center;
    gap: 8px;
}
.shell-topbar-center {
    justify-self: center;
    display: grid;
    justify-items: center;
    text-align: center;
}
.shell-topbar-right {
    justify-self: end;
}
@media (min-width: 921px){html[lang^="en"] body nav[data-fuuvo-workspace-rail="1"]
    .home-rail-action[data-workspace-rail-item="creation"] {
        overflow: visible !important;
        white-space: normal !important;
        line-height: 1.05 !important;
        font-size: 10px !important;
    }
html[lang^="en"] body nav[data-fuuvo-workspace-rail="1"]
    .home-rail-action[data-workspace-rail-item="creation"] > span:last-child {
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 56px !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
        text-align: center !important;
    }}
@media (max-width: 920px){html body header[data-fuuvo-shared-topbar="1"] .fuuvo-mobile-sidebar-inline-trigger {
        width: 36px !important;
        height: 36px !important;
        min-width: 36px !important;
        min-height: 36px !important;
        padding: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        border: 0 !important;
        border-radius: 9px !important;
        background: transparent !important;
        color: inherit !important;
        cursor: pointer !important;
    }
html body header[data-fuuvo-shared-topbar="1"] .fuuvo-mobile-sidebar-inline-trigger:is(:hover, :focus-visible, :active) {
        background: rgba(111, 133, 165, .12) !important;
        outline: none !important;
    }
html body header[data-fuuvo-shared-topbar="1"] .fuuvo-mobile-sidebar-inline-trigger .fuuvo-topbar-menu-icon,
    html body header[data-fuuvo-shared-topbar="1"] .fuuvo-mobile-sidebar-inline-trigger .fuuvo-topbar-menu-icon > img {
        width: 20px !important;
        height: 20px !important;
        display: block !important;
    }}
@media (max-width: 920px){html body.mobile-capability-drawer-open {
        overflow: hidden !important;
    }
html body.mobile-capability-drawer-open [data-fuuvo-app-shell="1"] > .home-tool-drawer {
        position: fixed !important;
        inset: 0 !important;
        z-index: 5000 !important;
        display: grid !important;
        width: 100vw !important;
        min-width: 0 !important;
        max-width: none !important;
        height: 100dvh !important;
        min-height: 100dvh !important;
        max-height: none !important;
        margin: 0 !important;
        padding: 0 !important;
        grid-template-rows: auto minmax(0, 1fr) !important;
        overflow: hidden !important;
        visibility: visible !important;
        opacity: 1 !important;
        transform: none !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: #f7f9fc !important;
        color: #17243a !important;
        box-shadow: none !important;
        pointer-events: auto !important;
        transition: none !important;
    }
html body.mobile-capability-drawer-open .home-tool-drawer-header {
        min-height: calc(72px + env(safe-area-inset-top)) !important;
        padding: max(18px, env(safe-area-inset-top)) 18px 14px !important;
        align-items: center !important;
        border-bottom: 1px solid #e1e8f2 !important;
        background: #f7f9fc !important;
    }
html body.mobile-capability-drawer-open .home-tool-drawer-header strong {
        font-size: 20px !important;
        font-weight: 760 !important;
        line-height: 1.25 !important;
    }
html body.mobile-capability-drawer-open .home-tool-drawer-header span {
        color: #718198 !important;
        font-size: 12px !important;
    }
html body.mobile-capability-drawer-open .home-tool-drawer-close {
        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;
        border-radius: 12px !important;
        background: transparent !important;
        color: #52637c !important;
    }
html body.mobile-capability-drawer-open .home-tool-drawer-close:is(:hover, :focus-visible, :active) {
        background: #e7edf6 !important;
        color: #1769d4 !important;
        outline: none !important;
    }
html body.mobile-capability-drawer-open .home-tool-drawer-scroll {
        display: grid !important;
        min-height: 0 !important;
        padding: 12px 14px calc(22px + env(safe-area-inset-bottom)) !important;
        gap: 16px !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        overscroll-behavior: contain !important;
        scrollbar-width: none !important;
    }
html body.mobile-capability-drawer-open .home-tool-drawer-scroll::-webkit-scrollbar {
        display: none !important;
    }
html body.mobile-capability-drawer-open .home-tool-group {
        display: grid !important;
        padding: 2px 0 16px !important;
        gap: 10px !important;
        border-bottom: 1px solid #e1e8f2 !important;
    }
html body.mobile-capability-drawer-open .home-tool-group:last-child {
        border-bottom: 0 !important;
    }
html body.mobile-capability-drawer-open .home-tool-group h2 {
        margin: 0 !important;
        padding: 0 2px !important;
        color: #34445c !important;
        font-size: 16px !important;
        font-weight: 760 !important;
        line-height: 1.35 !important;
    }
html body.mobile-capability-drawer-open .home-tool-grid {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
    }
html body.mobile-capability-drawer-open .home-tool-drawer-item {
        display: flex !important;
        width: 100% !important;
        min-width: 0 !important;
        height: 96px !important;
        min-height: 96px !important;
        padding: 10px 8px !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 7px !important;
        border: 1px solid #e0e6ef !important;
        border-radius: 14px !important;
        background: #fff !important;
        color: #40516b !important;
        font-size: 13px !important;
        font-weight: 680 !important;
        line-height: 1.3 !important;
        text-align: center !important;
        text-decoration: none !important;
        box-shadow: 0 4px 12px rgba(29, 52, 83, .05) !important;
        transform: none !important;
    }
html body.mobile-capability-drawer-open .home-tool-drawer-item:is(:hover, :focus-visible, :active),
    html body.mobile-capability-drawer-open .home-tool-drawer-item.active {
        border-color: #b9d2f5 !important;
        background: #edf4ff !important;
        color: #1769d4 !important;
        outline: none !important;
        box-shadow: 0 5px 14px rgba(31, 91, 169, .12) !important;
    }
html body.mobile-capability-drawer-open .home-tool-drawer-item .capability-icon {
        display: inline-flex !important;
        width: 38px !important;
        min-width: 38px !important;
        height: 38px !important;
        flex: 0 0 38px !important;
        align-items: center !important;
        justify-content: center !important;
        color: #3476d4 !important;
    }
html body.mobile-capability-drawer-open .home-tool-drawer-item .capability-icon :is(svg, .fuuvo-linear-svg, .fuuvo-asset-icon, .home-capability-icon) {
        width: 30px !important;
        height: 30px !important;
        max-width: 30px !important;
        max-height: 30px !important;
    }
html body.mobile-capability-drawer-open .home-tool-group[data-home-tool-group="office"] .capability-icon {
        color: #20966c !important;
    }
html body.mobile-capability-drawer-open .home-tool-group[data-home-tool-group="creation"] .capability-icon {
        color: #9854bf !important;
    }
html body.mobile-capability-drawer-open .home-tool-group[data-home-tool-group="utilities"] .capability-icon {
        color: #ba6b20 !important;
    }
html body[data-ui-theme="dark"].mobile-capability-drawer-open [data-fuuvo-app-shell="1"] > .home-tool-drawer,
    html body[data-theme="dark"].mobile-capability-drawer-open [data-fuuvo-app-shell="1"] > .home-tool-drawer {
        background: #151a23 !important;
        color: #edf3fc !important;
    }
html body[data-ui-theme="dark"].mobile-capability-drawer-open .home-tool-drawer-header,
    html body[data-theme="dark"].mobile-capability-drawer-open .home-tool-drawer-header {
        border-bottom-color: #2d3a4d !important;
        background: #151a23 !important;
    }
html body[data-ui-theme="dark"].mobile-capability-drawer-open .home-tool-group,
    html body[data-theme="dark"].mobile-capability-drawer-open .home-tool-group {
        border-bottom-color: #2d3a4d !important;
    }
html body[data-ui-theme="dark"].mobile-capability-drawer-open .home-tool-group h2,
    html body[data-theme="dark"].mobile-capability-drawer-open .home-tool-group h2 {
        color: #dce6f6 !important;
    }
html body[data-ui-theme="dark"].mobile-capability-drawer-open .home-tool-drawer-item,
    html body[data-theme="dark"].mobile-capability-drawer-open .home-tool-drawer-item {
        border-color: #2d3a4d !important;
        background: #1c2431 !important;
        color: #c7d3e5 !important;
        box-shadow: none !important;
    }
html body[data-ui-theme="dark"].mobile-capability-drawer-open .home-tool-drawer-item:is(:hover, :focus-visible, :active),
    html body[data-theme="dark"].mobile-capability-drawer-open .home-tool-drawer-item:is(:hover, :focus-visible, :active) {
        border-color: #5279ac !important;
        background: #263548 !important;
        color: #b9d7ff !important;
    }}
html body #floating-conversation-menu.conversation-menu-floating {
    position: fixed !important;
    z-index: 100000 !important;
    pointer-events: auto !important;
}
body[data-ui-theme="dark"] .shell-theme-toggle {
    border-color: #34445c;
    background: #172131;
    color: #c8d8ee;
}
body[data-ui-theme="dark"] .shell-theme-toggle:hover,
body[data-ui-theme="dark"] .shell-theme-toggle:focus-visible {
    border-color: #6ba8ff;
    background: #20334c;
    color: #e7f1ff;
}
body[data-ui-theme="dark"] .shell-theme-toggle-icon-sun {
    display: none;
}
body[data-ui-theme="dark"] .shell-theme-toggle-icon-moon {
    display: block;
}
aside[data-fuuvo-shared-sidebar="1"] a,
aside[data-fuuvo-shared-sidebar="1"] a:hover,
aside[data-fuuvo-shared-sidebar="1"] a:focus,
aside[data-fuuvo-shared-sidebar="1"] a:active,
aside[data-fuuvo-shared-sidebar="1"] a:visited {
    text-decoration: none !important;
}
[data-fuuvo-app-workspace="1"] a,
[data-fuuvo-app-workspace="1"] a:hover,
[data-fuuvo-app-workspace="1"] a:focus,
[data-fuuvo-app-workspace="1"] a:active,
[data-fuuvo-app-workspace="1"] a:visited {
    text-decoration: none !important;
}
.fuuvo-design-icon {
    display: block;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}
.fuuvo-linear-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: inherit;
}
.fuuvo-linear-icon.fuuvo-design-icon {
    width: 20px;
    height: 20px;
    max-width: 20px;
    max-height: 20px;
    flex: 0 0 20px;
}
header[data-fuuvo-shared-topbar="1"] .workspace-header-link > .fuuvo-linear-icon,
aside[data-fuuvo-shared-sidebar="1"] .sidebar-search-trigger > .fuuvo-linear-icon,
aside[data-fuuvo-shared-sidebar="1"] .sidebar-safety-link > .fuuvo-linear-icon {
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    min-height: 20px !important;
    flex: 0 0 20px !important;
}
aside[data-fuuvo-shared-sidebar="1"] .sidebar-brand-row {
    width: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}
aside[data-fuuvo-shared-sidebar="1"] .sidebar-brand-row > .fuuvo-sidebar-brand {
    min-width: 0;
    flex: 1 1 auto;
}
html:not([data-ui-theme="dark"]) body aside[data-fuuvo-shared-sidebar="1"] :is(.conversation-item, .task-item, .portal-recent-item):hover {
    background: #f6f9ff !important;
}
html:not([data-ui-theme="dark"]) body aside[data-fuuvo-shared-sidebar="1"] :is(.conversation-item, .task-item, .portal-recent-item).active {
    background: #e8f1ff !important;
}
body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] :is(.conversation-item, .task-item, .portal-recent-item):hover {
    background: rgba(96, 165, 250, .12) !important;
}
body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] :is(.conversation-item, .task-item, .portal-recent-item).active {
    background: rgba(37, 99, 255, .2) !important;
}
body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .portal-recent-item:hover :is(.portal-recent-link, .portal-recent-icon, .portal-recent-copy) {
    color: #8fc1ff !important;
}
html:not([data-ui-theme="dark"]) body aside[data-fuuvo-shared-sidebar="1"] .portal-recent-item:hover :is(.portal-recent-link, .portal-recent-icon, .portal-recent-copy) {
    color: #0b6ff0 !important;
}
@media (min-width: 921px){html body.home-history-drawer-open.home-history-drawer-open aside[data-fuuvo-shared-sidebar="1"] .history-main {
        flex: 1 1 auto !important;
        overflow: hidden !important;
    }
html body.home-history-drawer-open.home-history-drawer-open aside[data-fuuvo-shared-sidebar="1"] .history-main :is(.conversation-list, .task-list) {
        flex: 1 1 auto !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
    }
html body.home-history-drawer-open.home-history-drawer-open aside[data-fuuvo-shared-sidebar="1"] .portal-recent {
        flex: 1 1 auto !important;
        overflow: hidden !important;
    }
html body.home-history-drawer-open.home-history-drawer-open aside[data-fuuvo-shared-sidebar="1"] .portal-recent-list {
        flex: 1 1 auto !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
    }}
@media (min-width: 921px){html body.home-history-drawer-open aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand,
    html body.home-history-drawer-open aside[data-fuuvo-shared-sidebar="1"] .portal-nav {
        display: none !important;
    }
html body.home-history-drawer-open aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region {
        display: flex !important;
        min-height: 0 !important;
        overflow: hidden !important;
        flex-direction: column !important;
        padding: 14px 8px 8px !important;
    }
html body.home-history-drawer-open aside[data-fuuvo-shared-sidebar="1"] .sidebar-shell {
        display: block !important;
        flex: 0 0 auto !important;
    }
html body.home-history-drawer-open aside[data-fuuvo-shared-sidebar="1"] .portal-search {
        margin: 0 !important;
    }
html body.home-history-drawer-open aside[data-fuuvo-shared-sidebar="1"] .portal-recent {
        display: flex !important;
        min-height: 0 !important;
        margin: 12px 0 0 !important;
        padding: 12px 0 0 !important;
        flex: 1 1 auto !important;
        flex-direction: column !important;
        overflow: hidden !important;
        border-top: 1px solid rgba(148, 163, 184, .18) !important;
    }
html body.home-history-drawer-open aside[data-fuuvo-shared-sidebar="1"] .portal-recent-list {
        display: grid !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 2px 4px !important;
        flex: 1 1 auto !important;
        align-content: start !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        overscroll-behavior: contain !important;
        scrollbar-width: thin !important;
        scrollbar-color: rgba(118, 132, 153, .46) transparent !important;
    }
html body.home-history-drawer-open aside[data-fuuvo-shared-sidebar="1"] .portal-recent-list::-webkit-scrollbar {
        width: 6px;
    }
html body.home-history-drawer-open aside[data-fuuvo-shared-sidebar="1"] .portal-recent-list::-webkit-scrollbar-thumb {
        border-radius: 999px;
        background: rgba(118, 132, 153, .46);
    }
html body.home-history-drawer-open aside[data-fuuvo-shared-sidebar="1"] .history-main {
        display: flex !important;
        min-height: 0 !important;
        margin: 12px 0 0 !important;
        padding: 12px 0 0 !important;
        flex: 1 1 auto !important;
        flex-direction: column !important;
        gap: 8px !important;
        overflow: hidden !important;
        border-top: 1px solid rgba(148, 163, 184, .18) !important;
    }
html body.home-history-drawer-open aside[data-fuuvo-shared-sidebar="1"] .history-main :is(.conversation-list, .task-list) {
        display: grid !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 2px 4px !important;
        flex: 1 1 auto !important;
        align-content: start !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        overscroll-behavior: contain !important;
        scrollbar-width: thin !important;
        scrollbar-color: rgba(118, 132, 153, .46) transparent !important;
    }
html body.home-history-drawer-open aside[data-fuuvo-shared-sidebar="1"] .history-main :is(.conversation-list, .task-list)::-webkit-scrollbar {
        width: 6px;
    }
html body.home-history-drawer-open aside[data-fuuvo-shared-sidebar="1"] .history-main :is(.conversation-list, .task-list)::-webkit-scrollbar-thumb {
        border-radius: 999px;
        background: rgba(118, 132, 153, .46);
    }
html body.home-history-drawer-open aside[data-fuuvo-shared-sidebar="1"] .sidebar-safety-link {
        flex: 0 0 auto !important;
        margin-top: 8px !important;
    }}
[data-fuuvo-account-portal="1"] {
    --account-card-bg: #666666;
    --account-surface: #2d2b40;
    --account-ink: #ffffff;
    --account-muted: #a4a5b1;
    position: fixed !important;
    left: 0 !important;
    bottom: 0 !important;
    z-index: 1400 !important;
    width: var(--fuuvo-workspace-rail-width, 64px) !important;
    height: 64px !important;
    margin: 0 !important;
    padding: 0 !important;
    pointer-events: none !important;
}
:is(html[data-ui-theme="dark"], body[data-ui-theme="dark"]) [data-fuuvo-account-portal="1"] .sidebar-account-toggle {
    color: #c8cbd0 !important;
}
:is(html[data-ui-theme="dark"], body[data-ui-theme="dark"]) [data-fuuvo-account-portal="1"] .sidebar-account-toggle:hover,
:is(html[data-ui-theme="dark"], body[data-ui-theme="dark"]) [data-fuuvo-account-portal="1"] .sidebar-account-menu.is-open .sidebar-account-toggle,
:is(html[data-ui-theme="dark"], body[data-ui-theme="dark"]) [data-fuuvo-account-portal="1"] .sidebar-account-toggle:focus-visible,
:is(html[data-ui-theme="dark"], body[data-ui-theme="dark"]) [data-fuuvo-account-portal="1"] .sidebar-account-menu:not(.is-open) .sidebar-account-toggle:hover {
    background: #2b2d31 !important;
    color: #f1f3f5 !important;
}
@media (max-width: 539px){[data-fuuvo-account-portal="1"] {
        left: auto !important;
        /* 100vw includes a classic scrollbar while fixed positioning uses
           the layout viewport. Compensate so the launcher stays aligned on
           home and content pages alike. */
        right: calc(10px - (100vw - 100%)) !important;
        width: 76px !important;
        height: 66px !important;
    }
[data-fuuvo-account-portal="1"] .sidebar-account-toggle {
        left: 0 !important;
        bottom: 0 !important;
        width: 76px !important;
        min-width: 76px !important;
        height: 64px !important;
        min-height: 64px !important;
        flex-direction: column !important;
        gap: 2px !important;
        border-radius: 10px !important;
        color: #5f6672 !important;
    }
[data-fuuvo-account-portal="1"] .workspace-account-launcher-icon,
    [data-fuuvo-account-portal="1"] .workspace-account-launcher-icon svg {
        width: 25px !important;
        height: 25px !important;
    }
[data-fuuvo-account-portal="1"] .workspace-account-launcher-label {
        display: block;
        max-width: 72px;
        overflow: hidden;
        color: currentColor;
        font-size: 12px;
        font-weight: 500;
        line-height: 17px;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
[data-fuuvo-account-portal="1"] .sidebar-account-dropdown,
    [data-fuuvo-account-portal="1"] .sidebar-quick-settings {
        left: 0 !important;
        right: 0 !important;
        top: auto !important;
        bottom: 0 !important;
        width: auto !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: min(78dvh, 680px) !important;
        padding: 14px 14px calc(16px + env(safe-area-inset-bottom)) !important;
        overflow-y: auto !important;
        border-radius: 18px 18px 0 0 !important;
        box-shadow: 0 -16px 42px rgba(0, 0, 0, .32) !important;
    }
[data-fuuvo-account-portal="1"] .sidebar-account-menu.is-open .workspace-account-team-promo {
        display: none !important;
    }
[data-fuuvo-account-portal="1"] .workspace-account-profile-head {
        padding-inline: 14px !important;
    }
[data-fuuvo-account-portal="1"] .workspace-account-actions > a,
    [data-fuuvo-account-portal="1"] .workspace-account-actions > button {
        min-height: 46px !important;
        flex-basis: 46px !important;
        font-size: 15px !important;
    }
[data-fuuvo-account-portal="1"] .workspace-account-actions > a > :is(svg, .fuuvo-linear-icon),
    [data-fuuvo-account-portal="1"] .workspace-account-actions > button > :is(svg, .fuuvo-linear-icon) {
        width: 21px !important;
        height: 21px !important;
        min-width: 21px !important;
    }}
:root {
    --fuuvo-workspace-rail-width: 72px;
    --fuuvo-workspace-drawer-width: 430px;
    --fuuvo-workspace-rail-bg: #fafbfc;
    --fuuvo-workspace-drawer-bg: #ffffff;
}
@media (min-width: 921px){html body [data-fuuvo-app-shell="1"],
    html body [data-fuuvo-app-shell="1"].sidebar-collapsed,
    html body.sidebar-collapsed [data-fuuvo-app-shell="1"] {
        display: grid !important;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 100vh !important;
        margin: 0 !important;
        padding: 0 !important;
        grid-template-columns: var(--fuuvo-workspace-rail-width) minmax(0, 1fr) !important;
        gap: 0 !important;
    }
html body [data-fuuvo-app-shell="1"] > [data-fuuvo-app-workspace="1"] {
        grid-column: 2 !important;
        width: 100% !important;
        min-width: 0 !important;
        margin-left: 0 !important;
    }
html body nav[data-fuuvo-workspace-rail="1"] {
        position: fixed !important;
        inset: 0 auto 0 0 !important;
        z-index: 1300 !important;
        display: flex !important;
        width: var(--fuuvo-workspace-rail-width) !important;
        min-width: var(--fuuvo-workspace-rail-width) !important;
        height: 100dvh !important;
        min-height: 100vh !important;
        margin: 0 !important;
        padding: 12px 4px max(12px, env(safe-area-inset-bottom)) !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 8px !important;
        overflow: visible !important;
        border: 0 !important;
        border-right: 1px solid #e4e8ee !important;
        border-radius: 0 !important;
        background: var(--fuuvo-workspace-rail-bg) !important;
        color: #45474d !important;
        box-shadow: none !important;
        backdrop-filter: none !important;
    }
html body nav[data-fuuvo-workspace-rail="1"] :is(.home-workspace-rail-stack, .home-workspace-rail-footer) {
        display: flex !important;
        width: 100% !important;
        flex-direction: column !important;
        align-items: center !important;
        gap: 7px !important;
    }
html body nav[data-fuuvo-workspace-rail="1"] .home-rail-logo {
        display: inline-flex !important;
        width: 56px !important;
        height: 36px !important;
        margin: 0 0 4px !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: 9px !important;
        color: #17181b !important;
        text-decoration: none !important;
        transition: background-color .16s ease, color .16s ease !important;
    }
html body nav[data-fuuvo-workspace-rail="1"] .home-rail-logo:hover,
    html body nav[data-fuuvo-workspace-rail="1"] .home-rail-logo:focus-visible {
        background: #e9e9eb !important;
        outline: none !important;
    }
html body nav[data-fuuvo-workspace-rail="1"] .home-rail-logo svg {
        display: block !important;
        width: 27px !important;
        height: 27px !important;
    }
html body nav[data-fuuvo-workspace-rail="1"] .home-rail-logo .home-rail-logo-wordmark {
        display: block !important;
        width: 50px !important;
        height: auto !important;
        max-height: 25px !important;
        object-fit: contain !important;
        background: transparent !important;
    }
html body nav[data-fuuvo-workspace-rail="1"] .home-rail-logo.is-chinese::before,
    html body nav[data-fuuvo-workspace-rail="1"] .home-rail-logo.is-chinese::after {
        display: none !important;
        content: none !important;
        opacity: 0 !important;
    }
html body nav[data-fuuvo-workspace-rail="1"] .home-rail-logo.is-chinese > .home-rail-logo-wordmark-static {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
html body nav[data-fuuvo-workspace-rail="1"] .home-rail-logo.is-chinese > .home-rail-logo-wordmark-hover {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
    }
html body nav[data-fuuvo-workspace-rail="1"] .home-rail-logo.is-chinese.is-fuuvo-video-playing > .home-rail-logo-wordmark-static {
        visibility: hidden !important;
        opacity: 0 !important;
    }
html body nav[data-fuuvo-workspace-rail="1"] .home-rail-logo.is-chinese.is-fuuvo-video-playing > .home-rail-logo-wordmark-hover {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
html body nav[data-fuuvo-workspace-rail="1"] .home-rail-action {
        position: relative !important;
        display: flex !important;
        width: 56px !important;
        min-width: 56px !important;
        min-height: 60px !important;
        margin: 0 !important;
        padding: 4px 2px 3px !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 3px !important;
        overflow: hidden !important;
        border: 0 !important;
        border-radius: 8px !important;
        background: transparent !important;
        color: #525866 !important;
        font-family: inherit !important;
        font-size: 11.5px !important;
        font-weight: 600 !important;
        line-height: 1.15 !important;
        letter-spacing: 0 !important;
        text-align: center !important;
        text-decoration: none !important;
        white-space: nowrap !important;
        box-shadow: none !important;
        cursor: pointer !important;
        transform: none !important;
        transition: background-color .14s ease, color .14s ease, box-shadow .14s ease !important;
    }
html body nav[data-fuuvo-workspace-rail="1"] .home-rail-action:hover,
    html body nav[data-fuuvo-workspace-rail="1"] .home-rail-action:focus-visible {
        background: #edf0f4 !important;
        color: #20242c !important;
        outline: none !important;
    }
html body nav[data-fuuvo-workspace-rail="1"] .home-rail-action.is-expanded,
    html body nav[data-fuuvo-workspace-rail="1"] .home-rail-action.is-active {
        background: #e8f1ff !important;
        color: #1265d6 !important;
        box-shadow: inset 3px 0 0 #2379e8 !important;
    }
html body nav[data-fuuvo-workspace-rail="1"] .home-rail-action:focus-visible {
        box-shadow: inset 0 0 0 2px #6b7280 !important;
    }
html body nav[data-fuuvo-workspace-rail="1"] .home-rail-action-icon {
        display: inline-flex !important;
        width: 36px !important;
        height: 34px !important;
        flex: 0 0 34px !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: 8px !important;
        background: transparent !important;
    }
html body nav[data-fuuvo-workspace-rail="1"] .home-rail-action-icon :is(svg, .fuuvo-linear-svg) {
        display: block !important;
        width: 23px !important;
        height: 23px !important;
    }
html body [data-fuuvo-app-shell="1"] > .home-drawer-backdrop {
        position: fixed !important;
        inset: 0 !important;
        z-index: 1270 !important;
        display: block !important;
        visibility: hidden !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        background: rgba(20, 21, 24, .12) !important;
        opacity: 0 !important;
        pointer-events: none !important;
        transition: opacity .18s ease, visibility .18s ease !important;
    }
html body.home-drawer-pinned [data-fuuvo-app-shell="1"] > .home-drawer-backdrop {
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;
    }
html body [data-fuuvo-app-shell="1"] > :is(.home-tool-drawer, aside[data-fuuvo-shared-sidebar="1"]) {
        position: fixed !important;
        top: 12px !important;
        bottom: 12px !important;
        left: calc(var(--fuuvo-workspace-rail-width) + 10px) !important;
        z-index: 1290 !important;
        width: min(var(--fuuvo-workspace-drawer-width), calc(100vw - var(--fuuvo-workspace-rail-width) - 28px)) !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        margin: 0 !important;
        overflow: hidden !important;
        visibility: hidden !important;
        border: 1px solid #dfe4eb !important;
        border-radius: 8px !important;
        background: var(--fuuvo-workspace-drawer-bg) !important;
        color: #24262a !important;
        box-shadow: 0 18px 48px rgba(20, 28, 42, .16) !important;
        opacity: 0 !important;
        transform: translateX(-9px) scale(.99) !important;
        transform-origin: left center !important;
        pointer-events: none !important;
        transition: opacity .17s ease, transform .17s ease, visibility .17s ease !important;
    }
html body [data-fuuvo-app-shell="1"] > .home-tool-drawer {
        display: grid !important;
        padding: 0 !important;
        grid-template-rows: auto minmax(0, 1fr) !important;
    }
html body [data-fuuvo-app-shell="1"] > aside[data-fuuvo-shared-sidebar="1"] {
        display: grid !important;
        width: 336px !important;
        min-width: 336px !important;
        padding: 14px 12px 12px !important;
        grid-template-rows: minmax(0, 1fr) auto !important;
        gap: 6px !important;
    }
html body.home-tool-drawer-open [data-fuuvo-app-shell="1"] > .home-tool-drawer:not(.home-new-drawer),
    html body.home-new-drawer-open [data-fuuvo-app-shell="1"] > .home-new-drawer,
    html body.home-history-drawer-open [data-fuuvo-app-shell="1"] > aside[data-fuuvo-shared-sidebar="1"] {
        visibility: visible !important;
        opacity: 1 !important;
        transform: translateX(0) scale(1) !important;
        pointer-events: auto !important;
    }
html body [data-fuuvo-app-shell="1"] > aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-area {
        min-height: 56px !important;
        padding-top: 7px !important;
    }
html body .home-tool-drawer-header {
        display: flex !important;
        min-height: 68px !important;
        padding: 14px 16px 11px !important;
        align-items: flex-start !important;
        justify-content: space-between !important;
        gap: 16px !important;
        border-bottom: 1px solid #dedee1 !important;
    }
html body .home-tool-drawer-header > div {
        display: grid !important;
        min-width: 0 !important;
        gap: 4px !important;
    }
html body .home-tool-drawer-header strong {
        font-size: 16px !important;
        font-weight: 680 !important;
        line-height: 1.3 !important;
    }
html body .home-tool-drawer-header span {
        color: #767980 !important;
        font-size: 12px !important;
        line-height: 1.4 !important;
    }
html body .home-tool-drawer-close {
        display: inline-flex !important;
        width: 32px !important;
        height: 32px !important;
        min-width: 32px !important;
        padding: 0 !important;
        align-items: center !important;
        justify-content: center !important;
        border: 0 !important;
        border-radius: 8px !important;
        background: transparent !important;
        color: #666970 !important;
        cursor: pointer !important;
    }
html body .home-tool-drawer-close:hover,
    html body .home-tool-drawer-close:focus-visible {
        background: #e2e2e4 !important;
        color: #18191c !important;
        outline: none !important;
    }
html body .home-tool-drawer-close svg {
        width: 19px !important;
        height: 19px !important;
    }
html body .home-tool-drawer-scroll {
        display: grid !important;
        padding: 7px 10px 14px !important;
        align-content: start !important;
        gap: 7px !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        overscroll-behavior: contain !important;
        scrollbar-width: thin !important;
        scrollbar-color: #c8c9cc transparent !important;
    }
html body .home-tool-group {
        display: grid !important;
        padding: 9px 5px 11px !important;
        gap: 8px !important;
        border-bottom: 1px solid #dfdfe2 !important;
    }
html body .home-tool-group:last-child {
        border-bottom: 0 !important;
    }
html body .home-tool-group h2 {
        margin: 0 !important;
        padding: 0 7px !important;
        color: #3d3f44 !important;
        font-size: 13px !important;
        font-weight: 670 !important;
        line-height: 1.4 !important;
    }
html body .home-tool-grid {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 4px !important;
    }
html body .home-tool-drawer-item {
        display: flex !important;
        width: 100% !important;
        min-width: 0 !important;
        height: 78px !important;
        min-height: 78px !important;
        margin: 0 !important;
        padding: 8px 4px !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 5px !important;
        overflow: hidden !important;
        border: 1px solid transparent !important;
        border-radius: 8px !important;
        background: transparent !important;
        color: #55585f !important;
        font-size: 12px !important;
        font-weight: 600 !important;
        line-height: 1.25 !important;
        text-align: center !important;
        text-decoration: none !important;
        white-space: normal !important;
        box-shadow: none !important;
        cursor: pointer !important;
        transform: none !important;
    }
html body .home-tool-drawer-item:hover,
    html body .home-tool-drawer-item:focus-visible,
    html body .home-tool-drawer-item.active {
        border-color: #d9dadd !important;
        background: #e7e7e9 !important;
        color: #1c1e22 !important;
        outline: none !important;
    }
html body .home-tool-drawer-item .capability-icon {
        display: inline-flex !important;
        width: 34px !important;
        min-width: 34px !important;
        height: 34px !important;
        flex: 0 0 34px !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: 0 !important;
        background: transparent !important;
        color: #386ecf !important;
    }
html body .home-tool-group[data-home-tool-group="office"] .capability-icon {
        color: #23835e !important;
    }
html body .home-tool-group[data-home-tool-group="creation"] .capability-icon {
        color: #9652b1 !important;
    }
html body .home-tool-group[data-home-tool-group="utilities"] .capability-icon {
        color: #b45c20 !important;
    }
html body .workspace-tool-drawer .capability-icon svg {
        display: block !important;
        width: 27px !important;
        height: 27px !important;
        fill: none !important;
        stroke: currentColor !important;
        stroke-width: 1.5 !important;
        stroke-linecap: round !important;
        stroke-linejoin: round !important;
    }
html body [data-fuuvo-app-shell="1"] > .desktop-sidebar-resizer {
        display: none !important;
    }}
@media (max-width: 920px){html body nav[data-fuuvo-workspace-rail="1"],
    html body [data-fuuvo-app-shell="1"] > .home-tool-drawer,
    html body [data-fuuvo-app-shell="1"] > .home-drawer-backdrop {
        display: none !important;
    }
html body [data-fuuvo-app-shell="1"],
    html body [data-fuuvo-app-shell="1"].sidebar-collapsed,
    html body.sidebar-collapsed [data-fuuvo-app-shell="1"] {
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        grid-template-columns: minmax(0, 1fr) !important;
    }
html body [data-fuuvo-app-shell="1"] > [data-fuuvo-app-workspace="1"] {
        width: 100% !important;
        min-width: 0 !important;
        margin-left: 0 !important;
    }}
@media (min-width: 921px){html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-tool-groups {
        display: none !important;
    }}
:is(html[data-ui-theme="dark"], body[data-ui-theme="dark"]) {
    --fuuvo-workspace-rail-bg: #151719;
    --fuuvo-workspace-drawer-bg: #1c1e21;
}
@media (min-width: 921px){:is(html[data-ui-theme="dark"], body[data-ui-theme="dark"]) nav[data-fuuvo-workspace-rail="1"] {
        border-right-color: #292c30 !important;
        color: #d1d4d8 !important;
    }
:is(html[data-ui-theme="dark"], body[data-ui-theme="dark"]) nav[data-fuuvo-workspace-rail="1"] .home-rail-logo {
        color: #e7e9ec !important;
    }
:is(html[data-ui-theme="dark"], body[data-ui-theme="dark"]) nav[data-fuuvo-workspace-rail="1"] .home-rail-logo:hover,
    :is(html[data-ui-theme="dark"], body[data-ui-theme="dark"]) nav[data-fuuvo-workspace-rail="1"] .home-rail-logo:focus-visible,
    :is(html[data-ui-theme="dark"], body[data-ui-theme="dark"]) nav[data-fuuvo-workspace-rail="1"] .home-rail-action:hover,
    :is(html[data-ui-theme="dark"], body[data-ui-theme="dark"]) nav[data-fuuvo-workspace-rail="1"] .home-rail-action:focus-visible {
        background: #292d34 !important;
        color: #f1f3f5 !important;
    }
:is(html[data-ui-theme="dark"], body[data-ui-theme="dark"]) nav[data-fuuvo-workspace-rail="1"] .home-rail-action.is-expanded,
    :is(html[data-ui-theme="dark"], body[data-ui-theme="dark"]) nav[data-fuuvo-workspace-rail="1"] .home-rail-action.is-active {
        background: #223552 !important;
        color: #91c1ff !important;
        box-shadow: inset 3px 0 0 #5ca3ff !important;
    }
:is(html[data-ui-theme="dark"], body[data-ui-theme="dark"]) nav[data-fuuvo-workspace-rail="1"] .home-rail-action {
        color: #c8cbd0 !important;
    }
:is(html[data-ui-theme="dark"], body[data-ui-theme="dark"]) [data-fuuvo-app-shell="1"] > :is(.home-tool-drawer, aside[data-fuuvo-shared-sidebar="1"]) {
        border-color: #303338 !important;
        background: var(--fuuvo-workspace-drawer-bg) !important;
        color: #eceef1 !important;
        box-shadow: 0 22px 52px rgba(0, 0, 0, .38) !important;
    }
:is(html[data-ui-theme="dark"], body[data-ui-theme="dark"]) :is(.home-tool-drawer-header, .home-tool-group) {
        border-color: #303338 !important;
    }
:is(html[data-ui-theme="dark"], body[data-ui-theme="dark"]) :is(.home-tool-drawer-header span, .home-tool-group h2) {
        color: #adb1b8 !important;
    }
:is(html[data-ui-theme="dark"], body[data-ui-theme="dark"]) .home-tool-drawer-close,
    :is(html[data-ui-theme="dark"], body[data-ui-theme="dark"]) .home-tool-drawer-item {
        color: #c7cbd1 !important;
    }
:is(html[data-ui-theme="dark"], body[data-ui-theme="dark"]) :is(.home-tool-drawer-close, .home-tool-drawer-item):hover,
    :is(html[data-ui-theme="dark"], body[data-ui-theme="dark"]) :is(.home-tool-drawer-close, .home-tool-drawer-item):focus-visible,
    :is(html[data-ui-theme="dark"], body[data-ui-theme="dark"]) .home-tool-drawer-item.active {
        border-color: #3a3e44 !important;
        background: #2b2e32 !important;
        color: #f2f4f6 !important;
    }}
@media (prefers-reduced-motion: reduce){nav[data-fuuvo-workspace-rail="1"] *,
    [data-fuuvo-app-shell="1"] > :is(.home-tool-drawer, aside[data-fuuvo-shared-sidebar="1"], .home-drawer-backdrop) {
        transition: none !important;
    }}
@media (min-width: 921px){html body nav[data-fuuvo-workspace-rail="1"] .home-rail-logo {
        position: relative !important;
        isolation: isolate !important;
    }
html body nav[data-fuuvo-workspace-rail="1"] .home-rail-logo
        :is(.home-rail-logo-wordmark-static, .home-rail-logo-wordmark-hover) {
        position: absolute !important;
        top: 50% !important;
        left: 50% !important;
        display: block !important;
        width: 50px !important;
        height: 27px !important;
        max-width: none !important;
        max-height: none !important;
        object-fit: contain !important;
        object-position: center !important;
        transform: translate(-50%, -50%) !important;
        pointer-events: none !important;
        transition: opacity 120ms ease, visibility 120ms ease !important;
    }
html body nav[data-fuuvo-workspace-rail="1"] .home-rail-logo
        .home-rail-logo-wordmark-static {
        visibility: visible !important;
        opacity: 1 !important;
    }
html body nav[data-fuuvo-workspace-rail="1"] .home-rail-logo
        .home-rail-logo-wordmark-hover {
        visibility: hidden !important;
        opacity: 0 !important;
    }
html body nav[data-fuuvo-workspace-rail="1"] .home-rail-logo.is-fuuvo-video-playing
        .home-rail-logo-wordmark-static {
        visibility: hidden !important;
        opacity: 0 !important;
    }
html body nav[data-fuuvo-workspace-rail="1"] .home-rail-logo.is-fuuvo-video-playing
        .home-rail-logo-wordmark-hover {
        visibility: visible !important;
        opacity: 1 !important;
    }}
@media (min-width: 921px){html body .food-app .food-main {
        width: min(1480px, calc(100% - 72px)) !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
html body .fortune-app header[data-fuuvo-shared-topbar="1"] [data-toggle-shared-sidebar] {
        display: none !important;
    }
html body .fortune-app .fortune-main {
        width: min(1480px, calc(100% - 72px)) !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }}
@media (hover: hover){html body aside[data-fuuvo-shared-sidebar="1"] .conversation-more-btn:hover {
        background: rgba(96, 165, 250, .14) !important;
        box-shadow: none !important;
    }}
@media (max-width: 920px) and (hover: none){html body aside[data-fuuvo-shared-sidebar="1"] .conversation-more-btn:active {
        background: rgba(96, 165, 250, .14) !important;
        box-shadow: none !important;
    }}
@media (max-width: 920px){html body aside[data-fuuvo-shared-sidebar="1"] .conversation-list > .conversation-empty-state {
        width: 100% !important;
        height: auto !important;
        min-height: 44px !important;
        max-height: none !important;
        margin: 0 !important;
        padding: 8px 10px !important;
        display: flex !important;
        align-items: flex-start !important;
        justify-content: flex-start !important;
        overflow: visible !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        font-size: 13px !important;
        line-height: 1.65 !important;
        text-align: left !important;
        white-space: normal !important;
    }}
@media (min-width: 921px){aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand {
        min-height: 70px !important;
        margin-bottom: 8px !important;
        padding: 0 10px !important;
        display: grid !important;
        align-content: start !important;
        gap: 6px !important;
        text-decoration: none !important;
    }
aside[data-fuuvo-shared-sidebar="1"] .sidebar-brand-logo {
        width: 118px !important;
        height: 32px !important;
        min-width: 118px !important;
        flex: 0 0 118px !important;
        overflow: visible !important;
    }
aside[data-fuuvo-shared-sidebar="1"] .sidebar-brand-logo img {
        width: 118px !important;
        height: 32px !important;
        max-width: 118px !important;
        max-height: 32px !important;
        display: block !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        object-fit: contain !important;
        object-position: left center !important;
    }
aside[data-fuuvo-shared-sidebar="1"] .sidebar-brand-copy {
        display: flex !important;
        align-items: center !important;
        gap: 3px !important;
        padding-top: 4px !important;
    }
aside[data-fuuvo-shared-sidebar="1"] .sidebar-brand-name-image {
        width: 52px !important;
        height: auto !important;
        max-width: 52px !important;
        display: block !important;
        flex: 0 0 auto !important;
        border: 0 !important;
        background: transparent !important;
        object-fit: contain !important;
    }
aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand.is-chinese {
        min-height: 54px !important;
        gap: 2px !important;
    }
aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand.is-chinese .sidebar-brand-logo {
        width: 68px !important;
        height: 29px !important;
        min-width: 68px !important;
        flex-basis: 68px !important;
    }
aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand.is-chinese .sidebar-brand-logo img.sidebar-brand-zh-logo {
        width: 68px !important;
        height: auto !important;
        max-width: 68px !important;
        max-height: 29px !important;
        background: transparent !important;
        object-fit: contain !important;
    }
aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand.is-chinese .sidebar-brand-copy {
        display: none !important;
    }
aside[data-fuuvo-shared-sidebar="1"] .sidebar-brand-copy strong,
    aside[data-fuuvo-shared-sidebar="1"] .sidebar-brand-copy .sidebar-brand-suffix {
        display: inline !important;
        overflow: visible !important;
        color: #0a70e5 !important;
        line-height: 1.2 !important;
        white-space: nowrap !important;
    }
aside[data-fuuvo-shared-sidebar="1"] .sidebar-brand-copy strong {
        font-size: 16px !important;
        font-weight: 700 !important;
    }
aside[data-fuuvo-shared-sidebar="1"] .sidebar-brand-copy .sidebar-brand-suffix {
        color: #0d72f5 !important;
        font-size: 13px !important;
        font-weight: 600 !important;
    }
aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav {
        gap: 2px !important;
    }
aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav-btn {
        min-height: 42px !important;
        padding: 0 14px !important;
        border-radius: 10px !important;
        font-size: 16px !important;
    }
aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav-btn .rail-icon {
        display: flex !important;
        align-items: center !important;
        gap: 12px !important;
    }
aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav-btn .rail-glyph {
        width: 22px !important;
        height: 22px !important;
        flex: 0 0 22px !important;
        display: block !important;
    }
aside[data-fuuvo-shared-sidebar="1"] #sidebar-new-chat,
    aside[data-fuuvo-shared-sidebar="1"] .portal-new-chat {
        min-height: 54px !important;
        justify-content: center !important;
        border: 1px solid #126fff !important;
        border-radius: 10px !important;
        background: #fff !important;
        color: #0b6ff0 !important;
        box-shadow: none !important;
    }
aside[data-fuuvo-shared-sidebar="1"] #sidebar-new-chat .rail-icon,
    aside[data-fuuvo-shared-sidebar="1"] .portal-new-chat .rail-icon {
        width: auto !important;
        justify-content: center !important;
    }
aside[data-fuuvo-shared-sidebar="1"] #sidebar-new-chat .rail-icon::before {
        content: none !important;
        display: none !important;
    }}
.shell-topbar-left { display: flex; align-items: center; gap: 6px; }
@media (min-width: 921px){.portal-shell { --sidebar: 370px; }
.portal-sidebar {
        position: sticky;
        top: 0;
        width: var(--sidebar);
        align-self: start;
        height: 100vh;
        padding: 30px 22px 18px;
        background: #fff;
        border-right: 1px solid #edf1f7;
    }
.portal-sidebar .sidebar-brand {
        display: grid;
        gap: 2px;
        align-items: start;
        padding: 0 10px;
    }
.portal-sidebar .sidebar-brand img {
        display: block;
        width: 160px;
        height: auto;
        max-height: 46px;
        border: 0;
        border-radius: 0;
        background: transparent;
        object-fit: contain;
        object-position: left center;
    }
.portal-sidebar .sidebar-brand-wordmark {
        display: block;
        color: #0b73e8;
        font: 800 43px/.92 Arial, sans-serif;
        letter-spacing: -2px;
    }
.portal-sidebar .sidebar-brand-wordmark span {
        display: inline-block;
        margin-left: 4px;
        color: #0688ea;
        font-size: 22px;
        letter-spacing: -4px;
        transform: translateY(-6px);
    }
.portal-sidebar .sidebar-brand-copy {
        display: flex;
        align-items: baseline;
        gap: 2px;
        padding-top: 3px;
    }
.portal-sidebar .sidebar-brand-copy strong,
    .portal-sidebar .sidebar-brand-copy .sidebar-brand-suffix {
        display: inline;
        overflow: visible;
        font-size: 16px;
        font-weight: 700;
        line-height: 1.2;
        white-space: nowrap;
    }
.portal-sidebar .sidebar-brand-copy strong { color: #0a70e5; }
.portal-sidebar .sidebar-brand-copy .sidebar-brand-suffix { color: #0d72f5; font-size: 13px; font-weight: 600; }
.portal-sidebar .portal-search {
        min-height: 40px;
        margin-top: 22px;
        padding: 0 10px;
        border-radius: 8px;
        box-shadow: none;
    }
.portal-sidebar .portal-new-chat {
        width: calc(100% + 8px);
        min-height: 54px;
        margin: 22px 0 0 -4px;
        justify-content: center;
        border: 1px solid #126fff;
        border-radius: 10px;
        color: #0b6ff0;
        background: #fff;
        font-size: 18px;
    }
.portal-sidebar .portal-new-chat .plus { font-size: 30px; }
.portal-sidebar .portal-nav { gap: 8px; margin-top: 12px; }
.portal-sidebar .portal-nav a {
        min-height: 48px;
        padding: 0 14px;
        border-radius: 10px;
        color: #182b4c;
        font-size: 16px;
    }
.portal-sidebar .portal-nav a:hover { background: #f4f8ff; color: #0b6ff0; }
.portal-sidebar .portal-nav svg { width: 22px; height: 22px; }
.portal-sidebar .portal-recent {
        margin-top: 18px;
        padding-top: 14px;
        border-top-color: #edf1f7;
    }
.portal-sidebar .portal-recent h2 { padding: 0 10px; color: #7b8ba5; font-size: 14px; }
.portal-sidebar .portal-recent-list a,
    .portal-sidebar .portal-recent-empty {
        min-height: 48px;
        padding: 8px 10px;
        border-radius: 9px;
        color: #273447;
        font-size: 13px;
    }
.portal-sidebar .portal-recent-item {
        display: flex;
        align-items: center;
        gap: 4px;
        border-radius: 9px;
    }
.portal-sidebar .portal-recent-link {
        min-width: 0;
        flex: 1 1 auto;
    }
.portal-sidebar .portal-recent-delete {
        width: 28px;
        height: 28px;
        border: 0;
        border-radius: 8px;
        background: transparent;
        color: #8b98ab;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 28px;
        opacity: 0;
        pointer-events: none;
        cursor: pointer;
    }
.portal-sidebar .portal-recent-delete:hover {
        background: #fff1f1;
        color: #dc2626;
    }
.portal-sidebar .portal-recent-delete svg {
        width: 16px;
        height: 16px;
    }
.portal-sidebar .portal-recent-item:hover .portal-recent-delete,
    .portal-sidebar .portal-recent-delete:focus-visible {
        opacity: 1;
        pointer-events: auto;
    }
.portal-sidebar .portal-recent-list a:hover,
    .portal-sidebar .portal-recent-item:hover { background: #f6f9ff; }
.portal-sidebar .portal-recent-icon { width: 22px; height: 22px; }
.portal-sidebar .portal-recent-icon svg { width: 20px; height: 20px; }
.portal-sidebar .portal-recent-time { min-width: 42px; color: #7d899e; font-size: 12px; }
.portal-sidebar .portal-safety-link { margin-top: 18px; padding: 0 10px; color: #71809a; }
.portal-sidebar .portal-account { min-height: 68px; margin-top: 8px; }
.portal-sidebar .portal-account-chevron { display: none; }
.portal-toc {
    position: sticky;
    top: 22px;
}
.portal-toc h2 { display: none; }
.safe-use-article { min-width: 0; }
.safe-use-risk-list { border-color: #f0c36d; background: #fffaf0; }
.safe-use-risk-list .portal-risk-item { min-height: 79px; padding: 0 25px; gap: 22px; color: #172033; font-size: 17px; font-weight: 600; }
.safe-use-risk-list .portal-risk-item + .portal-risk-item { border-top-color: #f0d9a9; }
.safe-use-risk-list .portal-risk-item svg { width: 30px; height: 30px; flex: 0 0 30px; color: #df8400; }
.safe-use-section-title { margin: 28px 0 14px; color: var(--ink); font-size: 22px; }
.safe-use-guidance { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; padding: 20px 0; border: 1px solid var(--line); border-radius: 12px; background: #fbfdff; }
.safe-use-guidance .portal-action-card { min-height: 132px; padding: 8px 24px; border: 0; border-right: 1px solid var(--line); border-radius: 0; background: transparent; box-shadow: none; transform: none; text-align: left; align-items: flex-start; justify-content: flex-start; }
.safe-use-guidance .portal-action-card:last-child { border-right: 0; }
.safe-use-guidance .portal-icon-circle { width: 44px; height: 44px; flex-basis: 44px; }
.safe-use-guidance .portal-action-card strong { margin-top: 12px; color: var(--brand); font-size: 16px; }
.safe-use-guidance .portal-action-card span:not(.portal-icon-circle) { margin-top: 7px; color: #53627a; font-size: 13px; line-height: 1.65; }
.safe-use-actions { margin-top: 28px; }
.capabilities-article { min-width: 0; }
.capabilities-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.capability-card { min-height: 214px; padding: 25px 18px 22px; display: flex; flex-direction: column; align-items: center; justify-content: flex-start; border: 1px solid #d7e4f5; border-radius: 12px; background: #fff; color: var(--text); text-align: center; transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease; }
.capability-card:hover { border-color: #8ab9fb; box-shadow: 0 10px 24px rgba(28,85,160,.08); transform: translateY(-1px); }
.capability-card-icon { width: 76px; height: 76px; display: inline-flex; align-items: center; justify-content: center; color: var(--brand); }
.capability-card-icon svg { width: 100%; height: 100%; display: block; }
.capability-card strong { margin-top: 10px; color: #10294e; font-size: 22px; line-height: 1.25; }
.capability-card > span:last-child { margin-top: 7px; color: #53627a; font-size: 15px; line-height: 1.5; }
.capabilities-note { margin-top: 26px; padding-top: 17px; border-top: 1px solid var(--line); color: #53627a; font-size: 15px; line-height: 1.6; }
.capabilities-actions { margin-top: 22px; }
.privacy-data-article { min-width: 0; }
.privacy-data-overview {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    min-height: 290px;
    padding: 34px 22px;
    border: 1px solid #bdd7ff;
    border-radius: 12px;
    background: linear-gradient(112deg, #f3f8ff 0%, #fbfdff 100%);
}
.privacy-data-item {
    min-width: 0;
    padding: 0 24px;
    border-right: 1px solid #c8dcfb;
}
.privacy-data-item:first-child { padding-left: 22px; }
.privacy-data-item:last-child { padding-right: 12px; border-right: 0; }
.privacy-data-icon {
    width: 68px;
    height: 68px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--brand);
}
.privacy-data-icon svg { width: 100%; height: 100%; display: block; }
.privacy-data-item h3 {
    margin: 22px 0 10px;
    color: var(--ink);
    font-size: 19px;
    line-height: 1.3;
}
.privacy-data-item p {
    margin: 0;
    color: #53627a;
    font-size: 15px;
    line-height: 1.85;
}
.privacy-data-note {
    margin: 30px 0 0;
    color: #53627a;
    font-size: 15px;
    line-height: 1.75;
}
.privacy-data-actions { margin-top: 26px; }
.report-overview-layout { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 24px; margin-top: 20px; }
.report-overview-article { min-width: 0; }
.report-contact { min-height: 31px; display: flex; align-items: center; justify-content: flex-end; gap: 8px; margin-bottom: 12px; color: #53627a; font-size: 14px; }
.report-contact svg { width: 22px; height: 22px; color: #53627a; }
.report-contact a { color: var(--brand); }
.report-feature-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.report-feature-card { min-height: 300px; padding: 28px 28px 24px; display: flex; flex-direction: column; align-items: center; justify-content: flex-start; border: 1px solid #d3e1f3; border-radius: 13px; background: #fff; text-align: center; }
.report-feature-icon { width: 84px; height: 84px; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; background: #edf4ff; color: var(--brand); }
.report-feature-icon svg { width: 56px; height: 56px; display: block; }
.report-feature-card h2 { margin: 22px 0 10px; color: var(--ink); font-size: 22px; line-height: 1.3; }
.report-feature-card p { max-width: 330px; margin: 0; color: #53627a; font-size: 15px; line-height: 1.75; }
.report-feature-card-action .portal-button { min-width: 190px; margin-top: auto; }
.report-process { margin-top: 22px; padding: 24px 28px 19px; display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; align-items: center; gap: 18px; border: 1px solid #d3e1f3; border-radius: 13px; background: #fff; }
.report-process-step { display: flex; align-items: center; justify-content: center; gap: 12px; color: var(--ink); font-size: 16px; }
.report-process-icon { width: 58px; height: 58px; flex: 0 0 58px; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; background: #edf4ff; color: var(--brand); }
.report-process-icon svg { width: 34px; height: 34px; display: block; }
.report-process-arrow { color: #10294e; font-size: 31px; font-weight: 300; }
.report-process-caption { grid-column: 1 / -1; margin: 0; color: #53627a; font-size: 14px; line-height: 1.5; text-align: center; }
.report-overview-actions { justify-content: center; margin-top: 24px; padding-top: 22px; border-top: 1px solid var(--line); }
.account-data-layout { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 24px; margin-top: 46px; }
.account-data-article { min-width: 0; }
.account-data-heading { display: flex; align-items: center; gap: 16px; margin-bottom: 28px; }
.account-data-number { width: 56px; height: 56px; flex: 0 0 56px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid #9ec5ff; border-radius: 50%; background: #edf5ff; color: var(--brand); font-size: 25px; }
.account-data-heading h1 { margin: 0; color: var(--ink); font-size: 31px; line-height: 1.2; }
.account-data-heading p { margin: 8px 0 0; color: #53627a; font-size: 15px; line-height: 1.6; }
.account-controls-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.account-control-card { min-height: 350px; padding: 34px 22px 26px; display: flex; flex-direction: column; align-items: center; border: 1px solid #d3e1f3; border-radius: 13px; background: #fff; text-align: center; }
.account-control-icon { width: 84px; height: 84px; display: inline-flex; align-items: center; justify-content: center; color: var(--brand); }
.account-control-icon svg { width: 100%; height: 100%; display: block; }
.account-control-card h2 { margin: 23px 0 9px; color: var(--ink); font-size: 19px; line-height: 1.35; }
.account-control-card p { margin: 0; color: #53627a; font-size: 14px; line-height: 1.65; }
.account-email-link { margin-top: 11px; color: var(--brand); font-size: 15px; }
.account-control-link { margin-top: auto; padding-top: 20px; color: var(--brand); font-size: 15px; font-weight: 700; }
.account-policy-links { min-height: 57px; display: flex; align-items: center; justify-content: center; gap: 22px; border-bottom: 1px solid var(--line); color: var(--brand); font-size: 15px; }
.account-policy-links a { color: var(--brand); }
.account-policy-links span { color: var(--ink); }
.account-contact-box { margin-top: 20px; padding: 20px 24px 16px; border: 1px solid #d3e1f3; border-radius: 13px; background: #fff; }
.account-contact-box h2 { margin: 0 0 18px; color: var(--ink); font-size: 18px; }
.account-contact-grid { display: grid; grid-template-columns: minmax(0, 1fr) 1px minmax(0, 1fr); align-items: center; gap: 28px; }
.account-contact-item { display: flex; align-items: center; gap: 18px; }
.account-contact-icon { width: 52px; height: 52px; flex: 0 0 52px; display: inline-flex; align-items: center; justify-content: center; color: var(--brand); }
.account-contact-icon svg { width: 100%; height: 100%; display: block; }
.account-contact-item strong { display: block; color: var(--ink); font-size: 15px; }
.account-contact-item a { display: block; margin-top: 7px; color: var(--brand); font-size: 15px; }
.account-contact-divider { width: 1px; height: 59px; background: #d7e3f4; }
.account-contact-box > p { margin: 18px 0 0; color: #53627a; font-size: 14px; line-height: 1.6; }}
@media (max-width: 920px){.capabilities-grid { grid-template-columns: minmax(0, 1fr); gap: 14px; }
.capability-card { min-height: 180px; }
.capability-card-icon { width: 64px; height: 64px; }
.capability-card strong { font-size: 19px; }
.capability-card > span:last-child, .capabilities-note { font-size: 13px; }
.privacy-data-overview { grid-template-columns: minmax(0, 1fr); min-height: 0; gap: 0; padding: 10px 16px; }
.privacy-data-item, .privacy-data-item:first-child, .privacy-data-item:last-child { padding: 22px 4px; border-right: 0; border-bottom: 1px solid #c8dcfb; }
.privacy-data-item:last-child { border-bottom: 0; }
.privacy-data-icon { width: 58px; height: 58px; display: inline-flex; color: var(--brand); }
.privacy-data-icon svg { width: 100%; height: 100%; display: block; }
.privacy-data-item h3 { margin-top: 13px; font-size: 18px; }
.privacy-data-item p, .privacy-data-note { font-size: 14px; }
.portal-subpage-back { font-size: 14px; }
.report-overview-layout { display: block; margin-top: 18px; }
.report-contact { min-height: 31px; display: flex; align-items: center; justify-content: flex-start; margin-bottom: 12px; font-size: 13px; }
.report-contact svg { width: 22px; height: 22px; flex: 0 0 22px; display: block; }
.report-feature-grid { grid-template-columns: minmax(0, 1fr); gap: 14px; }
.report-feature-card { min-height: 250px; padding: 23px 18px; display: flex; flex-direction: column; align-items: center; justify-content: flex-start; }
.report-feature-icon { width: 70px; height: 70px; display: inline-flex; align-items: center; justify-content: center; }
.report-feature-icon svg { width: 48px; height: 48px; display: block; }
.report-feature-card h2 { font-size: 20px; }
.report-feature-card p { max-width: 330px; margin: 0; font-size: 14px; }
.report-feature-card-action .portal-button { margin-top: auto; }
.report-process { margin-top: 14px; padding: 20px 14px; display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; }
.report-process-arrow { transform: rotate(90deg); font-size: 24px; }
.report-process-step { display: flex; align-items: center; justify-content: flex-start; padding-left: 18%; }
.report-process-icon { width: 50px; height: 50px; flex-basis: 50px; display: inline-flex; align-items: center; justify-content: center; }
.report-process-icon svg { width: 30px; height: 30px; display: block; }
.report-process-caption { grid-column: auto; }
.account-data-layout { display: block; margin-top: 18px; }
.account-data-heading { gap: 11px; margin-bottom: 18px; }
.account-data-number { width: 45px; height: 45px; flex-basis: 45px; font-size: 20px; }
.account-data-heading h1 { font-size: 24px; }
.account-data-heading p { margin-top: 5px; font-size: 13px; }
.account-controls-grid { grid-template-columns: minmax(0, 1fr); gap: 14px; }
.account-control-card { min-height: 270px; padding: 25px 18px 21px; }
.account-control-icon { width: 70px; height: 70px; flex: 0 0 70px; display: inline-flex; align-items: center; justify-content: center; color: var(--brand); }
.account-control-icon svg { width: 100%; height: 100%; display: block; }
.account-control-card h2 { margin-top: 15px; font-size: 18px; }
.account-control-card p { font-size: 13px; }
.account-policy-links { min-height: 0; padding: 15px 0; flex-wrap: wrap; gap: 7px 12px; font-size: 13px; }
.account-contact-box { padding: 17px 16px 15px; }
.account-contact-grid { grid-template-columns: minmax(0, 1fr); gap: 15px; }
.account-contact-divider { width: 100%; height: 1px; }
.account-contact-item { gap: 13px; }
.account-contact-icon { width: 44px; height: 44px; flex-basis: 44px; }
.account-contact-item strong, .account-contact-item a { font-size: 13px; }
.portal-topbar { min-height: 64px; padding: 0 16px; grid-template-columns: auto 1fr auto; }
.portal-topbar-title { justify-self: center; max-width: 45vw; overflow: hidden; font-size: 16px; text-overflow: ellipsis; white-space: nowrap; }
.portal-topbar-actions { gap: 7px; }
.portal-top-safety-link span { display: none; }
.portal-top-safety-link svg { width: 19px; height: 19px; }}
.fuuvo-shell-search {
    position: fixed;
    inset: 0;
    z-index: 4100;
    display: flex;
    align-items: stretch;
    justify-content: flex-start;
    padding: 0;
    background: rgba(15, 23, 42, .16);
    backdrop-filter: blur(6px);
}
.fuuvo-shell-search.hidden { display: none !important; }
@media (min-width: 921px){html body.fuuvo-shell-search-open .fuuvo-shell-search {
        z-index: 10000 !important;
    }}
@media (min-width: 921px){header[data-fuuvo-shared-topbar="1"] {
        width: 100% !important;
        height: 86px !important;
        min-height: 86px !important;
        max-height: 86px !important;
        padding: 12px 22px 8px !important;
        box-sizing: border-box !important;
        overflow: visible !important;
    }
header[data-fuuvo-shared-topbar="1"]:has(.shell-topbar-back) {
        grid-template-columns: minmax(0, 1fr) auto !important;
    }
header[data-fuuvo-shared-topbar="1"]:has(.shell-topbar-back) .shell-topbar-center {
        display: none !important;
    }
header[data-fuuvo-shared-topbar="1"]:has(.shell-topbar-back) .shell-topbar-right {
        grid-column: 2 !important;
    }
header[data-fuuvo-shared-topbar="1"] .shell-topbar-left {
        min-width: 0 !important;
        min-height: 0 !important;
        height: auto !important;
        align-self: center !important;
        flex-wrap: nowrap !important;
    }
header[data-fuuvo-shared-topbar="1"] .shell-topbar-back,
    header[data-fuuvo-shared-topbar="1"] .shell-topbar-middle,
    header[data-fuuvo-shared-topbar="1"] .shell-topbar-suffix,
    header[data-fuuvo-shared-topbar="1"] .shell-topbar-separator {
        white-space: nowrap !important;
    }}
@media (max-width: 920px){.fuuvo-shell-search-dialog { width: 100%; height: 100dvh; border-right: 0; border-radius: 0; }
.fuuvo-shell-search-head { min-height: 64px; padding: 9px 10px 9px 12px; }
.fuuvo-shell-search-body { height: calc(100dvh - 64px); padding: 10px; }}
@media (min-width: 921px){.portal-shell:has(.ai-info-overview),
    .portal-shell:has(.capabilities-page),
    .portal-shell:has(.community-rules-page),
    .portal-shell:has(.portal-layout),
    .portal-shell:has(.report-overview-layout),
    .portal-shell:has(.account-data-layout) { height: 100vh; min-height: 100vh; overflow: hidden; }
.portal-shell:has(.ai-info-overview) .portal-content,
    .portal-shell:has(.capabilities-page) .portal-content,
    .portal-shell:has(.community-rules-page) .portal-content,
    .portal-shell:has(.portal-layout) .portal-content,
    .portal-shell:has(.report-overview-layout) .portal-content,
    .portal-shell:has(.account-data-layout) .portal-content { height: 100vh; min-height: 0; overflow: hidden; }
.portal-shell:has(.ai-info-overview) .portal-main,
    .portal-shell:has(.capabilities-page) .portal-main,
    .portal-shell:has(.community-rules-page) .portal-main,
    .portal-shell:has(.portal-layout) .portal-main,
    .portal-shell:has(.report-overview-layout) .portal-main,
    .portal-shell:has(.account-data-layout) .portal-main { flex: 1 1 auto; height: calc(100vh - 86px); min-height: 0; overflow-y: auto; overflow-x: hidden; }}
@media (min-width: 921px){.portal-shell:has(.capabilities-page) { height: 100vh; min-height: 100vh; overflow: hidden; }
.portal-shell:has(.capabilities-page) .portal-content { height: 100vh; min-height: 0; overflow: hidden; }
.portal-shell:has(.capabilities-page) .portal-main { flex: 1 1 auto; height: calc(100vh - 86px); min-height: 0; overflow-y: auto; overflow-x: hidden; }}
@media (max-width: 1050px) and (min-width: 921px){.capabilities-framework { grid-template-columns: 220px minmax(0, 1fr); gap: 22px; }
.capabilities-toc a { padding: 0 10px; gap: 9px; font-size: 14px; }
.capabilities-card-grid { gap: 12px; }
.capabilities-card { min-height: 190px; padding-left: 10px; padding-right: 10px; }
.capabilities-card strong { font-size: 18px; }
.capabilities-card > span:last-child { font-size: 13px; }}
@media (max-width: 920px){.portal-shell:has(.capabilities-page) .portal-topbar-title { display: none; }
.portal-shell:has(.capabilities-page) .portal-subpage-back { min-width: 0; max-width: 52vw; overflow: hidden; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.capabilities-framework { display: block; margin-top: 16px; }
.capabilities-toc { position: static; padding: 10px 7px; }
.capabilities-toc a { min-height: 37px; padding: 0 10px; font-size: 13px; }
.capabilities-toc a span { width: 24px; flex-basis: 24px; font-size: 14px; }
.capabilities-content { margin-top: 20px; }
.capabilities-content-heading { margin: 0 0 20px; }
.capabilities-content-heading h1 { font-size: 28px; }
.capabilities-content-heading p { margin-top: 9px; font-size: 14px; }
.capabilities-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.capabilities-card { min-height: 170px; padding: 18px 8px 15px; }
.capabilities-card-icon { width: 58px; height: 58px; }
.capabilities-card strong { margin-top: 9px; font-size: 17px; }
.capabilities-card > span:last-child { font-size: 12px; }
.capabilities-page-note { margin-top: 18px; padding-top: 14px; font-size: 13px; }
.capabilities-page-actions { margin-top: 17px; }}
@media (min-width: 921px){.portal-shell:has(.community-rules-page) { height: 100vh; min-height: 100vh; overflow: hidden; }
.portal-shell:has(.community-rules-page) .portal-content { height: 100vh; min-height: 0; overflow: hidden; }
.portal-shell:has(.community-rules-page) .portal-main { flex: 1 1 auto; height: calc(100vh - 86px); min-height: 0; overflow-y: auto; overflow-x: hidden; }}
@media (max-width: 920px){.portal-main:has(.portal-hero) .portal-featured-icon { width: 50px; height: 50px; flex-basis: 50px; }
.portal-main:has(.portal-hero) .portal-help-card .portal-icon-circle { width: 50px; height: 50px; flex-basis: 50px; }}
@media (max-width: 1050px) and (min-width: 921px){.ai-info-layout { grid-template-columns: 230px minmax(0, 1fr); gap: 20px; }
.ai-info-capability-grid { gap: 8px; margin-left: 0; }
.ai-info-section p { margin-left: 0; }
.ai-info-capability-grid a { padding: 8px 6px; font-size: 14px; }
.ai-info-capability-icon { width: 30px; height: 30px; flex-basis: 30px; }}
@media (max-width: 1300px) and (min-width: 1051px){.ai-info-capability-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }}
@media (max-width: 920px){.portal-shell:has(.ai-info-overview) .portal-topbar-title { display: none; }
.portal-shell:has(.ai-info-overview) .portal-subpage-back { min-width: 0; max-width: 52vw; overflow: hidden; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.ai-info-overview { margin-top: 17px; padding: 14px; }
.ai-info-overview h2 { font-size: 16px; }
.ai-info-overview-grid { grid-template-columns: minmax(0, 1fr); }
.ai-info-overview-item, .ai-info-overview-item:first-child, .ai-info-overview-item:last-child { min-height: 63px; padding: 9px 0; border-right: 0; border-bottom: 1px solid #d7e4f7; }
.ai-info-overview-item:last-child { border-bottom: 0; }
.ai-info-overview-icon { width: 48px; height: 48px; flex-basis: 48px; }
.ai-info-overview-item strong { font-size: 14px; }
.ai-info-overview-item div > span { font-size: 12px; }
.ai-info-layout { display: block; margin-top: 15px; }
.ai-info-toc { position: static; padding: 10px 7px; }
.ai-info-toc h2 { margin: 0 10px 7px; font-size: 16px; }
.ai-info-toc a { min-height: 36px; font-size: 13px; }
.ai-info-content { margin-top: 18px; }
.ai-info-section-heading { gap: 9px; }
.ai-info-section-heading h2 { font-size: 21px; }
.ai-info-section-number { width: 35px; height: 35px; flex-basis: 35px; font-size: 15px; }
.ai-info-section p { margin-left: 0; font-size: 13px; }
.ai-info-capability-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; margin-left: 0; }
.ai-info-capability-grid a { min-height: 56px; padding: 7px 8px; font-size: 14px; }
.ai-info-capability-icon { width: 30px; height: 30px; flex-basis: 30px; }
.ai-info-risk-list > div { min-height: 49px; padding: 5px 11px; font-size: 13px; }
.ai-info-next { font-size: 14px; }}
@media (max-width: 920px){.portal-sidebar .sidebar-brand { display: none; }}
@media (max-width: 920px){.portal-shell:has(.community-rules-page) .portal-topbar-title { display: none; }
.portal-shell:has(.community-rules-page) .portal-subpage-back { min-width: 0; max-width: 52vw; overflow: hidden; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.community-rules-header { padding: 0; }
.community-rules-header h1 { font-size: 29px; }
.community-rules-meta { font-size: 13px; }
.community-rules-intro { font-size: 14px; }
.community-policy-tabs { margin-top: 14px; padding: 0; overflow: visible; flex-wrap: wrap; justify-content: flex-start; }
.community-policy-tabs a, .community-policy-tabs a:first-child { min-height: 49px; padding: 0 11px; font-size: 13px; }
.community-rules-layout { display: block; margin-top: 14px; padding: 0 0 24px; }
.community-rules-toc { position: static; padding: 13px 9px; }
.community-rules-toc h2 { margin: 0 9px 8px; font-size: 15px; }
.community-rules-toc a { min-height: 35px; font-size: 13px; }
.community-rules-content { margin-top: 18px; }
.community-rule-section + .community-rule-section { margin-top: 20px; padding-top: 17px; }
.community-rule-section h2 { font-size: 20px; }
.community-rule-section > p { font-size: 14px; }
.community-standard-grid { grid-template-columns: minmax(0, 1fr); gap: 10px; }
.community-standard-card { min-height: 84px; padding: 13px; }
.community-standard-icon { width: 46px; height: 46px; flex-basis: 46px; }
.community-standard-card h3 { font-size: 15px; }
.community-standard-card p { font-size: 12px; }
.community-prohibited-list > div { min-height: 47px; grid-template-columns: 27px minmax(0, 1fr) auto; padding: 5px 10px; font-size: 13px; }
.community-responsible-list > div { grid-template-columns: 34px minmax(0, 1fr); gap: 8px 10px; padding: 10px 12px; }
.community-responsible-list span:last-child { grid-column: 2; font-size: 13px; }
.community-responsible-list strong { font-size: 14px; }
.community-enforcement-flow { grid-template-columns: minmax(0, 1fr); gap: 7px; }
.community-flow-arrow { justify-self: center; transform: rotate(90deg); font-size: 23px; }
.community-report-box { align-items: flex-start; padding: 14px; gap: 11px; }
.community-report-icon { width: 48px; height: 48px; flex-basis: 48px; }
.community-report-icon svg { width: 36px; height: 36px; }
.community-report-actions { align-items: flex-start; flex-direction: column; gap: 8px; }
.community-report-actions > span + span { padding-left: 0; border-left: 0; }
.community-contact-box { grid-template-columns: minmax(0, 1fr); gap: 14px; padding: 15px; }
.community-contact-box .portal-button { justify-self: start; }}
@media (min-width: 921px){html:has(body > .creation-app),
    html:has(body > .portal-shell),
    html:has(body > .feature-shell) {
        height: auto !important;
        min-height: 100% !important;
        max-height: none !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
    }
body:has(> .creation-app),
    body:has(> .portal-shell),
    body:has(> .feature-shell) {
        height: auto !important;
        min-height: 100% !important;
        max-height: none !important;
        overflow: visible !important;
    }
.creation-app,
    .portal-shell,
    .feature-shell {
        height: auto !important;
        min-height: 100vh !important;
        min-height: 100dvh !important;
        max-height: none !important;
        overflow: visible !important;
    }
.creation-app > aside[data-fuuvo-shared-sidebar="1"],
    .portal-shell > aside[data-fuuvo-shared-sidebar="1"],
    .feature-shell > aside[data-fuuvo-shared-sidebar="1"] {
        height: 100vh !important;
        height: 100dvh !important;
        min-height: 100vh !important;
        min-height: 100dvh !important;
        max-height: 100vh !important;
        max-height: 100dvh !important;
        position: sticky !important;
        top: 0 !important;
        align-self: start !important;
        overflow: hidden !important;
    }
.creation-workspace,
    .portal-content,
    .feature-shell > .workspace,
    .creation-app [data-fuuvo-app-workspace="1"],
    .portal-shell [data-fuuvo-app-workspace="1"],
    .feature-shell [data-fuuvo-app-workspace="1"] {
        width: 100%;
        height: auto !important;
        min-height: 100vh !important;
        min-height: 100dvh !important;
        min-width: 0;
        overflow: visible !important;
    }
.creation-topbar,
    .portal-topbar,
    .feature-shell .workspace-chat-header,
    .creation-app [data-fuuvo-shared-topbar="1"],
    .portal-shell [data-fuuvo-shared-topbar="1"],
    .feature-shell [data-fuuvo-shared-topbar="1"] {
        flex: 0 0 auto;
        position: sticky !important;
        top: 0 !important;
        z-index: 30;
    }
.creation-main,
    .food-main,
    .analysis-main,
    .fortune-main,
    .portal-main,
    .feature-shell .main,
    .creation-app [data-fuuvo-app-scroll="1"],
    .portal-shell [data-fuuvo-app-scroll="1"],
    .feature-shell [data-fuuvo-app-scroll="1"] {
        height: auto !important;
        min-height: 0 !important;
        flex: 0 0 auto !important;
        overflow: visible !important;
        overscroll-behavior: auto;
    }}
@media (min-width: 921px){[data-fuuvo-app-scroll="1"] {
        margin-left: 56px !important;
        margin-right: 40px !important;
    }
.creation-main,
    .analysis-main {
        width: min(1120px, calc(100% - 96px)) !important;
    }
.food-main {
        width: min(1220px, calc(100% - 96px)) !important;
    }
.fortune-main {
        width: min(1180px, calc(100% - 96px)) !important;
    }
.portal-main,
    .feature-shell .main {
        width: min(1220px, calc(100% - 96px)) !important;
    }}
@media (min-width: 921px){body.chat-landing[data-mode="chat"] {
        --chat-sidebar-width: 272px !important;
    }
body.chat-landing[data-mode="chat"] .app {
        grid-template-columns: 272px 1px minmax(0, 1fr) !important;
    }
body.sidebar-collapsed.chat-landing[data-mode="chat"] .app {
        grid-template-columns: 0 0 minmax(0, 1fr) !important;
    }
.creation-app,
    .portal-shell,
    .feature-shell {
        grid-template-columns: 272px minmax(0, 1fr) !important;
    }
.creation-app > aside[data-fuuvo-shared-sidebar="1"],
    .portal-shell > aside[data-fuuvo-shared-sidebar="1"],
    .feature-shell > aside[data-fuuvo-shared-sidebar="1"],
    [data-fuuvo-app-shell="1"] > aside[data-fuuvo-shared-sidebar="1"] {
        width: 272px !important;
        min-width: 272px !important;
        max-width: 272px !important;
        padding: 12px 8px 10px 10px !important;
        gap: 8px !important;
        border: 0 !important;
        border-right: 1px solid rgba(15, 23, 42, .06) !important;
        border-radius: 0 !important;
        background: #f8f8f8 !important;
        box-shadow: none !important;
    }
aside[data-fuuvo-shared-sidebar="1"] .sidebar-shell {
        width: 100% !important;
        min-width: 0 !important;
        padding: 0 !important;
        display: grid !important;
        align-content: start !important;
        gap: 8px !important;
    }
aside[data-fuuvo-shared-sidebar="1"] .sidebar-brand-row,
    aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav {
        margin: 0 !important;
    }
aside[data-fuuvo-shared-sidebar="1"] .sidebar-brand-copy {
        margin-top: 0 !important;
    }
aside[data-fuuvo-shared-sidebar="1"] .sidebar-search-trigger {
        min-height: 44px !important;
        margin: 0 !important;
        padding: 0 12px 0 14px !important;
        display: grid !important;
        grid-template-columns: auto minmax(0, 1fr) auto !important;
        gap: 10px !important;
        border: 1px solid rgba(15, 23, 42, .06) !important;
        border-radius: 16px !important;
        background: rgba(255, 255, 255, .96) !important;
        color: #637086 !important;
        box-shadow: 0 10px 24px rgba(15, 23, 42, .04) !important;
        font: inherit !important;
    }
aside[data-fuuvo-shared-sidebar="1"] .sidebar-search-trigger-label {
        font-size: 14px !important;
    }
aside[data-fuuvo-shared-sidebar="1"] .sidebar-search-trigger-shortcut {
        min-height: 24px !important;
        padding: 0 8px !important;
        border-radius: 999px !important;
        background: rgba(15, 23, 42, .05) !important;
        color: #8c97aa !important;
        font-size: 11px !important;
        font-weight: 700 !important;
    }
aside[data-fuuvo-shared-sidebar="1"] .sidebar-safety-link {
        min-height: 40px !important;
        display: flex !important;
    }
header[data-fuuvo-shared-topbar="1"] {
        min-height: 86px !important;
        padding: 12px 22px 8px !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) !important;
        align-items: center !important;
        gap: 10px !important;
        border: 0 !important;
        background: linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(255,255,255,.92) 82%, rgba(255,255,255,0) 100%) !important;
        backdrop-filter: blur(14px) !important;
    }
header[data-fuuvo-shared-topbar="1"]:has(.shell-topbar-back) {
        grid-template-columns: minmax(230px, 1fr) auto minmax(230px, 1fr) !important;
    }
header[data-fuuvo-shared-topbar="1"]:has(.shell-topbar-back) .shell-topbar-center {
        display: grid !important;
    }
header[data-fuuvo-shared-topbar="1"]:has(.shell-topbar-back) .shell-topbar-right {
        grid-column: auto !important;
    }
header[data-fuuvo-shared-topbar="1"] .shell-topbar-back,
    header[data-fuuvo-shared-topbar="1"] .shell-topbar-back span {
        min-width: 0;
        white-space: nowrap !important;
    }
header[data-fuuvo-shared-topbar="1"] :is(.portal-top-safety-link, .creation-top-safety) > img.fuuvo-design-icon {
        width: 21px !important;
        height: 21px !important;
        display: block !important;
        flex: 0 0 21px !important;
        object-fit: contain !important;
        visibility: visible !important;
    }
header[data-fuuvo-shared-topbar="1"] .workspace-chat-header-center,
    header[data-fuuvo-shared-topbar="1"] #feature-shell-title,
    header[data-fuuvo-shared-topbar="1"] .portal-top-safety-link {
        display: flex !important;
    }
header[data-fuuvo-shared-topbar="1"] #feature-shell-title {
        color: #111827 !important;
        font-size: 15px !important;
        font-weight: 700 !important;
    }
header[data-fuuvo-shared-topbar="1"] .workspace-header-login,
    header[data-fuuvo-shared-topbar="1"] .creation-login,
    header[data-fuuvo-shared-topbar="1"] .portal-login {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        box-sizing: border-box !important;
        min-width: 96px !important;
        min-height: 44px !important;
        padding: 0 22px !important;
        border: 0 !important;
        border-radius: 999px !important;
        background: #102746 !important;
        color: #fff !important;
        font-size: 15px !important;
        font-weight: 700 !important;
        line-height: 1 !important;
        text-decoration: none !important;
        cursor: pointer;
    }}
.fuuvo-mobile-sidebar-close,
.fuuvo-mobile-sidebar-auth,
.fuuvo-mobile-explore,
.fuuvo-mobile-powered,
.fuuvo-mobile-sidebar-backdrop {
    display: none;
}
@media (max-width: 920px){body.mobile-nav-open,
    body.fuuvo-mobile-sidebar-open {
        overflow: hidden !important;
    }
aside[data-fuuvo-shared-sidebar="1"],
    [data-fuuvo-app-shell="1"] > aside[data-fuuvo-shared-sidebar="1"] {
        position: fixed !important;
        inset: 0 auto 0 0 !important;
        z-index: 230 !important;
        width: min(calc(var(--mobile-viewport-width, 100vw) * .76), 340px) !important;
        height: 100dvh !important;
        min-height: 100dvh !important;
        max-height: 100dvh !important;
        padding: 22px 20px 18px !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 0 !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: #fff !important;
        box-shadow: 18px 0 42px rgba(20, 37, 64, .16) !important;
        transform: translateX(-105%) !important;
        transition: transform .24s ease !important;
        overscroll-behavior: contain;
        align-self: auto !important;
    }
body.mobile-nav-open aside[data-fuuvo-shared-sidebar="1"],
    body.fuuvo-mobile-sidebar-open aside[data-fuuvo-shared-sidebar="1"] {
        transform: translateX(0) !important;
    }
.fuuvo-mobile-sidebar-backdrop {
        position: fixed;
        inset: 0;
        z-index: 225;
        padding: 0;
        border: 0;
        background: rgba(20, 33, 53, .42);
        backdrop-filter: blur(3px);
    }
body.mobile-nav-open .fuuvo-mobile-sidebar-backdrop,
    body.fuuvo-mobile-sidebar-open .fuuvo-mobile-sidebar-backdrop {
        display: block;
    }
body.mobile-nav-open #mobile-backdrop {
        display: none !important;
    }
.fuuvo-mobile-sidebar-close {
        position: absolute;
        top: 32px;
        right: 19px;
        z-index: 4;
        width: 40px;
        height: 40px;
        padding: 0;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border: 0;
        border-radius: 10px;
        background: transparent;
        color: #10284c;
        cursor: pointer;
    }
.fuuvo-mobile-sidebar-close svg {
        width: 27px;
        height: 27px;
    }
aside[data-fuuvo-shared-sidebar="1"] .sidebar-shell {
        width: 100% !important;
        flex: 0 0 auto !important;
        display: block !important;
    }
aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand {
        width: calc(100% - 48px) !important;
        min-height: 72px !important;
        margin: 0 0 24px !important;
        padding: 0 4px !important;
        display: flex !important;
        align-items: center !important;
        gap: 8px !important;
    }
aside[data-fuuvo-shared-sidebar="1"] .sidebar-brand-logo img {
        width: auto !important;
        max-width: 116px !important;
        height: 42px !important;
        object-fit: contain !important;
        object-position: left center !important;
        background: transparent !important;
    }
aside[data-fuuvo-shared-sidebar="1"] .sidebar-brand-copy {
        margin-left: -116px !important;
        padding-top: 43px !important;
        min-width: 116px !important;
        display: block !important;
        color: #0877f9 !important;
        text-align: center !important;
    }
aside[data-fuuvo-shared-sidebar="1"] .sidebar-brand-name {
        color: #0877f9 !important;
        font-size: 15px !important;
        font-weight: 650 !important;
    }
aside[data-fuuvo-shared-sidebar="1"] .sidebar-brand-name-image {
        width: 52px !important;
        height: auto !important;
        max-width: 52px !important;
        margin: 0 auto !important;
        display: block !important;
        background: transparent !important;
    }
aside[data-fuuvo-shared-sidebar="1"] .sidebar-brand-name::after {
        content: "鈩?;
        margin-left: 2px;
        font-size: 9px;
        vertical-align: top;
    }

    aside[data-fuuvo-shared-sidebar="1"] .sidebar-brand-suffix,
    aside[data-fuuvo-shared-sidebar="1"] .sidebar-search-trigger {
        display: none !important;
    }

    aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav {
        width: 100% !important;
        margin: 0 !important;
        padding: 0 0 20px !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 2px !important;
        border-bottom: 1px solid #dce3ed !important;
    }

    aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav-btn {
        width: 100% !important;
        min-height: 42px !important;
        padding: 0 6px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        border: 0 !important;
        border-radius: 10px !important;
        background: transparent !important;
        color: #10284c !important;
        font-size: 17px !important;
        font-weight: 500 !important;
        text-decoration: none !important;
        box-shadow: none !important;
    }

    aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav-btn:first-child {
        min-height: 40px !important;
        margin-bottom: 8px !important;
        justify-content: center !important;
        border: 1.5px solid #0877f9 !important;
        color: #0877f9 !important;
        font-size: 14px !important;
    }

    aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav-btn .rail-icon {
        width: 100% !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 15px !important;
    }

    aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav-btn:first-child .rail-icon {
        width: auto !important;
        justify-content: center !important;
        gap: 13px !important;
    }

    aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav-btn .rail-glyph {
        width: 25px !important;
        height: 25px !important;
        flex: 0 0 25px !important;
        color: #0877f9 !important;
    }

    aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav-btn:first-child .rail-glyph {
        width: 22px !important;
        height: 22px !important;
        flex-basis: 22px !important;
    }

    aside[data-fuuvo-shared-sidebar="1"] .history-main,
    aside[data-fuuvo-shared-sidebar="1"] .portal-recent {
        width: 100% !important;
        min-height: 0 !important;
        max-height: none !important;
        margin: 0 !important;
        padding: 19px 4px 12px !important;
        display: block !important;
        flex: 0 0 auto !important;
        overflow: visible !important;
        border: 0 !important;
    }

    aside[data-fuuvo-shared-sidebar="1"] .history-head,
    aside[data-fuuvo-shared-sidebar="1"] .history-composer-slot,
    aside[data-fuuvo-shared-sidebar="1"] .history-actions,
    aside[data-fuuvo-shared-sidebar="1"] .history-search,
    aside[data-fuuvo-shared-sidebar="1"] .pagination,
    aside[data-fuuvo-shared-sidebar="1"] .recent-empty,
    aside[data-fuuvo-shared-sidebar="1"] .conversation-preview,
    aside[data-fuuvo-shared-sidebar="1"] .conversation-meta {
        display: none !important;
    }

    /* Keep the more/delete button visible on mobile */
    aside[data-fuuvo-shared-sidebar="1"] .conversation-actions {
        display: inline-flex !important;
    }

    aside[data-fuuvo-shared-sidebar="1"] .conversation-more-btn {
        opacity: 1 !important;
        pointer-events: auto !important;
    }

    aside[data-fuuvo-shared-sidebar="1"] .sidebar-section-label,
    aside[data-fuuvo-shared-sidebar="1"] .portal-recent > h2 {
        margin: 0 0 6px !important;
        display: block !important;
        color: #6f809b !important;
        font-size: 14px !important;
        font-weight: 500 !important;
    }

    aside[data-fuuvo-shared-sidebar="1"] .conversation-list,
    aside[data-fuuvo-shared-sidebar="1"] .task-list,
    aside[data-fuuvo-shared-sidebar="1"] .portal-recent-list {
        display: block !important;
    }

    aside[data-fuuvo-shared-sidebar="1"] .conversation-item,
    aside[data-fuuvo-shared-sidebar="1"] .task-item,
    aside[data-fuuvo-shared-sidebar="1"] .portal-recent-item,
    aside[data-fuuvo-shared-sidebar="1"] .portal-recent-list > a,
    aside[data-fuuvo-shared-sidebar="1"] .portal-recent-link {
        min-height: 32px !important;
        margin: 0 !important;
        padding: 0 !important;
        display: flex !important;
        align-items: center !important;
        border: 0 !important;
        border-radius: 8px !important;
        background: transparent !important;
        box-shadow: none !important;
        color: #10284c !important;
        text-decoration: none !important;
    }

    aside[data-fuuvo-shared-sidebar="1"] .portal-recent-item {
        gap: 6px !important;
    }

    aside[data-fuuvo-shared-sidebar="1"] .portal-recent-link {
        min-width: 0 !important;
        flex: 1 1 auto !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    aside[data-fuuvo-shared-sidebar="1"] .portal-recent-delete {
        width: 28px !important;
        height: 28px !important;
        flex: 0 0 28px !important;
        opacity: 1 !important;
        pointer-events: auto !important;
    }

    aside[data-fuuvo-shared-sidebar="1"] .conversation-head {
        width: 100% !important;
        display: grid !important;
        grid-template-columns: 20px minmax(0, 1fr) auto auto !important;
        gap: 7px !important;
        align-items: center !important;
    }

    aside[data-fuuvo-shared-sidebar="1"] .conversation-item-icon {
        width: 20px !important;
        height: 20px !important;
        color: #10284c !important;
    }

    aside[data-fuuvo-shared-sidebar="1"] .conversation-item-icon svg {
        width: 20px !important;
        height: 20px !important;
    }

    aside[data-fuuvo-shared-sidebar="1"] .conversation-title {
        overflow: hidden !important;
        color: #10284c !important;
        font-size: 13px !important;
        font-weight: 450 !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    aside[data-fuuvo-shared-sidebar="1"] .conversation-time {
        min-width: 34px !important;
        padding: 0 !important;
        color: #7788a3 !important;
        font-size: 12px !important;
        text-align: right !important;
    }

    .fuuvo-mobile-sidebar-auth {
        width: 100%;
        padding: 14px 4px 19px;
        display: block;
        border-bottom: 1px solid #dce3ed;
    }

    .fuuvo-mobile-sidebar-auth p {
        margin: 0 0 8px;
        color: #7888a2;
        font-size: 13px;
        line-height: 1.5;
    }

    .fuuvo-mobile-sidebar-auth a,
    .fuuvo-mobile-sidebar-auth button,
    .fuuvo-mobile-sidebar-auth strong {
        padding: 0;
        border: 0;
        background: transparent;
        color: #0877f9 !important;
        font: inherit;
        font-size: 15px;
        font-weight: 600;
        text-decoration: none !important;
        cursor: pointer;
    }

    .fuuvo-mobile-explore {
        width: 100%;
        padding: 19px 4px 10px;
        display: block;
    }

    .fuuvo-mobile-explore h2 {
        margin: 0 0 12px;
        color: #6f809b;
        font-size: 14px;
        font-weight: 500;
    }

    .fuuvo-mobile-explore a {
        min-height: 45px;
        display: flex;
        align-items: center;
        gap: 13px;
        color: #10284c !important;
        font-size: 15px;
        font-weight: 450;
        text-decoration: none !important;
    }

    .fuuvo-mobile-explore svg {
        width: 24px;
        height: 24px;
        flex: 0 0 24px;
        color: #0877f9;
    }

    aside[data-fuuvo-shared-sidebar="1"] .sidebar-safety-link,
    aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-area {
        display: none !important;
    }

    .fuuvo-mobile-powered {
        margin-top: auto;
        padding: 34px 4px 4px;
        display: block;
        color: #7f90aa;
        font-size: 13px;
    }

    body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] {
        background: #fff !important;
        color: #10284c !important;
    }
}

/* Shared settings drawer opened by the top-right sign-in button. */
a.workspace-header-login,
a.creation-login,
a.portal-login,
button.creation-login,
button.portal-login {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    border: 0;
    font-family: inherit;
    line-height: 1;
    text-decoration: none;
    cursor: pointer;
}

/* Desktop explore menu opened by the top-left menu button. */
.topbar-explore-menu.hidden {
    display: none !important;
}

.topbar-explore-menu {
    position: fixed;
    width: 208px;
    padding: 15px 14px 0;
    overflow: hidden;
    border: 1px solid #d7dee9;
    border-radius: 12px;
    background: rgba(255, 255, 255, .98);
    box-shadow: 0 10px 24px rgba(24, 43, 72, .13);
    color: #2c4263;
    z-index: 150;
}

.topbar-explore-menu section {
    margin: 0;
    padding: 0 0 10px;
}

.topbar-explore-menu section + section {
    padding-top: 12px;
    border-top: 1px solid #e1e6ee;
}

.topbar-explore-menu h2 {
    margin: 0 8px 7px;
    color: #50627d;
    font-size: 14px;
    font-weight: 650;
    line-height: 1.45;
}

.topbar-explore-menu a {
    min-height: 41px;
    padding: 0 8px;
    display: flex;
    align-items: center;
    border-radius: 7px;
    color: #2f4667 !important;
    font-size: 15px;
    font-weight: 450;
    line-height: 1.4;
    text-decoration: none !important;
    white-space: nowrap;
}

.topbar-explore-menu a:hover,
.topbar-explore-menu a:focus-visible {
    background: #f2f6fb;
    color: #0877f9 !important;
    outline: 0;
}

.topbar-explore-menu .topbar-explore-powered {
    min-height: 48px;
    margin: 0 -14px;
    padding: 0 22px;
    border-top: 1px solid #e1e6ee;
    border-radius: 0;
    color: #8b99ad !important;
    font-size: 13px;
}

body[data-ui-theme="dark"] .topbar-explore-menu {
    border-color: #334155;
    background: rgba(22, 32, 51, .98);
    box-shadow: 0 12px 28px rgba(0, 0, 0, .32);
}

body[data-ui-theme="dark"] .topbar-explore-menu section + section,
body[data-ui-theme="dark"] .topbar-explore-menu .topbar-explore-powered {
    border-color: #334155;
}

body[data-ui-theme="dark"] .topbar-explore-menu h2 {
    color: #aab8cb;
}

body[data-ui-theme="dark"] .topbar-explore-menu a {
    color: #e6edf8 !important;
}

body[data-ui-theme="dark"] .topbar-explore-menu a:hover,
body[data-ui-theme="dark"] .topbar-explore-menu a:focus-visible {
    background: #202b3d;
    color: #5ca8ff !important;
}

body[data-ui-theme="dark"] .topbar-explore-menu .topbar-explore-powered {
    color: #8fa0b8 !important;
}

@media (max-width: 920px) {
    .topbar-explore-menu {
        display: none !important;
    }
}

.topbar-settings-backdrop {
    position: fixed;
    inset: 84px 0 0;
    padding: 0;
    border: 0;
    background: transparent;
    z-index: 139;
}

.topbar-settings-backdrop.hidden,
.topbar-settings-drawer.hidden,
.topbar-settings-choice-panel.hidden,
.topbar-settings-drawer [data-settings-drawer-main].hidden {
    display: none !important;
}

.topbar-settings-drawer {
    position: fixed;
    top: 84px;
    right: 0;
    bottom: 0;
    width: 360px;
    display: flex;
    flex-direction: column;
    border-left: 1px solid #e1e7f0;
    background: #fff;
    box-shadow: -10px 0 30px rgba(27, 45, 74, .08);
    color: #10213d;
    z-index: 140;
}

.topbar-settings-drawer-head {
    min-height: 70px;
    padding: 0 27px 0 30px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #e1e7f0;
}

.topbar-settings-drawer-head h2 {
    margin: 0;
    color: #10213d;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.3;
}

.topbar-settings-drawer-head button {
    width: 38px;
    height: 38px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 9px;
    background: transparent;
    color: #10213d;
    cursor: pointer;
}

.topbar-settings-drawer-head button:hover {
    background: #f3f6fa;
}

.topbar-settings-drawer-head svg {
    width: 25px;
    height: 25px;
}

.topbar-settings-drawer-body {
    min-height: 0;
    flex: 1 1 auto;
    padding: 19px 22px 20px 30px;
    overflow-x: hidden;
    overflow-y: auto;
}

.topbar-settings-drawer [data-settings-drawer-main] {
    min-height: 100%;
    display: flex;
    flex-direction: column;
}

.topbar-settings-group {
    padding: 8px 0 15px;
    border-bottom: 1px solid #e1e7f0;
}

.topbar-settings-group + .topbar-settings-group {
    padding-top: 24px;
}

.topbar-settings-group h3 {
    margin: 0 0 12px;
    color: #7b8ba5;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.4;
}

.topbar-settings-row {
    width: 100%;
    min-height: 54px;
    padding: 0 8px 0 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: #182b4c !important;
    font: inherit;
    font-size: 15px;
    font-weight: 500;
    line-height: 1.35;
    text-align: left;
    text-decoration: none !important;
    cursor: pointer;
}

.topbar-settings-row:hover {
    background: #f5f8fc;
    color: #0877f9 !important;
}

.topbar-settings-row > span:last-child {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    color: #314463;
}

.topbar-settings-row b {
    max-width: 112px;
    overflow: hidden;
    font-size: 15px;
    font-weight: 500;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.topbar-settings-row svg,
.topbar-settings-panel-back svg {
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.topbar-settings-account-action {
    min-height: 57px;
    margin-top: auto;
    padding: 0 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #9cafcc;
    border-radius: 8px;
    background: #fff;
    color: #233a5d !important;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.35;
    text-align: center;
    text-decoration: none !important;
}

.topbar-settings-account-action:hover {
    border-color: #0877f9;
    color: #0877f9 !important;
}

.topbar-settings-choice-panel {
    min-height: 100%;
}

.topbar-settings-panel-back {
    width: 100%;
    min-height: 52px;
    margin-bottom: 13px;
    padding: 0 4px;
    display: flex;
    align-items: center;
    gap: 10px;
    border: 0;
    border-bottom: 1px solid #e1e7f0;
    background: transparent;
    color: #10213d;
    font: inherit;
    font-size: 17px;
    font-weight: 700;
    cursor: pointer;
}

.topbar-settings-option {
    width: 100%;
    min-height: 52px;
    padding: 0 9px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: #233a5d;
    font: inherit;
    font-size: 15px;
    text-align: left;
    cursor: pointer;
}

.topbar-settings-option:hover {
    background: #f5f8fc;
}

.topbar-settings-option i {
    width: 17px;
    height: 17px;
    border: 1px solid #b9c5d5;
    border-radius: 50%;
}

.topbar-settings-option.is-selected {
    color: #0877f9;
    font-weight: 600;
}

.topbar-settings-option.is-selected i {
    border-color: #0877f9;
    background: #0877f9;
    box-shadow: inset 0 0 0 4px #fff;
}

body[data-ui-theme="dark"] .topbar-settings-drawer {
    border-left-color: #334155;
    background: #101a2b;
    color: #edf4ff;
}

body[data-ui-theme="dark"] .topbar-settings-drawer-head,
body[data-ui-theme="dark"] .topbar-settings-group,
body[data-ui-theme="dark"] .topbar-settings-panel-back {
    border-color: #334155;
}

body[data-ui-theme="dark"] .topbar-settings-drawer-head h2,
body[data-ui-theme="dark"] .topbar-settings-drawer-head button,
body[data-ui-theme="dark"] .topbar-settings-row,
body[data-ui-theme="dark"] .topbar-settings-row > span:last-child,
body[data-ui-theme="dark"] .topbar-settings-panel-back,
body[data-ui-theme="dark"] .topbar-settings-option {
    color: #edf4ff !important;
}

body[data-ui-theme="dark"] .topbar-settings-row:hover,
body[data-ui-theme="dark"] .topbar-settings-option:hover,
body[data-ui-theme="dark"] .topbar-settings-drawer-head button:hover {
    background: #1e293b;
}

body[data-ui-theme="dark"] .topbar-settings-account-action {
    border-color: #52637e;
    background: #162033;
    color: #edf4ff !important;
}

@media (max-width: 920px) {
    .topbar-settings-backdrop {
        inset: 64px 0 0;
    }

    .topbar-settings-drawer {
        top: 64px;
        width: min(360px, 100vw);
    }

    .topbar-settings-drawer-head {
        min-height: 62px;
        padding: 0 18px 0 22px;
    }

    .topbar-settings-drawer-body {
        padding: 14px 18px 18px 22px;
    }
}

/* Quick settings opened by the standalone gear button. */
aside[data-fuuvo-shared-sidebar="1"] {
    overflow: visible !important;
    z-index: 80 !important;
}

[data-fuuvo-app-shell="1"] > aside[data-fuuvo-shared-sidebar="1"],
.creation-app > aside[data-fuuvo-shared-sidebar="1"],
.portal-shell > aside[data-fuuvo-shared-sidebar="1"],
.feature-shell > aside[data-fuuvo-shared-sidebar="1"] {
    overflow: visible !important;
    z-index: 80 !important;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-settings.is-active {
    border: 2px solid #79b5ff;
    border-radius: 50%;
    background: #fff;
    color: #0877f9;
    box-shadow: 0 0 0 3px #e8f2ff;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings {
    position: absolute;
    right: -92px;
    bottom: calc(100% + 18px);
    width: 240px;
    padding: 15px 20px 12px;
    border: 1px solid #d7e0ec;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 12px 28px rgba(29, 47, 77, .15);
    color: #10213d;
    z-index: 110;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings::before,
aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings::after {
    content: "";
    position: absolute;
    right: 105px;
    bottom: -10px;
    width: 18px;
    height: 18px;
    transform: rotate(45deg);
    border-right: 1px solid #d7e0ec;
    border-bottom: 1px solid #d7e0ec;
    background: #fff;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings::before {
    bottom: -12px;
    box-shadow: 5px 5px 12px rgba(29, 47, 77, .08);
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings.hidden,
aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-panel.hidden,
aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-main.hidden {
    display: none !important;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-title {
    display: block;
    margin: 0 0 10px;
    color: #10213d;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.35;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-row {
    width: 100%;
    min-height: 31px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: #263958 !important;
    font: inherit;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.3;
    text-align: left;
    text-decoration: none !important;
    cursor: pointer;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-row:hover {
    background: #f4f7fb;
    color: #0877f9 !important;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-row > svg,
aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-value svg,
aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-back svg {
    width: 17px;
    height: 17px;
    flex: 0 0 17px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-value {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
    color: #425472;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-value b {
    max-width: 82px;
    overflow: hidden;
    font-size: 13px;
    font-weight: 500;
    text-overflow: ellipsis;
    white-space: nowrap;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-divider {
    height: 1px;
    margin: 10px 0 8px;
    background: #dfe5ee;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-footer {
    width: calc(100% + 4px);
    min-height: 33px;
    margin: 9px -2px -3px;
    padding: 8px 0 0;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    border: 0;
    border-top: 1px solid #edf0f5;
    background: transparent;
    color: #8b98ad !important;
    font: inherit;
    font-size: 11px;
    line-height: 1.35;
    text-align: center;
    text-decoration: none !important;
    cursor: pointer;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-footer:hover {
    color: #0877f9 !important;
}

/* Let quick settings grow with all of its content.  The footer and nested
 * panels must not be trapped inside a fixed-height scrolling surface. */
aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings,
aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-main,
aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-panel {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-back {
    width: 100%;
    min-height: 33px;
    margin: -4px 0 8px;
    padding: 0;
    display: flex;
    align-items: center;
    gap: 7px;
    border: 0;
    border-bottom: 1px solid #edf0f5;
    background: transparent;
    color: #10213d;
    font: inherit;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-option {
    width: 100%;
    min-height: 35px;
    padding: 0 5px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: #263958;
    font: inherit;
    font-size: 13px;
    text-align: left;
    cursor: pointer;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-option:hover {
    background: #f4f7fb;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-option i {
    width: 15px;
    height: 15px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #b9c5d5;
    border-radius: 50%;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-option.is-selected {
    color: #0877f9;
    font-weight: 600;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-option.is-selected i {
    border-color: #0877f9;
    box-shadow: inset 0 0 0 4px #fff;
    background: #0877f9;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-explore-links {
    display: grid;
    gap: 2px;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-explore-links a {
    width: 100%;
    min-height: 34px;
    padding: 0 5px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    border-radius: 7px;
    color: #263958 !important;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.35;
    text-decoration: none !important;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-explore-links a:hover {
    background: #f4f7fb;
    color: #0877f9 !important;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-explore-links svg {
    width: 17px;
    height: 17px;
    flex: 0 0 17px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-powered {
    margin-top: 9px;
    padding-top: 10px;
    border-top: 1px solid #edf0f5;
    color: #8b98ad;
    font-size: 11px;
    line-height: 1.35;
    text-align: center;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings,
body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings::before,
body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings::after {
    border-color: #334155;
    background: #162033;
    color: #eef4ff;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-title,
body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-back,
body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-row,
body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-option,
body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-explore-links a {
    color: #eef4ff !important;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-row:hover,
body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-option:hover,
body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-explore-links a:hover {
    background: #202b3d;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-divider,
body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-footer,
body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-back,
body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-powered {
    border-color: #334155;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-powered {
    color: #94a3b8;
}

/* Final shared collapse contract; legacy page styles must not reopen the rail. */
@media (min-width: 921px) {
    .creation-app.sidebar-collapsed,
    .feature-shell.sidebar-collapsed,
    .portal-shell.sidebar-collapsed {
        grid-template-columns: 0 minmax(0, 1fr) !important;
    }

    .creation-app.sidebar-collapsed > aside[data-fuuvo-shared-sidebar="1"],
    .feature-shell.sidebar-collapsed > aside[data-fuuvo-shared-sidebar="1"],
    .portal-shell.sidebar-collapsed > aside[data-fuuvo-shared-sidebar="1"] {
        width: 0 !important;
        min-width: 0 !important;
        max-width: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        border-right-width: 0 !important;
        opacity: 1 !important;
        overflow: visible !important;
        pointer-events: none !important;
        position: relative;
    }

    /* Keep the collapse control visible at the edge of the collapsed rail.
       It remains a child of the sidebar, never a detached topbar control. */
    .creation-app.sidebar-collapsed > aside[data-fuuvo-shared-sidebar="1"] .sidebar-toggle-slot,
    .feature-shell.sidebar-collapsed > aside[data-fuuvo-shared-sidebar="1"] .sidebar-toggle-slot,
    .portal-shell.sidebar-collapsed > aside[data-fuuvo-shared-sidebar="1"] .sidebar-toggle-slot {
        position: absolute;
        top: 14px;
        right: -42px;
        width: 36px;
        height: 36px;
        margin: 0;
        z-index: 1000;
        pointer-events: auto;
    }

    body.sidebar-collapsed .app > aside[data-fuuvo-shared-sidebar="1"] {
        opacity: 1 !important;
        overflow: visible !important;
        pointer-events: none !important;
        position: relative;
    }

    body.sidebar-collapsed .app > aside[data-fuuvo-shared-sidebar="1"] .sidebar-toggle-slot {
        position: absolute;
        top: 14px;
        right: -42px;
        width: 36px;
        height: 36px;
        margin: 0;
        z-index: 1000;
        pointer-events: auto;
    }

    body.sidebar-collapsed .app > aside[data-fuuvo-shared-sidebar="1"] .sidebar-toggle-slot .desktop-history-toggle {
        pointer-events: auto !important;
    }

    /* Chat detail uses a two-column shell instead of the landing page's
       three-column grid. Keep the shared trigger inside the sidebar while
       collapsing the actual rail, otherwise the fixed 272px history width
       makes the trigger appear detached without removing the rail. */
    body.chat-detail-open.sidebar-collapsed[data-mode="chat"] > .app {
        grid-template-columns: 0 minmax(0, 1fr) !important;
    }

    body.chat-detail-open.sidebar-collapsed[data-mode="chat"] > .app > aside[data-fuuvo-shared-sidebar="1"] {
        width: 0 !important;
        min-width: 0 !important;
        max-width: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        opacity: 1 !important;
        overflow: visible !important;
        pointer-events: none !important;
        position: relative;
    }

    body.chat-detail-open.sidebar-collapsed[data-mode="chat"] > .app > aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-sidebar-close,
    body.chat-detail-open.sidebar-collapsed[data-mode="chat"] > .app > aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-sidebar-auth,
    body.chat-detail-open.sidebar-collapsed[data-mode="chat"] > .app > aside[data-fuuvo-shared-sidebar="1"] .history-account,
    body.chat-detail-open.sidebar-collapsed[data-mode="chat"] > .app > aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region > :not(.sidebar-shell),
    body.chat-detail-open.sidebar-collapsed[data-mode="chat"] > .app > aside[data-fuuvo-shared-sidebar="1"] .sidebar-shell > :not(.sidebar-brand-row),
    body.chat-detail-open.sidebar-collapsed[data-mode="chat"] > .app > aside[data-fuuvo-shared-sidebar="1"] .sidebar-brand-row > .fuuvo-sidebar-brand {
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }

    body.chat-detail-open.sidebar-collapsed[data-mode="chat"] > .app > aside[data-fuuvo-shared-sidebar="1"] :is(.sidebar-scroll-region, .sidebar-shell, .sidebar-brand-row) {
        width: 0 !important;
        min-width: 0 !important;
        max-width: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
    }

    body.chat-detail-open.sidebar-collapsed[data-mode="chat"] > .app > aside[data-fuuvo-shared-sidebar="1"] .sidebar-toggle-slot {
        position: absolute;
        top: 18px;
        right: -52px;
        width: 40px;
        height: 40px;
        margin: 0;
        z-index: 1000;
        pointer-events: auto;
    }

    body.chat-detail-open.sidebar-collapsed[data-mode="chat"] > .app > aside[data-fuuvo-shared-sidebar="1"] .sidebar-toggle-slot .desktop-history-toggle {
        width: 40px !important;
        min-width: 40px !important;
        height: 40px !important;
        pointer-events: auto !important;
    }

    .creation-app.sidebar-collapsed > aside[data-fuuvo-shared-sidebar="1"] .sidebar-toggle-slot .desktop-history-toggle,
    .feature-shell.sidebar-collapsed > aside[data-fuuvo-shared-sidebar="1"] .sidebar-toggle-slot .desktop-history-toggle,
    .portal-shell.sidebar-collapsed > aside[data-fuuvo-shared-sidebar="1"] .sidebar-toggle-slot .desktop-history-toggle {
        pointer-events: auto !important;
    }
}

/* Use the same segmented language control on the home/chat shell as every
   feature page. This also removes the legacy divider-only presentation. */
header[data-fuuvo-shared-topbar="1"] .ui-language-switch {
    display: inline-flex !important;
    align-items: center !important;
    gap: 3px !important;
    padding: 3px !important;
    border: 1px solid #d8e1ee !important;
    border-radius: 10px !important;
    background: #f8fafc !important;
    box-shadow: none !important;
}

header[data-fuuvo-shared-topbar="1"] .ui-language-switch-btn {
    min-width: 38px !important;
    min-height: 32px !important;
    padding: 0 9px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 1px solid transparent !important;
    border-radius: 7px !important;
    background: transparent !important;
    color: #7b8ca3 !important;
    line-height: 1 !important;
    box-shadow: none !important;
}

header[data-fuuvo-shared-topbar="1"] .ui-language-switch-btn.active {
    border-color: #b8d3fa !important;
    background: #eaf3ff !important;
    color: #176dcc !important;
    box-shadow: inset 0 0 0 1px rgba(23, 109, 204, .08) !important;
}

header[data-fuuvo-shared-topbar="1"] .ui-language-switch-btn + .ui-language-switch-btn {
    border-left-color: transparent !important;
}

@media (max-width: 1180px) and (min-width: 921px) {
    aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings {
        right: -56px;
    }

    aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings::before,
    aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings::after {
        right: 69px;
    }
}

@media (max-width: 920px) {
    aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings {
        box-sizing: border-box;
        right: 0;
        width: min(310px, calc(100vw - 24px));
        padding-left: 18px;
        padding-right: 18px;
        padding-bottom: 16px;
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
        overscroll-behavior: auto;
    }

    aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-main {
        min-height: 0;
        overflow: visible !important;
    }

    aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-row {
        min-height: 31px;
        display: grid;
        grid-template-columns: minmax(0, 1fr) max-content;
        align-items: center;
        column-gap: 10px;
        line-height: 1.4;
    }

    aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-row > span:first-child {
        min-width: 0;
        overflow-wrap: normal;
        word-break: normal;
    }

    aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-value {
        min-width: max-content;
        display: grid;
        grid-template-columns: max-content 18px;
        align-items: center;
        justify-content: end;
        gap: 7px;
        line-height: 20px;
    }

    aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-value b {
        width: auto;
        max-width: none;
        overflow: visible;
        line-height: 20px;
        text-overflow: clip;
    }

    aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-value svg,
    aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-row > svg {
        width: 18px;
        height: 18px;
        display: block;
        align-self: center;
    }

    aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings::before,
    aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings::after {
        right: 13px;
    }

    aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings-footer {
        min-height: 40px;
        margin: 8px -2px 0;
        padding: 8px 4px 4px;
        align-items: center;
        line-height: 1.45;
        white-space: normal;
        overflow: visible;
        text-overflow: clip;
    }
}

/* Shared account launcher and upward-opening account card. */
aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-area {
    position: relative;
    flex: 0 0 auto;
    width: 100%;
    margin-top: 8px !important;
    padding: 0 !important;
    z-index: 70;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-menu {
    position: relative;
    width: 100%;
    display: block;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-card {
    width: 100%;
    min-height: 52px;
    padding: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 44px;
    align-items: center;
    gap: 10px;
    border: 0;
    border-radius: 0;
    background: transparent;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-toggle {
    width: 100%;
    min-width: 0;
    min-height: 52px;
    padding: 0 15px 0 10px;
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) 18px;
    align-items: center;
    gap: 11px;
    border: 0 !important;
    border-radius: 999px !important;
    background: #f1f4f8 !important;
    color: #10213d !important;
    font: inherit;
    text-align: left;
    cursor: pointer;
    transition: background .18s ease, box-shadow .18s ease;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-toggle:hover,
aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-menu.is-open .sidebar-account-toggle {
    background: #eaf0f8 !important;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-toggle::after {
    content: none !important;
    display: none !important;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-toggle > img,
aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-toggle .workspace-header-user-fallback,
aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-toggle .workspace-header-user-fallback.guest-avatar {
    width: 42px !important;
    height: 42px !important;
    flex: 0 0 42px !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    object-fit: cover;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-toggle .workspace-header-user-fallback.guest-avatar {
    border: 1px solid #e3e9f2;
    background: #f7f9fc !important;
    color: #10213d !important;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-toggle .guest-avatar svg,
aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-toggle .guest-avatar img {
    width: 25px !important;
    height: 25px !important;
    display: block;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-name {
    min-width: 0;
    overflow: hidden;
    color: #10213d;
    font-size: 16px;
    font-weight: 650;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-chevron {
    width: 18px;
    height: 18px;
    display: block;
    color: #10213d;
    transition: transform .18s ease;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-menu.is-open .sidebar-account-chevron {
    transform: rotate(-90deg);
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-settings {
    width: 44px;
    height: 44px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 11px;
    background: transparent;
    color: #10213d;
    cursor: pointer;
    transition: color .18s ease, background .18s ease;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-settings:hover {
    background: #f1f4f8;
    color: #0b6ff0;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-settings svg,
aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-settings img {
    width: 25px;
    height: 25px;
    display: block;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-dropdown {
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    top: auto !important;
    bottom: calc(100% + 8px) !important;
    width: 100%;
    min-width: 0 !important;
    padding: 0;
    display: block;
    overflow: hidden;
    border: 1px solid #e3e8f0;
    border-radius: 11px;
    background: #fff;
    box-shadow: 0 12px 28px rgba(22, 39, 68, .16);
    color: #10213d;
    z-index: 100;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-dropdown.hidden {
    display: none !important;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-welcome,
aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-profile {
    padding: 17px 24px 13px;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-welcome > strong,
aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-profile > strong {
    display: block;
    margin: 0;
    color: #10213d;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.35;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-welcome > p,
aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-profile > p {
    margin: 5px 0 13px;
    color: #71809a;
    font-size: 12px;
    line-height: 1.45;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-primary,
aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-guest,
aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-logout {
    width: 100%;
    min-height: 34px;
    padding: 0 13px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 6px;
    font-family: inherit;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.2;
    text-align: center;
    text-decoration: none !important;
    cursor: pointer;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-primary {
    background: #0877f9;
    color: #fff !important;
    box-shadow: 0 5px 12px rgba(8, 119, 249, .18);
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-primary:hover {
    background: #006be8;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-guest,
aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-logout {
    min-height: 31px;
    margin-top: 2px;
    background: transparent;
    color: #0877f9 !important;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-guest:hover,
aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-logout:hover {
    background: #f3f7ff;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-links {
    margin: 0 24px;
    padding: 8px 0 9px;
    border-top: 1px solid #dfe5ee;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-links > a {
    min-height: 34px;
    padding: 0;
    display: flex;
    align-items: center;
    gap: 12px;
    border-radius: 7px;
    color: #10213d !important;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.2;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-links > a:hover {
    background: #f6f8fb;
    color: #0877f9 !important;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-links svg {
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
    display: block;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-toggle,
body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-menu.is-open .sidebar-account-toggle {
    background: #202b3d !important;
    color: #eef4ff !important;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-name,
body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-chevron {
    color: #eef4ff;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-dropdown {
    border-color: #334155;
    background: #162033;
    color: #eef4ff;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-welcome > strong,
body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-profile > strong,
body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-links > a {
    color: #eef4ff !important;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-links {
    border-top-color: #334155;
}

@media (max-width: 920px) {
    aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-card {
        grid-template-columns: minmax(0, 1fr) 42px;
    }

    aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-dropdown {
        max-height: min(360px, calc(100dvh - 90px));
        overflow-y: auto;
    }
}

/* Final mobile drawer invariants. Account/settings styles above deliberately
 * allow desktop overflow, so the mobile drawer must reassert its own stacking
 * and scrolling behavior after them. */
@media (max-width: 920px) {
    body.mobile-nav-open,
    body.fuuvo-mobile-sidebar-open {
        touch-action: pan-y !important;
    }

    body aside[data-fuuvo-shared-sidebar="1"],
    body [data-fuuvo-app-shell="1"] > aside[data-fuuvo-shared-sidebar="1"],
    body .creation-app > aside[data-fuuvo-shared-sidebar="1"],
    body .portal-shell > aside[data-fuuvo-shared-sidebar="1"],
    body .feature-shell > aside[data-fuuvo-shared-sidebar="1"] {
        position: fixed !important;
        inset: 0 auto 0 0 !important;
        z-index: 260 !important;
        width: min(72vw, 330px) !important;
        height: 100dvh !important;
        min-height: 100dvh !important;
        max-height: 100dvh !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        overscroll-behavior: contain !important;
        -webkit-overflow-scrolling: touch;
        backdrop-filter: none !important;
        scrollbar-width: none;
        touch-action: pan-y;
    }

    body aside[data-fuuvo-shared-sidebar="1"] .conversation-item,
    body aside[data-fuuvo-shared-sidebar="1"] .portal-recent-list > a {
        cursor: pointer;
        touch-action: manipulation !important;
    }

    body aside[data-fuuvo-shared-sidebar="1"]::-webkit-scrollbar {
        width: 0;
        height: 0;
    }

    body .fuuvo-mobile-sidebar-backdrop {
        z-index: 250 !important;
    }

    body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand {
        min-height: 58px !important;
        margin-bottom: 24px !important;
        align-items: flex-start !important;
    }

    body aside[data-fuuvo-shared-sidebar="1"] .sidebar-brand-logo,
    body aside[data-fuuvo-shared-sidebar="1"] .sidebar-brand-logo img {
        width: 116px !important;
        height: 42px !important;
        max-width: 116px !important;
        max-height: 42px !important;
        background: transparent !important;
    }

    body aside[data-fuuvo-shared-sidebar="1"] .sidebar-brand-copy,
    body aside[data-fuuvo-shared-sidebar="1"] .sidebar-brand-suffix,
    body aside[data-fuuvo-shared-sidebar="1"] .task-list .empty-state {
        display: none !important;
    }

    body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand.is-chinese {
        min-height: 48px !important;
    }

    body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand.is-chinese .sidebar-brand-logo,
    body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand.is-chinese .sidebar-brand-logo img.sidebar-brand-zh-logo {
        width: 68px !important;
        height: 29px !important;
        max-width: 68px !important;
        max-height: 29px !important;
        min-width: 68px !important;
    }

    body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand.is-chinese .sidebar-brand-copy {
        display: none !important;
    }

    body aside[data-fuuvo-shared-sidebar="1"] .portal-recent-list > a:not(:has(.portal-recent-icon))::before,
    body aside[data-fuuvo-shared-sidebar="1"] .portal-recent-link:not(:has(.portal-recent-icon))::before {
        content: "";
        width: 20px;
        height: 20px;
        flex: 0 0 20px;
        display: block;
        background: #10284c;
        -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M6.75 7.5h10.5a2.25 2.25 0 0 1 2.25 2.25v4.5a2.25 2.25 0 0 1-2.25 2.25h-6.19L8.25 19.13V16.5h-1.5a2.25 2.25 0 0 1-2.25-2.25v-4.5A2.25 2.25 0 0 1 6.75 7.5Z' stroke='%23000' stroke-width='1.6'/%3E%3Ccircle cx='9' cy='12' r='.8' fill='%23000'/%3E%3Ccircle cx='12' cy='12' r='.8' fill='%23000'/%3E%3Ccircle cx='15' cy='12' r='.8' fill='%23000'/%3E%3C/svg%3E") center / contain no-repeat;
        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M6.75 7.5h10.5a2.25 2.25 0 0 1 2.25 2.25v4.5a2.25 2.25 0 0 1-2.25 2.25h-6.19L8.25 19.13V16.5h-1.5a2.25 2.25 0 0 1-2.25-2.25v-4.5A2.25 2.25 0 0 1 6.75 7.5Z' stroke='%23000' stroke-width='1.6'/%3E%3Ccircle cx='9' cy='12' r='.8' fill='%23000'/%3E%3Ccircle cx='12' cy='12' r='.8' fill='%23000'/%3E%3Ccircle cx='15' cy='12' r='.8' fill='%23000'/%3E%3C/svg%3E") center / contain no-repeat;
    }
}

/* Final desktop shared-navigation sizing invariant. Some legacy safety styles
 * add horizontal margins to the first item; together with width:100% that
 * pushed New Chat beyond the shared sidebar edge. */
@media (min-width: 921px) {
    aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav {
        min-width: 0 !important;
        max-width: 100% !important;
    }

    aside[data-fuuvo-shared-sidebar="1"] #sidebar-new-chat,
    aside[data-fuuvo-shared-sidebar="1"] .portal-new-chat,
    aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav-btn:first-child {
        width: auto !important;
        min-width: 0 !important;
        max-width: 100% !important;
        margin: 0 !important;
        justify-self: stretch !important;
        box-sizing: border-box !important;
    }
}

/* Final shared navigation typography. Page-specific legacy rules must not
 * change the sidebar label size between routes or responsive states. */
html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav .sidebar-nav-btn .rail-text {
    font-size: 14px !important;
    line-height: 20px !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;
}

/* Keep the Chinese and English brand assets mutually exclusive even when
 * legacy sidebar rules force logo images or bylines to display. */
html body aside[data-fuuvo-shared-sidebar="1"] [data-fuuvo-brand-language][hidden] {
    display: none !important;
}

/* Keep the account launcher fixed while the sidebar content above it owns the
 * vertical scroll surface. The safety link sticks to the bottom of that
 * surface so it remains visible immediately above the account launcher. */
aside[data-fuuvo-shared-sidebar="1"] {
    display: flex !important;
    flex-direction: column !important;
    min-height: 0 !important;
    overflow: hidden !important;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region {
    width: 100%;
    min-width: 0;
    min-height: 0;
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    overflow-x: hidden;
    overflow-y: scroll;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-gutter: stable;
    scrollbar-width: thin;
    scrollbar-color: rgba(118, 132, 153, .42) transparent;
    padding-right: 6px;
    background: inherit;
    box-sizing: border-box;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region::-webkit-scrollbar {
    width: 5px;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region::-webkit-scrollbar-track {
    background: rgba(118, 132, 153, .08);
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: rgba(118, 132, 153, .42);
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region .sidebar-shell,
aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region .history-main,
aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region .portal-recent,
aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region .conversation-list,
aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region .task-list,
aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region .portal-recent-list,
aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region .sidebar-safety-link {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    flex: 0 0 auto !important;
    overflow: visible !important;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region .sidebar-safety-link {
    position: sticky !important;
    bottom: 0 !important;
    z-index: 20;
    margin-top: auto !important;
    border-top: 1px solid rgba(148, 163, 184, .2) !important;
    background: inherit !important;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-area,
aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-sidebar-auth {
    flex: 0 0 auto !important;
    background: inherit;
}

/* Keep a clear separator above the safety link on desktop. */
@media (min-width: 921px) {
    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region .sidebar-safety-link {
        min-height: 44px !important;
        margin-top: auto !important;
        border-top: 0 !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region .sidebar-safety-link::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 1px;
        background: #d6deea;
        pointer-events: none;
    }
}

@media (max-width: 920px) {
    body aside[data-fuuvo-shared-sidebar="1"],
    body [data-fuuvo-app-shell="1"] > aside[data-fuuvo-shared-sidebar="1"],
    body .creation-app > aside[data-fuuvo-shared-sidebar="1"],
    body .portal-shell > aside[data-fuuvo-shared-sidebar="1"],
    body .feature-shell > aside[data-fuuvo-shared-sidebar="1"] {
        overflow: hidden !important;
    }

    aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region {
        padding-right: 7px;
    }

    aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-sidebar-auth {
        padding: 12px 4px 4px;
        border-top: 1px solid #dce3ed;
        border-bottom: 0;
    }
}

/* English sidebar brand lockup: use the supplied complete transparent logo.
 * Keep these final overrides after legacy desktop and mobile image sizing rules. */
html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand.is-english {
    min-height: 58px !important;
    gap: 0 !important;
}

html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand.is-english .sidebar-brand-logo {
    width: 148px !important;
    height: 46px !important;
    min-width: 148px !important;
    max-width: 148px !important;
    flex: 0 0 148px !important;
    overflow: visible !important;
}

html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-brand-en-lockup {
    width: 148px !important;
    height: 46px !important;
    position: relative !important;
    display: grid !important;
    align-items: center !important;
    justify-content: flex-start !important;
    background: transparent !important;
}

html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-brand-en-lockup[hidden] {
    display: none !important;
}

html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-brand-logo img.sidebar-brand-en-logo {
    width: 148px !important;
    height: 46px !important;
    min-width: 148px !important;
    max-width: 148px !important;
    min-height: 46px !important;
    max-height: 46px !important;
    flex: 0 0 148px !important;
    display: block !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    object-fit: contain !important;
    object-position: left center !important;
}

@media (max-width: 920px) {
    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand.is-english {
        min-height: 50px !important;
        margin-bottom: 20px !important;
        align-items: center !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand.is-english .sidebar-brand-logo,
    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand.is-english .sidebar-brand-en-lockup {
        width: 136px !important;
        height: 42px !important;
        min-width: 136px !important;
        max-width: 136px !important;
        flex-basis: 136px !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand.is-english .sidebar-brand-logo img.sidebar-brand-en-logo {
        width: 136px !important;
        height: 42px !important;
        min-width: 136px !important;
        max-width: 136px !important;
        min-height: 42px !important;
        max-height: 42px !important;
        flex-basis: 136px !important;
    }
}

/* Creation history belongs to the compact/mobile navigation only. Keep this
 * final so older shared sidebar display rules cannot expose it on desktop. */
html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-mobile-only {
    display: none !important;
}

@media (max-width: 920px) {
    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-mobile-only {
        display: flex !important;
    }
}

html.fuuvo-compact-mobile body aside[data-fuuvo-shared-sidebar="1"] .sidebar-mobile-only {
    display: flex !important;
}

/* The compact New Chat accordion is a phone-only navigation surface. */
html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-new-chat {
    display: none !important;
}

/* Final shared recent-list invariant. Keep home, active chat, and feature
 * pages visually aligned even when chat or feature styles load different
 * history/sidebar rules. */
html body aside[data-fuuvo-shared-sidebar="1"] .history-main,
html body aside[data-fuuvo-shared-sidebar="1"] .portal-recent {
    margin-top: 12px !important;
    padding-top: 12px !important;
    border-top: 0 !important;
}

html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-section-label,
html body aside[data-fuuvo-shared-sidebar="1"] .portal-recent > h2 {
    margin: 0 10px 7px !important;
    padding: 0 !important;
    color: #7b8ba5 !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 20px !important;
    letter-spacing: 0 !important;
    border-top: 0 !important;
}

html body aside[data-fuuvo-shared-sidebar="1"] .conversation-list,
html body aside[data-fuuvo-shared-sidebar="1"] .task-list,
html body aside[data-fuuvo-shared-sidebar="1"] .portal-recent-list {
    display: grid !important;
    align-content: start !important;
    gap: 2px !important;
}

html body aside[data-fuuvo-shared-sidebar="1"] .conversation-item,
html body aside[data-fuuvo-shared-sidebar="1"] .task-item,
html body aside[data-fuuvo-shared-sidebar="1"] .portal-recent-list > a,
html body aside[data-fuuvo-shared-sidebar="1"] .portal-recent-link,
html body aside[data-fuuvo-shared-sidebar="1"] .portal-recent-empty {
    min-height: 36px !important;
    margin: 0 !important;
    padding: 6px 10px !important;
    border-radius: 8px !important;
    color: #273447 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    line-height: 20px !important;
    letter-spacing: 0 !important;
}

html body aside[data-fuuvo-shared-sidebar="1"] .portal-recent-item {
    min-height: 36px !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
    border-radius: 8px !important;
    color: #273447 !important;
}

html body aside[data-fuuvo-shared-sidebar="1"] .portal-recent-item .portal-recent-link {
    min-width: 0 !important;
    flex: 1 1 auto !important;
    display: grid !important;
    grid-template-columns: 20px minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 7px !important;
}

html body aside[data-fuuvo-shared-sidebar="1"] .portal-recent-icon {
    width: 20px !important;
    height: 20px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #273447 !important;
}

html body aside[data-fuuvo-shared-sidebar="1"] .portal-recent-icon svg {
    width: 20px !important;
    height: 20px !important;
    display: block !important;
}

html body aside[data-fuuvo-shared-sidebar="1"] .portal-recent-copy {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

html body aside[data-fuuvo-shared-sidebar="1"] .portal-recent-time {
    min-width: 34px !important;
    color: #7788a3 !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    line-height: 18px !important;
    text-align: right !important;
    white-space: nowrap !important;
}

/* Keep the footer safety entry visually separated from the recent-list rule. */
aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region .sidebar-safety-link {
    min-height: 52px !important;
    margin-top: 8px !important;
    padding: 11px 10px 5px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 9px !important;
    line-height: 20px !important;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region .sidebar-safety-link > :is(img.fuuvo-design-icon, .fuuvo-linear-icon) {
    width: 20px !important;
    height: 20px !important;
    flex: 0 0 20px !important;
    display: block !important;
    object-fit: contain !important;
}

aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region .sidebar-safety-link > span {
    min-height: 20px;
    display: inline-flex !important;
    align-items: center !important;
    line-height: 20px !important;
}

/* Compact, balanced desktop footer controls. */
@media (min-width: 921px) {
    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region .sidebar-safety-link {
        min-height: 44px !important;
        margin-top: 4px !important;
        padding: 8px 10px 4px !important;
        gap: 10px !important;
        border-radius: 8px !important;
        font-size: 15px !important;
        font-weight: 500 !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region .sidebar-safety-link::before {
        left: -10px;
        right: -10px;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-area {
        margin-top: 4px !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-card,
    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-toggle {
        min-height: 44px !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-card {
        grid-template-columns: minmax(0, 1fr) 40px;
        gap: 8px;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-toggle {
        padding: 0 12px 0 10px;
        grid-template-columns: 36px minmax(0, 1fr) 18px;
        gap: 10px;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-toggle > img,
    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-toggle .workspace-header-user-fallback,
    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-toggle .workspace-header-user-fallback.guest-avatar {
        width: 36px !important;
        height: 36px !important;
        flex-basis: 36px !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-settings {
        width: 40px;
        height: 40px;
    }
}

/* Keep the safety entry directly after the recent list. The scroll region
 * already owns sidebar overflow, so this must remain in normal flow: a sticky
 * row can otherwise cover the final conversation in a short desktop window. */
html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region {
    align-content: flex-start !important;
}

html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region .history-main,
html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region .portal-recent {
    flex: 0 0 auto !important;
    height: auto !important;
    min-height: 0 !important;
}

html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region .sidebar-safety-link {
    position: relative !important;
    z-index: auto !important;
    margin-top: 8px !important;
    margin-bottom: 4px !important;
    overflow: hidden !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
    background: #ffffff !important;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region .sidebar-safety-link {
    background: #23272d !important;
}

@media (min-width: 921px) {
    /* Keep the safety entry visually attached to the account launcher. */
    html body aside[data-fuuvo-shared-sidebar="1"] {
        row-gap: 0 !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-area {
        margin-top: 0 !important;
    }
}

body[data-mode="chat"] .history.is-conversation-view .conversation-list::after {
    content: none !important;
    display: none !important;
    min-height: 0 !important;
}

/* Keep the back icon visible and truncate only the trailing title text. */
header[data-fuuvo-shared-topbar="1"] .shell-topbar-left {
    overflow: hidden;
}

header[data-fuuvo-shared-topbar="1"] .shell-topbar-back {
    min-width: 0 !important;
    max-width: 100%;
    flex: 0 1 auto;
    overflow: hidden;
    justify-content: flex-start !important;
    text-align: left !important;
    text-overflow: clip !important;
}

header[data-fuuvo-shared-topbar="1"] .shell-topbar-back > img,
header[data-fuuvo-shared-topbar="1"] .shell-topbar-back > svg {
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
}

header[data-fuuvo-shared-topbar="1"] .shell-topbar-back > span {
    width: auto;
    max-width: 100%;
    flex: 1 1 auto;
    min-width: 0;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

@media (max-width: 920px) {
    header[data-fuuvo-shared-topbar="1"] .shell-topbar-back {
        max-width: 42vw !important;
    }
}

html body aside[data-fuuvo-shared-sidebar="1"] .portal-recent-delete {
    width: 28px !important;
    height: 28px !important;
    flex: 0 0 28px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 0 !important;
    border-radius: 8px !important;
    background: transparent !important;
    color: #8b98ab !important;
    opacity: 0 !important;
    pointer-events: none !important;
    cursor: pointer !important;
}

html body aside[data-fuuvo-shared-sidebar="1"] .portal-recent-delete svg {
    width: 16px !important;
    height: 16px !important;
}

html body aside[data-fuuvo-shared-sidebar="1"] .portal-recent-item:hover .portal-recent-delete,
html body aside[data-fuuvo-shared-sidebar="1"] .portal-recent-delete:focus-visible {
    opacity: 1 !important;
    pointer-events: auto !important;
}

html body aside[data-fuuvo-shared-sidebar="1"] .portal-recent-delete:hover {
    background: #fff1f1 !important;
    color: #dc2626 !important;
}

html body aside[data-fuuvo-shared-sidebar="1"] .conversation-title,
html body aside[data-fuuvo-shared-sidebar="1"] .portal-recent-link {
    color: #273447 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    line-height: 20px !important;
}

html body aside[data-fuuvo-shared-sidebar="1"] .conversation-item:hover,
html body aside[data-fuuvo-shared-sidebar="1"] .task-item:hover,
html body aside[data-fuuvo-shared-sidebar="1"] .portal-recent-item:hover,
html body aside[data-fuuvo-shared-sidebar="1"] .portal-recent-list > a:hover {
    background: #f6f9ff !important;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-section-label,
body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .portal-recent > h2 {
    color: #d9e4f2 !important;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .conversation-item,
body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .task-item,
body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .portal-recent-item,
body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .portal-recent-list > a,
body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .portal-recent-link,
body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .portal-recent-empty,
body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .conversation-title {
    color: #d9e4f2 !important;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .portal-recent-icon {
    color: #d9e4f2 !important;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .portal-recent-time,
body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .portal-recent-delete {
    color: #9eacc0 !important;
}

/* Centre the logo inside the reserved brand area so the visual spacing above
 * and below it remains balanced on both desktop and mobile sidebars. */
html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand {
    align-items: center !important;
    align-content: center !important;
}

html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-brand-logo {
    margin-top: 15px !important;
}

@media (max-width: 920px) {
    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-brand-logo {
        margin-top: 8px !important;
    }
}

/* Feature pages: new chat stays neutral until the user returns to chat. */
html:not([data-ui-theme="dark"]) body aside[data-fuuvo-shared-sidebar="1"] .portal-new-chat img.rail-glyph {
    filter: none !important;
}

html:not([data-ui-theme="dark"]) body aside[data-fuuvo-shared-sidebar="1"] .portal-new-chat:hover img.rail-glyph {
    filter: none !important;
}

html:not([data-ui-theme="dark"]) body aside[data-fuuvo-shared-sidebar="1"] .portal-new-chat .portal-new-chat-glyph {
    color: #273447 !important;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .portal-new-chat .portal-new-chat-glyph path {
    stroke: #d9e4f2 !important;
}

/* Final public Recent colours: identical on home and feature pages. */
html body aside[data-fuuvo-shared-sidebar="1"] :is(.conversation-item, .task-item, .portal-recent-item) {
    border: 0 !important;
    box-shadow: none !important;
    transform: none !important;
}

html:not([data-ui-theme="dark"]) body aside[data-fuuvo-shared-sidebar="1"] :is(.conversation-item, .task-item, .portal-recent-item):hover {
    background: #f6f9ff !important;
}

html:not([data-ui-theme="dark"]) body aside[data-fuuvo-shared-sidebar="1"] :is(.conversation-item, .task-item, .portal-recent-item).active {
    background: #e8f1ff !important;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] :is(.conversation-item, .task-item, .portal-recent-item):hover {
    background: rgba(96, 165, 250, .12) !important;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] :is(.conversation-item, .task-item, .portal-recent-item).active {
    background: rgba(37, 99, 255, .2) !important;
}

html body aside[data-fuuvo-shared-sidebar="1"] .portal-recent-item :is(.portal-recent-link, .portal-recent-link:hover, .portal-recent-link:focus, .portal-recent-link:active) {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .portal-recent-item:hover :is(.portal-recent-link, .portal-recent-icon, .portal-recent-copy) {
    color: #8fc1ff !important;
}

html:not([data-ui-theme="dark"]) body aside[data-fuuvo-shared-sidebar="1"] .portal-recent-item:hover :is(.portal-recent-link, .portal-recent-icon, .portal-recent-copy) {
    color: #0b6ff0 !important;
}

/* Tool artwork stays transparent; the row itself carries interaction state. */
html body :is(.home-tool-drawer, .workspace-tool-drawer) .home-tool-drawer-item {
    background: transparent !important;
    box-shadow: none !important;
}

html:not([data-ui-theme="dark"]) body :is(.home-tool-drawer, .workspace-tool-drawer) .home-tool-drawer-item:is(:hover, :focus-visible) {
    background: #f2f6fc !important;
}

html:not([data-ui-theme="dark"]) body :is(.home-tool-drawer, .workspace-tool-drawer) .home-tool-drawer-item.active {
    border-color: #b9d6ff !important;
    background: #e8f2ff !important;
    color: #0b5fc7 !important;
}

body[data-ui-theme="dark"] :is(.home-tool-drawer, .workspace-tool-drawer) .home-tool-drawer-item:is(:hover, :focus-visible) {
    background: #292e36 !important;
}

body[data-ui-theme="dark"] :is(.home-tool-drawer, .workspace-tool-drawer) .home-tool-drawer-item.active {
    border-color: #365f94 !important;
    background: #223652 !important;
    color: #a9d0ff !important;
}

html body :is(.home-tool-drawer, .workspace-tool-drawer) .home-tool-drawer-item :is(.capability-icon, .core-feature-btn-icon),
html body :is(.home-tool-drawer, .workspace-tool-drawer) .home-tool-drawer-item:is(:hover, :focus-visible, .active) :is(.capability-icon, .core-feature-btn-icon) {
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

/* Every workspace uses the same More/Recent surface. Keep the feature-page
 * variant on the same heading scale and spacing as the home history drawer. */
@media (min-width: 921px) {
    html body.home-history-drawer-open aside[data-fuuvo-shared-sidebar="1"] .history-main {
        gap: 7px !important;
        padding: 19px 2px 0 0 !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .history-main .history-title {
        margin: 0 !important;
        padding: 0 !important;
        color: #24262a !important;
        font-size: 18px !important;
        font-weight: 600 !important;
        line-height: 1.2 !important;
    }

    body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .history-main .history-title {
        color: #d9e4f2 !important;
    }
}

/* The More drawer is one shared surface on home and feature workspaces.
 * Feature pages also carry legacy sticky-sidebar rules, so reassert the
 * desktop drawer geometry after those rules have loaded. */
@media (min-width: 921px) {
    html body.home-history-drawer-open [data-fuuvo-app-shell="1"] > aside[data-fuuvo-shared-sidebar="1"][data-fuuvo-sidebar-context]:not([data-fuuvo-sidebar-context="home"]) {
        position: fixed !important;
        top: 12px !important;
        bottom: 12px !important;
        left: calc(var(--fuuvo-workspace-rail-width) + 10px) !important;
        width: min(var(--fuuvo-workspace-drawer-width), calc(100vw - var(--fuuvo-workspace-rail-width) - 28px)) !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        align-self: auto !important;
        display: grid !important;
        padding: 14px 12px 12px !important;
        grid-template-rows: minmax(0, 1fr) auto !important;
        gap: 6px !important;
        overflow: hidden !important;
        border: 1px solid #dfe4eb !important;
        border-radius: 8px !important;
        background: var(--fuuvo-workspace-drawer-bg) !important;
        box-shadow: 0 18px 48px rgba(20, 28, 42, .16) !important;
    }

    html body.home-history-drawer-open [data-fuuvo-app-shell="1"] > aside[data-fuuvo-shared-sidebar="1"][data-fuuvo-sidebar-context]:not([data-fuuvo-sidebar-context="home"]) {
        width: 336px !important;
        min-width: 336px !important;
    }

    html body.home-history-drawer-open [data-fuuvo-app-shell="1"] > aside[data-fuuvo-shared-sidebar="1"][data-fuuvo-sidebar-context]:not([data-fuuvo-sidebar-context="home"]) .sidebar-scroll-region {
        padding: 0 4px 0 0 !important;
    }

    html body.home-history-drawer-open [data-fuuvo-app-shell="1"] > aside[data-fuuvo-shared-sidebar="1"][data-fuuvo-sidebar-context]:not([data-fuuvo-sidebar-context="home"]) .sidebar-section-label {
        padding: 0 10px 7px !important;
        color: #8a8d94 !important;
        font-size: 12px !important;
        font-weight: 600 !important;
    }

    html body.home-history-drawer-open [data-fuuvo-app-shell="1"] > aside[data-fuuvo-shared-sidebar="1"][data-fuuvo-sidebar-context]:not([data-fuuvo-sidebar-context="home"]) .portal-recent-empty {
        padding: 18px 10px !important;
        color: #92959c !important;
        font-size: 12px !important;
        line-height: 1.6 !important;
        text-align: left !important;
    }
}

/* Final overflow escape hatch for the quick-settings popover.  These rules
 * intentionally stay last because shared drawer geometry restores overflow:
 * hidden for the sidebar surface. */
html body aside[data-fuuvo-shared-sidebar="1"].is-quick-settings-open,
html body aside[data-fuuvo-shared-sidebar="1"]:has(.sidebar-quick-settings:not(.hidden)) {
    overflow: visible !important;
}

@media (min-width: 921px) {
    html body.home-history-drawer-open [data-fuuvo-app-shell="1"] > aside[data-fuuvo-shared-sidebar="1"][data-fuuvo-sidebar-context]:not([data-fuuvo-sidebar-context="home"]).is-quick-settings-open,
    html body.home-history-drawer-open [data-fuuvo-app-shell="1"] > aside[data-fuuvo-shared-sidebar="1"][data-fuuvo-sidebar-context]:not([data-fuuvo-sidebar-context="home"]):has(.sidebar-quick-settings:not(.hidden)) {
        overflow: visible !important;
    }
}

@media (max-width: 920px) {
    html body aside[data-fuuvo-shared-sidebar="1"].is-quick-settings-open,
    html body aside[data-fuuvo-shared-sidebar="1"]:has(.sidebar-quick-settings:not(.hidden)),
    html body [data-fuuvo-app-shell="1"] > aside[data-fuuvo-shared-sidebar="1"].is-quick-settings-open,
    html body [data-fuuvo-app-shell="1"] > aside[data-fuuvo-shared-sidebar="1"]:has(.sidebar-quick-settings:not(.hidden)),
    html body .creation-app > aside[data-fuuvo-shared-sidebar="1"].is-quick-settings-open,
    html body .creation-app > aside[data-fuuvo-shared-sidebar="1"]:has(.sidebar-quick-settings:not(.hidden)),
    html body .portal-shell > aside[data-fuuvo-shared-sidebar="1"].is-quick-settings-open,
    html body .portal-shell > aside[data-fuuvo-shared-sidebar="1"]:has(.sidebar-quick-settings:not(.hidden)),
    html body .feature-shell > aside[data-fuuvo-shared-sidebar="1"].is-quick-settings-open,
    html body .feature-shell > aside[data-fuuvo-shared-sidebar="1"]:has(.sidebar-quick-settings:not(.hidden)) {
        overflow: visible !important;
    }
}

/* Mobile keeps the account card inside the More drawer.  The separate rail
 * launcher duplicates that control at the lower-right corner and leaves too
 * little room for the drawer footer. */
@media (max-width: 920px) {
    html body [data-fuuvo-account-portal="1"] {
        display: none !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region {
        position: relative !important;
        padding-bottom: 60px !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region .sidebar-safety-link {
        position: absolute !important;
        left: 0 !important;
        right: 7px !important;
        bottom: 0 !important;
        z-index: 20 !important;
        width: auto !important;
        min-width: 0 !important;
        min-height: 52px !important;
        height: auto !important;
        margin: 0 !important;
        padding: 9px 10px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 9px !important;
        overflow: visible !important;
        border-top: 1px solid rgba(148, 163, 184, .2) !important;
        background: #ffffff !important;
        white-space: normal !important;
        text-overflow: clip !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region .sidebar-safety-link > span:last-child {
        min-width: 0 !important;
        flex: 1 1 auto !important;
        display: block !important;
        overflow: visible !important;
        color: inherit !important;
        line-height: 1.35 !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
        text-overflow: clip !important;
    }

    body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region .sidebar-safety-link {
        background: #23272d !important;
    }
}

/* Safety pages need a bounded content viewport so long articles can scroll
 * independently from the fixed shared shell and sidebar. */
@media (min-width: 921px) {
    html body.safety-portal-page > .portal-shell {
        height: 100vh !important;
        min-height: 100vh !important;
        overflow: hidden !important;
    }

    html body.safety-portal-page > .portal-shell > .portal-content {
        height: 100vh !important;
        min-height: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        overflow: hidden !important;
    }

    html body.safety-portal-page > .portal-shell > .portal-content > .portal-main {
        flex: 1 1 auto !important;
        height: auto !important;
        min-height: 0 !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        overscroll-behavior-y: contain;
        -webkit-overflow-scrolling: touch;
    }
}

/* Shared phone sidebar contract. Chat has a dedicated navigation sheet, but
 * creation, research, and other workspaces only load this shared sheet. Keep
 * the drawer geometry and accordion controls identical on every route. */
@media (max-width: 920px) {
    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-brand-row {
        min-height: 46px !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand,
    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand.is-english,
    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand.is-chinese {
        min-height: 40px !important;
        height: 40px !important;
        margin: 0 0 12px !important;
        padding: 0 4px !important;
        align-items: center !important;
        gap: 0 !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand.is-english .sidebar-brand-logo,
    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand.is-english .sidebar-brand-en-lockup,
    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand.is-english .sidebar-brand-logo img.sidebar-brand-en-logo {
        width: 112px !important;
        min-width: 112px !important;
        max-width: 112px !important;
        height: 34px !important;
        min-height: 34px !important;
        max-height: 34px !important;
        flex: 0 0 112px !important;
        flex-basis: 112px !important;
        margin-top: 0 !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand.is-chinese .sidebar-brand-logo,
    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand.is-chinese .sidebar-brand-logo img.sidebar-brand-zh-logo {
        width: 66px !important;
        min-width: 66px !important;
        max-width: 66px !important;
        height: 27px !important;
        min-height: 27px !important;
        max-height: 27px !important;
        flex: 0 0 66px !important;
        flex-basis: 66px !important;
        margin-top: 0 !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav.portal-nav {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        grid-auto-flow: row !important;
        gap: 2px !important;
        padding: 0 0 10px !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav.portal-nav .sidebar-nav-btn,
    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav.portal-nav .sidebar-nav-btn:first-child {
        grid-column: 1 / -1 !important;
        width: 100% !important;
        min-width: 0 !important;
        height: 46px !important;
        min-height: 46px !important;
        max-height: 46px !important;
        margin: 0 !important;
        padding: 0 10px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        border-radius: 10px !important;
        font-size: 14px !important;
        line-height: 20px !important;
        text-align: left !important;
        white-space: nowrap !important;
        box-sizing: border-box !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav.portal-nav .sidebar-nav-btn .rail-icon,
    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav.portal-nav .sidebar-nav-btn:first-child .rail-icon {
        width: 100% !important;
        min-width: 0 !important;
        height: 100% !important;
        min-height: 0 !important;
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 10px !important;
        overflow: visible !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav.portal-nav .sidebar-nav-btn .rail-glyph,
    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav.portal-nav .sidebar-nav-btn .rail-glyph :is(svg, .fuuvo-asset-icon, .fuuvo-linear-svg) {
        width: 18px !important;
        height: 18px !important;
        min-width: 18px !important;
        min-height: 18px !important;
        max-width: 18px !important;
        max-height: 18px !important;
        flex: 0 0 18px !important;
        display: block !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav.portal-nav .sidebar-nav-btn .rail-text {
        min-width: 0 !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        color: inherit !important;
        font-size: 14px !important;
        line-height: 20px !important;
        font-weight: 600 !important;
        text-align: left !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-tool-groups {
        display: grid !important;
        gap: 0 !important;
        margin: 0 !important;
        padding: 0 0 8px !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-tool-group {
        display: block !important;
        margin: 0 !important;
        padding: 0 !important;
        border-top: 1px solid #e1e8f2 !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-tool-group-toggle {
        width: 100% !important;
        min-width: 0 !important;
        height: 52px !important;
        min-height: 52px !important;
        max-height: 52px !important;
        margin: 0 !important;
        padding: 0 4px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 12px !important;
        border: 0 !important;
        border-radius: 0 !important;
        appearance: none !important;
        background: transparent !important;
        color: #34445c !important;
        font: inherit !important;
        font-size: 14px !important;
        font-weight: 720 !important;
        line-height: 20px !important;
        text-align: left !important;
        cursor: pointer !important;
        box-sizing: border-box !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-tool-group-toggle > span {
        min-width: 0 !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-tool-group-toggle svg {
        width: 16px !important;
        height: 16px !important;
        min-width: 16px !important;
        min-height: 16px !important;
        flex: 0 0 16px !important;
        display: block !important;
        transition: transform .18s ease !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-tool-group.is-open .fuuvo-mobile-tool-group-toggle svg {
        transform: rotate(180deg) !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-tool-group-content {
        width: 100% !important;
        padding: 0 0 10px !important;
        box-sizing: border-box !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-tool-group-content[hidden] {
        display: none !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-tool-grid {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 4px !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-tool-grid > a {
        min-width: 0 !important;
        min-height: 68px !important;
        padding: 7px 3px !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 5px !important;
        border: 1px solid transparent !important;
        border-radius: 9px !important;
        color: #56657b !important;
        font-size: 11px !important;
        font-weight: 650 !important;
        line-height: 15px !important;
        text-align: center !important;
        text-decoration: none !important;
        box-sizing: border-box !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-tool-icon {
        width: 24px !important;
        height: 24px !important;
        min-width: 24px !important;
        min-height: 24px !important;
        flex: 0 0 24px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-tool-icon :is(svg, .fuuvo-asset-icon, .fuuvo-linear-svg) {
        width: 22px !important;
        height: 22px !important;
        max-width: 22px !important;
        max-height: 22px !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-tool-grid > a:is(:hover, :focus-visible, :active),
    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-tool-group-toggle:is(:hover, :focus-visible),
    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-tool-group.is-open .fuuvo-mobile-tool-group-toggle {
        outline: none !important;
        color: #1769d4 !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region {
        position: relative !important;
        padding-bottom: 60px !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region .sidebar-safety-link {
        position: absolute !important;
        left: 0 !important;
        right: 7px !important;
        bottom: 0 !important;
        z-index: 20 !important;
        width: auto !important;
        min-width: 0 !important;
        height: 52px !important;
        min-height: 52px !important;
        max-height: 52px !important;
        margin: 0 !important;
        padding: 9px 10px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 9px !important;
        overflow: visible !important;
        white-space: normal !important;
        text-overflow: clip !important;
        box-sizing: border-box !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region .sidebar-safety-link > span:last-child {
        min-width: 0 !important;
        flex: 1 1 auto !important;
        display: block !important;
        overflow: visible !important;
        line-height: 18px !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
        text-overflow: clip !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-area {
        flex: 0 0 auto !important;
        min-height: 63px !important;
    }
}

@media (max-width: 380px) {
    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-tool-group-toggle {
        height: 48px !important;
        min-height: 48px !important;
        max-height: 48px !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-tool-grid > a {
        min-height: 64px !important;
        font-size: 10px !important;
    }
}

html body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-tool-group,
html body[data-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-tool-group {
    border-top-color: #2d3a4d !important;
}

html body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-tool-group-toggle,
html body[data-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-tool-group-toggle {
    color: #dce6f6 !important;
}

html body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-tool-grid > a,
html body[data-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-tool-grid > a {
    color: #becbe0 !important;
}

html body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-tool-grid > a:is(:hover, :focus-visible, :active),
html body[data-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-tool-grid > a:is(:hover, :focus-visible, :active),
html body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-tool-group-toggle:is(:hover, :focus-visible),
html body[data-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-tool-group-toggle:is(:hover, :focus-visible),
html body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-tool-group.is-open .fuuvo-mobile-tool-group-toggle,
html body[data-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-tool-group.is-open .fuuvo-mobile-tool-group-toggle {
    color: #a9d0ff !important;
}

html body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region .sidebar-safety-link,
html body[data-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region .sidebar-safety-link {
    background: #151a23 !important;
    border-top-color: #2d3a4d !important;
}

/* Home brand v2: both language variants use the supplied transparent Logo.
 * The animated layer is lazy-loaded by fuuvo-chat-app.js and occupies the
 * exact same box as the static layer to keep the navigation layout stable. */
html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand.is-fuuvo-v2 {
    transform: none !important;
}

html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand.is-fuuvo-v2::before,
html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand.is-fuuvo-v2::after {
    display: none !important;
    content: none !important;
}

html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand.is-fuuvo-v2 .sidebar-brand-logo {
    position: relative !important;
    display: block !important;
    width: 148px !important;
    height: 56px !important;
    min-width: 148px !important;
    min-height: 56px !important;
    max-width: 148px !important;
    max-height: 56px !important;
    flex: 0 0 148px !important;
    margin-top: 0 !important;
    overflow: visible !important;
}

html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand.is-fuuvo-v2
    .sidebar-brand-en-lockup,
html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand.is-fuuvo-v2
    .sidebar-brand-zh-lockup {
    position: relative !important;
    display: grid !important;
    width: 148px !important;
    height: 56px !important;
    min-width: 148px !important;
    min-height: 56px !important;
    max-width: 148px !important;
    max-height: 56px !important;
    align-items: center !important;
    justify-items: start !important;
    overflow: visible !important;
}

html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand.is-fuuvo-v2
    :is(.sidebar-brand-en-lockup, .sidebar-brand-zh-lockup)[hidden] {
    display: none !important;
}

html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand.is-fuuvo-v2
    .sidebar-brand-logo :is(.sidebar-brand-logo-static, .sidebar-brand-logo-hover) {
    grid-area: 1 / 1 !important;
    display: block !important;
    width: 148px !important;
    height: 56px !important;
    min-width: 148px !important;
    min-height: 56px !important;
    max-width: 148px !important;
    max-height: 56px !important;
    flex: 0 0 148px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    object-fit: contain !important;
    object-position: left center !important;
    pointer-events: none !important;
    transition: opacity 120ms ease, visibility 120ms ease !important;
}

html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand.is-fuuvo-v2
    .sidebar-brand-logo-hover {
    visibility: hidden !important;
    opacity: 0 !important;
}

html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand.is-fuuvo-v2.is-fuuvo-video-playing
    .sidebar-brand-logo-static {
    visibility: hidden !important;
    opacity: 0 !important;
}

html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand.is-fuuvo-v2.is-fuuvo-video-playing
    .sidebar-brand-logo-hover {
    visibility: visible !important;
    opacity: 1 !important;
}

@media (max-width: 920px) {
    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand.is-fuuvo-v2 {
        min-height: 48px !important;
        height: 48px !important;
        margin-bottom: 12px !important;
        padding: 0 4px !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand.is-fuuvo-v2 .sidebar-brand-logo,
    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand.is-fuuvo-v2
        :is(.sidebar-brand-en-lockup, .sidebar-brand-zh-lockup),
    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand.is-fuuvo-v2
        .sidebar-brand-logo :is(.sidebar-brand-logo-static, .sidebar-brand-logo-hover) {
        width: 120px !important;
        height: 44px !important;
        min-width: 120px !important;
        min-height: 44px !important;
        max-width: 120px !important;
        max-height: 44px !important;
        flex-basis: 120px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand.is-fuuvo-v2.is-fuuvo-video-playing
        .sidebar-brand-logo-static {
        visibility: visible !important;
        opacity: 1 !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand.is-fuuvo-v2.is-fuuvo-video-playing
        .sidebar-brand-logo-hover {
        visibility: hidden !important;
        opacity: 0 !important;
    }
}

/* Keep the shared tools drawer on feature workspaces pixel-aligned with the
 * current home drawer. These rules intentionally live last because older
 * feature-page styles are still loaded by a few legacy templates. */
@media (min-width: 921px) {
    html body [data-fuuvo-app-shell="1"] > .home-tool-drawer {
        top: 12px !important;
        bottom: 12px !important;
        left: calc(var(--fuuvo-workspace-rail-width) + 10px) !important;
        width: min(var(--fuuvo-workspace-drawer-width), calc(100vw - var(--fuuvo-workspace-rail-width) - 28px)) !important;
        border-radius: 8px !important;
        box-shadow: 0 18px 48px rgba(20, 28, 42, .16) !important;
    }

    html body .home-tool-drawer-header {
        min-height: 68px !important;
        padding: 14px 16px 11px !important;
    }

    html body .home-tool-drawer-scroll {
        padding: 7px 10px 14px !important;
        gap: 7px !important;
    }

    html body .home-tool-group {
        padding: 9px 5px 11px !important;
        gap: 8px !important;
    }

    html body .home-tool-grid {
        gap: 4px !important;
    }

    html body .home-tool-drawer-item {
        height: 78px !important;
        min-height: 78px !important;
        padding: 8px 4px !important;
        gap: 5px !important;
        border-radius: 8px !important;
        font-size: 12px !important;
        line-height: 1.25 !important;
        font-weight: 600 !important;
    }

    html body .home-tool-drawer-item .capability-icon {
        width: 34px !important;
        min-width: 34px !important;
        height: 34px !important;
        flex-basis: 34px !important;
    }

    html body .home-tool-drawer-item:hover,
    html body .home-tool-drawer-item:focus-visible,
    html body .home-tool-drawer-item.active {
        border-color: #e2e5e9 !important;
        background: #f1f3f5 !important;
        color: #172033 !important;
    }
}

@media (min-width: 921px) {
    body[data-ui-theme="dark"] [data-fuuvo-app-shell="1"] > .home-tool-drawer {
        border-color: #343940 !important;
        background: #1d2025 !important;
        box-shadow: 0 18px 42px rgba(0, 0, 0, .34) !important;
    }

    body[data-ui-theme="dark"] .home-tool-group h2 {
        color: #edf0f4 !important;
    }

    body[data-ui-theme="dark"] .home-tool-drawer-item {
        color: #cbd1d9 !important;
    }

    body[data-ui-theme="dark"] .home-tool-drawer-item:hover,
    body[data-ui-theme="dark"] .home-tool-drawer-item:focus-visible,
    body[data-ui-theme="dark"] .home-tool-drawer-item.active {
        border-color: #3c444f !important;
        background: #2b3139 !important;
        color: #ffffff !important;
    }
}

/* Canonical More/Recent surface. Both home and feature pages keep their own
 * data loader, while this shared panel owns the heading, spacing, and scroll
 * viewport so the drawer does not change shape between routes. */
@media (min-width: 921px) {
    html body.home-history-drawer-open aside[data-fuuvo-shared-sidebar="1"] .workspace-recent-panel {
        display: flex !important;
        min-height: 0 !important;
        margin: 12px 0 0 !important;
        padding: 19px 2px 0 0 !important;
        flex: 1 1 auto !important;
        flex-direction: column !important;
        gap: 7px !important;
        overflow: hidden !important;
        border-top: 1px solid rgba(148, 163, 184, .18) !important;
    }

    html body.home-history-drawer-open aside[data-fuuvo-shared-sidebar="1"] .workspace-recent-head {
        display: flex !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        align-items: flex-start !important;
    }

    html body.home-history-drawer-open aside[data-fuuvo-shared-sidebar="1"] .workspace-recent-panel > .sidebar-section-label {
        margin: 0 !important;
        padding: 0 10px 7px !important;
        color: #8a8d94 !important;
        font-size: 12px !important;
        font-weight: 600 !important;
    }

    html body.home-history-drawer-open aside[data-fuuvo-shared-sidebar="1"] .workspace-recent-panel > :is(.task-list, .portal-recent-list) {
        display: grid !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 2px 4px !important;
        flex: 1 1 auto !important;
        align-content: start !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        overscroll-behavior: contain !important;
        scrollbar-width: thin !important;
        scrollbar-color: rgba(118, 132, 153, .46) transparent !important;
    }

    html body.home-history-drawer-open aside[data-fuuvo-shared-sidebar="1"] .workspace-recent-panel > :is(.task-list, .portal-recent-list)::-webkit-scrollbar {
        width: 6px;
    }

    html body.home-history-drawer-open aside[data-fuuvo-shared-sidebar="1"] .workspace-recent-panel > :is(.task-list, .portal-recent-list)::-webkit-scrollbar-thumb {
        border-radius: 999px;
        background: rgba(118, 132, 153, .46);
    }

    html body[data-ui-theme="dark"].home-history-drawer-open aside[data-fuuvo-shared-sidebar="1"] .workspace-recent-panel > .sidebar-section-label {
        color: #9ca7b6 !important;
    }
}

@media (min-width: 921px) {
    /* The shared skills drawer reuses a few legacy homepage capability names
     * (core-feature-btn). Those names still have global theme rules, which
     * made only Data analysis/Office hub/utility items look like bordered
     * cards on feature pages. Keep the desktop drawer on the same transparent
     * tile system as the homepage while preserving its hover and active
     * states. */
    html body [data-fuuvo-app-shell="1"] > .home-tool-drawer .home-tool-drawer-item.core-feature-btn {
        border: 1px solid transparent !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    html body [data-fuuvo-app-shell="1"] > .home-tool-drawer .home-tool-drawer-item.core-feature-btn:is(:hover, :focus-visible) {
        border-color: #d9dadd !important;
        background: #e7e7e9 !important;
        color: #1c1e22 !important;
    }

    html body [data-fuuvo-app-shell="1"] > .home-tool-drawer .home-tool-drawer-item.core-feature-btn.active {
        border-color: #b9d6ff !important;
        background: #e8f2ff !important;
        color: #0b5fc7 !important;
    }

    :is(html[data-ui-theme="dark"], body[data-ui-theme="dark"]) [data-fuuvo-app-shell="1"] > .home-tool-drawer .home-tool-drawer-item.core-feature-btn {
        border-color: transparent !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    :is(html[data-ui-theme="dark"], body[data-ui-theme="dark"]) [data-fuuvo-app-shell="1"] > .home-tool-drawer .home-tool-drawer-item.core-feature-btn:is(:hover, :focus-visible) {
        border-color: #3c444f !important;
        background: #2b3139 !important;
        color: #ffffff !important;
    }

    :is(html[data-ui-theme="dark"], body[data-ui-theme="dark"]) [data-fuuvo-app-shell="1"] > .home-tool-drawer .home-tool-drawer-item.core-feature-btn.active {
        border-color: #365f94 !important;
        background: #223652 !important;
        color: #a9d0ff !important;
    }
}

/* Mobile sidebar final pass. This intentionally follows all route-specific
 * styles above so the compact navigation contract wins on every workspace. */
@media (max-width: 920px) {
    html body aside[data-fuuvo-shared-sidebar="1"] {
        display: flex !important;
        flex-direction: column !important;
        width: min(84vw, 348px) !important;
        padding: 16px 14px max(10px, env(safe-area-inset-bottom)) !important;
        overflow: hidden !important;
        background: #ffffff !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region {
        min-height: 0 !important;
        padding: 0 5px 0 0 !important;
        display: flex !important;
        flex: 1 1 auto !important;
        flex-direction: column !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        scrollbar-width: none !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region::-webkit-scrollbar {
        width: 0 !important;
        height: 0 !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-mobile-home,
    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-mobile-home.sidebar-nav-btn {
        display: flex !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-mobile-hide,
    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-mobile-hide-history,
    html body aside[data-fuuvo-shared-sidebar="1"] #sidebar-new-chat,
    html body aside[data-fuuvo-shared-sidebar="1"] .portal-new-chat,
    html body aside[data-fuuvo-shared-sidebar="1"] #sidebar-creation-history {
        display: none !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav.portal-nav {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 2px !important;
        padding: 0 0 10px !important;
        border-bottom: 1px solid #e1e8f2 !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav.portal-nav .sidebar-nav-btn {
        width: 100% !important;
        min-width: 0 !important;
        height: 44px !important;
        min-height: 44px !important;
        max-height: 44px !important;
        margin: 0 !important;
        padding: 0 9px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        border: 0 !important;
        border-radius: 9px !important;
        background: transparent !important;
        color: #24344d !important;
        font-size: 14px !important;
        font-weight: 600 !important;
        line-height: 20px !important;
        text-align: left !important;
        text-decoration: none !important;
        white-space: nowrap !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav.portal-nav .sidebar-nav-btn:is(:hover, :focus-visible, .active) {
        background: #edf4ff !important;
        color: #1769d4 !important;
        outline: none !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav.portal-nav .sidebar-nav-btn .rail-icon {
        width: 100% !important;
        min-width: 0 !important;
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 10px !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav.portal-nav .sidebar-nav-btn .rail-glyph,
    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav.portal-nav .sidebar-nav-btn .rail-glyph :is(svg, .fuuvo-asset-icon, .fuuvo-linear-svg) {
        width: 19px !important;
        height: 19px !important;
        min-width: 19px !important;
        min-height: 19px !important;
        max-width: 19px !important;
        max-height: 19px !important;
        flex: 0 0 19px !important;
        display: block !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav.portal-nav .sidebar-nav-btn .rail-text {
        min-width: 0 !important;
        overflow: hidden !important;
        color: inherit !important;
        font-size: 14px !important;
        font-weight: 600 !important;
        line-height: 20px !important;
        text-align: left !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-new-chat {
        display: block !important;
        margin: 0 !important;
        border-bottom: 1px solid #e1e8f2 !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-new-chat-toggle {
        width: 100% !important;
        height: 46px !important;
        min-height: 46px !important;
        padding: 0 9px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 10px !important;
        border: 0 !important;
        border-radius: 9px !important;
        background: transparent !important;
        color: #24344d !important;
        font: inherit !important;
        font-size: 14px !important;
        font-weight: 650 !important;
        line-height: 20px !important;
        text-align: left !important;
        cursor: pointer !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-new-chat-toggle:is(:hover, :focus-visible),
    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-new-chat.is-open .fuuvo-mobile-new-chat-toggle {
        background: #f2f6fb !important;
        color: #1769d4 !important;
        outline: none !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-new-chat-toggle .rail-icon {
        min-width: 0 !important;
        display: flex !important;
        align-items: center !important;
        gap: 10px !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-new-chat-toggle .rail-glyph {
        width: 19px !important;
        height: 19px !important;
        min-width: 19px !important;
        min-height: 19px !important;
        flex: 0 0 19px !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-new-chat-toggle > svg {
        width: 17px !important;
        height: 17px !important;
        flex: 0 0 17px !important;
        display: block !important;
        transition: transform .18s ease !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-new-chat.is-open .fuuvo-mobile-new-chat-toggle > svg {
        transform: rotate(180deg) !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-new-chat-content[hidden] {
        display: none !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-new-chat-content {
        width: 100% !important;
        padding: 0 0 2px !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-tool-groups {
        padding: 0 0 4px !important;
        display: grid !important;
        gap: 0 !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-tool-group {
        border-top: 0 !important;
        border-bottom: 1px solid #edf1f6 !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-tool-group-toggle {
        height: 42px !important;
        min-height: 42px !important;
        max-height: 42px !important;
        padding: 0 9px 0 38px !important;
        color: #52637b !important;
        font-size: 13px !important;
        font-weight: 650 !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-tool-group-content {
        padding: 0 5px 8px 38px !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-tool-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 3px !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-tool-grid > a {
        min-height: 42px !important;
        padding: 5px 4px !important;
        flex-direction: row !important;
        justify-content: flex-start !important;
        gap: 6px !important;
        border-radius: 7px !important;
        font-size: 11px !important;
        line-height: 15px !important;
        text-align: left !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-tool-icon {
        width: 20px !important;
        height: 20px !important;
        min-width: 20px !important;
        min-height: 20px !important;
        flex: 0 0 20px !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-tool-icon :is(svg, .fuuvo-asset-icon, .fuuvo-linear-svg) {
        width: 18px !important;
        height: 18px !important;
        max-width: 18px !important;
        max-height: 18px !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .workspace-recent-panel {
        min-height: 0 !important;
        margin: 0 !important;
        padding: 14px 4px 8px !important;
        display: block !important;
        flex: 0 0 auto !important;
        overflow: visible !important;
        border-top: 0 !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .workspace-recent-panel .history-head {
        display: none !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .workspace-recent-panel .sidebar-section-label {
        margin: 0 5px 6px !important;
        color: #7b8ba5 !important;
        font-size: 12px !important;
        font-weight: 700 !important;
        line-height: 18px !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .workspace-recent-panel :is(.conversation-list, .task-list, .portal-recent-list) {
        max-height: none !important;
        display: grid !important;
        gap: 2px !important;
        overflow: visible !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-sidebar-auth {
        display: none !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region .sidebar-safety-link {
        position: sticky !important;
        left: auto !important;
        right: auto !important;
        bottom: 0 !important;
        z-index: 20 !important;
        width: 100% !important;
        height: 45px !important;
        min-height: 45px !important;
        max-height: 45px !important;
        margin: auto 0 0 !important;
        padding: 8px 9px !important;
        display: flex !important;
        align-items: center !important;
        gap: 9px !important;
        border-top: 1px solid #e1e8f2 !important;
        background: #ffffff !important;
        white-space: nowrap !important;
        text-overflow: ellipsis !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-area {
        width: 100% !important;
        min-height: 56px !important;
        margin: 0 !important;
        padding: 6px 0 0 !important;
        display: block !important;
        flex: 0 0 auto !important;
        border-top: 1px solid #e1e8f2 !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-card {
        min-height: 48px !important;
        grid-template-columns: minmax(0, 1fr) 44px !important;
        gap: 7px !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-toggle {
        min-height: 48px !important;
        padding: 0 8px !important;
        grid-template-columns: 38px minmax(0, 1fr) 18px !important;
        gap: 9px !important;
        border-radius: 10px !important;
        background: transparent !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-toggle > img,
    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-toggle .workspace-header-user-fallback,
    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-toggle .workspace-header-user-fallback.guest-avatar {
        width: 38px !important;
        height: 38px !important;
        flex-basis: 38px !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-name,
    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-chevron {
        display: none !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-settings {
        width: 42px !important;
        height: 42px !important;
        border-radius: 10px !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-settings svg,
    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-settings img {
        width: 21px !important;
        height: 21px !important;
    }

    html body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"],
    html body[data-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] {
        background: #151a23 !important;
    }

    html body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav.portal-nav,
    html body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-new-chat,
    html body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-area,
    html body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region .sidebar-safety-link,
    html body[data-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav.portal-nav,
    html body[data-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-new-chat,
    html body[data-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-area,
    html body[data-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region .sidebar-safety-link {
        border-color: #2d3a4d !important;
    }

    html body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav.portal-nav .sidebar-nav-btn,
    html body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-new-chat-toggle,
    html body[data-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav.portal-nav .sidebar-nav-btn,
    html body[data-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-new-chat-toggle {
        color: #dce6f6 !important;
    }

    html body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav.portal-nav .sidebar-nav-btn:is(:hover, :focus-visible, .active),
    html body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-new-chat-toggle:is(:hover, :focus-visible),
    html body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-new-chat.is-open .fuuvo-mobile-new-chat-toggle,
    html body[data-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav.portal-nav .sidebar-nav-btn:is(:hover, :focus-visible, .active),
    html body[data-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-new-chat-toggle:is(:hover, :focus-visible),
    html body[data-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-new-chat.is-open .fuuvo-mobile-new-chat-toggle {
        background: #223652 !important;
        color: #a9d0ff !important;
    }
}

/* The brand-motion stylesheet hides the source mark while it paints its
 * masked pseudo-element. The shared sidebar uses the supplied static/GIF
 * lockups directly, so keep that artwork visible in both languages. */
html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand.is-fuuvo-v2 .sidebar-brand-logo {
    opacity: 1 !important;
    visibility: visible !important;
}

@media (max-width: 920px) {
    /* Page-specific creation styles set every portal-nav row to flex. Keep
     * the legacy standalone New Chat row hidden so the shared accordion below
     * Research remains the only mobile entry point. */
    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav.portal-nav .sidebar-mobile-hide,
    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav.portal-nav .sidebar-mobile-hide-history,
    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav.portal-nav #sidebar-new-chat,
    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav.portal-nav .portal-new-chat,
    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav.portal-nav #sidebar-creation-history {
        display: none !important;
    }
}

/* Mobile sidebar cleanup: the capability catalogue is now shown directly
 * below Research, without a redundant New Chat row or stacked rules. */
@media (max-width: 920px) {
    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav.portal-nav,
    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-new-chat,
    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-tool-group,
    html body aside[data-fuuvo-shared-sidebar="1"] .workspace-recent-panel,
    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region .sidebar-safety-link,
    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-area {
        border-top: 0 !important;
        border-bottom: 0 !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-new-chat-content {
        display: block !important;
    }
}

/* Mobile sidebar spacing: keep the catalogue in normal flow so Recent follows
 * Utilities immediately, and keep Safety attached to the account launcher. */
@media (max-width: 920px) {
    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand.is-fuuvo-v2 {
        transform: translateY(-6px) !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-shell {
        flex: 0 0 auto !important;
        overflow: visible !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region {
        padding-bottom: 0 !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .workspace-recent-panel {
        padding-top: 4px !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region .sidebar-safety-link {
        bottom: 0 !important;
        margin-top: auto !important;
        margin-bottom: 0 !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-area {
        min-height: 56px !important;
        padding-top: 2px !important;
    }
}

/* Keep the account popup typography aligned with the shared sidebar labels.
 * The popup uses a separate portal surface, so its legacy 16px action text
 * otherwise reads noticeably larger and heavier than the rest of the rail. */
[data-fuuvo-account-portal="1"] .workspace-account-profile-copy strong {
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 20px !important;
}

[data-fuuvo-account-portal="1"] .workspace-account-profile-copy p {
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 18px !important;
}

[data-fuuvo-account-portal="1"] .workspace-account-actions > a,
[data-fuuvo-account-portal="1"] .workspace-account-actions > button {
    font-size: 13px !important;
    font-weight: 500 !important;
    line-height: 20px !important;
}

/* The Chinese v2 lockup is shared by every non-home portal. The rail can be
 * 72px or 104px wide depending on the page, while the legacy 148px brand box
 * clipped the wordmark and made the logo appear corrupted. Fit the complete
 * artwork to the available rail width and leave the English lockup untouched. */
@media (min-width: 921px) {
    /* The rail contains both language lockups so the client can switch
     * language without rebuilding the shell. Legacy image rules use
     * display:block !important, which otherwise overrides the HTML hidden
     * attribute and paints the English and Chinese marks on top of each
     * other on feature pages. */
    html body:not(.chat-landing) nav[data-fuuvo-workspace-rail="1"]
        .home-rail-logo > .home-rail-logo-wordmark[hidden] {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
    }

    html body:not(.chat-landing) nav[data-fuuvo-workspace-rail="1"]
        .home-rail-logo > .home-rail-logo-wordmark:not([hidden]) {
        display: block !important;
        visibility: visible !important;
    }

    /* Keep feature-page rails visually identical to the home rail. The base
     * portal rule leaves this mark at 50px, which makes the Chinese wordmark
     * look compressed beside the same navigation on the home page. */
    html body:not(.chat-landing) nav[data-fuuvo-workspace-rail="1"] .home-rail-logo.is-fuuvo-v2 {
        width: 64px !important;
        height: 40px !important;
        min-height: 40px !important;
        margin-bottom: 6px !important;
    }

    html body:not(.chat-landing) nav[data-fuuvo-workspace-rail="1"]
        .home-rail-logo.is-fuuvo-v2 .home-rail-logo-wordmark {
        width: 52px !important;
        max-width: 52px !important;
        max-height: 29px !important;
        object-fit: contain !important;
    }

    html body:not(.chat-landing) aside[data-fuuvo-shared-sidebar="1"]
        .fuuvo-sidebar-brand.is-fuuvo-v2 .sidebar-brand-logo,
    html body:not(.chat-landing) aside[data-fuuvo-shared-sidebar="1"]
        .fuuvo-sidebar-brand.is-fuuvo-v2
        :is(.sidebar-brand-en-lockup, .sidebar-brand-zh-lockup) {
        width: min(84px, calc(100% - 16px)) !important;
        min-width: 0 !important;
        max-width: 84px !important;
        height: 32px !important;
        min-height: 32px !important;
        max-height: 32px !important;
        flex: 0 1 auto !important;
        flex-basis: auto !important;
        overflow: visible !important;
    }

    html body:not(.chat-landing) aside[data-fuuvo-shared-sidebar="1"]
        .fuuvo-sidebar-brand.is-fuuvo-v2
        .sidebar-brand-logo :is(.sidebar-brand-logo-static, .sidebar-brand-logo-hover) {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 84px !important;
        height: 32px !important;
        min-height: 32px !important;
        max-height: 32px !important;
        object-fit: contain !important;
        object-position: left center !important;
    }
}

/* Mobile sidebar: the nav footer and the first capability group must not
 * render two adjacent separators between Creation Centre and Chat & research. */
@media (max-width: 920px) {
    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav.portal-nav {
        border-bottom: 1px solid #e1e8f2 !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-tool-group:first-child {
        border-top: 0 !important;
    }

    html body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav.portal-nav,
    html body[data-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav.portal-nav {
        border-bottom-color: #2d3a4d !important;
    }
}

/* Sidebar brand mark: both language variants use the supplied transparent
 * icon only. Keep a fixed box in every viewport so legacy wordmark rules and
 * brand-motion layers cannot change the sidebar geometry. */
html body nav[data-fuuvo-workspace-rail="1"] .home-rail-logo {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
}

html body nav[data-fuuvo-workspace-rail="1"] .home-rail-logo-mark {
    display: block !important;
    width: 36px !important;
    min-width: 36px !important;
    max-width: 36px !important;
    height: 36px !important;
    min-height: 36px !important;
    max-height: 36px !important;
    flex: 0 0 36px !important;
    object-fit: contain !important;
    object-position: center !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
}

html body nav[data-fuuvo-workspace-rail="1"] .home-rail-logo::before,
html body nav[data-fuuvo-workspace-rail="1"] .home-rail-logo::after,
html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand::before,
html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand::after {
    display: none !important;
    content: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
}

html body aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand {
    align-items: center !important;
    align-content: center !important;
    justify-items: center !important;
}

html body aside[data-fuuvo-shared-sidebar="1"]
    .brand.fuuvo-sidebar-brand[data-fuuvo-sidebar-brand] .sidebar-brand-logo {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 36px !important;
    min-width: 36px !important;
    max-width: 36px !important;
    height: 36px !important;
    min-height: 36px !important;
    max-height: 36px !important;
    flex: 0 0 36px !important;
    margin: 0 auto !important;
    overflow: hidden !important;
}

html body aside[data-fuuvo-shared-sidebar="1"]
    .brand.fuuvo-sidebar-brand[data-fuuvo-sidebar-brand] .sidebar-brand-logo-mark {
    display: block !important;
    width: 36px !important;
    min-width: 36px !important;
    max-width: 36px !important;
    height: 36px !important;
    min-height: 36px !important;
    max-height: 36px !important;
    flex: 0 0 36px !important;
    object-fit: contain !important;
    object-position: center !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
}

html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-brand-logo
    :is(.sidebar-brand-logo-static, .sidebar-brand-logo-hover),
html body nav[data-fuuvo-workspace-rail="1"]
    :is(.home-rail-logo-wordmark, .home-rail-logo-wordmark-static, .home-rail-logo-wordmark-hover) {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

@media (max-width: 920px) {
    html body aside[data-fuuvo-shared-sidebar="1"]
        .brand.fuuvo-sidebar-brand[data-fuuvo-sidebar-brand] .sidebar-brand-logo,
    html body aside[data-fuuvo-shared-sidebar="1"]
        .brand.fuuvo-sidebar-brand[data-fuuvo-sidebar-brand] .sidebar-brand-logo-mark {
        width: 36px !important;
        min-width: 36px !important;
        max-width: 36px !important;
        height: 36px !important;
        min-height: 36px !important;
        max-height: 36px !important;
        flex-basis: 36px !important;
        margin: 0 auto !important;
    }
}

/* Restore the phone sidebar footer layout: Recent owns the flexible middle
 * space, Safety stays anchored above the account row, and the account label
 * remains visible beside the avatar. */
@media (max-width: 920px) {
    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region {
        position: relative !important;
        padding-bottom: 52px !important;
        align-content: stretch !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .workspace-recent-panel {
        min-height: 0 !important;
        margin: 0 !important;
        padding: 14px 4px 8px !important;
        display: flex !important;
        flex: 1 1 auto !important;
        flex-direction: column !important;
        overflow: visible !important;
        border-top: 0 !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .workspace-recent-panel .sidebar-section-label {
        flex: 0 0 auto !important;
        margin: 0 5px 6px !important;
        color: #24344d !important;
        font-size: 12px !important;
        font-weight: 700 !important;
        line-height: 18px !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .workspace-recent-panel :is(.conversation-list, .task-list, .portal-recent-list) {
        flex: 0 0 auto !important;
        max-height: none !important;
        display: grid !important;
        gap: 2px !important;
        overflow: visible !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region .sidebar-safety-link {
        position: absolute !important;
        left: 0 !important;
        right: 7px !important;
        bottom: 0 !important;
        z-index: 20 !important;
        width: auto !important;
        height: 52px !important;
        min-height: 52px !important;
        max-height: 52px !important;
        margin: 0 !important;
        padding: 9px 10px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 9px !important;
        border-top: 1px solid #e1e8f2 !important;
        background: #ffffff !important;
        box-sizing: border-box !important;
        overflow: visible !important;
        white-space: normal !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-area {
        width: 100% !important;
        min-height: 62px !important;
        margin: 0 !important;
        padding: 7px 0 0 !important;
        display: block !important;
        flex: 0 0 auto !important;
        border-top: 0 !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-card {
        min-height: 48px !important;
        grid-template-columns: minmax(0, 1fr) 44px !important;
        gap: 7px !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-toggle {
        min-height: 46px !important;
        padding: 0 8px !important;
        grid-template-columns: 38px minmax(0, 1fr) 18px !important;
        gap: 9px !important;
        border-radius: 7px 0 0 7px !important;
        background: #f1f4f8 !important;
        color: #10213d !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-toggle > img,
    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-toggle .workspace-header-user-fallback,
    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-toggle .workspace-header-user-fallback.guest-avatar {
        width: 38px !important;
        height: 38px !important;
        flex-basis: 38px !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-toggle .workspace-header-user-fallback.guest-avatar {
        border-color: #e3e9f2 !important;
        background: #f7f9fc !important;
        color: #10213d !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-name,
    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-chevron {
        display: block !important;
        color: #10213d !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-name {
        font-size: 14px !important;
        font-weight: 650 !important;
        line-height: 20px !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-settings {
        width: 44px !important;
        height: 46px !important;
        border-radius: 0 7px 7px 0 !important;
        background: transparent !important;
        color: #10213d !important;
    }

    html body aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-settings:is(:hover, :focus-visible) {
        background: #f1f4f8 !important;
        color: #0b6ff0 !important;
    }

    html body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .workspace-recent-panel .sidebar-section-label,
    html body[data-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .workspace-recent-panel .sidebar-section-label {
        color: #d9e4f2 !important;
    }

    html body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region .sidebar-safety-link,
    html body[data-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region .sidebar-safety-link {
        background: #151a23 !important;
        border-top-color: #2d3a4d !important;
        color: #dce6f6 !important;
    }

    html body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-toggle,
    html body[data-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-toggle {
        background: #223652 !important;
        color: #eef4ff !important;
    }

    html body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-toggle .workspace-header-user-fallback.guest-avatar,
    html body[data-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-toggle .workspace-header-user-fallback.guest-avatar {
        border-color: #365474 !important;
        background: #284262 !important;
        color: #a9d0ff !important;
    }

    html body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-name,
    html body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-chevron,
    html body[data-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-name,
    html body[data-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-chevron {
        color: #eef4ff !important;
    }

    html body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-settings,
    html body[data-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-settings {
        background: #223652 !important;
        color: #a9d0ff !important;
    }

    html body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-settings:is(:hover, :focus-visible),
    html body[data-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-settings:is(:hover, :focus-visible) {
        background: #294668 !important;
        color: #dcecff !important;
    }
}

/* Source: public/static/css/fuuvo-sidebar-layout.css */
/* The shared sidebar ID keeps this contract above older page-specific rules.
 * Navigation and history scroll together; Safety and Account stay outside. */
html body aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"] {
    min-height: 0 !important;
    grid-template-rows: auto minmax(0, 1fr) auto auto !important;
    flex-direction: column !important;
    gap: 0 !important;
    overflow: hidden !important;
}

/* The drawer keeps its full catalog; category switches appear only when it
 * becomes the desktop sidebar's inline navigation. */
.home-tool-drawer-scroll .sidebar-tool-group-toggle {
    display: none;
}

/* An explicitly opened desktop sidebar occupies a layout column. Temporary
 * tools/hover previews keep their overlay behavior and never change this width. */
@media (min-width: 921px) {
    html body.desktop-sidebar-docked {
        --fuuvo-desktop-sidebar-width: clamp(224px, 19.2vw, 268.8px);
        --fuuvo-desktop-navigation-width: calc(var(--fuuvo-workspace-rail-width) + var(--fuuvo-desktop-sidebar-width));
    }

    /* Expanded navigation keeps its tools above history in the same scroller. */
    html body.desktop-sidebar-docked aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"]
        .home-tool-drawer-scroll[data-sidebar-inline-tools="1"] {
        display: grid !important;
        width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        max-height: none !important;
        margin: 8px 0 0 !important;
        padding: 0 !important;
        gap: 8px !important;
        overflow: visible !important;
    }

    html body.desktop-sidebar-docked aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"]
        [data-sidebar-inline-tools="1"] .home-tool-group {
        padding: 0 !important;
        gap: 0 !important;
        border: 0 !important;
    }

    html body.desktop-sidebar-docked aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"]
        [data-sidebar-inline-tools="1"] .home-tool-group h2 {
        display: none !important;
    }

    html body.desktop-sidebar-docked aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"]
        [data-sidebar-inline-tools="1"] .sidebar-tool-group-toggle {
        display: flex !important;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        min-height: 44px;
        padding: 10px 8px;
        gap: 12px;
        border: 0;
        border-radius: 8px;
        background: transparent;
        color: inherit;
        font: inherit;
        font-size: 14px;
        font-weight: 500;
        line-height: 20px;
        text-align: left;
        cursor: pointer;
    }

    html body.desktop-sidebar-docked aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"]
        [data-sidebar-inline-tools="1"] .sidebar-tool-group-toggle:is(:hover, :focus-visible) {
        background: rgba(128, 128, 128, .1);
    }

    html body.desktop-sidebar-docked aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"]
        [data-sidebar-inline-tools="1"] .sidebar-tool-group-toggle:focus-visible {
        outline: 2px solid currentColor;
        outline-offset: -2px;
    }

    html body.desktop-sidebar-docked aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"]
        [data-sidebar-inline-tools="1"] .sidebar-tool-group-toggle svg {
        width: 18px;
        height: 18px;
        flex: 0 0 18px;
        opacity: .65;
    }

    html body.desktop-sidebar-docked aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"]
        [data-sidebar-inline-tools="1"] .sidebar-tool-group-toggle[aria-expanded="true"] svg {
        transform: rotate(180deg);
    }

    html body.desktop-sidebar-docked aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"]
        [data-sidebar-inline-tools="1"] .home-tool-grid[hidden] {
        display: none !important;
    }

    html body.desktop-sidebar-docked aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"]
        [data-sidebar-inline-tools="1"] .home-tool-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 4px 8px !important;
        margin: 4px 0 8px !important;
    }

    html body.desktop-sidebar-docked aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"]
        [data-sidebar-inline-tools="1"] .home-tool-drawer-item {
        display: grid !important;
        grid-template-columns: 20px minmax(0, 1fr) !important;
        align-items: center !important;
        justify-content: start !important;
        height: auto !important;
        min-height: 44px !important;
        padding: 6px 8px !important;
        gap: 8px !important;
        font-size: 12px !important;
        line-height: 18px !important;
        text-align: left !important;
        white-space: normal !important;
        word-break: normal !important;
        overflow-wrap: normal !important;
    }

    html body.desktop-sidebar-docked aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"]
        [data-sidebar-inline-tools="1"] .home-tool-drawer-item > span:last-child {
        min-width: 0;
        overflow-wrap: anywhere;
    }

    html body.desktop-sidebar-docked aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"]
        [data-sidebar-inline-tools="1"] .home-tool-drawer-item:is([hidden], [data-home-icon="ask"]) {
        display: none !important;
    }

    html body.desktop-sidebar-docked aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"]
        [data-sidebar-inline-tools="1"] .home-tool-drawer-item .capability-icon,
    html body.desktop-sidebar-docked aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"]
        [data-sidebar-inline-tools="1"] .home-tool-drawer-item .capability-icon :is(svg, img) {
        width: 20px !important;
        min-width: 20px !important;
        height: 20px !important;
        flex-basis: 20px !important;
        background-size: contain !important;
    }

    html body.desktop-sidebar-docked [data-fuuvo-app-shell="1"]:has(> nav#fuuvo-workspace-rail),
    html body.desktop-sidebar-docked [data-fuuvo-app-shell="1"].sidebar-collapsed:has(> nav#fuuvo-workspace-rail),
    html body.desktop-sidebar-docked.sidebar-collapsed [data-fuuvo-app-shell="1"]:has(> nav#fuuvo-workspace-rail) {
        grid-template-columns: var(--fuuvo-desktop-navigation-width) minmax(0, 1fr) !important;
    }

    html body.desktop-sidebar-docked [data-fuuvo-app-shell="1"]
        > aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"] {
        top: 0 !important;
        bottom: 0 !important;
        left: var(--fuuvo-workspace-rail-width) !important;
        width: var(--fuuvo-desktop-sidebar-width) !important;
        min-width: 0 !important;
        max-width: none !important;
        height: 100dvh !important;
        border: 0 !important;
        border-right: 1px solid #e4e8ee !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        transform: none !important;
        transition: none !important;
    }

    html body.desktop-sidebar-docked:is([data-ui-theme="dark"], [data-theme="dark"])
        [data-fuuvo-app-shell="1"] > aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"] {
        border-right-color: #34445c !important;
    }

    html body.desktop-sidebar-docked aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"]
        > .sidebar-scroll-region {
        overflow-y: scroll !important;
        margin-right: 10px !important;
        scrollbar-width: none !important;
    }

    html body.desktop-sidebar-docked aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"]
        > .sidebar-scroll-region > .sidebar-scroll-space {
        display: block !important;
        flex: 0 0 auto !important;
        width: 100%;
        min-height: 0;
        margin: 0 !important;
        padding: 0 !important;
        pointer-events: none;
    }

    html body.desktop-sidebar-docked aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"]
        > .sidebar-scroll-region::-webkit-scrollbar {
        display: none !important;
        width: 0 !important;
    }

    html body.desktop-sidebar-docked aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"]
        > .sidebar-scrollbar:not([hidden]) {
        position: absolute !important;
        right: 4px !important;
        z-index: 2 !important;
        display: block !important;
        width: 12px !important;
        cursor: default;
        touch-action: none;
        user-select: none;
        border-radius: 6px;
    }

    html body.desktop-sidebar-docked aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"]
        > .sidebar-scrollbar::before {
        content: '';
        position: absolute;
        inset: 0 3px;
        border-radius: inherit;
        background: rgba(148, 163, 184, .14);
    }

    html body.desktop-sidebar-docked aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"]
        > .sidebar-scrollbar .sidebar-scrollbar-thumb {
        position: absolute;
        top: 0;
        right: 3px;
        left: 3px;
        border-radius: 6px;
        background: var(--shared-sidebar-scroll-thumb, rgba(118, 132, 153, .55));
    }

    html body.desktop-sidebar-docked aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"]
        > .sidebar-scrollbar[aria-disabled="true"] .sidebar-scrollbar-thumb {
        opacity: .65;
    }

    html body.desktop-sidebar-docked aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"]
        > .sidebar-scrollbar:is(:hover, :focus-visible, .is-dragging) .sidebar-scrollbar-thumb {
        background: var(--shared-sidebar-scroll-thumb, rgba(118, 132, 153, .8));
    }

    html body.desktop-sidebar-docked aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"]
        > .sidebar-scrollbar:focus-visible {
        outline: 2px solid currentColor;
        outline-offset: 1px;
    }

    html body [data-fuuvo-app-shell="1"] > .home-drawer-backdrop[hidden],
    html body.desktop-sidebar-docked:not(.home-tool-drawer-open)
        [data-fuuvo-app-shell="1"] > .home-drawer-backdrop {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
    }

    /* Landing composers are positioned within the workspace; detail composers,
     * replies and legacy chat headings are fixed and need its new center. */
    html body.desktop-sidebar-docked [data-fuuvo-app-shell="1"]:has(> nav#fuuvo-workspace-rail)
        .workspace[data-fuuvo-app-workspace="1"] > .composer {
        width: min(1112px, calc(100vw - var(--fuuvo-desktop-navigation-width) - 96px)) !important;
        max-width: calc(100% - 48px) !important;
    }

    html body.desktop-sidebar-docked:not(.chat-landing)
        [data-fuuvo-app-shell="1"]:has(> nav#fuuvo-workspace-rail)
        .workspace[data-fuuvo-app-workspace="1"] > .composer,
    html body.desktop-sidebar-docked[data-ai-chat-page="1"]
        [data-fuuvo-app-shell="1"]:has(> nav#fuuvo-workspace-rail)
        .workspace[data-fuuvo-app-workspace="1"] > .composer,
    html body.desktop-sidebar-docked:not(.chat-landing)[data-mode="chat"]:has(#ai-chat-model)
        [data-fuuvo-app-shell="1"]:has(> nav#fuuvo-workspace-rail)
        .workspace[data-fuuvo-app-workspace="1"] > .stage,
    html body.desktop-sidebar-docked [data-fuuvo-app-shell="1"]:has(> nav#fuuvo-workspace-rail)
        .workspace[data-fuuvo-app-workspace="1"]
        > :is(.ai-chat-heading, .ai-chat-welcome) {
        left: calc(50% + var(--fuuvo-desktop-navigation-width) / 2) !important;
        width: min(1112px, calc(100vw - var(--fuuvo-desktop-navigation-width) - 96px)) !important;
    }

    /* Chat footers are fixed to the viewport. Use the same navigation width
     * as the workspace grid so both sidebar states share its content center. */
    html body:has(#ai-chat-model) [data-fuuvo-app-shell="1"]:has(> nav#fuuvo-workspace-rail)
        .workspace[data-fuuvo-app-workspace="1"] > .fuuvo-ai-disclaimer {
        left: calc(50% + var(--fuuvo-desktop-navigation-width, var(--fuuvo-workspace-rail-width, 64px)) / 2) !important;
        width: min(960px, calc(100% - var(--fuuvo-desktop-navigation-width, var(--fuuvo-workspace-rail-width, 64px)) - 24px)) !important;
        box-sizing: border-box !important;
        white-space: normal;
    }
}

html body aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"] > .sidebar-scrollbar {
    display: none !important;
}

html body aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"]
    > .sidebar-scroll-region > .sidebar-scroll-space {
    display: none !important;
}

html body aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"].is-quick-settings-open,
html body aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"]:has(.sidebar-quick-settings:not(.hidden)) {
    overflow: visible !important;
}

/* The account menu is opened from the bottom of the More drawer. The drawer
 * normally clips its own scroll surface, which would cut off the upward menu
 * and leave a later account click visually underneath the drawer. Promote the
 * drawer only while this surface is open so it wins against the rail and any
 * older sidebar stacking context without changing the closed layout. */
html body aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"].is-account-menu-open,
html body aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"]:has(.sidebar-account-dropdown:not(.hidden)) {
    overflow: visible !important;
    z-index: 6000 !important;
}

html body aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"].is-account-menu-open
    .sidebar-account-area,
html body aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"]:has(.sidebar-account-dropdown:not(.hidden))
    .sidebar-account-area {
    position: relative !important;
    z-index: 6001 !important;
}

html body aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"]
    .sidebar-account-dropdown:not(.hidden) {
    z-index: 6002 !important;
}

html body aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"] > .sidebar-scroll-region {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 0 !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    padding-bottom: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior-y: contain !important;
    touch-action: pan-y !important;
    scrollbar-gutter: stable !important;
    scrollbar-width: thin !important;
    scrollbar-color: var(--shared-sidebar-scroll-thumb, rgba(118, 132, 153, .55)) transparent !important;
}

html body aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"] > .sidebar-scroll-region::-webkit-scrollbar {
    width: 6px !important;
    height: 6px !important;
}

html body aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"] > .sidebar-scroll-region::-webkit-scrollbar-track {
    background: transparent !important;
}

html body aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"] > .sidebar-scroll-region::-webkit-scrollbar-thumb {
    border-radius: 8px !important;
    background: var(--shared-sidebar-scroll-thumb, rgba(118, 132, 153, .55)) !important;
}

html body:is([data-ui-theme="dark"], [data-theme="dark"]) aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"] {
    --shared-sidebar-scroll-thumb: rgba(148, 163, 184, .6);
}

html body aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"] > .sidebar-scroll-region
    :is(.sidebar-shell, .workspace-recent-panel, .history-main, .portal-recent, .conversation-list, .task-list, .portal-recent-list) {
    flex: 0 0 auto !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
}

html body aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"] .sidebar-brand-row,
html body aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand {
    justify-content: flex-start !important;
    justify-items: start !important;
    text-align: left !important;
}

html body aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand {
    display: flex !important;
    width: auto !important;
    min-width: 0 !important;
    flex: 1 1 auto !important;
    margin-inline: 0 !important;
}

/* The shared sidebar uses the same compact mark and plain wordmark on every
 * route. Keep the language-specific label beside the icon instead of relying
 * on the legacy image lockups used by older page shells. */
html body aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"]
    .fuuvo-sidebar-brand[data-fuuvo-sidebar-brand] .sidebar-brand-logo {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 9px !important;
    width: auto !important;
    min-width: 0 !important;
    height: 36px !important;
    min-height: 36px !important;
    max-height: 36px !important;
    flex: 0 0 auto !important;
    overflow: visible !important;
}

html body aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"]
    .fuuvo-sidebar-brand[data-fuuvo-sidebar-brand] .sidebar-brand-logo-mark {
    display: block !important;
    width: 36px !important;
    min-width: 36px !important;
    height: 36px !important;
    min-height: 36px !important;
    max-width: 36px !important;
    max-height: 36px !important;
    flex: 0 0 36px !important;
    object-fit: contain !important;
}

html body aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"]
    .fuuvo-sidebar-brand[data-fuuvo-sidebar-brand] .sidebar-brand-label {
    display: inline-block !important;
    color: currentColor !important;
    font-family: SimHei, "Microsoft YaHei", Arial, sans-serif !important;
    font-size: 18px !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    white-space: nowrap !important;
}

html body aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"]
    .fuuvo-sidebar-brand[data-fuuvo-sidebar-brand] .sidebar-brand-label[hidden] {
    display: none !important;
}

/* This header stays outside the only scrolling region so close is always reachable. */
html body aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"] > .sidebar-brand-row {
    position: relative !important;
    display: flex !important;
    flex: 0 0 auto !important;
    align-items: center !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 44px !important;
    margin: 0 0 8px !important;
    gap: 8px !important;
}

html body aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"] > .sidebar-brand-row > .fuuvo-sidebar-brand {
    height: 36px !important;
    min-height: 36px !important;
    max-height: 36px !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
}

/* Desktop already displays the brand in its compact rail. Keep only the
 * collapse control above search, then the existing recent-conversation list. */
@media (min-width: 921px) {
    html body aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"] > .sidebar-brand-row {
        justify-content: flex-end !important;
    }

    html body aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"]
        > .sidebar-brand-row > .fuuvo-sidebar-brand,
    html body aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"]
        .history-main > .history-head {
        display: none !important;
    }
}

html body aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"] .shared-sidebar-collapse {
    position: static !important;
    display: inline-flex !important;
    flex: 0 0 32px !important;
    align-items: center !important;
    justify-content: center !important;
    width: 32px !important;
    min-width: 32px !important;
    height: 32px !important;
    min-height: 32px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 8px !important;
    background: transparent !important;
    color: inherit !important;
    box-shadow: none !important;
    cursor: pointer !important;
}

html body aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"] .shared-sidebar-collapse:is(:hover, :focus-visible) {
    background: rgba(148, 163, 184, .16) !important;
}

html body aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"] .shared-sidebar-collapse:focus-visible {
    outline: 2px solid currentColor !important;
    outline-offset: 2px !important;
}

html body aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"] .shared-sidebar-collapse
    :is(svg, .fuuvo-linear-icon, .fuuvo-linear-svg) {
    width: 20px !important;
    min-width: 20px !important;
    height: 20px !important;
    flex: 0 0 20px !important;
}

html body nav[data-fuuvo-workspace-rail="1"] button.home-rail-logo[data-workspace-sidebar-open] {
    appearance: none !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: inherit !important;
    font: inherit !important;
    cursor: pointer !important;
}

html body nav[data-fuuvo-workspace-rail="1"] button.home-rail-logo[data-workspace-sidebar-open]:focus-visible {
    outline: 2px solid currentColor !important;
    outline-offset: 2px !important;
}

/* The compact rail uses the same icon and localized plain-text brand. */
@media (min-width: 921px) {
    html body nav#fuuvo-workspace-rail[data-fuuvo-workspace-rail="1"] button.home-rail-logo[data-workspace-sidebar-open] {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        height: 36px !important;
        display: inline-flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 2px !important;
        padding: 0 !important;
        overflow: visible !important;
        box-sizing: border-box !important;
    }

    html body nav#fuuvo-workspace-rail[data-fuuvo-workspace-rail="1"] .home-rail-logo > .home-rail-logo-mark {
        width: 24px !important;
        min-width: 24px !important;
        max-width: 24px !important;
        height: 24px !important;
        min-height: 24px !important;
        max-height: 24px !important;
        flex: 0 0 24px !important;
    }

    html body nav#fuuvo-workspace-rail[data-fuuvo-workspace-rail="1"] .home-rail-logo > .home-rail-brand-label {
        display: inline-block !important;
        flex: 0 0 auto !important;
        color: currentColor !important;
        font-family: SimHei, "Microsoft YaHei", Arial, sans-serif !important;
        font-size: 12px !important;
        font-weight: 400 !important;
        line-height: 1 !important;
        letter-spacing: 0 !important;
        white-space: nowrap !important;
    }

    html body nav#fuuvo-workspace-rail[data-fuuvo-workspace-rail="1"] .home-rail-logo
        > :is(.home-rail-logo-mark, .home-rail-brand-label) {
        transform: translateX(-4px) !important;
    }
}

/* Inline menu strokes follow the theme; the old image had a fixed dark ink. */
@media (max-width: 920px) {
    html body header[data-fuuvo-shared-topbar="1"]
        button:is(.mobile-home-sidebar-trigger, .fuuvo-mobile-sidebar-inline-trigger)[data-toggle-shared-sidebar]
        > svg.fuuvo-menu-icon[aria-hidden="true"] {
        display: block !important;
        width: 24px !important;
        min-width: 24px !important;
        height: 24px !important;
        min-height: 24px !important;
        color: inherit !important;
        stroke: currentColor !important;
        stroke-width: 2 !important;
        opacity: 1 !important;
        filter: none !important;
    }

    html body:is([data-ui-theme="dark"], [data-theme="dark"])
        header[data-fuuvo-shared-topbar="1"]
        button:is(.mobile-home-sidebar-trigger, .fuuvo-mobile-sidebar-inline-trigger)[data-toggle-shared-sidebar]
        > svg.fuuvo-menu-icon[aria-hidden="true"] {
        color: #e4edf8 !important;
    }
}

@media (min-width: 921px) {
    html body.home-history-drawer-open aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"] .sidebar-shell {
        display: grid !important;
        align-content: start !important;
        gap: 8px !important;
    }

    html body.home-history-drawer-open aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"] .sidebar-nav.portal-nav {
        /* Primary navigation is already available in the desktop rail. */
        display: none !important;
    }
}

html body aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"]
    .brand.fuuvo-sidebar-brand[data-fuuvo-sidebar-brand] .sidebar-brand-logo {
    margin: 0 !important;
}

@media (max-width: 920px) {
    html body aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"] > .sidebar-brand-row {
        box-sizing: border-box !important;
        padding: 0 9px !important;
    }

    html body aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"]
        .brand.fuuvo-sidebar-brand[data-fuuvo-sidebar-brand] .sidebar-brand-logo {
        justify-content: flex-start !important;
    }

    html body aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"]
        .brand.fuuvo-sidebar-brand[data-fuuvo-sidebar-brand] .sidebar-brand-logo-mark {
        margin: 0 !important;
        object-position: left center !important;
    }
}

html body aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"] > .sidebar-safety-link {
    position: static !important;
    inset: auto !important;
    display: flex !important;
    flex: 0 0 auto !important;
    align-items: center !important;
    justify-content: flex-start !important;
    box-sizing: border-box !important;
    width: 100% !important;
    min-height: 44px !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 8px 10px !important;
    gap: 8px !important;
    border: 0 !important;
    border-top: 1px solid rgba(148, 163, 184, .2) !important;
    border-radius: 0 !important;
    background: inherit !important;
    color: inherit !important;
    box-shadow: none !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    line-height: 18px !important;
    white-space: normal !important;
}

html body aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"] > .sidebar-safety-link
    > :is(.fuuvo-linear-icon, img.fuuvo-design-icon) {
    width: 18px !important;
    min-width: 18px !important;
    height: 18px !important;
    flex: 0 0 18px !important;
}

html body aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"] > .sidebar-account-area {
    position: relative !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
    padding-top: 0 !important;
}

/* The compact rail stays visible; this switch opens the shared More sidebar. */
html body .workspace-rail-toggle[data-workspace-rail-toggle] {
    display: none !important;
}

@media (min-width: 921px) {
    html body [data-fuuvo-app-shell="1"]:has(> #fuuvo-workspace-rail) header[data-fuuvo-shared-topbar="1"] {
        padding-left: 56px !important;
    }

    html body:is(.chat-landing, .chat-detail-page, .chat-detail-open)[data-mode="chat"]
        [data-fuuvo-app-shell="1"]:has(> #fuuvo-workspace-rail) header[data-fuuvo-shared-topbar="1"] {
        height: 72px !important;
        min-height: 72px !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        box-sizing: border-box !important;
    }

    html body:is(.chat-landing, .chat-detail-page, .chat-detail-open)[data-mode="chat"]
        [data-fuuvo-app-shell="1"] > .workspace-rail-toggle[data-workspace-rail-toggle] {
        top: 20px !important;
    }

    html body:is(.chat-landing, .chat-detail-page, .chat-detail-open)[data-mode="chat"]
        aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"] > .sidebar-brand-row {
        min-height: 48px !important;
    }

    html body:is(.chat-detail-page, .chat-detail-open)[data-mode="chat"]
        aside#workspace-more-drawer[data-fuuvo-shared-sidebar="1"] > .sidebar-brand-row {
        min-height: 44px !important;
    }

    html body:is(.chat-detail-page, .chat-detail-open):is([data-ui-theme="dark"], [data-theme="dark"])[data-mode="chat"]
        header[data-fuuvo-shared-topbar="1"] #desktop-new-chat-icon {
        background: #172131 !important;
        color: #d7e2f3 !important;
        border-color: #34445c !important;
    }

    html body [data-fuuvo-app-shell="1"] .kc-header .kc-header-inner {
        padding-left: 32px !important;
        box-sizing: border-box !important;
    }

    html body [data-fuuvo-app-shell="1"] > .workspace-rail-toggle[data-workspace-rail-toggle] {
        position: fixed !important;
        top: 18px !important;
        left: calc(var(--fuuvo-workspace-rail-width, 64px) + 8px) !important;
        z-index: 1301 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 32px !important;
        height: 32px !important;
        min-width: 32px !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 1px solid #e4e8ee !important;
        border-radius: 8px !important;
        background: #f7f7f8 !important;
        color: #525866 !important;
        box-shadow: 0 2px 8px rgba(23, 49, 84, .06) !important;
        cursor: pointer !important;
        box-sizing: border-box !important;
    }

    html body [data-fuuvo-app-shell="1"] > .workspace-rail-toggle[data-workspace-rail-toggle]:is(:hover, :focus-visible) {
        background: #edf0f4 !important;
        color: #20242c !important;
    }

    html body [data-fuuvo-app-shell="1"] > .workspace-rail-toggle[data-workspace-rail-toggle]:focus-visible {
        outline: 2px solid #2379e8 !important;
        outline-offset: 2px !important;
    }

    html body [data-fuuvo-app-shell="1"] > .workspace-rail-toggle[data-workspace-rail-toggle]
        :is(.fuuvo-linear-icon, svg) {
        width: 20px !important;
        height: 20px !important;
        flex: 0 0 20px !important;
    }

    /* Expanded drawers already provide their own close button in this area. */
    html body.home-drawer-open [data-fuuvo-app-shell="1"] > .workspace-rail-toggle[data-workspace-rail-toggle] {
        visibility: hidden !important;
    }

    html body:is([data-ui-theme="dark"], [data-theme="dark"]) [data-fuuvo-app-shell="1"]
        > .workspace-rail-toggle[data-workspace-rail-toggle] {
        border: 0 !important;
        background: #172131 !important;
        color: #c8d8ee !important;
    }

    html body:is([data-ui-theme="dark"], [data-theme="dark"]) [data-fuuvo-app-shell="1"]
        > .workspace-rail-toggle[data-workspace-rail-toggle]:is(:hover, :focus-visible) {
        background: #20334c !important;
        color: #e7f1ff !important;
    }

}

/* Source: public/static/css/fuuvo-language-switch.css */
/* Shared Chinese / English segmented control. */
:is(
    .ui-language-switch,
    .creation-language,
    .portal-language,
    .auth-language-switch,
    .kc-language,
    .topbar-actions > .language,
    .top-actions > .language
) {
    display: inline-flex !important;
    align-items: center !important;
    gap: 3px !important;
    padding: 3px !important;
    border: 1px solid #d8e1ee !important;
    border-radius: 10px !important;
    background: #f8fafc !important;
    box-shadow: none !important;
}

/* Compact mobile language switch used by every shared application topbar. */
@media (max-width: 920px) {
    html body :is(
        header[data-fuuvo-shared-topbar="1"] .ui-language-switch,
        header[data-fuuvo-shared-topbar="1"] .creation-language,
        header[data-fuuvo-shared-topbar="1"] .portal-language,
        .auth-language-switch,
        .kc-language,
        .topbar-actions > .language,
        .top-actions > .language,
        .mobile-chat-actions .ui-language-switch
    ) {
        width: auto !important;
        min-width: 0 !important;
        height: 42px !important;
        min-height: 42px !important;
        padding: 2px !important;
        gap: 2px !important;
        border-radius: 9px !important;
        box-sizing: border-box !important;
    }

    html body :is(
        header[data-fuuvo-shared-topbar="1"] .ui-language-switch-btn,
        header[data-fuuvo-shared-topbar="1"] .creation-language a,
        header[data-fuuvo-shared-topbar="1"] .portal-language a,
        .auth-language-switch > a,
        .auth-language-switch > button,
        .kc-language > a,
        .kc-language > button,
        .topbar-actions > .language > a,
        .topbar-actions > .language > button,
        .top-actions > .language > a,
        .top-actions > .language > button,
        .mobile-chat-actions .ui-language-switch .ui-language-switch-btn
    ) {
        width: 38px !important;
        min-width: 38px !important;
        height: 36px !important;
        min-height: 36px !important;
        padding: 0 6px !important;
        border-radius: 7px !important;
        font-size: 14px !important;
        line-height: 36px !important;
        box-sizing: border-box !important;
    }
}

/* Highest-priority compact size for the shared chat header. */
@media (max-width: 920px) {
    html body[data-mode="chat"] header[data-fuuvo-shared-topbar="1"] .ui-language-switch {
        height: 40px !important;
        min-height: 40px !important;
        padding: 2px !important;
        gap: 2px !important;
    }

    html body[data-mode="chat"] header[data-fuuvo-shared-topbar="1"] .ui-language-switch .ui-language-switch-btn,
    html body[data-mode="chat"] header[data-fuuvo-shared-topbar="1"] .ui-language-switch .ui-language-switch-btn.active {
        width: 36px !important;
        min-width: 36px !important;
        height: 34px !important;
        min-height: 34px !important;
        padding: 0 5px !important;
        font-size: 14px !important;
        line-height: 34px !important;
    }
}

@media (max-width: 920px) {
    html body[data-mode="chat"] header[data-fuuvo-shared-topbar="1"] .ui-language-switch {
        height: 40px !important;
        min-height: 40px !important;
        padding: 2px !important;
        gap: 2px !important;
    }

    html body[data-mode="chat"] header[data-fuuvo-shared-topbar="1"] .ui-language-switch .ui-language-switch-btn,
    html body[data-mode="chat"] header[data-fuuvo-shared-topbar="1"] .ui-language-switch .ui-language-switch-btn.active {
        width: 36px !important;
        min-width: 36px !important;
        height: 34px !important;
        min-height: 34px !important;
        padding: 0 5px !important;
        font-size: 14px !important;
        line-height: 34px !important;
    }
}

:is(
    .ui-language-switch,
    .creation-language,
    .portal-language,
    .auth-language-switch,
    .kc-language,
    .topbar-actions > .language,
    .top-actions > .language
) > :is(a, button) {
    width: 38px !important;
    min-width: 38px !important;
    max-width: 38px !important;
    min-height: 32px !important;
    padding: 0 9px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 1px solid transparent !important;
    border-radius: 7px !important;
    background: transparent !important;
    color: #7b8ca3 !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    writing-mode: horizontal-tb !important;
    flex: 0 0 38px !important;
    text-decoration: none !important;
    box-shadow: none !important;
}

:is(
    .ui-language-switch,
    .creation-language,
    .portal-language,
    .auth-language-switch,
    .kc-language,
    .topbar-actions > .language,
    .top-actions > .language
) > :is(a, button).active {
    border-color: #b8d3fa !important;
    background: #eaf3ff !important;
    color: #176dcc !important;
    font-weight: 700 !important;
    box-shadow: inset 0 0 0 1px rgba(23, 109, 204, .08) !important;
}

:is(
    .ui-language-switch,
    .creation-language,
    .portal-language,
    .auth-language-switch,
    .kc-language,
    .topbar-actions > .language,
    .top-actions > .language
) > :is(a, button) + :is(a, button) {
    border-left-color: transparent !important;
}

body[data-ui-theme="dark"] :is(
    .ui-language-switch,
    .creation-language,
    .portal-language,
    .auth-language-switch,
    .kc-language,
    .topbar-actions > .language,
    .top-actions > .language
) {
    border-color: #334155 !important;
    background: #172131 !important;
}

body[data-ui-theme="dark"] :is(
    .ui-language-switch,
    .creation-language,
    .portal-language,
    .auth-language-switch,
    .kc-language,
    .topbar-actions > .language,
    .top-actions > .language
) > :is(a, button) {
    color: #a8b7cf !important;
}

body[data-ui-theme="dark"] :is(
    .ui-language-switch,
    .creation-language,
    .portal-language,
    .auth-language-switch,
    .kc-language,
    .topbar-actions > .language,
    .top-actions > .language
) > :is(a, button).active {
    border-color: #426b9f !important;
    background: #203a5c !important;
    color: #b8d4ff !important;
}

@media (max-width: 920px) {
    :is(
        .ui-language-switch,
        .creation-language,
        .portal-language,
        .auth-language-switch,
        .kc-language,
        .topbar-actions > .language,
        .top-actions > .language
    ) > :is(a, button) {
        min-width: 44px !important;
        min-height: 44px !important;
        padding: 0 9px !important;
        font-size: 14px !important;
    }

    /* The home page keeps a legacy mobile header outside the shared topbar.
       Its responsive rules are highly specific, so pin the same segmented
       contract here as the final authority. */
    html body.chat-landing[data-mode] .mobile-chat-actions .ui-language-switch,
    html body .mobile-chat-actions .ui-language-switch {
        width: auto !important;
        height: auto !important;
        min-height: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        gap: 3px !important;
        padding: 3px !important;
        border: 1px solid #d8e1ee !important;
        border-radius: 10px !important;
        background: #f8fafc !important;
        box-shadow: none !important;
        overflow: visible !important;
    }

    html body.chat-landing[data-mode] .mobile-chat-actions .ui-language-switch .ui-language-switch-btn,
    html body .mobile-chat-actions .ui-language-switch .ui-language-switch-btn {
        width: 44px !important;
        min-width: 44px !important;
        height: 44px !important;
        min-height: 44px !important;
        padding: 0 9px !important;
        border: 1px solid transparent !important;
        border-radius: 7px !important;
        background: transparent !important;
        color: #7b8ca3 !important;
        box-shadow: none !important;
    }

    html body.chat-landing[data-mode] .mobile-chat-actions .ui-language-switch .ui-language-switch-btn.active,
    html body .mobile-chat-actions .ui-language-switch .ui-language-switch-btn.active {
        border-color: #b8d3fa !important;
        background: #eaf3ff !important;
        color: #176dcc !important;
        box-shadow: inset 0 0 0 1px rgba(23, 109, 204, .08) !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode] .mobile-chat-actions .ui-language-switch,
    html body[data-ui-theme="dark"] .mobile-chat-actions .ui-language-switch {
        border-color: #334155 !important;
        background: #172131 !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode] .mobile-chat-actions .ui-language-switch .ui-language-switch-btn,
    html body[data-ui-theme="dark"] .mobile-chat-actions .ui-language-switch .ui-language-switch-btn {
        color: #a8b7cf !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode] .mobile-chat-actions .ui-language-switch .ui-language-switch-btn.active,
    html body[data-ui-theme="dark"] .mobile-chat-actions .ui-language-switch .ui-language-switch-btn.active {
        border-color: #426b9f !important;
        background: #203a5c !important;
        color: #b8d4ff !important;
    }
}

@media (max-width: 920px) {
    html body header[data-fuuvo-shared-topbar="1"] :is(.ui-language-switch, .creation-language, .portal-language),
    html body .mobile-chat-actions .ui-language-switch {
        width: auto !important;
        min-width: 0 !important;
        height: 42px !important;
        min-height: 42px !important;
        padding: 2px !important;
        gap: 2px !important;
        border-radius: 9px !important;
    }

    html body header[data-fuuvo-shared-topbar="1"] :is(.ui-language-switch-btn, .creation-language a, .portal-language a),
    html body .mobile-chat-actions .ui-language-switch .ui-language-switch-btn {
        width: 38px !important;
        min-width: 38px !important;
        height: 36px !important;
        min-height: 36px !important;
        padding: 0 6px !important;
        border-radius: 7px !important;
        font-size: 14px !important;
        line-height: 36px !important;
        box-sizing: border-box !important;
    }
}


/* Mobile language controls keep a full 44px touch target. */
@media (max-width: 920px) {
    html body .mobile-chat-actions .ui-language-switch .ui-language-switch-btn {
        width: 44px !important;
        min-width: 44px !important;
        height: 44px !important;
        min-height: 44px !important;
    }
    html body .mobile-chat-actions .ui-language-switch {
        min-height: 50px !important;
        box-sizing: border-box !important;
    }
}

/* Source: public/static/css/fuuvo-ai-disclaimer.css */
.fuuvo-ai-disclaimer {
    width: 100%;
    margin: auto auto 0;
    padding: 28px 12px 6px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 2px;
    color: #8795aa;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
    font-size: 11px;
    font-weight: 400;
    line-height: 1.55;
    text-align: center;
}

.fuuvo-ai-disclaimer-product {
    display: block;
    width: 100%;
}

.fuuvo-ai-disclaimer-legal {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 0;
}

.fuuvo-ai-disclaimer a {
    color: inherit !important;
    font-weight: 500;
    text-decoration: underline !important;
    text-underline-offset: 2px;
    white-space: nowrap;
}

.fuuvo-ai-disclaimer a:hover { color: #0b6ff2 !important; }
.fuuvo-ai-disclaimer .fuuraa-site-link { font-weight: 600; }
.fuuvo-ai-disclaimer .fuuvo-icp-record {
    display: block;
    width: 100%;
    margin-top: 2px;
}
.fuuvo-ai-disclaimer .fuuvo-icp-record-link { font-weight: 500; }

/*
 * Public feature pages share the same legal footer. Their content panes use
 * the document scrollbar, so short pages must still reserve the remaining
 * viewport height before the footer. Long pages continue to grow naturally.
 */
[data-fuuvo-app-scroll="1"]:has(> .fuuvo-ai-disclaimer) {
    min-height: calc(100dvh - 72px) !important;
    display: flex;
    flex-direction: column;
}

[data-fuuvo-app-scroll="1"] > .fuuvo-ai-disclaimer {
    margin-top: auto !important;
}

body[data-ui-theme="dark"] .fuuvo-ai-disclaimer { color: #aeb9c9; }
body[data-ui-theme="dark"] .fuuvo-ai-disclaimer a:hover { color: #8fbdff !important; }

@media (max-width: 620px) {
    [data-fuuvo-app-scroll="1"]:has(> .fuuvo-ai-disclaimer) {
        min-height: calc(100dvh - 56px) !important;
    }

    .fuuvo-ai-disclaimer {
        margin-top: auto;
        padding: 18px 8px max(6px, env(safe-area-inset-bottom));
        font-size: 9px;
        line-height: 1.45;
    }

    .fuuvo-ai-disclaimer-product { line-height: 1.35; }
}

/* Source: public/static/css/fuuvo-dark-theme.css */
/*
 * Shared dark appearance.
 *
 * This file is loaded last by the public shell so the appearance setting has
 * one authoritative palette even when an older feature stylesheet contains
 * literal light colours. Keep light mode in the page styles; dark mode lives
 * here and is shared by the home, feature, research and safety surfaces.
 */

html[data-ui-theme="dark"] {
    color-scheme: dark;
    --fuuvo-dark-bg: #0f141d;
    --fuuvo-dark-sidebar: #151b25;
    --fuuvo-dark-topbar: rgba(15, 20, 29, .93);
    --fuuvo-dark-surface: #1a222e;
    --fuuvo-dark-surface-raised: #202a38;
    --fuuvo-dark-surface-soft: #182332;
    --fuuvo-dark-input: #161e29;
    --fuuvo-dark-line: rgba(226, 232, 240, .11);
    --fuuvo-dark-line-strong: rgba(226, 232, 240, .18);
    --fuuvo-dark-text: #f8fafc;
    --fuuvo-dark-text-soft: #eef2f7;
    --fuuvo-dark-muted: #d1d9e5;
    --fuuvo-dark-blue: #6ba8ff;
    --fuuvo-dark-blue-soft: rgba(77, 145, 255, .13);
    --fuuvo-dark-blue-line: rgba(107, 168, 255, .42);
    --fuuvo-dark-warning: #f3bd65;
    --fuuvo-dark-warning-bg: #2a241a;
    --fuuvo-dark-warning-line: rgba(243, 189, 101, .34);
    --fuuvo-dark-danger: #ff8d98;
    --fuuvo-dark-danger-bg: #2b1d22;
    --fuuvo-dark-success: #62d6a7;

    --bg: var(--fuuvo-dark-bg);
    --panel: rgba(26, 34, 46, .94);
    --panel-strong: var(--fuuvo-dark-surface);
    --line: var(--fuuvo-dark-line);
    --line-strong: var(--fuuvo-dark-line-strong);
    --text: var(--fuuvo-dark-text);
    --ink: var(--fuuvo-dark-text);
    --muted: var(--fuuvo-dark-muted);
    --brand: var(--fuuvo-dark-blue);
    --brand-strong: #b8d4ff;
    --brand-soft: var(--fuuvo-dark-blue-soft);

    --creation-ink: var(--fuuvo-dark-text);
    --creation-muted: var(--fuuvo-dark-muted);
    --creation-line: var(--fuuvo-dark-line);
    --creation-blue: var(--fuuvo-dark-blue);
    --creation-soft: var(--fuuvo-dark-blue-soft);
    --analysis-ink: var(--fuuvo-dark-text);
    --analysis-text: var(--fuuvo-dark-text-soft);
    --analysis-muted: var(--fuuvo-dark-muted);
    --analysis-line: var(--fuuvo-dark-line);
    --analysis-soft: var(--fuuvo-dark-surface-soft);
    --analysis-blue: var(--fuuvo-dark-blue);
    --analysis-blue-dark: #84b7ff;
    --detail-ink: var(--fuuvo-dark-text);
    --detail-muted: var(--fuuvo-dark-muted);
    --detail-line: var(--fuuvo-dark-line);
    --detail-blue: var(--fuuvo-dark-blue);
    --food-ink: var(--fuuvo-dark-text);
    --food-muted: var(--fuuvo-dark-muted);
    --food-line: var(--fuuvo-dark-line);
    --food-blue: var(--fuuvo-dark-blue);
    --food-soft: var(--fuuvo-dark-blue-soft);
    --fortune-ink: var(--fuuvo-dark-text);
    --fortune-muted: var(--fuuvo-dark-muted);
    --fortune-line: var(--fuuvo-dark-line);
    --fortune-blue: var(--fuuvo-dark-blue);
    --fortune-soft: var(--fuuvo-dark-blue-soft);
    --office-ink: var(--fuuvo-dark-text);
    --office-muted: var(--fuuvo-dark-muted);
    --office-line: var(--fuuvo-dark-line);
    --office-blue: var(--fuuvo-dark-blue);
    --sr-ink: var(--fuuvo-dark-text);
    --sr-text: var(--fuuvo-dark-text-soft);
    --sr-muted: var(--fuuvo-dark-muted);
    --sr-line: var(--fuuvo-dark-line);
    --sr-soft: var(--fuuvo-dark-surface-soft);
    --sr-blue: var(--fuuvo-dark-blue);
    --ss-deep: var(--fuuvo-dark-text);
    --ss-text: var(--fuuvo-dark-text-soft);
    --ss-muted: var(--fuuvo-dark-muted);
    --ss-line: var(--fuuvo-dark-line);
    --ss-pale: var(--fuuvo-dark-surface-soft);
    --ss-blue: var(--fuuvo-dark-blue);
    --ac-deep: var(--fuuvo-dark-text);
    --ac-text: var(--fuuvo-dark-text-soft);
    --ac-muted: var(--fuuvo-dark-muted);
    --ac-line: var(--fuuvo-dark-line);
    --ac-soft: var(--fuuvo-dark-surface-soft);
    --ac-blue: var(--fuuvo-dark-blue);
}

html[data-ui-theme="dark"] .purchased-services-app,
body[data-ui-theme="dark"] .purchased-services-app {
    --service-bg: #081321;
    --service-panel: #0f1e31;
    --service-soft: #14263b;
    --service-line: #293e59;
    --service-text: #edf5ff;
    --service-muted: #afbed2;
    --service-brand: #70adff;
    --service-good: #6bd6aa;
    --service-warn: #f0bd69;
    --service-danger: #ff8d96;
}

html[data-ui-theme="dark"],
html[data-ui-theme="dark"] > body,
body[data-ui-theme="dark"] {
    background: var(--fuuvo-dark-bg) !important;
    color: var(--fuuvo-dark-text-soft);
}

/* First-paint fallback: the head knows the theme before the body node exists. */
html[data-ui-theme="dark"] > body:not([data-ui-theme]) :is(
    [data-fuuvo-app-shell="1"],
    [data-fuuvo-app-workspace="1"],
    .app,
    .workspace,
    .creation-app,
    .creation-workspace,
    .portal-shell,
    .portal-content,
    .feature-shell,
    .feature-content
) {
    background: var(--fuuvo-dark-bg) !important;
    color: var(--fuuvo-dark-text-soft);
}

html[data-ui-theme="dark"] > body:not([data-ui-theme]) :is(
    aside[data-fuuvo-shared-sidebar="1"],
    .history
) {
    background: var(--fuuvo-dark-sidebar) !important;
}

html[data-ui-theme="dark"] > body:not([data-ui-theme]) :is(
    header[data-fuuvo-shared-topbar="1"],
    .workspace-chat-header
) {
    background: var(--fuuvo-dark-topbar) !important;
}

body[data-ui-theme="dark"] ::selection {
    background: rgba(107, 168, 255, .32);
    color: #fff;
}

body[data-ui-theme="dark"] :is(input, textarea, select) {
    caret-color: var(--fuuvo-dark-blue);
}

body[data-ui-theme="dark"] :is(input, textarea)::placeholder {
    color: var(--fuuvo-dark-muted) !important;
    opacity: 1;
}

body[data-ui-theme="dark"] :is([data-fuuvo-app-shell="1"], .creation-app, .portal-shell, .feature-shell, .app) {
    background: var(--fuuvo-dark-bg) !important;
    color: var(--fuuvo-dark-text-soft);
}

body[data-ui-theme="dark"] :is([data-fuuvo-app-workspace="1"], .creation-workspace, .portal-content, .feature-content, .workspace) {
    background: var(--fuuvo-dark-bg) !important;
}

body[data-ui-theme="dark"] [data-fuuvo-app-scroll="1"] {
    color: var(--fuuvo-dark-text-soft);
    scrollbar-color: #3a485c transparent;
}

body[data-ui-theme="dark"] [data-fuuvo-app-scroll="1"]::-webkit-scrollbar,
body[data-ui-theme="dark"] .conversation-list::-webkit-scrollbar,
body[data-ui-theme="dark"] .portal-recent-list::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

body[data-ui-theme="dark"] [data-fuuvo-app-scroll="1"]::-webkit-scrollbar-thumb,
body[data-ui-theme="dark"] .conversation-list::-webkit-scrollbar-thumb,
body[data-ui-theme="dark"] .portal-recent-list::-webkit-scrollbar-thumb {
    border: 2px solid transparent;
    border-radius: 999px;
    background: #3a485c;
    background-clip: padding-box;
}

/* Shared sidebar, top bar and global dialogs. */
body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"],
body[data-ui-theme="dark"] :is(.creation-app, .portal-shell, .feature-shell) > aside[data-fuuvo-shared-sidebar="1"] {
    border-right-color: var(--fuuvo-dark-line) !important;
    background: var(--fuuvo-dark-sidebar) !important;
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-search-trigger {
    border-color: var(--fuuvo-dark-line) !important;
    background: var(--fuuvo-dark-input) !important;
    color: var(--fuuvo-dark-muted) !important;
    box-shadow: 0 10px 24px rgba(0, 0, 0, .15) !important;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-search-trigger-shortcut {
    background: rgba(255, 255, 255, .06) !important;
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-search-trigger > img.fuuvo-design-icon {
    opacity: 1 !important;
    filter: brightness(0) saturate(100%) invert(83%) sepia(14%) saturate(618%) hue-rotate(178deg) brightness(100%) contrast(92%) !important;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-search-trigger:hover > img.fuuvo-design-icon,
body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-search-trigger:focus-visible > img.fuuvo-design-icon {
    filter: brightness(0) saturate(100%) invert(72%) sepia(48%) saturate(2276%) hue-rotate(189deg) brightness(103%) contrast(101%) !important;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-search-trigger-shortcut {
    border: 1px solid rgba(148, 184, 232, .12) !important;
    background: rgba(148, 184, 232, .1) !important;
    color: #d8e6f8 !important;
}

body[data-ui-theme="dark"] :is(
    .sidebar-search-trigger-label, .viewer-meta, .settings-inline-help,
    .auth-legal-check, .auth-legal-note, .conversation-empty-state,
    .status-text, .workspace-disclaimer
) {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] :is(.sidebar-brand-logo img, .brand-logo img) {
    border-color: transparent !important;
    background: transparent !important;
    box-shadow: none !important;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] :is(.sidebar-nav, .portal-nav) {
    border-color: var(--fuuvo-dark-line) !important;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] :is(.sidebar-nav-btn, .portal-nav a, .conversation-item, .portal-recent-list a, .portal-recent-empty, .sidebar-safety-link, .portal-safety-link) {
    border-color: transparent !important;
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] :is(.sidebar-safety-link, .portal-safety-link) {
    background: var(--fuuvo-dark-surface-raised) !important;
    color: var(--fuuvo-dark-text) !important;
    font-weight: 600 !important;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] :is(.sidebar-safety-link, .portal-safety-link) > :is(.fuuvo-linear-icon, img, svg) {
    color: var(--fuuvo-dark-text) !important;
    opacity: 1 !important;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] :is(.sidebar-section-label, .portal-recent h2, .conversation-time, .portal-recent-time) {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] :is(.history-main, .portal-recent, .history-account, .sidebar-safety-link, .portal-safety-link) {
    border-color: var(--fuuvo-dark-line) !important;
}

@media (min-width: 921px) {
    body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region .sidebar-safety-link {
        border-top-color: transparent !important;
    }

    body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region .sidebar-safety-link::before {
        background: rgba(148, 163, 184, .34) !important;
    }
}

/* Keep the safety-center divider visible in the mobile drawer as well. */
@media (max-width: 920px) {
    html body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region .sidebar-safety-link {
        border-top: 1px solid rgba(148, 163, 184, .46) !important;
    }
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] :is(.sidebar-nav-btn:not(#sidebar-new-chat):hover, .sidebar-nav-btn:not(#sidebar-new-chat).active, .portal-nav a:hover, .portal-nav a.active, .conversation-item:hover, .conversation-item.active, .portal-recent-list a:hover) {
    background: var(--fuuvo-dark-blue-soft) !important;
    color: #8bbcff !important;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] :is(#sidebar-new-chat, .portal-new-chat) {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: transparent !important;
    color: #7fb4ff !important;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] :is(#sidebar-new-chat, .portal-new-chat):hover {
    background: var(--fuuvo-dark-blue-soft) !important;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] :is(.sidebar-account-toggle, .sidebar-account-menu.is-open .sidebar-account-toggle) {
    background: #202a38 !important;
    color: var(--fuuvo-dark-text) !important;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] :is(.sidebar-account-settings, .sidebar-account-name, .sidebar-account-chevron) {
    color: var(--fuuvo-dark-text) !important;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-settings.is-active {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
    color: var(--fuuvo-dark-blue) !important;
    box-shadow: 0 0 0 3px rgba(107, 168, 255, .08) !important;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .workspace-header-user-fallback.guest-avatar {
    border-color: var(--fuuvo-dark-line) !important;
    background: #202a38 !important;
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] :is(.workspace-header-user-fallback.guest-avatar img, .sidebar-account-settings img) {
    filter: brightness(0) saturate(100%) invert(69%) sepia(68%) saturate(2347%) hue-rotate(189deg) brightness(103%) contrast(102%);
}

/* Keep the two PC navigation glyphs aligned with the sidebar's blue icon system in dark mode. */
@media (min-width: 921px) {
    body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] :is(
        #sidebar-new-work-task,
        #sidebar-open-research
    ) .rail-glyph > img {
        filter: brightness(0) saturate(100%) invert(37%) sepia(95%) saturate(4215%) hue-rotate(208deg) brightness(99%) contrast(98%) !important;
        opacity: 1 !important;
    }
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-settings:hover {
    background: rgba(255, 255, 255, .07) !important;
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] header[data-fuuvo-shared-topbar="1"],
body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .workspace-chat-header {
    border-bottom-color: var(--fuuvo-dark-line) !important;
    background: linear-gradient(180deg, rgba(15, 20, 29, .98) 0%, rgba(15, 20, 29, .92) 84%, rgba(15, 20, 29, 0) 100%) !important;
    color: var(--fuuvo-dark-text-soft) !important;
    box-shadow: none !important;
}

body[data-ui-theme="dark"] header[data-fuuvo-shared-topbar="1"] :is(#feature-shell-title, .portal-topbar-title, .workspace-chat-header-center strong, .shell-topbar-suffix, .shell-topbar-middle),
body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .workspace-chat-header-center strong {
    color: var(--fuuvo-dark-text) !important;
}

body[data-ui-theme="dark"] header[data-fuuvo-shared-topbar="1"] :is(.workspace-header-link, .portal-top-safety-link, .ui-language-switch-btn, .portal-sidebar-toggle, .creation-sidebar-toggle, .desktop-history-toggle, .chat-detail-back, .shell-history-back) {
    color: var(--fuuvo-dark-muted) !important;
}

/* Back is a navigation action, not muted supporting copy. Keep it readable on
   every shared dark topbar, including the compact mobile header. */
html[data-ui-theme="dark"] body header[data-fuuvo-shared-topbar="1"] .shell-history-back,
body[data-ui-theme="dark"] header[data-fuuvo-shared-topbar="1"] .shell-history-back {
    color: #b8d4ff !important;
    -webkit-text-fill-color: currentColor !important;
}

html[data-ui-theme="dark"] body header[data-fuuvo-shared-topbar="1"] .shell-history-back:is(:hover, :focus-visible),
body[data-ui-theme="dark"] header[data-fuuvo-shared-topbar="1"] .shell-history-back:is(:hover, :focus-visible) {
    background: #203b5d !important;
    color: #f5f9ff !important;
    box-shadow: 0 0 0 2px rgba(107, 168, 255, .22) !important;
    outline: none;
}

body[data-ui-theme="dark"] header[data-fuuvo-shared-topbar="1"] :is(.creation-language, .portal-language) {
    gap: 3px !important;
    padding: 3px !important;
    border: 1px solid var(--fuuvo-dark-line-strong) !important;
    border-radius: 10px !important;
    background: var(--fuuvo-dark-input) !important;
    box-shadow: none !important;
}

body[data-ui-theme="dark"] header[data-fuuvo-shared-topbar="1"] :is(.creation-language, .portal-language) a {
    min-width: 38px !important;
    min-height: 32px !important;
    padding: 0 9px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 1px solid transparent !important;
    border-radius: 7px !important;
    background: transparent !important;
    color: var(--fuuvo-dark-muted) !important;
    -webkit-text-fill-color: currentColor !important;
    line-height: 1 !important;
    box-shadow: none !important;
}

html body[data-ui-theme="dark"] header[data-fuuvo-shared-topbar="1"] :is(.creation-language, .portal-language) a.active {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
    color: #b8d4ff !important;
    -webkit-text-fill-color: currentColor !important;
    box-shadow: inset 0 0 0 1px rgba(107, 168, 255, .1) !important;
}

body[data-ui-theme="dark"] header[data-fuuvo-shared-topbar="1"] :is(.creation-language, .portal-language) a:not(.active):hover {
    background: rgba(255, 255, 255, .05) !important;
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] header[data-fuuvo-shared-topbar="1"] :is(.creation-language, .portal-language) a + a {
    border-left-color: transparent !important;
}

body[data-ui-theme="dark"] header[data-fuuvo-shared-topbar="1"] :is(.ui-language-switch-btn.active, .workspace-header-link:hover, .portal-top-safety-link:hover, .portal-sidebar-toggle:hover, .creation-sidebar-toggle:hover, .desktop-history-toggle:hover, .chat-detail-back:hover, .shell-history-back:hover) {
    background: var(--fuuvo-dark-blue-soft) !important;
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"][data-mode="chat"] .chat-detail-back-mobile {
    background: transparent !important;
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"][data-mode="chat"] header[data-fuuvo-shared-topbar="1"] .ui-language-switch {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

body[data-ui-theme="dark"][data-mode="chat"] header[data-fuuvo-shared-topbar="1"] .ui-language-switch-btn {
    background: transparent !important;
    box-shadow: none !important;
}

body[data-ui-theme="dark"][data-mode="chat"] header[data-fuuvo-shared-topbar="1"] .ui-language-switch-btn.active {
    background: transparent !important;
    color: var(--fuuvo-dark-text) !important;
}

body[data-ui-theme="dark"][data-mode="chat"] header[data-fuuvo-shared-topbar="1"] .ui-language-switch-btn:not(.active) {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"][data-mode="chat"] header[data-fuuvo-shared-topbar="1"] .ui-language-switch-btn + .ui-language-switch-btn {
    border-left-color: var(--fuuvo-dark-line-strong) !important;
}

body[data-ui-theme="dark"] header[data-fuuvo-shared-topbar="1"] :is(.workspace-header-login, .creation-login, .portal-login) {
    background: #d9e8fb !important;
    color: #142236 !important;
}

body[data-ui-theme="dark"] .fuuvo-shell-search {
    background: rgba(3, 7, 14, .62);
}

body[data-ui-theme="dark"] .fuuvo-shell-search-dialog,
body[data-ui-theme="dark"] .topbar-explore-menu,
body[data-ui-theme="dark"] .topbar-settings-drawer,
body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] :is(.sidebar-account-dropdown, .sidebar-quick-settings),
body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings::before,
body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-quick-settings::after {
    border-color: var(--fuuvo-dark-line-strong) !important;
    background: #18212d !important;
    color: var(--fuuvo-dark-text) !important;
    box-shadow: 0 24px 70px rgba(0, 0, 0, .42) !important;
}

body[data-ui-theme="dark"] .fuuvo-shell-search-head,
body[data-ui-theme="dark"] :is(.topbar-explore-menu section + section, .topbar-explore-powered, .topbar-settings-drawer-head, .topbar-settings-group, .topbar-settings-panel-back),
body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] :is(.sidebar-account-links, .sidebar-quick-settings-divider, .sidebar-quick-settings-footer, .sidebar-quick-settings-back) {
    border-color: var(--fuuvo-dark-line) !important;
}

body[data-ui-theme="dark"] .fuuvo-shell-search-input-wrap {
    background: var(--fuuvo-dark-input) !important;
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] .fuuvo-shell-search-input-wrap input,
body[data-ui-theme="dark"] .fuuvo-shell-search-close,
body[data-ui-theme="dark"] .fuuvo-shell-search-create,
body[data-ui-theme="dark"] .fuuvo-shell-search-results a,
body[data-ui-theme="dark"] .topbar-explore-menu a,
body[data-ui-theme="dark"] .topbar-settings-drawer :is(h2, button, a),
body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] :is(.sidebar-account-dropdown strong, .sidebar-account-links > a, .sidebar-quick-settings-title, .sidebar-quick-settings-row, .sidebar-quick-settings-back, .sidebar-quick-settings-option) {
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] :is(.fuuvo-shell-search-create, .fuuvo-shell-search-results a, .fuuvo-shell-search-close, .topbar-explore-menu a, .topbar-settings-row, .topbar-settings-option):hover,
body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] :is(.sidebar-account-links > a, .sidebar-account-guest, .sidebar-account-logout, .sidebar-quick-settings-row, .sidebar-quick-settings-option):hover {
    background: rgba(255, 255, 255, .06) !important;
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] .fuuvo-shell-search-section-title,
body[data-ui-theme="dark"] .fuuvo-shell-search-results p,
body[data-ui-theme="dark"] .fuuvo-shell-search-create small,
body[data-ui-theme="dark"] .topbar-explore-menu h2,
body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] :is(.sidebar-account-dropdown p, .sidebar-quick-settings-value, .sidebar-quick-settings-footer) {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] .fuuvo-ai-disclaimer {
    border-top-color: var(--fuuvo-dark-line);
    color: var(--fuuvo-dark-muted);
}

body[data-ui-theme="dark"] .fuuvo-ai-disclaimer a {
    color: var(--fuuvo-dark-blue) !important;
}

/* Chat home and conversation workspace. */
body[data-ui-theme="dark"].chat-landing[data-mode="chat"],
body[data-ui-theme="dark"].chat-landing[data-mode="chat"] :is(.app, .workspace) {
    background: var(--fuuvo-dark-bg) !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .history {
    border-right-color: var(--fuuvo-dark-line) !important;
    background: var(--fuuvo-dark-sidebar) !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] :is(.sidebar-nav-btn, .conversation-title, .conversation-item-icon, .workspace-account-toggle, .sidebar-account-name, .sidebar-account-chevron) {
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] :is(.sidebar-section-label, .conversation-time) {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] :is(.history-main, .history-account) {
    border-color: var(--fuuvo-dark-line) !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] :is(.sidebar-nav-btn:not(#sidebar-new-chat):hover, .sidebar-nav-btn:not(#sidebar-new-chat).active, .conversation-item:hover, .conversation-item.active) {
    background: var(--fuuvo-dark-blue-soft) !important;
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] #sidebar-new-chat {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: transparent !important;
    color: #7fb4ff !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] #sidebar-new-chat.active,
body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] #sidebar-new-chat:hover {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
    color: #8bbcff !important;
}

body[data-ui-theme="dark"] #sidebar-new-chat.sidebar-nav-btn {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: transparent !important;
    color: #7fb4ff !important;
}

body[data-ui-theme="dark"] #sidebar-new-chat.sidebar-nav-btn.active,
body[data-ui-theme="dark"] #sidebar-new-chat.sidebar-nav-btn:hover {
    background: var(--fuuvo-dark-blue-soft) !important;
    color: #8bbcff !important;
}

body[data-ui-theme="dark"] .workspace-account-toggle.sidebar-account-toggle,
body[data-ui-theme="dark"] .workspace-account-menu.is-open .workspace-account-toggle.sidebar-account-toggle {
    border-color: transparent !important;
    background: var(--fuuvo-dark-surface-raised) !important;
    color: var(--fuuvo-dark-text) !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] :is(.composer-title, .workspace-chat-header-center strong) {
    color: var(--fuuvo-dark-text) !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] :is(.composer-desc, .chat-input-hint, .workspace-disclaimer) {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .chat-input-wrap {
    border-color: var(--fuuvo-dark-line-strong) !important;
    background: var(--fuuvo-dark-input) !important;
    box-shadow: 0 12px 30px rgba(0, 0, 0, .18) !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .chat-input-wrap textarea {
    color: var(--fuuvo-dark-text) !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .chat-tool-btn {
    border-color: var(--fuuvo-dark-line-strong) !important;
    background: #18212d !important;
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .composer-capability-btn {
    border-color: var(--fuuvo-dark-line-strong) !important;
    background: var(--fuuvo-dark-surface) !important;
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .composer-capability-btn:hover,
body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .composer-capability-btn.active {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
    color: #8bbcff !important;
}

/* Keep the conversation composer on the same dark canvas as the workspace. */
html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] .composer {
    border-color: transparent !important;
    background: var(--fuuvo-dark-bg) !important;
    background-image: none !important;
    box-shadow: none !important;
}

html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] .chat-input-wrap {
    border-color: var(--fuuvo-dark-line-strong) !important;
    background: var(--fuuvo-dark-input) !important;
    box-shadow: 0 12px 30px rgba(0, 0, 0, .18) !important;
}

body[data-ui-theme="dark"] .core-feature-btn {
    border-color: var(--fuuvo-dark-line-strong) !important;
    background: var(--fuuvo-dark-surface) !important;
    color: var(--fuuvo-dark-text-soft) !important;
    box-shadow: none !important;
}

body[data-ui-theme="dark"] .core-feature-btn:hover {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] :is(.message-bubble, .assistant-message, .chat-message, .card, .guest-hero-main, .composer):not(.hero) {
    border-color: var(--fuuvo-dark-line);
}

body[data-ui-theme="dark"] .chat-bubble.assistant {
    border-color: var(--fuuvo-dark-line) !important;
    background: var(--fuuvo-dark-surface) !important;
    color: var(--fuuvo-dark-text-soft) !important;
    box-shadow: none !important;
}

body[data-ui-theme="dark"] .chat-research-progress {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-surface-raised) !important;
    color: #dbeafe !important;
    box-shadow: none !important;
}

body[data-ui-theme="dark"] .chat-research-progress-copy {
    color: inherit !important;
}

body[data-ui-theme="dark"] .chat-research-progress-dot {
    background: var(--fuuvo-dark-blue) !important;
    box-shadow: 0 0 0 4px var(--fuuvo-dark-blue-soft) !important;
}

body[data-ui-theme="dark"] .chat-codex-harness-badge {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
    color: #b8d4ff !important;
}

body[data-ui-theme="dark"] .chat-codex-harness-badge.is-fallback {
    border-color: rgba(245, 183, 86, .28) !important;
    background: rgba(245, 183, 86, .1) !important;
    color: #f7cd88 !important;
}

body[data-ui-theme="dark"] :is(.chat-bubble.assistant, .chat-bubble.system) :is(p, div, span, h1, h2, h3, h4, h5, h6, strong, b, em, li, dt, dd, blockquote, th, td):not(.message-action-label) {
    color: inherit;
}

body[data-ui-theme="dark"] :is(.research-history-card,.research-history-empty,.research-result-document,.research-result-table,.research-report-output blockquote){border-color:var(--fuuvo-dark-line)!important;background:var(--fuuvo-dark-surface)!important;color:var(--fuuvo-dark-text-soft)!important;box-shadow:none!important}
body[data-ui-theme="dark"] :is(.research-history-card-title,.research-result-heading h1,.research-result-state h2,.research-report-output h4,.research-report-output h5,.research-report-output strong,.source-panel h2,.operation-panel h2){color:var(--fuuvo-dark-text)!important}
body[data-ui-theme="dark"] :is(.research-history-card-preview,.research-history-card-meta,.research-history-empty p,.research-result-heading p,.research-result-state p,.research-report-output,.research-report-output p,.research-report-output li,.research-report-output em,.research-auto-save-note,.source-copy span,.research-result-footer){color:var(--fuuvo-dark-text-soft)!important}
body[data-ui-theme="dark"] .research-report-output a{color:#8fc0ff!important}
body[data-ui-theme="dark"] :is(.research-history-empty-icon,.research-result-state-icon,.research-source-favicon){background:var(--fuuvo-dark-blue-soft)!important;color:var(--fuuvo-dark-blue)!important}
body[data-ui-theme="dark"] .research-result-state.is-error .research-result-state-icon{background:var(--fuuvo-dark-danger-bg)!important;color:var(--fuuvo-dark-danger)!important}
body[data-ui-theme="dark"] .research-result-table th{border-color:var(--fuuvo-dark-line)!important;background:var(--fuuvo-dark-surface-raised)!important;color:var(--fuuvo-dark-text)!important}
body[data-ui-theme="dark"] .research-result-table td{border-color:var(--fuuvo-dark-line)!important;color:var(--fuuvo-dark-text-soft)!important}
body[data-ui-theme="dark"] .research-report-output code{background:var(--fuuvo-dark-surface-raised)!important;color:#b8d4ff!important}
body[data-ui-theme="dark"] .research-source-link:hover{border-color:var(--fuuvo-dark-blue-line)!important;background:var(--fuuvo-dark-surface-raised)!important}
body[data-ui-theme="dark"] :is(.research-history-status.is-processing,.research-history-status.is-queued){background:var(--fuuvo-dark-blue-soft)!important;color:#9bc7ff!important}
body[data-ui-theme="dark"] .research-history-status.is-completed{background:rgba(98,214,167,.12)!important;color:var(--fuuvo-dark-success)!important}
body[data-ui-theme="dark"] .research-history-status.is-failed{background:var(--fuuvo-dark-danger-bg)!important;color:var(--fuuvo-dark-danger)!important}

body[data-ui-theme="dark"] #research-app[data-research-page="deep"] .research-panel {
    border-color: var(--fuuvo-dark-line) !important;
    background: var(--fuuvo-dark-surface) !important;
    color: var(--fuuvo-dark-text-soft) !important;
    box-shadow: none !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="deep"] .research-panel :is(h2, h3) {
    color: var(--fuuvo-dark-text) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="deep"] :is(.research-field, .research-select) {
    border-color: var(--fuuvo-dark-line-strong) !important;
    background: var(--fuuvo-dark-input) !important;
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="deep"] :is(.research-field, .research-select):focus {
    border-color: var(--fuuvo-dark-blue-line) !important;
    box-shadow: 0 0 0 3px var(--fuuvo-dark-blue-soft) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="deep"] :is(.research-select-label, .research-counter, .research-bullets, .research-step, .research-bottom-note) {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="deep"] .research-setting-block {
    border-color: var(--fuuvo-dark-line) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="deep"] .research-setting-head {
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="deep"] :is(.research-source, .research-variant) {
    border-color: var(--fuuvo-dark-line-strong) !important;
    background: var(--fuuvo-dark-surface-raised) !important;
    color: var(--fuuvo-dark-text-soft) !important;
    box-shadow: none !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="deep"] .research-radio {
    border-color: var(--fuuvo-dark-muted) !important;
    background: transparent !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="deep"] :is(
    .research-source.active,
    .research-source:hover,
    .research-variant.active,
    .research-variant:hover
) {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="deep"] .research-source.active {
    box-shadow: inset 0 0 0 1px var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="deep"] .research-source.active .research-radio {
    border-color: var(--fuuvo-dark-blue) !important;
    background: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="deep"] .research-reference-dropzone {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-surface-soft) !important;
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="deep"] .research-reference-dropzone:hover,
body[data-ui-theme="dark"] #research-app[data-research-page="deep"] .research-reference-upload.dragging .research-reference-dropzone {
    background: var(--fuuvo-dark-blue-soft) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="deep"] .research-reference-dropzone small,
body[data-ui-theme="dark"] #research-app[data-research-page="deep"] .research-reference-file-copy small {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="deep"] .research-reference-file {
    border-color: var(--fuuvo-dark-line) !important;
    background: var(--fuuvo-dark-surface-raised) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="deep"] .research-reference-file-icon {
    background: var(--fuuvo-dark-blue-soft) !important;
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="deep"] .research-reference-file-remove:hover {
    background: var(--fuuvo-dark-blue-soft) !important;
    color: var(--fuuvo-dark-danger) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="deep"] .research-step-number {
    background: var(--fuuvo-dark-blue) !important;
    color: #fff !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="analysis"] :is(.analysis-panel, .analysis-side) {
    border-color: var(--fuuvo-dark-line) !important;
    background: var(--fuuvo-dark-surface) !important;
    color: var(--fuuvo-dark-text-soft) !important;
    box-shadow: none !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="analysis"] .research-tabs {
    border-color: var(--fuuvo-dark-line) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="analysis"] .research-tabs a:not(.active) {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="analysis"] .analysis-drop {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-surface-soft) !important;
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="analysis"] .analysis-drop:hover {
    border-color: var(--fuuvo-dark-blue) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="analysis"] .analysis-drop img {
    width: 76px;
    height: 76px;
    object-fit: contain;
}

body[data-ui-theme="dark"] #research-app[data-research-page="analysis"] .analysis-drop :is(span, small) {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="analysis"] .analysis-drop strong {
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="analysis"] :is(.analysis-pills .creation-pill, .analysis-method) {
    border-color: var(--fuuvo-dark-line-strong) !important;
    background: var(--fuuvo-dark-surface-raised) !important;
    color: var(--fuuvo-dark-text-soft) !important;
    box-shadow: none !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="analysis"] :is(
    .analysis-pills .creation-pill:hover,
    .analysis-pills .creation-pill.active,
    .analysis-method.active,
    .analysis-method:hover
) {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
    color: #fff !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="analysis"] .analysis-pills .creation-pill.active {
    box-shadow: inset 0 0 0 1px var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="analysis"] .analysis-pills .creation-pill.active .research-design-icon {
    filter: brightness(0) invert(1) !important;
    opacity: 1 !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="analysis"] :is(.analysis-method) {
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="analysis"] :is(.analysis-method.active) {
    color: #fff !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="analysis"] :is(.analysis-method) .research-design-icon {
    filter: brightness(0) saturate(100%) invert(80%) sepia(24%) saturate(1119%) hue-rotate(182deg) brightness(105%) contrast(102%) !important;
    opacity: 1 !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="analysis"] .analysis-file {
    border-color: var(--fuuvo-dark-line) !important;
    background: var(--fuuvo-dark-surface-raised) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="analysis"] .analysis-file-copy strong {
    color: var(--fuuvo-dark-text) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="analysis"] :is(
    .analysis-file-copy span,
    .analysis-note,
    .research-analysis-status
) {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="data"] [data-research-detail="data"] :is(
    .research-detail-card,
    .data-result-card
) {
    border-color: var(--fuuvo-dark-line) !important;
    background: var(--fuuvo-dark-surface) !important;
    color: var(--fuuvo-dark-text-soft) !important;
    box-shadow: none !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="data"] .research-tabs {
    border-color: var(--fuuvo-dark-line) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="data"] .research-tabs a:not(.active) {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="data"] [data-research-detail="data"] :is(h2, h3) {
    color: var(--fuuvo-dark-text) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="data"] [data-research-detail="data"] .data-upload-zone {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-surface-soft) !important;
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="data"] [data-research-detail="data"] :is(.data-upload-zone:hover, .data-upload-zone.dragging) {
    border-color: var(--fuuvo-dark-blue) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="data"] [data-research-detail="data"] .data-upload-zone strong {
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="data"] [data-research-detail="data"] .data-upload-zone span,
body[data-ui-theme="dark"] #research-app[data-research-page="data"] [data-research-detail="data"] .detail-textarea > small {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="data"] [data-research-detail="data"] .data-selected-file {
    border-color: var(--fuuvo-dark-line) !important;
    background: var(--fuuvo-dark-surface-raised) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="data"] [data-research-detail="data"] .data-selected-file strong {
    color: var(--fuuvo-dark-text) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="data"] [data-research-detail="data"] .data-selected-file small {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="data"] [data-research-detail="data"] .data-upload-progress-label {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="data"] [data-research-detail="data"] .data-upload-progress-track {
    background: var(--fuuvo-dark-line-strong) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="data"] [data-research-detail="data"] .data-selected-file-remove:hover {
    background: var(--fuuvo-dark-blue-soft) !important;
    color: var(--fuuvo-dark-danger) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="data"] [data-research-detail="data"] .data-focus-grid button {
    border-color: var(--fuuvo-dark-line-strong) !important;
    background: var(--fuuvo-dark-surface-raised) !important;
    color: var(--fuuvo-dark-text-soft) !important;
    box-shadow: none !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="data"] [data-research-detail="data"] .data-focus-grid :is(button.active, button:hover) {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="data"] [data-research-detail="data"] .data-focus-grid :is(button) img {
    filter: brightness(0) saturate(100%) invert(80%) sepia(24%) saturate(1119%) hue-rotate(182deg) brightness(105%) contrast(102%) !important;
    opacity: 1 !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="data"] [data-research-detail="data"] .data-focus-grid :is(button:hover) {
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="data"] [data-research-detail="data"] .data-focus-grid :is(button.active) {
    color: #fff !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="data"] [data-research-detail="data"] .data-metrics article {
    border-color: var(--fuuvo-dark-line) !important;
    background: var(--fuuvo-dark-surface-raised) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="data"] [data-research-detail="data"] .data-metrics span {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="data"] [data-research-detail="data"] .data-metrics strong {
    color: var(--fuuvo-dark-text) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="data"] [data-research-detail="data"] :is(.chart-legend, .data-findings p) {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="data"] [data-research-detail="data"] .data-chart .grid path {
    stroke: var(--fuuvo-dark-line-strong) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="data"] [data-research-detail="data"] .data-chart .points circle {
    fill: var(--fuuvo-dark-surface-raised) !important;
    stroke: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="data"] [data-research-detail="data"] .data-chart .labels text {
    fill: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="data"] [data-research-detail="data"] :is(.data-findings, .data-preview-table) {
    border-color: var(--fuuvo-dark-line) !important;
    background: var(--fuuvo-dark-surface-raised) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="data"] [data-research-detail="data"] .data-preview-table table,
body[data-ui-theme="dark"] #research-app[data-research-page="data"] [data-research-detail="data"] .data-preview-table td {
    border-color: var(--fuuvo-dark-line) !important;
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="data"] [data-research-detail="data"] .data-preview-table th {
    border-color: var(--fuuvo-dark-line) !important;
    background: var(--fuuvo-dark-surface-soft) !important;
    color: var(--fuuvo-dark-text) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="data"] [data-research-detail="data"] .research-outline.export-data {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-surface-raised) !important;
    color: #fff !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="data"] [data-research-detail="data"] .research-outline.export-data:hover {
    background: var(--fuuvo-dark-blue-soft) !important;
    color: #fff !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="data"] [data-research-detail="data"] :is(.research-outline.export-data) img {
    filter: brightness(0) saturate(100%) invert(80%) sepia(24%) saturate(1119%) hue-rotate(182deg) brightness(105%) contrast(102%) !important;
    opacity: 1 !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="translation"] [data-research-detail="translation"] .research-detail-card {
    border-color: var(--fuuvo-dark-line) !important;
    background: var(--fuuvo-dark-surface) !important;
    color: var(--fuuvo-dark-text-soft) !important;
    box-shadow: none !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="translation"] [data-research-detail="translation"] :is(h2, h3) {
    color: var(--fuuvo-dark-text) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="translation"] [data-research-detail="translation"] .translation-tabs button {
    border-color: var(--fuuvo-dark-line-strong) !important;
    background: var(--fuuvo-dark-surface-raised) !important;
    color: var(--fuuvo-dark-text-soft) !important;
    box-shadow: none !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="translation"] [data-research-detail="translation"] .translation-tabs :is(button.active, button:hover) {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
    color: var(--fuuvo-dark-blue) !important;
    box-shadow: inset 0 0 0 1px var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="translation"] [data-research-detail="translation"] :is(
    img[src*="fuuvo-transcribe-audio-video.svg"],
    img[src$="fuuvo-auto-detect-language.svg"],
    img[src$="fuuvo-arrow-right.svg"]
) {
    filter: brightness(0) saturate(100%) invert(69%) sepia(68%) saturate(2347%) hue-rotate(189deg) brightness(103%) contrast(102%) !important;
    opacity: 1 !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="translation"] [data-research-detail="translation"] :is(
    .language-row select,
    .transcription-language-select select,
    .detail-textarea textarea
) {
    border-color: var(--fuuvo-dark-line-strong) !important;
    background: var(--fuuvo-dark-input) !important;
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="translation"] [data-research-detail="translation"] :is(
    .language-row select,
    .transcription-language-select select,
    .detail-textarea textarea
):focus {
    border-color: var(--fuuvo-dark-blue-line) !important;
    box-shadow: 0 0 0 3px var(--fuuvo-dark-blue-soft) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="translation"] [data-research-detail="translation"] .translation-upload-zone {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-surface-soft) !important;
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="translation"] [data-research-detail="translation"] :is(.translation-upload-zone:hover, .translation-upload-zone.dragging) {
    border-color: var(--fuuvo-dark-blue) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="translation"] [data-research-detail="translation"] .translation-upload-zone strong {
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="translation"] [data-research-detail="translation"] .translation-upload-zone span,
body[data-ui-theme="dark"] #research-app[data-research-page="translation"] [data-research-detail="translation"] .detail-textarea > small,
body[data-ui-theme="dark"] #research-app[data-research-page="translation"] [data-research-detail="translation"] .transcription-format-note {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="translation"] [data-research-detail="translation"] .transcription-guide {
    border-color: var(--fuuvo-dark-line) !important;
    background: var(--fuuvo-dark-surface-raised) !important;
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="translation"] [data-research-detail="translation"] .transcription-guide strong {
    color: var(--fuuvo-dark-text) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="translation"] [data-research-detail="translation"] .transcription-guide p {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="translation"] [data-research-detail="translation"] .translation-selected-file {
    border-color: var(--fuuvo-dark-line) !important;
    background: var(--fuuvo-dark-surface-raised) !important;
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="translation"] [data-research-detail="translation"] .translation-file-icon {
    background: var(--fuuvo-dark-blue-soft) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="translation"] [data-research-detail="translation"] .translation-selected-file strong {
    color: var(--fuuvo-dark-text) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="translation"] [data-research-detail="translation"] .translation-selected-file small {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="translation"] [data-research-detail="translation"] .translation-selected-file button {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="translation"] [data-research-detail="translation"] .translation-selected-file button:hover {
    background: var(--fuuvo-dark-surface-soft) !important;
    color: var(--fuuvo-dark-text) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="translation"] [data-research-detail="translation"] .detail-option-row button {
    border-color: var(--fuuvo-dark-line-strong) !important;
    background: var(--fuuvo-dark-surface-raised) !important;
    color: var(--fuuvo-dark-text-soft) !important;
    box-shadow: none !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="translation"] [data-research-detail="translation"] .detail-option-row :is(button.active, button:hover) {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="translation"] [data-research-detail="translation"] .translation-result-head {
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="translation"] [data-research-detail="translation"] .translation-result-head strong {
    color: var(--fuuvo-dark-text) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="translation"] [data-research-detail="translation"] .translation-output,
body[data-ui-theme="dark"] #research-app[data-research-page="translation"] [data-research-detail="translation"] .translation-result-card:not(.is-empty) .translation-output {
    border-color: var(--fuuvo-dark-line) !important;
    background: var(--fuuvo-dark-surface-soft) !important;
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="translation"] [data-research-detail="translation"] .translation-output.is-empty {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="translation"] [data-research-detail="translation"] .translation-summary-grid ul {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="translation"] [data-research-detail="translation"] .translation-actions .research-outline {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-surface-raised) !important;
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="translation"] [data-research-detail="translation"] .translation-actions .research-outline:hover {
    background: var(--fuuvo-dark-blue-soft) !important;
}

body[data-ui-theme="dark"] [data-research-detail="compare"] :is(
    .source-preference button,
    .compare-tags button,
    .compare-upload-zone,
    .compare-conclusion,
    .compare-table,
    .compare-sources article,
    .research-live-result,
    .research-live-result .research-rich-output blockquote,
    .research-result-table
) {
    border-color: var(--fuuvo-dark-line) !important;
    background: var(--fuuvo-dark-surface-raised) !important;
    color: var(--fuuvo-dark-text-soft) !important;
    box-shadow: none !important;
}

body[data-ui-theme="dark"] [data-research-detail="compare"] :is(
    .source-preference button.active,
    .source-preference button:hover,
    .compare-tags button.active,
    .compare-tags button:hover
) {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] [data-research-detail="compare"] .compare-row {
    border-color: var(--fuuvo-dark-line) !important;
}

body[data-ui-theme="dark"] [data-research-detail="compare"] .compare-row.head {
    background: var(--fuuvo-dark-surface-soft) !important;
}

body[data-ui-theme="dark"] [data-research-detail="compare"] .compare-row > * {
    border-color: var(--fuuvo-dark-line) !important;
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] [data-research-detail="compare"] :is(
    .compare-row.head > *,
    .compare-row > strong,
    .compare-sources strong,
    .research-live-result .research-rich-output h4,
    .research-live-result .research-rich-output h5,
    .research-live-result .research-rich-output strong
) {
    color: var(--fuuvo-dark-text) !important;
}

body[data-ui-theme="dark"] [data-research-detail="compare"] :is(
    .compare-upload-main,
    .compare-upload-main strong,
    .compare-upload-zone > span,
    .compare-conclusion p,
    .compare-sources small,
    .compare-disclaimer,
    .detail-form-note,
    .research-live-result .research-rich-output,
    .research-live-result .research-rich-output p,
    .research-live-result .research-rich-output li,
    .research-live-result .research-rich-output em
) {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] [data-research-detail="compare"] .research-live-result > h3,
body[data-ui-theme="dark"] [data-research-detail="compare"] .compare-sources a {
    color: #8fc0ff !important;
}

body[data-ui-theme="dark"] [data-research-detail="compare"] :is(.compare-upload-zone:hover, .compare-upload-zone.dragging) {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
}

body[data-ui-theme="dark"] :is(.chat-bubble.assistant, .chat-bubble.system) .chat-markdown :is(h1, h2, h3, h4, h5, h6, strong, b, th) {
    color: var(--fuuvo-dark-text) !important;
}

body[data-ui-theme="dark"] :is(.chat-bubble.assistant, .chat-bubble.system) .chat-markdown a {
    color: #8bbcff !important;
}

body[data-ui-theme="dark"] :is(.chat-bubble.assistant, .chat-bubble.system) .chat-markdown code {
    color: #e5edfb !important;
    background: rgba(148, 163, 184, .13) !important;
}

body[data-ui-theme="dark"] :is(.chat-bubble.assistant, .chat-bubble.system) .chat-markdown .table-scroll {
    border-color: var(--fuuvo-dark-line) !important;
    background: var(--fuuvo-dark-surface-raised) !important;
}

body[data-ui-theme="dark"] :is(.chat-bubble.assistant, .chat-bubble.system) .chat-markdown th {
    background: #1a2637 !important;
}

body[data-ui-theme="dark"] :is(.chat-bubble.assistant, .chat-bubble.system) .chat-markdown :is(th, td) {
    border-color: rgba(148, 163, 184, .14) !important;
}

body[data-ui-theme="dark"] :is(.chat-media-card, .chat-attach-card, .asset-card) {
    border-color: var(--fuuvo-dark-line) !important;
    background: var(--fuuvo-dark-surface) !important;
    box-shadow: none !important;
}

body[data-ui-theme="dark"] :is(.chat-media-thumb.is-file, .chat-attach-thumb.is-file, .asset-preview.is-file) {
    background: #111b2a !important;
}

body[data-ui-theme="dark"] :is(.chat-media-thumb, .chat-attach-thumb, .asset-preview) .chat-file-card {
    border-color: var(--fuuvo-dark-line) !important;
    background: var(--fuuvo-dark-surface-raised) !important;
}

body[data-ui-theme="dark"] :is(.chat-media-thumb, .chat-attach-thumb, .asset-preview) .chat-file-name {
    color: var(--fuuvo-dark-text) !important;
}

body[data-ui-theme="dark"] :is(.chat-media-thumb, .chat-attach-thumb, .asset-preview) .chat-file-desc,
body[data-ui-theme="dark"] .chat-media-note {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] :is(.chat-media-actions, .asset-result-actions) :is(a, button) {
    border-color: var(--fuuvo-dark-line-strong) !important;
    color: var(--fuuvo-dark-text-soft) !important;
    background: var(--fuuvo-dark-input) !important;
}

body[data-ui-theme="dark"] :is(.chat-media-actions, .asset-result-actions) :is(a, button):hover {
    border-color: var(--fuuvo-dark-blue-line) !important;
    color: #9dc7ff !important;
    background: var(--fuuvo-dark-blue-soft) !important;
}

body[data-ui-theme="dark"] :is(.mobile-sheet, .mobile-account-sheet, .mobile-composer-sheet, .mobile-chat-more-sheet) {
    border-color: var(--fuuvo-dark-line-strong) !important;
    background: var(--fuuvo-dark-surface-raised) !important;
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] :is(.mobile-sheet, .mobile-account-sheet, .mobile-composer-sheet, .mobile-chat-more-sheet) :is(.btn.secondary, button.secondary) {
    border-color: var(--fuuvo-dark-line-strong) !important;
    background: var(--fuuvo-dark-input) !important;
    color: var(--fuuvo-dark-text-soft) !important;
}

/* Shared surfaces used by creation, research, analysis, food, fortune and office. */
body[data-ui-theme="dark"] :is(.creation-main, .analysis-main, .food-main, .fortune-main, .office-main, .portal-main, .feature-shell .main) {
    color: var(--fuuvo-dark-text-soft);
}

body[data-ui-theme="dark"] .pricing-main {
    color: var(--fuuvo-dark-text-soft);
}

body[data-ui-theme="dark"] .pricing-heading :is(h1, p) {
    color: var(--fuuvo-dark-text) !important;
}

body[data-ui-theme="dark"] .pricing-heading p {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] .pricing-card {
    border-color: var(--fuuvo-dark-line) !important;
    background: var(--fuuvo-dark-surface) !important;
    color: var(--fuuvo-dark-text-soft) !important;
    box-shadow: none !important;
}

body[data-ui-theme="dark"] .pricing-card.featured {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: linear-gradient(145deg, #1b2737, #1a222e) !important;
}

body[data-ui-theme="dark"] .pricing-card :is(h2, p, li) {
    color: inherit !important;
}

body[data-ui-theme="dark"] .pricing-card :is(a, span.action) {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: transparent !important;
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] .pricing-card.featured a {
    background: #2d78e8 !important;
    color: #fff !important;
}

body[data-ui-theme="dark"] :is(.creation-heading, .research-home-heading, .research-detail-title, .analysis-heading, .food-heading, .fortune-hero, .office-heading) h1,
body[data-ui-theme="dark"] :is(.creation-main, .analysis-main, .food-main, .fortune-main, .office-main) :is(h2, h3, strong) {
    color: var(--fuuvo-dark-text) !important;
}

body[data-ui-theme="dark"] :is(.creation-heading, .research-home-heading, .research-detail-title, .analysis-heading, .food-heading, .fortune-hero, .office-heading) p,
body[data-ui-theme="dark"] :is(.creation-main, .analysis-main, .food-main, .fortune-main, .office-main) :is(small, .muted) {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="video"] :is(
    .detail-label,
    .detail-advanced,
    .detail-advanced summary,
    .detail-advanced label
) {
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="video"] .detail-dropzone {
    border-color: var(--fuuvo-dark-line-strong) !important;
    background: var(--fuuvo-dark-surface-soft) !important;
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="video"] .detail-dropzone strong {
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="video"] .detail-dropzone small {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="video"] :is(.detail-dropzone:hover, .detail-dropzone:focus-within) {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="video"] .detail-dropzone.has-file {
    border-color: rgba(98, 214, 167, .42) !important;
    background: rgba(98, 214, 167, .1) !important;
    color: var(--fuuvo-dark-success) !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="video"] .detail-dropzone.has-file strong {
    color: var(--fuuvo-dark-success) !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="poster"] .detail-label {
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="poster"] .detail-breadcrumb :is(a, span),
body[data-ui-theme="dark"] #creation-app[data-creation-page="poster"] .detail-rights-note {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="poster"] .detail-breadcrumb .back:hover {
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="poster"] .poster-upload {
    border-color: var(--fuuvo-dark-line-strong) !important;
    background: var(--fuuvo-dark-surface-soft) !important;
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="poster"] .poster-upload strong {
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="poster"] .poster-upload small,
body[data-ui-theme="dark"] #creation-app[data-creation-page="poster"] :is(.poster-option, .poster-style):not(.active) {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="poster"] :is(.poster-upload:hover, .poster-upload:focus-within) {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="poster"] :is(.poster-option, .poster-style) {
    border-color: var(--fuuvo-dark-line-strong) !important;
    background: var(--fuuvo-dark-surface-raised) !important;
    box-shadow: none !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="poster"] :is(
    .poster-option:hover,
    .poster-option.active,
    .poster-style:hover,
    .poster-style.active
) {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
    color: var(--fuuvo-dark-blue) !important;
    box-shadow: inset 0 0 0 1px var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="poster"] :is(
    .poster-option:hover,
    .poster-option.active,
    .poster-style:hover,
    .poster-style.active
) strong {
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="poster"] :is(
    .poster-upload,
    .poster-option,
    .poster-style,
    .detail-result-actions
) img.fuuvo-detail-icon {
    filter: brightness(0) saturate(100%) invert(69%) sepia(68%) saturate(2347%) hue-rotate(189deg) brightness(103%) contrast(102%) !important;
    opacity: 1 !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="poster"] .detail-submit img.fuuvo-detail-icon {
    filter: brightness(0) invert(1) !important;
    opacity: 1 !important;
}

/* Creation icons are authored in a dark navy that loses contrast on dark
   surfaces. Normalize every semantic creation icon to the same bright blue
   used by interactive text, including inactive options and empty states. */
body[data-ui-theme="dark"] #creation-app img.fuuvo-detail-icon,
body[data-ui-theme="dark"] #creation-app img.creation-inline-icon {
    filter: brightness(0) saturate(100%) invert(69%) sepia(68%) saturate(2347%) hue-rotate(189deg) brightness(112%) contrast(105%) !important;
    opacity: 1 !important;
}

/* Icons inside solid primary actions should stay white for maximum contrast. */
body[data-ui-theme="dark"] #creation-app :is(.creation-primary, .detail-submit) img.fuuvo-detail-icon,
body[data-ui-theme="dark"] #creation-app :is(.creation-primary, .detail-submit) img.creation-inline-icon {
    filter: brightness(0) invert(1) !important;
    opacity: 1 !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="project"] :is(.project-field, .detail-label) {
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="project"] :is(
    .detail-breadcrumb a,
    .detail-breadcrumb span,
    .project-ai-section-head p,
    .project-field > small,
    .project-rights-note,
    .project-ai-brief-card > p,
    .project-live-brief dt
) {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="project"] .detail-breadcrumb .back:hover {
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="project"] .project-ai-section-head > span {
    background: var(--fuuvo-dark-blue-soft) !important;
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="project"] .project-ai-divider {
    background: var(--fuuvo-dark-line) !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="project"] .project-assets-dropzone {
    border-color: var(--fuuvo-dark-line-strong) !important;
    background: var(--fuuvo-dark-surface-soft) !important;
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="project"] .project-assets-dropzone strong {
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="project"] .project-assets-dropzone small {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="project"] :is(.project-assets-dropzone:hover, .project-assets-dropzone:focus-within) {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="project"] .project-visual-option {
    border-color: var(--fuuvo-dark-line-strong) !important;
    background: var(--fuuvo-dark-surface-raised) !important;
    color: var(--fuuvo-dark-text-soft) !important;
    box-shadow: none !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="project"] .project-visual-option strong {
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="project"] .project-visual-option small {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="project"] :is(.project-visual-option:hover, .project-visual-option.active) {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
    color: var(--fuuvo-dark-blue) !important;
    box-shadow: inset 0 0 0 1px var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="project"] :is(.project-visual-option:hover, .project-visual-option.active) strong {
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="project"] :is(.project-visual-option > img, .project-assets-dropzone > img) {
    filter: brightness(0) saturate(100%) invert(69%) sepia(68%) saturate(2347%) hue-rotate(189deg) brightness(103%) contrast(102%) !important;
    opacity: 1 !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="project"] .project-ratio-grid .detail-option {
    border-color: var(--fuuvo-dark-line-strong) !important;
    background: var(--fuuvo-dark-surface-raised) !important;
    color: var(--fuuvo-dark-text-soft) !important;
    box-shadow: none !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="project"] .project-ratio-grid :is(.detail-option:hover, .detail-option.active) {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
    color: var(--fuuvo-dark-blue) !important;
    box-shadow: inset 0 0 0 1px var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="project"] .project-ai-brief-icon {
    border: 1px solid var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="project"] .project-live-brief > div {
    border-color: var(--fuuvo-dark-line) !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="project"] .project-live-brief dd {
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="project"] .project-ai-process {
    border: 1px solid var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="project"] .project-ai-process strong {
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="edit-image"] .detail-label {
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="edit-image"] .detail-breadcrumb :is(a, span),
body[data-ui-theme="dark"] #creation-app[data-creation-page="edit-image"] .detail-rights-note {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="edit-image"] .detail-breadcrumb .back:hover {
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="edit-image"] .title-info {
    border-color: var(--fuuvo-dark-line-strong) !important;
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="image"] .upload-box:hover,
body[data-ui-theme="dark"] #creation-app[data-creation-page="image"] .upload-box:focus-within {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="image"] .settings-panel .setting-option:hover,
body[data-ui-theme="dark"] #creation-app[data-creation-page="image"] .settings-panel .setting-option.active {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
    color: var(--fuuvo-dark-blue) !important;
    box-shadow: inset 0 0 0 1px var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] #creation-app[data-creation-page="image"] .settings-panel .setting-option[data-setting="ratio"]::before,
body[data-ui-theme="dark"] #creation-app[data-creation-page="image"] .settings-panel .setting-option[data-setting="style"]::before,
body[data-ui-theme="dark"] #creation-app[data-creation-page="image"] .image-form .creation-pills .creation-pill::before {
    filter: brightness(0) saturate(100%) invert(69%) sepia(68%) saturate(2347%) hue-rotate(189deg) brightness(103%) contrast(102%) !important;
    opacity: 1 !important;
}

body[data-ui-theme="dark"] :is(.creation-main, .analysis-main, .food-main, .fortune-main, .office-main) :is(input, textarea, select) {
    border-color: var(--fuuvo-dark-line-strong) !important;
    background: var(--fuuvo-dark-input) !important;
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] :is(
    .creation-visual-card, .work-card, .voice-card, .reference-card, .setting-option,
    .project-asset, .brand-panel, .team-panel, .result-variant, .creation-detail-card, .detail-option,
    .poster-option, .poster-style, .edit-tool-row button, .compare-handle,
    .research-tool-card, .research-panel, .research-detail-card, .detail-chip-row button, .detail-option-row button,
    .transcription-guide, .translation-selected-file, .translation-file-icon,
    .analysis-upload-drop, .analysis-prompt, .analysis-quick-pills button, .analysis-panel, .analysis-card,
    .food-location-panel, .food-location-current, .food-location-input, .food-filter, .food-quick-card,
    .food-method-panel, .food-method-panel button, .food-refine-panel, .food-refine-panel > button,
    .food-before-panel, .food-suggestion, .food-info-panel, .food-restaurant-card, .food-continue-card,
    .fortune-entry, .fortune-methods, .fortune-explain, .fortune-panel, .fortune-choice, .animal-choice, .fortune-topic-grid button,
    .fortune-keywords, .fortune-reading-grid article, .fortune-question-strip, .fortune-action-strip,
    .fortune-continue, .inspiration-card, .fortune-inspiration-side > a,
    .office-workflow-card, .office-recent-card, .office-outline-button, .office-search-dialog
) {
    border-color: var(--fuuvo-dark-line) !important;
    background: var(--fuuvo-dark-surface) !important;
    color: var(--fuuvo-dark-text-soft) !important;
    box-shadow: none !important;
}

body[data-ui-theme="dark"] :is(
    .learning-panel, .learning-help-card, .learning-tool, .learning-mode,
    .analysis-side, .analysis-method, .analysis-file, .analysis-finding,
    .conclusion-panel, .research-result-card, .source-panel, .operation-panel, .source-item
) {
    border-color: var(--fuuvo-dark-line) !important;
    background: var(--fuuvo-dark-surface) !important;
    color: var(--fuuvo-dark-text-soft) !important;
    box-shadow: none !important;
}

body[data-ui-theme="dark"] :is(.analysis-method.active, .learning-mode.active, .research-variant.active) {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] .fortune-depth-options button {
    border-color: var(--fuuvo-dark-line) !important;
    background: var(--fuuvo-dark-surface) !important;
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] .fortune-depth-options button.active {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue) !important;
    color: #fff !important;
}

body[data-ui-theme="dark"] .fortune-depth-options button.is-premium-locked:disabled {
    border-color: var(--fuuvo-dark-line) !important;
    background: var(--fuuvo-dark-surface-soft) !important;
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] .fortune-depth-note {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] :is(.analysis-side, .conclusion-panel, .source-panel, .operation-panel, .research-result-card) :is(h2, h3, strong, p, li, span) {
    color: inherit !important;
}

body[data-ui-theme="dark"] .research-result-card.inference {
    border-color: rgba(167, 139, 250, .35) !important;
    background: #211f31 !important;
}

body[data-ui-theme="dark"] .research-result-card.verify {
    border-color: var(--fuuvo-dark-warning-line) !important;
    background: var(--fuuvo-dark-warning-bg) !important;
}

body[data-ui-theme="dark"] :is(.creation-outline, .creation-pill, .research-outline, .food-location-current, .office-outline-button) {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: transparent !important;
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] #research-app .research-breadcrumb,
body[data-ui-theme="dark"] #research-app .research-detail-breadcrumb,
body[data-ui-theme="dark"] #research-app .research-breadcrumb > a,
body[data-ui-theme="dark"] #research-app .research-detail-breadcrumb > a {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] #research-app .research-breadcrumb > .research-breadcrumb-current,
body[data-ui-theme="dark"] #research-app .research-detail-breadcrumb > .research-breadcrumb-current {
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="result"] #export-research,
body[data-ui-theme="dark"] #research-app[data-research-page="result"] .research-history-link {
    color: #fff !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="learning"] :is(
    .learning-answer-input img,
    img[src$="fuuvo-exam-practice.svg"]
) {
    filter: brightness(0) saturate(100%) invert(69%) sepia(68%) saturate(2347%) hue-rotate(189deg) brightness(103%) contrast(102%) !important;
    opacity: 1 !important;
}

body[data-ui-theme="dark"] .analysis-quick-pills button.active {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
    color: #fff !important;
    box-shadow: inset 0 0 0 1px var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="learning"] :is(
    .learning-summary,
    .learning-steps-block,
    .learning-practice
) {
    border-color: var(--fuuvo-dark-line) !important;
    background: var(--fuuvo-dark-surface-raised) !important;
    color: var(--fuuvo-dark-text-soft) !important;
    box-shadow: none !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="learning"] :is(
    .learning-summary header,
    .learning-steps-block > header,
    .learning-practice header,
    .learning-concept header,
    .learning-final-answer header,
    .learning-step-line strong,
    .learning-practice label,
    .learning-result-empty strong
) {
    color: var(--fuuvo-dark-text) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="learning"] :is(
    .learning-summary p,
    .learning-step-line,
    .learning-concept ul,
    .learning-practice p,
    .learning-result-empty,
    .learning-result-empty p,
    .learning-think-note,
    .learning-summary header small,
    .optional-label
) {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="learning"] .learning-summary .learning-question-text {
    background: var(--fuuvo-dark-input) !important;
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="learning"] .learning-step-line + .learning-step-line {
    border-top-color: var(--fuuvo-dark-line) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="learning"] :is(.learning-step-line code, .learning-step-formula) {
    border: 1px solid var(--fuuvo-dark-line) !important;
    background: var(--fuuvo-dark-input) !important;
    color: #b8d4ff !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="learning"] .learning-concept {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="learning"] .learning-final-answer {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="learning"] .learning-final-answer > div {
    color: #c8ddff !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="learning"] .learning-practice .learning-answer-input input {
    border-color: var(--fuuvo-dark-line-strong) !important;
    background: var(--fuuvo-dark-input) !important;
    color: var(--fuuvo-dark-text-soft) !important;
    caret-color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] #research-app[data-research-page="learning"] .learning-practice .learning-answer-input input::placeholder {
    color: var(--fuuvo-dark-muted) !important;
    opacity: .8;
}

body[data-ui-theme="dark"] #research-app[data-research-page="learning"] .learning-think-note {
    border-top-color: var(--fuuvo-dark-line) !important;
    background: var(--fuuvo-dark-surface-soft) !important;
}

body[data-ui-theme="dark"] .creation-category-tabs a {
    border-color: var(--fuuvo-dark-line-strong) !important;
    background: var(--fuuvo-dark-surface) !important;
    color: var(--fuuvo-dark-text-soft) !important;
    box-shadow: none !important;
}

body[data-ui-theme="dark"] .quota-box {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] .creation-category-tabs a:hover,
body[data-ui-theme="dark"] .creation-category-tabs a.active {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] .creation-app-entry {
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] .writing-card {
    background: transparent !important;
    color: var(--fuuvo-dark-text-soft) !important;
    box-shadow: none !important;
}

body[data-ui-theme="dark"] .creation-app-entry:hover {
    background: var(--fuuvo-dark-surface-soft) !important;
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] :is(.creation-visual-card, .work-card, .writing-card, .research-tool-card, .food-filter, .food-quick-card, .fortune-entry, .animal-choice, .office-workflow-card):hover {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-surface-soft) !important;
}

body[data-ui-theme="dark"] .animal-choice.active {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
    color: var(--fuuvo-dark-text) !important;
}

/* The zodiac PNGs use a white canvas and blue artwork. In light mode the
 * canvas is hidden with multiply; on a dark surface that also darkens the
 * artwork. Invert the canvas to black and use screen blending so only a clear
 * light symbol remains visible. */
body[data-ui-theme="dark"] #fortune-app[data-page="zodiac"] .fortune-choice img {
    mix-blend-mode: screen !important;
    filter: invert(1) grayscale(1) brightness(2.15) !important;
    opacity: .96;
}

body[data-ui-theme="dark"] #fortune-app[data-page="zodiac"] .fortune-choice:hover,
body[data-ui-theme="dark"] #fortune-app[data-page="zodiac"] .fortune-choice.active {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
    color: var(--fuuvo-dark-text) !important;
    box-shadow: inset 0 0 0 1px var(--fuuvo-dark-blue-line) !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="zodiac"] .fortune-choice strong,
body[data-ui-theme="dark"] #fortune-app[data-page="zodiac"] .fortune-setup > h2,
body[data-ui-theme="dark"] #fortune-app[data-page="zodiac"] .fortune-setup > h3,
body[data-ui-theme="dark"] #fortune-app[data-page="zodiac"] .fortune-side-info h2,
body[data-ui-theme="dark"] #fortune-app[data-page="zodiac"] .fortune-side-info strong {
    color: var(--fuuvo-dark-text) !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="zodiac"] .fortune-choice small,
body[data-ui-theme="dark"] #fortune-app[data-page="zodiac"] .fortune-helper,
body[data-ui-theme="dark"] #fortune-app[data-page="zodiac"] .fortune-side-info span,
body[data-ui-theme="dark"] #fortune-app[data-page="zodiac"] .fortune-breadcrumb,
body[data-ui-theme="dark"] #fortune-app[data-page="zodiac"] .fortune-breadcrumb a,
body[data-ui-theme="dark"] #fortune-app[data-page="zodiac"] .fortune-disclaimer {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="zodiac"] .fortune-segments button {
    border-color: var(--fuuvo-dark-line-strong) !important;
    background: var(--fuuvo-dark-surface-raised) !important;
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="zodiac"] .fortune-segments button.active {
    border-color: #2d78e8 !important;
    background: #2d78e8 !important;
    color: #fff !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="chinese-zodiac"] .fortune-segments button {
    border-color: var(--fuuvo-dark-line-strong) !important;
    background: var(--fuuvo-dark-surface-raised) !important;
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="chinese-zodiac"] .fortune-segments button.active {
    border-color: #2d78e8 !important;
    background: #2d78e8 !important;
    color: #fff !important;
}

body[data-ui-theme="dark"] #fortune-app:is([data-page="zodiac-result"], [data-page="chinese-zodiac-result"]) .fortune-result-toolbar .fortune-segments button {
    border-color: var(--fuuvo-dark-line-strong) !important;
    background: var(--fuuvo-dark-surface-raised) !important;
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] #fortune-app:is([data-page="zodiac-result"], [data-page="chinese-zodiac-result"]) .fortune-result-toolbar .fortune-segments button.active {
    border-color: #2d78e8 !important;
    background: #2d78e8 !important;
    color: #fff !important;
}

body[data-ui-theme="dark"] #fortune-app:is(
    [data-page="zodiac-result"],
    [data-page="chinese-zodiac-result"],
    [data-page="name-result"],
    [data-page="relationship-result"],
    [data-page="birth-result"],
    [data-page="inspiration"]
) .fortune-side-disclaimer > svg {
    color: var(--fortune-result-icon) !important;
    opacity: 1 !important;
    filter: none !important;
}

body[data-ui-theme="dark"] #fortune-app:is(
    [data-page="zodiac-result"],
    [data-page="chinese-zodiac-result"],
    [data-page="name-result"],
    [data-page="relationship-result"],
    [data-page="birth-result"],
    [data-page="inspiration"]
) {
    --fortune-result-icon: #78adf7;
}

body[data-ui-theme="dark"] #fortune-app:is(
    [data-page="zodiac-result"],
    [data-page="chinese-zodiac-result"],
    [data-page="name-result"],
    [data-page="relationship-result"],
    [data-page="birth-result"]
) :is(
    .fortune-question-strip > svg,
    .fortune-action-strip > svg,
    .fortune-continue > a > svg,
    .fortune-side-disclaimer > svg
) {
    color: var(--fortune-result-icon) !important;
    filter: none !important;
    opacity: 1 !important;
}

body[data-ui-theme="dark"] #fortune-app:is(
    [data-page="zodiac-result"],
    [data-page="chinese-zodiac-result"],
    [data-page="name-result"],
    [data-page="relationship-result"],
    [data-page="birth-result"]
) .fortune-mini-chat button {
    border-color: #8bbaff !important;
    background: var(--fortune-result-icon) !important;
    color: #fff !important;
    box-shadow: 0 5px 16px rgba(75, 139, 229, .24) !important;
}

body[data-ui-theme="dark"] #fortune-app:is(
    [data-page="zodiac-result"],
    [data-page="chinese-zodiac-result"],
    [data-page="name-result"],
    [data-page="relationship-result"],
    [data-page="birth-result"],
    [data-page="inspiration"]
) .fortune-side-disclaimer > img.fortune-design-icon {
    opacity: 1 !important;
    filter: brightness(0) saturate(100%) invert(80%) sepia(20%) saturate(1520%) hue-rotate(181deg) brightness(103%) contrast(101%) drop-shadow(0 0 6px rgba(107, 168, 255, .2)) !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="inspiration"] .inspiration-actions button {
    border-color: var(--fuuvo-dark-line-strong) !important;
    background: var(--fuuvo-dark-surface-raised) !important;
    color: var(--fuuvo-dark-text-soft) !important;
    box-shadow: none !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="inspiration"] .inspiration-actions button:hover,
body[data-ui-theme="dark"] #fortune-app[data-page="inspiration"] .inspiration-actions button:focus-visible {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
    color: #b8d4ff !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="inspiration"] .inspiration-actions button:active {
    background: rgba(45, 120, 232, .2) !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="birth"] .fortune-calendar-switch button {
    border-color: var(--fuuvo-dark-line-strong) !important;
    background: var(--fuuvo-dark-surface-raised) !important;
    color: var(--fuuvo-dark-text-soft) !important;
    box-shadow: none !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="birth"] .fortune-calendar-switch button.active {
    border-color: #2d78e8 !important;
    background: #2d78e8 !important;
    color: #fff !important;
    box-shadow: none !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="birth"] .fortune-calendar-switch button svg,
body[data-ui-theme="dark"] #fortune-app[data-page="birth"] .fortune-calendar-switch button img {
    color: currentColor !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="birth"] .fortune-calendar-switch button img {
    opacity: 1 !important;
    filter: brightness(0) saturate(100%) invert(80%) sepia(20%) saturate(1520%) hue-rotate(181deg) brightness(103%) contrast(101%) !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="birth"] .fortune-calendar-switch button.active img {
    filter: brightness(0) invert(1) !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="birth"] .fortune-note {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-surface-soft) !important;
    color: var(--fuuvo-dark-muted) !important;
    box-shadow: none !important;
}

body[data-ui-theme="dark"] #fortune-app:is([data-page="zodiac-result"], [data-page="chinese-zodiac-result"]) .fortune-keywords h2,
body[data-ui-theme="dark"] #fortune-app:is([data-page="zodiac-result"], [data-page="chinese-zodiac-result"]) .fortune-reading-grid h3,
body[data-ui-theme="dark"] #fortune-app:is([data-page="zodiac-result"], [data-page="chinese-zodiac-result"]) .fortune-question-strip h3 {
    color: #f8fafc !important;
    -webkit-text-fill-color: currentColor !important;
}

body[data-ui-theme="dark"] #fortune-app:is([data-page="zodiac-result"], [data-page="chinese-zodiac-result"]) .fortune-reading-grid p {
    color: #dce4ef !important;
    -webkit-text-fill-color: currentColor !important;
}

body[data-ui-theme="dark"] #fortune-app:is([data-page="zodiac-result"], [data-page="chinese-zodiac-result"]) :is(.fortune-keywords, .fortune-question-strip) p {
    color: #cbd6e5 !important;
    -webkit-text-fill-color: currentColor !important;
}

body[data-ui-theme="dark"] #fortune-app:is([data-page="zodiac-result"], [data-page="chinese-zodiac-result"]) .fortune-reading-grid article > svg {
    color: #8fc1ff !important;
    opacity: 1 !important;
    filter: drop-shadow(0 0 6px rgba(107, 168, 255, .24));
}

body[data-ui-theme="dark"] #fortune-app:is([data-page="zodiac-result"], [data-page="chinese-zodiac-result"]) .fortune-reading-grid article > img.fortune-design-icon {
    opacity: 1 !important;
    filter: brightness(0) saturate(100%) invert(80%) sepia(20%) saturate(1520%) hue-rotate(181deg) brightness(103%) contrast(101%) drop-shadow(0 0 6px rgba(107, 168, 255, .24)) !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="name-result"] :is(.fortune-keywords h2, .fortune-reading-grid h3, .fortune-question-strip h3) {
    color: #f8fafc !important;
    -webkit-text-fill-color: currentColor !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="name-result"] .fortune-reading-grid p {
    color: #dce4ef !important;
    -webkit-text-fill-color: currentColor !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="name-result"] :is(.fortune-keywords, .fortune-question-strip) p {
    color: #cbd6e5 !important;
    -webkit-text-fill-color: currentColor !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="name-result"] .fortune-breadcrumb,
body[data-ui-theme="dark"] #fortune-app[data-page="name-result"] .fortune-breadcrumb :is(a, span) {
    color: #aebdd1 !important;
    -webkit-text-fill-color: currentColor !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="name-result"] .fortune-breadcrumb a:hover {
    color: #b8d4ff !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="name-result"] .pinyin {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
    color: #9bc7ff !important;
    -webkit-text-fill-color: currentColor !important;
    box-shadow: inset 0 0 0 1px rgba(107, 168, 255, .08) !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="name-result"] .fortune-reading-title :is(svg, img.fortune-design-icon),
body[data-ui-theme="dark"] #fortune-app[data-page="name-result"] .fortune-question-strip > :is(svg, img.fortune-design-icon) {
    color: #8fc1ff !important;
    opacity: 1 !important;
    filter: brightness(0) saturate(100%) invert(80%) sepia(20%) saturate(1520%) hue-rotate(181deg) brightness(103%) contrast(101%) drop-shadow(0 0 6px rgba(107, 168, 255, .2)) !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="relationship-result"] :is(
    .fortune-keywords h2,
    .relationship-reading h3,
    .fortune-action-strip h3,
    .fortune-continue h2
) {
    color: #f8fafc !important;
    -webkit-text-fill-color: currentColor !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="relationship-result"] :is(
    .fortune-keywords p,
    .relationship-reading p,
    .fortune-action-strip p,
    .fortune-side-disclaimer p
) {
    color: #dce4ef !important;
    -webkit-text-fill-color: currentColor !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="relationship-result"] .relationship-reading .mini-question {
    border-color: var(--fuuvo-dark-line-strong) !important;
    background: var(--fuuvo-dark-input) !important;
    color: #dce4ef !important;
    -webkit-text-fill-color: currentColor !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="relationship-result"] .relationship-reading blockquote {
    border: 1px solid var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-surface-soft) !important;
    color: #d7e6ff !important;
    -webkit-text-fill-color: currentColor !important;
    box-shadow: inset 0 0 0 1px rgba(107, 168, 255, .06) !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="relationship-result"] .relationship-reading .large-center {
    color: #9bc7ff !important;
    -webkit-text-fill-color: currentColor !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="relationship-result"] .fortune-continue > a {
    border-color: var(--fuuvo-dark-line-strong) !important;
    background: var(--fuuvo-dark-input) !important;
    color: var(--fuuvo-dark-text-soft) !important;
    -webkit-text-fill-color: currentColor !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="relationship-result"] .fortune-continue > a:hover {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
    color: #b8d4ff !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="relationship-result"] :is(
    .relationship-reading article > svg,
    .fortune-action-strip > svg,
    .fortune-continue > a > svg
) {
    color: var(--fortune-result-icon) !important;
    opacity: 1 !important;
    filter: none !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="relationship-result"] :is(
    .relationship-reading article > img.fortune-design-icon,
    .fortune-action-strip > img.fortune-design-icon,
    .fortune-continue > a > img.fortune-design-icon,
    .fortune-side-disclaimer > img.fortune-design-icon
) {
    opacity: 1 !important;
    filter: brightness(0) saturate(100%) invert(80%) sepia(20%) saturate(1520%) hue-rotate(181deg) brightness(103%) contrast(101%) drop-shadow(0 0 6px rgba(107, 168, 255, .2)) !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="zodiac"] .fortune-topic-grid button:hover,
body[data-ui-theme="dark"] #fortune-app[data-page="zodiac"] .fortune-topic-grid button.active {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
    color: var(--fuuvo-dark-text-soft) !important;
    box-shadow: inset 0 0 0 1px var(--fuuvo-dark-blue-line) !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="zodiac"] .fortune-topic-grid button:hover svg,
body[data-ui-theme="dark"] #fortune-app[data-page="zodiac"] .fortune-topic-grid button.active svg,
body[data-ui-theme="dark"] #fortune-app[data-page="zodiac"] .fortune-side-info > div > svg {
    color: #9bc7ff !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="zodiac"] .fortune-side-info > div,
body[data-ui-theme="dark"] #fortune-app[data-page="zodiac"] .fortune-side-info > a {
    border-color: var(--fuuvo-dark-line) !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="zodiac"] .fortune-side-info > a {
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="zodiac"] .fortune-side-info > a:hover,
body[data-ui-theme="dark"] #fortune-app[data-page="zodiac"] .fortune-breadcrumb a:hover {
    color: #b8d4ff !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="chinese-zodiac"] .fortune-topic-grid .fortune-design-icon {
    filter: brightness(0) saturate(100%) invert(80%) sepia(20%) saturate(1520%) hue-rotate(181deg) brightness(103%) contrast(101%) !important;
    opacity: .98;
}

body[data-ui-theme="dark"] #fortune-app[data-page="relationship"] .relationship-topics .fortune-design-icon {
    filter: brightness(0) saturate(100%) invert(37%) sepia(95%) saturate(4215%) hue-rotate(208deg) brightness(99%) contrast(98%) !important;
    opacity: 1;
}

body[data-ui-theme="dark"] #fortune-app[data-page="relationship"] .fortune-side-info > div > .fortune-design-icon {
    filter: brightness(0) saturate(100%) invert(80%) sepia(20%) saturate(1520%) hue-rotate(181deg) brightness(103%) contrast(101%) !important;
    opacity: 1;
}

body[data-ui-theme="dark"] #fortune-app[data-page="relationship"] .fortune-note {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-surface-soft) !important;
    color: #cbd6e5 !important;
    -webkit-text-fill-color: currentColor !important;
    box-shadow: none !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="name"] .fortune-side-info > div > svg {
    box-sizing: border-box;
    padding: 7px;
    border: 1px solid var(--fuuvo-dark-blue-line);
    border-radius: 11px;
    background: var(--fuuvo-dark-blue-soft);
    color: #d7e6ff !important;
    stroke-width: 2.35;
}

body[data-ui-theme="dark"] #fortune-app[data-page="name"] .fortune-side-info > div > .fortune-design-icon {
    filter: brightness(0) saturate(100%) invert(37%) sepia(95%) saturate(4215%) hue-rotate(208deg) brightness(99%) contrast(98%) !important;
    opacity: 1;
}

body[data-ui-theme="dark"] #fortune-app[data-page="name"] .fortune-side-info > div {
    border-color: var(--fuuvo-dark-line) !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="name"] .fortune-side-info h2,
body[data-ui-theme="dark"] #fortune-app[data-page="name"] .fortune-side-info strong,
body[data-ui-theme="dark"] #fortune-app[data-page="name"] .fortune-step h2,
body[data-ui-theme="dark"] #fortune-app[data-page="name"] .fortune-setup > h3 {
    color: var(--fuuvo-dark-text) !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="name"] .fortune-inline-help,
body[data-ui-theme="dark"] #fortune-app[data-page="name"] .fortune-side-info span,
body[data-ui-theme="dark"] #fortune-app[data-page="name"] .fortune-breadcrumb,
body[data-ui-theme="dark"] #fortune-app[data-page="name"] .fortune-breadcrumb a,
body[data-ui-theme="dark"] #fortune-app[data-page="name"] .fortune-disclaimer {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="name"] .fortune-inline-help button {
    border-color: var(--fuuvo-dark-line-strong) !important;
    background: var(--fuuvo-dark-surface-raised) !important;
    color: var(--fuuvo-dark-text-soft) !important;
    box-shadow: none !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="name"] .fortune-inline-help button:hover {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
    color: #d7e6ff !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="name"] .fortune-note {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-surface-soft) !important;
    color: var(--fuuvo-dark-muted) !important;
    box-shadow: none !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="name"] .fortune-side-info > a {
    border-color: var(--fuuvo-dark-line) !important;
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] #fortune-app[data-page="name"] .fortune-side-info > a:hover,
body[data-ui-theme="dark"] #fortune-app[data-page="name"] .fortune-breadcrumb a:hover {
    color: #b8d4ff !important;
}

body[data-ui-theme="dark"] :is(.creation-search-dialog, .office-search-dialog) {
    border-color: var(--fuuvo-dark-line-strong) !important;
    background: var(--fuuvo-dark-surface-raised) !important;
    color: var(--fuuvo-dark-text-soft) !important;
    box-shadow: 0 24px 70px rgba(0, 0, 0, .42) !important;
}

body[data-ui-theme="dark"] :is(.creation-search-results, #creation-search-results, .office-search-results) a:hover {
    background: rgba(255, 255, 255, .06) !important;
}

body[data-ui-theme="dark"] :is(
    .creation-primary, .detail-submit, .analysis-primary, .research-primary,
    .office-primary-button, .food-prompt-box button, .fortune-primary,
    .portal-button.primary, .rr-primary, .ac-primary-button, .dc-primary-button
) {
    border-color: #2d78e8 !important;
    background: #2d78e8 !important;
    color: #fff !important;
}

body[data-ui-theme="dark"] :is(
    .creation-primary, .detail-submit, .analysis-primary, .research-primary,
    .office-primary-button, .food-prompt-box button, .fortune-primary,
    .portal-button.primary, .rr-primary, .ac-primary-button, .dc-primary-button
):hover {
    border-color: #3c86f2 !important;
    background: #3c86f2 !important;
}

/* Keep secondary action buttons from becoming glaring white in dark mode. */
body[data-ui-theme="dark"] :is(.portal-button:not(.warn), .outline-button, .primary-button) {
    border-color: #2d78e8 !important;
    background: #2d78e8 !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
}

body[data-ui-theme="dark"] :is(.portal-button:not(.warn), .outline-button, .primary-button):hover {
    border-color: #3c86f2 !important;
    background: #3c86f2 !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
}

body[data-ui-theme="dark"] :is(.office-start-panel, .voice-notice, .result-media-stage) {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: linear-gradient(120deg, #172333, #1b2634) !important;
}

body[data-ui-theme="dark"] .food-prompt-box {
    border-color: var(--fuuvo-dark-line-strong) !important;
    background: var(--fuuvo-dark-surface-raised) !important;
    color: var(--fuuvo-dark-text-soft) !important;
    box-shadow: 0 16px 38px rgba(0, 0, 0, .2) !important;
}

body[data-ui-theme="dark"] .food-prompt-box input {
    background: transparent !important;
}

/* Local Food: several secondary labels still carried literal light-theme
 * blue-greys, which were too dim against the dark surfaces. */
body[data-ui-theme="dark"] .food-app .food-heading p {
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] .food-app :is(
    .food-location-status,
    .food-disclaimer,
    .food-breadcrumb,
    .food-results-heading p,
    .food-suggestion p,
    .food-ai-status p,
    .food-results-load-more p,
    .food-results-bottom-tip p,
    .food-restaurant-index,
    .food-restaurant-copy p,
    .food-restaurant-fact-line b,
    .food-restaurant-fact-line span,
    .food-compare-summary p,
    .food-compare-dialog header p,
    .food-info-panel h2 small,
    .food-reference-grid small,
    .food-source-note,
    .food-action-status,
    .food-live-contact-grid small,
    .food-detail-heading p
) {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] .food-app .food-address-picker label > span {
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] .food-app :is(.food-method-panel b, .food-refine-panel b) {
    color: #9dc4ff !important;
}

body[data-ui-theme="dark"] .food-app :is(
    .food-address-picker input,
    .food-location-input input,
    .food-prompt-box input,
    .food-mini-form input
)::placeholder {
    color: var(--fuuvo-dark-muted) !important;
    opacity: 1 !important;
}

body[data-ui-theme="dark"] .food-app .food-tags span {
    border-color: var(--fuuvo-dark-line-strong) !important;
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] .food-app[data-page="results"] :is(
    .food-breadcrumb span,
    .food-results-heading p,
    .food-suggestion p,
    .food-ai-status p,
    .food-results-load-more p,
    .food-results-bottom-tip p,
    .food-restaurant-index,
    .food-restaurant-copy p,
    .food-tags span,
    .food-restaurant-fact-line b,
    .food-restaurant-fact-line span,
    .food-refine-panel > button span,
    .food-disclaimer,
    .food-compare-summary p,
    .food-compare-dialog header p,
    .food-info-panel h2 small,
    .food-reference-grid small,
    .food-source-note,
    .food-action-status,
    .food-live-contact-grid small,
    .food-detail-heading p
) {
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] .food-app[data-page="results"] .food-detail-link.is-disabled {
    color: #dce5f0 !important;
}

/* Comparison/detail layers are mounted beside .food-app, not inside it. */
body[data-ui-theme="dark"] :is(
    .food-compare-summary p,
    .food-compare-dialog header p,
    .food-info-panel h2 small,
    .food-reference-grid small,
    .food-source-note,
    .food-action-status,
    .food-live-contact-grid small,
    .food-detail-heading p
) {
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] .food-app[data-page="results"] .fuuvo-ai-disclaimer {
    color: #d8e1ed !important;
}

body[data-ui-theme="dark"] .food-app[data-page="results"] .fuuvo-ai-disclaimer :is(span, a:not(.fuuraa-site-link)) {
    color: inherit !important;
}

body[data-ui-theme="dark"] .food-app[data-page="results"] .fuuvo-ai-disclaimer a {
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] .analysis-upload-drop:hover,
body[data-ui-theme="dark"] .analysis-upload-drop.dragging {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
}

body[data-ui-theme="dark"] :is(.analysis-selected-files, .learning-question-upload) {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-surface-soft) !important;
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] .learning-question-upload > [data-upload-preview] {
    background: var(--fuuvo-dark-surface) !important;
}

body[data-ui-theme="dark"] .learning-upload-empty strong {
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] .learning-upload-file {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] :is(
    .analysis-process-panel, .analysis-process-panel article, .analysis-uploaded-file, .analysis-add-file,
    .analysis-method-option, .analysis-output-row button, .analysis-settings-side, .analysis-conclusion,
    .analysis-result-three article, .analysis-data-panel, .analysis-result-side, .analysis-outline,
    .analysis-followup
) {
    border-color: var(--fuuvo-dark-line) !important;
    background: var(--fuuvo-dark-surface) !important;
    color: var(--fuuvo-dark-text-soft) !important;
    box-shadow: none !important;
}

body[data-ui-theme="dark"] .analysis-method-option.active {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
}

body[data-ui-theme="dark"] #analysis-app[data-page="setup"] :is(.analysis-view-control) {
    color: #fff !important;
}

body[data-ui-theme="dark"] #analysis-app[data-page="setup"] :is(.analysis-method-icon) {
    background: var(--fuuvo-dark-surface-raised) !important;
    filter: brightness(0) saturate(100%) invert(80%) sepia(24%) saturate(1119%) hue-rotate(182deg) brightness(105%) contrast(102%) !important;
    opacity: 1 !important;
}

body[data-ui-theme="dark"] #analysis-app[data-page="setup"] .analysis-method-option.active :is(.analysis-method-icon) {
    background: var(--fuuvo-dark-blue-soft) !important;
}

body[data-ui-theme="dark"] #analysis-app[data-page="setup"] :is(.analysis-settings-side p img) {
    filter: brightness(0) saturate(100%) invert(80%) sepia(24%) saturate(1119%) hue-rotate(182deg) brightness(105%) contrast(102%) !important;
    opacity: 1 !important;
}

body[data-ui-theme="dark"] .analysis-loading-placeholder,
body[data-ui-theme="dark"] .analysis-loading-copy {
    background: var(--fuuvo-dark-surface-soft) !important;
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] :is(.analysis-process-panel, .analysis-settings-side, .analysis-conclusion, .analysis-result-three article, .analysis-data-panel, .analysis-result-side) :is(h2, h3, strong, p) {
    color: inherit !important;
}

body[data-ui-theme="dark"] .analysis-settings-side hr {
    background: var(--fuuvo-dark-line) !important;
}

/* Document analysis: cover secondary and dynamically-rendered modules that
 * still carry literal light colours in fuuvo-analysis.css. */
body[data-ui-theme="dark"] .analysis-drop-notes {
    border-color: var(--fuuvo-dark-line) !important;
}

body[data-ui-theme="dark"] .analysis-drop-notes span,
body[data-ui-theme="dark"] .analysis-drop-notes .analysis-icon,
body[data-ui-theme="dark"] .analysis-deeper,
body[data-ui-theme="dark"] .analysis-source-notes p,
body[data-ui-theme="dark"] .analysis-generation-status small,
body[data-ui-theme="dark"] .analysis-empty-result,
body[data-ui-theme="dark"] .analysis-finding-item span,
body[data-ui-theme="dark"] .analysis-spreadsheet-heading p,
body[data-ui-theme="dark"] .analysis-spreadsheet-stats span {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] .analysis-drop-notes i,
body[data-ui-theme="dark"] .analysis-uploaded-file > i {
    background: var(--fuuvo-dark-line) !important;
}

body[data-ui-theme="dark"] .analysis-deeper {
    border-color: var(--fuuvo-dark-line) !important;
    background: var(--fuuvo-dark-surface-soft) !important;
}

body[data-ui-theme="dark"] .analysis-spreadsheet-result,
body[data-ui-theme="dark"] .analysis-spreadsheet-stats > div,
body[data-ui-theme="dark"] .analysis-spreadsheet-scroll,
body[data-ui-theme="dark"] .analysis-generation-status,
body[data-ui-theme="dark"] .analysis-source-file,
body[data-ui-theme="dark"] .analysis-source-note,
body[data-ui-theme="dark"] .analysis-data-overview {
    border-color: var(--fuuvo-dark-line) !important;
    background: var(--fuuvo-dark-surface-soft) !important;
    color: var(--fuuvo-dark-text-soft) !important;
    box-shadow: none !important;
}

body[data-ui-theme="dark"] .analysis-spreadsheet-result {
    background: linear-gradient(145deg, var(--fuuvo-dark-surface-raised), var(--fuuvo-dark-surface)) !important;
}

body[data-ui-theme="dark"] .analysis-spreadsheet-scroll th {
    background: var(--fuuvo-dark-surface-raised) !important;
}

body[data-ui-theme="dark"] .analysis-spreadsheet-scroll th,
body[data-ui-theme="dark"] .analysis-spreadsheet-scroll td {
    border-color: var(--fuuvo-dark-line) !important;
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] .analysis-generation-status.success {
    border-color: rgba(98, 214, 167, .35) !important;
    background: rgba(33, 111, 82, .2) !important;
}

body[data-ui-theme="dark"] .analysis-generation-status.error {
    border-color: rgba(255, 141, 152, .35) !important;
    background: var(--fuuvo-dark-danger-bg) !important;
}

body[data-ui-theme="dark"] .analysis-generation-status button {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-surface-raised) !important;
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] .analysis-source-notes {
    border-color: var(--fuuvo-dark-line) !important;
}

body[data-ui-theme="dark"] .analysis-source-note {
    background: var(--fuuvo-dark-blue-soft) !important;
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] .analysis-data-overview,
body[data-ui-theme="dark"] .analysis-loading-placeholder,
body[data-ui-theme="dark"] .analysis-loading-copy {
    background: var(--fuuvo-dark-surface-soft) !important;
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] .analysis-finding-icon.blue {
    background: var(--fuuvo-dark-blue-soft) !important;
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] .analysis-result-three h2 .analysis-heading-icon {
    background: var(--fuuvo-dark-blue-soft) !important;
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] .analysis-result-three h2 .analysis-heading-icon .analysis-icon {
    background: transparent !important;
    color: inherit !important;
}

body[data-ui-theme="dark"] .analysis-table-wrap {
    border-color: var(--fuuvo-dark-border) !important;
}

body[data-ui-theme="dark"] .analysis-table-wrap table,
body[data-ui-theme="dark"] .analysis-table-wrap td {
    background: var(--fuuvo-dark-surface) !important;
    color: var(--fuuvo-dark-text) !important;
}

body[data-ui-theme="dark"] .analysis-table-wrap th {
    background: var(--fuuvo-dark-blue-soft) !important;
    color: var(--fuuvo-dark-text) !important;
}

body[data-ui-theme="dark"] .analysis-table-wrap th,
body[data-ui-theme="dark"] .analysis-table-wrap td {
    border-color: var(--fuuvo-dark-border) !important;
}

body[data-ui-theme="dark"] .analysis-followup input {
    background: transparent !important;
}

body[data-ui-theme="dark"] .analysis-prompt::placeholder,
body[data-ui-theme="dark"] .analysis-language-select::placeholder,
body[data-ui-theme="dark"] .analysis-followup input::placeholder {
    color: var(--fuuvo-dark-muted) !important;
    opacity: .62;
}

body[data-ui-theme="dark"] .fortune-entry > img {
    mix-blend-mode: normal;
}

body[data-ui-theme="dark"] .animal-choice img {
    mix-blend-mode: normal;
}

/* Safety, transparency, AI information and account/data controls. */
body[data-ui-theme="dark"] :is(.portal-main, .safety-redesign-page, .safety-safe-page, .safety-report-page, .safety-account-page, .data-control-page, .ai-card-redesign) {
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] :is(.portal-main, .safety-redesign-page, .safety-safe-page, .safety-report-page, .safety-account-page, .data-control-page, .ai-card-redesign) :is(h1, h2, h3, strong),
body[data-ui-theme="dark"] :is(.portal-hero, .portal-heading, .sr-heading, .ss-hero, .rr-heading, .ac-heading, .dc-heading, .ai-card-heading) h1 {
    color: var(--fuuvo-dark-text) !important;
}

body[data-ui-theme="dark"] :is(.portal-main, .safety-redesign-page, .safety-safe-page, .safety-report-page, .safety-account-page, .data-control-page, .ai-card-redesign) :is(p, small, .muted) {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] .ai-card-capabilities > p a,
body[data-ui-theme="dark"] .ai-card-legal a,
body[data-ui-theme="dark"] :is(.portal-main, .safety-redesign-page, .safety-safe-page, .safety-report-page, .safety-account-page, .data-control-page, .ai-card-redesign) a.portal-link {
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] .ai-card-heading > span {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] :is(
    .portal-featured, .portal-help-card, .portal-action-card, .portal-feature-card, .portal-control-card,
    .portal-contact-card, .capability-card, .capabilities-card, .capabilities-toc, .ai-info-toc,
    .community-rules-toc, .community-standard-card, .community-report-box, .community-contact-box,
    .safety-page-toc, .safety-inline-card, .safety-link-card, .sr-feature-card, .sr-wide-card,
    .sr-content-grid article, .ss-entry-grid > a, .ss-decision-grid article, .ss-safety-steps,
    .ss-list-panel, .ss-minor-grid article, .ss-research-card, .ss-feedback-card,
    .rr-panel, .rr-record-list > button, .rr-appeal-link, .rr-before-panel article,
    .ac-panel, .ac-home-grid > a, .ac-contact-cards article, .ac-policy-timeline article,
    .ac-chat-list, .ac-chat-row, .dc-panel, .ai-card-toc, .ai-card-panel
) {
    border-color: var(--fuuvo-dark-line) !important;
    background: var(--fuuvo-dark-surface) !important;
    color: var(--fuuvo-dark-text-soft) !important;
    box-shadow: none !important;
}

body[data-ui-theme="dark"] :is(
    .portal-featured, .sr-feature-card, .sr-banner, .sr-process, .sr-login-banner,
    .ss-warning-banner, .ss-report-callout, .ss-minor-banner, .ss-verify-steps,
    .rr-record-box, .rr-notice, .rr-sensitive-note,
    .ac-training-banner, .ac-info-strip, .ac-support-strip,
    .dc-training-banner, .dc-login-banner, .dc-support-strip, .dc-login-inline,
    .ai-card-glance, .ai-info-overview, .community-responsible-list, .community-enforcement-flow > div
) {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: linear-gradient(120deg, #172333, #1b2634) !important;
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] :is(.portal-risk-list, .safe-use-risk-list, .ai-info-risk-list, .ai-card-risks, .community-prohibited-list, .safety-info-callout.warn, .ss-warning-banner, .ac-emergency, .dc-warning-banner) {
    border-color: var(--fuuvo-dark-warning-line) !important;
    background: var(--fuuvo-dark-warning-bg) !important;
    color: #e8cfaa !important;
}

body[data-ui-theme="dark"] :is(.portal-risk-list, .safe-use-risk-list, .ai-info-risk-list, .ai-card-risks, .community-prohibited-list, .safety-info-callout.warn, .ss-warning-banner, .ac-emergency, .dc-warning-banner) :is(strong, span, p, small) {
    color: #e8cfaa !important;
}

body[data-ui-theme="dark"] :is(.ac-danger-button, .ac-danger-outline, .dc-danger-button, .dc-danger-outline, .result-status.failed, .result-media-state.failed) {
    border-color: rgba(255, 141, 152, .42) !important;
    background: var(--fuuvo-dark-danger-bg) !important;
    color: var(--fuuvo-dark-danger) !important;
}

/* Result states appear on creation result pages and should remain legible
   against both the workspace surface and generated-media placeholders. */
html[data-ui-theme="dark"] body .result-status:not(.processing):not(.failed),
body[data-ui-theme="dark"] .result-status:not(.processing):not(.failed) {
    border: 1px solid rgba(98, 214, 167, .48) !important;
    background: #173b31 !important;
    color: #c7f4df !important;
    -webkit-text-fill-color: currentColor !important;
}

html[data-ui-theme="dark"] body .result-status.processing,
body[data-ui-theme="dark"] .result-status.processing {
    border: 1px solid rgba(107, 168, 255, .62) !important;
    background: #1d3553 !important;
    color: #dcebff !important;
    -webkit-text-fill-color: currentColor !important;
    box-shadow: inset 0 0 0 1px rgba(107, 168, 255, .1) !important;
}

html[data-ui-theme="dark"] body .audio-preview-heading > [data-result-state],
body[data-ui-theme="dark"] .audio-preview-heading > [data-result-state] {
    border-color: rgba(107, 168, 255, .62) !important;
    background: #1d3553 !important;
    color: #dcebff !important;
    -webkit-text-fill-color: currentColor !important;
}

body[data-ui-theme="dark"] :is(.portal-main, .safety-redesign-page, .safety-safe-page, .safety-report-page, .safety-account-page, .data-control-page, .ai-card-redesign) :is(input, textarea, select),
body[data-ui-theme="dark"] :is(.rr-input, .rr-textarea textarea, .ac-policy-tabs button, .ac-current-policy #ac-policy-print, .ac-export-email input, .ac-chat-search, .ac-chat-search input, .ac-support-form input, .ac-support-form select, .ac-support-form textarea) {
    border-color: var(--fuuvo-dark-line-strong) !important;
    background: var(--fuuvo-dark-input) !important;
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] .ac-current-policy #ac-policy-print {
    border-color: var(--fuuvo-dark-line-strong) !important;
    background: var(--fuuvo-dark-input) !important;
    color: var(--fuuvo-dark-text-soft) !important;
    -webkit-text-fill-color: currentColor !important;
}

body[data-ui-theme="dark"] .rr-field-title,
body[data-ui-theme="dark"] .rr-category-grid label {
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] .rr-category-grid label:has(input:checked) {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] .rr-record-box > span {
    color: var(--fuuvo-dark-muted) !important;
}

/* Safety report records: keep every record surface readable in dark mode. */
body[data-ui-theme="dark"] .safety-report-page .rr-record-tabs button {
    border-color: var(--fuuvo-dark-line) !important;
    background: var(--fuuvo-dark-input) !important;
    color: var(--fuuvo-dark-text-soft) !important;
    box-shadow: none !important;
}

body[data-ui-theme="dark"] .safety-report-page .rr-record-tabs button:hover,
body[data-ui-theme="dark"] .safety-report-page .rr-record-tabs button.active {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] .safety-report-page .rr-record-list em.green {
    border-color: rgba(98, 214, 167, .42) !important;
    background: rgba(98, 214, 167, .12) !important;
    color: var(--fuuvo-dark-success) !important;
}

body[data-ui-theme="dark"] .safety-report-page .rr-record-list em.orange {
    border-color: var(--fuuvo-dark-warning-line) !important;
    background: var(--fuuvo-dark-warning-bg) !important;
    color: var(--fuuvo-dark-warning) !important;
}

body[data-ui-theme="dark"] .safety-report-page .rr-record-list em.blue {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] .safety-report-page .rr-detail-note {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-surface-soft) !important;
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] .safety-report-page .rr-detail-actions a,
body[data-ui-theme="dark"] .safety-report-page .rr-detail-actions button {
    min-height: 54px !important;
    border: 1px solid var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-input) !important;
    color: var(--fuuvo-dark-blue) !important;
    box-shadow: none !important;
}

body[data-ui-theme="dark"] .safety-report-page .rr-detail-actions a:hover,
body[data-ui-theme="dark"] .safety-report-page .rr-detail-actions button:hover {
    background: var(--fuuvo-dark-blue-soft) !important;
}

body[data-ui-theme="dark"] .safety-report-page .rr-timeline strong {
    color: var(--fuuvo-dark-text) !important;
}

body[data-ui-theme="dark"] .safety-report-page .rr-timeline small,
body[data-ui-theme="dark"] .safety-report-page .rr-record-list small {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] .safety-report-page .rr-timeline i {
    border-color: var(--fuuvo-dark-line-strong) !important;
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] .safety-report-page .rr-timeline > div:not(:last-child)::after {
    border-color: var(--fuuvo-dark-line-strong) !important;
}

body[data-ui-theme="dark"] .safety-report-page .rr-timeline .done i {
    border-color: var(--fuuvo-dark-blue) !important;
    background: var(--fuuvo-dark-blue) !important;
    color: #fff !important;
}

body[data-ui-theme="dark"] .safety-report-page .rr-timeline .current i {
    border-color: var(--fuuvo-dark-blue) !important;
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] .safety-report-page .rr-timeline > div.done:not(:last-child)::after {
    border-color: var(--fuuvo-dark-blue) !important;
}

/* Contact support: light-page navy labels are too dark on the shared surface. */
body[data-ui-theme="dark"].safety-portal-contact_support .ac-support-form > label {
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"].safety-portal-contact_support .ac-upload {
    border-color: var(--fuuvo-dark-line-strong) !important;
    background: var(--fuuvo-dark-surface-soft) !important;
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"].safety-portal-contact_support .ac-upload small {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"].safety-portal-contact_support .ac-upload > img.safety-design-icon {
    filter: brightness(0) saturate(100%) invert(69%) sepia(68%) saturate(2347%) hue-rotate(189deg) brightness(103%) contrast(102%) !important;
    opacity: 1 !important;
}

body[data-ui-theme="dark"].safety-portal-contact_support .ac-upload:hover {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
}

body[data-ui-theme="dark"] :is(.ai-card-featured-actions > a, .ai-card-report-grid > a, .ai-card-controls > div > a, .ss-action-grid > a, .rr-record-box a, .rr-record-button, .ac-contact-cards a) {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: transparent !important;
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] :is(.ai-card-featured-actions > a, .ai-card-report-grid > a, .ai-card-controls > div > a, .ss-action-grid > a, .rr-record-box a, .rr-record-button):hover {
    background: var(--fuuvo-dark-blue-soft) !important;
}

body[data-ui-theme="dark"] :is(.ai-card-glance-grid > a, .ai-card-data-grid > a, .ac-more-links a, .ss-list-panel > a, .safety-page-tabs a + a, .community-policy-tabs, .account-policy-links, .ac-chat-row, .rr-record-tabs button) {
    border-color: var(--fuuvo-dark-line) !important;
}

body[data-ui-theme="dark"] :is(.ai-card-toc a, .ai-info-toc a, .capabilities-toc a, .community-rules-toc a, .safety-page-toc a, .ac-policy-tabs button, .rr-record-tabs button) {
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] :is(.ai-card-glance-grid > a, .ai-card-data-grid > a) {
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] :is(.ai-card-glance-grid > a, .ai-card-data-grid > a) :is(strong, span) {
    color: inherit !important;
}

body[data-ui-theme="dark"] :is(.ai-card-glance-grid > a, .ai-card-data-grid > a) small {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] .ai-card-risks > a {
    border-color: var(--fuuvo-dark-warning-line) !important;
    color: #e8cfaa !important;
}

body[data-ui-theme="dark"] .ai-card-toc a span {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] .ai-card-toc a:hover span,
body[data-ui-theme="dark"] .ai-card-toc a.active span {
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] :is(.ai-card-toc a, .ai-info-toc a, .capabilities-toc a, .community-rules-toc a, .safety-page-toc a, .ac-policy-tabs button, .rr-record-tabs button):hover,
body[data-ui-theme="dark"] :is(.ai-card-toc a, .ai-info-toc a, .capabilities-toc a, .community-rules-toc a, .safety-page-toc a, .ac-policy-tabs button, .rr-record-tabs button).active {
    background: var(--fuuvo-dark-blue-soft) !important;
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] :is(.portal-icon-circle, .report-feature-icon, .report-process-icon, .account-data-number, .account-control-icon, .account-contact-icon, .community-report-icon, .ac-contact-cards i, .ac-process-panel i, .ac-policy-notice > svg, .ac-chat-delete h2 i, .ss-list-panel i, .rr-record-box > svg, .rr-before-panel article i) {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
}

body[data-ui-theme="dark"] :is(.ac-account-delete h2 i, .ss-list-panel.danger i) {
    border-color: rgba(255, 141, 152, .36) !important;
    background: var(--fuuvo-dark-danger-bg) !important;
}

body[data-ui-theme="dark"] :is(.result-status.success, .rr-status.success, .ac-status.success) {
    color: var(--fuuvo-dark-success) !important;
}

@media (max-width: 920px) {
    body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"],
    body[data-ui-theme="dark"] [data-fuuvo-app-shell="1"] > aside[data-fuuvo-shared-sidebar="1"] {
        background: var(--fuuvo-dark-sidebar) !important;
        color: var(--fuuvo-dark-text-soft) !important;
        box-shadow: 18px 0 42px rgba(0, 0, 0, .36) !important;
    }

    body[data-ui-theme="dark"] .fuuvo-mobile-sidebar-auth {
        border-color: var(--fuuvo-dark-line) !important;
    }

    body[data-ui-theme="dark"] :is(.fuuvo-mobile-sidebar-auth p, .fuuvo-mobile-explore h2, .fuuvo-mobile-powered) {
        color: var(--fuuvo-dark-muted) !important;
    }

    body[data-ui-theme="dark"] .fuuvo-mobile-explore a,
    body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] :is(.conversation-title, .conversation-item-icon) {
        color: var(--fuuvo-dark-text-soft) !important;
    }

    body[data-ui-theme="dark"] header[data-fuuvo-shared-topbar="1"] {
        background: rgba(15, 20, 29, .96) !important;
    }

    body[data-ui-theme="dark"] :is(.mobile-nav-pill, .mobile-chat-toolbar, .mobile-chat-toolbar-btn, .mobile-chat-more-item) {
        border-color: var(--fuuvo-dark-line-strong) !important;
        background: var(--fuuvo-dark-surface) !important;
        color: var(--fuuvo-dark-text-soft) !important;
        box-shadow: none !important;
    }

    body[data-ui-theme="dark"] :is(.mobile-nav-pill, .mobile-chat-toolbar-btn, .mobile-chat-more-item):hover,
    body[data-ui-theme="dark"] :is(.mobile-nav-pill, .mobile-chat-toolbar-btn, .mobile-chat-more-item).active {
        border-color: var(--fuuvo-dark-blue-line) !important;
        background: var(--fuuvo-dark-blue-soft) !important;
        color: var(--fuuvo-dark-blue) !important;
    }
}

/* Authentication and access pages keep the selected appearance too. */
body[data-ui-theme="dark"] :is(.auth-page, .auth-main) {
    background: var(--fuuvo-dark-bg) !important;
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] :is(.auth-header, .auth-footer) {
    border-color: var(--fuuvo-dark-line) !important;
    background: var(--fuuvo-dark-sidebar) !important;
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] :is(.auth-card, .legal-dialog, .shell, body > .card) {
    border-color: var(--fuuvo-dark-line-strong) !important;
    background: var(--fuuvo-dark-surface) !important;
    color: var(--fuuvo-dark-text-soft) !important;
    box-shadow: 0 24px 70px rgba(0, 0, 0, .34) !important;
}

body[data-ui-theme="dark"] :is(.auth-title, .auth-card label, .legal-head h3, .panel h2, body > .card h1) {
    color: var(--fuuvo-dark-text) !important;
}

body[data-ui-theme="dark"] :is(.auth-subtitle, .helper, .legal-check, .consent-note, .age-note, .legal-content, .panel p, .footer, body > .card p) {
    color: var(--fuuvo-dark-muted) !important;
}

body[data-ui-theme="dark"] :is(.auth-card input, .panel input, .social-btn, .btn.secondary) {
    border-color: var(--fuuvo-dark-line-strong) !important;
    background: var(--fuuvo-dark-input) !important;
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] :is(.social-btn, .btn.secondary):hover {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
}

body[data-ui-theme="dark"] .divider::before,
body[data-ui-theme="dark"] .divider::after {
    background: var(--fuuvo-dark-line) !important;
}

body[data-ui-theme="dark"] .legal-head {
    border-color: var(--fuuvo-dark-line) !important;
    background: transparent !important;
}

body[data-ui-theme="dark"]:has(.auth-page),
body[data-ui-theme="dark"]:has(> .shell),
body[data-ui-theme="dark"]:has(> .card) {
    background:
        radial-gradient(circle at top left, rgba(66, 119, 213, .16), transparent 28%),
        radial-gradient(circle at right bottom, rgba(42, 143, 151, .10), transparent 24%),
        var(--fuuvo-dark-bg) !important;
}

/* Final mobile dark-mode invariants. The landing page has intentionally
 * specific phone styles, so dark mode must match that specificity rather than
 * letting light mobile colours win. */
body[data-ui-theme="dark"] :is(
    .sidebar-brand-zh-logo,
    .sidebar-brand-en-symbol,
    .sidebar-brand-en-logo,
    .composer-title-logo,
    .mobile-chat-brand-zh,
    .mobile-chat-brand-en img,
    .auth-brand-zh,
    .auth-brand-en img
) {
    filter: brightness(1.18) saturate(1.12) drop-shadow(0 0 9px rgba(57, 204, 214, .14));
}

body[data-ui-theme="dark"] :is(.sidebar-brand-en-word, .auth-brand-en-word, .mobile-chat-brand-en) {
    color: #63d5df !important;
    -webkit-text-fill-color: currentColor !important;
}

body[data-ui-theme="dark"] header[data-fuuvo-shared-topbar="1"] :is(
    .fuuvo-topbar-menu-icon img,
    .shell-topbar-back img,
    .workspace-header-link img
),
body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-sidebar-close img {
    filter: brightness(0) saturate(100%) invert(82%) sepia(15%) saturate(719%) hue-rotate(181deg) brightness(104%) contrast(94%) !important;
}

body[data-ui-theme="dark"] .fortune-method-row > span {
    color: var(--fuuvo-dark-muted) !important;
}

@media (max-width: 920px) {
    html[data-ui-theme="dark"]:has(body.chat-landing[data-mode="chat"]),
    body[data-ui-theme="dark"].chat-landing[data-mode="chat"],
    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] :is(.app, .workspace, .composer) {
        background: var(--fuuvo-dark-bg) !important;
        color: var(--fuuvo-dark-text-soft) !important;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .mobile-chat-topbar {
        border-bottom-color: var(--fuuvo-dark-line) !important;
        background: rgba(15, 20, 29, .96) !important;
        color: var(--fuuvo-dark-text-soft) !important;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] :is(.mobile-nav-pill, .mobile-nav-trigger) {
        border-color: var(--fuuvo-dark-line-strong) !important;
        background: transparent !important;
        color: var(--fuuvo-dark-text-soft) !important;
        box-shadow: none !important;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .mobile-nav-bars {
        color: var(--fuuvo-dark-text-soft) !important;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .mobile-chat-actions .ui-language-switch {
        border-color: transparent !important;
        background: transparent !important;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .mobile-chat-actions .ui-language-switch-btn {
        background: transparent !important;
        color: var(--fuuvo-dark-muted) !important;
        -webkit-text-fill-color: currentColor !important;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .mobile-chat-actions .ui-language-switch-btn.active {
        color: var(--fuuvo-dark-text) !important;
        -webkit-text-fill-color: currentColor !important;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .mobile-chat-actions .ui-language-switch-btn + .ui-language-switch-btn::before {
        background: var(--fuuvo-dark-line-strong) !important;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .mobile-chat-btn {
        border-color: var(--fuuvo-dark-blue-line) !important;
        background: var(--fuuvo-dark-surface-raised) !important;
        color: var(--fuuvo-dark-text) !important;
        box-shadow: none !important;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] :is(.composer-title, .mobile-home-scenes-title) {
        color: var(--fuuvo-dark-text) !important;
        -webkit-text-fill-color: currentColor !important;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] :is(.composer-desc, .chat-input-hint) {
        color: var(--fuuvo-dark-muted) !important;
        -webkit-text-fill-color: currentColor !important;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .chat-input-wrap {
        border-color: var(--fuuvo-dark-line-strong) !important;
        background: var(--fuuvo-dark-input) !important;
        box-shadow: 0 12px 28px rgba(0, 0, 0, .18) !important;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .chat-input-wrap textarea {
        color: var(--fuuvo-dark-text) !important;
        -webkit-text-fill-color: currentColor !important;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] :is(.chat-tool-btn, .mobile-chat-toolbar-btn) {
        border-color: var(--fuuvo-dark-line-strong) !important;
        background: var(--fuuvo-dark-input) !important;
        color: var(--fuuvo-dark-text-soft) !important;
        box-shadow: none !important;
    }

    /* The mobile home composer places the More button inside its own
     * positioning wrapper. Keep that wrapper visually transparent so the
     * button does not look like it has a second card/shadow around it. */
    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .mobile-chat-toolbar {
        border-color: transparent !important;
        background: transparent !important;
        box-shadow: none !important;
        filter: none !important;
        -webkit-backdrop-filter: none !important;
        backdrop-filter: none !important;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] #mobile-chat-more-btn,
    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] #mobile-chat-more-btn:is(:hover, :focus, :focus-visible, :active) {
        box-shadow: none !important;
        filter: none !important;
        outline: none;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .mobile-home-capabilities > button,
    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .mobile-home-capabilities-menu,
    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .mobile-home-capabilities-menu button {
        border-color: var(--fuuvo-dark-line-strong) !important;
        background: var(--fuuvo-dark-surface) !important;
        color: var(--fuuvo-dark-text-soft) !important;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .core-feature-btn {
        border-color: var(--fuuvo-dark-line-strong) !important;
        background: var(--fuuvo-dark-surface) !important;
        color: var(--fuuvo-dark-text-soft) !important;
        box-shadow: none !important;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .workspace > .workspace-disclaimer:not(.landing-workspace-disclaimer),
    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .workspace > .fuuvo-ai-disclaimer {
        border-top-color: var(--fuuvo-dark-line) !important;
        background: var(--fuuvo-dark-bg) !important;
        color: #b6c1d1 !important;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .workspace > .workspace-disclaimer:not(.landing-workspace-disclaimer) > a,
    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .workspace > .fuuvo-ai-disclaimer a {
        color: #8fbdff !important;
    }
}


/* Mobile conversation detail: keep the header and composer on one crisp
 * dark surface, and avoid inherited landing/global control treatments. */
@media (max-width: 920px) {
    html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] .mobile-chat-topbar,
    html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] .composer {
        border-color: var(--fuuvo-dark-line) !important;
        background: var(--fuuvo-dark-bg) !important;
        background-image: none !important;
        color: var(--fuuvo-dark-text-soft) !important;
        box-shadow: none !important;
        filter: none !important;
        -webkit-backdrop-filter: none !important;
        backdrop-filter: none !important;
    }

    html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] .mobile-chat-topbar {
        border-width: 0 0 1px !important;
        border-style: solid !important;
    }

    html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] .composer {
        border-width: 1px 0 0 !important;
        border-style: solid !important;
        border-radius: 0 !important;
    }

    html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] .mobile-chat-primary-actions :is(
        #mobile-nav-trigger,
        #mobile-chat-detail-back,
        .mobile-nav-pill,
        .mobile-nav-bars
    ) {
        border-color: transparent !important;
        background: transparent !important;
        background-image: none !important;
        color: var(--fuuvo-dark-text-soft) !important;
        box-shadow: none !important;
        filter: none !important;
        -webkit-backdrop-filter: none !important;
        backdrop-filter: none !important;
        opacity: 1 !important;
    }

    html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] .mobile-chat-primary-actions :is(
        #mobile-nav-trigger,
        #mobile-chat-detail-back
    ):is(:hover, :focus-visible, :active) {
        background: var(--fuuvo-dark-blue-soft) !important;
        color: var(--fuuvo-dark-blue) !important;
        outline: none !important;
    }

    html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] .mobile-chat-primary-actions :is(
        .mobile-nav-bars,
        #mobile-chat-detail-back svg
    ) {
        width: 20px !important;
        height: 20px !important;
        flex: 0 0 20px !important;
        shape-rendering: geometricPrecision;
    }

    html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] .mobile-chat-actions .ui-language-switch {
        gap: 2px !important;
        width: auto !important;
        height: 34px !important;
        min-height: 34px !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 9px !important;
        background: transparent !important;
        box-shadow: none !important;
        overflow: visible !important;
    }

    html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] .mobile-chat-actions .ui-language-switch-btn {
        width: 36px !important;
        min-width: 36px !important;
        height: 34px !important;
        min-height: 34px !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 8px !important;
        background: transparent !important;
        background-image: none !important;
        color: var(--fuuvo-dark-muted) !important;
        -webkit-text-fill-color: currentColor !important;
        box-shadow: none !important;
        font-size: 14px !important;
        font-weight: 600 !important;
        line-height: 1 !important;
    }

    html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] .mobile-chat-actions .ui-language-switch-btn.active {
        background: var(--fuuvo-dark-blue-soft) !important;
        color: var(--fuuvo-dark-blue) !important;
        -webkit-text-fill-color: currentColor !important;
    }

    html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] .mobile-chat-actions .ui-language-switch-btn + .ui-language-switch-btn {
        border-left: 0 !important;
    }

    html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] .chat-bubble.assistant .bubble-actions :is(.quote-btn, .copy-btn) {
        border: 1px solid var(--fuuvo-dark-line-strong) !important;
        background: var(--fuuvo-dark-input) !important;
        background-image: none !important;
        color: var(--fuuvo-dark-text-soft) !important;
        box-shadow: none !important;
    }

    html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] .chat-bubble.assistant .bubble-actions .copy-btn {
        color: var(--fuuvo-dark-blue) !important;
    }

    html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] .chat-bubble.assistant .bubble-actions :is(.quote-btn, .copy-btn):is(:hover, :focus-visible, :active) {
        border-color: var(--fuuvo-dark-blue-line) !important;
        background: var(--fuuvo-dark-blue-soft) !important;
        color: var(--fuuvo-dark-blue) !important;
        outline: none !important;
    }

    html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] .mobile-chat-toolbar {
        border-color: transparent !important;
        background: transparent !important;
        background-image: none !important;
        box-shadow: none !important;
        filter: none !important;
        -webkit-backdrop-filter: none !important;
        backdrop-filter: none !important;
    }

    html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] #mobile-chat-more-btn,
    html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] #mobile-chat-more-btn:is(:hover, :focus-visible, :active) {
        border: 1px solid var(--fuuvo-dark-line) !important;
        background: rgba(15, 23, 42, .76) !important;
        background-image: none !important;
        color: var(--fuuvo-dark-text-soft) !important;
        -webkit-text-fill-color: currentColor !important;
        box-shadow: none !important;
        filter: none !important;
        outline: none !important;
    }
}

/* Make the active UI language unmistakable on dark top bars. Keep this final
 * so page-specific chat styles cannot flatten the selected state. */
html body[data-ui-theme="dark"][data-mode="chat"] header[data-fuuvo-shared-topbar="1"] .ui-language-switch {
    gap: 3px !important;
    padding: 3px !important;
    border: 1px solid var(--fuuvo-dark-line-strong) !important;
    border-radius: 10px !important;
    background: var(--fuuvo-dark-input) !important;
    box-shadow: none !important;
}

html body[data-ui-theme="dark"][data-mode="chat"] header[data-fuuvo-shared-topbar="1"] .ui-language-switch .ui-language-switch-btn {
    min-width: 38px !important;
    min-height: 32px !important;
    padding: 0 9px !important;
    border: 1px solid transparent !important;
    border-radius: 7px !important;
    background: transparent !important;
    color: var(--fuuvo-dark-muted) !important;
    -webkit-text-fill-color: currentColor !important;
    box-shadow: none !important;
}

html body[data-ui-theme="dark"][data-mode="chat"] header[data-fuuvo-shared-topbar="1"] .ui-language-switch .ui-language-switch-btn.active {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
    color: #b8d4ff !important;
    -webkit-text-fill-color: currentColor !important;
    box-shadow: inset 0 0 0 1px rgba(107, 168, 255, .1) !important;
}

html body[data-ui-theme="dark"][data-mode="chat"] header[data-fuuvo-shared-topbar="1"] .ui-language-switch .ui-language-switch-btn:not(.active):hover {
    background: rgba(255, 255, 255, .05) !important;
    color: var(--fuuvo-dark-text-soft) !important;
}

html body[data-ui-theme="dark"][data-mode="chat"] header[data-fuuvo-shared-topbar="1"] .ui-language-switch .ui-language-switch-btn + .ui-language-switch-btn {
    border-left: 1px solid transparent !important;
}

html body[data-ui-theme="dark"][data-mode="chat"] header[data-fuuvo-shared-topbar="1"] .ui-language-switch .ui-language-switch-btn + .ui-language-switch-btn.active {
    border-left-color: var(--fuuvo-dark-blue-line) !important;
}

@media (max-width: 920px) {
    html body[data-ui-theme="dark"][data-mode="chat"] .mobile-chat-actions .ui-language-switch {
        gap: 2px !important;
        padding: 3px !important;
        border: 1px solid var(--fuuvo-dark-line-strong) !important;
        border-radius: 10px !important;
        background: var(--fuuvo-dark-input) !important;
        box-shadow: none !important;
    }

    html body[data-ui-theme="dark"][data-mode="chat"] .mobile-chat-actions .ui-language-switch .ui-language-switch-btn {
        border: 1px solid transparent !important;
        border-radius: 7px !important;
        background: transparent !important;
        color: var(--fuuvo-dark-muted) !important;
        -webkit-text-fill-color: currentColor !important;
        box-shadow: none !important;
    }

    html body[data-ui-theme="dark"][data-mode="chat"] .mobile-chat-actions .ui-language-switch .ui-language-switch-btn.active {
        border-color: var(--fuuvo-dark-blue-line) !important;
        background: var(--fuuvo-dark-blue-soft) !important;
        color: #b8d4ff !important;
        -webkit-text-fill-color: currentColor !important;
    }

    html body[data-ui-theme="dark"][data-mode="chat"] .mobile-chat-actions .ui-language-switch .ui-language-switch-btn + .ui-language-switch-btn {
        border-left: 1px solid transparent !important;
    }

    html body[data-ui-theme="dark"][data-mode="chat"] .mobile-chat-actions .ui-language-switch .ui-language-switch-btn + .ui-language-switch-btn.active {
        border-left-color: var(--fuuvo-dark-blue-line) !important;
    }
}
body[data-ui-theme="dark"] #creation-app .creation-breadcrumb,
body[data-ui-theme="dark"] #creation-app .creation-breadcrumb a,
body[data-ui-theme="dark"] #creation-app .creation-breadcrumb span {
    color: #7ca4da !important;
}

body[data-ui-theme="dark"] #creation-app .creation-breadcrumb a:hover {
    color: #9bc7ff !important;
}

/* Keep image-based safety icons visible and consistent on dark surfaces. */
body[data-ui-theme="dark"] :is(.safety-redesign-page, .safety-safe-page, .safety-report-page, .data-control-page, .ai-card-redesign) img.safety-design-icon {
    opacity: 1 !important;
    filter: brightness(0) saturate(100%) invert(67%) sepia(46%) saturate(1155%) hue-rotate(184deg) brightness(101%) contrast(101%) !important;
}

body[data-ui-theme="dark"].safety-portal-policy_history .ac-policy-tabs button > img.safety-design-icon {
    filter: brightness(0) saturate(100%) invert(67%) sepia(46%) saturate(1155%) hue-rotate(184deg) brightness(101%) contrast(101%) !important;
}

body[data-ui-theme="dark"].safety-portal-policy_history .ac-policy-tabs button:hover > img.safety-design-icon,
body[data-ui-theme="dark"].safety-portal-policy_history .ac-policy-tabs button.active > img.safety-design-icon {
    filter: brightness(0) saturate(100%) invert(80%) sepia(38%) saturate(1124%) hue-rotate(183deg) brightness(105%) contrast(103%) !important;
}

body[data-ui-theme="dark"].safety-portal-policy_history :is(.ac-current-policy, .ac-policy-notice) > img.safety-design-icon {
    border: 1px solid var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
    box-shadow: none !important;
}

/* Privacy forms and data controls: readable text, consistent icons and spacing. */
body[data-ui-theme="dark"] :is(.safety-dpo-banner, .safety-dpo-form) {
    border-color: var(--fuuvo-dark-line) !important;
    background: var(--fuuvo-dark-surface) !important;
}

body[data-ui-theme="dark"] :is(.safety-dpo-page, .data-control-page) :is(p, label, li, small, time, .portal-form-hint, .dc-record-head, .dc-record-placeholder, .dc-bottom-note, .dc-support-strip span) {
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] :is(.safety-dpo-page, .data-control-page) :is(.safety-asset-icon, a, .dc-link-row a, .dc-account-card > a) {
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] :is(.dc-record-help i, .dc-guest-chat i) {
    border: 1px solid var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
}

body[data-ui-theme="dark"] .dc-account-card > label {
    padding: 13px 15px !important;
    gap: 10px 12px !important;
    border-color: var(--fuuvo-dark-line-strong) !important;
    background: var(--fuuvo-dark-input) !important;
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] .dc-account-card > label > img.safety-design-icon {
    margin-top: 1px !important;
}

body[data-ui-theme="dark"] .dc-support-strip {
    gap: 14px !important;
}

body[data-ui-theme="dark"] .dc-support-strip strong {
    margin-left: 6px !important;
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] .dc-record-help > p {
    min-height: 82px !important;
    margin-top: 10px !important;
    gap: 14px !important;
}

body[data-ui-theme="dark"] .safety-dpo-form {
    padding: 24px !important;
}

body[data-ui-theme="dark"] .safety-dpo-form .portal-form-grid {
    gap: 18px 22px !important;
}

body[data-ui-theme="dark"] .safety-dpo-form .portal-field {
    gap: 8px !important;
}

body[data-ui-theme="dark"] .safety-dpo-form .portal-form-hint {
    margin-top: 4px !important;
    align-items: center !important;
    gap: 9px !important;
}

/* Shared dark-mode secondary copy: keep auxiliary text readable everywhere. */
body[data-ui-theme="dark"] :is(.creation-breadcrumb, .analysis-breadcrumb, .research-breadcrumb, .fortune-breadcrumb, .sr-breadcrumb, .safety-local-heading .safety-meta) {
    color: #7ca4da !important;
}

body[data-ui-theme="dark"] :is(.sr-banner.caution span, .capabilities-note, .capabilities-page-note, .research-bottom-note, .research-result-footer, .creation-disclaimer, .writing-note, .works-note, .dc-bottom-note, .safety-dpo-note, .portal-form-hint, .safety-info-callout:not(.warn), .portal-note) {
    color: #b9c8dc !important;
}

body[data-ui-theme="dark"] :is(.sr-content-grid, .sr-three-grid, .sr-wide-card, .sr-account-grid, .portal-help-card, .portal-control-card, .safety-mini-card, .dc-panel, .ac-panel) :is(p, small, span:not(.safety-design-icon):not(.portal-icon-circle)) {
    color: #c5d1e1 !important;
}

/* New chat is an action, not a second active navigation item on feature pages. */
body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .portal-new-chat {
    border-color: transparent !important;
    background: transparent !important;
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .portal-new-chat .rail-text {
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .portal-new-chat img.rail-glyph {
    filter: brightness(0) saturate(100%) invert(91%) sepia(10%) saturate(285%) hue-rotate(178deg) brightness(99%) contrast(94%) !important;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .portal-new-chat:hover {
    background: var(--fuuvo-dark-blue-soft) !important;
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .portal-new-chat:hover .rail-text {
    color: var(--fuuvo-dark-text-soft) !important;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .portal-new-chat:hover img.rail-glyph {
    filter: brightness(0) saturate(100%) invert(91%) sepia(10%) saturate(285%) hue-rotate(178deg) brightness(99%) contrast(94%) !important;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] :is(#sidebar-new-work-task, #sidebar-open-research):not(.active) .rail-glyph > img {
    filter: brightness(0) saturate(100%) invert(91%) sepia(10%) saturate(285%) hue-rotate(178deg) brightness(99%) contrast(94%) !important;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] :is(#sidebar-new-work-task, #sidebar-open-research):is(.active, :hover) .rail-glyph > img {
    filter: brightness(0) saturate(100%) invert(62%) sepia(80%) saturate(1665%) hue-rotate(191deg) brightness(102%) contrast(103%) !important;
}

html body[data-ui-theme="dark"] .creation-app aside[data-fuuvo-shared-sidebar="1"] .portal-new-chat .rail-text,
html body[data-ui-theme="dark"] #creation-app aside[data-fuuvo-shared-sidebar="1"] .portal-new-chat .rail-text {
    color: #eef2f7 !important;
    -webkit-text-fill-color: #eef2f7 !important;
}

html body[data-ui-theme="dark"] .creation-app aside[data-fuuvo-shared-sidebar="1"] :is(#sidebar-new-work-task, #sidebar-open-research):not(.active) picture.rail-glyph > img,
html body[data-ui-theme="dark"] #creation-app aside[data-fuuvo-shared-sidebar="1"] :is(#sidebar-new-work-task, #sidebar-open-research):not(.active) picture.rail-glyph > img {
    opacity: 1 !important;
    filter: brightness(0) saturate(100%) invert(91%) sepia(10%) saturate(285%) hue-rotate(178deg) brightness(99%) contrast(94%) !important;
}

html body[data-ui-theme="dark"] .creation-app aside[data-fuuvo-shared-sidebar="1"] :is(#sidebar-new-work-task, #sidebar-open-research).active picture.rail-glyph > img,
html body[data-ui-theme="dark"] #creation-app aside[data-fuuvo-shared-sidebar="1"] :is(#sidebar-new-work-task, #sidebar-open-research).active picture.rail-glyph > img {
    opacity: 1 !important;
    filter: brightness(0) saturate(100%) invert(62%) sepia(80%) saturate(1665%) hue-rotate(191deg) brightness(102%) contrast(103%) !important;
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] #sidebar-new-chat .rail-text,
html body[data-ui-theme="dark"][data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] #sidebar-new-chat.active .rail-text {
    color: #8bbcff !important;
    -webkit-text-fill-color: #8bbcff !important;
}

/* Every tab label must remain readable in dark mode. */
body[data-ui-theme="dark"] :is(.creation-tabs, .research-tabs, .analysis-tabs, .portal-tabs, .safety-page-tabs, .ac-policy-tabs, .rr-record-tabs, .fortune-tabs, .office-tabs, .works-tabs, .analysis-mode-tabs) :is(a, button) {
    color: #b9c8dc !important;
    -webkit-text-fill-color: #b9c8dc !important;
}

body[data-ui-theme="dark"] :is(.creation-tabs, .research-tabs, .analysis-tabs, .portal-tabs, .safety-page-tabs, .ac-policy-tabs, .rr-record-tabs, .fortune-tabs, .office-tabs, .works-tabs, .analysis-mode-tabs) :is(a, button):is(.active, [aria-current="page"], [aria-selected="true"]),
body[data-ui-theme="dark"] :is(.creation-tabs, .research-tabs, .analysis-tabs, .portal-tabs, .safety-page-tabs, .ac-policy-tabs, .rr-record-tabs, .fortune-tabs, .office-tabs, .works-tabs, .analysis-mode-tabs) :is(a, button):hover {
    color: var(--fuuvo-dark-blue) !important;
    -webkit-text-fill-color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] .dc-account-card > label > span {
    color: #eef2f7 !important;
    -webkit-text-fill-color: #eef2f7 !important;
}

body[data-ui-theme="dark"] .dc-account-card > label > span b {
    color: var(--fuuvo-dark-danger) !important;
    -webkit-text-fill-color: var(--fuuvo-dark-danger) !important;
}

/* Final readability floor for descriptive copy across every feature page. */
body[data-ui-theme="dark"] main :is(p, small),
body[data-ui-theme="dark"] main [class*="-card"] :is(p, small),
body[data-ui-theme="dark"] :is(.fortune-entry p, .fortune-explain p, .fortune-explain p span, .fortune-side-info span, .fortune-helper, .fortune-inline-help, .fortune-depth-note) {
    color: #c5d1e1 !important;
    -webkit-text-fill-color: #c5d1e1 !important;
}

body[data-ui-theme="dark"] :is(.portal-risk-list, .safe-use-risk-list, .ai-info-risk-list, .ai-card-risks, .community-prohibited-list, .safety-info-callout.warn, .ss-warning-banner, .ac-emergency, .dc-warning-banner) :is(strong, span, p, small) {
    color: #e8cfaa !important;
    -webkit-text-fill-color: #e8cfaa !important;
}

body[data-ui-theme="dark"] :is(.ac-status.error, .portal-status.error, .creation-form-status.error, .research-analysis-status.error) {
    color: var(--fuuvo-dark-danger) !important;
    -webkit-text-fill-color: var(--fuuvo-dark-danger) !important;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] #sidebar-creation-history:not(.active) .rail-glyph {
    color: #eef2f7 !important;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] #sidebar-creation-history:is(.active, :hover) .rail-glyph {
    color: var(--fuuvo-dark-blue) !important;
}

/* Shared inline navigation icons follow the same state color on every route. */
body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav-btn:not(.active):not(:hover) .rail-glyph {
    color: #eef2f7 !important;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav-btn:is(.active, :hover) .rail-glyph {
    color: var(--fuuvo-dark-blue) !important;
}

body[data-ui-theme="dark"] aside[data-fuuvo-shared-sidebar="1"] .portal-new-chat .portal-new-chat-glyph path {
    stroke: currentColor !important;
}

body[data-ui-theme="dark"] .sr-training-control label,
body[data-ui-theme="dark"] .sr-training-control label em {
    color: #c5d1e1 !important;
    -webkit-text-fill-color: #c5d1e1 !important;
}

body[data-ui-theme="dark"] .sr-training-control label b {
    color: #e3eaf3 !important;
    -webkit-text-fill-color: #e3eaf3 !important;
}

/* Source: public/static/css/fuuvo-icon-assets.css */
/* The refreshed icon files are transparent masks so their stroke follows the active theme. */
.fuuvo-asset-icon {
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
    display: block;
    flex: 0 0 auto;
    background-color: currentColor;
    -webkit-mask-image: var(--fuuvo-icon-asset, var(--fuuvo-asset-url));
    mask-image: var(--fuuvo-icon-asset, var(--fuuvo-asset-url));
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    mask-size: contain;
}

/* Website 2.0 transparent icon assets. The mask keeps the source SVG
 * transparent while inheriting the active light/dark theme colour. */
.fuuvo-asset-home {
    --fuuvo-icon-asset: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%3E%0D%0A%3Cpath%20d%3D%22M4.25%2010.75%2012%204.25l7.75%206.5%22%2F%3E%0D%0A%20%20%3Cpath%20d%3D%22M6.75%209.75V19.5h10.5V9.75%22%2F%3E%0D%0A%20%20%3Cpath%20d%3D%22M10%2019.5v-5.25h4V19.5%22%2F%3E%0D%0A%3C%2Fsvg%3E%0D%0A');
}

.fuuvo-asset-creation-centre {
    --fuuvo-icon-asset: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%3E%0D%0A%3Cpath%20d%3D%22M4.85%2019.35%2013.6%2010.6%22%2F%3E%0D%0A%20%20%3Cpath%20d%3D%22M12.85%2011.35%2015.35%208.85a2.2%202.2%200%200%201%203.1%200l.7.7a2.2%202.2%200%200%201%200%203.1L16.65%2015.15%22%2F%3E%0D%0A%20%20%3Cpath%20d%3D%22M17.85%204.15%2018.7%206.4%2020.95%207.25%2018.7%208.1%2017.85%2010.35%2017%208.1%2014.75%207.25%2017%206.4z%22%2F%3E%0D%0A%3C%2Fsvg%3E%0D%0A');
}

.fuuvo-asset-research {
    --fuuvo-icon-asset: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%3E%0D%0A%3Cpath%20d%3D%22M12%206.25c-2.9-1.6-6.7-1.45-8.5-.15v11.9c2.05-1.2%205.55-1.35%208.5.2%22%2F%3E%0D%0A%20%20%3Cpath%20d%3D%22M12%206.25c2.9-1.6%206.7-1.45%208.5-.15v11.9c-2.05-1.2-5.55-1.35-8.5.2%22%2F%3E%0D%0A%20%20%3Cpath%20d%3D%22M12%206.25v12%22%2F%3E%0D%0A%3C%2Fsvg%3E%0D%0A');
}

.fuuvo-asset-translate {
    --fuuvo-icon-asset: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%3E%0D%0A%3Cpath%20d%3D%22M3.5%207h8%22%2F%3E%0D%0A%20%20%3Cpath%20d%3D%22M7.5%205.25V7%22%2F%3E%0D%0A%20%20%3Cpath%20d%3D%22M5.2%2011.25%208.85%2019%22%2F%3E%0D%0A%20%20%3Cpath%20d%3D%22M8.85%2011.25%205.2%2019%22%2F%3E%0D%0A%20%20%3Cpath%20d%3D%22M13.5%2019%2016.85%208.5h.4L20.6%2019%22%2F%3E%0D%0A%20%20%3Cpath%20d%3D%22M14.75%2015.25h4.6%22%2F%3E%0D%0A%3C%2Fsvg%3E%0D%0A');
}

.fuuvo-asset-create-video {
    --fuuvo-icon-asset: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%3E%0D%0A%3Crect%20x%3D%223.25%22%20y%3D%226.75%22%20width%3D%2212.75%22%20height%3D%2210.5%22%20rx%3D%222.25%22%2F%3E%0D%0A%20%20%3Cpath%20d%3D%22M16%2010.15%2020.75%207.5v9l-4.75-2.65z%22%2F%3E%0D%0A%3C%2Fsvg%3E%0D%0A');
}

.fuuvo-asset-photo-solver {
    --fuuvo-icon-asset: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%3E%0D%0A%3Cpath%20d%3D%22M4.5%208.5V5.5h3%22%2F%3E%0D%0A%20%20%3Cpath%20d%3D%22M19.5%208.5V5.5h-3%22%2F%3E%0D%0A%20%20%3Cpath%20d%3D%22M4.5%2015.5v3h3%22%2F%3E%0D%0A%20%20%3Cpath%20d%3D%22M19.5%2015.5v3h-3%22%2F%3E%0D%0A%20%20%3Cpath%20d%3D%22M8.5%209.25%2012%206.85%2015.5%209.25%22%2F%3E%0D%0A%20%20%3Cpath%20d%3D%22M12%206.85v6.4%22%2F%3E%0D%0A%20%20%3Cpath%20d%3D%22M8.75%2016.15h6.5%22%2F%3E%0D%0A%3C%2Fsvg%3E%0D%0A');
}

.fuuvo-asset-local-food {
    --fuuvo-icon-asset: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%3E%0D%0A%3Cpath%20d%3D%22M4.25%2011.35h15.5%22%2F%3E%0D%0A%20%20%3Cpath%20d%3D%22M5.15%2011.35c.45%205.35%203.35%208.4%206.85%208.4s6.4-3.05%206.85-8.4%22%2F%3E%0D%0A%20%20%3Cpath%20d%3D%22M9.35%204.6c.35.9-.2%201.45.15%202.4%22%2F%3E%0D%0A%20%20%3Cpath%20d%3D%22M12%203.75c.4%201-.2%201.6.2%202.7%22%2F%3E%0D%0A%20%20%3Cpath%20d%3D%22M14.7%204.6c.35.9-.2%201.45.15%202.4%22%2F%3E%0D%0A%3C%2Fsvg%3E%0D%0A');
}

.fuuvo-asset-deep-research {
    --fuuvo-icon-asset: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%3E%0D%0A%3Cpath%20d%3D%22M9%203.75h6%22%2F%3E%0D%0A%20%20%3Cpath%20d%3D%22M10.25%203.75v5.35L6.7%2016.7A3.4%203.4%200%200%200%209.6%2020.5h4.8a3.4%203.4%200%200%200%202.9-3.8l-3.55-7.6V3.75%22%2F%3E%0D%0A%20%20%3Ccircle%20cx%3D%2210.15%22%20cy%3D%2216.35%22%20r%3D%220.7%22%20fill%3D%22currentColor%22%20stroke%3D%22none%22%2F%3E%0D%0A%20%20%3Ccircle%20cx%3D%2213.35%22%20cy%3D%2217.6%22%20r%3D%220.55%22%20fill%3D%22currentColor%22%20stroke%3D%22none%22%2F%3E%0D%0A%3C%2Fsvg%3E%0D%0A');
}

.fuuvo-asset-writing {
    --fuuvo-icon-asset: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%3E%0D%0A%3Cpath%20d%3D%22M13.35%204.65%2019.35%2010.65%209.5%2020.5H3.5v-6z%22%2F%3E%0D%0A%20%20%3Cpath%20d%3D%22M11.85%206.15%2017.85%2012.15%22%2F%3E%0D%0A%20%20%3Cpath%20d%3D%22M5.15%2015.35%208.65%2018.85%22%2F%3E%0D%0A%3C%2Fsvg%3E%0D%0A');
}

.fuuvo-asset-data-analysis {
    --fuuvo-icon-asset: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%3E%0D%0A%3Cpath%20d%3D%22M4.25%204.5v15.25H20%22%2F%3E%0D%0A%20%20%3Cpath%20d%3D%22M8%2019.75v-5.5%22%2F%3E%0D%0A%20%20%3Cpath%20d%3D%22M12.25%2019.75V8.5%22%2F%3E%0D%0A%20%20%3Cpath%20d%3D%22M16.5%2019.75v-8%22%2F%3E%0D%0A%3C%2Fsvg%3E%0D%0A');
}

.fuuvo-asset-office-hub {
    --fuuvo-icon-asset: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%3E%0D%0A%3Cpath%20d%3D%22M4.25%2020.25V9.5L12%203.75%2019.75%209.5v10.75%22%2F%3E%0D%0A%20%20%3Cpath%20d%3D%22M10%2020.25v-6.25h4v6.25%22%2F%3E%0D%0A%20%20%3Cpath%20d%3D%22M7.25%2012.5h2%22%2F%3E%0D%0A%20%20%3Cpath%20d%3D%22M14.75%2012.5h2%22%2F%3E%0D%0A%3C%2Fsvg%3E%0D%0A');
}

.fuuvo-asset-work-assistant {
    --fuuvo-icon-asset: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%3E%0D%0A%3Crect%20x%3D%225.5%22%20y%3D%227.25%22%20width%3D%2213%22%20height%3D%2211.5%22%20rx%3D%223.5%22%2F%3E%0D%0A%20%20%3Ccircle%20cx%3D%229.5%22%20cy%3D%2212.4%22%20r%3D%220.95%22%20fill%3D%22currentColor%22%20stroke%3D%22none%22%2F%3E%0D%0A%20%20%3Ccircle%20cx%3D%2214.5%22%20cy%3D%2212.4%22%20r%3D%220.95%22%20fill%3D%22currentColor%22%20stroke%3D%22none%22%2F%3E%0D%0A%20%20%3Cpath%20d%3D%22M9.6%2015.35h4.8%22%2F%3E%0D%0A%20%20%3Cpath%20d%3D%22M12%203.75v3.5%22%2F%3E%0D%0A%20%20%3Ccircle%20cx%3D%2212%22%20cy%3D%223.75%22%20r%3D%220.85%22%2F%3E%0D%0A%3C%2Fsvg%3E%0D%0A');
}

.fuuvo-asset-ai-audio {
    --fuuvo-icon-asset: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%3E%0D%0A%3Cpath%20d%3D%22M4.25%209.75h3.1L12.75%205.5v13l-5.4-4.25H4.25z%22%2F%3E%0D%0A%20%20%3Cpath%20d%3D%22M16.1%209.35a3.85%203.85%200%200%201%200%205.3%22%2F%3E%0D%0A%20%20%3Cpath%20d%3D%22M18.7%207.15a6.6%206.6%200%200%201%200%209.7%22%2F%3E%0D%0A%3C%2Fsvg%3E%0D%0A');
}

.fuuvo-asset-audio {
    --fuuvo-icon-asset: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%3E%0D%0A%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%228.25%22%2F%3E%0D%0A%20%20%3Cpath%20d%3D%22M9%2014.25v-4.5%22%2F%3E%0D%0A%20%20%3Cpath%20d%3D%22M12%2016.5V7.5%22%2F%3E%0D%0A%20%20%3Cpath%20d%3D%22M15%2014.25v-4.5%22%2F%3E%0D%0A%3C%2Fsvg%3E%0D%0A');
}

.fuuvo-asset-edit-image {
    --fuuvo-icon-asset: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%3E%0D%0A%3Crect%20x%3D%223.4%22%20y%3D%224.85%22%20width%3D%2212.4%22%20height%3D%2210.3%22%20rx%3D%221.8%22%2F%3E%0D%0A%20%20%3Cpath%20d%3D%22M3.55%2013.2%206.85%209.9%209.15%2012.2%2011.05%2010.15%2015.7%2014.4%22%2F%3E%0D%0A%20%20%3Cpath%20d%3D%22M13.6%2014.35%2019.15%208.8a1.55%201.55%200%200%201%202.2%200l.05.05a1.55%201.55%200%200%201%200%202.2L15.85%2016.6%2012.9%2017.35z%22%2F%3E%0D%0A%20%20%3Cpath%20d%3D%22M17.45%2010.5%2019.7%2012.75%22%2F%3E%0D%0A%3C%2Fsvg%3E%0D%0A');
}

.fuuvo-asset-create-poster {
    --fuuvo-icon-asset: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%3E%0D%0A%3Crect%20x%3D%226%22%20y%3D%223.5%22%20width%3D%2212%22%20height%3D%2217%22%20rx%3D%221.8%22%2F%3E%0D%0A%20%20%3Crect%20x%3D%228.15%22%20y%3D%225.9%22%20width%3D%227.7%22%20height%3D%225.1%22%20rx%3D%220.8%22%2F%3E%0D%0A%20%20%3Cpath%20d%3D%22M8.25%2013.85h7.5%22%2F%3E%0D%0A%20%20%3Cpath%20d%3D%22M8.25%2016.65h5.1%22%2F%3E%0D%0A%3C%2Fsvg%3E%0D%0A');
}

.fuuvo-asset-ai-call {
    --fuuvo-icon-asset: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20aria-hidden%3D%22true%22%3E%0D%0A%3Cpath%20d%3D%22M8.15%203.75h2.7c.85%200%201.45.8%201.25%201.62l-.7%202.85a1.3%201.3%200%200%201-1.22.97l-1.28-.18a11.6%2011.6%200%200%200%206.84%206.84l-.18-1.28a1.3%201.3%200%200%201%20.97-1.22l2.85-.7c.82-.2%201.62.4%201.62%201.25v2.7A1.9%201.9%200%200%201%2019.25%2018.5%2015.4%2015.4%200%200%201%205.5%204.75a1.9%201.9%200%200%201%202.65-1z%22%2F%3E%0D%0A%3C%2Fsvg%3E%0D%0A');
}

html body :is(.home-rail-action-icon, .capability-icon, .mobile-chat-more-icon, .mobile-home-capability-icon, .home-core-feature-icon, .creation-category-icon) .fuuvo-asset-icon {
    width: 100%;
    height: 100%;
}

html body nav[data-fuuvo-workspace-rail="1"] .home-rail-action-icon .fuuvo-asset-icon {
    width: 23px;
    height: 23px;
}

html body .home-tool-drawer-item .capability-icon .fuuvo-asset-icon {
    width: 22px;
    height: 22px;
}

html body .mobile-chat-more-icon .fuuvo-asset-icon,
html body .mobile-home-capability-icon .fuuvo-asset-icon {
    width: 100%;
    height: 100%;
}

/* Keep the homepage capability row visually even when source SVGs use different path bounds. */
html body.chat-landing[data-mode="chat"] .home-tool-drawer-item .capability-icon > :is(.fuuvo-asset-icon, .fuuvo-linear-svg) {
    width: 22px !important;
    height: 22px !important;
    max-width: 22px !important;
    max-height: 22px !important;
    flex: 0 0 22px !important;
    transform: none !important;
}

html body .research-tool-card .research-tool-art-linear {
    width: 56px;
    height: 56px;
    flex: 0 0 56px;
    margin: 24px 0 15px;
    display: inline-flex;
    color: var(--creation-blue);
}

@media (max-width: 560px) {
    html body .research-tool-card .research-tool-art-linear {
        width: 48px;
        height: 48px;
        flex-basis: 48px;
        margin-top: 18px;
    }
}

/* Source: public/static/css/fuuvo-chat-attachments.css */
/* Attachment previews inside the chat composer. Keep previews in their own
 * top row so pasted images never sit underneath typed text. */
body[data-mode="chat"] .chat-input-wrap.has-attachments .chat-attachment-bar:not(.hidden) {
    position: absolute;
    top: 9px;
    left: 14px;
    right: 14px;
    z-index: 6;
    display: block;
    width: auto;
    max-width: none;
    min-height: 0;
    margin: 0;
    padding: 0;
    overflow: visible;
    border: 0;
    background: transparent;
}

body[data-mode="chat"] .chat-input-wrap .chat-attachment-list {
    width: 100%;
    max-width: 100%;
    flex-wrap: nowrap;
    align-items: flex-start;
    gap: 8px;
    padding: 5px 7px 4px 4px;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-padding-inline: 4px;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-x;
    cursor: grab;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
}

body[data-mode="chat"] .chat-input-wrap .chat-attachment-list.is-pointer-dragging {
    cursor: grabbing;
    scroll-behavior: auto;
    user-select: none;
}

body[data-mode="chat"] .chat-input-wrap .chat-attachment-list::-webkit-scrollbar {
    display: none;
}

body[data-mode="chat"] .chat-input-wrap .chat-attachment-meta,
body[data-mode="chat"] .chat-input-wrap .chat-attachment-copy {
    display: none !important;
}

body[data-mode="chat"] .chat-input-wrap .chat-attachment-chip {
    position: relative;
    display: block;
    width: 52px;
    min-width: 52px;
    max-width: 52px;
    min-height: 52px;
    height: 52px;
    flex: 0 0 52px;
    padding: 0;
    overflow: visible;
    border: 1px solid rgba(15, 23, 42, .1);
    border-radius: 12px;
    background: #eef2f7;
    box-shadow: 0 3px 10px rgba(15, 23, 42, .08);
    scroll-snap-align: start;
}

body[data-mode="chat"] .chat-input-wrap .chat-attachment-thumb {
    display: block;
    width: 50px;
    height: 50px;
    overflow: hidden;
    border-radius: 11px;
    background: #e9eef7;
}

body[data-mode="chat"] .chat-input-wrap .chat-attachment-chip img,
body[data-mode="chat"] .chat-input-wrap .chat-attachment-chip video {
    width: 50px;
    height: 50px;
    display: block;
    border-radius: 11px;
    object-fit: cover;
}

body[data-mode="chat"] .chat-input-wrap .chat-attachment-chip > .chat-file-icon {
    width: 50px;
    height: 50px;
    border-radius: 11px;
    font-size: 9px;
}

body[data-mode="chat"] .chat-input-wrap .chat-attachment-state {
    inset: 1px;
    grid-template-columns: minmax(0, 1fr);
    gap: 3px;
    padding: 3px 2px;
    box-sizing: border-box;
    overflow: hidden;
    border-radius: 11px;
    font-size: 8px !important;
    line-height: 1.15;
}

body[data-mode="chat"] .chat-input-wrap .chat-attachment-state .chat-attachment-spinner {
    width: 14px;
    height: 14px;
    box-sizing: border-box;
}

body[data-mode="chat"] .chat-input-wrap .chat-attachment-state-label {
    display: block;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    margin: 0;
    overflow: hidden;
    color: inherit;
    font-size: 8px !important;
    font-weight: 700;
    line-height: 1.15 !important;
    letter-spacing: 0 !important;
    text-align: center;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: normal;
}

body[data-mode="chat"] .chat-input-wrap .chat-attachment-chip[data-upload-status="uploading"] .chat-attachment-state-label {
    white-space: nowrap;
    overflow-wrap: normal;
    word-break: keep-all;
}

body[data-mode="chat"] .chat-input-wrap .chat-attachment-remove {
    position: absolute;
    top: -6px;
    right: -6px;
    transform: none;
    width: 20px !important;
    min-width: 20px !important;
    max-width: 20px !important;
    height: 20px !important;
    min-height: 20px !important;
    max-height: 20px !important;
    padding: 0 !important;
    border: 1px solid rgba(15, 23, 42, .14);
    border-radius: 999px;
    background: #fff;
    color: #475569;
    font-size: 0;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 4;
    box-shadow: 0 2px 7px rgba(15, 23, 42, .18);
    transition: border-color .16s ease, background-color .16s ease, color .16s ease, transform .16s ease;
}

body[data-mode="chat"] .chat-input-wrap .chat-attachment-remove svg {
    width: 10px;
    height: 10px;
    display: block;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
}

body[data-mode="chat"] .chat-input-wrap .chat-attachment-remove:is(:hover, :focus-visible) {
    border-color: #dc2626;
    background: #dc2626;
    color: #fff;
    transform: scale(1.06);
}

body[data-mode="chat"] .chat-input-wrap.has-attachments {
    min-height: 176px !important;
    height: auto !important;
}

html body[data-mode="chat"] .chat-input-wrap.has-attachments #chat-input {
    min-height: 176px !important;
    padding-top: 78px !important;
}

html body[data-mode="chat"] .chat-input-wrap.has-attachments .chat-input-hint {
    top: 78px !important;
}

/* Push-to-talk is shared by the home composer and conversation detail. This
 * stylesheet loads after the global responsive/workstation layers, so these
 * rules deliberately override their generic square icon-button constraints. */
html body[data-mode="chat"] #chat-compose-field .chat-voice-btn.is-hold-to-talk {
    width: 42px !important;
    min-width: 42px !important;
    max-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
    max-height: 42px !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0 !important;
    flex: 0 0 auto !important;
    border: 1px solid rgba(15, 23, 42, 0.06) !important;
    border-radius: 50% !important;
    background: #f8fafc !important;
    color: #475569 !important;
    box-shadow: none !important;
    font-size: 12px !important;
    font-weight: 650 !important;
    line-height: 1 !important;
    touch-action: none !important;
    -webkit-user-select: none !important;
    user-select: none !important;
    -webkit-touch-callout: none !important;
}

html body[data-mode="chat"] #chat-compose-field .chat-voice-btn.is-hold-to-talk *,
html body.voice-hold-open,
html body.voice-hold-open * {
    -webkit-user-select: none !important;
    user-select: none !important;
    -webkit-touch-callout: none !important;
}

html body[data-mode="chat"] #chat-compose-field .chat-voice-btn.is-hold-to-talk > * {
    pointer-events: none !important;
}

html body.voice-hold-open {
    overscroll-behavior: none !important;
}

html body[data-mode="chat"] #chat-compose-field .chat-voice-btn.is-hold-to-talk .chat-voice-label {
    display: none !important;
}

html body[data-mode="chat"] #chat-compose-field .chat-voice-btn.is-hold-to-talk svg {
    width: 18px !important;
    height: 18px !important;
    flex: 0 0 18px !important;
}

html body[data-mode="chat"] #chat-compose-field .chat-voice-btn.is-hold-to-talk:hover {
    border-color: rgba(37, 99, 235, 0.28) !important;
    background: rgba(37, 99, 235, 0.13) !important;
    color: #1d4ed8 !important;
    transform: none !important;
}

html body[data-mode="chat"] #chat-compose-field .chat-voice-btn.is-hold-to-talk.is-hold-active,
html body[data-mode="chat"] #chat-compose-field .chat-voice-btn.is-hold-to-talk.is-listening {
    border-color: rgba(37, 99, 235, 0.42) !important;
    background: #2563eb !important;
    color: #fff !important;
    box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.14) !important;
    transform: scale(0.98) !important;
}

html body[data-mode="chat"] #chat-compose-field .chat-voice-btn.is-hold-to-talk.is-processing {
    border-color: rgba(37, 99, 235, 0.22) !important;
    background: rgba(37, 99, 235, 0.1) !important;
    color: #1d4ed8 !important;
    box-shadow: none !important;
    cursor: wait !important;
    opacity: 1 !important;
}

/* The composer actions sit on their own bottom row. Reserving their width on
 * every textarea line caused both the landing and conversation composers to
 * wrap around the middle of the field. Keep the text area full-width and
 * reserve vertical space for the action row instead. */
@media (min-width: 921px) {
    html body.chat-landing[data-mode="chat"] #chat-compose-field .chat-voice-btn.is-hold-to-talk {
        width: 46px !important;
        min-width: 46px !important;
        max-width: 46px !important;
        height: 46px !important;
        min-height: 46px !important;
        max-height: 46px !important;
    }

    html body[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) textarea {
        min-height: 104px !important;
        padding-right: 18px !important;
        padding-bottom: 72px !important;
    }

    html body[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) .chat-input-hint {
        right: 18px !important;
    }

    /* The normal landing composer uses the same separated action row as the
     * attachment state. Keeping the buttons in document flow prevents long,
     * scrolled text from ever moving underneath them. */
    html body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) {
        display: flex !important;
        flex-direction: column !important;
        padding: 8px 12px 10px !important;
        box-sizing: border-box !important;
    }

    html body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) #chat-input {
        flex: 1 1 auto !important;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 0 !important;
        height: auto !important;
        padding: 14px 16px 8px !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        box-sizing: border-box !important;
    }

    html body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) .chat-input-tools {
        position: relative !important;
        inset: auto !important;
        flex: 0 0 46px !important;
        width: 100% !important;
        min-height: 46px !important;
        height: 46px !important;
        padding: 0 !important;
        box-sizing: border-box !important;
    }

    html body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) .chat-input-hint {
        top: 22px !important;
        right: 28px !important;
        left: 28px !important;
    }

    /* Conversation detail follows the landing composer: text and actions are
     * separate flex rows. The legacy absolute action row could sit over long
     * or scrolled text, making the upload, voice and send controls cover it. */
    html body.chat-detail-open[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) {
        display: flex !important;
        flex-direction: column !important;
        min-height: 154px !important;
        height: 154px !important;
        padding: 8px 12px 10px !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
    }

    html body.chat-detail-open[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) #chat-input {
        flex: 1 1 auto !important;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 0 !important;
        height: auto !important;
        padding: 14px 16px 8px !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        box-sizing: border-box !important;
    }

    html body.chat-detail-open[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) .chat-input-tools {
        position: relative !important;
        inset: auto !important;
        flex: 0 0 46px !important;
        width: 100% !important;
        min-height: 46px !important;
        height: 46px !important;
        padding: 0 !important;
        box-sizing: border-box !important;
    }

    html body.chat-detail-open[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) .chat-input-hint {
        top: 22px !important;
        right: 28px !important;
        left: 28px !important;
    }

    /* Landing composer with attachments has three visual rows: previews,
     * editable text and actions. Do not reserve the action buttons' width on
     * every text line, and leave enough vertical room so the upload button
     * can never cover typed content. */
    html body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap.has-attachments {
        display: flex !important;
        flex-direction: column !important;
        min-height: 224px !important;
        height: 224px !important;
        padding: 8px 12px 10px !important;
        box-sizing: border-box !important;
    }

    html body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap.has-attachments .chat-attachment-bar:not(.hidden) {
        position: relative !important;
        inset: auto !important;
        flex: 0 0 61px !important;
        width: 100% !important;
        min-width: 0 !important;
        height: 61px !important;
    }

    html body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap.has-attachments #chat-input {
        flex: 1 1 auto !important;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 0 !important;
        height: auto !important;
        padding: 6px 16px 8px !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        box-sizing: border-box !important;
    }

    html body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap.has-attachments .chat-input-tools {
        position: relative !important;
        inset: auto !important;
        flex: 0 0 46px !important;
        width: 100% !important;
        min-height: 46px !important;
        height: 46px !important;
        padding: 0 !important;
        box-sizing: border-box !important;
    }

    html body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap.has-attachments .chat-input-hint {
        top: 75px !important;
        right: 28px !important;
        left: 28px !important;
    }
}

/* The rounded composer shell owns the dark surface. Its text, attachment and
 * action rows remain transparent so the input never appears split into two
 * different dark colors. */
html body[data-ui-theme="dark"][data-mode="chat"] #chat-compose-field .chat-input-wrap {
    background: var(--fuuvo-dark-input, #161e29) !important;
    background-image: none !important;
}

html body[data-ui-theme="dark"][data-mode="chat"] #chat-compose-field .chat-input-wrap > :is(#chat-input, .chat-input-tools, .chat-attachment-bar) {
    background: transparent !important;
    background-image: none !important;
}

html body[data-ui-theme="dark"][data-mode="chat"] #chat-compose-field .chat-voice-btn.is-hold-to-talk {
    border-color: var(--fuuvo-dark-line-strong) !important;
    background: #18212d !important;
    color: var(--fuuvo-dark-text-soft, #d7e2f3) !important;
}

html body[data-ui-theme="dark"][data-mode="chat"] #chat-compose-field .chat-voice-btn.is-hold-to-talk.is-hold-active,
html body[data-ui-theme="dark"][data-mode="chat"] #chat-compose-field .chat-voice-btn.is-hold-to-talk.is-listening {
    border-color: rgba(147, 197, 253, 0.58) !important;
    background: #2563eb !important;
    color: #fff !important;
    box-shadow: 0 0 0 4px rgba(96, 165, 250, 0.2) !important;
}

html body[data-ui-theme="dark"][data-mode="chat"] #chat-compose-field .chat-voice-btn.is-hold-to-talk.is-processing {
    border-color: rgba(125, 181, 255, 0.34) !important;
    background: rgba(59, 130, 246, 0.18) !important;
    color: #bfdbfe !important;
}

@media (max-width: 920px) {
    html body[data-ui-theme="dark"][data-mode="chat"] #chat-compose-field .chat-voice-btn.is-hold-to-talk {
        background: var(--fuuvo-dark-input, #161e29) !important;
    }

    html body[data-mode="chat"] #chat-compose-field .chat-voice-btn.is-hold-to-talk {
        width: 38px !important;
        min-width: 38px !important;
        max-width: 38px !important;
        height: 38px !important;
        min-height: 38px !important;
        max-height: 38px !important;
        padding: 0 !important;
        gap: 0 !important;
        border-radius: 50% !important;
        font-size: 12px !important;
        font-weight: 650 !important;
        -webkit-tap-highlight-color: transparent !important;
    }

    html body[data-mode="chat"] #chat-compose-field .chat-voice-btn.is-hold-to-talk svg {
        width: 17px !important;
        height: 17px !important;
        flex-basis: 17px !important;
    }

    html body[data-mode="chat"] #chat-compose-field .chat-input-wrap textarea {
        /* The action buttons only occupy the bottom row. Reserving their full
         * width on every text line made the mobile composer wrap after just a
         * few characters. Keep the normal horizontal text area and rely on
         * the existing bottom padding to clear the tool row. */
        padding-right: 16px !important;
        padding-bottom: 58px !important;
    }

    html body[data-mode="chat"] #chat-compose-field .chat-input-wrap .chat-input-hint {
        right: 16px !important;
    }

    html body[data-mode="chat"] #chat-compose-field .chat-voice-status {
        margin-right: auto !important;
        margin-left: auto !important;
    }

    html body[data-mode="chat"] #chat-compose-field .chat-voice-btn.is-hold-to-talk.is-cancelling {
        border-color: rgba(239, 68, 68, 0.72) !important;
        background: #dc2626 !important;
        color: #fff !important;
        box-shadow: 0 0 0 4px rgba(239, 68, 68, 0.18) !important;
    }

    html body[data-ui-theme="dark"][data-mode="chat"] #chat-compose-field .chat-voice-btn.is-hold-to-talk.is-cancelling {
        border-color: rgba(252, 165, 165, 0.76) !important;
        background: #dc2626 !important;
        color: #fff !important;
        box-shadow: 0 0 0 4px rgba(248, 113, 113, 0.2) !important;
    }

    /* Conversation detail uses one compact action row. Keep the editable area
     * short for one line, allow it to grow for wrapped content, and pin every
     * action to the same baseline without changing the landing composer. */
    html body.chat-detail-open[data-mode="chat"] #chat-compose-field .chat-input-wrap {
        min-height: 80px !important;
        height: auto !important;
        border-radius: 16px !important;
        overflow: hidden !important;
    }

    html body.chat-detail-open[data-mode="chat"] #chat-compose-field #chat-input {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 80px !important;
        max-height: 148px !important;
        padding: 12px 14px 54px !important;
        white-space: pre-wrap !important;
        overflow-wrap: anywhere !important;
        word-break: break-word !important;
        overflow-x: hidden !important;
        box-sizing: border-box !important;
    }

    html body.chat-detail-open[data-mode="chat"] #chat-compose-field .chat-input-tools {
        position: absolute !important;
        inset: auto 10px 8px 10px !important;
        width: auto !important;
        height: 38px !important;
        min-height: 38px !important;
        padding: 0 !important;
        align-items: center !important;
        box-sizing: border-box !important;
    }

    html body.chat-detail-open[data-mode="chat"] #chat-compose-field #chat-upload-btn {
        width: 38px !important;
        min-width: 38px !important;
        height: 38px !important;
        min-height: 38px !important;
        border-radius: 50% !important;
        flex: 0 0 38px !important;
    }

    html body.chat-detail-open[data-mode="chat"] #chat-compose-field .chat-input-action-group {
        height: 38px !important;
        align-items: center !important;
        gap: 10px !important;
    }

    html body.chat-detail-open[data-mode="chat"] #chat-compose-field .send-btn {
        width: 38px !important;
        min-width: 38px !important;
        max-width: 38px !important;
        height: 38px !important;
        min-height: 38px !important;
        max-height: 38px !important;
        padding: 0 !important;
        border-radius: 50% !important;
        flex: 0 0 38px !important;
        box-sizing: border-box !important;
    }

    html body.chat-detail-open[data-mode="chat"] #chat-compose-field .send-btn svg {
        width: 18px !important;
        height: 18px !important;
    }

    html body.chat-detail-open[data-mode="chat"] #chat-compose-field .chat-input-wrap > .mobile-chat-toolbar {
        position: absolute !important;
        right: auto !important;
        bottom: 8px !important;
        left: 58px !important;
        width: auto !important;
        min-height: 38px !important;
        height: 38px !important;
        margin: 0 !important;
        padding: 0 !important;
        align-items: center !important;
    }

    html body.chat-detail-open[data-mode="chat"] #chat-compose-field #mobile-chat-more-btn {
        width: auto !important;
        min-width: 68px !important;
        height: 38px !important;
        min-height: 38px !important;
        max-height: 38px !important;
        padding: 0 10px !important;
        gap: 6px !important;
        border-radius: 19px !important;
        font-size: 12px !important;
        line-height: 1 !important;
        box-sizing: border-box !important;
    }

    html body.chat-detail-open[data-mode="chat"] #chat-compose-field #mobile-chat-more-btn .mobile-chat-toolbar-icon,
    html body.chat-detail-open[data-mode="chat"] #chat-compose-field #mobile-chat-more-btn .mobile-chat-toolbar-icon svg {
        width: 14px !important;
        height: 14px !important;
        flex-basis: 14px !important;
    }
}

/* Keep the chat shell anchored while the software keyboard is open. Safari
 * and embedded iOS WebViews already position fixed content against the visual
 * viewport; applying visualViewport.offsetTop here moves the shell twice and
 * can leave only a blank page above the keyboard. */
@media (max-width: 920px) {
    html.mobile-chat-input-focused {
        overflow: hidden !important;
        overscroll-behavior: none !important;
        scroll-behavior: auto !important;
    }

    html body.chat-detail-open[data-mode="chat"].mobile-chat-input-focused.mobile-keyboard-open {
        position: fixed !important;
        top: 0 !important;
        right: auto !important;
        bottom: auto !important;
        left: 0 !important;
        width: 100% !important;
        height: var(--mobile-viewport-height, 100dvh) !important;
        min-height: var(--mobile-viewport-height, 100dvh) !important;
        max-height: var(--mobile-viewport-height, 100dvh) !important;
        box-sizing: border-box !important;
        overscroll-behavior: none !important;
    }

    html body.chat-detail-open[data-mode="chat"] .result-content,
    html body.chat-detail-open[data-mode="chat"] .chat-area,
    html body.chat-detail-open[data-mode="chat"] .composer,
    html body.chat-detail-open[data-mode="chat"] #chat-input {
        overflow-anchor: none;
    }

    html body.chat-detail-open[data-mode="chat"] #chat-input {
        scroll-margin: 0 !important;
    }

    html body.chat-detail-open[data-mode="chat"].mobile-keyboard-open .result-content {
        overscroll-behavior: none !important;
    }
}

/* Shared hold-to-talk gesture surface. It stays pointer-transparent so the
 * active touch or pointer remains owned by the composer gesture listeners. */
.voice-hold-overlay {
    display: none;
}

@keyframes voice-hold-wave {
    from { transform: scaleY(.55); opacity: .62; }
    to { transform: scaleY(1.08); opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
    .voice-hold-wave i { animation: none !important; }
    .voice-hold-panel,
    .voice-hold-cancel-zone { transition: none !important; }
}

@media (min-width: 921px) {
    html body[data-mode="chat"] #chat-compose-field .chat-voice-btn.is-hold-to-talk.is-cancelling,
    html body[data-ui-theme="dark"][data-mode="chat"] #chat-compose-field .chat-voice-btn.is-hold-to-talk.is-cancelling {
        border-color: rgba(239, 68, 68, 0.72) !important;
        background: #dc2626 !important;
        color: #fff !important;
        box-shadow: 0 0 0 4px rgba(239, 68, 68, 0.18) !important;
    }

    .voice-hold-overlay:not(.hidden) {
        position: fixed;
        inset: 0;
        z-index: 2200;
        padding: 0 24px 118px;
        display: flex;
        align-items: flex-end;
        justify-content: center;
        pointer-events: none;
        background: linear-gradient(180deg, transparent 56%, rgba(15, 23, 42, 0.07) 100%);
    }

    .voice-hold-panel {
        width: 280px;
        min-height: 148px;
        padding: 20px 20px 17px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 8px;
        border: 1px solid rgba(255, 255, 255, 0.2);
        border-radius: 26px;
        background: rgba(15, 23, 42, 0.9);
        color: #fff;
        box-shadow: 0 20px 54px rgba(15, 23, 42, 0.25);
        -webkit-backdrop-filter: blur(18px);
        backdrop-filter: blur(18px);
        transition: background .16s ease, transform .16s ease, box-shadow .16s ease;
    }

    .voice-hold-mic {
        width: 42px;
        height: 42px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        background: rgba(96, 165, 250, 0.2);
        color: #bfdbfe;
    }

    .voice-hold-mic svg { width: 24px; height: 24px; }

    .voice-hold-wave {
        height: 16px;
        display: inline-flex;
        align-items: center;
        gap: 3px;
    }

    .voice-hold-wave i {
        width: 3px;
        height: 6px;
        border-radius: 999px;
        background: #93c5fd;
        animation: voice-hold-wave .8s ease-in-out infinite alternate;
    }

    .voice-hold-wave i:nth-child(2),
    .voice-hold-wave i:nth-child(4) { animation-delay: -.28s; height: 11px; }
    .voice-hold-wave i:nth-child(3) { animation-delay: -.52s; height: 15px; }

    .voice-hold-panel strong {
        font-size: 16px;
        font-weight: 700;
        line-height: 1.3;
    }

    .voice-hold-hint {
        color: rgba(255, 255, 255, 0.72);
        font-size: 12px;
        line-height: 1.45;
        text-align: center;
    }

    .voice-hold-cancel-zone {
        position: absolute;
        left: 50%;
        bottom: 288px;
        min-width: 132px;
        min-height: 40px;
        padding: 7px 14px 7px 10px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 7px;
        border: 1px solid rgba(100, 116, 139, 0.2);
        border-radius: 999px;
        background: rgba(255, 255, 255, 0.94);
        color: #475569;
        box-shadow: 0 8px 24px rgba(15, 23, 42, 0.12);
        font-size: 12px;
        font-weight: 650;
        transform: translate(-50%, 10px);
        transition: color .16s ease, background .16s ease, border-color .16s ease, transform .16s ease;
    }

    .voice-hold-cancel-icon {
        width: 22px;
        height: 22px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        background: #eef2f7;
    }

    .voice-hold-cancel-icon svg { width: 15px; height: 15px; }

    .voice-hold-overlay.is-cancelling .voice-hold-panel {
        background: rgba(153, 27, 27, 0.94);
        box-shadow: 0 20px 54px rgba(127, 29, 29, 0.32);
        transform: scale(1.015);
    }

    .voice-hold-overlay.is-cancelling .voice-hold-mic {
        background: rgba(254, 202, 202, 0.2);
        color: #fee2e2;
    }

    .voice-hold-overlay.is-cancelling .voice-hold-wave i {
        background: #fecaca;
        animation-play-state: paused;
    }

    .voice-hold-overlay.is-cancelling .voice-hold-cancel-zone {
        border-color: rgba(239, 68, 68, 0.45);
        background: #dc2626;
        color: #fff;
        transform: translate(-50%, 0) scale(1.04);
    }

    .voice-hold-overlay.is-cancelling .voice-hold-cancel-icon {
        background: rgba(255, 255, 255, 0.18);
    }

    body[data-ui-theme="dark"] .voice-hold-cancel-zone {
        border-color: rgba(148, 163, 184, 0.28);
        background: rgba(30, 41, 59, 0.96);
        color: #e2e8f0;
        box-shadow: 0 8px 26px rgba(0, 0, 0, 0.3);
    }

    body[data-ui-theme="dark"] .voice-hold-cancel-icon {
        background: rgba(148, 163, 184, 0.16);
    }

    body[data-ui-theme="dark"] .voice-hold-overlay.is-cancelling .voice-hold-cancel-zone {
        border-color: rgba(252, 165, 165, 0.52);
        background: #dc2626;
        color: #fff;
    }
}

@media (max-width: 920px) {
    .voice-hold-overlay:not(.hidden) {
        position: fixed;
        inset: 0;
        z-index: 2200;
        padding: 0 18px calc(124px + env(safe-area-inset-bottom, 0px));
        display: flex;
        align-items: flex-end;
        justify-content: center;
        pointer-events: none;
        background: linear-gradient(180deg, transparent 47%, rgba(15, 23, 42, 0.08) 100%);
    }

    .voice-hold-panel {
        width: min(248px, calc(100vw - 48px));
        min-height: 142px;
        padding: 20px 18px 17px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 8px;
        border: 1px solid rgba(255, 255, 255, 0.2);
        border-radius: 26px;
        background: rgba(15, 23, 42, 0.9);
        color: #fff;
        box-shadow: 0 18px 48px rgba(15, 23, 42, 0.28);
        -webkit-backdrop-filter: blur(18px);
        backdrop-filter: blur(18px);
        transition: background .16s ease, transform .16s ease, box-shadow .16s ease;
    }

    .voice-hold-mic {
        width: 42px;
        height: 42px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        background: rgba(96, 165, 250, 0.2);
        color: #bfdbfe;
    }

    .voice-hold-mic svg {
        width: 24px;
        height: 24px;
    }

    .voice-hold-wave {
        height: 16px;
        display: inline-flex;
        align-items: center;
        gap: 3px;
    }

    .voice-hold-wave i {
        width: 3px;
        height: 6px;
        border-radius: 999px;
        background: #93c5fd;
        animation: voice-hold-wave .8s ease-in-out infinite alternate;
    }

    .voice-hold-wave i:nth-child(2),
    .voice-hold-wave i:nth-child(4) { animation-delay: -.28s; height: 11px; }
    .voice-hold-wave i:nth-child(3) { animation-delay: -.52s; height: 15px; }

    .voice-hold-panel strong {
        font-size: 16px;
        font-weight: 700;
        line-height: 1.3;
    }

    .voice-hold-hint {
        color: rgba(255, 255, 255, 0.72);
        font-size: 12px;
        line-height: 1.45;
        text-align: center;
    }

    .voice-hold-cancel-zone {
        position: absolute;
        left: 50%;
        bottom: calc(284px + env(safe-area-inset-bottom, 0px));
        min-width: 116px;
        min-height: 38px;
        padding: 7px 13px 7px 9px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 6px;
        border: 1px solid rgba(100, 116, 139, 0.2);
        border-radius: 999px;
        background: rgba(255, 255, 255, 0.92);
        color: #475569;
        box-shadow: 0 8px 24px rgba(15, 23, 42, 0.12);
        font-size: 12px;
        font-weight: 650;
        transform: translate(-50%, 10px);
        transition: color .16s ease, background .16s ease, border-color .16s ease, transform .16s ease;
    }

    .voice-hold-cancel-icon {
        width: 22px;
        height: 22px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        background: #eef2f7;
    }

    .voice-hold-cancel-icon svg {
        width: 15px;
        height: 15px;
    }

    .voice-hold-overlay.is-cancelling .voice-hold-panel {
        background: rgba(153, 27, 27, 0.94);
        box-shadow: 0 18px 48px rgba(127, 29, 29, 0.34);
        transform: scale(1.015);
    }

    .voice-hold-overlay.is-cancelling .voice-hold-mic {
        background: rgba(254, 202, 202, 0.2);
        color: #fee2e2;
    }

    .voice-hold-overlay.is-cancelling .voice-hold-wave i {
        background: #fecaca;
        animation-play-state: paused;
    }

    .voice-hold-overlay.is-cancelling .voice-hold-cancel-zone {
        border-color: rgba(239, 68, 68, 0.45);
        background: #dc2626;
        color: #fff;
        transform: translate(-50%, 0) scale(1.04);
    }

    .voice-hold-overlay.is-cancelling .voice-hold-cancel-icon {
        background: rgba(255, 255, 255, 0.18);
    }

    body[data-ui-theme="dark"] .voice-hold-cancel-zone {
        border-color: rgba(148, 163, 184, 0.28);
        background: rgba(30, 41, 59, 0.96);
        color: #e2e8f0;
        box-shadow: 0 8px 26px rgba(0, 0, 0, 0.3);
    }

    body[data-ui-theme="dark"] .voice-hold-cancel-icon {
        background: rgba(148, 163, 184, 0.16);
    }

    body[data-ui-theme="dark"] .voice-hold-overlay.is-cancelling .voice-hold-cancel-zone {
        border-color: rgba(252, 165, 165, 0.52);
        background: #dc2626;
        color: #fff;
    }

}

/* Conversation-detail dark surfaces. This layer loads after the legacy chat
 * styles, so light response and follow-up cards cannot leak into dark mode. */
html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] .chat-bubble.assistant,
html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] .chat-bubble.system {
    border-color: var(--fuuvo-dark-line) !important;
    background: var(--fuuvo-dark-surface) !important;
    background-image: none !important;
    color: var(--fuuvo-dark-text-soft) !important;
    box-shadow: none !important;
    filter: none !important;
}

html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] .chat-bubble.assistant :is(.chat-plain, .chat-markdown),
html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] .chat-bubble.system :is(.chat-plain, .chat-markdown) {
    color: var(--fuuvo-dark-text-soft) !important;
    -webkit-text-fill-color: currentColor !important;
}

/* Preserve markdown hierarchy inside dark conversation bubbles. A single
 * inherited light color made bold, italic and other semantic text look almost
 * identical to body copy, especially on phone displays. */
html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] :is(.chat-bubble.assistant, .chat-bubble.system) .chat-markdown :is(h1, h2) {
    color: #ffffff !important;
    -webkit-text-fill-color: currentColor !important;
}

html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] :is(.chat-bubble.assistant, .chat-bubble.system) .chat-markdown :is(h3, h4, h5, h6) {
    color: #dce9fb !important;
    -webkit-text-fill-color: currentColor !important;
}

html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] :is(.chat-bubble.assistant, .chat-bubble.system) .chat-markdown :is(strong, b) {
    color: #ffffff !important;
    -webkit-text-fill-color: currentColor !important;
    font-weight: 800 !important;
    letter-spacing: .008em;
}

html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] :is(.chat-bubble.assistant, .chat-bubble.system) .chat-markdown :is(em, i) {
    color: #c6dcfb !important;
    -webkit-text-fill-color: currentColor !important;
    font-style: italic !important;
    font-weight: 500;
}

html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] :is(.chat-bubble.assistant, .chat-bubble.system) .chat-markdown a {
    color: #8fc1ff !important;
    -webkit-text-fill-color: currentColor !important;
    text-decoration-line: underline !important;
    text-decoration-thickness: 1.5px !important;
    text-underline-offset: 3px !important;
    text-decoration-color: rgba(143, 193, 255, .72) !important;
}

html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] :is(.chat-bubble.assistant, .chat-bubble.system) .chat-markdown a:is(:hover, :focus-visible) {
    color: #b9d8ff !important;
    text-decoration-color: currentColor !important;
}

html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] :is(.chat-bubble.assistant, .chat-bubble.system) .chat-markdown mark {
    padding: 0 .2em;
    border-radius: 4px;
    background: rgba(245, 158, 11, .24) !important;
    color: #fff4cf !important;
    -webkit-text-fill-color: currentColor !important;
}

html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] :is(.chat-bubble.assistant, .chat-bubble.system) .chat-markdown :is(del, s) {
    color: #93a4ba !important;
    -webkit-text-fill-color: currentColor !important;
    text-decoration-color: #b8c5d8 !important;
}

html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] :is(.chat-bubble.assistant, .chat-bubble.system) .chat-markdown li::marker {
    color: #82b7ff !important;
    font-weight: 700;
}

html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] :is(.chat-bubble.assistant, .chat-bubble.system) .chat-markdown blockquote {
    margin: 14px 0;
    padding: 10px 14px;
    border-left: 3px solid #6da8f7;
    border-radius: 0 10px 10px 0;
    background: rgba(59, 130, 246, .09) !important;
    color: #cbd9ec !important;
    -webkit-text-fill-color: currentColor !important;
}

html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] :is(.chat-bubble.assistant, .chat-bubble.system) .chat-markdown hr {
    border-top-color: rgba(148, 163, 184, .32) !important;
}

html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] :is(.chat-bubble.assistant, .chat-bubble.system) .chat-markdown code {
    border: 1px solid rgba(148, 163, 184, .16);
    background: rgba(8, 15, 28, .58) !important;
    color: #eaf2ff !important;
    -webkit-text-fill-color: currentColor !important;
}

html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] :is(.chat-bubble.assistant, .chat-bubble.system) .chat-markdown pre {
    max-width: 100%;
    margin: 14px 0;
    padding: 12px 14px;
    overflow-x: auto;
    border: 1px solid rgba(148, 163, 184, .16);
    border-radius: 12px;
    background: #0b1220 !important;
    color: #e2eaf7 !important;
    -webkit-text-fill-color: currentColor !important;
}

html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] :is(.chat-bubble.assistant, .chat-bubble.system) .chat-markdown pre code {
    padding: 0;
    border: 0;
    background: transparent !important;
}

html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] :is(.chat-bubble.assistant, .chat-bubble.system) .chat-markdown kbd {
    border-color: rgba(148, 163, 184, .34) !important;
    background: #1b2637 !important;
    color: #edf3fc !important;
    -webkit-text-fill-color: currentColor !important;
}

html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] :is(.chat-bubble.assistant, .chat-bubble.system) .chat-markdown small {
    color: #9eafc5 !important;
    -webkit-text-fill-color: currentColor !important;
}

html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] :is(.chat-bubble.assistant, .chat-bubble.system) .chat-markdown details {
    border-color: rgba(148, 163, 184, .18) !important;
    background: rgba(8, 15, 28, .3) !important;
}

html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] :is(.chat-bubble.assistant, .chat-bubble.system) .chat-markdown summary {
    color: #e7effb !important;
    -webkit-text-fill-color: currentColor !important;
}

html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] :is(.chat-bubble.assistant, .chat-bubble.system) .chat-markdown th {
    color: #f5f8fd !important;
    -webkit-text-fill-color: currentColor !important;
    font-weight: 800 !important;
}

html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] :is(.chat-bubble.assistant, .chat-bubble.system) .chat-markdown td {
    color: #d4deec !important;
    -webkit-text-fill-color: currentColor !important;
}

html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] .chat-bubble.assistant .bubble-actions :is(.quote-btn, .copy-btn),
html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] .chat-bubble.system .bubble-actions :is(.quote-btn, .copy-btn) {
    border: 1px solid rgba(111, 162, 229, .58) !important;
    background: rgba(43, 94, 164, .38) !important;
    background-image: none !important;
    color: #f3f8ff !important;
    -webkit-text-fill-color: currentColor !important;
    box-shadow: 0 4px 12px rgba(2, 8, 23, .22) !important;
}

html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] :is(.chat-bubble.assistant, .chat-bubble.system) .bubble-actions :is(.quote-btn, .copy-btn):is(:hover, :focus-visible, :active) {
    border-color: #7eb6ff !important;
    background: rgba(50, 119, 216, .58) !important;
    color: #ffffff !important;
}

html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] :is(.chat-bubble.assistant, .chat-bubble.system) .bubble-actions .copy-btn svg {
    color: currentColor !important;
    stroke: currentColor !important;
    opacity: 1 !important;
}

html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] .chat-quote-bar,
html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] .clarification-banner {
    border-color: var(--fuuvo-dark-line-strong) !important;
    background: var(--fuuvo-dark-surface-raised) !important;
    background-image: none !important;
    color: var(--fuuvo-dark-text-soft) !important;
    box-shadow: 0 14px 34px rgba(2, 6, 23, .26) !important;
    filter: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
}

html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] .chat-quote-text,
html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] .clarification-banner :is(strong, span, p) {
    color: var(--fuuvo-dark-text-soft) !important;
    -webkit-text-fill-color: currentColor !important;
}

/* Keep completed and failed assistant messages dark even while the chat shell
 * is switching from its optimistic loading state to the persisted message. */
html body[data-ui-theme="dark"] .chat-bubble.assistant,
html body[data-ui-theme="dark"] .chat-bubble.system {
    border-color: var(--fuuvo-dark-line) !important;
    background: var(--fuuvo-dark-surface) !important;
    background-image: none !important;
    color: var(--fuuvo-dark-text-soft) !important;
    box-shadow: none !important;
    filter: none !important;
}

html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] .chat-bubble.assistant.is-failed,
html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] .chat-bubble.system.is-failed,
html body[data-ui-theme="dark"] .chat-bubble.assistant.is-failed,
html body[data-ui-theme="dark"] .chat-bubble.system.is-failed {
    border-color: rgba(255, 141, 152, 0.34) !important;
    background: var(--fuuvo-dark-danger-bg) !important;
    background-image: none !important;
    color: var(--fuuvo-dark-danger) !important;
}

html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] :is(.chat-bubble.assistant.is-failed, .chat-bubble.system.is-failed) :is(.chat-plain, .chat-markdown),
html body[data-ui-theme="dark"] :is(.chat-bubble.assistant, .chat-bubble.system) :is(.chat-plain, .chat-markdown) {
    color: inherit !important;
    -webkit-text-fill-color: currentColor !important;
}

html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] .chat-quote-marker {
    background: var(--fuuvo-dark-blue) !important;
}

html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] :is(.chat-quote-clear, .clarification-banner-close) {
    border: 1px solid var(--fuuvo-dark-line) !important;
    background: var(--fuuvo-dark-input) !important;
    background-image: none !important;
    color: var(--fuuvo-dark-muted) !important;
    box-shadow: none !important;
}

html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] :is(.chat-quote-clear, .clarification-banner-close):is(:hover, :focus-visible, :active) {
    border-color: var(--fuuvo-dark-blue-line) !important;
    background: var(--fuuvo-dark-blue-soft) !important;
    color: var(--fuuvo-dark-blue) !important;
}

html body[data-ui-theme="dark"].chat-detail-open[data-mode="chat"] .chat-followup-chip {
    border-color: var(--fuuvo-dark-line-strong) !important;
    background: var(--fuuvo-dark-input) !important;
    background-image: none !important;
    color: var(--fuuvo-dark-text-soft) !important;
    -webkit-text-fill-color: currentColor !important;
    box-shadow: none !important;
}

body[data-mode="chat"] .chat-input-wrap.has-attachments .chat-input-tools {
    position: absolute !important;
    left: 12px !important;
    right: 12px !important;
    bottom: 10px !important;
    width: auto !important;
    min-height: 0 !important;
    padding: 0 !important;
}

body[data-ui-theme="dark"][data-mode="chat"] .chat-input-wrap .chat-attachment-chip,
body[data-ui-theme="dark"][data-mode="chat"] .chat-input-wrap .chat-attachment-thumb {
    border-color: rgba(148, 163, 184, .22);
    background: #172033;
    box-shadow: 0 3px 12px rgba(2, 6, 23, .3);
}

body[data-ui-theme="dark"][data-mode="chat"] .chat-input-wrap .chat-attachment-remove {
    border-color: rgba(148, 163, 184, .28);
    background: #263247;
    color: #e2e8f0;
}

body[data-ui-theme="dark"][data-mode="chat"] .chat-input-wrap .chat-attachment-remove:is(:hover, :focus-visible) {
    border-color: #ef6a76;
    background: #b4232f;
    color: #fff;
}

@media (max-width: 920px) {
    /* This file is loaded after the shared responsive contract. Preserve the
     * 44px touch targets when attachment/composer rules win the cascade. */
    html body[data-mode] .mobile-nav-trigger,
    html body[data-mode] .ui-language-switch-btn,
    html body[data-mode] .chat-tool-btn,
    html body[data-mode] .mobile-chat-toolbar-btn,
    html body.chat-landing[data-mode] .mobile-nav-trigger,
    html body.chat-landing[data-mode] .ui-language-switch-btn,
    html body.chat-landing[data-mode] .chat-tool-btn,
    html body.chat-landing[data-mode] .mobile-chat-toolbar-btn {
        min-width: 44px !important;
        min-height: 44px !important;
    }

    html body[data-mode] .mobile-nav-trigger,
    html body[data-mode] .ui-language-switch-btn,
    html body[data-mode] .chat-tool-btn,
    html body.chat-landing[data-mode] .mobile-nav-trigger,
    html body.chat-landing[data-mode] .ui-language-switch-btn,
    html body.chat-landing[data-mode] .chat-tool-btn {
        width: 44px !important;
        height: 44px !important;
    }

    body[data-mode="chat"] .chat-input-wrap .chat-attachment-remove::before {
        position: absolute;
        inset: -12px;
        content: "";
    }

    /* Conversation detail header: center the safety link against the full
     * viewport, independently from the left navigation and language controls. */
    html body.chat-detail-open[data-mode="chat"] .mobile-chat-topbar {
        position: relative !important;
    }

    html body.chat-detail-open[data-mode="chat"] .mobile-chat-actions {
        position: static !important;
    }

    html body.chat-detail-open[data-mode="chat"] .mobile-chat-link[data-safety-center-link] {
        position: absolute !important;
        left: 50% !important;
        top: 50% !important;
        z-index: 33;
        width: min(42vw, 170px) !important;
        max-width: min(42vw, 170px) !important;
        min-width: 0 !important;
        min-height: 34px !important;
        padding: 0 !important;
        display: block !important;
        overflow: hidden !important;
        line-height: 34px !important;
        text-align: left !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        transform: translate(-50%, -50%) !important;
    }

    html body.chat-detail-open[data-mode="chat"] .mobile-chat-actions .ui-language-switch {
        position: relative;
        z-index: 34;
    }
}


/* Phone landing should honor dark mode; this file is loaded last, so keep the final overrides here. */
@media (max-width: 920px), (hover: none) and (pointer: coarse) and (max-width: 1366px) {
    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"],
    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .app[data-fuuvo-app-shell="1"],
    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .workspace[data-fuuvo-app-workspace="1"],
    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .composer {
        background: var(--fuuvo-dark-bg) !important;
        color: #edf2ff !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .mobile-chat-topbar {
        background: rgba(8, 15, 28, .96) !important;
        border-bottom-color: rgba(148, 163, 184, .12) !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] :is(.mobile-nav-bars, .composer-title, .chat-tool-btn, .mobile-chat-toolbar-btn, .core-feature-btn) {
        color: #edf2ff !important;
        -webkit-text-fill-color: #edf2ff !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] :is(.chat-input-hint, .workspace-disclaimer, .ui-language-switch-btn:not(.active)) {
        color: #8fa0bc !important;
        -webkit-text-fill-color: #8fa0bc !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] :is(.chat-input-wrap, .chat-tool-btn, .mobile-chat-toolbar-btn, .core-feature-btn) {
        border-color: rgba(148, 163, 184, .22) !important;
        background: #0f172a !important;
        box-shadow: none !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .chat-input-wrap {
        background: var(--fuuvo-dark-input) !important;
        box-shadow: 0 12px 28px rgba(0, 0, 0, .18) !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .chat-input-wrap textarea {
        color: #edf2ff !important;
        -webkit-text-fill-color: #edf2ff !important;
        caret-color: #7db5ff !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .send-btn {
        border-color: #0d72f5 !important;
        background: #0d72f5 !important;
        color: #fff !important;
        -webkit-text-fill-color: #fff !important;
        box-shadow: 0 8px 17px rgba(13, 114, 245, .24) !important;
    }
}

/* The workstation stylesheet is loaded after the shared dark theme and sets
 * these landing controls back to white. Keep the home feature cards,
 * capability rail and its navigation controls on the same dark surface. */
html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .core-feature-btn,
html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .composer-capability-btn,
html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .composer-capability-nav {
    border-color: rgba(148, 163, 184, .22) !important;
    background: #0f172a !important;
    color: #dce6f5 !important;
    -webkit-text-fill-color: currentColor !important;
    box-shadow: none !important;
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .core-feature-btn:hover,
html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .core-feature-btn:focus-visible,
html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .composer-capability-btn:hover,
html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .composer-capability-btn.active,
html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .composer-capability-nav:hover {
    border-color: rgba(107, 168, 255, .42) !important;
    background: #182438 !important;
    color: #9cc5ff !important;
    -webkit-text-fill-color: currentColor !important;
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .composer-capability-nav {
    color: #aebcd0 !important;
    -webkit-text-fill-color: currentColor !important;
    box-shadow: 0 6px 16px rgba(0, 0, 0, .24) !important;
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .composer-capability-nav:focus-visible {
    outline: 2px solid rgba(107, 168, 255, .5) !important;
    outline-offset: 2px;
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .composer-capability-nav svg {
    color: inherit !important;
    stroke: currentColor;
}

/* Chat detail keeps the same capability rail but does not carry the
 * `chat-landing` class. Override the workstation's white circular arrows for
 * both landing and detail states. */
html body[data-ui-theme="dark"][data-mode="chat"] .composer-capability-nav {
    border-color: rgba(148, 163, 184, .24) !important;
    background: #111a2b !important;
    color: #b8c5d9 !important;
    -webkit-text-fill-color: currentColor !important;
    box-shadow: none !important;
}

html body[data-ui-theme="dark"][data-mode="chat"] .composer-capability-nav:hover,
html body[data-ui-theme="dark"][data-mode="chat"] .composer-capability-nav:focus-visible {
    border-color: rgba(107, 168, 255, .42) !important;
    background: #182438 !important;
    color: #a9ccff !important;
    -webkit-text-fill-color: currentColor !important;
}

html body[data-ui-theme="dark"][data-mode="chat"] .composer-capability-nav svg,
html body[data-ui-theme="dark"][data-mode="chat"] .composer-capability-nav svg path {
    color: inherit !important;
    stroke: currentColor !important;
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .core-feature-btn-icon :is(svg, .fuuvo-icon) {
    color: #8fbdff !important;
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .core-feature-btn-icon .home-core-feature-icon,
html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .composer-capability-btn .home-capability-icon {
    filter: brightness(1.12) saturate(1.04) drop-shadow(0 2px 5px rgba(0, 0, 0, .28)) !important;
}

@media (max-width: 600px) {
    html:has(body.chat-landing[data-mode="chat"]),
    body.chat-landing[data-mode="chat"] {
        width: var(--mobile-viewport-width, 100%) !important;
        max-width: var(--mobile-viewport-width, 100%) !important;
        height: var(--mobile-viewport-height, 100dvh) !important;
        min-height: var(--mobile-viewport-height, 100dvh) !important;
        max-height: var(--mobile-viewport-height, 100dvh) !important;
        overflow: hidden !important;
        overscroll-behavior: none !important;
    }

    html body.chat-landing[data-mode="chat"] .app[data-fuuvo-app-shell="1"],
    html body.chat-landing[data-mode="chat"] .workspace[data-fuuvo-app-workspace="1"] {
        height: var(--mobile-viewport-height, 100dvh) !important;
        min-height: 0 !important;
        max-height: var(--mobile-viewport-height, 100dvh) !important;
        overflow: hidden !important;
    }

    html body.chat-landing[data-mode="chat"] .app[data-fuuvo-app-shell="1"] {
        display: flex !important;
        flex-direction: column !important;
    }

    html body.chat-landing[data-mode="chat"] .workspace[data-fuuvo-app-workspace="1"] {
        display: flex !important;
        flex-direction: column !important;
    }

    html body.chat-landing[data-mode="chat"] .mobile-chat-topbar {
        flex: 0 0 auto !important;
        min-height: 62px !important;
    }

    html body.chat-landing[data-mode="chat"] .composer {
        flex: 1 1 auto !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        padding: clamp(44px, 11vh, 78px) 18px 12px !important;
        overflow: hidden !important;
    }

    html body.chat-landing[data-mode="chat"] .composer-top {
        margin-bottom: 12px !important;
    }

    html body.chat-landing[data-mode="chat"] .composer-title,
    html body.chat-landing[data-mode="chat"] .composer-title.has-fuuvo-slogan {
        font-size: 16px !important;
        line-height: 1.34 !important;
    }

    html body.chat-landing[data-mode="chat"] .composer-title.has-fuuvo-slogan {
        gap: 5px !important;
        align-items: center !important;
        justify-content: center !important;
    }

    html body.chat-landing[data-mode="chat"] .composer-title-logo-link {
        min-width: 0 !important;
        min-height: 0 !important;
        height: 18px !important;
        line-height: 0 !important;
    }

    html body.chat-landing[data-mode="chat"] .composer-title-logo {
        width: auto !important;
        height: 18px !important;
        max-height: 18px !important;
    }

    html body.chat-landing[data-mode="chat"] .chat-input-wrap,
    html body.chat-landing[data-mode="chat"] .chat-input-wrap textarea {
        min-height: 132px !important;
        height: 132px !important;
    }

    html body.chat-landing[data-mode="chat"] .chat-input-wrap textarea {
        padding: 15px 16px 56px !important;
        overflow-y: auto !important;
        font-size: 15px !important;
        line-height: 1.45 !important;
    }

    html body.chat-landing[data-mode="chat"] .chat-input-hint {
        top: 16px !important;
        right: 16px !important;
        left: 16px !important;
        font-size: 14px !important;
    }

    html body.chat-landing[data-mode="chat"] .chat-input-tools {
        right: 12px !important;
        bottom: 10px !important;
        left: 12px !important;
    }

    html body.chat-landing[data-mode="chat"] .chat-tool-btn,
    html body.chat-landing[data-mode="chat"] .send-btn {
        width: 38px !important;
        min-width: 38px !important;
        height: 38px !important;
        min-height: 38px !important;
    }

    html body.chat-landing[data-mode="chat"] .chat-tool-btn svg,
    html body.chat-landing[data-mode="chat"] .send-btn svg {
        width: 18px !important;
        height: 18px !important;
    }

    html body.chat-landing[data-mode="chat"] .mobile-chat-toolbar {
        left: 58px !important;
        bottom: 12px !important;
    }

    html body.chat-landing[data-mode="chat"] .mobile-chat-toolbar-btn {
        min-width: 0 !important;
        min-height: 32px !important;
        height: 32px !important;
        padding: 0 10px !important;
        font-size: 12px !important;
    }

    html body.chat-landing[data-mode="chat"] #core-feature-slot {
        margin-top: 8px !important;
    }

    html body.chat-landing[data-mode="chat"] .core-feature-actions {
        gap: 7px !important;
    }

    html body.chat-landing[data-mode="chat"] .core-feature-btn {
        min-height: 64px !important;
        padding: 5px 4px !important;
        gap: 4px !important;
        border-radius: 10px !important;
        font-size: 12px !important;
        line-height: 1.25 !important;
    }

    html body.chat-landing[data-mode="chat"] .core-feature-btn-icon,
    html body.chat-landing[data-mode="chat"] .core-feature-btn-icon .fuuvo-icon,
    html body.chat-landing[data-mode="chat"] .core-feature-btn-icon .home-core-feature-icon,
    html body.chat-landing[data-mode="chat"] .core-feature-btn-icon .home-capability-icon {
        width: 24px !important;
        height: 24px !important;
        flex-basis: 24px !important;
    }

    html body.chat-landing[data-mode="chat"] .workspace > .fuuvo-ai-disclaimer {
        flex: 0 0 auto !important;
        padding: 4px 8px max(5px, env(safe-area-inset-bottom)) !important;
        font-size: 9px !important;
        line-height: 1.28 !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .workspace > .fuuvo-ai-disclaimer {
        background: #080f1c !important;
        color: #9fb0c8 !important;
    }
}

/* Attachment layout must win over the fixed landing/mobile composer heights
 * declared later in the responsive layers. Files stay on row one and editable
 * text always starts on the next row. */
html body[data-mode="chat"] #chat-compose-field .chat-input-wrap.has-attachments {
    min-height: 176px !important;
    height: auto !important;
}

html body[data-mode="chat"] #chat-compose-field .chat-input-wrap.has-attachments #chat-input {
    min-height: 176px !important;
    max-height: 232px !important;
    padding-top: 78px !important;
}

html body[data-mode="chat"] #chat-compose-field .chat-input-wrap.has-attachments .chat-input-hint {
    top: 78px !important;
}

/* Desktop attachment composers use three real rows: previews, editable text
 * and actions. This final rule intentionally comes after the legacy absolute
 * attachment/action overrides above, so neither previews nor controls can
 * float over the message text on the landing or conversation-detail page. */
@media (min-width: 921px) {
    html body:is(.chat-landing, .chat-detail-open)[data-mode="chat"] #chat-compose-field .chat-input-wrap.has-attachments {
        display: flex !important;
        flex-direction: column !important;
        min-height: 224px !important;
        height: 224px !important;
        padding: 8px 12px 10px !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
    }

    html body:is(.chat-landing, .chat-detail-open)[data-mode="chat"] #chat-compose-field .chat-input-wrap.has-attachments .chat-attachment-bar:not(.hidden) {
        position: relative !important;
        inset: auto !important;
        order: 1 !important;
        flex: 0 0 61px !important;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 61px !important;
        height: 61px !important;
        margin: 0 !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
    }

    html body:is(.chat-landing, .chat-detail-open)[data-mode="chat"] #chat-compose-field .chat-input-wrap.has-attachments #chat-input {
        position: relative !important;
        order: 2 !important;
        flex: 1 1 auto !important;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 0 !important;
        max-height: none !important;
        height: auto !important;
        padding: 6px 16px 8px !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        box-sizing: border-box !important;
    }

    html body:is(.chat-landing, .chat-detail-open)[data-mode="chat"] #chat-compose-field .chat-input-wrap.has-attachments .chat-input-tools {
        position: relative !important;
        inset: auto !important;
        order: 3 !important;
        flex: 0 0 46px !important;
        width: 100% !important;
        min-height: 46px !important;
        height: 46px !important;
        padding: 0 !important;
        box-sizing: border-box !important;
    }

    html body:is(.chat-landing, .chat-detail-open)[data-mode="chat"] #chat-compose-field .chat-input-wrap.has-attachments .chat-input-hint {
        top: 75px !important;
        right: 28px !important;
        left: 28px !important;
    }
}

/* Office landing needs two full template rows and a usable composer in the
 * first desktop viewport. Keep the office controls compact without changing
 * normal chat or conversation-detail sizing. */
@media (min-width: 921px) {
    html body[data-mode="chat"][data-chat-entry-mode="work"] .chat-capability-active {
        display: none !important;
    }

    html body[data-mode="chat"][data-chat-entry-mode="work"] .composer {
        padding-bottom: 8px !important;
    }

    html body[data-mode="chat"][data-chat-entry-mode="work"] #chat-compose-field .chat-input-wrap:not(.has-attachments) {
        min-height: 102px !important;
        height: auto !important;
        border-radius: 18px !important;
    }

    html body[data-mode="chat"][data-chat-entry-mode="work"] #chat-compose-field .chat-input-wrap:not(.has-attachments) #chat-input {
        flex: 0 0 auto !important;
        min-height: 58px !important;
        height: 58px !important;
        max-height: 118px !important;
        padding: 12px 16px 8px !important;
        border-radius: 18px 18px 0 0 !important;
        font-size: 14px !important;
        line-height: 1.45 !important;
    }

    html body[data-mode="chat"][data-chat-entry-mode="work"] #chat-compose-field .chat-input-wrap:not(.has-attachments) .chat-input-hint {
        top: 13px !important;
        right: 16px !important;
        left: 16px !important;
        font-size: 14px !important;
    }

    html body[data-mode="chat"][data-chat-entry-mode="work"] #chat-compose-field .chat-input-wrap:not(.has-attachments) .chat-input-tools {
        min-height: 44px !important;
        height: 44px !important;
        padding: 0 10px 6px !important;
    }

    html body[data-mode="chat"][data-chat-entry-mode="work"] #chat-compose-field .chat-tool-btn,
    html body[data-mode="chat"][data-chat-entry-mode="work"] #chat-compose-field .chat-voice-btn.is-hold-to-talk,
    html body[data-mode="chat"][data-chat-entry-mode="work"] #chat-compose-field .send-btn {
        width: 38px !important;
        min-width: 38px !important;
        max-width: 38px !important;
        height: 38px !important;
        min-height: 38px !important;
        max-height: 38px !important;
    }

    html body[data-mode="chat"][data-chat-entry-mode="work"] .work-skill-bar {
        min-height: 30px !important;
        height: 30px !important;
        margin-top: 6px !important;
        padding: 0 2px !important;
    }

    html body[data-mode="chat"][data-chat-entry-mode="work"] .empty-state {
        padding-top: 14px !important;
        padding-bottom: 16px !important;
    }

    html body[data-mode="chat"][data-chat-entry-mode="work"] .chat-empty {
        width: min(960px, 100%) !important;
        gap: 8px !important;
        padding-bottom: 0 !important;
    }

    html body[data-mode="chat"][data-chat-entry-mode="work"] .chat-empty-copy {
        margin-bottom: 4px !important;
    }

    html body[data-mode="chat"][data-chat-entry-mode="work"] .chat-empty-title {
        font-size: 36px !important;
        line-height: 1.15 !important;
        letter-spacing: 0 !important;
    }

    html body[data-mode="chat"][data-chat-entry-mode="work"] .office-task-grid {
        width: min(960px, 100%) !important;
        gap: 10px 12px !important;
    }

    html body[data-mode="chat"][data-chat-entry-mode="work"] .office-task-card {
        gap: 8px !important;
        padding: 12px 14px !important;
        border-radius: 16px !important;
        align-content: start;
    }

    html body[data-mode="chat"][data-chat-entry-mode="work"] .office-task-card-head {
        gap: 8px !important;
    }

    html body[data-mode="chat"][data-chat-entry-mode="work"] .office-task-card-format {
        min-width: 50px !important;
        min-height: 24px !important;
        padding: 0 10px !important;
        font-size: 11px !important;
        letter-spacing: 0 !important;
    }

    html body[data-mode="chat"][data-chat-entry-mode="work"] .office-task-card-arrow {
        font-size: 16px !important;
    }

    html body[data-mode="chat"][data-chat-entry-mode="work"] .office-task-card-copy {
        gap: 4px !important;
    }

    html body[data-mode="chat"][data-chat-entry-mode="work"] .office-task-card-title {
        font-size: 14px !important;
        line-height: 1.35 !important;
    }

    html body[data-mode="chat"][data-chat-entry-mode="work"] .office-task-card-desc {
        display: -webkit-box;
        overflow: hidden;
        font-size: 12px !important;
        line-height: 1.45 !important;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }

    html body[data-mode="chat"][data-chat-entry-mode="work"] .office-task-card-foot {
        font-size: 11px !important;
    }
}

/* The first optimistic turn can enter detail mode before the server returns a
 * conversation id. Remove homepage-only surfaces immediately so they cannot
 * sit behind or above the conversation composer. */
html body.chat-detail-open[data-mode="chat"] :is(
    .composer-capability-shell,
    .mobile-home-capabilities,
    .mobile-home-scenes-title,
    #core-feature-slot,
    .home-capability-preview,
    .composer-top,
    .composer-mini-help,
    .home-page-disclaimer
) {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

html body.chat-detail-open[data-mode="chat"] .composer {
    position: fixed !important;
    top: auto !important;
    right: auto !important;
    bottom: calc(12px + env(safe-area-inset-bottom)) !important;
    left: 50% !important;
    width: min(960px, calc(100vw - 24px)) !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: translateX(-50%) !important;
    z-index: 5000 !important;
}

html body.chat-detail-open[data-mode="chat"] #chat-compose-field
    > .chat-input-wrap:not(.has-attachments) {
    min-height: 80px !important;
    height: auto !important;
    max-height: none !important;
    overflow: hidden !important;
}

html body.chat-detail-open[data-mode="chat"] #chat-compose-field
    > .chat-input-wrap:not(.has-attachments) > #chat-input {
    min-height: 80px !important;
    max-height: 148px !important;
    padding: 12px 14px 54px !important;
    box-sizing: border-box !important;
}

html body.chat-detail-open[data-mode="chat"] .chat-attach-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 280px)) !important;
    max-width: 100% !important;
    gap: 10px !important;
}

html body.chat-detail-open[data-mode="chat"] .chat-attach-card,
html body.chat-detail-open[data-mode="chat"] .chat-attach-thumb {
    min-width: 0 !important;
    max-width: 100% !important;
}

html body.chat-detail-open[data-mode="chat"] .chat-attach-thumb {
    max-height: 220px !important;
    overflow: hidden !important;
}

html body.chat-detail-open[data-mode="chat"] .chat-attach-thumb img,
html body.chat-detail-open[data-mode="chat"] .chat-attach-thumb video {
    width: 100% !important;
    max-width: 100% !important;
    max-height: 220px !important;
    object-fit: contain !important;
}

/* Source: public/static/css/fuuvo-genspark-home.css */
/* Genspark-inspired landing workspace. Keep every rule scoped to the chat
 * landing state so conversation detail and creation tools retain their layout. */

body.chat-landing[data-mode="chat"] {
    --home-ink: #17181b;
    --home-muted: #6f737b;
    --home-line: #e4e5e8;
    --home-panel: #f6f6f7;
    --home-soft: #f8f8f9;
    --home-accent: #1769e0;
    --home-accent-hover: #0f5dcc;
}

body.chat-landing[data-mode="chat"] :is(
    .composer-title,
    .chat-input-wrap,
    .composer-capability-btn,
    .core-feature-btn,
    aside[data-fuuvo-shared-sidebar="1"]
) {
    letter-spacing: 0;
}

body.chat-landing[data-mode="chat"] :is(
    .sidebar-search-trigger,
    .sidebar-nav-btn,
    .sidebar-safety-link,
    .sidebar-account-toggle,
    .sidebar-account-settings,
    .chat-tool-btn,
    .send-btn,
    .composer-capability-btn,
    .composer-capability-nav,
    .core-feature-btn,
    .mobile-chat-toolbar-btn
):focus-visible {
    outline: 2px solid #1769e0 !important;
    outline-offset: 2px !important;
}

/* Width defines the desktop shell. Touch laptops must not inherit the shared
 * sidebar's mobile internals inside the desktop rail drawer. */
@media (min-width: 921px) {
    body.chat-landing[data-mode="chat"] {
        --chat-sidebar-width: 248px !important;
        background: #ffffff !important;
    }

    body.chat-landing[data-mode="chat"] .app[data-fuuvo-app-shell="1"] {
        grid-template-columns: 248px 1px minmax(0, 1fr) !important;
        background: #ffffff !important;
    }

    body.sidebar-collapsed.chat-landing[data-mode="chat"] .app[data-fuuvo-app-shell="1"] {
        grid-template-columns: 0 0 minmax(0, 1fr) !important;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] {
        width: 248px !important;
        min-width: 248px !important;
        padding: 14px 10px 12px !important;
        gap: 10px !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: var(--home-panel) !important;
        box-shadow: inset -1px 0 0 #e7e7e9 !important;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region {
        width: 100% !important;
        padding: 0 4px 0 0 !important;
        background: transparent !important;
        scrollbar-color: #c8c9cd transparent;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region::-webkit-scrollbar {
        width: 4px !important;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region::-webkit-scrollbar-thumb {
        border-radius: 4px !important;
        background: #c8c9cd !important;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-shell {
        gap: 9px !important;
        padding: 0 !important;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-brand-row {
        min-height: 48px !important;
        padding: 0 4px 4px 6px !important;
        align-items: center !important;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand {
        min-width: 0 !important;
        padding: 0 !important;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-brand-logo,
    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-brand-logo img {
        max-width: 128px !important;
        max-height: 30px !important;
        object-fit: contain !important;
        object-position: left center !important;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-toggle-slot .desktop-history-toggle {
        width: 32px !important;
        min-width: 32px !important;
        height: 32px !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 8px !important;
        background: transparent !important;
        color: #686b72 !important;
        box-shadow: none !important;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-toggle-slot .desktop-history-toggle:hover {
        background: #e9e9eb !important;
        color: var(--home-ink) !important;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-search-trigger {
        display: grid !important;
        min-height: 40px !important;
        padding: 0 10px !important;
        border: 1px solid #e1e2e5 !important;
        border-radius: 10px !important;
        background: #ffffff !important;
        color: #555960 !important;
        box-shadow: 0 1px 2px rgba(23, 24, 27, .03) !important;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-search-trigger:hover {
        border-color: #d4d5d9 !important;
        background: #fbfbfc !important;
        color: var(--home-ink) !important;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-search-trigger img {
        width: 18px !important;
        height: 18px !important;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-search-trigger-label {
        font-size: 13px !important;
        font-weight: 500 !important;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-search-trigger-shortcut {
        padding: 3px 6px !important;
        border: 0 !important;
        border-radius: 6px !important;
        background: #f0f0f2 !important;
        color: #898c92 !important;
        font-size: 10px !important;
        box-shadow: none !important;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav {
        gap: 3px !important;
        padding-top: 2px !important;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav-btn {
        width: 100% !important;
        min-height: 40px !important;
        padding: 0 11px !important;
        justify-content: flex-start !important;
        border: 0 !important;
        border-radius: 9px !important;
        background: transparent !important;
        color: #34363b !important;
        font-size: 13px !important;
        font-weight: 540 !important;
        box-shadow: none !important;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav-btn .rail-icon {
        width: 100% !important;
        gap: 11px !important;
        color: currentColor !important;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav-btn .rail-glyph {
        display: block !important;
        width: 19px !important;
        height: 19px !important;
        flex: 0 0 19px !important;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] #sidebar-new-chat {
        min-height: 42px !important;
        margin: 1px 0 4px !important;
        border: 0 !important;
        background: #202124 !important;
        color: #ffffff !important;
        font-size: 13px !important;
        font-weight: 620 !important;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] #sidebar-new-chat::before {
        display: none !important;
        content: none !important;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] #sidebar-new-chat:hover {
        background: #323338 !important;
        color: #ffffff !important;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav-btn:not(#sidebar-new-chat):hover,
    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav-btn:not(#sidebar-new-chat).active {
        border: 0 !important;
        background: #e9e9eb !important;
        color: #17181b !important;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .history-main {
        padding: 19px 2px 0 0 !important;
        gap: 7px !important;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-section-label {
        padding: 0 10px 7px !important;
        color: #8a8d94 !important;
        font-size: 12px !important;
        font-weight: 600 !important;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] :is(.conversation-item, .task-item) {
        min-height: 36px !important;
        padding: 6px 9px !important;
        border: 0 !important;
        border-radius: 8px !important;
        background: transparent !important;
        color: #474a51 !important;
        box-shadow: none !important;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .task-list > .empty-state {
        padding: 18px 10px !important;
        color: #92959c !important;
        font-size: 12px !important;
        line-height: 1.6 !important;
        text-align: left !important;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-safety-link {
        min-height: 38px !important;
        margin-top: 10px !important;
        padding: 0 10px !important;
        gap: 10px !important;
        border: 0 !important;
        border-radius: 9px !important;
        background: transparent !important;
        color: #61646b !important;
        font-size: 12px !important;
        box-shadow: none !important;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-safety-link:hover {
        background: #e9e9eb !important;
        color: #25262a !important;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-area {
        padding: 10px 0 0 !important;
        border-top: 1px solid #e2e2e4 !important;
        background: var(--home-panel) !important;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-card {
        min-height: 50px !important;
        grid-template-columns: minmax(0, 1fr) 38px !important;
        gap: 4px !important;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-toggle {
        min-height: 44px !important;
        padding: 0 8px !important;
        border: 0 !important;
        border-radius: 9px !important;
        background: transparent !important;
        color: #2b2d31 !important;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-toggle:hover,
    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-settings:hover {
        background: #e9e9eb !important;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-settings {
        width: 38px !important;
        min-width: 38px !important;
        height: 38px !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 9px !important;
        background: transparent !important;
        color: #55585f !important;
    }

    body.chat-landing[data-mode="chat"] .workspace {
        background: #ffffff !important;
    }

    body.chat-landing[data-mode="chat"] .workspace-chat-header {
        min-height: 70px !important;
        padding: 0 24px !important;
        border-bottom: 0 !important;
        background: rgba(255, 255, 255, .94) !important;
        box-shadow: none !important;
        backdrop-filter: blur(12px) !important;
    }

    body.chat-landing[data-mode="chat"] .workspace-header-login {
        min-width: 82px !important;
        min-height: 40px !important;
        padding: 0 18px !important;
        border: 0 !important;
        border-radius: 20px !important;
        background: #202124 !important;
        color: #ffffff !important;
        font-size: 14px !important;
        box-shadow: none !important;
    }

    body.chat-landing[data-mode="chat"] .workspace-header-login:hover {
        background: #323338 !important;
    }

    body.chat-landing[data-mode="chat"] .composer {
        top: clamp(128px, 17vh, 176px) !important;
        bottom: auto !important;
        left: 50% !important;
        display: flex !important;
        width: min(920px, calc(100% - 72px)) !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 0 18px !important;
        overflow: visible !important;
        transform: translateX(-50%) !important;
    }

    body.chat-landing[data-mode="chat"] .composer-top {
        order: 1 !important;
        width: 100% !important;
        margin: 0 0 22px !important;
        text-align: center !important;
    }

    body.chat-landing[data-mode="chat"] .composer-title {
        color: var(--home-ink) !important;
        font-size: 25px !important;
        font-weight: 680 !important;
        line-height: 1.3 !important;
    }

    body.chat-landing[data-mode="chat"] .composer-title.has-fuuvo-slogan {
        gap: 9px !important;
        font-size: 21px !important;
    }

    body.chat-landing[data-mode="chat"] .composer-title-logo {
        max-height: 31px !important;
    }

    body.chat-landing[data-mode="chat"] #chat-compose-field {
        order: 2 !important;
        width: 100% !important;
        margin: 0 !important;
    }

    body.chat-landing[data-mode="chat"] #core-feature-slot {
        order: 4 !important;
        width: 100% !important;
        margin: 17px auto 0 !important;
    }

    body.chat-landing[data-mode="chat"] .chat-input-wrap {
        border: 1px solid #dedfe3 !important;
        border-radius: 20px !important;
        background: #ffffff !important;
        box-shadow: 0 12px 34px rgba(24, 27, 35, .08), 0 2px 8px rgba(24, 27, 35, .04) !important;
    }

    body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) {
        min-height: 138px !important;
        height: 138px !important;
        padding: 8px 12px 10px !important;
    }

    body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:hover {
        border-color: #d1d2d6 !important;
    }

    body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:focus-within {
        border-color: #b9bbc1 !important;
        box-shadow: 0 14px 38px rgba(24, 27, 35, .1), 0 0 0 3px rgba(23, 105, 224, .08) !important;
    }

    body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) #chat-input {
        min-height: 0 !important;
        padding: 14px 16px 7px !important;
        color: var(--home-ink) !important;
        font-size: 16px !important;
        line-height: 1.55 !important;
        caret-color: var(--home-accent) !important;
    }

    body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) .chat-input-hint {
        top: 22px !important;
        right: 28px !important;
        left: 28px !important;
        color: #7c8088 !important;
        font-size: 15px !important;
        font-weight: 450 !important;
    }

    body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) .chat-input-tools {
        flex: 0 0 42px !important;
        min-height: 42px !important;
        height: 42px !important;
        align-items: center !important;
        gap: 8px !important;
    }

    body.chat-landing[data-mode="chat"] .chat-tool-btn,
    body.chat-landing[data-mode="chat"] #chat-compose-field .chat-voice-btn.is-hold-to-talk {
        width: 38px !important;
        min-width: 38px !important;
        max-width: 38px !important;
        height: 38px !important;
        min-height: 38px !important;
        max-height: 38px !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 50% !important;
        background: #f4f4f5 !important;
        color: #4e5158 !important;
        box-shadow: none !important;
    }

    body.chat-landing[data-mode="chat"] .chat-tool-btn:hover,
    body.chat-landing[data-mode="chat"] #chat-compose-field .chat-voice-btn.is-hold-to-talk:hover {
        border: 0 !important;
        background: #e9e9eb !important;
        color: #1d1f23 !important;
    }

    body.chat-landing[data-mode="chat"] .chat-input-action-group {
        gap: 8px !important;
        align-items: center !important;
    }

    body.chat-landing[data-mode="chat"] .send-btn {
        width: 40px !important;
        min-width: 40px !important;
        max-width: 40px !important;
        height: 40px !important;
        min-height: 40px !important;
        max-height: 40px !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 50% !important;
        background: var(--home-accent) !important;
        color: #ffffff !important;
        box-shadow: 0 5px 12px rgba(23, 105, 224, .2) !important;
    }

    body.chat-landing[data-mode="chat"] .send-btn:hover {
        background: var(--home-accent-hover) !important;
        box-shadow: 0 6px 14px rgba(23, 105, 224, .24) !important;
    }

    body.chat-landing[data-mode="chat"] .composer-capability-shell {
        width: 100% !important;
        min-height: 76px !important;
        margin-top: 18px !important;
        grid-template-columns: 34px minmax(0, 1fr) 34px !important;
        gap: 4px !important;
        align-items: center !important;
    }

    body.chat-landing[data-mode="chat"] .composer-capability-bar {
        width: 100% !important;
        height: 76px !important;
        margin: 0 !important;
        padding: 0 2px !important;
        justify-content: flex-start !important;
        gap: 4px !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        scroll-padding-inline: 2px !important;
        scrollbar-width: none !important;
    }

    body.chat-landing[data-mode="chat"] .composer-capability-bar::-webkit-scrollbar {
        display: none !important;
    }

    body.chat-landing[data-mode="chat"] .composer-capability-btn {
        width: 82px !important;
        min-width: 82px !important;
        max-width: 82px !important;
        min-height: 76px !important;
        height: 76px !important;
        padding: 6px 4px !important;
        flex: 0 0 82px !important;
        flex-direction: column !important;
        justify-content: center !important;
        gap: 6px !important;
        border: 0 !important;
        border-radius: 8px !important;
        background: transparent !important;
        color: #4c4f56 !important;
        font-size: 12px !important;
        font-weight: 540 !important;
        line-height: 1.2 !important;
        white-space: normal !important;
        box-shadow: none !important;
    }

    body.chat-landing[data-mode="chat"] .composer-capability-btn:hover,
    body.chat-landing[data-mode="chat"] .composer-capability-btn.active {
        border: 0 !important;
        background: transparent !important;
        color: var(--home-accent) !important;
        box-shadow: none !important;
        transform: none !important;
    }

    body.chat-landing[data-mode="chat"] .composer-capability-btn .capability-icon {
        display: inline-flex !important;
        width: 34px !important;
        min-width: 34px !important;
        height: 34px !important;
        flex: 0 0 34px !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: 50% !important;
        background: transparent !important;
    }

    body.chat-landing[data-mode="chat"] .composer-capability-btn:nth-child(2n) .capability-icon {
        background: transparent !important;
    }

    body.chat-landing[data-mode="chat"] .composer-capability-btn:nth-child(3n) .capability-icon {
        background: transparent !important;
    }

    body.chat-landing[data-mode="chat"] .composer-capability-btn:nth-child(4n) .capability-icon {
        background: transparent !important;
    }

    body.chat-landing[data-mode="chat"] .composer-capability-btn:hover .capability-icon {
        box-shadow: none !important;
    }

    body.chat-landing[data-mode="chat"] .composer-capability-btn.active .capability-icon {
        background: transparent !important;
        box-shadow: none !important;
    }

    body.chat-landing[data-mode="chat"] .composer-capability-btn .capability-icon :is(img, svg, .fuuvo-icon, .home-capability-icon) {
        width: 24px !important;
        height: 24px !important;
        max-width: 24px !important;
        max-height: 24px !important;
        object-fit: contain !important;
    }

    body.chat-landing[data-mode="chat"] .composer-capability-nav {
        width: 32px !important;
        min-width: 32px !important;
        height: 32px !important;
        padding: 0 !important;
        border: 1px solid #e0e1e4 !important;
        border-radius: 50% !important;
        background: #ffffff !important;
        color: #65686f !important;
        box-shadow: 0 3px 10px rgba(24, 27, 35, .06) !important;
    }

    body.chat-landing[data-mode="chat"] .composer-capability-nav:hover {
        border-color: #d1d2d6 !important;
        background: #f5f5f6 !important;
        color: #17181b !important;
    }

    body.chat-landing[data-mode="chat"] .composer-capability-nav[hidden] {
        display: none !important;
    }

    body.chat-landing[data-mode="chat"] .core-feature-actions {
        display: grid !important;
        width: min(720px, 100%) !important;
        margin: 0 auto !important;
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        gap: 8px !important;
    }

    body.chat-landing[data-mode="chat"] .core-feature-btn {
        min-width: 0 !important;
        min-height: 44px !important;
        height: 44px !important;
        padding: 0 12px !important;
        gap: 8px !important;
        border: 0 !important;
        border-radius: 12px !important;
        background: #f6f6f7 !important;
        color: #565960 !important;
        font-size: 12px !important;
        font-weight: 540 !important;
        line-height: 1.2 !important;
        box-shadow: none !important;
    }

    body.chat-landing[data-mode="chat"] .core-feature-btn:hover {
        background: #ececee !important;
        color: #1e2024 !important;
        transform: none !important;
    }

    body.chat-landing[data-mode="chat"] .core-feature-btn-icon,
    body.chat-landing[data-mode="chat"] .core-feature-btn-icon :is(img, svg, .fuuvo-icon, .home-core-feature-icon) {
        width: 24px !important;
        height: 24px !important;
        flex: 0 0 24px !important;
        object-fit: contain !important;
    }

    body.chat-landing[data-mode="chat"] .workspace > .fuuvo-ai-disclaimer {
        color: #9a9da3 !important;
        font-size: 10px !important;
    }
}

@media (max-width: 920px), (hover: none) and (pointer: coarse) and (min-width: 601px) and (max-width: 1366px) {
    body.chat-landing[data-mode="chat"],
    body.chat-landing[data-mode="chat"] .app[data-fuuvo-app-shell="1"],
    body.chat-landing[data-mode="chat"] .workspace {
        background: #ffffff !important;
    }

    body.chat-landing[data-mode="chat"] .mobile-chat-topbar {
        min-height: 64px !important;
        padding: 0 12px !important;
        border-bottom: 1px solid #eeeeef !important;
        background: rgba(255, 255, 255, .95) !important;
        box-shadow: none !important;
        backdrop-filter: blur(12px) !important;
    }

    body.chat-landing[data-mode="chat"] .composer {
        align-items: center !important;
        padding: 72px 16px 14px !important;
        background: #ffffff !important;
    }

    body.chat-landing[data-mode="chat"] :is(.composer-top, #chat-compose-field, #core-feature-slot) {
        width: min(760px, 100%) !important;
    }

    body.chat-landing[data-mode="chat"] .composer-top {
        margin-bottom: 20px !important;
    }

    body.chat-landing[data-mode="chat"] .composer-title {
        color: var(--home-ink) !important;
        font-size: 20px !important;
        font-weight: 680 !important;
        line-height: 1.35 !important;
    }

    body.chat-landing[data-mode="chat"] .composer-title.has-fuuvo-slogan {
        gap: 6px !important;
        font-size: 18px !important;
    }

    body.chat-landing[data-mode="chat"] .chat-input-wrap {
        border: 1px solid #dedfe3 !important;
        border-radius: 19px !important;
        background: #ffffff !important;
        box-shadow: 0 10px 26px rgba(24, 27, 35, .08), 0 2px 7px rgba(24, 27, 35, .04) !important;
    }

    body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) {
        min-height: 136px !important;
        height: 136px !important;
    }

    body.chat-landing[data-mode="chat"] .chat-input-wrap:focus-within {
        border-color: #b9bbc1 !important;
        box-shadow: 0 12px 30px rgba(24, 27, 35, .1), 0 0 0 3px rgba(23, 105, 224, .07) !important;
    }

    body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) textarea {
        min-height: 136px !important;
        height: 136px !important;
        padding: 18px 16px 58px !important;
        color: var(--home-ink) !important;
        font-size: 16px !important;
        line-height: 1.5 !important;
        caret-color: var(--home-accent) !important;
    }

    body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) .chat-input-hint {
        top: 19px !important;
        right: 16px !important;
        left: 16px !important;
        color: #737780 !important;
        font-size: 15px !important;
        font-weight: 450 !important;
    }

    body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-tools {
        right: 12px !important;
        bottom: 10px !important;
        left: 12px !important;
        height: 40px !important;
        min-height: 40px !important;
        align-items: center !important;
    }

    body.chat-landing[data-mode="chat"] .chat-tool-btn,
    body.chat-landing[data-mode="chat"] #chat-compose-field .chat-voice-btn.is-hold-to-talk {
        width: 38px !important;
        min-width: 38px !important;
        max-width: 38px !important;
        height: 38px !important;
        min-height: 38px !important;
        max-height: 38px !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 50% !important;
        background: #f3f3f4 !important;
        color: #4e5158 !important;
        box-shadow: none !important;
    }

    body.chat-landing[data-mode="chat"] .send-btn {
        width: 40px !important;
        min-width: 40px !important;
        max-width: 40px !important;
        height: 40px !important;
        min-height: 40px !important;
        max-height: 40px !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 50% !important;
        background: var(--home-accent) !important;
        color: #ffffff !important;
        box-shadow: 0 5px 12px rgba(23, 105, 224, .2) !important;
    }

    body.chat-landing[data-mode="chat"] .mobile-chat-toolbar {
        bottom: 11px !important;
        left: 58px !important;
        min-height: 38px !important;
        height: 38px !important;
    }

    body.chat-landing[data-mode="chat"] .mobile-chat-toolbar-btn {
        min-height: 38px !important;
        height: 38px !important;
        padding: 0 11px !important;
        border: 0 !important;
        border-radius: 10px !important;
        background: #f3f3f4 !important;
        color: #4e5158 !important;
        font-size: 12px !important;
        box-shadow: none !important;
    }

    body.chat-landing[data-mode="chat"] #core-feature-slot {
        margin-top: 18px !important;
    }

    body.chat-landing[data-mode="chat"] .core-feature-actions {
        display: grid !important;
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        gap: 4px !important;
    }

    body.chat-landing[data-mode="chat"] .core-feature-btn {
        min-width: 0 !important;
        min-height: 88px !important;
        height: 88px !important;
        padding: 8px 3px !important;
        flex-direction: column !important;
        justify-content: center !important;
        gap: 7px !important;
        border: 0 !important;
        border-radius: 8px !important;
        background: transparent !important;
        color: #4f5259 !important;
        font-size: 12px !important;
        font-weight: 540 !important;
        line-height: 1.25 !important;
        white-space: normal !important;
        box-shadow: none !important;
    }

    body.chat-landing[data-mode="chat"] .core-feature-btn:active {
        background: #f4f4f5 !important;
        transform: none !important;
    }

    body.chat-landing[data-mode="chat"] .core-feature-btn-icon {
        display: inline-flex !important;
        width: 38px !important;
        height: 38px !important;
        flex: 0 0 38px !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: 50% !important;
        background: transparent !important;
    }

    body.chat-landing[data-mode="chat"] .core-feature-btn:nth-child(2n) .core-feature-btn-icon {
        background: transparent !important;
    }

    body.chat-landing[data-mode="chat"] .core-feature-btn:nth-child(3n) .core-feature-btn-icon {
        background: transparent !important;
    }

    body.chat-landing[data-mode="chat"] .core-feature-btn:nth-child(4n) .core-feature-btn-icon {
        background: transparent !important;
    }

    body.chat-landing[data-mode="chat"] .core-feature-btn-icon :is(img, svg, .fuuvo-icon, .home-core-feature-icon) {
        width: 27px !important;
        height: 27px !important;
        max-width: 27px !important;
        max-height: 27px !important;
        flex: 0 0 27px !important;
        object-fit: contain !important;
    }

    body.chat-landing[data-mode="chat"] .workspace > .fuuvo-ai-disclaimer {
        color: #92959c !important;
    }
}

@media (max-width: 380px) {
    body.chat-landing[data-mode="chat"] .composer {
        padding-right: 14px !important;
        padding-left: 14px !important;
    }

    body.chat-landing[data-mode="chat"] .composer-title {
        font-size: 18px !important;
    }

    body.chat-landing[data-mode="chat"] .composer-title.has-fuuvo-slogan {
        font-size: 17px !important;
    }

    body.chat-landing[data-mode="chat"] .core-feature-btn {
        min-height: 84px !important;
        height: 84px !important;
        font-size: 11px !important;
    }
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] {
    --home-ink: #f3f3f4;
    --home-muted: #a2a4aa;
    --home-line: #36373b;
    --home-panel: #141518;
    --home-soft: #202125;
    --home-accent: #4388ee;
    --home-accent-hover: #5796f2;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"],
body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .app[data-fuuvo-app-shell="1"],
body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .workspace,
body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .composer {
    background: #1a1b1e !important;
    color: var(--home-ink) !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] :is(.workspace-chat-header, .mobile-chat-topbar) {
    border-color: #2d2e32 !important;
    background: rgba(26, 27, 30, .95) !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"],
body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-area {
    border-color: #2e2f33 !important;
    background: var(--home-panel) !important;
    box-shadow: inset -1px 0 0 #2b2c30 !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-search-trigger {
    border-color: #303136 !important;
    background: #202125 !important;
    color: #c2c4ca !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-search-trigger-shortcut {
    background: #2b2c31 !important;
    color: #a2a4aa !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] #sidebar-new-chat {
    background: #f1f1f2 !important;
    color: #191a1d !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] #sidebar-new-chat:hover {
    background: #ffffff !important;
    color: #111214 !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav-btn {
    color: #d1d2d6 !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav-btn:not(#sidebar-new-chat):hover,
body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav-btn:not(#sidebar-new-chat).active,
body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-safety-link:hover,
body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-toggle:hover,
body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-settings:hover,
body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-toggle-slot .desktop-history-toggle:hover {
    background: #292a2f !important;
    color: #f3f3f4 !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] :is(
    .sidebar-section-label,
    .sidebar-safety-link,
    .task-list > .empty-state
) {
    color: #9b9da4 !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] :is(
    .conversation-item,
    .task-item,
    .sidebar-account-toggle,
    .sidebar-account-settings,
    .desktop-history-toggle
) {
    color: #d1d2d6 !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .composer-title {
    color: var(--home-ink) !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .chat-input-wrap,
body[data-ui-theme="dark"].chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) {
    border-color: #38393e !important;
    background: #232428 !important;
    box-shadow: 0 14px 38px rgba(0, 0, 0, .24) !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:hover,
body[data-ui-theme="dark"].chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:focus-within {
    border-color: #505158 !important;
    box-shadow: 0 14px 40px rgba(0, 0, 0, .28), 0 0 0 3px rgba(67, 136, 238, .11) !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] #chat-compose-field #chat-input {
    color: #f3f3f4 !important;
    -webkit-text-fill-color: #f3f3f4 !important;
    caret-color: #74a9f5 !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] #chat-compose-field .chat-input-hint,
body[data-ui-theme="dark"].chat-landing[data-mode="chat"] #chat-compose-field #chat-input::placeholder {
    color: #a4a6ad !important;
    -webkit-text-fill-color: #a4a6ad !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] :is(.chat-tool-btn, .mobile-chat-toolbar-btn),
body[data-ui-theme="dark"].chat-landing[data-mode="chat"] #chat-compose-field .chat-voice-btn.is-hold-to-talk {
    border-color: transparent !important;
    background: #303136 !important;
    color: #d9dade !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] :is(.chat-tool-btn, .mobile-chat-toolbar-btn):hover,
body[data-ui-theme="dark"].chat-landing[data-mode="chat"] #chat-compose-field .chat-voice-btn.is-hold-to-talk:hover {
    background: #3a3b41 !important;
    color: #ffffff !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .send-btn {
    background: var(--home-accent) !important;
    color: #ffffff !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .composer-capability-btn,
body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .core-feature-btn {
    color: #c9cbd0 !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .composer-capability-btn:hover,
body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .composer-capability-btn.active {
    background: transparent !important;
    color: #8ab9ff !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .composer-capability-btn.active .capability-icon {
    background: transparent !important;
    box-shadow: none !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .core-feature-btn:hover,
body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .core-feature-btn:active {
    background: #292a2f !important;
    color: #ffffff !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] :is(.composer-capability-btn .capability-icon, .core-feature-btn .core-feature-btn-icon) {
    background: transparent !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .composer-capability-btn:nth-child(2n) .capability-icon,
body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .core-feature-btn:nth-child(2n) .core-feature-btn-icon {
    background: transparent !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .composer-capability-btn:nth-child(3n) .capability-icon,
body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .core-feature-btn:nth-child(3n) .core-feature-btn-icon {
    background: transparent !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .composer-capability-btn:nth-child(4n) .capability-icon,
body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .core-feature-btn:nth-child(4n) .core-feature-btn-icon {
    background: transparent !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .composer-capability-nav {
    border-color: #38393e !important;
    background: #232428 !important;
    color: #c5c7cc !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, .22) !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .workspace > .fuuvo-ai-disclaimer {
    color: #85878e !important;
}

/* Earlier theme bundles intentionally use high-specificity selectors. These
 * final landing-only rules keep the refreshed palette neutral and consistent. */
html:has(body[data-ui-theme="dark"].chat-landing[data-mode="chat"]),
html body[data-ui-theme="dark"].chat-landing[data-mode="chat"],
html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .app[data-fuuvo-app-shell="1"],
html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .workspace,
html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .workspace[data-fuuvo-app-workspace="1"],
html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .composer {
    background: #1a1b1e !important;
    color: #f3f3f4 !important;
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] :is(.workspace-chat-header, .mobile-chat-topbar) {
    border-color: #2d2e32 !important;
    background: rgba(26, 27, 30, .95) !important;
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] #chat-compose-field :is(
    .chat-tool-btn,
    .mobile-chat-toolbar-btn
),
html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] #chat-compose-field .chat-voice-btn.is-hold-to-talk {
    border-color: transparent !important;
    background: #303136 !important;
    color: #d9dade !important;
    box-shadow: none !important;
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] #chat-compose-field .send-btn {
    border-color: transparent !important;
    background: var(--home-accent) !important;
    color: #ffffff !important;
    box-shadow: 0 5px 12px rgba(67, 136, 238, .2) !important;
}

@media (min-width: 921px) {
    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav #sidebar-new-chat.sidebar-nav-btn {
        border-color: transparent !important;
        background: #f1f1f2 !important;
        color: #191a1d !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav #sidebar-new-chat.sidebar-nav-btn:hover {
        background: #ffffff !important;
        color: #111214 !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .workspace-header-login {
        background: #f1f1f2 !important;
        color: #191a1d !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .composer-capability-btn,
    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .composer-capability-btn:hover,
    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .composer-capability-btn.active {
        border-color: transparent !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .core-feature-btn {
        border-color: transparent !important;
        background: #242529 !important;
    }
}

@media (max-width: 920px), (hover: none) and (pointer: coarse) and (min-width: 601px) and (max-width: 1366px) {
    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .core-feature-btn {
        border-color: transparent !important;
        background: transparent !important;
        color: #c9cbd0 !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    body.chat-landing[data-mode="chat"] :is(
        .sidebar-nav-btn,
        .sidebar-search-trigger,
        .chat-input-wrap,
        .chat-tool-btn,
        .send-btn,
        .composer-capability-btn,
        .core-feature-btn
    ) {
        transition: none !important;
    }
}

/* Keep every function icon transparent in both themes and interaction states. */
html body.chat-landing[data-mode="chat"] :is(.composer-capability-btn, .core-feature-btn, .home-tool-drawer-item) :is(.capability-icon, .core-feature-btn-icon),
html body.chat-landing[data-mode="chat"] :is(.composer-capability-btn, .core-feature-btn, .home-tool-drawer-item):is(:hover, :focus-visible, .active) :is(.capability-icon, .core-feature-btn-icon) {
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

html body.chat-landing[data-mode="chat"] .home-tool-drawer .home-tool-drawer-item {
    background: transparent !important;
    box-shadow: none !important;
}

html body.chat-landing[data-mode="chat"] :is(.composer-capability-btn, .core-feature-btn),
html body.chat-landing[data-mode="chat"] :is(.composer-capability-btn, .core-feature-btn):is(:hover, :focus-visible, :active, .active) {
    border-color: transparent !important;
    background: transparent !important;
    box-shadow: none !important;
}

/* Keep the send action visually stable while the composer enters the chat view. */
html body.chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn {
    transition: none !important;
}

html body.chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn.is-busy {
    background: #1769e0 !important;
    color: #ffffff !important;
    box-shadow: 0 5px 12px rgba(23, 105, 224, .2) !important;
}

html body.chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn:active {
    transform: none !important;
}

/* Keep the home rail identical to the shared rail used by every workspace. */
html body.chat-landing[data-mode="chat"] nav[data-fuuvo-workspace-rail="1"] .home-rail-logo .home-rail-logo-wordmark {
    width: 58px !important;
    max-height: 32px !important;
}

html body.chat-landing[data-mode="chat"] nav[data-fuuvo-workspace-rail="1"] .home-rail-action {
    min-height: 54px !important;
    font-size: 10px !important;
    font-weight: 540 !important;
    line-height: 1.1 !important;
}

/* Conversation details stay focused on the message history and composer. */
html body.chat-detail-open[data-mode="chat"] .composer-capability-shell {
    display: none !important;
}

/* Home workspace v7: narrow navigation rail, hover drawers, and grouped tools. */
body.chat-landing[data-mode="chat"] {
    --home-rail-width: 72px;
    --home-drawer-width: 430px;
    --home-workspace-bg: #fbfbfc;
    --home-drawer-bg: #f2f2f3;
    --home-input-bg: #ffffff;
}

@media (min-width: 921px) {
    body.chat-landing[data-mode="chat"] .app[data-fuuvo-app-shell="1"],
    body.sidebar-collapsed.chat-landing[data-mode="chat"] .app[data-fuuvo-app-shell="1"] {
        display: grid !important;
        width: 100% !important;
        min-height: 100vh !important;
        margin: 0 !important;
        padding: 0 !important;
        grid-template-columns: var(--home-rail-width) minmax(0, 1fr) !important;
        gap: 0 !important;
        background: var(--home-workspace-bg) !important;
    }

    html body.chat-landing[data-mode="chat"] nav.rail.home-workspace-rail {
        position: fixed !important;
        inset: 0 auto 0 0 !important;
        z-index: 1300 !important;
        display: flex !important;
        width: var(--home-rail-width) !important;
        min-width: var(--home-rail-width) !important;
        min-height: 100vh !important;
        margin: 0 !important;
        padding: 7px 5px 10px !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 8px !important;
        overflow: visible !important;
        border: 0 !important;
        border-right: 1px solid #e7e7e9 !important;
        border-radius: 0 !important;
        background: #f7f7f8 !important;
        color: #45474d !important;
        box-shadow: none !important;
        backdrop-filter: none !important;
    }

    body.chat-landing[data-mode="chat"] .home-workspace-rail > .rail-stack {
        display: none !important;
    }

    body.chat-landing[data-mode="chat"] :is(.home-workspace-rail-stack, .home-workspace-rail-footer) {
        display: flex !important;
        width: 100% !important;
        flex-direction: column !important;
        align-items: center !important;
        gap: 5px !important;
    }

    body.chat-landing[data-mode="chat"] .home-rail-logo {
        display: inline-flex !important;
        width: 82px !important;
        height: 42px !important;
        margin: 0 0 11px !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: 9px !important;
        color: #17181b !important;
        text-decoration: none !important;
    }

    body.chat-landing[data-mode="chat"] .home-rail-logo:hover {
        background: #e9e9eb !important;
    }

    body.chat-landing[data-mode="chat"] .home-rail-logo svg {
        width: 27px !important;
        height: 27px !important;
    }

    body.chat-landing[data-mode="chat"] .home-rail-logo .home-rail-logo-wordmark {
        display: block !important;
        width: 50px !important;
        height: auto !important;
        max-height: 38px !important;
        object-fit: contain !important;
        background: transparent !important;
    }

    body.chat-landing[data-mode="chat"] .home-rail-action {
        display: flex !important;
        width: 54px !important;
        min-width: 54px !important;
        min-height: 58px !important;
        margin: 0 !important;
        padding: 4px 2px 3px !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 3px !important;
        overflow: hidden !important;
        border: 0 !important;
        border-radius: 8px !important;
        background: transparent !important;
        font-size: 10px !important;
        font-weight: 520 !important;
        line-height: 1.1 !important;
        letter-spacing: 0 !important;
        text-align: center !important;
        text-decoration: none !important;
        white-space: nowrap !important;
        box-shadow: none !important;
        cursor: pointer !important;
        transition: background-color .16s ease, color .16s ease !important;
    }

    body.chat-landing[data-mode="chat"] .home-rail-action-icon {
        display: inline-flex !important;
        width: 36px !important;
        height: 34px !important;
        flex: 0 0 34px !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: 8px !important;
        background: transparent !important;
    }

    body.chat-landing[data-mode="chat"] .home-rail-action-icon svg {
        display: block !important;
        width: 22px !important;
        height: 22px !important;
    }

    body.chat-landing[data-mode="chat"] .home-drawer-backdrop {
        position: fixed !important;
        inset: 0 !important;
        z-index: 1270 !important;
        display: block !important;
        visibility: hidden !important;
        padding: 0 !important;
        border: 0 !important;
        background: rgba(20, 21, 24, .12) !important;
        opacity: 0 !important;
        pointer-events: none !important;
        transition: opacity .18s ease, visibility .18s ease !important;
    }

    body.home-drawer-pinned.chat-landing[data-mode="chat"] .home-drawer-backdrop {
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;
    }

    body.chat-landing[data-mode="chat"] .home-tool-drawer {
        position: fixed !important;
        top: 10px !important;
        bottom: 10px !important;
        left: calc(var(--home-rail-width) + 8px) !important;
        z-index: 1290 !important;
        display: grid !important;
        width: min(var(--home-drawer-width), calc(100vw - var(--home-rail-width) - 28px)) !important;
        padding: 0 !important;
        grid-template-rows: auto minmax(0, 1fr) !important;
        overflow: hidden !important;
        visibility: hidden !important;
        border: 1px solid #dfdfe2 !important;
        border-radius: 12px !important;
        background: var(--home-drawer-bg) !important;
        color: #24262a !important;
        box-shadow: 0 22px 52px rgba(20, 22, 28, .18) !important;
        opacity: 0 !important;
        transform: translateX(-9px) scale(.99) !important;
        transform-origin: left center !important;
        pointer-events: none !important;
        transition: opacity .17s ease, transform .17s ease, visibility .17s ease !important;
    }

    body.home-tool-drawer-open.chat-landing[data-mode="chat"] .home-tool-drawer {
        visibility: visible !important;
        opacity: 1 !important;
        transform: translateX(0) scale(1) !important;
        pointer-events: auto !important;
    }

    body.chat-landing[data-mode="chat"] .home-tool-drawer-header {
        display: flex !important;
        min-height: 76px !important;
        padding: 17px 18px 13px !important;
        align-items: flex-start !important;
        justify-content: space-between !important;
        gap: 16px !important;
        border-bottom: 1px solid #dedee1 !important;
    }

    body.chat-landing[data-mode="chat"] .home-tool-drawer-header > div {
        display: grid !important;
        min-width: 0 !important;
        gap: 4px !important;
    }

    body.chat-landing[data-mode="chat"] .home-tool-drawer-header strong {
        font-size: 16px !important;
        font-weight: 680 !important;
        line-height: 1.3 !important;
    }

    body.chat-landing[data-mode="chat"] .home-tool-drawer-header span {
        color: #767980 !important;
        font-size: 12px !important;
        line-height: 1.4 !important;
    }

    body.chat-landing[data-mode="chat"] .home-tool-drawer-close {
        display: inline-flex !important;
        width: 32px !important;
        height: 32px !important;
        min-width: 32px !important;
        padding: 0 !important;
        align-items: center !important;
        justify-content: center !important;
        border: 0 !important;
        border-radius: 8px !important;
        background: transparent !important;
        color: #666970 !important;
        cursor: pointer !important;
    }

    body.chat-landing[data-mode="chat"] .home-tool-drawer-close:hover {
        background: #e2e2e4 !important;
        color: #18191c !important;
    }

    body.chat-landing[data-mode="chat"] .home-tool-drawer-close svg {
        width: 19px !important;
        height: 19px !important;
    }

    body.chat-landing[data-mode="chat"] .home-tool-drawer-scroll {
        display: grid !important;
        padding: 8px 10px 18px !important;
        align-content: start !important;
        gap: 7px !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        overscroll-behavior: contain !important;
        scrollbar-width: thin !important;
        scrollbar-color: #c8c9cc transparent !important;
    }

    body.chat-landing[data-mode="chat"] .home-tool-group {
        display: grid !important;
        padding: 11px 6px 13px !important;
        gap: 8px !important;
        border-bottom: 1px solid #dfdfe2 !important;
    }

    body.chat-landing[data-mode="chat"] .home-tool-group:not(:has(button, a[href])) {
        display: none !important;
    }

    body.chat-landing[data-mode="chat"] .home-tool-group:last-child {
        border-bottom: 0 !important;
    }

    body.chat-landing[data-mode="chat"] .home-tool-group h2 {
        margin: 0 !important;
        padding: 0 7px !important;
        color: #3d3f44 !important;
        font-size: 13px !important;
        font-weight: 670 !important;
        line-height: 1.4 !important;
    }

    body.chat-landing[data-mode="chat"] .home-tool-grid {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 4px !important;
    }

    body.chat-landing[data-mode="chat"] .home-tool-drawer-item,
    body.chat-landing[data-mode="chat"] .home-tool-drawer-item.composer-capability-btn,
    body.chat-landing[data-mode="chat"] .home-tool-drawer-item.core-feature-btn {
        display: flex !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        height: 86px !important;
        min-height: 86px !important;
        margin: 0 !important;
        padding: 8px 4px !important;
        flex: none !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 7px !important;
        overflow: hidden !important;
        border: 1px solid transparent !important;
        border-radius: 8px !important;
        background: transparent !important;
        color: #55585f !important;
        font-size: 12px !important;
        font-weight: 540 !important;
        line-height: 1.25 !important;
        text-align: center !important;
        white-space: normal !important;
        box-shadow: none !important;
        cursor: pointer !important;
        transform: none !important;
    }

    body.chat-landing[data-mode="chat"] .home-tool-drawer-item:hover,
    body.chat-landing[data-mode="chat"] .home-tool-drawer-item:focus-visible,
    body.chat-landing[data-mode="chat"] .home-tool-drawer-item.active {
        border-color: #d9dadd !important;
        background: #e7e7e9 !important;
        color: #1c1e22 !important;
    }

    body.chat-landing[data-mode="chat"] .home-tool-drawer-item .capability-icon {
        display: inline-flex !important;
        width: 34px !important;
        min-width: 34px !important;
        height: 34px !important;
        flex: 0 0 34px !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: 0 !important;
        background: transparent !important;
        color: #386ecf !important;
    }

    body.chat-landing[data-mode="chat"] .home-tool-group[data-home-tool-group="office"] .capability-icon {
        color: #23835e !important;
    }

    body.chat-landing[data-mode="chat"] .home-tool-group[data-home-tool-group="creation"] .capability-icon {
        color: #9652b1 !important;
    }

    body.chat-landing[data-mode="chat"] .home-tool-group[data-home-tool-group="utilities"] .capability-icon {
        color: #c06b22 !important;
    }

    body.chat-landing[data-mode="chat"] .home-tool-drawer-item .home-capability-icon {
        display: block !important;
        width: 27px !important;
        height: 27px !important;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] {
        position: fixed !important;
        top: 10px !important;
        bottom: 10px !important;
        left: calc(var(--home-rail-width) + 8px) !important;
        z-index: 1290 !important;
        display: grid !important;
        width: 336px !important;
        min-width: 336px !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        margin: 0 !important;
        padding: 14px 12px 12px !important;
        grid-template-rows: minmax(0, 1fr) auto !important;
        gap: 6px !important;
        overflow: hidden !important;
        visibility: hidden !important;
        border: 1px solid #dfdfe2 !important;
        border-radius: 12px !important;
        background: var(--home-drawer-bg) !important;
        box-shadow: 0 22px 52px rgba(20, 22, 28, .18) !important;
        opacity: 0 !important;
        transform: translateX(-9px) scale(.99) !important;
        pointer-events: none !important;
        transition: opacity .17s ease, transform .17s ease, visibility .17s ease !important;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-area {
        min-height: 56px !important;
        padding-top: 7px !important;
    }

    body.home-history-drawer-open.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] {
        visibility: visible !important;
        opacity: 1 !important;
        transform: translateX(0) scale(1) !important;
        pointer-events: auto !important;
    }

    body.chat-landing[data-mode="chat"] .desktop-sidebar-resizer {
        display: none !important;
    }

    body.chat-landing[data-mode="chat"] .workspace[data-fuuvo-app-workspace="1"] {
        grid-column: 2 !important;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 100vh !important;
        margin: 0 !important;
        background: var(--home-workspace-bg) !important;
    }

    body.chat-landing[data-mode="chat"] .composer {
        top: clamp(118px, 16vh, 170px) !important;
        width: min(1080px, calc(100% - 64px)) !important;
        max-width: 1080px !important;
    }

    body.chat-landing[data-mode="chat"] .composer-top {
        margin-bottom: 25px !important;
    }

    body.chat-landing[data-mode="chat"] .composer-title {
        font-size: 28px !important;
        font-weight: 700 !important;
    }

    body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) {
        min-height: 150px !important;
        height: 150px !important;
        padding: 9px 14px 11px !important;
    }

    body.chat-landing[data-mode="chat"] .chat-input-wrap {
        border-color: #d8d9dc !important;
        border-radius: 20px !important;
        background: var(--home-input-bg) !important;
        box-shadow: 0 14px 36px rgba(26, 28, 34, .09), 0 2px 8px rgba(26, 28, 34, .04) !important;
    }

    body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) #chat-input {
        min-height: 82px !important;
        height: 82px !important;
        padding: 12px 7px 8px !important;
        font-size: 16px !important;
        line-height: 1.5 !important;
    }

    body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) .chat-input-hint {
        top: 21px !important;
        right: 22px !important;
        left: 22px !important;
        color: #72767e !important;
        font-size: 16px !important;
        font-weight: 520 !important;
    }

    body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-tools {
        display: flex !important;
        width: 100% !important;
        min-height: 42px !important;
        height: 42px !important;
        padding: 0 !important;
        align-items: center !important;
        gap: 9px !important;
    }

    body.chat-landing[data-mode="chat"] .home-composer-mode-tools {
        display: flex !important;
        min-width: 0 !important;
        align-items: center !important;
        gap: 7px !important;
    }

    body.chat-landing[data-mode="chat"] .home-composer-pill,
    body.chat-landing[data-mode="chat"] .home-composer-pill.composer-capability-btn {
        display: inline-flex !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        height: 36px !important;
        min-height: 36px !important;
        margin: 0 !important;
        padding: 0 12px !important;
        flex: 0 1 auto !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 7px !important;
        border: 1px solid #e0e1e4 !important;
        border-radius: 18px !important;
        background: #fafafb !important;
        color: #464950 !important;
        font-size: 13px !important;
        font-weight: 570 !important;
        line-height: 1 !important;
        white-space: nowrap !important;
        box-shadow: none !important;
        cursor: pointer !important;
        transform: none !important;
    }

    body.chat-landing[data-mode="chat"] .home-composer-pill:hover,
    body.chat-landing[data-mode="chat"] .home-composer-pill.is-expanded,
    body.chat-landing[data-mode="chat"] .home-composer-pill.composer-capability-btn.active {
        border-color: #cbccd1 !important;
        background: transparent !important;
        color: #17191c !important;
    }

    body.chat-landing[data-mode="chat"] .home-composer-pill > svg,
    body.chat-landing[data-mode="chat"] .home-composer-pill .capability-icon,
    body.chat-landing[data-mode="chat"] .home-composer-pill .home-capability-icon {
        display: inline-flex !important;
        width: 18px !important;
        min-width: 18px !important;
        height: 18px !important;
        flex: 0 0 18px !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: 0 !important;
        background: transparent !important;
        color: currentColor !important;
        box-shadow: none !important;
    }

    body.chat-landing[data-mode="chat"] .home-composer-pill .home-composer-pill-caret {
        width: 14px !important;
        min-width: 14px !important;
        height: 14px !important;
        flex-basis: 14px !important;
        transition: transform .16s ease !important;
    }

    body.chat-landing[data-mode="chat"] .home-composer-pill.is-expanded .home-composer-pill-caret {
        transform: rotate(180deg) !important;
    }

    body.chat-landing[data-mode="chat"] .chat-input-action-group {
        margin-left: auto !important;
    }

    body.chat-landing[data-mode="chat"] .home-composer-call {
        display: inline-flex !important;
        min-width: 86px !important;
        height: 40px !important;
        padding: 0 15px !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 7px !important;
        border: 1px solid #d6d7da !important;
        border-radius: 20px !important;
        background: #f5f5f6 !important;
        color: #27292d !important;
        font-size: 14px !important;
        font-weight: 640 !important;
        line-height: 1 !important;
        cursor: pointer !important;
    }

    body.chat-landing[data-mode="chat"] .home-composer-call.hidden {
        display: none !important;
    }

    body.chat-landing[data-mode="chat"] .home-composer-call:hover {
        border-color: #c7c8cc !important;
        background: #ebebed !important;
    }

    body.chat-landing[data-mode="chat"] .home-composer-call svg {
        width: 19px !important;
        height: 19px !important;
    }

    body.chat-landing[data-mode="chat"] .composer-capability-shell {
        display: grid !important;
        width: 100% !important;
        min-height: 112px !important;
        margin-top: 24px !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 0 !important;
        align-items: stretch !important;
    }

    body.chat-landing[data-mode="chat"] .composer-capability-nav {
        display: none !important;
    }

    body.chat-landing[data-mode="chat"] .composer-capability-bar {
        display: grid !important;
        width: 100% !important;
        height: auto !important;
        min-height: 112px !important;
        margin: 0 !important;
        padding: 0 !important;
        grid-column: 1 / -1 !important;
        grid-template-columns: 1.05fr 1.32fr 1.68fr 1fr !important;
        align-items: stretch !important;
        gap: 0 !important;
        overflow: visible !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group {
        position: relative !important;
        display: grid !important;
        min-width: 0 !important;
        padding: 0 12px !important;
        grid-template-rows: 25px minmax(0, 1fr) !important;
        align-content: start !important;
        gap: 7px !important;
        border-left: 1px solid #e5e5e7 !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group:not(:has(button, a)) {
        display: none !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group:first-child {
        padding-left: 0 !important;
        border-left: 0 !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group:last-child {
        padding-right: 0 !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group h3 {
        display: flex !important;
        min-width: 0 !important;
        margin: 0 !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 4px !important;
        color: #696c73 !important;
        font-size: 12px !important;
        font-weight: 610 !important;
        line-height: 1.3 !important;
        text-align: center !important;
        white-space: nowrap !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group h3 svg {
        width: 14px !important;
        height: 14px !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group.has-overflow > h3 {
        cursor: pointer !important;
        outline: none !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group.has-overflow > h3:hover,
    body.chat-landing[data-mode="chat"] .home-capability-group.has-overflow > h3:focus-visible,
    body.chat-landing[data-mode="chat"] .home-capability-group.is-overflow-open > h3 {
        color: #202226 !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group.has-overflow > h3 svg {
        transition: transform .16s ease !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group.is-overflow-open > h3 svg {
        transform: rotate(180deg) !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group-actions {
        display: flex !important;
        min-width: 0 !important;
        align-items: start !important;
        justify-content: center !important;
        gap: 2px !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn {
        display: flex !important;
        width: auto !important;
        min-width: 52px !important;
        max-width: 76px !important;
        min-height: 78px !important;
        height: 78px !important;
        margin: 0 !important;
        padding: 5px 3px !important;
        flex: 1 1 60px !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 6px !important;
        border: 1px solid transparent !important;
        border-radius: 8px !important;
        background: transparent !important;
        color: #4d5057 !important;
        font-size: 11px !important;
        font-weight: 550 !important;
        line-height: 1.25 !important;
        text-align: center !important;
        text-decoration: none !important;
        white-space: normal !important;
        box-shadow: none !important;
        transform: none !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn:hover,
    body.chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn:focus-visible,
    body.chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn.active {
        border-color: #e0e1e3 !important;
        background: #f0f0f2 !important;
        color: #1f2125 !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group .capability-icon {
        display: inline-flex !important;
        width: 34px !important;
        min-width: 34px !important;
        height: 34px !important;
        flex: 0 0 34px !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: 0 !important;
        background: transparent !important;
        color: #3474d4 !important;
        box-shadow: none !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group[data-home-capability-group="office"] .capability-icon {
        color: #28845f !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group[data-home-capability-group="creation"] .capability-icon {
        color: #8a55ad !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group[data-home-capability-group="utilities"] .capability-icon {
        color: #b66b28 !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group .home-capability-icon {
        display: block !important;
        width: 27px !important;
        height: 27px !important;
        max-width: 27px !important;
        max-height: 27px !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-overflow-panel {
        position: fixed !important;
        left: 50% !important;
        top: 0 !important;
        bottom: auto !important;
        z-index: 1320 !important;
        display: block !important;
        width: min(410px, calc(100vw - 40px)) !important;
        padding: 18px !important;
        overflow: hidden !important;
        border: 1px solid #d9dadd !important;
        border-radius: 8px !important;
        background: #fff !important;
        color: #25272b !important;
        box-shadow: 0 22px 58px rgba(20, 23, 29, .2) !important;
        transform: none !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-overflow-panel[hidden] {
        display: none !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-overflow-title {
        display: block !important;
        margin: 0 0 12px !important;
        color: #73777f !important;
        font-size: 13px !important;
        font-weight: 620 !important;
        letter-spacing: 0 !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-overflow-grid {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 6px 14px !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-overflow-panel .composer-capability-btn {
        display: grid !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        height: 52px !important;
        min-height: 52px !important;
        padding: 7px 9px !important;
        grid-template-columns: 36px minmax(0, 1fr) !important;
        align-items: center !important;
        justify-items: start !important;
        gap: 10px !important;
        border-radius: 7px !important;
        font-size: 14px !important;
        font-weight: 590 !important;
        text-align: left !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-overflow-panel .capability-icon {
        width: 34px !important;
        min-width: 34px !important;
        height: 34px !important;
        flex-basis: 34px !important;
        color: #3474d4 !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-overflow-panel[data-home-capability-group="office"] .capability-icon {
        color: #28845f !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-overflow-panel[data-home-capability-group="creation"] .capability-icon {
        color: #8a55ad !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-overflow-panel[data-home-capability-group="utilities"] .capability-icon {
        color: #b66b28 !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-overflow-panel {
        border-color: #3d3f43 !important;
        background: #242527 !important;
        color: #f0f1f3 !important;
        box-shadow: 0 24px 62px rgba(0, 0, 0, .42) !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-overflow-title {
        color: #a8abb2 !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-overflow-panel .composer-capability-btn:hover,
    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-overflow-panel .composer-capability-btn:focus-visible {
        border-color: #45484d !important;
        background: #303235 !important;
        color: #fff !important;
    }

    body.chat-landing[data-mode="chat"] #core-feature-slot {
        display: none !important;
    }
}

@media (min-width: 921px) and (max-width: 1120px) {
    body.chat-landing[data-mode="chat"] .composer {
        top: 102px !important;
        width: min(900px, calc(100% - 42px)) !important;
    }

    body.chat-landing[data-mode="chat"] .composer-capability-bar {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        row-gap: 14px !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group:nth-child(odd) {
        padding-left: 0 !important;
        border-left: 0 !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group:nth-child(even) {
        padding-right: 0 !important;
    }

    body.chat-landing[data-mode="chat"] .composer-capability-shell,
    body.chat-landing[data-mode="chat"] .composer-capability-bar {
        min-height: 224px !important;
    }
}

@media (min-width: 921px) and (max-width: 1120px) and (max-height: 680px) {
    body.chat-landing[data-mode="chat"] .composer {
        top: 72px !important;
        bottom: 52px !important;
        height: auto !important;
        max-height: calc(100dvh - 124px) !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        overscroll-behavior: contain !important;
        scrollbar-width: thin !important;
    }

    body.chat-landing[data-mode="chat"] .composer-top {
        margin-bottom: 16px !important;
        flex: 0 0 auto !important;
    }

    body.chat-landing[data-mode="chat"] #chat-compose-field {
        flex: 0 0 auto !important;
    }

    body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) {
        min-height: 132px !important;
        height: 132px !important;
    }

    body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) #chat-input {
        min-height: 64px !important;
        height: 64px !important;
    }

    body.chat-landing[data-mode="chat"] .composer-capability-shell {
        margin-top: 14px !important;
        flex: 0 0 auto !important;
    }
}

@media (max-width: 920px) {
    body.chat-landing[data-mode="chat"] :is(
        .home-tool-drawer,
        .home-drawer-backdrop,
        .home-composer-mode-tools,
        .home-composer-call
    ) {
        display: none !important;
    }
}

@media (min-width: 921px) {
    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"],
    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .app[data-fuuvo-app-shell="1"],
    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .workspace[data-fuuvo-app-workspace="1"] {
        --home-workspace-bg: #17191a;
        --home-drawer-bg: #28292b;
        --home-input-bg: #303133;
        background: var(--home-workspace-bg) !important;
        color: #f1f1f2 !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] nav.rail.home-workspace-rail {
        border-right-color: #292b2d !important;
        background: #17191a !important;
        color: #c6c8cc !important;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-rail-logo {
        color: #bec0c5 !important;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] :is(.home-tool-drawer, aside[data-fuuvo-shared-sidebar="1"]) {
        border-color: #3a3b3e !important;
        background: var(--home-drawer-bg) !important;
        color: #f0f0f1 !important;
        box-shadow: 0 24px 58px rgba(0, 0, 0, .42) !important;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] :is(.home-tool-drawer-header, .home-tool-group) {
        border-color: #3a3b3e !important;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] :is(.home-tool-drawer-header span, .home-tool-group h2) {
        color: #b8bac0 !important;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-tool-drawer-close {
        color: #c5c7cc !important;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-tool-drawer-item {
        color: #c8cace !important;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] :is(.home-tool-drawer-close, .home-tool-drawer-item):hover,
    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-tool-drawer-item.active {
        border-color: #45464a !important;
        background: #343538 !important;
        color: #ffffff !important;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .chat-input-wrap,
    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) {
        border-color: #4a4b4e !important;
        background: var(--home-input-bg) !important;
        box-shadow: 0 17px 42px rgba(0, 0, 0, .32) !important;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:hover,
    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:focus-within {
        border-color: #66676b !important;
        box-shadow: 0 19px 46px rgba(0, 0, 0, .36), 0 0 0 3px rgba(91, 145, 224, .12) !important;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] :is(.home-composer-pill, .home-composer-call) {
        border-color: #4a4b4e !important;
        background: #36373a !important;
        color: #e1e2e4 !important;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] :is(.home-composer-pill, .home-composer-call):hover,
    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-composer-pill.is-expanded,
    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-composer-pill.composer-capability-btn.active {
        border-color: #5b5c60 !important;
        background: #414246 !important;
        color: #ffffff !important;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-group {
        border-color: #303235 !important;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-group h3 {
        color: #aeb0b5 !important;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn {
        border-color: transparent !important;
        background: transparent !important;
        color: #c8cace !important;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn:hover,
    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn.active {
        border-color: #37393c !important;
        background: #292b2d !important;
        color: #ffffff !important;
    }
}

/* The shared sidebar treats coarse pointers up to 1366px as mobile. The home
 * workspace is width-driven, so restore its desktop drawer internals here. */
@media (min-width: 921px) and (hover: none) and (pointer: coarse) and (max-width: 1366px) {
    body.chat-landing[data-mode="chat"] :is(
        .fuuvo-mobile-sidebar-close,
        .fuuvo-mobile-sidebar-auth,
        .fuuvo-mobile-explore,
        .fuuvo-mobile-powered,
        .fuuvo-mobile-sidebar-backdrop
    ) {
        display: none !important;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] :is(
        .sidebar-mobile-only,
        .mobile-history-inline
    ) {
        display: none !important;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-shell {
        display: grid !important;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .fuuvo-sidebar-brand {
        width: auto !important;
        margin: 0 0 8px !important;
        display: grid !important;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-search-trigger {
        display: grid !important;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav {
        padding: 2px 0 0 !important;
        display: grid !important;
        border-bottom: 0 !important;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav-btn .rail-glyph {
        color: currentColor !important;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-safety-link {
        display: flex !important;
    }

    body.chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-area {
        display: block !important;
    }
}

/* Restore the original centered capability catalogue.  The later Gemini
 * composer iterations changed this area into a fixed-width horizontal strip;
 * keep the open glow and pill above, but bring back the four balanced groups
 * and the hover-preview targets users already know. */
@media (min-width: 921px) {
    body.chat-landing[data-mode="chat"] .composer-capability-shell {
        display: grid !important;
        width: 100% !important;
        min-height: 112px !important;
        height: auto !important;
        margin: 24px 0 0 !important;
        padding: 0 !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 0 !important;
        align-items: stretch !important;
        overflow: visible !important;
    }

    body.chat-landing[data-mode="chat"] .composer-capability-nav {
        display: none !important;
    }

    body.chat-landing[data-mode="chat"] .composer-capability-bar {
        display: grid !important;
        width: 100% !important;
        height: auto !important;
        min-height: 112px !important;
        margin: 0 auto !important;
        padding: 0 !important;
        grid-column: 1 / -1 !important;
        grid-template-columns: 1.05fr 1.32fr 1.68fr 1fr !important;
        align-items: stretch !important;
        justify-content: center !important;
        gap: 0 !important;
        overflow: visible !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group {
        position: relative !important;
        display: grid !important;
        min-width: 0 !important;
        padding: 0 12px !important;
        grid-template-rows: 25px minmax(0, 1fr) !important;
        align-content: start !important;
        gap: 7px !important;
        border-left: 1px solid #e5e5e7 !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group:first-child {
        padding-left: 0 !important;
        border-left: 0 !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group:last-child {
        padding-right: 0 !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group h3 {
        display: flex !important;
        min-width: 0 !important;
        min-height: 25px !important;
        margin: 0 !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 4px !important;
        color: #696c73 !important;
        font-size: 12px !important;
        font-weight: 610 !important;
        line-height: 1.3 !important;
        text-align: center !important;
        white-space: nowrap !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group-actions {
        display: flex !important;
        min-width: 0 !important;
        align-items: flex-start !important;
        justify-content: center !important;
        gap: 2px !important;
        flex-wrap: nowrap !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn {
        display: flex !important;
        width: auto !important;
        min-width: 52px !important;
        max-width: 76px !important;
        min-height: 78px !important;
        height: 78px !important;
        margin: 0 !important;
        padding: 5px 3px !important;
        flex: 1 1 60px !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 6px !important;
        border: 1px solid transparent !important;
        border-radius: 8px !important;
        background: transparent !important;
        color: #4d5057 !important;
        font-size: 11px !important;
        font-weight: 550 !important;
        line-height: 1.25 !important;
        text-align: center !important;
        text-decoration: none !important;
        white-space: normal !important;
        overflow: visible !important;
        box-shadow: none !important;
        transform: none !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn > span:last-child {
        display: block !important;
        max-width: 100% !important;
        overflow: visible !important;
        text-overflow: clip !important;
        overflow-wrap: anywhere !important;
        white-space: normal !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn:hover,
    body.chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn:focus-visible,
    body.chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn.active {
        border-color: #e0e1e3 !important;
        background: #f0f0f2 !important;
        color: #1f2125 !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group .capability-icon {
        display: inline-flex !important;
        width: 34px !important;
        min-width: 34px !important;
        height: 34px !important;
        flex: 0 0 34px !important;
        align-items: center !important;
        justify-content: center !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-group {
        border-left-color: #303235 !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-group h3 {
        color: #aeb0b5 !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn {
        color: #c8cace !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn:hover,
    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn:focus-visible,
    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn.active {
        border-color: #45484d !important;
        background: #303235 !important;
        color: #ffffff !important;
    }
}

@media (min-width: 921px) and (max-width: 1120px) {
    body.chat-landing[data-mode="chat"] .composer-capability-bar {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        row-gap: 14px !important;
        min-height: 224px !important;
    }

    body.chat-landing[data-mode="chat"] .composer-capability-shell {
        min-height: 224px !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group:nth-child(odd) {
        padding-left: 0 !important;
        border-left: 0 !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group:nth-child(even) {
        padding-right: 0 !important;
    }
}

/* Gemini-inspired open landing surface: keep the title and composer floating
 * over a soft brand glow instead of enclosing the whole area in a square card.
 * The compact pill is limited to the empty desktop composer; attachment and
 * media states keep their taller workspace controls. */
@media (min-width: 921px) {
    body.chat-landing[data-mode="chat"] .workspace[data-fuuvo-app-workspace="1"] {
        position: relative !important;
        isolation: isolate !important;
        overflow: hidden !important;
        background:
            radial-gradient(ellipse 560px 330px at 52% 36%, rgba(89, 160, 255, .11), transparent 72%),
            radial-gradient(ellipse 460px 280px at 60% 48%, rgba(171, 136, 241, .08), transparent 75%),
            var(--home-workspace-bg, #ffffff) !important;
    }

    body.chat-landing[data-mode="chat"] .workspace[data-fuuvo-app-workspace="1"]::before {
        content: "";
        position: absolute;
        inset: 0;
        z-index: 0;
        pointer-events: none;
        background: radial-gradient(ellipse 520px 300px at 52% 36%, rgba(88, 166, 255, .10), transparent 70%);
        filter: blur(22px);
        opacity: .9;
    }

    body.chat-landing[data-mode="chat"] .workspace[data-fuuvo-app-workspace="1"] > * {
        position: relative;
        z-index: 1;
    }

    body.chat-landing[data-mode="chat"] .composer {
        top: clamp(138px, 18vh, 190px) !important;
        width: min(820px, calc(100% - 80px)) !important;
        max-width: 820px !important;
        padding: 0 0 16px !important;
        background: transparent !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
    }

    body.chat-landing[data-mode="chat"] .composer::before,
    body.chat-landing[data-mode="chat"] .composer-top::before {
        background: radial-gradient(ellipse 430px 210px at 50% 45%, rgba(79, 153, 255, .12), transparent 72%) !important;
        filter: blur(14px) !important;
    }

    body.chat-landing[data-mode="chat"] .composer-top {
        margin-bottom: 20px !important;
    }

    body.chat-landing[data-mode="chat"] .composer-title {
        font-size: 27px !important;
        font-weight: 680 !important;
        text-shadow: 0 1px 18px rgba(100, 151, 230, .10);
    }

    body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) {
        min-height: 76px !important;
        height: 76px !important;
        padding: 8px 12px !important;
        overflow: hidden !important;
        border: 1px solid rgba(186, 196, 211, .72) !important;
        border-radius: 999px !important;
        background: rgba(255, 255, 255, .88) !important;
        box-shadow:
            0 18px 42px rgba(38, 87, 153, .11),
            0 3px 10px rgba(32, 44, 67, .05) !important;
        backdrop-filter: blur(16px) saturate(115%) !important;
    }

    body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments):hover {
        border-color: rgba(136, 157, 187, .86) !important;
    }

    body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments):focus-within {
        border-color: rgba(83, 139, 224, .85) !important;
        box-shadow:
            0 20px 46px rgba(38, 87, 153, .14),
            0 0 0 4px rgba(79, 145, 239, .10) !important;
    }

    body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) #chat-input {
        min-height: 56px !important;
        height: 56px !important;
        padding: 15px 220px 12px 56px !important;
        resize: none !important;
        overflow: hidden !important;
        color: var(--home-ink) !important;
        font-size: 16px !important;
        line-height: 1.45 !important;
    }

    body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) .chat-input-hint {
        top: 26px !important;
        right: 220px !important;
        left: 56px !important;
        color: #747c89 !important;
        font-size: 15px !important;
        font-weight: 450 !important;
    }

    body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) .chat-input-tools {
        left: 14px !important;
        right: 14px !important;
        bottom: 17px !important;
        height: 42px !important;
        min-height: 42px !important;
    }

    body.chat-landing[data-mode="chat"] .composer-capability-shell {
        min-height: 96px !important;
        margin-top: 22px !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group {
        border-left-color: rgba(220, 225, 233, .72) !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn {
        border-color: transparent !important;
        background: transparent !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn:hover,
    body.chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn:focus-visible,
    body.chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn.active {
        border-color: rgba(208, 216, 228, .72) !important;
        background: rgba(255, 255, 255, .46) !important;
    }
}

@media (min-width: 921px) {
    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .workspace[data-fuuvo-app-workspace="1"] {
        background:
            radial-gradient(ellipse 560px 330px at 52% 36%, rgba(61, 119, 210, .16), transparent 72%),
            radial-gradient(ellipse 460px 280px at 60% 48%, rgba(119, 83, 180, .13), transparent 75%),
            var(--home-workspace-bg, #17191a) !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) {
        border-color: rgba(104, 121, 146, .78) !important;
        background: rgba(43, 46, 51, .88) !important;
        box-shadow: 0 20px 48px rgba(0, 0, 0, .28) !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-group {
        border-left-color: rgba(65, 70, 80, .82) !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn:hover,
    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn:focus-visible,
    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn.active {
        background: rgba(66, 70, 78, .58) !important;
        border-color: rgba(102, 108, 119, .72) !important;
    }
}

/* Final landing composer alignment: a single Gemini-like horizontal pill.
 * Keep the rich capability catalogue available through the left Skills rail,
 * while the empty home state stays quiet and focused on one input row. */
@media (min-width: 921px) {
    body.chat-landing[data-mode="chat"] .composer {
        width: min(560px, calc(100% - 80px)) !important;
        max-width: 560px !important;
        top: clamp(148px, 20vh, 208px) !important;
    }

    body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) {
        min-height: 66px !important;
        height: 66px !important;
        padding: 7px 10px !important;
        overflow: hidden !important;
        border-radius: 999px !important;
    }

    body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) #chat-input {
        display: block !important;
        min-height: 48px !important;
        height: 48px !important;
        padding: 14px 194px 12px 51px !important;
        overflow-x: hidden !important;
        overflow-y: hidden !important;
        resize: none !important;
        white-space: nowrap !important;
        text-overflow: ellipsis !important;
        line-height: 1.35 !important;
    }

    body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) .chat-input-hint {
        top: 24px !important;
        right: 194px !important;
        left: 51px !important;
        white-space: nowrap !important;
        text-overflow: ellipsis !important;
    }

    body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) .chat-input-tools {
        position: absolute !important;
        inset: auto 12px 12px 12px !important;
        width: auto !important;
        height: 42px !important;
        min-height: 42px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 8px !important;
        pointer-events: none !important;
    }

    body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-tools > *,
    body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-action-group,
    body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-action-group > * {
        pointer-events: auto !important;
    }

    body.chat-landing[data-mode="chat"] #chat-compose-field .chat-tool-btn,
    body.chat-landing[data-mode="chat"] #chat-compose-field .chat-voice-btn,
    body.chat-landing[data-mode="chat"] #chat-compose-field .send-btn {
        flex: 0 0 38px !important;
        width: 38px !important;
        min-width: 38px !important;
        max-width: 38px !important;
        height: 38px !important;
        min-height: 38px !important;
        max-height: 38px !important;
        border-radius: 50% !important;
    }

    body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-action-group {
        display: inline-flex !important;
        align-items: center !important;
        gap: 7px !important;
        margin-left: auto !important;
    }

    body.chat-landing[data-mode="chat"] #chat-compose-field .home-composer-call {
        flex: 0 0 auto !important;
        width: auto !important;
        min-width: 74px !important;
        height: 38px !important;
        min-height: 38px !important;
        padding: 0 12px !important;
        border-radius: 999px !important;
        font-size: 13px !important;
    }

    body.chat-landing[data-mode="chat"] .composer-capability-shell {
        display: none !important;
        min-height: 0 !important;
        height: 0 !important;
        margin: 0 !important;
    }

    body.chat-landing[data-mode="chat"] .composer {
        padding-bottom: 0 !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) {
        background: rgba(43, 46, 51, .90) !important;
    }
}

/* Keep the empty landing composer as one horizontal Gemini-style row.
 * The shared attachment stylesheet turns landing inputs into a stacked flex
 * layout for the conversation editor; on the home screen the empty state is
 * intentionally a compact pill, so restore the single-row geometry here. */
@media (min-width: 921px) {
    html body.chat-landing[data-mode="chat"]
    #chat-compose-field .chat-input-wrap:not(.has-attachments) {
        display: block !important;
        position: relative !important;
        height: 66px !important;
        min-height: 66px !important;
        padding: 0 !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
    }

    html body.chat-landing[data-mode="chat"]
    #chat-compose-field .chat-input-wrap:not(.has-attachments) #chat-input {
        position: absolute !important;
        inset: 0 190px 0 50px !important;
        display: block !important;
        width: auto !important;
        min-width: 0 !important;
        min-height: 66px !important;
        height: 66px !important;
        margin: 0 !important;
        padding: 20px 0 !important;
        overflow: hidden !important;
        resize: none !important;
        box-sizing: border-box !important;
        background: transparent !important;
        white-space: nowrap !important;
        text-overflow: ellipsis !important;
        line-height: 1.35 !important;
        z-index: 1 !important;
    }

    html body.chat-landing[data-mode="chat"]
    #chat-compose-field .chat-input-wrap:not(.has-attachments) .chat-input-hint {
        top: 50% !important;
        right: 194px !important;
        left: 51px !important;
        transform: translateY(-50%) !important;
        line-height: 1.35 !important;
        z-index: 2 !important;
    }

    html body.chat-landing[data-mode="chat"]
    #chat-compose-field .chat-input-wrap:not(.has-attachments) .chat-input-tools {
        position: absolute !important;
        inset: 0 12px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        width: auto !important;
        height: 66px !important;
        min-height: 66px !important;
        margin: 0 !important;
        padding: 0 !important;
        box-sizing: border-box !important;
        pointer-events: none !important;
        z-index: 3 !important;
    }

    html body.chat-landing[data-mode="chat"]
    #chat-compose-field .chat-input-tools > *,
    html body.chat-landing[data-mode="chat"]
    #chat-compose-field .chat-input-action-group,
    html body.chat-landing[data-mode="chat"]
    #chat-compose-field .chat-input-action-group > * {
        pointer-events: auto !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    body.chat-landing[data-mode="chat"] :is(
        .home-tool-drawer,
        .home-drawer-backdrop,
        .home-rail-action,
        .home-composer-pill
    ) {
        transition: none !important;
    }
}

/* The landing page keeps the input controls in one pill, but the capability
 * catalogue still belongs underneath it.  Keep the catalogue lightweight and
 * horizontally scrollable so the four groups remain available without
 * reintroducing the old square card. */
@media (min-width: 921px) {
    body.chat-landing[data-mode="chat"] .composer {
        width: min(820px, calc(100% - 80px)) !important;
        max-width: 820px !important;
    }

    body.chat-landing[data-mode="chat"] #chat-compose-field {
        width: min(820px, 100%) !important;
        margin-right: auto !important;
        margin-left: auto !important;
    }

    body.chat-landing[data-mode="chat"] #chat-compose-field > .chat-input-wrap:not(.has-attachments) {
        width: min(560px, 100%) !important;
        margin-right: auto !important;
        margin-left: auto !important;
    }

    body.chat-landing[data-mode="chat"] .composer-capability-shell {
        display: block !important;
        width: 100% !important;
        min-height: 0 !important;
        height: auto !important;
        margin: 20px 0 0 !important;
        padding: 0 4px 2px !important;
        overflow: visible !important;
    }

    body.chat-landing[data-mode="chat"] .composer-capability-bar {
        display: flex !important;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 0 !important;
        align-items: stretch !important;
        justify-content: flex-start !important;
        gap: 8px !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        padding: 2px 2px 8px !important;
        scrollbar-width: none !important;
        -webkit-overflow-scrolling: touch !important;
    }

    body.chat-landing[data-mode="chat"] .composer-capability-bar::-webkit-scrollbar {
        display: none !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group {
        display: flex !important;
        flex: 0 0 auto !important;
        min-width: max-content !important;
        grid-template-rows: none !important;
        flex-direction: column !important;
        gap: 5px !important;
        padding: 0 8px !important;
        border-left: 1px solid rgba(220, 225, 233, .72) !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group:first-child {
        padding-left: 4px !important;
        border-left: 0 !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group h3 {
        display: flex !important;
        min-height: 18px !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 3px !important;
        margin: 0 !important;
        color: #737985 !important;
        font-size: 11px !important;
        font-weight: 620 !important;
        line-height: 1.3 !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group-actions {
        display: flex !important;
        min-width: 0 !important;
        align-items: stretch !important;
        justify-content: flex-start !important;
        gap: 2px !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn {
        display: flex !important;
        width: 55px !important;
        min-width: 55px !important;
        max-width: 74px !important;
        min-height: 58px !important;
        height: 58px !important;
        padding: 4px 3px !important;
        flex: 0 0 55px !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 4px !important;
        border: 1px solid transparent !important;
        border-radius: 10px !important;
        background: transparent !important;
        color: #5a606b !important;
        font-size: 10px !important;
        line-height: 1.2 !important;
        text-align: center !important;
        white-space: normal !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn:hover,
    body.chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn:focus-visible,
    body.chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn.active {
        border-color: rgba(208, 216, 228, .72) !important;
        background: rgba(255, 255, 255, .56) !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group .capability-icon {
        width: 28px !important;
        height: 28px !important;
        flex: 0 0 28px !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-group {
        border-left-color: rgba(65, 70, 80, .82) !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-group h3 {
        color: #aeb0b5 !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn {
        color: #c8cace !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn:hover,
    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn:focus-visible,
    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn.active {
        background: rgba(66, 70, 78, .58) !important;
        border-color: rgba(102, 108, 119, .72) !important;
    }
}

/* Keep the legal/product notice at the bottom of the landing workspace.
 * It should not occupy the visual space above the title and composer. */
body.chat-landing[data-mode="chat"] .workspace > .fuuvo-ai-disclaimer {
    position: absolute !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    z-index: 20 !important;
    width: auto !important;
    margin: 0 !important;
    padding: 10px 18px max(10px, env(safe-area-inset-bottom)) !important;
    background: transparent !important;
}

@media (max-width: 920px) {
    body.chat-landing[data-mode="chat"] .workspace > .fuuvo-ai-disclaimer {
        padding: 8px 10px max(8px, env(safe-area-inset-bottom)) !important;
    }
}

/* Center the complete category row and keep every label readable.  The row
 * shrinks to its content on wide screens; only narrower windows use the
 * existing horizontal scroll fallback. */
@media (min-width: 921px) {
    body.chat-landing[data-mode="chat"] .composer-capability-shell {
        overflow: hidden !important;
    }

    body.chat-landing[data-mode="chat"] .composer-capability-bar {
        display: flex !important;
        width: max-content !important;
        max-width: 100% !important;
        margin-right: auto !important;
        margin-left: auto !important;
        justify-content: center !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group {
        flex: 0 0 auto !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group-actions {
        flex-wrap: nowrap !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn {
        overflow: visible !important;
        text-overflow: clip !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn > span:last-child {
        display: block !important;
        max-width: none !important;
        overflow: visible !important;
        text-overflow: clip !important;
        white-space: nowrap !important;
    }
}

/* Desktop capability previews mirror the visual hover guidance used by the
 * reference workspace while keeping every existing button as the click target. */
body.chat-landing[data-mode="chat"] > #home-capability-preview[data-home-tool-preview] {
    display: none;
}

@media (min-width: 921px) and (any-hover: hover) and (any-pointer: fine) {
    body.chat-landing[data-mode="chat"] .home-capability-preview:not([hidden]) {
        position: fixed !important;
        z-index: 1260 !important;
        display: block !important;
        box-sizing: border-box !important;
        width: min(376px, var(--home-preview-available-width, calc(100vw - 32px))) !important;
        max-height: calc(100dvh - 24px) !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        border: 1px solid #e2e7ef !important;
        border-radius: 16px !important;
        background: #ffffff !important;
        color: #202b3b !important;
        box-shadow: 0 18px 48px rgba(38, 53, 77, .16), 0 3px 10px rgba(38, 53, 77, .06) !important;
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
        transform: translateY(9px) scale(.985) !important;
        transform-origin: 50% 100% !important;
        transition: opacity 160ms ease, transform 190ms cubic-bezier(.2, .72, .2, 1), visibility 0s linear 190ms !important;
        will-change: opacity, transform !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-preview[data-placement="below"] {
        transform: translateY(-9px) scale(.985) !important;
        transform-origin: 50% 0 !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-preview.is-visible {
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        transform: translateY(0) scale(1) !important;
        transition-delay: 0s !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-preview-media {
        position: relative !important;
        display: grid !important;
        aspect-ratio: 16 / 9 !important;
        margin: 10px 10px 0 !important;
        place-items: center !important;
        overflow: hidden !important;
        border: 1px solid #e6ebf2 !important;
        border-radius: 11px !important;
        background: #f5f7fb !important;
        isolation: isolate !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-preview-media::after {
        position: absolute !important;
        inset: 0 !important;
        z-index: 1 !important;
        content: "" !important;
        background: linear-gradient(180deg, transparent 65%, rgba(255, 255, 255, .12) 100%) !important;
        pointer-events: none !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-preview-media > :is(img, video) {
        position: relative !important;
        z-index: 0 !important;
        display: block !important;
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        transform: scale(1) !important;
        transition: transform 4.8s cubic-bezier(.2, .7, .2, 1) !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-preview.is-visible .home-capability-preview-media > :is(img, video) {
        transform: none !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-preview[data-preview-fit="contain"] .home-capability-preview-media > :is(img, video) {
        width: calc(100% - 30px) !important;
        height: calc(100% - 24px) !important;
        object-fit: contain !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-preview-media > [hidden] {
        display: none !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-preview-zodiac:not([hidden]) {
        display: grid !important;
        width: calc(100% - 38px) !important;
        height: calc(100% - 28px) !important;
        padding: 8px 22px !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        grid-template-rows: repeat(2, minmax(0, 1fr)) !important;
        place-items: center !important;
        gap: 4px 18px !important;
        border-radius: 6px !important;
        background: #ffffff !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-preview-zodiac img {
        display: block !important;
        width: 50px !important;
        height: 50px !important;
        padding: 7px !important;
        object-fit: contain !important;
        border: 1px solid #dae5f8 !important;
        border-radius: 50% !important;
        background: #eef4ff !important;
        opacity: .9 !important;
        transform: translateY(0) !important;
        transition: transform 220ms ease, opacity 220ms ease !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-preview.is-visible .home-capability-preview-zodiac img:nth-child(odd) {
        opacity: 1 !important;
        transform: translateY(-2px) !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-preview-badge {
        position: absolute !important;
        top: 12px !important;
        left: 12px !important;
        z-index: 2 !important;
        display: inline-flex !important;
        min-height: 23px !important;
        padding: 0 10px !important;
        align-items: center !important;
        border: 1px solid rgba(213, 223, 237, .85) !important;
        border-radius: 999px !important;
        background: rgba(255, 255, 255, .9) !important;
        color: #35465e !important;
        font-size: 11px !important;
        font-weight: 700 !important;
        letter-spacing: .02em !important;
        line-height: 1 !important;
        box-shadow: 0 4px 12px rgba(38, 53, 77, .1) !important;
        backdrop-filter: blur(8px) !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-preview-audio {
        position: absolute !important;
        right: 12px !important;
        bottom: 12px !important;
        z-index: 3 !important;
        display: inline-flex !important;
        min-height: 30px !important;
        max-width: calc(100% - 24px) !important;
        padding: 0 12px !important;
        align-items: center !important;
        justify-content: center !important;
        border: 1px solid rgba(213, 223, 237, .9) !important;
        border-radius: 999px !important;
        background: rgba(255, 255, 255, .94) !important;
        color: #263b56 !important;
        font: inherit !important;
        font-size: 12px !important;
        font-weight: 700 !important;
        line-height: 1 !important;
        white-space: nowrap !important;
        cursor: pointer !important;
        box-shadow: 0 4px 14px rgba(38, 53, 77, .14) !important;
        backdrop-filter: blur(8px) !important;
        transition: background-color 140ms ease, border-color 140ms ease, transform 140ms ease !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-preview-audio:hover,
    body.chat-landing[data-mode="chat"] .home-capability-preview-audio:focus-visible {
        border-color: #bdcee7 !important;
        background: #edf4ff !important;
        outline: none !important;
        transform: translateY(-1px) !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-preview-audio[hidden] {
        display: none !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-preview-copy {
        display: grid !important;
        min-height: 94px !important;
        padding: 15px 17px 17px !important;
        align-content: center !important;
        gap: 6px !important;
        background: #ffffff !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-preview-copy strong {
        overflow-wrap: anywhere !important;
        color: #202b3b !important;
        font-size: 16px !important;
        font-weight: 700 !important;
        line-height: 1.35 !important;
        letter-spacing: 0 !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-preview-copy p {
        margin: 0 !important;
        overflow-wrap: anywhere !important;
        color: #66758b !important;
        font-size: 12px !important;
        font-weight: 520 !important;
        line-height: 1.55 !important;
        letter-spacing: 0 !important;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-preview:not([hidden]) {
        border-color: rgba(150, 183, 224, .3) !important;
        background: linear-gradient(145deg, #151d29 0%, #0f141d 100%) !important;
        color: #f4f5f6 !important;
        box-shadow: 0 26px 70px rgba(0, 0, 0, .52), 0 0 0 1px rgba(101, 166, 255, .06) inset !important;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-preview-media {
        border-color: rgba(255, 255, 255, .14) !important;
        background: #0b1018 !important;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-preview-media::after {
        background:
            linear-gradient(180deg, rgba(6, 12, 21, .02) 32%, rgba(6, 12, 21, .62) 100%),
            linear-gradient(120deg, rgba(64, 197, 255, .12), transparent 45%, rgba(126, 92, 255, .18)) !important;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-preview-badge {
        border-color: rgba(175, 220, 255, .34) !important;
        background: rgba(9, 19, 33, .58) !important;
        color: #e7f5ff !important;
        box-shadow: 0 8px 20px rgba(0, 0, 0, .18) !important;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-preview-audio {
        border-color: rgba(197, 232, 255, .5) !important;
        background: rgba(9, 19, 33, .8) !important;
        color: #f5fbff !important;
        box-shadow: 0 8px 18px rgba(0, 0, 0, .24) !important;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-preview-audio:is(:hover, :focus-visible) {
        border-color: rgba(222, 244, 255, .88) !important;
        background: rgba(36, 111, 155, .9) !important;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-preview-copy {
        background: linear-gradient(180deg, rgba(18, 26, 38, .92), rgba(14, 19, 28, .98)) !important;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-preview-copy strong {
        color: #f7fbff !important;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-preview-zodiac:not([hidden]) {
        background: #f7f8fa !important;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-preview-copy p {
        color: #a9bbd1 !important;
    }
}

@media (max-width: 920px), (any-hover: none) {
    body.chat-landing[data-mode="chat"] > #home-capability-preview[data-home-tool-preview] {
        display: none !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    body.chat-landing[data-mode="chat"] .home-capability-preview,
    body.chat-landing[data-mode="chat"] .home-capability-preview :is(img, video) {
        transition: none !important;
        animation: none !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-preview.is-visible .home-capability-preview-media > :is(img, video) {
        transform: none !important;
    }
}

/* Final artwork rule: function icons never receive colored background tiles. */
html body.chat-landing[data-mode="chat"] :is(.composer-capability-btn, .core-feature-btn, .home-tool-drawer-item) :is(.capability-icon, .core-feature-btn-icon),
html body.chat-landing[data-mode="chat"] :is(.composer-capability-btn, .core-feature-btn, .home-tool-drawer-item):is(:hover, :focus-visible, .active) :is(.capability-icon, .core-feature-btn-icon) {
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

html body.chat-landing[data-mode="chat"] .home-tool-drawer .home-tool-drawer-item {
    background: transparent !important;
    box-shadow: none !important;
}

html:not([data-ui-theme="dark"]) body.chat-landing[data-mode="chat"] .home-tool-drawer .home-tool-drawer-item:is(:hover, :focus-visible) {
    background: #f2f6fc !important;
}

html:not([data-ui-theme="dark"]) body.chat-landing[data-mode="chat"] .home-tool-drawer .home-tool-drawer-item.active {
    border-color: #b9d6ff !important;
    background: #e8f2ff !important;
    color: #0b5fc7 !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-tool-drawer .home-tool-drawer-item:is(:hover, :focus-visible) {
    background: #292e36 !important;
}

body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-tool-drawer .home-tool-drawer-item.active {
    border-color: #365f94 !important;
    background: #223652 !important;
    color: #a9d0ff !important;
}

html body.chat-landing[data-mode="chat"] :is(.composer-capability-btn, .core-feature-btn),
html body.chat-landing[data-mode="chat"] :is(.composer-capability-btn, .core-feature-btn):is(:hover, :focus-visible, :active, .active) {
    border-color: transparent !important;
    background: transparent !important;
    box-shadow: none !important;
}

/* Final shared-rail alignment. This block intentionally follows the legacy
 * home rules so the same component geometry wins on every workspace. */
@media (min-width: 921px) {
    body.chat-landing[data-mode="chat"] {
        --home-drawer-width: 430px;
    }

    html body.chat-landing[data-mode="chat"] nav.rail.home-workspace-rail {
        padding: 12px 4px max(12px, env(safe-area-inset-bottom)) !important;
        border-right-color: #e4e8ee !important;
        background: #fafbfc !important;
    }

    html body.chat-landing[data-mode="chat"] nav[data-fuuvo-workspace-rail="1"] .home-rail-logo {
        width: 56px !important;
        height: 36px !important;
        margin: 0 0 4px !important;
    }

    html body.chat-landing[data-mode="chat"] nav[data-fuuvo-workspace-rail="1"] .home-rail-logo .home-rail-logo-wordmark {
        width: 50px !important;
        max-height: 25px !important;
    }

    body.chat-landing[data-mode="chat"] :is(.home-workspace-rail-stack, .home-workspace-rail-footer) {
        gap: 7px !important;
    }

    html body.chat-landing[data-mode="chat"] nav[data-fuuvo-workspace-rail="1"] .home-rail-action {
        position: relative !important;
        width: 56px !important;
        min-width: 56px !important;
        min-height: 60px !important;
        font-size: 11.5px !important;
        font-weight: 600 !important;
    }

    html body.chat-landing[data-mode="chat"] nav[data-fuuvo-workspace-rail="1"] .home-rail-action-icon svg {
        width: 23px !important;
        height: 23px !important;
    }

    html body.chat-landing[data-mode="chat"] > .app[data-fuuvo-app-shell="1"] > :is(.home-tool-drawer, aside[data-fuuvo-shared-sidebar="1"]) {
        top: 12px !important;
        bottom: 12px !important;
        left: calc(var(--home-rail-width) + 10px) !important;
        border-color: #dfe4eb !important;
        border-radius: 8px !important;
        background: #ffffff !important;
        box-shadow: 0 18px 48px rgba(20, 28, 42, .16) !important;
    }

    html body.chat-landing[data-mode="chat"] .home-tool-drawer-header {
        min-height: 68px !important;
        padding: 14px 16px 11px !important;
    }

    html body.chat-landing[data-mode="chat"] .home-tool-drawer-scroll {
        padding: 7px 10px 14px !important;
    }

    html body.chat-landing[data-mode="chat"] .home-tool-group {
        padding: 9px 5px 11px !important;
    }

    html body.chat-landing[data-mode="chat"] .home-tool-drawer .home-tool-drawer-item {
        height: 78px !important;
        min-height: 78px !important;
        gap: 5px !important;
        font-weight: 600 !important;
    }

    body[data-ui-theme="dark"].chat-landing[data-mode="chat"] > .app[data-fuuvo-app-shell="1"] > :is(.home-tool-drawer, aside[data-fuuvo-shared-sidebar="1"]) {
        border-color: #303844 !important;
        background: #1c2026 !important;
    }
}

/* Final category restore: this intentionally comes after the later pill
 * overrides so the old centered four-group layout wins in the cascade. */
@media (min-width: 921px) {
    body.chat-landing[data-mode="chat"] .composer-capability-shell {
        display: grid !important;
        width: 100% !important;
        min-height: 112px !important;
        height: auto !important;
        margin: 24px 0 0 !important;
        padding: 0 !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 0 !important;
        align-items: stretch !important;
        overflow: visible !important;
    }

    body.chat-landing[data-mode="chat"] .composer-capability-bar {
        display: grid !important;
        width: 100% !important;
        height: auto !important;
        min-height: 112px !important;
        margin: 0 auto !important;
        padding: 0 !important;
        grid-column: 1 / -1 !important;
        grid-template-columns: 1.05fr 1.32fr 1.68fr 1fr !important;
        align-items: stretch !important;
        justify-content: center !important;
        gap: 0 !important;
        overflow: visible !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group {
        display: grid !important;
        min-width: 0 !important;
        padding: 0 12px !important;
        grid-template-rows: 25px minmax(0, 1fr) !important;
        align-content: start !important;
        gap: 7px !important;
        border-left: 1px solid #e5e5e7 !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group:first-child {
        padding-left: 0 !important;
        border-left: 0 !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group:last-child {
        padding-right: 0 !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group h3 {
        display: flex !important;
        min-height: 25px !important;
        margin: 0 !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 4px !important;
        color: #696c73 !important;
        font-size: 12px !important;
        font-weight: 610 !important;
        line-height: 1.3 !important;
        text-align: center !important;
        white-space: nowrap !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group-actions {
        display: flex !important;
        min-width: 0 !important;
        align-items: flex-start !important;
        justify-content: center !important;
        gap: 2px !important;
        flex-wrap: nowrap !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn {
        display: flex !important;
        width: auto !important;
        min-width: 52px !important;
        max-width: 76px !important;
        min-height: 78px !important;
        height: 78px !important;
        margin: 0 !important;
        padding: 5px 3px !important;
        flex: 1 1 60px !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 6px !important;
        border: 1px solid transparent !important;
        border-radius: 8px !important;
        background: transparent !important;
        color: #4d5057 !important;
        font-size: 11px !important;
        font-weight: 550 !important;
        line-height: 1.25 !important;
        text-align: center !important;
        white-space: normal !important;
        overflow: visible !important;
        box-shadow: none !important;
        transform: none !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn > span:last-child {
        display: block !important;
        max-width: 100% !important;
        overflow: visible !important;
        text-overflow: clip !important;
        overflow-wrap: anywhere !important;
        white-space: normal !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn:hover,
    body.chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn:focus-visible,
    body.chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn.active {
        border-color: #e0e1e3 !important;
        background: #f0f0f2 !important;
        color: #1f2125 !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group .capability-icon {
        display: inline-flex !important;
        width: 34px !important;
        min-width: 34px !important;
        height: 34px !important;
        flex: 0 0 34px !important;
        align-items: center !important;
        justify-content: center !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-group {
        border-left-color: #303235 !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-group h3 {
        color: #aeb0b5 !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn {
        color: #c8cace !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn:hover,
    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn:focus-visible,
    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn.active {
        border-color: #45484d !important;
        background: #303235 !important;
        color: #ffffff !important;
    }
}

@media (min-width: 921px) and (max-width: 1120px) {
    body.chat-landing[data-mode="chat"] .composer-capability-bar {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        row-gap: 14px !important;
        min-height: 224px !important;
    }

    body.chat-landing[data-mode="chat"] .composer-capability-shell {
        min-height: 224px !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group:nth-child(odd) {
        padding-left: 0 !important;
        border-left: 0 !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group:nth-child(even) {
        padding-right: 0 !important;
    }
}

/* Give the landing input a little more breathing room: the hint starts
 * clearly after the left action icon, and the pill is wider on desktop so it
 * matches the open reference composition. */
@media (min-width: 921px) {
    body.chat-landing[data-mode="chat"] #chat-compose-field > .chat-input-wrap:not(.has-attachments) {
        width: min(760px, 100%) !important;
        margin-right: auto !important;
        margin-left: auto !important;
    }

    html body.chat-landing[data-mode="chat"]
    #chat-compose-field .chat-input-wrap:not(.has-attachments) #chat-input {
        inset: 0 190px 0 72px !important;
    }

    html body.chat-landing[data-mode="chat"]
    #chat-compose-field .chat-input-wrap:not(.has-attachments) .chat-input-hint {
        right: 194px !important;
        left: 74px !important;
    }
}

/* The recent-chats drawer should hug its content instead of leaving a wide
 * empty strip on the right. Keep this adjustment scoped to the home history
 * surface so feature-page sidebars retain the shared desktop contract. */
@media (min-width: 921px) {
    html body.chat-landing[data-mode="chat"].home-history-drawer-open
    aside[data-fuuvo-shared-sidebar="1"] {
        width: 336px !important;
        min-width: 336px !important;
    }
}

@media (max-width: 920px) {
    html body.chat-landing[data-mode="chat"]
    aside[data-fuuvo-shared-sidebar="1"] {
        width: min(68vw, 300px) !important;
        min-width: min(68vw, 300px) !important;
    }
}

/* Let the home header reveal the same workspace surface as the page body.
 * The landing glow is painted on .workspace, so an opaque/translucent header
 * would otherwise create a visible horizontal colour break at the top. */
html body.chat-landing[data-mode="chat"] :is(.workspace-chat-header, .mobile-chat-topbar) {
    background: transparent !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

/* The shared dark-theme header rule has higher specificity than the landing
 * rule above. Match it so the header can reveal the same workspace surface. */
html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] :is(.workspace-chat-header, .mobile-chat-topbar) {
    background: transparent !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    box-shadow: none !important;
}

/*
 * Reference-aligned landing composer.
 *
 * Keep the empty home composer tall enough for the two-level control layout
 * shown in the reference image.  The capability catalogue remains part of
 * the page surface instead of looking like a second card: only the subtle
 * separators between groups are retained.
 */
@media (min-width: 921px) {
    html body.chat-landing[data-mode="chat"] .composer {
        background: transparent !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }

    /*
     * The dark theme declares a more specific `.composer` surface earlier
     * in this stylesheet. Match that specificity here so the landing composer
     * cannot become a separate rectangular panel again.
     */
    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .composer {
        background: transparent !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }

    html body.chat-landing[data-mode="chat"] .composer::before,
    html body.chat-landing[data-mode="chat"] .composer-top::before {
        background: none !important;
        box-shadow: none !important;
        filter: none !important;
        opacity: 0 !important;
    }

    html body.chat-landing[data-mode="chat"] .composer {
        width: min(1080px, calc(100% - 64px)) !important;
        max-width: 1080px !important;
    }

    html body.chat-landing[data-mode="chat"] #chat-compose-field {
        width: min(980px, 100%) !important;
        margin-right: auto !important;
        margin-left: auto !important;
    }

    html body.chat-landing[data-mode="chat"]
    #chat-compose-field > .chat-input-wrap:not(.has-attachments) {
        width: min(950px, 100%) !important;
        height: 146px !important;
        min-height: 146px !important;
        margin-right: auto !important;
        margin-left: auto !important;
        padding: 0 !important;
        overflow: hidden !important;
        border: 1px solid rgba(186, 196, 211, .72) !important;
        border-radius: 22px !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    html body.chat-landing[data-mode="chat"]
    #chat-compose-field .chat-input-wrap:not(.has-attachments) #chat-input {
        position: absolute !important;
        inset: 0 0 auto 0 !important;
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 92px !important;
        height: 92px !important;
        margin: 0 !important;
        padding: 18px 20px 8px !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        resize: none !important;
        box-sizing: border-box !important;
        background: transparent !important;
        white-space: pre-wrap !important;
        text-overflow: clip !important;
        line-height: 1.5 !important;
        z-index: 1 !important;
    }

    html body.chat-landing[data-mode="chat"]
    #chat-compose-field .chat-input-wrap:not(.has-attachments) .chat-input-hint {
        top: 20px !important;
        right: 20px !important;
        left: 20px !important;
        transform: none !important;
        line-height: 1.5 !important;
        white-space: normal !important;
        z-index: 2 !important;
    }

    html body.chat-landing[data-mode="chat"]
    #chat-compose-field .chat-input-wrap:not(.has-attachments) .chat-input-tools {
        position: absolute !important;
        inset: auto 14px 13px 14px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        width: auto !important;
        height: 46px !important;
        min-height: 46px !important;
        margin: 0 !important;
        padding: 0 !important;
        box-sizing: border-box !important;
        pointer-events: none !important;
        z-index: 3 !important;
    }

    html body.chat-landing[data-mode="chat"]
    #chat-compose-field .chat-input-tools > *,
    html body.chat-landing[data-mode="chat"]
    #chat-compose-field .chat-input-action-group,
    html body.chat-landing[data-mode="chat"]
    #chat-compose-field .chat-input-action-group > * {
        pointer-events: auto !important;
    }

    html body.chat-landing[data-mode="chat"]
    #chat-compose-field .chat-input-tools .chat-tool-btn,
    html body.chat-landing[data-mode="chat"]
    #chat-compose-field .chat-input-tools .chat-voice-btn {
        width: 46px !important;
        min-width: 46px !important;
        max-width: 46px !important;
        height: 46px !important;
        min-height: 46px !important;
        border-radius: 23px !important;
    }

    html body.chat-landing[data-mode="chat"]
    #chat-compose-field .chat-input-tools .send-btn {
        width: 96px !important;
        min-width: 96px !important;
        max-width: 96px !important;
        height: 46px !important;
        min-height: 46px !important;
        border-radius: 23px !important;
    }

    html body.chat-landing[data-mode="chat"] .composer-capability-shell {
        display: grid !important;
        width: 100% !important;
        min-height: 150px !important;
        height: auto !important;
        margin: 34px 0 0 !important;
        padding: 0 !important;
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
        overflow: visible !important;
    }

    html body.chat-landing[data-mode="chat"] .composer-capability-bar {
        display: grid !important;
        width: 100% !important;
        min-height: 150px !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        grid-template-columns: 1.05fr 1.32fr 1.68fr 1fr !important;
        align-items: stretch !important;
        gap: 0 !important;
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
        overflow: visible !important;
    }

    html body.chat-landing[data-mode="chat"] .home-capability-group {
        display: grid !important;
        min-width: 0 !important;
        min-height: 150px !important;
        padding: 0 20px !important;
        grid-template-rows: 28px minmax(0, 1fr) !important;
        align-content: start !important;
        gap: 9px !important;
        border: 0 !important;
        border-left: 1px solid rgba(220, 225, 233, .72) !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    html body.chat-landing[data-mode="chat"] .home-capability-group:first-child {
        padding-left: 0 !important;
        border-left: 0 !important;
    }

    html body.chat-landing[data-mode="chat"] .home-capability-group:last-child {
        padding-right: 0 !important;
    }

    html body.chat-landing[data-mode="chat"] .home-capability-group[hidden],
    html body.chat-landing[data-mode="chat"]
    .home-capability-group-actions > .composer-capability-btn[hidden] {
        display: none !important;
    }

    html body.chat-landing[data-mode="chat"] .home-capability-group h3 {
        display: flex !important;
        min-height: 28px !important;
        margin: 0 !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 5px !important;
        color: #696c73 !important;
        font-size: 13px !important;
        font-weight: 620 !important;
        line-height: 1.3 !important;
        text-align: center !important;
        white-space: nowrap !important;
    }

    html body.chat-landing[data-mode="chat"] .home-capability-group-actions {
        display: flex !important;
        min-width: 0 !important;
        align-items: flex-start !important;
        justify-content: center !important;
        gap: 8px !important;
        flex-wrap: nowrap !important;
    }

    html body.chat-landing[data-mode="chat"]
    .home-capability-group-actions > .composer-capability-btn {
        display: flex !important;
        width: auto !important;
        min-width: 68px !important;
        max-width: none !important;
        min-height: 108px !important;
        height: 108px !important;
        margin: 0 !important;
        padding: 7px 6px !important;
        flex: 1 1 76px !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 9px !important;
        border: 1px solid transparent !important;
        border-radius: 12px !important;
        background: transparent !important;
        color: #4d5057 !important;
        font-size: 13px !important;
        font-weight: 550 !important;
        line-height: 1.3 !important;
        text-align: center !important;
        white-space: normal !important;
        overflow: visible !important;
        box-shadow: none !important;
        transform: none !important;
    }

    html body.chat-landing[data-mode="chat"]
    .home-capability-group-actions > .composer-capability-btn > span:last-child {
        display: block !important;
        max-width: 100% !important;
        overflow: visible !important;
        text-overflow: clip !important;
        overflow-wrap: anywhere !important;
        white-space: normal !important;
    }

    html body.chat-landing[data-mode="chat"]
    .home-capability-group-actions > .composer-capability-btn:is(:hover, :focus-visible, .active) {
        border-color: transparent !important;
        background: rgba(120, 132, 150, .08) !important;
        color: #1f2125 !important;
    }

    html body.chat-landing[data-mode="chat"]
    .home-capability-group-actions > .composer-capability-btn .capability-icon {
        display: inline-flex !important;
        width: 44px !important;
        min-width: 44px !important;
        height: 44px !important;
        min-height: 44px !important;
        flex: 0 0 44px !important;
        align-items: center !important;
        justify-content: center !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"]
    #chat-compose-field > .chat-input-wrap:not(.has-attachments) {
        border-color: rgba(155, 166, 184, .52) !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"]
    .home-capability-group {
        border-left-color: rgba(65, 70, 80, .82) !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"]
    .home-capability-group h3 {
        color: #b8bbc2 !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"]
    .home-capability-group-actions > .composer-capability-btn {
        color: #d4d6db !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"]
    .home-capability-group-actions > .composer-capability-btn:is(:hover, :focus-visible, .active) {
        border-color: transparent !important;
        background: rgba(255, 255, 255, .07) !important;
        color: #ffffff !important;
    }

    /*
     * The menu is positioned against the viewport by the interaction script,
     * so it stays clear of both the composer and the horizontal scroll shell.
     */
    html body.chat-landing[data-mode="chat"]
    .home-capability-overflow-panel {
        top: auto !important;
        bottom: auto !important;
        margin-top: 0 !important;
    }

    /*
     * The visible action is one stateful control. The original AI-call
     * trigger stays in the DOM as the empty-state bridge, but is not rendered
     * as a second pill beside the action.
     */
    html body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-action-group > .home-composer-call {
        display: none !important;
    }

    html body.chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn.is-talk {
        width: 96px !important;
        min-width: 96px !important;
        max-width: 96px !important;
        height: 46px !important;
        min-height: 46px !important;
        padding: 0 18px !important;
        gap: 7px !important;
        border-radius: 23px !important;
        background: #36373a !important;
        color: #e1e2e4 !important;
        box-shadow: none !important;
    }

    html body.chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn.is-talk:hover {
        background: #414246 !important;
        color: #ffffff !important;
        box-shadow: none !important;
    }

    html body.chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn.is-talk svg {
        width: 19px !important;
        height: 19px !important;
        flex: 0 0 19px !important;
    }

    html body.chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn .chat-send-mode-label {
        display: inline-block !important;
        max-width: 54px !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        font-size: 13px !important;
        font-weight: 640 !important;
        line-height: 1 !important;
    }

    html body.chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn.has-text {
        width: 46px !important;
        min-width: 46px !important;
        max-width: 46px !important;
        padding: 0 !important;
        gap: 0 !important;
        background: var(--home-accent) !important;
        color: #ffffff !important;
        box-shadow: 0 5px 12px rgba(67, 136, 238, .2) !important;
    }

    html body.chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn.has-text .chat-send-mode-label {
        display: none !important;
    }
}

/*
 * Landing composer glow.
 *
 * The palette is assigned by applyLandingInputGlow() on each landing-page
 * boot. Keep the colour treatment behind the actual controls so the hint,
 * typed prompt and action buttons remain crisp and fully interactive.
 */
html body.chat-landing[data-mode="chat"]
#chat-compose-field .chat-input-wrap:not(.has-attachments) {
    position: relative !important;
    isolation: isolate !important;
    background: transparent !important;
    box-shadow:
        0 0 28px var(--home-glow-shadow-a, rgba(60, 166, 255, .24)),
        0 0 68px var(--home-glow-shadow-b, rgba(164, 92, 255, .16)),
        0 12px 34px rgba(9, 16, 31, .16) !important;
}

html body.chat-landing[data-mode="chat"]
#chat-compose-field .chat-input-wrap:not(.has-attachments)::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 0 !important;
    pointer-events: none !important;
    border-radius: inherit !important;
    background:
        radial-gradient(ellipse 74% 92% at 12% 16%, var(--home-glow-a, rgba(60, 166, 255, .34)), transparent 68%),
        radial-gradient(ellipse 70% 88% at 88% 16%, var(--home-glow-b, rgba(164, 92, 255, .28)), transparent 70%),
        radial-gradient(ellipse 78% 96% at 50% 104%, var(--home-glow-c, rgba(42, 225, 205, .21)), transparent 72%) !important;
    filter: blur(14px) saturate(1.16) !important;
    opacity: .52 !important;
}

html body.chat-landing[data-mode="chat"]
#chat-compose-field .chat-input-wrap:not(.has-attachments) #chat-input,
html body.chat-landing[data-mode="chat"]
#chat-compose-field .chat-input-wrap:not(.has-attachments) .chat-input-hint,
html body.chat-landing[data-mode="chat"]
#chat-compose-field .chat-input-wrap:not(.has-attachments) .chat-input-tools {
    z-index: 1 !important;
}

html body.chat-landing[data-mode="chat"]
#chat-compose-field .chat-input-wrap:not(.has-attachments) .chat-input-hint {
    z-index: 2 !important;
}

html body.chat-landing[data-mode="chat"]
#chat-compose-field .chat-input-wrap:not(.has-attachments) .chat-input-tools {
    z-index: 3 !important;
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"]
#chat-compose-field .chat-input-wrap:not(.has-attachments)::before {
    opacity: .42 !important;
}

/*
 * The randomized palette belongs to the whole landing workspace, not only
 * the composer rectangle. Keep the broad glow behind the title, input and
 * capability groups; the input-specific glow above remains a subtle echo.
 */
@media (min-width: 921px) {
    html body.chat-landing[data-mode="chat"]
    .workspace[data-fuuvo-app-workspace="1"] {
        background:
            radial-gradient(ellipse 760px 470px at 52% 34%, var(--home-bg-glow-a, rgba(89, 160, 255, .14)), transparent 72%),
            radial-gradient(ellipse 600px 390px at 64% 48%, var(--home-bg-glow-b, rgba(171, 136, 241, .11)), transparent 76%),
            radial-gradient(ellipse 520px 330px at 34% 51%, var(--home-bg-glow-c, rgba(42, 225, 205, .08)), transparent 78%),
            var(--home-workspace-bg, #ffffff) !important;
    }

    html body.chat-landing[data-mode="chat"]
    .workspace[data-fuuvo-app-workspace="1"]::before {
        background:
            radial-gradient(ellipse 680px 420px at 52% 34%, var(--home-bg-glow-a, rgba(89, 160, 255, .12)), transparent 70%),
            radial-gradient(ellipse 540px 360px at 64% 48%, var(--home-bg-glow-b, rgba(171, 136, 241, .09)), transparent 74%),
            radial-gradient(ellipse 460px 300px at 34% 51%, var(--home-bg-glow-c, rgba(42, 225, 205, .07)), transparent 76%) !important;
        filter: blur(30px) saturate(1.12) !important;
        opacity: .92 !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"]
    .workspace[data-fuuvo-app-workspace="1"] {
        background:
            radial-gradient(ellipse 760px 470px at 52% 34%, var(--home-bg-glow-a, rgba(61, 119, 210, .18)), transparent 72%),
            radial-gradient(ellipse 600px 390px at 64% 48%, var(--home-bg-glow-b, rgba(119, 83, 180, .15)), transparent 76%),
            radial-gradient(ellipse 520px 330px at 34% 51%, var(--home-bg-glow-c, rgba(42, 225, 205, .11)), transparent 78%),
            var(--home-workspace-bg, #17191a) !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"]
    .workspace[data-fuuvo-app-workspace="1"]::before {
        opacity: 1 !important;
    }
}

/*
 * Keep the overflow-group heading readable while it is hovered or opened.
 * The legacy light-theme hover rule is more specific than the base dark
 * heading colour, so explicitly restore a high-contrast dark-theme treatment
 * here. This also keeps the chevron inheriting the same visible colour.
 */
html body[data-ui-theme="dark"].chat-landing[data-mode="chat"]
.home-capability-group.has-overflow > h3:is(:hover, :focus-visible),
html body[data-ui-theme="dark"].chat-landing[data-mode="chat"]
.home-capability-group.is-overflow-open > h3 {
    color: #f4f7fb !important;
    background: rgba(255, 255, 255, .085) !important;
    border-radius: 8px !important;
    text-shadow: 0 1px 10px rgba(0, 0, 0, .32) !important;
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"]
.home-capability-group.has-overflow > h3:is(:hover, :focus-visible) svg,
html body[data-ui-theme="dark"].chat-landing[data-mode="chat"]
.home-capability-group.is-overflow-open > h3 svg {
    color: currentColor !important;
    opacity: .95 !important;
}

@media (max-width: 920px) {
    html body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-action-group > .home-composer-call {
        display: none !important;
    }

    html body.chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn.is-talk {
        width: 74px !important;
        min-width: 74px !important;
        max-width: 74px !important;
        height: 40px !important;
        min-height: 40px !important;
        padding: 0 12px !important;
        gap: 5px !important;
        border-radius: 20px !important;
        background: #36373a !important;
        color: #e1e2e4 !important;
        box-shadow: none !important;
    }

    html body.chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn.is-talk svg {
        width: 17px !important;
        height: 17px !important;
        flex: 0 0 17px !important;
    }

    html body.chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn .chat-send-mode-label {
        display: inline-block !important;
        max-width: 42px !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        font-size: 12px !important;
        font-weight: 640 !important;
        line-height: 1 !important;
    }

    html body.chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn.has-text {
        width: 40px !important;
        min-width: 40px !important;
        max-width: 40px !important;
        padding: 0 !important;
        gap: 0 !important;
        background: var(--home-accent) !important;
        color: #ffffff !important;
        box-shadow: 0 4px 10px rgba(67, 136, 238, .2) !important;
    }

    html body.chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn.has-text .chat-send-mode-label {
        display: none !important;
    }
}

/* Final state override after compact-layout rules. */
html body.chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn:not(.is-talk):not(.has-text),
html body.chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn.is-busy:not(.has-text),
html body.chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn:not(.is-talk):not(.has-text):is(:hover, :focus-visible, :active) {
    width: auto !important;
    min-width: 76px !important;
    max-width: none !important;
    height: 40px !important;
    min-height: 40px !important;
    max-height: 40px !important;
    padding: 0 8px !important;
    gap: 6px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: var(--home-ink, #17181b) !important;
    box-shadow: none !important;
}

html body.chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn:not(.is-talk):not(.has-text):is(:hover, :focus-visible, :active) {
    color: var(--home-accent, #1769e0) !important;
}

html body.chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn > svg {
    width: 18px !important;
    height: 18px !important;
    flex: 0 0 18px !important;
}

html body.chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn .chat-send-mode-label {
    display: inline-block !important;
    max-width: 56px !important;
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: nowrap !important;
    font-size: 13px !important;
    font-weight: 640 !important;
    line-height: 1 !important;
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn:not(.is-talk):not(.has-text),
html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn:not(.is-talk):not(.has-text):is(:hover, :focus-visible, :active) {
    background: transparent !important;
    color: #e1e2e4 !important;
    box-shadow: none !important;
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn:not(.is-talk):not(.has-text):is(:hover, :focus-visible, :active) {
    color: #8ab9ff !important;
}

/* Keep both states as one visual control: only the icon changes. */
html body.chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn.is-talk,
html body.chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn.has-text {
    min-width: 86px !important;
    height: 40px !important;
    min-height: 40px !important;
    padding: 0 15px !important;
    gap: 7px !important;
    border: 1px solid #d6d7da !important;
    border-radius: 20px !important;
    background: #f5f5f6 !important;
    color: #27292d !important;
    box-shadow: none !important;
}

html body.chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn:is(.is-talk, .has-text):hover,
html body.chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn:is(.is-talk, .has-text):focus-visible {
    border-color: #c7c8cc !important;
    background: #ebebed !important;
    color: #17191c !important;
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn:is(.is-talk, .has-text) {
    border-color: #4a4b4e !important;
    background: #36373a !important;
    color: #e1e2e4 !important;
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn:is(.is-talk, .has-text):hover,
html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn:is(.is-talk, .has-text):focus-visible {
    border-color: #5b5c60 !important;
    background: #414246 !important;
    color: #ffffff !important;
}

/* Reference-style landing conversation actions: a quiet round microphone
 * beside a compact, readable Talk control. Keep the label on one line even
 * when the composer is shown in a narrow desktop/mobile viewport. */
html body.chat-landing[data-mode="chat"] #chat-compose-field .chat-voice-btn.is-hold-to-talk {
    width: 44px !important;
    min-width: 44px !important;
    max-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
    border-radius: 50% !important;
    background: #f4f6f9 !important;
    color: #53647b !important;
    border: 1px solid #e4e8ee !important;
    box-shadow: none !important;
}

html body.chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn.is-talk {
    width: 72px !important;
    min-width: 72px !important;
    max-width: 72px !important;
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
    padding: 0 11px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    border: 1px solid #e1e6ed !important;
    border-radius: 22px !important;
    background: #ffffff !important;
    color: #2d405a !important;
    box-shadow: 0 2px 8px rgba(32, 48, 72, .06) !important;
    white-space: nowrap !important;
}

html body.chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn.is-talk:hover,
html body.chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn.is-talk:focus-visible {
    border-color: #cbd8e8 !important;
    background: #f8fbff !important;
    color: #1e5a9e !important;
    box-shadow: 0 4px 12px rgba(32, 78, 132, .1) !important;
}

html body.chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn.is-talk > svg {
    width: 17px !important;
    height: 17px !important;
    flex: 0 0 17px !important;
}

html body.chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn.is-talk .chat-send-mode-label {
    display: inline-block !important;
    max-width: none !important;
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: nowrap !important;
    font-size: 13px !important;
    font-weight: 650 !important;
    line-height: 1 !important;
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] #chat-compose-field .chat-voice-btn.is-hold-to-talk {
    background: #252b34 !important;
    border-color: #3d4959 !important;
    color: #c8d5e5 !important;
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn.is-talk {
    border-color: #4a5666 !important;
    background: #303640 !important;
    color: #e2eaf4 !important;
    box-shadow: none !important;
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn.is-talk:hover,
html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn.is-talk:focus-visible {
    border-color: #62758c !important;
    background: #394351 !important;
    color: #ffffff !important;
}

/* Once text is entered, keep the send control in the same quiet pill family
 * as the starting action, but show only the arrow. The existing button
 * handler remains active, so the whole pill stays clickable. */
html body.chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn.has-text {
    width: 94px !important;
    min-width: 94px !important;
    max-width: 94px !important;
    height: 46px !important;
    min-height: 46px !important;
    max-height: 46px !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0 !important;
    border: 1px solid #d6dce5 !important;
    border-radius: 23px !important;
    background: #f5f5f6 !important;
    color: #2f3742 !important;
    box-shadow: 0 2px 8px rgba(32, 48, 72, .06) !important;
    white-space: nowrap !important;
    cursor: pointer !important;
}

html body.chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn.has-text:hover,
html body.chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn.has-text:focus-visible {
    border-color: #bfcbd9 !important;
    background: #eef2f6 !important;
    color: #1f2937 !important;
    box-shadow: 0 4px 12px rgba(32, 78, 132, .1) !important;
}

html body.chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn.has-text > svg {
    width: 20px !important;
    height: 20px !important;
    flex: 0 0 20px !important;
}

html body.chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn.has-text .chat-send-mode-label {
    display: none !important;
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn.has-text {
    border-color: #4a5564 !important;
    background: #303640 !important;
    color: #e2eaf4 !important;
    box-shadow: none !important;
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn.has-text:hover,
html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] #chat-compose-field #chat-send-btn.has-text:focus-visible {
    border-color: #62758c !important;
    background: #394351 !important;
    color: #ffffff !important;
}

/* The PC voice entry keeps its full name and the same width when sending. */
@media (min-width: 921px) {
    html[lang="en-US"] { --pc-chat-voice-entry-width: 144px; }
    html body:is(.chat-landing, .chat-detail-page, .chat-detail-open)[data-mode="chat"]:has(#ai-chat-model)
    #chat-compose-field.has-chat-input > .chat-input-wrap:not(.has-attachments) .chat-input-action-group #chat-send-btn.send-btn:is(.is-talk, .has-text) {
        width: var(--pc-chat-voice-entry-width, 112px) !important;
        min-width: var(--pc-chat-voice-entry-width, 112px) !important;
        max-width: var(--pc-chat-voice-entry-width, 112px) !important;
        flex: 0 0 var(--pc-chat-voice-entry-width, 112px) !important;
        padding-inline: 14px !important;
    }
}

/* The translation preview contains readable source/target text and a
 * language picker. Preserve the complete artwork instead of cropping it like
 * the photographic capability previews. */
@media (min-width: 921px) and (any-hover: hover) and (any-pointer: fine) {
    body.chat-landing[data-mode="chat"] .home-capability-preview[data-preview-key="translate"] .home-capability-preview-media {
        background: #eef1ff !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-preview[data-preview-key="translate"] .home-capability-preview-media::after {
        background: linear-gradient(120deg, rgba(255, 255, 255, .03), transparent 48%, rgba(126, 92, 255, .05)) !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-preview[data-preview-key="translate"] .home-capability-preview-media > img {
        width: calc(100% - 8px) !important;
        height: calc(100% - 8px) !important;
        object-fit: contain !important;
    }
}

/* Source: public/static/css/fuuvo-genspark-home-final.css */
/* Final landing hierarchy pass: move the ambience behind the content and
 * keep the composer and capability labels readable at every viewport. */
@media (min-width: 921px) {
    body.chat-landing[data-mode="chat"] .workspace[data-fuuvo-app-workspace="1"] {
        background:
            radial-gradient(ellipse 600px 300px at 52% 17%, rgba(89, 160, 255, .12), transparent 72%),
            radial-gradient(ellipse 480px 250px at 62% 28%, rgba(171, 136, 241, .09), transparent 75%),
            var(--home-workspace-bg, #fff) !important;
    }

    body.chat-landing[data-mode="chat"] .workspace[data-fuuvo-app-workspace="1"]::before {
        background: radial-gradient(ellipse 540px 270px at 54% 18%, rgba(88, 166, 255, .11), transparent 70%) !important;
        opacity: .72 !important;
    }

    body.chat-landing[data-mode="chat"] .composer {
        z-index: 4 !important;
    }

    body.chat-landing[data-mode="chat"] #chat-compose-field {
        position: relative !important;
        z-index: 4 !important;
    }

    body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) {
        border-color: #c9d7e9 !important;
        background: rgba(255, 255, 255, .96) !important;
        box-shadow:
            0 22px 50px rgba(31, 77, 139, .16),
            0 4px 13px rgba(32, 44, 67, .08) !important;
        backdrop-filter: blur(18px) saturate(120%) !important;
    }

    body.chat-landing[data-mode="chat"] .composer-capability-shell {
        position: relative !important;
        z-index: 4 !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group {
        border-left-color: #d8e2ef !important;
        border-radius: 8px;
        background: rgba(255, 255, 255, .86) !important;
        box-shadow: 0 4px 13px rgba(33, 72, 118, .05);
    }

    body.chat-landing[data-mode="chat"] .home-capability-group h3 {
        color: #65758c !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn {
        color: #3f5067 !important;
        overflow: visible !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn > span:last-child {
        word-break: normal !important;
        overflow-wrap: normal !important;
        white-space: normal !important;
        text-overflow: clip !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group[data-home-capability-group="office"] .composer-capability-btn {
        min-width: 68px !important;
        flex-basis: 68px !important;
        padding-right: 2px !important;
        padding-left: 2px !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group[data-home-capability-group="office"] .composer-capability-btn > span:last-child {
        display: inline-block !important;
        max-width: none !important;
    }

    html body.chat-landing[data-mode="chat"] .home-capability-group[data-home-capability-group="office"] .composer-capability-btn span[data-home-copy-en="AI Spreadsheet"],
    html body.chat-landing[data-mode="chat"] .home-capability-group[data-home-capability-group="office"] .composer-capability-btn span[data-home-copy-en="AI Document"] {
        display: inline-block !important;
        width: max-content !important;
        max-width: none !important;
        font-size: 9px !important;
        word-break: keep-all !important;
        overflow-wrap: normal !important;
        white-space: nowrap !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn:hover,
    body.chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn:focus-visible,
    body.chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn.active {
        border-color: #c4d8f2 !important;
        background: #f4f8fe !important;
        color: #116bd0 !important;
    }
}

@media (max-width: 920px) {
    body.chat-landing[data-mode="chat"] .workspace[data-fuuvo-app-workspace="1"] {
        background:
            radial-gradient(ellipse 440px 240px at 54% 12%, rgba(89, 160, 255, .10), transparent 72%),
            radial-gradient(ellipse 360px 210px at 64% 24%, rgba(171, 136, 241, .07), transparent 75%),
            var(--home-workspace-bg, #fff) !important;
    }

    body.chat-landing[data-mode="chat"] .composer {
        z-index: 4 !important;
    }

    body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) {
        border-color: #c9d7e9 !important;
        background: rgba(255, 255, 255, .96) !important;
        box-shadow: 0 15px 34px rgba(31, 77, 139, .13), 0 3px 10px rgba(32, 44, 67, .07) !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn > span:last-child {
        word-break: normal !important;
        overflow-wrap: normal !important;
        white-space: normal !important;
        text-overflow: clip !important;
    }

    body.chat-landing[data-mode="chat"] .home-capability-group[data-home-capability-group="office"] .composer-capability-btn {
        min-width: 66px !important;
        flex-basis: 66px !important;
    }

    html body.chat-landing[data-mode="chat"] .home-capability-group[data-home-capability-group="office"] .composer-capability-btn span[data-home-copy-en="AI Spreadsheet"],
    html body.chat-landing[data-mode="chat"] .home-capability-group[data-home-capability-group="office"] .composer-capability-btn span[data-home-copy-en="AI Document"] {
        word-break: keep-all !important;
        overflow-wrap: normal !important;
        white-space: nowrap !important;
    }
}

/* The legacy dark-theme bundle uses a higher-specificity selector. Keep the
 * dark landing palette readable without losing the foreground hierarchy. */
html body[data-ui-theme="dark"].chat-landing[data-mode="chat"],
html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .app[data-fuuvo-app-shell="1"],
html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .workspace[data-fuuvo-app-workspace="1"],
html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .composer,
html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] :is(.workspace-chat-header, .mobile-chat-topbar) {
    background-color: #1a1b1e !important;
    color: #f3f4f6 !important;
}

html:has(body[data-ui-theme="dark"].chat-landing[data-mode="chat"]) {
    background-color: #0f141d !important;
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .workspace[data-fuuvo-app-workspace="1"] {
    background:
        radial-gradient(ellipse 680px 310px at 52% 10%, rgba(61, 119, 210, .19), transparent 71%),
        radial-gradient(ellipse 480px 260px at 63% 16%, rgba(119, 83, 180, .15), transparent 74%),
        #1a1b1e !important;
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .workspace[data-fuuvo-app-workspace="1"]::before {
    background: radial-gradient(ellipse 600px 280px at 52% 9%, rgba(61, 119, 210, .16), transparent 70%) !important;
    opacity: .82 !important;
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] :is(.workspace-chat-header, .mobile-chat-topbar) {
    border-color: #2d2e32 !important;
    background-color: rgba(26, 27, 30, .96) !important;
    box-shadow: 0 1px 0 rgba(0, 0, 0, .16) !important;
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .workspace-chat-header :is(
    .workspace-header-link,
    .workspace-chat-header-center strong,
    .workspace-chat-header-center span
) {
    color: #c8cbd1 !important;
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) {
    border-color: #4b586d !important;
    background: rgba(35, 36, 40, .97) !important;
    box-shadow:
        0 22px 50px rgba(0, 0, 0, .30),
        0 5px 14px rgba(0, 0, 0, .20),
        0 0 0 1px rgba(112, 141, 184, .12) !important;
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) :is(#chat-input, .chat-input-hint),
html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .composer-title,
html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .composer-title > span:not(.home-living-brand),
html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .composer-title .home-brand-trademark {
    color: #f3f4f6 !important;
    -webkit-text-fill-color: #f3f4f6 !important;
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) #chat-input::placeholder,
html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) .chat-input-hint {
    color: #a4a6ad !important;
    -webkit-text-fill-color: #a4a6ad !important;
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-group {
    border-left-color: #414650 !important;
    background: rgba(35, 36, 40, .88) !important;
    box-shadow: 0 10px 24px rgba(0, 0, 0, .24) !important;
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-group h3,
html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn,
html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .core-feature-btn {
    color: #e2e5ea !important;
    text-shadow: none !important;
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .core-feature-actions {
    border-color: rgba(72, 78, 90, .86) !important;
    background: rgba(35, 36, 40, .90) !important;
    box-shadow: 0 10px 24px rgba(0, 0, 0, .24) !important;
}

@media (max-width: 920px) {
    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .workspace[data-fuuvo-app-workspace="1"] {
        background:
            radial-gradient(ellipse 430px 220px at 54% 4%, rgba(61, 119, 210, .17), transparent 72%),
            radial-gradient(ellipse 330px 190px at 66% 12%, rgba(119, 83, 180, .12), transparent 75%),
            #1a1b1e !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .workspace[data-fuuvo-app-workspace="1"]::before {
        background: radial-gradient(ellipse 390px 210px at 54% 4%, rgba(61, 119, 210, .14), transparent 70%) !important;
    }
}

/* Desktop width pass: keep every capability label readable at one consistent size. */
@media (min-width: 921px) {
    html body.chat-landing[data-mode="chat"] .composer {
        width: min(1320px, calc(100% - 80px)) !important;
        max-width: 1320px !important;
    }

    html body.chat-landing[data-mode="chat"] #chat-compose-field {
        width: min(1220px, 100%) !important;
        max-width: none !important;
    }

    html body.chat-landing[data-mode="chat"] .composer-capability-shell {
        width: 100% !important;
        max-width: 1220px !important;
        margin-right: auto !important;
        margin-left: auto !important;
    }

    html body.chat-landing[data-mode="chat"] .composer-capability-bar {
        display: grid !important;
        width: 100% !important;
        max-width: none !important;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr) minmax(0, 1.4fr) minmax(0, 1.05fr) !important;
    }

    html body.chat-landing[data-mode="chat"] .home-capability-group {
        padding-right: 12px !important;
        padding-left: 12px !important;
    }

    html body.chat-landing[data-mode="chat"] .home-capability-group:first-child {
        padding-left: 0 !important;
    }

    html body.chat-landing[data-mode="chat"] .home-capability-group:last-child {
        padding-right: 0 !important;
    }

    html body.chat-landing[data-mode="chat"] .home-capability-group-actions {
        display: grid !important;
        min-width: 0 !important;
        gap: 8px !important;
    }

    html body.chat-landing[data-mode="chat"] .home-capability-group[data-home-capability-group="office"] .home-capability-group-actions,
    html body.chat-landing[data-mode="chat"] .home-capability-group[data-home-capability-group="utilities"] .home-capability-group-actions {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }

    html body.chat-landing[data-mode="chat"] .home-capability-group[data-home-capability-group="conversation"] .home-capability-group-actions {
        grid-template-columns: none !important;
        grid-auto-flow: column !important;
        grid-auto-columns: minmax(0, 1fr) !important;
    }

    html body.chat-landing[data-mode="chat"] .home-capability-group[data-home-capability-group="creation"] .home-capability-group-actions {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }

    html body.chat-landing[data-mode="chat"] .home-capability-group-actions > .composer-capability-btn {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        flex: none !important;
        padding-right: 3px !important;
        padding-left: 3px !important;
        font-size: 13px !important;
        line-height: 1.2 !important;
        white-space: nowrap !important;
    }

    html body.chat-landing[data-mode="chat"] .home-capability-group-actions > .composer-capability-btn > span:last-child {
        display: block !important;
        max-width: none !important;
        white-space: nowrap !important;
        word-break: keep-all !important;
        overflow-wrap: normal !important;
        overflow: visible !important;
    }

    html body.chat-landing[data-mode="chat"] .home-capability-group[data-home-capability-group="office"] .composer-capability-btn span[data-home-copy-en="AI Spreadsheet"],
    html body.chat-landing[data-mode="chat"] .home-capability-group[data-home-capability-group="office"] .composer-capability-btn span[data-home-copy-en="AI Document"] {
        font-size: 10px !important;
        font-weight: 500 !important;
        width: auto !important;
    }
}

@media (min-width: 921px) and (max-width: 1359px) {
    html body.chat-landing[data-mode="chat"] .composer-capability-shell {
        overflow-x: auto !important;
        overflow-y: hidden !important;
        scrollbar-width: thin;
    }

    html body.chat-landing[data-mode="chat"] .composer-capability-bar {
        width: 1220px !important;
        min-width: 1220px !important;
        max-width: none !important;
    }
}

/* Keep the landing surface light and establish a clear foreground hierarchy
 * even when the saved account theme is dark. */
html body.chat-landing[data-mode="chat"] {
    --home-workspace-bg: #ffffff !important;
    --home-ink: #1f2937 !important;
    --home-muted: #64748b !important;
    --home-line: #d8e2ef !important;
    --home-panel: #ffffff !important;
    --home-soft: #f5f8fc !important;
}

html:has(body.chat-landing[data-mode="chat"]),
html body.chat-landing[data-mode="chat"],
html body.chat-landing[data-mode="chat"] .app[data-fuuvo-app-shell="1"],
html body.chat-landing[data-mode="chat"] .workspace[data-fuuvo-app-workspace="1"],
html body.chat-landing[data-mode="chat"] .composer,
html body.chat-landing[data-mode="chat"] :is(.workspace-chat-header, .mobile-chat-topbar) {
    background-color: #ffffff !important;
    color: var(--home-ink) !important;
}

html body.chat-landing[data-mode="chat"] :is(.workspace-chat-header, .mobile-chat-topbar) {
    border-color: #e6edf5 !important;
    box-shadow: 0 1px 0 rgba(31, 77, 139, .04) !important;
}

html body.chat-landing[data-mode="chat"] .workspace[data-fuuvo-app-workspace="1"] {
    position: relative !important;
    isolation: isolate !important;
    background:
        radial-gradient(ellipse 680px 310px at 52% 10%, rgba(88, 166, 255, .15), transparent 71%),
        radial-gradient(ellipse 480px 260px at 63% 16%, rgba(171, 136, 241, .10), transparent 74%),
        #ffffff !important;
}

html body.chat-landing[data-mode="chat"] .workspace[data-fuuvo-app-workspace="1"]::before {
    background: radial-gradient(ellipse 600px 280px at 52% 9%, rgba(88, 166, 255, .12), transparent 70%) !important;
    opacity: .7 !important;
}

html body.chat-landing[data-mode="chat"] .workspace[data-fuuvo-app-workspace="1"] > * {
    position: relative;
    z-index: 1;
}

html body.chat-landing[data-mode="chat"] .composer,
html body.chat-landing[data-mode="chat"] .composer-capability-shell,
html body.chat-landing[data-mode="chat"] #core-feature-slot {
    position: relative !important;
    z-index: 4 !important;
}

html body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) {
    border-color: #b9cbe0 !important;
    background: rgba(255, 255, 255, .985) !important;
    box-shadow:
        0 22px 50px rgba(31, 77, 139, .16),
        0 5px 14px rgba(32, 44, 67, .08),
        0 0 0 1px rgba(255, 255, 255, .72) !important;
    backdrop-filter: blur(18px) saturate(120%) !important;
}

html body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) :is(#chat-input, .chat-input-hint),
html body.chat-landing[data-mode="chat"] .composer-title {
    color: var(--home-ink) !important;
    -webkit-text-fill-color: var(--home-ink) !important;
}

html body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) .chat-input-hint,
html body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) #chat-input::placeholder {
    color: #64748b !important;
    -webkit-text-fill-color: #64748b !important;
}

html body.chat-landing[data-mode="chat"] .home-capability-group {
    border-left-color: #d8e2ef !important;
    background: rgba(255, 255, 255, .82) !important;
    box-shadow: 0 10px 24px rgba(31, 77, 139, .07) !important;
}

html body.chat-landing[data-mode="chat"] .home-capability-group h3,
html body.chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn,
html body.chat-landing[data-mode="chat"] .core-feature-btn {
    color: #334155 !important;
    text-shadow: none !important;
}

html body.chat-landing[data-mode="chat"] .home-capability-group .composer-capability-btn .capability-icon,
html body.chat-landing[data-mode="chat"] .core-feature-btn .core-feature-btn-icon,
html body.chat-landing[data-mode="chat"] :is(.capability-icon, .core-feature-btn-icon) :is(img, svg, .fuuvo-icon, .home-capability-icon, .home-core-feature-icon) {
    opacity: 1 !important;
    filter: none !important;
}

html body.chat-landing[data-mode="chat"] .core-feature-actions {
    position: relative !important;
    z-index: 4 !important;
    padding: 6px !important;
    border: 1px solid rgba(216, 226, 239, .82) !important;
    border-radius: 14px !important;
    background: rgba(255, 255, 255, .84) !important;
    box-shadow: 0 10px 24px rgba(31, 77, 139, .07) !important;
}

html body.chat-landing[data-mode="chat"] .core-feature-btn:hover,
html body.chat-landing[data-mode="chat"] .core-feature-btn:focus-visible {
    background: #f3f7fc !important;
    color: #1457a6 !important;
}

/* Keep the animated FUUVO wordmark independent from landing-theme text colors. */
html body.chat-landing[data-mode="chat"] #composer-title .home-brand-letter > span {
    color: #2878e8;
    -webkit-text-fill-color: currentColor;
    animation:
        home-letter-wave 3.6s ease-in-out infinite,
        home-letter-color 10s linear infinite;
    animation-delay:
        calc(var(--letter-index) * -.22s),
        calc(var(--letter-index) * -.8s);
}

html body.chat-landing[data-mode="chat"] #composer-title .home-brand-trademark {
    -webkit-text-fill-color: currentColor;
}

@media (prefers-reduced-motion: reduce) {
    html body.chat-landing[data-mode="chat"] #composer-title .home-brand-letter > span {
        animation: none;
    }
}

@media (max-width: 920px) {
    html body.chat-landing[data-mode="chat"] .workspace[data-fuuvo-app-workspace="1"] {
        background:
            radial-gradient(ellipse 430px 220px at 54% 4%, rgba(88, 166, 255, .13), transparent 72%),
            radial-gradient(ellipse 330px 190px at 66% 12%, rgba(171, 136, 241, .08), transparent 75%),
            #ffffff !important;
    }

    html body.chat-landing[data-mode="chat"] .workspace[data-fuuvo-app-workspace="1"]::before {
        background: radial-gradient(ellipse 390px 210px at 54% 4%, rgba(88, 166, 255, .10), transparent 70%) !important;
    }

    html body.chat-landing[data-mode="chat"] .core-feature-actions {
        padding: 4px !important;
        border-radius: 12px !important;
    }
}

/*
 * Stable conversation surface.
 *
 * The landing glow was useful as an experiment, but it made the composer
 * appear to sit inside a second coloured panel and changed between visits.
 * Keep the original neutral workspace/input surfaces so opening or switching
 * a conversation does not change the page background or introduce a frame.
 */
html body.chat-landing[data-mode="chat"] .workspace[data-fuuvo-app-workspace="1"]::before,
html body.chat-landing[data-mode="chat"] .composer-top::before {
    background: none !important;
    filter: none !important;
    opacity: 0 !important;
}

html body.chat-landing[data-mode="chat"] .workspace[data-fuuvo-app-workspace="1"] {
    background: #ffffff !important;
}

html body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) {
    background: #ffffff !important;
    border-color: #dedfe3 !important;
    box-shadow:
        0 12px 34px rgba(24, 27, 35, .08),
        0 2px 8px rgba(24, 27, 35, .04) !important;
    backdrop-filter: none !important;
}

html body.chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments)::before {
    display: none !important;
    content: none !important;
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .workspace[data-fuuvo-app-workspace="1"] {
    background: #1a1b1e !important;
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .workspace[data-fuuvo-app-workspace="1"]::before,
html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .composer-top::before {
    display: none !important;
    background: none !important;
    filter: none !important;
    opacity: 0 !important;
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments) {
    background: #303133 !important;
    border-color: #4a4b4e !important;
    box-shadow: 0 17px 42px rgba(0, 0, 0, .32) !important;
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] #chat-compose-field .chat-input-wrap:not(.has-attachments)::before {
    display: none !important;
    content: none !important;
    background: none !important;
    filter: none !important;
    opacity: 0 !important;
}

/* Keep the capability catalogue fused with the landing workspace.  The
 * individual groups still provide their separator and the action buttons
 * retain their own hover surface, but the catalogue itself must not read as
 * a second coloured panel. */
html body.chat-landing[data-mode="chat"] .composer-capability-shell,
html body.chat-landing[data-mode="chat"] .composer-capability-bar,
html body.chat-landing[data-mode="chat"] .home-capability-group,
html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-group {
    background: transparent !important;
    box-shadow: none !important;
}

@media (max-width: 920px) {
    /* Keep the upload and More controls in one horizontal row on narrow screens. */
    html body[data-mode="chat"] .chat-upload-entry {
        flex: 0 0 auto !important;
        width: max-content !important;
        min-width: max-content !important;
        white-space: nowrap !important;
    }

    html body[data-mode="chat"] .chat-upload-entry .mobile-chat-toolbar-btn {
        flex: 0 0 auto !important;
        width: max-content !important;
        min-width: max-content !important;
        white-space: nowrap !important;
    }
}

/* The final landing pass intentionally keeps the main workspace light. The
 * shared sidebar footer still needs an opaque dark surface so the account
 * launcher does not reveal the light landing panel beside the gear button. */
html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-area {
    border-top-color: #30343b !important;
    background: #1c2026 !important;
    box-shadow: none !important;
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-card {
    background: transparent !important;
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-toggle {
    background: #202a38 !important;
    color: #eef4ff !important;
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-toggle:hover,
html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-menu.is-open .sidebar-account-toggle {
    background: #26354a !important;
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-settings {
    background: transparent !important;
    color: #cfd4dd !important;
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-settings:hover,
html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-account-settings.is-active {
    background: #29313d !important;
    color: #9fc5ff !important;
}

/* Match the reference skills panel: one stable three-column grid and one
 * shared linear icon family for every capability. */
@media (min-width: 921px) {
    body.chat-landing[data-mode="chat"] {
        --home-rail-width: 72px;
        --home-drawer-width: 430px;
        --home-drawer-bg: #ffffff;
    }

    body.chat-landing[data-mode="chat"] .home-tool-drawer {
        left: calc(var(--home-rail-width) + 5px) !important;
        width: min(var(--home-drawer-width), calc(100vw - var(--home-rail-width) - 20px)) !important;
        border-radius: 0 !important;
        box-shadow: 0 12px 30px rgba(24, 32, 46, .08) !important;
    }

    body.chat-landing[data-mode="chat"] .home-tool-drawer-scroll {
        padding: 7px 10px 16px !important;
        gap: 3px !important;
    }

    body.chat-landing[data-mode="chat"] .home-tool-group {
        padding: 9px 6px 10px !important;
        gap: 5px !important;
    }

    body.chat-landing[data-mode="chat"] .home-tool-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 2px !important;
    }

    body.chat-landing[data-mode="chat"] .home-tool-drawer-item,
    body.chat-landing[data-mode="chat"] .home-tool-drawer-item.composer-capability-btn,
    body.chat-landing[data-mode="chat"] .home-tool-drawer-item.core-feature-btn {
        height: 62px !important;
        min-height: 62px !important;
        padding: 5px 3px !important;
        gap: 4px !important;
        border-radius: 5px !important;
        font-size: 12px !important;
        line-height: 1.2 !important;
        letter-spacing: 0 !important;
        white-space: normal !important;
        word-break: keep-all !important;
        overflow-wrap: normal !important;
    }

    body.chat-landing[data-mode="chat"] .home-tool-drawer-item .capability-icon {
        width: 28px !important;
        min-width: 28px !important;
        height: 28px !important;
        flex-basis: 28px !important;
    }

    body.chat-landing[data-mode="chat"] .home-tool-drawer-item .capability-icon .fuuvo-linear-svg {
        width: 24px !important;
        height: 24px !important;
        stroke-width: 1.5 !important;
    }

    body.chat-landing[data-mode="chat"] .home-tool-drawer-item:hover,
    body.chat-landing[data-mode="chat"] .home-tool-drawer-item:focus-visible,
    body.chat-landing[data-mode="chat"] .home-tool-drawer-item.active {
        border-color: #e2e5e9 !important;
        background: #f1f3f5 !important;
        color: #172033 !important;
    }
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-tool-drawer {
    --home-drawer-bg: #1d2025;
    color: #f2f4f7 !important;
    border-color: #343940 !important;
    box-shadow: 0 18px 42px rgba(0, 0, 0, .34) !important;
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-tool-group h2 {
    color: #edf0f4 !important;
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-tool-drawer-item {
    color: #cbd1d9 !important;
}

html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-tool-drawer-item:hover,
html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-tool-drawer-item:focus-visible,
html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-tool-drawer-item.active {
    border-color: #3c444f !important;
    background: #2b3139 !important;
    color: #ffffff !important;
}

/* Phone landing polish. Keep this block below the desktop rules so the
 * compact layout cannot change the PC workspace. */
@media (max-width: 920px) {
    html body.chat-landing[data-mode="chat"] .mobile-chat-topbar {
        min-height: 64px !important;
        padding: 0 12px !important;
        border-bottom: 1px solid rgba(148, 163, 184, .16) !important;
    }

    html body.chat-landing[data-mode="chat"] .composer {
        min-height: calc(100dvh - 64px) !important;
        padding: 28px 16px calc(22px + env(safe-area-inset-bottom)) !important;
    }

    html body.chat-landing[data-mode="chat"] .composer-top {
        margin-bottom: 18px !important;
    }

    html body.chat-landing[data-mode="chat"] .composer-title {
        max-width: 330px !important;
        margin: 0 auto !important;
        font-size: clamp(21px, 6.4vw, 27px) !important;
        line-height: 1.22 !important;
        letter-spacing: 0 !important;
        white-space: normal !important;
        overflow-wrap: normal !important;
        text-wrap: balance !important;
    }

    html body.chat-landing[data-mode="chat"] .chat-input-wrap,
    html body.chat-landing[data-mode="chat"] .chat-input-wrap textarea {
        height: 144px !important;
        min-height: 144px !important;
    }

    html body.chat-landing[data-mode="chat"] .chat-input-wrap {
        border-radius: 18px !important;
    }

    html body.chat-landing[data-mode="chat"] .chat-input-wrap textarea {
        padding: 17px 16px 58px !important;
        font-size: 16px !important;
        line-height: 1.45 !important;
    }

    html body.chat-landing[data-mode="chat"] .chat-input-hint {
        top: 17px !important;
        right: 16px !important;
        left: 16px !important;
        font-size: 14px !important;
        line-height: 1.45 !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
    }

    html body.chat-landing[data-mode="chat"] .chat-input-tools {
        right: 12px !important;
        bottom: 11px !important;
        left: 12px !important;
        height: 80px !important;
        display: block !important;
    }

    /* Keep the mode controls above the action row so the mobile More button
     * never sits on top of model selection or the two mode toggles. */
    html body.chat-landing[data-mode="chat"] .chat-input-tools .chat-upload-entry {
        position: absolute !important;
        left: 0 !important;
        right: auto !important;
        bottom: 0 !important;
    }

    html body.chat-landing[data-mode="chat"] .chat-input-tools .ai-chat-mode-controls {
        position: absolute !important;
        top: 0 !important;
        right: auto !important;
        bottom: auto !important;
        left: 44px !important;
        width: 173px !important;
        transform: none !important;
    }

    html body.chat-landing[data-mode="chat"] .chat-input-tools .chat-input-action-group {
        position: absolute !important;
        top: auto !important;
        right: 0 !important;
        bottom: 0 !important;
        left: auto !important;
    }

    html body.chat-landing[data-mode="chat"] .mobile-chat-toolbar {
        right: auto !important;
        bottom: 0 !important;
        left: 44px !important;
        width: max-content !important;
        padding: 0 !important;
    }

    html body.chat-landing[data-mode="chat"] .chat-tool-btn {
        width: 40px !important;
        min-width: 40px !important;
        height: 40px !important;
    }

    html body.chat-landing[data-mode="chat"] .chat-input-action-group {
        gap: 8px !important;
    }

    html body.chat-landing[data-mode="chat"] .send-btn {
        width: 44px !important;
        min-width: 44px !important;
        height: 44px !important;
    }

    html body.chat-landing[data-mode="chat"] #core-feature-slot {
        margin-top: -10px !important;
    }

    html body.chat-landing[data-mode="chat"] .core-feature-actions {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
    }

    html body.chat-landing[data-mode="chat"] .core-feature-btn {
        min-height: 88px !important;
        padding: 10px 6px !important;
        gap: 7px !important;
        border-radius: 12px !important;
        font-size: 13px !important;
        line-height: 1.25 !important;
        white-space: normal !important;
        word-break: keep-all !important;
        overflow-wrap: normal !important;
    }

    html body.chat-landing[data-mode="chat"] .core-feature-btn-icon,
    html body.chat-landing[data-mode="chat"] .core-feature-btn-icon .fuuvo-icon,
    html body.chat-landing[data-mode="chat"] .core-feature-btn-icon .home-core-feature-icon,
    html body.chat-landing[data-mode="chat"] .core-feature-btn-icon .home-capability-icon {
        width: 30px !important;
        height: 30px !important;
        flex-basis: 30px !important;
    }

    html body.chat-landing[data-mode="chat"] #mobile-chat-more-menu {
        width: min(320px, calc(100vw - 28px)) !important;
        max-height: min(36dvh, 220px) !important;
        padding: 7px !important;
        gap: 4px !important;
        border-radius: 14px !important;
    }

    html body.chat-landing[data-mode="chat"] #mobile-chat-more-menu > button:not(.fuuvo-mobile-tool-sheet-close) {
        min-height: 44px !important;
        padding: 6px 8px !important;
        gap: 8px !important;
        border-radius: 8px !important;
        font-size: 13px !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .mobile-chat-topbar {
        background: rgba(8, 15, 28, .96) !important;
        border-bottom-color: rgba(148, 163, 184, .18) !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .core-feature-btn {
        background: #101a2b !important;
        border-color: rgba(148, 163, 184, .2) !important;
        color: #edf2ff !important;
    }
}

@media (max-width: 360px) {
    html body.chat-landing[data-mode="chat"] .composer {
        padding-right: 12px !important;
        padding-left: 12px !important;
    }

    html body.chat-landing[data-mode="chat"] .composer-title {
        font-size: 20px !important;
    }

    html body.chat-landing[data-mode="chat"] .core-feature-btn {
        height: 76px !important;
        min-height: 76px !important;
        padding: 6px 4px !important;
        font-size: 12px !important;
    }

    html body.chat-landing[data-mode="chat"] .core-feature-actions {
        min-height: 0 !important;
        height: auto !important;
    }
}

/* Mobile drawer theme. The shared sidebar keeps a light mobile fallback in
 * older shell rules, so reapply the active dark surface after those rules. */
@media (max-width: 920px) {
    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"],
    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region {
        background: #11161f !important;
        color: #edf2fa !important;
        border-color: #2b3544 !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] {
        box-shadow: 12px 0 32px rgba(0, 0, 0, .34) !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region {
        scrollbar-color: #53647a transparent !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-scroll-region::-webkit-scrollbar-thumb {
        background: #53647a !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-sidebar-close {
        color: #e8eef8 !important;
        background: transparent !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-sidebar-close:hover,
    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .fuuvo-mobile-sidebar-close:focus-visible {
        background: #202b3b !important;
        color: #ffffff !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav-btn {
        color: #aebbd0 !important;
        border-color: transparent !important;
        background: transparent !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav-btn:hover,
    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav-btn:focus-visible {
        color: #f4f8ff !important;
        background: #1c2736 !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav-btn.active {
        color: #f6f9ff !important;
        background: #1d3554 !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav-btn .rail-icon,
    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-nav-btn .rail-text {
        color: inherit !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .history-main {
        border-top-color: #293444 !important;
        color: #d9e2ef !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .history-title,
    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-section-label {
        color: #dce5f2 !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .history-head .tiny,
    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .conversation-time,
    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .task-time {
        color: #7f8da2 !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .conversation-item,
    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .task-item {
        color: #b8c4d5 !important;
        background: transparent !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .conversation-item:hover,
    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .task-item:hover {
        background: #1b293a !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .conversation-title,
    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .task-title {
        color: #c7d2e2 !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .conversation-item-icon,
    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .conversation-more-btn,
    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .task-more-btn {
        color: #73839a !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-safety-link {
        color: #aebbd0 !important;
        border-top-color: #293444 !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-safety-link:hover,
    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .sidebar-safety-link:focus-visible {
        color: #f4f8ff !important;
        background: #1c2736 !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] aside[data-fuuvo-shared-sidebar="1"] .history-account {
        border-top-color: #2d3746 !important;
        background: #171e29 !important;
    }

    html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .fuuvo-mobile-sidebar-backdrop {
        background: rgba(2, 6, 14, .66) !important;
        backdrop-filter: blur(5px) !important;
    }
}
@media (min-width: 921px) {
    html body.chat-landing[data-mode="chat"] .composer-title-logo-link img {
        top: 0 !important;
        bottom: 0 !important;
        height: 44px !important;
        transform: none !important;
        object-fit: contain !important;
    }
    html body.chat-landing[data-mode="chat"] .chat-input-tools {
        display: flex !important;
        grid-template-columns: none !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 8px !important;
        padding: 0 !important;
    }
    html body.chat-landing[data-mode="chat"] .chat-input-tools > .ai-chat-mode-controls {
        grid-column: auto !important;
        margin-left: 0 !important;
        justify-self: start !important;
    }
    html body.chat-landing[data-mode="chat"] .chat-input-tools > .chat-input-action-group {
        grid-column: auto !important;
        margin-left: auto !important;
    }
    @media (hover: hover) {
        html body.chat-landing[data-mode="chat"] .home-capability-group-actions > .composer-capability-btn:is(:hover, :focus-visible) {
            border-color: #b9d4f8 !important;
            background: #edf4ff !important;
            color: #1677ff !important;
            box-shadow: 0 9px 20px rgba(36, 91, 169, .14) !important;
            transform: translateY(-2px) !important;
        }
        html body[data-ui-theme="dark"].chat-landing[data-mode="chat"] .home-capability-group-actions > .composer-capability-btn:is(:hover, :focus-visible) {
            border-color: #426b9f !important;
            background: #1d314a !important;
            color: #d6e8ff !important;
        }
    }
}

/* Source: public/static/css/fuuvo-home-motion.css */
/* Animate glyphs inside stable slots so the slogan and composer never move. */
.home-feature-options[hidden], body:not(.chat-landing) .home-feature-options { display:none !important; }
.home-feature-options { order:20; width:100%; margin-top:22px; padding:22px; border:1px solid #dce6f3; border-radius:20px; background:#ffffffed; color:#233950; animation:home-options-enter .35s ease both; }
.home-feature-options-head { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:16px; }
.home-feature-options h2 { margin:0; font-size:18px; }
.home-feature-options-head button { width:32px; height:32px; border:0; border-radius:50%; background:#edf3fa; color:#516780; font-size:23px; cursor:pointer; }
.home-feature-option-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.home-feature-option-grid button { padding:16px; text-align:left; border:1px solid #dce6f3; background:#f7faff; color:#233950; border-radius:12px; font:inherit; font-size:14px; line-height:1.6; cursor:pointer; }
.home-feature-option-grid button:hover { border-color:#7bacf0; background:#edf5ff; }
.home-feature-options a { color:#176ad7; font-size:14px; }
body.chat-landing[data-mode="chat"] .composer { transition:top .38s cubic-bezier(.2,.8,.2,1); }
@media(min-width:769px) { html body.chat-landing.home-feature-expanded[data-mode="chat"] .composer { top:clamp(76px,10vh,110px) !important; } }
@media(max-width:768px) { .home-feature-options { padding:16px; } .home-feature-option-grid { grid-template-columns:1fr; gap:8px; } }
@keyframes home-options-enter { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:translateY(0); } }
body[data-ui-theme="dark"] .home-feature-options { background:#1a2535; border-color:#35465e; color:#edf3ff; }
body[data-ui-theme="dark"] .home-feature-option-grid button { background:#243247; color:#edf3ff; border-color:#40536f; }
@media(prefers-reduced-motion:reduce) { .home-feature-options { animation:none; } body.chat-landing[data-mode="chat"] .composer { transition:none; } }
.home-living-brand { display: inline-flex; white-space: nowrap; vertical-align: baseline; }
.home-brand-trademark {
    margin-left: 1px;
    color: #17181b;
    font-size: .42em;
    line-height: 1;
    vertical-align: super;
}
.home-brand-letter { display: inline-block; }
.home-brand-letter > span {
    display: inline-block;
    color: #2878e8;
    animation: home-letter-wave 3.6s ease-in-out infinite, home-letter-color 10s linear infinite;
    animation-delay: calc(var(--letter-index) * -.22s), calc(var(--letter-index) * -.8s);
}
@keyframes home-letter-wave { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-.12em); } }
@keyframes home-letter-color {
    0%, 100% { color: #2878e8; } 20% { color: #8255d9; } 40% { color: #d34388; }
    60% { color: #c16d24; } 80% { color: #149579; }
}
@media (hover: hover) and (pointer: fine) {
    .home-brand-letter { transition: transform 220ms cubic-bezier(.2,.8,.2,1); }
    .home-brand-letter:hover { transform: translateY(-.12em) scale(1.12) rotate(-4deg); }
    .core-feature-btn .core-feature-btn-icon,
    .composer-capability-btn .capability-icon { transition: transform 240ms cubic-bezier(.2,.8,.2,1); }
    .core-feature-btn:hover .core-feature-btn-icon,
    body.chat-landing[data-mode="chat"] .composer-capability-btn:hover .capability-icon {
        transform: translateY(-3px) rotate(-4deg) scale(1.06);
    }
}
body.chat-landing[data-mode="chat"] .composer { isolation: isolate; }
body.chat-landing[data-mode="chat"] .composer::before {
    content: "";
    position: absolute;
    inset: -100px -8% -40px;
    z-index: -1;
    pointer-events: none;
    background: radial-gradient(ellipse at 30% 38%, rgba(104,163,255,.13), transparent 62%),
                radial-gradient(ellipse at 70% 48%, rgba(168,137,241,.10), transparent 62%),
                radial-gradient(ellipse at 50% 68%, rgba(69,196,194,.08), transparent 60%);
}
body.chat-landing[data-mode="chat"] .composer-top { position:relative; isolation:isolate; }
body.chat-landing[data-mode="chat"] .composer-top::before { content:""; position:absolute; inset:-72px 8% -42px; z-index:-1; pointer-events:none; background:radial-gradient(ellipse at 50% 44%,rgba(70,143,255,.14),transparent 68%); filter:blur(8px); }
@media (prefers-reduced-motion: reduce) {
    .home-brand-letter > span { animation: none; }
    .home-brand-letter, .core-feature-btn .core-feature-btn-icon,
    .composer-capability-btn .capability-icon { transition: none; }
    body.chat-landing[data-mode="chat"] .composer-top::before { filter:none; }
    .home-brand-letter:hover,
    .core-feature-btn:hover .core-feature-btn-icon,
    body.chat-landing[data-mode="chat"] .composer-capability-btn:hover .capability-icon { transform: none; }
}
}