/* =========================================================================
   MADARA — Ez Mil × Eminem
   Void black, graffiti violet, lightning blue, and one colour that only
   shows up when the eyes open: sharingan red.
   ========================================================================= */

:root{
  --ink:#060509;
  --ink-2:#0c0a12;
  --ink-3:#14111c;
  --edge:rgba(255,255,255,.09);
  --edge-2:rgba(255,255,255,.16);

  --bone:#efe9f5;
  --mute:#948ca3;
  --faint:#5b5468;

  --violet:#b53cff;
  --violet-2:#7c3aed;
  --violet-soft:rgba(181,60,255,.16);
  --volt:#7fb2ff;
  --blood:#e3122b;
  --blood-soft:rgba(227,18,43,.18);

  --disp:'Anton',Impact,'Arial Narrow',sans-serif;
  --jp:'Dela Gothic One','Hiragino Kaku Gothic ProN',sans-serif;
  --jp-m:'Shippori Mincho B1','Hiragino Mincho ProN',serif;
  --mono:'Space Mono',ui-monospace,monospace;
  --body:'Zen Kaku Gothic New',system-ui,sans-serif;

  --gut:clamp(16px,5vw,72px);
  --sec:clamp(96px,16vh,200px);
  --ease:cubic-bezier(.22,1,.36,1);
}

