Initial commit: Apothecary v0.4.0

2026-05-03 20:19:26 -04:00
commit 027cf032be
55 changed files with 14678 additions and 0 deletions
@@ -0,0 +1,113 @@
+/* Apothecary / Botanical design tokens
+   Warm earthy neutrals — parchment, ink, sage, terracotta */
+
+:root {
+  /* Surfaces — parchment-toned */
+  --bg: oklch(96% 0.012 80);          /* parchment */
+  --bg-2: oklch(93% 0.014 80);        /* slightly darker parchment */
+  --bg-3: oklch(89% 0.016 78);        /* card divider, hover */
+  --surface: oklch(98% 0.008 82);     /* card surface */
+  --surface-sunken: oklch(91% 0.014 80);
+
+  /* Ink — warm near-blacks */
+  --ink: oklch(22% 0.012 60);         /* primary text */
+  --ink-2: oklch(38% 0.012 60);       /* secondary text */
+  --ink-3: oklch(56% 0.014 65);       /* tertiary, captions */
+  --ink-4: oklch(72% 0.014 70);       /* faint, dividers */
+
+  /* Lines */
+  --line: oklch(82% 0.014 75);
+  --line-strong: oklch(68% 0.016 70);
+
+  /* Accents — share chroma 0.08, lightness 52% */
+  --sage: oklch(52% 0.06 145);        /* primary action / good */
+  --sage-2: oklch(64% 0.05 145);
+  --sage-soft: oklch(88% 0.03 145);
+
+  --terracotta: oklch(58% 0.10 40);   /* warning / consumed */
+  --terracotta-soft: oklch(90% 0.04 40);
+
+  --amber: oklch(68% 0.10 75);        /* low stock / attention */
+  --amber-soft: oklch(91% 0.04 75);
+
+  --plum: oklch(48% 0.06 340);        /* secondary accent */
+
+  /* Typography */
+  --serif: "Cormorant Garamond", "GT Sectra", "Playfair Display", Georgia, serif;
+  --sans: "Inter", "Söhne", -apple-system, BlinkMacSystemFont, sans-serif;
+  --mono: "JetBrains Mono", "IBM Plex Mono", ui-monospace, Menlo, monospace;
+
+  /* Radii */
+  --r-sm: 4px;
+  --r-md: 8px;
+  --r-lg: 14px;
+  --r-xl: 20px;
+
+  /* Shadow — subtle */
+  --shadow-sm: 0 1px 2px oklch(20% 0.02 60 / 0.06);
+  --shadow-md: 0 2px 8px oklch(20% 0.02 60 / 0.08);
+  --shadow-lg: 0 8px 24px oklch(20% 0.02 60 / 0.10);
+}
+
+[data-theme="dark"] {
+  --bg: oklch(20% 0.012 60);
+  --bg-2: oklch(23% 0.012 60);
+  --bg-3: oklch(27% 0.014 65);
+  --surface: oklch(25% 0.012 60);
+  --surface-sunken: oklch(18% 0.012 60);
+
+  --ink: oklch(94% 0.008 80);
+  --ink-2: oklch(78% 0.012 75);
+  --ink-3: oklch(62% 0.014 70);
+  --ink-4: oklch(46% 0.014 65);
+
+  --line: oklch(34% 0.014 65);
+  --line-strong: oklch(48% 0.016 65);
+
+  --sage: oklch(70% 0.07 145);
+  --sage-2: oklch(60% 0.06 145);
+  --sage-soft: oklch(32% 0.04 145);
+
+  --terracotta: oklch(70% 0.10 40);
+  --terracotta-soft: oklch(32% 0.05 40);
+
+  --amber: oklch(78% 0.10 75);
+  --amber-soft: oklch(32% 0.05 75);
+}
+
+* { box-sizing: border-box; }
+
+html, body {
+  margin: 0;
+  padding: 0;
+  background: var(--bg);
+  color: var(--ink);
+  font-family: var(--sans);
+  font-size: 14px;
+  line-height: 1.5;
+  -webkit-font-smoothing: antialiased;
+  text-rendering: optimizeLegibility;
+}
+
+button { font-family: inherit; cursor: pointer; }
+input, select, textarea { font-family: inherit; }
+
+/* Subtle parchment texture */
+.parchment {
+  background-image:
+    radial-gradient(oklch(85% 0.03 75 / 0.15) 1px, transparent 1px),
+    radial-gradient(oklch(80% 0.03 75 / 0.10) 1px, transparent 1px);
+  background-size: 24px 24px, 36px 36px;
+  background-position: 0 0, 12px 18px;
+}
+
+/* Utility */
+.serif { font-family: var(--serif); font-weight: 500; }
+.mono { font-family: var(--mono); font-feature-settings: "ss01", "cv11"; }
+.smallcaps {
+  text-transform: uppercase;
+  letter-spacing: 0.12em;
+  font-size: 11px;
+  font-weight: 500;
+}
+.hairline { border-top: 1px solid var(--line); }