1@import "tailwindcss";
2@import "uniwind";
3@import "./generated-uniwind-themes.css";
4
5/* ─── Theme tokens ──────────────────────────────────────────────────── */
6@layer theme {
7 :root {
8 /* Native text takes one family name, not Tailwind's font stack. */
9 @variant ios {
10 --font-mono: "ui-monospace";
11 }
12 @variant android {
13 --font-mono: "monospace";
14 }
15 }
16}
17
18/* ─── Typography ────────────────────────────────────────────────────── */
19@theme {
20 /* Keep these native family names aligned with app.config.ts. */
21 --font-sans: "DMSans-Regular";
22 --font-medium: "DMSans-Medium";
23 --font-bold: "DMSans-Bold";
24
25 /* Keep this scale aligned with src/lib/typography.ts for native style props. */
26 --text-3xs: 11px;
27 --text-3xs--line-height: 14px;
28 --text-2xs: 12px;
29 --text-2xs--line-height: 16px;
30 --text-xs: 13px;
31 --text-xs--line-height: 17px;
32 --text-sm: 14px;
33 --text-sm--line-height: 19px;
34 --text-base: 16px;
35 --text-base--line-height: 23px;
36 --text-lg: 18px;
37 --text-lg--line-height: 23px;
38 --text-xl: 21px;
39 --text-xl--line-height: 28px;
40 --text-2xl: 26px;
41 --text-2xl--line-height: 32px;
42 --text-3xl: 30px;
43 --text-3xl--line-height: 36px;
44}
45
46/* ─── Custom utilities ──────────────────────────────────────────────── */
47@utility font-t3-medium {
48 font-family: var(--font-medium);
49}
50
51@utility font-t3-bold {
52 font-family: var(--font-bold);
53}
54
55@utility font-t3-extrabold {
56 font-family: var(--font-bold);
57 font-weight: 800;
58}