*{box-sizing:border-box}html{background:#080909;color:#eeeade;font-family:Arial,'Apple SD Gothic Neo',sans-serif}body{margin:0}a{color:inherit}button{font:inherit;background:#0b0e10b3;color:#eeeade;border:1px solid #8b9285;padding:10px 14px;cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid #d6e39e;outline-offset:4px}.journey{height:155svh;position:relative}.stage{position:sticky;top:0;height:100svh;overflow:hidden;perspective:1400px;isolation:isolate;background:#090b0c}.halo{position:absolute;inset:-20%;background:radial-gradient(ellipse at 73% 35%,#80552265,transparent 45%),radial-gradient(ellipse at 20% 60%,#18304b88,transparent 50%);transform:translateX(calc(var(--p,0)*-8%))}.portrait{position:absolute;height:104svh;aspect-ratio:1122/1402;right:4vw;top:-2svh;transform-origin:65% 50%;transform:translateX(calc(var(--p,0)*-2vw)) rotateY(calc(var(--p,0)*-12deg));mask-image:linear-gradient(90deg,transparent,#000 15%,#000 95%,transparent);will-change:transform}.portrait img,.portrait canvas{position:absolute;inset:0;width:100%;height:100%;display:block}.portrait canvas{opacity:0}.portrait[data-ready=true] canvas{opacity:1}.shade{position:absolute;inset:0;background:linear-gradient(90deg,#080a0c00 25%,#080a0cb3 66%,#080a0cf5);opacity:calc(.06 + var(--p,0)*.75)}.veil{position:absolute;inset:0;background:linear-gradient(90deg,#080909 0%,#080909b8 23%,transparent 65%),linear-gradient(0deg,#080909 0%,transparent 22%,transparent 85%,#08090970)}.wire{position:absolute;inset:16% -20%;border:1px solid #bcc6a32e;border-radius:50%;transform:rotate(-24deg) translateX(calc(var(--p,0)*-12vw)) rotateY(calc(var(--p,0)*-28deg));pointer-events:none}.wire.second{inset:34% -30%;border-color:#c5a76e25;transform:rotate(29deg) translateX(calc(var(--p,0)*8vw))}header{position:absolute;z-index:5;left:5vw;right:5vw;top:24px;display:flex;align-items:center;justify-content:space-between;gap:15px;font-size:10px;letter-spacing:.14em}header a{text-decoration:none}.copy{position:absolute;z-index:3;left:7vw;top:34%;right:5vw;transform:translateY(calc(var(--p,0)*-60px));opacity:var(--intro-opacity,1)}.eyebrow,.scroll{font-size:11px;letter-spacing:.24em;color:#d3dbae}h1{font-family:Impact,'Arial Narrow',sans-serif;font-size:clamp(85px,13vw,180px);font-weight:400;margin:24px 0;line-height:.9;letter-spacing:-.035em}.name{font-size:24px}.name span{font-size:14px;margin-left:18px;color:#b9bcb3}.intro{font-size:14px;color:#b9bcb3}.scroll{margin-top:40px}.ending{position:absolute;left:7vw;bottom:15%;z-index:3;opacity:var(--outro-opacity,0);transform:translateY(calc((1 - var(--p,0))*20px));pointer-events:none}.ending span{font-size:10px;letter-spacing:.18em;color:#d3dbae}.ending p{font-size:clamp(30px,4vw,60px);font-weight:700;line-height:1.25}.progress{position:absolute;bottom:0;left:0;width:calc(var(--p,0)*100%);height:2px;background:#d5e49b}footer{min-height:65svh;padding:90px 7vw;color:#b5b9af;line-height:1.8}footer a{display:inline-block;margin-top:24px;color:#d3dbae}footer small{display:block;margin-top:40px;font-size:11px;color:#7f877e}@media(max-width:700px){header{top:18px;font-size:8px;letter-spacing:.04em}button{font-size:10px;padding:9px}.portrait{height:100svh;top:0;right:calc((100vw - 80svh)/2 - 4vw);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 95%,transparent)}.veil{background:linear-gradient(0deg,#080909f5,rgba(8,9,9,.65) 28%,transparent 60%),linear-gradient(90deg,#08090950,transparent 50%)}.copy{top:auto;bottom:9%;left:7vw;transform:translateY(calc(var(--p,0)*-30px))}.eyebrow{font-size:9px;letter-spacing:.14em}h1{font-size:clamp(70px,20vw,120px);margin:18px 0}.name{font-size:19px;margin:16px 0}.name span{font-size:12px;margin-left:12px}.intro{font-size:11px}.scroll{font-size:9px;margin-top:25px}.ending{bottom:12%}.wire{opacity:.5}}@media(max-height:500px) and (min-width:700px){.copy{top:25%}h1{font-size:85px;margin:15px 0}.name{margin:12px 0}.scroll{margin-top:20px}}
@media(prefers-reduced-motion:reduce){.portrait,.wire,.halo,.copy{transform:none!important}.journey{height:135svh}}
/* Text-free photo + separate, unrotated HTML type. */
.portrait{inset:-1% -2%;width:104%;height:102%;aspect-ratio:auto;transform-origin:70% 50%;mask-image:linear-gradient(90deg,transparent,#000 6%,#000 96%,transparent)}.portrait img{object-fit:cover;object-position:50% 50%}.copy,.ending{transform:none!important}.veil{background:linear-gradient(90deg,#080909d9 0%,#08090960 36%,transparent 70%),linear-gradient(0deg,#080909b3,transparent 25%)}
@media(max-width:700px){.portrait{inset:-1% -2%;right:-2%;width:104%;height:102%;mask-image:none}.portrait img{object-position:71% 50%}.veil{background:linear-gradient(0deg,#080909f5,rgba(8,9,9,.65) 28%,transparent 63%)}h1{font-size:clamp(66px,19vw,105px)}}
/* Type study 03: editorial masthead + distributed metadata. */
.wire{opacity:.22}.wire.second{display:none}header{left:3vw;right:3vw;top:22px;font-size:10px}.copy{inset:0;opacity:var(--intro-opacity,1);pointer-events:none}.copy h1{position:absolute;left:3vw;top:10%;width:60vw;margin:0;display:flex;justify-content:space-between;font-size:clamp(90px,20vw,310px);line-height:.82;letter-spacing:-.045em;font-family:Impact,'Arial Narrow',sans-serif;font-weight:400;transform:translateY(calc(var(--p,0)*-18px));color:#eae7db}.copy h1 span{display:block}.copy .eyebrow{position:absolute;left:3.3vw;top:44%;margin:0;font-size:10px;letter-spacing:.23em}.copy .name{position:absolute;left:3.3vw;top:50%;margin:0;font-size:27px;line-height:1.5}.copy .name span{display:block;margin:7px 0 0;font-size:13px;letter-spacing:.08em}.copy .intro{position:absolute;left:3.3vw;top:65%;margin:0;max-width:28vw;font-size:12px;line-height:1.9;color:#c8c9be}.copy .scroll{position:absolute;right:3vw;bottom:4%;margin:0;font-size:9px;letter-spacing:.15em}.type-footer{position:absolute;z-index:3;bottom:7%;left:3vw;right:3vw;display:flex;align-items:baseline;justify-content:space-between;gap:3vw;pointer-events:none;font-family:Impact,'Arial Narrow',sans-serif;font-weight:400;font-size:clamp(54px,12.5vw,190px);line-height:.85;letter-spacing:-.035em;color:#dfdfd1;opacity:calc(.72 + var(--p,0)*.18);transform:translateY(calc(var(--p,0)*-10px))}.type-footer i{font-family:Georgia,serif;font-size:.65em;font-weight:400;color:#cdda9d}.edge-note{position:absolute;z-index:3;right:3vw;top:48%;writing-mode:vertical-rl;font-size:8px;letter-spacing:.23em;color:#ccd69c;pointer-events:none}.ending{left:3.3vw;bottom:34%}.ending p{font-size:clamp(30px,4vw,60px);margin:20px 0 0}.ending span{font-size:9px}.veil{background:linear-gradient(90deg,#080909c4 0%,#08090940 35%,transparent 67%),linear-gradient(0deg,#080909d0,transparent 28%)}
@media(max-width:700px){header{left:5vw;right:5vw;top:18px;font-size:8px}.copy h1{left:5vw;top:12%;width:89vw;font-size:28vw;line-height:.82;letter-spacing:-.04em}.copy .eyebrow{left:5vw;top:8.5%;font-size:8px;letter-spacing:.12em}.copy .name{left:5vw;top:auto;bottom:30%;font-size:22px}.copy .name span{font-size:11px;margin-top:3px}.copy .intro{left:5vw;top:auto;bottom:23%;font-size:10px;max-width:80vw}.copy .scroll{right:5vw;bottom:3.5%;font-size:8px}.type-footer{left:5vw;right:5vw;bottom:10%;font-size:13vw;gap:3vw}.edge-note{right:4vw;top:34%;font-size:7px;letter-spacing:.15em}.ending{left:5vw;bottom:28%}.ending p{font-size:34px}.veil{background:linear-gradient(0deg,#080909f0,rgba(8,9,9,.55) 30%,transparent 57%),linear-gradient(180deg,#0809098c,transparent 30%)}.wire{opacity:.15}}
@media(max-height:500px) and (min-width:701px){header{top:12px}.copy h1{top:15%;font-size:17vw;width:53vw}.copy .eyebrow{top:53%;font-size:8px}.copy .name{top:61%;font-size:20px}.copy .name span{display:inline;margin-left:10px}.copy .intro{display:none}.type-footer{font-size:8vw;bottom:5%}.copy .scroll{bottom:3%;font-size:7px}.ending{bottom:28%}.ending p{font-size:30px}}
@media(prefers-reduced-motion:reduce){.copy h1,.type-footer{transform:none!important}}

/* Artist tag and concrete class introduction; independent of photo transform. */
.copy .artist-tag{padding:10px 16px 11px 23px;border-left:2px solid #d3dbae;background:linear-gradient(90deg,#080909b5,#08090930);max-width:85vw}
.artist-tag:before{content:"";position:absolute;width:6px;height:6px;background:#d3dbae;left:10px;top:25px}
.artist-tag strong{display:block;font-size:27px;font-weight:700;letter-spacing:-.04em}
.copy .artist-tag span{font-size:10px;letter-spacing:.06em;margin-top:4px;color:#d4d6ca}
.ending{right:5vw;max-width:850px}.ending p{font-size:clamp(26px,3.7vw,54px);line-height:1.35;letter-spacing:-.045em;word-break:keep-all}.ending small{display:block;margin-top:16px;color:#ccd0c4;font-size:14px;line-height:1.6}
@media(max-width:700px){.copy .artist-tag{padding:9px 13px 10px 22px}.artist-tag strong{font-size:22px}.artist-tag:before{top:22px}.copy .artist-tag span{font-size:10px}.ending p{font-size:clamp(23px,6.4vw,38px)}.ending small{font-size:12px;max-width:85vw;margin-top:12px}}

/* Short cover transition: preserve depth, reduce pinned scrolling. */
@media(max-width:760px){.journey{height:145svh}}
@media(prefers-reduced-motion:reduce){.journey{height:100svh}}

/* Immediate scroll feedback: masthead exits first, then class message. */
.copy h1{opacity:calc(1 - var(--title-exit,0));transform:translateY(calc(var(--title-exit,0)*-90px))}
.type-footer,.edge-note{opacity:var(--intro-opacity,1)}
.ending{opacity:var(--outro-opacity,0)}
@media(prefers-reduced-motion:reduce){.copy h1{transform:none!important}}

/* Cover-only home branding: stays within the artist scene, never the section menu. */
.artist-cover-header{height:40px}
.artist-home-link{display:flex;align-items:center;gap:10px;min-height:44px;padding:4px 10px;background:#08090980;border-radius:3px;letter-spacing:0}
.artist-home-link img{width:32px;height:32px;display:block;border-radius:22%}
.artist-home-wordmark{font-family:Arial,Helvetica,sans-serif;font-size:26px;font-style:italic;font-weight:700;line-height:1;letter-spacing:-.085em;color:#f4f5f0}
.artist-home-caption{margin-left:10px;font-size:11px;white-space:nowrap;color:#d3dbae}
@media(max-width:700px){.artist-cover-header{top:10px;height:36px;gap:8px}.artist-cover-label{font-size:8px;letter-spacing:.1em}.artist-home-link{gap:6px;padding:3px 5px}.artist-home-link img{width:26px;height:26px}.artist-home-wordmark{font-size:21px}.artist-home-caption{font-size:10px;margin-left:4px}}