/* Cache-bust token on the BAKED faces (?v=135). The bake target is written into the font FILE (the em is rescaled), so a re-bake changes the bytes at a URL the browser has already parsed and cached as a FontFace. Without a new URL, returning visitors keep the old metrics indefinitely and the page silently mixes two calibrations. Bump this whenever scripts/rebake-tibetan.mjs runs; the number tracks the trunk/x target (1.35). Raw faces are untouched by the bake and stay unversioned. */ /* ============================================================ Rabsal Dawa — Tibetan font wiring (APP-LOCAL) ------------------------------------------------------------ The font-neutral Tibetan MECHANISM (overflow/field helpers, the fit runtime, the two mark techniques, the editable field) now lives in the `bofit` library. This file is the app's side of the contract: it declares the fonts THIS project uses and maps the app's design tokens onto bofit's `--sf-*` configuration. Swap the fonts/mapping here and the whole Tibetan surface re-skins — nothing font-specific is baked into the library. FONT-DISPLAY IS `block` THROUGHOUT. The baked faces always were — a swap mid-load doubles/overlaps the glyph (see the note further down). The raw faces and the Latin sheets have been brought into line: `swap` shows the text in a system fallback first and re-renders it when the real face lands, which on a site about Tibetan letterforms is the most conspicuous thing that could happen, and it feeds bofit wrong metrics while it lasts — the fit runtime measures real ink. This is only safe because the wait is short. The body faces are preloaded from the document head, and these sheets are linked directly rather than reached through two levels of @import (src/app/RootHtml.js). Undo either and `block` turns into seconds of invisible text. Chögyal (Tibetan Chögyal, PKTC / Tony Duff) is the primary Tibetan face — dbu-can (headed), calligraphic, FINE: set it LARGE with airy leading, NEVER bold. Jomolhari (Chris Fynn, libre) is the fallback; Noto Serif Tibetan the last resort. Tibetan Chögyal is licensed for this project (PKTC / Tony Duff). ============================================================ */ @font-face { font-family: 'Chogyal'; src: url('../assets/fonts/tibetan-chogyal.woff2?v=wmry0v5cw') format('woff2'); font-weight: 400; font-style: normal; font-display: block; } @font-face { font-family: 'Jomolhari'; src: url('../assets/fonts/jomolhari.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: block; } /* Yuchi Wujin Gangbi (Kalsang Tsebten Lechu, via OpenPecha/tibetan-fonts) — the WORKING-TEXT Tibetan face, paired with Mulish. Measured: trunk 0.5772em with its foot at yMin +0.0159em — near Latin convention but not on it, and its trunk runs 15% over the Latin x. Near is not exact, so it gets baked like everything else; see the baked pair below. This RAW face is kept for the standalone path, where bofit.fitBox measures real ink and no baking applies. */ @font-face { font-family: 'Yuchi'; src: url('../assets/fonts/tibetan-yuchi-gangbi.woff2') format('woff2'), url('../assets/fonts/tibetan-yuchi-gangbi.ttf') format('truetype'); font-weight: 400; font-style: normal; font-display: block; } /* Noto Serif Tibetan Light (Noto Project, SIL OFL 1.1) — the STANDALONE UI face, for controls that never mix scripts on one line (buttons, chips, tabs, eyebrows). Deliberately a quieter, more neutral voice than the working text, so UI chrome reads as chrome and never competes with the teaching. Measured: trunk 0.5850em with the foot at yMin +0.0930em — a slight float above the baseline. Irrelevant here and only here: this face is never used inline, and bofit.fitBox seats it from its real measured ink, so the font's baseline convention never enters the calculation. Widest coverage of any face in this project (211 Tibetan codepoints), and the only one under a license that plainly permits redistribution. Declared at weight 400 because this IS the family's only shipped cut — the Light cut is its normal weight here, and `.sf-bo-solo` asks for 400. Do not let anything synthesize a bolder one. */ @font-face { font-family: 'Noto Serif Tibetan Light'; src: url('../assets/fonts/tibetan-noto-serif-light.woff2') format('woff2'), url('../assets/fonts/tibetan-noto-serif-light.ttf') format('truetype'); font-weight: 400; font-style: normal; font-display: block; } /* ------------------------------------------------------------------ The RAW faces for the new pairings. Each is used two ways: baked into a per-Latin face below (running text), and as-is by bofit.fitBox for standalone labels, where real ink is measured and no baking applies. ------------------------------------------------------------------ */ @font-face { font-family:'Qomolangma Title'; src:url('../assets/fonts/tibetan-qomolangma-title.woff2?v=wmry0v5cw') format('woff2'); font-weight:400; font-style:normal; font-display: block; } @font-face { font-family:'Monlam Lakdi'; src:url('../assets/fonts/tibetan-monlam-lakdi.woff2?v=wmry0v5cw') format('woff2'); font-weight:400; font-style:normal; font-display: block; } @font-face { font-family:'Bhozuk Gesarma'; src:url('../assets/fonts/tibetan-bhozuk-gesarma.woff2?v=wmry0v5cw') format('woff2'); font-weight:400; font-style:normal; font-display: block; } @font-face { font-family:'Bhozuk Danak'; src:url('../assets/fonts/tibetan-bhozuk-danak.woff2?v=wmry0v5cw') format('woff2'); font-weight:400; font-style:normal; font-display: block; } /* LATIN-NORMALIZED per-partner faces — Strategy 1 (mixed inline, zero markup, works inside a native ). `unicode-range` routes ONLY Tibetan codepoints here; Latin stays on Mulish/Castoro. font-display:block (NOT swap) — a swap mid-load doubles/overlaps the glyph. THE RULE: bake unless the face is EXACTLY Latin-convention. A face drawn to Latin convention — trunk foot on its own baseline, trunk already the height of the Latin body — needs nothing at all. Every other face gets baked, even one that is only slightly off. Descriptors (`size-adjust` + overrides) can correct size but can never move glyphs relative to the baseline, so they only ever half-solve it; running two mechanisms side by side buys nothing but the chance to pick the wrong one. Both faces here are baked: Chögyal ink hangs ENTIRELY BELOW its own baseline (trunk yMin -0.329 -> yMax 0.000, a head-line convention). Nothing but an outline translation can fix it. Against Castoro: em 1024 -> 661 (x1.5488), outlines translated +0.460em. Yuchi close to convention but not on it — foot at yMin +0.0159 and a trunk 15% over the Latin x. "A bit off" still gets baked. Against Mulish: em 1890 -> 1963 (x0.9626), outlines translated -0.0703em. Both carry USE_TYPO_METRICS with compact typo metrics driving line spacing and generous win metrics covering the true ink, so legacy engines cannot clip the tall stacks. THE BAKE TARGET: trunk/x = 1.35 (fraction 0.7407), chosen on the bench. It is the trunk height as a MULTIPLE of the Latin x-height, so it sets the size AND the seat at once. The full calibration for each pair is recorded beside the font as a .json — THAT FILE IS THE SOURCE OF TRUTH. Re-bake with `scripts/rebake-tibetan.mjs` (never hand-edit the numbers) and bump the ?v= cache token above when you do. (History: the first faces baked at fraction ~0.81, then 0.90; the current target is 1.35 (fraction 0.7407), re-judged on the bench. Do not trust any inline scale table over the .json recipes — that is exactly what drifted.) */ /* THE PAIRINGS. One Tibetan face per Latin face. The exact scale/shift live in each font's .json recipe (regenerated by rebake-tibetan.mjs); the summary below is the WHICH, not the numbers, so it cannot drift: Playfair Display -> Qomolangma Title the ONE hero Castoro (titles) -> Qomolangma Title wordmark + page hero Castoro (display) -> Monlam Lakdi display chrome Mulish -> Bhozuk Gesarma working text (x-height, 1.35) Mulish (ALL-CAPS) -> Bhozuk Gesarma cap-height variant -> --font-sans-caps DM Mono -> Bhozuk Gesarma numeric metadata (baked to the DIGIT height) -> Bhozuk Danak raw, fitBox-sized -- the gold-hairline eyebrows (the texts) -> Chögyal reader + search Full application map: guidelines/tibetan-font-application.md. CHÖGYAL KEEPS THE TEXTS. Everything above is chrome; the teaching itself — reader root text, commentary, the search box that queries it — stays in the scholarly face it has always been set in. That is why `--font-pecha` exists as its own token instead of the reader borrowing `--font-display`: the chrome can be re-skinned without touching a syllable of scripture. */ @font-face { font-family: 'Qomolangma Fit Hero'; src: url('../assets/fonts/tibetan-qomolangma-playfair.woff2?v=wmry0v5cw') format('woff2'); unicode-range: U+0F00-0FFF; font-weight: 400; font-style: normal; font-display: block; } /* THE TITLES — the wordmark and the page hero. Qomolangma is a titling face by name and by design, so it takes the two biggest pieces of chrome rather than the general Castoro register, which stays Monlam Lakdi. Baked against Castoro (not Playfair) because that is what these two elements are set in. */ @font-face { font-family: 'Qomolangma Fit Title'; src: url('../assets/fonts/tibetan-qomolangma-castoro.woff2?v=wmry0v5cw') format('woff2'); unicode-range: U+0F00-0FFF; font-weight: 400; font-style: normal; font-display: block; } @font-face { font-family: 'Monlam Fit Display'; src: url('../assets/fonts/tibetan-monlam-castoro.woff2?v=wmry0v5cw') format('woff2'); unicode-range: U+0F00-0FFF; font-weight: 400; font-style: normal; font-display: block; } /* Bhozuk Gesarma in the serif-DISPLAY register: same source as the sans face below, but baked to CASTORO's x (target 1.35) instead of Mulish's — so it sits at the display size, the parallel of Monlam Fit Display. The landing subtitle takes this (a deliberate exception to "serif display -> Monlam Lakdi"): the invitation line reads softer in Gesarma. See tibetan-font-application.md §3/§5. */ @font-face { font-family: 'Gesarma Fit Display'; src: url('../assets/fonts/tibetan-gesarma-castoro.woff2?v=wmry0v5cw') format('woff2'); unicode-range: U+0F00-0FFF; font-weight: 400; font-style: normal; font-display: block; } @font-face { font-family: 'Gesarma Fit Sans'; src: url('../assets/fonts/tibetan-gesarma-mulish.woff2?v=wmry0v5cw') format('woff2'); unicode-range: U+0F00-0FFF; font-weight: 400; font-style: normal; font-display: block; } /* Gesarma baked against Mulish's CAP height — the ALL-CAPS running-text slot. The face above normalizes to Mulish's x ink, which is right inline with lowercase and wrong inside a tracked ALL-CAPS box: there is no lowercase to harmonise with, so a caseless script at x-height reads undersized (Law 3). Same source, same dial the runtime uses for cap-matched SoloLabels (TRUNK_TO_CAP = 1.50), so a mixed-script line and a pure-Tibetan label in the SAME chrome now sit at the same trunk — which they did not before. Reach it through --font-sans-caps; do NOT put it in --font-sans. */ @font-face { font-family: 'Gesarma Fit Sans Caps'; src: url('../assets/fonts/tibetan-gesarma-mulish-caps.woff2?v=wmry0v5cw') format('woff2'); unicode-range: U+0F00-0FFF; font-weight: 400; font-style: normal; font-display: block; } /* Gesarma baked against DM MONO's DIGIT height — the mono slot's Tibetan. Replaces Danak there: Danak's trunk is small enough that reaching the digit height took a 1.74x upscale, which rendered thin and grey at the 10px chip size; Gesarma needs 1.46x. Both lose their hinting to the bake, so the less upscaling the better. */ @font-face { font-family: 'Gesarma Fit Mono'; src: url('../assets/fonts/tibetan-gesarma-dmmono.woff2?v=wmrzfullm1') format('woff2'); unicode-range: U+0F00-0FFF; font-weight: 400; font-style: normal; font-display: block; } /* The texts. Unchanged. */ @font-face { font-family: 'Chogyal Fit Pecha'; src: url('../assets/fonts/tibetan-chogyal-castoro.woff2?v=wmry0v5cw') format('woff2'); unicode-range: U+0F00-0FFF; font-weight: 400; font-style: normal; font-display: block; } /* Map the app's design tokens → bofit's font-neutral --sf-* config, so the library's .sf-* fields/placeholders render in the Rabsal Dawa look. See typography.css for which stack carries which. */ /* STRATEGY 2 — standalone UI labels. A control that never mixes scripts on one line (button, chip, tab, nav item) does NOT want the baked mixed face: that one is sized to the Latin x-height for inline harmony, which reads undersized on a label with no lowercase Latin beside it. Route those to the raw standalone face and let bofit size them against the Latin CAP height and seat the ink (see SoloLabel.js). Scoped to `.sf-fitted`, which bofit adds only to runs that ACTUALLY contain the script — an untranslated key falls back to English, and that must keep rendering in the Latin face at the Latin size, not in a script face blown up to a script's trunk. The face goes on `.sf-run`, NOT on the wrapper. bofit scales only the run, so a face on the wrapper draws no glyph at all (every character lives inside the run) while still contributing a strut at its own metrics AT THE LATIN SIZE — and a script face's deeper descent then inflates the line box and stretches the control, which is precisely what Law 2 forbids. Measured: 5.5px of growth on the header's sign-out button, from a face that rendered nothing. */ .sf-bo-solo.sf-fitted > .sf-run { font-family: var(--font-tibetan); } /* Register variants. Every standalone label is fitted identically; only the face differs, and it follows the LATIN it stands in for: Castoro display -> Monlam Lakdi · titles/wordmark -> Qomolangma Title / Chögyal · Mulish -> Bhozuk Gesarma (default above) · DM Mono -> Bhozuk Danak `SoloLabel face="display" | "title" | "pecha" | "mono"` adds these. (The old Yuchi/Noto standalone faces below are now unused — see the cleanup note in guidelines/tibetan-font-application.md §8.) */ .sf-bo-solo.sf-bo-title.sf-fitted > .sf-run { font-family: var(--font-tibetan-title); } .sf-bo-solo.sf-bo-pecha.sf-fitted > .sf-run { font-family: var(--font-tibetan-pecha); } .sf-bo-solo.sf-bo-display.sf-fitted > .sf-run { font-family: var(--font-tibetan-display); } .sf-bo-solo.sf-bo-mono.sf-fitted > .sf-run { font-family: var(--font-tibetan-mono); } :root { --sf-font-mixed: var(--font-sans); --sf-field-border: var(--archive-border); --sf-focus-ring: var(--gold); --sf-focus-ring-soft: var(--gline-soft); --sf-placeholder-color: var(--n-400, #A49C8B); } /* ================================================================== NO SYNTHETIC BOLD — the structural half of Law 5 (Tibetan is never bold). The baked faces ship a single weight, so a heavier `font-weight` on a mixed element — the hero's accent word, a card heading — makes the browser FAUX-BOLD the Tibetan by smearing its outlines. Unlike the italic twins below, this can't be pinned per face (there is no unicode-ranged weight descriptor), so it is enforced as an inherited property, document-wide. Every Latin face here ships real weights, so only the *synthetic* weight is withheld — exactly the Tibetan case — and real Latin bold is untouched. Like the italic rule, it then cannot be broken by a call site forgetting. ================================================================== */ :root { font-synthesis-weight: none; } /* ================================================================== NO SYNTHETIC ITALIC — a system-wide rule, enforced structurally. Tibetan has no italic tradition. There is no slanted dbu-can, and a reader does not see a skewed one as emphasis — only as damaged. A browser does not know that: ask for `font-style: italic` with only an upright face available and it SYNTHESIZES an oblique by shearing the outlines. Measured on the hero title, that stretched བང་མཛོད། from 318px to 330px of ink — a slant nobody chose and nobody wanted. The rule cannot be "never write italic". The Latin legitimately uses it — the hero's accent word, the italic subtitles — and that CSS lands on the whole element, Tibetan included. It has to hold no matter what any call site asks for. So every Tibetan face is declared a SECOND time at font-style:italic, pointing at the same upright file. The browser then finds a real match for italic, uses it unmodified, and never reaches for synthesis. Italic Tibetan renders upright everywhere, permanently, with no discipline required. `unicode-range` is carried through on the baked faces exactly as above — without it these twins would answer for Latin too and hijack the italic the Latin is entitled to. Same intent as Law 5 (never bold Chögyal); the difference is that this one cannot be broken by forgetting. ================================================================== */ @font-face { font-family:'Chogyal'; src:url('../assets/fonts/tibetan-chogyal.woff2?v=wmry0v5cw') format('woff2'); font-weight:400; font-style:italic; font-display:block; } @font-face { font-family:'Jomolhari'; src:url('../assets/fonts/jomolhari.woff2') format('woff2'); font-weight:400; font-style:italic; font-display:block; } @font-face { font-family:'Yuchi'; src:url('../assets/fonts/tibetan-yuchi-gangbi.woff2') format('woff2'),url('../assets/fonts/tibetan-yuchi-gangbi.ttf') format('truetype'); font-weight:400; font-style:italic; font-display:block; } @font-face { font-family:'Noto Serif Tibetan Light'; src:url('../assets/fonts/tibetan-noto-serif-light.woff2') format('woff2'),url('../assets/fonts/tibetan-noto-serif-light.ttf') format('truetype'); font-weight:400; font-style:italic; font-display:block; } @font-face { font-family:'Qomolangma Title'; src:url('../assets/fonts/tibetan-qomolangma-title.woff2?v=wmry0v5cw') format('woff2'); font-weight:400; font-style:italic; font-display:block; } @font-face { font-family:'Monlam Lakdi'; src:url('../assets/fonts/tibetan-monlam-lakdi.woff2?v=wmry0v5cw') format('woff2'); font-weight:400; font-style:italic; font-display:block; } @font-face { font-family:'Bhozuk Gesarma'; src:url('../assets/fonts/tibetan-bhozuk-gesarma.woff2?v=wmry0v5cw') format('woff2'); font-weight:400; font-style:italic; font-display:block; } @font-face { font-family:'Bhozuk Danak'; src:url('../assets/fonts/tibetan-bhozuk-danak.woff2?v=wmry0v5cw') format('woff2'); font-weight:400; font-style:italic; font-display:block; } @font-face { font-family:'Qomolangma Fit Hero'; src:url('../assets/fonts/tibetan-qomolangma-playfair.woff2?v=wmry0v5cw') format('woff2'); unicode-range: U+0F00-0FFF; font-weight:400; font-style:italic; font-display:block; } @font-face { font-family:'Qomolangma Fit Title'; src:url('../assets/fonts/tibetan-qomolangma-castoro.woff2?v=wmry0v5cw') format('woff2'); unicode-range: U+0F00-0FFF; font-weight:400; font-style:italic; font-display:block; } @font-face { font-family:'Monlam Fit Display'; src:url('../assets/fonts/tibetan-monlam-castoro.woff2?v=wmry0v5cw') format('woff2'); unicode-range: U+0F00-0FFF; font-weight:400; font-style:italic; font-display:block; } @font-face { font-family:'Gesarma Fit Display'; src:url('../assets/fonts/tibetan-gesarma-castoro.woff2?v=wmry0v5cw') format('woff2'); unicode-range: U+0F00-0FFF; font-weight:400; font-style:italic; font-display:block; } @font-face { font-family:'Gesarma Fit Sans'; src:url('../assets/fonts/tibetan-gesarma-mulish.woff2?v=wmry0v5cw') format('woff2'); unicode-range: U+0F00-0FFF; font-weight:400; font-style:italic; font-display:block; } @font-face { font-family:'Gesarma Fit Sans Caps'; src:url('../assets/fonts/tibetan-gesarma-mulish-caps.woff2?v=wmry0v5cw') format('woff2'); unicode-range: U+0F00-0FFF; font-weight:400; font-style:italic; font-display:block; } @font-face { font-family:'Gesarma Fit Mono'; src:url('../assets/fonts/tibetan-gesarma-dmmono.woff2?v=wmrzfullm1') format('woff2'); unicode-range: U+0F00-0FFF; font-weight:400; font-style:italic; font-display:block; } @font-face { font-family:'Chogyal Fit Pecha'; src:url('../assets/fonts/tibetan-chogyal-castoro.woff2?v=wmry0v5cw') format('woff2'); unicode-range: U+0F00-0FFF; font-weight:400; font-style:italic; font-display:block; }