/*
 * KMETA Membership Common Access Gate
 * Central premium access popup shared by Storybook / Animation / Songs / future KMETA plugins.
 * IMPORTANT: Keep this file theme-independent. Do not bind it to the site's light/dark theme.
 */
#kmeta-membership-access-gate,
#kmeta-membership-access-gate *{
  box-sizing:border-box;
}
#kmeta-membership-access-gate{
  position:fixed!important;
  inset:0!important;
  z-index:2147483647!important;
  display:none!important;
  align-items:center!important;
  justify-content:center!important;
  padding:18px!important;
  margin:0!important;
  background:rgba(3,7,18,.58)!important;
  -webkit-backdrop-filter:blur(8px)!important;
  backdrop-filter:blur(8px)!important;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,"Apple SD Gothic Neo","Noto Sans KR",sans-serif!important;
  text-align:left!important;
}
#kmeta-membership-access-gate.is-open{display:flex!important;}
#kmeta-membership-access-gate .kmeta-membership-gate__shell{
  width:min(100%,560px)!important;
  margin:0!important;
  padding:14px!important;
  border:1px solid rgba(0,0,0,.08)!important;
  border-radius:0!important;
  --kmeta-bg:#f6f7f9;
  --kmeta-surface:#ffffff;
  --kmeta-text:#111827;
  --kmeta-muted:#556375;
  --kmeta-line:rgba(17,24,39,.10);
  background:var(--kmeta-bg)!important;
  color:var(--kmeta-text)!important;
  box-shadow:0 14px 40px rgba(0,0,0,.18)!important;
  outline:0!important;
}
#kmeta-membership-access-gate .kmeta-membership-gate__topbar{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  min-height:46px!important;
  margin:0!important;
  padding:10px!important;
  border:1px solid var(--kmeta-line)!important;
  border-radius:0!important;
  background:linear-gradient(180deg,rgba(255,255,255,.02),transparent)!important;
  box-shadow:none!important;
}
#kmeta-membership-access-gate .kmeta-membership-gate__brand{
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  color:var(--kmeta-text)!important;
  font-size:13px!important;
  line-height:1.2!important;
  font-weight:900!important;
  letter-spacing:.5px!important;
  white-space:nowrap!important;
}
#kmeta-membership-access-gate .kmeta-membership-gate__brand img{
  display:block!important;
  width:auto!important;
  height:26px!important;
  max-width:220px!important;
  max-height:26px!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  object-fit:contain!important;
  box-shadow:none!important;
}
#kmeta-membership-access-gate .kmeta-membership-gate__brand-text{
  display:block!important;
  min-width:0!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
