/* Sign-in and access screens */
.gate{min-height:100vh;display:grid;place-items:center;padding:24px 16px;background:
  radial-gradient(1200px 500px at 50% -10%, color-mix(in srgb,var(--accent) 22%,transparent), transparent 70%), var(--bg)}
.gate-card{width:min(440px,100%);background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:32px 28px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:14px;align-items:center;text-align:center}
.gate-card h1{font-size:1.35rem}
.gate-card p{margin:0}
.gate-brand{display:flex;align-items:center;gap:10px;text-align:left}
.gate-brand b{font:800 20px/1 var(--f-display);color:var(--accent)}
.gate-brand .div{width:2px;height:30px;background:var(--orange);border-radius:2px}
.gate-brand small{font:600 9.5px/1.3 var(--f-display);letter-spacing:.14em;color:var(--muted)}
.gate-btn{width:100%;display:flex;gap:10px;justify-content:center;align-items:center;padding:11px 14px;font-weight:600}
.gate-btn svg{background:#fff;border-radius:50%;padding:2px}
.gate-or{width:100%;display:flex;align-items:center;gap:10px;color:var(--muted);font-size:12px}
.gate-or::before,.gate-or::after{content:"";flex:1;height:1px;background:var(--line)}
.gate-phone{width:100%;display:flex;gap:8px;align-items:flex-end;text-align:left}
.gate-phone label{flex:1;display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--muted);font-weight:500}
.gate-phone .f{width:100%}
.gate .banner{width:100%;margin:0}