/* Access gate — sits inside .mfbb / .mfgs and inherits their tokens:
   --panel --panel2 --gold --gold2 --bone --mut --line.
   Every rule is scoped to .mf-gate-root so it outranks the tool pages'
   own "* {margin:0;padding:0}" reset. */

.mf-gate-root .mf-gate-strip{
  display:flex;flex-wrap:wrap;align-items:center;gap:8px 22px;
  margin:0 0 20px;padding:11px 14px;
  border:1px solid var(--line);border-left:3px solid var(--gold);
  background:rgba(0,0,0,.28);font-size:14px;color:var(--bone)
}
.mf-gate-root .mf-gate-strip b{font-family:'IBM Plex Mono',monospace;font-weight:500;color:var(--gold)}
.mf-gate-root .mf-gate-strip a{color:var(--bone);text-decoration:underline;text-underline-offset:3px}
.mf-gate-root .mf-gate-strip a:hover{color:var(--gold)}
.mf-gate-root .mf-gate-strip.ok{border-left-color:#7FB77E}
.mf-gate-root .mf-gate-strip.ok b{color:#A7D6A5}
.mf-gate-root .mf-gate-strip.soon{border-left-color:var(--gold);background:rgba(217,164,65,.08)}
.mf-gate-root .mf-gate-strip.gated{border-left-color:#C4574D}
.mf-gate-root .mf-gate-meter{display:inline-flex;gap:3px;margin-left:6px;vertical-align:middle}
.mf-gate-root .mf-gate-meter i{display:block;width:7px;height:10px;background:var(--gold)}
.mf-gate-root .mf-gate-meter i.off{background:rgba(233,226,210,.18)}

.mf-gate-root /* The panel replaces the tool once the free sessions are gone,.mf-gate-root and can also be opened from the strip while sessions remain. */
.mf-gate{display:none;margin:0 0 26px}
body.mf-gated .mf-gate-root .mf-gate,.mf-gate-root .mf-gate.open{
  display:grid;grid-template-columns:1.3fr 1fr;gap:28px;
  background:linear-gradient(160deg,var(--panel2),var(--panel));
  border:1px solid #7A2530;border-radius:4px;padding:28px 26px 26px
}
body.mf-gated .mfbb .grid,body.mf-gated .mfgs .grid{display:none}

.mf-gate-root .mf-gate h2{font-family:'Big Shoulders Display',sans-serif;font-weight:800;font-size:clamp(26px,4vw,34px);line-height:1;margin:0 0 10px;color:var(--bone)}
.mf-gate-root .mf-gate h3{font-family:'Big Shoulders Display',sans-serif;font-weight:700;font-size:20px;letter-spacing:.02em;margin:0 0 10px;color:var(--bone)}
.mf-gate-root .mf-gate h3 + form{margin-bottom:18px}
.mf-gate-root .mf-gate p{margin:0 0 14px;font-size:15px;max-width:52ch;color:rgba(233,226,210,.92)}
.mf-gate-root .mf-gate-side{border-left:1px solid rgba(233,226,210,.18);padding-left:28px;min-width:0}
.mf-gate-root .mf-gate-main{min-width:0}

.mf-gate-root .mf-gate-form label{display:block;font-size:12.5px;color:rgba(233,226,210,.82);margin-bottom:10px}
.mf-gate-root .mf-gate-form label small{display:block;font-size:11.5px;color:rgba(233,226,210,.6);margin-top:1px}
.mf-gate-root .mf-gate-form input{
  display:block;width:100%;margin-top:4px;
  background:rgba(0,0,0,.28);border:1px solid rgba(0,0,0,.45);border-radius:3px;
  padding:9px 11px;font:15px 'Archivo',system-ui,sans-serif;color:var(--bone)
}
.mf-gate-root .mf-gate-form input[name=code]{font-family:'IBM Plex Mono',monospace;letter-spacing:.08em;text-transform:uppercase}
.mf-gate-root .mf-gate-pw{position:relative;display:block}
.mf-gate-root .mf-gate-pw input{padding-right:64px}
.mf-gate-root .mf-gate-eye{position:absolute;right:6px;top:50%;transform:translateY(-50%);margin-top:2px;background:transparent;border:1px solid rgba(233,226,210,.25);border-radius:3px;color:var(--bone);font:12px 'Archivo',sans-serif;padding:4px 8px;cursor:pointer}
.mf-gate-root .mf-gate-eye:hover{border-color:var(--gold);color:var(--gold)}
.mf-gate-root .mf-gate-form input:focus-visible{outline:2px solid var(--gold);outline-offset:1px}
.mf-gate-root .mf-gate-form input:disabled{opacity:.5}
.mf-gate-root .mf-gate-row2{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}
.mf-gate-root .mf-gate-hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}

.mf-gate-root .mf-gate-btn{
  font-family:'Archivo';font-weight:600;font-size:14.5px;border-radius:3px;
  padding:12px 22px;cursor:pointer;display:inline-block;
  background:var(--gold);border:1px solid var(--gold);color:#2A1B06
}
.mf-gate-root .mf-gate-btn:hover{background:var(--gold2)}
.mf-gate-root .mf-gate-btn:disabled{opacity:.6;cursor:default}
.mf-gate-root .mf-gate-btn.line{background:transparent;border-color:#8A3340;color:var(--bone)}
.mf-gate-root .mf-gate-btn.line:hover{border-color:var(--gold);color:var(--gold)}
.mf-gate-root .mf-gate-btn:focus-visible{outline:2px solid var(--gold2);outline-offset:2px}

.mf-gate-root .mf-gate-msg{min-height:1.2em;font-size:13.5px;margin:10px 0 0!important}
.mf-gate-root .mf-gate-msg.good{color:#A7D6A5}
.mf-gate-root .mf-gate-msg.bad{color:#F2B8B1}
.mf-gate-root .mf-gate-hint{font-size:12.5px!important;color:rgba(233,226,210,.62)!important;margin:0 0 20px!important}

.mf-gate-root .mf-gate-print{display:none}

@media (max-width:760px){
  body.mf-gated .mf-gate-root .mf-gate,.mf-gate-root .mf-gate.open{grid-template-columns:1fr;padding:22px 16px 20px;gap:20px}
  .mf-gate-root .mf-gate-side{border-left:0;padding-left:0;border-top:1px solid rgba(233,226,210,.18);padding-top:20px}
  .mf-gate-root .mf-gate-row2{grid-template-columns:1fr}
  .mf-gate-root .mf-gate-strip{gap:6px 16px}
  .mf-gate-root .mf-gate-form input{font-size:16px}
}

/* Print: the strip and panel never print; when gated, the drawing/verification
   sheet is withheld and a one-line notice prints instead. */
@media print{
  .mf-gate-root .mf-gate-strip,.mf-gate-root .mf-gate{display:none!important}
  body.mf-gated #mfbb-sheet,body.mf-gated #mfgs-sheet{display:none!important}
  body.mf-gated .mf-gate-root .mf-gate-print{display:block!important;font:14pt 'Archivo',Arial,sans-serif;color:#000;padding:40mm 0 0;text-align:center}
}