/* The public studio header shares the page's light cards and type in both templates. */
[data-motiona-web-root]:has(> .web-app.web-studio-site){overflow:clip!important}
.web-studio-site .studio-site-header{
 --header-ink:#192244;--header-muted:#62728a;--header-accent:#315f82;--header-active:#eaf2f8;--header-soft:#f4f7fa;
 position:relative;isolation:isolate;z-index:60;flex-shrink:0;margin:14px 20px 12px;border:1px solid #e1e8ef;border-radius:24px;
 background:#fff!important;color:var(--header-ink);box-shadow:0 3px 14px #1b345008;
 font-family:'Roboto',Arial,sans-serif;font-size:14px;line-height:1.3;
}
.web-studio-site .studio-site-header[data-studio-template="box"]{--header-accent:#637b1c;--header-active:#ddf765;--header-soft:#f7fbea}
.web-studio-site .studio-site-header .studio-site-nav{display:grid;grid-template-columns:minmax(225px,1fr) auto minmax(200px,1fr);align-items:center;gap:18px;min-height:82px;padding:14px 20px;border:0}
.web-studio-site .studio-site-header .studio-site-identity{display:flex;align-items:center;gap:14px;min-width:0;justify-self:start;flex:initial}
.web-studio-site .studio-site-header .studio-site-brand{display:flex;align-items:center;gap:10px;flex-shrink:0;min-height:44px;color:var(--header-ink)}
.web-studio-site .studio-site-header .studio-site-brand strong{display:block;font:800 20px/1.2 'Roboto',Arial,sans-serif;letter-spacing:-.45px;white-space:nowrap;max-width:none}
.web-studio-site .studio-site-header .studio-site-brand img{object-fit:contain}
.web-studio-site .studio-site-header .studio-site-branches{display:flex;align-items:center;gap:7px;border:1px solid #e1e8ef;border-radius:14px;background:var(--header-soft);color:var(--header-accent);padding:10px;min-height:42px;font:600 12px/1.3 'Roboto',Arial,sans-serif;cursor:pointer}
.web-studio-site .studio-site-header .studio-site-branches span{max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.web-studio-site .studio-site-header .studio-site-nav nav{display:flex;align-items:center;justify-content:center;gap:4px;order:0;grid-row:auto;grid-column:auto;grid-area:auto;width:auto;margin:0;overflow:visible}
.web-studio-site .studio-site-header .studio-site-nav nav a{display:inline-flex;align-items:center;justify-content:center;flex-direction:row;gap:7px;min-height:44px;padding:11px 12px;border:0;border-radius:14px;background:transparent;color:var(--header-muted);font:600 14px/1.3 'Roboto',Arial,sans-serif;letter-spacing:0;text-transform:none;white-space:nowrap;transition:background-color .16s,color .16s}
.web-studio-site .studio-site-header .studio-site-nav nav a>span{display:block;font:inherit;color:inherit}
.web-studio-site .studio-site-header .studio-site-nav nav a>div{flex-shrink:0}
.web-studio-site .studio-site-header .studio-site-nav nav a:hover{background:var(--header-soft);color:var(--header-accent)}
.web-studio-site .studio-site-header .studio-site-nav nav a.is-active{background:var(--header-active);color:var(--header-accent);font-weight:800}
.web-studio-site .studio-site-header[data-studio-template="box"] .studio-site-nav nav a.is-active{color:var(--header-ink)}
.web-studio-site .studio-site-header .studio-site-tools{display:flex;align-items:center;justify-content:flex-end;justify-self:end;gap:10px;min-width:0;margin:0;flex-wrap:nowrap}
.web-studio-site .studio-site-header .studio-site-motiona{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:10px 12px;border-radius:14px;background:var(--header-soft);color:var(--header-accent);font:700 12px/1.3 'Roboto',Arial,sans-serif;white-space:nowrap}
.web-studio-site .studio-site-header .studio-site-tools .studio-site-account{display:flex;align-items:center;gap:9px;min-height:44px;padding:8px 12px;border:1px solid #e1e8ef;border-radius:16px;background:var(--header-soft);color:var(--header-ink);font:700 14px/1.3 'Roboto',Arial,sans-serif;white-space:nowrap}
.web-studio-site .studio-site-header .studio-site-tools .studio-site-account>span{display:block;max-width:100px;overflow:hidden;text-overflow:ellipsis}
.web-studio-site .studio-site-header .studio-account-dropdown{z-index:110;background:#fff;color:var(--header-ink);border-color:#e1e8ef;border-radius:18px;box-shadow:0 12px 35px #1830491c;font:500 14px/1.4 'Roboto',Arial,sans-serif}
.web-studio-site .studio-site-header .studio-account-dropdown :is(a,button):hover{background:var(--header-active);color:var(--header-accent)}
.web-studio-site .studio-site-header :is(a,button,summary):focus-visible{outline:3px solid var(--header-accent);outline-offset:3px}
.web-studio-site .studio-site-header .studio-site-back{min-height:44px;justify-self:center;font:700 14px/1.3 'Roboto',Arial,sans-serif;color:var(--header-accent)}
/* Seasonal artwork belongs behind the card; only the existing account badge sits on controls. */
[data-motiona-seasonal-root="true"] .web-app.web-studio-site .studio-site-header[data-studio-template]{background:#fff!important}
@media(max-width:1399px){
 .web-studio-site .studio-site-header .studio-site-nav{grid-template-columns:minmax(0,1fr) auto;gap:10px 16px;padding:12px 18px}
 .web-studio-site .studio-site-header .studio-site-nav nav,.web-studio-site .studio-site-header .studio-site-back{grid-row:2;grid-column:1/-1;justify-self:center;width:auto}
 .web-studio-site .studio-site-header .studio-site-tools{grid-row:1;grid-column:2}
 .web-studio-site .studio-site-header .studio-site-nav nav a{padding:10px 16px}
}
@media(max-width:700px){
 .web-studio-site .studio-site-header{margin:10px 12px 12px;border-radius:20px}
 .web-studio-site .studio-site-header .studio-site-nav{grid-template-columns:minmax(0,1fr) auto;padding:10px 12px 8px;gap:10px 8px;min-height:0}
 .web-studio-site .studio-site-header .studio-site-identity{gap:7px}
 .web-studio-site .studio-site-header .studio-site-brand{gap:7px;min-height:40px}
 .web-studio-site .studio-site-header .studio-site-brand strong{font-size:16px;letter-spacing:-.3px}
 .web-studio-site .studio-site-header .studio-site-brand>div{transform:scale(.85);margin:-3px}
 .web-studio-site .studio-site-header .studio-site-branches{gap:4px;padding:8px 6px;min-height:36px;border-radius:12px;font-size:11px}
 .web-studio-site .studio-site-header .studio-site-branches span{max-width:64px}
 .web-studio-site .studio-site-header .studio-site-tools{gap:6px}
 .web-studio-site .studio-site-header .studio-site-tools .studio-site-account{gap:6px;min-height:40px;padding:6px 8px;font-size:12px;border-radius:14px}
 .web-studio-site .studio-site-header .studio-site-tools .studio-site-account>span{max-width:64px}
 .web-studio-site .studio-site-header .studio-site-motiona{display:none}
 .web-studio-site .studio-site-header .studio-site-nav nav{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));justify-self:stretch;width:100%;gap:2px}
 .web-studio-site .studio-site-header .studio-site-nav nav a{flex-direction:column;gap:6px;min-height:58px;padding:8px 2px;border-radius:12px;font-size:10px;font-weight:600;white-space:nowrap}
 .web-studio-site .studio-site-header .studio-site-nav nav a>span{line-height:1.2}
 .web-studio-site .studio-site-header .studio-account-dropdown{right:-4px;width:225px;max-width:calc(100vw - 48px)}
}
@media(max-width:390px){
 .web-studio-site .studio-site-header .studio-site-tools .studio-site-account>span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
 .web-studio-site .studio-site-header .studio-site-tools .studio-site-account{padding:6px}
}
@media(prefers-reduced-motion:reduce){.web-studio-site .studio-site-header .studio-site-nav nav a{transition:none}}