/* The home theater (member request, henry): our movie site full screen over everything. The black fills the whole
   screen; a slim black strip under the notch holds Close (member request, henry: it used to hang over the site's own top bar),
   and the frame fills the rest, inside the side insets and the home bar, with nothing laid over it. */
.thr { --thr-bar: 38px; position: fixed; inset: 0; z-index: 9100; background: #000; opacity: 0; transition: opacity .18s; overscroll-behavior: contain; touch-action: auto; }
.thr.show { opacity: 1; }
.thr-bar { position: absolute; top: env(safe-area-inset-top); left: env(safe-area-inset-left); right: env(safe-area-inset-right); height: var(--thr-bar);
  display: flex; align-items: stretch; justify-content: center; background: #000; box-shadow: inset 0 -1px #ffffff14; }
.thr-frame { position: absolute; top: calc(env(safe-area-inset-top) + var(--thr-bar)); bottom: var(--sab, env(safe-area-inset-bottom)); left: env(safe-area-inset-left); right: env(safe-area-inset-right);
  width: calc(100% - env(safe-area-inset-left) - env(safe-area-inset-right)); height: calc(100% - env(safe-area-inset-top) - var(--thr-bar) - var(--sab, env(safe-area-inset-bottom)));
  border: 0; display: block; background: #000; color-scheme: normal; }
.thr-x { position: relative; display: flex; align-items: center; gap: 6px; padding: 0 16px 0 14px; border: 0; background: transparent; color: #fff5f5;
  font: 800 13px/1 "Libre Franklin", system-ui, sans-serif; letter-spacing: .02em; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.thr-x::after { content: ""; position: absolute; left: 10px; right: 10px; bottom: 0; height: 2px; background: var(--red, #d3121c); } /* a felt-red lip */
.thr-x svg { width: 11px; height: 11px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: square; }
.thr-x:focus-visible { outline: 2px solid #fff5f5; outline-offset: -4px; }
body.thr-on { overflow: hidden; }
@media (prefers-reduced-motion: reduce) { .thr { transition: none; } }
/* Agent Gary's Quick Connect hint (geeksquad.js): two short lines left of Close, the strip a little taller */
.thr.hinted { --thr-bar: 48px; }
.thr.hinted .thr-bar { justify-content: space-between; }
.thr-hint { min-width: 0; display: flex; flex-direction: column; justify-content: center; gap: 3px; padding: 0 4px 0 12px; color: #fff5f5;
  font: 700 12px/1.15 "Atkinson Hyperlegible", system-ui, sans-serif; }
.thr-hint span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.thr-hint span + span { color: #ffd2b8; }
.thr-hint b { padding: 0 5px; background: #ff6c0c; color: #000; font: 600 14px/1.2 "Barlow Condensed", system-ui, sans-serif; letter-spacing: .08em; }