@cirthcss/cirth 0.15.0-beta.1 → 0.15.0-beta.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.
@@ -47,6 +47,10 @@
47
47
  margin-bottom: var(--cirth-block-spacing-vertical);
48
48
  }
49
49
 
50
+ .cirth main > section + section {
51
+ margin-block-start: var(--cirth-space-8);
52
+ }
53
+
50
54
  .cirth b, .cirth strong {
51
55
  font-weight: bolder;
52
56
  }
@@ -159,6 +163,15 @@
159
163
  background-color: var(--cirth-mark-background-color);
160
164
  color: var(--cirth-mark-color);
161
165
  vertical-align: baseline;
166
+ -webkit-box-decoration-break: clone;
167
+ box-decoration-break: clone;
168
+ }
169
+
170
+ @media (forced-colors: active) {
171
+ .cirth mark {
172
+ color: marktext;
173
+ background-color: mark;
174
+ }
162
175
  }
163
176
 
164
177
  .cirth blockquote {
@@ -381,6 +394,8 @@
381
394
 
382
395
  .cirth caption {
383
396
  color: var(--cirth-muted-color);
397
+ font-size: var(--cirth-font-size-sm);
398
+ line-height: var(--cirth-line-height-normal);
384
399
  text-align: start;
385
400
  padding-block-end: calc(var(--cirth-spacing) * .5);
386
401
  }
@@ -487,6 +502,8 @@
487
502
  .cirth figure figcaption {
488
503
  padding: calc(var(--cirth-spacing) * .5) 0;
489
504
  color: var(--cirth-muted-color);
505
+ font-size: var(--cirth-font-size-sm);
506
+ line-height: var(--cirth-line-height-normal);
490
507
  }
491
508
 
492
509
  .cirth hr {
@@ -986,9 +1003,9 @@
986
1003
 
987
1004
  .cirth [type="range"] {
988
1005
  appearance: none;
989
- background: none;
990
1006
  width: 100%;
991
- height: 1.25rem;
1007
+ height: max(2.75rem, var(--cirth-font-size-md) * var(--cirth-line-height) + var(--cirth-form-element-spacing-vertical) * 2 + var(--cirth-border-width) * 2);
1008
+ background: none;
992
1009
  }
993
1010
 
994
1011
  .cirth [type="range"]::-webkit-slider-runnable-track {
@@ -1035,6 +1052,18 @@
1035
1052
  --cirth-range-thumb-color: var(--cirth-range-thumb-active-color);
1036
1053
  }
1037
1054
 
1055
+ @media (hover: hover) and (pointer: fine) {
1056
+ .cirth [type="range"]:hover:not(:active, :focus, :disabled) {
1057
+ --cirth-range-border-color: var(--cirth-range-active-border-color);
1058
+ --cirth-range-thumb-color: var(--cirth-secondary-hover);
1059
+ }
1060
+ }
1061
+
1062
+ .cirth [type="range"]:focus-visible {
1063
+ outline: var(--cirth-outline-width) solid var(--cirth-primary-focus);
1064
+ outline-offset: var(--cirth-space-1);
1065
+ }
1066
+
1038
1067
  .cirth [type="range"]:active::-webkit-slider-thumb {
1039
1068
  transform: scale(1.25);
1040
1069
  }
@@ -1438,7 +1467,7 @@
1438
1467
  @starting-style {
1439
1468
  .cirth dialog[open] > article {
1440
1469
  opacity: 0;
1441
- transform: translateY(-100%);
1470
+ transform: translateY(-.5rem);
1442
1471
  }
1443
1472
  }
1444
1473
 
@@ -1798,6 +1827,7 @@
1798
1827
  scroll-behavior: auto;
1799
1828
  transition-delay: var(--cirth-duration-instant);
1800
1829
  transition-duration: var(--cirth-duration-instant);
1830
+ --cirth-transition: var(--cirth-duration-instant) var(--cirth-ease-out);
1801
1831
  animation-duration: 1ms;
1802
1832
  animation-iteration-count: 1;
1803
1833
  animation-delay: -1ms;
@@ -1925,7 +1955,11 @@
1925
1955
  --cirth-icon-checkbox: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
1926
1956
  --cirth-icon-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E");
1927
1957
  --cirth-icon-close: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E");
1928
- --cirth-icon-loading: url("data:image/svg+xml,%3Csvg fill='none' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E g %7B animation: rotate 2s linear infinite; transform-origin: center center; %7D circle %7B stroke-dasharray: 75,100; stroke-dashoffset: -5; animation: dash 1.5s ease-in-out infinite; stroke-linecap: round; %7D @keyframes rotate %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D @keyframes dash %7B 0%25 %7B stroke-dasharray: 1,100; stroke-dashoffset: 0; %7D 50%25 %7B stroke-dasharray: 44.5,100; stroke-dashoffset: -17.5; %7D 100%25 %7B stroke-dasharray: 44.5,100; stroke-dashoffset: -62; %7D %7D %3C/style%3E%3Cg%3E%3Ccircle cx='12' cy='12' r='10' fill='none' stroke='rgb(136, 146, 164)' stroke-width='4' /%3E%3C/g%3E%3C/svg%3E");
1958
+ --cirth-icon-loading: url("data:image/svg+xml,%3Csvg fill='none' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' %3E%3Cstyle%3E g %7B animation: rotate 2s linear infinite; transform-origin: center center; %7D circle %7B stroke-dasharray: 75,100; stroke-dashoffset: -5; animation: dash 1.5s ease-in-out infinite; stroke-linecap: round; %7D @keyframes rotate %7B 0%25 %7B transform: rotate(0deg); %7D 100%25 %7B transform: rotate(360deg); %7D %7D @keyframes dash %7B 0%25 %7B stroke-dasharray: 1,100; stroke-dashoffset: 0; %7D 50%25 %7B stroke-dasharray: 44.5,100; stroke-dashoffset: -17.5; %7D 100%25 %7B stroke-dasharray: 44.5,100; stroke-dashoffset: -62; %7D %7D %3C/style%3E%3Cg%3E%3Ccircle cx='12' cy='12' r='10' fill='none' stroke='rgb(142, 144, 161)' stroke-width='4' /%3E%3C/g%3E%3C/svg%3E");
1959
+ }
1960
+
1961
+ .cirth :focus-visible {
1962
+ transition-duration: var(--cirth-duration-instant);
1929
1963
  }
1930
1964
 
1931
1965
  .cirth a {
@@ -2054,47 +2088,46 @@
2054
2088
  }
2055
2089
 
2056
2090
  .cirth {
2057
- --cirth-canvas: light-dark(oklch(97.4% .004 69.35), oklch(20.15% .003 264));
2058
- --cirth-ink: light-dark(oklch(35.3% .021 264), oklch(83% .016 264));
2091
+ --cirth-canvas: light-dark(oklch(97.3% .006 44), oklch(20.15% .0225 280));
2092
+ --cirth-ink: light-dark(oklch(35.3% .027 280), oklch(83% .011 280));
2059
2093
  --cirth-color: var(--cirth-ink);
2060
- --cirth-text-selection-color: light-dark(oklch(65.7% .121 69.35 / .25), oklch(70% .129 69.35 / .1875));
2061
- --cirth-muted-color: light-dark(oklch(52.7% .032 264), oklch(65.7% .03 264));
2062
- --cirth-muted-border-color: light-dark(oklch(93.85% .003 264), oklch(26.7% .011 264));
2063
- --cirth-error: light-dark(oklch(44% .151 29.73), oklch(74.3% .133 29.73));
2064
- --cirth-success: light-dark(oklch(52.7% .1 160.59), oklch(65.7% .125 160.59));
2065
- --cirth-warning: light-dark(oklch(48.3% .086 78), oklch(70% .124 78));
2066
- --cirth-primary: light-dark(oklch(52.7% .097 69.35), oklch(70% .129 69.35));
2067
- --cirth-secondary: light-dark(oklch(52.7% .032 264), oklch(70% .028 264));
2068
- --cirth-secondary-underline: light-dark(oklch(52.7% .032 264 / .5), oklch(70% .028 264 / .5));
2069
- --cirth-secondary-hover: light-dark(oklch(44% .028 264), oklch(78.7% .021 264));
2070
- --cirth-secondary-hover-background: light-dark(oklch(44% .028 264), oklch(52.7% .032 264));
2071
- --cirth-secondary-focus: light-dark(oklch(48.3% .03 264 / .7), oklch(70% .028 264 / .7));
2072
- --cirth-contrast: light-dark(oklch(22.3% .006 264), oklch(91.7% .006 264));
2073
- --cirth-contrast-background: light-dark(oklch(22.3% .006 264), oklch(96% 0 264));
2074
- --cirth-contrast-underline: light-dark(oklch(22.3% .006 264 / .5), oklch(91.7% .006 264 / .5));
2094
+ --cirth-muted-color: light-dark(oklch(52.7% .031 280), oklch(65.7% .025 280));
2095
+ --cirth-muted-border-color: light-dark(oklch(93.85% .002 280), oklch(26.7% .025 280));
2096
+ --cirth-error: light-dark(oklch(44% .151 22), oklch(74.3% .133 22));
2097
+ --cirth-success: light-dark(oklch(52.7% .115 153), oklch(65.7% .144 153));
2098
+ --cirth-warning: light-dark(oklch(48.3% .084 89.5), oklch(70% .122 89.5));
2099
+ --cirth-primary: light-dark(oklch(52.7% .107 44), oklch(65.7% .134 44));
2100
+ --cirth-secondary: light-dark(oklch(52.7% .031 280), oklch(70% .021 280));
2101
+ --cirth-secondary-underline: light-dark(oklch(52.7% .031 280 / .5), oklch(70% .021 280 / .5));
2102
+ --cirth-secondary-hover: light-dark(oklch(44% .029 280), oklch(78.7% .014 280));
2103
+ --cirth-secondary-hover-background: light-dark(oklch(44% .029 280), oklch(52.7% .031 280));
2104
+ --cirth-secondary-focus: light-dark(oklch(48.3% .03 280 / .7), oklch(70% .021 280 / .7));
2105
+ --cirth-contrast: light-dark(oklch(22.3% .023 280), oklch(91.7% .004 280));
2106
+ --cirth-contrast-background: light-dark(oklch(22.3% .023 280), oklch(96% 0 280));
2107
+ --cirth-contrast-underline: light-dark(oklch(22.3% .023 280 / .5), oklch(91.7% .004 280 / .5));
2075
2108
  --cirth-contrast-hover: light-dark(oklch(0% 0 0), oklch(100% 0 0));
2076
2109
  --cirth-contrast-hover-background: light-dark(oklch(0% 0 0), oklch(100% 0 0));
2077
- --cirth-contrast-focus: light-dark(oklch(48.3% .03 264 / .7), oklch(87.3% .011 264 / .5));
2110
+ --cirth-contrast-focus: light-dark(oklch(48.3% .03 280 / .7), oklch(87.3% .007 280 / .5));
2078
2111
  --cirth-contrast-inverse: light-dark(oklch(100% 0 0), oklch(0% 0 0));
2079
- --cirth-link-visited-color: light-dark(oklch(48.3% 0 264), oklch(65.7% 0 264));
2080
- --cirth-box-shadow: light-dark(.0145rem .029rem .174rem oklch(65.7% .03 264 / .01698), .0335rem .067rem .402rem oklch(65.7% .03 264 / .024), .0625rem .125rem .75rem oklch(65.7% .03 264 / .03), .1125rem .225rem 1.35rem oklch(65.7% .03 264 / .036), .2085rem .417rem 2.502rem oklch(65.7% .03 264 / .04302), .5rem 1rem 6rem oklch(65.7% .03 264 / .06), 0 0 0 .0625rem oklch(65.7% .03 264 / .015),
2081
- .0145rem .029rem .174rem oklch(9% 0 none / .01698), .0335rem .067rem .402rem oklch(9% 0 none / .024), .0625rem .125rem .75rem oklch(9% 0 none / .03), .1125rem .225rem 1.35rem oklch(9% 0 none / .036), .2085rem .417rem 2.502rem oklch(9% 0 none / .04302), .5rem 1rem 6rem oklch(9% 0 none / .06), 0 0 0 .0625rem oklch(9% 0 none / .015));
2082
- --cirth-h1-color: light-dark(oklch(22.3% .006 264), oklch(96% 0 264));
2083
- --cirth-h2-color: light-dark(oklch(26.7% .011 264), oklch(91.7% .006 264));
2084
- --cirth-h3-color: light-dark(oklch(31% .016 264), oklch(83% .016 264));
2085
- --cirth-h4-color: light-dark(oklch(35.3% .021 264), oklch(78.7% .021 264));
2086
- --cirth-h5-color: light-dark(oklch(39.7% .025 264), oklch(74.3% .025 264));
2087
- --cirth-h6-color: light-dark(oklch(44% .028 264), oklch(65.7% .03 264));
2088
- --cirth-mark-color: light-dark(oklch(18% 0 264), oklch(100% 0 0));
2089
- --cirth-code-color: light-dark(oklch(52.7% .032 264), oklch(65.7% .03 264));
2090
- --cirth-form-element-selected-background-color: light-dark(oklch(91.7% .006 264), oklch(31% .016 264));
2091
- --cirth-form-element-border-color: light-dark(oklch(61.3% .032 264), oklch(52.7% .032 264));
2092
- --cirth-form-element-color: light-dark(oklch(26.7% .011 264), oklch(91.7% .006 264));
2093
- --cirth-switch-background-color: light-dark(oklch(61.3% .032 264), oklch(52.7% .032 264));
2094
- --cirth-range-border-color: light-dark(oklch(91.7% .006 264), oklch(26.7% .011 264));
2095
- --cirth-range-active-border-color: light-dark(oklch(83% .016 264), oklch(31% .016 264));
2096
- --cirth-progress-background-color: light-dark(oklch(91.7% .006 264), oklch(26.7% .011 264));
2097
- --cirth-progress-border-color: light-dark(oklch(61.3% .032 264), oklch(52.7% .032 264));
2112
+ --cirth-link-visited-color: light-dark(oklch(48.3% 0 280), oklch(65.7% 0 280));
2113
+ --cirth-box-shadow: light-dark(.0145rem .029rem .174rem oklch(65.7% .025 280 / .01698), .0335rem .067rem .402rem oklch(65.7% .025 280 / .024), .0625rem .125rem .75rem oklch(65.7% .025 280 / .03), .1125rem .225rem 1.35rem oklch(65.7% .025 280 / .036), .2085rem .417rem 2.502rem oklch(65.7% .025 280 / .04302), .5rem 1rem 6rem oklch(65.7% .025 280 / .06), 0 0 0 .0625rem oklch(65.7% .025 280 / .015),
2114
+ .0145rem .029rem .174rem oklch(9% .011 280 / .01698), .0335rem .067rem .402rem oklch(9% .011 280 / .024), .0625rem .125rem .75rem oklch(9% .011 280 / .03), .1125rem .225rem 1.35rem oklch(9% .011 280 / .036), .2085rem .417rem 2.502rem oklch(9% .011 280 / .04302), .5rem 1rem 6rem oklch(9% .011 280 / .06), 0 0 0 .0625rem oklch(9% .011 280 / .015));
2115
+ --cirth-h1-color: light-dark(oklch(22.3% .023 280), oklch(96% 0 280));
2116
+ --cirth-h2-color: light-dark(oklch(26.7% .025 280), oklch(91.7% .004 280));
2117
+ --cirth-h3-color: light-dark(oklch(31% .026 280), oklch(83% .011 280));
2118
+ --cirth-h4-color: light-dark(oklch(35.3% .027 280), oklch(78.7% .014 280));
2119
+ --cirth-h5-color: light-dark(oklch(39.7% .028 280), oklch(74.3% .018 280));
2120
+ --cirth-h6-color: light-dark(oklch(44% .029 280), oklch(65.7% .025 280));
2121
+ --cirth-mark-color: light-dark(oklch(18% .022 280), oklch(100% 0 0));
2122
+ --cirth-code-color: light-dark(oklch(52.7% .031 280), oklch(65.7% .025 280));
2123
+ --cirth-form-element-selected-background-color: light-dark(oklch(91.7% .004 280), oklch(31% .026 280));
2124
+ --cirth-form-element-border-color: light-dark(oklch(61.3% .028 280), oklch(52.7% .031 280));
2125
+ --cirth-form-element-color: light-dark(oklch(26.7% .025 280), oklch(91.7% .004 280));
2126
+ --cirth-switch-background-color: light-dark(oklch(61.3% .028 280), oklch(52.7% .031 280));
2127
+ --cirth-range-border-color: light-dark(oklch(91.7% .004 280), oklch(26.7% .025 280));
2128
+ --cirth-range-active-border-color: light-dark(oklch(83% .011 280), oklch(31% .026 280));
2129
+ --cirth-progress-background-color: light-dark(oklch(91.7% .004 280), oklch(26.7% .025 280));
2130
+ --cirth-progress-border-color: light-dark(oklch(61.3% .028 280), oklch(52.7% .031 280));
2098
2131
  }
2099
2132
 
2100
2133
  .cirth:where([data-theme="light"]), .cirth :where([data-theme="light"]), .cirth:where(:not([data-theme="dark"])) {
@@ -2122,6 +2155,7 @@
2122
2155
  --cirth-primary-hover-underline: var(--cirth-primary-hover);
2123
2156
  --cirth-primary-focus: oklch(from var(--cirth-primary) l c h / 75%);
2124
2157
  --cirth-primary-inverse: oklch(100% 0 0);
2158
+ --cirth-text-selection-color: oklch(from var(--cirth-primary) calc(l * 1.247) c h / 25%);
2125
2159
  --cirth-code-background-color: oklch(from var(--cirth-canvas) calc(l - .019) c h);
2126
2160
  --cirth-card-sectioning-background-color: oklch(from var(--cirth-canvas) calc(l + .009) c h);
2127
2161
  --cirth-form-element-background-color: oklch(from var(--cirth-canvas) calc(l - .008) c h);
@@ -2129,7 +2163,7 @@
2129
2163
  --cirth-form-element-active-background-color: var(--cirth-canvas);
2130
2164
  --cirth-dropdown-background-color: var(--cirth-card-background-color);
2131
2165
  --cirth-popover-background-color: var(--cirth-card-background-color);
2132
- --cirth-secondary-background: oklch(48.3% .03 264);
2166
+ --cirth-secondary-background: oklch(48.3% .03 280);
2133
2167
  --cirth-secondary-border: var(--cirth-secondary-background);
2134
2168
  --cirth-secondary-hover-border: var(--cirth-secondary-hover-background);
2135
2169
  --cirth-secondary-hover-underline: var(--cirth-secondary-hover);
@@ -2137,7 +2171,9 @@
2137
2171
  --cirth-contrast-border: var(--cirth-contrast-background);
2138
2172
  --cirth-contrast-hover-border: var(--cirth-contrast-hover-background);
2139
2173
  --cirth-contrast-hover-underline: var(--cirth-secondary-hover);
2140
- --cirth-mark-background-color: var(--cirth-warning-surface);
2174
+ --cirth-mark-background-color: color-mix(in oklab,
2175
+ var(--cirth-primary) 18%,
2176
+ var(--cirth-canvas));
2141
2177
  --cirth-ins-color: var(--cirth-success-text);
2142
2178
  --cirth-del-color: var(--cirth-error-text);
2143
2179
  --cirth-blockquote-border-color: var(--cirth-muted-border-color);
@@ -2145,7 +2181,7 @@
2145
2181
  --cirth-button-box-shadow: 0 0 0 #0000;
2146
2182
  --cirth-button-hover-box-shadow: 0 0 0 #0000;
2147
2183
  --cirth-table-border-color: var(--cirth-card-border-color);
2148
- --cirth-table-row-stripped-background-color: oklch(57% .032 264 / .0375);
2184
+ --cirth-table-row-stripped-background-color: oklch(57% .032 280 / .0375);
2149
2185
  --cirth-code-kbd-background-color: var(--cirth-ink);
2150
2186
  --cirth-code-kbd-color: var(--cirth-background-color);
2151
2187
  --cirth-form-element-placeholder-color: var(--cirth-muted-color);
@@ -2162,25 +2198,25 @@
2162
2198
  --cirth-switch-checked-background-color: var(--cirth-primary-background);
2163
2199
  --cirth-switch-color: var(--cirth-primary-inverse);
2164
2200
  --cirth-range-thumb-border-color: var(--cirth-background-color);
2165
- --cirth-range-thumb-color: var(--cirth-secondary-background);
2201
+ --cirth-range-thumb-color: var(--cirth-secondary);
2166
2202
  --cirth-range-thumb-active-color: var(--cirth-primary-background);
2167
2203
  --cirth-accordion-active-summary-color: var(--cirth-primary-hover);
2168
2204
  --cirth-accordion-close-summary-color: var(--cirth-ink);
2169
2205
  --cirth-accordion-open-summary-color: var(--cirth-ink);
2170
2206
  --cirth-card-border-color: color-mix(in oklab,
2171
2207
  var(--cirth-form-element-border-color) 38%,
2172
- var(--cirth-card-background-color));
2173
- --cirth-modal-overlay-background-color: oklch(93.85% .003 264deg / var(--cirth-opacity-overlay));
2208
+ oklch(from var(--cirth-card-background-color) l 0 h));
2209
+ --cirth-modal-overlay-background-color: oklch(93.85% .002 280deg / var(--cirth-opacity-overlay));
2174
2210
  --cirth-meter-optimum-color: var(--cirth-success);
2175
2211
  --cirth-meter-suboptimum-color: var(--cirth-warning);
2176
2212
  --cirth-meter-even-less-good-color: var(--cirth-error);
2177
2213
  --cirth-progress-color: var(--cirth-primary-background);
2178
- --cirth-icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(98, 107, 126)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
2179
- --cirth-icon-date: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(98, 107, 126)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E");
2180
- --cirth-icon-time: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(98, 107, 126)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpolyline points='12 6 12 12 16 14'%3E%3C/polyline%3E%3C/svg%3E");
2181
- --cirth-icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(98, 107, 126)' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
2182
- --cirth-icon-valid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(40, 124, 87)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
2183
- --cirth-icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(189, 47, 33)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
2214
+ --cirth-icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(103, 105, 125)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
2215
+ --cirth-icon-date: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(103, 105, 125)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E");
2216
+ --cirth-icon-time: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(103, 105, 125)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpolyline points='12 6 12 12 16 14'%3E%3C/polyline%3E%3C/svg%3E");
2217
+ --cirth-icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(103, 105, 125)' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
2218
+ --cirth-icon-valid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(40, 126, 74)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
2219
+ --cirth-icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(189, 44, 56)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
2184
2220
  }
