:root{
  color-scheme:dark;
  --bg:#07101d;
  --panel:rgba(13,24,42,.92);
  --line:rgba(154,177,211,.18);
  --ink:#f4f7fb;
  --muted:#96a8c1;
  --accent:#55b8ff;
  --accent-2:#72e2bc;
  --danger:#ff7d8a;
  font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
*{box-sizing:border-box}
html,body{min-height:100%;margin:0}
body{
  background:
    radial-gradient(circle at 15% 15%,rgba(49,117,190,.24),transparent 34rem),
    radial-gradient(circle at 85% 85%,rgba(35,153,128,.15),transparent 32rem),
    var(--bg);
  color:var(--ink);
}
body::before{
  content:"";position:fixed;inset:0;pointer-events:none;opacity:.18;
  background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);
  background-size:32px 32px;
}
.access-shell{min-height:100vh;min-height:100svh;display:grid;place-items:center;padding:max(24px,env(safe-area-inset-top)) 18px max(24px,env(safe-area-inset-bottom))}
.access-card{
  width:min(100%,450px);padding:30px;border:1px solid var(--line);border-radius:24px;
  background:linear-gradient(155deg,rgba(18,34,57,.97),var(--panel));
  box-shadow:0 28px 90px rgba(0,0,0,.42),inset 0 1px rgba(255,255,255,.04);
  backdrop-filter:blur(18px);
}
.brand{display:flex;align-items:center;gap:12px;margin-bottom:40px}
.brand-mark{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:linear-gradient(145deg,var(--accent),#337ada);font-weight:900;box-shadow:0 8px 24px rgba(70,155,230,.28)}
.brand span:last-child{display:grid;gap:2px;font-size:15px}
.brand small{color:var(--muted);font-size:11px;font-weight:500;letter-spacing:.025em}
.access-copy{margin-bottom:20px}
.eyebrow{margin:0 0 8px;color:var(--accent-2);font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
h1{margin:0;font-size:clamp(28px,7vw,38px);line-height:1.08;letter-spacing:-.035em}
#access-lead{min-height:42px;margin:12px 0 0;color:var(--muted);font-size:14px;line-height:1.5}
.status{display:flex;align-items:center;gap:9px;min-height:44px;margin:0 0 18px;padding:11px 13px;border:1px solid var(--line);border-radius:12px;background:rgba(4,11,22,.42);color:var(--muted);font-size:13px}
.status-dot{width:8px;height:8px;border-radius:50%;background:#e4ae56;box-shadow:0 0 0 4px rgba(228,174,86,.1)}
.status.ok .status-dot{background:var(--accent-2);box-shadow:0 0 0 4px rgba(114,226,188,.1)}
.status.bad{color:#ffc0c7;border-color:rgba(255,125,138,.3)}
.status.bad .status-dot{background:var(--danger);box-shadow:0 0 0 4px rgba(255,125,138,.1)}
.access-form{display:grid;gap:10px}
.access-form[hidden]{display:none}
label{font-size:12px;font-weight:750;color:#dce7f5}
input{
  width:100%;min-height:50px;padding:0 15px;border:1px solid rgba(157,185,219,.27);border-radius:12px;
  outline:none;background:#081322;color:var(--ink);font:inherit;font-size:16px;letter-spacing:.02em;
}
input:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(85,184,255,.14)}
.field-help{margin:0 0 4px;color:var(--muted);font-size:11px;line-height:1.45}
button{min-height:48px;border:0;border-radius:12px;background:linear-gradient(135deg,#57baff,#4284ec);color:white;font:inherit;font-weight:800;cursor:pointer;box-shadow:0 10px 28px rgba(54,125,216,.24)}
button:hover{filter:brightness(1.06)}
button:focus-visible{outline:3px solid rgba(85,184,255,.35);outline-offset:2px}
button:disabled{cursor:wait;opacity:.55}
.retry{width:100%;background:transparent;border:1px solid var(--line);box-shadow:none;color:#cbd9ea}
.retry[hidden]{display:none}
.privacy{margin:24px 0 0;padding-top:18px;border-top:1px solid var(--line);color:#7489a4;font-size:10px;line-height:1.55}
@media(max-width:520px){.access-card{padding:24px 20px;border-radius:20px}.brand{margin-bottom:32px}}
@media(prefers-reduced-motion:no-preference){.access-card{animation:rise .35s ease-out both}@keyframes rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}}