/* ========================================================================== otks styles ========================================================================== */ /* -------------------------------------------------------------------------- Fonts — local copies of the otks.systems brand faces. -------------------------------------------------------------------------- */ @font-face { font-family: "Sintesi Semi"; src: url("/assets/fonts/SintesiSemi.otf") format("opentype"); font-display: swap; } @font-face { font-family: "Sintesi Semi"; src: url("/assets/fonts/SintesiSemi-Bold.otf") format("opentype"); font-weight: 700; font-display: swap; } @font-face { font-family: "Open Sans"; src: url("/assets/fonts/OpenSans-Regular.ttf") format("truetype"); font-display: swap; } @font-face { font-family: "Open Sans"; src: url("/assets/fonts/OpenSans-SemiBold.ttf") format("truetype"); font-weight: 600; font-display: swap; } :root { --bg: #141414; --bg-elevated: #1c1c1c; --fg: #e5e5e3; --fg-muted: #c8c8c6; --fg-dim: #999; --border-subtle: #2a2a2a; --display: "Sintesi Semi", Arial, sans-serif; --body: "Open Sans", Arial, sans-serif; } /* -------------------------------------------------------------------------- FrankenUI custom theme — HSL values without the hsl() wrapper, as the FrankenUI CDN build expects. The class is applied to by the init script in base.html, giving it specificity to override built-in themes. Palette derived from the otks.systems --bg/--fg variables above. -------------------------------------------------------------------------- */ .uk-theme-otks { --background: 0 0% 8%; /* #141414 */ --foreground: 60 4% 89%; /* #e5e5e3 */ --muted: 0 0% 11%; /* #1c1c1c */ --muted-foreground: 0 0% 60%; /* #999 */ --card: 0 0% 11%; --card-foreground: 60 4% 89%; --popover: 0 0% 11%; --popover-foreground: 60 4% 89%; --border: 0 0% 16%; /* #2a2a2a */ --input: 0 0% 16%; --primary: 60 4% 89%; /* otks's "primary" is the foreground tone — */ --primary-foreground: 0 0% 8%; /* same trick as the corner button on otks.systems */ --secondary: 0 0% 16%; --secondary-foreground: 60 4% 89%; --accent: 0 0% 60%; --accent-foreground: 0 0% 8%; --destructive: 0 84% 60%; --destructive-foreground: 0 0% 100%; --ring: 60 4% 89%; --radius: 0.5rem; } /* Dark mode uses the same palette — otks is dark-first. */ .uk-theme-otks.dark { --background: 0 0% 8%; --foreground: 60 4% 89%; --muted: 0 0% 11%; --muted-foreground: 0 0% 60%; --card: 0 0% 11%; --card-foreground: 60 4% 89%; --popover: 0 0% 11%; --popover-foreground: 60 4% 89%; --border: 0 0% 16%; --input: 0 0% 16%; --primary: 60 4% 89%; --primary-foreground: 0 0% 8%; --secondary: 0 0% 16%; --secondary-foreground: 60 4% 89%; --accent: 0 0% 60%; --accent-foreground: 0 0% 8%; --destructive: 0 84% 60%; --destructive-foreground: 0 0% 100%; --ring: 60 4% 89%; --radius: 0.5rem; } /* -------------------------------------------------------------------------- FrankenUI Component Adjustments Tailwind v4 preflight resets padding/background/radius on