@font-face{font-family:WhisperDisplay;src:url('/fonts/ww-condensed.woff') format('woff');font-style:normal;font-weight:700;font-display:swap}
@font-face{font-family:WhisperSans;src:url('/fonts/ww-brand.woff') format('woff');font-style:normal;font-weight:700;font-display:swap}
:root{font-family:WhisperSans,Arial,sans-serif;font-synthesis:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
/* Deliberate hierarchy: quiet invitation, emphatic destination titles. */
body.entrance-page h1{font-family:WhisperSans,Arial,sans-serif;font-size:clamp(11px,1vw,14px);font-weight:700;line-height:1.5;letter-spacing:.23em;text-transform:uppercase;color:#e1e5e5c9;top:18%;text-shadow:0 2px 18px #0008}
.entrance-page header{top:42px}.entrance-page header img{width:clamp(240px,27vw,390px)}
.choice{left:12%;right:12%;bottom:12%;align-items:center;padding-top:27px;border-top:1px solid #e6edf132}
.choice h2{font-family:WhisperDisplay,'Arial Narrow',Arial,sans-serif;font-weight:700;font-size:clamp(68px,7.8vw,146px);line-height:.95;letter-spacing:-.015em;text-transform:uppercase;text-shadow:0 3px 35px #0005}
.choice>span{width:48px;height:48px;flex-shrink:0;border-color:#e5edf04d;background:#111a211c;backdrop-filter:blur(5px)}
.direction-icon{width:18px;height:18px;display:block;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:square;stroke-linejoin:miter}
.portal:hover .choice,.portal:focus-visible .choice{border-color:#e6edf178}
.collection-page h1{font-family:WhisperSans,Arial,sans-serif;font-size:12px;font-weight:700;letter-spacing:.28em;text-transform:uppercase;line-height:1.5;margin-top:20px;color:#c2cbd0}
.collection-page .brand img{width:300px}
.world span{font-family:WhisperDisplay,'Arial Narrow',Arial,sans-serif;font-size:clamp(25px,2.7vw,42px);font-weight:700;line-height:1.04;letter-spacing:.025em;text-transform:uppercase;bottom:24px;left:24px;text-shadow:0 2px 18px #0005}
.story-copy h2{font-family:WhisperDisplay,'Arial Narrow',Arial,sans-serif;font-size:clamp(60px,10vw,155px);font-weight:700;line-height:.93;letter-spacing:.015em;margin:22px 0 31px}
.story-copy p{font-family:WhisperSans,Arial,sans-serif;font-weight:700;font-size:9px;letter-spacing:.24em}
.story-copy span{font-family:WhisperSans,Arial,sans-serif;font-size:10px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;align-items:center;width:173px;padding-bottom:16px}
.motion-label{font-family:Arial,sans-serif}.back,.leave{display:grid;place-items:center}.back .direction-icon,.leave .direction-icon{transform:rotate(-135deg)}
@media(max-width:700px){.entrance-page header{top:23px}.entrance-page header img{width:235px}.entrance-page h1{top:113px;font-size:10px;letter-spacing:.18em}.choice{left:29px;right:29px;bottom:31px;padding-top:19px}.choice h2{font-size:clamp(57px,17vw,85px);letter-spacing:-.015em}.choice>span{width:40px;height:40px}.chill .choice{bottom:60px}.world span{font-size:clamp(22px,6.2vw,32px);left:16px;bottom:19px;letter-spacing:.015em}.collection-page .brand img{width:205px}.collection-page h1{font-size:10px;margin-top:16px}.story-copy h2{font-size:clamp(48px,13.8vw,85px);letter-spacing:0}.story-copy p{font-size:8px;letter-spacing:.17em}.story-copy span{font-size:9px}.collection-page .back{top:26px}.back .direction-icon{width:17px;height:17px}}
@media(min-width:701px) and (max-width:1000px){.choice h2{font-size:8.2vw}.choice{left:10%;right:10%;gap:12px}.choice>span{width:39px;height:39px}}
/* Phone layouts: explicit fit, touch targets, and screen cutout clearance. */
@media(max-width:700px){
 .entrance-page main{height:100svh;min-height:560px}
 .entrance-page header{top:max(20px,env(safe-area-inset-top))}
 .entrance-page h1{top:max(105px,calc(env(safe-area-inset-top) + 85px));font-size:10px}
 .choice{left:24px;right:24px;gap:12px;padding-top:16px}
 .choice h2{font-size:clamp(48px,15vw,76px)}
 .choice>span{width:44px;height:44px}
 .chill .choice{bottom:max(64px,calc(env(safe-area-inset-bottom) + 52px))}
 .collection-page header{padding-top:max(30px,env(safe-area-inset-top));padding-left:60px;padding-right:60px}
 .collection-page .brand img{width:min(205px,calc(100vw - 130px))}
 .collection-page .back{width:44px;height:44px;padding:12px;left:max(8px,env(safe-area-inset-left));top:max(22px,env(safe-area-inset-top))}
 .world-grid{padding-bottom:max(28px,env(safe-area-inset-bottom))}
 .world span{overflow-wrap:normal;font-size:clamp(22px,6vw,31px);right:12px}
 .leave{top:max(20px,env(safe-area-inset-top));left:max(20px,env(safe-area-inset-left))}
 #status{bottom:max(24px,env(safe-area-inset-bottom))}
 .story-copy h2{font-size:clamp(41px,13vw,85px)}
}
@media(max-width:380px){.world-grid{gap:10px;padding-left:14px;padding-right:14px}.world span{left:12px;bottom:16px}.entrance-page header img{width:215px}.story-copy{left:21px}.story-copy p{letter-spacing:.11em}}
@media(max-height:500px) and (orientation:landscape){
 .entrance-page main{min-height:360px;height:100svh}
 .entrance-page header{top:12px}.entrance-page header img{width:200px}
 .entrance-page h1{top:81px;font-size:9px}
 .portals{flex-direction:row}.portal,.explore{flex:1!important}
 .choice,.chill .choice{bottom:54px;left:26px;right:26px}
 .choice h2{font-size:clamp(45px,7vw,68px)}
}

/* Fine cinematic framing: detail lives in the worlds, not extra UI. */
.entrance-page .scene img{filter:saturate(.9) contrast(1.025)}
.entrance-page .living-fire{filter:saturate(.9) contrast(1.025)}
.portal:before{content:'';position:absolute;inset:16px;z-index:1;pointer-events:none;border:1px solid #e6e9df14;mask-image:linear-gradient(black,transparent 30%,transparent 75%,black)}
.explore{border-right:1px solid #d9e7ea24}
.explore .shade{background:linear-gradient(180deg,#050b14b8 0%,#060d145c 24%,transparent 43%,#070d1412 62%,#060a12b0 100%)}
.chill .shade{background:linear-gradient(180deg,#060b14b8 0%,#060d145c 24%,transparent 43%,#0d080b10 62%,#070a11b8 100%)}
.choice{border-image:linear-gradient(90deg,#e6edf160,#e6edf116) 1}
.chill .choice{border-image:linear-gradient(90deg,#eac49660,#eac49616) 1}
.world,.story{box-shadow:inset 0 0 0 1px #e3e9ed18}
.world img{filter:brightness(.94) saturate(.92)}
.world:after{box-shadow:inset 0 0 0 1px #e3e9ed1c;background:linear-gradient(transparent 47%,#04080cc7)}
.story:after{box-shadow:inset 0 0 0 1px #e3e9ed24}
.explore .scene{animation-duration:21s}.chill .scene{animation-duration:24s}
.mist{opacity:.32;animation-duration:23s}.mist.second{opacity:.19;animation-duration:31s}
.ember{width:2px;height:2px}.smoke i{background:radial-gradient(ellipse,#b7b9ad30,transparent 65%)}
@media(max-width:700px){.portal:before{inset:10px}.explore{border-right:0;border-bottom:1px solid #d9e7ea24}.entrance-page .scene img{filter:saturate(.9)}.entrance-page .living-fire{filter:saturate(.9)}}

/* Entrance brand lockup and concise audience-facing explanation. */
.entrance-page .brand-descriptor{display:block;margin-top:10px;font:700 10px/1.4 WhisperSans,Arial,sans-serif;letter-spacing:.45em;padding-left:.45em;color:#eeeae2}
body.entrance-page .entrance-explainer{top:clamp(150px,21vh,210px);font:400 clamp(12px,1.1vw,15px)/1.7 Arial,sans-serif;letter-spacing:.055em;text-transform:none;color:#eeeae2d9;text-wrap:balance}
@media(max-width:700px){.entrance-page .brand-descriptor{font-size:8px;margin-top:8px}body.entrance-page .entrance-explainer{top:max(120px,calc(env(safe-area-inset-top) + 100px));left:32px;right:32px;font-size:11px;letter-spacing:.025em;max-width:310px;margin:auto}}
@media(max-height:500px) and (orientation:landscape){.entrance-page .brand-descriptor{font-size:7px;margin-top:5px}body.entrance-page .entrance-explainer{top:102px;font-size:10px}}

/* Mobile first: understated navigation at the edge of each world. */
@media(max-width:700px){
 .entrance-page header{top:max(18px,env(safe-area-inset-top))}
 .entrance-page header img{width:clamp(180px,49vw,220px)}
 .entrance-page header a{padding:8px}
 .entrance-page .brand-descriptor{font-size:7px;letter-spacing:.38em;margin-top:6px}
 body.entrance-page .entrance-explainer{top:max(94px,calc(env(safe-area-inset-top) + 76px));max-width:260px;left:28px;right:28px;font-size:11px;line-height:1.55;letter-spacing:.01em;color:#eeeae2ba}
 .entrance-page .choice{left:24px;right:auto;bottom:24px;gap:12px;padding:0;min-height:44px;border:0;border-image:none;justify-content:flex-start}
 .entrance-page .choice h2{font-size:clamp(28px,7.5vw,36px);line-height:1.1;letter-spacing:.035em;text-shadow:0 2px 16px #0009}
 .entrance-page .choice>span{width:24px;height:24px;border:0;background:none;backdrop-filter:none}
 .entrance-page .choice .direction-icon{width:16px;height:16px}
 .entrance-page .chill .choice{bottom:max(24px,calc(env(safe-area-inset-bottom) + 16px))}
 .entrance-page .portal:before{display:none}
 .entrance-page .explore .shade{background:linear-gradient(180deg,#050b14b8 0%,#060d145c 25%,transparent 44%,transparent 70%,#060a1299 100%)}
 .entrance-page .chill .shade{background:linear-gradient(180deg,#060b1426,transparent 24%,transparent 70%,#070a1199)}
}

/* Clear destination labels with quiet descriptive subtitles. */
.entrance-page .choice-copy p{margin:12px 0 0;font:400 clamp(12px,1.1vw,15px)/1.5 Arial,sans-serif;letter-spacing:.04em;color:#eeeae2ce;text-shadow:0 2px 12px #0009}
@media(max-width:700px){.entrance-page .choice-copy p{margin-top:6px;font-size:11px;line-height:1.45;letter-spacing:.025em}.entrance-page .choice{align-items:flex-start}.entrance-page .choice>span{margin-top:4px}}

/* Keep CHILL tightly grouped with its parent wordmark. */
.chill-collection header .brand{display:block;width:fit-content;margin-inline:auto}
.chill-collection header h1{margin-top:4px}

/* Destination wordmarks: compact, uppercase descriptors. */
.entrance-page .choice-copy p{margin-top:3px;font:700 clamp(9px,.8vw,12px)/1.4 WhisperSans,Arial,sans-serif;letter-spacing:.16em;text-transform:uppercase}
.portal-slot{position:relative;display:flex;flex:1;min-width:0;transition:flex 1.3s ease}
.portal-slot>.portal{display:block;flex:1}
.portals:has(.portal-slot:hover) .portal-slot:hover{flex:1.07}
.sound-preview{position:absolute;right:24px;bottom:22px;z-index:4;display:flex;align-items:center;gap:7px;min-height:44px;padding:8px 12px;border:1px solid #eeeae233;border-radius:24px;background:#080d1270;backdrop-filter:blur(8px);color:#eeeae2;font:10px Arial,sans-serif;cursor:pointer}
.sound-preview svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linejoin:round}
.sound-preview[aria-pressed=true]{border-color:#eac48c99;color:#f5d6a9}
.entrance-page #motion{right:auto;left:50%;transform:translateX(-50%)}
#audio-notice{position:fixed;left:16px;right:16px;bottom:72px;text-align:center;z-index:5;font:12px Arial,sans-serif;pointer-events:none;color:#fff;text-shadow:0 2px 6px #000}
#audio-notice:empty{display:none}
@media(max-width:700px){
 .portal-slot{flex:1!important;min-height:0}.explore-slot{flex:1.15!important}
 .entrance-page .choice-copy p{margin-top:2px;font-size:8px;letter-spacing:.12em}
 .sound-preview{right:18px;bottom:max(22px,calc(env(safe-area-inset-bottom) + 14px));width:44px;height:44px;padding:0;justify-content:center}
 .sound-preview span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
 .entrance-page #motion{left:auto;right:18px;bottom:max(78px,calc(env(safe-area-inset-bottom) + 70px));transform:none}
 .entrance-page .choice{right:76px}.entrance-page .choice>span{display:none}
}
@media(max-height:500px) and (orientation:landscape){.portal-slot,.explore-slot{flex:1!important}}