@amulet-laboratories/hex 0.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (149) hide show
  1. package/LICENSE +21 -0
  2. package/README.md +120 -0
  3. package/dist/aldricpace.css +5 -0
  4. package/dist/briarcove.css +5 -0
  5. package/dist/briarcovelib.css +5 -0
  6. package/dist/compass.css +5 -0
  7. package/dist/duskline.css +5 -0
  8. package/dist/forge.css +5 -0
  9. package/dist/garden.css +5 -0
  10. package/dist/greyline.css +5 -0
  11. package/dist/hex.css +5 -0
  12. package/dist/kbcv.css +5 -0
  13. package/dist/lanternhouse.css +5 -0
  14. package/dist/marenlys.css +5 -0
  15. package/dist/quizbit.css +5 -0
  16. package/dist/saltsignal.css +5 -0
  17. package/dist/scoped.css +1 -0
  18. package/dist/spacewizard.css +5 -0
  19. package/dist/tidemark.css +5 -0
  20. package/dist/undertow.css +5 -0
  21. package/dist/vscode.css +5 -0
  22. package/package.json +119 -0
  23. package/src/index.css +10 -0
  24. package/src/scoped/bridge.css +47 -0
  25. package/src/scoped/index.css +51 -0
  26. package/src/scoped/themes/aldricpace.css +115 -0
  27. package/src/scoped/themes/briarcove.css +123 -0
  28. package/src/scoped/themes/briarcovelib.css +111 -0
  29. package/src/scoped/themes/compass.css +111 -0
  30. package/src/scoped/themes/duskline.css +117 -0
  31. package/src/scoped/themes/forge.css +123 -0
  32. package/src/scoped/themes/garden.css +123 -0
  33. package/src/scoped/themes/greyline.css +116 -0
  34. package/src/scoped/themes/kbcv.css +111 -0
  35. package/src/scoped/themes/lanternhouse.css +111 -0
  36. package/src/scoped/themes/marenlys.css +112 -0
  37. package/src/scoped/themes/quizbit.css +101 -0
  38. package/src/scoped/themes/saltsignal.css +114 -0
  39. package/src/scoped/themes/spacewizard.css +115 -0
  40. package/src/scoped/themes/tidemark.css +119 -0
  41. package/src/scoped/themes/undertow.css +113 -0
  42. package/src/scoped/themes/vscode.css +230 -0
  43. package/src/scoped/tokens.css +21 -0
  44. package/src/shared/a11y.css +175 -0
  45. package/src/shared/components/core.css +1654 -0
  46. package/src/shared/components/data.css +418 -0
  47. package/src/shared/components/editor.css +358 -0
  48. package/src/shared/components/extras.css +897 -0
  49. package/src/shared/components/layout.css +663 -0
  50. package/src/shared/components/lists.css +278 -0
  51. package/src/shared/components/menus.css +377 -0
  52. package/src/shared/components/nav.css +943 -0
  53. package/src/shared/components/prose.css +302 -0
  54. package/src/shared/components/shell.css +528 -0
  55. package/src/shared/components/spatial.css +184 -0
  56. package/src/shared/components/temporal.css +191 -0
  57. package/src/shared/components/web.css +1689 -0
  58. package/src/shared/rig-defaults.css +121 -0
  59. package/src/shared/scroll-animations.css +176 -0
  60. package/src/shared/tokens.css +125 -0
  61. package/src/shared/utilities.css +204 -0
  62. package/src/themes/aldricpace/base.css +114 -0
  63. package/src/themes/aldricpace/components.css +22 -0
  64. package/src/themes/aldricpace/domains.css +19 -0
  65. package/src/themes/aldricpace/index.css +6 -0
  66. package/src/themes/aldricpace/tokens.css +169 -0
  67. package/src/themes/andrewpassanisi/base.css +192 -0
  68. package/src/themes/andrewpassanisi/index.css +11 -0
  69. package/src/themes/andrewpassanisi/tokens.css +136 -0
  70. package/src/themes/briarcove/base.css +170 -0
  71. package/src/themes/briarcove/components.css +27 -0
  72. package/src/themes/briarcove/domains.css +72 -0
  73. package/src/themes/briarcove/index.css +6 -0
  74. package/src/themes/briarcove/tokens.css +179 -0
  75. package/src/themes/briarcovelib/base.css +111 -0
  76. package/src/themes/briarcovelib/components.css +22 -0
  77. package/src/themes/briarcovelib/domains.css +19 -0
  78. package/src/themes/briarcovelib/index.css +6 -0
  79. package/src/themes/briarcovelib/tokens.css +167 -0
  80. package/src/themes/compass/base.css +112 -0
  81. package/src/themes/compass/components.css +22 -0
  82. package/src/themes/compass/domains.css +19 -0
  83. package/src/themes/compass/index.css +6 -0
  84. package/src/themes/compass/tokens.css +167 -0
  85. package/src/themes/duskline/base.css +167 -0
  86. package/src/themes/duskline/components.css +27 -0
  87. package/src/themes/duskline/domains.css +72 -0
  88. package/src/themes/duskline/index.css +6 -0
  89. package/src/themes/duskline/tokens.css +171 -0
  90. package/src/themes/forge/base.css +165 -0
  91. package/src/themes/forge/components.css +24 -0
  92. package/src/themes/forge/domains.css +72 -0
  93. package/src/themes/forge/index.css +6 -0
  94. package/src/themes/forge/tokens.css +178 -0
  95. package/src/themes/garden/base.css +167 -0
  96. package/src/themes/garden/components.css +27 -0
  97. package/src/themes/garden/domains.css +72 -0
  98. package/src/themes/garden/index.css +6 -0
  99. package/src/themes/garden/tokens.css +178 -0
  100. package/src/themes/greyline/base.css +165 -0
  101. package/src/themes/greyline/components.css +24 -0
  102. package/src/themes/greyline/domains.css +70 -0
  103. package/src/themes/greyline/index.css +6 -0
  104. package/src/themes/greyline/tokens.css +161 -0
  105. package/src/themes/kbcv/base.css +112 -0
  106. package/src/themes/kbcv/components.css +22 -0
  107. package/src/themes/kbcv/domains.css +19 -0
  108. package/src/themes/kbcv/index.css +6 -0
  109. package/src/themes/kbcv/tokens.css +167 -0
  110. package/src/themes/lanternhouse/base.css +170 -0
  111. package/src/themes/lanternhouse/components.css +27 -0
  112. package/src/themes/lanternhouse/domains.css +72 -0
  113. package/src/themes/lanternhouse/index.css +6 -0
  114. package/src/themes/lanternhouse/tokens.css +167 -0
  115. package/src/themes/marenlys/base.css +181 -0
  116. package/src/themes/marenlys/components.css +27 -0
  117. package/src/themes/marenlys/domains.css +72 -0
  118. package/src/themes/marenlys/index.css +6 -0
  119. package/src/themes/marenlys/tokens.css +167 -0
  120. package/src/themes/quizbit/base.css +120 -0
  121. package/src/themes/quizbit/components.css +27 -0
  122. package/src/themes/quizbit/domains.css +7 -0
  123. package/src/themes/quizbit/index.css +6 -0
  124. package/src/themes/quizbit/tokens.css +132 -0
  125. package/src/themes/saltsignal/base.css +168 -0
  126. package/src/themes/saltsignal/components.css +27 -0
  127. package/src/themes/saltsignal/domains.css +72 -0
  128. package/src/themes/saltsignal/index.css +6 -0
  129. package/src/themes/saltsignal/tokens.css +170 -0
  130. package/src/themes/spacewizard/base.css +165 -0
  131. package/src/themes/spacewizard/components.css +24 -0
  132. package/src/themes/spacewizard/domains.css +70 -0
  133. package/src/themes/spacewizard/index.css +6 -0
  134. package/src/themes/spacewizard/tokens.css +160 -0
  135. package/src/themes/tidemark/base.css +169 -0
  136. package/src/themes/tidemark/components.css +27 -0
  137. package/src/themes/tidemark/domains.css +72 -0
  138. package/src/themes/tidemark/index.css +6 -0
  139. package/src/themes/tidemark/tokens.css +175 -0
  140. package/src/themes/undertow/base.css +114 -0
  141. package/src/themes/undertow/components.css +22 -0
  142. package/src/themes/undertow/domains.css +19 -0
  143. package/src/themes/undertow/index.css +6 -0
  144. package/src/themes/undertow/tokens.css +171 -0
  145. package/src/themes/vscode/base.css +104 -0
  146. package/src/themes/vscode/components.css +24 -0
  147. package/src/themes/vscode/domains.css +132 -0
  148. package/src/themes/vscode/index.css +13 -0
  149. package/src/themes/vscode/tokens.css +346 -0
