#omniaCityCinemaV59,
#omniaCityCinemaV59 *{
 box-sizing:border-box;
}

#omniaCityCinemaV59{
 position:fixed;
 inset:0;
 z-index:-1;
 overflow:hidden;
 pointer-events:none;
 background:#020609;
}

.oc59-sky{
 position:absolute;
 inset:0;
 background:
  radial-gradient(
   circle at 50% 24%,
   rgba(75,149,180,.14),
   transparent 26%
  ),
  linear-gradient(
   180deg,
   #04111a,
   #020609 66%
  );
}

.oc59-haze{
 position:absolute;
 left:-10%;
 right:-10%;
 top:26%;
 height:42%;
 filter:blur(34px);
 opacity:.32;
 background:
  linear-gradient(
   90deg,
   transparent,
   rgba(65,145,167,.18),
   rgba(108,214,203,.12),
   transparent
  );
}

.oc59-ground{
 position:absolute;
 left:-30vw;
 right:-30vw;
 top:48%;
 height:70vh;
 transform:
  perspective(1000px)
  rotateX(66deg);
 transform-origin:center top;
 background:
  repeating-linear-gradient(
   90deg,
   transparent 0 88px,
   rgba(121,202,224,.045) 88px 89px
  ),
  repeating-linear-gradient(
   0deg,
   transparent 0 88px,
   rgba(121,202,224,.04) 88px 89px
  );
 mask-image:
  linear-gradient(180deg,#000,transparent 90%);
}

.oc59-landmark{
 position:absolute;
 left:50%;
 top:20%;
 width:190px;
 height:290px;
 transform:
  translateX(-50%)
  perspective(800px)
  rotateY(-4deg);
 opacity:.54;
 transition:
  width .55s ease,
  height .55s ease,
  transform .55s ease,
  opacity .55s ease;
}

.oc59-core{
 position:absolute;
 inset:0;
 clip-path:
  polygon(
   30% 100%,
   18% 32%,
   35% 17%,
   42% 0,
   58% 0,
   65% 17%,
   82% 32%,
   70% 100%
  );
 border:1px solid rgba(119,212,230,.18);
 background:
  linear-gradient(
   180deg,
   rgba(23,54,68,.84),
   rgba(5,15,21,.92)
  );
 box-shadow:
  inset 0 0 60px rgba(103,210,204,.05),
  0 30px 100px rgba(0,0,0,.35);
}

.oc59-beacon{
 position:absolute;
 left:50%;
 top:-60px;
 width:1px;
 height:160px;
 background:
  linear-gradient(
   180deg,
   transparent,
   rgba(117,222,212,.75),
   transparent
  );
 box-shadow:
  0 0 18px rgba(117,222,212,.52);
}

.oc59-wings{
 position:absolute;
 left:50%;
 top:57%;
 width:min(900px,90vw);
 height:120px;
 transform:translateX(-50%);
 opacity:.26;
}

.oc59-wing{
 position:absolute;
 top:0;
 width:44%;
 height:100%;
 border:1px solid rgba(119,202,229,.11);
 background:
  linear-gradient(
   180deg,
   rgba(13,32,42,.8),
   rgba(4,12,17,.9)
  );
}

.oc59-wing:first-child{
 left:0;
 transform:
  perspective(700px)
  rotateY(25deg);
 transform-origin:right center;
}

.oc59-wing:last-child{
 right:0;
 transform:
  perspective(700px)
  rotateY(-25deg);
 transform-origin:left center;
}

.oc59-route{
 position:absolute;
 left:50%;
 bottom:-4%;
 width:24vw;
 min-width:160px;
 height:48%;
 transform:
  translateX(-50%)
  perspective(700px)
  rotateX(68deg);
 transform-origin:center bottom;
 border-left:
  1px solid rgba(102,209,204,.14);
 border-right:
  1px solid rgba(102,209,204,.14);
 background:
  linear-gradient(
   90deg,
   transparent,
   rgba(70,166,174,.04),
   transparent
  );
}

.oc59-district{
 position:absolute;
 left:22px;
 top:86px;
 padding:8px 10px;
 border:1px solid rgba(130,205,232,.12);
 border-radius:9px;
 background:rgba(3,10,15,.64);
 backdrop-filter:blur(12px);
}

.oc59-district span{
 display:block;
 color:#617d89;
 font-size:6px;
 font-weight:850;
 letter-spacing:.17em;
}

.oc59-district strong{
 display:block;
 margin-top:3px;
 color:#b9cbd3;
 font-size:9px;
}

html[data-omnia-v59-district="advertising"] .oc59-core{
 background:
  linear-gradient(
   180deg,
   rgba(54,46,25,.82),
   rgba(8,15,18,.94)
  );
}

html[data-omnia-v59-district="financial"] .oc59-core{
 background:
  linear-gradient(
   180deg,
   rgba(19,54,72,.88),
   rgba(5,15,21,.94)
  );
}

html[data-omnia-v59-district="studios"] .oc59-core{
 background:
  linear-gradient(
   180deg,
   rgba(64,45,31,.87),
   rgba(7,14,18,.94)
  );
}

html[data-omnia-v59-district="residence"] .oc59-core{
 border-radius:22px 22px 4px 4px;
 background:
  linear-gradient(
   180deg,
   rgba(24,48,53,.88),
   rgba(7,15,18,.94)
  );
}

html[data-omnia-v59-district="mantle"] .oc59-landmark{
 height:330px;
}

@media(max-width:700px){
 .oc59-district{
  left:10px;
  top:74px;
 }

 .oc59-landmark{
  width:140px;
  height:230px;
  top:24%;
 }

 .oc59-wings{
  width:110vw;
 }
}

@media(prefers-reduced-motion:reduce){
 .oc59-landmark{
  transition:none!important;
 }
}