/* Keep a fixed flow footprint while a timed, threshold-triggered animation
   moves the masthead above the viewport and reveals the compact sticky row. */
#rg-news-bars .nb-reader-header {
  --nb-masthead-space: 164px;
  --nb-masthead-logo: 88px;
  --nb-masthead-inset: 25px;
  position: sticky;
  top: 0;
  z-index: 30;
  padding-block-start: calc(10px + var(--nb-masthead-space));
  background: var(--nb-paper);
  isolation: isolate;
}
#rg-news-bars .nb-reader-header[data-header-ready] {
  transform: translate3d(0, var(--nb-header-y, 0px), 0);
}
#rg-news-bars .nb-reader-header[data-header-condensed] {
  box-shadow: 0 8px 22px -18px var(--nb-ink);
}
#rg-news-bars .nb-reader-header .nb-brand-slot {
  position: relative;
  flex: none;
  min-width: 0;
  justify-self: start;
}
#rg-news-bars .nb-reader-header .nb-tagline { display: none; }
/* A centered masthead is also usable before JavaScript or without it. */
#rg-news-bars .nb-reader-header:not([data-header-ready]) .nb-brand-slot {
  position: static;
  width: 180px;
  height: 48px;
}
#rg-news-bars .nb-reader-header:not([data-header-ready]) .nb-brand {
  position: absolute;
  grid-area: auto;
  left: 50%;
  top: var(--nb-masthead-inset);
  width: max-content;
  flex-direction: column;
  transform: translateX(-50%);
}
#rg-news-bars .nb-reader-header[data-header-ready] .nb-brand-slot {
  width: var(--nb-brand-width);
  height: var(--nb-brand-height);
}
#rg-news-bars .nb-reader-header[data-header-ready] .nb-brand {
  position: absolute;
  left: 0;
  top: 0;
  display: block;
  min-height: 0;
  width: var(--nb-brand-link-width);
  height: var(--nb-brand-link-height);
  transform: translate3d(var(--nb-brand-x), var(--nb-brand-y), 0);
  border-radius: 5px;
}
#rg-news-bars .nb-reader-header[data-header-ready] .nb-brand > .rg-brand-icon,
#rg-news-bars .nb-reader-header[data-header-ready] .nb-brand > strong {
  position: absolute;
  left: 0;
  top: 0;
  transform-origin: top left;
}
#rg-news-bars .nb-reader-header[data-header-ready] .nb-brand > .rg-brand-icon {
  transform: translate3d(var(--nb-logo-x), var(--nb-logo-y), 0) scale(var(--nb-logo-scale));
}
/* Two separated reflections suggest a top glass layer and a softer layer below. */
#rg-news-bars .nb-reader-header[data-header-ready] .nb-brand::before,
#rg-news-bars .nb-reader-header[data-header-ready] .nb-brand::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: var(--nb-logo-size);
  height: var(--nb-logo-size);
  transform-origin: top left;
  transform: translate3d(var(--nb-logo-x), var(--nb-logo-y), 0) scale(var(--nb-logo-scale));
  opacity: 0;
  pointer-events: none;
}
#rg-news-bars .nb-reader-header[data-header-ready] .nb-brand::before {
  z-index: 1;
  /* Match the flat gold sun in the approved artwork, inset to keep a clean edge. */
  clip-path: ellipse(15.1% 14.7% at 46.2% 31.8%);
  background: #fff0b8;
}
#rg-news-bars .nb-reader-header[data-header-ready] .nb-brand::after {
  z-index: 2;
  clip-path: inset(1.2% round 22%);
  background: linear-gradient(110deg,
    transparent 41%,
    rgb(255 255 255 / 4%) 45%,
    rgb(255 255 255 / 12%) 47.8%,
    rgb(255 255 255 / 28%) 48.8%,
    rgb(255 255 255 / 88%) 49.4%,
    rgb(255 255 255 / 88%) 50.6%,
    rgb(255 255 255 / 22%) 51.1%,
    transparent 52.5%) 100% 0 / 300% 100% no-repeat,
    linear-gradient(110deg,
      transparent 40%,
      rgb(255 255 255 / 8%) 44%,
      rgb(255 255 255 / 27%) 48%,
      rgb(255 255 255 / 30%) 51%,
      rgb(255 255 255 / 16%) 55%,
      transparent 60%) 144% 0 / 300% 100% no-repeat;
}
#rg-news-bars .nb-reader-header[data-logo-glint] .nb-brand::before {
  animation: nb-sun-glint 1600ms ease-in-out both;
}
#rg-news-bars .nb-reader-header[data-logo-glint] .nb-brand::after {
  animation: nb-logo-glint 1100ms ease-in-out both;
}
@keyframes nb-logo-glint {
  0% { background-position: 100% 0, 144% 0; opacity: 0; }
  14% { opacity: 1; }
  90% { opacity: 1; }
  100% { background-position: 0% 0, 12% 0; opacity: 0; }
}
@keyframes nb-sun-glint {
  0%, 26% { opacity: 0; }
  33%, 58% { opacity: .88; }
  100% { opacity: 0; }
}
#rg-news-bars .nb-reader-header[data-header-ready] .nb-brand > strong {
  white-space: nowrap;
  opacity: var(--nb-name-opacity, 1);
  clip-path: inset(0 0 var(--nb-name-mask, 0%) 0);
  transform: translate3d(var(--nb-name-x), calc(var(--nb-name-y) + var(--nb-name-rise, 0px)), 0) scale(var(--nb-name-scale));
}
/* The wordmark catches the light just after the mark, with a tiny physical settle. */
@media screen and (prefers-reduced-motion: no-preference) and (forced-colors: none) {
  html:not([data-rg-motion="reduce"]) #rg-news-bars .nb-reader-header[data-logo-glint] .nb-brand > strong {
    animation: nb-name-settle 780ms ease-in-out 180ms both;
  }
  @supports ((background-clip: text) or (-webkit-background-clip: text)) and (color: color-mix(in srgb, black, white)) {
    html:not([data-rg-motion="reduce"]) #rg-news-bars .nb-reader-header[data-logo-glint] .nb-brand > strong {
      color: transparent;
      -webkit-text-fill-color: transparent;
      background-image: linear-gradient(110deg, var(--nb-green) 40%, color-mix(in srgb, var(--nb-green) 80%, white) 46%, color-mix(in srgb, var(--nb-green) 55%, white) 50%, color-mix(in srgb, var(--nb-green) 80%, white) 54%, var(--nb-green) 60%);
      background-size: 300% 100%;
      background-position: 100% 0;
      background-repeat: no-repeat;
      -webkit-background-clip: text;
      background-clip: text;
      animation: nb-name-glint 780ms ease-in-out 180ms both, nb-name-settle 780ms ease-in-out 180ms both;
    }
  }
}
@keyframes nb-name-glint {
  from { background-position: 100% 0; }
  to { background-position: 0% 0; }
}
@keyframes nb-name-settle {
  0%, 100% { translate: 0 0; }
  35% { translate: .4px -.65px; }
  70% { translate: .1px -.2px; }
}
#rg-news-bars .nb-reader-header .nb-brand:focus-visible {
  outline: 2px solid var(--nb-gold);
  outline-offset: 5px;
}
#rg-news-bars .nb-reader-header .nb-timezone-list {
  max-height: min(45svh, 360px);
  overflow-y: auto;
  overscroll-behavior: contain;
}
html:has(.nb-reader-header[data-header-ready]) {
  scroll-padding-top: var(--nb-sticky-clearance, 220px);
}
#rg-news-bars .nb-reader-main :is(a, button, input, select, [tabindex]) {
  scroll-margin-block: 12px;
}
@media (max-width: 580px) {
  #rg-news-bars .nb-reader-header {
    --nb-masthead-space: 144px;
    --nb-masthead-logo: 76px;
    --nb-masthead-inset: 22px;
    padding-block-start: calc(12px + var(--nb-masthead-space));
  }
  #rg-news-bars .nb-reader-header .nb-brand-slot { grid-column: 1; grid-row: 1; }
}
/* Reduced motion keeps a compact sticky header without spatial animation. */
@media (prefers-reduced-motion: reduce) {
  #rg-news-bars .nb-reader-header { --nb-masthead-space: 0px; }
  #rg-news-bars .nb-reader-header .nb-brand::before,
  #rg-news-bars .nb-reader-header .nb-brand::after { display: none; }
  #rg-news-bars .nb-reader-header:not([data-header-ready]) .nb-brand { position: static; width: auto; flex-direction: row; transform: none; }
}
html[data-rg-motion="reduce"] #rg-news-bars .nb-reader-header { --nb-masthead-space: 0px; }
html[data-rg-motion="reduce"] #rg-news-bars .nb-reader-header .nb-brand::before,
html[data-rg-motion="reduce"] #rg-news-bars .nb-reader-header .nb-brand::after { display: none; }
html[data-rg-motion="reduce"] #rg-news-bars .nb-reader-header:not([data-header-ready]) .nb-brand { position: static; width: auto; flex-direction: row; transform: none; }
@media print {
  #rg-news-bars .nb-reader-header .nb-brand::before,
  #rg-news-bars .nb-reader-header .nb-brand::after { display: none; }
  #rg-news-bars .nb-reader-header { --nb-masthead-space: 0px; position: static; box-shadow: none; transform: none !important; }
  #rg-news-bars .nb-reader-header .nb-brand-slot { width: auto; height: auto; }
  #rg-news-bars .nb-reader-header .nb-brand { position: static !important; display: flex !important; width: auto !important; height: auto !important; flex-direction: row !important; transform: none !important; }
  #rg-news-bars .nb-reader-header .nb-brand > .rg-brand-icon,
  #rg-news-bars .nb-reader-header .nb-brand > strong { position: static !important; transform: none !important; }
  #rg-news-bars .nb-reader-header .nb-brand > strong { opacity: 1 !important; clip-path: none !important; }
}