/* ==========================================================================
   BASE — reset, document defaults, focus, scroll lock, Urdu typography.
   ========================================================================== */
*{box-sizing:border-box;margin:0;padding:0}
[hidden]{display:none !important}

html{background:var(--mist);-webkit-text-size-adjust:100%}
body{
  min-height:100vh;min-height:100svh;
  font-family:var(--body);color:var(--ink);background:var(--mist);
  font-size:15px;line-height:1.6;font-weight:400;
}

img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
button{border:0;background:none;cursor:pointer}

:focus-visible{outline:2.5px solid var(--blue);outline-offset:3px;border-radius:6px}

/* Overlays pin the body. position:fixed rather than overflow:hidden because
   iOS Safari ignores the latter — see ui/overlay.js which stores the offset. */
body.lock{position:fixed;inset-inline:0;width:100%;overflow:hidden}

/* --------------------------------------------------------------------------
   URDU
   Nastaliq needs far more line-height than a latin face, so the whole scale
   is nudged rather than set per component.
   -------------------------------------------------------------------------- */
body.ur{font-family:var(--urdu);line-height:2.1}
body.ur h1,body.ur h2,body.ur h3,body.ur button,body.ur input,body.ur select{font-family:var(--urdu)}
body.ur input[type="text"],
body.ur input[type="password"],
body.ur input[type="number"]{font-family:var(--body)}   /* IDs, numbers stay latin */

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
}