:root {
  --ink: #171217;
  --black: #0c0d12;
  --paper: #ede5d9;
  --paper-dark: #d9cbbd;
  --bone: #fff0dd;
  --red: #cc1835;
  --blue: #0069aa;
  --pink: #f00a9d;
  --lilac: #d6b0db;
  --display: 'Cormorant Garamond', Georgia, serif;
  --sans: 'Space Grotesk', Arial, sans-serif;
  --mono: 'DM Mono', 'Courier New', monospace;
  --heavy: 'Archivo Black', Impact, sans-serif;
}
*,*::before,*::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 72px; }
body { margin: 0; background: var(--ink); color: var(--bone); font-family: var(--sans); overflow-x: hidden; -webkit-font-smoothing: antialiased; }
button,input { font: inherit; }
button { cursor: pointer; }
a { color: inherit; text-decoration: none; }
button:focus-visible,a:focus-visible { outline: 3px solid #fe457b; outline-offset: 5px; }
img { max-width: 100%; display: block; }
::selection { color: #ffe4d5; background: #cb1835; }
.skip-link { z-index: 10000; position: absolute; top: -80px; left: 18px; padding: 12px; background: #fff; color: #111; }
.skip-link:focus { top: 18px; }
.screen-grain { position: fixed; inset: 0; z-index: 90; opacity: .23; pointer-events: none; mix-blend-mode: screen; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.94' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.28' filter='url(%23n)'/%3E%3C/svg%3E"); background-size: 170px; }
.projection-global { position: fixed; inset: 0; z-index: -1; pointer-events: none; isolation: isolate; overflow: hidden; opacity: .65; }
.projection-global__image { position:absolute; inset:calc(-12% - 80px); background: url('assets/16852.webp') center / cover no-repeat; filter: saturate(1.3) contrast(1.2) blur(22px); opacity: .35; animation: ghostDrift 25s ease-in-out infinite alternate; }
.projection-global video { position:absolute; inset: 0; width:100%; height:100%; object-fit:cover; opacity: .4; mix-blend-mode: screen; filter: blur(9px) saturate(.8); display:none; }
.projection-global__haze { position:absolute; inset:0; background:linear-gradient(160deg,rgba(119,60,133,.03),rgba(6,20,44,.28),rgba(72,18,27,.3)); }
body.motion-off .projection-global,body.motion-off .projection-room { opacity: 0 !important; }
body.motion-off *,body.motion-off *::before,body.motion-off *::after { animation-play-state: paused !important; transition-duration: 0.01ms !important; }

.topbar { position: fixed; top: 0; left:0; right:0; height: 65px; z-index: 100; display:flex; align-items:center; gap:18px; padding: 0 clamp(20px,4vw,68px); background: rgba(12,11,16,.85); backdrop-filter: blur(16px) saturate(.7); border-bottom: 1px solid rgba(251,225,215,.2); transition: background .3s; }
.brand { font-family:var(--display); font-size: 36px; font-style: italic; font-weight: 700; letter-spacing: -5px; line-height:1; white-space: nowrap; }
.brand span { color:#eb2447; font-family:var(--sans); font-style:normal; display:inline-block; margin:0 7px 0 5px; font-size:22px; transform:rotate(-20deg); vertical-align:middle; letter-spacing:0; }
.topbar-annotation { font-family:var(--mono); font-size:8px; text-transform:uppercase; letter-spacing:.08em; color:#dcbcc4; opacity:.55; margin-right:auto; }
.topnav { display:flex; gap:clamp(12px,2.5vw,38px); align-items:center; margin-left:auto; }
.topnav a { position:relative; font: 11px var(--mono); letter-spacing:.01em; text-transform: lowercase; white-space:nowrap; }
.topnav a::after { content:''; position:absolute; left:0; bottom:-6px; width:0; height:2px; background:var(--red); transition:width .2s; }
.topnav a:hover::after { width:100%; }
.projection-toggle { display:flex; align-items:center; gap:9px; margin-left:18px; padding:8px 0 8px 15px; background:transparent; color:#f1ded4; border:0; border-left:1px solid #6a5d65; font:9px var(--mono); text-transform:uppercase; white-space: nowrap; }
.projector-light { width:7px; height:7px; border-radius:50%; background:#ec2b4c; box-shadow:0 0 13px #fe1d5f; animation:pulse 2.8s ease-in-out infinite; }
.projection-toggle[aria-pressed='false'] .projector-light { background:#716973; box-shadow:none; animation:none; }

.hero { height:min(900px,100svh); min-height:720px; background:#1b121d; position:relative; isolation:isolate; overflow:hidden; }
.hero-bg { position:absolute; inset:0 0 0 0; overflow:hidden; z-index:-5; }
.hero-bg img,.hero-bg video { position:absolute;width:100%;height:100%;inset:0;object-fit:cover;object-position:50% 53%;filter:brightness(.7) saturate(.78) contrast(1.09); }
.hero-bg img { transform:scale(1.05); animation:heroBreath 23s alternate ease-in-out infinite;transition:opacity .7s ease; }
.hero-bg video { opacity:0;transition:opacity .7s ease; }
.hero-bg.is-video-playing img {opacity:0;}
.hero-bg.is-video-playing video {opacity:1;}
body.motion-off .hero-bg video {opacity:0;}
@media(prefers-reduced-motion:reduce){.hero-bg video{display:none;}}
.hero-violet {position:absolute; z-index:-4; inset:0; background:linear-gradient(92deg,rgba(11,9,16,.95) 0%,rgba(12,9,15,.82) 33%,rgba(66,21,71,.25) 64%,rgba(61,18,44,.2) 100%),linear-gradient(180deg,rgba(15,11,21,.25),transparent 45%,rgba(12,10,20,.9) 100%); mix-blend-mode:multiply; }
.hero-paper-shadow {position:absolute;z-index:-3;inset:0;pointer-events:none;background:radial-gradient(ellipse at 74% 23%,rgba(246,161,240,.31),transparent 35%),radial-gradient(ellipse at 10% 71%,rgba(192,56,103,.15),transparent 40%); }
.hero::after { content:''; position:absolute; inset:0; pointer-events:none; z-index:10; box-shadow:inset 0 0 95px 28px rgba(18,12,22,.7); }
.hero-topline {position:absolute;top:96px;left:clamp(22px,4vw,70px);right:clamp(22px,4vw,70px);display:flex;justify-content:space-between; font:10px var(--mono);letter-spacing:.13em;color:#ffeddb;z-index:7;opacity:.92;}
.hero-titleblock { position:absolute; z-index:5; left:clamp(24px,5.5vw,94px); top:49%; width:min(75vw,1180px); transform:translateY(-50%); }
.eyebrow { font:10px var(--mono); text-transform:uppercase; letter-spacing:.24em; }
.eyebrow--hero { color:#faadc4; font-size:clamp(9px,1vw,12px); display:block; margin-left:1.5%; margin-bottom:10px; }
.hero h1 { font: 700 clamp(140px,20.8vw,390px)/.62 var(--display); letter-spacing:-.09em; margin:0; text-transform:lowercase; color:#f6eadb; text-shadow:0 6px 20px rgba(23,7,15,.28); white-space:nowrap; }
.hero h1 em {display:block;font-weight:600; margin:1.5vw 0 0 16%; font-style:italic; color:#f8d3eb; letter-spacing:-.07em; }
.hero-asterisk {display:block;position:absolute;left:clamp(0px,8vw,140px);top:62%;font:normal clamp(40px,5vw,95px) var(--sans);color:#e11e4b;transform:rotate(23deg);}
.hero-title-foot { margin:50px 0 0 clamp(10px,3.4vw,62px); display:flex; align-items:center; gap:65px; }
.handwritten { font-family:var(--display); font-style:italic; font-weight:600; }
.hero-caption { font-size:clamp(22px,2.7vw,39px); transform:rotate(-6deg); color:#ffd5e5; }
.jump-link { display:inline-flex;align-items:center;gap:36px;padding:13px 8px;border-bottom:1px solid #f2e5d2;font:11px var(--mono);letter-spacing:.08em;text-transform:uppercase;white-space:nowrap; }
.jump-link span {color:#ff628f;font-size:22px;}
.hero-eye {position:absolute;z-index:6; right:clamp(12px,9vw,160px); top:19%; width:clamp(160px,25.5vw,330px); padding:6px 6px 23px; background:#e4c9d6; transform:rotate(9deg); box-shadow:10px 15px 35px rgba(0,0,0,.42); }
.hero-eye img {width:100%;aspect-ratio:1;object-fit:cover; filter:saturate(.95) contrast(1.1);}
.tiny-tape { position:absolute;left:41%;top:-15px; width:72px;height:32px;transform:rotate(-16deg);background:rgba(229,226,197,.69); clip-path:polygon(1% 0,99% 5%,100% 96%,5% 100%); }
.tiny-photo-caption {color:#4c2445;display:block; padding-top:8px;font:8px var(--mono);letter-spacing:.08em;text-align:center;}
.hero-night {position:absolute;z-index:4; width:clamp(180px,23vw,360px);bottom:10%;right:2.5%; transform:rotate(-9deg); padding:9px;background:#101a27; box-shadow:0 15px 35px rgba(0,0,0,.5); }
.hero-night img { height:160px; width:100%; object-fit:cover;}
.photo-mark {position:absolute;bottom:16px;left:16px;font:9px var(--mono);letter-spacing:.15em; color:white;}
.hero-scribble {position:absolute;z-index:7;bottom:14%;left:42%;font:italic 21px/.85 var(--display);color:#eecbdd;transform:rotate(-11deg);text-align:center;}
.hero-paint-x {position:absolute;z-index:8;top:18%;right:4%; width:220px;height:220px; transform:rotate(-10deg); pointer-events:none; opacity:.9; }
.hero-stars {position:absolute;z-index:8;bottom:18%;left:5%;width:clamp(80px,13vw,170px);color:#d6b4e9;transform:rotate(-11deg);opacity:.75;}
.hero-bottomline {position:absolute;z-index:9;bottom:25px;left:clamp(22px,4vw,70px);right:clamp(22px,4vw,70px);display:flex;justify-content:space-between;gap:10px;font:9px var(--mono);letter-spacing:.15em;color:#e9cad7;}

.marquee {height:55px;background:var(--red);color:var(--ink);overflow:hidden;display:flex;align-items:center;transform:rotate(-1.1deg) scale(1.01);position:relative;z-index:20;border-block:2px solid #171217;}
.marquee-track {flex-shrink:0;white-space:nowrap;min-width:max-content;font:16px var(--heavy);letter-spacing:.045em;animation:marqueeMove 26s linear infinite;}

.journal { position:relative; padding:clamp(90px,10vw,150px) 0 0; color:#181519; background:var(--paper); overflow:hidden; isolation:isolate; }
.journal::before,.art-section::before {content:'';inset:0;position:absolute;z-index:-1;opacity:.23;pointer-events:none;background: repeating-linear-gradient(3deg, transparent 0 3px,rgba(74,49,63,.03) 3px 4px),radial-gradient(ellipse at 16% 40%,#f3cdbb 0,transparent 47%),radial-gradient(ellipse at 92% 84%,#b4b1b8 0,transparent 38%);}
.journal-watermark {font:normal min(75vw,1100px)/1 var(--sans);color:#d0bcb6;opacity:.12;position:absolute;top:7%;left:-8%;transform:rotate(11deg);z-index:-1;pointer-events:none;}
.journal-head {position:relative;margin:0 auto 45px;width:min(1360px,90%);}
.section-index {display:flex;align-items:center;gap:12px;font:11px var(--mono);letter-spacing:.13em;color:#8b1d3d;text-transform:uppercase;}
.section-index--light {color:#e5a9c9;}
.scribble-dot {display:inline-block;width:20px;height:20px;background:var(--red);clip-path:polygon(50% 0,60% 37%,100% 19%,69% 54%,94% 82%,55% 66%,30% 100%,38% 59%,2% 52%,41% 44%);}
.journal h2,.art-section h2,.sound-section h2,.projection-section h2,.closing h2 {font-family:var(--display);font-weight:700;letter-spacing:-.078em;margin:0;line-height:.85;}
.journal h2 {font-size:clamp(110px,15vw,255px);margin-top:13px;}
.journal h2 em {color:#c21e39;font-weight:600;}
.journal-head p {max-width:410px; font:16px/1.65 var(--sans);margin:25px 0 0;}
.journal-head-side {position:absolute;right:9%;top:47%;color:#bd2850;font-size:clamp(21px,2.5vw,35px);line-height:.84;transform:rotate(7deg);}
.filter-strip {display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:6px 9px;margin:0 auto 20px;padding:12px 20px;max-width:1140px;border-top:1px dashed rgba(41,24,29,.45);border-bottom:1px dashed rgba(41,24,29,.45);}
.filter-label {font:9px var(--mono);letter-spacing:.05em;margin-right:15px;white-space:nowrap;color:#6d5660;}
.filter {background:transparent;border:1px solid transparent;color:#554950;padding:8px 13px;border-radius:0;font:11px var(--mono);transition:color .15s,background .15s;}
.filter:hover {border-color:#aa778a;}
.filter.is-selected {background:#251720;color:#fff3e3;transform:rotate(-1deg);}
.filter-count {font-size:9px;opacity:.6;}
.feed {position:relative;margin:0 auto;max-width:1440px;width:94%;min-height:790px;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(8px,1.2vw,18px);grid-auto-flow:row dense;align-items:start;padding:55px 10px 75px;}
.entry {position:relative;min-width:0;transform:rotate(var(--tilt,0deg));will-change:transform;transition:transform .35s cubic-bezier(.2,.8,.1,1),opacity .3s;}
.entry:hover {z-index:5;transform:rotate(0deg) translateY(-8px) scale(1.016);}
.entry[hidden] {display:none!important;}
.entry-photo {padding:10px;background:#e9dfd0;box-shadow:3px 9px 18px rgba(28,16,19,.21);width:100%; border:0;text-align:left;color:var(--ink);cursor:zoom-in;}
.entry-photo img {width:100%;height:100%;object-fit:cover; filter:contrast(1.02);display:block;}
.entry-photo-frame {aspect-ratio:var(--img-aspect,3/4);overflow:hidden;background:#bbb;}
.entry-photo-caption {display:flex;justify-content:space-between;gap:10px;padding:11px 3px 2px;font:9px var(--mono);letter-spacing:.08em;text-transform:uppercase;}
.entry-photo-caption span:last-child {opacity:.6;}
.entry-name {font:italic 500 clamp(21px,2vw,35px) var(--display);padding:8px 0 0 12px;line-height:1;}
.entry-label-outside {display:block;font:9px var(--mono);letter-spacing:.08em;margin:12px 3px 0;}
.entry--tall {grid-column:1/span 5;grid-row:span 3;margin-top:5px;}
.entry--tall .entry-photo-frame {--img-aspect:4/5;}
.entry--square {grid-column:8/span 4;grid-row:span 2;margin-top:45px;}
.entry--square .entry-photo-frame {--img-aspect:1/1;}
.entry--note {grid-column:6/span 4;grid-row:span 2;margin-top:-18px;z-index:2;}
.entry--note .note-paper {min-height:300px;background:#f0bfd2;color:#351725;padding:45px clamp(25px,3vw,45px) 38px;box-shadow:6px 11px 21px rgba(28,16,19,.24);position:relative;overflow:hidden;clip-path:polygon(1% 0,98% 2%,100% 97%,0 100%);}
.entry--note .note-paper::before {content:'';position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 28px,rgba(147,53,72,.16) 29px,transparent 30px);}
.entry--note .note-paper::after {content:'';width:160px;height:180px;background:url('assets/drawings/star-06.svg') center/contain no-repeat;position:absolute;right:-20px;bottom:-65px;color:#bd5478;opacity:.25;transform:rotate(15deg);}
.note-paper .entry-kicker {position:relative;z-index:1;font:9px var(--mono);letter-spacing:.12em;}
.note-paper h3 {position:relative;z-index:1;margin:22px 0;font:italic 600 clamp(45px,5vw,79px)/.9 var(--display);letter-spacing:-.035em;}
.note-paper p {position:relative;z-index:1;max-width:280px;font:12px/1.5 var(--mono);margin-top:30px;}
.entry--portrait {grid-column:2/span 4;grid-row:span 3;margin-top:50px;}
.entry--portrait .entry-photo-frame {--img-aspect:4/5;}
.entry--sound {grid-column:7/span 5;grid-row:span 2;margin-top:15px;z-index:3;}
.entry--sound .record-paper {padding:35px;background:#1e2c42;box-shadow:9px 12px 22px rgba(28,16,19,.3);color:#ffe7ed;min-height:315px;position:relative;overflow:hidden;}
.entry--sound .record-paper::before {content:'';position:absolute;width:300px;height:300px;right:-128px;top:-105px;border:40px solid rgba(243,68,117,.12);border-radius:50%;box-shadow:0 0 0 28px rgba(234,69,117,.08),0 0 0 65px rgba(245,99,146,.07);}
.entry--sound .record-kicker {font:10px var(--mono);color:#f2a9c3;letter-spacing:.1em;}
.entry--sound h3 {font:italic 600 clamp(62px,7vw,113px)/.9 var(--display);letter-spacing:-.04em;margin:30px 0 12px;}
.entry--sound p {font:12px var(--mono);line-height:1.6;margin-bottom:18px;}
.entry--sound a {display:inline-flex;align-items:center;gap:15px;font:10px var(--mono);letter-spacing:.08em;padding-bottom:7px;border-bottom:1px solid #e8a3be;}
.entry--wide {grid-column:1/span 7;grid-row:span 2; margin-top:25px;}
.entry--wide .entry-photo-frame {--img-aspect:16/9;}
.entry--wide .entry-photo {background:#081c34;color:#f9dbd7;}
.entry--wide .entry-name {color:#273043;}
.entry--motion {grid-column:8/span 4;grid-row:span 2;margin-top:-20px;}
.entry--motion .motion-paper {position:relative;min-height:300px;background:#1e1a23;color:#fff2e6;overflow:hidden;padding:24px;border:12px solid #d5cbc0;box-shadow:8px 12px 20px rgba(24,18,24,.27);}
.motion-paper img {position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.8;filter:saturate(1.3) blur(1px);animation:ghostDrift 13s infinite alternate ease-in-out;}
.motion-paper::before {content:'';position:absolute;inset:0;z-index:1;opacity:.3;background:repeating-linear-gradient(0deg,#dedede 0 1px,transparent 1px 4px);mix-blend-mode:screen;pointer-events:none;}
.motion-paper::after {content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(0deg,rgba(0,0,0,.88),transparent 80%);}
.motion-paper .motion-content {z-index:2;position:absolute;bottom:20px;left:20px;right:20px;}
.motion-paper h3 {font:italic 600 clamp(34px,3.2vw,55px)/.95 var(--display);margin:5px 0;}
.motion-paper p {font:10px/1.4 var(--mono);}
.entry--strip {grid-column:3/span 7;grid-row:span 2;margin-top:25px;}
.entry--strip .entry-photo-frame {--img-aspect:16/8;}
.entry--strip .entry-photo img {object-position:center 32%;}
.entry-mark {position:absolute;z-index:4;pointer-events:none;color:#c52039;}
.entry-mark--star {font:70px var(--sans);top:-24px;right:-35px;transform:rotate(-20deg);}
.entry-mark--x {right:-10%;top:-7%;width:130px;height:115px;}
.entry-mark--x img {width:200px;max-width:none;position:absolute;left:-15px;top:40px;}
.entry-mark--x img:first-child {transform:rotate(45deg);}
.entry-mark--x img:nth-child(2) {transform:rotate(-45deg);}
.entry-stamp {position:absolute;left:-38px;top:-30px;z-index:2;transform:rotate(-15deg);font:10px var(--mono);letter-spacing:.02em;color:#9f224b;}
.journal-outro {width:min(1300px,90%);margin:25px auto 0;display:flex;gap:20px;align-items:center;justify-content:space-between;padding-top:22px;border-top:1px solid #b5a29e;color:#784b5b;}
.journal-outro span:first-child {font:10px var(--mono);letter-spacing:.2em;}
.journal-outro svg {width:180px;color:#c4213e;}
.journal-outro span:last-child {font:italic 26px var(--display);}

.sound-section {background:#101321; color:#f4eadc; min-height:755px;position:relative;overflow:hidden;isolation:isolate;display:grid;grid-template-columns:1.1fr 1fr; gap:45px;align-items:center;padding:100px clamp(30px,6vw,110px);}
.sound-section::before {content:'';z-index:-1;position:absolute;inset:0;background:radial-gradient(ellipse at 100% 0,rgba(207,28,99,.24),transparent 45%),radial-gradient(ellipse at 0 90%,rgba(24,94,176,.22),transparent 40%);}
.sound-photo {position:absolute;inset:0 49% 0 0;z-index:-2;opacity:.26;overflow:hidden;mix-blend-mode:screen;}
.sound-photo img {width:100%;height:100%;object-fit:cover;object-position:33% center;filter:grayscale(.6) blur(4px) contrast(1.2);}
.sound-speckles {position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(#ffeff4 1px,transparent 1px);background-size:19px 17px;mask-image:linear-gradient(90deg,transparent 35%,black 100%);opacity:.06;}
.sound-content {z-index:2;position:relative;}
.sound-content h2 {font-size:clamp(82px,9vw,165px);margin-top:32px;line-height:.76;}
.sound-content h2 em {color:#ee709c;}
.sound-content p {max-width:340px;font:16px/1.5 var(--sans);margin:38px 0 25px;}
.sound-buttons {display:flex;align-items:center;gap:26px;flex-wrap:wrap;}
.torn-button {display:inline-flex;gap:26px;justify-content:space-between;align-items:center;background:var(--red);color:#fff5e6;font:11px var(--mono);padding:18px 22px;clip-path:polygon(0 3%,100% 0,98% 100%,2% 96%);transition:transform .2s;}
.torn-button:hover {transform:rotate(-2deg) scale(1.03);}
.torn-button span {font-size:18px;}
.text-link {border-bottom:1px solid #f1c0c8;padding-bottom:6px;font:12px var(--mono);}
.sound-release-list {margin-top:50px;display:flex;gap:14px;align-items:center;flex-wrap:wrap;max-width:550px;}
.sound-release-list span {width:100%;font:9px var(--mono);color:#d9b6c8;letter-spacing:.13em;}
.sound-release-list a {font:11px var(--mono);border:1px solid #756b85;padding:8px 13px;transition:background .2s;}
.sound-release-list a:hover {background:#a52c53;border-color:#a52c53;}
.sound-stamp {position:absolute;z-index:1;right:-45px;top:-50px;transform:rotate(13deg);border:2px solid #ef7bab;border-radius:100%;width:134px;height:90px;display:flex;justify-content:center;align-items:center;text-align:center;color:#ef7bab;font:11px/1.6 var(--mono);}
.sound-big-x {position:absolute;bottom:-90px;left:42%;z-index:0;width:360px;height:360px;transform:rotate(-21deg);opacity:.5;pointer-events:none;}

.projection-section {height:690px;min-height:620px;position:relative;overflow:hidden;background:#071b2a;isolation:isolate;display:flex;align-items:center;padding:80px clamp(28px,7vw,125px);}
.projection-room {position:absolute;inset:-5%;z-index:-2;overflow:hidden;}
.projection-room-image {position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.projection-room-image--a {filter:saturate(1.45) brightness(.7) contrast(1.2);animation:ghostDrift 20s alternate infinite ease-in-out;}
.projection-room-image--b {filter:blur(15px) saturate(.7);mix-blend-mode:screen;opacity:.4;animation:ghostBlink 17s alternate infinite ease-in-out;}
.projection-room video {position:absolute;inset:0;width:100%;height:100%;object-fit:cover;mix-blend-mode:screen;opacity:.7;filter:blur(12px) saturate(.9);display:none;}
.projection-room-ripple {position:absolute;inset:-10%;z-index:1;background:radial-gradient(ellipse at 65% 46%,transparent 0 18%,rgba(152,204,230,.18) 21%,transparent 23% 36%,rgba(224,193,233,.18) 37%,transparent 40% 53%,rgba(255,255,255,.1) 54%,transparent 55%);animation:ripple 18s linear infinite;filter:blur(16px);mix-blend-mode:screen;}
.projection-room-pattern {position:absolute;inset:0;z-index:2;pointer-events:none;background:repeating-linear-gradient(0deg,transparent 0 3px,rgba(243,232,240,.13) 3px 4px);opacity:.35;}
.projection-room-vignette {position:absolute;inset:0;z-index:3;background:linear-gradient(90deg,rgba(3,12,26,.96) 0%,rgba(3,9,16,.69) 47%,rgba(3,9,18,.32) 100%),linear-gradient(0deg,rgba(1,5,12,.72),transparent 60%);}
.projection-section-content {position:relative;z-index:4;max-width:750px;}
.projection-section h2 {font-size:clamp(90px,12vw,205px);margin:30px 0 35px;line-height:.78;}
.projection-section h2 em {color:#c7aad9;}
.projection-section-content p {max-width:470px;font-size:15px;line-height:1.6;color:#d4ccd8;}
.projection-annotation {position:absolute;font-size:clamp(20px,2.6vw,38px);left:79%;top:34%;width:340px;transform:rotate(-10deg);color:#c7afe3;line-height:.9;white-space:nowrap;}
.projection-vertical {position:absolute;z-index:5;right:27px;top:50%;font:9px var(--mono);letter-spacing:.17em;white-space:nowrap;transform:translateY(-50%) rotate(90deg);color:#bdc5e3;opacity:.6;}

.art-section {position:relative;background:#d6c9b7;color:var(--ink);padding:125px 0 95px;overflow:hidden;isolation:isolate;min-height:1300px;}
.art-intro {width:min(1250px,88%);margin:0 auto;}
.art-intro h2 {font-size:clamp(95px,12vw,190px);margin:20px 0 30px;}
.art-intro h2 em {color:#ad2849;}
.art-intro p {font:16px/1.5 var(--sans);max-width:380px;margin:0;}
.art-wall {position:relative;width:min(1390px,94%);margin:40px auto 0;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-auto-rows:85px;gap:18px;align-items:start;}
.art-item {padding:10px 10px 29px;background:#f5ecdd;border:0;display:block;position:relative;text-align:left;cursor:zoom-in;box-shadow:5px 12px 18px rgba(28,20,20,.2);transition:transform .3s,box-shadow .3s;}
.art-item img {height:100%;width:100%;object-fit:cover;}
.art-item span {position:absolute;left:12px;bottom:9px;font:8px var(--mono);letter-spacing:.04em;}
.art-item--a {grid-column:2/span 4;grid-row:1/span 6;height:100%;transform:rotate(-7deg);}
.art-item--b {grid-column:8/span 4;grid-row:1/span 5;height:100%;transform:rotate(6deg);z-index:2;}
.art-item--c {grid-column:5/span 4;grid-row:6/span 7;height:100%;transform:rotate(-2deg);z-index:1;}
.art-item--d {grid-column:1/span 4;grid-row:8/span 6;height:100%;transform:rotate(4deg);z-index:1;}
.art-item--e {grid-column:9/span 3;grid-row:7/span 6;height:100%;transform:rotate(7deg);}
.art-item--f {grid-column:6/span 4;grid-row:13/span 6;height:100%;transform:rotate(-5deg);}
.art-graffiti {position:absolute;top:41%;left:40%;color:#bd1c3a;z-index:4;font:55px/.82 var(--heavy);transform:rotate(-14deg);pointer-events:none;text-shadow:2px 3px 0 #f5d7ca;}
.art-graffiti span:last-child {font:85px var(--display);position:absolute;left:100%;bottom:0;}
.art-brush-stamp {position:absolute;top:7%;left:42%;width:400px;transform:rotate(32deg);opacity:.7;pointer-events:none;}

.closing {position:relative;min-height:740px;background:#11161b;display:flex;align-items:center;padding:120px clamp(28px,7vw,120px);overflow:hidden;isolation:isolate;}
.closing-bg {position:absolute;z-index:-2;inset:0;}
.closing-bg img {width:100%;height:100%;object-fit:cover;object-position:center;filter:brightness(.3) saturate(.55) blur(3px);}
.closing::before {content:'';position:absolute;z-index:-1;inset:0;background:linear-gradient(90deg,rgba(12,13,20,.95),rgba(20,9,20,.72) 60%,rgba(15,12,16,.5));}
.closing-inner {position:relative;z-index:2;max-width:720px;}
.closing h2 {font-size:clamp(110px,13vw,215px);margin:25px 0 27px;white-space:nowrap;}
.closing h2 em {color:#eab0d5;}
.closing-inner p {font-size:17px;line-height:1.7;max-width:500px;color:#f1e4df;}
.closing-link-stack {display:flex;gap:24px;margin-top:46px;flex-wrap:wrap;}
.closing-link-stack a {display:inline-flex;justify-content:space-between;align-items:center;gap:40px;padding:13px 0;border-bottom:1px solid #d8b6c4;font:11px var(--mono);letter-spacing:.08em;}
.closing-link-stack a span {font-size:19px;color:#ef7ca8;}
.closing-flourish {font-size:31px;color:#e2bad0;transform:rotate(-6deg);margin-top:80px;}
.closing-eye {position:absolute;right:-5%;top:14%;width:min(35vw,470px);transform:rotate(14deg);z-index:1;opacity:.65;mix-blend-mode:screen;mask-image:radial-gradient(ellipse,black 23%,transparent 70%);}
.closing-eye img {filter:saturate(.8) contrast(1.3);}
.footer {display:flex;justify-content:space-between;align-items:center;gap:12px;padding:30px clamp(24px,5vw,90px);background:#090b10;color:#bca9b5;border-top:1px solid #36313c;font:9px var(--mono);letter-spacing:.16em;}
.footer a {border-bottom:1px solid #bca9b5;padding-bottom:5px;}

.reveal {opacity:0;transform:translateY(28px);transition:transform .9s cubic-bezier(.18,.8,.23,1),opacity .9s;}
.reveal.is-visible {opacity:1;transform:translateY(0);}

@keyframes marqueeMove {to {transform:translateX(-50%);}}
@keyframes heroBreath {from{transform:scale(1.05) translateY(-1%)}to{transform:scale(1.13) translateY(1%)}}
@keyframes ghostDrift {from{transform:scale(1.04) translate(-1%,0%)}to{transform:scale(1.14) translate(2%,2%)}}
@keyframes ghostBlink {0%{opacity:.18;transform:scale(1.08)}45%{opacity:.4}64%{opacity:.08}100%{opacity:.34;transform:scale(1.16)}}
@keyframes ripple {from{transform:scale(.92) rotate(-2deg)}to{transform:scale(1.28) rotate(3deg)}}
@keyframes pulse {50%{opacity:.3;box-shadow:0 0 3px #ff1d5f}}

@media (max-width:1050px) {
  .topbar-annotation {display:none;}
  .hero {min-height:690px;}
  .hero h1 {font-size:clamp(135px,22vw,300px);}
  .hero-eye {right:6%;top:18%;}
  .hero-night {bottom:9%;}
  .hero-scribble {display:none;}
  .feed {width:96%;}
  .entry--note {grid-column:6/span 6;}
  .entry--sound {grid-column:7/span 6;}
  .entry--square {grid-column:8/span 5;}
  .entry--portrait {grid-column:1/span 5;}
  .entry--wide {grid-column:2/span 9;}
  .entry--motion {grid-column:9/span 4;}
  .sound-section {gap:15px;}
  .art-graffiti {font-size:40px;}
}
@media (max-width:700px) {
  html {scroll-padding-top:58px;}
  .topbar {height:58px;padding:0 14px;gap:8px;}
  .brand {font-size:27px;letter-spacing:-3px;}
  .brand span {font-size:16px;margin:0 5px 0 3px;}
  .topnav {gap:12px;}
  .topnav a {font-size:9px;}
  .projection-toggle {margin-left:1px;border-left:0;padding:8px 3px;}
  .projector-label {display:none;}
  .hero {min-height:720px;height:93svh;}
  .hero-bg img {object-position:59% center;filter:brightness(.68) saturate(.75);}
  .hero-violet {background:linear-gradient(100deg,rgba(15,9,18,.78),rgba(33,17,43,.38) 80%),linear-gradient(0deg,#100d16 0%,transparent 50%,rgba(9,6,15,.3) 100%);}
  .hero-topline {top:82px;left:18px;right:18px;font-size:7px;letter-spacing:.08em;}
  .hero-topline span:last-child {display:none;}
  .hero-titleblock {left:6%;width:90%;top:47%;}
  .eyebrow--hero {font-size:8px;letter-spacing:.1em;margin-bottom:10px;}
  .hero h1 {font-size:clamp(105px,29vw,185px);line-height:.73;}
  .hero h1 em {margin-top:0;margin-left:13%;}
  .hero-asterisk {font-size:48px;top:74%;left:7%;}
  .hero-title-foot {margin:38px 0 0 4px;display:flex;flex-direction:column;align-items:flex-start;gap:9px;}
  .hero-caption {font-size:26px;}
  .jump-link {font-size:9px;gap:25px;padding:8px;}
  .hero-eye {top:8%;right:-11%;width:clamp(145px,38vw,200px);padding:5px 5px 18px;transform:rotate(12deg);opacity:.9;}
  .tiny-photo-caption {font-size:6px;}
  .tiny-tape {width:48px;height:25px;top:-11px;}
  .hero-night {bottom:11%;right:-7%;width:190px;transform:rotate(-10deg);}
  .hero-night img {height:115px;}
  .hero-paint-x {right:-16%;top:8%;transform:rotate(-16deg) scale(.65);}
  .hero-stars {left:0;bottom:16%;width:65px;}
  .hero-bottomline {bottom:17px;left:18px;right:18px;font-size:7px;letter-spacing:.04em;}
  .hero-bottomline span:nth-child(2) {display:none;}
  .marquee {height:43px;}
  .marquee-track {font-size:12px;}
  .journal {padding-top:85px;}
  .journal-head {width:90%;margin-bottom:30px;}
  .journal h2 {font-size:clamp(94px,22vw,155px);}
  .journal-head p {font-size:13px;line-height:1.6;max-width:310px;}
  .journal-head-side {position:static;font-size:23px;transform:rotate(-4deg);text-align:right;margin-top:10px;}
  .filter-strip {margin:0 10px;justify-content:flex-start;gap:0 5px;}
  .filter-label {width:100%;margin-bottom:7px;font-size:8px;}
  .filter {font-size:9px;padding:7px 9px;}
  .feed {width:94%;padding:32px 0 45px;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px 8px;}
  .entry--tall {grid-column:1/span 4;grid-row:auto;margin-top:6px;}
  .entry--square {grid-column:3/span 4;grid-row:auto;margin-top:0;}
  .entry--note {grid-column:1/span 5;grid-row:auto;margin-top:20px;}
  .entry--portrait {grid-column:2/span 5;grid-row:auto;margin-top:0;}
  .entry--sound {grid-column:1/span 6;grid-row:auto;margin-top:16px;}
  .entry--wide {grid-column:1/span 6;grid-row:auto;margin-top:18px;}
  .entry--motion {grid-column:2/span 5;grid-row:auto;margin-top:7px;}
  .entry--strip {grid-column:1/span 6;grid-row:auto;margin-top:20px;}
  .entry-photo {padding:6px 6px 15px;}
  .entry-photo-caption {padding:7px 0 0;font-size:7px;}
  .entry-name {font-size:26px;}
  .entry--note .note-paper {min-height:255px;padding:35px 28px;}
  .note-paper h3 {font-size:clamp(50px,12vw,75px);}
  .entry--sound .record-paper {padding:28px;min-height:250px;}
  .entry--sound h3 {font-size:74px;margin:20px 0 6px;}
  .entry--motion .motion-paper {min-height:275px;}
  .journal-outro {flex-wrap:wrap;gap:5px;}
  .journal-outro span:first-child {font-size:9px;}
  .journal-outro svg {width:80px;}
  .journal-outro span:last-child {flex-basis:100%;margin-top:10px;text-align:right;}
  .sound-section {display:block;min-height:0;padding:95px 27px 110px;}
  .sound-photo {right:0;bottom:0;height:100%;opacity:.18;}
  .sound-content h2 {font-size:clamp(87px,19vw,130px);}
  .sound-content p {margin:35px 0 20px;font-size:15px;}
  .sound-release-list {margin-top:35px;}
  .player-paper {padding:17px 15px;transform:rotate(3deg);}
  .player-paper h3 {font-size:65px;}
  .player-paper iframe {min-height:300px;}
  .sound-stamp {top:-48px;right:-32px;width:95px;height:69px;font-size:8px;}
  .sound-big-x {left:-80px;bottom:-180px;}
  .projection-section {height:650px;min-height:0;padding:80px 26px;}
  .projection-section h2 {font-size:clamp(80px,18vw,120px);}
  .projection-section-content p {font-size:13px;max-width:310px;}
  .projection-annotation {font-size:23px;position:static;transform:rotate(-5deg);margin-bottom:26px;}
  .projection-vertical {display:none;}
  .art-section {padding:95px 0 60px;min-height:0;}
  .art-intro h2 {font-size:clamp(85px,18vw,125px);}
  .art-intro p {font-size:14px;max-width:300px;}
  .art-wall {margin-top:60px;width:100%;grid-template-columns:repeat(6,minmax(0,1fr));grid-auto-rows:45px;gap:8px;min-height:1520px;}
  .art-item {padding:5px 5px 20px;}
  .art-item span {font-size:6px;left:6px;bottom:7px;}
  .art-item--a {grid-column:1/span 4;grid-row:1/span 8;}
  .art-item--b {grid-column:4/span 3;grid-row:6/span 7;}
  .art-item--c {grid-column:1/span 4;grid-row:14/span 8;}
  .art-item--d {grid-column:3/span 4;grid-row:22/span 7;}
  .art-item--e {grid-column:1/span 3;grid-row:29/span 6;}
  .art-item--f {grid-column:3/span 4;grid-row:35/span 8;}
  .art-graffiti {left:9%;top:28%;font-size:35px;}
  .art-brush-stamp {left:0;top:47%;width:250px;}
  .closing {min-height:680px;padding:90px 26px;}
  .closing h2 {font-size:clamp(90px,19vw,145px);}
  .closing-inner p {font-size:14px;max-width:340px;}
  .closing-eye {right:-28%;top:36%;width:65%;opacity:.3;}
  .closing-link-stack {gap:12px;}
  .closing-link-stack a {font-size:9px;gap:10px;}
  .footer {padding:28px 16px;gap:8px;flex-wrap:wrap;font-size:8px;}
  .footer span:nth-child(2) {display:none;}
}
@media (max-width:390px) { .topnav {gap:8px;} .topnav a {font-size:8px;} .hero h1 {font-size:28vw;} .hero-eye {width:42vw;} .journal h2 {font-size:23vw;} .art-intro h2 {font-size:20vw;} }
@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after {animation-duration:.01ms !important;animation-iteration-count:1 !important;scroll-behavior:auto!important;transition-duration:.01ms!important;}
  .reveal {opacity:1;transform:none;}
}

/* Diluted pigment stays behind the reading layer; media drifts independently. */
.journal,.art-section { background:#d8d7ce; }
.journal::before,.art-section::before {background:radial-gradient(ellipse at 28% 30%,#f0e7d0aa,transparent 65%),url('assets/brush-water.svg') center/cover;opacity:.95;inset:-12% -15%;animation:pigment-current 38s ease-in-out infinite alternate;}
.journal::after,.art-section::after {content:'';position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(ellipse at 30% 35%,transparent 25%,#f5eee121 50%,transparent 64%),repeating-radial-gradient(ellipse at 70% 40%,transparent 0 85px,#ffffff0c 88px,transparent 93px);mix-blend-mode:soft-light;}
.journal-head,.filter-strip,.feed,.art-intro,.art-wall {z-index:1;position:relative;}
.entry-photo,.art-item,.hero-eye,.hero-night {animation:media-afloat 12s ease-in-out infinite alternate;box-shadow:0 28px 32px -14px #243e4445,0 3px 12px #e7f1e566;}
.entry:nth-child(3n) .entry-photo,.art-item:nth-child(2n) {animation-delay:-7s;animation-duration:15s;}
.entry:nth-child(2n) .entry-photo,.hero-night {animation-delay:-4s;animation-duration:17s;}
.entry-photo-frame,.art-item {position:relative;}
.entry-photo-frame::after,.art-item::after {content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 10% 30%,#93c7b835,transparent 60%),linear-gradient(125deg,transparent 20%,#f5efd926 45%,transparent 65%,#a47ca41a);mix-blend-mode:screen;animation:surface-light 14s ease-in-out infinite alternate;background-size:180% 180%;}
@keyframes media-afloat {from {translate:0 -5px;rotate:-.6deg;}to {translate:4px 8px;rotate:.8deg;}}
/* Translation-only drift keeps coverage independent of a section's aspect ratio.
   The oversized paint plane always extends beyond all four clipping edges. */
@keyframes pigment-current {from {transform:translate(-2%, -1%) scale(1.04);}to {transform:translate(2%,2%) scale(1.1);}}
@keyframes surface-light {from {background-position:0 15%;opacity:.4;}to {background-position:100% 85%;opacity:.8;}}
@media(max-width:700px){.journal::before,.art-section::before{background-size:auto 1100px;}.entry-photo,.art-item{animation-duration:16s;}}
@media(prefers-reduced-motion:reduce){.journal::before,.art-section::before,.entry-photo,.art-item,.hero-eye,.hero-night,.entry-photo-frame::after,.art-item::after{animation:none!important;}}

/* Motion now comes from the water integrator, with no competing float keyframes. */
.entry-photo,.art-item,.hero-eye,.hero-night {animation:none!important;}
.water-surface {position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:8;}
.feed>.entry,.art-wall>.art-item {will-change:translate,rotate;}
@media(prefers-reduced-motion:reduce){.water-surface{display:none;}}

/* Height-field lighting replaces geometric ripple outlines. */
.water-surface{opacity:.85;}
.journal::after,.art-section::after{background:radial-gradient(ellipse at 30% 35%,transparent 25%,#f5eee121 50%,transparent 64%);}

/* Continuous viewport water, independent of inset gallery layout. */
.water-world{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:35;overflow:hidden;contain:strict;}
.water-world>.water-surface{display:block;position:absolute;inset:0;width:100%;height:100%;}

.entry-photo,.art-item{cursor:default;}

/* Covers share the page-wide water canvas; there is no separate vessel or surface. */
.topnav { margin-inline:auto; }
.submerged-songs { position:relative; z-index:3; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:65px 30px; padding:48px 0 20px; width:100%; max-width:520px; justify-self:center; }
.album-cover { --tilt:-5deg; position:relative; appearance:none; display:flex; flex-direction:column; gap:8px; width:100%; min-width:0; padding:0; border:0; border-radius:0; background:none; color:inherit; text-align:left; cursor:pointer; touch-action:manipulation; transform:translateY(18px) rotate(var(--tilt)) scale(.93); transition:transform 3s cubic-bezier(.3,.1,.3,1),translate 1.2s ease-out; }
.album-cover:nth-child(even) { --tilt:5deg; margin-top:35px; }
.album-cover:last-of-type { grid-column:1/-1; width:48%; justify-self:center; }
.album-art { display:block; position:relative; width:100%; aspect-ratio:1; overflow:hidden; filter:blur(3px) saturate(.6) brightness(.66); transition:filter 3s ease-in-out; }
.album-art img { display:block; width:100%; height:100%; object-fit:cover; filter:url("#album-water-refraction"); transition:filter 3s ease-in-out; animation:submerged-refraction 6s ease-in-out infinite alternate; }
.album-art::after { content:''; pointer-events:none; position:absolute; inset:-30%; opacity:.95; background:repeating-linear-gradient(115deg,transparent 0 13%,#c8faffbb 18%,#ffffff66 20%,transparent 25% 36%); mix-blend-mode:screen; filter:blur(7px); animation:cover-light 8s ease-in-out infinite alternate; transition:opacity 3s ease-in-out; }
.album-cover:nth-child(even) .album-art img,.album-cover:nth-child(even) .album-art::after { animation-delay:-3s; }
.album-cover.is-surfaced { transform:translateY(-22px) rotate(0deg) scale(1); }
.album-cover.is-surfaced .album-art { filter:none; }
.album-cover.is-surfaced .album-art img { filter:none; }
.album-cover.is-surfaced .album-art::after { opacity:0; }
.album-cover:focus-visible { outline:2px solid #e6ffff; outline-offset:9px; }
.album-title { font:500 13px/1.35 var(--sans); }
.album-action { font:10px/1.4 var(--mono); }
.song-status { grid-column:1/-1; margin:0; min-height:2.8em; font:11px/1.4 var(--mono); }
@keyframes submerged-refraction { from { transform:scale(1.035) skew(-1.4deg,.8deg); } to { transform:scale(1.06) skew(1.4deg,-.8deg); } }
@keyframes cover-light { from { transform:translate(-8%,-5%) rotate(-6deg); } to { transform:translate(8%,5%) rotate(6deg); } }
body.motion-off .album-art img,body.motion-off .album-art::after { animation:none; }
body.motion-off .album-cover,body.motion-off .album-art,body.motion-off .album-art::after { transition:none; }
@media (max-width:700px) { .submerged-songs { margin:55px auto 0; gap:56px 24px; max-width:430px; } .album-title {font-size:12px;} .topnav {gap:clamp(10px,4vw,24px);} }
@media (prefers-reduced-motion:reduce) { .album-art img,.album-art::after {animation:none;} .album-cover,.album-art,.album-art::after {transition:none;} }

/* Original supplied drawings: transparent vector coverage, no font substitutes. */
.hero-asterisk {width:clamp(40px,5vw,95px);height:auto;object-fit:contain;}
.hero-stars {height:auto;max-width:30vw;}
.journal-watermark {width:min(75vw,1100px);}
.journal-watermark img {display:block;width:100%;height:auto;}
.entry-mark--star img {display:block;width:70px;height:auto;}
.drawn-inline-star {display:inline-block;width:1.3em;height:1.5em;object-fit:contain;vertical-align:middle;}
@media(max-width:700px){.hero-asterisk{width:48px;}}

/* Current and fish remain in the existing open water scene. */
.water-fish {position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:4;filter:blur(.45px);}
.album-art::before {content:'';position:absolute;inset:0;z-index:2;pointer-events:none;opacity:0;background:linear-gradient(180deg,#e6ffff88 0%,#b4e9ef55 5%,#d5ffff22 32%,transparent 75%),repeating-linear-gradient(94deg,transparent 0 13%,#e6ffff77 14%,transparent 15% 28%);border-top:2px solid #eaffffc9;border-radius:40% 35% 0 0 / 5% 6% 0 0;transform:translateY(-105%);}
.album-cover.is-surfaced .album-art::before {animation:album-runoff 3s ease-in forwards;}
@keyframes album-runoff {0% {opacity:0;transform:translateY(-100%) scaleX(1.04);}12% {opacity:.85;transform:translateY(-45%) scaleX(1.02);}40% {opacity:.7;transform:translateY(5%) scaleX(1);}75% {opacity:.4;transform:translateY(75%) scaleX(.98);}100% {opacity:0;transform:translateY(110%) scaleX(.96);}}
body.motion-off .water-fish {display:none;}
body.motion-off .album-art::before {display:none;}
@media(prefers-reduced-motion:reduce){.water-fish,.album-art::before{display:none;}.album-cover{translate:none!important;}}

/* Smaller prints overlap in the shared current, with the same layout on mobile. */
.feed {width:88%;max-width:1000px;min-height:0;padding:45px 0 65px;grid-template-columns:repeat(12,minmax(0,1fr));grid-auto-rows:clamp(14px,3.3vw,36px);gap:0;align-items:start;}
.feed > .entry {margin:0;min-width:0;}
.feed > .entry:nth-child(1) {grid-column:2/span 5;grid-row:1/span 10;z-index:1;}
.feed > .entry:nth-child(2) {grid-column:6/span 5;grid-row:3/span 9;z-index:2;}
.feed > .entry:nth-child(3) {grid-column:1/span 5;grid-row:9/span 10;z-index:3;}
.feed > .entry:nth-child(4) {grid-column:5/span 6;grid-row:12/span 8;z-index:4;}
.feed > .entry:nth-child(5) {grid-column:7/span 5;grid-row:17/span 10;z-index:2;}
.feed > .entry:nth-child(6) {grid-column:2/span 5;grid-row:19/span 9;z-index:3;}
.feed > .entry:nth-child(7) {grid-column:4/span 6;grid-row:26/span 7;z-index:4;}
.art-wall {width:88%;max-width:1000px;min-height:0;grid-template-columns:repeat(12,minmax(0,1fr));grid-auto-rows:clamp(22px,4vw,52px);gap:0;}
.art-item--a {grid-column:2/span 4;grid-row:1/span 6;}
.art-item--b {grid-column:5/span 4;grid-row:2/span 5;}
.art-item--c {grid-column:7/span 4;grid-row:6/span 7;}
.art-item--d {grid-column:1/span 4;grid-row:7/span 6;}
.art-item--e {grid-column:4/span 4;grid-row:10/span 6;}
.art-item--f {grid-column:6/span 4;grid-row:14/span 6;}
@media(max-width:700px){.feed{width:86%;padding-top:30px;}.entry-photo{padding:5px 5px 18px;}.entry-mark--star img{width:42px;}.art-wall{width:86%;}}

.room-section {padding:0;width:100%;height:calc(min(100vw,1440px) * .5625 + 100px);min-height:0;display:block;background:#140d07;}
.room-section iframe {display:block;width:100%;max-width:1440px;margin-inline:auto;height:100%;border:0;}
@media(max-width:600px){.room-section{height:calc(100vw * .5625 + 210px);min-height:0;}}


/* Keep the closing actions readable over the photograph. */
.closing-link-stack a,.closing-link-stack a span {color:#fff;}
.social-links {--social-icon-cutout:#101016;display:flex;align-items:center;gap:5px;flex-shrink:0;}
.social-links a {display:inline-flex;align-items:center;justify-content:center;width:36px;height:44px;padding:0;border:0;color:#fff;transition:color .2s;}
.social-links svg {display:block;width:21px;height:21px;}
.social-links a:hover {color:#f04763;}
.social-links a:focus-visible {outline:2px solid #fff;outline-offset:2px;border-radius:3px;}
.topbar .topnav {margin-left:0;margin-right:auto;}
.footer .social-links {--social-icon-cutout:#090b10;}
.footer .social-links a {border:0;padding:0;}
@media(max-width:700px){
 .topbar {padding-inline:10px;gap:6px;}
 .topbar .topnav {gap:8px;}
 .topbar .social-links {gap:2px;}
 .topbar .social-links a {width:30px;}
 .topbar .social-links svg {width:19px;height:19px;}
 .topbar .projection-toggle {margin-left:0;}
 .footer .social-links {gap:6px;}
}

/* The room controls now overlay the camera frame, with no extra controls row. */
.room-section {height:calc(min(100vw,1440px) * .5625);}
@media(max-width:600px){.room-section{height:calc(100vw * .5625);}}

/* Mobile room gets its own portrait camera composition. */
@media(max-width:700px){.room-section{height:auto;aspect-ratio:9/16;}.room-section iframe{position:absolute;inset:0;width:100%;height:100%;}}

/* Original drawing timelapses sit below the photographs, on the light paper. */
.drawing-background {
  position:absolute; z-index:0; pointer-events:none; user-select:none;
  left:var(--drawing-x,50%); top:var(--drawing-y,50%);
  width:clamp(620px,110vw,1400px); max-width:none; height:auto;
  transform:translate(-50%,-50%) rotate(var(--drawing-angle,0deg));
  opacity:.24; mix-blend-mode:multiply;
}
@media (max-width:600px) {
  .drawing-background {width:155vw; opacity:.22;}
}

/* The mobile vessel matches the entire drawing: 100% width and at most 115% height. */
@media (max-width:600px) {
  .journal,.art-section {padding:0;min-height:0;height:auto;aspect-ratio:1 / 1.15;}
  .drawing-background {
    inset:0; width:100%; height:100%; aspect-ratio:auto;
    object-fit:fill; transform:none; opacity:.22;
  }
  /* Compact the existing collage into the resized vessel instead of leaving a tall empty background. */
  .journal .feed,.art-section .art-wall {
    position:absolute; inset:7%; width:86%; height:86%; min-height:0;
    margin:0; padding:0; gap:0;
    grid-template-columns:repeat(12,minmax(0,1fr));
    grid-template-rows:repeat(12,minmax(0,1fr));grid-auto-rows:0;
  }
  .feed > .entry:nth-child(1),.art-item--a {grid-column:1/span 5;grid-row:1/span 5;}
  .feed > .entry:nth-child(2),.art-item--b {grid-column:7/span 5;grid-row:1/span 4;}
  .feed > .entry:nth-child(3),.art-item--c {grid-column:3/span 5;grid-row:5/span 5;}
  .feed > .entry:nth-child(4),.art-item--d {grid-column:8/span 5;grid-row:5/span 3;}
  .feed > .entry:nth-child(5),.art-item--e {grid-column:8/span 5;grid-row:9/span 4;}
  .feed > .entry:nth-child(6),.art-item--f {grid-column:1/span 5;grid-row:9/span 4;}
  .feed > .entry:nth-child(7) {grid-column:5/span 5;grid-row:10/span 3;}
  .feed > .entry {height:100%;min-height:0;}
  .entry-photo {height:100%;padding:4px 4px 10px;}
  .entry-photo-frame {height:100%;aspect-ratio:auto;}
  .art-item {min-height:0;padding:4px 4px 10px;}
}

/* Darker original ink, including narrow-screen backgrounds. */
.drawing-background {opacity:.58;filter:contrast(1.25);}

/* Dragging a print stirs the same water; uncovered areas retain normal page scrolling. */
.draggable-photo {cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;}
.draggable-photo img {-webkit-user-drag:none;user-select:none;pointer-events:none;}
.draggable-photo:focus,.draggable-photo:focus-visible {outline:none;}
.draggable-photo.is-dragging {cursor:grabbing;z-index:12!important;}
.draggable-photo.is-dragging .entry-photo {cursor:grabbing;}
