:root{--yiqi-header-font:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--yiqi-header-nav-size:13px}
/* Shared public header. Keep page-specific styles out of this component. */
body:is(.home-app-entry,.pricing-page,body) .site-header{box-sizing:border-box;max-width:1100px;width:100%;margin:0 auto;padding:12px 24px;border-bottom:1px solid #e6e5d9;background:#f7f4eb;display:flex;align-items:center;justify-content:space-between;flex-wrap:nowrap;gap:12px}
body:is(.home-app-entry,.pricing-page,body) .site-header .brand{font:700 20px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#406d55;display:flex;align-items:center;gap:8px;white-space:nowrap}
body:is(.home-app-entry,.pricing-page,body) .site-header .brand img{width:38px;height:38px;flex-shrink:0}
body:is(.home-app-entry,.pricing-page,body) .site-header .actions{display:flex;align-items:center;flex-wrap:nowrap;gap:14px;margin:0 0 0 auto}
body:is(.home-app-entry,.pricing-page,body) .site-header .actions>:is(a,button){font:400 var(--yiqi-header-nav-size)/1.5 var(--yiqi-header-font);display:inline-flex;align-items:center;min-height:44px;white-space:nowrap}
body:is(.home-app-entry,.pricing-page,body) .site-header .login,body:is(.home-app-entry,.pricing-page,body) .site-header .return-app{padding:8px 16px;border:1px solid #dcded2;border-radius:24px;background:#fffef9;color:#406d55}
@media(max-width:700px){body:is(.home-app-entry,.pricing-page,body) .site-header{padding:10px 12px;gap:8px}body:is(.home-app-entry,.pricing-page,body) .site-header .brand{font-size:20px;gap:8px}body:is(.home-app-entry,.pricing-page,body) .site-header .brand img{width:38px;height:38px}body:is(.home-app-entry,.pricing-page,body) .site-header .actions{gap:9px}body:is(.home-app-entry,.pricing-page,body) .site-header .login,body:is(.home-app-entry,.pricing-page,body) .site-header .return-app{padding:5px 8px}}
@media(max-width:360px){body:is(.home-app-entry,.pricing-page,body) .site-header{padding-inline:10px;gap:5px}body:is(.home-app-entry,.pricing-page,body) .site-header .brand{font-size:20px;gap:8px}body:is(.home-app-entry,.pricing-page,body) .site-header .brand img{width:38px;height:38px}body:is(.home-app-entry,.pricing-page,body) .site-header .actions{gap:6px}body:is(.home-app-entry,.pricing-page,body) .site-header .login,body:is(.home-app-entry,.pricing-page,body) .site-header .return-app{padding-inline:5px}}

.home-app-entry .site-header{position:sticky;top:0;z-index:50;box-shadow:0 4px 14px #34483e06}

body .site-header .actions>button{color:#406d55;border:0;background:transparent;padding:5px 8px;cursor:pointer}body .site-header .actions>button[hidden]{display:none}

/* Canonical brand matches My Space; identical at every breakpoint. */
body .site-header .brand{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:20px;font-weight:700;line-height:1.5;color:#406d55;gap:8px;text-decoration:none}body .site-header .brand img{width:38px;height:38px}body .site-header .actions>:is(a,button){color:#406d55;text-decoration:none}@media(max-width:700px){}

@media(max-width:360px){body:is(.home-app-entry,.pricing-page,body) .site-header{flex-wrap:wrap}body:is(.home-app-entry,.pricing-page,body) .site-header .actions{flex-basis:100%;justify-content:flex-end;gap:8px}body:is(.home-app-entry,.pricing-page,body) .site-header .actions>:is(a,button){min-height:32px}}

html:root .calendar-brand>img{width:38px;height:38px;flex:0 0 38px}html:root .calendar-brand h1{font:700 20px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#406d55;margin:0}html:root .calendar-brand{gap:8px}

html{-webkit-text-size-adjust:100%;text-size-adjust:100%}body:is(.home-app-entry,.pricing-page,body) .site-header .brand{-webkit-text-size-adjust:100%;text-size-adjust:100%;font-size:20px;flex-shrink:0}body:is(.home-app-entry,.pricing-page,body) .site-header .brand img{width:38px;height:38px;min-width:38px;max-width:38px;flex:0 0 38px}

/* Old calendar rules used !important; canonical brand must override them. */
html:root .calendar-brand h1{font-size:20px!important;color:#406d55!important;font-weight:700!important}html:root .calendar-brand>img{width:38px!important;height:38px!important;flex:0 0 38px!important}

/* One complete typographic contract for every brand element. */
html:root body .site-header .brand,html:root .calendar-brand h1,html:root body .app-brand{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;font-size:20px!important;font-weight:700!important;line-height:30px!important;letter-spacing:0!important;font-style:normal!important;color:#406d55!important;text-transform:none!important;-webkit-text-size-adjust:100%;text-size-adjust:100%}

html:root main>header .calendar-brand h1{font:700 20px/30px -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;letter-spacing:0!important;color:#406d55!important}

html:root body .site-header .actions>.login{flex:0 0 auto;min-width:68px;justify-content:center;padding-inline:14px;box-sizing:border-box}