.v1{color:#18201d;background:#f6f5ef}.v1-intro{border-color:#c8ccc2}.v1-gallery{gap:clamp(30px,7vw,120px);max-width:1120px;margin:auto;padding:clamp(24px,5vw,88px) clamp(16px,4vw,56px);display:grid}.v1-gallery .media-frame{aspect-ratio:3/2;background:#e2e4db}.v1-gallery .media-item:nth-child(2n){justify-self:end}.v1-hero{width:100%}.v1-hero .media-frame{aspect-ratio:16/9}.v1-portrait{width:min(52%,28rem);margin-right:10%}.v1-portrait .media-frame{aspect-ratio:3/4}.v1-square{width:min(43%,24rem);margin-left:16%}.v1-square .media-frame{aspect-ratio:1}.v1-pair{width:68%;margin-left:auto}.v1-pair .media-frame{aspect-ratio:4/3}.v1-video{width:100%}.v1-video .media-frame{aspect-ratio:16/8}.v1-narrow{width:38%;margin-left:8%}.v1-edge{width:85%;margin-left:auto}.v1-split{width:66%}.v1-stagger{width:47%;margin-left:30%}.v1-triptych{width:100%}.v1-inset{width:43%;margin-left:auto;margin-right:13%}.v1-band{width:100%}.v1-band .media-frame{aspect-ratio:16/6}.v1-serial{width:72%;margin-left:5%}.v1-overlap{width:61%;margin-left:auto}.v1-finale{width:100%}.v1-finale .media-frame{aspect-ratio:16/9}@media (width<=699px){.v1-gallery{gap:1.25rem;padding:1rem 16px 2.5rem}.v1-gallery .media-item,.v1-portrait,.v1-square,.v1-pair,.v1-video,.v1-narrow,.v1-edge,.v1-split,.v1-stagger,.v1-triptych,.v1-inset,.v1-band,.v1-serial,.v1-overlap,.v1-finale{width:100%;margin:0}.v1-gallery .media-frame,.v1-hero .media-frame,.v1-video .media-frame,.v1-band .media-frame,.v1-finale .media-frame{aspect-ratio:4/3}.v1-gallery .media-frame img,.v1-gallery .media-frame video{object-fit:contain}.v1-portrait .media-frame{aspect-ratio:4/5}}.v2{color:#f0f0e6;background:#11130f;min-height:100vh}.v2 .project-intro{border-color:#30342b}.v2 .intro-label,.v2 .demo-note,.v2 .intro-copy{color:#b9c0b3}.v2-tools{color:#c5c7bd;border-bottom:1px solid #30342b;justify-content:space-between;align-items:center;gap:1rem;padding:1rem clamp(16px,4vw,56px);font-size:.8rem;display:flex}.v2-tools p{margin:0}.v2-tools button{color:#f0f0e6;cursor:pointer;background:0 0;border:1px solid #c5c7bd;border-radius:50%;width:2.4rem;height:2.4rem;margin-left:.4rem}.v2-progress{background:#30342b;height:2px}.v2-progress span{background:#d9ff4e;height:100%;display:block}.v2-viewport{cursor:grab;outline-offset:-5px;padding:clamp(16px,3vw,36px) clamp(16px,4vw,56px);overflow:auto hidden}.v2-viewport:focus{outline:2px solid #d9ff4e}.v2-bento{grid-template-rows:repeat(2,clamp(11rem,20vw,22rem));grid-template-columns:repeat(15,clamp(10rem,16vw,18rem));gap:10px;width:max-content;display:grid}.v2-bento.is-dragging{cursor:grabbing}.v2 .media-frame{background:#090a08}.v2 .media-item figcaption span{color:#aeb6a8}.tile-hero{grid-area:span 2/span 2}.tile-tall{grid-row:span 2}.tile-low,.tile-square{grid-row:span 1}.tile-wide{grid-column:span 2}.tile-contained .media-frame img{object-fit:contain;padding:10%}.v2 .credits,.v2 .concept-footer{border-color:#30342b}.v2 .credits h2,.v2 .concept-footer strong{color:#f0f0e6}.v2 .credits p,.v2 .credits li{color:#b9c0b3}@media (width<=759px){.v2-tools{align-items:flex-start}.v2-tools div,.v2-progress{display:none}.v2-viewport{cursor:auto;padding:1rem 16px 2.5rem;overflow:visible}.v2-bento{flex-direction:column;gap:.75rem;width:auto;display:flex}.v2-bento .media-item{width:100%}.v2-bento .media-frame{aspect-ratio:4/3}.v2-bento .tile-tall .media-frame{aspect-ratio:4/5}.v2-bento img,.v2-bento video{object-fit:contain}}.v3{color:#16211e;background:#f3f0e9}.v3-intro{border-color:#b9beb7}.v3-proof{padding:1rem clamp(16px,4vw,54px) clamp(2.5rem,5vw,5rem)}.v3-head{color:#657069;text-transform:uppercase;letter-spacing:.11em;border-bottom:1px solid #b9beb7;justify-content:space-between;align-items:baseline;gap:1rem;padding-bottom:.65rem;font-size:.68rem;display:flex}.v3-head p{margin:0}.v3-head span{text-transform:none;letter-spacing:0;font-size:.75rem}.v3-grid{grid-template-columns:repeat(12,minmax(0,1fr));grid-auto-flow:dense;gap:clamp(4px,.55vw,9px);padding-top:clamp(8px,1vw,14px);display:grid}.v3 .media-item{--field:#c8ddff;gap:3px;display:grid}.v3 .media-item:nth-child(3n+2){--field:#e6ff5d}.v3 .media-item:nth-child(3n){--field:#ffd0c9}.v3 .media-frame{background:var(--field);aspect-ratio:4/3}.v3 .media-item.ink .media-frame{background:#16211e}.v3 .media-item.s8{grid-column:span 8}.v3 .media-item.s6{grid-column:span 6}.v3 .media-item.s5{grid-column:span 5}.v3 .media-item.s4{grid-column:span 4}.v3 .media-item.s3{grid-column:span 3}.v3 .media-item.tall .media-frame{aspect-ratio:3/5}.v3 .media-item.wide .media-frame{aspect-ratio:2}.v3 .media-item.low .media-frame{aspect-ratio:16/7}.v3 .media-item.square .media-frame{aspect-ratio:1}.v3 .media-item.tall img,.v3 .media-item.square img{object-fit:contain}.v3 .media-item figcaption{padding:0 2px}.v3 .media-item figcaption strong{font-size:.71rem}.v3 .media-item figcaption span{font-size:.61rem}@media (width<=699px){.v3-proof{padding:1rem 16px 2.5rem}.v3-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.v3 .media-item.s8,.v3 .media-item.s6,.v3 .media-item.s5,.v3 .media-item.s4,.v3 .media-item.s3{grid-column:span 1}.v3 .media-item:first-child,.v3 .media-item:nth-child(2),.v3 .media-item:nth-child(3),.v3 .media-item:nth-child(6),.v3 .media-item:nth-child(7),.v3 .media-item:nth-child(11),.v3 .media-item:nth-child(12),.v3 .media-item:nth-child(14){grid-column:span 2}.v3 .media-frame,.v3 .media-item.tall .media-frame,.v3 .media-item.wide .media-frame,.v3 .media-item.low .media-frame,.v3 .media-item.square .media-frame{aspect-ratio:1}.v3 .media-item:first-child .media-frame,.v3 .media-item:nth-child(3) .media-frame,.v3 .media-item:nth-child(6) .media-frame,.v3 .media-item:nth-child(7) .media-frame,.v3 .media-item:nth-child(11) .media-frame,.v3 .media-item:nth-child(14) .media-frame{aspect-ratio:4/3}.v3 .media-item:nth-child(2) .media-frame,.v3 .media-item:nth-child(12) .media-frame{aspect-ratio:4/5}.v3 .media-item figcaption span{display:none}}:root{color:#17221f;background:#f3f0e9;font-family:Arial,Helvetica,sans-serif}*{box-sizing:border-box}body{margin:0}button,select{font:inherit}.app-header{z-index:20;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#f3f0e9f2;border-bottom:1px solid #b6bcb3;justify-content:space-between;align-items:center;gap:1rem;min-height:58px;padding:.65rem clamp(16px,4vw,56px);display:flex;position:fixed;top:0;left:0;right:0}.app-brand{letter-spacing:.03em;color:#17221f;font-size:.82rem;font-weight:700;text-decoration:none}.variation-picker{color:#657069;text-transform:uppercase;letter-spacing:.08em;align-items:center;gap:.5rem;font-size:.68rem;display:flex}.variation-picker select{color:#17221f;letter-spacing:0;text-transform:none;background:#f3f0e9;border:1px solid #7b857d;border-radius:0;max-width:min(16rem,60vw);padding:.4rem .5rem;font-size:.76rem}.app-page{padding-top:58px}.skip-link{z-index:30;color:#fff;background:#17221f;padding:.7rem 1rem;position:absolute;top:-4rem;left:1rem}.skip-link:focus{top:70px}.project-intro{border-bottom:1px solid;padding:clamp(28px,5vw,72px) clamp(16px,4vw,56px) 1.5rem}.intro-label,.demo-note{color:#657069;text-transform:uppercase;letter-spacing:.11em;margin:0;font-size:.7rem}.project-intro>div{max-width:74rem;margin-top:clamp(40px,7vw,105px)}.project-intro h1{letter-spacing:-.075em;max-width:10ch;margin:0;font-size:clamp(3rem,10vw,8rem);font-weight:500;line-height:.83}.intro-copy{max-width:38rem;margin:1rem 0 .35rem;font-size:clamp(1rem,1.6vw,1.22rem);line-height:1.45}.media-item{min-width:0;margin:0}.media-frame{background:#d2d9d2;place-items:center;height:100%;display:grid;overflow:hidden}.media-frame img,.media-frame video{object-fit:cover;width:100%;height:100%;display:block}.media-item figcaption{justify-content:space-between;gap:.5rem;padding:.35rem 0;font-size:.76rem;display:flex}.media-item figcaption strong{font-weight:400}.media-item figcaption span{color:#657069;text-transform:uppercase;letter-spacing:.08em;font-size:.65rem}.credits{border-top:1px solid #b6bcb3;grid-template-columns:minmax(12rem,.55fr) minmax(0,1fr);gap:1rem;margin:0 clamp(16px,4vw,56px);padding:1rem 0 3rem;display:grid}.credits h2{margin:0;font-size:1rem}.credits p,.credits li{color:#657069;font-size:.82rem}.credits p{margin:0}.credits ul{gap:.4rem;margin:0;padding-left:1.1rem;display:grid}.concept-footer{color:#657069;border-top:1px solid #b6bcb3;justify-content:space-between;padding:1rem clamp(16px,4vw,56px);font-size:.76rem;display:flex}.concept-footer strong{color:#17221f;font-weight:400}@media (width<=699px){.app-header{min-height:54px}.app-page{padding-top:54px}.project-intro h1{max-width:100%}.credits{grid-template-columns:1fr}.variation-picker span{display:none}.skip-link:focus{top:62px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}