/* NGU DYC — an immersive film journey with directly playable music. */
.home-page {
  --ink: #090b0d;
  --text: #f5f3ed;
  --muted: #a4a7a8;
  --accent: #d7af84;
  --scene-color: #d7af84;
  background: var(--ink);
}
.home-page main { max-width: none; }
.home-page .header {
  position: fixed;
  inset: 0 0 auto;
  min-height: 122px;
  z-index: 20;
  padding: 22px 5%;
  background: linear-gradient(#05080bab, transparent);
  border: 0;
}
.home-page .identity-text { display: none; }
.home-page .logo, .home-page .logo img { width: 102px; }
.home-page .logo > span, .home-page .logo small { font-size: 9px; }
.home-page .header nav { gap: 27px; }
.home-page .header nav > a { font-size: 12px; }
.home-page .opening-replay { background: #070a0d30; border-color: #ffffff3c; }
.home-page .opening-replay:hover { background: #ffffff14; }
.sky-journey { height: 100svh; min-height: 680px; position: relative; }
.sky-ready .sky-journey { height: 238svh; }
.sky-stage {
  position: sticky;
  top: 0;
  height: 100svh;
  min-height: 680px;
  overflow: hidden;
  isolation: isolate;
  background: #171c1d;
}
.sky-backgrounds, .sky-image, .sky-image picture,
.sky-image img, .sky-image video, #sky-glass,
.sky-shade, .sky-grain { position: absolute; inset: 0; width: 100%; height: 100%; }
.sky-image { opacity: 0; transition: opacity 1s ease; }
.sky-image.is-active { opacity: 1; }
.sky-image img, .sky-image video { object-fit: cover; object-position: 50% 50%; }
.sky-image video { opacity: 0; transition: opacity .6s; }
.sky-image video[data-ready] { opacity: 1; }
#sky-glass { z-index: 1; pointer-events: none; opacity: 0; transition: opacity .4s; }
#sky-glass.is-rendering { opacity: 1; }
.sky-shade {
  z-index: 2;
  pointer-events: none;
  background: linear-gradient(90deg,#060a0e50,transparent 68%),
              linear-gradient(0deg,#06080bd9,transparent 57%,#090b0e11);
}
.sky-grain {
  z-index: 3;
  pointer-events: none;
  opacity: .025;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='grain'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.4' filter='url(%23grain)'/%3E%3C/svg%3E");
}
.sky-signature { position: absolute; z-index: 4; top: 18%; left: 6%; font-size: 10px; letter-spacing: .26em; color: #ffffffb0; }
.sky-copy {
  position: absolute;
  z-index: 5;
  left: 6%;
  bottom: 23%;
  width: 80%;
  max-width: 1100px;
  opacity: 0;
  transform: translate3d(0,35px,0);
  filter: blur(7px);
  pointer-events: none;
  transition: opacity .65s ease, transform .95s cubic-bezier(.16,1,.3,1), filter .8s ease;
}
.sky-copy.is-active { opacity: 1; transform: translate3d(0,0,0); filter: none; pointer-events: auto; }
.sky-kicker { color: #ffffffc7; font-size: 10px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; margin-bottom: 20px; }
.sky-title {
  font-family: Manrope, Arial, sans-serif;
  font-weight: 300;
  font-size: clamp(70px,8.4vw,142px);
  line-height: .99;
  letter-spacing: -.065em;
  text-transform: uppercase;
  text-wrap: nowrap;
  margin: 0 0 29px;
  color: #fffdf5;
}
.sky-copy .actions { gap: 12px; }
.sky-copy .button { min-height: 48px; font-size: 12px; font-weight: 500; padding: 11px 22px; }
.sky-copy .primary { color: #151719; background: #f5f3ec; border-color: #f5f3ec; }
.sky-copy .secondary { background: #11182038; border-color: #ffffff60; backdrop-filter: blur(8px); color: #fff; }
.sky-copy .primary:hover { background: var(--scene-color); border-color: var(--scene-color); }
.sky-copy .secondary:hover { background: #ffffff22; border-color: #fff; }
.sky-copy .button small { color: inherit; }
.sky-copy .hero-services { margin: 20px 0 0; }
.sky-copy .hero-services .platform-links { display: flex; gap: 16px; flex-wrap: wrap; }
.sky-copy .hero-services .service-link { width: 40px; min-width: 40px; min-height: 40px; padding: 5px; border: 0; background: transparent; border-radius: 7px; }
.sky-copy .hero-services .service-link:hover { background: #ffffff1c; }
.sky-copy .hero-services .service-icon { width: 28px; height: 28px; }
.sky-copy .hero-services .service-link > span:not(.service-icon), .sky-copy .hero-services .service-link > svg { display: none; }
.sky-copy .sky-release-link { display: inline-flex; align-items: center; gap: 10px; min-height: 40px; font-size: 11px; color: #ffffffa1; position: absolute; left: 255px; bottom: 0; }
.sky-release-link .icon { width: 14px; }
.sky-bottom {
  position: absolute;
  bottom: 49px;
  left: 6%;
  right: 6%;
  z-index: 7;
  display: grid;
  grid-template-columns: 1fr minmax(440px,1.6fr) 1fr;
  gap: 25px;
  align-items: center;
}
.sky-explore { display: flex; align-items: center; gap: 20px; font-size: 11px; width: max-content; min-height: 44px; }
.sky-explore .icon { transform: rotate(90deg); width: 17px; }
.sky-worlds { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 28px; align-items: stretch; }
.sky-world { position: relative; color: #ffffff8a; font-size: 11px; min-height: 47px; padding: 12px 0 16px; line-height: 1.2; transition: color .25s; }
.sky-world::after, .sky-world i { content: ''; position: absolute; left: 0; bottom: 0; width: 100%; height: 1px; background: #ffffff35; }
.sky-world i { transform: scaleX(0); transform-origin: left; background: var(--scene-color); z-index: 1; transition: transform .65s cubic-bezier(.22,1,.36,1); }
.sky-world.is-active { color: #fff; }
.sky-world.is-active i { transform: scaleX(1); height: 2px; }
.sky-motion { justify-self: end; display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid #ffffff55; border-radius: 50%; color: white; background: #090e122c; }
.sky-motion:hover { background: #fff2; border-color: #fff; }
.sky-motion[hidden] { display: none; }
.sky-motion .icon { width: 16px; height: 16px; }
.sky-progress { position: absolute; z-index: 8; inset: 0 0 0 auto; width: 2px; background: #ffffff15; pointer-events: none; }
.sky-progress i { display: block; height: 100%; width: 100%; background: var(--scene-color); transform: scaleY(var(--journey-progress,0)); transform-origin: top; }
.sky-revealing { opacity: 0; transform: translateY(35px); transition: opacity .9s ease,transform .9s cubic-bezier(.16,1,.3,1); }
.sky-revealing.is-visible, .sky-revealing:focus-within { opacity: 1; transform: none; }
.home-page .release-shorts {
  position: relative;
  display: grid;
  grid-template-columns: minmax(240px,.78fr) minmax(0,1.2fr);
  gap: 9%;
  align-items: center;
  padding-block: 100px;
  max-width: 1440px;
  scroll-margin-top: 15px;
  background: radial-gradient(ellipse at 80% 0,#d7af840b,transparent 70%);
}
.release-short-copy .eyebrow { color: #b6a18a; font-size: 10px; letter-spacing: .14em; margin-bottom: 26px; }
.release-short-copy h2 { font-size: clamp(48px,5.7vw,90px); font-weight: 300; line-height: 1.06; letter-spacing: -.065em; max-width: 10ch; margin-bottom: 28px; }
.release-short-copy .release-cut-song { color: #e9e8e3; font-size: 16px; margin-bottom: 16px; }
.release-short-copy > p:not(.eyebrow):not(.release-cut-song) { max-width: 34ch; font-size: 13px; line-height: 1.8; }
.release-short-copy .quiet-link { margin-top: 26px; border-bottom: 1px solid #ffffff36; }
.release-cuts { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; }
.release-cut:nth-child(2) { margin-top: 75px; }
.cut-image { position: relative; overflow: hidden; border-radius: 4px; background: #121617; }
.cut-image img { display: block; width: 100%; aspect-ratio: 3/4; height: auto; object-fit: cover; object-position: center 37%; transition: transform 1s cubic-bezier(.16,1,.3,1); }
.cut-image::after { content: ''; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(transparent 75%,#0008); box-shadow: inset 0 0 0 1px #ffffff12; }
.cut-play { position: absolute; z-index: 1; inset: auto 13px 13px auto; width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid #ffffff80; background: #0003; border-radius: 50%; backdrop-filter: blur(6px); }
.cut-play .icon { width: 17px; height: 17px; }
.cut-time { position: absolute; z-index: 1; left: 15px; bottom: 20px; font-size: 11px; color: #fff; }
.cut-caption { padding-top: 17px; }
.cut-caption small { font-size: 10px; color: #9fa2a1; }
.cut-caption h3 { margin-top: 5px; font-size: clamp(17px,1.6vw,23px); font-weight: 400; letter-spacing: -.04em; line-height: 1.3; }
.performance-journey { position: relative; background: radial-gradient(ellipse at 50% 20%,#1a2428,transparent 55%),#0b0e10; }
.film-feature { position: relative; isolation: isolate; overflow: hidden; min-height: 600px; height: 85svh; max-height: 1000px; }
.film-feature-image, .film-feature-image img, .film-feature-shade { position: absolute; inset: 0; width: 100%; height: 100%; }
.film-feature-image img { object-fit: cover; object-position: center 35%; }
.film-feature-shade { background: linear-gradient(0deg,#07090df0,transparent 75%),linear-gradient(#080c1170,transparent 30%); }
.film-feature-top, .film-feature-bottom { position: absolute; left: 6%; right: 6%; display: flex; align-items: center; justify-content: space-between; gap: 40px; }
.film-feature-top { top: 40px; }
.film-feature-top .eyebrow, .film-feature-top .quiet-link { color: #fff; }
.film-feature-bottom { bottom: 65px; align-items: flex-end; }
.film-feature-bottom .eyebrow { color: #ffffffb5; font-size: 10px; margin-bottom: 18px; }
.film-feature h2 { font-size: clamp(48px,7vw,106px); font-weight: 300; line-height: 1; letter-spacing: -.06em; max-width: 11ch; }
.film-watch { display: flex; align-items: center; gap: 18px; flex: none; min-height: 60px; font-size: 12px; color: white; }
.film-watch > span { display: grid; place-items: center; border: 1px solid #ffffff90; border-radius: 50%; width: 70px; height: 70px; transition: background .3s; }
.film-watch:hover > span { background: #ffffff20; }
.home-page .selected { padding-block: 85px; }
.home-page .selected h2, .home-page .catalog > .section-heading h2 { font-weight: 300; font-size: clamp(38px,4vw,62px); }
.home-page .selected .feature-image { border-radius: 3px; }
.home-page .selected .feature-image img { aspect-ratio: 16/10; object-fit: cover; }
.home-page .selected .feature-info { padding-top: 17px; }
.home-page .selected h3 { font-weight: 400; }
.home-page .catalog { padding-top: 30px; }
.home-page .catalog .section-heading .eyebrow { display: none; }
.home-page .catalog-row { border-color: #ffffff17; }
.home-page .catalog-row .row-title img { border-radius: 3px; }
.home-page .footer { border-top-color: #ffffff17; padding-top: 55px; }
.home-page .footer > div:first-child strong { font-size: 36px; font-weight: 300; letter-spacing: -.05em; }
@media(hover:hover) and (prefers-reduced-motion:no-preference) {
  .release-cut a:hover img { transform: scale(1.04); }
}
@media(max-width:900px) {
  .sky-title { font-size: clamp(64px,9vw,100px); }
  .sky-copy { bottom: 25%; }
  .sky-bottom { grid-template-columns: 90px 1fr 44px; gap: 20px; }
  .sky-worlds { gap: 18px; }
  .sky-world { font-size: 10px; }
  .home-page .release-shorts { gap: 6%; grid-template-columns: minmax(200px,.85fr) minmax(0,1.2fr); }
}
@media(max-width:650px) {
  .home-page .header { min-height: 110px; padding: 14px 6%; }
  .home-page .logo, .home-page .logo img { width: 96px; }
  .home-page .identity-text { display: none; }
  .home-page .header nav.is-open { background: #0d1217f5; padding-block: 22px; backdrop-filter: blur(20px); }
  .sky-journey, .sky-stage { min-height: 660px; }
  .sky-ready .sky-journey { height: 205svh; }
  .sky-signature { top: 160px; left: 7%; font-size: 8px; }
  .sky-copy { left: 7%; width: 87%; bottom: 185px; }
  .sky-title { font-size: clamp(46px,12.4vw,76px); margin-bottom: 24px; line-height: 1.05; }
  .sky-kicker { font-size: 8px; margin-bottom: 14px; letter-spacing: .09em; }
  .sky-copy .actions { gap: 8px; flex-wrap: wrap; }
  .sky-copy .button { font-size: 10px; min-height: 44px; padding: 10px 15px; }
  .sky-copy .button .icon { width: 15px; }
  .sky-copy .hero-services { margin-top: 18px; }
  .sky-copy .hero-services .platform-links { gap: 11px; }
  .sky-copy .hero-services .service-link { min-width: 34px; width: 34px; padding: 3px; }
  .sky-copy .sky-release-link { left: auto; right: 0; font-size: 10px; gap: 4px; }
  .sky-bottom { left: 7%; right: 7%; bottom: 25px; gap: 15px; grid-template-columns: 1fr 44px; }
  .sky-worlds { grid-column: 1/-1; grid-row: 1; gap: 15px; }
  .sky-world { font-size: 9px; min-height: 45px; line-height: 1.4; }
  .sky-explore { grid-column: 1; grid-row: 2; font-size: 9px; }
  .sky-motion { grid-column: 2; grid-row: 2; width: 38px; height: 38px; }
  .sky-shade { background: linear-gradient(0deg,#070b10f5 1%,#070b1090 35%,#070b100c 75%,#070b1060); }
  .home-page .release-shorts { grid-template-columns: 1fr; gap: 35px; padding-block: 65px; }
  .release-short-copy h2 { font-size: 57px; max-width: 9ch; margin-bottom: 20px; }
  .release-short-copy .eyebrow { font-size: 8px; margin-bottom: 20px; }
  .release-short-copy > p:not(.eyebrow):not(.release-cut-song) { max-width: 42ch; }
  .release-short-copy .quiet-link { margin-top: 14px; }
  .release-cuts { gap: 15px; }
  .release-cut:nth-child(2) { margin-top: 40px; }
  .cut-play { width: 33px; height: 33px; right: 9px; bottom: 10px; }
  .cut-time { font-size: 9px; left: 10px; bottom: 18px; }
  .cut-caption h3 { font-size: 19px; }
  .film-feature { height: 85svh; min-height: 600px; }
  .film-feature-top { top: 25px; gap: 16px; align-items: flex-start; }
  .film-feature-top .eyebrow { font-size: 9px; margin-top: 13px; }
  .film-feature-top .quiet-link { font-size: 10px; }
  .film-feature-bottom { bottom: 40px; gap: 30px; flex-direction: column; align-items: flex-start; }
  .film-feature h2 { font-size: clamp(48px,14vw,75px); }
  .film-watch > span { width: 52px; height: 52px; }
  .home-page .selected { padding-block: 55px; }
}
@media(max-width:350px) {
  .sky-copy .sky-release-link { position: static; margin-top: 2px; }
  .sky-copy { bottom: 175px; }
  .sky-signature { top: 140px; }
  .sky-title { font-size: 43px; }
}
@media(prefers-reduced-motion:reduce) {
  .sky-ready .sky-journey { height: 100svh; }
  .sky-copy, .sky-image, .sky-world i, .sky-revealing, .cut-image img { transition: none; }
  .sky-revealing { opacity: 1; transform: none; }
}
.mj-reduced .sky-copy, .mj-reduced .sky-image, .mj-reduced .sky-world i { transition: none; }
.mj-reduced .sky-revealing { opacity: 1; transform: none; }
.mj-document-hidden * { animation-play-state: paused !important; }
/* Performance lab: two tactile instruments, one continuous visual score. */
.perf-section{position:relative;padding:100px 7% 70px;overflow:hidden;isolation:isolate;background:radial-gradient(ellipse at 50% 58%,#a0855014,transparent 65%);--perf-angle:14deg;--mix:50%;--active-hue:30}.perf-heading{text-align:center;position:relative;z-index:3}.perf-heading h2{font-family:'Playfair Display',Georgia,serif;font-weight:500;font-size:clamp(52px,7vw,100px);letter-spacing:-.045em;line-height:1.04;margin:20px 0}.perf-heading>p:not(.eyebrow){font-size:14px;color:#aaa}.perf-camera{perspective:1300px;margin:45px auto 20px;max-width:1080px;padding:40px 0 20px}.perf-console{position:relative;border:1px solid #77756e;border-radius:22px;padding:26px 32px;background:linear-gradient(150deg,#353637,#181a1c 35%,#111315);box-shadow:0 12px 0 #08090a,0 14px 0 #4d4d48,0 45px 70px #000d,inset 0 1px #ffffff55;transform:rotateX(var(--perf-angle)) rotateZ(-2deg);transform-style:preserve-3d;transition:transform .25s ease-out;will-change:transform}.perf-console:before{content:'';position:absolute;inset:10px;border:1px solid #ffffff0c;border-radius:15px;pointer-events:none}.perf-console-top,.perf-console-bottom{display:flex;justify-content:space-between;align-items:center;gap:15px;font-family:monospace;font-size:9px;letter-spacing:.15em;color:#bab8ad}.perf-console-top{margin-bottom:24px}.perf-status{color:#d5bd8b}.perf-console-bottom{margin-top:25px;font-size:7px}.perf-wave{height:65px;display:flex;align-items:center;justify-content:center;gap:4px;border-radius:5px;border:1px solid #3b423d;background:linear-gradient(90deg,#11241d,#121714 50%,#1d2114);padding:10px 14px;overflow:hidden;box-shadow:inset 0 2px 12px #000c}.perf-wave i{width:1.3%;height:var(--h);background:linear-gradient(#e4d69e,#7fbd9e);box-shadow:0 0 6px #9fc3a740;animation:perf-wave 2.8s ease-in-out infinite alternate;animation-delay:calc(var(--bar)*-97ms);transform-origin:center}.perf-decks{display:grid;grid-template-columns:1fr 115px 1fr;gap:30px;align-items:center;margin-top:22px}.perf-deck{position:relative;display:block;aspect-ratio:1;border:1px solid #525553;border-radius:50%;background:radial-gradient(circle,#17191b 55%,#42484b 56%,#16191a 60%,#717775 62%,#232627 64%);box-shadow:0 9px 20px #000b,inset 0 0 0 6px #0e1011;padding:12%;cursor:pointer;transition:box-shadow .4s,transform .4s;color:#ccc;touch-action:manipulation}.perf-deck:hover{box-shadow:0 10px 35px #000d,0 0 24px #d5bd8b25;transform:translateY(-3px)}.perf-deck-ring{position:absolute;inset:7%;border-radius:50%;border:1px dashed #aba99266}.perf-disc{position:relative;display:block;width:100%;height:100%;border-radius:50%;background:repeating-radial-gradient(#111315 0px,#292c2d 1px,#141617 3px);border:1px solid #727370;box-shadow:inset 0 0 0 5px #181a1b;animation:mj-spin 18s linear infinite;overflow:hidden}.perf-deck-b .perf-disc{animation-direction:reverse;animation-duration:24s}.perf-disc:after{content:'';position:absolute;inset:0;background:conic-gradient(transparent,#ffffff20,transparent 30%,transparent 50%,#ffffff20,transparent 80%);border-radius:50%}.perf-disc img{position:absolute;inset:30%;width:40%;height:40%;object-fit:cover;border-radius:50%;border:2px solid #ccb88a}.perf-disc i{position:absolute;left:49%;top:49%;width:3%;height:3%;background:#111;border:1px solid #999;border-radius:50%;z-index:2}.perf-deck[aria-pressed=false] .perf-disc{animation-play-state:paused}.perf-deck[aria-pressed=false]{filter:saturate(.3)}.perf-deck-label{position:absolute;bottom:4%;left:10%;right:10%;font:8px monospace;letter-spacing:.1em;pointer-events:none}.perf-deck-label b{display:block;font-size:6px;font-weight:400;color:#9b9d97;margin-top:3px}.perf-mixer{text-align:center;font:8px monospace;color:#a7aba5;letter-spacing:.15em}.perf-meter{display:flex;justify-content:center;gap:9px;height:75px;padding-top:12px}.perf-meter i{width:7px;background:repeating-linear-gradient(0deg,#afd2ab 0 4px,transparent 4px 7px);clip-path:inset(20% 0 0);animation:perf-meter 3s ease-in-out infinite alternate;box-shadow:0 0 14px #a4d78a20}.perf-meter i+ i{animation-delay:-1.5s}.perf-knobs{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:20px auto;width:70px}.perf-knobs i{width:28px;height:28px;border-radius:50%;background:linear-gradient(110deg,#5d6262,#181a1b);border:2px solid #111;box-shadow:1px 3px 4px #000;position:relative}.perf-knobs i:after{content:'';position:absolute;top:3px;left:11px;width:2px;height:8px;background:#e5d4ac;transform:rotate(-30deg)}.perf-mixer label{display:block;margin:12px 0}.perf-mixer input{width:100%;accent-color:#d5bd8b;cursor:ew-resize;min-height:30px}.perf-note{text-align:center;font-size:10px;color:#8a8c86;letter-spacing:.03em;margin:28px auto 0}.perf-launch{background:radial-gradient(ellipse at 50% 65%,hsl(var(--active-hue) 45% 12% / .55),transparent 65%);transition:background .7s;padding-top:90px}.perf-pad-scene{position:relative;perspective:1000px;max-width:600px;margin:50px auto 0;padding:20px 35px}.perf-padboard{position:relative;background:linear-gradient(145deg,#35363a,#121417 60%);border:1px solid #66696a;border-radius:20px;padding:28px;box-shadow:0 10px 0 #070809,0 11px 0 #52545a,0 50px 80px #000b;transform:rotateX(var(--perf-angle)) rotateZ(3deg);transition:transform .25s ease-out;will-change:transform}.perf-pad-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.perf-pad{position:relative;aspect-ratio:1;border-radius:7px;border:1px solid hsl(var(--hue) 35% 38%);background:linear-gradient(135deg,hsl(var(--hue) 25% 19%),hsl(var(--hue) 22% 10%));box-shadow:inset 0 1px #ffffff25,0 4px 0 #070809;color:hsl(var(--hue) 25% 55%);cursor:pointer;transition:background .35s,box-shadow .35s,transform .25s,color .35s;touch-action:manipulation}.perf-pad span{position:absolute;bottom:9px;left:10px;font:8px monospace;letter-spacing:.1em}.perf-pad:hover{transform:translateY(-3px);border-color:hsl(var(--hue) 70% 65%)}.perf-pad[aria-pressed=true]{background:linear-gradient(135deg,hsl(var(--hue) 75% 68%),hsl(var(--hue) 60% 42%));color:#081011;box-shadow:inset 0 1px #ffffff80,0 3px 0 #070809,0 0 24px hsl(var(--hue) 65% 50% / .35);transform:translateY(2px)}.perf-patterns{display:flex;gap:8px;justify-content:space-between;margin-top:22px}.perf-patterns button{border:1px solid #565954;border-radius:4px;background:#171a1c;font-size:10px;color:#d6d5cb;padding:10px 12px;min-height:40px;cursor:pointer}.perf-patterns button:hover,.perf-patterns button[aria-pressed=true]{background:#d5bd8b;color:#111}.perf-light-halo{position:absolute;inset:8% -20%;border:1px solid hsl(var(--active-hue) 60% 65% / .2);border-radius:50%;transform:rotateX(60deg);box-shadow:0 0 0 35px #ffffff02,0 0 0 70px #ffffff02,0 0 100px hsl(var(--active-hue) 60% 40% / .15);transition:box-shadow .7s,border-color .7s}.perf-inactive *,.perf-inactive *:before,.perf-inactive *:after{animation-play-state:paused!important}.mj-reduced .perf-console,.mj-reduced .perf-padboard{transform:none!important;transition:none}.mj-reduced .perf-wave i{transform:none}.perf-deck:focus-visible,.perf-pad:focus-visible,.perf-patterns button:focus-visible{outline:3px solid #fff;outline-offset:5px}@keyframes perf-wave{from{transform:scaleY(.35);opacity:.5}to{transform:scaleY(1.5);opacity:1}}@keyframes perf-meter{to{clip-path:inset(65% 0 0)}}
@media(max-width:600px){.perf-section{padding:65px 5% 45px}.perf-heading h2{font-size:54px}.perf-heading .eyebrow{font-size:8px}.perf-heading>p:not(.eyebrow){font-size:12px}.perf-camera{margin:25px auto 0;padding:25px 0}.perf-console{padding:15px 12px;border-radius:12px;transform:rotateX(var(--perf-angle)) rotateZ(-1deg)}.perf-console-top{font-size:6px;letter-spacing:.05em;margin-bottom:14px}.perf-console-bottom{font-size:5px;letter-spacing:0;margin-top:16px}.perf-wave{height:36px;gap:2px;padding:5px}.perf-decks{grid-template-columns:1fr 52px 1fr;gap:8px;margin-top:14px}.perf-deck-label{font-size:5px;bottom:4%}.perf-deck-label b{font-size:4px}.perf-mixer{font-size:6px;letter-spacing:0}.perf-meter{height:40px;gap:5px}.perf-meter i{width:4px}.perf-knobs{width:42px;gap:6px;margin:10px auto}.perf-knobs i{width:18px;height:18px}.perf-knobs i:after{left:6px;height:5px;top:2px}.perf-mixer label{margin:4px 0}.perf-mixer input{min-height:34px}.perf-note{font-size:8px;max-width:280px;line-height:1.6}.perf-pad-scene{margin:25px auto 0;padding:20px 10px}.perf-padboard{padding:18px;border-radius:13px}.perf-pad-grid{gap:9px}.perf-pad{border-radius:5px}.perf-pad span{font-size:6px;bottom:6px;left:7px}.perf-patterns{gap:6px;margin-top:16px}.perf-patterns button{font-size:8px;padding:8px;min-height:42px}.perf-launch .perf-heading h2{font-size:51px}}
.perf-pad:after{content:'';position:absolute;inset:2px;border-radius:4px;pointer-events:none;background:linear-gradient(135deg,hsl(var(--hue) 80% 72% / .28),transparent 70%);opacity:.1;animation:perf-pad-breathe 5.6s ease-in-out infinite;animation-delay:calc(var(--pad)*-.34s)}.perf-pad[aria-pressed=true]:after{background:linear-gradient(135deg,#fff8,transparent 70%)}.perf-launch .perf-light-halo{animation:perf-halo 9s ease-in-out infinite alternate}.perf-section .perf-heading h2{transition:transform .35s ease-out;transform:none}@keyframes perf-pad-breathe{0%,100%{opacity:.08}45%,65%{opacity:.8}}@keyframes perf-halo{to{transform:rotateX(55deg) rotateZ(35deg) scale(1.14);opacity:.6}}

@media(max-width:600px){.perf-mixer input{min-height:44px}.perf-patterns button{min-height:44px}}
/* 141: 64 tactile sample pads with genuine, user-triggered song audio. */
.perf-launch .perf-pad-scene{max-width:760px;padding:24px 35px}.perf-launch .perf-padboard{padding:30px;border-radius:18px;background:linear-gradient(145deg,#2c2e31,#111315 70%);box-shadow:0 8px 0 #050607,0 10px 0 #484b4c,0 50px 80px #000b}.perf-launch .perf-pad-grid{grid-template-columns:repeat(8,1fr);gap:9px}.perf-launch .perf-pad{border:1px solid hsl(var(--hue) 25% 39%);border-radius:5px;background:linear-gradient(145deg,hsl(var(--hue) 13% 30%),hsl(var(--hue) 17% 18%));box-shadow:inset 0 2px 3px #ffffff18,inset 0 -4px 6px #0005,0 3px 0 #040506,0 4px 6px #0008}.perf-launch .perf-pad:after{inset:4px;animation-duration:9s;background:linear-gradient(135deg,hsl(var(--hue) 65% 65% / .32),transparent 80%)}.perf-launch .perf-pad span{font-size:7px;bottom:6px;left:7px;opacity:.75}.perf-launch .perf-pad[aria-pressed=true]{background:linear-gradient(145deg,hsl(var(--hue) 75% 75%),hsl(var(--hue) 70% 52%));box-shadow:inset 0 2px 4px #fff9,inset 0 -4px 6px #0002,0 1px 0 #040506,0 0 30px hsl(var(--hue) 80% 60% / .55);transform:translateY(2px)}.lp-screen{position:relative;margin-top:24px;padding:16px 85px 16px 14px;background:#0b1412;border:1px solid #3d4b46;border-radius:4px;box-shadow:inset 0 2px 8px #000;min-height:85px;font-family:monospace}.lp-state{display:block;color:#a4bfae;font-size:9px;line-height:1.5}.lp-title{display:block;font-size:13px;margin:7px 0;color:#e7e8d7;line-height:1.3;overflow-wrap:anywhere;font-weight:400}.lp-progress{height:2px;background:#27352e;margin-top:10px;overflow:hidden}.lp-progress i{display:block;height:100%;background:#d5bd8b;transform:scaleX(0);transform-origin:left;transition:transform .16s linear}.lp-stop{position:absolute;right:12px;top:20px;min-height:44px;min-width:60px;background:linear-gradient(#363a3a,#202324);color:#efeee4;border:1px solid #5d6560;border-radius:4px;font:10px monospace;cursor:pointer;box-shadow:0 3px #050606}.lp-stop:hover{background:#4c5150}.lp-summary{text-align:center;font-size:12px;letter-spacing:.05em;color:#d4cbb7;margin:30px 0 0}.lp-bank-list{list-style:none;max-width:650px;padding:0;margin:30px auto 0;display:grid;grid-template-columns:1fr 1fr;gap:12px 26px}.lp-bank-list li{display:flex;gap:12px;font-size:10px;color:#a2a69e;line-height:1.5}.lp-bank-list b{font:9px monospace;color:#d5bd8b;padding-top:2px}.lp-bank-list span{overflow-wrap:anywhere}.lp-playing .perf-light-halo{border-color:hsl(var(--active-hue) 80% 70% / .5)}
@media(max-width:600px){.perf-launch{padding-inline:0}.perf-launch .perf-heading{padding-inline:6%}.perf-launch .perf-pad-scene{padding:16px 3px;margin-top:20px;width:100%;perspective:none}.perf-launch .perf-padboard{padding:12px 5px;border-radius:10px;transform:none!important;will-change:auto}.perf-launch .perf-console-top{padding-inline:8px}.perf-launch .perf-pad-grid{gap:3px}.perf-launch .perf-pad{border-radius:3px;min-height:42px;min-width:0}.perf-launch .perf-pad span{left:4px;bottom:4px;font-size:6px}.perf-launch .perf-pad:after{inset:2px}.lp-screen{margin:16px 6px 0;padding:12px 78px 12px 10px;min-height:95px}.lp-title{font-size:11px}.lp-state{font-size:8px}.lp-stop{right:8px;min-width:58px;font-size:9px}.lp-summary{font-size:10px;padding-inline:15px}.lp-bank-list{padding:0 7%;gap:10px 15px}.lp-bank-list li{font-size:9px}.perf-launch .perf-note{padding-inline:15px}}
/* 142: APC64 panel proportions, dual pairs of touch strips, controls and encoder. */
.perf-launch .perf-pad-scene{max-width:1160px;padding:25px 15px}.perf-launch .apc-chassis{display:grid;grid-template-columns:1.05fr .38fr 4fr .38fr 1.05fr;grid-template-rows:50px auto 80px;gap:15px 13px;padding:25px 20px 20px;border-radius:5px;background:linear-gradient(150deg,#25262a,#15161a 65%,#232428);border-color:#626469;box-shadow:0 8px #08090b,0 10px #494b4d,0 35px 70px #000b;transform:rotateX(var(--perf-angle)) rotateZ(-1deg)}.apc-brand{grid-column:1 / 3;grid-row:1;align-self:center;color:#eee}.apc-brand b{display:block;font-size:30px;letter-spacing:-.06em;font-weight:800}.apc-brand small{font:7px monospace;letter-spacing:.1em}.apc-model{grid-column:5;grid-row:1;font-size:26px;letter-spacing:-.05em;color:#d2d4da;font-weight:300;text-align:right;align-self:center}.apc-model small{display:block;font:6px monospace;letter-spacing:.08em;color:#888d92}.apc-top{grid-column:3 / 5;grid-row:1;display:flex;gap:7px;align-items:center}.apc-modes{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;flex:1}.apc-modes span,.apc-function-column span{display:flex;align-items:center;justify-content:center;border:1px solid #666a6d;background:linear-gradient(#4a4d50,#323437);border-radius:3px;box-shadow:0 2px 2px #000b;color:#c0c5c5;font:5px monospace;text-align:center;line-height:1.2;padding:4px 2px;min-height:24px}.apc-top button{font:7px monospace;position:static;min-width:38px;min-height:30px;padding:4px;background:#363a3b;border:1px solid #747978;color:#d5dcd6;border-radius:3px;cursor:pointer}.apc-record{height:26px;width:26px;flex-shrink:0;background:radial-gradient(circle,#c2474c 0 17%,#313337 20%);border:1px solid #63686a;border-radius:3px}.apc-left{grid-column:1;grid-row:2}.apc-right{grid-column:5;grid-row:2}.apc-touchbank{display:grid;height:100%;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:22px 15px}.apc-touch{display:block;position:relative;min-height:100px;--level:75%}.apc-touch>span{position:absolute;top:-12px;left:40%;font:6px monospace;color:#939a9f}.apc-touch input{writing-mode:vertical-lr;direction:rtl;appearance:none;-webkit-appearance:none;width:72%;height:100%;min-height:100px;border-radius:3px;border:1px solid #43474e;background:linear-gradient(90deg,#080a0e,#1a1c22 50%,#080a0e);box-shadow:inset 0 0 0 3px #0c0e11;cursor:ns-resize;touch-action:none;margin:0}.apc-touch input::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:80%;height:3px;background:#dce7f4;border-radius:1px;box-shadow:0 0 10px #e2ecff7a}.apc-touch input::-moz-range-thumb{width:80%;height:3px;background:#dce7f4;border:0}.apc-touch>i{position:absolute;right:2px;top:0;bottom:0;width:3px;background:repeating-linear-gradient(0deg,#6acac1 0 2px,transparent 2px 10px);opacity:.65;clip-path:inset(calc(100% - var(--level)) 0 0);pointer-events:none}.apc-function-column{grid-column:2;grid-row:2;display:flex;flex-direction:column;justify-content:space-between;gap:4px}.apc-function-column span{min-height:0;flex:1;font-size:4.5px;padding:1px}.apc-chassis .perf-pad-grid{grid-column:3;grid-row:2;gap:6px}.apc-chassis .perf-pad{border-radius:3px;box-shadow:inset 0 2px 3px #ffffff20,inset 0 -2px 4px #0003,0 2px 0 #050608}.apc-launch-column{grid-column:4;grid-row:2;display:grid;grid-template-rows:repeat(8,1fr);gap:6px}.apc-launch-column button{min-width:0;background:linear-gradient(#454a4d,#2f3335);border:1px solid #737a7c;border-radius:3px;font:5px monospace;color:#c0cac9;cursor:pointer;padding:3px}.apc-launch-column span{display:block;font-size:5px;margin-top:4px;color:#8a9692}.apc-launch-column button:hover{background:#738c84}.apc-nav{grid-column:1 / 3;grid-row:3;align-self:center;text-align:center;font-size:45px;color:#757b7d}.apc-tracks{grid-column:3;grid-row:3;display:grid;grid-template-columns:repeat(8,1fr);gap:6px;align-self:center}.apc-tracks>span{display:block;border:1px solid #666c70;border-radius:3px;font:7px monospace;color:#b4babc;padding:5px;background:#31353a}.apc-tracks i{display:block;height:18px;border-top:2px solid #9aada7;margin-top:7px;background:#20252a}.apc-chassis .lp-screen{grid-column:4 / 6;grid-row:3;margin:0;padding:8px 35px 5px 8px;min-height:0;align-self:stretch;background:#060d16;border-color:#333b46}.apc-chassis .lp-title{font-size:8px;margin:4px 0}.apc-chassis .lp-state{font-size:6px}.apc-chassis .lp-screen .lp-stop{right:4px;top:auto;bottom:6px;min-width:30px;min-height:25px;font-size:6px;padding:2px}.apc-encoder{position:absolute;right:4px;top:5px;width:26px;height:26px;border-radius:50%;background:repeating-conic-gradient(#222 0deg 5deg,#555 5deg 10deg);border:2px solid #888;box-shadow:0 3px 6px #000}.apc-encoder:after{content:'';position:absolute;inset:4px;border-radius:50%;background:linear-gradient(#383d42,#111417)}.apc-disclaimer{text-align:center;font-size:9px;color:#8a8e90;margin:25px 5% 0}.apc-view-toggle{display:none}.apc-scroll{overflow:visible}
@media(max-width:600px){.apc-view-toggle{display:block;margin:20px auto 0;border:1px solid #71756b;background:#252a29;color:#e0e0d6;min-height:44px;padding:10px 20px;border-radius:4px;font-size:11px}.apc-scroll{overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin}.perf-launch .perf-pad-scene{padding:15px 3px;max-width:none;margin-top:0}.perf-launch .apc-chassis{display:grid;grid-template-columns:1fr;grid-template-rows:auto auto auto;gap:14px;padding:12px 5px;transform:none!important}.apc-chassis .apc-brand,.apc-chassis .apc-model,.apc-chassis .apc-left,.apc-chassis .apc-right,.apc-chassis .apc-top,.apc-chassis .apc-function-column,.apc-chassis .apc-launch-column,.apc-chassis .apc-tracks,.apc-chassis .apc-nav{display:none}.apc-chassis:before{content:'DYC / APC64 INSPIRED · 8 × 8';position:static;display:block;grid-row:1;grid-column:1;border:0;font:8px monospace;color:#9fa7ad;padding:4px 8px;letter-spacing:.1em}.apc-chassis .perf-pad-grid{grid-column:1;grid-row:2;gap:3px}.apc-chassis .lp-screen{grid-column:1;grid-row:3;min-height:95px;margin:0 6px;padding:12px 80px 12px 10px}.apc-chassis .lp-title{font-size:11px}.apc-chassis .lp-state{font-size:8px}.apc-chassis .lp-screen .lp-stop{right:8px;top:20px;bottom:auto;min-width:58px;min-height:44px;font-size:9px}.apc-chassis .apc-encoder{display:none}.apc-full .perf-pad-scene{width:900px}.apc-full .apc-chassis{grid-template-columns:1.05fr .38fr 4fr .38fr 1.05fr;grid-template-rows:50px auto 80px;gap:15px 13px;padding:25px 20px 20px}.apc-full .apc-chassis:before{display:none}.apc-full .apc-brand,.apc-full .apc-model,.apc-full .apc-left,.apc-full .apc-right,.apc-full .apc-nav{display:block}.apc-full .apc-top,.apc-full .apc-function-column{display:flex}.apc-full .apc-modes,.apc-full .apc-launch-column,.apc-full .apc-tracks{display:grid}.apc-full .perf-pad-grid{grid-column:3;grid-row:2;gap:6px}.apc-full .lp-screen{grid-column:4 / 6;grid-row:3;margin:0;padding:8px 35px 5px 8px;min-height:0}.apc-full .lp-title{font-size:8px}.apc-full .lp-state{font-size:6px}.apc-full .apc-encoder{display:block}.apc-full .lp-screen .lp-stop{min-width:30px;min-height:25px;font-size:6px;top:auto;bottom:5px}.apc-full .perf-pad{min-height:42px}.apc-disclaimer{font-size:8px;line-height:1.6}}
@media(min-width:601px){.perf-launch .apc-chassis{grid-template-columns:minmax(0,1.05fr) minmax(0,.38fr) minmax(0,4fr) minmax(0,.38fr) minmax(0,1.05fr)}}.apc-chassis>*{min-width:0}.apc-chassis .perf-pad-grid{width:100%;min-width:0;grid-template-columns:repeat(8,minmax(0,1fr))}.apc-chassis .perf-pad{min-width:0}.apc-touch input{min-width:0}.apc-full .apc-chassis{grid-template-columns:minmax(0,1.05fr) minmax(0,.38fr) minmax(0,4fr) minmax(0,.38fr) minmax(0,1.05fr)}
.apc-left,.apc-right{position:relative;min-height:0}.apc-touchbank{position:absolute;inset:0}.apc-chassis .perf-pad-grid{aspect-ratio:1;grid-template-rows:repeat(8,minmax(0,1fr));align-self:start}.apc-chassis .perf-pad{aspect-ratio:auto;height:100%}.apc-function-column,.apc-launch-column{min-height:0}
/* Instrument lighting follows the film's cooler studio interior. */
.performance-journey .perf-section { background: transparent; padding-top: 75px; padding-bottom: 35px; }
.performance-journey .perf-heading h2 { font-family: Manrope,Arial,sans-serif; font-weight: 300; font-size: clamp(45px,6vw,84px); }
.performance-journey .perf-heading .eyebrow { letter-spacing: .14em; color: #a7bbbf; }
.performance-journey .perf-pad-scene { margin-top: 32px; }
.performance-journey .perf-launch .apc-chassis { border-color: #64696e; box-shadow: 0 8px #07090a,0 10px #4b5155,0 38px 70px #000b,0 0 100px #91b3bf09; }
.performance-journey .dj-live { padding-top: 45px; padding-bottom: 80px; }
.performance-journey .dj-instruction { color: #a3b3b5; }
.perf-inactive *, .mj-reduced .perf-section *, .perf-inactive *::after, .mj-reduced .perf-section *::after { animation-play-state: paused !important; }
@media(max-width:650px) {
  .performance-journey .perf-section { padding-top: 45px; }
  .performance-journey .perf-heading h2 { font-size: 47px; }
  .performance-journey .dj-live { padding-top: 30px; padding-bottom: 50px; }
}