html.studio-theme-dark,
html.studio-theme-dark body,
body.studio-theme-dark {
    color-scheme: dark;
    background: #08090c !important;
    color: #e8e8ea !important;
}

body.studio-theme-dark {
    --accent: #e8e8ea;
    --bg: #08090c;
    --bg-base: #08090c;
    --card: #111216;
    --text-main: #e8e8ea;
}

html.studio-theme-dark body .app-shell,
html.studio-theme-dark body .sidebar,
html.studio-theme-dark body .stage,
body.studio-theme-dark .app-shell,
body.studio-theme-dark .sidebar,
body.studio-theme-dark .stage {
    background: #08090c !important;
    border-color: #25262b !important;
}

html.studio-theme-dark body .stage,
body.studio-theme-dark .stage {
    box-shadow: inset 0 0 42px rgba(255,255,255,.015);
}

html.studio-theme-dark body .nav-item,
body.studio-theme-dark .nav-item {
    color: #8f9aab;
}

html.studio-theme-dark body .nav-item:hover,
body.studio-theme-dark .nav-item:hover {
    background: #111216 !important;
    color: #e8e8ea !important;
}

html.studio-theme-dark body .nav-item.active,
body.studio-theme-dark .nav-item.active {
    background: #d8dee9 !important;
    color: #10141d !important;
    box-shadow: 0 12px 24px rgba(0,0,0,.28);
}

html.studio-theme-dark body .logo-ring,
body.studio-theme-dark .logo-ring {
    border-color: #d8dee9 !important;
}

html.studio-theme-dark body #logo-dot,
body.studio-theme-dark #logo-dot {
    background: #d8dee9 !important;
}

html.studio-theme-dark body .nano-monitor,
body.studio-theme-dark .nano-monitor {
    background: rgba(17,18,22,.88) !important;
    color: #d8dee9;
    border-color: rgba(255,255,255,.10) !important;
    box-shadow: 0 12px 34px rgba(0,0,0,.24);
}

html.studio-theme-dark body .divider,
body.studio-theme-dark .divider {
    background: rgba(216,222,233,.14) !important;
}

html.studio-theme-dark body .theme-dock-btn,
body.studio-theme-dark .theme-dock-btn {
    background: #111216;
    border-color: #25262b;
    color: #9aa6b8;
}

html.studio-theme-dark body .theme-dock-btn:hover,
html.studio-theme-dark body .theme-dock-btn.active,
body.studio-theme-dark .theme-dock-btn:hover,
body.studio-theme-dark .theme-dock-btn.active {
    background: #d8dee9;
    border-color: #d8dee9;
    color: #10141d;
}

