.gate{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:24px;
    background:radial-gradient(70% 55% at 50% 40%,rgba(255,45,135,.25),transparent 70%),rgba(8,3,15,.94);backdrop-filter:blur(14px)}
  .gate-card{position:relative;width:min(460px,100%);padding:34px 28px 26px;border-radius:26px;text-align:center;
    background:linear-gradient(180deg,#2a1248,#160b2b);box-shadow:0 0 0 2px #5c2d17 inset,0 30px 80px rgba(0,0,0,.6)}
  .gate-card::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:7px;pointer-events:none;
    -webkit-mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);
    background:radial-gradient(circle,#FFC23D 0 3px,transparent 4.4px) 0 0/20px 20px;filter:drop-shadow(0 0 4px rgba(255,194,61,.9));animation:gatechase 1.1s steps(1) infinite}
  @keyframes gatechase{50%{opacity:.35}}
  .gate-18{font:900 120px/0.8 "BigShoulders_900Black",Impact,sans-serif;color:#FF2D87;text-shadow:0 0 10px #FF2D87,0 0 34px rgba(255,45,135,.7)}
  .gate-script{font:34px/1 "Yellowtail_400Regular",cursive;color:#FFC23D;margin-top:6px}
  .gate p{margin-top:12px;font:500 16px/1.45 "BigShoulders_700Bold",sans-serif;color:#FFF1D0;opacity:.8}
  .gate label{margin:22px auto 0;display:flex;gap:12px;align-items:center;justify-content:center;font:800 19px/1.2 "BigShoulders_700Bold",sans-serif;color:#FFF1D0;cursor:pointer}
  .gate input{width:26px;height:26px;accent-color:#FF2D87;cursor:pointer}
  .gate-enter{margin-top:18px;width:100%;min-height:54px;border:0;border-radius:999px;background:#FF2D87;color:#fff;font:800 20px/1 "BigShoulders_700Bold",sans-serif;cursor:pointer;box-shadow:0 0 26px rgba(255,45,135,.55);transition:opacity .2s}
  .gate-enter:disabled{opacity:.35;cursor:not-allowed;box-shadow:none}
  .gate-out{margin-top:14px;background:none;border:0;color:#FFF1D0;opacity:.6;font:700 15px/1 "BigShoulders_700Bold",sans-serif;cursor:pointer;text-decoration:underline}
  .gate-fine{margin-top:16px!important;font-size:13px!important;opacity:.5!important}
  .gate.bye .gate-card{animation:none}
  @media (prefers-reduced-motion:reduce){.gate-card::before{animation:none}}
.gate,.gate *{box-sizing:border-box}.gate p{margin-bottom:0}.gate button{display:block;margin-inline:auto}.gate-card{color:#FFF1D0}.gate-script{font-weight:400}