/* Critical artwork is a real image element, including in standalone exports. */
.room-photo{background:#aec6d8!important}
.room-photo #hero-art{width:100%;height:100%;max-width:none;object-fit:cover;object-position:center;display:block}
.hero-definition{top:auto;bottom:19vh;background:transparent;border:0;padding:0;color:#193e52;gap:18px}
.hero-definition:before{content:'';position:absolute;inset:-20px -38px;z-index:-1;pointer-events:none;background:radial-gradient(ellipse,#edf2efdb,transparent 73%)}
.hero-bottom .next-link{background:#edf2efbf;border:1px solid #404d6259;border-radius:60px;padding:12px 22px 12px 12px;gap:17px;color:#193e52;backdrop-filter:blur(8px)}
.hero-definition p{font-size:17px;line-height:1.9}
.definition-mark{font-size:22px}
.hero-prologue{font-size:clamp(16px,1.3vw,25px);text-shadow:0 1px 12px #edf2ef,0 0 25px #edf2ef}
.hero-copy{overflow:visible}
/* Cutouts retain original RGB and expose each chapter's palette. */
.identity-cast .actor-shell,.identity-cast .actor-shell:has(.sprite-reference){background:none;padding:0;border:0;box-shadow:none;min-height:0}
.identity-cast .cast-sprite{max-height:none;mix-blend-mode:normal;filter:drop-shadow(0 12px 12px #14212e18)}
.identity-cast .sprite-reference{max-width:370px;width:85%;margin:7vh auto 0}
.identity-cast .sprite-reference img{max-height:none;width:100%!important}
.identity-cast-label{font-size:14px;margin-top:22px;line-height:1.6}
.identity-cast .sprite-tgcf{width:min(78%,34vh)}
.identity-cast .sprite-link{width:min(72%,32vh)}
.voice-cast{transform:none;clip-path:none;right:3vw;top:28vh;width:52vw;opacity:1}
.voice-cast img{mask-image:linear-gradient(#000 0 90%,transparent 100%);-webkit-mask-image:linear-gradient(#000 0 90%,transparent 100%)}
.voice-cast span{background:none;text-align:right;padding:8px 2vw;font-size:12px}
.voice[data-state=own-voice] .voice-cast{opacity:.18;transform:translateX(5vw)}
.resource-cast{background:none;border-radius:0;padding:0;position:relative;inset:auto;width:min(18vw,26vh);margin:25px 0 0}
.resource-cast .cast-sprite{max-height:none}
.curtain-cast{background:none;padding:0;box-shadow:0 10px 30px #7c515115;transform:none;width:21vw;max-width:310px;right:4vw;bottom:18vh;opacity:1}
.curtain-cast img{filter:none;display:block;width:100%;height:auto}
/* The original Sanrio trio stays in the interests chapter. */
#channels .interest-sanrio{position:absolute;left:32%;bottom:1%;width:min(18vw,260px);z-index:2;margin:0;pointer-events:none}
#channels .sanrio-trio{position:relative;aspect-ratio:1.45;overflow:hidden;width:100%}
#channels .sanrio-trio img{position:absolute;width:300%;max-width:none;left:-200%;top:-90%;height:auto}
#channels .interest-sanrio figcaption{font-size:10px;text-align:center;margin-top:4px;letter-spacing:.08em}
#channels .interest-joys .interest-copy{top:2%}
#channels .interest-joys .interest-narrative{margin-top:15px}
#channels .interest-joys .interest-actions{margin-top:12px}
#channels .interest-joys .interest-art{right:0;width:48%;height:89%}
#channels .interest-joys .interest-lettering{left:30%}
@media(max-height:850px) and (min-width:901px){
 .hero-definition{bottom:20vh}.hero-definition p{font-size:15px}.definition-mark{font-size:19px}
 .hero-bottom .next-link{font-size:16px;padding:9px 18px 9px 9px}.hero-bottom .down-circle{height:38px;width:38px}
 .identity-cast .sprite-reference{margin-top:6vh;max-width:330px}
 #channels .interest-sanrio{left:36%;bottom:3%;width:16vw}
 #channels .interest-joys .interest-copy{top:6%}
 .curtain-cast{width:19vw;bottom:18vh}
}
@media(min-width:901px){
 .curtain-cast{bottom:calc(18vh + 60px)}
 .finale-bottom{position:absolute;left:6vw;right:6vw;bottom:8vh}
 .voice-turn,.low-motion .voice-turn{top:19vh}
 .low-motion .identity-stage{background:linear-gradient(150deg,#404d62,#998ea2 45%,#ddbeca)}
 .low-motion .identity .traits{padding-top:4vh}
 .low-motion .identity .trait{background:linear-gradient(100deg,#ddbeca88,#ddbeca20);border:0;border-top:1px solid #404d6240;padding:24px 20px;margin-bottom:28px;min-height:200px}
 .low-motion .identity .trait h3{font-size:clamp(45px,5vw,82px)}
 .low-motion .identity .trait h3 span{font-size:.72em}
 .low-motion .identity-cast .sprite-reference{margin-top:12vh}
 .low-motion #channels .interest-sanrio{left:8%;bottom:4%;width:20vw}
}
@media(max-width:900px){
 .room-photo #hero-art{position:absolute;bottom:0;left:0;height:70%;object-position:65% center;mask-image:linear-gradient(transparent,#000 10%);-webkit-mask-image:linear-gradient(transparent,#000 10%)}
 .opening{background:#d7e7f0}.room-photo{background:linear-gradient(145deg,#d7e7f0,#edf2ef 45%,#e7d6e1)!important}
 .room-photo:after{content:none}
 .hero-definition{position:absolute;top:365px;bottom:auto;left:6vw;right:auto;padding:0;gap:12px;text-align:left}
 .hero-definition:before{inset:-12px -24px}
 .hero-definition p{font-size:13px;line-height:1.7}.definition-mark{font-size:17px}
 .hero-bottom .next-link{padding:8px 18px 8px 8px;font-size:14px;gap:12px;backdrop-filter:none}
 .hero-prologue{top:88px;font-size:12px}
 .identity-stage,.low-motion .identity-stage{padding-top:285px;background:linear-gradient(180deg,#404d62,#998ea2 43%,#ddbeca);color:#f8f2ec}
 .identity-cast,.low-motion .identity-cast{width:100%;margin:0 auto}
 .identity-cast .sprite-reference,.low-motion .identity-cast .sprite-reference{width:85%;max-width:360px;margin:0 auto}
 .identity-cast-label{margin-top:18px;font-size:13px}
 .identity .traits,.low-motion .identity .traits{margin-top:48px;padding:0}
 .identity .trait,.low-motion .identity .trait{background:none;border:0;border-top:1px solid #404d624d;color:#19151e;padding:25px 0;margin-bottom:12px;min-height:200px}
 .identity .trait h3{font-size:38px}.identity .trait h3 span{font-size:29px}.identity .trait p{font-size:16px}
 .voice-cast{top:420px;width:100%;right:0;transform:none;clip-path:none}
 .voice-cast span{font-size:10px;padding-right:6vw}
 .resource-cast{background:none;padding:0;bottom:auto;margin-top:32px;width:58vw}
 .curtain-cast{right:8vw;bottom:160px;width:58vw;max-width:240px}
 #channels .interest-joys .interest-art{width:100%;height:350px}
 #channels .interest-joys .interest-copy{top:auto}
 #channels .interest-sanrio,.low-motion #channels .interest-sanrio{position:relative;inset:auto;width:70%;max-width:230px;align-self:center;margin:0 auto 26px}
#channels .sanrio-trio{aspect-ratio:1.45}
 #channels .interest-sanrio figcaption{font-size:10px}
}