html.studio-theme-dark body .console-card,
html.studio-theme-dark body .nano-input,
html.studio-theme-dark body .upload-item,
html.studio-theme-dark body .result-frame,
html.studio-theme-dark body .masonry-item,
html.studio-theme-dark body .work-panel,
html.studio-theme-dark body .setting-row,
html.studio-theme-dark body .tool-panel,
html.studio-theme-dark body .control-panel,
html.studio-theme-dark body .topbar,
html.studio-theme-dark body .composer,
html.studio-theme-dark body .composer-body,
html.studio-theme-dark body .bubble.assistant,
html.studio-theme-dark body .history-popover,
html.studio-theme-dark body .thread-item,
html.studio-theme-dark body .lightbox-card,
html.studio-theme-dark body #lightboxCard,
html.studio-theme-dark body .bg-white,
html.studio-theme-dark body .bg-gray-50,
html.studio-theme-dark body .bg-slate-50,
html.studio-theme-dark body .bg-gray-50\/50,
html.studio-theme-dark body .bg-white\/90,
html.studio-theme-dark body .bg-\[\#fbfdff\],
body.studio-theme-dark .console-card,
body.studio-theme-dark .nano-input,
body.studio-theme-dark .upload-item,
body.studio-theme-dark .result-frame,
body.studio-theme-dark .masonry-item,
body.studio-theme-dark .work-panel,
body.studio-theme-dark .setting-row,
body.studio-theme-dark .tool-panel,
body.studio-theme-dark .control-panel,
body.studio-theme-dark .topbar,
body.studio-theme-dark .composer,
body.studio-theme-dark .composer-body,
body.studio-theme-dark .bubble.assistant,
body.studio-theme-dark .history-popover,
body.studio-theme-dark .thread-item,
body.studio-theme-dark .lightbox-card,
body.studio-theme-dark #lightboxCard,
body.studio-theme-dark .bg-white,
body.studio-theme-dark .bg-gray-50,
body.studio-theme-dark .bg-slate-50,
body.studio-theme-dark .bg-gray-50\/50,
body.studio-theme-dark .bg-white\/90,
body.studio-theme-dark .bg-\[\#fbfdff\] {
    background-color: #111216 !important;
    border-color: #25262b !important;
    color: #e8e8ea !important;
}

html.studio-theme-dark body .bg-gray-100,
html.studio-theme-dark body .bg-slate-100,
html.studio-theme-dark body .select-shell,
html.studio-theme-dark body .model-pill,
html.studio-theme-dark body .ratio-grid,
html.studio-theme-dark body .resolution-toggle,
html.studio-theme-dark body .mode-switch,
html.studio-theme-dark body .mini-ratio,
body.studio-theme-dark .bg-gray-100,
body.studio-theme-dark .bg-slate-100,
body.studio-theme-dark .select-shell,
body.studio-theme-dark .model-pill,
body.studio-theme-dark .ratio-grid,
body.studio-theme-dark .resolution-toggle,
body.studio-theme-dark .mode-switch,
body.studio-theme-dark .mini-ratio {
    background-color: #0c0d10 !important;
    border-color: #25262b !important;
}

html.studio-theme-dark body input,
html.studio-theme-dark body textarea,
html.studio-theme-dark body select,
body.studio-theme-dark input,
body.studio-theme-dark textarea,
body.studio-theme-dark select {
    color: #e8e8ea !important;
}

html.studio-theme-dark body input::placeholder,
html.studio-theme-dark body textarea::placeholder,
body.studio-theme-dark input::placeholder,
body.studio-theme-dark textarea::placeholder {
    color: #657286 !important;
}

html.studio-theme-dark body .text-black,
html.studio-theme-dark body .text-gray-700,
html.studio-theme-dark body .text-slate-700,
html.studio-theme-dark body .setting-title,
html.studio-theme-dark body h1,
html.studio-theme-dark body h2,
html.studio-theme-dark body h3,
body.studio-theme-dark .text-black,
body.studio-theme-dark .text-gray-700,
body.studio-theme-dark .text-slate-700,
body.studio-theme-dark .setting-title,
body.studio-theme-dark h1,
body.studio-theme-dark h2,
body.studio-theme-dark h3 {
    color: #e8e8ea !important;
}

html.studio-theme-dark body .text-gray-300,
html.studio-theme-dark body .text-gray-400,
html.studio-theme-dark body .text-gray-500,
html.studio-theme-dark body .text-slate-400,
html.studio-theme-dark body .text-slate-500,
html.studio-theme-dark body .setting-meta,
html.studio-theme-dark body .label-nano,
body.studio-theme-dark .text-gray-300,
body.studio-theme-dark .text-gray-400,
body.studio-theme-dark .text-gray-500,
body.studio-theme-dark .text-slate-400,
body.studio-theme-dark .text-slate-500,
body.studio-theme-dark .setting-meta,
body.studio-theme-dark .label-nano {
    color: #8f9aab !important;
}

html.studio-theme-dark body .border-gray-100,
html.studio-theme-dark body .border-gray-200,
html.studio-theme-dark body .border-gray-300,
html.studio-theme-dark body .border-slate-100,
html.studio-theme-dark body .border-slate-200,
html.studio-theme-dark body .border-black,
html.studio-theme-dark body .border-white,
html.studio-theme-dark body .border-\[\#f1f5f9\],
html.studio-theme-dark body .border-\[\#eef2f7\],
body.studio-theme-dark .border-gray-100,
body.studio-theme-dark .border-gray-200,
body.studio-theme-dark .border-gray-300,
body.studio-theme-dark .border-slate-100,
body.studio-theme-dark .border-slate-200,
body.studio-theme-dark .border-black,
body.studio-theme-dark .border-white,
body.studio-theme-dark .border-\[\#f1f5f9\],
body.studio-theme-dark .border-\[\#eef2f7\] {
    border-color: #2a3444 !important;
}

html.studio-theme-dark body .glass-btn,
html.studio-theme-dark body .btn-action-dark,
html.studio-theme-dark body .send-btn,
html.studio-theme-dark body .gen-btn,
html.studio-theme-dark body .comfy-run,
html.studio-theme-dark body .llm-run,
html.studio-theme-dark body .primary-btn,
html.studio-theme-dark body .bg-black,
body.studio-theme-dark .glass-btn,
body.studio-theme-dark .btn-action-dark,
body.studio-theme-dark .send-btn,
body.studio-theme-dark .gen-btn,
body.studio-theme-dark .comfy-run,
body.studio-theme-dark .llm-run,
body.studio-theme-dark .primary-btn,
body.studio-theme-dark .bg-black {
    background-color: #d8dee9 !important;
    color: #10141d !important;
}

html.studio-theme-dark body .glass-btn:hover,
html.studio-theme-dark body .btn-action-dark:hover,
html.studio-theme-dark body .bg-black:hover,
body.studio-theme-dark .glass-btn:hover,
body.studio-theme-dark .btn-action-dark:hover,
body.studio-theme-dark .bg-black:hover {
    background-color: #c8d0dc !important;
}

html.studio-theme-dark body .gallery-lightbox,
html.studio-theme-dark body #lightbox,
body.studio-theme-dark .gallery-lightbox,
body.studio-theme-dark #lightbox {
    background: rgba(15,20,29,.78) !important;
    backdrop-filter: blur(22px) saturate(1.05);
}

html.studio-theme-dark body .masonry-item:hover,
html.studio-theme-dark body .console-card:focus-within,
html.studio-theme-dark body .select-shell:focus-within,
body.studio-theme-dark .masonry-item:hover,
body.studio-theme-dark .console-card:focus-within,
body.studio-theme-dark .select-shell:focus-within {
    border-color: #566174 !important;
    box-shadow: 0 20px 44px rgba(0,0,0,.28) !important;
}

html.studio-theme-dark body .console-card textarea,
html.studio-theme-dark body #prompt,
html.studio-theme-dark body #promptInput,
body.studio-theme-dark .console-card textarea,
body.studio-theme-dark #prompt,
body.studio-theme-dark #promptInput {
    color: #e5e9f0 !important;
    caret-color: #d8dee9;
}

html.studio-theme-dark body .size-btn,
html.studio-theme-dark body .model-option,
html.studio-theme-dark body .ratio-option,
html.studio-theme-dark body .resolution-option,
html.studio-theme-dark body .mini-ratio button,
html.studio-theme-dark body .mode-switch button,
body.studio-theme-dark .size-btn,
body.studio-theme-dark .model-option,
body.studio-theme-dark .ratio-option,
body.studio-theme-dark .resolution-option,
body.studio-theme-dark .mini-ratio button,
body.studio-theme-dark .mode-switch button {
    background: #111722 !important;
    border-color: #2a3444 !important;
    color: #9aa6b8 !important;
}

html.studio-theme-dark body .size-btn:hover,
html.studio-theme-dark body .model-option:hover,
html.studio-theme-dark body .ratio-option:hover,
html.studio-theme-dark body .resolution-option:hover,
body.studio-theme-dark .size-btn:hover,
body.studio-theme-dark .model-option:hover,
body.studio-theme-dark .ratio-option:hover,
body.studio-theme-dark .resolution-option:hover {
    border-color: #566174 !important;
    color: #d8dee9 !important;
}

html.studio-theme-dark body .size-btn.active,
html.studio-theme-dark body .model-option.active,
html.studio-theme-dark body .ratio-option.active,
html.studio-theme-dark body .resolution-option.active,
html.studio-theme-dark body .mini-ratio button.active,
html.studio-theme-dark body .mode-switch button.active,
body.studio-theme-dark .size-btn.active,
body.studio-theme-dark .model-option.active,
body.studio-theme-dark .ratio-option.active,
body.studio-theme-dark .resolution-option.active,
body.studio-theme-dark .mini-ratio button.active,
body.studio-theme-dark .mode-switch button.active {
    background: #d8dee9 !important;
    border-color: #d8dee9 !important;
    color: #10141d !important;
    box-shadow: 0 10px 24px rgba(0,0,0,.2) !important;
}

html.studio-theme-dark body .ios-slider,
body.studio-theme-dark .ios-slider {
    background: #2a3444 !important;
}

html.studio-theme-dark body .ios-switch input:checked + .ios-slider,
body.studio-theme-dark .ios-switch input:checked + .ios-slider {
    background: #d8dee9 !important;
}

html.studio-theme-dark body .ios-slider:before,
body.studio-theme-dark .ios-slider:before {
    background: #111722 !important;
    box-shadow: 0 2px 8px rgba(0,0,0,.38) !important;
}

html.studio-theme-dark body .composer-wrap,
body.studio-theme-dark .composer-wrap {
    background: linear-gradient(to top,#0f141d 82%,rgba(15,20,29,0)) !important;
}

html.studio-theme-dark body .canvas-gate,
body.studio-theme-dark .canvas-gate {
    background-color: #0f141d !important;
    background-image: radial-gradient(rgba(148,163,184,.18) 1px, transparent 1px) !important;
}

html.studio-theme-dark body .gate-panel,
html.studio-theme-dark body .canvas-item,
html.studio-theme-dark body .canvas-open,
body.studio-theme-dark .gate-panel,
body.studio-theme-dark .canvas-item,
body.studio-theme-dark .canvas-open {
    background: #171d29 !important;
    border-color: #2a3444 !important;
    color: #e5e9f0 !important;
}

html.studio-theme-dark body .canvas-item:hover,
body.studio-theme-dark .canvas-item:hover {
    background: #202838 !important;
}

html.studio-theme-dark body .canvas-item.active,
body.studio-theme-dark .canvas-item.active {
    background: #263247 !important;
    color: #e5e9f0 !important;
}

html.studio-theme-dark body .canvas-card-title,
html.studio-theme-dark body .gate-title,
html.studio-theme-dark body .gate-name-input,
body.studio-theme-dark .canvas-card-title,
body.studio-theme-dark .gate-title,
body.studio-theme-dark .gate-name-input {
    color: #e5e9f0 !important;
}

html.studio-theme-dark body .canvas-card-time,
html.studio-theme-dark body .gate-subtitle,
body.studio-theme-dark .canvas-card-time {
    color: #8f9aab !important;
}

body.studio-theme-dark .gate-subtitle {
    color: #8f9aab !important;
}

html.studio-theme-dark body .canvas-preview-mark,
html.studio-theme-dark body .canvas-delete,
html.studio-theme-dark body .secondary-btn,
html.studio-theme-dark body .gate-back,
html.studio-theme-dark body .gate-trash-entry,
html.studio-theme-dark body .create-cancel,
html.studio-theme-dark body .gate-create-row,
html.studio-theme-dark body .gate-actions,
html.studio-theme-dark body .trash-note,
html.studio-theme-dark body .emoji-picker,
html.studio-theme-dark body .create-menu,
html.studio-theme-dark body .selection-hub,
html.studio-theme-dark body .output-preview,
body.studio-theme-dark .canvas-preview-mark,
body.studio-theme-dark .canvas-delete,
body.studio-theme-dark .secondary-btn,
body.studio-theme-dark .gate-back,
body.studio-theme-dark .gate-trash-entry,
body.studio-theme-dark .create-cancel,
body.studio-theme-dark .gate-create-row,
body.studio-theme-dark .gate-actions,
body.studio-theme-dark .trash-note,
body.studio-theme-dark .emoji-picker,
body.studio-theme-dark .create-menu,
body.studio-theme-dark .selection-hub,
body.studio-theme-dark .output-preview {
    background: #111722 !important;
    border-color: #2a3444 !important;
    color: #d8dee9 !important;
}

html.studio-theme-dark body .gate-trash-badge,
body.studio-theme-dark .gate-trash-badge {
    background: #d8dee9 !important;
    color: #10141d !important;
    border-color: #111722 !important;
}

html.studio-theme-dark body .secondary-btn.active,
body.studio-theme-dark .secondary-btn.active {
    background: #d8dee9 !important;
    border-color: #d8dee9 !important;
    color: #10141d !important;
}

html.studio-theme-dark body .canvas-delete:hover,
html.studio-theme-dark body .create-cancel:hover,
body.studio-theme-dark .canvas-delete:hover,
body.studio-theme-dark .create-cancel:hover {
    background: rgba(248,113,113,.14) !important;
    border-color: rgba(248,113,113,.32) !important;
    color: #fca5a5 !important;
}

html.studio-theme-dark body .canvas-restore:hover,
body.studio-theme-dark .canvas-restore:hover {
    background: rgba(16,185,129,.14) !important;
    border-color: rgba(16,185,129,.32) !important;
    color: #6ee7b7 !important;
}

html.studio-theme-dark body .canvas-delete-box,
body.studio-theme-dark .canvas-delete-box {
    background: #202838 !important;
    border: 1px solid #2a3444;
}

html.studio-theme-dark body .canvas-confirm-btn,
html.studio-theme-dark body .create-confirm,
body.studio-theme-dark .canvas-confirm-btn,
body.studio-theme-dark .create-confirm {
    background: #d8dee9 !important;
    color: #10141d !important;
}

html.studio-theme-dark body .output-resolution,
body.studio-theme-dark .output-resolution {
    background: rgba(17,23,34,.86) !important;
    color: #d8dee9 !important;
}

html.studio-theme-dark body .shell .topbar,
body.studio-theme-dark .shell .topbar {
    background: transparent !important;
    border-color: transparent !important;
    backdrop-filter: none !important;
}

html.studio-theme-dark body .shell,
html.studio-theme-dark body .shell .board,
body.studio-theme-dark .shell,
body.studio-theme-dark .shell .board {
    background-color: #0f141d !important;
    background-image: radial-gradient(rgba(148,163,184,.18) 1px, transparent 1px) !important;
}

html.studio-theme-dark body .shell.theme-dark,
body.studio-theme-dark .shell.theme-dark {
    --page: #0f141d;
    --grid: rgba(148,163,184,.18);
    --panel: rgba(17,23,34,.88);
    --card: #171d29;
    --card-solid: #171d29;
    --soft: #111722;
    --soft-2: #202838;
    --line: rgba(148,163,184,.16);
    --line-2: rgba(148,163,184,.22);
    --text: #e5e9f0;
    --muted: #9aa6b8;
    --faint: #78869a;
    --shadow: rgba(0,0,0,.2);
    --strong: #d8dee9;
    --strong-text: #10141d;
}

html.studio-theme-dark body .shell .panel,
body.studio-theme-dark .shell .panel {
    background: rgba(17,23,34,.86) !important;
    border: 1px solid rgba(148,163,184,.16) !important;
    box-shadow: 0 14px 36px rgba(0,0,0,.18) !important;
}

html.studio-theme-dark body .shell .node,
body.studio-theme-dark .shell .node {
    background: #171d29 !important;
    border-color: rgba(148,163,184,.16) !important;
    box-shadow: 0 16px 42px rgba(0,0,0,.22) !important;
    color: #e5e9f0 !important;
}

html.studio-theme-dark body .shell .node-head,
body.studio-theme-dark .shell .node-head {
    background: #171d29 !important;
    border-bottom-color: rgba(148,163,184,.14) !important;
}

html.studio-theme-dark body .shell .node-title,
body.studio-theme-dark .shell .node-title {
    color: #8f9aab !important;
}

html.studio-theme-dark body .shell .node.selected,
body.studio-theme-dark .shell .node.selected {
    outline-color: rgba(216,222,233,.72) !important;
}

html.studio-theme-dark body .shell .toolbar,
body.studio-theme-dark .shell .toolbar {
    gap: 8px;
}

html.studio-theme-dark body .shell .tool-btn,
html.studio-theme-dark body .shell .select-lite,
html.studio-theme-dark body .shell .gen-count-row,
html.studio-theme-dark body .shell .seg,
html.studio-theme-dark body .shell .llm-mode,
html.studio-theme-dark body .shell .mode-tabs,
body.studio-theme-dark .shell .tool-btn,
body.studio-theme-dark .shell .select-lite,
body.studio-theme-dark .shell .gen-count-row,
body.studio-theme-dark .shell .seg,
body.studio-theme-dark .shell .llm-mode,
body.studio-theme-dark .shell .mode-tabs {
    background: #111722 !important;
    border: 1px solid rgba(148,163,184,.16) !important;
    box-shadow: none !important;
    color: #9aa6b8 !important;
}

html.studio-theme-dark body .shell .gen-settings,
html.studio-theme-dark body .shell .setting-row,
html.studio-theme-dark body .shell .comfy-settings,
body.studio-theme-dark .shell .gen-settings,
body.studio-theme-dark .shell .setting-row,
body.studio-theme-dark .shell .comfy-settings {
    background: #111722 !important;
    border: 1px solid rgba(148,163,184,.16) !important;
    box-shadow: none !important;
    color: #d8dee9 !important;
}

html.studio-theme-dark body .shell .setting-title,
body.studio-theme-dark .shell .setting-title {
    color: #8f9aab !important;
}

html.studio-theme-dark body .shell .setting-input,
html.studio-theme-dark body .shell .setting-check,
html.studio-theme-dark body .shell .gen-count-input,
body.studio-theme-dark .shell .setting-input,
body.studio-theme-dark .shell .setting-check,
body.studio-theme-dark .shell .gen-count-input {
    background: #171d29 !important;
    border-color: rgba(148,163,184,.16) !important;
    color: #e5e9f0 !important;
    box-shadow: none !important;
}

html.studio-theme-dark body .shell .gen-step-btn,
body.studio-theme-dark .shell .gen-step-btn {
    color: #8f9aab !important;
}

html.studio-theme-dark body .shell .gen-step-btn:hover,
body.studio-theme-dark .shell .gen-step-btn:hover {
    background: #202838 !important;
    color: #e5e9f0 !important;
}

html.studio-theme-dark body .shell .tool-btn:hover,
html.studio-theme-dark body .shell .select-lite:hover,
body.studio-theme-dark .shell .tool-btn:hover,
body.studio-theme-dark .shell .select-lite:hover {
    background: #171d29 !important;
    border-color: #566174 !important;
    color: #e5e9f0 !important;
}

html.studio-theme-dark body .shell .llm-mode button,
html.studio-theme-dark body .shell .seg button,
html.studio-theme-dark body .shell .mode-tabs button,
body.studio-theme-dark .shell .llm-mode button,
body.studio-theme-dark .shell .seg button,
body.studio-theme-dark .shell .mode-tabs button {
    background: transparent !important;
    border-color: transparent !important;
    color: #9aa6b8 !important;
    box-shadow: none !important;
}

html.studio-theme-dark body .shell .llm-mode button.active,
html.studio-theme-dark body .shell .seg button.active,
html.studio-theme-dark body .shell .mode-tabs button.active,
body.studio-theme-dark .shell .llm-mode button.active,
body.studio-theme-dark .shell .seg button.active,
body.studio-theme-dark .shell .mode-tabs button.active {
    background: #d8dee9 !important;
    border-color: #d8dee9 !important;
    color: #10141d !important;
}

html.studio-theme-dark body .shell .llm-system,
html.studio-theme-dark body .shell .llm-chat-input,
html.studio-theme-dark body .shell .llm-chat-log,
html.studio-theme-dark body .shell .llm-output,
html.studio-theme-dark body .shell .llm-chat-pane,
body.studio-theme-dark .shell .llm-system,
body.studio-theme-dark .shell .llm-chat-input,
body.studio-theme-dark .shell .llm-chat-log,
body.studio-theme-dark .shell .llm-output,
body.studio-theme-dark .shell .llm-chat-pane {
    background: #111722 !important;
    border-color: #2a3444 !important;
    color: #d8dee9 !important;
}

html.studio-theme-dark body .shell .llm-pane-resizer::before,
body.studio-theme-dark .shell .llm-pane-resizer::before {
    background: #475569 !important;
}

html.studio-theme-dark body .shell .llm-bubble.assistant,
body.studio-theme-dark .shell .llm-bubble.assistant {
    background: #202838 !important;
    border-color: #2a3444 !important;
    color: #e5e9f0 !important;
}

html.studio-theme-dark body .shell .llm-bubble.user,
body.studio-theme-dark .shell .llm-bubble.user {
    background: #d8dee9 !important;
    color: #10141d !important;
}

html.studio-theme-dark body .shell .image-node img,
html.studio-theme-dark body .shell .output-grid img,
html.studio-theme-dark body .shell .output-preview img,
html.studio-theme-dark body .shell .blank-image,
html.studio-theme-dark body .shell .input-item,
html.studio-theme-dark body .shell .prompt-node textarea,
html.studio-theme-dark body .shell .llm-system,
html.studio-theme-dark body .shell .llm-chat-input,
html.studio-theme-dark body .shell .model-input,
body.studio-theme-dark .shell .image-node img,
body.studio-theme-dark .shell .output-grid img,
body.studio-theme-dark .shell .output-preview img,
body.studio-theme-dark .shell .blank-image,
body.studio-theme-dark .shell .input-item,
body.studio-theme-dark .shell .prompt-node textarea,
body.studio-theme-dark .shell .llm-system,
body.studio-theme-dark .shell .llm-chat-input,
body.studio-theme-dark .shell .model-input {
    background: #0f141d !important;
    border-color: rgba(148,163,184,.16) !important;
}

html.studio-theme-dark body .shell .blank-image,
body.studio-theme-dark .shell .blank-image {
    color: #8f9aab !important;
    border-style: dashed !important;
}

html.studio-theme-dark body .shell .blank-image:hover,
html.studio-theme-dark body .shell .blank-image.drag-over,
body.studio-theme-dark .shell .blank-image:hover,
body.studio-theme-dark .shell .blank-image.drag-over {
    background: #151b27 !important;
    border-color: rgba(216,222,233,.42) !important;
    color: #d8dee9 !important;
}

html.studio-theme-dark body .shell .image-caption,
body.studio-theme-dark .shell .image-caption {
    color: #8f9aab !important;
}

html.studio-theme-dark body .shell .input-label,
body.studio-theme-dark .shell .input-label {
    background: rgba(15,20,29,.78) !important;
    color: #d8dee9 !important;
}

html.studio-theme-dark body .shell .prompt-list .bg-slate-50,
html.studio-theme-dark body .shell .prompt-list .border-slate-100,
body.studio-theme-dark .shell .prompt-list .bg-slate-50,
body.studio-theme-dark .shell .prompt-list .border-slate-100 {
    background: #111722 !important;
    border-color: rgba(148,163,184,.16) !important;
    color: #c8d0dc !important;
}

html.studio-theme-dark body .shell .input-index,
body.studio-theme-dark .shell .input-index {
    background: #d8dee9 !important;
    color: #10141d !important;
}

html.studio-theme-dark body .shell .port::after,
body.studio-theme-dark .shell .port::after {
    background: #d8dee9 !important;
    border-color: #111722 !important;
    box-shadow: 0 0 0 1px rgba(148,163,184,.32) !important;
}

html.studio-theme-dark body .shell .drop-overlay,
body.studio-theme-dark .shell .drop-overlay {
    background: rgba(15,20,29,.44) !important;
    color: #c8d0dc !important;
    backdrop-filter: blur(2px) !important;
}

html.studio-theme-dark body .output-drag-preview,
body.studio-theme-dark .output-drag-preview,
.output-drag-preview {
    position: fixed;
    left: -10000px;
    top: -10000px;
    width: 150px;
    height: 150px;
    padding: 8px;
    border-radius: 18px;
    background: #0f141d;
    border: 1px solid rgba(148,163,184,.18);
    box-shadow: 0 16px 40px rgba(0,0,0,.28);
    pointer-events: none;
    z-index: -1;
}

.output-drag-preview img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: 12px;
    background: #0f141d;
}

html.studio-theme-dark body .shell .resize-handle,
body.studio-theme-dark .shell .resize-handle {
    background: rgba(17,23,34,.86) !important;
    border-color: rgba(148,163,184,.18) !important;
    color: #8f9aab !important;
}

html.studio-theme-dark body .shell .resize-handle:hover,
body.studio-theme-dark .shell .resize-handle:hover {
    background: #171d29 !important;
    border-color: rgba(216,222,233,.36) !important;
    color: #d8dee9 !important;
}

/* Standalone studio pages: zimage / enhance / klein / angle */
html.studio-theme-dark body .layout-container,
body.studio-theme-dark .layout-container,
html.studio-theme-dark body .container-box,
body.studio-theme-dark .container-box {
    color: #e5e9f0 !important;
}

html.studio-theme-dark body .mode-switcher,
html.studio-theme-dark body .engine-panel,
html.studio-theme-dark body .engine-switch,
html.studio-theme-dark body .ios-slider,
html.studio-theme-dark body .result-frame,
html.studio-theme-dark body .gallery-lightbox,
html.studio-theme-dark body #lightbox,
html.studio-theme-dark body #compareContainer,
html.studio-theme-dark body #compareContainerKlein,
html.studio-theme-dark body #lightboxImg,
body.studio-theme-dark .mode-switcher,
body.studio-theme-dark .engine-panel,
body.studio-theme-dark .engine-switch,
body.studio-theme-dark .ios-slider,
body.studio-theme-dark .result-frame,
body.studio-theme-dark .gallery-lightbox,
body.studio-theme-dark #lightbox,
body.studio-theme-dark #compareContainer,
body.studio-theme-dark #compareContainerKlein,
body.studio-theme-dark #lightboxImg {
    background-color: #111722 !important;
    border-color: rgba(148,163,184,.16) !important;
    color: #e5e9f0 !important;
}

html.studio-theme-dark body .mode-glider,
html.studio-theme-dark body .engine-btn.active,
html.studio-theme-dark body .ios-slider:before,
body.studio-theme-dark .mode-glider,
body.studio-theme-dark .engine-btn.active,
body.studio-theme-dark .ios-slider:before {
    background: #d8dee9 !important;
    color: #10141d !important;
}

html.studio-theme-dark body .mode-btn.active,
html.studio-theme-dark body .engine-btn.active,
body.studio-theme-dark .mode-btn.active,
body.studio-theme-dark .engine-btn.active {
    color: #10141d !important;
}

html.studio-theme-dark body .mode-btn,
html.studio-theme-dark body .engine-btn,
html.studio-theme-dark body .cloud-status,
body.studio-theme-dark .mode-btn,
body.studio-theme-dark .engine-btn,
body.studio-theme-dark .cloud-status {
    color: #8f9aab !important;
}

html.studio-theme-dark body .engine-btn:not(.active):hover,
body.studio-theme-dark .engine-btn:not(.active):hover {
    background: rgba(216,222,233,.08) !important;
    color: #e5e9f0 !important;
}

html.studio-theme-dark body .upload-item:hover,
html.studio-theme-dark body .upload-item.drag-over,
body.studio-theme-dark .upload-item:hover,
body.studio-theme-dark .upload-item.drag-over {
    background: #171d29 !important;
    border-color: rgba(216,222,233,.42) !important;
}

html.studio-theme-dark body .glass-btn,
html.studio-theme-dark body .btn-render,
html.studio-theme-dark body #downloadBtn,
html.studio-theme-dark body #lightboxDownload,
body.studio-theme-dark .glass-btn,
body.studio-theme-dark .btn-render,
body.studio-theme-dark #downloadBtn,
body.studio-theme-dark #lightboxDownload {
    background: #d8dee9 !important;
    color: #10141d !important;
    border-color: #d8dee9 !important;
}

