/* Private Access — loaded on the homepage only, alongside site.css.
   Tokens, type scale and easing are site.css's; nothing here restyles any
   existing component. The hidden hotspot itself carries no styling at all
   (fill="transparent" is an attribute on the path), so the wordmark is
   pixel-identical with and without this feature. */

.pa{position:fixed;inset:0;z-index:10000;background:var(--bg);color:var(--text);
  display:grid;place-items:center;opacity:0;pointer-events:none;
  clip-path:inset(0 0 100% 0);
  transition:opacity .48s var(--ease),clip-path .48s var(--ease)}
.pa.on{opacity:1;pointer-events:auto;clip-path:inset(0 0 0 0)}

.pa-in{width:100%;max-width:480rem;padding:0 var(--pad);overflow-wrap:anywhere}
.pa .mzlogo{width:110rem;margin-bottom:90rem;color:var(--deep)}
.pa h2{font-size:34rem;margin-bottom:14rem}
.pa .pa-note{font-size:16rem;color:var(--muted);margin-bottom:60rem}

.pa-step{display:none}
.pa-step.on{display:block}

.pa label{display:block;font-size:16rem;color:var(--muted);margin-bottom:16rem}
.pa input{width:100%;font:inherit;font-size:19rem;letter-spacing:-.02em;
  color:var(--text);background:none;border:0;border-bottom:2px solid var(--border);
  padding:0 0 14rem;outline:0;transition:border-color .3s var(--ease)}

.pa-go{margin-top:44rem;background:none;border:0;padding:0;cursor:pointer;
  font-size:16rem;color:var(--text);display:inline-flex;align-items:center;gap:10rem;
  transition:opacity .3s var(--ease)}
.pa-go:hover{opacity:.5}
.pa-go[disabled]{opacity:.3;cursor:default}

.pa-err{margin-top:24rem;font-size:16rem;color:var(--muted);min-height:19rem}

/* approval queue — one row per request, rules only, no cards */
.pa-qh{font-size:16rem;color:var(--muted);margin:70rem 0 26rem}
.pa-req{border-top:2px solid var(--border);padding:26rem 0}
.pa-req:last-of-type{border-bottom:2px solid var(--border)}
.pa-req .e{font-size:19rem}
.pa-req .m{font-size:16rem;color:var(--muted);margin-top:8rem}
.pa-req .act{display:flex;gap:30rem;margin-top:22rem}
.pa-req .act button{background:none;border:0;padding:0;cursor:pointer;font-size:16rem;
  transition:opacity .3s var(--ease)}
.pa-req .act button:hover{opacity:.5}
.pa-req .act .ok{color:var(--deep)}

.pa-x{position:fixed;top:var(--pad);right:var(--pad);background:none;border:0;
  padding:0;cursor:pointer;font-size:16rem;color:var(--muted);
  transition:color .3s var(--ease)}
.pa-x:hover{color:var(--text)}

@media(max-width:767.98px){
  .pa .mzlogo{width:90rem;margin-bottom:60rem}
  .pa h2{font-size:28rem}
}

@media(prefers-reduced-motion:reduce){
  .pa{transition:opacity .01s linear;clip-path:none}
}
