/* Island Car Log — New Car enters garage opening transition */
#newCarEntryTransition{
  position:fixed;
  inset:0;
  z-index:5100;
  display:none;
  place-items:center;
  overflow:hidden;
  background:rgba(4,12,24,.50);
  backdrop-filter:blur(4px);
  -webkit-backdrop-filter:blur(4px);
  touch-action:none;
}
#newCarEntryTransition.new-car-entry-active{display:grid}
#newCarEntryTransition .nce-stage{
  position:relative;
  width:min(620px,84vw);
  height:min(350px,56vw);
  max-height:390px;
  min-height:245px;
  perspective:900px;
  pointer-events:none;
}
#newCarEntryTransition .nce-ground{
  position:absolute;
  left:-8%;
  right:-8%;
  bottom:3%;
  height:34%;
  background:
    linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,0) 38%),
    linear-gradient(180deg,#3a4248,#20272c);
  clip-path:polygon(17% 0,83% 0,100% 100%,0 100%);
  opacity:.92;
}
#newCarEntryTransition .nce-ground::after{
  content:"";
  position:absolute;
  left:10%;
  right:10%;
  top:44%;
  height:2px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.18),transparent);
}
#newCarEntryTransition .nce-garage{
  position:absolute;
  width:62%;
  height:77%;
  left:50%;
  bottom:13%;
  transform:translateX(-50%);
  border-radius:16px 16px 5px 5px;
  background:linear-gradient(145deg,#3b4650,#202930 58%,#182127);
  box-shadow:0 24px 54px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.12);
}
#newCarEntryTransition .nce-garage::before{
  content:"";
  position:absolute;
  inset:8% 8% 0;
  border-radius:8px 8px 2px 2px;
  background:
    radial-gradient(ellipse at 50% 18%,rgba(255,226,158,.28),transparent 45%),
    linear-gradient(180deg,#131a1f,#0d1317 70%,#11181c);
  box-shadow:inset 0 0 34px rgba(0,0,0,.8);
}
#newCarEntryTransition .nce-garage-light{
  position:absolute;
  left:28%;
  right:28%;
  top:14%;
  height:8px;
  z-index:2;
  border-radius:999px;
  background:#ffe5a4;
  box-shadow:0 0 12px rgba(255,226,158,.9),0 0 34px rgba(255,226,158,.5);
  opacity:0;
}
#newCarEntryTransition .nce-garage-frame{
  position:absolute;
  inset:8% 8% 0;
  z-index:8;
  border:10px solid #46525c;
  border-bottom:0;
  border-radius:9px 9px 0 0;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14);
  pointer-events:none;
}
#newCarEntryTransition .nce-door{
  position:absolute;
  left:8%;
  right:8%;
  top:8%;
  height:92%;
  z-index:7;
  overflow:hidden;
  border-radius:8px 8px 2px 2px;
  transform-origin:top center;
  will-change:transform;
  background:
    repeating-linear-gradient(to bottom,
      transparent 0,
      transparent calc(20% - 2px),
      rgba(10,14,18,.52) calc(20% - 2px),
      rgba(10,14,18,.52) 20%,
      rgba(255,255,255,.08) calc(20% + 1px),
      transparent calc(20% + 3px)
    ),
    linear-gradient(180deg,#59636b,#343d44 55%,#262e34);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16),inset 0 -10px 24px rgba(0,0,0,.25);
}
#newCarEntryTransition .nce-door::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:12%;
  width:48px;
  height:5px;
  transform:translateX(-50%);
  border-radius:999px;
  background:#171d21;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.13);
}
#newCarEntryTransition .nce-car{
  position:absolute;
  z-index:5;
  left:50%;
  bottom:16%;
  width:38%;
  opacity:0;
  transform-origin:50% 100%;
  will-change:transform,opacity;
  filter:drop-shadow(0 12px 13px rgba(0,0,0,.48));
}
#newCarEntryTransition .nce-car svg{display:block;width:100%;height:auto;overflow:visible}
#newCarEntryTransition .nce-car-body{fill:#1677d2}
#newCarEntryTransition .nce-car-highlight{fill:#3190e5}
#newCarEntryTransition .nce-car-window{fill:#b9d9eb}
#newCarEntryTransition .nce-car-tyre{fill:#11171b}
#newCarEntryTransition .nce-car-wheel{fill:#8e9ca6}
#newCarEntryTransition .nce-wheel-spoke{fill:none;stroke:#dbe5eb;stroke-width:2.3;stroke-linecap:round}
#newCarEntryTransition .nce-wheel-hub{fill:#dbe5eb}
#newCarEntryTransition .nce-car-light{fill:#fff3b0;opacity:.95}
#newCarEntryTransition .nce-car-shadow{
  position:absolute;
  left:7%;
  right:9%;
  bottom:-5%;
  height:15%;
  border-radius:50%;
  background:rgba(0,0,0,.36);
  filter:blur(5px);
}
#newCarEntryTransition .nce-wheel-spin{
  pointer-events:none;
}
#newCarEntryTransition .nce-status{
  position:absolute;
  left:50%;
  bottom:-2%;
  transform:translateX(-50%);
  margin:0;
  width:max-content;
  max-width:90vw;
  color:rgba(255,255,255,.78);
  font-size:11px;
  font-weight:900;
  letter-spacing:.14em;
  text-transform:uppercase;
  opacity:0;
}
#newCarEntryTransition .nce-floor-glow{
  position:absolute;
  left:31%;
  right:31%;
  bottom:13%;
  height:11%;
  z-index:3;
  border-radius:50%;
  background:rgba(255,224,154,.30);
  filter:blur(12px);
  opacity:0;
}
@media(max-width:700px){
  #newCarEntryTransition .nce-stage{
    width:min(500px,92vw);
    height:min(310px,64vw);
    min-height:230px;
  }
  #newCarEntryTransition .nce-garage{width:68%;height:74%}
  #newCarEntryTransition .nce-car{width:42%;bottom:17%}
}
@media(max-width:430px){
  #newCarEntryTransition .nce-stage{width:94vw;height:250px;min-height:0}
  #newCarEntryTransition .nce-garage{width:72%}
  #newCarEntryTransition .nce-car{width:45%;bottom:18%}
  #newCarEntryTransition .nce-status{bottom:-5%;font-size:10px}
}
@media(prefers-reduced-motion:reduce){
  #newCarEntryTransition{backdrop-filter:none;-webkit-backdrop-filter:none}
}