/* Shared theme tokens also cover overlays outside React's .app-shell. */
:root{--h3-font-sans:MiSans,"HarmonyOS Sans SC","PingFang SC","Microsoft YaHei UI",sans-serif;--canvas:#161716;--surface:#1e201e;--surface-soft:#242624;--field:#191b19;--ink:#f3f1ec;--ink-soft:#c7c4bd;--muted:#a0a39c;--line:#ffffff17;--line-strong:#ffffff29;--accent:#91a1ff;--accent-strong:#7487f5;--accent-soft:#91a1ff1f;--accent-ink:#111427;--success:#76c7a4;--warning:#d7b36b;--danger:#ef8585;--h3-chrome-height:92px;--h3-page-title-size:28px;--h3-card-radius:16px;--h3-control-radius:9px;color-scheme:dark}
:root[data-theme=light]{--canvas:#ecebe7;--surface:#fbfaf7;--surface-soft:#f1f0eb;--field:#f4f3ef;--ink:#242621;--ink-soft:#484b45;--muted:#62685f;--line:#1e221d1a;--line-strong:#1e221d2e;--accent:#5268d3;--accent-strong:#4157c0;--accent-soft:#5268d317;--accent-ink:#fff;--success:#287d5e;--warning:#805912;--danger:#b44f4f;color-scheme:light}
body{color:var(--ink);background:var(--canvas);font-family:var(--h3-font-sans)}
#h3-modes-panel,#h3-queue-panel,#h3-assets-panel{color:var(--ink)}
#h3-modes-panel .topbar h1,.queue-head h2,.queue-times b,.h3-asset-head h2,.hm-preview-title strong{color:var(--ink)}
#h3-modes-panel .hm-gen{color:var(--accent-ink)}
.preview-frame:has(.empty-preview){background:var(--field)}
.empty-preview strong{color:var(--ink)}
#h3-global-chrome{position:fixed;top:0;left:274px;right:0;height:var(--h3-chrome-height);z-index:180;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:14px clamp(26px,3.2vw,58px);background:var(--canvas);border-bottom:1px solid var(--line);color:var(--ink);box-sizing:border-box}
.h3c-brand{min-width:0}.h3c-wordmark{display:flex;align-items:baseline;gap:7px;white-space:nowrap;line-height:1.35;font-size:clamp(18px,1.65vw,25px);letter-spacing:-.025em;font-weight:750}.h3c-wordmark strong{font-weight:750}.h3c-wordmark>span{color:var(--accent)}.h3c-wordmark small{font-size:13px;font-weight:600;letter-spacing:0;color:var(--muted)}.h3c-signature{font-size:11px;line-height:1.6;margin-top:5px;color:var(--ink-soft);overflow-wrap:anywhere}.h3c-controls{flex-shrink:0}
.h3-page-heading h1,.queue-head h2,.h3-asset-head h2,.hq-head h1{font-size:var(--h3-page-title-size);font-weight:720;line-height:1.25;letter-spacing:-.025em;margin:0;color:var(--ink)}
.h3-page-heading p,.hq-head p{font-size:13px;line-height:1.65;margin:8px 0 0;color:var(--muted);max-width:74ch}
.h3-common-chrome .main-stage>.topbar>.title-block,.h3-common-chrome #h3-modes-panel>.topbar>.title-block{display:none}
.h3c-controls{display:flex;align-items:center;justify-content:flex-end;gap:8px;color:var(--ink);font:12px "Microsoft YaHei",sans-serif}
.h3c-controls svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.h3c-status,.h3c-gpu,.h3c-theme{height:36px;display:inline-flex;align-items:center;justify-content:center;gap:7px;border:1px solid var(--line-strong);border-radius:9px;background:var(--surface);color:var(--ink-soft);padding:0 10px;white-space:nowrap;font:inherit;box-sizing:border-box}
.h3c-status i{width:7px;height:7px;border-radius:50%;background:var(--muted)}
.h3c-status[data-state=ready] i{background:var(--success);box-shadow:0 0 0 3px color-mix(in srgb,var(--success) 15%,transparent)}
.h3c-status[data-state=warning]{color:var(--warning)}.h3c-status[data-state=warning] i{background:var(--warning)}
.h3c-theme{width:38px;padding:0;cursor:pointer;color:var(--ink)}.h3c-theme:hover{color:var(--accent);border-color:var(--accent);background:var(--surface-soft)}.h3c-theme:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
body.h3-common-chrome .main-stage{padding-top:calc(var(--h3-chrome-height) + 26px)}
body.h3-common-chrome .main-stage .header-actions{display:none!important}
body.h3-common-chrome .startup-theme-toggle{display:none!important}
html[data-theme=light] :is(#hq-workspace,.hq-dialog) .hq-primary{color:#fff!important}
html[data-theme=light] :is(#hq-workspace,.hq-dialog) .hq-warn{color:#805912!important}
html[data-theme=light] .hq-status.error{color:#963717}
body.h3-common-chrome #h3-modes-panel,body.h3-common-chrome #h3-assets-panel,body.h3-common-chrome #h3-queue-panel{top:var(--h3-chrome-height)}
body.h3-common-chrome #hq-workspace{top:var(--h3-chrome-height)!important;left:274px;right:0;bottom:0;border:0;border-radius:0;padding:34px clamp(26px,3.2vw,58px) 48px;box-shadow:none}
.hq-head .hq-eyebrow{display:none}.hq-head h1{margin:0}.hq-head{margin-bottom:24px}.hq-status.completed{color:var(--success)}
.queue-status.running{color:var(--accent);background:var(--accent-soft)}.queue-status.completed{color:var(--success);background:color-mix(in srgb,var(--success) 12%,transparent)}
.hq-panel,.hq-lora-grid article,.project-grid>button{border-radius:var(--h3-card-radius)}
body.h3-modes-open .sidebar .mode-button:not(.h3-injnav) .mode-marker{display:none!important}
#h3-settings-dialog>.h3c-controls{justify-content:flex-start;margin:10px 0 18px;flex-wrap:wrap}
body.h3-editor-page{padding-top:var(--h3-chrome-height)}body.h3-editor-page #h3-global-chrome{left:0}
body.h3-editor-page .editor-shell{height:calc(100dvh - var(--h3-chrome-height))}
body.h3-editor-page .opening{height:calc(100vh - var(--h3-chrome-height))}
.h3-editor-page .project-home{max-width:1360px;margin:0 auto;padding:32px clamp(26px,3.2vw,58px) 48px}
.h3-editor-home-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:28px}
.h3-editor-page .project-home h1{font-size:var(--h3-page-title-size);margin:0;font-weight:720;letter-spacing:-.025em}
.h3-editor-page .project-home .back{display:inline-flex;align-items:center;min-height:40px;padding:9px 14px;border:1px solid var(--line-strong);border-radius:var(--h3-control-radius);color:var(--ink);background:var(--surface);white-space:nowrap}
.h3-editor-page .editor-page-title{font-size:20px;line-height:1.3;margin:0;font-weight:720;color:var(--ink);white-space:nowrap}
.h3-editor-page button,.h3-editor-page input,.h3-editor-page textarea,.h3-editor-page select{border-radius:var(--h3-control-radius)}
.h3-editor-page .topbar{background:var(--surface)}.h3-editor-page .project-grid>button{background:var(--surface);color:var(--ink);border-color:var(--line-strong);box-shadow:none}.h3-editor-page .project-grid>button:hover{border-color:var(--accent);background:var(--surface-soft)}
/* Theme only editor UI, never the rendered video or subtitle artwork. */
html[data-theme=light] .h3-editor-page .editor-shell,
html[data-theme=light] .h3-editor-page .properties,
html[data-theme=light] .h3-editor-page .timeline,
html[data-theme=light] .h3-editor-page .preview{background:var(--surface);color:var(--ink)}
html[data-theme=light] .h3-editor-page :is(button,input,textarea,select){background:var(--field);color:var(--ink);border-color:var(--line-strong)}
html[data-theme=light] .h3-editor-page button:hover{background:var(--surface-soft)}
html[data-theme=light] .h3-editor-page :is(.topbar,.left,.properties,.timeline,.timeline-toolbar,.timeline-hint,.caption-track,.library-tabs,.sound-row){border-color:var(--line-strong)}
html[data-theme=light] .h3-editor-page :is(.asset,.export-card,.caption-editor,.segmented,.upload,.mini-upload){background:var(--field);color:var(--ink);border-color:var(--line-strong)}
html[data-theme=light] .h3-editor-page :is(.muted,.intro,.eyebrow,.opening,.opening p,.project-grid small,.asset small,.properties label,.empty-hint,.timeline-hint,.caption-track,.sound-info small,.sound-info details,.save-state,.library-tabs button,.preview-title small,.playbar small){color:var(--muted)}
html[data-theme=light] .h3-editor-page :is(.preview-title,.playbar,.properties>strong,.project-grid strong,.sound-info strong){color:var(--ink)}
html[data-theme=light] .h3-editor-page :is(button.primary,.segmented button.active,.category-chips button.active){background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
html[data-theme=light] .h3-editor-page :is(a,.project-grid span,.library-tabs button.active){color:var(--accent)}
html[data-theme=light] .h3-editor-page .library-tabs button.active{border-bottom-color:var(--accent)}
html[data-theme=light] .h3-editor-page .smart-caption-card{background:var(--surface-soft);border-color:var(--line-strong);color:var(--ink)}
html[data-theme=light] .h3-editor-page .smart-caption-card p{color:var(--ink-soft)}
html[data-theme=light] .h3-editor-page :is(.smart-caption-card summary,.aligned-preview small){color:#65541e}
html[data-theme=light] .h3-editor-page .caption-track-line button{background:#efe3c1;color:#574318;border-color:#ad9662}
html[data-theme=light] .h3-editor-page .error{background:#fff0ea;color:#873e28;border-color:#d2a08e}
html[data-theme=light] .h3-editor-page .export-card p{color:#873e28}
html[data-theme=light] .h3-editor-page :is(.project-title,.back-icon){background:transparent}
html[data-theme=light] .h3-editor-page :is(input,textarea):focus{outline-color:var(--accent)}
.h3-editor-page .error{background:color-mix(in srgb,var(--danger) 12%,var(--surface));border-color:var(--danger);color:var(--ink)}
.h3-editor-page .export-card p{color:var(--danger)}.h3-editor-page .busy-overlay{background:color-mix(in srgb,var(--canvas) 88%,transparent);color:var(--accent)}
.h3-editor-page .project-grid>button,.h3-editor-page .export-card{border-radius:var(--h3-card-radius)}
@media(max-width:1100px){.h3c-wordmark small{font-size:11px}.h3c-wordmark{font-size:18px}.h3c-signature{font-size:10px}#h3-global-chrome{gap:12px;padding-inline:22px}.h3c-controls{font-size:11px}}
@media(max-width:900px){body.h3-modes-open #h3-global-chrome,body.hq-open #h3-global-chrome{left:72px}body.h3-common-chrome.hq-open #hq-workspace{left:72px;padding:24px 16px 40px}}
@media(max-width:820px){:root{--h3-chrome-height:126px}#h3-global-chrome{left:0;padding:10px 14px;flex-direction:column;align-items:flex-start;justify-content:center;gap:8px}.h3c-controls{align-self:flex-end}.h3c-wordmark{font-size:18px}.h3c-signature{font-size:10px}body.h3-common-chrome .sidebar{padding-top:calc(var(--h3-chrome-height) + 14px)}body.hq-open .sidebar,body.h3-modes-open .sidebar{padding-top:12px}body.h3-common-chrome .main-stage{padding-top:22px}.h3-editor-home-head{align-items:flex-start;flex-direction:column}}
@media(max-width:480px){:root{--h3-chrome-height:148px}.h3c-wordmark{flex-wrap:wrap;white-space:normal;gap:2px 6px}.h3c-signature{max-width:100%}.h3c-wordmark small{font-size:11px}.h3c-controls{gap:4px}.h3c-gpu{font-size:10px}}
@media(max-width:450px){.h3c-controls{font-size:10px;gap:5px}.h3c-status,.h3c-gpu{padding:0 7px}.h3c-gpu svg{display:none}}