html.studio-theme-dark body .glass-btn:hover,
html.studio-theme-dark body .btn-render:hover,
body.studio-theme-dark .glass-btn:hover,
body.studio-theme-dark .btn-render:hover {
    background: #f1f5f9 !important;
    color: #0f141d !important;
}

html.studio-theme-dark body input[type=range]::-webkit-slider-runnable-track,
body.studio-theme-dark input[type=range]::-webkit-slider-runnable-track {
    background: #2a3444 !important;
}

html.studio-theme-dark body input[type=range]::-webkit-slider-thumb,
body.studio-theme-dark input[type=range]::-webkit-slider-thumb {
    background: #d8dee9 !important;
}

html.studio-theme-dark body .masonry-item img,
html.studio-theme-dark body .result-frame img,
body.studio-theme-dark .masonry-item img,
body.studio-theme-dark .result-frame img {
    background-color: #111722 !important;
}

html.studio-theme-dark body .bg-black,
body.studio-theme-dark .bg-black {
    background-color: #d8dee9 !important;
    color: #10141d !important;
}

html.studio-theme-dark body .hover\:text-black:hover,
body.studio-theme-dark .hover\:text-black:hover {
    color: #e5e9f0 !important;
}

/* Final neutral dark pass: remove blue-tinted surfaces from tool pages. */
html.studio-theme-dark,
html.studio-theme-dark body,
body.studio-theme-dark {
    background: #08090c !important;
    color: #e8e8ea !important;
}