2185
2221
 
2186
2222
  @media only screen and (prefers-color-scheme: dark) {
@@ -2209,7 +2245,8 @@
2209
2245
  black);
2210
2246
  --cirth-primary-hover-border: var(--cirth-primary-hover-background);
2211
2247
  --cirth-primary-hover-underline: var(--cirth-primary-hover);
2212
- --cirth-primary-focus: oklch(from var(--cirth-primary) l c h / 70%);
2248
+ --cirth-primary-focus: oklch(from var(--cirth-primary) l c h / 80%);
2249
+ --cirth-text-selection-color: oklch(from var(--cirth-primary) calc(l * 1.065) c h / 18.75%);
2213
2250
  --cirth-primary-inverse: oklch(100% 0 0);
2214
2251
  --cirth-code-background-color: oklch(from var(--cirth-canvas) calc(l - .02) c h);
2215
2252
  --cirth-card-sectioning-background-color: oklch(from var(--cirth-canvas) calc(l + .025) c h);
@@ -2218,7 +2255,7 @@
2218
2255
  --cirth-form-element-active-background-color: var(--cirth-canvas);
2219
2256
  --cirth-dropdown-background-color: var(--cirth-card-background-color);
2220
2257
  --cirth-popover-background-color: var(--cirth-card-background-color);
