@view-transition{navigation:auto}:root{--bg:#0a0b0e;--ink:#eef0f4;--ink-2:#b4b9c3;--ink-3:#7c828e;--line:#ffffff14;--line-2:#ffffff24;--accent:#a27dff;--accent-2:#ff5fa8;--accent-deep:#7c4dff;--grad:linear-gradient(90deg, #7f52f5, #e95c9d);--ease:cubic-bezier(.16, 1, .3, 1);--pad:clamp(20px, 4vw, 40px);--display:"Jost Variable", "Pretendard Variable", system-ui, sans-serif;--text:"Pretendard Variable", system-ui, -apple-system, sans-serif;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:72px}body{background:var(--bg);color:var(--ink);font:400 17px/1.6 var(--text);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;margin:0;overflow-x:hidden}a{color:inherit}img,video{max-width:100%;height:auto;display:block}button{font:inherit;color:inherit}:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:6px}.wrap{width:100%;max-width:calc(1200px + 2 * var(--pad));padding:0 var(--pad);margin:0 auto}.skip{z-index:100;background:var(--ink);color:var(--bg);border-radius:8px;padding:10px 14px;font-weight:600;text-decoration:none;position:fixed;top:12px;left:12px;translate:0 -200%}.skip:focus{translate:none}.eyebrow{font:600 13px/1.2 var(--display);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);margin:0 0 14px}h2{font:600 clamp(32px, 4.2vw, 52px) / 1.08 var(--display);letter-spacing:-.02em;text-wrap:balance;margin:0}h3{font:600 clamp(24px, 2.4vw, 32px) / 1.15 var(--display);letter-spacing:-.01em;text-wrap:balance;margin:0 0 14px}p{text-wrap:pretty}.wordmark{font-family:var(--display);white-space:nowrap}.wordmark i{font-style:italic;font-weight:700}.wordmark b{color:var(--accent);letter-spacing:-.02em;font-weight:650}.glow,.title .wordmark i,.title .wordmark b{--glow:162, 125, 255;color:#fff;text-shadow:0 0 18px rgba(var(--glow), .38), 0 0 48px rgba(var(--glow), .2)}.title .wordmark b,em.glow{--glow:255, 95, 168}em.glow{font-style:normal}.pulse{transform:perspective(700px) translate3d(0, calc(var(--k,0) * -3px), 0) rotateX(calc(var(--k,0) * 9deg)) scale(calc(1 + var(--k,0) * .02));transform-origin:50% 85%;will-change:transform;display:inline-block}h2.pulse{display:block}.title .wordmark b.pulse{transform:scale(calc(1 + var(--k,0) * .05));transform-origin:50% 62%;position:relative}.title .wordmark b.pulse:after{content:"FX";color:#0000;text-shadow:0 0 10px #ffffffb3, 0 0 26px rgb(var(--flare)), 0 0 64px rgba(var(--flare), .7);opacity:var(--k,0);pointer-events:none;--flare:162, 125, 255;position:absolute;inset:0}.title .wordmark b.pulse[data-down]:after{--flare:255, 95, 168}.mark{flex:none;width:24px;height:24px;display:block}.mark rect{fill:var(--ink);opacity:.22}.mark rect.lit{fill:var(--accent);opacity:1}.btn{background:var(--grad);color:#fff;height:48px;font:600 16px/1 var(--display);cursor:pointer;transition:filter .2s, transform .2s var(--ease);border:0;border-radius:12px;align-items:center;gap:10px;padding:0 20px;text-decoration:none;display:inline-flex;box-shadow:inset 0 0 0 1.5px #d6c4ff8c,inset 0 1px #ffffff4d,0 0 0 3px #0c0a18e6,0 6px 18px #7c4dff47}.btn:hover{filter:brightness(1.08)}.btn:active{transform:translateY(1px)}.btn svg{fill:none;stroke:currentColor;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;width:18px;height:18px}.btn svg .solid{fill:currentColor;stroke:none}.btn-quiet{box-shadow:inset 0 0 0 1px var(--line-2);color:var(--ink);background:#ffffff0a}.btn-quiet:hover{filter:none;background:#ffffff14}.btn .dur{border-left:1px solid var(--line-2);color:var(--ink-3);font-variant-numeric:tabular-nums;padding-left:10px;font-weight:500}.btn-small{border-radius:10px;height:36px;padding:0 14px;font-size:14px}.nav{z-index:20;height:64px;padding:0 var(--pad);border-bottom:1px solid #0000;align-items:center;gap:28px;transition:background .3s,border-color .3s;display:flex;position:fixed;inset:0 0 auto}.nav.scrolled{border-bottom-color:var(--line);-webkit-backdrop-filter:blur(16px)saturate(140%);backdrop-filter:blur(16px)saturate(140%);background:#0a0b0ed1}.brand{align-items:center;gap:10px;text-decoration:none;display:flex}.brand .wordmark{font-size:20px;line-height:1}.links{gap:24px;margin-right:auto;font-size:15px;display:flex}.links a{color:var(--ink-2);text-decoration:none;transition:color .2s}.links a:hover{color:var(--ink)}.nav-end{align-items:center;gap:10px;display:flex}.music-key{height:36px;box-shadow:inset 0 0 0 1px var(--line-2);color:var(--ink-2);font:600 14px/1 var(--display);cursor:pointer;background:#ffffff0a;border:0;border-radius:10px;align-items:center;gap:8px;padding:0 12px;transition:background .2s,color .2s;display:inline-flex}.music-key:hover,.music-key[aria-pressed=true]{color:var(--ink);background:#ffffff14}.eq{align-items:flex-end;gap:2px;width:16px;height:14px;display:inline-flex}.eq i{transform-origin:50% 100%;height:100%;transform:scaleY(var(--rest));background:currentColor;border-radius:1px;flex:1;transition:transform .12s linear}.eq i:first-child{--rest:.45}.eq i:nth-child(2){--rest:.85}.eq i:nth-child(3){--rest:.6}.eq i:nth-child(4){--rest:.3}[aria-pressed=true] .eq i{background:var(--accent)}.hero{--hero-p:0;--beat:0;isolation:isolate;align-items:center;min-height:min(100svh,1000px);padding:120px 0 96px;display:flex;position:relative;overflow:hidden}.hero:before{content:"";z-index:-2;background:radial-gradient(40% 45% at 72% 62%, rgba(255, 95, 168, calc(.07 + var(--beat) * .07)), transparent 70%), radial-gradient(50% 55% at 60% 50%, rgba(140, 92, 255, calc(.13 + var(--beat) * .1)), transparent 70%);position:absolute;inset:-10% -20% -10% 25%}.hero:after{content:"";z-index:-1;background:linear-gradient(transparent, var(--bg));pointer-events:none;height:28%;position:absolute;inset:auto 0 0}.hero-stage{z-index:-1;perspective:2400px;perspective-origin:70% 45%;pointer-events:none;transform:translateY(calc(var(--hero-p) * -60px));position:absolute;inset:0}.hero-screen{aspect-ratio:1440/900;width:min(80vw,1360px);box-shadow:0 0 0 1px var(--line-2), 0 80px 140px -40px #000000e6;transform-origin:0;transform:translateY(-50%) rotateY(calc(-24deg + var(--tilt-y,0deg))) rotateX(calc(9deg + var(--tilt-x,0deg))) rotateZ(2deg);transition:transform 1.8s var(--ease), opacity 1.2s ease;background:#0c0e12;border-radius:16px;position:absolute;top:50%;left:46%;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,#0000 0,#000 16% 72%,#00000073 100%);mask-image:linear-gradient(90deg,#0000 0,#000 16% 72%,#00000073 100%)}.hero-screen.settled{transition:opacity 1.2s}.hero-screen video{object-fit:cover;width:100%;height:100%}.hero-copy{opacity:calc(1 - var(--hero-p) * 1.1);position:relative}.hero-copy>*{max-width:540px}.title{letter-spacing:-.015em;transition:clip-path 1.3s var(--ease) .2s;clip-path:inset(-45% -12% -45% -6%);margin:0 0 18px;font-size:clamp(52px,6.4vw,92px);line-height:1}.tagline{font:500 clamp(22px, 2.3vw, 30px) / 1.25 var(--display);letter-spacing:-.01em;color:var(--ink);margin:0 0 22px}.tagline em{font-style:normal}.lede{color:var(--ink-2);margin:0 0 34px;font-size:18px;line-height:1.65}.actions{flex-wrap:wrap;gap:12px;display:flex}.drop{cursor:pointer;height:48px;transition:background .2s, transform .2s var(--ease);border-radius:12px;align-items:center;gap:10px;padding:0 16px 0 14px;display:inline-flex;position:relative}.drop:before{content:"";pointer-events:none;border:1.5px dashed #ffffff57;border-radius:12px;transition:border-color .2s;position:absolute;inset:0}.drop:hover,.drop:focus-within,.dragging .drop{background:#8c5cff1a}.drop:hover:before,.drop:focus-within:before,.dragging .drop:before{border-color:var(--accent)}.drop:focus-within{outline:2px solid var(--accent);outline-offset:3px}.drop svg{fill:none;stroke:currentColor;stroke-width:1.6px;stroke-linecap:round;stroke-linejoin:round;width:20px;height:20px;color:var(--accent);flex:none}.drop-text{text-align:left;gap:1px;display:grid}.drop-text b{font:600 15px/1.15 var(--display)}.drop-text small{color:var(--ink-3);font-size:12px;line-height:1.2}.drop-input{opacity:0;pointer-events:none;width:1px;height:1px;position:absolute}.drop.busy{cursor:progress}.drop.busy svg{animation:rise-up .9s var(--ease) infinite}.drop.wrong:before{border-color:#ff8a7a}.drop.wrong small{color:#ffb4a8}@keyframes rise-up{0%{opacity:.4;transform:translateY(4px)}}.dropzone{z-index:60;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);opacity:0;visibility:hidden;pointer-events:none;background:#08090cb8;place-items:center;padding:24px;transition:opacity .2s,visibility 0s linear .2s;display:grid;position:fixed;inset:0}.dragging .dropzone{opacity:1;visibility:visible;transition:opacity .2s}.dropzone>div{border:2px dashed var(--accent);text-align:center;width:min(560px,100%);transition:transform .3s var(--ease);background:#8c5cff14;border-radius:20px;justify-items:center;gap:10px;padding:56px 32px;display:grid;transform:scale(.97)}.dragging .dropzone>div{transform:none}.dropzone svg{fill:none;width:40px;height:40px;stroke:var(--accent);stroke-width:1.4px;stroke-linecap:round;stroke-linejoin:round}.dropzone b{font:600 26px/1.2 var(--display)}.dropzone span{color:var(--ink-2)}.tracks{max-width:420px;margin-top:30px}.tracks-cap{font:600 12px/1.2 var(--display);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);margin:0 0 8px 10px}.track-list{gap:2px;margin:0;padding:0;list-style:none;display:grid}.track{--progress:0;text-align:left;cursor:pointer;background:0 0;border:0;border-radius:10px;grid-template-columns:36px minmax(0,1fr) auto 18px;align-items:center;gap:12px;width:100%;padding:7px 12px 7px 7px;transition:background .2s;display:grid;position:relative}.track:hover{background:#ffffff0a}.track[aria-current=true]{box-shadow:inset 0 0 0 1px var(--line);background:#ffffff0f}.track img{object-fit:cover;border-radius:6px;width:36px;height:36px;transition:box-shadow .1s linear}.track[aria-pressed=true] img{box-shadow:0 0 0 calc(1px + var(--beat) * 3px) #8c5cff8c}.track-name{font:600 15px/1.25 var(--display);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.track-time{color:var(--ink-3);font-variant-numeric:tabular-nums;font-size:13px}.track-icon{color:var(--ink-2);place-items:center;display:grid}.track-icon svg{fill:currentColor;width:16px;height:16px}.track .i-pause,.track[aria-pressed=true] .i-play{display:none}.track[aria-pressed=true] .i-pause{display:inline}.track[aria-pressed=true] .track-icon{color:var(--accent)}.track-bar{background:var(--grad);transform-origin:0;height:2px;transform:scaleX(var(--progress));opacity:0;border-radius:1px;position:absolute;bottom:2px;left:12px;right:12px}.track[aria-current=true] .track-bar{opacity:1}.tracks-note{color:var(--ink-3);margin:10px 0 0 10px;font-size:13px}.hero-screen video{transition:opacity .35s}.hero-screen.switching video{opacity:.25}.tour-key{box-shadow:inset 0 0 0 1px var(--line-2), 0 20px 40px -12px #000000b3;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);text-align:left;cursor:pointer;transition:background .2s, transform .3s var(--ease);background:#0a0b0ea8;border:0;border-radius:999px;align-items:center;gap:12px;padding:8px 18px 8px 8px;display:flex;position:absolute;bottom:15%;left:51%}.tour-key:hover{background:#0a0b0ed1;transform:translateY(-2px)}.tour-play{width:44px;height:44px;color:var(--bg);transition:transform .3s var(--ease);background:#fff;border-radius:50%;place-items:center;display:grid}.tour-key:hover .tour-play{transform:scale(1.06)}.tour-play svg{fill:currentColor;width:18px;height:18px;margin-left:2px}.tour-text{gap:2px;display:grid}.tour-text b{font:600 15px/1.2 var(--display)}.tour-text small{color:var(--ink-3);font-size:13px}.motion-key{right:var(--pad);box-shadow:inset 0 0 0 1px var(--line);color:var(--ink-3);cursor:pointer;background:#0a0b0e99;border:0;border-radius:999px;padding:6px 12px;font-size:13px;position:absolute;bottom:28px}.motion-key:hover{color:var(--ink)}.enter{transition:opacity .9s var(--ease) calc(var(--d) * 70ms + .15s), transform 1s var(--ease) calc(var(--d) * 70ms + .15s)}.js:not(.is-ready) .enter{opacity:0;transform:translateY(18px)}.js:not(.is-ready) .title{clip-path:inset(-45% 100% -45% -6%)}.js:not(.is-ready) .hero-screen{opacity:0;transform:translateY(-50%)translate(8vw)rotateY(-40deg)rotateX(16deg)rotate(5deg)}.section-head{max-width:760px;margin-bottom:clamp(40px,7vh,72px)}.section-head>p:not(.eyebrow){color:var(--ink-2);margin:18px 0 0;font-size:18px}.reveal{transition:opacity .9s var(--ease), transform 1s var(--ease)}.js .reveal:not(.shown){opacity:0;transform:translateY(24px)}.story{padding-top:clamp(96px,16vh,180px);padding-bottom:clamp(64px,10vh,120px)}.story-grid{grid-template-columns:minmax(0,4fr) minmax(0,8fr);align-items:start;gap:clamp(32px,5vw,80px);display:grid}.chapters{margin:0;padding:0;list-style:none}.chapter{opacity:.3;flex-direction:column;justify-content:center;min-height:74vh;padding:6vh 0;transition:opacity .5s;display:flex}.chapter.on{opacity:1}.chapter .step{font:600 13px/1 var(--display);letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin:0 0 12px}.chapter p:not(.step){max-width:44ch;color:var(--ink-2);margin:0}.chapter-shot{display:none}.story-stage{perspective:2400px;position:sticky;top:calc(50vh - min(24vw,290px))}.story-screen{aspect-ratio:16/10;box-shadow:0 0 0 1px var(--line-2), 0 50px 100px -40px #000000e6;transform-origin:0;background:#0c0e12;border-radius:14px;position:relative;overflow:hidden;transform:rotateY(-5deg)rotateX(2deg)}.story-screen img{object-fit:cover;opacity:0;width:100%;height:100%;transition:opacity .7s var(--ease), transform 1.4s var(--ease);position:absolute;inset:0;transform:scale(1.025)}.story-screen img.on{opacity:1;transform:none}.story-rail{gap:6px;margin:18px 0 0;padding:0;list-style:none;display:flex}.story-rail li{background:var(--line-2);border-radius:1px;flex:1;height:2px;transition:background .4s}.story-rail li.on{background:var(--grad)}.modes-note{max-width:760px;color:var(--ink-2);margin:clamp(48px,10vh,120px) 0 0;font-size:18px;line-height:1.65}.modes-note b{color:var(--ink);font-weight:600}.phones{--p:.5;grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:center;gap:clamp(32px,5vw,80px);padding-top:clamp(64px,12vh,140px);padding-bottom:clamp(64px,12vh,140px);display:grid}.phones-copy p:not(.eyebrow){max-width:40ch;color:var(--ink-2);margin:18px 0 0;font-size:18px}.phones-pair{justify-content:center;align-items:flex-start;gap:clamp(16px,3vw,40px);display:flex}.phone img{width:100%}.phone{width:min(250px,38vw);box-shadow:0 0 0 1px var(--line-2), 0 40px 80px -30px #000000e6;transform:translateY(calc((.5 - var(--p)) * 40px));background:#000;border-radius:30px;margin:0;overflow:hidden}.phone+.phone{transform:translateY(calc((.5 - var(--p)) * -40px));margin-top:12vh}.watch{padding-top:clamp(64px,12vh,140px);padding-bottom:clamp(64px,10vh,120px)}.poster{aspect-ratio:16/9;width:100%;box-shadow:0 0 0 1px var(--line-2), 0 50px 100px -40px #000000e6;cursor:pointer;background:#000;border:0;border-radius:16px;padding:0;display:block;position:relative;overflow:hidden}.poster img{object-fit:cover;width:100%;height:100%;transition:transform 1.6s var(--ease), filter .6s}.poster:hover img{filter:brightness(1.08);transform:scale(1.02)}.poster .play{width:64px;height:64px;color:var(--bg);transition:transform .4s var(--ease);background:#fff;border-radius:50%;place-items:center;display:grid;position:absolute;bottom:28px;left:28px}.poster:hover .play{transform:scale(1.06)}.poster .play svg{fill:currentColor;width:24px;height:24px;margin-left:3px}.poster-cap{font:600 14px/1 var(--display);letter-spacing:.04em;color:var(--ink);position:absolute;bottom:50px;left:106px}.player{aspect-ratio:16/9;width:min(1200px,92vw);max-height:90vh;color:var(--ink);background:#000;border:0;border-radius:16px;padding:0;overflow:visible;box-shadow:0 60px 140px -30px #000000e6}.player[open]{animation:rise .5s var(--ease)}.player::backdrop{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#050608d6}@keyframes rise{0%{opacity:0;transform:translateY(16px)scale(.98)}}.player-frame,.player-frame iframe{border:0;border-radius:16px;width:100%;height:100%}.player-close{cursor:pointer;background:#ffffff1f;border:0;border-radius:50%;place-items:center;width:36px;height:36px;display:grid;position:absolute;top:-48px;right:0}.player-close svg{fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;width:16px;height:16px}.close{text-align:center;padding-top:clamp(80px,16vh,180px);padding-bottom:clamp(80px,16vh,180px)}.close h2{font-size:clamp(36px,5vw,64px)}.close p{color:var(--ink-2);margin:18px auto 32px;font-size:18px}.foot{border-top:1px solid var(--line);padding:40px 0 max(40px, env(safe-area-inset-bottom));color:var(--ink-3);font-size:14px}.foot-grid{grid-template-columns:1.2fr 1fr 2fr;align-items:start;gap:32px;display:grid}.foot-brand p{margin:12px 0 0}.foot nav{gap:10px;display:grid}.foot a{text-decoration:none}.foot nav a:hover{color:var(--ink)}.credits{margin:0;line-height:1.6}@media (width<=960px){.links{display:none}.nav{justify-content:space-between}.hero{flex-direction:column;align-items:stretch;min-height:0;padding:104px 0 0}.hero-copy{order:1}.hero-stage{order:2;height:62vw;margin-top:48px;position:relative;inset:auto;transform:none}.hero-screen{width:110%;left:8%}.motion-key{bottom:12px}.tour-key{margin:16px var(--pad) 0;order:3;align-self:flex-start;position:relative;bottom:auto;left:auto}.story-grid,.phones{grid-template-columns:1fr}.story-screen{transform:none}.story-stage{display:none}.chapter{opacity:1;min-height:0;padding:0 0 72px}.chapter-shot{width:100%;height:auto;box-shadow:0 0 0 1px var(--line-2);border-radius:12px;margin-top:24px;display:block}.foot-grid{grid-template-columns:1fr}}@media (width<=560px){.music-key .music-state{display:none}.btn{height:46px;padding:0 18px}.phone{border-radius:22px;width:44vw}.phone+.phone{margin-top:8vh}.poster .play{width:52px;height:52px;bottom:16px;left:16px}.poster-cap{bottom:34px;left:80px}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.enter,.title,.hero-screen,.reveal,.story-screen img,.poster img{transition:none!important}.hero-stage,.phone,.phone+.phone{transform:none}.hero-copy{opacity:1}}