/* Story and Loop slides (1920 x 1080 canvas), in the SIP look: white paper, ink #333D44, offset-print boxes */
.st-player{position:relative;outline:none}
.st-viewport{position:relative;width:100%;overflow:hidden;background:#fff;border-radius:inherit}
.st-stage{position:absolute;left:0;top:0;width:1920px;height:1080px;transform-origin:0 0}
.st-slide{position:absolute;inset:0;overflow:hidden;opacity:0;transition:opacity .8s ease}
.st-slide.on,.st-slide.edit{opacity:1}
.st-slide.out{opacity:0}
.st-layer{position:absolute;transform:rotate(var(--rot,0deg));transform-origin:50% 50%}
.st-layer>*{width:100%;height:100%}
.st-layer img{width:100%;height:100%;object-fit:contain;display:block;user-select:none}
.st-text{height:auto!important;line-height:1.18;white-space:normal;overflow-wrap:break-word}
.st-text.font-display{font-family:Grandstander,Comfortaa,sans-serif;font-weight:700}
.st-text.font-title{font-family:Comfortaa,sans-serif;font-weight:700;letter-spacing:-.02em}
.st-text.font-body{font-family:Lato,system-ui,sans-serif}
.boxed{background:#fff;border:6px solid #333D44;border-radius:6px;padding:.45em .6em;box-shadow:14px -12px 0 #D3D9E0;box-sizing:border-box}
.st-metric{display:flex;flex-direction:column;justify-content:center;font-family:Grandstander,sans-serif;font-weight:700;color:#000;box-sizing:border-box}
.st-num{font-size:110px;line-height:1;white-space:nowrap}.st-num span{font-size:44px;color:#5B707D;margin-left:-.1em}
.st-lab{font-size:34px;color:#333D45;margin-top:8px}
.st-gauge svg,.st-thermo svg{width:100%;height:100%}
.t-thermo{display:grid;grid-template-rows:minmax(0,1fr) auto auto;justify-items:center}
.t-thermo>*{width:auto;height:auto}.t-thermo>.st-thermo{width:100%;height:100%;min-height:0}
.st-thermo-lab{font:700 26px Grandstander,sans-serif;color:#333D45;text-align:center}
.st-thermo-val{font:700 52px Grandstander,sans-serif}
.t-qr{display:grid;grid-template-rows:1fr auto;justify-items:center;gap:10px}
.t-qr>*{width:auto;height:auto}.st-qr{height:100%!important;aspect-ratio:1;background:#fff;padding:14px;border:6px solid #333D44;border-radius:10px;box-sizing:border-box}
.st-qr svg{width:100%;height:100%;display:block}
.st-qr-lab{font:700 30px Grandstander,sans-serif;color:#333D44;white-space:nowrap}
.st-board{background:#fff;border:6px solid #333D44;border-radius:8px;box-shadow:14px -12px 0 #D3D9E0;padding:26px 30px;box-sizing:border-box;font-family:Grandstander,sans-serif;font-weight:700;overflow:hidden}
.st-board h4{margin:0 0 18px;font-size:38px;color:#333D44}
.st-board ol{list-style:none;margin:0;padding:0;display:grid;gap:22px}
.st-board li{display:grid;grid-template-columns:52px 1fr 1fr 110px;align-items:center;gap:16px;font-size:36px}
.st-board .rk{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#333D44;color:#fff;font-size:24px}
.st-board .bar{height:30px;background:#EEF2F4;border-radius:15px;overflow:hidden;display:block}.st-board .bar i{display:block;height:30px;border-radius:15px}
.st-board .pc{text-align:right}
.st-box{border:6px solid;border-radius:6px;box-sizing:border-box}.st-box.offset{box-shadow:16px -14px 0 #D3D9E0}
.st-orbmap{background:#fff;display:grid;place-items:center}
.st-orbmap>.om{height:100%;width:auto;aspect-ratio:2048/1266;max-width:100%}.st-orbmap>svg{width:100%;height:100%}
.st-orbmap .om{box-shadow:none;border-radius:0}
.st-missing,.st-qr-missing{display:grid;place-items:center;background:#F2F5F7;color:#8A99A2;font:700 24px sans-serif}
/* entrances (played when the slide turns on) */
.st-slide:not(.edit) .st-layer{opacity:0}
.st-slide.on:not(.edit) .st-layer{animation:var(--in) .9s cubic-bezier(.2,.7,.2,1) var(--d) both}
.in-fade{--in:st-fade}.in-rise{--in:st-rise}.in-pop{--in:st-pop}.in-slide{--in:st-slide}.in-wipe{--in:st-wipe}
.st-slide.on:not(.edit) .in-none{animation:none;opacity:1}
@keyframes st-fade{from{opacity:0}to{opacity:1}}
@keyframes st-rise{from{opacity:0;translate:0 60px}to{opacity:1;translate:0 0}}
@keyframes st-pop{0%{opacity:0;scale:.6}70%{opacity:1;scale:1.06}100%{opacity:1;scale:1}}
@keyframes st-slide{from{opacity:0;translate:-140px 0}to{opacity:1;translate:0 0}}
@keyframes st-wipe{from{opacity:1;clip-path:inset(0 100% 0 0)}to{opacity:1;clip-path:inset(0 0 0 0)}}
/* idle loops on the inner content, so they combine with the entrance */
.loop-float>*{animation:st-float 4s ease-in-out infinite}
.loop-pulse>*{animation:st-pulse 2.4s ease-in-out infinite}
.loop-flicker>*{animation:st-flicker 1.1s steps(2) infinite}
.loop-drift>*{animation:st-drift 7s ease-in-out infinite}
.loop-spin>*{animation:st-spin 9s linear infinite}
.loop-sway>*{animation:st-sway 3.2s ease-in-out infinite;transform-origin:50% 100%}
@keyframes st-float{50%{translate:0 -18px}}
@keyframes st-pulse{50%{scale:1.06}}
@keyframes st-flicker{50%{opacity:.82;scale:1.02 .97}}
@keyframes st-drift{0%,100%{translate:0 0;opacity:.85}50%{translate:40px -30px;opacity:.55}}
@keyframes st-spin{to{rotate:360deg}}
@keyframes st-sway{50%{rotate:-4deg}}
@media (prefers-reduced-motion:reduce){.st-slide.on .st-layer{animation-duration:.01s!important}.st-layer>*{animation:none!important}}
/* player chrome */
.st-progress{height:4px;background:#EEF2F4}.st-progress i{display:block;height:100%;width:0;background:var(--leaf,#58BA51)}
.st-player[data-mode="kiosk"] .st-progress{position:absolute;left:0;right:0;bottom:0;opacity:.6}
.st-chapters{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0 0}
.st-chapters button,.st-controls button{font-family:Grandstander,Comfortaa,sans-serif;font-weight:700;font-size:15px;color:#333D44;background:#fff;border:2px solid #333D44;border-radius:9px;padding:.35em .8em;cursor:pointer;box-shadow:3px -3px 0 #D3D9E0}
.st-chapters button[aria-current="true"]{background:#D3D9E0}
.st-controls{display:flex;align-items:center;gap:8px;margin-top:10px}
.st-controls .st-count{font:700 15px Grandstander,sans-serif;color:#5B707D;min-width:4.5em;text-align:center}
.st-controls button:focus-visible,.st-chapters button:focus-visible{outline:3px solid #58BA51;outline-offset:2px}
body.kiosk-show{margin:0;background:#fff;overflow:hidden;height:100vh;display:grid;place-items:center}
body.kiosk-show .st-player{width:min(100vw,calc(100vh*16/9))}
.viewer-page .show-frame{margin:18px auto 0;max-width:1320px}
.viewer-page .show-frame .st-viewport{border-radius:14px;box-shadow:0 1px 2px rgba(0,0,0,.06),0 20px 50px -30px rgba(21,36,42,.45)}
body.embed .show-frame{margin:0;max-width:none}body.embed .show-frame .st-viewport{border-radius:0;box-shadow:none}
/* live pieces */
.st-live{width:100%;height:100%}.st-live svg{display:block;overflow:visible}
.wx{position:relative;width:100%;height:100%;overflow:hidden}
.wx-snow i{position:absolute;top:-24px;border-radius:50%;background:#fff;box-shadow:0 0 0 2px rgba(51,61,68,.18),0 0 10px rgba(255,255,255,.9);animation:wx-fall linear infinite}
@keyframes wx-fall{from{transform:translate(0,0)}to{transform:translate(var(--sway),var(--fall))}}
.wx-sun .wx-rays{animation:wx-spin 40s linear infinite;transform-box:fill-box;transform-origin:center}.wx-sun .wx-glow{animation:wx-glow 3.5s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
@keyframes wx-spin{to{transform:rotate(360deg)}}@keyframes wx-glow{50%{opacity:.75;transform:scale(1.12)}}
@media (prefers-reduced-motion:reduce){.wx-snow i,.wx-sun .wx-rays,.wx-sun .wx-glow{animation:none}}
.st-layer>*{opacity:var(--op,1)}
.st-slide.edit .st-layer.is-hidden{opacity:.28;outline:2px dashed #9AA8B0;outline-offset:2px}