2221
- --cirth-secondary-background: oklch(48.3% .03 264);
2258
+ --cirth-secondary-background: oklch(48.3% .03 280);
2222
2259
  --cirth-secondary-border: var(--cirth-secondary-background);
2223
2260
  --cirth-secondary-hover-border: var(--cirth-secondary-hover-background);
2224
2261
  --cirth-secondary-hover-underline: var(--cirth-secondary-hover);
@@ -2226,7 +2263,9 @@
2226
2263
  --cirth-contrast-border: var(--cirth-contrast-background);
2227
2264
  --cirth-contrast-hover-border: var(--cirth-contrast-hover-background);
2228
2265
  --cirth-contrast-hover-underline: var(--cirth-contrast-hover);
2229
- --cirth-mark-background-color: var(--cirth-warning-surface);
2266
+ --cirth-mark-background-color: color-mix(in oklab,
2267
+ var(--cirth-primary) 24%,
2268
+ var(--cirth-canvas));
2230
2269
  --cirth-ins-color: var(--cirth-success-text);
2231
2270
  --cirth-del-color: var(--cirth-error-text);
2232
2271
  --cirth-blockquote-border-color: var(--cirth-muted-border-color);
@@ -2234,10 +2273,10 @@
2234
2273
  --cirth-button-box-shadow: 0 0 0 #0000;
