/*
 * FANOOS type system.
 *
 * One family, everywhere -- body, interface and headings alike: Vazirmatn.
 * It is the most legible Persian screen face at reading sizes, and it
 * carries a matched Latin, which matters here: exam questions are full of
 * Latin terminology and a Persian face without one leaves the browser to
 * substitute a mismatched Latin mid-sentence. The owner looked at the
 * earlier two-family split (a separate display face for headings) and
 * decided against it; headings now render in the same face, at the same
 * weights the hierarchy already uses.
 *
 * Self-hosted. Google Fonts is not reachably usable from Iran, so a CDN
 * reference would silently fall back to a system font for exactly the
 * people this product serves. Vazirmatn ships under the SIL Open Font
 * License (see OFL.txt beside the files).
 *
 * `font-display: swap`: text must be readable while the face loads, never
 * invisible. On a slow connection a student reads the question in a
 * fallback rather than staring at blank space.
 */

@font-face {
    font-family: "Vazirmatn";
    src: url("/assets/fonts/vazirmatn/Vazirmatn-Regular.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Vazirmatn";
    src: url("/assets/fonts/vazirmatn/Vazirmatn-SemiBold.woff2") format("woff2");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Vazirmatn";
    src: url("/assets/fonts/vazirmatn/Vazirmatn-Bold.woff2") format("woff2");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/*
 * Persian text needs more line height than Latin at the same size: the
 * ascenders, descenders and dots of the script collide at Latin leading.
 * These are the reading defaults; question and choice text raises them
 * further in the exam stylesheet.
 */
:root {
    --font-body: "Vazirmatn", "Segoe UI", Tahoma, system-ui, sans-serif;

    /* Reading text -- questions, choices, explanations. */
    --reading-size: 1.05rem;
    --reading-leading: 2;

    /*
     * One scale, ~1.15 between steps.
     *
     * The exam stylesheet had nine unrelated font sizes -- 0.75, 0.78, 0.8,
     * 0.82, 0.85, 0.88, 0.9, 1 and 1.05rem -- none of which referred to each
     * other. That is not a scale, it is nine decisions taken separately, and
     * it is why the interface read as flat: sizes one hundredth of a rem
     * apart cannot express a hierarchy, they only blur one.
     *
     * A literal rem in a page stylesheet is now a bug, the same way a
     * literal colour is.
     */
    --text-2xs: 0.72rem;
    --text-xs: 0.8rem;
    --text-sm: 0.875rem;
    --text-base: 0.95rem;
    --text-lg: 1.05rem;
    --text-xl: 1.2rem;
    --text-2xl: 1.45rem;
    --text-3xl: 1.75rem;

    /*
     * Weight roles. Three faces ship, and before this two of them did almost
     * nothing: the interface was 400 with occasional 700, and 600 was
     * essentially unused. Hierarchy carried by weight survives at a glance
     * and at any size, which is what size alone was failing to do.
     */
    --weight-body: 400;
    --weight-medium: 600;
    --weight-strong: 700;
}

/*
 * Only a clock that ticks every second keeps its digits one width, so the
 * bar does not twitch. Everywhere else Vazirmatn's own proportional Persian
 * digits are used: one-width Persian digits leave gaps inside a number
 * ("۵ ۰ ۰"), which the owner asked to remove (2026-10-10).
 */
.f-tnum,
.x-bar__timer {
    font-variant-numeric: tabular-nums;
}

h1, h2, h3, h4 {
    font-family: var(--font-body);
    letter-spacing: -0.01em;
}

/*
 * Persian digits read as numbers to this audience; Latin digits read as
 * foreign. `font-variant-numeric` cannot do this, so anything that should
 * display Persian digits carries this class and the value is converted at
 * the point it is written.
 */
.f-num {
    font-feature-settings: "ss01";
}