/* Codex mobile login adjustment, isolated from the desktop FIELD design. */
/* Clear the cover state after authentication even if the renderer's observer is delayed. */
body.gate-on:has(#gate.off) { background:var(--bg,#f2f6f8)!important; }
body.gate-on:has(#gate.off) #fieldCanvas,
body.gate-on:has(#gate.off) .field-atmosphere { display:none!important; }
body.gate-on:has(#gate.off) .topbar { display:block!important; }
body.gate-on:has(#gate.off) main { margin-top:0!important; padding-top:26px!important; }
@media (max-width:680px) {
  #gate { padding:0; overflow-x:hidden; overflow-y:auto; }
  #gate::before, #gate::after { display:none; }
  #gate .fnav { top:20px; left:max(20px,env(safe-area-inset-left)); font-size:12px; }
  #gate .gate-card {
    width:100%; min-height:100svh; display:flex; flex-direction:column;
    justify-content:flex-start; align-items:center; gap:20px;
    padding:76px max(16px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));
  }
  #gate .gate-hero { position:relative; inset:auto; width:100%; max-width:420px; margin:0; padding:0 4px; }
  #gate .fhero-eyebrow { margin-bottom:10px; font-size:9px; letter-spacing:.16em; overflow-wrap:anywhere; }
  #gate .fhero-display { font-size:clamp(26px,7.3vw,38px); line-height:1.3; }
  #gate .gate-form {
    position:relative; inset:auto; transform:none; animation:none;
    width:100%; max-width:420px; min-width:0; margin:0; padding:22px 22px 18px;
    background:linear-gradient(160deg,rgba(252,250,243,.93),rgba(243,241,231,.88));
  }
  #gate .form-kicker { font-size:9px; letter-spacing:.2em; margin-bottom:8px; }
  #gate .gate-form h2 { font-size:24px; }
  #gate .roles { grid-template-columns:repeat(2,minmax(0,1fr)); margin:14px 0 4px; }
  #gate .role { min-height:48px; padding:10px 4px; }
  #gate .role span:not(.ri) { display:none; }
  #gate .role b { font-size:14px; }
  #gate .gi { margin-top:12px; }
  #gate .gi label { font-size:12px; letter-spacing:.06em; }
  #gate .gi input { font-size:16px; min-height:44px; padding:8px 0; }
  #gate .gi input::placeholder { color:#636f5c; font-size:12px; }
  #gate .btn-login { margin-top:18px; min-height:46px; font-size:14px; }
  #gate .demo-tip { text-align:left; font-size:11px; line-height:1.7; }
  #gate .form-footer { flex-wrap:wrap; gap:6px 12px; margin-top:14px; letter-spacing:.08em; font-size:9px; }
}

/* iPad portrait: keep the title above the card so neither surface overlaps. */
@media (min-width:681px) and (max-width:900px) and (orientation:portrait) {
  #gate { overflow-x:hidden; overflow-y:auto; }
  #gate .gate-card { min-height:100svh; display:flex; flex-direction:column; align-items:center; gap:34px; padding:92px 34px 42px; }
  #gate .gate-hero { position:relative; inset:auto; width:100%; max-width:680px; margin:0; }
  #gate .fhero-display { font-size:clamp(38px,6.5vw,56px); }
  #gate .gate-form { position:relative; inset:auto; transform:none !important; width:min(520px,100%); max-width:520px; margin:0; padding:34px 38px 28px; }
  #gate .roles { grid-template-columns:repeat(2,minmax(0,1fr)); }
  #gate .gi input { min-height:44px; font-size:16px; }
}