/* FLOWING BLUE — theme overrides on top of scrub-engine's injected CSS.
   Extracted from index.html when the site moved to per-locale pages, so the
   three generated pages share one stylesheet instead of three copies. */

:root, .sw-root {
  --sw-bg: var(--fb-wall);
  --sw-ink: var(--fb-ink-dark);
  --sw-ink-soft: #9A917F;
  --sw-accent: var(--fb-current);    /* was the gold thread; chrome is blue now */
  --sw-font-display: var(--fb-font-display);
  --sw-font-body: var(--fb-font-body);
}

/* dark chrome: quiet the light-theme copy scrim, keep text legible over film */
.sw-copylayer::before {
  background: linear-gradient(90deg, rgba(10,10,12,.72) 0%, rgba(10,10,12,.42) 40%, transparent 100%) !important;
}
.sw-copy__title { text-shadow: 0 2px 24px rgba(0,0,0,.75) !important; }
.sw-copy__body  { text-shadow: 0 1px 14px rgba(0,0,0,.8) !important; color: #D8CFBE !important; }
.sw-copy__tags li { background: rgba(106,197,254,.12) !important; color: var(--fb-shallow) !important; }
.sw-btn--primary { background: var(--fb-current) !important; color: #FFFFFF !important; font-weight: 700; }

/* route-rail label: engine default is a white pill + var(--sw-ink) text — unreadable
   on our dark theme (ink is near-white). Dark pill, paper-white text, gold edge. */
.sw-route__label {
  background: rgba(10,10,12,.88) !important;
  color: #F2EBDD !important;
  border: 1px solid rgba(106,197,254,.4) !important;
}

/* Titles only — the scene index is chrome and adds nothing, including on the finale. */
.sw-copylayer .sw-copy__num { display: none !important; }
.sw-nav { display: none !important; }
.sw-topcta { display: none; }

/* Top-left mark: a still white tile with the initials, instead of the engine's
   gradient chip (tinted with the active scene's accent, so it changed colour on
   every scene) plus the full wordmark. Quieter during the film. Initials come
   from brand-config.js — app.js writes them in. */
.sw-brand__mark {
  width: 34px !important;
  height: 34px !important;
  border-radius: 8px !important;
  background: #FFFFFF !important;
  box-shadow: 0 2px 12px rgba(0, 0, 0, .38) !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  font-family: var(--sw-font-display);
  font-weight: 700;
  font-size: .84rem;
  letter-spacing: .03em;
  color: #003C7E;
}
.sw-brand__name { display: none !important; }

/* The finale copy block sits lower than it looks: the engine overwrites the
   centring transform with its per-frame drift, so `top` alone positions it. At
   50% the white wordmark plate lands across the archetypes' heads on the left of
   the piazza. Lifting it clears them. Desktop only — mobile is bottom-anchored. */
@media (min-width: 861px) {
  .sw-copylayer .sw-copy:last-child { top: 33% !important; }
}

@media (max-width: 860px) {
  .sw-copylayer::before {
    background: linear-gradient(0deg, rgba(10,10,12,.82) 10%, rgba(10,10,12,.45) 50%, transparent 100%) !important;
  }
}
