@import "tailwindcss"; @plugin "@iconify/tailwind4"; @source "../**/*.wrn"; @source "../../../packages/i18n/components/*.wrn"; html { color-scheme: light dark; } body { margin: 0; font-family: "Plus Jakarta Sans", "Noto Sans Devanagari", ui-sans-serif, system-ui, sans-serif; } /* The server sets from the language cookie, so each script can use a typography stack designed for its glyph shapes and metrics. */ html:lang(hi) body, html:lang(mr) body { font-family: "Noto Sans Devanagari", "Nirmala UI", Mangal, sans-serif; } html[dir="rtl"] body { text-align: start; } .demo-card { display: flex; min-height: 12rem; flex-direction: column; border: 1px solid var(--wrn-color-border); border-radius: var(--wrn-radius-xl); background: var(--wrn-color-surface); padding: 1.25rem; } .demo-card h3 { margin: 0.75rem 0 0.35rem; font-size: 1rem; } .demo-card p { margin: 0.2rem 0; color: var(--wrn-color-muted); line-height: 1.6; } .demo-icon { width: 1.4rem; height: 1.4rem; color: var(--wrn-color-primary); } .demo-link { margin-top: auto; padding-top: 1rem; color: var(--wrn-color-primary); font-size: 0.875rem; font-weight: 600; }