:root { --gate-bg: #07090d; --gate-surface: #0f151d; --gate-text: #f3f6f8; --gate-muted: #95a2b0; --gate-blue: #66b3ff; --gate-line: rgba(255,255,255,.14); }
body.access-pending { overflow: hidden !important; }
body.access-pending > :not(.access-gate) { opacity: .12; filter: blur(12px); pointer-events: none; user-select: none; }
.access-gate { position: fixed; z-index: 10000; inset: 0; display: grid; place-items: center; padding: 24px; background: radial-gradient(circle at 50% 35%, rgba(102,179,255,.09), transparent 32%), var(--gate-bg); color: var(--gate-text); font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; transition: opacity 180ms ease; }
.access-gate.unlocking { opacity: 0; pointer-events: none; }
.access-gate-card { width: min(480px, 100%); padding: 32px; border: 1px solid var(--gate-line); border-top: 2px solid var(--gate-blue); border-radius: 8px; background: var(--gate-surface); box-shadow: 0 30px 90px rgba(0,0,0,.48); }
.access-gate-card > span, .access-gate-card label, .access-gate-card small { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; letter-spacing: .1em; }
.access-gate-card > span { color: var(--gate-blue); font-size: 10px; font-weight: 700; }
.access-gate-card h1 { margin: 14px 0 0; font-size: clamp(30px, 6vw, 46px); font-weight: 570; line-height: 1; letter-spacing: -.045em; }
.access-gate-card p { margin: 15px 0 26px; color: var(--gate-muted); font-size: 14px; }
.access-gate-card label { display: block; margin-bottom: 8px; color: var(--gate-muted); font-size: 9px; font-weight: 700; }
.access-gate-card > div { display: grid; grid-template-columns: minmax(0,1fr) 104px; gap: 8px; }
.access-gate-card input, .access-gate-card button { min-height: 46px; border-radius: 5px; font: inherit; }
.access-gate-card input { min-width: 0; padding: 0 13px; border: 1px solid var(--gate-line); outline: 0; background: #090d12; color: var(--gate-text); }
.access-gate-card input:focus { border-color: var(--gate-blue); box-shadow: 0 0 0 3px rgba(102,179,255,.12); }
.access-gate-card button { border: 0; background: var(--gate-blue); color: #06101a; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; font-size: 10px; font-weight: 800; letter-spacing: .08em; cursor: pointer; }
.access-gate-card small { display: block; min-height: 15px; margin-top: 13px; color: #687584; font-size: 9px; }
.access-gate-card.invalid { animation: gateShake 180ms ease; }
.access-gate-card.invalid input { border-color: #f06c75; }
.access-gate-card.invalid small { color: #f06c75; }
@keyframes gateShake { 25% { transform: translateX(-5px); } 75% { transform: translateX(5px); } }
@media (max-width: 560px) { .access-gate-card { padding: 24px; } .access-gate-card > div { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { .access-gate, .access-gate-card { transition: none; animation: none !important; } }
