/* Scoped chapter hero styles. No document, body, heading, or button overrides. */
siri-orb {
  --light-poster: url('./assets/poster-wide-light.png');
  --dark-poster: url('./assets/poster-wide-dark.png');
  --poster: var(--light-poster);
  display: block;
  position: relative;
  isolation: isolate;
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: #26162e center / cover no-repeat;
  background-image: var(--poster);
  outline: none;
  touch-action: pan-y;
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: transparent;
}
siri-orb canvas { display: block; position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; opacity: 0; }
siri-orb[data-ready="true"] canvas { opacity: 1; }
siri-orb .orb-handle { display: block; position: absolute; top: 0; left: 0; border-radius: 50%; touch-action: none; cursor: grab; }
siri-orb:not([data-ready="true"]) .orb-handle { display: none; }
siri-orb[data-dragging="true"] .orb-handle { cursor: grabbing; }
siri-orb:focus-visible::after { content: ""; position: absolute; inset: 8px; border: 1px solid #d4deff99; border-radius: 12px; pointer-events: none; }
siri-orb .status { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
/* Poster appearance: system setting, then the host's `theme-dark` / `theme-light` class
   (MacStories sets one on `body`), then the element's own attribute. */
@media (prefers-color-scheme: dark) { siri-orb:not(.theme-light *) { --poster: var(--dark-poster); } }
.theme-dark siri-orb { --poster: var(--dark-poster); }
.theme-light siri-orb { --poster: var(--light-poster); }
siri-orb[theme="light"], siri-orb[data-theme="light"] { --poster: var(--light-poster); }
siri-orb[theme="dark"], siri-orb[data-theme="dark"] { --poster: var(--dark-poster); }
@media (max-width: 640px) {
  siri-orb { aspect-ratio: 19 / 10; --light-poster: url('./assets/poster-phone-light.png'); --dark-poster: url('./assets/poster-phone-dark.png'); }
}