body.studio-theme-dark {
    --bg: #08090c;
    --bg-base: #08090c;
    --page: #08090c;
    --card: #111216;
    --card-solid: #111216;
    --soft: #0c0d10;
    --soft-2: #16171b;
    --panel: rgba(17,18,22,.92);
    --text: #e8e8ea;
    --text-main: #e8e8ea;
    --accent: #e8e8ea;
    --line: #25262b;
    --line-2: #32343a;
}

html.studio-theme-dark body .app-shell,
html.studio-theme-dark body .sidebar,
html.studio-theme-dark body .stage,
html.studio-theme-dark body .shell,
body.studio-theme-dark .app-shell,
body.studio-theme-dark .sidebar,
body.studio-theme-dark .stage,
body.studio-theme-dark .shell {
    background: #08090c !important;
    border-color: #25262b !important;
}

html.studio-theme-dark body .console-card,
html.studio-theme-dark body .nano-input,
html.studio-theme-dark body .upload-item,
html.studio-theme-dark body .result-frame,
html.studio-theme-dark body .masonry-item,
html.studio-theme-dark body .engine-panel,
html.studio-theme-dark body .engine-switch,
html.studio-theme-dark body .mode-switcher,
html.studio-theme-dark body .setting-row,
html.studio-theme-dark body .provider-switch,
html.studio-theme-dark body .ios-slider,
html.studio-theme-dark body #compareContainer,
html.studio-theme-dark body #lightboxImg,
html.studio-theme-dark body #lightbox .bg-white,
html.studio-theme-dark body .bg-white,
html.studio-theme-dark body .bg-white\/90,
html.studio-theme-dark body .bg-white\/95,
html.studio-theme-dark body .bg-gray-50,
html.studio-theme-dark body .bg-gray-50\/50,
html.studio-theme-dark body .bg-gray-100,
html.studio-theme-dark body .bg-gray-200,
html.studio-theme-dark body .bg-\[\#f8f8f9\],
html.studio-theme-dark body .bg-\[\#fafafa\],
body.studio-theme-dark .console-card,
body.studio-theme-dark .nano-input,
body.studio-theme-dark .upload-item,
body.studio-theme-dark .result-frame,
body.studio-theme-dark .masonry-item,
body.studio-theme-dark .engine-panel,
body.studio-theme-dark .engine-switch,
body.studio-theme-dark .mode-switcher,
body.studio-theme-dark .setting-row,
body.studio-theme-dark .provider-switch,
body.studio-theme-dark .ios-slider,
body.studio-theme-dark #compareContainer,
body.studio-theme-dark #lightboxImg,
body.studio-theme-dark #lightbox .bg-white,
body.studio-theme-dark .bg-white,
body.studio-theme-dark .bg-white\/90,
body.studio-theme-dark .bg-white\/95,
body.studio-theme-dark .bg-gray-50,
body.studio-theme-dark .bg-gray-50\/50,
body.studio-theme-dark .bg-gray-100,
body.studio-theme-dark .bg-gray-200,
body.studio-theme-dark .bg-\[\#f8f8f9\],
body.studio-theme-dark .bg-\[\#fafafa\] {
    background-color: #111216 !important;
    border-color: #25262b !important;
    color: #e8e8ea !important;
}

html.studio-theme-dark body #lightbox,
body.studio-theme-dark #lightbox {
    background: rgba(8,9,12,.96) !important;
}

html.studio-theme-dark body .glass-btn,
html.studio-theme-dark body .btn-render,
html.studio-theme-dark body .mode-glider,
html.studio-theme-dark body .engine-btn.active,
html.studio-theme-dark body .ios-switch input:checked + .ios-slider,
html.studio-theme-dark body #cloud-progress-bar,
body.studio-theme-dark .glass-btn,
body.studio-theme-dark .btn-render,
body.studio-theme-dark .mode-glider,
body.studio-theme-dark .engine-btn.active,
body.studio-theme-dark .ios-switch input:checked + .ios-slider,
body.studio-theme-dark #cloud-progress-bar {
    background: #e8e8ea !important;
    color: #08090c !important;
    border-color: #e8e8ea !important;
}

html.studio-theme-dark body .mode-btn.active,
html.studio-theme-dark body .engine-btn.active,
html.studio-theme-dark body .text-black,
body.studio-theme-dark .mode-btn.active,
body.studio-theme-dark .engine-btn.active,
body.studio-theme-dark .text-black {
    color: #e8e8ea !important;
}

html.studio-theme-dark body .mode-glider + .mode-btn.active,
body.studio-theme-dark .mode-glider + .mode-btn.active {
    color: #08090c !important;
}

html.studio-theme-dark body input,
html.studio-theme-dark body textarea,
html.studio-theme-dark body select,
body.studio-theme-dark input,
body.studio-theme-dark textarea,
body.studio-theme-dark select {
    background-color: #0c0d10 !important;
    border-color: #32343a !important;
    color: #e8e8ea !important;
}

html.studio-theme-dark body .border-gray-100,
html.studio-theme-dark body .border-gray-200,
html.studio-theme-dark body .border-gray-200\/50,
html.studio-theme-dark body .border-black,
body.studio-theme-dark .border-gray-100,
body.studio-theme-dark .border-gray-200,
body.studio-theme-dark .border-gray-200\/50,
body.studio-theme-dark .border-black {
    border-color: #25262b !important;
}

html.studio-theme-dark body .text-gray-300,
html.studio-theme-dark body .text-gray-400,
html.studio-theme-dark body .text-gray-500,
html.studio-theme-dark body .text-gray-600,
html.studio-theme-dark body .text-gray-700,
html.studio-theme-dark body .text-gray-800,
body.studio-theme-dark .text-gray-300,
body.studio-theme-dark .text-gray-400,
body.studio-theme-dark .text-gray-500,
body.studio-theme-dark .text-gray-600,
body.studio-theme-dark .text-gray-700,
body.studio-theme-dark .text-gray-800 {
    color: #a7a7ad !important;
}

html.studio-theme-dark body h1,
html.studio-theme-dark body h2,
html.studio-theme-dark body h3,
html.studio-theme-dark body label,
body.studio-theme-dark h1,
body.studio-theme-dark h2,
body.studio-theme-dark h3,
body.studio-theme-dark label {
    color: #e8e8ea !important;
}

html.studio-theme-dark body .mode-switcher .mode-btn.active,
html.studio-theme-dark body .engine-switch .engine-btn.active,
body.studio-theme-dark .mode-switcher .mode-btn.active,
body.studio-theme-dark .engine-switch .engine-btn.active {
    color: #08090c !important;
}

/* Online-generation dark pass: soft blue-gray instead of heavy black. */
html.studio-theme-dark,
html.studio-theme-dark body,
body.studio-theme-dark {
    background: #0f141d !important;
    color: #e5e9f0 !important;
}

body.studio-theme-dark {
    --bg: #0f141d;
    --bg-base: #0f141d;
    --page: #0f141d;
    --card: #171d29;
    --card-solid: #171d29;
    --soft: #111722;
    --soft-2: #1d2533;
    --panel: rgba(23,29,41,.92);
    --text: #e5e9f0;
    --text-main: #e5e9f0;
    --accent: #e5e9f0;
    --line: #2a3444;
    --line-2: #334155;
}

html.studio-theme-dark body .app-shell,
html.studio-theme-dark body .sidebar,
html.studio-theme-dark body .stage,
html.studio-theme-dark body .shell,
body.studio-theme-dark .app-shell,
body.studio-theme-dark .sidebar,
body.studio-theme-dark .stage,
body.studio-theme-dark .shell {
    background: #0f141d !important;
    border-color: #2a3444 !important;
}

html.studio-theme-dark body .stage,
body.studio-theme-dark .stage {
    background: #111722 !important;
}

html.studio-theme-dark body .console-card,
html.studio-theme-dark body .nano-input,
html.studio-theme-dark body .upload-item,
html.studio-theme-dark body .result-frame,
html.studio-theme-dark body .masonry-item,
html.studio-theme-dark body .engine-panel,
html.studio-theme-dark body .tool-panel,
html.studio-theme-dark body .control-panel,
html.studio-theme-dark body .engine-switch,
html.studio-theme-dark body .mode-switcher,
html.studio-theme-dark body .setting-row,
html.studio-theme-dark body .ios-slider,
html.studio-theme-dark body #compareContainer,
html.studio-theme-dark body #lightboxImg,
html.studio-theme-dark body #lightbox .bg-white,
html.studio-theme-dark body .bg-white,
html.studio-theme-dark body .bg-white\/90,
html.studio-theme-dark body .bg-white\/95,
html.studio-theme-dark body .bg-gray-50,
html.studio-theme-dark body .bg-gray-50\/50,
html.studio-theme-dark body .bg-gray-100,
html.studio-theme-dark body .bg-gray-200,
html.studio-theme-dark body .bg-\[\#f8f8f9\],
html.studio-theme-dark body .bg-\[\#fafafa\],
body.studio-theme-dark .console-card,
body.studio-theme-dark .nano-input,
body.studio-theme-dark .upload-item,
body.studio-theme-dark .result-frame,
body.studio-theme-dark .masonry-item,
body.studio-theme-dark .engine-panel,
body.studio-theme-dark .tool-panel,
body.studio-theme-dark .control-panel,
body.studio-theme-dark .engine-switch,
body.studio-theme-dark .mode-switcher,
body.studio-theme-dark .setting-row,
body.studio-theme-dark .ios-slider,
body.studio-theme-dark #compareContainer,
body.studio-theme-dark #lightboxImg,
body.studio-theme-dark #lightbox .bg-white,
body.studio-theme-dark .bg-white,
body.studio-theme-dark .bg-white\/90,
body.studio-theme-dark .bg-white\/95,
body.studio-theme-dark .bg-gray-50,
body.studio-theme-dark .bg-gray-50\/50,
body.studio-theme-dark .bg-gray-100,
body.studio-theme-dark .bg-gray-200,
body.studio-theme-dark .bg-\[\#f8f8f9\],
body.studio-theme-dark .bg-\[\#fafafa\] {
    background-color: #171d29 !important;
    border-color: #2a3444 !important;
    color: #e5e9f0 !important;
}

html.studio-theme-dark body .model-pill,
html.studio-theme-dark body .ratio-grid,
html.studio-theme-dark body .resolution-toggle,
html.studio-theme-dark body .select-shell,
html.studio-theme-dark body .mode-switch,
html.studio-theme-dark body .mini-ratio,
html.studio-theme-dark body input,
html.studio-theme-dark body textarea,
html.studio-theme-dark body select,
body.studio-theme-dark .model-pill,
body.studio-theme-dark .ratio-grid,
body.studio-theme-dark .resolution-toggle,
body.studio-theme-dark .select-shell,
body.studio-theme-dark .mode-switch,
body.studio-theme-dark .mini-ratio,
body.studio-theme-dark input,
body.studio-theme-dark textarea,
body.studio-theme-dark select {
    background-color: #111722 !important;
    border-color: #334155 !important;
    color: #e5e9f0 !important;
}

html.studio-theme-dark body .size-select,
html.studio-theme-dark body .size-custom,
body.studio-theme-dark .size-select,
body.studio-theme-dark .size-custom {
    background-color: #111722 !important;
    border-color: #334155 !important;
    color: #e5e9f0 !important;
}

html.studio-theme-dark body #lightbox,
body.studio-theme-dark #lightbox {
    background: rgba(15,20,29,.9) !important;
}

html.studio-theme-dark body .glass-btn,
html.studio-theme-dark body .btn-render,
html.studio-theme-dark body .mode-glider,
html.studio-theme-dark body .engine-btn.active,
html.studio-theme-dark body .model-option.active,
html.studio-theme-dark body .ratio-option.active,
html.studio-theme-dark body .resolution-option.active,
html.studio-theme-dark body .provider-btn.active,
html.studio-theme-dark body .ios-switch input:checked + .ios-slider,
html.studio-theme-dark body #cloud-progress-bar,
html.studio-theme-dark body #downloadBtn,
html.studio-theme-dark body #lightboxDownload,
html.studio-theme-dark body .bg-black,
body.studio-theme-dark .glass-btn,
body.studio-theme-dark .btn-render,
body.studio-theme-dark .mode-glider,
body.studio-theme-dark .engine-btn.active,
body.studio-theme-dark .model-option.active,
body.studio-theme-dark .ratio-option.active,
body.studio-theme-dark .resolution-option.active,
body.studio-theme-dark .provider-btn.active,
body.studio-theme-dark .ios-switch input:checked + .ios-slider,
body.studio-theme-dark #cloud-progress-bar,
body.studio-theme-dark #downloadBtn,
body.studio-theme-dark #lightboxDownload,
body.studio-theme-dark .bg-black {
    background: #d8dee9 !important;
    color: #10141d !important;
    border-color: #d8dee9 !important;
}

html.studio-theme-dark body .mode-btn,
html.studio-theme-dark body .engine-btn,
html.studio-theme-dark body .model-option,
html.studio-theme-dark body .ratio-option,
html.studio-theme-dark body .resolution-option,
html.studio-theme-dark body .provider-btn,
body.studio-theme-dark .mode-btn,
body.studio-theme-dark .engine-btn,
body.studio-theme-dark .model-option,
body.studio-theme-dark .ratio-option,
body.studio-theme-dark .resolution-option {
    color: #8f9aab !important;
}

body.studio-theme-dark .provider-btn {
    color: #8f9aab !important;
}

html.studio-theme-dark body .provider-switch button,
body.studio-theme-dark .provider-switch button {
    color: #8f9aab !important;
}

html.studio-theme-dark body .mode-btn:hover,
html.studio-theme-dark body .engine-btn:hover,
html.studio-theme-dark body .model-option:hover,
html.studio-theme-dark body .ratio-option:hover,
html.studio-theme-dark body .resolution-option:hover,
html.studio-theme-dark body .provider-btn:hover,
body.studio-theme-dark .mode-btn:hover,
body.studio-theme-dark .engine-btn:hover,
body.studio-theme-dark .model-option:hover,
body.studio-theme-dark .ratio-option:hover,
body.studio-theme-dark .resolution-option:hover,
body.studio-theme-dark .provider-btn:hover {
    background: rgba(216,222,233,.08) !important;
    color: #e5e9f0 !important;
}

html.studio-theme-dark body .provider-switch button:hover,
body.studio-theme-dark .provider-switch button:hover {
    background: rgba(216,222,233,.08) !important;
    color: #e5e9f0 !important;
}

html.studio-theme-dark body .mode-btn.active,
html.studio-theme-dark body .engine-btn.active,
html.studio-theme-dark body .model-option.active,
html.studio-theme-dark body .ratio-option.active,
html.studio-theme-dark body .resolution-option.active,
html.studio-theme-dark body .provider-btn.active,
html.studio-theme-dark body .mode-switcher .mode-btn.active,
html.studio-theme-dark body .engine-switch .engine-btn.active,
body.studio-theme-dark .mode-btn.active,
body.studio-theme-dark .engine-btn.active,
body.studio-theme-dark .model-option.active,
body.studio-theme-dark .ratio-option.active,
body.studio-theme-dark .resolution-option.active,
body.studio-theme-dark .provider-btn.active,
body.studio-theme-dark .mode-switcher .mode-btn.active,
body.studio-theme-dark .engine-switch .engine-btn.active {
    color: #10141d !important;
}

html.studio-theme-dark body .provider-switch button.active,
body.studio-theme-dark .provider-switch button.active {
    background: #d8dee9 !important;
    color: #10141d !important;
    border-color: #d8dee9 !important;
    box-shadow: 0 2px 8px rgba(0,0,0,.18) !important;
}

html.studio-theme-dark body .mode-switcher,
body.studio-theme-dark .mode-switcher,
html.studio-theme-dark body .provider-switch,
body.studio-theme-dark .provider-switch,
html.studio-theme-dark body .engine-switch,
body.studio-theme-dark .engine-switch {
    background: #111722 !important;
    border: 1px solid #334155 !important;
    box-shadow: none !important;
}

html.studio-theme-dark body .mode-glider,
body.studio-theme-dark .mode-glider {
    background: #d8dee9 !important;
    box-shadow: 0 2px 8px rgba(0,0,0,.18) !important;
}

html.studio-theme-dark body .mode-btn,
body.studio-theme-dark .mode-btn,
html.studio-theme-dark body .engine-btn,
body.studio-theme-dark .engine-btn,
html.studio-theme-dark body .provider-btn,
body.studio-theme-dark .provider-btn {
    border-radius: 999px !important;
    letter-spacing: .02em !important;
}

html.studio-theme-dark body .provider-switch button,
body.studio-theme-dark .provider-switch button {
    border-radius: 999px !important;
    min-height: 30px !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    letter-spacing: .02em !important;
}

html.studio-theme-dark body .border-gray-100,
html.studio-theme-dark body .border-gray-200,
html.studio-theme-dark body .border-gray-200\/50,
html.studio-theme-dark body .border-black,
body.studio-theme-dark .border-gray-100,
body.studio-theme-dark .border-gray-200,
body.studio-theme-dark .border-gray-200\/50,
body.studio-theme-dark .border-black {
    border-color: #2a3444 !important;
}

html.studio-theme-dark body .text-gray-300,
html.studio-theme-dark body .text-gray-400,
html.studio-theme-dark body .text-gray-500,
html.studio-theme-dark body .text-gray-600,
html.studio-theme-dark body .text-gray-700,
html.studio-theme-dark body .text-gray-800,
body.studio-theme-dark .text-gray-300,
body.studio-theme-dark .text-gray-400,
body.studio-theme-dark .text-gray-500,
body.studio-theme-dark .text-gray-600,
body.studio-theme-dark .text-gray-700,
body.studio-theme-dark .text-gray-800 {
    color: #8f9aab !important;
}

html.studio-theme-dark body h1,
html.studio-theme-dark body h2,
html.studio-theme-dark body h3,
html.studio-theme-dark body label,
body.studio-theme-dark h1,
body.studio-theme-dark h2,
body.studio-theme-dark h3,
body.studio-theme-dark label {
    color: #e5e9f0 !important;
}

html.studio-theme-dark body input[type=range]::-webkit-slider-runnable-track,
body.studio-theme-dark input[type=range]::-webkit-slider-runnable-track {
    background: #2a3444 !important;
}

html.studio-theme-dark body input[type=range]::-webkit-slider-thumb,
body.studio-theme-dark input[type=range]::-webkit-slider-thumb {
    background: #d8dee9 !important;
    border-color: #0f141d !important;
}

html.studio-theme-dark body ::placeholder,
body.studio-theme-dark ::placeholder {
    color: #64748b !important;
}

/* Z-image console polish: keep the prompt field open and make ModelScope readable. */
html.studio-theme-dark body #prompt,
body.studio-theme-dark #prompt {
    background: transparent !important;
    border-color: transparent !important;
    color: #e5e9f0 !important;
}

html.studio-theme-dark body .console-card > .bg-gray-50\/50,
body.studio-theme-dark .console-card > .bg-gray-50\/50 {
    background: transparent !important;
}

html.studio-theme-dark body #prompt::placeholder,
body.studio-theme-dark #prompt::placeholder {
    color: #6f7b8f !important;
}

/* GPT chat dark polish: avoid harsh black bars around text areas. */
html.studio-theme-dark body .chat-shell,
body.studio-theme-dark .chat-shell,
html.studio-theme-dark body .messages,
body.studio-theme-dark .messages {
    background: #0f141d !important;
}

html.studio-theme-dark body .topbar,
body.studio-theme-dark .topbar {
    background: rgba(15,20,29,.9) !important;
    border-bottom-color: #2a3444 !important;
}

html.studio-theme-dark body .composer-wrap,
body.studio-theme-dark .composer-wrap {
    background: linear-gradient(to top,#0f141d 82%,rgba(15,20,29,0)) !important;
}

html.studio-theme-dark body .composer,
body.studio-theme-dark .composer,
html.studio-theme-dark body .history-popover,
body.studio-theme-dark .history-popover {
    background: #171d29 !important;
    border-color: #2a3444 !important;
    color: #e5e9f0 !important;
    box-shadow: 0 18px 44px rgba(0,0,0,.24) !important;
}

html.studio-theme-dark body .composer-body,
body.studio-theme-dark .composer-body {
    background: #111722 !important;
    border-color: #334155 !important;
}

html.studio-theme-dark body #messageInput,
body.studio-theme-dark #messageInput {
    background: transparent !important;
    border-color: transparent !important;
    color: #e5e9f0 !important;
}

html.studio-theme-dark body #messageInput::placeholder,
body.studio-theme-dark #messageInput::placeholder {
    color: #64748b !important;
}