2235
2274
  --cirth-button-hover-box-shadow: 0 0 0 #0000;
2236
2275
  --cirth-table-border-color: var(--cirth-card-border-color);
2237
- --cirth-table-row-stripped-background-color: oklch(57% .032 264 / .0375);
2276
+ --cirth-table-row-stripped-background-color: oklch(57% .032 280 / .0375);
2238
2277
  --cirth-code-kbd-background-color: var(--cirth-ink);
2239
2278
  --cirth-code-kbd-color: var(--cirth-background-color);
2240
- --cirth-form-element-placeholder-color: oklch(65.7% .03 264);
2279
+ --cirth-form-element-placeholder-color: oklch(65.7% .025 280);
2241
2280
  --cirth-form-element-active-border-color: var(--cirth-primary-border);
2242
2281
  --cirth-form-element-focus-color: var(--cirth-primary-focus);
2243
2282
  --cirth-form-element-disabled-opacity: var(--cirth-opacity-disabled);
@@ -2251,7 +2290,7 @@
2251
2290
  --cirth-switch-checked-background-color: var(--cirth-primary-background);
2252
2291
  --cirth-switch-color: var(--cirth-primary-inverse);
2253
2292
  --cirth-range-thumb-border-color: var(--cirth-background-color);
2254
- --cirth-range-thumb-color: var(--cirth-secondary-background);
2293
+ --cirth-range-thumb-color: var(--cirth-secondary);
2255
2294
  --cirth-range-thumb-active-color: var(--cirth-primary-background);
