/* A living observatory, with the movie and its outcome on one large stage. */
.motion-switch{font:700 18px Arial,sans-serif;color:#c6ecd6}
.motion-switch[aria-pressed="true"]{color:#f4d087;border-color:#f4d08788}
.wordmark{text-shadow:0 2px 7px #092430;background:#102e3b96;border-radius:12px;padding:7px 13px}
#home{isolation:isolate}
#home::before{content:'';position:absolute;z-index:-1;inset:-120px calc((100% - 100vw)/2) 0;pointer-events:none;mask-image:linear-gradient(#000 0%,#000 88%,transparent 100%);background:linear-gradient(90deg,#092b3aef 0%,#10313dcc 32%,#10313d60 48%,transparent 63%)}
#home .home-help,#home .home-minor,#home .streak,#home .reset,#home .arrival-meta{text-shadow:0 1px 4px #062331}
.live-scene{display:inline-flex;align-items:center;gap:5px;font-size:8px;letter-spacing:.13em;flex:none;color:#a6ddc7}
.live-scene i{width:5px;height:5px;border-radius:50%;background:currentColor;box-shadow:0 0 8px #a6ddc7;animation:scene-live 2.2s ease-in-out infinite}
@keyframes scene-live{50%{opacity:.5;box-shadow:0 0 3px #a6ddc7}}
.calm .live-scene{visibility:hidden}
#eventScene{isolation:isolate;box-shadow:0 24px 70px #041d294d,0 1px 0 #dfd5a133;transition:border-color .7s,box-shadow .7s}
#eventScene.has-outcome{border-color:#bcd4af80;box-shadow:0 22px 80px #02182377,0 0 35px #a0d2b51a}
.scene-viewport{position:relative;width:100%;aspect-ratio:16/9;flex:none;overflow:hidden}
#eventScene .scene-art{width:100%;height:100%;max-height:none;min-height:0;aspect-ratio:auto}
#eventScene.has-outcome .scene-viewport{aspect-ratio:2/1}
#outcomeStage{position:absolute;inset:0;z-index:2;overflow:hidden;background:#123746;animation:outcome-arrive .35s ease-out both}
#outcomeStage canvas{display:block;width:100%;height:100%;object-fit:contain}
#outcomeStage[hidden]{display:none!important}
#eventScene.has-outcome #sceneArt{visibility:hidden}
#eventScene figcaption{min-height:36px;position:relative;z-index:3;background:#102d3be8}
#eventScene.has-outcome figcaption{color:#e4e5be}
@keyframes outcome-arrive{from{opacity:0;transform:scale(1.03)}to{opacity:1;transform:none}}
#result{backdrop-filter:blur(8px);background:#143440ed}
#result .verdict{padding-block:6px 10px;border-bottom:1px solid #aac7a42e}
#result .fact{padding:13px 12px;line-height:1.55}
#controls{background:#102f3eea}
#card{isolation:isolate}
#card::after{content:'';grid-column:2;grid-row:2/7;z-index:-1;margin:-2px -9px 0;border-radius:23px;background:linear-gradient(150deg,#102e3de8,#173b46d9);border:1px solid #adc8af27;box-shadow:0 15px 50px #09243233;pointer-events:none}
body[data-phase="feedback"] #card::after{display:none}
.round-caption{justify-self:center;width:fit-content;padding:5px 9px;background:#103140d9;border-radius:8px}
body[data-phase="revealing"] #motionCue{color:#f5d490;animation:scene-live 1.6s ease-in-out infinite}
/* Scenery has room at the horizon and either side of the glass instrument desk. */
body[data-view="game"] #game{padding-top:8px;padding-bottom:48px}
body[data-view="game"] #card>.toprow{background:linear-gradient(90deg,#123443a8,#12344333);border-radius:8px;padding:7px 10px}
body[data-view="game"] .q{background:linear-gradient(90deg,#103141f0,#103141df 80%,#10314140);border-radius:12px;padding:12px 13px 8px}
body[data-view="game"] .journey{filter:drop-shadow(0 2px 4px #061f2a)}
body[data-view="home"] .sign{text-shadow:0 3px 22px #061e29}
#home .home-minor,#home .home-help,#home .reset,#home .streak{position:relative;z-index:2}
.calm #outcomeStage,.calm .live-scene i{animation:none!important}
@media(min-width:1000px){body[data-view="game"] #game{max-width:1170px}#card{grid-template-columns:minmax(0,1.65fr) minmax(280px,.82fr)}#result{padding:22px}#result>div{gap:14px!important}}
@media(max-width:700px){
  #home::before{inset:-100px calc((100% - 100vw)/2) 0;background:linear-gradient(#0c2c3ecc 0%,#10313d96 20%,transparent 28%,transparent 49%,#10313ddd 65%,#10313dde 100%)}
  #card::after{display:none}
  .wordmark{padding:6px 9px}
  header{position:relative;z-index:4}.hgroup{gap:7px}.ibtn{width:36px;height:36px}
  body[data-view="game"] #game{padding-top:0;padding-bottom:25px}
  body[data-view="game"] .q{padding:6px 8px;background:#123442ed}
  #timerBox{padding:7px 7px 4px;background:#123340ed;border-radius:9px}
  .dialwrap{background:radial-gradient(ellipse at 50% 90%,#0b293ae8 35%,#0b293a00 72%)}
  .readout{align-self:center;min-width:180px;padding:3px 9px;background:#123340e8;border-radius:9px}
  #eventScene figcaption{min-height:31px;font-size:8px}
  body[data-phase="feedback"] #eventScene.has-outcome .scene-art{max-height:none;min-height:0;aspect-ratio:auto}
  body[data-phase="feedback"] #eventScene.has-outcome figcaption{display:flex}
  body[data-phase="feedback"] #eventScene.has-outcome{min-height:0}
  #result{padding:14px 16px}#result .fact{padding:10px;line-height:1.45}
  #next{position:relative;bottom:auto;right:auto;width:100%;min-width:0;box-shadow:0 3px 0 #91784c;margin-top:3px}
  body[data-phase="feedback"] #card{padding-bottom:22px}
  #result .verdict{padding-block:0 6px}
  #home .arrival-host{border-radius:0}
}
@media(max-width:350px){.hgroup{gap:5px}.ibtn{width:33px;height:33px}.live-scene{font-size:7px}}