html.studio-theme-dark body .title-block h1,
body.studio-theme-dark .title-block h1 {
    color: #e5e9f0 !important;
}

html.studio-theme-dark body .title-block p,
body.studio-theme-dark .title-block p {
    color: #8f9aab !important;
}

html.studio-theme-dark body .action-btn,
body.studio-theme-dark .action-btn,
html.studio-theme-dark body .thread-item,
body.studio-theme-dark .thread-item {
    background: #111722 !important;
    border-color: #334155 !important;
    color: #d8dee9 !important;
}

html.studio-theme-dark body .action-btn:hover,
body.studio-theme-dark .action-btn:hover,
html.studio-theme-dark body .thread-item:hover,
body.studio-theme-dark .thread-item:hover {
    background: #1d2533 !important;
    color: #e5e9f0 !important;
}

html.studio-theme-dark body .bubble.user,
body.studio-theme-dark .bubble.user {
    background: #2f3b52 !important;
    color: #f1f5f9 !important;
    border: 1px solid #435169 !important;
    box-shadow: 0 10px 24px rgba(0,0,0,.18) !important;
}

html.studio-theme-dark body .bubble.assistant,
body.studio-theme-dark .bubble.assistant {
    background: #171d29 !important;
    color: #e5e9f0 !important;
    border-color: #2a3444 !important;
    box-shadow: 0 8px 20px rgba(0,0,0,.14) !important;
}