*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;background:var(--ink);}
html.lenis,html.lenis body{height:auto;}
.lenis.lenis-smooth{scroll-behavior:auto !important;}
.lenis.lenis-stopped{overflow:hidden;}
body{
  background:var(--ink);
  color:var(--bone);
  font-family:var(--body);
  line-height:1.6;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
body.is-loading{overflow:hidden;}
img{display:block;max-width:100%;height:auto;}
a{color:inherit;text-decoration:none;}
button,input{font:inherit;color:inherit;background:none;border:0;}
button{cursor:pointer;}
::selection{background:var(--blood);color:#fff;}
:where(a,button,input):focus-visible{outline:2px solid var(--volt);outline-offset:4px;border-radius:2px;}
.jp{font-family:var(--jp);}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}

@media (hover:hover) and (pointer:fine){
  html.has-cursor, html.has-cursor a, html.has-cursor button, html.has-cursor input{cursor:none;}
}

/* ============================= LOADER ============================= */
.loader{position:fixed;inset:0;z-index:200;display:grid;place-items:center;pointer-events:all;}
.loader__half{position:absolute;left:0;right:0;height:50.5%;background:var(--ink);transition:transform 1.1s var(--ease);}
.loader__half--t{top:0;border-bottom:1px solid rgba(227,18,43,.0);}
.loader__half--b{bottom:0;}
.loader__core{position:relative;display:grid;justify-items:center;gap:18px;transition:opacity .5s ease, transform .8s var(--ease), filter .6s;}
/* the MADARA tag charges up: a ghost of the logo fills with colour as assets load */
.loader__logo{--p:0;position:relative;width:min(440px,74vw);}
.loader__logo img{display:block;width:100%;height:auto;}
.loader__logo-base{filter:grayscale(1) brightness(.55);opacity:.22;}
.loader__logo-fill{
  position:absolute;inset:0;
  /* negative insets let the glow spill past the image edges; only the right edge moves */
  clip-path:inset(-40% calc(100% - var(--p) * 1%) -40% -20%);
  filter:drop-shadow(0 0 18px rgba(181,60,255,.65)) drop-shadow(0 0 4px rgba(127,178,255,.8));
  animation:chargeFlicker 2.2s steps(1) infinite;
}
.loader__edge{
  position:absolute;top:8%;bottom:8%;left:calc(var(--p) * 1%);width:2px;margin-left:-1px;
  background:linear-gradient(transparent,#fff 20%,#fff 80%,transparent);
  box-shadow:0 0 12px 2px rgba(127,178,255,.9),0 0 34px 6px rgba(181,60,255,.6);
  transition:opacity .3s;
}
@keyframes chargeFlicker{0%,100%{opacity:1}43%{opacity:.75}44%{opacity:1}71%{opacity:.85}72%{opacity:1}}
.loader__logo.is-full .loader__edge{opacity:0;}
.loader__logo.is-full .loader__logo-fill{animation:chargeBurst .6s steps(1) 1 forwards;}
@keyframes chargeBurst{
  0%{filter:drop-shadow(0 0 40px rgba(181,60,255,1)) drop-shadow(0 0 12px rgba(127,178,255,1)) brightness(1.6);}
  25%{filter:drop-shadow(0 0 18px rgba(181,60,255,.65)) brightness(1);}
  45%{filter:drop-shadow(0 0 50px rgba(181,60,255,1)) drop-shadow(0 0 16px #fff) brightness(1.8);}
  100%{filter:drop-shadow(0 0 26px rgba(181,60,255,.8)) drop-shadow(0 0 6px rgba(127,178,255,.9));}
}
.loader__by{font:700 11px/1 var(--mono);letter-spacing:.34em;color:var(--bone);margin-top:-6px;}
.loader__by em{font-family:var(--jp-m);font-style:italic;font-weight:600;color:var(--violet);letter-spacing:.04em;margin:0 .3em;}
.loader__bar{width:min(260px,60vw);height:1px;background:var(--edge-2);overflow:hidden;}
.loader__bar i{display:block;height:100%;width:100%;background:linear-gradient(90deg,var(--violet),var(--volt));transform-origin:left;transform:scaleX(0);}
.loader__pct{font:400 11px/1 var(--mono);letter-spacing:.12em;color:var(--mute);text-transform:uppercase;}
.loader__pct b{color:var(--bone);font-weight:700;margin-right:8px;}
.loader.is-done{pointer-events:none;}
.loader.is-done .loader__core{opacity:0;transform:scale(1.15);filter:blur(6px);}
.loader.is-done .loader__half--t{transform:translateY(-101%);}
.loader.is-done .loader__half--b{transform:translateY(101%);}
@keyframes spin{to{transform:rotate(360deg)}}

/* ============================= AMBIENT ============================= */
.grain{
  position:fixed;inset:-50%;width:200%;height:200%;z-index:90;pointer-events:none;opacity:.07;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='220' height='220' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grain 6s steps(8) infinite;
}
@keyframes grain{0%,100%{transform:translate(0,0)}25%{transform:translate(-3%,-4%)}50%{transform:translate(4%,2%)}75%{transform:translate(-2%,4%)}}

.progress{position:fixed;top:0;left:0;right:0;height:2px;z-index:95;pointer-events:none;}
.progress i{display:block;height:100%;background:linear-gradient(90deg,var(--violet),var(--blood));transform-origin:left;transform:scaleX(0);}

.sparks{position:fixed;inset:0;width:100%;height:100%;z-index:150;pointer-events:none;}

/* custom cursor */
.cursor{position:fixed;left:0;top:0;z-index:160;pointer-events:none;display:none;mix-blend-mode:difference;}
html.has-cursor .cursor{display:block;opacity:0;transition:opacity .3s;}
html.has-cursor .cursor.is-on{opacity:1;}
.cursor__dot{position:absolute;width:6px;height:6px;margin:-3px 0 0 -3px;border-radius:50%;background:#fff;}
.cursor__ring{position:absolute;width:38px;height:38px;margin:-19px 0 0 -19px;color:#fff;transition:width .35s var(--ease),height .35s var(--ease),margin .35s var(--ease),opacity .3s;opacity:.55;}
.cursor__ring svg{width:100%;height:100%;animation:spin 6s linear infinite;}
.cursor.is-hover .cursor__ring{width:74px;height:74px;margin:-37px 0 0 -37px;opacity:1;}
.cursor.is-hover .cursor__ring svg{animation-duration:1.4s;}
.cursor__label{position:absolute;transform:translate(-50%,-50%);font:400 18px/1 var(--jp);color:#fff;opacity:0;transition:opacity .2s;}
.cursor.has-label .cursor__label{opacity:1;}
.cursor.has-label .cursor__dot{opacity:0;}

/* ============================= NAV ============================= */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  display:flex;align-items:center;gap:28px;
  padding:16px var(--gut);
}
.nav__mark img{width:92px;height:auto;filter:drop-shadow(0 0 14px rgba(181,60,255,.35)) drop-shadow(0 2px 6px rgba(0,0,0,.8));}
.nav__links{display:flex;gap:30px;margin-left:auto;}
.nav__links a{text-shadow:0 1px 10px rgba(0,0,0,.9);display:flex;align-items:baseline;gap:8px;font:700 12px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--mute);transition:color .25s;}
.nav__links a i{font-style:normal;font-weight:400;color:var(--faint);font-size:10px;}
.nav__links a b{font:800 15px/1 var(--jp-m);color:var(--bone);transition:color .25s, text-shadow .25s;}
.nav__links a:hover{color:var(--bone);}
.nav__links a:hover b,.nav__links a.is-active b{color:var(--blood);text-shadow:0 0 12px rgba(227,18,43,.7);}
.nav__links a.is-active{color:var(--bone);}
.nav__cta{
  background:rgba(6,5,9,.35);display:inline-flex;align-items:center;gap:10px;padding:11px 18px;border:1px solid var(--edge-2);border-radius:999px;
  font:700 11px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;transition:background .3s,border-color .3s,color .3s;
}
.nav__cta:hover{background:var(--bone);color:var(--ink);border-color:var(--bone);}
.nav__cta-dot{width:7px;height:7px;border-radius:50%;background:var(--blood);box-shadow:0 0 10px var(--blood);animation:pulse 1.6s ease-in-out infinite;}
@keyframes pulse{50%{opacity:.35;transform:scale(.7)}}
.nav__burger{display:none;width:40px;height:40px;position:relative;}
.nav__burger span{position:absolute;left:10px;right:10px;height:1.5px;background:var(--bone);transition:transform .35s var(--ease);}
.nav__burger span:first-child{top:16px;}
.nav__burger span:last-child{top:23px;}
.nav__burger[aria-expanded="true"] span:first-child{transform:translateY(3.5px) rotate(45deg);}
.nav__burger[aria-expanded="true"] span:last-child{transform:translateY(-3.5px) rotate(-45deg);}
.menu{position:fixed;inset:0;z-index:99;background:rgba(6,5,9,.96);display:flex;flex-direction:column;justify-content:center;gap:10px;padding:0 var(--gut);}
.menu[hidden]{display:none;}
.menu a{font:400 clamp(44px,13vw,72px)/1.05 var(--jp);display:flex;align-items:baseline;gap:14px;}
.menu a i{font:400 12px/1 var(--mono);color:var(--faint);font-style:normal;}
.menu a span{font:400 .42em/1 var(--disp);letter-spacing:.06em;color:var(--mute);text-transform:uppercase;}

/* ============================= SHARED TYPE ============================= */
.index{font:400 11px/1.4 var(--mono);letter-spacing:.2em;text-transform:uppercase;color:var(--mute);}
.index b{color:var(--blood);font-weight:700;}
.h2{font:400 clamp(44px,8.4vw,132px)/.92 var(--disp);text-transform:uppercase;letter-spacing:-.005em;margin-top:18px;}
.lede{max-width:46ch;color:var(--mute);margin-top:22px;font-size:clamp(15px,1.15vw,17px);}
.section-head{padding:0 var(--gut);position:relative;z-index:2;}
.eyebrow{display:inline-flex;align-items:center;gap:12px;font:700 11px/1 var(--mono);letter-spacing:.24em;text-transform:uppercase;color:var(--bone);}
.eyebrow i{display:block;width:28px;height:1px;background:var(--blood);}
.bigjp{
  position:absolute;top:6%;right:-2vw;z-index:0;pointer-events:none;user-select:none;
  font:400 clamp(220px,38vw,620px)/.8 var(--jp);color:transparent;-webkit-text-stroke:1px rgba(181,60,255,.14);
}
.bigjp--r{left:-3vw;right:auto;top:auto;bottom:-6%;-webkit-text-stroke-color:rgba(227,18,43,.12);}

/* split-text chars (SplitText-style reveal) */
.split-line{display:block;overflow:hidden;padding-bottom:.06em;margin-bottom:-.06em;}
.split-word{display:inline-block;white-space:nowrap;}
.split-char{display:inline-block;will-change:transform;}

[data-reveal]{opacity:0;transform:translateY(24px);}
.no-js [data-reveal],.reduced [data-reveal]{opacity:1;transform:none;}

/* buttons */
.btn{
  position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:16px 28px;border-radius:999px;overflow:hidden;isolation:isolate;
  font:700 12px/1 var(--mono);letter-spacing:.18em;text-transform:uppercase;
  transition:color .35s var(--ease),border-color .35s;
}
.btn::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;transform:translateY(101%);transition:transform .45s var(--ease);}
.btn--solid{background:var(--blood);color:#fff;box-shadow:0 0 34px rgba(227,18,43,.45);}
.btn--solid::before{background:var(--bone);}
.btn--solid:hover{color:var(--ink);}
.btn--ghost{border:1px solid var(--edge-2);color:var(--bone);}
.btn--ghost::before{background:var(--violet);}
.btn--ghost:hover{border-color:var(--violet);}
.btn:hover::before{transform:translateY(0);}

/* ============================= HERO ============================= */
.hero{position:relative;height:820vh;background:var(--ink);}
.hero__stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;isolation:isolate;}
.hero__rain{position:absolute;inset:0;width:100%;height:100%;z-index:0;opacity:.8;
  -webkit-mask-image:radial-gradient(ellipse 30% 62% at 50% 58%,transparent 55%,#000 92%);
          mask-image:radial-gradient(ellipse 30% 62% at 50% 58%,transparent 55%,#000 92%);}

.hero__type{
  position:absolute;inset:0;z-index:1;pointer-events:none;user-select:none;
  -webkit-mask-image:radial-gradient(ellipse 22% 42% at 50% 40%,transparent 35%,#000 100%);
          mask-image:radial-gradient(ellipse 22% 42% at 50% 40%,transparent 35%,#000 100%);
}
.ht{position:absolute;white-space:nowrap;will-change:transform;}
.ht--row{display:flex;gap:.25em;left:-10vw;}
.ht--a{top:5vh;font:400 clamp(120px,24vw,380px)/.85 var(--disp);color:transparent;-webkit-text-stroke:1.2px rgba(181,60,255,.28);letter-spacing:.01em;}
.ht--b{bottom:4vh;font:400 clamp(60px,10vw,170px)/1 var(--jp);color:rgba(239,233,245,.06);}
.ht--col{top:50%;writing-mode:vertical-rl;font:400 clamp(40px,6vw,96px)/1 var(--jp);letter-spacing:.12em;color:rgba(239,233,245,.1);translate:0 -50%;}
.ht--l{left:var(--gut);}
.ht--r{right:var(--gut);color:rgba(227,18,43,.16);}
.ht--mini{font:400 10px/1.7 var(--mono);letter-spacing:.2em;color:rgba(239,233,245,.34);text-transform:uppercase;}
.ht--m1{top:17vh;left:calc(var(--gut) + clamp(60px,7vw,120px));}
.ht--m2{top:22vh;right:calc(var(--gut) + clamp(60px,7vw,120px));text-align:right;}
.ht--m3{bottom:24vh;left:calc(var(--gut) + clamp(60px,7vw,120px));}
.ht--m4{bottom:30vh;right:calc(var(--gut) + clamp(60px,7vw,120px));text-align:right;}
.ht--kanji{font:800 clamp(28px,3vw,44px)/1 var(--jp-m);color:rgba(239,233,245,.14);}
.ht--k1{top:40vh;left:26vw;}
.ht--k2{top:62vh;right:25vw;color:rgba(227,18,43,.3);}

.hero__canvas{position:absolute;inset:0;width:100%;height:100%;z-index:2;mix-blend-mode:lighten;}
.hero__fallback{display:none;position:absolute;left:50%;bottom:0;height:100%;width:auto;max-width:none;translate:-50% 0;z-index:2;mix-blend-mode:lighten;}
.reduced .hero__fallback{display:block;}
.reduced .hero__canvas{display:none;}

.hero__burst{position:absolute;left:50%;top:32%;z-index:3;width:0;height:0;pointer-events:none;mix-blend-mode:screen;}
.hero__ring{position:absolute;left:0;top:0;width:220px;height:220px;margin:-110px 0 0 -110px;color:var(--blood);opacity:0;will-change:transform,opacity;}
.hero__ring--2{color:#ff5a6a;}
.hero__ring--3{color:var(--violet);}
.hero__flash{position:absolute;inset:0;z-index:4;pointer-events:none;opacity:0;background:radial-gradient(circle at 50% 32%,rgba(255,60,70,.85),rgba(227,18,43,.35) 30%,rgba(6,5,9,0) 70%);mix-blend-mode:screen;}
.hero__thunder{position:absolute;inset:0;width:100%;height:100%;z-index:4;pointer-events:none;mix-blend-mode:screen;opacity:.8;}
.reduced .hero__thunder{display:none;}
.hero__vig{position:absolute;inset:0;z-index:5;pointer-events:none;background:radial-gradient(ellipse 80% 70% at 50% 45%,transparent 50%,rgba(6,5,9,.85) 100%),linear-gradient(to top,rgba(6,5,9,.9),transparent 26%);}

.hero__intro{position:absolute;z-index:6;left:var(--gut);bottom:clamp(90px,14vh,150px);max-width:min(560px,80vw);}
.hero__artist{margin-bottom:18px;}
.hero__artist img{display:block;width:clamp(170px,19vw,290px);height:auto;filter:drop-shadow(0 4px 18px rgba(0,0,0,.8)) drop-shadow(0 0 20px rgba(181,60,255,.4));}
.hero__title{margin-top:20px;}
.hero__title-en{display:block;font:400 clamp(46px,7vw,112px)/.9 var(--disp);text-transform:uppercase;}
.hero__title-jp{display:block;margin-top:12px;font:800 clamp(16px,1.6vw,22px)/1 var(--jp-m);letter-spacing:.5em;color:var(--mute);}
.hero__by{margin-top:22px;font:700 12px/1 var(--mono);letter-spacing:.24em;color:var(--bone);}
.hero__by em,.hero__credit em,.player__by em,.foot__credit em{font-family:var(--jp-m);font-style:italic;font-weight:600;color:var(--violet);letter-spacing:.04em;text-transform:none;margin:0 .3em;}

.hero__caps{position:absolute;z-index:6;left:var(--gut);bottom:clamp(90px,14vh,150px);list-style:none;}
.hero__caps li{position:absolute;left:0;bottom:0;display:grid;grid-template-columns:auto 1fr;column-gap:16px;align-items:end;opacity:0;white-space:nowrap;}
.hero__caps li b{grid-row:span 2;font:400 11px/1 var(--mono);color:var(--blood);align-self:start;padding-top:10px;}
.hero__caps li .jp{font-size:clamp(46px,6vw,92px);line-height:1;color:var(--bone);}
.hero__caps li [data-decrypt]{font:700 12px/1.4 var(--mono);letter-spacing:.3em;color:var(--mute);margin-top:12px;}
.hero__caps li[data-cap="2"] .jp,.hero__caps li[data-cap="3"] .jp{color:var(--blood);text-shadow:0 0 30px rgba(227,18,43,.6);}

.hero__name{position:absolute;z-index:6;left:var(--gut);top:24vh;width:min(27vw,390px);display:grid;justify-items:start;gap:12px;opacity:0;pointer-events:none;}
.hero__name-slash{position:absolute;left:-6%;right:-10%;top:40%;height:clamp(46px,6vw,90px);z-index:-1;background:var(--blood);clip-path:polygon(3% 0,100% 0,97% 100%,0 100%);box-shadow:0 0 60px rgba(227,18,43,.55);transform-origin:left center;transform:scaleX(0);}
.hero__name-tag{display:flex;align-items:center;gap:12px;font:700 12px/1 var(--mono);letter-spacing:.34em;text-transform:uppercase;color:var(--bone);}
.hero__name-tag .jp{font:800 24px/1 var(--jp-m);color:var(--blood);letter-spacing:0;}
.hero__name-img{width:100%;clip-path:inset(0 100% 0 0);}
.hero__name-img img{display:block;width:100%;height:auto;filter:drop-shadow(0 6px 24px rgba(0,0,0,.8)) drop-shadow(0 0 22px rgba(181,60,255,.4));}
.hero__name-role{font:400 11px/1.4 var(--mono);letter-spacing:.24em;text-transform:uppercase;color:var(--mute);}
.hero__name-role em{font-style:normal;color:var(--blood);}
.reduced .hero__name{display:none;}
.hero__final{position:absolute;z-index:7;left:50%;bottom:clamp(40px,8vh,90px);translate:-50% 0;display:grid;justify-items:center;gap:14px;width:min(760px,92vw);opacity:0;pointer-events:none;}
.hero__final.is-live{pointer-events:auto;}
.hero__logo{width:min(470px,74vw);height:auto;filter:drop-shadow(0 0 30px rgba(181,60,255,.55)) drop-shadow(0 0 6px rgba(127,178,255,.6));}
.hero__final.is-live .hero__logo{animation:volt 4.5s steps(1) infinite;}
@keyframes volt{
  0%,100%{filter:drop-shadow(0 0 30px rgba(181,60,255,.55)) drop-shadow(0 0 6px rgba(127,178,255,.6));}
  46%{filter:drop-shadow(0 0 40px rgba(181,60,255,.9)) drop-shadow(0 0 14px rgba(127,178,255,1)) brightness(1.3);}
  47%{filter:drop-shadow(0 0 30px rgba(181,60,255,.55)) drop-shadow(0 0 6px rgba(127,178,255,.6));}
  48%{filter:drop-shadow(0 0 50px rgba(181,60,255,1)) drop-shadow(0 0 18px rgba(127,178,255,1)) brightness(1.5);}
  49%{filter:drop-shadow(0 0 30px rgba(181,60,255,.55)) drop-shadow(0 0 6px rgba(127,178,255,.6));}
}
.hero__credit{font:700 13px/1 var(--mono);letter-spacing:.3em;}
.hero__cta{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin-top:8px;}

.hero__rail{position:absolute;z-index:6;right:var(--gut);top:50%;translate:0 -50%;display:grid;justify-items:center;gap:14px;}
.hero__rail-jp{font:400 20px/1 var(--jp);color:var(--bone);writing-mode:vertical-rl;min-height:3em;}
.hero__rail-track{width:1px;height:22vh;background:var(--edge-2);position:relative;overflow:hidden;}
.hero__rail-track i{position:absolute;inset:0;background:var(--blood);transform-origin:top;transform:scaleY(0);}

.hero__scroll{position:absolute;z-index:6;left:50%;bottom:26px;translate:-50% 0;display:grid;justify-items:center;gap:10px;font:400 10px/1 var(--mono);letter-spacing:.3em;text-transform:uppercase;color:var(--mute);transition:opacity .4s;}
.hero__scroll i{display:block;width:1px;height:44px;background:linear-gradient(var(--bone),transparent);animation:drip 1.8s var(--ease) infinite;transform-origin:top;}
@keyframes drip{0%{transform:scaleY(0)}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* ============================= VELOCITY MARQUEE ============================= */
.velo{position:relative;z-index:3;padding:clamp(28px,5vh,56px) 0;background:var(--ink);border-block:1px solid var(--edge);overflow:hidden;}
.velo__row{display:flex;white-space:nowrap;will-change:transform;}
.velo__row span{flex-shrink:0;font:400 clamp(44px,8vw,120px)/1.02 var(--disp);text-transform:uppercase;padding-right:.3em;}
.velo__row i{font-style:normal;color:var(--blood);font-size:.5em;vertical-align:.35em;margin:0 .15em;}
.velo__row--alt span{color:transparent;-webkit-text-stroke:1.2px rgba(239,233,245,.5);}
.velo__row--alt i{-webkit-text-stroke:0;color:var(--violet);}

/* ============================= FEATURING — THE BLADE ============================= */
/* a tall scroll track; the stage sticks while the frames scrub */
.feat{position:relative;height:620vh;background:var(--ink);}
.feat__stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;isolation:isolate;}
.feat__canvas,.feat__fallback{position:absolute;inset:0;width:100%;height:100%;}
.feat__canvas{z-index:1;}
.feat__fallback{object-fit:cover;object-position:46% 60%;opacity:0;}
.feat__stage::after{ /* vignette so the frame edges melt into the page */
  content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  background:linear-gradient(to bottom,var(--ink) 0,rgba(6,5,9,0) 12%,rgba(6,5,9,0) 90%,var(--ink) 100%),
             radial-gradient(120% 90% at 50% 55%,transparent 55%,rgba(6,5,9,.85) 100%);
}
.feat__flash{position:absolute;inset:0;z-index:3;pointer-events:none;opacity:0;background:radial-gradient(circle at 40% 70%,rgba(255,240,220,.9),rgba(227,18,43,.35) 35%,rgba(6,5,9,0) 75%);mix-blend-mode:screen;}

.feat__thunder{position:absolute;inset:0;width:100%;height:100%;z-index:3;pointer-events:none;mix-blend-mode:screen;opacity:.6;}
.reduced .feat__thunder,.no-js .feat__thunder{display:none;}
.feat__head{position:absolute;z-index:5;top:clamp(84px,13vh,130px);left:var(--gut);}
.feat__kanji{position:absolute;z-index:2;right:var(--gut);top:50%;translate:0 -50%;writing-mode:vertical-rl;font:400 clamp(90px,14vw,220px)/1 var(--jp);color:transparent;-webkit-text-stroke:1px rgba(239,233,245,.12);pointer-events:none;}

.feat__caps{position:absolute;z-index:5;left:var(--gut);top:calc(clamp(84px,13vh,130px) + 44px);list-style:none;}
.feat__caps li{position:absolute;left:0;top:0;display:grid;gap:12px;opacity:0;white-space:nowrap;font:700 12px/1.4 var(--mono);letter-spacing:.3em;text-transform:uppercase;color:var(--mute);}
.feat__caps .jp{font:400 clamp(46px,6vw,92px)/1 var(--jp);letter-spacing:0;color:var(--bone);}
.feat__caps li:nth-child(2) .jp{color:var(--blood);text-shadow:0 0 30px rgba(227,18,43,.6);}

/* anime "featuring" title card: red slash, then the name inks in */
.feat__card{position:absolute;z-index:6;left:var(--gut);top:26vh;width:min(31vw,440px);display:grid;justify-items:start;gap:14px;opacity:0;}
.feat__slash{position:absolute;left:-6%;right:-10%;top:38%;height:clamp(54px,8vw,110px);z-index:-1;background:var(--blood);clip-path:polygon(3% 0,100% 0,97% 100%,0 100%);box-shadow:0 0 60px rgba(227,18,43,.55);transform-origin:left center;transform:scaleX(0);}
.feat__feat{display:flex;align-items:center;gap:12px;font:700 13px/1 var(--mono);letter-spacing:.34em;text-transform:uppercase;color:var(--bone);}
.feat__feat .jp{font:800 26px/1 var(--jp-m);color:var(--blood);letter-spacing:0;}
.feat__name{width:100%;margin:0;clip-path:inset(0 100% 0 0);}
.feat__name img{display:block;width:100%;height:auto;filter:drop-shadow(0 6px 24px rgba(0,0,0,.8)) drop-shadow(0 0 22px rgba(127,178,255,.35));}
.feat__role{font:400 11px/1.4 var(--mono);letter-spacing:.24em;text-transform:uppercase;color:var(--mute);}
.feat__role em{font-style:normal;color:var(--blood);}

/* no scrubbing (no JS / reduced motion): a still of the landing with the card shown */
.no-js .feat,.reduced .feat{height:auto;}
.no-js .feat__stage,.reduced .feat__stage{position:relative;}
.no-js .feat__canvas,.reduced .feat__canvas,.no-js .feat__caps,.reduced .feat__caps{display:none;}
.no-js .feat__fallback,.reduced .feat__fallback{opacity:1;}
.no-js .feat__card,.reduced .feat__card{opacity:1;}
.no-js .feat__slash,.reduced .feat__slash{transform:none;}
.no-js .feat__name,.reduced .feat__name{clip-path:none;}

.credits{position:relative;min-height:100vh;min-height:100svh;padding-bottom:var(--sec);overflow-x:clip;}
/* the Susanoo looms behind the credits and bleeds down into the key-art intro below */
.credits__sus{--sus-w:min(1000px,110vw);position:absolute;z-index:0;left:50%;top:calc(50vh - var(--sus-w) * .594);translate:-50% 0;width:var(--sus-w);height:calc(100% + 70vh);pointer-events:none;
  -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 22%,#000 62%,transparent 100%);mask-image:linear-gradient(to bottom,transparent 0,#000 22%,#000 62%,transparent 100%);}
.credits__sus::after{content:"";position:absolute;inset:0;background:radial-gradient(45% 30% at 50% 35%,rgba(124,58,237,.18),transparent 100%);}
.credits__sus img{display:block;width:100%;height:auto;opacity:.38;mix-blend-mode:screen;filter:saturate(1.2);
  -webkit-mask-image:radial-gradient(ellipse 48% 46% at 50% 42%,#000 35%,transparent 100%);mask-image:radial-gradient(ellipse 48% 46% at 50% 42%,#000 35%,transparent 100%);}
.credits__kanji{position:absolute;z-index:1;right:var(--gut);top:clamp(80px,14vh,160px);writing-mode:vertical-rl;font:400 clamp(60px,9vw,150px)/1 var(--jp);color:transparent;-webkit-text-stroke:1px rgba(181,60,255,.18);pointer-events:none;}
@media (max-width:900px){.credits__kanji{display:none;}.credits__sus{--sus-w:190vw;}.credits__sus img{opacity:.45;}}
.madara{position:relative;z-index:2;min-height:100vh;min-height:100svh;display:grid;align-content:center;justify-items:center;text-align:center;padding:clamp(72px,12vh,140px) var(--gut);}
.madara__quote{margin-top:18px;font:400 clamp(40px,6.5vw,104px)/1 var(--jp);letter-spacing:.02em;color:var(--bone);text-shadow:0 0 40px rgba(227,18,43,.35);}
.madara__quote .split-char:last-child{color:var(--blood);}
.madara__en{margin-top:18px;font:700 clamp(12px,1vw,14px)/1.6 var(--mono);letter-spacing:.26em;text-transform:uppercase;color:var(--bone);}
.madara__en span{color:var(--mute);font-weight:400;}

[data-ink]{clip-path:inset(0 100% 0 0);}
.no-js [data-ink],.reduced [data-ink]{clip-path:none;}

/* top (not margin) so the names drop into the empty dark below without adding page height */
.with{position:relative;top:38vh;z-index:2;padding:0 var(--gut);display:grid;justify-items:center;gap:clamp(28px,5vh,48px);text-align:center;}
.with__label{font:400 11px/1 var(--mono);letter-spacing:.24em;color:var(--mute);}
.with__names{display:flex;flex-wrap:wrap;justify-content:center;gap:clamp(32px,7vw,110px);align-items:center;}
.with__name{position:relative;margin:0;}
/* clip on the wrapper, shadow on the img — iOS Safari paints white boxes when filter + clip-path share an element */
.with__ink{position:relative;display:block;}
.with__name img{display:block;width:clamp(220px,30vw,440px);height:auto;filter:drop-shadow(0 6px 24px rgba(0,0,0,.8));}
/* thin red slash behind each name, like the artist cards */
.with__slash{position:absolute;left:-8%;right:-8%;top:42%;height:22%;background:var(--blood);clip-path:polygon(2% 0,100% 0,98% 100%,0 100%);box-shadow:0 0 40px rgba(227,18,43,.5);opacity:.85;transform-origin:left center;}
.js-with .with__label{opacity:0;}
.js-with .with__slash{transform:scaleX(0);}
.js-with .with__ink{clip-path:inset(0 100% 0 0);}

/* ============================= EYELID KEY ART ============================= */
.lid{position:relative;height:260vh;}
.lid__stick{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;display:grid;place-items:center;}
.lid__frame{position:absolute;inset:0;clip-path:inset(50% 0 50% 0);will-change:clip-path;}
.lid__img{width:100%;height:100%;object-fit:cover;object-position:60% 50%;transform:scale(1.25);will-change:transform;}
.lid__shade{position:absolute;inset:0;background:linear-gradient(to top,rgba(6,5,9,.85),transparent 40%),linear-gradient(to bottom,rgba(6,5,9,.5),transparent 25%);}
.lid__jp{position:relative;z-index:2;font:400 clamp(80px,16vw,260px)/1 var(--jp);color:transparent;-webkit-text-stroke:1.2px rgba(239,233,245,.7);letter-spacing:.1em;pointer-events:none;}
.lid__cap{position:absolute;z-index:2;left:var(--gut);bottom:clamp(28px,6vh,60px);font:700 12px/1 var(--mono);letter-spacing:.3em;}
.lid__cap span{color:var(--blood);}
/* tall screens pan across the key art, so give the pan more scroll */
@media (max-aspect-ratio:1/1){
  .lid{height:380vh;}
  .lid__img{object-position:4% 50%;}
}

/* ============================= LISTEN ============================= */
.listen{position:relative;padding:var(--sec) 0;overflow:hidden;}
.listen::before{content:"";position:absolute;inset:0;background:radial-gradient(50% 50% at 25% 55%,rgba(181,60,255,.14),transparent 70%);pointer-events:none;}
.listen__grid{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(40px,6vw,110px);align-items:center;padding:clamp(48px,8vh,96px) var(--gut) 0;}

.deck{position:relative;aspect-ratio:1;max-width:560px;width:100%;}
.deck__cover{position:absolute;inset:0;z-index:2;overflow:hidden;border-radius:6px;box-shadow:0 40px 80px -30px rgba(0,0,0,.9),0 0 0 1px var(--edge);}
.deck__cover img{width:100%;height:100%;object-fit:cover;object-position:50% 50%;}
.deck__vinyl{
  position:absolute;inset:4%;z-index:1;border-radius:50%;
  background:radial-gradient(circle,#1b1622 0 30%,#0a080d 31% 100%);
  box-shadow:0 20px 60px rgba(0,0,0,.7);
  transition:transform 1s var(--ease);
}
.deck__grooves{position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 20deg,transparent 0 12%,rgba(255,255,255,.07) 16%,transparent 22% 58%,rgba(181,60,255,.1) 63%,transparent 70%),repeating-radial-gradient(circle,rgba(255,255,255,.035) 0 1px,transparent 1px 4px);box-shadow:inset 0 0 0 1px rgba(255,255,255,.06);}
.deck__label{position:absolute;inset:34%;width:32%;height:32%;}
.deck.is-open .deck__vinyl{transform:translateX(18%);}
.deck.is-playing .deck__vinyl{animation:spin 2.2s linear infinite;}
.deck.is-open.is-playing .deck__vinyl{animation:spinOut 2.2s linear infinite;}
@keyframes spinOut{from{transform:translateX(18%) rotate(0)}to{transform:translateX(18%) rotate(360deg)}}

.player{position:relative;z-index:3;}
.player__logo{width:min(440px,100%);height:auto;filter:drop-shadow(0 0 24px rgba(181,60,255,.45));}
.player__by{margin-top:6px;font:700 13px/1 var(--mono);letter-spacing:.24em;text-transform:uppercase;}
.player__controls{display:flex;align-items:center;gap:22px;margin-top:34px;}
.play{position:relative;flex:0 0 auto;width:92px;height:92px;border-radius:50%;display:grid;place-items:center;background:var(--blood);box-shadow:0 0 40px rgba(227,18,43,.45);transition:transform .3s var(--ease);}
.play__ring{position:absolute;inset:-12px;width:calc(100% + 24px);height:calc(100% + 24px);color:var(--blood);opacity:.6;animation:spin 8s linear infinite;}
.play.is-playing .play__ring{animation-duration:1.2s;}
.play__icon{width:0;height:0;border-style:solid;border-width:13px 0 13px 21px;border-color:transparent transparent transparent #fff;margin-left:5px;transition:all .2s;}
.play.is-playing .play__icon{width:20px;height:24px;border:0;margin:0;border-left:7px solid #fff;border-right:7px solid #fff;}
.player__body{flex:1;min-width:0;}
.player__viz{display:block;width:100%;height:64px;}
.seek{display:flex;align-items:center;gap:12px;font:400 11px/1 var(--mono);color:var(--mute);}
.seek input{flex:1;-webkit-appearance:none;appearance:none;height:2px;background:linear-gradient(90deg,var(--blood) var(--p,0%),var(--edge-2) var(--p,0%));border-radius:2px;}
.seek input::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;border-radius:50%;background:var(--bone);box-shadow:0 0 10px var(--blood);}
.seek input::-moz-range-thumb{width:12px;height:12px;border:0;border-radius:50%;background:var(--bone);}
.player__note{margin-top:14px;font:400 11px/1.5 var(--mono);letter-spacing:.06em;color:var(--faint);}
.player__note.is-warn{color:var(--volt);}

.dsp__label{margin-top:40px;font:400 11px/1 var(--mono);letter-spacing:.2em;text-transform:uppercase;color:var(--mute);}
.dsp{list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px;margin-top:16px;}
.dsp a,.dsp span.dsp__btn{
  --brand:#fff;
  position:relative;display:flex;align-items:center;gap:14px;padding:16px 18px;border:1px solid var(--edge);border-radius:10px;overflow:hidden;isolation:isolate;
  background:rgba(255,255,255,.02);transition:border-color .3s,transform .4s var(--ease);
}
.dsp a::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--brand);transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease);opacity:.95;}
.dsp a:hover{border-color:var(--brand);transform:translateY(-3px);}
.dsp a:hover::before{transform:scaleX(1);}
.dsp svg{width:24px;height:24px;flex:0 0 auto;fill:var(--brand);transition:fill .3s;}
.dsp a:hover svg,.dsp a:hover .dsp__name,.dsp a:hover .dsp__go{fill:var(--ink);color:var(--ink);}
.dsp__name{font:700 13px/1.2 var(--body);flex:1;transition:color .3s;}
.dsp__go{font:400 14px/1 var(--mono);color:var(--mute);transition:color .3s,transform .3s;}
.dsp a:hover .dsp__go{transform:translate(3px,-3px);}
.dsp span.dsp__btn{opacity:.55;cursor:not-allowed;}
.dsp__soon{font:700 9px/1 var(--mono);letter-spacing:.18em;padding:5px 7px;border:1px solid var(--edge-2);border-radius:4px;color:var(--mute);}
.dsp--light a:hover svg{fill:#fff;}

/* ============================= WATCH ============================= */
.watch{position:relative;height:220vh;}
.watch__stick{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;display:flex;flex-direction:column;justify-content:center;gap:clamp(20px,4vh,40px);}
.watch__head{padding:0 var(--gut);position:relative;z-index:2;}
.watch__head .h2{font-size:clamp(40px,6vw,96px);}
.screen{position:relative;z-index:2;margin:0 auto;width:min(1400px,calc(100vw - 2*var(--gut)));aspect-ratio:16/9;max-height:68vh;}
.screen__inner{position:absolute;inset:0;overflow:hidden;border-radius:8px;background:#000;box-shadow:0 0 0 1px var(--edge-2),0 50px 120px -40px rgba(181,60,255,.4);transform-origin:50% 50%;will-change:transform;}
.screen__poster{width:100%;height:100%;object-fit:cover;filter:saturate(.8) brightness(.55);transform:scale(1.08);transition:transform 1.2s var(--ease),filter .6s;}
.screen:hover .screen__poster{transform:scale(1.02);filter:saturate(1) brightness(.65);}
.screen__scan{position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(to bottom,rgba(255,255,255,.035) 0 1px,transparent 1px 3px);mix-blend-mode:overlay;}
.screen__play{position:absolute;left:50%;top:50%;translate:-50% -50%;display:grid;justify-items:center;gap:16px;}
.screen__play svg{width:clamp(72px,7vw,104px);height:clamp(72px,7vw,104px);overflow:visible;filter:drop-shadow(0 0 24px rgba(227,18,43,.55));transition:transform .4s var(--ease);}
.screen__play-ring{fill:rgba(6,5,9,.45);stroke:rgba(255,255,255,.85);stroke-width:2;transition:fill .4s var(--ease),stroke .4s var(--ease);}
.screen__play-tri{fill:#fff;stroke:#fff;stroke-width:4;stroke-linejoin:round;transition:fill .4s var(--ease),stroke .4s var(--ease);}
.screen__play:hover svg{transform:scale(1.08);}
.screen__play:hover .screen__play-ring{fill:var(--blood);stroke:var(--blood);}
.screen__play span{font:700 11px/1 var(--mono);letter-spacing:.3em;text-transform:uppercase;padding:10px 16px;border-radius:999px;background:rgba(6,5,9,.55);border:1px solid var(--edge-2);backdrop-filter:blur(8px);}
.screen__tag{position:absolute;left:20px;top:18px;display:flex;align-items:center;gap:10px;font:400 10px/1 var(--mono);letter-spacing:.2em;color:var(--bone);}
.screen__tag b{color:var(--blood);}
.rec{width:8px;height:8px;border-radius:50%;background:var(--blood);animation:pulse 1.2s infinite;}
.screen__tc{position:absolute;right:20px;bottom:18px;font:400 11px/1 var(--mono);letter-spacing:.14em;color:var(--mute);}
.screen iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}
.screen__bars{position:absolute;inset:0;pointer-events:none;z-index:3;}
.screen__bars i{position:absolute;left:0;right:0;height:0;background:var(--ink);}
.screen__bars i:first-child{top:0;}
.screen__bars i:last-child{bottom:0;}



@media (min-width:901px){
}

/* ============================= OUTRO / FALLING TEXT ============================= */
.outro{position:relative;padding:var(--sec) var(--gut) 40px;}
.fall{position:relative;height:clamp(380px,62vh,620px);margin-top:28px;border:1px solid var(--edge);border-radius:18px;overflow:hidden;background:radial-gradient(80% 80% at 50% 110%,rgba(181,60,255,.14),transparent 60%);}
.fall__target{position:absolute;inset:0;display:flex;flex-wrap:wrap;justify-content:center;align-content:center;padding:clamp(28px,5vw,60px) clamp(28px,5vw,60px) 96px;font:400 clamp(36px,6.4vw,104px)/.98 var(--disp);text-transform:uppercase;text-align:center;}
.fall__target .fw{display:inline-block;margin:0 .12em;user-select:none;}
.fall__target .fw--hot{color:var(--blood);text-shadow:0 0 24px rgba(227,18,43,.5);}
.fall__target .fw--violet{color:transparent;-webkit-text-stroke:1.4px var(--violet);}
.fall.is-falling{cursor:grab;}
.fall.is-falling:active{cursor:grabbing;}
.fall__btn{position:absolute;left:50%;bottom:20px;translate:-50% 0;white-space:nowrap;z-index:3;display:inline-flex;align-items:center;gap:12px;padding:14px 20px;border-radius:999px;background:var(--bone);color:var(--ink);font:700 11px/1 var(--mono);letter-spacing:.18em;text-transform:uppercase;transition:opacity .4s, transform .4s var(--ease);}
.fall__btn span{font:400 18px/1 var(--jp);color:var(--blood);}
.fall.is-falling .fall__btn{opacity:0;pointer-events:none;transform:translateY(10px);}

/* ============================= FOOTER ============================= */
.foot{position:relative;padding:clamp(60px,10vh,120px) var(--gut) 30px;border-top:1px solid var(--edge);overflow:hidden;}
.foot__logo{width:min(900px,90vw);height:auto;margin:0 auto;filter:drop-shadow(0 0 40px rgba(181,60,255,.4));}
.foot__row{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;margin-top:50px;}
.foot__credit{font:700 11px/1.6 var(--mono);letter-spacing:.2em;}
.foot__social{list-style:none;display:flex;gap:10px;}
.foot__social a,.foot__social span{display:grid;place-items:center;width:44px;height:44px;border:1px solid var(--edge-2);border-radius:50%;transition:background .3s,border-color .3s;}
.foot__social span{opacity:.4;}
.foot__social svg{width:16px;height:16px;fill:var(--bone);}
.foot__social a:hover{background:var(--blood);border-color:var(--blood);}
.foot__row--fine{margin-top:26px;padding-top:20px;border-top:1px solid var(--edge);font:400 10px/1.5 var(--mono);letter-spacing:.14em;color:var(--faint);text-transform:uppercase;}
.foot__top:hover{color:var(--bone);}
.foot__legal{list-style:none;display:flex;flex-wrap:wrap;gap:6px 22px;}
.foot__legal a,.foot__top{transition:color .3s;}
.foot__legal a:hover{color:var(--bone);}
.foot__made{margin-top:18px;font:400 9px/1.4 var(--mono);letter-spacing:.14em;color:var(--faint);text-align:center;}
.foot__made a{color:var(--mute);transition:color .3s;}
.foot__made a:hover{color:var(--bone);}
/* hide the badge Netlify injects on its preview deploys */
.nl-badge{display:none !important;}

/* ============================= RESPONSIVE ============================= */
@media (max-width:900px){
  .nav__links,.nav__cta{display:none;}
  .nav__burger{display:block;margin-left:auto;}
  .nav__mark img{width:78px;}
  .feat{height:500vh;}
  .feat__kanji{display:none;}
  .feat__head{top:84px;}
  .feat__card{top:auto;bottom:clamp(40px,8vh,80px);width:min(78vw,420px);}
  .feat__caps{top:140px;}
  .listen__grid{grid-template-columns:1fr;}
  .deck{max-width:420px;margin:0 auto;}
  .deck.is-open .deck__vinyl{transform:translateY(-20%);}
  @keyframes spinOut{from{transform:translateY(-20%) rotate(0)}to{transform:translateY(-20%) rotate(360deg)}}
  .hero__rail{display:none;}
  .hero__name{top:62%;width:min(50vw,230px);gap:8px;}
  .hero__credit,.loader__by{text-align:center;line-height:1.6;}
  .hero__name-role{display:none;}
  .ht--mini,.ht--kanji{display:none;}
  .hero__type{-webkit-mask-image:radial-gradient(ellipse 40% 36% at 50% 38%,transparent 30%,#000 100%);mask-image:radial-gradient(ellipse 40% 36% at 50% 38%,transparent 30%,#000 100%);}
  .watch{height:auto;}
  .watch__stick{position:relative;height:auto;padding:var(--sec) 0;}
  .screen{max-height:none;}
}
@media (max-width:560px){
  .player__controls{gap:16px;}
  .play{width:72px;height:72px;}
  .dsp{grid-template-columns:1fr 1fr;}
  .dsp a,.dsp span.dsp__btn{padding:14px;gap:10px;}
  .dsp__go{display:none;}
  .hero__caps li .jp{font-size:44px;}
  .hero__cta .btn{padding:14px 20px;}
  .fall__btn{left:16px;right:16px;translate:none;white-space:normal;justify-content:center;}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;}
  .hero{height:auto;}
  .hero__stage{position:relative;}
  .lid{height:auto;}
  .lid__stick{position:relative;}
  .lid__frame{clip-path:none;}
  .lid__img{transform:none;}
  .watch{height:auto;}
  .watch__stick{position:relative;height:auto;padding:var(--sec) 0;}
}
/* reduced motion on a tall screen: no pan, so show the whole key art */
@media (prefers-reduced-motion:reduce) and (max-aspect-ratio:1/1){
  .lid__stick{height:auto;min-height:0;padding:var(--sec) 0;}
  .lid__frame{position:relative;}
  .lid__img{height:auto;object-fit:contain;}
}