/*
 * ASWINOLOGY° design tokens. Generated by scripts/build-tokens.mjs from tokens/tokens.mjs. Do not edit by hand.
 * Brand: set data-brand="aswinology" | "lurnelle" on <html> or any subtree. ASWINOLOGY° is the default.
 * Theme: data-theme="light" | "dark" | "inverse" on <html> or any subtree. Without it the system preference wins.
 * Colours are light-dark() pairs, so nested themes need no extra selectors.
 */
:root {
  color-scheme: light dark;
  --space-0: 0px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
  --space-10: 144px;
  --z-base: 1;
  --z-sticky: 20;
  --z-header: 40;
  --z-overlay: 60;
  --z-dialog: 70;
  --z-toast: 80;
  --z-tooltip: 90;
}
[data-theme="light"] { color-scheme: light; }
[data-theme="dark"] { color-scheme: dark; }
/* inverse: the opposite of the surrounding theme (for one highlighted card or band) */
[data-theme="inverse"] { color-scheme: dark; }
@media (prefers-color-scheme: dark) { [data-theme="inverse"] { color-scheme: light; } }
[data-theme="light"] [data-theme="inverse"] { color-scheme: dark; }
[data-theme="dark"] [data-theme="inverse"] { color-scheme: light; }

:root,
[data-brand="aswinology"],
[data-theme]:not([data-brand="lurnelle"], [data-brand="lurnelle"] *) {
  /* primitives */
  --p-paper: #f8f7f4;
  --p-paper-2: #f1efeb;
  --p-paper-3: #e6e3dd;
  --p-paper-white: #fefdfb;
  --p-ink: #26262b;
  --p-ink-2: #4f4f57;
  --p-ash: #66666d;
  --p-lime: #cdf46e;
  --p-lime-deep: #b8e64f;
  --p-lime-ink: #3d5c00;
  --p-lime-neon: #b9ff38;
  --p-lime-soft: #eef8d2;
  --p-graphite: #0f100e;
  --p-graphite-2: #181a17;
  --p-graphite-3: #252823;
  --p-graphite-4: #1f221e;
  --p-bone: #ecece6;
  --p-bone-2: #c4c5bd;
  --p-ash-dark: #9a9c94;
  --p-tint-blue: #dcebff;
  --p-tint-butter: #fff0c4;
  --p-tint-sage: #d8f3e2;
  --p-tint-coral: #ffdfe4;
  --p-tint-lime: #e4f9aa;
  /* semantic colour */
  --bg: light-dark(var(--p-paper), var(--p-graphite));
  --bg-alt: light-dark(var(--p-paper-2), var(--p-graphite-2));
  --surface: light-dark(var(--p-paper-white), var(--p-graphite-2));
  --surface-raised: light-dark(#ffffff, var(--p-graphite-3));
  --surface-sunken: light-dark(var(--p-paper-2), #0a0b0a);
  --fg: light-dark(var(--p-ink), var(--p-bone));
  --fg-2: light-dark(var(--p-ink-2), var(--p-bone-2));
  --muted: light-dark(var(--p-ash), var(--p-ash-dark));
  --line: light-dark(rgb(38 38 43 / 0.1), rgb(236 236 230 / 0.13));
  --line-strong: light-dark(rgb(38 38 43 / 0.5), rgb(236 236 230 / 0.46));
  --accent: light-dark(var(--p-lime), var(--p-lime-neon));
  --on-accent: light-dark(var(--p-ink), var(--p-graphite));
  --accent-text: light-dark(var(--p-lime-ink), var(--p-lime-neon));
  --accent-soft: light-dark(var(--p-lime-soft), #1d2312);
  --primary: light-dark(var(--p-lime), var(--p-lime-neon));
  --on-primary: light-dark(var(--p-ink), var(--p-graphite));
  --primary-hover: light-dark(var(--p-lime-deep), #cbff6b);
  --secondary: light-dark(var(--p-ink), var(--p-bone));
  --on-secondary: light-dark(var(--p-paper), var(--p-graphite));
  --secondary-hover: light-dark(#3a3a41, #ffffff);
  --focus: light-dark(var(--p-ink), var(--p-bone));
  --focus-halo: light-dark(var(--p-lime), var(--p-lime-neon));
  --success: light-dark(#3b7527, #9be37a);
  --success-soft: light-dark(#e3f1da, #17220f);
  --warning: light-dark(#8a5600, #f2b84b);
  --warning-soft: light-dark(#fbefd6, #2a2110);
  --danger: light-dark(#b8372b, #ff8a6b);
  --on-danger: light-dark(#ffffff, var(--p-graphite));
  --danger-soft: light-dark(#fbe4e1, #2c1612);
  --info: light-dark(#2b59c3, #8fb0ff);
  --info-soft: light-dark(#e3ebfb, #151c2e);
  --overlay: light-dark(rgb(38 38 43 / 0.42), rgb(0 0 0 / 0.7));
  --tint-1: light-dark(var(--p-tint-blue), #1a2028);
  --tint-2: light-dark(var(--p-tint-butter), #23211a);
  --tint-3: light-dark(var(--p-tint-sage), #1b2119);
  --tint-4: light-dark(var(--p-tint-coral), #261d19);
  --tint-accent: light-dark(var(--p-tint-lime), #1d2312);
  --selection-bg: light-dark(var(--p-lime), var(--p-lime-neon));
  --selection-fg: light-dark(var(--p-ink), var(--p-graphite));
  /* type */
  --font-display: var(--f-archivo, "Archivo"), var(--f-anuphan, "Anuphan"), ui-sans-serif, system-ui, sans-serif;
  --font-body: var(--f-archivo, "Archivo"), var(--f-anuphan, "Anuphan"), ui-sans-serif, system-ui, sans-serif;
  --font-thai: var(--f-anuphan, "Anuphan"), var(--f-archivo, "Archivo"), ui-sans-serif, system-ui, sans-serif;
  --font-mono: var(--f-geist-mono, "Geist Mono"), ui-monospace, "SFMono-Regular", Menlo, monospace;
  --weight-display: 700;
  --weight-heading: 650;
  --weight-body: 400;
  --tracking-display: -0.045em;
  --tracking-heading: -0.03em;
  --tracking-meta: 0.06em;
  --stretch-display: 100;
  --text-body: 1.0625rem;
  --text-display: clamp(3rem, 7.4vw, 6.75rem);
  --text-h1: clamp(2.25rem, 4.6vw, 4rem);
  --text-h2: clamp(1.75rem, 3vw, 2.625rem);
  --text-h3: clamp(1.25rem, 1.8vw, 1.625rem);
  --text-lead: clamp(1.125rem, 1.5vw, 1.375rem);
  --text-small: 0.875rem;
  --text-meta: 0.75rem;
  --leading-tight: 0.98;
  --leading-snug: 1.2;
  --leading-body: 1.6;
  /* shape, depth, motion */
  --radius-xs: 6px;
  --radius-sm: 10px;
  --radius-md: 18px;
  --radius-lg: 28px;
  --radius-pill: 999px;
  --shadow-sm: 0 1px 2px light-dark(rgb(38 38 43 / 0.06), rgb(0 0 0 / 0.4));
  --shadow-md: 0 18px 40px -24px light-dark(rgb(38 38 43 / 0.28), rgb(0 0 0 / 0.7));
  --shadow-lg: 0 40px 80px -40px light-dark(rgb(38 38 43 / 0.38), rgb(0 0 0 / 0.8));
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.76, 0, 0.24, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --dur-fast: 180ms;
  --dur-base: 320ms;
  --dur-slow: 700ms;
  /* component */
  --btn-radius: var(--radius-pill);
  --btn-shadow: none;
  --btn-primary-shadow: none;
  --btn-chip-bg: var(--fg);
  --btn-chip-fg: var(--bg);
  --btn-chip-size: 32px;
  --field-radius: var(--radius-sm);
  --field-bg: var(--surface);
  --card-radius: var(--radius-lg);
  --card-bg: var(--surface);
  --card-border: var(--line);
  --card-shadow: none;
  --card-blur: none;
  --card-hover-shadow: var(--shadow-md);
  --panel-radius: var(--radius-md);
  --chip-radius: var(--radius-pill);
  --header-bg: light-dark(rgb(248 247 244 / 0.82), rgb(15 16 14 / 0.82));
  --header-radius: 0px;
  --page-decor: none;
  --btn-outline-hover-bg: var(--fg);
  --btn-outline-hover-fg: var(--bg);
  --btn-outline-hover-border: var(--fg);
  --btn-ghost-hover-bg: var(--bg-alt);
  --btn-ghost-hover-fg: var(--fg);
  --btn-secondary-border: transparent;
  --btn-secondary-blur: none;
  --switch-thumb-off: var(--muted);
  --switch-thumb-shadow: none;
  --chip-on-bg: var(--fg);
  --chip-on-fg: var(--bg);
  --chip-on-border: var(--fg);
  --progress-bar: var(--fg);
  --tablist-bg: transparent;
  --tablist-pad: 0px;
  --tablist-radius: 0px;
  --tablist-border: var(--line);
  --tab-radius: 0px;
  --tab-active-bg: transparent;
  --tab-active-line: var(--fg);
  --tab-active-shadow: none;
  --dialog-shadow: var(--shadow-lg);
  --only-aswinology: contents;
  --only-lurnelle: none;
  --mark-color: var(--accent);
}

[data-brand="lurnelle"] {
  /* primitives */
  --p-mist: #f5f5f7;
  --p-mist-2: #ececf0;
  --p-ink: #1d1d1f;
  --p-ink-2: #3a3b45;
  --p-ash: #5f6068;
  --p-slate: #4b4e6d;
  --p-slate-deep: #3a3c57;
  --p-peri: #8b8ff7;
  --p-peri-ink: #4a4fc4;
  --p-peri-soft: #e4e5ff;
  --p-peri-light: #b4b7ff;
  --p-sun: #ffd166;
  --p-sun-soft: #fff1cc;
  --p-mint: #9be3c9;
  --p-mint-soft: #ddf6ec;
  --p-peach: #ffc4a8;
  --p-peach-soft: #ffe6da;
  --p-night: #111226;
  --p-night-2: #181a33;
  --p-night-3: #23254a;
  --p-haze: #ececf8;
  --p-haze-2: #c5c7e0;
  --p-ash-dark: #a0a2c4;
  /* semantic colour */
  --bg: light-dark(var(--p-mist), var(--p-night));
  --bg-alt: light-dark(var(--p-mist-2), var(--p-night-2));
  --surface: light-dark(#fdfdff, var(--p-night-2));
  --surface-raised: light-dark(#ffffff, var(--p-night-3));
  --surface-sunken: light-dark(var(--p-mist-2), #0b0c1c);
  --fg: light-dark(var(--p-ink), var(--p-haze));
  --fg-2: light-dark(var(--p-ink-2), var(--p-haze-2));
  --muted: light-dark(var(--p-ash), var(--p-ash-dark));
  --line: light-dark(rgb(29 29 31 / 0.09), rgb(236 236 248 / 0.12));
  --line-strong: light-dark(rgb(75 78 109 / 0.68), rgb(236 236 248 / 0.42));
  --accent: light-dark(var(--p-peri), var(--p-peri));
  --on-accent: light-dark(#14153a, var(--p-night));
  --accent-text: light-dark(var(--p-peri-ink), var(--p-peri-light));
  --accent-soft: light-dark(var(--p-peri-soft), #262a5c);
  --primary: light-dark(var(--p-slate), var(--p-peri));
  --on-primary: light-dark(#ffffff, var(--p-night));
  --primary-hover: light-dark(var(--p-peri-ink), var(--p-peri-light));
  --secondary: light-dark(rgb(255 255 255 / 0.72), rgb(255 255 255 / 0.08));
  --on-secondary: light-dark(var(--p-ink), var(--p-haze));
  --secondary-hover: light-dark(#ffffff, rgb(255 255 255 / 0.16));
  --focus: light-dark(var(--p-peri-ink), var(--p-peri-light));
  --focus-halo: light-dark(rgb(139 143 247 / 0.35), rgb(139 143 247 / 0.4));
  --success: light-dark(#1d7a46, #6fd6a0);
  --success-soft: light-dark(var(--p-mint-soft), #13281f);
  --warning: light-dark(#8a5a00, var(--p-sun));
  --warning-soft: light-dark(var(--p-sun-soft), #2a2412);
  --danger: light-dark(#b42318, #ff8a80);
  --on-danger: light-dark(#ffffff, var(--p-night));
  --danger-soft: light-dark(var(--p-peach-soft), #2e1616);
  --info: light-dark(var(--p-peri-ink), var(--p-peri-light));
  --info-soft: light-dark(var(--p-peri-soft), #1f2250);
  --overlay: light-dark(rgb(29 29 31 / 0.35), rgb(5 6 18 / 0.72));
  --tint-1: light-dark(var(--p-peri-soft), #1f2250);
  --tint-2: light-dark(var(--p-sun-soft), #2a2412);
  --tint-3: light-dark(var(--p-mint-soft), #13281f);
  --tint-4: light-dark(var(--p-peach-soft), #2e1c16);
  --tint-accent: light-dark(var(--p-peri-soft), #262a5c);
  --selection-bg: light-dark(var(--p-peri-soft), #2f3470);
  --selection-fg: light-dark(var(--p-ink), var(--p-haze));
  /* type */
  --font-display: var(--f-inter-tight, "Inter Tight"), var(--f-noto-thai, "Noto Sans Thai"), ui-sans-serif, system-ui, sans-serif;
  --font-body: var(--f-geist, "Geist"), var(--f-noto-thai, "Noto Sans Thai"), ui-sans-serif, system-ui, sans-serif;
  --font-thai: var(--f-noto-thai, "Noto Sans Thai"), var(--f-geist, "Geist"), ui-sans-serif, system-ui, sans-serif;
  --font-mono: var(--f-geist-mono, "Geist Mono"), ui-monospace, "SFMono-Regular", Menlo, monospace;
  --weight-display: 600;
  --weight-heading: 600;
  --weight-body: 400;
  --tracking-display: -0.04em;
  --tracking-heading: -0.025em;
  --tracking-meta: 0.08em;
  --stretch-display: 100;
  --text-body: 1rem;
  --text-display: clamp(2.75rem, 6.6vw, 6rem);
  --text-h1: clamp(2.125rem, 4.2vw, 3.75rem);
  --text-h2: clamp(1.75rem, 3vw, 2.5rem);
  --text-h3: clamp(1.25rem, 1.8vw, 1.6rem);
  --text-lead: clamp(1.08rem, 1.4vw, 1.3rem);
  --text-small: 0.875rem;
  --text-meta: 0.75rem;
  --leading-tight: 1;
  --leading-snug: 1.2;
  --leading-body: 1.62;
  /* shape, depth, motion */
  --radius-xs: 6px;
  --radius-sm: 10px;
  --radius-md: 14px;
  --radius-lg: 28px;
  --radius-pill: 999px;
  --shadow-sm: 0 1px 2px light-dark(rgb(75 78 109 / 0.1), rgb(0 0 0 / 0.4));
  --shadow-md: 0 24px 44px -26px light-dark(rgb(75 78 109 / 0.34), rgb(0 0 0 / 0.7)), 0 8px 18px -10px light-dark(rgb(75 78 109 / 0.14), rgb(0 0 0 / 0.4)), inset 0 -8px 16px light-dark(rgb(75 78 109 / 0.06), rgb(0 0 0 / 0.2)), inset 0 6px 12px light-dark(rgb(255 255 255 / 0.95), rgb(255 255 255 / 0.04));
  --shadow-lg: 0 34px 56px -28px light-dark(rgb(75 78 109 / 0.4), rgb(0 0 0 / 0.8)), 0 12px 24px -12px light-dark(rgb(75 78 109 / 0.16), rgb(0 0 0 / 0.45)), inset 0 -8px 16px light-dark(rgb(75 78 109 / 0.06), rgb(0 0 0 / 0.2)), inset 0 6px 12px light-dark(rgb(255 255 255 / 0.95), rgb(255 255 255 / 0.05));
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-spring: cubic-bezier(0.34, 1.4, 0.64, 1);
  --dur-fast: 160ms;
  --dur-base: 280ms;
  --dur-slow: 600ms;
  /* component */
  --btn-radius: var(--radius-pill);
  --btn-shadow: 0 8px 20px -12px light-dark(rgb(75 78 109 / 0.3), rgb(0 0 0 / 0.5)), inset 0 1px 0 light-dark(#ffffff, rgb(255 255 255 / 0.06));
  --btn-primary-shadow: 0 14px 26px -12px light-dark(rgb(75 78 109 / 0.55), rgb(139 143 247 / 0.35)), inset 0 -4px 8px rgb(0 0 0 / 0.16), inset 0 3px 6px rgb(255 255 255 / 0.22);
  --btn-chip-bg: transparent;
  --btn-chip-fg: currentColor;
  --btn-chip-size: 20px;
  --field-radius: var(--radius-md);
  --field-bg: light-dark(rgb(255 255 255 / 0.78), rgb(255 255 255 / 0.04));
  --card-radius: var(--radius-lg);
  --card-bg: light-dark(rgb(255 255 255 / 0.62), rgb(35 37 74 / 0.55));
  --card-border: light-dark(rgb(255 255 255 / 0.9), rgb(236 236 248 / 0.1));
  --card-shadow: var(--shadow-md);
  --card-blur: blur(18px) saturate(170%);
  --card-hover-shadow: var(--shadow-lg);
  --panel-radius: var(--radius-md);
  --chip-radius: var(--radius-pill);
  --header-bg: light-dark(rgb(255 255 255 / 0.66), rgb(24 26 51 / 0.66));
  --header-radius: var(--radius-pill);
  --page-decor: radial-gradient(34vmax 34vmax at 12% 16%, light-dark(rgb(139 143 247 / 0.26), rgb(139 143 247 / 0.16)), transparent 62%), radial-gradient(28vmax 28vmax at 88% 10%, light-dark(rgb(255 209 102 / 0.28), rgb(255 209 102 / 0.08)), transparent 62%), radial-gradient(34vmax 34vmax at 74% 88%, light-dark(rgb(155 227 201 / 0.28), rgb(155 227 201 / 0.08)), transparent 62%), radial-gradient(26vmax 26vmax at 18% 86%, light-dark(rgb(255 196 168 / 0.26), rgb(255 196 168 / 0.08)), transparent 62%);
  --btn-outline-hover-bg: var(--surface-raised);
  --btn-outline-hover-fg: var(--accent-text);
  --btn-outline-hover-border: var(--accent);
  --btn-ghost-hover-bg: var(--accent-soft);
  --btn-ghost-hover-fg: var(--accent-text);
  --btn-secondary-border: light-dark(rgb(75 78 109 / 0.18), rgb(236 236 248 / 0.16));
  --btn-secondary-blur: blur(12px);
  --switch-thumb-off: var(--surface-raised);
  --switch-thumb-shadow: var(--shadow-sm), 0 2px 6px light-dark(rgb(75 78 109 / 0.25), rgb(0 0 0 / 0.5));
  --chip-on-bg: var(--accent-soft);
  --chip-on-fg: var(--accent-text);
  --chip-on-border: var(--accent);
  --progress-bar: var(--primary);
  --tablist-bg: var(--surface-sunken);
  --tablist-pad: 4px;
  --tablist-radius: var(--radius-pill);
  --tablist-border: transparent;
  --tab-radius: var(--radius-pill);
  --tab-active-bg: var(--surface-raised);
  --tab-active-line: transparent;
  --tab-active-shadow: var(--shadow-sm), 0 4px 12px -6px light-dark(rgb(75 78 109 / 0.35), rgb(0 0 0 / 0.5));
  --dialog-shadow: var(--shadow-lg);
  --only-aswinology: none;
  --only-lurnelle: contents;
  --mark-color: var(--accent);
}

/*
 * Nested themes. Browsers resolve light-dark() where a custom property is declared, so a
 * data-theme subtree re-declares its brand's tokens. @scope proximity picks the nearest brand.
 */
@scope ([data-brand="aswinology"]) {
  [data-theme] {
    /* primitives */
    --p-paper: #f8f7f4;
    --p-paper-2: #f1efeb;
    --p-paper-3: #e6e3dd;
    --p-paper-white: #fefdfb;
    --p-ink: #26262b;
    --p-ink-2: #4f4f57;
    --p-ash: #66666d;
    --p-lime: #cdf46e;
    --p-lime-deep: #b8e64f;
    --p-lime-ink: #3d5c00;
    --p-lime-neon: #b9ff38;
    --p-lime-soft: #eef8d2;
    --p-graphite: #0f100e;
    --p-graphite-2: #181a17;
    --p-graphite-3: #252823;
    --p-graphite-4: #1f221e;
    --p-bone: #ecece6;
    --p-bone-2: #c4c5bd;
    --p-ash-dark: #9a9c94;
    --p-tint-blue: #dcebff;
    --p-tint-butter: #fff0c4;
    --p-tint-sage: #d8f3e2;
    --p-tint-coral: #ffdfe4;
    --p-tint-lime: #e4f9aa;
    /* semantic colour */
    --bg: light-dark(var(--p-paper), var(--p-graphite));
    --bg-alt: light-dark(var(--p-paper-2), var(--p-graphite-2));
    --surface: light-dark(var(--p-paper-white), var(--p-graphite-2));
    --surface-raised: light-dark(#ffffff, var(--p-graphite-3));
    --surface-sunken: light-dark(var(--p-paper-2), #0a0b0a);
    --fg: light-dark(var(--p-ink), var(--p-bone));
    --fg-2: light-dark(var(--p-ink-2), var(--p-bone-2));
    --muted: light-dark(var(--p-ash), var(--p-ash-dark));
    --line: light-dark(rgb(38 38 43 / 0.1), rgb(236 236 230 / 0.13));
    --line-strong: light-dark(rgb(38 38 43 / 0.5), rgb(236 236 230 / 0.46));
    --accent: light-dark(var(--p-lime), var(--p-lime-neon));
    --on-accent: light-dark(var(--p-ink), var(--p-graphite));
    --accent-text: light-dark(var(--p-lime-ink), var(--p-lime-neon));
    --accent-soft: light-dark(var(--p-lime-soft), #1d2312);
    --primary: light-dark(var(--p-lime), var(--p-lime-neon));
    --on-primary: light-dark(var(--p-ink), var(--p-graphite));
    --primary-hover: light-dark(var(--p-lime-deep), #cbff6b);
    --secondary: light-dark(var(--p-ink), var(--p-bone));
    --on-secondary: light-dark(var(--p-paper), var(--p-graphite));
    --secondary-hover: light-dark(#3a3a41, #ffffff);
    --focus: light-dark(var(--p-ink), var(--p-bone));
    --focus-halo: light-dark(var(--p-lime), var(--p-lime-neon));
    --success: light-dark(#3b7527, #9be37a);
    --success-soft: light-dark(#e3f1da, #17220f);
    --warning: light-dark(#8a5600, #f2b84b);
    --warning-soft: light-dark(#fbefd6, #2a2110);
    --danger: light-dark(#b8372b, #ff8a6b);
    --on-danger: light-dark(#ffffff, var(--p-graphite));
    --danger-soft: light-dark(#fbe4e1, #2c1612);
    --info: light-dark(#2b59c3, #8fb0ff);
    --info-soft: light-dark(#e3ebfb, #151c2e);
    --overlay: light-dark(rgb(38 38 43 / 0.42), rgb(0 0 0 / 0.7));
    --tint-1: light-dark(var(--p-tint-blue), #1a2028);
    --tint-2: light-dark(var(--p-tint-butter), #23211a);
    --tint-3: light-dark(var(--p-tint-sage), #1b2119);
    --tint-4: light-dark(var(--p-tint-coral), #261d19);
    --tint-accent: light-dark(var(--p-tint-lime), #1d2312);
    --selection-bg: light-dark(var(--p-lime), var(--p-lime-neon));
    --selection-fg: light-dark(var(--p-ink), var(--p-graphite));
    /* type */
    --font-display: var(--f-archivo, "Archivo"), var(--f-anuphan, "Anuphan"), ui-sans-serif, system-ui, sans-serif;
    --font-body: var(--f-archivo, "Archivo"), var(--f-anuphan, "Anuphan"), ui-sans-serif, system-ui, sans-serif;
    --font-thai: var(--f-anuphan, "Anuphan"), var(--f-archivo, "Archivo"), ui-sans-serif, system-ui, sans-serif;
    --font-mono: var(--f-geist-mono, "Geist Mono"), ui-monospace, "SFMono-Regular", Menlo, monospace;
    --weight-display: 700;
    --weight-heading: 650;
    --weight-body: 400;
    --tracking-display: -0.045em;
    --tracking-heading: -0.03em;
    --tracking-meta: 0.06em;
    --stretch-display: 100;
    --text-body: 1.0625rem;
    --text-display: clamp(3rem, 7.4vw, 6.75rem);
    --text-h1: clamp(2.25rem, 4.6vw, 4rem);
    --text-h2: clamp(1.75rem, 3vw, 2.625rem);
    --text-h3: clamp(1.25rem, 1.8vw, 1.625rem);
    --text-lead: clamp(1.125rem, 1.5vw, 1.375rem);
    --text-small: 0.875rem;
    --text-meta: 0.75rem;
    --leading-tight: 0.98;
    --leading-snug: 1.2;
    --leading-body: 1.6;
    /* shape, depth, motion */
    --radius-xs: 6px;
    --radius-sm: 10px;
    --radius-md: 18px;
    --radius-lg: 28px;
    --radius-pill: 999px;
    --shadow-sm: 0 1px 2px light-dark(rgb(38 38 43 / 0.06), rgb(0 0 0 / 0.4));
    --shadow-md: 0 18px 40px -24px light-dark(rgb(38 38 43 / 0.28), rgb(0 0 0 / 0.7));
    --shadow-lg: 0 40px 80px -40px light-dark(rgb(38 38 43 / 0.38), rgb(0 0 0 / 0.8));
    --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
    --ease-in-out: cubic-bezier(0.76, 0, 0.24, 1);
    --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
    --dur-fast: 180ms;
    --dur-base: 320ms;
    --dur-slow: 700ms;
    /* component */
    --btn-radius: var(--radius-pill);
    --btn-shadow: none;
    --btn-primary-shadow: none;
    --btn-chip-bg: var(--fg);
    --btn-chip-fg: var(--bg);
    --btn-chip-size: 32px;
    --field-radius: var(--radius-sm);
    --field-bg: var(--surface);
    --card-radius: var(--radius-lg);
    --card-bg: var(--surface);
    --card-border: var(--line);
    --card-shadow: none;
    --card-blur: none;
    --card-hover-shadow: var(--shadow-md);
    --panel-radius: var(--radius-md);
    --chip-radius: var(--radius-pill);
    --header-bg: light-dark(rgb(248 247 244 / 0.82), rgb(15 16 14 / 0.82));
    --header-radius: 0px;
    --page-decor: none;
    --btn-outline-hover-bg: var(--fg);
    --btn-outline-hover-fg: var(--bg);
    --btn-outline-hover-border: var(--fg);
    --btn-ghost-hover-bg: var(--bg-alt);
    --btn-ghost-hover-fg: var(--fg);
    --btn-secondary-border: transparent;
    --btn-secondary-blur: none;
    --switch-thumb-off: var(--muted);
    --switch-thumb-shadow: none;
    --chip-on-bg: var(--fg);
    --chip-on-fg: var(--bg);
    --chip-on-border: var(--fg);
    --progress-bar: var(--fg);
    --tablist-bg: transparent;
    --tablist-pad: 0px;
    --tablist-radius: 0px;
    --tablist-border: var(--line);
    --tab-radius: 0px;
    --tab-active-bg: transparent;
    --tab-active-line: var(--fg);
    --tab-active-shadow: none;
    --dialog-shadow: var(--shadow-lg);
    --only-aswinology: contents;
    --only-lurnelle: none;
    --mark-color: var(--accent);
  }
}
@scope ([data-brand="lurnelle"]) {
  [data-theme] {
    /* primitives */
    --p-mist: #f5f5f7;
    --p-mist-2: #ececf0;
    --p-ink: #1d1d1f;
    --p-ink-2: #3a3b45;
    --p-ash: #5f6068;
    --p-slate: #4b4e6d;
    --p-slate-deep: #3a3c57;
    --p-peri: #8b8ff7;
    --p-peri-ink: #4a4fc4;
    --p-peri-soft: #e4e5ff;
    --p-peri-light: #b4b7ff;
    --p-sun: #ffd166;
    --p-sun-soft: #fff1cc;
    --p-mint: #9be3c9;
    --p-mint-soft: #ddf6ec;
    --p-peach: #ffc4a8;
    --p-peach-soft: #ffe6da;
    --p-night: #111226;
    --p-night-2: #181a33;
    --p-night-3: #23254a;
    --p-haze: #ececf8;
    --p-haze-2: #c5c7e0;
    --p-ash-dark: #a0a2c4;
    /* semantic colour */
    --bg: light-dark(var(--p-mist), var(--p-night));
    --bg-alt: light-dark(var(--p-mist-2), var(--p-night-2));
    --surface: light-dark(#fdfdff, var(--p-night-2));
    --surface-raised: light-dark(#ffffff, var(--p-night-3));
    --surface-sunken: light-dark(var(--p-mist-2), #0b0c1c);
    --fg: light-dark(var(--p-ink), var(--p-haze));
    --fg-2: light-dark(var(--p-ink-2), var(--p-haze-2));
    --muted: light-dark(var(--p-ash), var(--p-ash-dark));
    --line: light-dark(rgb(29 29 31 / 0.09), rgb(236 236 248 / 0.12));
    --line-strong: light-dark(rgb(75 78 109 / 0.68), rgb(236 236 248 / 0.42));
    --accent: light-dark(var(--p-peri), var(--p-peri));
    --on-accent: light-dark(#14153a, var(--p-night));
    --accent-text: light-dark(var(--p-peri-ink), var(--p-peri-light));
    --accent-soft: light-dark(var(--p-peri-soft), #262a5c);
    --primary: light-dark(var(--p-slate), var(--p-peri));
    --on-primary: light-dark(#ffffff, var(--p-night));
    --primary-hover: light-dark(var(--p-peri-ink), var(--p-peri-light));
    --secondary: light-dark(rgb(255 255 255 / 0.72), rgb(255 255 255 / 0.08));
    --on-secondary: light-dark(var(--p-ink), var(--p-haze));
    --secondary-hover: light-dark(#ffffff, rgb(255 255 255 / 0.16));
    --focus: light-dark(var(--p-peri-ink), var(--p-peri-light));
    --focus-halo: light-dark(rgb(139 143 247 / 0.35), rgb(139 143 247 / 0.4));
    --success: light-dark(#1d7a46, #6fd6a0);
    --success-soft: light-dark(var(--p-mint-soft), #13281f);
    --warning: light-dark(#8a5a00, var(--p-sun));
    --warning-soft: light-dark(var(--p-sun-soft), #2a2412);
    --danger: light-dark(#b42318, #ff8a80);
    --on-danger: light-dark(#ffffff, var(--p-night));
    --danger-soft: light-dark(var(--p-peach-soft), #2e1616);
    --info: light-dark(var(--p-peri-ink), var(--p-peri-light));
    --info-soft: light-dark(var(--p-peri-soft), #1f2250);
    --overlay: light-dark(rgb(29 29 31 / 0.35), rgb(5 6 18 / 0.72));
    --tint-1: light-dark(var(--p-peri-soft), #1f2250);
    --tint-2: light-dark(var(--p-sun-soft), #2a2412);
    --tint-3: light-dark(var(--p-mint-soft), #13281f);
    --tint-4: light-dark(var(--p-peach-soft), #2e1c16);
    --tint-accent: light-dark(var(--p-peri-soft), #262a5c);
    --selection-bg: light-dark(var(--p-peri-soft), #2f3470);
    --selection-fg: light-dark(var(--p-ink), var(--p-haze));
    /* type */
    --font-display: var(--f-inter-tight, "Inter Tight"), var(--f-noto-thai, "Noto Sans Thai"), ui-sans-serif, system-ui, sans-serif;
    --font-body: var(--f-geist, "Geist"), var(--f-noto-thai, "Noto Sans Thai"), ui-sans-serif, system-ui, sans-serif;
    --font-thai: var(--f-noto-thai, "Noto Sans Thai"), var(--f-geist, "Geist"), ui-sans-serif, system-ui, sans-serif;
    --font-mono: var(--f-geist-mono, "Geist Mono"), ui-monospace, "SFMono-Regular", Menlo, monospace;
    --weight-display: 600;
    --weight-heading: 600;
    --weight-body: 400;
    --tracking-display: -0.04em;
    --tracking-heading: -0.025em;
    --tracking-meta: 0.08em;
    --stretch-display: 100;
    --text-body: 1rem;
    --text-display: clamp(2.75rem, 6.6vw, 6rem);
    --text-h1: clamp(2.125rem, 4.2vw, 3.75rem);
    --text-h2: clamp(1.75rem, 3vw, 2.5rem);
    --text-h3: clamp(1.25rem, 1.8vw, 1.6rem);
    --text-lead: clamp(1.08rem, 1.4vw, 1.3rem);
    --text-small: 0.875rem;
    --text-meta: 0.75rem;
    --leading-tight: 1;
    --leading-snug: 1.2;
    --leading-body: 1.62;
    /* shape, depth, motion */
    --radius-xs: 6px;
    --radius-sm: 10px;
    --radius-md: 14px;
    --radius-lg: 28px;
    --radius-pill: 999px;
    --shadow-sm: 0 1px 2px light-dark(rgb(75 78 109 / 0.1), rgb(0 0 0 / 0.4));
    --shadow-md: 0 24px 44px -26px light-dark(rgb(75 78 109 / 0.34), rgb(0 0 0 / 0.7)), 0 8px 18px -10px light-dark(rgb(75 78 109 / 0.14), rgb(0 0 0 / 0.4)), inset 0 -8px 16px light-dark(rgb(75 78 109 / 0.06), rgb(0 0 0 / 0.2)), inset 0 6px 12px light-dark(rgb(255 255 255 / 0.95), rgb(255 255 255 / 0.04));
    --shadow-lg: 0 34px 56px -28px light-dark(rgb(75 78 109 / 0.4), rgb(0 0 0 / 0.8)), 0 12px 24px -12px light-dark(rgb(75 78 109 / 0.16), rgb(0 0 0 / 0.45)), inset 0 -8px 16px light-dark(rgb(75 78 109 / 0.06), rgb(0 0 0 / 0.2)), inset 0 6px 12px light-dark(rgb(255 255 255 / 0.95), rgb(255 255 255 / 0.05));
    --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
    --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
    --ease-spring: cubic-bezier(0.34, 1.4, 0.64, 1);
    --dur-fast: 160ms;
    --dur-base: 280ms;
    --dur-slow: 600ms;
    /* component */
    --btn-radius: var(--radius-pill);
    --btn-shadow: 0 8px 20px -12px light-dark(rgb(75 78 109 / 0.3), rgb(0 0 0 / 0.5)), inset 0 1px 0 light-dark(#ffffff, rgb(255 255 255 / 0.06));
    --btn-primary-shadow: 0 14px 26px -12px light-dark(rgb(75 78 109 / 0.55), rgb(139 143 247 / 0.35)), inset 0 -4px 8px rgb(0 0 0 / 0.16), inset 0 3px 6px rgb(255 255 255 / 0.22);
    --btn-chip-bg: transparent;
    --btn-chip-fg: currentColor;
    --btn-chip-size: 20px;
    --field-radius: var(--radius-md);
    --field-bg: light-dark(rgb(255 255 255 / 0.78), rgb(255 255 255 / 0.04));
    --card-radius: var(--radius-lg);
    --card-bg: light-dark(rgb(255 255 255 / 0.62), rgb(35 37 74 / 0.55));
    --card-border: light-dark(rgb(255 255 255 / 0.9), rgb(236 236 248 / 0.1));
    --card-shadow: var(--shadow-md);
    --card-blur: blur(18px) saturate(170%);
    --card-hover-shadow: var(--shadow-lg);
    --panel-radius: var(--radius-md);
    --chip-radius: var(--radius-pill);
    --header-bg: light-dark(rgb(255 255 255 / 0.66), rgb(24 26 51 / 0.66));
    --header-radius: var(--radius-pill);
    --page-decor: radial-gradient(34vmax 34vmax at 12% 16%, light-dark(rgb(139 143 247 / 0.26), rgb(139 143 247 / 0.16)), transparent 62%), radial-gradient(28vmax 28vmax at 88% 10%, light-dark(rgb(255 209 102 / 0.28), rgb(255 209 102 / 0.08)), transparent 62%), radial-gradient(34vmax 34vmax at 74% 88%, light-dark(rgb(155 227 201 / 0.28), rgb(155 227 201 / 0.08)), transparent 62%), radial-gradient(26vmax 26vmax at 18% 86%, light-dark(rgb(255 196 168 / 0.26), rgb(255 196 168 / 0.08)), transparent 62%);
    --btn-outline-hover-bg: var(--surface-raised);
    --btn-outline-hover-fg: var(--accent-text);
    --btn-outline-hover-border: var(--accent);
    --btn-ghost-hover-bg: var(--accent-soft);
    --btn-ghost-hover-fg: var(--accent-text);
    --btn-secondary-border: light-dark(rgb(75 78 109 / 0.18), rgb(236 236 248 / 0.16));
    --btn-secondary-blur: blur(12px);
    --switch-thumb-off: var(--surface-raised);
    --switch-thumb-shadow: var(--shadow-sm), 0 2px 6px light-dark(rgb(75 78 109 / 0.25), rgb(0 0 0 / 0.5));
    --chip-on-bg: var(--accent-soft);
    --chip-on-fg: var(--accent-text);
    --chip-on-border: var(--accent);
    --progress-bar: var(--primary);
    --tablist-bg: var(--surface-sunken);
    --tablist-pad: 4px;
    --tablist-radius: var(--radius-pill);
    --tablist-border: transparent;
    --tab-radius: var(--radius-pill);
    --tab-active-bg: var(--surface-raised);
    --tab-active-line: transparent;
    --tab-active-shadow: var(--shadow-sm), 0 4px 12px -6px light-dark(rgb(75 78 109 / 0.35), rgb(0 0 0 / 0.5));
    --dialog-shadow: var(--shadow-lg);
    --only-aswinology: none;
    --only-lurnelle: contents;
    --mark-color: var(--accent);
  }
}