2256
2295
  --cirth-accordion-active-summary-color: var(--cirth-primary-hover);
2257
2296
  --cirth-accordion-close-summary-color: var(--cirth-ink);
@@ -2259,17 +2298,17 @@
2259
2298
  --cirth-card-border-color: color-mix(in oklab,
2260
2299
  var(--cirth-form-element-border-color) 46%,
2261
2300
  var(--cirth-card-background-color));
2262
- --cirth-modal-overlay-background-color: oklch(9% 0 0deg / var(--cirth-opacity-overlay));
2301
+ --cirth-modal-overlay-background-color: oklch(9% .011 280deg / var(--cirth-opacity-overlay));
2263
2302
  --cirth-meter-optimum-color: var(--cirth-success);
2264
2303
  --cirth-meter-suboptimum-color: var(--cirth-warning);
2265
2304
  --cirth-meter-even-less-good-color: var(--cirth-error);
2266
2305
  --cirth-progress-color: var(--cirth-primary);
2267
- --cirth-icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(136, 146, 164)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
2268
- --cirth-icon-date: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(136, 146, 164)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E");
2269
- --cirth-icon-time: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(136, 146, 164)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpolyline points='12 6 12 12 16 14'%3E%3C/polyline%3E%3C/svg%3E");
2270
- --cirth-icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(136, 146, 164)' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
2271
- --cirth-icon-valid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(75, 215, 153)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
2272
- --cirth-icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(246, 160, 145)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
2306
+ --cirth-icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(142, 144, 161)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
2307
+ --cirth-icon-date: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(142, 144, 161)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E");
2308
+ --cirth-icon-time: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(142, 144, 161)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpolyline points='12 6 12 12 16 14'%3E%3C/polyline%3E%3C/svg%3E");
2309
+ --cirth-icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(142, 144, 161)' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
2310
+ --cirth-icon-valid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(75, 216, 131)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
2311
+ --cirth-icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(246, 158, 155)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
2273
2312
  }
2274
2313
  }
2275
2314
 
@@ -2298,7 +2337,8 @@
2298
2337
  black);
2299
2338
  --cirth-primary-hover-border: var(--cirth-primary-hover-background);
2300
2339
  --cirth-primary-hover-underline: var(--cirth-primary-hover);
2301
- --cirth-primary-focus: oklch(from var(--cirth-primary) l c h / 70%);
2340
+ --cirth-primary-focus: oklch(from var(--cirth-primary) l c h / 80%);
2341
+ --cirth-text-selection-color: oklch(from var(--cirth-primary) calc(l * 1.065) c h / 18.75%);
2302
2342
  --cirth-primary-inverse: oklch(100% 0 0);
2303
2343
  --cirth-code-background-color: oklch(from var(--cirth-canvas) calc(l - .02) c h);
2304
2344
  --cirth-card-sectioning-background-color: oklch(from var(--cirth-canvas) calc(l + .025) c h);
@@ -2307,7 +2347,7 @@
2307
2347
  --cirth-form-element-active-background-color: var(--cirth-canvas);
2308
2348
  --cirth-dropdown-background-color: var(--cirth-card-background-color);
2309
2349
  --cirth-popover-background-color: var(--cirth-card-background-color);
2310
- --cirth-secondary-background: oklch(48.3% .03 264);
2350
+ --cirth-secondary-background: oklch(48.3% .03 280);
2311
2351
  --cirth-secondary-border: var(--cirth-secondary-background);
2312
2352
  --cirth-secondary-hover-border: var(--cirth-secondary-hover-background);
2313
2353
  --cirth-secondary-hover-underline: var(--cirth-secondary-hover);
@@ -2315,7 +2355,9 @@
2315
2355
  --cirth-contrast-border: var(--cirth-contrast-background);