html.studio-theme-dark body .bubble.assistant.streaming::after,
body.studio-theme-dark .bubble.assistant.streaming::after {
    background: #d8dee9 !important;
}

html.studio-theme-dark body .bubble img.generated,
body.studio-theme-dark .bubble img.generated {
    border-color: #334155 !important;
}

/* Dark-card clipping: keep inner fills from poking through rounded top corners. */
html.studio-theme-dark body .console-card,
html.studio-theme-dark body .nano-input,
html.studio-theme-dark body .upload-item,
html.studio-theme-dark body .result-frame,
html.studio-theme-dark body .masonry-item,
html.studio-theme-dark body .engine-panel,
html.studio-theme-dark body .tool-panel,
html.studio-theme-dark body .control-panel,
html.studio-theme-dark body .composer,
html.studio-theme-dark body .history-popover,
html.studio-theme-dark body .model-panel,
html.studio-theme-dark body .gate-panel,
body.studio-theme-dark .console-card,
body.studio-theme-dark .nano-input,
body.studio-theme-dark .upload-item,
body.studio-theme-dark .result-frame,
body.studio-theme-dark .masonry-item,
body.studio-theme-dark .engine-panel,
body.studio-theme-dark .tool-panel,
body.studio-theme-dark .control-panel,
body.studio-theme-dark .composer,
body.studio-theme-dark .history-popover,
body.studio-theme-dark .model-panel,
body.studio-theme-dark .gate-panel {
    overflow: hidden !important;
    background-clip: padding-box !important;
}