package/src/themes/tidemark/base.css ADDED
@@ -0,0 +1,169 @@
1
+ /* Hex — Tidemark Base Styles
2
+ * html/body defaults, scrollbar, focus, selection, transitions.
3
+ * Warm serif headings with linen white canvas.
4
+ */
5
+
6
+ @reference 'tailwindcss';
7
+ @reference './tokens.css';
8
+
9
+ /* Base styles */
10
+ html {
11
+ /* Keep 16px on <html> so Tailwind rem utilities stay correctly sized */
12
+ font-size: 16px;
13
+ }
14
+
15
+ html,
16
+ body {
17
+ @apply bg-background text-foreground font-sans;
18
+
19
+ color-scheme: light;
20
+ -webkit-font-smoothing: antialiased;
21
+ -moz-osx-font-smoothing: grayscale;
22
+ }
23
+
24
+ body {
25
+ /* Match original: 18px body, weight 400, relaxed leading */
26
+ font-size: 18px;
27
+ font-weight: 400;
28
+ line-height: 1.7;
29
+ }
30
+
31
+ /* Heading defaults — serif display headings */
32
+ h1 {
33
+ font-size: 60px;
34
+ font-weight: 700;
35
+ font-family: var(--font-serif);
36
+ color: var(--color-primary);
37
+ margin: 0;
38
+ padding: 0;
39
+ line-height: 1.1;
40
+ }
41
+
42
+ h2 {
43
+ font-size: 48px;
44
+ font-weight: 400;
45
+ font-family: var(--font-serif);
46
+ color: var(--color-primary);
47
+ margin: 0;
48
+ padding: 0;
49
+ line-height: 1.1;
50
+ }
51
+
52
+ /* Scrollbar */
53
+ ::-webkit-scrollbar {
54
+ width: 8px;
55
+ height: 8px;
56
+ }
57
+
58
+ ::-webkit-scrollbar-track {
59
+ background: transparent;
60
+ }
61
+
62
+ ::-webkit-scrollbar-thumb {
63
+ background: color-mix(in srgb, var(--color-foreground) 12%, transparent);
64
+ border-radius: 4px;
65
+ }
66
+
67
+ ::-webkit-scrollbar-thumb:hover {
68
+ background: color-mix(in srgb, var(--color-foreground) 25%, transparent);
69
+ }
70
+
71
+ /* Focus styles */
72
+ *:focus-visible {
73
+ outline: 2px solid var(--color-primary);
74
+ outline-offset: 2px;
75
+ }
76
+
77
+ /* Selection */
78
+ ::selection {
79
+ background: color-mix(in srgb, var(--color-primary) 40%, transparent);
80
+ color: var(--color-foreground);
81
+ }
82
+
83
+ /* Smooth scrolling */
84
+ html {
85
+ scroll-behavior: smooth;
86
+ }
87
+
88
+ /* Reduced motion — disable animations and transitions */
89
+ @media (prefers-reduced-motion: reduce) {
90
+ *,
91
+ *::before,
92
+ *::after {
93
+ animation-duration: 0.01ms !important;
94
+ animation-iteration-count: 1 !important;
95
+ transition-duration: 0.01ms !important;
96
+ scroll-behavior: auto !important;
97
+ }
98
+ }
99
+
100
+ /* Firefox scrollbar */
101
+ * {
102
+ scrollbar-width: thin;
103
+ scrollbar-color: color-mix(in srgb, var(--color-foreground) 12%, transparent) transparent;
104
+ }
105
+
106
+ /* ───────── Scroll-draw SVG utility ───────── */
107
+
108
+ @keyframes scroll-draw-in {
109
+ from {
110
+ stroke-dashoffset: 1;
111
+ }
112
+
113
+ to {
114
+ stroke-dashoffset: 0;
115
+ }
116
+ }
117
+
118
+ .scroll-draw path,
119
+ .scroll-draw line,
120
+ .scroll-draw polyline,
121
+ .scroll-draw polygon,
122
+ .scroll-draw circle,
123
+ .scroll-draw ellipse {
124
+ stroke-dasharray: 1;
125
+ stroke-dashoffset: 1;
126
+ animation: scroll-draw-in linear both;
127
+ animation-timeline: view();
128
+ animation-range: entry 20% cover 50%;
129
+ }
130
+
131
+ @media (prefers-reduced-motion: reduce) {
132
+ .scroll-draw path,
133
+ .scroll-draw line,
134
+ .scroll-draw polyline,
135
+ .scroll-draw polygon,
136
+ .scroll-draw circle,
137
+ .scroll-draw ellipse {
138
+ animation: none;
139
+ stroke-dashoffset: 0;
140
+ }
141
+ }
142
+
143
+ /* ───────── Scroll-reveal utility ───────── */
144
+
145
+ @keyframes scroll-fade-in {
146
+ from {
147
+ opacity: 0;
148
+ transform: translateY(20px);
149
+ }
150
+
151
+ to {
152
+ opacity: 1;
153
+ transform: translateY(0);
154
+ }
155
+ }
156
+
157
+ .scroll-reveal {
158
+ animation: scroll-fade-in linear both;
159
+ animation-timeline: view();
160
+ animation-range: entry 10% cover 30%;
161
+ }
162
+
163
+ @media (prefers-reduced-motion: reduce) {
164
+ .scroll-reveal {
165
+ animation: none;
166
+ opacity: 1;
167
+ transform: none;
168
+ }
169
+ }
package/src/themes/tidemark/components.css ADDED
@@ -0,0 +1,27 @@
1
+ /* Hex — Tidemark Component Barrel
2
+ * Imports shared component CSS (one file per Rig package).
3
+ * Components use only semantic tokens — Tailwind resolves them
4
+ * against this theme's tokens.css at build time.
5
+ * @import rules must precede @reference so postcss-import can inline them.
6
+ */
7
+
8
+ @import '../../shared/rig-defaults.css';
9
+ @import '../../shared/components/core.css';
10
+ @import '../../shared/components/layout.css';
11
+ @import '../../shared/components/nav.css';
12
+ @import '../../shared/components/editor.css';
13
+ @import '../../shared/components/lists.css';
14
+ @import '../../shared/components/menus.css';
15
+ @import '../../shared/components/extras.css';
16
+ @import '../../shared/components/shell.css';
17
+ @import '../../shared/components/data.css';
18
+ @import '../../shared/components/spatial.css';
19
+ @import '../../shared/components/temporal.css';
20
+ @import '../../shared/components/web.css';
21
+ @import '../../shared/a11y.css';
22
+ @import '../../shared/components/prose.css';
23
+ @import '../../shared/utilities.css';
24
+ @import '../../shared/scroll-animations.css';
25
+
26
+ @reference 'tailwindcss';
27
+ @reference './tokens.css';
package/src/themes/tidemark/domains.css ADDED
@@ -0,0 +1,72 @@
1
+ /* Hex — Tidemark Domains
2
+ * Domain accent colors, responsive breakpoints, unstyled overrides.
3
+ * Tidemark is a real estate theme — domains are less relevant
4
+ * but included for contract compatibility.
5
+ */
6
+
7
+ @reference 'tailwindcss';
8
+ @reference './tokens.css';
9
+
10
+ /* ───────── Domain accent colors ───────── */
11
+
12
+ [data-domain='legal'] {
13
+ --domain-accent: #f59e0b;
14
+ }
15
+
16
+ [data-domain='life'] {
17
+ --domain-accent: #14b8a6;
18
+ }
19
+
20
+ [data-domain='software'] {
21
+ --domain-accent: #3b82f6;
22
+ }
23
+
24
+ [data-domain='business'] {
25
+ --domain-accent: #10b981;
26
+ }
27
+
28
+ [data-domain='history'] {
29
+ --domain-accent: #a8a29e;
30
+ }
31
+
32
+ [data-domain='world'] {
33
+ --domain-accent: #8b5cf6;
34
+ }
35
+
36
+ /* ───────── Responsive: Marketing site ───────── */
37
+
38
+ @media (width <= 700px) {
39
+ [data-rig-shell-grid] {
40
+ grid-template-areas:
41
+ 'editor'
42
+ 'panel'
43
+ 'statusbar';
44
+ grid-template-columns: 1fr;
45
+ grid-template-rows: 1fr auto auto;
46
+ }
47
+
48
+ [data-rig-shell-activity] {
49
+ display: none;
50
+ }
51
+
52
+ [data-rig-shell-sidebar] {
53
+ display: none;
54
+ }
55
+ }
56
+
57
+ /* ───────── Unstyled theme overrides ───────── */
58
+
59
+ [data-theme='unstyled'] *,
60
+ [data-theme='unstyled'] *::before,
61
+ [data-theme='unstyled'] *::after {
62
+ color: revert !important;
63
+ background-color: revert !important;
64
+ background: revert !important;
65
+ border-color: revert !important;
66
+ box-shadow: none !important;
67
+ text-shadow: none !important;
68
+ backdrop-filter: none !important;
69
+ opacity: 1 !important;
70
+
71
+ --domain-accent: initial !important;
72
+ }
package/src/themes/tidemark/index.css ADDED
@@ -0,0 +1,6 @@
1
+ @import 'tailwindcss';
2
+ @import '../../shared/tokens.css';
3
+ @import './tokens.css';
4
+ @import './base.css';
5
+ @import './components.css';
6
+ @import './domains.css';
package/src/themes/tidemark/tokens.css ADDED
@@ -0,0 +1,175 @@
1
+ /* Hex — Tidemark Design Tokens
2
+ * Coastal luxury real estate. Warm light mode with cyan accents.
3
+ * Linen white background, charcoal brown text, true cyan primary, terracotta accent.
4
+ * Light mode real estate theme — suited for property listings and luxury brand sites.
5
+ *
6
+ * Full palette (8 swatch colors):
7
+ * #FAF7F2 linen white — background
8
+ * #E8E0D4 warm sand — secondary, muted
9
+ * #B5A898 driftwood — soft neutral
10
+ * #6A8888 muted cyan — muted foreground
11
+ * #2C2420 charcoal brown — foreground text
12
+ * #1A7A7A true cyan — primary brand
13
+ * #C4634F terracotta — accent, destructive
14
+ * #7A9E7E sage — success
15
+ *
16
+ * @theme feeds Tailwind v4 utility generation (bg-background, text-foreground, etc.)
17
+ * :root provides standalone CSS custom property access for non-Tailwind consumers.
18
+ */
19
+
20
+ @theme {
21
+ /* Surface colors */
22
+ --color-background: #faf7f2;
23
+ --color-foreground: #2c2420;
24
+ --color-card: #fffdf8;
25
+ --color-card-foreground: #2c2420;
26
+ --color-popover: #fffdf8;
27
+ --color-popover-foreground: #2c2420;
28
+
29
+ /* Brand */
30
+ --color-primary: #1a7a7a;
31
+ --color-primary-foreground: #fffdf8;
32
+
33
+ /* Soft accents */
34
+ --color-secondary: #e8e0d4;
35
+ --color-secondary-foreground: #2c2420;
36
+ --color-muted: #e8e0d4;
37
+ --color-muted-foreground: #6a8888;
38
+ --color-accent: #c4634f;
39
+ --color-accent-foreground: #fffdf8;
40
+
41
+ /* Semantic status */
42
+ --color-destructive: #c4634f;
43
+ --color-destructive-foreground: #fffdf8;
44
+ --color-success: #7a9e7e;
45
+ --color-warning: #d4a843;
46
+ --color-info: #1a7a7a;
47
+
48
+ /* Borders and focus */
49
+ --color-border: #d4c9b8;
50
+ --color-input: #d4c9b8;
51
+ --color-ring: #1a7a7a;
52
+
53
+ /* Typography */
54
+ --font-sans: 'Source Sans 3', 'Inter', system-ui, sans-serif;
55
+ --font-mono: 'DM Mono', 'SF Mono', ui-monospace, monospace;
56
+ --font-serif: 'Cormorant Garamond', Georgia, serif;
57
+ --font-heading: 'Cormorant Garamond', Georgia, serif;
58
+
59
+ /* Radius */
60
+ /* Typography — IDE-density type scale */
61
+ --font-size-2xs: 0.625rem;
62
+ --font-size-2xs--line-height: 1.25;
63
+ --font-size-xs: 0.75rem;
64
+ --font-size-xs--line-height: 1.5;
65
+ --font-size-sm: 0.8125rem;
66
+ --font-size-sm--line-height: 1.5;
67
+ --font-size-base: 0.875rem;
68
+ --font-size-base--line-height: 1.5;
69
+ --font-size-lg: 1.125rem;
70
+ --font-size-lg--line-height: 1.25;
71
+ --font-size-xl: 1.25rem;
72
+ --font-size-xl--line-height: 1.25;
73
+
74
+ /* Display font family */
75
+ --font-display: var(--font-sans);
76
+
77
+ --radius: 7px;
78
+ }
79
+
80
+ :root {
81
+ --background: #faf7f2;
82
+ --foreground: #2c2420;
83
+ --card: #fffdf8;
84
+ --card-foreground: #2c2420;
85
+ --popover: #fffdf8;
86
+ --popover-foreground: #2c2420;
87
+ --primary: #1a7a7a;
88
+ --primary-foreground: #fffdf8;
89
+ --secondary: #e8e0d4;
90
+ --secondary-foreground: #2c2420;
91
+ --muted: #e8e0d4;
92
+ --muted-foreground: #6a8888;
93
+ --accent: #c4634f;
94
+ --accent-foreground: #fffdf8;
95
+ --destructive: #c4634f;
96
+ --destructive-foreground: #fffdf8;
97
+ --success: #7a9e7e;
98
+ --warning: #d4a843;
99
+ --info: #1a7a7a;
100
+ --border: #d4c9b8;
101
+ --input: #d4c9b8;
102
+ --ring: #1a7a7a;
103
+ /* Typography — IDE-density type scale */
104
+ --font-size-2xs: 0.625rem;
105
+ --font-size-2xs--line-height: 1.25;
106
+ --font-size-xs: 0.75rem;
107
+ --font-size-xs--line-height: 1.5;
108
+ --font-size-sm: 0.8125rem;
109
+ --font-size-sm--line-height: 1.5;
110
+ --font-size-base: 0.875rem;
111
+ --font-size-base--line-height: 1.5;
112
+ --font-size-lg: 1.125rem;
113
+ --font-size-lg--line-height: 1.25;
114
+ --font-size-xl: 1.25rem;
115
+ --font-size-xl--line-height: 1.25;
116
+
117
+ /* Display font family */
118
+ --font-display: var(--font-sans);
119
+
120
+ --radius: 7px;
121
+
122
+ /* Typography — IDE-density type scale (shorthand aliases) */
123
+ --text-2xs: 0.625rem;
124
+ --text-xs: 0.75rem;
125
+ --text-sm: 0.8125rem;
126
+ --text-base: 0.875rem;
127
+ --text-lg: 1.125rem;
128
+ --text-xl: 1.25rem;
129
+ --leading-tight: 1.25;
130
+ --leading-snug: 1.375;
131
+ --leading-normal: 1.5;
132
+ --leading-relaxed: 1.625;
133
+ --weight-normal: 400;
134
+ --weight-medium: 500;
135
+ --weight-semibold: 600;
136
+ --weight-bold: 700;
137
+ --tracking-tight: -0.01em;
138
+ --tracking-normal: 0;
139
+ --tracking-wide: 0.05em;
140
+ --tracking-wider: 0.08em;
141
+ --font-display: var(--font-sans);
142
+ --font-sans: 'Source Sans 3', 'Inter', system-ui, sans-serif;
143
+ --font-mono: 'DM Mono', 'SF Mono', ui-monospace, monospace;
144
+ --font-serif: 'Cormorant Garamond', Georgia, serif;
145
+ --font-heading: 'Cormorant Garamond', Georgia, serif;
146
+
147
+ /* ── Named palette aliases ──────────────────────────────────────────────
148
+ * All 8 swatch colors available for direct template use.
149
+ */
150
+ --tm-linen: #faf7f2;
151
+ --tm-sand: #e8e0d4;
152
+ --tm-driftwood: #b5a898;
153
+ --tm-charcoal: #2c2420;
154
+ --tm-clay: #6a8888;
155
+ --tm-cyan: #1a7a7a;
156
+ --tm-terracotta: #c4634f;
157
+ --tm-sage: #7a9e7e;
158
+
159
+ /* ── Rig component token bridge ─────────────────────────────────────────
160
+ * Overrides shared/tokens.css defaults where the Tidemark palette needs
161
+ * values that can't be derived directly from --color-* semantics.
162
+ */
163
+
164
+ /* Button — warm sand for hover feedback */
165
+ --rig-button-hover-bg: #156a6a;
166
+ --rig-button-hover-fg: #fffdf8;
167
+ --rig-button-secondary-bg: transparent;
168
+ --rig-button-secondary-fg: var(--color-foreground);
169
+ --rig-button-secondary-hover-bg: #e8e0d4;
170
+ --rig-button-secondary-hover-fg: var(--color-foreground);
171
+
172
+ /* Scrollbar — charcoal brown tint for light mode */
173
+ --rig-scrollbar-thumb: rgba(44, 36, 32, 0.15);
174
+ --rig-scrollbar-thumb-hover: rgba(44, 36, 32, 0.3);
175
+ }
package/src/themes/undertow/base.css ADDED
@@ -0,0 +1,114 @@
1
+ /* Hex — Undertow Base Styles
2
+ * Gritty dark brewery — Archivo Black display, Work Sans body.
3
+ */
4
+
5
+ @reference 'tailwindcss';
6
+ @reference './tokens.css';
7
+
8
+ html {
9
+ font-size: 16px;
10
+ }
11
+
12
+ html,
13
+ body {
14
+ @apply bg-background text-foreground font-sans;
15
+ color-scheme: dark;
16
+ -webkit-font-smoothing: antialiased;
17
+ -moz-osx-font-smoothing: grayscale;
18
+ }
19
+
20
+ body {
21
+ font-size: 17px;
22
+ font-weight: 400;
23
+ line-height: 1.6;
24
+ }
25
+
26
+ h1 {
27
+ font-size: 64px;
28
+ font-weight: 900;
29
+ font-family: var(--font-serif);
30
+ color: var(--color-primary);
31
+ margin: 0;
32
+ padding: 0;
33
+ line-height: 1;
34
+ text-transform: uppercase;
35
+ letter-spacing: -0.02em;
36
+ }
37
+
38
+ h2 {
39
+ font-size: 42px;
40
+ font-weight: 700;
41
+ font-family: 'Archivo', var(--font-sans);
42
+ color: var(--color-foreground);
43
+ margin: 0;
44
+ padding: 0;
45
+ line-height: 1.1;
46
+ text-transform: uppercase;
47
+ }
48
+
49
+ ::-webkit-scrollbar {
50
+ width: 8px;
51
+ height: 8px;
52
+ }
53
+ ::-webkit-scrollbar-track {
54
+ background: transparent;
55
+ }
56
+ ::-webkit-scrollbar-thumb {
57
+ background: color-mix(in srgb, var(--color-foreground) 15%, transparent);
58
+ border-radius: 4px;
59
+ }
60
+ ::-webkit-scrollbar-thumb:hover {
61
+ background: color-mix(in srgb, var(--color-foreground) 25%, transparent);
62
+ }
63
+
64
+ *:focus-visible {
65
+ outline: 2px solid var(--color-primary);
66
+ outline-offset: 2px;
67
+ }
68
+ ::selection {
69
+ background: color-mix(in srgb, var(--color-primary) 40%, transparent);
70
+ color: var(--color-foreground);
71
+ }
72
+
73
+ html {
74
+ scroll-behavior: smooth;
75
+ }
76
+
77
+ @media (prefers-reduced-motion: reduce) {
78
+ *,
79
+ *::before,
80
+ *::after {
81
+ animation-duration: 0.01ms !important;
82
+ animation-iteration-count: 1 !important;
83
+ transition-duration: 0.01ms !important;
84
+ scroll-behavior: auto !important;
85
+ }
86
+ }
87
+
88
+ * {
89
+ scrollbar-width: thin;
90
+ scrollbar-color: color-mix(in srgb, var(--color-foreground) 15%, transparent) transparent;
91
+ }
92
+
93
+ @keyframes scroll-fade-in {
94
+ from {
95
+ opacity: 0;
96
+ transform: translateY(20px);
97
+ }
98
+ to {
99
+ opacity: 1;
100
+ transform: translateY(0);
101
+ }
102
+ }
103
+ .scroll-reveal {
104
+ animation: scroll-fade-in linear both;
105
+ animation-timeline: view();
106
+ animation-range: entry 10% cover 30%;
107
+ }
108
+ @media (prefers-reduced-motion: reduce) {
109
+ .scroll-reveal {
110
+ animation: none;
111
+ opacity: 1;
112
+ transform: none;
113
+ }
114
+ }
package/src/themes/undertow/components.css ADDED
@@ -0,0 +1,22 @@
1
+ /* Hex — Undertow Component Barrel */
2
+
3
+ @import '../../shared/rig-defaults.css';
4
+ @import '../../shared/components/core.css';
5
+ @import '../../shared/components/layout.css';
6
+ @import '../../shared/components/nav.css';
7
+ @import '../../shared/components/editor.css';
8
+ @import '../../shared/components/lists.css';
9
+ @import '../../shared/components/menus.css';
10
+ @import '../../shared/components/extras.css';
11
+ @import '../../shared/components/shell.css';
12
+ @import '../../shared/components/data.css';
13
+ @import '../../shared/components/spatial.css';
14
+ @import '../../shared/components/temporal.css';
15
+ @import '../../shared/components/web.css';
16
+ @import '../../shared/a11y.css';
17
+ @import '../../shared/components/prose.css';
18
+ @import '../../shared/utilities.css';
19
+ @import '../../shared/scroll-animations.css';
20
+
21
+ @reference 'tailwindcss';
22
+ @reference './tokens.css';
package/src/themes/undertow/domains.css ADDED
@@ -0,0 +1,19 @@
1
+ /* Hex — Undertow Domains */
2
+ @reference 'tailwindcss';
3
+ @reference './tokens.css';
4
+
5
+ [data-domain='legal'] {
6
+ --domain-accent: #c9b458;
7
+ }
8
+ [data-domain='life'] {
9
+ --domain-accent: #d95f2a;
10
+ }
11
+ [data-domain='software'] {
12
+ --domain-accent: #6b8faa;
13
+ }
14
+ [data-domain='business'] {
15
+ --domain-accent: #d95f2a;
16
+ }
17
+ [data-domain='history'] {
18
+ --domain-accent: #a8a09a;
19
+ }
package/src/themes/undertow/index.css ADDED
@@ -0,0 +1,6 @@
1
+ @import 'tailwindcss';
2
+ @import '../../shared/tokens.css';
3
+ @import './tokens.css';
4
+ @import './base.css';
5
+ @import './components.css';
6
+ @import './domains.css';