@font-face{font-family:MirageTitle;src:url('assets/title.woff') format('woff');font-weight:900;font-display:swap}
:root{--ink:#172337;--paper:#f9fafb;--accent:#ff8f92;--night:#101825;--muted:#8b9bb3;font-family:'Segoe UI','Malgun Gothic',sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:40px}body{margin:0}body.locked{overflow:hidden}a{color:inherit;text-decoration:none}button{font:inherit;border:0;cursor:pointer}img{display:block;max-width:100%}h1,h2,h3,p,figure{margin:0}h1,h2,h3{font-family:MirageTitle,'Malgun Gothic',sans-serif;font-weight:900}em{font-style:normal}button,a,input{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,input:focus-visible,[tabindex]:focus-visible{outline:2px solid #ffad8c;outline-offset:6px}#main:focus{outline:none}[hidden]{display:none!important}.skip-link{position:fixed;top:-70px;left:15px;z-index:100;background:white;padding:15px}.skip-link:focus{top:15px}.locked .skip-link{display:none}.button{display:inline-flex;align-items:center;justify-content:space-between;gap:65px;padding:20px 26px;min-height:62px;font-size:14px;font-weight:700;background:var(--accent);color:#202a3b;border-radius:2px;transition:background .25s,transform .25s}.button span{font-size:22px;line-height:1}.button:hover{background:#ffb9b4;transform:translateY(-3px)}.text-button{background:transparent;color:inherit;border-bottom:1px solid currentColor;padding:10px 0;font-size:12px}.eyebrow,.small-label{font-size:10px;font-weight:600;letter-spacing:2px;line-height:1.9}
/* Entrance */
.gate{position:fixed;inset:0;z-index:30;overflow:hidden;background:#a4b7c8;color:#fff;display:flex;flex-direction:column;justify-content:space-between;padding:35px 5vw}.gate-backdrop{position:absolute;inset:-15px;background:linear-gradient(0deg,#17233799,#36425918 80%),url('assets/school.webp?v=4') center/cover;filter:blur(3px)}.gate-grid{position:absolute;inset:18px;border:1px solid #ffffff50;pointer-events:none}.gate-note,.gate-bottom{position:relative;font-size:9px;letter-spacing:2px}.gate-center{position:relative;text-align:center;max-width:100%;text-shadow:0 2px 30px #15283c30}.gate-center .small-label{letter-spacing:3px;color:#fff9ef}.gate h1{font-size:clamp(55px,8vw,118px);letter-spacing:-6px;line-height:1.1;margin:24px 0 28px;color:#fffdf4}.gate h1 span{color:#ffd4cb}.gate h1 i{font-style:normal;font-family:serif;font-size:28px;position:absolute;margin-left:6px;top:10%}.gate-center p{font-size:16px;font-weight:400;letter-spacing:1px;margin-bottom:40px}.gate-actions{display:flex;justify-content:center;align-items:center;gap:30px;text-shadow:none}.gate-actions .primary{padding:18px 25px;font-size:13px;gap:30px}.gate-actions .text-button{color:#fff9f0}.sound-choice{display:inline-flex;align-items:center;gap:8px;font-size:10px;color:#fff8ef;margin-top:26px}.sound-choice input{accent-color:#e88c8f}.gate-bottom{display:flex;justify-content:space-between;color:#fff7e4a6}
/* Opening: full-screen scenery, light cuts and typography. */
.opening{position:fixed;inset:0;z-index:40;background:#a4b7c8;color:#fff;overflow:hidden}.op-paper{position:absolute;inset:0;background:url('assets/school.webp?v=4') center/cover}.op-paper:after{content:'';position:absolute;inset:0;background:#1e2d4240}.op-rule{position:absolute;inset:24px;z-index:5;border:1px solid #fff8e650;pointer-events:none}.op-topline{position:absolute;left:6%;right:6%;top:6%;display:flex;justify-content:space-between;z-index:6;font-size:9px;letter-spacing:3px;color:#fff8ec}.op-scenes{position:absolute;inset:0}.op-scene{position:absolute;inset:0;opacity:0;transform:scale(1.08);transition:opacity .75s,transform 3s ease;overflow:hidden}.op-scene img{width:100%;height:100%;object-fit:cover}.op-scene:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#15233777,transparent 70%)}.op-scene figcaption{display:none}.opening[data-step='1'] .scene-school,.opening[data-step='2'] .scene-club,.opening[data-step='3'] .scene-roof,.opening[data-step='4'] .scene-roof{opacity:1;transform:scale(1)}.op-words{position:absolute;inset:0;z-index:4;pointer-events:none}.op-word{position:absolute;bottom:15%;left:9%;font-family:MirageTitle,sans-serif;font-size:clamp(32px,4.5vw,68px);font-weight:900;letter-spacing:-3px;color:#fff9f1;text-shadow:0 2px 30px #24375245;opacity:0;transform:translateY(25px);transition:opacity .4s,transform .7s}.word-two{left:auto;right:10%}.opening[data-step='1'] .word-one,.opening[data-step='2'] .word-two,.opening[data-step='3'] .word-three{opacity:1;transform:none}.op-brand{position:absolute;inset:0;z-index:5;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;background:#16233930;opacity:0;transform:translateY(30px);transition:opacity .8s,transform 1s}.op-brand strong{font-family:MirageTitle,sans-serif;font-weight:900;font-size:clamp(47px,8vw,118px);letter-spacing:-6px;color:#fff6eb;margin:24px 0}.op-brand i{font-style:normal;color:#ffc8bd;font-size:30px;position:absolute;margin-left:8px}.op-brand>span{font-size:10px;letter-spacing:4px}.op-brand p{font-size:14px;letter-spacing:4px}.opening[data-step='4'] .op-brand{opacity:1;transform:none}.opening-skip{position:absolute;bottom:5%;right:5%;z-index:7;color:#fff8ef;background:#1723375c;border:1px solid #ffffff55;border-radius:2px;padding:12px 18px;font-size:10px}.opening-progress{position:absolute;left:0;bottom:0;z-index:8;height:2px;width:calc(var(--progress,0)*100%);background:#ffd7cb}
/* Hero */
.header{position:absolute;top:0;left:0;right:0;height:100px;z-index:9;padding:0 5vw;display:flex;align-items:center;justify-content:space-between;color:#fffaf1}.wordmark{font-family:MirageTitle,sans-serif;font-size:22px;letter-spacing:-1px;text-shadow:0 2px 15px #15233745}.wordmark span{font-family:serif;font-size:18px;color:#ffd0c5;margin-left:8px}.header nav{display:flex;align-items:center;gap:35px;font-size:12px}.header nav a{padding:10px 0;border-bottom:1px solid transparent;transition:border-color .25s}.header nav a:hover{border-color:#fff5eb}.header .nav-chat{padding:12px 20px;border:1px solid #fff9ee75}.hero{height:100svh;min-height:760px;max-height:1150px;position:relative;overflow:hidden;color:#fff8ef;display:flex;align-items:center;padding:105px 9vw 130px;background:#bdc0c6}.hero-backdrop{position:absolute;inset:0}.hero-backdrop img{height:100%;width:100%;object-fit:cover;object-position:center}.hero-backdrop:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#18253682,transparent 75%),linear-gradient(0deg,#172a4590,transparent 50%)}.hero-copy{position:relative;z-index:2;padding-top:50px;width:70%}.hero-copy .eyebrow{font-size:10px;letter-spacing:2px;color:#fff0ddd9;margin-bottom:18px}.hero-copy .eyebrow>span{display:none}.hero-invitation{font-size:17px;letter-spacing:.5px;margin-bottom:26px;color:#fff4e2}.hero h1{font-size:clamp(80px,9.5vw,148px);font-weight:900;line-height:.98;letter-spacing:-7px;position:relative;text-shadow:0 8px 45px #29344925;margin-bottom:34px}.hero h1 em{color:#ffd0c5}.hero-title-star{font-family:serif;position:absolute;margin-left:10px;font-size:45px;top:9px;color:#fff2cb}.hero-copy p{font-size:13px;line-height:2;letter-spacing:.1px;margin-bottom:27px;color:#fff3e9e0}.hero-copy .button{font-size:13px;min-width:220px;gap:55px}.hero-tags{display:flex;gap:18px;font-size:9px;letter-spacing:1px;margin-top:25px;color:#fff4dcaa}.hero-tags span:before{content:'#';margin-right:3px}.hero-side-note{position:absolute;right:8%;top:36%;z-index:2;text-align:center;transform:rotate(-10deg)}.hero-side-note>span{display:block;font:italic clamp(50px,6vw,90px) Georgia,serif;color:#fff8e87a;line-height:1.1}.hero-side-note small{display:block;font-size:10px;letter-spacing:3px;color:#fff8e799;margin-top:15px}.scroll-cue{position:absolute;bottom:34px;left:5vw;right:5vw;display:flex;justify-content:space-between;align-items:center;font-size:25px;border-top:1px solid #fff6e850;padding-top:20px;z-index:3}.scroll-cue span{font-size:10px;letter-spacing:2px}.ticker{height:57px;display:flex;align-items:center;background:#fffaf3;color:#ad777e;overflow:hidden;font-size:10px;letter-spacing:3px;white-space:nowrap}.ticker>div{width:max-content;animation:ticker 45s linear infinite}@keyframes ticker{to{transform:translateX(-50%)}}
/* Scrolling story */
.story{height:320svh;position:relative;background:#f5e5d6}.story-stage{position:sticky;top:0;height:100svh;overflow:hidden;color:#fff5ed;background:#111b2e}.story-bg{position:absolute;inset:0;background-position:center;background-size:cover;transition:opacity 1.3s,filter 1.3s,transform 2s}.story-bg.day{background-image:url('assets/clubroom.webp?v=4');filter:saturate(.85);transform:scale(1.02)}.story-bg.dusk{background-image:url('assets/corridor.webp?v=4');opacity:0;filter:saturate(.3) brightness(.42) hue-rotate(-14deg);transform:scale(1.08)}.story-shade{position:absolute;inset:0;background:#51323845;transition:background 1.3s}.story-stage[data-scene='1'] .day,.story-stage[data-scene='2'] .day{opacity:0}.story-stage[data-scene='1'] .dusk,.story-stage[data-scene='2'] .dusk{opacity:1;transform:scale(1)}.story-stage[data-scene='1'] .story-shade{background:#121b2c75}.story-stage[data-scene='2'] .story-shade{background:#101825c9}.story-label{position:absolute;top:40px;left:5vw;right:5vw;display:flex;justify-content:space-between;font-size:9px;letter-spacing:3px;border-bottom:1px solid #fff5eb40;padding-bottom:24px;z-index:2}.story-slide{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;opacity:0;visibility:hidden;transition:opacity .8s,visibility .8s;padding:80px 25px;text-align:center}.story-slide.active{opacity:1;visibility:visible}.story-overline{font-size:10px;letter-spacing:3px;color:#fff3e3c0;margin-bottom:36px}.story-slide h2{font-size:clamp(45px,6.5vw,100px);letter-spacing:-5px;line-height:1.35;transition:transform 1.2s cubic-bezier(.2,.8,.2,1);font-weight:900}.from-left{transform:translateX(-140px)}.from-right{transform:translateX(140px)}.active .from-left,.active .from-right{transform:none}.story-slide p{margin-top:35px;line-height:2;font-size:14px;color:#fff8efbf}.story-stage[data-scene='1'] .story-overline{color:#efb8b4}.story-stage[data-scene='1'] h2{color:#f9c7c1}.story-footer{position:absolute;left:5vw;right:5vw;bottom:38px;display:flex;align-items:center;justify-content:space-between;font-size:9px;letter-spacing:2px}.story-dots{display:flex;gap:8px}.story-dots i{width:18px;height:2px;background:#fff9ef35;transition:width .4s,background .4s}.story-dots .active{width:50px;background:#ffd2c5}
/* Members */
.section-space{padding:110px 8vw}.members{background:var(--night);color:#f2f4f7}.section-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:50px}.section-heading .eyebrow{font-size:9px;letter-spacing:3px;color:#8391a9}.section-heading h2{font-size:clamp(35px,4.5vw,65px);letter-spacing:-3px;line-height:1.3;margin-top:20px}.section-heading h2 em{color:#ffb6b3}.section-heading>p{font-size:12px;line-height:1.9;text-align:right;color:#8594ac}.member-tabs{display:grid;grid-template-columns:repeat(6,1fr);border-top:1px solid #ffffff20;border-bottom:1px solid #ffffff20;margin-bottom:55px}.member-tabs button{background:none;color:#7f90a8;padding:20px 10px;font-size:14px;position:relative;transition:color .3s}.member-tabs button:before{content:'';position:absolute;bottom:-1px;left:0;right:0;height:2px;background:#ffbab4;transform:scaleX(0);transition:transform .3s}.member-tabs button[aria-selected='true']{color:#ffc5be}.member-tabs button[aria-selected='true']:before{transform:scaleX(1)}.member-panel{display:grid;grid-template-columns:1.32fr 1fr;gap:6vw;align-items:center;min-height:440px}.member-art{width:100%;position:relative;border:1px solid #ffffff20;background:#151d2a;overflow:hidden}.member-art img{width:100%;height:auto;aspect-ratio:4/3;object-fit:contain}.member-number{display:none}.member-copy{padding:20px 0}.member-copy .eyebrow{font-size:10px;letter-spacing:1px;color:#a4b1c4}.member-copy h3{font-size:60px;letter-spacing:-3px;margin:15px 0 21px;color:#fff2ec}.member-title{color:#ffb1ad;font-size:17px;font-weight:600;line-height:1.8;margin-bottom:24px;word-break:keep-all}.member-description{font-size:13px;line-height:2.2;color:#9daac0;white-space:pre-line;word-break:keep-all}.member-tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:28px}.member-tags span{border:1px solid #ffffff25;color:#a5b2c5;padding:8px 11px;font-size:9px;border-radius:1px}.member-footnote{font-size:10px;color:#556981;margin-top:35px;padding-top:18px;border-top:1px solid #ffffff18}
/* Club and invitation */
.world-section{background:#141e2c;color:#f5f0eb;display:grid;grid-template-columns:1.2fr 1fr;gap:8vw;align-items:center;border-top:1px solid #ffffff0a}.case-image{position:relative;overflow:hidden;box-shadow:none}.case-image img{width:100%;height:420px;object-fit:cover;object-position:52%}.case-image span{position:absolute;left:20px;bottom:20px;font-size:9px;letter-spacing:2px;background:#121a29b0;color:#e7ded9;padding:12px 15px}.case-copy .eyebrow{font-size:9px;color:#7e91ab;letter-spacing:2px}.case-copy h2{font-size:clamp(38px,4.5vw,66px);letter-spacing:-3px;line-height:1.3;margin:24px 0}.case-copy h2 em{color:#ffb5ae}.case-copy p{font-size:12px;color:#a5b2c5;line-height:2.2;word-break:keep-all}.case-copy .case-small{font-size:11px;color:#7d8fa8;margin-top:25px}.join{position:relative;overflow:hidden;color:#fff3e8;text-align:center;padding:115px 25px;background:linear-gradient(0deg,#101825cc,#18284088),url('assets/rooftop.webp?v=4') center/cover}.join .eyebrow{color:#ffc1b0;font-size:11px;letter-spacing:2px}.join h2{font-size:clamp(58px,7vw,100px);line-height:1.18;letter-spacing:-5px;margin:30px 0}.join p{font-size:13px;line-height:2;color:#d0cfce;margin-bottom:35px}.join .light{min-width:260px}.join-star{display:none}footer{display:flex;align-items:center;justify-content:space-between;padding:35px 5vw;background:#101825;color:#7a8ba4;font-size:12px}footer small{font-size:9px;color:#4d607a;margin-left:15px}footer .text-button{font-size:10px}.music-toggle{position:fixed;bottom:22px;right:25px;z-index:50;border:1px solid #ffffff50;background:#111c30d9;backdrop-filter:blur(15px);border-radius:2px;color:#fff3e8;padding:12px 17px;display:flex;gap:12px;align-items:center;font-size:8px;letter-spacing:1.5px}.equalizer{height:14px;display:flex;align-items:center;gap:3px}.equalizer i{height:3px;width:2px;background:#ffc4bb}.music-toggle[aria-pressed='true'] i{animation:equalize .8s ease-in-out infinite alternate}.equalizer i:nth-child(2){animation-delay:-.4s}.equalizer i:nth-child(3){animation-delay:-.2s}.equalizer i:nth-child(4){animation-delay:-.6s}@keyframes equalize{to{height:14px}}.audio-notice{position:fixed;bottom:70px;right:25px;z-index:60;color:#fff;background:#101825;font-size:11px;max-width:260px}.audio-notice:not(:empty){padding:15px}.reveal{opacity:0;transform:translateY(35px);transition:opacity .9s,transform .9s}.reveal.visible{opacity:1;transform:none}.noscript{position:fixed;top:0;background:white;color:black;padding:15px;z-index:100}
@media(min-width:1600px){.section-space{padding-left:max(8vw,calc((100vw - 1450px)/2));padding-right:max(8vw,calc((100vw - 1450px)/2))}.hero-copy{padding-top:20px}.hero h1{font-size:145px}}
@media(max-width:1000px){.hero{min-height:760px}.hero-copy{width:80%}.hero-side-note{right:8%;top:29%}.hero-side-note>span{font-size:60px}.member-panel{gap:35px;grid-template-columns:1.15fr 1fr}.member-copy h3{font-size:46px}.member-title{font-size:15px}.member-description{font-size:12px}.case-image img{height:380px}.world-section{gap:35px}.section-space{padding:85px 6vw}.member-footnote{margin-top:22px}}
@media(max-width:600px){.gate{padding:30px 7vw}.gate-grid{inset:12px}.gate-note{font-size:7px;letter-spacing:1px}.gate h1{font-size:55px;letter-spacing:-3px;margin:22px 0}.gate h1 i{font-size:16px;top:19%;margin-left:2px}.gate-center .small-label{font-size:9px;letter-spacing:2px}.gate-center p{font-size:12px}.gate-actions{flex-direction:column;gap:18px}.gate-actions .primary{min-height:56px;padding:18px 22px;font-size:12px}.gate-bottom{font-size:8px;letter-spacing:.5px}.gate-bottom span:last-child{display:none}.sound-choice{font-size:9px}.header{height:82px;padding:0 6vw}.wordmark{font-size:17px}.wordmark span{font-size:13px;margin-left:4px}.header nav{gap:17px;font-size:10px}.header .nav-chat{display:none}.hero{height:100svh;min-height:740px;max-height:none;padding:120px 8vw 135px;align-items:center}.hero-backdrop img{object-position:52%}.hero-backdrop:after{background:linear-gradient(90deg,#17253e4d,transparent),linear-gradient(0deg,#172b459c,transparent 75%)}.hero-copy{width:100%;padding-top:30px}.hero-copy .eyebrow{font-size:8px;letter-spacing:1px;margin-bottom:16px}.hero-invitation{font-size:13px;margin-bottom:23px}.hero h1{font-size:90px;letter-spacing:-5px;line-height:.98;margin-bottom:29px}.hero-title-star{font-size:28px;margin-left:6px;top:5px}.hero-copy p{font-size:10px;line-height:2;margin-bottom:25px}.hero-copy .button{font-size:11px;min-width:190px;min-height:55px;padding:18px 22px}.hero-copy .button span{font-size:18px}.hero-tags{font-size:7px;gap:12px;margin-top:22px;letter-spacing:.3px}.hero-side-note{right:10%;top:20%;transform:rotate(-12deg)}.hero-side-note>span{font-size:35px;color:#fff8e888}.hero-side-note small{display:none}.scroll-cue{bottom:23px;left:6vw;right:6vw;padding-top:18px;font-size:22px}.scroll-cue span{font-size:8px}.ticker{height:42px;font-size:8px;letter-spacing:2px}.story{height:300svh}.story-label{top:26px;font-size:7px;padding-bottom:18px}.story-slide h2{font-size:43px;letter-spacing:-3px}.story-overline{font-size:8px;letter-spacing:1px;margin-bottom:27px}.story-slide p{font-size:11px;margin-top:27px}.story-footer{bottom:30px;font-size:7px;letter-spacing:1px}.story-dots i{width:12px}.story-dots .active{width:32px}.section-space{padding:65px 6vw}.section-heading{align-items:start;margin-bottom:32px}.section-heading .eyebrow{font-size:7px;letter-spacing:1px}.section-heading h2{font-size:38px;letter-spacing:-2px;margin-top:18px}.section-heading>p{display:none}.member-tabs{grid-template-columns:repeat(3,1fr);margin-bottom:27px}.member-tabs button{font-size:12px;padding:17px 5px}.member-panel{grid-template-columns:1fr;gap:23px;min-height:0}.member-copy{padding:0 5px}.member-copy h3{font-size:46px;letter-spacing:-3px;margin:10px 0 16px}.member-copy .eyebrow{font-size:9px}.member-title{font-size:16px;margin-bottom:18px}.member-description{font-size:12px;line-height:2.2}.member-tags{margin-top:20px}.member-footnote{font-size:8px;margin-top:25px}.world-section{grid-template-columns:1fr;gap:38px}.case-image img{height:260px}.case-image span{left:12px;bottom:12px;font-size:7px;padding:10px}.case-copy h2{font-size:46px}.case-copy p{font-size:11px}.case-copy .case-small{font-size:10px}.join{padding:80px 20px}.join .eyebrow{font-size:9px;letter-spacing:1px}.join h2{font-size:65px;letter-spacing:-4px}.join p{font-size:11px}.join .button{min-width:240px;min-height:58px;font-size:12px;gap:25px}.op-rule{inset:14px}.op-topline{top:6%;left:8%;right:8%;font-size:7px;letter-spacing:1px}.op-topline span:last-child{display:none}.op-word{font-size:33px;left:9%;bottom:20%;letter-spacing:-2px}.word-two{right:9%;left:auto}.word-three{font-size:29px}.op-brand strong{font-size:49px;letter-spacing:-3px}.op-brand i{font-size:18px;margin-left:3px}.op-brand>span{font-size:7px;letter-spacing:2px}.op-brand p{font-size:11px;letter-spacing:3px}.opening-skip{font-size:9px;bottom:8%;right:8%;padding:10px 12px}footer{padding:28px 6vw 85px;font-size:11px}footer small{display:block;margin:8px 0 0;font-size:8px}footer .text-button{font-size:9px}.music-toggle{bottom:15px;right:16px;font-size:7px;padding:10px 14px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.story{height:auto}.story-stage{position:relative;height:auto}.story-slide{position:relative;min-height:65svh;opacity:1;visibility:visible}.story-label,.story-footer{display:none}.story-bg.dusk{display:none}.story-bg.day{opacity:.8!important}.story-shade{background:#202f45aa!important}.from-left,.from-right,.reveal{transform:none}.reveal{opacity:1}}
/* Automatic opening and the entrance curtain. */
#site{opacity:0;visibility:hidden;pointer-events:none}
#site.is-visible{opacity:1;visibility:visible;pointer-events:auto}
.opening{clip-path:inset(0);transition:clip-path 1.35s cubic-bezier(.76,0,.24,1),opacity 1.1s,transform 1.35s cubic-bezier(.76,0,.24,1)}
.opening.is-exiting{clip-path:inset(0 0 100% 0);transform:translateY(-9%);opacity:0}
.opening.is-ready .op-brand{transform:translateY(-55px)}
.opening-actions{position:absolute;top:calc(50% + 105px);left:0;right:0;display:flex;align-items:center;justify-content:center;gap:35px;z-index:8;animation:entry-choice .7s both}
.opening-actions .button{min-width:190px;justify-content:space-between;background:#ffb2a8;color:#182638}
.opening-actions .text-button{color:#fff8ef;font-size:12px;padding:12px 0}
.opening-actions button:disabled{cursor:default}
.entry-veil{position:fixed;inset:0;z-index:45;pointer-events:none;transform:translateY(110%);background:linear-gradient(0deg,transparent 25%,#fff7e052 48%,#fff5df12 60%,transparent 80%);opacity:0}
.is-entering .entry-veil{animation:entrance-light 1.4s cubic-bezier(.3,.7,.2,1) both}
.hero-backdrop img{transform:scale(1.075);transition:transform 2s cubic-bezier(.2,.8,.2,1)}
.site-entered .hero-backdrop img{transform:scale(1)}
.hero-copy>*{opacity:0;transform:translateY(24px);transition:opacity .85s,transform 1.1s cubic-bezier(.2,.8,.2,1)}
.site-entered .hero-copy>*{opacity:1;transform:none}
.site-entered .hero-copy .eyebrow{transition-delay:.5s}.site-entered .hero-invitation{transition-delay:.65s}.site-entered .hero-copy h1{transition-delay:.8s}.site-entered .hero-copy p{transition-delay:.95s}.site-entered .hero-copy .button{transition-delay:1.1s}.site-entered .hero-tags{transition-delay:1.25s}
.header,.hero-side-note,.scroll-cue{opacity:0;transition:opacity 1.2s .9s}.site-entered .header,.site-entered .hero-side-note,.site-entered .scroll-cue{opacity:1}
@keyframes entry-choice{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes entrance-light{0%{opacity:0;transform:translateY(75%)}25%{opacity:1}100%{opacity:0;transform:translateY(-100%)}}
@media(max-width:600px){.opening-actions{top:calc(50% + 85px);gap:25px;flex-direction:column}.opening-actions .button{min-width:200px;min-height:56px;padding:17px 22px;font-size:12px}.opening-actions .text-button{font-size:11px}.opening.is-ready .op-brand{transform:translateY(-65px)}}
@media(prefers-reduced-motion:reduce){.opening.is-exiting{transform:none;clip-path:inset(0);opacity:0}.entry-veil{display:none}.hero-copy>*,.hero-backdrop img{transform:none}.opening-actions{animation:none}}
/* Softer scenery: preserve light without bare highlights. */
.hero-backdrop img{filter:saturate(.76) brightness(.78)}
.hero-backdrop:after{background:linear-gradient(90deg,#17253768,transparent 80%),linear-gradient(0deg,#111e377d,#24345120 80%)}
.op-paper{filter:saturate(.72) brightness(.68)}
.op-scene img{filter:saturate(.74) brightness(.7)}
.op-scene:after{background:linear-gradient(0deg,#17223777,#182c4525 70%)}
.story-bg.day{filter:saturate(.72) brightness(.75)}
.story-shade{background:#19253660}
.case-image img{filter:saturate(.7) brightness(.73)}
.op-atmosphere{position:absolute;inset:0;z-index:3;pointer-events:none;overflow:hidden;background:radial-gradient(ellipse at 18% 18%,#fff7d014,transparent 65%)}
.op-atmosphere i{position:absolute;width:3px;height:3px;border-radius:50%;background:#fff0d0;left:calc(var(--n)*8% + 2%);top:calc(20% + var(--n)*5%);opacity:0;animation:drift 5s calc(var(--n)*-.4s) infinite ease-in-out}
@keyframes drift{0%{opacity:0;transform:translate(0,35px)}45%{opacity:.4}100%{opacity:0;transform:translate(20px,-35px)}}
.op-scene{clip-path:polygon(0 0,0 0,0 100%,0 100%);transform:scale(1.045);transition:clip-path 1.15s cubic-bezier(.2,.8,.2,1),opacity .9s,transform 3.5s ease}
.opening[data-step='1'] .scene-school,.opening[data-step='2'] .scene-club,.opening[data-step='3'] .scene-roof,.opening[data-step='4'] .scene-roof{clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}
.op-word{letter-spacing:-2px;transition:opacity .5s,transform .9s cubic-bezier(.2,.8,.2,1)}
.op-brand strong{display:flex;align-items:center;position:relative;letter-spacing:-5px;overflow:visible}
.logo-letter{display:inline-block}
.opening[data-step='4'] .logo-letter{animation:logo-arrive .95s calc(var(--letter)*.085s) cubic-bezier(.2,.8,.2,1) both}
@keyframes logo-arrive{0%{opacity:0;transform:translateY(32px);filter:blur(5px)}100%{opacity:1;transform:none;filter:blur(0)}}
.op-brand i{right:-32px;top:0}
.opening-actions{gap:28px;top:calc(50% + 100px)}
.opening-actions .button{background:#ffffff0b;backdrop-filter:blur(14px);color:#fff6e9;border:1px solid #ffffff55;border-radius:50px;padding:14px 22px 14px 30px;min-width:220px;min-height:67px;gap:40px;box-shadow:0 12px 35px #101c2820;transition:background .3s,color .3s,transform .3s,border-color .3s}
.opening-actions .button:hover{background:#fff3e6;color:#243044;border-color:#fff3e6;transform:translateY(-2px)}
.entry-button-copy{display:flex;flex-direction:column;align-items:start;font-size:17px!important;line-height:1.4!important;font-weight:500;letter-spacing:1px}
.entry-button-copy small{font-size:8px;letter-spacing:1px;opacity:.55;margin-top:4px;font-weight:400}
.opening-actions .entry-arrow{font-size:27px;line-height:1;font-weight:300}
.opening-actions .text-button{font-size:10px;color:#fff0d9ba;letter-spacing:.5px;border-color:#ffffff35}
.opening-skip{top:35px;right:5vw;bottom:auto;display:flex;gap:17px;align-items:center;justify-content:space-between;font-size:11px;background:#152239c9;border:1px solid #ffffff40;border-radius:25px;padding:11px 18px;backdrop-filter:blur(10px)}
.op-topline span:last-child{margin-right:130px}
.member-art{padding:0;display:block;cursor:pointer;text-align:left;position:relative;transition:border-color .3s}
.member-art:hover{border-color:#ffd3bd8a}
.member-open-label{position:absolute;bottom:0;left:0;right:0;display:flex;justify-content:end;padding:15px 20px;background:linear-gradient(0deg,#101b2eda,transparent);color:#fff1dd;font-size:10px;letter-spacing:.5px;opacity:.85;transition:opacity .3s}
.member-art:hover .member-open-label{opacity:1}
.detail-link{display:flex;align-items:center;justify-content:space-between;background:none;border-bottom:1px solid #ffffff35;color:#efd2cb;font-size:11px;width:100%;padding:16px 0;margin-top:22px}
body.modal-open{overflow:hidden}
.character-dialog{width:min(1120px,94vw);max-height:91svh;border:1px solid #ffffff25;padding:0;color:#edf1f6;background:#131e2e;box-shadow:0 30px 130px #0009;overflow:auto}
.character-dialog[open]{animation:dialog-arrive .3s ease both}
.character-dialog::backdrop{background:#090f1acf;backdrop-filter:blur(12px)}
@keyframes dialog-arrive{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.detail-header{display:flex;justify-content:space-between;align-items:center;padding:20px 27px;border-bottom:1px solid #ffffff12;position:sticky;top:0;background:#131e2ef2;z-index:3;backdrop-filter:blur(12px)}
.detail-header .eyebrow{color:#7e91aa;font-size:9px;letter-spacing:2px}
.detail-close{background:none;color:#e2d9d0;font-size:19px;width:38px;height:38px}
.detail-layout{display:grid;grid-template-columns:1.35fr 1fr;gap:40px;padding:30px}
.detail-gallery{min-width:0}
#detail-image{width:100%;height:auto;aspect-ratio:4/3;object-fit:contain;background:#0f1724;border:1px solid #ffffff10}
.emotion-caption{display:flex;justify-content:space-between;gap:10px;align-items:center;margin:17px 0;font-size:11px;color:#cfb4b1}
.emotion-caption span:last-child{font-size:7px;letter-spacing:1px;color:#536981}
.emotion-tabs{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.emotion-tabs button{background:#ffffff04;border:1px solid #ffffff18;color:#8fa2bc;padding:12px 4px;font-size:10px;transition:background .2s,color .2s,border-color .2s}
.emotion-tabs button[aria-selected='true']{background:#ffb7ad12;border-color:#eeb9ad7d;color:#f9cabb}
.gallery-status{font-size:10px;color:#d6b5b0;margin-top:12px;min-height:12px}
.detail-bio{padding-top:5px}
.detail-bio>.eyebrow{color:#899bb5;letter-spacing:1px;font-size:9px}
.detail-bio h2{font-size:48px;letter-spacing:-2px;margin:12px 0 20px}
.detail-title{font-size:14px;line-height:1.7;color:#ebaaa7;margin-bottom:25px;word-break:keep-all}
#detail-facts section{border-top:1px solid #ffffff12;padding:17px 0}
#detail-facts h3{font-family:inherit;font-size:10px;font-weight:500;color:#e3d0c5;margin-bottom:8px}
#detail-facts p{font-size:11px;line-height:2;color:#8ea0b9;word-break:keep-all}
.detail-navigation{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #ffffff18;margin-top:10px;padding-top:15px;font-size:9px;letter-spacing:2px;color:#778da9}
.detail-navigation button{background:none;border:1px solid #ffffff22;color:#dcd3cc;width:40px;height:35px;font-size:18px}
@media(max-width:600px){.opening-skip{top:27px;right:7vw;font-size:10px;padding:9px 14px}.op-topline{left:7vw;top:38px;right:140px}.op-topline span:first-child{font-size:6px}.op-brand strong{letter-spacing:-3px}.op-brand i{right:-18px;font-size:17px}.opening-actions{top:calc(50% + 85px);gap:17px}.opening-actions .button{min-width:220px;min-height:65px;padding:13px 23px 13px 28px}.opening-actions .text-button{font-size:10px}.member-open-label{padding:13px 15px;font-size:9px}.character-dialog{width:94vw;max-height:92svh}.detail-header{padding:12px 15px}.detail-header .eyebrow{font-size:7px}.detail-close{width:32px;height:32px}.detail-layout{grid-template-columns:1fr;padding:16px;gap:20px}.emotion-caption span:last-child{display:none}.emotion-tabs button{font-size:10px;padding:12px 3px}.detail-bio h2{font-size:42px}.detail-title{font-size:14px}.detail-bio p{font-size:12px!important}.detail-navigation{padding-bottom:4px}.detail-link{font-size:10px}}
@media(prefers-reduced-motion:reduce){.opening[data-step='4'] .logo-letter{opacity:1;transform:none;filter:none}.op-scene{clip-path:none}.op-atmosphere i{display:none}.character-dialog[open]{animation:none}}

#detail-facts p{font-size:13px;line-height:1.95}.detail-title{font-size:15px}
@media(max-width:600px){#detail-facts p{font-size:12px}.detail-title{font-size:14px}}

/* Intro webtoon */
.webtoon-feature{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:9vw;background:#f4eae3;position:relative;overflow:hidden}
.webtoon-cover{position:relative;display:block;max-width:520px;height:540px;overflow:hidden;background:#32252c;box-shadow:0 24px 55px #3b253222;transform:rotate(-2deg);border:9px solid #fffaf3}
.webtoon-cover img{width:100%;height:100%;object-fit:cover;object-position:center;filter:saturate(.8) brightness(.8);transition:transform .8s}
.webtoon-cover:hover img{transform:scale(1.035)}
.webtoon-cover:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#211e32bd,transparent 65%)}
.cover-caption{position:absolute;z-index:1;bottom:34px;left:28px;color:#fff1e4;font-size:10px;letter-spacing:3px}
.cover-caption b{display:block;font-family:MirageTitle,sans-serif;font-size:26px;letter-spacing:-1px;margin-top:12px}
.cover-arrow{position:absolute;z-index:1;right:28px;bottom:30px;color:#ffe5d4;font-size:35px}
.webtoon-copy h2{font-size:clamp(50px,6vw,88px);line-height:1.12;letter-spacing:-4px;margin:24px 0 30px}
.webtoon-copy h2 em{color:#a65462}.webtoon-copy p{font-size:14px;line-height:2.2;margin-bottom:32px}.webtoon-note{display:block;font-size:10px;color:#78646c;margin-top:18px}
@media(max-width:700px){.webtoon-feature{grid-template-columns:1fr;gap:36px}.webtoon-cover{height:350px;max-width:none;margin:5px 8px}.webtoon-copy h2{font-size:52px;letter-spacing:-3px;margin:17px 0 20px}.webtoon-copy p{font-size:12px}.webtoon-copy .eyebrow{font-size:8px}.webtoon-copy .button{font-size:12px;gap:45px}.cover-caption b{font-size:23px}}

/* Thumbnail overview and legible mobile copy. */
.member-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px 24px}.member-thumbnail{padding:0;text-align:left;background:#182233;color:#f7eee7;border:1px solid #ffffff1c;border-radius:8px;overflow:hidden;min-width:0;transition:transform .25s,border-color .25s,box-shadow .25s}.member-thumbnail:hover{transform:translateY(-5px);border-color:var(--member-color);box-shadow:0 12px 30px #0003}.thumbnail-art{display:block;position:relative}.thumbnail-art img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:contain}.thumbnail-plus{position:absolute;right:12px;bottom:12px;width:30px;height:30px;display:grid;place-items:center;background:#101825df;border:1px solid #ffffff55;border-radius:50%;color:white;font-size:20px}.thumbnail-copy{display:block;padding:22px}.thumbnail-role{display:block;font-size:12px;color:#b4bdce;line-height:1.6}.thumbnail-copy strong{display:block;font-family:MirageTitle,sans-serif;font-size:30px;letter-spacing:-1px;color:var(--member-color);margin:10px 0}.thumbnail-title{display:block;font-size:14px;line-height:1.7;color:#e4ded9;word-break:keep-all}.member-grid-hint{margin-top:25px;text-align:center;font-size:13px;color:#a6b4c7}.music-toggle{font-size:12px;letter-spacing:0;min-height:44px;padding:12px 16px}.audio-notice{font-size:13px}.emotion-tabs button{min-height:44px;font-size:12px}.detail-close{width:44px;height:44px}.detail-navigation button{height:44px;width:44px}#detail-facts p{font-size:15px;color:#bac6d7;line-height:1.9}#detail-facts h3{font-size:13px}.detail-bio>.eyebrow{font-size:12px}.detail-header .eyebrow{font-size:11px}.detail-title{font-size:17px}.case-copy p{font-size:15px;color:#bec8d5}.case-copy .case-small{font-size:14px;color:#a6b6c9}.webtoon-copy p{font-size:16px}.section-heading>p{font-size:14px;color:#acb9cd}
@media(max-width:700px){.member-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 12px}.thumbnail-copy{padding:15px 12px}.thumbnail-copy strong{font-size:25px}.thumbnail-role{font-size:11px}.thumbnail-title{font-size:13px;line-height:1.65}.thumbnail-plus{right:8px;bottom:8px;width:26px;height:26px;font-size:18px}.member-grid-hint{font-size:12px;line-height:1.8;word-break:keep-all}}
@media(max-width:600px){.header{padding:0 5vw}.wordmark{font-size:16px}.header nav{gap:13px;font-size:12px}.header nav a{min-height:44px;display:flex;align-items:center}.hero-copy p{font-size:15px;line-height:1.85}.hero-invitation{font-size:17px}.hero-copy .button{font-size:14px}.hero-tags{font-size:11px;gap:10px;letter-spacing:0}.hero-copy .eyebrow{font-size:10px;letter-spacing:.3px}.hero h1{font-size:clamp(68px,22vw,88px)}.hero-side-note{display:none}.story-slide p{font-size:15px;line-height:1.9}.story-overline{font-size:11px;letter-spacing:.5px}.story-slide h2{font-size:clamp(34px,10vw,43px);letter-spacing:-2px}.section-heading .eyebrow{font-size:10px;letter-spacing:1px}.case-copy p{font-size:15px}.case-copy .case-small{font-size:14px}.case-copy .eyebrow{font-size:10px}.case-image span{font-size:10px;letter-spacing:.5px}.join p{font-size:15px;line-height:1.9}.join .eyebrow{font-size:11px}.join .button{font-size:14px}.webtoon-copy p{font-size:15px}.webtoon-copy .eyebrow{font-size:10px}.webtoon-copy .button{font-size:14px}.webtoon-note{font-size:12px}.detail-layout{padding:16px;gap:24px}.detail-bio p,#detail-facts p{font-size:15px!important}.detail-bio>.eyebrow{font-size:12px}.detail-header .eyebrow{font-size:10px;letter-spacing:1px}.detail-title{font-size:16px}.emotion-tabs button{font-size:12px;min-height:44px}.opening-actions .text-button{font-size:13px;min-height:44px}.music-toggle{font-size:12px;bottom:14px;right:14px}.section-space{padding:60px 5vw}.scroll-cue span{font-size:11px}.hero{min-height:780px}.join p,.case-copy p,.webtoon-copy p{word-break:keep-all}.webtoon-copy p{max-width:340px}}
@media(max-width:350px){.header nav{gap:9px;font-size:11px}.wordmark{font-size:14px}.wordmark span{display:none}.thumbnail-copy{padding:12px 10px}.thumbnail-copy strong{font-size:23px}.thumbnail-title{font-size:12px}}

@media(max-width:380px){.emotion-tabs{grid-template-columns:repeat(4,minmax(0,1fr))}.emotion-tabs button{white-space:nowrap;padding:12px 2px}}