#kmeta-membership-access-gate .kmeta-membership-gate__grid{
  display:grid!important;
  grid-template-columns:repeat(12,1fr)!important;
  gap:12px!important;
  margin:12px 0 0!important;
  padding:0!important;
}
#kmeta-membership-access-gate .kmeta-membership-gate__card{
  grid-column:span 12!important;
  margin:0!important;
  padding:0!important;
  border:1px solid var(--kmeta-line)!important;
  border-radius:0!important;
  background:var(--kmeta-surface)!important;
  color:var(--kmeta-text)!important;
  box-shadow:none!important;
}
#kmeta-membership-access-gate .kmeta-membership-gate__head{
  margin:0!important;
  padding:12px!important;
  border:0!important;
  border-bottom:1px solid var(--kmeta-line)!important;
  background:var(--kmeta-surface)!important;
}
#kmeta-membership-access-gate .kmeta-membership-gate__title{
  margin:0!important;
  padding:0!important;
  border:0!important;
  color:var(--kmeta-text)!important;
  font-size:13px!important;
  line-height:1.45!important;
  font-weight:900!important;
  letter-spacing:0!important;
  text-transform:none!important;
}
#kmeta-membership-access-gate .kmeta-membership-gate__body{
  margin:0!important;
  padding:12px!important;
  border:0!important;
  background:var(--kmeta-surface)!important;
}
#kmeta-membership-access-gate .kmeta-membership-gate__desc{
  margin:6px 0 0!important;
  padding:0!important;
  color:var(--kmeta-muted)!important;
  font-size:12px!important;
  line-height:1.75!important;
  font-weight:400!important;
  letter-spacing:0!important;
  white-space:pre-line!important;
}
#kmeta-membership-access-gate .kmeta-membership-gate__actions{
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  flex-wrap:wrap!important;
  margin:12px 0 0!important;
  padding:0!important;
}
#kmeta-membership-access-gate .kmeta-membership-gate__btn{
  all:unset;
  box-sizing:border-box!important;
  position:relative!important;
  overflow:hidden!important;
  isolation:isolate!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  min-width:108px!important;
  min-height:0!important;
  height:auto!important;
  margin:0!important;
  padding:12px 18px!important;
  border:1px solid rgba(255,255,255,.14)!important;
  border-radius:16px!important;
  background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.03))!important;
  color:var(--kmeta-text)!important;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,"Apple SD Gothic Neo","Noto Sans KR",sans-serif!important;
  font-size:12px!important;
  line-height:1!important;
  font-weight:900!important;
  letter-spacing:.01em!important;
  text-decoration:none!important;
  text-transform:none!important;
  white-space:nowrap!important;
  cursor:pointer!important;
  appearance:none!important;
  -webkit-appearance:none!important;
  box-shadow:0 10px 24px rgba(2,6,23,.18),inset 0 1px 0 rgba(255,255,255,.12)!important;
  transition:transform .22s cubic-bezier(.2,.8,.2,1),box-shadow .22s ease,border-color .22s ease,background .22s ease,color .22s ease,filter .22s ease!important;
}
#kmeta-membership-access-gate .kmeta-membership-gate__btn::before{
  content:''!important;
  position:absolute!important;
  top:-120%!important;
  left:-38%!important;
  width:42%!important;
  height:340%!important;
  margin:0!important;
  background:linear-gradient(180deg,rgba(255,255,255,0),rgba(255,255,255,.18),rgba(255,255,255,.62),rgba(255,255,255,.16),rgba(255,255,255,0))!important;
  transform:translateX(-180%) rotate(24deg)!important;
  opacity:0!important;
  pointer-events:none!important;
  transition:transform .72s cubic-bezier(.19,1,.22,1),opacity .36s ease!important;
  z-index:1!important;
}
#kmeta-membership-access-gate .kmeta-membership-gate__btn:hover,
#kmeta-membership-access-gate .kmeta-membership-gate__btn:focus-visible{
  transform:translateY(-2px) scale(1.01)!important;
  border-color:rgba(255,255,255,.24)!important;
  box-shadow:0 18px 34px rgba(2,6,23,.26),inset 0 1px 0 rgba(255,255,255,.18),0 0 0 1px rgba(255,255,255,.05)!important;
}
#kmeta-membership-access-gate .kmeta-membership-gate__btn:hover::before,
#kmeta-membership-access-gate .kmeta-membership-gate__btn:focus-visible::before{
  opacity:1!important;
  transform:translateX(360%) rotate(24deg)!important;
}
#kmeta-membership-access-gate .kmeta-membership-gate__btn:active{
  transform:translateY(0) scale(.985)!important;
  box-shadow:0 8px 18px rgba(2,6,23,.18),inset 0 1px 0 rgba(255,255,255,.08)!important;
}
#kmeta-membership-access-gate .kmeta-membership-gate__btn:focus-visible{
  outline:none!important;
}
#kmeta-membership-access-gate .kmeta-membership-gate__btn--primary{
  background:#011dbb!important;
  color:#fff!important;
  border-color:rgba(153,181,255,.52)!important;
  box-shadow:0 14px 32px rgba(1,29,187,.38),inset 0 1px 0 rgba(255,255,255,.22),0 0 0 1px rgba(1,29,187,.10)!important;
}
#kmeta-membership-access-gate .kmeta-membership-gate__btn--primary:hover,
#kmeta-membership-access-gate .kmeta-membership-gate__btn--primary:focus-visible{
  background:#011dbb!important;
  color:#fff!important;
  box-shadow:0 22px 46px rgba(1,29,187,.50),inset 0 1px 0 rgba(255,255,255,.28),0 0 26px rgba(54,102,255,.34)!important;
  filter:saturate(1.08) brightness(1.06)!important;
}
#kmeta-membership-access-gate .kmeta-membership-gate__btn--ghost{
  background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.02))!important;
  color:var(--kmeta-text)!important;
  border-color:rgba(255,255,255,.12)!important;
}
#kmeta-membership-access-gate .kmeta-membership-gate__btn--ghost:hover,
#kmeta-membership-access-gate .kmeta-membership-gate__btn--ghost:focus-visible{
  background:linear-gradient(180deg,rgba(255,255,255,.13),rgba(255,255,255,.05))!important;
  color:var(--kmeta-text)!important;
  box-shadow:0 16px 30px rgba(2,6,23,.22),inset 0 1px 0 rgba(255,255,255,.16),0 0 20px rgba(255,255,255,.05)!important;
}
@media (max-width:640px){
  #kmeta-membership-access-gate{padding:12px!important;}
  #kmeta-membership-access-gate .kmeta-membership-gate__shell{width:min(100%,94vw)!important;}
  #kmeta-membership-access-gate .kmeta-membership-gate__actions{flex-direction:column!important;align-items:stretch!important;}
  #kmeta-membership-access-gate .kmeta-membership-gate__btn{width:100%!important;text-align:center!important;}
}
