.lk-pass-gate-page,
.lk-pass-gate-page body{
  min-width:0;
  overflow-x:hidden;
}

.lk-pass-gate{
  width:min(760px, calc(100vw - 28px));
  max-width:100%;
  min-width:0;
  margin:clamp(18px, 8vh, 76px) auto 0;
  box-sizing:border-box;
  overflow:hidden;
  border:1px solid rgba(15,23,42,.10);
  border-radius:8px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.96), rgba(248,251,255,.98)),
    radial-gradient(420px 220px at 100% 0, rgba(216,255,82,.20), transparent 58%);
  color:#0f172a;
  box-shadow:0 22px 60px rgba(15,23,42,.14);
}

.lk-pass-gate,
.lk-pass-gate *{
  box-sizing:border-box;
}

.lk-pass-gate-shell{
  display:grid;
  grid-template-columns:minmax(128px, 184px) minmax(0, 1fr);
  gap:22px;
  align-items:center;
  padding:24px;
}

.lk-pass-gate-visual{
  position:relative;
  display:grid;
  place-items:center;
  min-width:0;
  aspect-ratio:1;
  border-radius:8px;
  background:
    radial-gradient(circle at 50% 40%, rgba(255,255,255,.88), rgba(236,253,245,.68) 62%, rgba(216,255,82,.28)),
    linear-gradient(145deg, #e0f2fe, #ecfdf5);
  border:1px solid rgba(16,185,129,.16);
  overflow:hidden;
}

.lk-pass-gate-visual::after{
  content:"";
  position:absolute;
  inset:auto 16px 14px;
  height:14px;
  border-radius:999px;
  background:rgba(15,23,42,.10);
  filter:blur(8px);
}

.lk-pass-gate-mascot{
  position:relative;
  z-index:1;
  display:block;
  width:min(86%, 160px);
  height:auto;
  object-fit:contain;
}

.lk-pass-gate-copy{
  min-width:0;
  display:grid;
  gap:12px;
}

.lk-pass-gate .lk-sl-unlockHero{
  display:block;
}

.lk-pass-gate-kicker{
  margin:0;
  color:#047857;
  font-size:12px;
  font-weight:950;
  letter-spacing:0;
  text-transform:uppercase;
}

.lk-pass-gate h1{
  margin:0;
  color:#0f172a;
  font-size:clamp(28px, 4vw, 42px);
  line-height:1.04;
  letter-spacing:0;
}

.lk-pass-gate-message{
  margin:0;
  color:#475569;
  font-size:15px;
  line-height:1.55;
}

.lk-pass-gate-note{
  margin:0;
  padding:10px 12px;
  border:1px solid rgba(16,185,129,.16);
  border-radius:8px;
  background:#ecfdf5;
  color:#065f46;
  font-size:13px;
  font-weight:800;
  line-height:1.45;
}

.lk-pass-gate .notice,
.lk-pass-gate-flash{
  margin:0;
  border-radius:8px;
}

.lk-pass-gate-flash{
  border:1px solid #fecaca;
  background:#fff7f7;
  color:#991b1b;
  padding:10px 12px;
  font-weight:800;
  line-height:1.45;
}

.lk-pass-gate-form{
  display:grid;
  gap:12px;
  margin:2px 0 0;
}

.lk-pass-gate-field{
  display:grid;
  gap:7px;
  margin:0;
  min-width:0;
  color:#334155;
  font-size:13px;
  font-weight:900;
}

.lk-pass-gate-input-row{
  display:flex;
  align-items:stretch;
  gap:8px;
  min-width:0;
}

.lk-pass-gate-input-row input{
  flex:1 1 auto;
  width:100%;
  min-width:0;
  height:46px;
  border:1px solid rgba(15,23,42,.15);
  border-radius:8px;
  background:#fff;
  color:#0f172a;
  padding:0 13px;
  outline:none;
}

.lk-pass-gate-input-row input:focus{
  border-color:#10b981;
  box-shadow:0 0 0 3px rgba(16,185,129,.14);
}

.lk-pass-gate .lk-sl-passToggle{
  min-width:76px;
  min-height:46px;
  border-color:rgba(15,23,42,.14);
}

.lk-pass-gate-action,
.lk-pass-gate .lk-pass-gate-action{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:100%;
  min-height:46px;
  border:1px solid #0f172a;
  border-radius:8px;
  background:#0f172a;
  color:#fff;
  font-weight:950;
  text-decoration:none;
  cursor:pointer;
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.lk-pass-gate-action:hover,
.lk-pass-gate-action:focus-visible{
  transform:translateY(-1px);
  border-color:#064e3b;
  background:#064e3b;
  color:#fff;
  box-shadow:0 12px 24px rgba(6,78,59,.18);
}

.lk-pass-gate-actions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:2px;
}

.lk-pass-gate-actions .btn{
  min-height:40px;
}

body.lk-g-public-page .lk-pass-gate{
  margin-top:clamp(18px, 10vh, 86px);
}

body.lk-g-public-page .lk-pass-gate .lk-g-brand{
  color:#047857 !important;
}

body.lk-g-public-page .lk-pass-gate .lk-g-form{
  margin:2px 0 0;
}

body.lk-g-public-page .lk-pass-gate .lk-g-btn{
  width:100%;
  min-height:46px;
  border-radius:8px;
  background:#0f172a;
}

.lk-page-shell > .lk-content-grid > .lk-pass-gate{
  width:min(760px, calc(100vw - 28px)) !important;
  max-width:100% !important;
  min-width:0 !important;
  margin:clamp(18px, 6vh, 56px) auto 0 !important;
  justify-self:center;
}

.lk-page-shell > .lk-content-grid > .text-bubble.lk-sl-card.lk-pass-gate{
  width:min(760px, calc(100vw - 28px)) !important;
  max-width:100% !important;
  min-width:0 !important;
  margin:clamp(18px, 6vh, 56px) auto 0 !important;
}

.lk-shell.is-authenticated .main-inner > .lk-pass-gate,
.lk-shell.is-authenticated .main-inner > .text-bubble.lk-sl-card.lk-pass-gate{
  width:min(760px, calc(100vw - 28px)) !important;
  max-width:100% !important;
  min-width:0 !important;
  margin:clamp(18px, 6vh, 56px) auto 0 !important;
}

.lk-page-shell > .lk-content-grid > .lk-pass-gate .lk-pass-gate-shell{
  grid-template-columns:minmax(128px, 184px) minmax(0, 1fr);
}

@media (max-width:640px){
  .lk-pass-gate{
    width:min(100%, calc(100vw - 16px));
    margin-top:14px;
  }

  .lk-page-shell > .lk-content-grid > .lk-pass-gate{
    width:min(100%, calc(100vw - 16px)) !important;
    margin-top:14px !important;
  }

  .lk-page-shell > .lk-content-grid > .text-bubble.lk-sl-card.lk-pass-gate{
    width:min(100%, calc(100vw - 16px)) !important;
    margin-top:14px !important;
  }

  .lk-shell.is-authenticated .main-inner > .lk-pass-gate,
  .lk-shell.is-authenticated .main-inner > .text-bubble.lk-sl-card.lk-pass-gate{
    width:min(100%, calc(100vw - 16px)) !important;
    margin-top:14px !important;
  }

  .lk-pass-gate-shell,
  .lk-page-shell > .lk-content-grid > .lk-pass-gate .lk-pass-gate-shell{
    grid-template-columns:minmax(0, 1fr);
    gap:16px;
    padding:16px;
  }

  .lk-pass-gate-visual{
    width:min(174px, 68vw);
    justify-self:center;
  }

  .lk-pass-gate-copy{
    gap:10px;
  }

  .lk-pass-gate h1{
    font-size:30px;
  }

  .lk-pass-gate-input-row{
    display:grid;
    grid-template-columns:minmax(0, 1fr);
  }

  .lk-pass-gate .lk-sl-passToggle{
    width:100%;
  }

  .lk-pass-gate-actions,
  .lk-pass-gate-actions .btn{
    width:100%;
  }
}