Wip stage M4

2026-08-13 23:20:22 +07:00
parent 5386bc51d1
commit d5cacc1208
113 changed files with 9486 additions and 919 deletions
@@ -60,6 +60,84 @@
  --animate-rise: rise 0.5s var(--ease-out-quint) both;
 }

+/**
+ * ---- shadcn/ui semantic layer --------------------------------------------
+ *
+ * shadcn components are written against role tokens (`bg-background`,
+ * `text-muted-foreground`, `border-input`, `ring-ring`) rather than against a
+ * palette. This block is the adapter: it gives those roles values drawn from
+ * the ink/volt scales above, so an unmodified component pasted from the
+ * registry already looks like this store.
+ *
+ * ONE TRAP WORTH NAMING: shadcn's `--accent` is not a brand accent. It is the
+ * subtle surface behind a hovered ghost button or a highlighted menu row. It
+ * maps to ink-100. The brand accent stays `--color-volt-*` and is applied
+ * deliberately — mapping volt here would turn every hover state neon.
+ *
+ * The store is committed to a light palette (`color-scheme: light`), so there
+ * is no `.dark` block. shadcn's `dark:` utilities simply never match, which is
+ * harmless and keeps the registry components paste-able unedited.
+ */
+:root {
+  --background: var(--color-white);
+  --foreground: var(--color-ink-950);
+
+  --card: var(--color-white);
+  --card-foreground: var(--color-ink-950);
+  --popover: var(--color-white);
+  --popover-foreground: var(--color-ink-950);
+
+  --primary: var(--color-ink-950);
+  --primary-foreground: var(--color-white);
+  --secondary: var(--color-ink-100);
+  --secondary-foreground: var(--color-ink-950);
+
+  --muted: var(--color-ink-100);
+  --muted-foreground: var(--color-ink-500);
+
+  /* Hover/active surface — see the trap noted above. */
+  --accent: var(--color-ink-100);
+  --accent-foreground: var(--color-ink-950);
+
+  --destructive: var(--color-danger);
+  --destructive-foreground: var(--color-white);
+
+  --border: var(--color-ink-200);
+  --input: var(--color-ink-200);
+  --ring: var(--color-ink-950);
+
+  /* Sport/streetwear geometry: near-square. Raising this rounds every
+     registry component at once, which is the point of keeping it here. */
+  --radius: 0.25rem;
+}
+
+@theme inline {
+  --color-background: var(--background);
+  --color-foreground: var(--foreground);
+  --color-card: var(--card);
+  --color-card-foreground: var(--card-foreground);
+  --color-popover: var(--popover);
+  --color-popover-foreground: var(--popover-foreground);
+  --color-primary: var(--primary);
+  --color-primary-foreground: var(--primary-foreground);
+  --color-secondary: var(--secondary);
+  --color-secondary-foreground: var(--secondary-foreground);
+  --color-muted: var(--muted);
+  --color-muted-foreground: var(--muted-foreground);
+  --color-accent: var(--accent);
+  --color-accent-foreground: var(--accent-foreground);
+  --color-destructive: var(--destructive);
+  --color-destructive-foreground: var(--destructive-foreground);
+  --color-border: var(--border);
+  --color-input: var(--input);
+  --color-ring: var(--ring);
+
+  --radius-sm: calc(var(--radius) - 2px);
+  --radius-md: var(--radius);
+  --radius-lg: calc(var(--radius) + 2px);
+  --radius-xl: calc(var(--radius) + 6px);
+}
+
@keyframes rise {
  from {
    opacity: 0;