body { background: #0a0a0a; }
.scroll-track { height: calc(430svh + var(--terminal-overflow, 0px)); }
.viewport { position: sticky; top: 0; height: 100svh; overflow: hidden; background: #0a0a0a; }
.viewport:focus-visible { outline: 1px solid #63d471; outline-offset: -2px; }
.site-layer { position: relative; z-index: 1; }
#world { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 2; pointer-events: none; visibility: hidden; }

.scene-controls {
  position: absolute; z-index: 3; left: 6vw; right: 6vw;
  bottom: max(18px,env(safe-area-inset-bottom));
  display: flex; flex-wrap: wrap; gap: 12px; align-items: center;
  padding: 10px 0; opacity: 0; visibility: hidden;
  background: transparent;
  font-size: 10px; color: #70786e;
}
.scene-controls span { margin-right: auto; letter-spacing: .1em; }
.scene-controls button { padding: 10px 14px; background: #0a0a0ae6; color: #e8e8e2; border: 1px solid #475748; font: inherit; cursor: pointer; }
.scene-controls button:hover,.scene-controls button:focus-visible { outline: 1px solid #63d471; outline-offset: 3px; }
.scene-controls button:disabled { opacity: .4; cursor: default; }

/* Presentation mode exposes only the visitor's intensity control. */
body:not(.debug-controls) .scene-controls button { display: none; }
body:not(.debug-controls) .scene-controls { justify-content: flex-start; pointer-events: none; }
body:not(.debug-controls) .scene-controls span { margin: 0; text-align: left; }
body:not(.debug-controls) .scene-controls .intense-toggle { display: inline-block; pointer-events: auto; }
/* A small icon inside a full-sized hit target, anchored away from the hint. */
.scene-controls .intense-toggle {
  position: absolute; right: 0; bottom: 0; width: 44px; height: 44px;
  padding: 12px; border: 0; background: transparent; color: #788076;
  transition: color .25s ease;
}
.scene-controls .intense-toggle svg { display: block; width: 20px; height: 20px; fill: currentColor; transition: filter .25s ease; }
.scene-controls .intense-toggle[aria-pressed="true"] { color: #63d471; }
.scene-controls .intense-toggle[aria-pressed="true"] svg { filter: drop-shadow(0 0 4px #63d47166); }
.scene-controls { padding-right: 52px; padding-left: 0; }

/* Two latest commands precede the prompt without a nested scroll area. */
.terminal-output:empty { display: none; }
.terminal-output:not(:empty) { margin: 0 0 .8rem; overflow-wrap: anywhere; }
.terminal-entry + .terminal-entry { margin-top: .8rem; }
.terminal-entry > div:first-child { color: #63d471; }
.terminal-entry > div:last-child { margin-top: .35rem; }

@media(max-width:1000px) {
  .scene-controls { justify-content: flex-start; }
  .scene-controls span { flex-basis: 100%; text-align: left; margin: 0 0 5px; font-size: 9px; letter-spacing: .04em; }
}
@media(max-width:600px) {
  .scene-controls { left: 6vw; right: 4vw; gap: 6px; }
  .scene-controls button:not(.intense-toggle) { padding: 9px 10px; }
}
@media(prefers-reduced-motion:reduce) {
  .scene-controls .intense-toggle,.scene-controls .intense-toggle svg { transition: none; }
  .scroll-track { height: calc(250svh + var(--terminal-overflow, 0px)); }
}

/* Pointer hover uses colour; keyboard focus retains a visible indicator. */
.scene-controls .intense-toggle:hover { outline: none; color: #a9b6a5; }
.scene-controls .intense-toggle[aria-pressed="true"]:hover { color: #86e992; }
.scene-controls .intense-toggle:focus-visible { outline: 1px solid #63d471; outline-offset: 3px; }