body.visa-gate-locked { overflow: hidden; }
.visa-access-gate {
  position: fixed;
  inset: 0;
  z-index: 2147483000;
  display: grid;
  place-items: center;
  overflow: hidden;
  padding: 20px;
  background:
    linear-gradient(rgba(3, 11, 24, .84), rgba(2, 8, 18, .97)),
    repeating-linear-gradient(0deg, rgba(78, 214, 255, .035) 0 1px, transparent 1px 34px),
    repeating-linear-gradient(90deg, rgba(78, 214, 255, .035) 0 1px, transparent 1px 34px),
    #030a14;
  color: #e9f8ff;
}
.visa-access-gate::before {
  content: "";
  position: absolute;
  inset: -12%;
  pointer-events: none;
  background:
    linear-gradient(115deg, transparent 0 45%, rgba(84, 224, 255, .055) 50%, transparent 56%),
    repeating-linear-gradient(0deg, transparent 0 27px, rgba(97, 225, 255, .05) 28px);
}
.visa-access-gate::after {
  content: "";
  position: absolute;
  inset: 0;
  height: 22%;
  pointer-events: none;
  background: linear-gradient(180deg, transparent, rgba(69, 224, 255, .08), transparent);
  animation: visaGateScan 5.2s linear infinite;
}
.visa-access-gate.is-hidden { display: none; }
.visa-access-stage { position: relative; z-index: 2; width: min(460px, 100%); perspective: 1100px; }
.visa-access-card {
  position: relative;
  overflow: hidden;
  padding: 22px;
  border: 1px solid rgba(88, 222, 255, .35);
  border-radius: 8px;
  background: linear-gradient(145deg, rgba(10, 33, 59, .97), rgba(3, 14, 28, .99));
  box-shadow: 0 34px 100px rgba(0, 0, 0, .62), 0 0 42px rgba(25, 164, 220, .12);
  transform: perspective(1100px) rotateX(1.6deg) rotateY(-2.2deg);
}
.visa-access-card::after {
  content: "";
  position: absolute;
  inset: 8px;
  border: 1px solid rgba(76, 213, 255, .1);
  border-radius: 5px;
  pointer-events: none;
}
.visa-access-corners { position: absolute; inset: 10px; pointer-events: none; }
.visa-access-corners span { position: absolute; width: 24px; height: 24px; border-color: #51dcff; border-style: solid; }
.visa-access-corners span:nth-child(1) { left: 0; top: 0; border-width: 2px 0 0 2px; }
.visa-access-corners span:nth-child(2) { right: 0; top: 0; border-width: 2px 2px 0 0; }
.visa-access-corners span:nth-child(3) { right: 0; bottom: 0; border-width: 0 2px 2px 0; }
.visa-access-corners span:nth-child(4) { left: 0; bottom: 0; border-width: 0 0 2px 2px; }
.visa-access-topline {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 18px;
  color: #7edfff;
  font: 700 10px Consolas, Menlo, monospace;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.visa-access-topline em { font-style: normal; color: #91a9c4; }
.visa-access-online { display: inline-flex; align-items: center; gap: 7px; color: #9deec5; }
.visa-access-online i { width: 7px; height: 7px; border-radius: 50%; background: #5dffad; box-shadow: 0 0 13px rgba(93,255,173,.9); }
.visa-access-lock {
  position: relative;
  width: 78px;
  height: 78px;
  margin: 0 auto 14px;
  display: grid;
  place-items: center;
  color: #7fe6ff;
}
.visa-access-lock::before,
.visa-access-lock::after { content: ""; position: absolute; inset: 7px; border: 1px solid rgba(88,223,255,.38); border-radius: 50%; animation: visaLockRing 5s linear infinite; }
.visa-access-lock::after { inset: 0; border-style: dashed; border-color: rgba(255,188,96,.32); animation-direction: reverse; }
.visa-access-lock-core { position: absolute; inset: 17px; border-radius: 50%; background: radial-gradient(circle, rgba(58,212,255,.2), rgba(4,22,42,.96) 64%); }
.visa-access-lock svg { position: relative; z-index: 1; }
.visa-access-card h2 { margin: 0; color: #f1fbff; font-size: 23px; text-align: center; }
.visa-access-card > p { margin: 8px 0 18px; color: #9cb3cc; font-size: 13px; line-height: 1.7; text-align: center; }
.visa-access-code-shell {
  position: relative;
  min-height: 86px;
  margin-bottom: 2px;
  padding: 9px 50px 9px 9px;
  border: 1px solid rgba(91,216,255,.3);
  border-radius: 7px;
  background: rgba(2,13,28,.78);
  overflow: hidden;
  cursor: text;
}
.visa-access-code-shell img { display: block; width: 100%; height: 66px; border-radius: 5px; background: #eef5ff; object-fit: cover; }
.visa-access-code-shell::after { content: ""; position: absolute; left: 9px; right: 50px; top: 9px; height: 2px; background: linear-gradient(90deg,transparent,#49d9ff,transparent); animation: visaCaptchaScan 2.2s linear infinite; }
.visa-access-refresh { position: absolute; top: 9px; right: 9px; bottom: 9px; width: 34px; display: grid; place-items: center; border: 1px solid rgba(95,218,255,.28); border-radius: 6px; background: rgba(18,56,88,.66); color: #91e8ff; cursor: pointer; }
.visa-access-label { display: block; margin: 12px 0 6px; color: #86a6c2; font-size: 11px; font-weight: 700; letter-spacing: .16em; }
.visa-access-input {
  width: 100%;
  min-height: 56px;
  padding: 0 14px;
  border: 1px solid rgba(91,216,255,.3);
  border-radius: 7px;
  color: #ecfbff;
  background: rgba(2,13,28,.86);
  font: 800 25px Consolas, Menlo, monospace;
  letter-spacing: .38em;
  text-align: center;
  outline: none;
  cursor: text;
  caret-color: #58e5ff;
  -webkit-appearance: none;
  appearance: none;
  -webkit-user-select: text;
  user-select: text;
}
.visa-access-input:focus { border-color: #55ddff; box-shadow: 0 0 0 3px rgba(85,221,255,.11), 0 0 28px rgba(85,221,255,.12); }
.visa-access-submit {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  width: 100%;
  min-height: 52px;
  margin-top: 13px;
  border: 1px solid rgba(105,231,255,.7);
  border-radius: 7px;
  background: linear-gradient(100deg,#0a699b,#12a6ce 55%,#0b7ca9);
  color: #fff;
  font-size: 16px;
  font-weight: 900;
  cursor: pointer;
}
.visa-access-submit:disabled { opacity: .62; cursor: wait; }
.visa-access-error { min-height: 20px; margin: 10px 0 0; color: #ff9b8a; font-size: 12px; text-align: center; }
.visa-access-meta { display: flex; justify-content: space-between; gap: 12px; margin-top: 18px; padding-top: 12px; border-top: 1px solid rgba(100,213,245,.12); color: #607d98; font: 9px Consolas, Menlo, monospace; letter-spacing: .14em; }
.visa-access-gate.is-alert .visa-access-card { animation: visaGateAlert .5s ease; }
@keyframes visaGateScan { from { transform: translateY(-120%); } to { transform: translateY(560%); } }
@keyframes visaLockRing { to { transform: rotate(360deg); } }
@keyframes visaCaptchaScan { 0% { transform: translateY(0); opacity: 0; } 16%,80% { opacity: 1; } 100% { transform: translateY(64px); opacity: 0; } }
@keyframes visaGateAlert { 0%,100% { transform: perspective(1100px) rotateX(1.6deg) rotateY(-2.2deg); } 35% { transform: perspective(1100px) rotateX(1.6deg) rotateY(-2.2deg) translateX(-7px); } 70% { transform: perspective(1100px) rotateX(1.6deg) rotateY(-2.2deg) translateX(7px); } }
@media (max-width: 520px) { .visa-access-gate { padding: 14px; } .visa-access-card { padding: 20px 17px; } .visa-access-code-shell img { height: 60px; } }
@media (hover: none), (pointer: coarse) { .visa-access-card,.visa-access-code-shell,.visa-access-input,.visa-access-submit { transform: none !important; } }
@supports (-webkit-touch-callout: none) { .visa-access-card,.visa-access-code-shell,.visa-access-input,.visa-access-submit { transform: none !important; } }
