/* ============ GATE ============
   Same card as before, but it no longer blocks the page.
   It now opens as a modal only when a guest tries to act. */
  .gate-card{padding:clamp(26px,5vw,40px);text-align:center;}
  .gate-ic{
    width:64px;height:64px;border-radius:20px;margin:0 auto 18px;display:flex;align-items:center;justify-content:center;
    font-size:1.7rem;background:linear-gradient(135deg,var(--blue-600),#1b3f9c);
    box-shadow:0 14px 30px -10px rgba(47,111,237,.7);
    transform:perspective(600px) rotateX(8deg);
  }
  .gate-card h2{font-size:1.5rem;margin-bottom:8px;}
  .gate-card p.desc{color:var(--ink-300);font-size:.92rem;line-height:1.6;max-width:42ch;margin:0 auto 22px;}
  .gate-field{text-align:left;margin-bottom:16px;}
  .gate-field label{display:block;font-family:var(--font-mono);font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-300);margin-bottom:8px;}
  .gate-field input{
    width:100%;padding:14px 16px;border-radius:14px;background:rgba(255,255,255,.05);
    border:1px solid var(--glass-border);color:var(--ink-0);font-size:.95rem;outline:none;
    transition:border-color .2s ease, background .2s ease;
  }
  .gate-field input:focus{border-color:var(--blue-400);background:rgba(255,255,255,.08);}
  .gate-error{color:#FF8A8A;font-size:.85rem;margin-bottom:14px;line-height:1.5;display:none;}
  .gate-error.show{display:block;}
  .gate-error a{color:var(--blue-300);text-decoration:underline;}
  .gate-foot{margin-top:18px;font-size:.82rem;color:var(--ink-500);}
  .gate-foot a{color:var(--blue-300);text-decoration:none;}
  .gate-foot a:hover{text-decoration:underline;}

  /* --- modal shell (new) --- */
  #gateModal{position:fixed;inset:0;z-index:90;display:none;}
  #gateModal.open{display:grid;place-items:center;padding:20px;}
  .gate-veil{position:absolute;inset:0;background:rgba(3,7,20,.74);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);}
  .gate-shell{position:relative;width:min(460px,100%);max-height:92svh;overflow-y:auto;animation:gate-in .26s cubic-bezier(.2,.8,.2,1);}
  @keyframes gate-in{from{transform:translateY(22px) scale(.97);opacity:0;}}
  .gate-close{
    position:absolute;top:12px;right:12px;z-index:2;width:32px;height:32px;border-radius:10px;
    border:1px solid var(--glass-border);background:var(--glass-fill);color:var(--ink-300);
    font-size:1.15rem;line-height:1;cursor:pointer;
  }
  .gate-close:hover{background:var(--glass-fill-strong);color:var(--ink-0);}