/* ============================================================================
   Sticky country switches everywhere, and the stacked panels of the
   observatory's pages (2026-10-05). Loaded after site-pages.css.
   ============================================================================ */

/* ---- cards that clip their content: overflow clip instead of hidden ----------
   `overflow: hidden` makes a box a scroll container, and a sticky country switch
   inside one stays put (or is displaced before any scrolling). `overflow: clip`
   clips the same way without scrolling, so the switch follows the page within
   its card. The week panel (home page, overview), the overview's corpus card
   and the chart cards (trends, deletions). */
.observatory .glass.wk,
.observatory .glass.overview-corpus,
.observatory .chart-container {overflow:clip}

/* ---- the week panel's cells: their switch sticks like every other ------------ */
.observatory .wk__cell .panel-scope:not(.no-stick) {position:sticky;box-shadow:0 10px 30px #0006}
@media (max-width:640px) {
  /* on a phone the cell's switch is a plain block; sticking, it needs the bar's
     surface so the cell's content does not show through */
  .observatory .wk__cell .panel-scope {padding:6px 8px 7px 10px;border:1px solid #d9cfd166;border-left:4px solid #e3414f;border-radius:6px;background:#0f1114f5;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
}

/* ---- the search page: the switch sits above the results and follows them ----- */
.search-scope {display:contents}

/* ---- stacked panels: the sections a country switch swaps in place ------------
   On the observatory's pages the sections are wrapped in their
   [data-scope-box]; a sticky section inside a wrapper of its own height could
   not move, so the wrapper lets its section belong to the main's flow. */
.stack > [data-scope-box]:has(> .section) {display:contents}
@media (prefers-reduced-motion:no-preference) {
  .stack > [data-scope-box] > .section {position:sticky;top:var(--stick-top,var(--stack-top,0px));border-radius:28px 28px 0 0;box-shadow:0 -22px 60px #000a;border-top:1px solid #ffffff14;background:#121419}
  .stack > [data-scope-box] > .section.section--dark {background:#0e1014}
  .stack > [data-scope-box] > .section.no-stick {position:relative}
  /* the main bar slides away on the observatory's pages: the panels then stick
     right under the tool bar (site-ui.js sets both offsets) */
  body:has(.main > .workspace__tools) .navbar--hidden ~ .main.stack > .section:not(.hero),
  body:has(.main > .workspace__tools) .navbar--hidden ~ .main.stack > [data-scope-box] > .section {top:var(--stick-top-navless,var(--stick-top,0px))}
}
/* a panel being swapped dims while the new country loads (the wrapper has no box) */
.stack > [data-scope-box].scope-busy > .section {opacity:.6;transition:opacity .2s}