/* ── AUTH GATE + FAIL-CLOSED FIRST PAINT (MSAL Entra) ──
   index.html ships <body data-auth-state="checking"> in STATIC HTML, and every
   protected region stays display:none in ANY state except signed-in — so the
   tool can never flash before auth completes, even if JavaScript fails
   entirely. scripts/auth.js advances the state machine:
   checking | signed-out | signed-in | error.

   NOTE: extend the selector list with any OTHER top-level protected region. */
body:not([data-auth-state="signed-in"]) header.top,
body:not([data-auth-state="signed-in"]) #view-match,
body:not([data-auth-state="signed-in"]) #view-dir,
body:not([data-auth-state="signed-in"]) footer.foot{display:none!important;}

body[data-auth-state="signed-in"] .auth-gate{display:none;}
.auth-gate{position:fixed;inset:0;z-index:1000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;background:var(--hfg-blue-dark);text-align:center;padding:24px;}
.auth-title{font-family:var(--font-sans);font-size:26px;font-weight:800;color:#fff;letter-spacing:-.01em;}
.auth-msg{font-size:13px;color:rgba(255,255,255,.45);max-width:380px;line-height:1.55;}
.auth-btn{margin-top:8px;padding:10px 22px;border-radius:8px;background:var(--hfg-teal);border:none;color:#fff;font-family:var(--font-sans);font-size:14px;font-weight:500;cursor:pointer;}
.auth-btn:hover{background:var(--hfg-teal-dark);}
.auth-btn[hidden]{display:none;}
