.diversion-theme{--paper:#d5d0c5;--ink:#172026;--muted:#5d686c;--panel:#b8c0bf;--accent:#a26d22;background:#d5d0c5;background-image:linear-gradient(rgba(23,32,38,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(23,32,38,.045) 1px,transparent 1px);background-size:34px 34px}
.diversion-theme .project-nav{position:absolute;color:#e6edf0;border-color:rgba(221,232,235,.26)}.diversion-theme .chapter{color:#a97224}.diversion-theme .project-section:nth-of-type(even){background:rgba(189,193,187,.42)}
.diversion-threshold{position:relative;min-height:100svh;display:flex;align-items:flex-end;overflow:hidden;background:#0c1114;color:#edf1ef}.diversion-media,.diversion-shade,.scan-line{position:absolute;inset:0;width:100%;height:100%}.diversion-media img,.diversion-media video{width:100%;height:100%;object-fit:cover}.diversion-media video{display:block}.diversion-shade{background:linear-gradient(180deg,rgba(5,10,13,.14) 22%,rgba(6,10,12,.92) 100%),linear-gradient(90deg,rgba(5,9,11,.78),transparent 70%)}.scan-line{opacity:.17;background:repeating-linear-gradient(0deg,transparent 0,transparent 4px,rgba(207,241,246,.16) 5px);mix-blend-mode:screen;pointer-events:none}
.diversion-threshold:after{content:"2056.11.07 / 18:42:16";position:absolute;right:5vw;bottom:2.2rem;color:rgba(214,230,232,.6);font:.58rem var(--mono);letter-spacing:.12em}
.diversion-title{position:relative;z-index:2;width:var(--wrap);margin:0 auto 8vh}.diversion-title .project-kicker{color:#d39a45}.diversion-title h1{position:relative;display:inline-block;margin:1rem 0 0;font:600 clamp(7rem,17.4vw,17rem)/.67 "Barlow Condensed",sans-serif;letter-spacing:-.055em;text-transform:uppercase}.diversion-title h1:before,.diversion-title h1:after{content:attr(data-title);position:absolute;inset:0;pointer-events:none;overflow:hidden}.diversion-title h1:before{height:34%;color:#a8e4ec;transform:translate(5px,-2px);clip-path:polygon(0 54%,100% 43%,100% 78%,0 88%);opacity:.68}.diversion-title h1:after{color:#d18c35;transform:translate(-4px,2px);clip-path:polygon(0 70%,100% 62%,100% 75%,0 82%);opacity:.7}.diversion-subtitle{margin:.7rem 0 2.7rem;color:#d5e4e6;font:400 clamp(.85rem,1.5vw,1.25rem) var(--mono);text-transform:uppercase;letter-spacing:.48em}.diversion-intro{display:grid;grid-template-columns:1.15fr .65fr;gap:8vw;align-items:end}.diversion-intro>p{max-width:760px;margin:0;font:300 clamp(1.4rem,2.35vw,2.5rem)/1.18 var(--serif)}.diversion-intro>div{display:flex;flex-wrap:wrap;gap:.6rem 1.1rem;color:rgba(234,240,240,.62);font:.6rem var(--mono);text-transform:uppercase;letter-spacing:.08em}
.diversion-sound{position:absolute;z-index:5;top:6.8rem;right:5vw;display:flex;align-items:center;gap:.85rem}.diversion-sound button{display:flex;align-items:center;gap:.8rem;padding:.65rem 1rem .65rem .7rem;border:1px solid #d59a43;background:rgba(10,15,18,.8);box-shadow:0 0 0 3px rgba(10,15,18,.38);color:#f4eee2;font:500 .65rem var(--mono);text-transform:uppercase;letter-spacing:.08em;cursor:pointer;transition:.2s ease}.diversion-sound button:hover,.diversion-sound button:focus-visible{background:#c7862c;color:#11171a;outline:none;box-shadow:0 0 0 3px rgba(213,154,67,.28)}.diversion-play{width:2rem;height:2rem;display:grid;place-items:center;border:1px solid currentColor;border-radius:50%}.diversion-play i{width:0;height:0;margin-left:2px;border-top:5px solid transparent;border-bottom:5px solid transparent;border-left:8px solid currentColor}.diversion-sound.playing .diversion-play i{width:8px;height:10px;margin:0;border:0;border-inline:3px solid currentColor}.diversion-sound>span{color:rgba(232,240,241,.48);font:.52rem var(--mono);text-transform:uppercase;letter-spacing:.08em}.video-note{position:absolute;z-index:3;left:5vw;bottom:2rem;margin:0;color:rgba(221,232,233,.45);font:.52rem var(--mono);text-transform:uppercase;letter-spacing:.1em}
.diversion-theme .case-index{background:rgba(213,208,197,.91);border-color:rgba(23,32,38,.28)}.diversion-theme .case-index span{color:#9f6720}
.diversion-thesis{display:grid;grid-template-columns:repeat(3,1fr);margin-top:5rem;border-block:1px solid rgba(23,32,38,.25)}.diversion-thesis article{min-height:18rem;padding:1.7rem 2rem 2rem 0;display:flex;flex-direction:column}.diversion-thesis article+article{padding-left:2rem;border-left:1px solid rgba(23,32,38,.2)}.diversion-thesis span,.world-columns span,.diversion-limits span,.diversion-two-machines article>span,.diversion-characters span{color:#9d651f;font:.62rem var(--mono);text-transform:uppercase;letter-spacing:.09em}.diversion-thesis h3{margin:auto 0 .7rem;font:500 1.7rem/1 "Barlow Condensed",sans-serif;text-transform:uppercase;letter-spacing:.02em}.diversion-thesis p{margin:0;color:var(--muted);font-size:.88rem}
.diversion-wide,.diversion-machine-image,.diversion-action,.diversion-artboard,.diversion-finale{position:relative;margin:0;overflow:hidden;background:#0b1013}.diversion-wide,.diversion-action{height:90svh}.diversion-machine-image{height:100svh}.diversion-wide img,.diversion-machine-image img,.diversion-action img,.diversion-finale img{width:100%;height:100%;object-fit:cover}.diversion-wide:after,.diversion-finale:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(6,10,12,.88),transparent 52%)}.diversion-wide figcaption,.diversion-finale>div{position:absolute;z-index:2;left:6vw;bottom:6vh;max-width:680px;color:#edf1ef}.diversion-wide span,.diversion-finale span{color:#d29a45;font:.62rem var(--mono);text-transform:uppercase;letter-spacing:.12em}.diversion-wide p{margin:.6rem 0 0;font:300 clamp(1.5rem,2.5vw,2.7rem)/1.17 var(--serif)}.diversion-machine-image figcaption,.diversion-action figcaption{position:absolute;left:1rem;bottom:1rem;padding:.65rem .8rem;background:rgba(6,10,12,.76);color:#e4ebeb;font:.57rem var(--mono);text-transform:uppercase;letter-spacing:.08em}
.diversion-world{width:var(--wrap);margin:auto;padding:clamp(7rem,11vw,12rem) 0}.diversion-world>header{display:grid;grid-template-columns:.38fr 1.05fr .7fr;gap:5vw}.diversion-world h2{margin:-.1em 0 0;font:300 clamp(3.3rem,6vw,6.6rem)/.92 var(--serif);letter-spacing:-.045em}.diversion-world header>p:last-child{margin:0;color:var(--muted);line-height:1.8}.world-columns{display:grid;grid-template-columns:repeat(2,1fr);margin-top:5rem;border:1px solid rgba(23,32,38,.25)}.world-columns article{min-height:20rem;padding:2rem;display:flex;flex-direction:column}.world-columns article:nth-child(even){border-left:1px solid rgba(23,32,38,.2)}.world-columns article:nth-child(n+3){border-top:1px solid rgba(23,32,38,.2)}.world-columns h3{margin:auto 0 .8rem;font:500 1.8rem/1 "Barlow Condensed",sans-serif;text-transform:uppercase}.world-columns p{margin:0;color:var(--muted);font-size:.92rem;line-height:1.75}
.diversion-split-record{display:grid;grid-template-columns:1.35fr .65fr;background:#172126;color:#e3eaeb}.diversion-split-record>img{width:100%;height:90svh;object-fit:cover}.diversion-split-record>div{align-self:center;padding:clamp(3rem,6vw,7rem)}.diversion-split-record span{color:#d5a04f;font:.62rem var(--mono);text-transform:uppercase;letter-spacing:.1em}.diversion-split-record h2{margin:1rem 0 2rem;font:300 clamp(3rem,5vw,5.7rem)/.92 var(--serif)}.diversion-split-record p{color:#aebabc;line-height:1.85}
.diversion-machine-flow{display:grid;grid-template-columns:repeat(5,1fr);margin-top:5rem;border:1px solid rgba(23,32,38,.28)}.diversion-machine-flow article{min-height:15rem;padding:1.5rem;display:flex;flex-direction:column}.diversion-machine-flow article+article{border-left:1px solid rgba(23,32,38,.2)}.diversion-machine-flow b{color:#9d651f;font:500 2rem "Barlow Condensed",sans-serif}.diversion-machine-flow h3{margin:auto 0 .5rem;font:500 1.5rem "Barlow Condensed",sans-serif;text-transform:uppercase}.diversion-machine-flow p{margin:0;color:var(--muted);font-size:.8rem}.diversion-limits{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:4rem;background:rgba(23,32,38,.25)}.diversion-limits article{min-height:17rem;padding:2rem;background:#c8c5bb;display:flex;flex-direction:column}.diversion-limits h3{margin:auto 0 .7rem;font:500 1.65rem/1 "Barlow Condensed",sans-serif;text-transform:uppercase}.diversion-limits p{margin:0;color:var(--muted);font-size:.86rem}
.diversion-two-machines{padding:clamp(7rem,11vw,12rem) max(5vw,calc((100vw - 1380px)/2));background:#b9b7ae;color:#182126}.diversion-two-machines>header{display:grid;grid-template-columns:.4fr 1fr;gap:5vw}.diversion-two-machines h2{margin:0;font:300 clamp(3.2rem,6vw,6.5rem)/.92 var(--serif)}.diversion-two-machines>div{display:grid;grid-template-columns:1fr 1fr;margin-top:5rem;border-block:1px solid rgba(23,32,38,.28)}.diversion-two-machines article{min-height:22rem;padding:2rem 3rem 2rem 0;display:flex;flex-direction:column}.diversion-two-machines article+article{padding-left:3rem;border-left:1px solid rgba(23,32,38,.23)}.diversion-two-machines h3{margin:auto 0 .8rem;font:500 2rem "Barlow Condensed",sans-serif;text-transform:uppercase}.diversion-two-machines article p{margin:0;color:#526064;line-height:1.8}
.diversion-gameplay{display:grid;grid-template-columns:1.3fr .7fr;background:#10171a;color:#e8eeee}.diversion-gameplay>img{width:100%;height:100%;min-height:100svh;object-fit:cover}.gameplay-copy{align-self:center;padding:clamp(3rem,6vw,7rem)}.gameplay-copy h2{margin:.7rem 0 1.5rem;font:500 clamp(3.7rem,7vw,7.5rem)/.82 "Barlow Condensed",sans-serif;text-transform:uppercase}.gameplay-copy>p{color:#a7b3b5;line-height:1.8}.gameplay-copy dl{margin:3rem 0 0}.gameplay-copy dl div{padding:1rem 0;border-top:1px solid rgba(208,224,227,.2)}.gameplay-copy dt{color:#d39a45;font:500 .64rem var(--mono);text-transform:uppercase;letter-spacing:.08em}.gameplay-copy dd{margin:.35rem 0 0;color:#9fabad;font-size:.84rem;line-height:1.65}
.diversion-blacklist{display:grid;grid-template-columns:repeat(4,1fr);margin-top:5rem;border-block:1px solid rgba(23,32,38,.25)}.diversion-blacklist article{min-height:19rem;padding:1.7rem 2rem 2rem 0;display:flex;flex-direction:column}.diversion-blacklist article+article{padding-left:2rem;border-left:1px solid rgba(23,32,38,.2)}.diversion-blacklist b{color:#9d651f;font:500 2.2rem "Barlow Condensed",sans-serif}.diversion-blacklist h3{margin:auto 0 .6rem;font:500 1.5rem/1 "Barlow Condensed",sans-serif;text-transform:uppercase}.diversion-blacklist p{margin:0;color:var(--muted);font-size:.84rem}
.diversion-investigation{display:grid;grid-template-columns:1.3fr .7fr;background:#121719;color:#e9eeed}.diversion-investigation figure{height:100svh;margin:0}.diversion-investigation figure img{height:100%;object-fit:cover}.diversion-investigation figure figcaption{position:absolute;left:1rem;bottom:1rem;padding:.5rem .7rem;background:rgba(8,10,11,.72);font:.58rem var(--mono);text-transform:uppercase}.diversion-investigation>div{align-self:center;padding:clamp(3rem,5vw,6rem)}.diversion-investigation h2{margin:.8rem 0 2rem;font:300 clamp(3rem,5vw,5.5rem)/.92 var(--serif)}.diversion-investigation ol{margin:0;padding:0;list-style:none}.diversion-investigation li{display:grid;grid-template-columns:.16fr 1fr;gap:1rem;padding:1rem 0;border-top:1px solid rgba(220,232,233,.18)}.diversion-investigation li b{color:#d49c47;font:500 1rem "Barlow Condensed",sans-serif}.diversion-investigation li span{color:#a8b3b4;font-size:.8rem}.diversion-investigation li strong{display:block;margin-bottom:.2rem;color:#e6ecec;font:500 1.2rem "Barlow Condensed",sans-serif;text-transform:uppercase}
.diversion-earlier{position:relative;min-height:95svh;display:flex;align-items:flex-end;overflow:hidden;color:#edf1f0}.diversion-earlier>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.diversion-earlier:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,10,11,.95),rgba(7,10,11,.18) 72%),linear-gradient(0deg,rgba(7,10,11,.72),transparent 55%)}.diversion-earlier>div{position:relative;z-index:2;width:min(90vw,720px);margin:0 0 8vh 6vw}.diversion-earlier h2{margin:.7rem 0 1.5rem;font:500 clamp(4rem,8vw,9rem)/.8 "Barlow Condensed",sans-serif;text-transform:uppercase}.diversion-earlier p{max-width:620px;color:#bac3c3;line-height:1.8}.diversion-earlier blockquote{margin:2rem 0 0;padding:1.2rem 0 0;border-top:1px solid rgba(211,154,69,.5);font:300 clamp(1.3rem,2vw,2rem)/1.35 var(--serif)}
.diversion-characters{display:grid;grid-template-columns:repeat(3,1fr);margin-top:5rem;border-block:1px solid rgba(23,32,38,.25)}.diversion-characters article{min-height:23rem;padding:2rem 2rem 2rem 0;display:flex;flex-direction:column}.diversion-characters article+article{padding-left:2rem;border-left:1px solid rgba(23,32,38,.2)}.diversion-characters h3{margin:auto 0 .8rem;font:500 2rem "Barlow Condensed",sans-serif;text-transform:uppercase}.diversion-characters p{margin:0;color:var(--muted);font-size:.92rem;line-height:1.75}
.diversion-finale{height:100svh}.diversion-finale:after{background:linear-gradient(90deg,rgba(6,9,11,.88),transparent 72%),linear-gradient(0deg,rgba(6,9,11,.78),transparent 60%)}.diversion-finale strong{display:block;margin:.8rem 0 1.2rem;font:500 clamp(4.5rem,9vw,10rem)/.78 "Barlow Condensed",sans-serif;text-transform:uppercase}.diversion-finale p{max-width:600px;color:#b9c3c3;line-height:1.75}.diversion-artboard{width:min(96vw,1600px);margin:7rem auto;border:1px solid rgba(23,32,38,.3);background:#101619}.diversion-artboard img{width:100%}.diversion-artboard figcaption{padding:1rem;color:#aab4b4;font:.58rem var(--mono);text-transform:uppercase;letter-spacing:.08em}.diversion-credit{width:var(--wrap);margin:0 auto 5rem;color:var(--muted);font-size:.72rem}
@media(max-width:900px){.diversion-title{width:90vw;margin-bottom:7rem}.diversion-title h1{font-size:21vw}.diversion-subtitle{letter-spacing:.25em}.diversion-intro,.diversion-world>header,.diversion-split-record,.diversion-gameplay,.diversion-investigation{grid-template-columns:1fr}.diversion-sound{top:auto;right:auto;left:5vw;bottom:1.2rem}.video-note{display:none}.diversion-split-record>img,.diversion-gameplay>img,.diversion-investigation figure{height:62svh;min-height:0}.diversion-machine-flow{grid-template-columns:1fr}.diversion-machine-flow article{min-height:9rem}.diversion-machine-flow article+article{border-left:0;border-top:1px solid rgba(23,32,38,.2)}.diversion-two-machines>header{grid-template-columns:1fr}.diversion-two-machines>div{grid-template-columns:1fr}.diversion-two-machines article,.diversion-two-machines article+article{min-height:0;padding:2rem 0;border-left:0;border-top:1px solid rgba(23,32,38,.2)}.diversion-two-machines h3{margin-top:3rem}.diversion-blacklist{grid-template-columns:repeat(2,1fr)}.diversion-blacklist article:nth-child(3){border-left:0}.diversion-blacklist article:nth-child(n+3){border-top:1px solid rgba(23,32,38,.2)}}
@media(max-width:620px){.diversion-threshold:after{display:none}.diversion-sound>span{display:none}.diversion-title h1{font-size:22vw}.diversion-intro{grid-template-columns:1fr;gap:1.5rem}.diversion-thesis,.world-columns,.diversion-limits,.diversion-blacklist,.diversion-characters{grid-template-columns:1fr}.diversion-thesis article,.diversion-thesis article+article,.world-columns article,.world-columns article:nth-child(even),.world-columns article:nth-child(n+3),.diversion-limits article,.diversion-blacklist article,.diversion-blacklist article+article,.diversion-blacklist article:nth-child(3),.diversion-characters article,.diversion-characters article+article{min-height:0;padding:1.6rem 0;border-left:0;border-top:1px solid rgba(23,32,38,.2)}.diversion-thesis h3,.world-columns h3,.diversion-limits h3,.diversion-blacklist h3,.diversion-characters h3{margin-top:2.2rem}.diversion-wide,.diversion-machine-image,.diversion-action{height:65svh}.diversion-earlier>div{margin-left:5vw}.diversion-finale{height:78svh}}
@media(prefers-reduced-motion:reduce){.scan-line{display:none}.diversion-media video{display:none}.diversion-media{background:url("assets/diversion/riverton-2056.png") center/cover no-repeat}}
.diversion-investigation figure{position:relative}
.diversion-voice-lines{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:4rem}.diversion-voice-lines blockquote{margin:0;padding:2rem;border:1px solid rgba(75,104,117,.3);background:#162027;color:#d8e4e6;font:300 clamp(1.25rem,1.8vw,1.8rem)/1.45 var(--serif)}@media(max-width:760px){.diversion-voice-lines{grid-template-columns:1fr}}