@koehler8/cms-theme-southpark 1.0.2

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.
package/LICENSE ADDED
@@ -0,0 +1,21 @@
1
+ MIT License
2
+
3
+ Copyright (c) 2026 koehler8
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining a copy
6
+ of this software and associated documentation files (the "Software"), to deal
7
+ in the Software without restriction, including without limitation the rights
8
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
+ copies of the Software, and to permit persons to whom the Software is
10
+ furnished to do so, subject to the following conditions:
11
+
12
+ The above copyright notice and this permission notice shall be included in all
13
+ copies or substantial portions of the Software.
14
+
15
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
+ SOFTWARE.
package/README.md ADDED
@@ -0,0 +1,44 @@
1
+ # @koehler8/cms-theme-southpark — Alpine Dawn
2
+
3
+ - **Slug**: `southpark`
4
+ - **Version**: 1.0.1
5
+ - **Author**: koehler8
6
+
7
+ ## Install
8
+
9
+ ```bash
10
+ npm install @koehler8/cms-theme-southpark
11
+ ```
12
+
13
+ ```js
14
+ // vite.config.js
15
+ import cms from '@koehler8/cms/vite';
16
+
17
+ export default {
18
+ plugins: cms({ siteDir: './site', themes: ['@koehler8/cms-theme-southpark'] }),
19
+ };
20
+ ```
21
+
22
+ Set `site.theme` to `"southpark"` in your site config. If CDN font access is restricted, host the Google Font files locally and adjust the import.
23
+
24
+ ## Visual Direction
25
+ - Pastel alpine palette with warm sunlight gradients, cool sky blues, and charcoal cards for contrast.
26
+ - Light body canvas paired with dark cards and amber highlights keeps legal/operations pages readable while preserving a playful hero look.
27
+ - CTA gradients blend sky blue→green→amber; badges and chips lean on sunshine yellows.
28
+
29
+ ## Token Highlights
30
+ - Card/chrome tokens favor semi-transparent dark overlays with creamy text; helper/tabs/fields mirror the same contrast rules.
31
+ - Countdown/status/chart tokens emphasize amber digits over dark cards; modal surfaces stay light for accessibility.
32
+ - Input/field tokens include explicit focus/placeholder colors plus `field-group` overrides to keep forms consistent across legacy components.
33
+
34
+ ## Compatibility Notes
35
+ - Great for playful consumer drops or outdoor-inspired brands; pair with photography or illustrated scenery.
36
+ - The theme sets background-attachment fixed on `body` to keep gradients anchored—avoid layering conflicting site-level backgrounds unless you remove or override that rule.
37
+
38
+ ## Contributing
39
+
40
+ See [CONTRIBUTING.md](./CONTRIBUTING.md) for guidelines.
41
+
42
+ ## License
43
+
44
+ [MIT](./LICENSE)
package/index.js ADDED
@@ -0,0 +1,5 @@
1
+ import manifest from './theme.config.js';
2
+ import css from './theme.css?inline';
3
+
4
+ export default { manifest, css };
5
+ export { manifest };
package/package.json ADDED
@@ -0,0 +1,31 @@
1
+ {
2
+ "name": "@koehler8/cms-theme-southpark",
3
+ "version": "1.0.2",
4
+ "description": "Alpine Dawn theme for Vertex CMS — warm light palette with orange/blue/green accents",
5
+ "author": "koehler8",
6
+ "license": "MIT",
7
+ "keywords": ["cms", "theme", "koehler8", "southpark", "alpine"],
8
+ "homepage": "https://github.com/koehler8/cms-theme-southpark#readme",
9
+ "bugs": {
10
+ "url": "https://github.com/koehler8/cms-theme-southpark/issues"
11
+ },
12
+ "type": "module",
13
+ "exports": {
14
+ ".": "./index.js",
15
+ "./config": "./theme.config.js"
16
+ },
17
+ "files": [
18
+ "index.js",
19
+ "theme.config.js",
20
+ "theme.css",
21
+ "README.md",
22
+ "LICENSE"
23
+ ],
24
+ "peerDependencies": {
25
+ "@koehler8/cms": "^1.0.0-beta.1"
26
+ },
27
+ "repository": {
28
+ "type": "git",
29
+ "url": "git+https://github.com/koehler8/cms-theme-southpark.git"
30
+ }
31
+ }
@@ -0,0 +1,213 @@
1
+ export default {
2
+ "slug": "southpark",
3
+ "meta": {
4
+ "name": "Alpine Dawn",
5
+ "version": "1.0.0",
6
+ "author": "koehler8"
7
+ },
8
+ "tokens": {
9
+ "palette": {
10
+ "primary": "#f26938",
11
+ "primaryAccent": "#4a5b75",
12
+ "secondary": "#6ec7f7",
13
+ "accent": "#f8d359",
14
+ "accentSoft": "rgba(110, 199, 247, 0.22)",
15
+ "neutral": "#fff5dc",
16
+ "neutralStrong": "#1f2a34",
17
+ "neutralSoft": "#4f5f6f",
18
+ "inverse": "#0a0a0d",
19
+ "success": "#5bbf8a",
20
+ "info": "#6ec7f7",
21
+ "warning": "#f8d359",
22
+ "critical": "#c24136",
23
+ "criticalSoft": "rgba(194, 65, 54, 0.22)"
24
+ },
25
+ "text": {
26
+ "primary": "#1f2a34",
27
+ "muted": "#4f5f6f",
28
+ "mutedStrong": "#2f3e4a",
29
+ "inverse": "#0a0a0d",
30
+ "accent": "#6ec7f7",
31
+ "onAccent": "#1a242b",
32
+ "card": "rgba(255, 248, 230, 0.95)"
33
+ },
34
+ "surfaces": {
35
+ "base": "#fff5dc",
36
+ "baseAlt": "#f9edcd",
37
+ "raised": "#f1e1bd",
38
+ "sunken": "#f9edcd",
39
+ "callout": "rgba(110, 199, 247, 0.16)",
40
+ "card": "rgba(31, 42, 52, 0.92)",
41
+ "cardAlt": "rgba(31, 42, 52, 0.92)",
42
+ "overlay": "#fff9ef",
43
+ "backdrop": "rgba(31, 42, 52, 0.65)",
44
+ "border": "rgba(110, 199, 247, 0.32)",
45
+ "divider": "rgba(248, 211, 89, 0.55)",
46
+ "input": "rgba(255, 249, 238, 0.94)",
47
+ "chip": "rgba(248, 211, 89, 0.35)",
48
+ "chipAccent": "#5b3f12",
49
+ "helper": {
50
+ "background": "rgba(110, 199, 247, 0.16)",
51
+ "hover": "rgba(110, 199, 247, 0.28)",
52
+ "text": "rgba(255, 245, 220, 0.9)",
53
+ "border": "rgba(110, 199, 247, 0.32)",
54
+ "heading": "rgba(255, 245, 220, 0.95)",
55
+ "body": "rgba(255, 248, 230, 0.85)",
56
+ "hoverColor": "#2a87c6"
57
+ },
58
+ "tabs": {
59
+ "background": "rgba(31, 42, 52, 0.92)",
60
+ "border": "rgba(110, 199, 247, 0.3)",
61
+ "shadow": "0 18px 34px rgba(31, 42, 52, 0.3)",
62
+ "tabColor": "rgba(255, 245, 220, 0.75)",
63
+ "activeBackground": "rgba(248, 211, 89, 0.92)",
64
+ "activeColor": "#1f2a34",
65
+ "activeShadow": "0 18px 40px rgba(31, 42, 52, 0.38), inset 0 1px 0 rgba(255, 255, 255, 0.4)",
66
+ "stepBackground": "rgba(255, 245, 220, 0.15)",
67
+ "stepBorder": "rgba(255, 245, 220, 0.35)",
68
+ "stepColor": "#fff5dc",
69
+ "activeStepBackground": "rgba(248, 211, 89, 0.85)",
70
+ "activeStepBorder": "rgba(110, 199, 247, 0.45)",
71
+ "activeStepColor": "#1f2a34"
72
+ },
73
+ "field": {
74
+ "background": "rgba(20, 28, 36, 0.92)",
75
+ "border": "rgba(110, 199, 247, 0.35)",
76
+ "shadow": "inset 0 0 0 1px rgba(110, 199, 247, 0.08), 0 10px 24px rgba(11, 18, 26, 0.45)",
77
+ "addonBackground": "transparent",
78
+ "addonBorder": "rgba(110, 199, 247, 0.35)",
79
+ "addonColor": "rgba(255, 245, 220, 0.92)",
80
+ "inputColor": "rgba(255, 245, 220, 0.92)",
81
+ "inputPlaceholder": "rgba(255, 248, 230, 0.55)"
82
+ },
83
+ "strip": {
84
+ "background": "rgba(31, 42, 52, 0.92)",
85
+ "border": "rgba(110, 199, 247, 0.32)",
86
+ "text": "rgba(255, 245, 220, 0.9)"
87
+ },
88
+ "chrome": {
89
+ "background": "#1f2a34",
90
+ "text": "rgba(255, 245, 220, 0.95)",
91
+ "shadow": "0 18px 45px rgba(31, 42, 52, 0.45)",
92
+ "compactShadow": "0 12px 32px rgba(31, 42, 52, 0.55)"
93
+ },
94
+ "backdropPrimary": {
95
+ "background": "linear-gradient(135deg, rgba(110, 199, 247, 0.35), rgba(91, 191, 138, 0.28))",
96
+ "before": "none",
97
+ "after": "none"
98
+ },
99
+ "backdropSecondary": {
100
+ "background": "linear-gradient(135deg, rgba(110, 199, 247, 0.35), rgba(91, 191, 138, 0.28))",
101
+ "before": "none",
102
+ "after": "none"
103
+ }
104
+ },
105
+ "typography": {
106
+ "bodyFamily": "\"Inter\", \"Segoe UI\", system-ui, -apple-system, BlinkMacSystemFont, sans-serif",
107
+ "headingFamily": "\"Clash Display\", \"Inter\", \"Segoe UI\", system-ui, -apple-system, BlinkMacSystemFont, sans-serif",
108
+ "monoFamily": "\"JetBrains Mono\", \"SFMono-Regular\", Menlo, Consolas, monospace",
109
+ "baseSize": "16px",
110
+ "scale": 1.125,
111
+ "weightRegular": 400,
112
+ "weightMedium": 500,
113
+ "weightBold": 600,
114
+ "letterSpacingTight": "-0.015em",
115
+ "letterSpacingWide": "0.08em"
116
+ },
117
+ "ctas": {
118
+ "primary": {
119
+ "bg": "linear-gradient(135deg, #6ec7f7 0%, #5bbf8a 55%, #f8d359 100%)",
120
+ "text": "#1a242b",
121
+ "border": "1px solid rgba(255, 245, 220, 0.3)",
122
+ "hoverBg": "linear-gradient(135deg, #6ec7f7 0%, #5bbf8a 55%, #f8d359 100%)",
123
+ "hoverBorder": "1px solid rgba(255, 245, 220, 0.3)",
124
+ "shadow": "0 16px 40px rgba(110, 199, 247, 0.28)"
125
+ },
126
+ "secondary": {
127
+ "bg": "rgba(31, 42, 52, 0.92)",
128
+ "text": "#1f2a34",
129
+ "border": "rgba(110, 199, 247, 0.32)",
130
+ "hoverBg": "rgba(110, 199, 247, 0.16)",
131
+ "hoverBorder": "rgba(110, 199, 247, 0.32)",
132
+ "shadow": "0 28px 56px rgba(31, 42, 52, 0.32)"
133
+ },
134
+ "ghost": {
135
+ "bg": "transparent",
136
+ "text": "#f26938",
137
+ "border": "rgba(110, 199, 247, 0.32)",
138
+ "hoverBg": "rgba(110, 199, 247, 0.16)",
139
+ "hoverBorder": "rgba(110, 199, 247, 0.32)",
140
+ "shadow": "none"
141
+ },
142
+ "link": {
143
+ "text": "#f26938",
144
+ "hoverText": "#f8d359",
145
+ "underline": "rgba(110, 199, 247, 0.32)"
146
+ }
147
+ },
148
+ "chips": {
149
+ "neutral": {
150
+ "bg": "rgba(248, 211, 89, 0.35)",
151
+ "text": "rgba(255, 245, 220, 0.9)",
152
+ "border": "rgba(110, 199, 247, 0.32)"
153
+ },
154
+ "accent": {
155
+ "bg": "rgba(110, 199, 247, 0.22)",
156
+ "text": "#0a0a0d",
157
+ "border": "rgba(110, 199, 247, 0.32)"
158
+ },
159
+ "outline": {
160
+ "bg": "transparent",
161
+ "text": "#f26938",
162
+ "border": "rgba(110, 199, 247, 0.32)"
163
+ }
164
+ },
165
+ "focus": {
166
+ "ring": "0 0 0 2px rgba(110, 199, 247, 0.45)",
167
+ "ringMuted": "0 0 0 1px rgba(110, 199, 247, 0.45)",
168
+ "outline": "rgba(110, 199, 247, 0.55)",
169
+ "shadowInset": "0 0 18px rgba(248, 211, 89, 0.35)"
170
+ },
171
+ "radii": {
172
+ "sm": "8px",
173
+ "md": "14px",
174
+ "lg": "24px",
175
+ "pill": "999px",
176
+ "full": "50%"
177
+ },
178
+ "elevation": {
179
+ "flat": "0 28px 56px rgba(31, 42, 52, 0.32)",
180
+ "raised": "0 16px 40px rgba(110, 199, 247, 0.28)",
181
+ "overlay": "0 24px 52px rgba(91, 191, 138, 0.34)"
182
+ },
183
+ "utility": {
184
+ "divider": "rgba(110, 199, 247, 0.32)",
185
+ "inputBorder": "rgba(47, 62, 74, 0.18)",
186
+ "inputText": "#1f2a34",
187
+ "inputPlaceholder": "rgba(31, 42, 52, 0.52)",
188
+ "selectionBg": "rgba(110, 199, 247, 0.22)",
189
+ "selectionText": "#0a0a0d",
190
+ "gradientHero": "linear-gradient(135deg, rgba(110, 199, 247, 0.35), rgba(91, 191, 138, 0.28))",
191
+ "gradientPromo": "linear-gradient(135deg, rgba(110, 199, 247, 0.35), rgba(91, 191, 138, 0.28))",
192
+ "bodyBackground": [
193
+ "radial-gradient(circle at 14% 6%, rgba(248, 211, 89, 0.42), transparent 45%)",
194
+ "radial-gradient(circle at 82% 0%, rgba(110, 199, 247, 0.38), transparent 52%)",
195
+ "linear-gradient(180deg, #c7e6f6 0%, #bfe0ef 32%, #bcd7c3 55%, #fff5dc 100%)"
196
+ ],
197
+ "modalSurface": "#fff9ef",
198
+ "modalBorder": "rgba(31, 42, 52, 0.12)",
199
+ "modalShadow": "0 24px 54px rgba(31, 42, 52, 0.25)",
200
+ "modalRadius": "24px",
201
+ "chartTrack": "rgba(255, 248, 230, 0.28)",
202
+ "chartCenterText": "rgba(255, 248, 230, 0.95)",
203
+ "statusHeadline": {
204
+ "background": "linear-gradient(135deg, rgba(110, 199, 247, 0.28), rgba(91, 191, 138, 0.22))",
205
+ "color": "rgba(255, 245, 220, 0.95)",
206
+ "shadow": "0 18px 32px rgba(31, 42, 52, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.2)"
207
+ }
208
+ }
209
+ },
210
+ "assets": {
211
+ "css": "./theme.css"
212
+ }
213
+ };
package/theme.css ADDED
@@ -0,0 +1,801 @@
1
+ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Space+Grotesk:wght@400;600;700&display=swap');
2
+
3
+ :root[data-site-theme="southpark"] {
4
+ --brand-neon-pink: #f26938;
5
+ --brand-crimson-red: #c24136;
6
+ --brand-sultry-purple: #4a5b75;
7
+ --brand-electric-blue: #6ec7f7;
8
+ --brand-amber-heat: #f8d359;
9
+ --brand-deep-violet: #1f2a34;
10
+
11
+ --brand-bg-900: #fff5dc;
12
+ --brand-bg-800: #f9edcd;
13
+ --brand-bg-700: #f1e1bd;
14
+ --brand-fg-100: #1f2a34;
15
+ --brand-fg-200: #2f3e4a;
16
+ --brand-fg-300: #4f5f6f;
17
+
18
+ --brand-radius-sm: 8px;
19
+ --brand-radius-md: 14px;
20
+ --brand-radius-lg: 24px;
21
+
22
+ --brand-gradient-ignition: linear-gradient(
23
+ 135deg,
24
+ #6ec7f7 0%,
25
+ #5bbf8a 55%,
26
+ #f8d359 100%
27
+ );
28
+ --brand-shadow-glow: 0 16px 40px rgba(110, 199, 247, 0.28);
29
+ --brand-shadow-glow-strong: 0 24px 52px rgba(91, 191, 138, 0.34);
30
+ --brand-chart-track: rgba(255, 248, 230, 0.28);
31
+ --brand-chart-center-text: rgba(255, 248, 230, 0.95);
32
+ --brand-cta-text: #1a242b;
33
+
34
+ --brand-accent-electric: var(--brand-electric-blue);
35
+ --brand-accent-electric-soft: rgba(110, 199, 247, 0.22);
36
+ --brand-accent-warm: var(--brand-amber-heat);
37
+
38
+ --brand-card-soft: rgba(31, 42, 52, 0.92);
39
+ --brand-card-border: rgba(110, 199, 247, 0.32);
40
+ --brand-card-shadow: 0 28px 56px rgba(31, 42, 52, 0.32);
41
+ --brand-card-text: rgba(255, 248, 230, 0.95);
42
+
43
+ --brand-primary-cta-gradient: var(--brand-gradient-ignition);
44
+ --brand-primary-cta-text: var(--brand-cta-text);
45
+ --brand-primary-cta-shadow: var(--brand-shadow-glow);
46
+ --brand-primary-cta-hover-shadow: var(--brand-shadow-glow-strong);
47
+ --brand-primary-cta-hover-translate: translateY(-1px);
48
+
49
+ --brand-surface-card-bg: var(--brand-card-soft);
50
+ --brand-surface-card-border: var(--brand-card-border);
51
+ --brand-surface-card-shadow: var(--brand-card-shadow);
52
+ --brand-surface-helper-bg: rgba(91, 191, 138, 0.16);
53
+ --brand-surface-helper-hover-bg: rgba(91, 191, 138, 0.28);
54
+ --brand-card-radius: var(--brand-radius-lg);
55
+ --brand-button-radius: var(--brand-radius-md);
56
+
57
+ --brand-icon-badge-bg: rgba(248, 211, 89, 0.35);
58
+ --brand-icon-badge-color: #5b3f12;
59
+
60
+ --brand-pill-gradient: linear-gradient(
61
+ 135deg,
62
+ var(--brand-amber-heat) 0%,
63
+ #f08b3e 45%,
64
+ var(--brand-electric-blue) 100%
65
+ );
66
+ --brand-pill-alt-gradient: linear-gradient(
67
+ 135deg,
68
+ var(--brand-electric-blue) 0%,
69
+ #5bbf8a 100%
70
+ );
71
+ --brand-pill-contrast: #1f2a34;
72
+
73
+ --brand-border-highlight: rgba(248, 211, 89, 0.55);
74
+ --brand-border-glow: rgba(110, 199, 247, 0.45);
75
+
76
+ --brand-status-success: #5bbf8a;
77
+ --brand-status-error: var(--brand-crimson-red);
78
+ --brand-status-error-soft: rgba(194, 65, 54, 0.22);
79
+
80
+ --brand-input-bg: rgba(255, 249, 238, 0.94);
81
+ --brand-input-border: rgba(47, 62, 74, 0.18);
82
+ --brand-input-border-active: rgba(110, 199, 247, 0.55);
83
+ --brand-input-text: var(--brand-fg-100);
84
+ --brand-input-placeholder: rgba(31, 42, 52, 0.52);
85
+ --brand-focus-ring: 0 0 0 2px rgba(110, 199, 247, 0.45);
86
+ --brand-focus-glow: 0 0 18px rgba(248, 211, 89, 0.35);
87
+
88
+ --brand-modal-backdrop: rgba(31, 42, 52, 0.65);
89
+ --brand-modal-surface: #fff9ef;
90
+ --brand-modal-border: rgba(31, 42, 52, 0.12);
91
+ --brand-modal-shadow: 0 24px 54px rgba(31, 42, 52, 0.25);
92
+ --brand-modal-radius: var(--brand-radius-lg);
93
+
94
+ --brand-countdown-digit: var(--brand-amber-heat);
95
+ --brand-countdown-label: rgba(255, 245, 220, 0.82);
96
+ }
97
+
98
+ [data-site-theme="southpark"] body {
99
+ font-family: 'Inter', 'Space Grotesk', -apple-system, BlinkMacSystemFont, 'Helvetica Neue', sans-serif;
100
+ color: var(--brand-fg-100);
101
+ background:
102
+ radial-gradient(circle at 14% 6%, rgba(248, 211, 89, 0.42), transparent 45%),
103
+ radial-gradient(circle at 82% 0%, rgba(110, 199, 247, 0.38), transparent 52%),
104
+ linear-gradient(180deg, #c7e6f6 0%, #bfe0ef 32%, #bcd7c3 55%, #fff5dc 100%);
105
+ background-attachment: fixed;
106
+ min-height: 100vh;
107
+ }
108
+
109
+ [data-site-theme="southpark"] .container {
110
+ max-width: min(1180px, 92vw);
111
+ margin-left: auto;
112
+ margin-right: auto;
113
+ }
114
+
115
+ [data-site-theme="southpark"] .container-fluid {
116
+ padding-left: clamp(16px, 4vw, 48px);
117
+ padding-right: clamp(16px, 4vw, 48px);
118
+ }
119
+
120
+ [data-site-theme="southpark"] h1,
121
+ [data-site-theme="southpark"] h2,
122
+ [data-site-theme="southpark"] h3,
123
+ [data-site-theme="southpark"] h4,
124
+ [data-site-theme="southpark"] h5,
125
+ [data-site-theme="southpark"] h6 {
126
+ font-family: 'Space Grotesk', 'Inter', -apple-system, BlinkMacSystemFont, 'Helvetica Neue', sans-serif;
127
+ color: var(--brand-fg-100);
128
+ letter-spacing: 0.01em;
129
+ }
130
+
131
+ [data-site-theme="southpark"] a {
132
+ color: var(--brand-electric-blue);
133
+ text-decoration: none;
134
+ }
135
+
136
+ [data-site-theme="southpark"] a:hover,
137
+ [data-site-theme="southpark"] a:focus {
138
+ color: #2a87c6;
139
+ text-decoration: underline;
140
+ }
141
+
142
+ [data-site-theme="southpark"] input,
143
+ [data-site-theme="southpark"] select,
144
+ [data-site-theme="southpark"] textarea {
145
+ background: var(--brand-input-bg);
146
+ border: 1px solid var(--brand-input-border);
147
+ color: var(--brand-input-text);
148
+ border-radius: var(--brand-button-radius);
149
+ transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
150
+ }
151
+
152
+ [data-site-theme="southpark"] input::placeholder,
153
+ [data-site-theme="southpark"] textarea::placeholder {
154
+ color: var(--brand-input-placeholder);
155
+ }
156
+
157
+ [data-site-theme="southpark"] input:focus,
158
+ [data-site-theme="southpark"] select:focus,
159
+ [data-site-theme="southpark"] textarea:focus {
160
+ outline: 2px solid transparent;
161
+ border-color: var(--brand-input-border-active);
162
+ box-shadow: var(--brand-focus-ring), var(--brand-focus-glow);
163
+ }
164
+
165
+ [data-site-theme="southpark"] button:focus-visible,
166
+ [data-site-theme="southpark"] a:focus-visible {
167
+ outline: 2px solid var(--brand-accent-electric);
168
+ outline-offset: 3px;
169
+ }
170
+
171
+ [data-site-theme="southpark"] .primary-button {
172
+ background: var(--brand-primary-cta-gradient);
173
+ border: none;
174
+ border-radius: var(--brand-button-radius);
175
+ color: var(--brand-primary-cta-text);
176
+ box-shadow: var(--brand-primary-cta-shadow);
177
+ transition: transform 0.16s ease, box-shadow 0.2s ease;
178
+ position: relative;
179
+ overflow: hidden;
180
+ }
181
+
182
+ [data-site-theme="southpark"] .primary-button:hover,
183
+ [data-site-theme="southpark"] .primary-button:focus-visible {
184
+ transform: var(--brand-primary-cta-hover-translate);
185
+ box-shadow: var(--brand-primary-cta-hover-shadow);
186
+ }
187
+
188
+ [data-site-theme="southpark"] .sticky-cta__button,
189
+ [data-site-theme="southpark"] .primary-button,
190
+ [data-site-theme="southpark"] .curiosity-teaser__cta {
191
+ filter: brightness(1);
192
+ will-change: box-shadow, filter;
193
+ }
194
+
195
+ @media (prefers-reduced-motion: no-preference) {
196
+ [data-site-theme="southpark"] .sticky-cta__button,
197
+ [data-site-theme="southpark"] .primary-button,
198
+ [data-site-theme="southpark"] .curiosity-teaser__cta {
199
+ animation: southparkGlowPulse 8s ease-in-out infinite;
200
+ }
201
+
202
+ [data-site-theme="southpark"] .sticky-cta__button::after,
203
+ [data-site-theme="southpark"] .primary-button::after,
204
+ [data-site-theme="southpark"] .curiosity-teaser__cta::after {
205
+ content: '';
206
+ position: absolute;
207
+ inset: 0;
208
+ background: linear-gradient(120deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.18), rgba(255, 255, 255, 0));
209
+ transform: translateX(-130%);
210
+ pointer-events: none;
211
+ mix-blend-mode: screen;
212
+ animation: southparkButtonShimmer 5.5s ease-in-out infinite;
213
+ }
214
+ }
215
+
216
+ @media (prefers-reduced-motion: reduce) {
217
+ [data-site-theme="southpark"] .sticky-cta__button,
218
+ [data-site-theme="southpark"] .primary-button,
219
+ [data-site-theme="southpark"] .curiosity-teaser__cta {
220
+ animation: none !important;
221
+ filter: none;
222
+ }
223
+
224
+ [data-site-theme="southpark"] .sticky-cta__button::after,
225
+ [data-site-theme="southpark"] .primary-button::after,
226
+ [data-site-theme="southpark"] .curiosity-teaser__cta::after {
227
+ display: none;
228
+ }
229
+ }
230
+
231
+ @keyframes southparkButtonShimmer {
232
+ 0% {
233
+ transform: translateX(-130%);
234
+ opacity: 0;
235
+ }
236
+ 35% {
237
+ opacity: 0.75;
238
+ }
239
+ 55% {
240
+ transform: translateX(125%);
241
+ opacity: 0.45;
242
+ }
243
+ 100% {
244
+ transform: translateX(145%);
245
+ opacity: 0;
246
+ }
247
+ }
248
+
249
+ @keyframes southparkGlowPulse {
250
+ 0%,
251
+ 25% {
252
+ box-shadow: var(--brand-primary-cta-shadow);
253
+ filter: brightness(1);
254
+ }
255
+ 35% {
256
+ box-shadow: 0 24px 48px rgba(110, 199, 247, 0.35);
257
+ filter: brightness(1.05);
258
+ }
259
+ 50% {
260
+ box-shadow: 0 18px 36px rgba(91, 191, 138, 0.32);
261
+ filter: brightness(0.95);
262
+ }
263
+ 65% {
264
+ box-shadow: 0 26px 52px rgba(248, 211, 89, 0.4);
265
+ filter: brightness(1.08);
266
+ }
267
+ 100% {
268
+ box-shadow: var(--brand-primary-cta-shadow);
269
+ filter: brightness(1);
270
+ }
271
+ }
272
+
273
+ [data-site-theme="southpark"] .status-card h1,
274
+ [data-site-theme="southpark"] .status-card h2,
275
+ [data-site-theme="southpark"] .status-card h3,
276
+ [data-site-theme="southpark"] .status-card h4,
277
+ [data-site-theme="southpark"] .status-card h5,
278
+ [data-site-theme="southpark"] .status-card h6,
279
+ [data-site-theme="southpark"] .stake-card h1,
280
+ [data-site-theme="southpark"] .stake-card h2,
281
+ [data-site-theme="southpark"] .stake-card h3,
282
+ [data-site-theme="southpark"] .stake-card h4,
283
+ [data-site-theme="southpark"] .stake-card h5,
284
+ [data-site-theme="southpark"] .stake-card h6,
285
+ [data-site-theme="southpark"] .widget-card h1,
286
+ [data-site-theme="southpark"] .widget-card h2,
287
+ [data-site-theme="southpark"] .widget-card h3,
288
+ [data-site-theme="southpark"] .widget-card h4,
289
+ [data-site-theme="southpark"] .widget-card h5,
290
+ [data-site-theme="southpark"] .widget-card h6,
291
+ [data-site-theme="southpark"] .brand-card h1,
292
+ [data-site-theme="southpark"] .brand-card h2,
293
+ [data-site-theme="southpark"] .brand-card h3,
294
+ [data-site-theme="southpark"] .brand-card h4,
295
+ [data-site-theme="southpark"] .brand-card h5,
296
+ [data-site-theme="southpark"] .brand-card h6,
297
+ [data-site-theme="southpark"] .status-card p,
298
+ [data-site-theme="southpark"] .stake-card p,
299
+ [data-site-theme="southpark"] .widget-card p,
300
+ [data-site-theme="southpark"] .brand-card p,
301
+ [data-site-theme="southpark"] .status-card li,
302
+ [data-site-theme="southpark"] .stake-card li,
303
+ [data-site-theme="southpark"] .widget-card li,
304
+ [data-site-theme="southpark"] .brand-card li,
305
+ [data-site-theme="southpark"] .status-card span,
306
+ [data-site-theme="southpark"] .stake-card span,
307
+ [data-site-theme="southpark"] .widget-card span,
308
+ [data-site-theme="southpark"] .brand-card span {
309
+ color: var(--brand-card-text) !important;
310
+ }
311
+
312
+ [data-site-theme="southpark"] .status-card__price-value,
313
+ [data-site-theme="southpark"] .status-metric__value,
314
+ [data-site-theme="southpark"] .stake-card__headline {
315
+ color: rgba(248, 243, 220, 0.92);
316
+ text-shadow: 0 0 18px rgba(248, 211, 89, 0.4);
317
+ }
318
+
319
+ [data-site-theme="southpark"] .status-card__price-chip,
320
+ [data-site-theme="southpark"] .status-chip,
321
+ [data-site-theme="southpark"] .unit-chip {
322
+ background: rgba(248, 211, 89, 0.24);
323
+ color: #1f2a34;
324
+ border: 1px solid rgba(248, 243, 220, 0.4);
325
+ }
326
+
327
+ [data-site-theme="southpark"] .status-metric,
328
+ [data-site-theme="southpark"] .stake-section,
329
+ [data-site-theme="southpark"] .buy-group {
330
+ border-color: rgba(255, 245, 220, 0.16) !important;
331
+ }
332
+
333
+ [data-site-theme="southpark"] .countdown,
334
+ [data-site-theme="southpark"] .countdown__value,
335
+ [data-site-theme="southpark"] .countdown__label {
336
+ color: rgba(255, 245, 220, 0.9);
337
+ }
338
+
339
+ [data-site-theme="southpark"] .countdown__value {
340
+ color: var(--brand-countdown-digit);
341
+ }
342
+
343
+
344
+
345
+ [data-site-theme="southpark"] .unit-chip-button {
346
+ background: transparent;
347
+ color: var(--brand-card-text);
348
+ border-radius: 0;
349
+ border: none;
350
+ border-left: 1px solid rgba(110, 199, 247, 0.35);
351
+ box-shadow: none;
352
+ align-self: stretch;
353
+ padding-right: var(--buy-space-16);
354
+ padding-left: var(--buy-space-12);
355
+ }
356
+
357
+ [data-site-theme="southpark"] .unit-chip-button .unit-chip,
358
+ [data-site-theme="southpark"] .unit-chip-button svg {
359
+ color: inherit;
360
+ }
361
+
362
+ [data-site-theme="southpark"] .balance-inline__unit {
363
+ border-radius: 999px;
364
+ border: 1px solid rgba(248, 243, 220, 0.4);
365
+ background: rgba(248, 211, 89, 0.24);
366
+ padding: 0 12px;
367
+ color: #1f2a34;
368
+ font-family: 'Space Grotesk', 'Inter', sans-serif;
369
+ font-weight: 600;
370
+ letter-spacing: 0.14em;
371
+ text-transform: uppercase;
372
+ font-size: 0.7rem;
373
+ display: inline-flex;
374
+ align-items: center;
375
+ justify-content: center;
376
+ min-height: 24px;
377
+ vertical-align: middle;
378
+ }
379
+
380
+ [data-site-theme="southpark"] .unit-chip-button .unit-chip {
381
+ border: none !important;
382
+ padding: 0 var(--buy-space-12) !important;
383
+ min-height: auto !important;
384
+ letter-spacing: 0.08em !important;
385
+ align-self: stretch;
386
+ display: inline-flex;
387
+ align-items: center;
388
+ }
389
+
390
+ [data-site-theme="southpark"] .brand-card .unit-chip,
391
+ [data-site-theme="southpark"] .status-card .unit-chip,
392
+ [data-site-theme="southpark"] .stake-card .unit-chip {
393
+ border-radius: 999px;
394
+ padding: 2px 12px;
395
+ }
396
+
397
+ [data-site-theme="southpark"] .asset-picker-popover {
398
+ background: rgba(20, 28, 36, 0.96) !important;
399
+ border: 1px solid rgba(110, 199, 247, 0.35) !important;
400
+ box-shadow: 0 30px 60px rgba(5, 7, 12, 0.65) !important;
401
+ }
402
+
403
+ [data-site-theme="southpark"] .asset-picker-popover__title,
404
+ [data-site-theme="southpark"] .asset-picker-popover__symbol,
405
+ [data-site-theme="southpark"] .asset-picker-popover__balance {
406
+ color: var(--brand-card-text) !important;
407
+ }
408
+
409
+ [data-site-theme="southpark"] .asset-picker-popover__name {
410
+ color: rgba(255, 248, 230, 0.72) !important;
411
+ }
412
+
413
+ [data-site-theme="southpark"] .asset-picker-popover__button {
414
+ color: var(--brand-card-text) !important;
415
+ border-radius: var(--brand-radius-sm) !important;
416
+ border: 1px solid transparent !important;
417
+ }
418
+
419
+ [data-site-theme="southpark"] .asset-picker-popover__button:hover,
420
+ [data-site-theme="southpark"] .asset-picker-popover__button:focus-visible {
421
+ border-color: rgba(110, 199, 247, 0.45) !important;
422
+ background: rgba(110, 199, 247, 0.08) !important;
423
+ }
424
+
425
+ [data-site-theme="southpark"] .asset-picker-popover__button--active {
426
+ border-color: rgba(248, 211, 89, 0.65) !important;
427
+ background: rgba(248, 211, 89, 0.14) !important;
428
+ }
429
+
430
+ [data-site-theme="southpark"] .asset-picker-popover__icon {
431
+ background: rgba(110, 199, 247, 0.2) !important;
432
+ border: 1px solid rgba(110, 199, 247, 0.35) !important;
433
+ }
434
+
435
+ [data-site-theme="southpark"] .network-alert {
436
+ background: linear-gradient(160deg, rgba(194, 65, 54, 0.2), rgba(31, 42, 52, 0.92));
437
+ border: 1px solid rgba(194, 65, 54, 0.45);
438
+ color: rgba(255, 245, 220, 0.92);
439
+ box-shadow: 0 20px 40px rgba(194, 65, 54, 0.28);
440
+ }
441
+
442
+ [data-site-theme="southpark"] .network-alert__button {
443
+ background: rgba(110, 199, 247, 0.18);
444
+ border-color: rgba(110, 199, 247, 0.4);
445
+ color: rgba(255, 245, 220, 0.95);
446
+ }
447
+
448
+ [data-site-theme="southpark"] .stake-toggle__input:checked + .stake-toggle__track {
449
+ background: linear-gradient(135deg, #5bbf8a, #6ec7f7);
450
+ }
451
+
452
+ [data-site-theme="southpark"] .modal,
453
+ [data-site-theme="southpark"] [role="dialog"] {
454
+ background: var(--brand-modal-surface);
455
+ border: 1px solid var(--brand-modal-border);
456
+ box-shadow: var(--brand-modal-shadow);
457
+ color: var(--brand-fg-100);
458
+ }
459
+
460
+ [data-site-theme="southpark"] .modal::backdrop,
461
+ [data-site-theme="southpark"] [role="dialog"]::backdrop,
462
+ [data-site-theme="southpark"] .need-eth-modal__backdrop,
463
+ [data-site-theme="southpark"] .w3m-modal-backdrop {
464
+ background: var(--brand-modal-backdrop) !important;
465
+ }
466
+
467
+ [data-site-theme="southpark"] .footer {
468
+ background: #1f2a34;
469
+ color: rgba(255, 245, 220, 0.92);
470
+ }
471
+
472
+ [data-site-theme="southpark"] .about-section {
473
+ color: rgba(255, 245, 220, 0.92);
474
+ }
475
+
476
+ [data-site-theme="southpark"] .footer a,
477
+ [data-site-theme="southpark"] .about-section a {
478
+ color: var(--brand-electric-blue);
479
+ }
480
+
481
+ [data-site-theme="southpark"] .legal-page {
482
+ background: linear-gradient(180deg, #fff9ef 0%, #f1e1bd 100%);
483
+ color: var(--brand-fg-200);
484
+ }
485
+
486
+ [data-site-theme="southpark"] .sticky-cta {
487
+ background: rgba(31, 42, 52, 0.92);
488
+ border: 1px solid rgba(248, 211, 89, 0.4);
489
+ box-shadow: 0 -12px 32px rgba(31, 42, 52, 0.35);
490
+ }
491
+
492
+ [data-site-theme="southpark"] .sticky-cta__button {
493
+ background: var(--brand-primary-cta-gradient);
494
+ color: var(--brand-primary-cta-text);
495
+ }
496
+
497
+ [data-site-theme="southpark"] .cookie-consent,
498
+ [data-site-theme="southpark"] .form-alert {
499
+ background: rgba(31, 42, 52, 0.94);
500
+ border: 1px solid rgba(110, 199, 247, 0.35);
501
+ color: rgba(255, 245, 220, 0.9);
502
+ }
503
+
504
+ [data-site-theme="southpark"] .form-alert--success {
505
+ border-color: rgba(91, 191, 138, 0.4);
506
+ }
507
+
508
+ [data-site-theme="southpark"] .form-alert--error {
509
+ border-color: rgba(194, 65, 54, 0.38);
510
+ }
511
+
512
+ [data-site-theme="southpark"] .status-progress .progress-bar {
513
+ background: linear-gradient(90deg, #5bbf8a, #f8d359);
514
+ }
515
+
516
+ [data-site-theme="southpark"] .momentum-card {
517
+ background: rgba(31, 42, 52, 0.94);
518
+ border: 1px solid rgba(110, 199, 247, 0.32);
519
+ box-shadow: 0 24px 50px rgba(31, 42, 52, 0.32);
520
+ }
521
+
522
+ [data-site-theme="southpark"] .momentum-card__eyebrow {
523
+ color: rgba(248, 211, 89, 0.9);
524
+ }
525
+
526
+ [data-site-theme="southpark"] .momentum-card__value {
527
+ color: rgba(255, 245, 220, 0.92);
528
+ }
529
+
530
+ [data-site-theme="southpark"] .tokenomics-chart__center-label {
531
+ color: var(--brand-fg-100);
532
+ }
533
+
534
+ [data-site-theme="southpark"] .tokenomics-chart__center-value {
535
+ color: var(--brand-amber-heat);
536
+ }
537
+
538
+ [data-site-theme="southpark"] .contact-form,
539
+ [data-site-theme="southpark"] .email-capture {
540
+ background: rgba(255, 249, 238, 0.96);
541
+ border: 1px solid rgba(31, 42, 52, 0.12);
542
+ }
543
+
544
+ [data-site-theme="southpark"] .email-capture__button {
545
+ background: var(--brand-primary-cta-gradient);
546
+ color: var(--brand-primary-cta-text);
547
+ }
548
+
549
+ [data-site-theme="southpark"] .secondary-cta__link:hover,
550
+ [data-site-theme="southpark"] .secondary-cta__link:focus-visible {
551
+ background: rgba(248, 211, 89, 0.3);
552
+ color: #1f2a34;
553
+ }
554
+
555
+ [data-site-theme="southpark"] .appkit-button,
556
+ [data-site-theme="southpark"] appkit-button {
557
+ --wcm-font-family: 'Space Grotesk', 'Inter', sans-serif;
558
+ --wcm-color-fg-1: #1f2a34;
559
+ --wcm-color-fg-2: #3c4a57;
560
+ --wcm-color-bg-1: #fff9ef;
561
+ --wcm-color-accent: #5bbf8a;
562
+ --wcm-color-danger: #c24136;
563
+ --wcm-modal-width: min(420px, 92vw);
564
+ }
565
+ [data-site-theme="southpark"] .momentum-card h1,
566
+ [data-site-theme="southpark"] .momentum-card h2,
567
+ [data-site-theme="southpark"] .momentum-card h3,
568
+ [data-site-theme="southpark"] .momentum-card h4,
569
+ [data-site-theme="southpark"] .momentum-card h5,
570
+ [data-site-theme="southpark"] .momentum-card h6,
571
+ [data-site-theme="southpark"] .momentum-card p,
572
+ [data-site-theme="southpark"] .momentum-card li,
573
+ [data-site-theme="southpark"] .momentum-card span {
574
+ color: var(--brand-card-text) !important;
575
+ }
576
+
577
+ [data-site-theme="southpark"] .widget-card,
578
+ [data-site-theme="southpark"] .ui-card,
579
+ [data-site-theme="southpark"] .how-it-works,
580
+ [data-site-theme="southpark"] .need-eth-modal,
581
+ [data-site-theme="southpark"] .step,
582
+ [data-site-theme="southpark"] .stepper,
583
+ [data-site-theme="southpark"] .ui-card .brand-card__badge,
584
+ [data-site-theme="southpark"] .buy-group__label,
585
+ [data-site-theme="southpark"] .buy-group__value,
586
+ [data-site-theme="southpark"] .form-notice,
587
+ [data-site-theme="southpark"] .conversion-hint,
588
+ [data-site-theme="southpark"] .amount-estimate,
589
+ [data-site-theme="southpark"] .balance-inline__label,
590
+ [data-site-theme="southpark"] .balance-inline__value,
591
+ [data-site-theme="southpark"] .step-title,
592
+ [data-site-theme="southpark"] .step-subtitle {
593
+ color: var(--brand-card-text) !important;
594
+ }
595
+
596
+ [data-site-theme="southpark"] .status-card,
597
+ [data-site-theme="southpark"] .stake-card {
598
+ border: none !important;
599
+ background: transparent !important;
600
+ box-shadow: none !important;
601
+ }
602
+
603
+ [data-site-theme="southpark"] .connect-badge {
604
+ background: rgba(31, 42, 52, 0.92) !important;
605
+ border-color: rgba(110, 199, 247, 0.35) !important;
606
+ color: var(--brand-card-text) !important;
607
+ box-shadow: 0 18px 36px rgba(31, 42, 52, 0.32);
608
+ }
609
+
610
+ [data-site-theme="southpark"] .connect-badge__status,
611
+ [data-site-theme="southpark"] .connect-badge__network,
612
+ [data-site-theme="southpark"] .connect-badge__value {
613
+ color: var(--brand-card-text) !important;
614
+ }
615
+
616
+ [data-site-theme="southpark"] .connect-badge__status-icon svg {
617
+ stroke: var(--brand-card-text);
618
+ }
619
+
620
+ [data-site-theme="southpark"] .connect-badge--alert {
621
+ background: rgba(194, 65, 54, 0.18) !important;
622
+ border-color: rgba(194, 65, 54, 0.55) !important;
623
+ }
624
+
625
+ [data-site-theme="southpark"] .connect-badge--alert .connect-badge__status,
626
+ [data-site-theme="southpark"] .connect-badge--alert .connect-badge__status-icon {
627
+ color: var(--brand-status-error) !important;
628
+ }
629
+
630
+ [data-site-theme="southpark"] .stake-toggle__track {
631
+ background: rgba(12, 18, 26, 0.85);
632
+ box-shadow:
633
+ inset 0 0 0 1px rgba(110, 199, 247, 0.5),
634
+ 0 4px 12px rgba(5, 7, 12, 0.65);
635
+ }
636
+
637
+ [data-site-theme="southpark"] .stake-toggle__thumb {
638
+ background: rgba(255, 248, 230, 1);
639
+ box-shadow:
640
+ 0 2px 8px rgba(5, 7, 12, 0.55),
641
+ inset 0 0 0 1px rgba(123, 115, 73, 0.4);
642
+ }
643
+
644
+ [data-site-theme="southpark"] .stake-toggle__input:checked + .stake-toggle__track {
645
+ background: linear-gradient(135deg, #4fe08f 0%, #6ec7f7 100%);
646
+ box-shadow:
647
+ inset 0 0 0 1px rgba(255, 248, 230, 0.6),
648
+ 0 4px 14px rgba(78, 199, 170, 0.45);
649
+ }
650
+
651
+ [data-site-theme="southpark"] .stake-toggle__label {
652
+ color: rgba(255, 248, 230, 0.92);
653
+ font-weight: 600;
654
+ }
655
+
656
+ [data-site-theme="southpark"] .presale-faq,
657
+ [data-site-theme="southpark"] .presale-faq__trigger,
658
+ [data-site-theme="southpark"] .presale-faq__answer,
659
+ [data-site-theme="southpark"] .presale-faq__description,
660
+ [data-site-theme="southpark"] .presale-faq__title {
661
+ color: var(--brand-card-text) !important;
662
+ }
663
+
664
+ [data-site-theme="southpark"] .presale-faq__badge,
665
+ [data-site-theme="southpark"] .presale-faq__icon {
666
+ color: var(--brand-card-text);
667
+ background: rgba(248, 211, 89, 0.2);
668
+ }
669
+
670
+ [data-site-theme="southpark"] .presale-faq__item {
671
+ background: rgba(31, 42, 52, 0.85) !important;
672
+ border-color: rgba(110, 199, 247, 0.28) !important;
673
+ }
674
+
675
+ [data-site-theme="southpark"] .presale-faq__item--open {
676
+ border-color: rgba(248, 211, 89, 0.55) !important;
677
+ background: rgba(31, 42, 52, 0.92) !important;
678
+ }
679
+
680
+ [data-site-theme="southpark"] #tokenomics,
681
+ [data-site-theme="southpark"] #tokenomics h2,
682
+ [data-site-theme="southpark"] #tokenomics h3,
683
+ [data-site-theme="southpark"] #tokenomics p,
684
+ [data-site-theme="southpark"] #tokenomics li,
685
+ [data-site-theme="southpark"] #tokenomics span {
686
+ color: var(--brand-card-text) !important;
687
+ }
688
+
689
+ [data-site-theme="southpark"] #tokenomics {
690
+ background: radial-gradient(circle at 50% -20%, rgba(110, 199, 247, 0.18), transparent 55%),
691
+ radial-gradient(circle at 0% 10%, rgba(248, 211, 89, 0.12), transparent 60%),
692
+ #040609;
693
+ }
694
+
695
+ [data-site-theme="southpark"] #tokenomics h2 {
696
+ color: rgba(255, 248, 230, 0.95) !important;
697
+ text-shadow: 0 0 18px rgba(248, 211, 89, 0.35);
698
+ }
699
+
700
+ [data-site-theme="southpark"] #tokenomics h3,
701
+ [data-site-theme="southpark"] .tokenomics-intro {
702
+ color: rgba(255, 248, 230, 0.8) !important;
703
+ }
704
+
705
+ [data-site-theme="southpark"] #tokenomics h4 {
706
+ color: rgba(255, 248, 230, 0.78) !important;
707
+ }
708
+
709
+ [data-site-theme="southpark"] #tokenomics .lead {
710
+ color: rgba(255, 248, 230, 0.7) !important;
711
+ }
712
+
713
+ [data-site-theme="southpark"] #tokenomics .tokenomics-figure__value,
714
+ [data-site-theme="southpark"] .tokenomics-chart__center-value {
715
+ color: #f8d359 !important;
716
+ text-shadow: 0 0 14px rgba(248, 211, 89, 0.45);
717
+ }
718
+
719
+ [data-site-theme="southpark"] .tokenomics-details-label {
720
+ color: rgba(255, 248, 230, 0.7) !important;
721
+ }
722
+
723
+ [data-site-theme="southpark"] .tokenomics-details-item::before {
724
+ color: var(--brand-amber-heat) !important;
725
+ }
726
+
727
+ [data-site-theme="southpark"] .tokenomics-chart__center-label {
728
+ color: rgba(255, 248, 230, 0.82) !important;
729
+ text-shadow: 0 0 14px rgba(248, 211, 89, 0.4);
730
+ }
731
+ [data-site-theme="southpark"] .tokenomics-chart__center-value {
732
+ color: #f8d359 !important;
733
+ text-shadow: 0 0 18px rgba(248, 211, 89, 0.55);
734
+ }
735
+ [data-site-theme="southpark"] {
736
+ --field-bg: rgba(14, 26, 38, 0.98);
737
+ --field-border: rgba(83, 122, 152, 0.65);
738
+ --field-border-focus: rgba(110, 199, 247, 0.85);
739
+ --field-shadow: inset 0 0 0 1px rgba(20, 48, 70, 0.85), 0 18px 34px rgba(7, 10, 14, 0.65);
740
+ --field-input-color: rgba(255, 245, 220, 0.95);
741
+ --field-input-placeholder: rgba(255, 245, 220, 0.45);
742
+ --field-input-disabled-color: rgba(255, 245, 220, 0.35);
743
+ --field-addon-bg: rgba(17, 34, 48, 0.98);
744
+ --field-addon-border: rgba(83, 122, 152, 0.65);
745
+ --field-addon-color: rgba(255, 245, 220, 0.95);
746
+ }
747
+
748
+ [data-site-theme="southpark"] .field-group {
749
+ background: var(--field-bg) !important;
750
+ border-color: var(--field-border) !important;
751
+ box-shadow: var(--field-shadow) !important;
752
+ }
753
+
754
+ [data-site-theme="southpark"] .field-group:focus-within {
755
+ border-color: var(--field-border-focus) !important;
756
+ box-shadow:
757
+ 0 0 0 2px rgba(110, 199, 247, 0.35),
758
+ 0 18px 34px rgba(7, 10, 14, 0.65) !important;
759
+ }
760
+
761
+ [data-site-theme="southpark"] .field-input {
762
+ color: var(--field-input-color) !important;
763
+ -webkit-text-fill-color: var(--field-input-color) !important;
764
+ }
765
+
766
+ [data-site-theme="southpark"] .field-input::placeholder {
767
+ color: var(--field-input-placeholder) !important;
768
+ }
769
+
770
+ [data-site-theme="southpark"] .field-addon,
771
+ [data-site-theme="southpark"] .field-unit {
772
+ background: var(--field-addon-bg) !important;
773
+ color: var(--field-addon-color) !important;
774
+ border-color: var(--field-addon-border) !important;
775
+ }
776
+
777
+ html.token-suck .field-group {
778
+ background-color: #0c1f2d !important;
779
+ border-color: rgba(83, 122, 152, 0.65) !important;
780
+ box-shadow:
781
+ inset 0 0 0 1px rgba(20, 48, 70, 0.65),
782
+ 0 18px 34px rgba(5, 10, 14, 0.55) !important;
783
+ }
784
+
785
+ html.token-suck .field-input {
786
+ background: transparent !important;
787
+ border: none !important;
788
+ color: rgba(255, 245, 220, 0.96) !important;
789
+ -webkit-text-fill-color: rgba(255, 245, 220, 0.96) !important;
790
+ }
791
+
792
+ html.token-suck .field-input::placeholder {
793
+ color: rgba(255, 245, 220, 0.48) !important;
794
+ }
795
+
796
+ html.token-suck .field-addon,
797
+ html.token-suck .field-unit {
798
+ background-color: #0b1924 !important;
799
+ color: rgba(255, 245, 220, 0.96) !important;
800
+ border-color: rgba(83, 122, 152, 0.65) !important;
801
+ }