html.studio-theme-dark body .shell .node,
body.studio-theme-dark .shell .node {
    background-clip: padding-box !important;
}

html.studio-theme-dark body .shell .node-head,
body.studio-theme-dark .shell .node-head {
    border-radius: 21px 21px 0 0 !important;
    overflow: hidden !important;
    background-clip: padding-box !important;
}

/* Switch contrast: keep iOS toggles visible on blue-gray panels. */
html.studio-theme-dark body .ios-switch .ios-slider,
body.studio-theme-dark .ios-switch .ios-slider {
    background: #253044 !important;
    border: 1px solid #46556c !important;
    box-shadow: inset 0 1px 2px rgba(0,0,0,.28), 0 0 0 1px rgba(216,222,233,.05) !important;
}

html.studio-theme-dark body .ios-switch .ios-slider:before,
body.studio-theme-dark .ios-switch .ios-slider:before {
    background: #f8fafc !important;
    box-shadow: 0 3px 9px rgba(0,0,0,.32) !important;
}

html.studio-theme-dark body .ios-switch input:checked + .ios-slider,
body.studio-theme-dark .ios-switch input:checked + .ios-slider {
    background: #d8dee9 !important;
    border-color: #d8dee9 !important;
    box-shadow: 0 0 0 3px rgba(216,222,233,.12) !important;
}

html.studio-theme-dark body .ios-switch input:checked + .ios-slider:before,
body.studio-theme-dark .ios-switch input:checked + .ios-slider:before {
    background: #10141d !important;
    box-shadow: 0 2px 7px rgba(16,20,29,.22) !important;
}

/* Clay shared composer: one sizing source for chat, image, and video creation inputs. */
body:not(.studio-theme-dark) .clay-composer {
    width: min(920px, 100%) !important;
    min-height: 204px !important;
    border: 1px solid #dad4c8 !important;
    border-radius: 22px !important;
    background: rgba(255,255,255,.97) !important;
    box-shadow: 0 10px 30px rgba(0,0,0,.09), 0 1px 2px rgba(255,255,255,.8) !important;
    overflow: hidden !important;
}

body:not(.studio-theme-dark) .clay-composer-top {
    height: 34px !important;
    min-height: 34px !important;
    margin: 10px 14px 4px !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
}

body:not(.studio-theme-dark) .native-select-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    opacity: 0 !important;
    pointer-events: none !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
}

body:not(.studio-theme-dark) .pill-dropdown {
    position: relative !important;
    min-width: 0 !important;
}

body:not(.studio-theme-dark) .pill-dropdown-trigger {
    min-width: 76px !important;
    min-height: 32px !important;
    border: 1px solid #eee9df !important;
    border-radius: 999px !important;
    background: #fff !important;
    color: #000 !important;
    padding: 0 30px 0 12px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.86), 0 1px 2px rgba(0,0,0,.04) !important;
    font-size: 12.5px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    cursor: pointer !important;
}

body:not(.studio-theme-dark) .pill-dropdown-trigger:hover,
body:not(.studio-theme-dark) .pill-dropdown-trigger[aria-expanded="true"] {
    border-color: #c7a15a !important;
    background: #fffaf0 !important;
}

body:not(.studio-theme-dark) .pill-dropdown-label {
    color: #9f9b93 !important;
    font-weight: 950 !important;
}

body:not(.studio-theme-dark) .pill-dropdown-value {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    color: #000 !important;
    font-weight: 850 !important;
}

body:not(.studio-theme-dark) .pill-dropdown-arrow {
    position: absolute !important;
    right: 11px !important;
    top: 50% !important;
    width: 10px !important;
    height: 10px !important;
    transform: translateY(-50%) !important;
    color: #55534e !important;
    pointer-events: none !important;
}

body:not(.studio-theme-dark) .pill-dropdown-arrow::before {
    content: "" !important;
    width: 0 !important;
    height: 0 !important;
    border-left: 4px solid transparent !important;
    border-right: 4px solid transparent !important;
    border-top: 5px solid currentColor !important;
    display: block !important;
}

body:not(.studio-theme-dark) .pill-dropdown-menu {
    position: fixed !important;
    z-index: 90 !important;
    min-width: var(--trigger-width,160px) !important;
    max-height: min(320px,calc(100vh - 32px)) !important;
    overflow: auto !important;
    padding: 6px !important;
    border: 1px solid #dad4c8 !important;
    border-radius: 14px !important;
    background: #fff !important;
    box-shadow: 0 18px 44px rgba(0,0,0,.14), 0 3px 10px rgba(0,0,0,.08) !important;
}

body:not(.studio-theme-dark) .pill-dropdown-option {
    width: 100% !important;
    min-height: 34px !important;
    border: 0 !important;
    border-radius: 10px !important;
    background: transparent !important;
    color: #55534e !important;
    display: flex !important;
    align-items: center !important;
    padding: 0 10px !important;
    font-size: 12.5px !important;
    font-weight: 850 !important;
    cursor: pointer !important;
}

body:not(.studio-theme-dark) .pill-dropdown-option:hover,
body:not(.studio-theme-dark) .pill-dropdown-option.is-selected {
    background: #faf7f1 !important;
    color: #000 !important;
}

body:not(.studio-theme-dark) .clay-composer .chat-panel-toolbar {
    height: 34px !important;
    min-height: 34px !important;
    margin: 10px 14px 4px !important;
    padding: 0 !important;
}

body:not(.studio-theme-dark) .clay-composer-body,
body:not(.studio-theme-dark) .clay-composer .composer-body {
    height: 150px !important;
    min-height: 150px !important;
    padding: 0 14px !important;
    display: grid !important;
    grid-template-columns: 80px minmax(0,1fr) !important;
    grid-template-rows: 104px 38px !important;
    column-gap: 16px !important;
    row-gap: 8px !important;
    align-items: stretch !important;
    overflow: visible !important;
    border: 0 !important;
    background: transparent !important;
}

body:not(.studio-theme-dark) .clay-composer-media,
body:not(.studio-theme-dark) .clay-composer-prompt,
body:not(.studio-theme-dark) .clay-composer .attachment-column,
body:not(.studio-theme-dark) .clay-composer .message-column {
    grid-row: 1 !important;
    height: 104px !important;
    min-height: 104px !important;
}

body:not(.studio-theme-dark) .clay-composer-media,
body:not(.studio-theme-dark) .clay-composer .attachment-column {
    grid-column: 1 !important;
    width: 80px !important;
    min-width: 80px !important;
}

body:not(.studio-theme-dark) .clay-composer-prompt,
body:not(.studio-theme-dark) .clay-composer .message-column {
    grid-column: 2 !important;
    border: 1px solid #eee9df !important;
    border-radius: 12px !important;
    background: #fff !important;
    overflow: hidden !important;
}

body:not(.studio-theme-dark) .clay-composer-bottom,
body:not(.studio-theme-dark) .clay-composer .chat-composer-toolbar {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    width: 100% !important;
    height: 38px !important;
    min-height: 38px !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
}

