/* The email gate and the plain pages around a share link (expired, not
   found). One card on the brand gradient, nothing that names the deck. */
*{box-sizing:border-box}
html,body{margin:0}
body.gate{
  min-height:100dvh; display:grid; place-items:center; padding:24px;
  background:var(--gradient); color:var(--text);
  font-family:var(--font-sans); font-size:15px; line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
.gate-card{
  width:min(420px,100%); background:var(--surface); border-radius:var(--r-surface);
  box-shadow:var(--shadow-sheet); padding:32px; display:flex; flex-direction:column; gap:14px;
}
.gate-card h1{font-family:var(--font-display); font-weight:700; font-size:24px; letter-spacing:-0.02em; line-height:1.15; margin:0}
.gate-card p{margin:0; color:var(--text-muted)}
.gate-card form{display:flex; flex-direction:column; gap:12px; margin-top:6px}
.gate-field{display:flex; flex-direction:column; gap:6px}
.gate-field span{font-family:var(--font-mono); font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--text-muted)}
.gate-field input{
  height:42px; padding:0 12px; font:inherit; color:var(--text);
  border:1px solid var(--surface-border); border-radius:var(--r-sm); background:#fff;
}
.gate-field input:focus{outline:none; border-color:var(--primary); box-shadow:var(--ring)}
.gate-error{color:var(--danger,#d64545) !important; font-size:14px}
.gate-button{
  height:42px; border:0; border-radius:var(--r-sm); cursor:pointer;
  background:var(--text); color:#fff; font:600 15px var(--font-sans);
}
.gate-button:hover{background:#27293a}