/* The stance page, locked 12 October: lilac colourway, Fraunces, one sentence and the timeline. Other colourways stay in stance.js for future creative. */
@font-face{font-family:"Fraunces";src:url("/stance/fonts/Fraunces-Roman.woff2") format("woff2-variations");font-weight:100 900;font-style:normal;font-display:block}
@font-face{font-family:"Fraunces";src:url("/stance/fonts/Fraunces-Italic.woff2") format("woff2-variations");font-weight:100 900;font-style:italic;font-display:block}
@font-face{font-family:"Inter";src:url("/fonts/Inter-Variable.woff2") format("woff2-variations");font-weight:100 900;font-display:block}
:root{--ground:#EFEAF4;--ink:#241C2E;--muted:rgba(36,28,46,.62);--rule:rgba(36,28,46,.18);--accent:#3C4EA0;
 --serif:"Fraunces",Georgia,serif;--sans:"Inter",system-ui,sans-serif}
*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--ground);color:var(--ink);font:400 17px/1.55 var(--sans);-webkit-font-smoothing:antialiased}
a{color:inherit}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.meta{font:500 11px/1.5 var(--sans);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:0}
.meta a{pointer-events:auto;text-decoration:none}
.stage{position:relative;height:100vh;min-height:640px}
canvas,.still{display:block;width:100%;height:100%;object-fit:cover}
canvas{cursor:grab}canvas:active{cursor:grabbing}
.still{display:none}
.nogl canvas{display:none}.nogl .still{display:block}
.ov{position:absolute;left:60px;top:44px;right:60px;pointer-events:none}
.ov .lede{font:italic 400 30px/1.2 var(--serif);font-variation-settings:"opsz" 96,"SOFT" 60;letter-spacing:-.005em;margin:10px 0 10px;max-width:22em}
.ov .read{margin:0}
.ov .read a{pointer-events:auto;font:500 12px/1.5 var(--sans);letter-spacing:.06em;text-transform:uppercase;text-decoration:none;border-bottom:1px solid currentColor}
.timebar{position:absolute;left:60px;right:60px;bottom:44px}
.time input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:28px;background:none;margin:0;cursor:ew-resize}
.time input[type=range]::-webkit-slider-runnable-track{height:1.5px;background:var(--ink)}
.time input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;border-radius:50%;background:var(--ink);margin-top:-9px;border:0}
.time .stops{position:relative;height:22px}
.time .stops b{position:absolute;top:4px;transform:translateX(-50%);font:500 11px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.time .stops b:first-child{transform:none}
.time .stops b:last-of-type{transform:translateX(-100%)}
.time .stops a{text-decoration:none;border-bottom:1px solid var(--rule);color:var(--ink)}
.time .stops b.next{color:var(--muted)}
@media(max-width:759px){
 .stage{height:100vh;min-height:560px}
 .ov{left:24px;top:28px;right:24px}.ov .lede{font-size:22px}
 .timebar{left:24px;right:24px;bottom:28px}.time .stops b{font-size:9.5px}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
