/* Tenlivo UI polish v3: inherits the existing light/dark design tokens. */
#eqvola-demo{font-variant-numeric:tabular-nums}
#eqvola-demo [class*="contextNav"] a{min-height:44px;gap:8px;line-height:1.4}
#eqvola-demo [class*="contextNav"] .tux-unavailable-nav{color:var(--theme-muted)}
.tux-readiness{font-size:10px!important;line-height:1.3;padding:3px 5px;border:1px solid var(--theme-border);border-radius:5px;white-space:nowrap;background:var(--theme-panel-soft);color:var(--theme-muted)}
#eqvola-demo [class*="contextNav"] a>span{min-width:0;overflow-wrap:anywhere}
#eqvola-demo [class*="contextNav"] a:focus-visible,#eqvola-demo button:focus-visible,#eqvola-demo select:focus-visible{outline:3px solid var(--theme-accent);outline-offset:3px}
#eqvola-demo main{min-width:0;scroll-margin-top:88px}
#eqvola-demo main h1{font-size:clamp(23px,2.1vw,30px);line-height:1.25;overflow-wrap:anywhere}
#eqvola-demo main h2,#eqvola-demo main p{overflow-wrap:anywhere}
#eqvola-demo [class*="topbar"] button{min-height:44px}
#eqvola-demo .tu-workspace-nav a{min-height:44px}
#eqvola-demo [class*="mobileSection"] select{min-height:44px;width:100%}
#eqvola-demo [class*="modeBar"]{font-size:12px;line-height:1.5;gap:8px;flex-wrap:wrap}
#eqvola-demo [class*="studioHeading"]{margin-block:12px 18px}
#eqvola-demo .tu-studio-steps{padding-bottom:16px;margin-top:16px}
#eqvola-demo .tu-studio-steps button{min-height:52px}
#eqvola-demo main :is(input,select,textarea){max-width:100%}
#eqvola-demo main [role="alert"]{padding:12px 14px;border:1px solid var(--theme-danger-border);border-radius:10px;background:var(--theme-danger-bg);color:var(--theme-danger);line-height:1.55}
@media(max-width:700px){
 #eqvola-demo main{padding-inline:16px!important;padding-bottom:104px!important}
 #eqvola-demo [class*="topbar"]{padding-inline:12px;gap:8px}
 #eqvola-demo [class*="brandButton"] strong{max-width:36vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 #eqvola-demo [class*="topActions"]{gap:5px}
 #eqvola-demo main h1{font-size:24px;letter-spacing:-.5px}
 #eqvola-demo .tu-workspace-nav nav{max-width:100%;scrollbar-width:thin}
 #eqvola-demo [class*="mobileFooter"] button{min-width:44px;min-height:54px}
 #eqvola-demo main [class*="toolbar"]{flex-wrap:wrap;gap:10px}
}
@media(prefers-reduced-motion:reduce){#eqvola-demo *{scroll-behavior:auto!important;transition:none!important}}

/* QA found subtitle toolbar overflow at 320px; wrap controls, not timeline canvas. */
@media(max-width:600px){
 .tc-native .tc-card div:has(>button[title]),.tc-native .tc-card div:has(>span[style*="font-family"]){flex-wrap:wrap;max-width:100%}
 .tc-native .tc-btn,.tc-native .tc-seg button{min-height:44px}
}