/* Reserve scrollbar space so switching to a longer page cannot shift the header. */
html { scrollbar-gutter: stable; }
html [data-coast-theme] { padding-top: 0; padding-left: 0; padding-right: 0; }

/* Both views share fixed control columns and the same logo/credit geometry. */
[data-coast-theme] > header.fana-header-row,
.advanced-site header > .fana-header-row {
  display: grid; grid-template-columns: 148px minmax(0, 1fr) 140px 80px 148px;
  align-items: center; gap: 8px 12px; width: 100%; max-width: 1320px;
  min-height: 64px; margin: 0 auto; padding: 10px 24px;
}
:is([data-coast-theme], .advanced-site) .fana-header-row .fana-header-actions { display: contents; }
:is([data-coast-theme], .advanced-site) .fana-header-row .fana-header-brand { grid-column: 1; grid-row: 1; display: flex; align-items: center; gap: 6px; width: 148px; height: 44px; min-height: 44px; }
:is([data-coast-theme], .advanced-site) .fana-header-row .fana-header-brand > img,
:is([data-coast-theme], .advanced-site) .fana-header-row .fana-header-brand > span:first-child { width: 40px; height: 44px; }
:is([data-coast-theme], .advanced-site) .fana-header-row .fana-header-brand > span:last-child,
:is([data-coast-theme], .advanced-site) .fana-header-row .fana-header-brand strong { font: 500 26px/1.1 Georgia, 'Times New Roman', serif; letter-spacing: .13em; }
[data-coast-theme] .fana-header-row .fana-affiliation,
.advanced-site header .fana-header-row .fana-affiliation {
  grid-column: 2; grid-row: 1; position: static; padding: 0; border: 0; margin: 0; justify-self: start;
}
:is([data-coast-theme], .advanced-site) .fana-header-row .fana-affiliation a { display: inline-flex; flex-direction: row; align-items: center; gap: 5px; height: 44px; min-height: 44px; padding: 4px 10px; font: 400 11px/1.5 var(--font-inter), sans-serif; white-space: nowrap; }
:is([data-coast-theme], .advanced-site) .fana-header-row .fana-affiliation strong { font: 600 11px/1.5 var(--font-inter), sans-serif; }
:is([data-coast-theme], .advanced-site) .fana-header-row .fana-affiliation a > [aria-hidden] { position: static; }
:is([data-coast-theme], .advanced-site) .fana-header-row .fana-social-links { grid-column: 3; grid-row: 1; margin: 0; justify-self: end; }
:is([data-coast-theme], .advanced-site) .fana-header-row .fana-header-actions > button { grid-column: 4; grid-row: 1; width: 80px; height: 44px; min-height: 44px; padding: 6px; display: inline-flex; align-items: center; justify-content: center; gap: 6px; margin: 0; }
:is([data-coast-theme], .advanced-site) .fana-header-row .fana-header-actions > button > span:last-child { display: inline; }
:is([data-coast-theme], .advanced-site) .fana-header-row .fana-mode-link { grid-column: 5; grid-row: 1; display: inline-flex; align-items: center; justify-content: center; gap: 6px; width: 148px; height: 44px; min-height: 44px; padding: 6px 10px; margin: 0; font-size: 13px; border-radius: 12px; }
:is([data-coast-theme], .advanced-site) .fana-header-row .fana-mode-link img { display: block; width: 27px; height: 30px; }
:is([data-coast-theme], .advanced-site) .fana-header-row .fana-mode-link > span { font-size: inherit; }
:is([data-coast-theme], .advanced-site) .fana-header-row a[href="/owner/"] { grid-column: 1 / -1; justify-self: end; }
.fana-demo-notice { margin-bottom: 16px; }
.fana-demo-notice:empty { display: none; }

@media (max-width: 900px) {
  [data-coast-theme] > header.fana-header-row,
  .advanced-site header > .fana-header-row { grid-template-columns: minmax(140px, 1fr) 80px 148px; padding: 12px; column-gap: 8px; }
  :is([data-coast-theme], .advanced-site) .fana-header-row .fana-header-brand { width: 140px; }
  [data-coast-theme] .fana-header-row .fana-affiliation,
  .advanced-site header .fana-header-row .fana-affiliation { grid-column: 1 / -1; justify-self: start; margin-left: 160px; }
  :is([data-coast-theme], .advanced-site) .fana-header-row .fana-social-links { grid-column: 1; grid-row: 2; justify-self: start; }
  :is([data-coast-theme], .advanced-site) .fana-header-row .fana-header-actions > button { grid-column: 2; grid-row: 2; }
  :is([data-coast-theme], .advanced-site) .fana-header-row .fana-mode-link { grid-column: 3; grid-row: 2; }
}
@media (max-width: 690px) {
  [data-coast-theme] > main { padding-left: 12px; padding-right: 12px; }
}
@media (max-width: 420px) {
  [data-coast-theme] > header.fana-header-row,
  .advanced-site header > .fana-header-row { grid-template-columns: minmax(140px, 1fr) 44px 92px; column-gap: 5px; }
  :is([data-coast-theme], .advanced-site) .fana-header-row .fana-header-brand { gap: 4px; width: 128px; }
  :is([data-coast-theme], .advanced-site) .fana-header-row .fana-header-brand > img,
  :is([data-coast-theme], .advanced-site) .fana-header-row .fana-header-brand > span:first-child { width: 32px; height: 40px; }
  :is([data-coast-theme], .advanced-site) .fana-header-row .fana-header-brand > span:last-child,
  :is([data-coast-theme], .advanced-site) .fana-header-row .fana-header-brand strong { font-size: 22px; }
  [data-coast-theme] .fana-header-row .fana-affiliation,
  .advanced-site header .fana-header-row .fana-affiliation { margin-left: 146px; }
  :is([data-coast-theme], .advanced-site) .fana-header-row .fana-affiliation a { flex-direction: column; align-items: flex-start; justify-content: center; gap: 0; padding: 4px 18px 4px 8px; position: relative; font-size: 10px; }
  :is([data-coast-theme], .advanced-site) .fana-header-row .fana-affiliation a > [aria-hidden] { position: absolute; right: 5px; bottom: 7px; }
  :is([data-coast-theme], .advanced-site) .fana-header-row .fana-header-actions > button { width: 44px; }
  :is([data-coast-theme], .advanced-site) .fana-header-row .fana-header-actions > button > span:last-child { display: none; }
  :is([data-coast-theme], .advanced-site) .fana-header-row .fana-mode-link { width: 92px; padding: 6px; gap: 4px; font-size: 12px; }
  :is([data-coast-theme], .advanced-site) .fana-header-row .fana-mode-link img { display: none; }
}