2316
2356
  --cirth-contrast-hover-border: var(--cirth-contrast-hover-background);
2317
2357
  --cirth-contrast-hover-underline: var(--cirth-contrast-hover);
2318
- --cirth-mark-background-color: var(--cirth-warning-surface);
2358
+ --cirth-mark-background-color: color-mix(in oklab,
2359
+ var(--cirth-primary) 24%,
2360
+ var(--cirth-canvas));
2319
2361
  --cirth-ins-color: var(--cirth-success-text);
2320
2362
  --cirth-del-color: var(--cirth-error-text);
2321
2363
  --cirth-blockquote-border-color: var(--cirth-muted-border-color);
@@ -2323,10 +2365,10 @@
2323
2365
  --cirth-button-box-shadow: 0 0 0 #0000;
2324
2366
  --cirth-button-hover-box-shadow: 0 0 0 #0000;
2325
2367
  --cirth-table-border-color: var(--cirth-card-border-color);
2326
- --cirth-table-row-stripped-background-color: oklch(57% .032 264 / .0375);
2368
+ --cirth-table-row-stripped-background-color: oklch(57% .032 280 / .0375);
2327
2369
  --cirth-code-kbd-background-color: var(--cirth-ink);
2328
2370
  --cirth-code-kbd-color: var(--cirth-background-color);
2329
- --cirth-form-element-placeholder-color: oklch(65.7% .03 264);
2371
+ --cirth-form-element-placeholder-color: oklch(65.7% .025 280);
2330
2372
  --cirth-form-element-active-border-color: var(--cirth-primary-border);
2331
2373
  --cirth-form-element-focus-color: var(--cirth-primary-focus);
2332
2374
  --cirth-form-element-disabled-opacity: var(--cirth-opacity-disabled);
@@ -2340,7 +2382,7 @@
2340
2382
  --cirth-switch-checked-background-color: var(--cirth-primary-background);
2341
2383
  --cirth-switch-color: var(--cirth-primary-inverse);
2342
2384
  --cirth-range-thumb-border-color: var(--cirth-background-color);
2343
- --cirth-range-thumb-color: var(--cirth-secondary-background);
2385
+ --cirth-range-thumb-color: var(--cirth-secondary);
2344
2386
  --cirth-range-thumb-active-color: var(--cirth-primary-background);
2345
2387
  --cirth-accordion-active-summary-color: var(--cirth-primary-hover);
2346
2388
  --cirth-accordion-close-summary-color: var(--cirth-ink);
@@ -2348,17 +2390,17 @@
2348
2390
  --cirth-card-border-color: color-mix(in oklab,
2349
2391
  var(--cirth-form-element-border-color) 46%,
2350
2392
  var(--cirth-card-background-color));
2351
- --cirth-modal-overlay-background-color: oklch(9% 0 0deg / var(--cirth-opacity-overlay));
2393
+ --cirth-modal-overlay-background-color: oklch(9% .011 280deg / var(--cirth-opacity-overlay));
2352
2394
  --cirth-meter-optimum-color: var(--cirth-success);
2353
2395
  --cirth-meter-suboptimum-color: var(--cirth-warning);
2354
2396
  --cirth-meter-even-less-good-color: var(--cirth-error);
2355
2397
  --cirth-progress-color: var(--cirth-primary);
2356
- --cirth-icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(136, 146, 164)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
2357
- --cirth-icon-date: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(136, 146, 164)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E");
2358
- --cirth-icon-time: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(136, 146, 164)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpolyline points='12 6 12 12 16 14'%3E%3C/polyline%3E%3C/svg%3E");
2359
- --cirth-icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(136, 146, 164)' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
2360
- --cirth-icon-valid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(75, 215, 153)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
2361
- --cirth-icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(246, 160, 145)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
2398
+ --cirth-icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(142, 144, 161)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
2399
+ --cirth-icon-date: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(142, 144, 161)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E");
2400
+ --cirth-icon-time: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(142, 144, 161)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpolyline points='12 6 12 12 16 14'%3E%3C/polyline%3E%3C/svg%3E");
2401
+ --cirth-icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(142, 144, 161)' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
2402
+ --cirth-icon-valid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(75, 216, 131)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
2403
+ --cirth-icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(246, 158, 155)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
2362
2404
  }
2363
2405
 
