/* Verbatim copy of production video workbench rules from /video/assets/index-Ddtj5nvb.css (2026-08-25).
   Used by the character page so its secondary navigation is identical to the video page. */
:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,PingFang SC,Microsoft YaHei,sans-serif;color:#18181b;background:#f5f6f8;font-synthesis:none;letter-spacing:0;--bg:#f5f6f8;--panel:#fff;--panel-2:#f1f3f6;--text:#18181b;--muted:#64646f;--border:#dfe2e7;--accent:#6d28d9;--accent-2:#7c3aed;--success:#168b66;--danger:#bd3e52;--shadow:0 8px 24px rgba(22,24,32,.07)}
:root[data-theme=dark],body[data-theme=dark]{color-scheme:dark;--bg:#101114;--panel:#17191d;--panel-2:#202329;--text:#f4f4f5;--muted:#a1a1aa;--border:#30343c;--accent:#7c3aed;--accent-2:#8b5cf6;--success:#42c99a;--danger:#f07d87;--shadow:0 8px 24px rgba(0,0,0,.22)}
*{box-sizing:border-box}
.workspace-bar{height:54px;padding:0 24px;border-bottom:1px solid var(--border);background:var(--panel);display:flex;align-items:center;gap:10px;position:sticky;top:56px;z-index:24}
.workspace-bar>strong{font-size:14px}
.workspace-bar>.auth-button{margin-left:auto}
.workspace-model{font-size:11px;color:var(--muted);padding-left:10px;border-left:1px solid var(--border)}
.workspace-nav{display:flex;gap:4px}
.workspace-nav a{height:34px;display:flex;align-items:center;gap:7px;padding:0 11px;color:var(--muted);text-decoration:none;font-size:13px;border-radius:6px}
.workspace-nav a:hover,.workspace-nav a.active{color:var(--text);background:var(--panel-2)}
.workspace-nav a.active{color:var(--text);background:var(--panel-2)}
.workspace-nav a.active{box-shadow:inset 0 -2px var(--accent)}
.desktop-nav{margin-left:22px;align-self:stretch;display:flex;align-items:center}
.icon-button,.auth-button{height:34px;min-width:34px;padding:0 8px;background:transparent;border:1px solid transparent;border-radius:6px;display:inline-flex;align-items:center;justify-content:center;gap:6px}
.icon-button:hover,.auth-button:hover{background:var(--panel-2);border-color:var(--border)}
.nav-icon{width:34px;height:34px;border-radius:999px;background:transparent;color:var(--muted);display:grid;place-items:center}
.nav-icon:hover{background:var(--panel-2);color:var(--text)}
/* Verbatim copy of the video page generic button rule (index-Ddtj5nvb.css), scoped to the workspace-bar
   language button and to #root buttons that do NOT carry the character bundle's own .button/.icon classes
   (those keep their transparent/quiet look; .primary already gets purple from formal-ui). This gives the
   EN/中 button the same purple, 36px, centered look as on the video page. */
#root button:not(.button,.icon,.icon-button,.auth-button,.asset,.task-row,.drawer-scrim,.text-button),
.workspace-bar>.language-button{min-height:36px;padding:0 14px;border-radius:6px;background:var(--accent);color:#fff;display:inline-flex;align-items:center;justify-content:center;gap:7px;font-weight:600}
.language-button{font-size:12px;font-weight:700}
.mobile-only,.drawer,.drawer-scrim{display:none}
@media(max-width:900px){.nav-icon{width:44px;height:44px}.workspace-bar{padding:0 12px}.desktop-nav{display:none}.drawer .workspace-nav{margin-top:20px;display:grid}.drawer .workspace-nav a{height:44px}}
@media(max-width:560px){.auth-button span{display:none}}
@media(pointer:coarse){button,.icon-button,.auth-button,.text-button{min-height:44px}.icon-button,.auth-button{min-width:44px}}
@media(max-width:560px){.history-list>.section-heading .icon-button{width:44px;min-width:44px;height:44px;min-height:44px}}
@media(max-width:700px){.topbar .icon-button.mobile-only,.topbar .auth-button,.workspace-bar .icon-button.mobile-only,.workspace-bar .auth-button{width:44px;min-width:44px;height:44px;min-height:44px}}
/* Glue: map video tokens onto the character bundle variable names and cancel its global nav auto-margin. */
:root{--surface:var(--panel);--surface-2:var(--panel-2);--line:var(--border)}
.workspace-bar .workspace-nav{margin-left:0;margin-right:0}
/* Cancel formal-ui's .language-button{margin-left:auto} so EN sits right after nav links, same as video page. */
.workspace-bar>.language-button{margin-left:0}
html body #root>header,html body #root>.topbar{display:none!important}
/* Glue for character page: it has no React drawer, keep secondary nav visible on small screens. */
@media(max-width:900px){.workspace-bar .desktop-nav{display:flex}.workspace-bar{overflow-x:auto;white-space:nowrap}}
/* The character bundle's global .active{margin-top:20px;border-top:1px;padding-top:2px} (meant for its own
   tab lists) leaks into the copied workspace-nav active link and sinks it ~10px. Reset it. */
.workspace-nav a.active{margin:0;border-top:0;padding-top:0}