.lv-stage { position: relative; height: clamp(440px, 68vh, 720px); overflow: hidden; background: #FAF9F5; transition: background-color .45s cubic-bezier(.25,.46,.45,.94); }
.lv-canvas { position: absolute; inset: 0; display: block; width: 100%; height: 100%; transform: translateZ(0); }
/* a scene was composed for the right half of a screen, about 720 by 800: on a wide stage it draws in a box of that
   shape in the middle, and its round mask fades it into the stage, which takes the scene's own background */
.lv-scene { height: clamp(480px, 74vh, 800px); }
.lv-box { position: absolute; top: 0; bottom: 0; left: 50%; width: min(100%, 760px); transform: translateX(-50%); }
.lv-meta { position: absolute; left: 22px; bottom: 20px; right: 22px; display: flex; gap: 12px; align-items: baseline; pointer-events: none; }
.lv-cap { font-family: var(--font); font-size: 12px; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; color: #A09D93; }
.lv-dim { opacity: .7; }
.lv-stage[data-dark="1"] .lv-cap { color: rgba(255,255,255,.55); }
.lv-field { background: #f9f9f6; }
.lv-field .lv-cap { font-size: 11px; letter-spacing: .08em; color: #52524f; }
.lv-field .lv-dim { color: #6c6c68; }
.lv-graph { background: #F0EEE7; touch-action: pan-y; }
.lv-graph .lv-cap { font-size: 11px; letter-spacing: .08em; }
@media (prefers-reduced-motion: reduce) { .lv-stage { transition: none; } }