body:not(.studio-theme-dark) .clay-composer textarea,
body:not(.studio-theme-dark) .clay-composer .chat-input,
body:not(.studio-theme-dark) .clay-composer .prompt-input,
body:not(.studio-theme-dark) .clay-composer .video-prompt {
    height: 104px !important;
    min-height: 104px !important;
    max-height: 104px !important;
    resize: none !important;
}

body:not(.studio-theme-dark) .clay-composer .attachment-btn,
body:not(.studio-theme-dark) .clay-composer .upload-btn-sq,
body:not(.studio-theme-dark) .clay-composer .video-reference-upload-button,
body:not(.studio-theme-dark) .clay-composer .video-reference-attachments,
body:not(.studio-theme-dark) .clay-composer .reference-attachments {
    width: 80px !important;
    min-width: 80px !important;
    height: 104px !important;
    min-height: 104px !important;
}

body:not(.studio-theme-dark) .clay-composer .send-btn,
body:not(.studio-theme-dark) .clay-composer .btn-generate,
body:not(.studio-theme-dark) .clay-composer #genBtn,
body:not(.studio-theme-dark) .clay-composer #videoSendBtn {
    width: 38px !important;
    min-width: 38px !important;
    height: 38px !important;
    min-height: 38px !important;
    flex: 0 0 38px !important;
}

body:not(.studio-theme-dark) .clay-composer .composer-error {
    position: absolute !important;
    left: 110px !important;
    right: 14px !important;
    bottom: 42px !important;
    z-index: 2 !important;
}

body:not(.studio-theme-dark) .video-panel-card .video-panel-toolbar {
    justify-content: space-between !important;
}

body:not(.studio-theme-dark) .video-panel-card .model-row {
    justify-content: flex-start !important;
    flex: 1 1 auto !important;
}

body:not(.studio-theme-dark) .video-panel-card .model-controls {
    border: 0 !important;
    background: transparent !important;
    padding: 0 !important;
    gap: 6px !important;
}

body:not(.studio-theme-dark) .video-panel-card .model-controls::before {
    content: none !important;
    height: 30px !important;
    display: inline-flex !important;
    align-items: center !important;
    padding: 0 0 0 2px !important;
    color: #9f9b93 !important;
    font-size: 12.5px !important;
    font-weight: 950 !important;
}

body:not(.studio-theme-dark) .video-panel-card .model-controls::after {
    content: none !important;
    order: 2 !important;
    height: 30px !important;
    display: inline-flex !important;
    align-items: center !important;
    margin-left: 4px !important;
    color: #9f9b93 !important;
    font-size: 12.5px !important;
    font-weight: 950 !important;
}

body:not(.studio-theme-dark) .video-panel-card .model-controls select {
    height: 30px !important;
    min-width: 118px !important;
    max-width: 220px !important;
    border: 1px solid #eee9df !important;
    border-radius: 999px !important;
    background: #fff !important;
    color: #000 !important;
    padding: 0 30px 0 12px !important;
    font-size: 12.5px !important;
    font-weight: 850 !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.86), 0 1px 2px rgba(0,0,0,.04) !important;
}

body:not(.studio-theme-dark) .video-panel-card .model-controls select:hover,
body:not(.studio-theme-dark) .video-panel-card .model-controls select:focus-visible {
    border-color: #dad4c8 !important;
    background: #faf7f1 !important;
    outline: none !important;
}

body:not(.studio-theme-dark) .video-panel-card #videoModelSelect {
    order: 3 !important;
}

body:not(.studio-theme-dark) .video-panel-card .pricing-hint {
    margin-left: auto !important;
}

body:not(.studio-theme-dark) .video-panel-card .video-input-body {
    grid-template-columns: 80px minmax(0,1fr) !important;
    column-gap: 16px !important;
}

body:not(.studio-theme-dark) .video-input-panel > .mode-tabs {
    position: absolute !important;
    left: max(0px, calc((100% - 920px) / 2 - 33px)) !important;
    top: 40px !important;
    width: 33px !important;
    height: 168px !important;
    min-height: 168px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: center !important;
    gap: 0 !important;
    padding: 2px !important;
    border: 1px solid #dad4c8 !important;
    border-radius: 12px !important;
    background: #fff !important;
    box-shadow: 0 2px 7px rgba(0,0,0,.04), inset 0 1px 0 rgba(255,255,255,.9) !important;
    pointer-events: auto !important;
    z-index: 45 !important;
}

body:not(.studio-theme-dark) .video-input-panel > .mode-tabs .mode-tab {
    width: 29px !important;
    min-height: 82px !important;
    flex: 0 0 82px !important;
    justify-content: center !important;
    border: 0 !important;
    border-radius: 10px !important;
    background: transparent !important;
    color: #55534e !important;
    padding: 4px 0 !important;
    writing-mode: vertical-rl !important;
    text-orientation: upright !important;
    letter-spacing: 2px !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    align-items: center !important;
    text-align: center !important;
    box-shadow: none !important;
}

body:not(.studio-theme-dark) .video-input-panel > .mode-tabs .mode-tab + .mode-tab {
    margin-top: 2px !important;
    min-height: 80px !important;
    flex-basis: 80px !important;
}

body:not(.studio-theme-dark) .video-input-panel > .mode-tabs .mode-tab.active {
    background: #faf3e3 !important;
    color: #7c5d08 !important;
    box-shadow: inset 0 0 0 1px #ead8ab !important;
}

body:not(.studio-theme-dark) .video-input-panel > .mode-tabs .mode-tab-dot {
    display: none !important;
}

body:not(.studio-theme-dark) .video-panel-card .video-reference-column {
    grid-column: 1 !important;
}

body:not(.studio-theme-dark) .video-panel-card .video-frame-row {
    width: 80px !important;
    min-width: 80px !important;
    height: 104px !important;
    min-height: 104px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 8px !important;
}

body:not(.studio-theme-dark) .video-panel-card .video-frame-slot {
    width: 80px !important;
    min-width: 80px !important;
    height: 48px !important;
    min-height: 48px !important;
    flex: 0 0 48px !important;
    border: 1px solid #dad4c8 !important;
    border-radius: 10px !important;
    background: #fffdfa !important;
    box-shadow: 0 2px 7px rgba(0,0,0,.04), inset 0 1px 0 rgba(255,255,255,.86) !important;
}

body:not(.studio-theme-dark) .video-panel-card .composer-prompt-area {
    grid-column: 2 !important;
}

body:not(.studio-theme-dark) .video-panel-card .video-params-bar .param-group {
    height: 32px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 0 !important;
    border: 1px solid #eee9df !important;
    border-radius: 999px !important;
    background: #fff !important;
    overflow: hidden !important;
}

body:not(.studio-theme-dark) .video-panel-card .video-params-bar .param-label {
    display: inline-flex !important;
    height: 32px !important;
    align-items: center !important;
    padding: 0 9px !important;
    border-right: 1px solid #eee9df !important;
    color: #9f9b93 !important;
    font-size: 11px !important;
    font-weight: 950 !important;
}

body:not(.studio-theme-dark) .video-panel-card .video-params-bar .chip-select {
    height: 32px !important;
    min-height: 32px !important;
    min-width: 74px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #fff !important;
    color: #55534e !important;
    padding: 0 30px 0 12px !important;
    font-size: 12.5px !important;
    font-weight: 850 !important;
}

body:not(.studio-theme-dark) .video-panel-card .video-params-bar .chip-select:hover,
body:not(.studio-theme-dark) .video-panel-card .video-params-bar .chip-select:focus-visible {
    background: #faf7f1 !important;
    outline: none !important;
}

body:not(.studio-theme-dark) .composer-wrap:has(.clay-composer),
body:not(.studio-theme-dark) .input-panel:has(.clay-composer) {
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: auto !important;
    max-width: none !important;
    transform: none !important;
    padding: 24px 42px 30px !important;
    background: transparent !important;
    pointer-events: none !important;
}

body:not(.studio-theme-dark) .composer-wrap:has(.clay-composer) .clay-composer,
body:not(.studio-theme-dark) .input-panel:has(.clay-composer) .clay-composer {
    margin: 0 auto !important;
    pointer-events: auto !important;
}

@media (max-width: 900px) {
    body:not(.studio-theme-dark) .composer-wrap:has(.clay-composer),
    body:not(.studio-theme-dark) .input-panel:has(.clay-composer) {
        padding: 20px 18px 24px !important;
    }

    body:not(.studio-theme-dark) .clay-composer {
        min-height: 204px !important;
    }

    body:not(.studio-theme-dark) .clay-composer-body,
    body:not(.studio-theme-dark) .clay-composer .composer-body {
        height: 150px !important;
        min-height: 150px !important;
        grid-template-columns: 80px minmax(0,1fr) !important;
        grid-template-rows: 104px 38px !important;
        padding: 0 14px !important;
    }
}

@media (max-width: 480px) {
    body:not(.studio-theme-dark) .composer-wrap:has(.clay-composer),
    body:not(.studio-theme-dark) .input-panel:has(.clay-composer) {
        padding: 16px 14px 20px !important;
    }
}