:root{
  --tx-intro-accent:#69efff;
  --tx-intro-accent-2:#ff5ce4;
  --tx-intro-accent-3:#7a8dff;
  --tx-intro-accent-4:#ffb66b;
  --tx-intro-bg:#020617;
  --tx-intro-progress:0;
}
body.tx-intro-lock{overflow:hidden!important;touch-action:none;}
body.tx-intro-transitioning #app,
body.tx-intro-transitioning .app,
body.tx-intro-transitioning main{filter:blur(0);transition:opacity .7s ease, transform .7s ease;}
.tx-intro{
  position:fixed;
  inset:0;
  z-index:99999;
  display:grid;
  place-items:center;
  background:
    radial-gradient(circle at 18% 8%, rgba(53,121,255,.24), transparent 24%),
    radial-gradient(circle at 82% 12%, rgba(164,70,255,.18), transparent 22%),
    radial-gradient(circle at 50% 82%, rgba(0,190,255,.12), transparent 36%),
    linear-gradient(180deg, #030818 0%, #02040d 100%);
  overflow:hidden;
  opacity:1;
  visibility:visible;
  transition:opacity .85s ease, visibility .85s ease;
}
.tx-intro.is-hidden{opacity:0;visibility:hidden;pointer-events:none;}
.tx-intro.is-hidden .tx-intro__core{transform:scale(1.022);filter:blur(1.5px);transition:transform .85s ease, filter .85s ease;}
.tx-intro::before,.tx-intro::after{content:"";position:absolute;inset:-8%;pointer-events:none;}
.tx-intro::before{background:repeating-linear-gradient(90deg, rgba(255,255,255,.016) 0 1px, transparent 1px 44px),repeating-linear-gradient(0deg, rgba(255,255,255,.012) 0 1px, transparent 1px 44px);opacity:.32;}
.tx-intro::after{background:radial-gradient(circle at 50% 46%, rgba(255,255,255,.07), transparent 54%),linear-gradient(180deg, rgba(0,0,0,.10), rgba(0,0,0,.42));mix-blend-mode:screen;}
.tx-intro__core{position:relative;width:min(100%, 1360px);min-height:100vh;display:grid;place-items:center;overflow:hidden;}
.tx-intro__bg-glow,.tx-intro__reflection,.tx-intro__lasers,.tx-intro__waves,.tx-intro__particles,.tx-intro__visualizer,.tx-intro__flash,.tx-intro__center,.tx-intro__controls,.tx-intro__tap,.tx-intro__stage-label,.tx-intro__countdown,.tx-intro__finale-copy,.tx-intro__opening-copy,.tx-intro__shutters{position:absolute;}
.tx-intro__bg-glow{inset:10% 0 auto;height:42vh;background:radial-gradient(circle at 30% 52%, rgba(68,130,255,.34), transparent 38%),radial-gradient(circle at 52% 54%, rgba(103,243,255,.20), transparent 24%),radial-gradient(circle at 72% 52%, rgba(255,92,228,.24), transparent 38%);filter:blur(40px);opacity:.96;animation:txIntroGlow 4.4s ease-in-out infinite alternate;}
.tx-intro__shutters{inset:0;pointer-events:none;opacity:.95}
.tx-intro__shutters span{position:absolute;left:0;right:0;height:18vh;background:linear-gradient(180deg, rgba(0,0,0,.82), rgba(0,0,0,.24));box-shadow:0 0 38px rgba(0,0,0,.34)}
.tx-intro__shutters span:first-child{top:0}.tx-intro__shutters span:last-child{bottom:0;transform:scaleY(-1)}
.tx-intro__waves{left:-4%;right:-4%;top:34%;height:33%;filter:drop-shadow(0 0 18px rgba(105,239,255,.18));}
.tx-intro__wave{position:absolute;inset:0;border-radius:50%;opacity:.95;mix-blend-mode:screen;}
.tx-intro__wave::before{content:"";position:absolute;inset:0;background-repeat:no-repeat;background-size:100% 100%;transform-origin:center;animation:txIntroWaveMove 5.4s linear infinite;}
.tx-intro__wave--a::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 280'%3E%3Cpath d='M0 160 C130 80 210 230 320 150 S540 40 650 145 S860 250 970 150 S1110 95 1200 145' fill='none' stroke='%2369efff' stroke-width='13' stroke-linecap='round' opacity='.88'/%3E%3C/svg%3E");animation-duration:4.8s;}
.tx-intro__wave--b::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 280'%3E%3Cpath d='M0 150 C90 220 210 60 330 145 S520 240 640 140 S860 30 980 138 S1120 235 1200 150' fill='none' stroke='%23ff5ce4' stroke-width='12' stroke-linecap='round' opacity='.80'/%3E%3C/svg%3E");animation-duration:6.2s;animation-direction:reverse;}
.tx-intro__wave--c::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 280'%3E%3Cpath d='M0 148 C110 90 210 208 330 142 S520 68 640 142 S850 224 980 144 S1120 78 1200 145' fill='none' stroke='%237a8dff' stroke-width='9' stroke-linecap='round' opacity='.58'/%3E%3C/svg%3E");animation-duration:7s;}
.tx-intro__reflection{left:0;right:0;bottom:-2%;height:28%;background:linear-gradient(180deg, rgba(0,0,0,0), rgba(0,0,0,.12) 18%, rgba(1,7,20,.78)),radial-gradient(circle at 50% 0%, rgba(70,165,255,.26), transparent 36%);}
.tx-intro__reflection::before{content:"";position:absolute;left:-6%;right:-6%;top:0;bottom:0;background:repeating-linear-gradient(180deg, rgba(255,255,255,.045) 0 2px, transparent 2px 18px),linear-gradient(90deg, rgba(105,239,255,.16), rgba(255,92,228,.16), rgba(105,239,255,.16));opacity:.32;filter:blur(1px);transform:scaleY(.72) perspective(420px) rotateX(78deg);}
.tx-intro__lasers{inset:0;opacity:0;transition:opacity .35s ease;}
.tx-intro--lights .tx-intro__lasers{opacity:1;}
.tx-intro__laser{position:absolute;top:18%;width:52vw;max-width:900px;height:2px;background:linear-gradient(90deg, transparent, rgba(105,239,255,.95), transparent);box-shadow:0 0 18px rgba(105,239,255,.95), 0 0 42px rgba(105,239,255,.36);transform-origin:left center;opacity:.9;}
.tx-intro__laser--a{left:-8%;transform:rotate(12deg);animation:txLaserSweepA 1.9s ease-in-out infinite;}
.tx-intro__laser--b{right:-10%;top:25%;background:linear-gradient(90deg, transparent, rgba(255,92,228,.95), transparent);box-shadow:0 0 18px rgba(255,92,228,.95),0 0 42px rgba(255,92,228,.36);transform:rotate(-14deg);animation:txLaserSweepB 1.6s ease-in-out infinite;}
.tx-intro__laser--c{left:9%;top:31%;width:42vw;transform:rotate(-6deg);animation:txLaserSweepC 1.8s ease-in-out infinite;}
.tx-intro__laser--d{right:5%;top:38%;width:38vw;background:linear-gradient(90deg, transparent, rgba(123,112,255,.95), transparent);box-shadow:0 0 18px rgba(123,112,255,.95),0 0 42px rgba(123,112,255,.36);transform:rotate(8deg);animation:txLaserSweepD 2s ease-in-out infinite;}
.tx-intro__laser--e{left:18%;top:22%;width:32vw;background:linear-gradient(90deg, transparent, rgba(255,182,107,.95), transparent);box-shadow:0 0 18px rgba(255,182,107,.95),0 0 42px rgba(255,182,107,.26);transform:rotate(18deg);animation:txLaserSweepE 1.7s ease-in-out infinite;}
.tx-intro__particles{inset:0;overflow:hidden;pointer-events:none;}.tx-intro__particles span{position:absolute;width:4px;height:4px;border-radius:999px;background:#7cf4ff;opacity:.42;box-shadow:0 0 10px currentColor;animation:txParticleFloat linear infinite;}
.tx-intro__opening-copy{left:50%;top:22%;transform:translateX(-50%) scale(.88);color:#f4fbff;font-size:clamp(15px,1.7vw,20px);font-weight:700;letter-spacing:.48em;text-transform:uppercase;opacity:0;z-index:5;text-shadow:0 0 20px rgba(105,239,255,.22);transition:opacity .22s ease, transform .28s ease;}
.tx-intro__opening-copy.is-visible{opacity:1;transform:translateX(-50%) scale(1);}
.tx-intro__center{inset:0;display:grid;place-items:center;padding:24px;z-index:2;}
.tx-intro__brandstack{width:min(94vw,760px);text-align:center;position:relative;min-height:340px;}
.tx-intro__logo{display:grid;justify-items:center;gap:16px;opacity:0;transform:translateY(18px) scale(.96);transition:opacity .55s ease, transform .55s ease;position:absolute;inset:50% auto auto 50%;translate:-50% -50%;width:100%;}
.tx-intro__logo-wrap{position:relative;display:grid;place-items:center;width:min(72vw, 390px);height:min(52vw, 260px);}
.tx-intro__logo-wrap img{max-width:min(66vw, 320px);max-height:220px;object-fit:contain;position:relative;z-index:2;filter:drop-shadow(0 0 30px rgba(105,239,255,.34)) drop-shadow(0 0 58px rgba(105,239,255,.16));}
.tx-intro__logo-wrap--venetian img{max-width:min(70vw, 350px);max-height:120px;filter:drop-shadow(0 0 24px rgba(255,255,255,.08)) drop-shadow(0 0 30px rgba(105,239,255,.12));}
.tx-intro__logo-ring,.tx-intro__logo-flare{position:absolute;inset:50%;translate:-50% -50%;pointer-events:none;}
.tx-intro__logo-ring{width:min(66vw, 330px);height:min(66vw, 330px);border-radius:50%;border:1px solid rgba(105,239,255,.24);box-shadow:0 0 30px rgba(105,239,255,.18), inset 0 0 30px rgba(105,239,255,.08);opacity:.9;z-index:1;animation:txIntroRingPulse 2.2s ease-in-out infinite;}
.tx-intro__logo-flare{width:min(86vw, 440px);height:90px;background:radial-gradient(circle at 50% 50%, rgba(255,255,255,.65), rgba(105,239,255,.26), transparent 70%);filter:blur(12px);z-index:0;opacity:.85;animation:txIntroFlareMove 2.8s ease-in-out infinite;}
.tx-intro__logo h2{margin:0;color:#eef8ff;font-size:clamp(28px,4vw,48px);letter-spacing:.23em;text-transform:uppercase;font-weight:800;text-shadow:0 0 18px rgba(10,20,50,.35);}
.tx-intro__logo p{margin:0;color:#b9d9ea;font-size:clamp(12px,1.4vw,16px);letter-spacing:.28em;text-transform:uppercase;}
.tx-intro--brand-tx .tx-intro__logo--tx,.tx-intro--brand-venetian .tx-intro__logo--venetian{opacity:1;transform:translateY(0) scale(1);translate:-50% -50%;}
.tx-intro__stage-label{left:50%;top:11%;transform:translateX(-50%);padding:8px 14px;border:1px solid rgba(125,243,255,.18);border-radius:999px;background:rgba(4,10,22,.46);color:#c3ebf8;font-size:11px;letter-spacing:.3em;text-transform:uppercase;backdrop-filter:blur(10px);z-index:4;}
.tx-intro__visualizer{left:50%;transform:translateX(-50%);bottom:11%;width:min(88vw,980px);height:124px;display:flex;align-items:flex-end;justify-content:center;gap:6px;z-index:2;}
.tx-intro__bar{width:clamp(5px,.78vw,9px);height:18px;border-radius:999px 999px 2px 2px;background:linear-gradient(180deg, rgba(255,255,255,.95), var(--bar-color, #69efff));box-shadow:0 0 18px var(--bar-color, #69efff),0 0 36px color-mix(in srgb, var(--bar-color, #69efff) 42%, transparent);transform-origin:center bottom;transition:height .11s linear, transform .11s linear, opacity .18s ease;opacity:.9;}
.tx-intro__flash{inset:-6%;background:radial-gradient(circle at 50% 50%, rgba(255,255,255,.95), rgba(105,239,255,.34), rgba(255,92,228,.18), transparent 56%);opacity:0;pointer-events:none;mix-blend-mode:screen;}
.tx-intro__controls{right:18px;top:18px;display:flex;gap:10px;z-index:5;}
.tx-intro__skip,.tx-intro__mute{border:1px solid rgba(125,243,255,.18);background:rgba(5,10,18,.42);color:#eaf8ff;border-radius:999px;padding:10px 14px;font-size:11px;letter-spacing:.18em;text-transform:uppercase;cursor:pointer;backdrop-filter:blur(10px);} .tx-intro__mute.is-muted{opacity:.72}
.tx-intro__tap{left:50%;bottom:4%;transform:translateX(-50%);padding:12px 16px;border-radius:999px;color:#d8f8ff;border:1px solid rgba(125,243,255,.18);background:rgba(5,10,18,.42);font-size:11px;letter-spacing:.26em;text-transform:uppercase;backdrop-filter:blur(10px);opacity:0;transition:opacity .35s ease;z-index:5;}.tx-intro.is-awaiting-audio .tx-intro__tap{opacity:1;}
.tx-intro__countdown{left:50%;bottom:24%;transform:translateX(-50%);width:min(78vw,520px);display:grid;gap:12px;opacity:0;transition:opacity .25s ease, transform .25s ease;z-index:4;pointer-events:none;}.tx-intro__countdown.is-visible{opacity:1;transform:translateX(-50%) translateY(0);}
.tx-intro__countdown-copy{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;color:#dff8ff;letter-spacing:.18em;text-transform:uppercase;}.tx-intro__countdown-copy span{font-size:12px;color:#bce4f1;}.tx-intro__countdown-number{font-size:clamp(34px,5vw,56px);line-height:1;color:#f8feff;text-shadow:0 0 20px rgba(105,239,255,.24);}
.tx-intro__countdown-rail{height:10px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(125,243,255,.16);overflow:hidden;box-shadow:inset 0 1px 3px rgba(0,0,0,.28);}.tx-intro__countdown-fill{display:block;width:100%;height:100%;transform-origin:left center;transform:scaleX(0);background:linear-gradient(90deg, #69efff, #ff5ce4, #7a8dff);box-shadow:0 0 18px rgba(105,239,255,.22);}
.tx-intro__finale-copy{left:50%;top:48%;transform:translate(-50%,-50%) scale(.88);color:#f7fdff;font-size:clamp(24px, 4.5vw, 56px);font-weight:800;letter-spacing:.16em;text-transform:uppercase;text-align:center;opacity:0;text-shadow:0 0 32px rgba(105,239,255,.22), 0 0 46px rgba(255,92,228,.18);transition:opacity .2s ease, transform .24s ease;z-index:5;}.tx-intro__finale-copy.is-visible{opacity:1;transform:translate(-50%,-50%) scale(1);}
@keyframes txIntroGlow{from{transform:translateY(-10px) scale(1)}to{transform:translateY(7px) scale(1.07)}}
@keyframes txIntroWaveMove{0%{transform:translateX(-2%) scaleY(1)}50%{transform:translateX(0) scaleY(1.08)}100%{transform:translateX(2%) scaleY(1)}}
@keyframes txLaserSweepA{0%,100%{transform:rotate(12deg) translateY(0)}50%{transform:rotate(6deg) translateY(26px)}}
@keyframes txLaserSweepB{0%,100%{transform:rotate(-14deg) translateY(0)}50%{transform:rotate(-7deg) translateY(-18px)}}
@keyframes txLaserSweepC{0%,100%{transform:rotate(-6deg) translateY(0)}50%{transform:rotate(-12deg) translateY(20px)}}
@keyframes txLaserSweepD{0%,100%{transform:rotate(8deg) translateY(0)}50%{transform:rotate(15deg) translateY(-22px)}}
@keyframes txLaserSweepE{0%,100%{transform:rotate(18deg) translateY(0)}50%{transform:rotate(10deg) translateY(16px)}}
@keyframes txParticleFloat{0%{transform:translate3d(0,0,0) scale(.8);opacity:0}15%{opacity:.55}100%{transform:translate3d(var(--drift-x), calc(-1 * var(--travel)), 0) scale(1.45);opacity:0}}
@keyframes txIntroRingPulse{0%,100%{transform:translateZ(0) scale(.94);opacity:.68}50%{transform:translateZ(0) scale(1.04);opacity:1}}
@keyframes txIntroFlareMove{0%,100%{transform:translate(-50%,-50%) scale(.92);opacity:.66}50%{transform:translate(-50%,-50%) scale(1.08);opacity:1}}
@media (max-width:640px){
  .tx-intro__logo-wrap{width:min(76vw,300px);height:180px}
  .tx-intro__logo-wrap img{max-width:min(68vw,240px);max-height:160px}
  .tx-intro__logo-wrap--venetian img{max-width:min(70vw,260px);max-height:90px}
  .tx-intro__logo h2{font-size:clamp(24px,7vw,34px)}
  .tx-intro__logo p{font-size:11px;letter-spacing:.18em}
  .tx-intro__opening-copy{top:20%;font-size:12px;letter-spacing:.26em}
  .tx-intro__visualizer{height:100px;gap:4px;bottom:12%}
  .tx-intro__controls{right:12px;top:12px}
  .tx-intro__skip,.tx-intro__mute{padding:8px 10px;font-size:10px;letter-spacing:.14em}
  .tx-intro__stage-label{top:9.5%;font-size:10px;letter-spacing:.18em}
  .tx-intro__tap{max-width:88vw;text-align:center;line-height:1.45}
  .tx-intro__countdown{width:min(86vw,460px);bottom:24.5%}
  .tx-intro__countdown-copy span{font-size:10px}
}


/* === TXHOUSE 2026-05-17: Intro DJ brutal V17 === */
.tx-intro{
  background:
    radial-gradient(circle at 18% 8%, rgba(0,118,255,.28), transparent 24%),
    radial-gradient(circle at 82% 12%, rgba(255,51,226,.18), transparent 22%),
    radial-gradient(circle at 50% 75%, rgba(0,235,255,.13), transparent 34%),
    linear-gradient(180deg, #010717 0%, #02020a 100%) !important;
}
.tx-intro__tap,
.tx-intro__mute,
.tx-intro__countdown,
.tx-intro__finale-copy{
  display:none !important;
}
.tx-intro__controls{
  right:18px !important;
  top:18px !important;
}
.tx-intro__skip{
  background:rgba(3,8,18,.50) !important;
  border:1px solid rgba(105,239,255,.20) !important;
  color:#edfaff !important;
  box-shadow:0 0 22px rgba(105,239,255,.08) !important;
}
.tx-intro__opening-copy{
  top:20% !important;
  letter-spacing:.48em !important;
  color:#f8fdff !important;
  text-shadow:
    0 0 18px rgba(105,239,255,.30),
    0 0 32px rgba(255,92,228,.16) !important;
}
.tx-intro__stage-label{
  background:rgba(3,8,18,.48) !important;
  border-color:rgba(105,239,255,.18) !important;
  box-shadow:0 0 24px rgba(105,239,255,.08) !important;
}
.tx-intro__logo-wrap{
  width:min(72vw, 420px) !important;
  height:min(53vw, 286px) !important;
}
.tx-intro__logo-wrap img{
  max-width:min(68vw, 350px) !important;
  max-height:248px !important;
  filter:
    drop-shadow(0 0 20px rgba(255,255,255,.18))
    drop-shadow(0 0 38px rgba(105,239,255,.36))
    drop-shadow(0 0 72px rgba(255,92,228,.15)) !important;
}
.tx-intro__logo-wrap--venetian img{
  max-width:min(70vw, 360px) !important;
  max-height:128px !important;
}
.tx-intro__logo-ring{
  width:min(67vw, 360px) !important;
  height:min(67vw, 360px) !important;
  border:1px solid rgba(105,239,255,.26) !important;
  background:
    radial-gradient(circle, transparent 50%, rgba(105,239,255,.08) 51%, transparent 68%),
    conic-gradient(from 0deg, rgba(105,239,255,.03), rgba(105,239,255,.32), rgba(255,92,228,.20), rgba(255,178,95,.20), rgba(105,239,255,.03)) !important;
  box-shadow:
    0 0 32px rgba(105,239,255,.18),
    inset 0 0 32px rgba(105,239,255,.08) !important;
}
.tx-intro__logo-ring--outer{
  width:min(75vw, 420px) !important;
  height:min(75vw, 420px) !important;
  opacity:.42 !important;
  animation-duration:3.1s !important;
  animation-direction:reverse !important;
}
.tx-intro__logo-flare{
  width:min(88vw, 500px) !important;
  height:112px !important;
  background:
    radial-gradient(circle at 50% 50%, rgba(255,255,255,.65), rgba(105,239,255,.28), rgba(255,92,228,.16), transparent 72%) !important;
}
.tx-intro__logo h2{
  letter-spacing:.25em !important;
  text-shadow:
    0 0 20px rgba(105,239,255,.22),
    0 0 42px rgba(255,92,228,.08) !important;
}
.tx-intro__laser{
  height:2px !important;
  opacity:.92 !important;
}
.tx-intro__laser--f{
  left:28%;
  top:46%;
  width:46vw;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.92), rgba(105,239,255,.92), transparent);
  box-shadow:0 0 18px rgba(255,255,255,.72),0 0 42px rgba(105,239,255,.34);
  transform:rotate(-18deg);
  animation:txLaserSweepF 1.65s ease-in-out infinite;
}
.tx-intro__strobe{
  width:24vw;
  height:24vw;
  border-radius:50%;
  background:radial-gradient(circle, rgba(105,239,255,.24), transparent 64%);
  filter:blur(16px);
  opacity:.55;
  pointer-events:none;
  animation:txIntroStrobe 1.4s ease-in-out infinite;
}
.tx-intro__strobe--a{left:8%;top:8%;}
.tx-intro__strobe--b{right:7%;top:9%;background:radial-gradient(circle, rgba(255,92,228,.20), transparent 64%);animation-delay:.42s;}
.tx-intro__dj-console{
  left:50%;
  bottom:19.5%;
  transform:translateX(-50%);
  width:min(84vw, 760px);
  height:76px;
  display:grid;
  grid-template-columns:112px minmax(180px, 1fr) 112px;
  gap:16px;
  align-items:center;
  z-index:3;
  opacity:.92;
  pointer-events:none;
}
.tx-intro__deck{
  position:relative;
  height:76px;
  border-radius:22px;
  background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.02)), rgba(4,10,22,.48);
  border:1px solid rgba(105,239,255,.16);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10), 0 0 28px rgba(0,0,0,.24);
  display:grid;
  place-items:center;
}
.tx-intro__deck span{
  width:58px;
  height:58px;
  border-radius:50%;
  border:1px solid rgba(105,239,255,.22);
  background:
    radial-gradient(circle at 50% 50%, rgba(255,255,255,.22) 0 9%, transparent 10%),
    radial-gradient(circle at 50% 50%, rgba(105,239,255,.18) 0 28%, rgba(0,0,0,.24) 29% 100%);
  box-shadow:0 0 26px rgba(105,239,255,.12), inset 0 0 18px rgba(0,0,0,.34);
  animation:txDeckSpin 2.2s linear infinite;
}
.tx-intro__deck b{
  position:absolute;
  right:12px;
  top:12px;
  width:8px;
  height:8px;
  border-radius:50%;
  background:#69efff;
  box-shadow:0 0 16px rgba(105,239,255,.9);
}
.tx-intro__deck--right b{
  background:#ff5ce4;
  box-shadow:0 0 16px rgba(255,92,228,.9);
}
.tx-intro__mixer{
  height:76px;
  border-radius:20px;
  display:grid;
  grid-template-columns:1fr auto 1fr;
  gap:14px;
  align-items:center;
  padding:10px 14px;
  background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.02)), rgba(4,10,22,.54);
  border:1px solid rgba(105,239,255,.16);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10), 0 0 28px rgba(0,0,0,.24);
}
.tx-intro__meter{
  display:flex;
  align-items:flex-end;
  justify-content:center;
  gap:4px;
  height:52px;
}
.tx-intro__meter i{
  width:6px;
  height:8px;
  border-radius:999px 999px 2px 2px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.04);
  transition:height .1s linear, background .1s linear, box-shadow .1s linear, opacity .1s linear;
  opacity:.65;
}
.tx-intro__meter i.is-on{
  height:calc(8px + (var(--i) * 2.5px));
  background:linear-gradient(180deg, #ffffff, #69efff 48%, #ff5ce4);
  box-shadow:0 0 14px rgba(105,239,255,.34);
  opacity:1;
}
.tx-intro__faders{
  display:flex;
  gap:7px;
  align-items:center;
  justify-content:center;
}
.tx-intro__faders i{
  width:7px;
  height:44px;
  border-radius:999px;
  background:linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.04));
  border:1px solid rgba(255,255,255,.08);
  position:relative;
}
.tx-intro__faders i::after{
  content:"";
  position:absolute;
  left:50%;
  top:calc(20% + (var(--tx-intro-progress) * 42%));
  transform:translate(-50%, -50%);
  width:18px;
  height:9px;
  border-radius:999px;
  background:linear-gradient(90deg,#69efff,#ff5ce4);
  box-shadow:0 0 16px rgba(105,239,255,.25);
}
.tx-intro__visualizer{
  bottom:8.8% !important;
}
.tx-intro__flash{
  background:
    radial-gradient(circle at 50% 48%, rgba(255,255,255,.98), rgba(105,239,255,.38), rgba(255,92,228,.20), transparent 58%) !important;
}
@keyframes txLaserSweepF{0%,100%{transform:rotate(-18deg) translateY(0)}50%{transform:rotate(-9deg) translateY(-18px)}}
@keyframes txIntroStrobe{0%,100%{opacity:.28;transform:scale(.92)}50%{opacity:.72;transform:scale(1.08)}}
@keyframes txDeckSpin{to{transform:rotate(360deg)}}

@media (max-width:720px){
  .tx-intro__dj-console{
    width:min(92vw, 520px);
    grid-template-columns:76px minmax(130px, 1fr) 76px;
    gap:8px;
    height:58px;
    bottom:20.5%;
  }
  .tx-intro__deck,
  .tx-intro__mixer{
    height:58px;
    border-radius:16px;
  }
  .tx-intro__deck span{
    width:42px;
    height:42px;
  }
  .tx-intro__mixer{
    padding:8px;
    gap:8px;
  }
  .tx-intro__meter{
    height:38px;
    gap:2px;
  }
  .tx-intro__meter i{
    width:4px;
  }
  .tx-intro__faders{
    gap:4px;
  }
  .tx-intro__faders i{
    width:5px;
    height:32px;
  }
  .tx-intro__opening-copy{
    top:19% !important;
    font-size:11px !important;
    letter-spacing:.22em !important;
  }
}
/* intro-dj-brutal-v17-20260517 */


/* === TXHOUSE 2026-05-17: Intro DJ binaural V20 === */
.tx-intro__opening-copy,
.tx-intro__countdown,
.tx-intro__finale-copy,
.tx-intro__tap,
.tx-intro__mute{display:none !important;}
.tx-intro__brandstack{min-height:360px !important;}
.tx-intro__logo{position:absolute !important; inset:50% auto auto 50% !important; translate:-50% -50% !important; opacity:1 !important; transform:none !important;}
.tx-intro__logo--venetian{display:none !important;}
.tx-intro__catalog-badge{
  position:absolute;
  left:32px;
  bottom:34px;
  z-index:5;
  padding:10px 16px;
  border-radius:999px;
  border:1px solid rgba(105,239,255,.16);
  background:rgba(4,10,22,.46);
  color:#e9fbff;
  font-size:11px;
  font-weight:700;
  letter-spacing:.22em;
  text-transform:uppercase;
  box-shadow:0 0 24px rgba(105,239,255,.08);
  backdrop-filter:blur(10px);
}
.tx-intro__venetian-corner{
  position:absolute;
  right:30px;
  bottom:38px;
  z-index:5;
  display:grid;
  justify-items:end;
  gap:8px;
  opacity:.74;
  transform:translateY(10px) scale(.96);
  transition:opacity .35s ease, transform .35s ease, filter .35s ease;
  filter:drop-shadow(0 0 18px rgba(105,239,255,.08));
}
.tx-intro__venetian-corner.is-active{opacity:1; transform:translateY(0) scale(1); filter:drop-shadow(0 0 24px rgba(105,239,255,.18));}
.tx-intro__venetian-corner img{
  max-width:220px;
  width:min(30vw,220px);
  max-height:78px;
  object-fit:contain;
  filter:drop-shadow(0 0 16px rgba(255,255,255,.08)) drop-shadow(0 0 24px rgba(105,239,255,.14));
}
.tx-intro__venetian-corner span{
  color:#bde4f1;
  font-size:10px;
  letter-spacing:.20em;
  text-transform:uppercase;
}
.tx-intro__stage-label{top:10% !important;}
.tx-intro__logo-wrap{width:min(72vw, 440px) !important; height:min(53vw, 300px) !important;}
.tx-intro__logo-wrap img{
  max-width:min(68vw, 365px) !important;
  max-height:255px !important;
  filter:drop-shadow(0 0 24px rgba(255,255,255,.22)) drop-shadow(0 0 44px rgba(105,239,255,.36)) drop-shadow(0 0 82px rgba(255,92,228,.17)) !important;
}
.tx-intro__visualizer{bottom:10.8% !important;}
.tx-intro__dj-console{bottom:18.8% !important;}
@media (max-width:640px){
  .tx-intro__catalog-badge{left:14px; bottom:16px; font-size:9px; padding:8px 12px; letter-spacing:.14em;}
  .tx-intro__venetian-corner{right:14px; bottom:16px; gap:4px;}
  .tx-intro__venetian-corner img{width:min(38vw,160px); max-height:56px;}
  .tx-intro__venetian-corner span{font-size:8px; letter-spacing:.10em;}
}

/* === TXHOUSE 2026-05-17: gate de ingreso con boton realista V28 === */
.tx-intro__core{
  opacity:0;
  transition:opacity .6s ease;
}
.tx-intro.is-started .tx-intro__core{
  opacity:1;
}
.tx-intro__gate{
  position:absolute;
  inset:0;
  z-index:25;
  display:grid;
  place-items:center;
  background:
    radial-gradient(circle at 50% 46%, rgba(0,153,255,.14), transparent 16%),
    radial-gradient(circle at 50% 58%, rgba(255,92,228,.10), transparent 20%),
    #000;
  transition:opacity .55s ease, transform .55s ease;
}
.tx-intro__gate.is-hidden{
  opacity:0;
  transform:scale(1.03);
  pointer-events:none;
}
.tx-intro__gate-panel{
  display:grid;
  justify-items:center;
  gap:18px;
  padding:18px;
}
.tx-intro__gate-copy{
  display:grid;
  gap:6px;
  text-align:center;
  color:#eefaff;
}
.tx-intro__gate-copy small{
  font-size:11px;
  letter-spacing:.28em;
  text-transform:uppercase;
  color:#8dcde0;
}
.tx-intro__gate-copy strong{
  font-size:clamp(28px, 6vw, 46px);
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  text-shadow:0 0 18px rgba(125,243,255,.18);
}
.tx-intro__gate-copy span{
  font-size:12px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:#b6d8e7;
}
.tx-intro__start-btn{
  position:relative;
  width:118px;
  height:118px;
  border-radius:50%;
  border:1px solid rgba(165, 220, 255, .18);
  background:
    radial-gradient(circle at 35% 30%, rgba(255,255,255,.24), transparent 22%),
    radial-gradient(circle at 50% 50%, #3b4656 0 16%, #1a212b 17% 48%, #5d6878 49% 55%, #10161f 56% 70%, #05080d 71% 100%);
  box-shadow:
    inset 0 3px 6px rgba(255,255,255,.22),
    inset 0 -12px 18px rgba(0,0,0,.5),
    0 16px 30px rgba(0,0,0,.5),
    0 0 26px rgba(105,239,255,.08);
  cursor:pointer;
  transition:transform .12s ease, box-shadow .16s ease, filter .16s ease;
}
.tx-intro__start-btn::before{
  content:"";
  position:absolute;
  inset:10px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12), inset 0 -8px 10px rgba(0,0,0,.32);
  background:
    repeating-linear-gradient(125deg, rgba(255,255,255,.045) 0 2px, transparent 2px 9px),
    radial-gradient(circle at 50% 50%, rgba(255,255,255,.08), transparent 68%);
  opacity:.78;
}
.tx-intro__start-btn::after{
  content:"";
  position:absolute;
  inset:-10px;
  border-radius:50%;
  border:1px solid rgba(105,239,255,.12);
  box-shadow:0 0 22px rgba(105,239,255,.08), inset 0 0 26px rgba(105,239,255,.05);
}
.tx-intro__start-btn:hover{
  filter:brightness(1.04);
  box-shadow:
    inset 0 3px 6px rgba(255,255,255,.24),
    inset 0 -12px 18px rgba(0,0,0,.52),
    0 18px 34px rgba(0,0,0,.54),
    0 0 34px rgba(105,239,255,.12);
}
.tx-intro__start-btn:active,
.tx-intro__start-btn.is-pressed{
  transform:translateY(4px) scale(.985);
  box-shadow:
    inset 0 6px 10px rgba(0,0,0,.45),
    inset 0 -4px 8px rgba(255,255,255,.12),
    0 8px 18px rgba(0,0,0,.44),
    0 0 32px rgba(105,239,255,.14);
}
.tx-intro__start-btn-core{
  position:absolute;
  inset:25px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:radial-gradient(circle at 50% 35%, #131a24 0 32%, #05080c 75%);
  box-shadow:inset 0 2px 3px rgba(255,255,255,.08), inset 0 -6px 14px rgba(0,0,0,.48);
}
.tx-intro__start-btn-core::before{
  content:"▶";
  transform:translateX(2px);
  font-size:30px;
  line-height:1;
  color:#eefdff;
  text-shadow:0 0 12px rgba(105,239,255,.42);
}
.tx-intro__start-led{
  position:absolute;
  top:11px;
  right:14px;
  width:11px;
  height:11px;
  border-radius:50%;
  background:#4b0000;
  box-shadow:0 0 0 1px rgba(0,0,0,.42), inset 0 1px 1px rgba(255,255,255,.16);
}
.tx-intro__start-btn:hover .tx-intro__start-led,
.tx-intro__start-btn:active .tx-intro__start-led,
.tx-intro__start-btn.is-pressed .tx-intro__start-led{
  background:#53f0ff;
  box-shadow:0 0 8px rgba(83,240,255,.95), 0 0 20px rgba(83,240,255,.38), inset 0 1px 1px rgba(255,255,255,.34);
}
@media (max-width:640px){
  .tx-intro__start-btn{width:104px;height:104px;}
  .tx-intro__start-btn-core{inset:22px;}
  .tx-intro__gate-copy strong{font-size:clamp(24px, 8vw, 34px);}
  .tx-intro__gate-copy small,
  .tx-intro__gate-copy span{font-size:10px;}
}

/* === TXHOUSE 2026-05-17: rescate pagina blanca V33 === */
.tx-intro__bypass{
  appearance:none;
  border:1px solid rgba(125,243,255,.18);
  background:rgba(255,255,255,.04);
  color:#ccecf7;
  border-radius:999px;
  padding:10px 14px;
  font-size:11px;
  letter-spacing:.16em;
  text-transform:uppercase;
  cursor:pointer;
}
.tx-intro__bypass:hover{background:rgba(125,243,255,.08);color:#fff;}
.tx-intro__start-btn,
.tx-intro__bypass{position:relative;z-index:30;}
/* rescate-pagina-blanca-v33-20260517 */

/* === TXHOUSE 2026-05-17: load boost intro V38 === */
.tx-intro:not(.is-started) .tx-intro__core{
  display:none !important;
}
.tx-intro:not(.is-started) .tx-intro__particles,
.tx-intro:not(.is-started) .tx-intro__visualizer,
.tx-intro:not(.is-started) .tx-intro__lasers,
.tx-intro:not(.is-started) .tx-intro__waves{
  animation-play-state:paused !important;
}
@media (max-width:680px){
  .tx-intro__particles span:nth-child(n+19),
  .tx-intro__bar:nth-child(n+25),
  .tx-intro__meter i:nth-child(n+9){
    display:none !important;
  }
  .tx-intro__strobe{filter:blur(12px) !important;}
  .tx-intro__laser{box-shadow:0 0 12px rgba(105,239,255,.48) !important;}
}