2364
2406
  .cirth progress, .cirth [type="checkbox"], .cirth [type="radio"], .cirth [type="range"] {
@@ -2367,117 +2409,117 @@
2367
2409
 
2368
2410
  @media (prefers-contrast: more) {
2369
2411
  .cirth:where([data-theme="light"]), .cirth :where([data-theme="light"]), .cirth:where(:not([data-theme="dark"])) {
2370
- --cirth-ink: oklch(22.3% .006 264);
2412
+ --cirth-ink: oklch(22.3% .023 280);
2371
2413
  --cirth-h1-color: var(--cirth-color);
2372
2414
  --cirth-h2-color: var(--cirth-color);
2373
2415
  --cirth-h3-color: var(--cirth-color);
2374
2416
  --cirth-h4-color: var(--cirth-color);
2375
2417
  --cirth-h5-color: var(--cirth-color);
2376
2418
  --cirth-h6-color: var(--cirth-color);
2377
- --cirth-muted-color: oklch(39.7% .025 264);
2378
- --cirth-secondary: oklch(39.7% .025 264);
2379
- --cirth-code-color: oklch(35.3% .021 264);
2380
- --cirth-link-visited-color: oklch(35.3% .021 264);
2381
- --cirth-muted-border-color: oklch(57% .032 264);
2382
- --cirth-icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(64, 71, 85)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
2383
- --cirth-icon-date: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(64, 71, 85)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E");
2384
- --cirth-icon-time: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(64, 71, 85)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpolyline points='12 6 12 12 16 14'%3E%3C/polyline%3E%3C/svg%3E");
2385
- --cirth-icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(64, 71, 85)' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
2386
- --cirth-form-element-border-color: oklch(39.7% .025 264);
2387
- --cirth-form-element-invalid-border-color: oklch(48.3% .166 29.73);
2388
- --cirth-form-element-valid-border-color: oklch(48.3% .092 160.59);
2389
- --cirth-primary: oklch(39.7% .073 69.35);
2390
- --cirth-primary-hover: oklch(31% .057 69.35);
2419
+ --cirth-muted-color: oklch(39.7% .028 280);
2420
+ --cirth-secondary: oklch(39.7% .028 280);
2421
+ --cirth-code-color: oklch(35.3% .027 280);
2422
+ --cirth-link-visited-color: oklch(35.3% .027 280);
2423
+ --cirth-muted-border-color: oklch(57% .032 280);
2424
+ --cirth-icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(68, 69, 86)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
2425
+ --cirth-icon-date: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(68, 69, 86)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E");
2426
+ --cirth-icon-time: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(68, 69, 86)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpolyline points='12 6 12 12 16 14'%3E%3C/polyline%3E%3C/svg%3E");
2427
+ --cirth-icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(68, 69, 86)' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
2428
+ --cirth-form-element-border-color: oklch(39.7% .028 280);
2429
+ --cirth-form-element-invalid-border-color: oklch(48.3% .165 22);
2430
+ --cirth-form-element-valid-border-color: oklch(48.3% .106 153);
2431
+ --cirth-primary: oklch(39.7% .081 44);
2432
+ --cirth-primary-hover: oklch(31% .063 44);
2391
2433
  --cirth-primary-underline: var(--cirth-primary);
2392
2434
  --cirth-secondary-underline: var(--cirth-secondary);
2393
2435
  --cirth-contrast-underline: var(--cirth-contrast);
2394
- --cirth-primary-focus: oklch(48.3% .089 69.35);
2395
- --cirth-secondary-focus: oklch(48.3% .03 264);
2396
- --cirth-contrast-focus: oklch(48.3% .03 264);
2397
- --cirth-switch-background-color: oklch(48.3% .03 264);
2398
- --cirth-progress-border-color: oklch(48.3% .03 264);
2399
- --cirth-meter-optimum-color: oklch(44% .084 160.59);
2400
- --cirth-meter-suboptimum-color: oklch(39.7% .07 78);
2401
- --cirth-meter-even-less-good-color: oklch(35.3% .122 29.73);
2436
+ --cirth-primary-focus: oklch(48.3% .098 44);
2437
+ --cirth-secondary-focus: oklch(48.3% .03 280);
2438
+ --cirth-contrast-focus: oklch(48.3% .03 280);
2439
+ --cirth-switch-background-color: oklch(48.3% .03 280);
2440
+ --cirth-progress-border-color: oklch(48.3% .03 280);
2441
+ --cirth-meter-optimum-color: oklch(44% .096 153);
2442
+ --cirth-meter-suboptimum-color: oklch(39.7% .069 89.5);
2443
+ --cirth-meter-even-less-good-color: oklch(35.3% .121 22);
2402
2444
  }
2403
2445
  }
2404
2446
 
2405
2447
  @media only screen and (prefers-contrast: more) and (prefers-color-scheme: dark) {
2406
2448
  .cirth:where(:not([data-theme])) {
2407
- --cirth-ink: oklch(96% 0 264);
2449
+ --cirth-ink: oklch(96% 0 280);
2408
2450
  --cirth-h1-color: var(--cirth-color);
2409
2451
  --cirth-h2-color: var(--cirth-color);
2410
2452
  --cirth-h3-color: var(--cirth-color);
2411
2453
  --cirth-h4-color: var(--cirth-color);
2412
2454
  --cirth-h5-color: var(--cirth-color);
2413
2455
  --cirth-h6-color: var(--cirth-color);
2414
- --cirth-muted-color: oklch(78.7% .021 264);
2415
- --cirth-icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(179, 186, 200)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
2416
- --cirth-icon-date: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(179, 186, 200)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E");
2417
- --cirth-icon-time: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(179, 186, 200)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpolyline points='12 6 12 12 16 14'%3E%3C/polyline%3E%3C/svg%3E");
2418
- --cirth-icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(179, 186, 200)' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
2419
- --cirth-secondary: oklch(78.7% .021 264);
2420
- --cirth-code-color: oklch(83% .016 264);
2421
- --cirth-link-visited-color: oklch(78.7% .021 264);
2422
- --cirth-muted-border-color: oklch(57% .032 264);
2456
+ --cirth-muted-color: oklch(78.7% .014 280);
2457
+ --cirth-icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(183, 185, 195)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
2458
+ --cirth-icon-date: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(183, 185, 195)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E");
2459
+ --cirth-icon-time: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(183, 185, 195)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpolyline points='12 6 12 12 16 14'%3E%3C/polyline%3E%3C/svg%3E");
2460
+ --cirth-icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(183, 185, 195)' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
2461
+ --cirth-secondary: oklch(78.7% .014 280);
2462
+ --cirth-code-color: oklch(83% .011 280);
2463
+ --cirth-link-visited-color: oklch(78.7% .014 280);
2464
+ --cirth-muted-border-color: oklch(57% .032 280);
2423
2465
  --cirth-card-border-color: var(--cirth-muted-border-color);
2424
- --cirth-form-element-border-color: oklch(70% .028 264);
2425
- --cirth-form-element-invalid-border-color: oklch(78.7% .106 29.73);
2426
- --cirth-form-element-valid-border-color: oklch(78.7% .15 160.59);
2427
- --cirth-primary: oklch(78.7% .146 69.35);
2428
- --cirth-primary-hover: oklch(87.3% .082 69.35);
2429
- --cirth-primary-background: oklch(44% .081 69.35);
2430
- --cirth-primary-hover-background: oklch(39.7% .073 69.35);
2466
+ --cirth-form-element-border-color: oklch(70% .021 280);
2467
+ --cirth-form-element-invalid-border-color: oklch(78.7% .105 22);
2468
+ --cirth-form-element-valid-border-color: oklch(78.7% .172 153);
2469
+ --cirth-primary: oklch(78.7% .092 44);
2470
+ --cirth-primary-hover: oklch(87.3% .051 44);
2471
+ --cirth-primary-background: oklch(44% .09 44);
2472
+ --cirth-primary-hover-background: oklch(39.7% .081 44);
2431
2473
  --cirth-primary-underline: var(--cirth-primary);
2432
2474
  --cirth-secondary-underline: var(--cirth-secondary);
2433
2475
  --cirth-contrast-underline: var(--cirth-contrast);
2434
- --cirth-primary-focus: oklch(70% .129 69.35);
2435
- --cirth-secondary-focus: oklch(70% .028 264);
2436
- --cirth-contrast-focus: oklch(87.3% .011 264);
2437
- --cirth-switch-background-color: oklch(65.7% .03 264);
2438
- --cirth-progress-border-color: oklch(70% .028 264);
2439
- --cirth-meter-optimum-color: oklch(74.3% .142 160.59);
2440
- --cirth-meter-suboptimum-color: oklch(78.7% .139 78);
2441
- --cirth-meter-even-less-good-color: oklch(83% .081 29.73);
2476
+ --cirth-primary-focus: oklch(70% .141 44);
2477
+ --cirth-secondary-focus: oklch(70% .021 280);
2478
+ --cirth-contrast-focus: oklch(87.3% .007 280);
2479
+ --cirth-switch-background-color: oklch(65.7% .025 280);
2480
+ --cirth-progress-border-color: oklch(70% .021 280);
2481
+ --cirth-meter-optimum-color: oklch(74.3% .163 153);
2482
+ --cirth-meter-suboptimum-color: oklch(78.7% .137 89.5);
2483
+ --cirth-meter-even-less-good-color: oklch(83% .08 22);
2442
2484
  }
2443
2485
  }
2444
2486
 
2445
2487
  @media (prefers-contrast: more) {
2446
2488
  .cirth:where([data-theme="dark"]), .cirth :where([data-theme="dark"]) {
2447
- --cirth-ink: oklch(96% 0 264);
2489
+ --cirth-ink: oklch(96% 0 280);
2448
2490
  --cirth-h1-color: var(--cirth-color);
2449
2491
  --cirth-h2-color: var(--cirth-color);
2450
2492
  --cirth-h3-color: var(--cirth-color);
2451
2493
  --cirth-h4-color: var(--cirth-color);
2452
2494
  --cirth-h5-color: var(--cirth-color);
2453
2495
  --cirth-h6-color: var(--cirth-color);
2454
- --cirth-muted-color: oklch(78.7% .021 264);
2455
- --cirth-icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(179, 186, 200)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
2456
- --cirth-icon-date: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(179, 186, 200)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E");
2457
- --cirth-icon-time: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(179, 186, 200)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpolyline points='12 6 12 12 16 14'%3E%3C/polyline%3E%3C/svg%3E");
2458
- --cirth-icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(179, 186, 200)' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
2459
- --cirth-secondary: oklch(78.7% .021 264);
2460
- --cirth-code-color: oklch(83% .016 264);
2461
- --cirth-link-visited-color: oklch(78.7% .021 264);
2462
- --cirth-muted-border-color: oklch(57% .032 264);
2496
+ --cirth-muted-color: oklch(78.7% .014 280);
2497
+ --cirth-icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(183, 185, 195)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
2498
+ --cirth-icon-date: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(183, 185, 195)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E");
2499
+ --cirth-icon-time: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(183, 185, 195)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpolyline points='12 6 12 12 16 14'%3E%3C/polyline%3E%3C/svg%3E");
2500
+ --cirth-icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(183, 185, 195)' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
2501
+ --cirth-secondary: oklch(78.7% .014 280);
2502
+ --cirth-code-color: oklch(83% .011 280);
2503
+ --cirth-link-visited-color: oklch(78.7% .014 280);
2504
+ --cirth-muted-border-color: oklch(57% .032 280);
2463
2505
  --cirth-card-border-color: var(--cirth-muted-border-color);
2464
- --cirth-form-element-border-color: oklch(70% .028 264);
2465
- --cirth-form-element-invalid-border-color: oklch(78.7% .106 29.73);
2466
- --cirth-form-element-valid-border-color: oklch(78.7% .15 160.59);
2467
- --cirth-primary: oklch(78.7% .146 69.35);
2468
- --cirth-primary-hover: oklch(87.3% .082 69.35);
2469
- --cirth-primary-background: oklch(44% .081 69.35);
2470
- --cirth-primary-hover-background: oklch(39.7% .073 69.35);
2506
+ --cirth-form-element-border-color: oklch(70% .021 280);
2507
+ --cirth-form-element-invalid-border-color: oklch(78.7% .105 22);
2508
+ --cirth-form-element-valid-border-color: oklch(78.7% .172 153);
2509
+ --cirth-primary: oklch(78.7% .092 44);
2510
+ --cirth-primary-hover: oklch(87.3% .051 44);
2511
+ --cirth-primary-background: oklch(44% .09 44);
2512
+ --cirth-primary-hover-background: oklch(39.7% .081 44);
2471
2513
  --cirth-primary-underline: var(--cirth-primary);
2472
2514
  --cirth-secondary-underline: var(--cirth-secondary);
2473
2515
  --cirth-contrast-underline: var(--cirth-contrast);
2474
- --cirth-primary-focus: oklch(70% .129 69.35);
2475
- --cirth-secondary-focus: oklch(70% .028 264);
2476
- --cirth-contrast-focus: oklch(87.3% .011 264);
2477
- --cirth-switch-background-color: oklch(65.7% .03 264);
2478
- --cirth-progress-border-color: oklch(70% .028 264);
2479
- --cirth-meter-optimum-color: oklch(74.3% .142 160.59);
2480
- --cirth-meter-suboptimum-color: oklch(78.7% .139 78);
2481
- --cirth-meter-even-less-good-color: oklch(83% .081 29.73);
2516
+ --cirth-primary-focus: oklch(70% .141 44);
2517
+ --cirth-secondary-focus: oklch(70% .021 280);
2518
+ --cirth-contrast-focus: oklch(87.3% .007 280);
2519
+ --cirth-switch-background-color: oklch(65.7% .025 280);
2520
+ --cirth-progress-border-color: oklch(70% .021 280);
2521
+ --cirth-meter-optimum-color: oklch(74.3% .163 153);
2522
+ --cirth-meter-suboptimum-color: oklch(78.7% .137 89.5);
2523
+ --cirth-meter-even-less-good-color: oklch(83% .08 22);
2482
2524
  }
2483
2525
  }