:root{color-scheme:dark;--bg:#171916;--ink:#f2f0e8;--muted:#aaa99f;--line:#3a3d35;--accent:#d7ec94;font-family:Arial,Helvetica,sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink)}button,input{font:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:5px}header{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:27px 4vw;border-bottom:1px solid var(--line);font-size:10px;letter-spacing:1.5px}header a{color:var(--ink);font-weight:800;text-decoration:none;font-size:17px;letter-spacing:-.6px}header a span{font-weight:400}header>span{color:var(--muted)}main{max-width:1500px;margin:auto;padding:0 4vw}.intro{padding:70px 0 62px}.eyebrow,.tag,.caption,.detail>span,figcaption,footer{font-size:10px;letter-spacing:1.6px}.eyebrow{color:var(--accent);margin:0 0 25px}h1{font-size:clamp(36px,5.1vw,78px);font-weight:400;letter-spacing:-.055em;line-height:1.06;margin:0 0 23px}p{line-height:1.6;color:var(--muted);font-size:15px;margin:0}section{border-top:1px solid var(--line);padding:30px 0 65px}.heading{display:flex;gap:26px;align-items:baseline;margin-bottom:25px}h2{font-weight:400;letter-spacing:-.035em;font-size:clamp(24px,2.5vw,38px);margin:0 0 10px}.heading p{max-width:690px}.tag{margin-left:auto;white-space:nowrap;color:var(--muted)}.cinema{position:relative;background:#0b0c0a}.cinema video{display:block;width:100%;aspect-ratio:16/9;max-height:73vh;object-fit:contain;background:#0b0c0a}.caption{display:block;padding:15px 18px;color:var(--muted);border-top:1px solid #262922}.tabs{display:flex;gap:8px;margin:27px 0 15px;flex-wrap:wrap}button{border:1px solid var(--line);background:transparent;color:var(--ink);padding:13px 19px;border-radius:2px;font-size:12px}.tabs button[aria-pressed=true],#compare-play,.submit{background:var(--accent);color:#20271a;border-color:var(--accent)}button:hover{border-color:var(--accent)}button:disabled{opacity:.5;cursor:wait}.quiet{border:0;padding:6px;color:var(--muted)}.detail{display:flex;justify-content:space-between;gap:24px;align-items:center;padding:15px 0}.detail>span{color:var(--muted)}.comparison{display:grid;grid-template-columns:1fr 1fr;gap:14px}.comparison figure{margin:0;background:#0b0c0a}.comparison video{display:block;width:100%;aspect-ratio:16/9;background:#0b0c0a}.comparison figcaption{padding:15px}.transport{display:flex;align-items:center;gap:20px;padding:18px 0}.transport input{flex:1;min-width:40px;accent-color:var(--accent)}.production{max-width:790px;margin-top:12px;font-size:13px}footer{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding:25px 0 35px;color:var(--muted)}#media-status{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:#262a22;padding:12px 20px;border-radius:3px;box-shadow:0 3px 25px #0008}#media-status:empty{display:none}.gate{min-height:100svh;display:grid;place-items:center;padding:30px}.gate form{max-width:450px;width:100%}.gate h1{font-size:52px;margin-top:50px}.gate label{display:block;font-size:12px;margin:38px 0 10px}.gate input{width:100%;background:#22251f;border:1px solid var(--line);color:var(--ink);padding:16px}.gate .submit{width:100%;margin-top:12px;padding:16px}.gate small{display:block;color:var(--muted);font-size:10px;letter-spacing:1px;margin-top:40px}.error{min-height:25px;color:#f3b3a2;font-size:13px;padding-top:10px}@media(max-width:700px){header{padding:20px 5vw}header>span{display:none}header a{font-size:14px}main{padding:0 5vw}.intro{padding:48px 0}.heading{gap:15px;flex-wrap:wrap}.heading>div{flex:1}.tag{display:none}section{padding-bottom:42px}.tabs{gap:6px}.tabs button{flex:1;padding:13px 7px;font-size:11px}.comparison{grid-template-columns:1fr}.detail{display:block}.detail p{margin-top:8px}.transport{gap:10px;flex-wrap:wrap}.transport button{font-size:11px;padding:12px}.transport .quiet{padding:5px}.gate h1{font-size:45px}footer{font-size:8px;letter-spacing:1px}}

.intro-copy{max-width:820px}.intro-copy p+p{margin-top:18px}.intro-copy p:first-child{font-size:19px;line-height:1.55;color:var(--ink)}.heading p{max-width:820px}

/* Client brands and a deliberately reduced, original workflow schematic. */
header{padding-top:15px;padding-bottom:15px}.brand{display:flex;align-items:center;gap:12px;flex-shrink:0}.brand .stories-name{font-weight:800}.stories-logo{width:37px;height:31px;object-fit:contain}.brand-cross{font-size:15px;color:var(--muted);margin:0 3px}.lotto-logo{width:67px;height:67px;object-fit:contain}
.lift-stage{position:relative;aspect-ratio:16/9;max-height:73vh;background:#0b0c0a}.cinema .lift-video{position:absolute;inset:0;width:100%;height:100%;max-height:none;opacity:0;pointer-events:none;z-index:0}.cinema .lift-video.is-active{opacity:1;pointer-events:auto;z-index:1}#lift-time{font-variant-numeric:tabular-nums;letter-spacing:.8px;margin-left:12px;color:var(--ink);white-space:nowrap}
@media(max-width:700px){header{gap:10px}.brand{gap:8px}.stories-logo{width:27px;height:24px}.lotto-logo{width:53px;height:53px}.brand-cross{margin:0}}

/* Film stills make the shared decisions tangible. */
.intro{padding-top:62px;padding-bottom:58px}
.intro-copy{max-width:790px}.intro-copy p:first-child{font-size:18px}.intro-copy p+p{margin-top:16px}
.workflow-stills{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:38px}
.workflow-still{position:relative;isolation:isolate;margin:0;aspect-ratio:854/480;background:#10120f;overflow:hidden}
.workflow-still img{display:block;width:100%;height:100%;object-fit:cover}
.workflow-still::after{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,transparent 38%,#080b07bf 100%);pointer-events:none}
.workflow-still figcaption{position:absolute;z-index:2;bottom:19px;left:20px;right:15px;display:flex;align-items:center;gap:12px;color:var(--ink);font-size:11px;text-transform:uppercase;letter-spacing:1.4px;line-height:1.4}
.workflow-still svg{flex:0 0 30px;width:30px;height:30px;color:var(--accent)}
.workflow-still small{display:block;margin-top:4px;font-size:11px;letter-spacing:.15px;text-transform:none;color:#e1e2d9}
@media(max-width:900px){.workflow-stills{gap:12px}.workflow-still figcaption{bottom:13px;left:12px;gap:7px;font-size:10px;letter-spacing:.7px}.workflow-still svg{flex-basis:25px;width:25px;height:25px}}
@media(max-width:700px){.intro{padding-top:42px;padding-bottom:42px}.intro-copy p:first-child{font-size:16px}.workflow-stills{grid-template-columns:1fr;margin-top:28px;gap:14px}.workflow-still figcaption{bottom:19px;left:20px;font-size:12px;gap:12px;letter-spacing:1.4px}.workflow-still svg{flex-basis:30px;width:30px;height:30px}.workflow-still small{font-size:12px}}

.gate-note{color:var(--ink);font-size:18px;line-height:1.5}

/* Illustrative approval marks, kept clear of the lock labels. */
.approval-marks{position:absolute;top:12px;right:12px;z-index:3;display:flex;align-items:center;gap:5px;pointer-events:none;filter:drop-shadow(0 1px 2px #0009)}
.workflow-still .approval-marks svg{display:block;flex:0 0 30px;width:30px;height:30px}
@media(max-width:900px) and (min-width:701px){.approval-marks{top:9px;right:9px;gap:4px}.workflow-still .approval-marks svg{flex-basis:26px;width:26px;height:26px}}

/* Four performance studies with shared transport. */
.direction-excerpt{margin:0 0 26px;max-width:960px;padding:0 0 0 17px;border-left:2px solid var(--line)}
.direction-excerpt figcaption{color:var(--accent);font-size:9px;letter-spacing:1.5px;margin-bottom:8px}
.direction-excerpt blockquote{margin:0;color:var(--muted);font-size:14px;line-height:1.65;font-style:italic}
.reaction-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.reaction-grid figure{margin:0;min-width:0;background:#0b0c0a}
.reaction-grid video{display:block;width:100%;aspect-ratio:16/9;object-fit:contain;background:#0b0c0a}
.reaction-grid figcaption{padding:12px;color:var(--muted);font-size:9px}
#reactions-play{background:var(--accent);color:#20271a;border-color:var(--accent)}
@media(max-width:600px){.reaction-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.direction-excerpt blockquote{font-size:13px}.reaction-transport input{flex-basis:30%}}