/* 1NFINIT3 Formation Aperture V1 — projection only. */
.formation-aperture{
  position:relative;
  z-index:2;
  width:min(100%,760px);
  margin:4px auto 22px;
  padding:clamp(12px,2.4vw,22px) 0 0;
  color:var(--human-white);
}
.formation-aperture__mark{
  position:relative;
  width:100%;
  height:clamp(72px,14vw,118px);
  pointer-events:none;
}
.formation-aperture__svg{display:block;width:100%;height:100%;overflow:visible}
.formation-aperture__i{
  transform-box:view-box;
  transform-origin:center;
  transition:transform 900ms cubic-bezier(.22,.61,.36,1),opacity 260ms ease;
  will-change:transform;
}
.formation-aperture__support{
  opacity:0;
  transition:opacity 400ms ease;
}
.formation-aperture[data-state="opening"] .formation-aperture__i--left,
.formation-aperture[data-state="active"] .formation-aperture__i--left,
.formation-aperture[data-state="needs-you"] .formation-aperture__i--left,
.formation-aperture[data-state="blocked"] .formation-aperture__i--left,
.formation-aperture[data-state="finalizing"] .formation-aperture__i--left{transform:translateX(-13.43%)}
.formation-aperture[data-state="opening"] .formation-aperture__i--right,
.formation-aperture[data-state="active"] .formation-aperture__i--right,
.formation-aperture[data-state="needs-you"] .formation-aperture__i--right,
.formation-aperture[data-state="blocked"] .formation-aperture__i--right,
.formation-aperture[data-state="finalizing"] .formation-aperture__i--right{transform:translateX(13.43%)}
.formation-aperture[data-state="resting"] .formation-aperture__i--left{transform:translateX(2.86%)}
.formation-aperture[data-state="resting"] .formation-aperture__i--right{transform:translateX(-14.16%)}
.formation-aperture[data-state="closing"] .formation-aperture__i,
.formation-aperture[data-state="closed"] .formation-aperture__i{transform:translateX(0)}
.formation-aperture[data-state="closing"] .formation-aperture__support,
.formation-aperture[data-state="closed"] .formation-aperture__support{opacity:1}
.formation-aperture__three{transition-delay:500ms!important}
.formation-aperture[data-state="needs-you"]{color:var(--solar-gold)}
.formation-aperture[data-state="blocked"]{color:#ef6a67}
.formation-chamber{
  width:min(92%,560px);
  margin:-34px auto 0;
  padding:clamp(16px,2.8vw,28px);
  border:1px solid rgba(255,255,255,.13);
  border-radius:24px;
  background:rgba(12,14,15,.38);
  backdrop-filter:blur(18px) saturate(132%);
  -webkit-backdrop-filter:blur(18px) saturate(132%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 18px 50px rgba(0,0,0,.18);
  opacity:1;
  transition:opacity 420ms ease,transform 420ms ease,border-color 220ms ease;
}
.formation-aperture[data-state="closing"] .formation-chamber,
.formation-aperture[data-state="closed"] .formation-chamber{opacity:0;transform:translateY(5px);pointer-events:none}
.formation-aperture[data-state="needs-you"] .formation-chamber{border-color:rgba(212,175,55,.52)}
.formation-aperture[data-state="blocked"] .formation-chamber{border-color:rgba(239,106,103,.52)}
.formation-chamber__head,.formation-chamber__foot{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.formation-chamber__title{margin:0;font-size:clamp(16px,3.2vw,21px);font-weight:560;letter-spacing:-.02em;color:inherit}
.formation-chamber__status{display:inline-flex;align-items:center;gap:7px;color:var(--muted);font-size:10px;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap}
.formation-chamber__dot{width:6px;height:6px;border-radius:50%;background:currentColor;box-shadow:0 0 8px currentColor}
.formation-chamber__progress{margin:18px 0 16px}
.formation-chamber__pct{font-size:clamp(28px,6vw,44px);font-weight:700;line-height:1;font-variant-numeric:tabular-nums}
.formation-chamber__rail{height:4px;margin:11px 0 8px;border-radius:999px;background:rgba(255,255,255,.09);overflow:hidden}
.formation-chamber__fill{height:100%;width:0;border-radius:inherit;background:#63b884;transition:width 400ms ease}
.formation-aperture[data-state="needs-you"] .formation-chamber__fill{background:var(--solar-gold)}
.formation-aperture[data-state="blocked"] .formation-chamber__fill{background:#ef6a67}
.formation-chamber__eta,.formation-chamber__leave,.formation-chamber__step{font-size:11px;color:var(--muted);line-height:1.4}
.formation-chamber__details{list-style:none;margin:0 0 16px;padding:0;display:grid;gap:7px}
.formation-chamber__details li{display:flex;gap:9px;align-items:center;font-size:12px;color:var(--muted)}
.formation-chamber__bullet{width:12px;height:12px;flex:0 0 12px;border:1px solid rgba(255,255,255,.25);border-radius:50%}
.formation-chamber__details .is-done{color:inherit}
.formation-chamber__details .is-done .formation-chamber__bullet{background:#63b884;border-color:#63b884}
.formation-chamber__details .is-now{color:inherit;font-weight:550}
.formation-chamber__details .is-now .formation-chamber__bullet{border-color:currentColor;box-shadow:0 0 0 3px rgba(255,255,255,.09)}
.formation-chamber__foot{padding-top:13px;border-top:1px solid rgba(255,255,255,.09);align-items:flex-end}
.formation-chamber__leave{text-align:right;max-width:62%}
:root[data-v22-world="full-day"] .formation-aperture{color:#202522}
:root[data-v22-world="full-day"] .formation-chamber{background:rgba(255,255,255,.64);border-color:rgba(20,26,22,.12);box-shadow:0 16px 42px rgba(27,34,28,.09)}
:root[data-v22-world="full-day"] .formation-chamber__rail{background:rgba(20,26,22,.09)}
:root[data-v22-world="full-day"] .formation-chamber__foot{border-color:rgba(20,26,22,.09)}
@media(max-width:560px){
  .formation-aperture{margin-top:0}
  .formation-aperture__mark{height:72px}
  .formation-chamber{margin-top:-22px;width:96%;padding:15px;border-radius:19px}
  .formation-chamber__details{display:none}
}
@media(prefers-reduced-motion:reduce){
  .formation-aperture__i,.formation-aperture__support,.formation-chamber,.formation-chamber__fill{transition-duration:1ms!important}
}
