/* NUBAYIN base, version 1.0: the behaviours that travel with the tokens. Load it after tokens.css. Generated by scripts/build.py. Edit guide/*.md or scripts/kit/, then rebuild. */
html { font-synthesis: none; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
body { margin: 0; font: 400 17px/1.6 var(--font-text); }
body, [data-theme] { background: var(--canvas); color: var(--text); }

/* The lāzaward rule: it marks what has been made clear. Links, focus, selection and the point; never a fill, a glow or a gradient. */
:focus-visible { outline: 2px solid var(--focus); outline-offset: 3px; }
::selection { background: var(--lazaward-600); color: var(--kohl-50); }

/* Arabic: scale once at the language boundary, never track it, never transform its case. */
[lang="ar"] { letter-spacing: 0 !important; text-transform: none; }
[lang="ar"]:not([lang="ar"] [lang="ar"]) { font-size: 1.12em; }

/* Pull, then point (K1): resolve once from blur(14px) at 0.6 opacity; the point lands as a hard cut when the pull ends.
   Arm it with NUBAYIN.pull() from nubayin.js. Under reduced motion the final frame is simply there. */
@keyframes nb-pull { from { filter: blur(14px); opacity: .6; } to { filter: blur(0); opacity: 1; } }
.nb-reveal { animation: nb-pull var(--dur-reveal) var(--ease-reveal) both; }
.nb-reveal.slow { animation-duration: 700ms; }
.nb-reveal .nb-point { visibility: hidden; }
.nb-reveal.is-clear .nb-point { visibility: visible; }
@media (prefers-reduced-motion: reduce) {
  .nb-reveal { animation: none; }
  .nb-reveal .nb-point { visibility: visible; }
}