.cluster-scene-surface { position: absolute; inset: 0; overflow: hidden; }
.cluster-scene-canvas { display: block; width: 100%; height: 100%; position: absolute; inset: 0; z-index: 1; }
.hero-visual[data-scene-state="running"] .visual-image,
.hero-visual[data-scene-state="paused"] .visual-image { visibility: hidden; }
.scene-toggle { position: absolute; right: 22px; bottom: 47px; z-index: 9; display: inline-flex; align-items: center; gap: 7px; min-height: 38px; padding: 7px 11px; border: 1px solid #69ddce73; border-radius: 3px; color: #d5f5eb; background: #073b3ce8; font: 500 10px var(--font-body); cursor: pointer; }
.scene-toggle[hidden] { display: none; }
.scene-toggle:hover { background: #125854; }
.scene-toggle:focus-visible { outline: 3px solid #f4a58a; outline-offset: 4px; }
.scene-toggle::before { content: "Ⅱ"; font-family: var(--font-en); font-size: 12px; line-height: 1; }
.scene-toggle[aria-pressed="true"]::before { content: "▶"; font-size: 9px; }
@media (max-width: 600px) {
  .scene-toggle { right: 13px; bottom: 35px; min-height: 40px; font-size: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .cluster-scene-canvas, .scene-toggle { display: none; }
  .hero-visual[data-scene-state] .visual-image { visibility: visible; }
}