@cat-of-summer/st-style 1.0.3
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 +21 -0
- package/README.md +180 -0
- package/dist/effects.min.css +1 -0
- package/dist/main.min.css +1 -0
- package/package.json +36 -0
- package/src/effects/_blink.scss +16 -0
- package/src/effects/_blur.scss +11 -0
- package/src/effects/_bounce.scss +24 -0
- package/src/effects/_config.scss +22 -0
- package/src/effects/_duration.scss +10 -0
- package/src/effects/_float.scss +27 -0
- package/src/effects/_glow.scss +12 -0
- package/src/effects/_grayscale.scss +12 -0
- package/src/effects/_heartbeat.scss +21 -0
- package/src/effects/_jello.scss +20 -0
- package/src/effects/_opacity.scss +18 -0
- package/src/effects/_pulse.scss +18 -0
- package/src/effects/_raise.scss +9 -0
- package/src/effects/_reduced-motion.scss +7 -0
- package/src/effects/_reset.scss +17 -0
- package/src/effects/_ripple.scss +31 -0
- package/src/effects/_root.scss +10 -0
- package/src/effects/_rotate.scss +12 -0
- package/src/effects/_scale.scss +12 -0
- package/src/effects/_shadow.scss +22 -0
- package/src/effects/_sheen.scss +34 -0
- package/src/effects/_shimmer-text.scss +36 -0
- package/src/effects/_skew.scss +12 -0
- package/src/effects/_spin.scss +14 -0
- package/src/effects/_swing.scss +21 -0
- package/src/effects/_tada.scss +20 -0
- package/src/effects/_typing-text.scss +43 -0
- package/src/effects/_underline.scss +36 -0
- package/src/effects/_vibrate.scss +31 -0
- package/src/effects/_wobble.scss +20 -0
- package/src/effects/index.scss +33 -0
- package/src/main/_config.scss +67 -0
- package/src/main/_container-query.scss +69 -0
- package/src/main/_display.scss +71 -0
- package/src/main/_editor.scss +65 -0
- package/src/main/_grid.scss +35 -0
- package/src/main/_reset.scss +202 -0
- package/src/main/_root.scss +26 -0
- package/src/main/_sizing.scss +20 -0
- package/src/main/_spacing.scss +44 -0
- package/src/main/_typography.scss +41 -0
- package/src/main/index.scss +11 -0
package/LICENSE
ADDED
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2026 cat-of-summer
|
|
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,180 @@
|
|
|
1
|
+
# st-style
|
|
2
|
+
|
|
3
|
+
Attribute-driven CSS utility framework. Authored in SCSS, shipped as compiled CSS.
|
|
4
|
+
|
|
5
|
+
- **`main`** — layout/typography/spacing/grid/display utilities + reset.
|
|
6
|
+
- **`effects`** — hover/animation effects (`scale`, `pulse`, `float`, `ripple`, …).
|
|
7
|
+
|
|
8
|
+
Markup uses attributes instead of classes:
|
|
9
|
+
|
|
10
|
+
```html
|
|
11
|
+
<section container>
|
|
12
|
+
<div grid gap-4>
|
|
13
|
+
<article col="12 md-6" p="4 md-8" sz="4 md-6">…</article>
|
|
14
|
+
</div>
|
|
15
|
+
</section>
|
|
16
|
+
<button scale="hover" shadow="hover active">Click</button>
|
|
17
|
+
```
|
|
18
|
+
|
|
19
|
+
## Container scaling
|
|
20
|
+
|
|
21
|
+
`[container]` drives fluid, container-relative spacing. All spacing/sizing
|
|
22
|
+
utilities (`[m]`/`[p]`/`[gap]`/`[sz]`) are multiples of `--space-step`; inside a
|
|
23
|
+
scaling **source** `--space-step` becomes `cqw`, so the whole subtree scales with
|
|
24
|
+
the container's width. Три оси задаются одним атрибутом, токены через пробел:
|
|
25
|
+
|
|
26
|
+
| ось | токены | что делает |
|
|
27
|
+
|-----|--------|-----------|
|
|
28
|
+
| **query / static** | `query`, `static`, `md-query`, `lg-static`, … | per-breakpoint: `query` — элемент становится источником (потомки масштабируются в `cqw`); `static` — фиксированный px. `static` побеждает при конфликте. |
|
|
29
|
+
| **число** | `1`, `md-2`, `lg-5`, … | per-breakpoint cq-step: `N → N * $cq-unit` cqw (build-time `$cq-unit = 0.4cqw`, т.е. `1 → 0.4cqw` = bare `query`, `2 → 0.8cqw`, `5 → 2cqw`). На источнике — шаг для потомков; на голом `[container]` — переопределяет шаг **относительно предка-источника**, сам источником не становясь. |
|
|
30
|
+
| **block** | `block` | глобальный флаг: где `query` активен, источник ещё и по высоте (`container-type: size`, включает `cqh`). Под `static` игнорируется. |
|
|
31
|
+
|
|
32
|
+
```html
|
|
33
|
+
<!-- cqw до md, фикс px md–lg, крупнее (2cqw) от lg -->
|
|
34
|
+
<section container="query md-static lg-5">
|
|
35
|
+
<article p="4">…</article>
|
|
36
|
+
|
|
37
|
+
<!-- ребёнок: свой шаг 0.8cqw ОТНОСИТЕЛЬНО секции-источника, не новый источник -->
|
|
38
|
+
<div container="md-2 lg-1"><p p="4">…</p></div>
|
|
39
|
+
</section>
|
|
40
|
+
```
|
|
41
|
+
|
|
42
|
+
Голый `[container]` — только лэйаут (ширина/центрирование/max-width-ладдер), **не**
|
|
43
|
+
источник масштабирования; добавь `query`, чтобы включить `cqw`.
|
|
44
|
+
|
|
45
|
+
**Множитель — рантайм.** `--cq-step` — множитель отступов внутри `query`, полный
|
|
46
|
+
аналог `--space-step` (снаружи): правило `@container` подставляет `--cq-step` в
|
|
47
|
+
`--space-step`. Переопредели его в CSS/`style`, чтобы ремасштабировать контейнер:
|
|
48
|
+
|
|
49
|
+
```html
|
|
50
|
+
<div container="query" style="--cq-step: 0.6cqw">…</div> <!-- как style="--space-step: …" -->
|
|
51
|
+
```
|
|
52
|
+
|
|
53
|
+
Токены `query`/число — шорткаты для `--cq-step`. Build-time конфиг
|
|
54
|
+
(`src/main/_config.scss`): `$cq-unit` (cqw в одном числовом шаге), `$cq-max` (верхняя
|
|
55
|
+
граница чисел). Рантайм-переменные: `--cq-step` (множитель) и `--cq-fixed` (фикс-шаг
|
|
56
|
+
для `static`, по умолчанию `= --space-step`).
|
|
57
|
+
|
|
58
|
+
**Сырой `cqw` вручную.** Если пишешь `font-size: 4cqw` в своём CSS — поставь
|
|
59
|
+
`query` на предке: он задаёт `container-type: inline-size`, и `cqw` резолвится
|
|
60
|
+
относительно него. Но сырой `cqw` **не выключается** токеном `static` (он зависит
|
|
61
|
+
от `container-type`, а не от имени `query-ctx`). Чтобы font-size переключался
|
|
62
|
+
fluid↔fixed по брейкпоинтам, используй токен `[sz]` (он на `--sz-step` = `--space-step/4`
|
|
63
|
+
и откатывается к фикс px автоматически, когда источник `static`), а не сырой `cqw`.
|
|
64
|
+
|
|
65
|
+
## Development
|
|
66
|
+
|
|
67
|
+
```bash
|
|
68
|
+
npm install # installs sass, builds dist/ via the prepare script
|
|
69
|
+
npm run build # compile src/ → dist/*.min.css
|
|
70
|
+
npm run watch # rebuild on change
|
|
71
|
+
```
|
|
72
|
+
|
|
73
|
+
Source layout:
|
|
74
|
+
|
|
75
|
+
```
|
|
76
|
+
src/
|
|
77
|
+
_config.scss # build-time config (shared partial)
|
|
78
|
+
main/ index.scss + _*.scss partials # → dist/main.min.css
|
|
79
|
+
effects/ index.scss + _*.scss partials # → dist/effects.min.css
|
|
80
|
+
```
|
|
81
|
+
|
|
82
|
+
**Conventions** (`build.mjs` relies on these — no script edits needed to extend):
|
|
83
|
+
|
|
84
|
+
- A **folder** under `src/` whose name does **not** start with `_` is a *bundle*.
|
|
85
|
+
Its `index.scss` is compiled to `dist/<folder>.min.css`. Drop a new
|
|
86
|
+
`src/<name>/index.scss` and it is built automatically.
|
|
87
|
+
- A **file or folder** starting with `_` is shared content (a Sass *partial* /
|
|
88
|
+
partials folder), pulled in via `@use` and never compiled on its own.
|
|
89
|
+
|
|
90
|
+
`dist/` is generated and git-ignored (only minified output is produced). It is
|
|
91
|
+
built on `npm install` (`prepare`), on `npm publish` (`prepack`), and in CI to
|
|
92
|
+
attach artifacts to releases.
|
|
93
|
+
|
|
94
|
+
## Configuration
|
|
95
|
+
|
|
96
|
+
Each bundle has its own config partial in its folder — `src/main/_config.scss`
|
|
97
|
+
and `src/effects/_config.scss` — since the two bundles share no settings.
|
|
98
|
+
|
|
99
|
+
For `main`, `$breakpoints` is the single source of truth: one map drives all
|
|
100
|
+
responsive utilities and the `[container]` ladder. Each breakpoint has a `min`
|
|
101
|
+
(the `min-width` threshold) and an optional `container` (the `[container]`
|
|
102
|
+
max-width from that step up; omit it to keep the container fluid there). Other
|
|
103
|
+
`main` knobs are scales (`$sz-max`/`$space-max`/`$gap-max`/`$lc-max`) and
|
|
104
|
+
typography tokens. For `effects`, `$durations` is the duration map.
|
|
105
|
+
|
|
106
|
+
Every variable has `!default`, so a consumer overrides it **before** loading the
|
|
107
|
+
relevant bundle:
|
|
108
|
+
|
|
109
|
+
```scss
|
|
110
|
+
@use '@cat-of-summer/st-style/scss/main/config' with (
|
|
111
|
+
$breakpoints: (
|
|
112
|
+
xs: (min: 360px, container: 340px),
|
|
113
|
+
sm: (min: 576px, container: 540px),
|
|
114
|
+
md: (min: 768px, container: 720px),
|
|
115
|
+
lg: (min: 1440px, container: 1320px),
|
|
116
|
+
),
|
|
117
|
+
$space-max: 40
|
|
118
|
+
);
|
|
119
|
+
@use '@cat-of-summer/st-style/scss/main';
|
|
120
|
+
|
|
121
|
+
@use '@cat-of-summer/st-style/scss/effects/config' with (
|
|
122
|
+
$durations: (fast: 0.2s, slow: 1s)
|
|
123
|
+
);
|
|
124
|
+
@use '@cat-of-summer/st-style/scss/effects';
|
|
125
|
+
```
|
|
126
|
+
|
|
127
|
+
Runtime theming (colours, step sizes, durations) is done with CSS custom
|
|
128
|
+
properties — override `--space-step`, `--fs-h1`, `--td-fast`, … in your own CSS.
|
|
129
|
+
|
|
130
|
+
## Releasing
|
|
131
|
+
|
|
132
|
+
Releases are triggered by **pushing a `v*` tag** (not by ordinary pushes):
|
|
133
|
+
|
|
134
|
+
```bash
|
|
135
|
+
git tag v0.3.2
|
|
136
|
+
git push origin v0.3.2
|
|
137
|
+
```
|
|
138
|
+
|
|
139
|
+
`.github/workflows/release.yml` builds `dist/`, creates a GitHub Release with
|
|
140
|
+
`main.min.css` and `effects.min.css` attached, and — when the environment
|
|
141
|
+
variable `PUBLISH_METHOD=npm` is set — publishes the package to **npm**
|
|
142
|
+
(registry.npmjs.org) and **GitHub Packages**. The published version is derived
|
|
143
|
+
from the tag (`v0.3.2` → `0.3.2`), so the tag is the source of truth. Ordinary
|
|
144
|
+
pushes run only `ci-cd.yml`, which validates that the SCSS compiles.
|
|
145
|
+
|
|
146
|
+
## A. Use via npm
|
|
147
|
+
|
|
148
|
+
Пакет опубликован в публичном реестре npm — токен и `.npmrc` не нужны.
|
|
149
|
+
|
|
150
|
+
### 1. Установить
|
|
151
|
+
|
|
152
|
+
```bash
|
|
153
|
+
npm install @cat-of-summer/st-style
|
|
154
|
+
```
|
|
155
|
+
|
|
156
|
+
### 2. Использовать
|
|
157
|
+
|
|
158
|
+
Скомпилированный CSS:
|
|
159
|
+
|
|
160
|
+
```js
|
|
161
|
+
import '@cat-of-summer/st-style/main.css';
|
|
162
|
+
import '@cat-of-summer/st-style/effects.css';
|
|
163
|
+
```
|
|
164
|
+
|
|
165
|
+
Или SCSS-источник с переопределением конфига (см. **Configuration** выше):
|
|
166
|
+
|
|
167
|
+
```scss
|
|
168
|
+
@use '@cat-of-summer/st-style/scss/main/config' with (
|
|
169
|
+
$breakpoints: ( … )
|
|
170
|
+
);
|
|
171
|
+
@use '@cat-of-summer/st-style/scss/main';
|
|
172
|
+
```
|
|
173
|
+
|
|
174
|
+
## B. Скачать артефакты релиза
|
|
175
|
+
|
|
176
|
+
К каждому GitHub Release прикреплены скомпилированные файлы:
|
|
177
|
+
|
|
178
|
+
```bash
|
|
179
|
+
gh release download v0.3.2 -R cat-of-summer/ST-style---framework
|
|
180
|
+
```
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
:root{--transition-duration: var(--td-rapid);--iteration-count: 1;--td-rapid: 0.1s;--td-fast: 0.325s;--td-medium: 0.55s;--td-slow: 0.775s;--td-1s: 1s;--td-2s: 2s;--td-3s: 3s;--td-5s: 5s;--td-10s: 10s;--td-15s: 15s}*,*::before,*::after{transition:inherit}*[scale],*[rotate],*[raise],*[pulse],*[wobble],*[heartbeat],*[jello],*[bounce],*[spin],*[float],*[vibrate],*[skew],*[tada],*[swing]{will-change:transform}*[blink],*[opacity]{will-change:opacity}*[blur],*[grayscale]{will-change:filter}*[shadow],*[glow]{will-change:box-shadow}*[sheen]::before{will-change:left}*[typing-text]{will-change:width}*[typing-text]::after{will-change:opacity}*[ripple]::before{will-change:transform}*[shimmer-text]{will-change:background-position}*[underline]::after{will-change:width}*[raise]{--transition-duration: var(--td-medium);--raise-hover: 0.5em;--raise-active: 1em}*[raise~=hover]:hover{transform:translateY(calc(-1 * var(--raise-hover)))}*[raise~=active]:active{transform:translateY(calc(-1 * var(--raise-active)))}*[raise~=focus]:focus{transform:translateY(calc(-1 * var(--raise-active)))}*[scale]{--transition-duration: var(--td-medium);--scale-duration: var(--transition-duration);--scale-hover: 1.05;--scale-active: 0.95;transition-duration:var(--scale-duration)}*[scale~=hover]:hover{transform:scale(var(--scale-hover))}*[scale~=active]:active{transform:scale(var(--scale-active))}*[scale~=focus]:focus{transform:scale(var(--scale-active))}*[rotate]{--transition-duration: var(--td-medium);--rotate-duration: var(--transition-duration);--rotate-hover: 3deg;--rotate-active: -3deg;transition-duration:var(--rotate-duration)}*[rotate~=hover]:hover{transform:rotate(var(--rotate-hover))}*[rotate~=active]:active{transform:rotate(var(--rotate-active))}*[rotate~=focus]:focus{transform:rotate(var(--rotate-active))}*[blur]{--transition-duration: var(--td-slow);--blur-duration: var(--transition-duration);--blur-amount: 5px;filter:blur(var(--blur-amount))}*[blur]:hover,*[blur]:active,*[blur]:focus{filter:blur(0)}*[shadow]{--transition-duration: var(--td-medium);--shadow-duration: var(--transition-duration);--shadow-hover-offset: 5px;--shadow-hover-offsetX: var(--shadow-hover-offset);--shadow-hover-offsetY: var(--shadow-hover-offset);--shadow-hover-blur: 10px;--shadow-hover-color: rgba(0, 0, 0, 0.2);--shadow-active-offset: 2px;--shadow-active-offsetX: var(--shadow-hover-offset);--shadow-active-offsetY: var(--shadow-hover-offset);--shadow-active-blur: 8px;--shadow-active-color: rgba(0, 0, 0, 0.3);transition-duration:var(--shadow-duration)}*[shadow~=hover]:hover{box-shadow:var(--shadow-hover-offsetX) var(--shadow-hover-offsetY) var(--shadow-hover-blur) var(--shadow-hover-color)}*[shadow~=active]:active{box-shadow:var(--shadow-active-offsetX) var(--shadow-active-offsetY) var(--shadow-active-blur) var(--shadow-active-color)}*[shadow~=focus]:focus{box-shadow:var(--shadow-active-offsetX) var(--shadow-active-offsetY) var(--shadow-active-blur) var(--shadow-active-color)}@keyframes _opacity{0%{opacity:1}50%{opacity:0}100%{opacity:1}}*[opacity]{--transition-duration: var(--td-slow);--opacity-duration: var(--transition-duration);--opacity-iteration-count: var(--iteration-count);--opacity-name: _opacity;animation:var(--opacity-name) var(--opacity-duration) linear var(--opacity-iteration-count)}*[opacity~=infinite]{--opacity-iteration-count: infinite }*[opacity~=hover],*[opacity~=active],*[opacity~=focus]{--opacity-name: none }*[opacity~=hover]:hover,*[opacity~=active]:active,*[opacity~=focus]:focus{--opacity-name: _opacity }@keyframes blink{50%{opacity:0}}*[blink]{--transition-duration: 1s;--blink-duration: var(--transition-duration);--blink-iteration-count: var(--iteration-count);--blink-name: blink;animation:var(--blink-name) var(--blink-duration) step-end var(--blink-iteration-count)}*[blink~=infinite]{--blink-iteration-count: infinite }*[blink~=hover],*[blink~=active],*[blink~=focus]{--blink-name: none }*[blink~=hover]:hover,*[blink~=active]:active,*[blink~=focus]:focus{--blink-name: blink }@keyframes typing-text{from{width:0}to{width:100%}}*[typing-text]{--transition-duration: 3s;--typing-duration: var(--transition-duration);--typing-steps: 24;--typing-chars: 10;--typing-color: #000;--typing-width: 2px;position:relative !important;display:inline-block;overflow:hidden;white-space:nowrap;width:0;min-width:calc(var(--typing-chars)*1ch);max-width:max-content;animation:typing-text var(--typing-duration) steps(var(--typing-steps), end) forwards}*[typing-text]::after{content:"";position:absolute;right:0;top:0;bottom:0;display:inline-block;width:var(--typing-width);background:var(--typing-color);animation:blink 1s step-end infinite}*[typing-text~=hover],*[typing-text~=active],*[typing-text~=focus]{animation-play-state:paused}*[typing-text~=hover]:hover,*[typing-text~=active]:active,*[typing-text~=focus]:focus{animation-play-state:running}@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(var(--pulse-scale))}}*[pulse]{--transition-duration: var(--td-medium);--pulse-duration: var(--transition-duration);--pulse-scale: 1.03;--pulse-iteration-count: var(--iteration-count);--pulse-name: pulse;animation:var(--pulse-name) var(--pulse-duration) ease-in-out var(--pulse-iteration-count)}*[pulse~=infinite]{--pulse-iteration-count: infinite }*[pulse~=hover],*[pulse~=active],*[pulse~=focus]{--pulse-name: none }*[pulse~=hover]:hover,*[pulse~=active]:active,*[pulse~=focus]:focus{--pulse-name: pulse }@keyframes wobble{0%,100%{transform:rotate(0deg)}25%{transform:rotate(var(--wobble-angle))}75%{transform:rotate(calc(-1 * var(--wobble-angle)))}}*[wobble]{--transition-duration: var(--td-fast);--wobble-duration: var(--transition-duration);--wobble-angle: 10deg;--wobble-iteration-count: var(--iteration-count);--wobble-name: wobble;animation:var(--wobble-name) var(--wobble-duration) ease-in-out var(--wobble-iteration-count)}*[wobble~=infinite]{--wobble-iteration-count: infinite }*[wobble~=hover],*[wobble~=active],*[wobble~=focus]{--wobble-name: none }*[wobble~=hover]:hover,*[wobble~=active]:active,*[wobble~=focus]:focus{--wobble-name: wobble }@keyframes sheen{0%{left:-150%}100%{left:150%}}*[sheen]{--transition-duration: var(--td-medium);--sheen-duration: var(--transition-duration);--sheen-color: rgba(255, 255, 255, 0.1);--sheen-width: max(30px, 30%);--sheen-angle: -45deg;--sheen-iteration-count: var(--iteration-count);position:relative;overflow:hidden}*[sheen]::before{content:"";position:absolute;top:0;left:-150%;width:var(--sheen-width);height:100%;background:linear-gradient(to right, rgba(255, 255, 255, 0) 0%, var(--sheen-color) 50%, rgba(255, 255, 255, 0) 100%);transform:skewX(var(--sheen-angle));pointer-events:none;z-index:10;animation:var(--sheen-name, sheen) var(--sheen-duration) linear var(--sheen-iteration-count)}*[sheen~=infinite]{--sheen-iteration-count: infinite }*[sheen~=hover],*[sheen~=active],*[sheen~=focus]{--sheen-name: none }*[sheen~=hover]:hover,*[sheen~=active]:active,*[sheen~=focus]:focus{--sheen-name: sheen }@keyframes vibrate{0%{transform:translate(0, 0) rotate(0)}10%{transform:translate(var(--vibrate-x), var(--vibrate-y)) rotate(var(--vibrate-rotate))}30%{transform:translate(calc(var(--vibrate-x) * -1), var(--vibrate-y)) rotate(calc(var(--vibrate-rotate) * -1))}50%{transform:translate(var(--vibrate-x), calc(var(--vibrate-y) * -1)) rotate(var(--vibrate-rotate))}70%{transform:translate(calc(var(--vibrate-x) * -1), calc(var(--vibrate-y) * -1)) rotate(calc(var(--vibrate-rotate) * -1))}90%{transform:translate(var(--vibrate-x), var(--vibrate-y)) rotate(var(--vibrate-rotate))}100%{transform:translate(0, 0) rotate(0)}}*[vibrate]{--transition-duration: var(--td-fast);--vibrate-duration: var(--transition-duration);--vibrate-iteration-count: infinite;--vibrate-x: 2px;--vibrate-y: 1px;--vibrate-rotate: 0.5deg;animation:vibrate var(--vibrate-duration) linear var(--vibrate-iteration-count);animation-play-state:paused}*[vibrate~=hover]:hover,*[vibrate~=active]:active,*[vibrate~=focus]:focus{animation-play-state:running}*[vibrate~=reverse]{animation-play-state:running}*[vibrate~=reverse][vibrate~=hover]:hover,*[vibrate~=reverse][vibrate~=active]:active,*[vibrate~=reverse][vibrate~=focus]:focus{animation-play-state:paused}@keyframes floatY{0%,100%{transform:translateY(0)}25%{transform:translateY(var(--float-range))}75%{transform:translateY(calc(-1 * var(--float-range)))}}@keyframes floatX{0%,100%{transform:translateX(0)}25%{transform:translateX(var(--float-range))}75%{transform:translateX(calc(-1 * var(--float-range)))}}*[float]{--transition-duration: var(--td-slow);--float-duration: var(--transition-duration);--float-iteration-count: var(--iteration-count);--float-range: 6px;--float-name: floatY;animation:var(--float-name) var(--float-duration) ease-in-out var(--float-iteration-count)}*[float~=horizontal]{--float-name: floatX }*[float~=infinite]{--float-iteration-count: infinite}*[float~=hover],*[float~=active],*[float~=focus]{--float-name: none }*[float~=hover]:hover,*[float~=active]:active,*[float~=focus]:focus{--float-name: floatY }*[float~=horizontal][float~=hover]:hover,*[float~=horizontal][float~=active]:active,*[float~=horizontal][float~=focus]:focus{--float-name: floatX }@keyframes heartbeat{0%{transform:scale(1)}30%{transform:scale(var(--heartbeat-first-scale))}60%{transform:scale(var(--heartbeat-second-scale))}100%{transform:scale(1)}}*[heartbeat]{--transition-duration: var(--td-slow);--heartbeat-duration: var(--transition-duration);--heartbeat-iteration-count: var(--iteration-count);--heartbeat-first-scale: 1.10;--heartbeat-second-scale: 0.95;--heartbeat-name: heartbeat;animation:var(--heartbeat-name) var(--heartbeat-duration) cubic-bezier(0.4, 0, 0.2, 1) var(--heartbeat-iteration-count)}*[heartbeat~=infinite]{--heartbeat-iteration-count: infinite }*[heartbeat~=hover],*[heartbeat~=active],*[heartbeat~=focus]{--heartbeat-name: none }*[heartbeat~=hover]:hover,*[heartbeat~=active]:active,*[heartbeat~=focus]:focus{--heartbeat-name: heartbeat }@keyframes jello{0%{transform:scale3d(1, 1, 1)}30%{transform:scale3d(1.25, 0.85, 1)}45%{transform:scale3d(0.9, 1.05, 1)}60%{transform:scale3d(1.05, 0.95, 1)}100%{transform:scale3d(1, 1, 1)}}*[jello]{--transition-duration: var(--td-medium);--jello-duration: var(--transition-duration);--jello-iteration-count: var(--iteration-count);--jello-name: jello;animation:var(--jello-name) var(--jello-duration) cubic-bezier(0.2, 0.7, 0.2, 1) var(--jello-iteration-count)}*[jello~=infinite]{--jello-iteration-count: infinite }*[jello~=hover],*[jello~=active],*[jello~=focus]{--jello-name: none }*[jello~=hover]:hover,*[jello~=active]:active,*[jello~=focus]:focus{--jello-name: jello }@keyframes ripple{0%{transform:translate(-50%, -50%) scale(0);opacity:.8}60%{transform:translate(-50%, -50%) scale(10);opacity:.28}100%{transform:translate(-50%, -50%) scale(14);opacity:0}}*[ripple]{--transition-duration: var(--td-medium);--ripple-duration: var(--transition-duration);--ripple-color: rgba(255, 255, 255, 0.479);position:relative}*[ripple]::before{content:"";position:absolute;left:50%;top:50%;width:8px;height:8px;background-color:var(--ripple-color);border-radius:50%;transform:translate(-50%, -50%) scale(0);opacity:0;pointer-events:none}*[ripple~=active]:active::before,*[ripple~=hover]:hover::before,*[ripple~=focus]:focus::before{animation:ripple var(--ripple-duration) ease-out}@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}*[shimmer-text]{--transition-duration: 2s;--shimmer-duration: var(--transition-duration);--shimmer-color: var(--color, black);--shimmer-size: 100%;--shimmer-iteration-count: var(--iteration-count);background:linear-gradient(90deg, transparent calc(50% - var(--shimmer-size)), var(--shimmer-color) 50%, transparent calc(50% + var(--shimmer-size)));background-size:200% 100%;background-clip:text;animation:shimmer var(--shimmer-duration) linear infinite}*[shimmer-text]:not([shimmer-text~=active]):not([shimmer-text~=focus]){color:rgba(0,0,0,0)}*[shimmer-text~=hover]{animation-play-state:paused}*[shimmer-text~=hover]:hover{animation-play-state:running}*[shimmer-text~=active],*[shimmer-text~=focus]{animation:none}*[shimmer-text~=active]:active,*[shimmer-text~=focus]:focus{color:rgba(0,0,0,0);animation:shimmer var(--shimmer-duration) linear infinite}*[underline]{--transition-duration: var(--td-slow);--underline-duration: var(--transition-duration);--underline-color: currentColor;--underline-width: 2px;--underline-offset: 2px;--underline-start: 0%;--underline-direction: center;position:relative}*[underline]::after{content:"";position:absolute;left:0;right:0;margin-left:auto;margin-right:auto;bottom:calc(-1*var(--underline-offset));height:var(--underline-width);width:var(--underline-start);background:var(--underline-color);transition:width var(--underline-duration) ease}*[underline~=left]::after{margin-left:0}*[underline~=right]::after{margin-right:0}*[underline~=left][underline~=right]::after{margin-left:auto;margin-right:auto}*[underline]:is(:not([underline~=hover]):not([underline~=active]):not([underline~=focus]),[underline~=hover]:hover,[underline~=active]:active,[underline~=focus]:focus)::after{width:100%}@keyframes spin{to{transform:rotate(360deg)}}*[spin]{--transition-duration: var(--td-slow);--spin-duration: var(--transition-duration);--spin-iteration-count: var(--iteration-count);--spin-name: spin;animation:var(--spin-name) var(--spin-duration) linear var(--spin-iteration-count)}*[spin~=infinite]{--spin-iteration-count: infinite }*[spin~=hover],*[spin~=active],*[spin~=focus]{--spin-name: none }*[spin~=hover]:hover,*[spin~=active]:active,*[spin~=focus]:focus{--spin-name: spin }@keyframes bounce{0%,100%{transform:translateY(0);animation-timing-function:cubic-bezier(0, 0, 0.2, 1)}50%{transform:translateY(calc(-1 * var(--bounce-height)));animation-timing-function:cubic-bezier(0.8, 0, 1, 1)}}*[bounce]{--transition-duration: var(--td-medium);--bounce-duration: var(--transition-duration);--bounce-height: 30px;--bounce-iteration-count: var(--iteration-count);--bounce-name: bounce;animation:var(--bounce-name) var(--bounce-duration) ease-in-out var(--bounce-iteration-count)}*[bounce~=infinite]{--bounce-iteration-count: infinite }*[bounce~=hover],*[bounce~=active],*[bounce~=focus]{--bounce-name: none }*[bounce~=hover]:hover,*[bounce~=active]:active,*[bounce~=focus]:focus{--bounce-name: bounce }*[skew]{--transition-duration: var(--td-medium);--skew-duration: var(--transition-duration);--skew-hover: 10deg;--skew-active: -10deg;transition-duration:var(--skew-duration)}*[skew~=hover]:hover{transform:skewX(var(--skew-hover))}*[skew~=active]:active{transform:skewX(var(--skew-active))}*[skew~=focus]:focus{transform:skewX(var(--skew-active))}*[glow]{--transition-duration: var(--td-medium);--glow-duration: var(--transition-duration);--glow-color: rgba(0, 150, 255, 0.7);--glow-size: 16px;transition-duration:var(--glow-duration)}*[glow~=hover]:hover{box-shadow:0 0 var(--glow-size) var(--glow-color)}*[glow~=active]:active{box-shadow:0 0 var(--glow-size) var(--glow-color)}*[glow~=focus]:focus{box-shadow:0 0 var(--glow-size) var(--glow-color)}*[grayscale]{--transition-duration: var(--td-medium);--grayscale-duration: var(--transition-duration);--grayscale-amount: 100%;filter:grayscale(var(--grayscale-amount));transition-duration:var(--grayscale-duration)}*[grayscale]:hover,*[grayscale]:active,*[grayscale]:focus{filter:grayscale(0)}@keyframes tada{0%{transform:scale3d(1, 1, 1)}10%,20%{transform:scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg)}30%,50%,70%,90%{transform:scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg)}40%,60%,80%{transform:scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg)}100%{transform:scale3d(1, 1, 1)}}*[tada]{--transition-duration: var(--td-slow);--tada-duration: var(--transition-duration);--tada-iteration-count: var(--iteration-count);--tada-name: tada;animation:var(--tada-name) var(--tada-duration) ease-in-out var(--tada-iteration-count)}*[tada~=infinite]{--tada-iteration-count: infinite }*[tada~=hover],*[tada~=active],*[tada~=focus]{--tada-name: none }*[tada~=hover]:hover,*[tada~=active]:active,*[tada~=focus]:focus{--tada-name: tada }@keyframes swing{20%{transform:rotate3d(0, 0, 1, 15deg)}40%{transform:rotate3d(0, 0, 1, -10deg)}60%{transform:rotate3d(0, 0, 1, 5deg)}80%{transform:rotate3d(0, 0, 1, -5deg)}100%{transform:rotate3d(0, 0, 1, 0deg)}}*[swing]{--transition-duration: var(--td-slow);--swing-duration: var(--transition-duration);--swing-iteration-count: var(--iteration-count);--swing-name: swing;transform-origin:top center;animation:var(--swing-name) var(--swing-duration) ease-in-out var(--swing-iteration-count)}*[swing~=infinite]{--swing-iteration-count: infinite }*[swing~=hover],*[swing~=active],*[swing~=focus]{--swing-name: none }*[swing~=hover]:hover,*[swing~=active]:active,*[swing~=focus]:focus{--swing-name: swing }*[td],*[td]::before,*[td]::after{transition-duration:var(--transition-duration) !important}*[td=rapid]{--transition-duration: var(--td-rapid)}*[td=fast]{--transition-duration: var(--td-fast)}*[td=medium]{--transition-duration: var(--td-medium)}*[td=slow]{--transition-duration: var(--td-slow)}*[td="1s"]{--transition-duration: var(--td-1s)}*[td="2s"]{--transition-duration: var(--td-2s)}*[td="3s"]{--transition-duration: var(--td-3s)}*[td="5s"]{--transition-duration: var(--td-5s)}*[td="10s"]{--transition-duration: var(--td-10s)}*[td="15s"]{--transition-duration: var(--td-15s)}*[td=none]{--transition-duration: none }*[infinite]{--iteration-count: infinite}@media(prefers-reduced-motion: reduce){*:is([pulse],[wobble],[float],[heartbeat],[jello],[shimmer-text],[vibrate],[bounce],[spin],[opacity],[blink],[tada],[swing]),*:is([sheen],[ripple])::before{animation:none !important;transition:none !important}}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
@property --space-step{syntax:"<length>";inherits:true;initial-value:4px}@property --sz-step{syntax:"<length>";inherits:true;initial-value:1px}@property --cq-step{syntax:"<length>";inherits:true;initial-value:0.4cqw}@property --grid-columns{syntax:"<integer>";inherits:false;initial-value:12}@property --col-span{syntax:"<integer>";inherits:false;initial-value:12}@property --col-start{syntax:"<integer> | auto";inherits:false;initial-value:auto}:root{font-synthesis:none;--font-size: 10px;--font-weight: var(--fw-normal);--space-step: 4px;--sz-step: calc(var(--space-step) / 4);--cq-fixed: var(--space-step);--fs-h1: 3.2em;--fs-h2: 2.4em;--fs-h3: 2em;--fs-h4: 1.8em;--fs-h5: 1.6em;--fs-h6: 1.4em;--fs-p: 1.2em;--fw-thin: 100;--fw-extralight: 200;--fw-light: 300;--fw-normal: 400;--fw-medium: 500;--fw-semibold: 600;--fw-bold: 700;--fw-extrabold: 800;--fw-black: 900}*[fs]{font-size:var(--font-size) !important}*[fs=h1]{--font-size: var(--fs-h1)}*[fs=h2]{--font-size: var(--fs-h2)}*[fs=h3]{--font-size: var(--fs-h3)}*[fs=h4]{--font-size: var(--fs-h4)}*[fs=h5]{--font-size: var(--fs-h5)}*[fs=h6]{--font-size: var(--fs-h6)}*[fs=p]{--font-size: var(--fs-p)}*[lc]{--line-clamp: none}*[lc]:not([lc~="0"]):not([lc~=xs-0]):not([lc~=sm-0]):not([lc~=md-0]):not([lc~=lp-0]):not([lc~=lg-0]):not([lc~=dt-0]):not([lc~=xl-0]){-webkit-line-clamp:var(--line-clamp) !important;display:-webkit-box !important;-webkit-box-orient:vertical !important;overflow:hidden !important}*[lc~="1"]{--line-clamp: 1}*[lc~="2"]{--line-clamp: 2}*[lc~="3"]{--line-clamp: 3}*[lc~="4"]{--line-clamp: 4}*[lc~="5"]{--line-clamp: 5}*[lc~="6"]{--line-clamp: 6}*[lc~="7"]{--line-clamp: 7}*[lc~="8"]{--line-clamp: 8}*[lc~="9"]{--line-clamp: 9}*[lc~="10"]{--line-clamp: 10}@media(min-width: 360px){*[lc~=xs-1]{--line-clamp: 1}*[lc~=xs-2]{--line-clamp: 2}*[lc~=xs-3]{--line-clamp: 3}*[lc~=xs-4]{--line-clamp: 4}*[lc~=xs-5]{--line-clamp: 5}*[lc~=xs-6]{--line-clamp: 6}*[lc~=xs-7]{--line-clamp: 7}*[lc~=xs-8]{--line-clamp: 8}*[lc~=xs-9]{--line-clamp: 9}*[lc~=xs-10]{--line-clamp: 10}}@media(min-width: 576px){*[lc~=sm-1]{--line-clamp: 1}*[lc~=sm-2]{--line-clamp: 2}*[lc~=sm-3]{--line-clamp: 3}*[lc~=sm-4]{--line-clamp: 4}*[lc~=sm-5]{--line-clamp: 5}*[lc~=sm-6]{--line-clamp: 6}*[lc~=sm-7]{--line-clamp: 7}*[lc~=sm-8]{--line-clamp: 8}*[lc~=sm-9]{--line-clamp: 9}*[lc~=sm-10]{--line-clamp: 10}}@media(min-width: 768px){*[lc~=md-1]{--line-clamp: 1}*[lc~=md-2]{--line-clamp: 2}*[lc~=md-3]{--line-clamp: 3}*[lc~=md-4]{--line-clamp: 4}*[lc~=md-5]{--line-clamp: 5}*[lc~=md-6]{--line-clamp: 6}*[lc~=md-7]{--line-clamp: 7}*[lc~=md-8]{--line-clamp: 8}*[lc~=md-9]{--line-clamp: 9}*[lc~=md-10]{--line-clamp: 10}}@media(min-width: 1024px){*[lc~=lp-1]{--line-clamp: 1}*[lc~=lp-2]{--line-clamp: 2}*[lc~=lp-3]{--line-clamp: 3}*[lc~=lp-4]{--line-clamp: 4}*[lc~=lp-5]{--line-clamp: 5}*[lc~=lp-6]{--line-clamp: 6}*[lc~=lp-7]{--line-clamp: 7}*[lc~=lp-8]{--line-clamp: 8}*[lc~=lp-9]{--line-clamp: 9}*[lc~=lp-10]{--line-clamp: 10}}@media(min-width: 1280px){*[lc~=lg-1]{--line-clamp: 1}*[lc~=lg-2]{--line-clamp: 2}*[lc~=lg-3]{--line-clamp: 3}*[lc~=lg-4]{--line-clamp: 4}*[lc~=lg-5]{--line-clamp: 5}*[lc~=lg-6]{--line-clamp: 6}*[lc~=lg-7]{--line-clamp: 7}*[lc~=lg-8]{--line-clamp: 8}*[lc~=lg-9]{--line-clamp: 9}*[lc~=lg-10]{--line-clamp: 10}}@media(min-width: 1536px){*[lc~=dt-1]{--line-clamp: 1}*[lc~=dt-2]{--line-clamp: 2}*[lc~=dt-3]{--line-clamp: 3}*[lc~=dt-4]{--line-clamp: 4}*[lc~=dt-5]{--line-clamp: 5}*[lc~=dt-6]{--line-clamp: 6}*[lc~=dt-7]{--line-clamp: 7}*[lc~=dt-8]{--line-clamp: 8}*[lc~=dt-9]{--line-clamp: 9}*[lc~=dt-10]{--line-clamp: 10}}@media(min-width: 1920px){*[lc~=xl-1]{--line-clamp: 1}*[lc~=xl-2]{--line-clamp: 2}*[lc~=xl-3]{--line-clamp: 3}*[lc~=xl-4]{--line-clamp: 4}*[lc~=xl-5]{--line-clamp: 5}*[lc~=xl-6]{--line-clamp: 6}*[lc~=xl-7]{--line-clamp: 7}*[lc~=xl-8]{--line-clamp: 8}*[lc~=xl-9]{--line-clamp: 9}*[lc~=xl-10]{--line-clamp: 10}}*[fw]{font-weight:var(--font-weight) !important}*[fw=thin]{--font-weight: var(--fw-thin)}*[fw=extralight]{--font-weight: var(--fw-extralight)}*[fw=light]{--font-weight: var(--fw-light)}*[fw=normal]{--font-weight: var(--fw-normal)}*[fw=medium]{--font-weight: var(--fw-medium)}*[fw=semibold]{--font-weight: var(--fw-semibold)}*[fw=bold]{--font-weight: var(--fw-bold)}*[fw=extrabold]{--font-weight: var(--fw-extrabold)}*[fw=black]{--font-weight: var(--fw-black)}*[sz]{--sz: var(--font-size);font-size:var(--sz) !important}*[sz~="1"]{--sz: calc(1 * var(--sz-step))}*[sz~="2"]{--sz: calc(2 * var(--sz-step))}*[sz~="3"]{--sz: calc(3 * var(--sz-step))}*[sz~="4"]{--sz: calc(4 * var(--sz-step))}*[sz~="5"]{--sz: calc(5 * var(--sz-step))}*[sz~="6"]{--sz: calc(6 * var(--sz-step))}*[sz~="7"]{--sz: calc(7 * var(--sz-step))}*[sz~="8"]{--sz: calc(8 * var(--sz-step))}*[sz~="9"]{--sz: calc(9 * var(--sz-step))}*[sz~="10"]{--sz: calc(10 * var(--sz-step))}*[sz~="11"]{--sz: calc(11 * var(--sz-step))}*[sz~="12"]{--sz: calc(12 * var(--sz-step))}*[sz~="13"]{--sz: calc(13 * var(--sz-step))}*[sz~="14"]{--sz: calc(14 * var(--sz-step))}*[sz~="15"]{--sz: calc(15 * var(--sz-step))}*[sz~="16"]{--sz: calc(16 * var(--sz-step))}*[sz~="17"]{--sz: calc(17 * var(--sz-step))}*[sz~="18"]{--sz: calc(18 * var(--sz-step))}*[sz~="19"]{--sz: calc(19 * var(--sz-step))}*[sz~="20"]{--sz: calc(20 * var(--sz-step))}@media(min-width: 360px){*[sz~=xs-1]{--sz: calc(1 * var(--sz-step))}*[sz~=xs-2]{--sz: calc(2 * var(--sz-step))}*[sz~=xs-3]{--sz: calc(3 * var(--sz-step))}*[sz~=xs-4]{--sz: calc(4 * var(--sz-step))}*[sz~=xs-5]{--sz: calc(5 * var(--sz-step))}*[sz~=xs-6]{--sz: calc(6 * var(--sz-step))}*[sz~=xs-7]{--sz: calc(7 * var(--sz-step))}*[sz~=xs-8]{--sz: calc(8 * var(--sz-step))}*[sz~=xs-9]{--sz: calc(9 * var(--sz-step))}*[sz~=xs-10]{--sz: calc(10 * var(--sz-step))}*[sz~=xs-11]{--sz: calc(11 * var(--sz-step))}*[sz~=xs-12]{--sz: calc(12 * var(--sz-step))}*[sz~=xs-13]{--sz: calc(13 * var(--sz-step))}*[sz~=xs-14]{--sz: calc(14 * var(--sz-step))}*[sz~=xs-15]{--sz: calc(15 * var(--sz-step))}*[sz~=xs-16]{--sz: calc(16 * var(--sz-step))}*[sz~=xs-17]{--sz: calc(17 * var(--sz-step))}*[sz~=xs-18]{--sz: calc(18 * var(--sz-step))}*[sz~=xs-19]{--sz: calc(19 * var(--sz-step))}*[sz~=xs-20]{--sz: calc(20 * var(--sz-step))}}@media(min-width: 576px){*[sz~=sm-1]{--sz: calc(1 * var(--sz-step))}*[sz~=sm-2]{--sz: calc(2 * var(--sz-step))}*[sz~=sm-3]{--sz: calc(3 * var(--sz-step))}*[sz~=sm-4]{--sz: calc(4 * var(--sz-step))}*[sz~=sm-5]{--sz: calc(5 * var(--sz-step))}*[sz~=sm-6]{--sz: calc(6 * var(--sz-step))}*[sz~=sm-7]{--sz: calc(7 * var(--sz-step))}*[sz~=sm-8]{--sz: calc(8 * var(--sz-step))}*[sz~=sm-9]{--sz: calc(9 * var(--sz-step))}*[sz~=sm-10]{--sz: calc(10 * var(--sz-step))}*[sz~=sm-11]{--sz: calc(11 * var(--sz-step))}*[sz~=sm-12]{--sz: calc(12 * var(--sz-step))}*[sz~=sm-13]{--sz: calc(13 * var(--sz-step))}*[sz~=sm-14]{--sz: calc(14 * var(--sz-step))}*[sz~=sm-15]{--sz: calc(15 * var(--sz-step))}*[sz~=sm-16]{--sz: calc(16 * var(--sz-step))}*[sz~=sm-17]{--sz: calc(17 * var(--sz-step))}*[sz~=sm-18]{--sz: calc(18 * var(--sz-step))}*[sz~=sm-19]{--sz: calc(19 * var(--sz-step))}*[sz~=sm-20]{--sz: calc(20 * var(--sz-step))}}@media(min-width: 768px){*[sz~=md-1]{--sz: calc(1 * var(--sz-step))}*[sz~=md-2]{--sz: calc(2 * var(--sz-step))}*[sz~=md-3]{--sz: calc(3 * var(--sz-step))}*[sz~=md-4]{--sz: calc(4 * var(--sz-step))}*[sz~=md-5]{--sz: calc(5 * var(--sz-step))}*[sz~=md-6]{--sz: calc(6 * var(--sz-step))}*[sz~=md-7]{--sz: calc(7 * var(--sz-step))}*[sz~=md-8]{--sz: calc(8 * var(--sz-step))}*[sz~=md-9]{--sz: calc(9 * var(--sz-step))}*[sz~=md-10]{--sz: calc(10 * var(--sz-step))}*[sz~=md-11]{--sz: calc(11 * var(--sz-step))}*[sz~=md-12]{--sz: calc(12 * var(--sz-step))}*[sz~=md-13]{--sz: calc(13 * var(--sz-step))}*[sz~=md-14]{--sz: calc(14 * var(--sz-step))}*[sz~=md-15]{--sz: calc(15 * var(--sz-step))}*[sz~=md-16]{--sz: calc(16 * var(--sz-step))}*[sz~=md-17]{--sz: calc(17 * var(--sz-step))}*[sz~=md-18]{--sz: calc(18 * var(--sz-step))}*[sz~=md-19]{--sz: calc(19 * var(--sz-step))}*[sz~=md-20]{--sz: calc(20 * var(--sz-step))}}@media(min-width: 1024px){*[sz~=lp-1]{--sz: calc(1 * var(--sz-step))}*[sz~=lp-2]{--sz: calc(2 * var(--sz-step))}*[sz~=lp-3]{--sz: calc(3 * var(--sz-step))}*[sz~=lp-4]{--sz: calc(4 * var(--sz-step))}*[sz~=lp-5]{--sz: calc(5 * var(--sz-step))}*[sz~=lp-6]{--sz: calc(6 * var(--sz-step))}*[sz~=lp-7]{--sz: calc(7 * var(--sz-step))}*[sz~=lp-8]{--sz: calc(8 * var(--sz-step))}*[sz~=lp-9]{--sz: calc(9 * var(--sz-step))}*[sz~=lp-10]{--sz: calc(10 * var(--sz-step))}*[sz~=lp-11]{--sz: calc(11 * var(--sz-step))}*[sz~=lp-12]{--sz: calc(12 * var(--sz-step))}*[sz~=lp-13]{--sz: calc(13 * var(--sz-step))}*[sz~=lp-14]{--sz: calc(14 * var(--sz-step))}*[sz~=lp-15]{--sz: calc(15 * var(--sz-step))}*[sz~=lp-16]{--sz: calc(16 * var(--sz-step))}*[sz~=lp-17]{--sz: calc(17 * var(--sz-step))}*[sz~=lp-18]{--sz: calc(18 * var(--sz-step))}*[sz~=lp-19]{--sz: calc(19 * var(--sz-step))}*[sz~=lp-20]{--sz: calc(20 * var(--sz-step))}}@media(min-width: 1280px){*[sz~=lg-1]{--sz: calc(1 * var(--sz-step))}*[sz~=lg-2]{--sz: calc(2 * var(--sz-step))}*[sz~=lg-3]{--sz: calc(3 * var(--sz-step))}*[sz~=lg-4]{--sz: calc(4 * var(--sz-step))}*[sz~=lg-5]{--sz: calc(5 * var(--sz-step))}*[sz~=lg-6]{--sz: calc(6 * var(--sz-step))}*[sz~=lg-7]{--sz: calc(7 * var(--sz-step))}*[sz~=lg-8]{--sz: calc(8 * var(--sz-step))}*[sz~=lg-9]{--sz: calc(9 * var(--sz-step))}*[sz~=lg-10]{--sz: calc(10 * var(--sz-step))}*[sz~=lg-11]{--sz: calc(11 * var(--sz-step))}*[sz~=lg-12]{--sz: calc(12 * var(--sz-step))}*[sz~=lg-13]{--sz: calc(13 * var(--sz-step))}*[sz~=lg-14]{--sz: calc(14 * var(--sz-step))}*[sz~=lg-15]{--sz: calc(15 * var(--sz-step))}*[sz~=lg-16]{--sz: calc(16 * var(--sz-step))}*[sz~=lg-17]{--sz: calc(17 * var(--sz-step))}*[sz~=lg-18]{--sz: calc(18 * var(--sz-step))}*[sz~=lg-19]{--sz: calc(19 * var(--sz-step))}*[sz~=lg-20]{--sz: calc(20 * var(--sz-step))}}@media(min-width: 1536px){*[sz~=dt-1]{--sz: calc(1 * var(--sz-step))}*[sz~=dt-2]{--sz: calc(2 * var(--sz-step))}*[sz~=dt-3]{--sz: calc(3 * var(--sz-step))}*[sz~=dt-4]{--sz: calc(4 * var(--sz-step))}*[sz~=dt-5]{--sz: calc(5 * var(--sz-step))}*[sz~=dt-6]{--sz: calc(6 * var(--sz-step))}*[sz~=dt-7]{--sz: calc(7 * var(--sz-step))}*[sz~=dt-8]{--sz: calc(8 * var(--sz-step))}*[sz~=dt-9]{--sz: calc(9 * var(--sz-step))}*[sz~=dt-10]{--sz: calc(10 * var(--sz-step))}*[sz~=dt-11]{--sz: calc(11 * var(--sz-step))}*[sz~=dt-12]{--sz: calc(12 * var(--sz-step))}*[sz~=dt-13]{--sz: calc(13 * var(--sz-step))}*[sz~=dt-14]{--sz: calc(14 * var(--sz-step))}*[sz~=dt-15]{--sz: calc(15 * var(--sz-step))}*[sz~=dt-16]{--sz: calc(16 * var(--sz-step))}*[sz~=dt-17]{--sz: calc(17 * var(--sz-step))}*[sz~=dt-18]{--sz: calc(18 * var(--sz-step))}*[sz~=dt-19]{--sz: calc(19 * var(--sz-step))}*[sz~=dt-20]{--sz: calc(20 * var(--sz-step))}}@media(min-width: 1920px){*[sz~=xl-1]{--sz: calc(1 * var(--sz-step))}*[sz~=xl-2]{--sz: calc(2 * var(--sz-step))}*[sz~=xl-3]{--sz: calc(3 * var(--sz-step))}*[sz~=xl-4]{--sz: calc(4 * var(--sz-step))}*[sz~=xl-5]{--sz: calc(5 * var(--sz-step))}*[sz~=xl-6]{--sz: calc(6 * var(--sz-step))}*[sz~=xl-7]{--sz: calc(7 * var(--sz-step))}*[sz~=xl-8]{--sz: calc(8 * var(--sz-step))}*[sz~=xl-9]{--sz: calc(9 * var(--sz-step))}*[sz~=xl-10]{--sz: calc(10 * var(--sz-step))}*[sz~=xl-11]{--sz: calc(11 * var(--sz-step))}*[sz~=xl-12]{--sz: calc(12 * var(--sz-step))}*[sz~=xl-13]{--sz: calc(13 * var(--sz-step))}*[sz~=xl-14]{--sz: calc(14 * var(--sz-step))}*[sz~=xl-15]{--sz: calc(15 * var(--sz-step))}*[sz~=xl-16]{--sz: calc(16 * var(--sz-step))}*[sz~=xl-17]{--sz: calc(17 * var(--sz-step))}*[sz~=xl-18]{--sz: calc(18 * var(--sz-step))}*[sz~=xl-19]{--sz: calc(19 * var(--sz-step))}*[sz~=xl-20]{--sz: calc(20 * var(--sz-step))}}*[m],*[mt],*[mb]{--mt: 0;--mb: 0;margin-top:calc(var(--mt)*var(--space-step));margin-bottom:calc(var(--mb)*var(--space-step))}*:is([m~="0"],[mt~="0"]){--mt: 0}*:is([m~="0"],[mb~="0"]){--mb: 0}*:is([m~="1"],[mt~="1"]){--mt: 1}*:is([m~="1"],[mb~="1"]){--mb: 1}*:is([m~="2"],[mt~="2"]){--mt: 2}*:is([m~="2"],[mb~="2"]){--mb: 2}*:is([m~="3"],[mt~="3"]){--mt: 3}*:is([m~="3"],[mb~="3"]){--mb: 3}*:is([m~="4"],[mt~="4"]){--mt: 4}*:is([m~="4"],[mb~="4"]){--mb: 4}*:is([m~="5"],[mt~="5"]){--mt: 5}*:is([m~="5"],[mb~="5"]){--mb: 5}*:is([m~="6"],[mt~="6"]){--mt: 6}*:is([m~="6"],[mb~="6"]){--mb: 6}*:is([m~="7"],[mt~="7"]){--mt: 7}*:is([m~="7"],[mb~="7"]){--mb: 7}*:is([m~="8"],[mt~="8"]){--mt: 8}*:is([m~="8"],[mb~="8"]){--mb: 8}*:is([m~="9"],[mt~="9"]){--mt: 9}*:is([m~="9"],[mb~="9"]){--mb: 9}*:is([m~="10"],[mt~="10"]){--mt: 10}*:is([m~="10"],[mb~="10"]){--mb: 10}*:is([m~="11"],[mt~="11"]){--mt: 11}*:is([m~="11"],[mb~="11"]){--mb: 11}*:is([m~="12"],[mt~="12"]){--mt: 12}*:is([m~="12"],[mb~="12"]){--mb: 12}*:is([m~="13"],[mt~="13"]){--mt: 13}*:is([m~="13"],[mb~="13"]){--mb: 13}*:is([m~="14"],[mt~="14"]){--mt: 14}*:is([m~="14"],[mb~="14"]){--mb: 14}*:is([m~="15"],[mt~="15"]){--mt: 15}*:is([m~="15"],[mb~="15"]){--mb: 15}*:is([m~="16"],[mt~="16"]){--mt: 16}*:is([m~="16"],[mb~="16"]){--mb: 16}*:is([m~="17"],[mt~="17"]){--mt: 17}*:is([m~="17"],[mb~="17"]){--mb: 17}*:is([m~="18"],[mt~="18"]){--mt: 18}*:is([m~="18"],[mb~="18"]){--mb: 18}*:is([m~="19"],[mt~="19"]){--mt: 19}*:is([m~="19"],[mb~="19"]){--mb: 19}*:is([m~="20"],[mt~="20"]){--mt: 20}*:is([m~="20"],[mb~="20"]){--mb: 20}*:is([m~="21"],[mt~="21"]){--mt: 21}*:is([m~="21"],[mb~="21"]){--mb: 21}*:is([m~="22"],[mt~="22"]){--mt: 22}*:is([m~="22"],[mb~="22"]){--mb: 22}*:is([m~="23"],[mt~="23"]){--mt: 23}*:is([m~="23"],[mb~="23"]){--mb: 23}*:is([m~="24"],[mt~="24"]){--mt: 24}*:is([m~="24"],[mb~="24"]){--mb: 24}*:is([m~="25"],[mt~="25"]){--mt: 25}*:is([m~="25"],[mb~="25"]){--mb: 25}@media(min-width: 360px){*:is([m~=xs-0],[mt~=xs-0]){--mt: 0}*:is([m~=xs-0],[mb~=xs-0]){--mb: 0}*:is([m~=xs-1],[mt~=xs-1]){--mt: 1}*:is([m~=xs-1],[mb~=xs-1]){--mb: 1}*:is([m~=xs-2],[mt~=xs-2]){--mt: 2}*:is([m~=xs-2],[mb~=xs-2]){--mb: 2}*:is([m~=xs-3],[mt~=xs-3]){--mt: 3}*:is([m~=xs-3],[mb~=xs-3]){--mb: 3}*:is([m~=xs-4],[mt~=xs-4]){--mt: 4}*:is([m~=xs-4],[mb~=xs-4]){--mb: 4}*:is([m~=xs-5],[mt~=xs-5]){--mt: 5}*:is([m~=xs-5],[mb~=xs-5]){--mb: 5}*:is([m~=xs-6],[mt~=xs-6]){--mt: 6}*:is([m~=xs-6],[mb~=xs-6]){--mb: 6}*:is([m~=xs-7],[mt~=xs-7]){--mt: 7}*:is([m~=xs-7],[mb~=xs-7]){--mb: 7}*:is([m~=xs-8],[mt~=xs-8]){--mt: 8}*:is([m~=xs-8],[mb~=xs-8]){--mb: 8}*:is([m~=xs-9],[mt~=xs-9]){--mt: 9}*:is([m~=xs-9],[mb~=xs-9]){--mb: 9}*:is([m~=xs-10],[mt~=xs-10]){--mt: 10}*:is([m~=xs-10],[mb~=xs-10]){--mb: 10}*:is([m~=xs-11],[mt~=xs-11]){--mt: 11}*:is([m~=xs-11],[mb~=xs-11]){--mb: 11}*:is([m~=xs-12],[mt~=xs-12]){--mt: 12}*:is([m~=xs-12],[mb~=xs-12]){--mb: 12}*:is([m~=xs-13],[mt~=xs-13]){--mt: 13}*:is([m~=xs-13],[mb~=xs-13]){--mb: 13}*:is([m~=xs-14],[mt~=xs-14]){--mt: 14}*:is([m~=xs-14],[mb~=xs-14]){--mb: 14}*:is([m~=xs-15],[mt~=xs-15]){--mt: 15}*:is([m~=xs-15],[mb~=xs-15]){--mb: 15}*:is([m~=xs-16],[mt~=xs-16]){--mt: 16}*:is([m~=xs-16],[mb~=xs-16]){--mb: 16}*:is([m~=xs-17],[mt~=xs-17]){--mt: 17}*:is([m~=xs-17],[mb~=xs-17]){--mb: 17}*:is([m~=xs-18],[mt~=xs-18]){--mt: 18}*:is([m~=xs-18],[mb~=xs-18]){--mb: 18}*:is([m~=xs-19],[mt~=xs-19]){--mt: 19}*:is([m~=xs-19],[mb~=xs-19]){--mb: 19}*:is([m~=xs-20],[mt~=xs-20]){--mt: 20}*:is([m~=xs-20],[mb~=xs-20]){--mb: 20}*:is([m~=xs-21],[mt~=xs-21]){--mt: 21}*:is([m~=xs-21],[mb~=xs-21]){--mb: 21}*:is([m~=xs-22],[mt~=xs-22]){--mt: 22}*:is([m~=xs-22],[mb~=xs-22]){--mb: 22}*:is([m~=xs-23],[mt~=xs-23]){--mt: 23}*:is([m~=xs-23],[mb~=xs-23]){--mb: 23}*:is([m~=xs-24],[mt~=xs-24]){--mt: 24}*:is([m~=xs-24],[mb~=xs-24]){--mb: 24}*:is([m~=xs-25],[mt~=xs-25]){--mt: 25}*:is([m~=xs-25],[mb~=xs-25]){--mb: 25}}@media(min-width: 576px){*:is([m~=sm-0],[mt~=sm-0]){--mt: 0}*:is([m~=sm-0],[mb~=sm-0]){--mb: 0}*:is([m~=sm-1],[mt~=sm-1]){--mt: 1}*:is([m~=sm-1],[mb~=sm-1]){--mb: 1}*:is([m~=sm-2],[mt~=sm-2]){--mt: 2}*:is([m~=sm-2],[mb~=sm-2]){--mb: 2}*:is([m~=sm-3],[mt~=sm-3]){--mt: 3}*:is([m~=sm-3],[mb~=sm-3]){--mb: 3}*:is([m~=sm-4],[mt~=sm-4]){--mt: 4}*:is([m~=sm-4],[mb~=sm-4]){--mb: 4}*:is([m~=sm-5],[mt~=sm-5]){--mt: 5}*:is([m~=sm-5],[mb~=sm-5]){--mb: 5}*:is([m~=sm-6],[mt~=sm-6]){--mt: 6}*:is([m~=sm-6],[mb~=sm-6]){--mb: 6}*:is([m~=sm-7],[mt~=sm-7]){--mt: 7}*:is([m~=sm-7],[mb~=sm-7]){--mb: 7}*:is([m~=sm-8],[mt~=sm-8]){--mt: 8}*:is([m~=sm-8],[mb~=sm-8]){--mb: 8}*:is([m~=sm-9],[mt~=sm-9]){--mt: 9}*:is([m~=sm-9],[mb~=sm-9]){--mb: 9}*:is([m~=sm-10],[mt~=sm-10]){--mt: 10}*:is([m~=sm-10],[mb~=sm-10]){--mb: 10}*:is([m~=sm-11],[mt~=sm-11]){--mt: 11}*:is([m~=sm-11],[mb~=sm-11]){--mb: 11}*:is([m~=sm-12],[mt~=sm-12]){--mt: 12}*:is([m~=sm-12],[mb~=sm-12]){--mb: 12}*:is([m~=sm-13],[mt~=sm-13]){--mt: 13}*:is([m~=sm-13],[mb~=sm-13]){--mb: 13}*:is([m~=sm-14],[mt~=sm-14]){--mt: 14}*:is([m~=sm-14],[mb~=sm-14]){--mb: 14}*:is([m~=sm-15],[mt~=sm-15]){--mt: 15}*:is([m~=sm-15],[mb~=sm-15]){--mb: 15}*:is([m~=sm-16],[mt~=sm-16]){--mt: 16}*:is([m~=sm-16],[mb~=sm-16]){--mb: 16}*:is([m~=sm-17],[mt~=sm-17]){--mt: 17}*:is([m~=sm-17],[mb~=sm-17]){--mb: 17}*:is([m~=sm-18],[mt~=sm-18]){--mt: 18}*:is([m~=sm-18],[mb~=sm-18]){--mb: 18}*:is([m~=sm-19],[mt~=sm-19]){--mt: 19}*:is([m~=sm-19],[mb~=sm-19]){--mb: 19}*:is([m~=sm-20],[mt~=sm-20]){--mt: 20}*:is([m~=sm-20],[mb~=sm-20]){--mb: 20}*:is([m~=sm-21],[mt~=sm-21]){--mt: 21}*:is([m~=sm-21],[mb~=sm-21]){--mb: 21}*:is([m~=sm-22],[mt~=sm-22]){--mt: 22}*:is([m~=sm-22],[mb~=sm-22]){--mb: 22}*:is([m~=sm-23],[mt~=sm-23]){--mt: 23}*:is([m~=sm-23],[mb~=sm-23]){--mb: 23}*:is([m~=sm-24],[mt~=sm-24]){--mt: 24}*:is([m~=sm-24],[mb~=sm-24]){--mb: 24}*:is([m~=sm-25],[mt~=sm-25]){--mt: 25}*:is([m~=sm-25],[mb~=sm-25]){--mb: 25}}@media(min-width: 768px){*:is([m~=md-0],[mt~=md-0]){--mt: 0}*:is([m~=md-0],[mb~=md-0]){--mb: 0}*:is([m~=md-1],[mt~=md-1]){--mt: 1}*:is([m~=md-1],[mb~=md-1]){--mb: 1}*:is([m~=md-2],[mt~=md-2]){--mt: 2}*:is([m~=md-2],[mb~=md-2]){--mb: 2}*:is([m~=md-3],[mt~=md-3]){--mt: 3}*:is([m~=md-3],[mb~=md-3]){--mb: 3}*:is([m~=md-4],[mt~=md-4]){--mt: 4}*:is([m~=md-4],[mb~=md-4]){--mb: 4}*:is([m~=md-5],[mt~=md-5]){--mt: 5}*:is([m~=md-5],[mb~=md-5]){--mb: 5}*:is([m~=md-6],[mt~=md-6]){--mt: 6}*:is([m~=md-6],[mb~=md-6]){--mb: 6}*:is([m~=md-7],[mt~=md-7]){--mt: 7}*:is([m~=md-7],[mb~=md-7]){--mb: 7}*:is([m~=md-8],[mt~=md-8]){--mt: 8}*:is([m~=md-8],[mb~=md-8]){--mb: 8}*:is([m~=md-9],[mt~=md-9]){--mt: 9}*:is([m~=md-9],[mb~=md-9]){--mb: 9}*:is([m~=md-10],[mt~=md-10]){--mt: 10}*:is([m~=md-10],[mb~=md-10]){--mb: 10}*:is([m~=md-11],[mt~=md-11]){--mt: 11}*:is([m~=md-11],[mb~=md-11]){--mb: 11}*:is([m~=md-12],[mt~=md-12]){--mt: 12}*:is([m~=md-12],[mb~=md-12]){--mb: 12}*:is([m~=md-13],[mt~=md-13]){--mt: 13}*:is([m~=md-13],[mb~=md-13]){--mb: 13}*:is([m~=md-14],[mt~=md-14]){--mt: 14}*:is([m~=md-14],[mb~=md-14]){--mb: 14}*:is([m~=md-15],[mt~=md-15]){--mt: 15}*:is([m~=md-15],[mb~=md-15]){--mb: 15}*:is([m~=md-16],[mt~=md-16]){--mt: 16}*:is([m~=md-16],[mb~=md-16]){--mb: 16}*:is([m~=md-17],[mt~=md-17]){--mt: 17}*:is([m~=md-17],[mb~=md-17]){--mb: 17}*:is([m~=md-18],[mt~=md-18]){--mt: 18}*:is([m~=md-18],[mb~=md-18]){--mb: 18}*:is([m~=md-19],[mt~=md-19]){--mt: 19}*:is([m~=md-19],[mb~=md-19]){--mb: 19}*:is([m~=md-20],[mt~=md-20]){--mt: 20}*:is([m~=md-20],[mb~=md-20]){--mb: 20}*:is([m~=md-21],[mt~=md-21]){--mt: 21}*:is([m~=md-21],[mb~=md-21]){--mb: 21}*:is([m~=md-22],[mt~=md-22]){--mt: 22}*:is([m~=md-22],[mb~=md-22]){--mb: 22}*:is([m~=md-23],[mt~=md-23]){--mt: 23}*:is([m~=md-23],[mb~=md-23]){--mb: 23}*:is([m~=md-24],[mt~=md-24]){--mt: 24}*:is([m~=md-24],[mb~=md-24]){--mb: 24}*:is([m~=md-25],[mt~=md-25]){--mt: 25}*:is([m~=md-25],[mb~=md-25]){--mb: 25}}@media(min-width: 1024px){*:is([m~=lp-0],[mt~=lp-0]){--mt: 0}*:is([m~=lp-0],[mb~=lp-0]){--mb: 0}*:is([m~=lp-1],[mt~=lp-1]){--mt: 1}*:is([m~=lp-1],[mb~=lp-1]){--mb: 1}*:is([m~=lp-2],[mt~=lp-2]){--mt: 2}*:is([m~=lp-2],[mb~=lp-2]){--mb: 2}*:is([m~=lp-3],[mt~=lp-3]){--mt: 3}*:is([m~=lp-3],[mb~=lp-3]){--mb: 3}*:is([m~=lp-4],[mt~=lp-4]){--mt: 4}*:is([m~=lp-4],[mb~=lp-4]){--mb: 4}*:is([m~=lp-5],[mt~=lp-5]){--mt: 5}*:is([m~=lp-5],[mb~=lp-5]){--mb: 5}*:is([m~=lp-6],[mt~=lp-6]){--mt: 6}*:is([m~=lp-6],[mb~=lp-6]){--mb: 6}*:is([m~=lp-7],[mt~=lp-7]){--mt: 7}*:is([m~=lp-7],[mb~=lp-7]){--mb: 7}*:is([m~=lp-8],[mt~=lp-8]){--mt: 8}*:is([m~=lp-8],[mb~=lp-8]){--mb: 8}*:is([m~=lp-9],[mt~=lp-9]){--mt: 9}*:is([m~=lp-9],[mb~=lp-9]){--mb: 9}*:is([m~=lp-10],[mt~=lp-10]){--mt: 10}*:is([m~=lp-10],[mb~=lp-10]){--mb: 10}*:is([m~=lp-11],[mt~=lp-11]){--mt: 11}*:is([m~=lp-11],[mb~=lp-11]){--mb: 11}*:is([m~=lp-12],[mt~=lp-12]){--mt: 12}*:is([m~=lp-12],[mb~=lp-12]){--mb: 12}*:is([m~=lp-13],[mt~=lp-13]){--mt: 13}*:is([m~=lp-13],[mb~=lp-13]){--mb: 13}*:is([m~=lp-14],[mt~=lp-14]){--mt: 14}*:is([m~=lp-14],[mb~=lp-14]){--mb: 14}*:is([m~=lp-15],[mt~=lp-15]){--mt: 15}*:is([m~=lp-15],[mb~=lp-15]){--mb: 15}*:is([m~=lp-16],[mt~=lp-16]){--mt: 16}*:is([m~=lp-16],[mb~=lp-16]){--mb: 16}*:is([m~=lp-17],[mt~=lp-17]){--mt: 17}*:is([m~=lp-17],[mb~=lp-17]){--mb: 17}*:is([m~=lp-18],[mt~=lp-18]){--mt: 18}*:is([m~=lp-18],[mb~=lp-18]){--mb: 18}*:is([m~=lp-19],[mt~=lp-19]){--mt: 19}*:is([m~=lp-19],[mb~=lp-19]){--mb: 19}*:is([m~=lp-20],[mt~=lp-20]){--mt: 20}*:is([m~=lp-20],[mb~=lp-20]){--mb: 20}*:is([m~=lp-21],[mt~=lp-21]){--mt: 21}*:is([m~=lp-21],[mb~=lp-21]){--mb: 21}*:is([m~=lp-22],[mt~=lp-22]){--mt: 22}*:is([m~=lp-22],[mb~=lp-22]){--mb: 22}*:is([m~=lp-23],[mt~=lp-23]){--mt: 23}*:is([m~=lp-23],[mb~=lp-23]){--mb: 23}*:is([m~=lp-24],[mt~=lp-24]){--mt: 24}*:is([m~=lp-24],[mb~=lp-24]){--mb: 24}*:is([m~=lp-25],[mt~=lp-25]){--mt: 25}*:is([m~=lp-25],[mb~=lp-25]){--mb: 25}}@media(min-width: 1280px){*:is([m~=lg-0],[mt~=lg-0]){--mt: 0}*:is([m~=lg-0],[mb~=lg-0]){--mb: 0}*:is([m~=lg-1],[mt~=lg-1]){--mt: 1}*:is([m~=lg-1],[mb~=lg-1]){--mb: 1}*:is([m~=lg-2],[mt~=lg-2]){--mt: 2}*:is([m~=lg-2],[mb~=lg-2]){--mb: 2}*:is([m~=lg-3],[mt~=lg-3]){--mt: 3}*:is([m~=lg-3],[mb~=lg-3]){--mb: 3}*:is([m~=lg-4],[mt~=lg-4]){--mt: 4}*:is([m~=lg-4],[mb~=lg-4]){--mb: 4}*:is([m~=lg-5],[mt~=lg-5]){--mt: 5}*:is([m~=lg-5],[mb~=lg-5]){--mb: 5}*:is([m~=lg-6],[mt~=lg-6]){--mt: 6}*:is([m~=lg-6],[mb~=lg-6]){--mb: 6}*:is([m~=lg-7],[mt~=lg-7]){--mt: 7}*:is([m~=lg-7],[mb~=lg-7]){--mb: 7}*:is([m~=lg-8],[mt~=lg-8]){--mt: 8}*:is([m~=lg-8],[mb~=lg-8]){--mb: 8}*:is([m~=lg-9],[mt~=lg-9]){--mt: 9}*:is([m~=lg-9],[mb~=lg-9]){--mb: 9}*:is([m~=lg-10],[mt~=lg-10]){--mt: 10}*:is([m~=lg-10],[mb~=lg-10]){--mb: 10}*:is([m~=lg-11],[mt~=lg-11]){--mt: 11}*:is([m~=lg-11],[mb~=lg-11]){--mb: 11}*:is([m~=lg-12],[mt~=lg-12]){--mt: 12}*:is([m~=lg-12],[mb~=lg-12]){--mb: 12}*:is([m~=lg-13],[mt~=lg-13]){--mt: 13}*:is([m~=lg-13],[mb~=lg-13]){--mb: 13}*:is([m~=lg-14],[mt~=lg-14]){--mt: 14}*:is([m~=lg-14],[mb~=lg-14]){--mb: 14}*:is([m~=lg-15],[mt~=lg-15]){--mt: 15}*:is([m~=lg-15],[mb~=lg-15]){--mb: 15}*:is([m~=lg-16],[mt~=lg-16]){--mt: 16}*:is([m~=lg-16],[mb~=lg-16]){--mb: 16}*:is([m~=lg-17],[mt~=lg-17]){--mt: 17}*:is([m~=lg-17],[mb~=lg-17]){--mb: 17}*:is([m~=lg-18],[mt~=lg-18]){--mt: 18}*:is([m~=lg-18],[mb~=lg-18]){--mb: 18}*:is([m~=lg-19],[mt~=lg-19]){--mt: 19}*:is([m~=lg-19],[mb~=lg-19]){--mb: 19}*:is([m~=lg-20],[mt~=lg-20]){--mt: 20}*:is([m~=lg-20],[mb~=lg-20]){--mb: 20}*:is([m~=lg-21],[mt~=lg-21]){--mt: 21}*:is([m~=lg-21],[mb~=lg-21]){--mb: 21}*:is([m~=lg-22],[mt~=lg-22]){--mt: 22}*:is([m~=lg-22],[mb~=lg-22]){--mb: 22}*:is([m~=lg-23],[mt~=lg-23]){--mt: 23}*:is([m~=lg-23],[mb~=lg-23]){--mb: 23}*:is([m~=lg-24],[mt~=lg-24]){--mt: 24}*:is([m~=lg-24],[mb~=lg-24]){--mb: 24}*:is([m~=lg-25],[mt~=lg-25]){--mt: 25}*:is([m~=lg-25],[mb~=lg-25]){--mb: 25}}@media(min-width: 1536px){*:is([m~=dt-0],[mt~=dt-0]){--mt: 0}*:is([m~=dt-0],[mb~=dt-0]){--mb: 0}*:is([m~=dt-1],[mt~=dt-1]){--mt: 1}*:is([m~=dt-1],[mb~=dt-1]){--mb: 1}*:is([m~=dt-2],[mt~=dt-2]){--mt: 2}*:is([m~=dt-2],[mb~=dt-2]){--mb: 2}*:is([m~=dt-3],[mt~=dt-3]){--mt: 3}*:is([m~=dt-3],[mb~=dt-3]){--mb: 3}*:is([m~=dt-4],[mt~=dt-4]){--mt: 4}*:is([m~=dt-4],[mb~=dt-4]){--mb: 4}*:is([m~=dt-5],[mt~=dt-5]){--mt: 5}*:is([m~=dt-5],[mb~=dt-5]){--mb: 5}*:is([m~=dt-6],[mt~=dt-6]){--mt: 6}*:is([m~=dt-6],[mb~=dt-6]){--mb: 6}*:is([m~=dt-7],[mt~=dt-7]){--mt: 7}*:is([m~=dt-7],[mb~=dt-7]){--mb: 7}*:is([m~=dt-8],[mt~=dt-8]){--mt: 8}*:is([m~=dt-8],[mb~=dt-8]){--mb: 8}*:is([m~=dt-9],[mt~=dt-9]){--mt: 9}*:is([m~=dt-9],[mb~=dt-9]){--mb: 9}*:is([m~=dt-10],[mt~=dt-10]){--mt: 10}*:is([m~=dt-10],[mb~=dt-10]){--mb: 10}*:is([m~=dt-11],[mt~=dt-11]){--mt: 11}*:is([m~=dt-11],[mb~=dt-11]){--mb: 11}*:is([m~=dt-12],[mt~=dt-12]){--mt: 12}*:is([m~=dt-12],[mb~=dt-12]){--mb: 12}*:is([m~=dt-13],[mt~=dt-13]){--mt: 13}*:is([m~=dt-13],[mb~=dt-13]){--mb: 13}*:is([m~=dt-14],[mt~=dt-14]){--mt: 14}*:is([m~=dt-14],[mb~=dt-14]){--mb: 14}*:is([m~=dt-15],[mt~=dt-15]){--mt: 15}*:is([m~=dt-15],[mb~=dt-15]){--mb: 15}*:is([m~=dt-16],[mt~=dt-16]){--mt: 16}*:is([m~=dt-16],[mb~=dt-16]){--mb: 16}*:is([m~=dt-17],[mt~=dt-17]){--mt: 17}*:is([m~=dt-17],[mb~=dt-17]){--mb: 17}*:is([m~=dt-18],[mt~=dt-18]){--mt: 18}*:is([m~=dt-18],[mb~=dt-18]){--mb: 18}*:is([m~=dt-19],[mt~=dt-19]){--mt: 19}*:is([m~=dt-19],[mb~=dt-19]){--mb: 19}*:is([m~=dt-20],[mt~=dt-20]){--mt: 20}*:is([m~=dt-20],[mb~=dt-20]){--mb: 20}*:is([m~=dt-21],[mt~=dt-21]){--mt: 21}*:is([m~=dt-21],[mb~=dt-21]){--mb: 21}*:is([m~=dt-22],[mt~=dt-22]){--mt: 22}*:is([m~=dt-22],[mb~=dt-22]){--mb: 22}*:is([m~=dt-23],[mt~=dt-23]){--mt: 23}*:is([m~=dt-23],[mb~=dt-23]){--mb: 23}*:is([m~=dt-24],[mt~=dt-24]){--mt: 24}*:is([m~=dt-24],[mb~=dt-24]){--mb: 24}*:is([m~=dt-25],[mt~=dt-25]){--mt: 25}*:is([m~=dt-25],[mb~=dt-25]){--mb: 25}}@media(min-width: 1920px){*:is([m~=xl-0],[mt~=xl-0]){--mt: 0}*:is([m~=xl-0],[mb~=xl-0]){--mb: 0}*:is([m~=xl-1],[mt~=xl-1]){--mt: 1}*:is([m~=xl-1],[mb~=xl-1]){--mb: 1}*:is([m~=xl-2],[mt~=xl-2]){--mt: 2}*:is([m~=xl-2],[mb~=xl-2]){--mb: 2}*:is([m~=xl-3],[mt~=xl-3]){--mt: 3}*:is([m~=xl-3],[mb~=xl-3]){--mb: 3}*:is([m~=xl-4],[mt~=xl-4]){--mt: 4}*:is([m~=xl-4],[mb~=xl-4]){--mb: 4}*:is([m~=xl-5],[mt~=xl-5]){--mt: 5}*:is([m~=xl-5],[mb~=xl-5]){--mb: 5}*:is([m~=xl-6],[mt~=xl-6]){--mt: 6}*:is([m~=xl-6],[mb~=xl-6]){--mb: 6}*:is([m~=xl-7],[mt~=xl-7]){--mt: 7}*:is([m~=xl-7],[mb~=xl-7]){--mb: 7}*:is([m~=xl-8],[mt~=xl-8]){--mt: 8}*:is([m~=xl-8],[mb~=xl-8]){--mb: 8}*:is([m~=xl-9],[mt~=xl-9]){--mt: 9}*:is([m~=xl-9],[mb~=xl-9]){--mb: 9}*:is([m~=xl-10],[mt~=xl-10]){--mt: 10}*:is([m~=xl-10],[mb~=xl-10]){--mb: 10}*:is([m~=xl-11],[mt~=xl-11]){--mt: 11}*:is([m~=xl-11],[mb~=xl-11]){--mb: 11}*:is([m~=xl-12],[mt~=xl-12]){--mt: 12}*:is([m~=xl-12],[mb~=xl-12]){--mb: 12}*:is([m~=xl-13],[mt~=xl-13]){--mt: 13}*:is([m~=xl-13],[mb~=xl-13]){--mb: 13}*:is([m~=xl-14],[mt~=xl-14]){--mt: 14}*:is([m~=xl-14],[mb~=xl-14]){--mb: 14}*:is([m~=xl-15],[mt~=xl-15]){--mt: 15}*:is([m~=xl-15],[mb~=xl-15]){--mb: 15}*:is([m~=xl-16],[mt~=xl-16]){--mt: 16}*:is([m~=xl-16],[mb~=xl-16]){--mb: 16}*:is([m~=xl-17],[mt~=xl-17]){--mt: 17}*:is([m~=xl-17],[mb~=xl-17]){--mb: 17}*:is([m~=xl-18],[mt~=xl-18]){--mt: 18}*:is([m~=xl-18],[mb~=xl-18]){--mb: 18}*:is([m~=xl-19],[mt~=xl-19]){--mt: 19}*:is([m~=xl-19],[mb~=xl-19]){--mb: 19}*:is([m~=xl-20],[mt~=xl-20]){--mt: 20}*:is([m~=xl-20],[mb~=xl-20]){--mb: 20}*:is([m~=xl-21],[mt~=xl-21]){--mt: 21}*:is([m~=xl-21],[mb~=xl-21]){--mb: 21}*:is([m~=xl-22],[mt~=xl-22]){--mt: 22}*:is([m~=xl-22],[mb~=xl-22]){--mb: 22}*:is([m~=xl-23],[mt~=xl-23]){--mt: 23}*:is([m~=xl-23],[mb~=xl-23]){--mb: 23}*:is([m~=xl-24],[mt~=xl-24]){--mt: 24}*:is([m~=xl-24],[mb~=xl-24]){--mb: 24}*:is([m~=xl-25],[mt~=xl-25]){--mt: 25}*:is([m~=xl-25],[mb~=xl-25]){--mb: 25}}*[p],*[pt],*[pb]{--pt: 0;--pb: 0;padding-top:calc(var(--pt)*var(--space-step));padding-bottom:calc(var(--pb)*var(--space-step))}*:is([p~="0"],[pt~="0"]){--pt: 0}*:is([p~="0"],[pb~="0"]){--pb: 0}*:is([p~="1"],[pt~="1"]){--pt: 1}*:is([p~="1"],[pb~="1"]){--pb: 1}*:is([p~="2"],[pt~="2"]){--pt: 2}*:is([p~="2"],[pb~="2"]){--pb: 2}*:is([p~="3"],[pt~="3"]){--pt: 3}*:is([p~="3"],[pb~="3"]){--pb: 3}*:is([p~="4"],[pt~="4"]){--pt: 4}*:is([p~="4"],[pb~="4"]){--pb: 4}*:is([p~="5"],[pt~="5"]){--pt: 5}*:is([p~="5"],[pb~="5"]){--pb: 5}*:is([p~="6"],[pt~="6"]){--pt: 6}*:is([p~="6"],[pb~="6"]){--pb: 6}*:is([p~="7"],[pt~="7"]){--pt: 7}*:is([p~="7"],[pb~="7"]){--pb: 7}*:is([p~="8"],[pt~="8"]){--pt: 8}*:is([p~="8"],[pb~="8"]){--pb: 8}*:is([p~="9"],[pt~="9"]){--pt: 9}*:is([p~="9"],[pb~="9"]){--pb: 9}*:is([p~="10"],[pt~="10"]){--pt: 10}*:is([p~="10"],[pb~="10"]){--pb: 10}*:is([p~="11"],[pt~="11"]){--pt: 11}*:is([p~="11"],[pb~="11"]){--pb: 11}*:is([p~="12"],[pt~="12"]){--pt: 12}*:is([p~="12"],[pb~="12"]){--pb: 12}*:is([p~="13"],[pt~="13"]){--pt: 13}*:is([p~="13"],[pb~="13"]){--pb: 13}*:is([p~="14"],[pt~="14"]){--pt: 14}*:is([p~="14"],[pb~="14"]){--pb: 14}*:is([p~="15"],[pt~="15"]){--pt: 15}*:is([p~="15"],[pb~="15"]){--pb: 15}*:is([p~="16"],[pt~="16"]){--pt: 16}*:is([p~="16"],[pb~="16"]){--pb: 16}*:is([p~="17"],[pt~="17"]){--pt: 17}*:is([p~="17"],[pb~="17"]){--pb: 17}*:is([p~="18"],[pt~="18"]){--pt: 18}*:is([p~="18"],[pb~="18"]){--pb: 18}*:is([p~="19"],[pt~="19"]){--pt: 19}*:is([p~="19"],[pb~="19"]){--pb: 19}*:is([p~="20"],[pt~="20"]){--pt: 20}*:is([p~="20"],[pb~="20"]){--pb: 20}*:is([p~="21"],[pt~="21"]){--pt: 21}*:is([p~="21"],[pb~="21"]){--pb: 21}*:is([p~="22"],[pt~="22"]){--pt: 22}*:is([p~="22"],[pb~="22"]){--pb: 22}*:is([p~="23"],[pt~="23"]){--pt: 23}*:is([p~="23"],[pb~="23"]){--pb: 23}*:is([p~="24"],[pt~="24"]){--pt: 24}*:is([p~="24"],[pb~="24"]){--pb: 24}*:is([p~="25"],[pt~="25"]){--pt: 25}*:is([p~="25"],[pb~="25"]){--pb: 25}@media(min-width: 360px){*:is([p~=xs-0],[pt~=xs-0]){--pt: 0}*:is([p~=xs-0],[pb~=xs-0]){--pb: 0}*:is([p~=xs-1],[pt~=xs-1]){--pt: 1}*:is([p~=xs-1],[pb~=xs-1]){--pb: 1}*:is([p~=xs-2],[pt~=xs-2]){--pt: 2}*:is([p~=xs-2],[pb~=xs-2]){--pb: 2}*:is([p~=xs-3],[pt~=xs-3]){--pt: 3}*:is([p~=xs-3],[pb~=xs-3]){--pb: 3}*:is([p~=xs-4],[pt~=xs-4]){--pt: 4}*:is([p~=xs-4],[pb~=xs-4]){--pb: 4}*:is([p~=xs-5],[pt~=xs-5]){--pt: 5}*:is([p~=xs-5],[pb~=xs-5]){--pb: 5}*:is([p~=xs-6],[pt~=xs-6]){--pt: 6}*:is([p~=xs-6],[pb~=xs-6]){--pb: 6}*:is([p~=xs-7],[pt~=xs-7]){--pt: 7}*:is([p~=xs-7],[pb~=xs-7]){--pb: 7}*:is([p~=xs-8],[pt~=xs-8]){--pt: 8}*:is([p~=xs-8],[pb~=xs-8]){--pb: 8}*:is([p~=xs-9],[pt~=xs-9]){--pt: 9}*:is([p~=xs-9],[pb~=xs-9]){--pb: 9}*:is([p~=xs-10],[pt~=xs-10]){--pt: 10}*:is([p~=xs-10],[pb~=xs-10]){--pb: 10}*:is([p~=xs-11],[pt~=xs-11]){--pt: 11}*:is([p~=xs-11],[pb~=xs-11]){--pb: 11}*:is([p~=xs-12],[pt~=xs-12]){--pt: 12}*:is([p~=xs-12],[pb~=xs-12]){--pb: 12}*:is([p~=xs-13],[pt~=xs-13]){--pt: 13}*:is([p~=xs-13],[pb~=xs-13]){--pb: 13}*:is([p~=xs-14],[pt~=xs-14]){--pt: 14}*:is([p~=xs-14],[pb~=xs-14]){--pb: 14}*:is([p~=xs-15],[pt~=xs-15]){--pt: 15}*:is([p~=xs-15],[pb~=xs-15]){--pb: 15}*:is([p~=xs-16],[pt~=xs-16]){--pt: 16}*:is([p~=xs-16],[pb~=xs-16]){--pb: 16}*:is([p~=xs-17],[pt~=xs-17]){--pt: 17}*:is([p~=xs-17],[pb~=xs-17]){--pb: 17}*:is([p~=xs-18],[pt~=xs-18]){--pt: 18}*:is([p~=xs-18],[pb~=xs-18]){--pb: 18}*:is([p~=xs-19],[pt~=xs-19]){--pt: 19}*:is([p~=xs-19],[pb~=xs-19]){--pb: 19}*:is([p~=xs-20],[pt~=xs-20]){--pt: 20}*:is([p~=xs-20],[pb~=xs-20]){--pb: 20}*:is([p~=xs-21],[pt~=xs-21]){--pt: 21}*:is([p~=xs-21],[pb~=xs-21]){--pb: 21}*:is([p~=xs-22],[pt~=xs-22]){--pt: 22}*:is([p~=xs-22],[pb~=xs-22]){--pb: 22}*:is([p~=xs-23],[pt~=xs-23]){--pt: 23}*:is([p~=xs-23],[pb~=xs-23]){--pb: 23}*:is([p~=xs-24],[pt~=xs-24]){--pt: 24}*:is([p~=xs-24],[pb~=xs-24]){--pb: 24}*:is([p~=xs-25],[pt~=xs-25]){--pt: 25}*:is([p~=xs-25],[pb~=xs-25]){--pb: 25}}@media(min-width: 576px){*:is([p~=sm-0],[pt~=sm-0]){--pt: 0}*:is([p~=sm-0],[pb~=sm-0]){--pb: 0}*:is([p~=sm-1],[pt~=sm-1]){--pt: 1}*:is([p~=sm-1],[pb~=sm-1]){--pb: 1}*:is([p~=sm-2],[pt~=sm-2]){--pt: 2}*:is([p~=sm-2],[pb~=sm-2]){--pb: 2}*:is([p~=sm-3],[pt~=sm-3]){--pt: 3}*:is([p~=sm-3],[pb~=sm-3]){--pb: 3}*:is([p~=sm-4],[pt~=sm-4]){--pt: 4}*:is([p~=sm-4],[pb~=sm-4]){--pb: 4}*:is([p~=sm-5],[pt~=sm-5]){--pt: 5}*:is([p~=sm-5],[pb~=sm-5]){--pb: 5}*:is([p~=sm-6],[pt~=sm-6]){--pt: 6}*:is([p~=sm-6],[pb~=sm-6]){--pb: 6}*:is([p~=sm-7],[pt~=sm-7]){--pt: 7}*:is([p~=sm-7],[pb~=sm-7]){--pb: 7}*:is([p~=sm-8],[pt~=sm-8]){--pt: 8}*:is([p~=sm-8],[pb~=sm-8]){--pb: 8}*:is([p~=sm-9],[pt~=sm-9]){--pt: 9}*:is([p~=sm-9],[pb~=sm-9]){--pb: 9}*:is([p~=sm-10],[pt~=sm-10]){--pt: 10}*:is([p~=sm-10],[pb~=sm-10]){--pb: 10}*:is([p~=sm-11],[pt~=sm-11]){--pt: 11}*:is([p~=sm-11],[pb~=sm-11]){--pb: 11}*:is([p~=sm-12],[pt~=sm-12]){--pt: 12}*:is([p~=sm-12],[pb~=sm-12]){--pb: 12}*:is([p~=sm-13],[pt~=sm-13]){--pt: 13}*:is([p~=sm-13],[pb~=sm-13]){--pb: 13}*:is([p~=sm-14],[pt~=sm-14]){--pt: 14}*:is([p~=sm-14],[pb~=sm-14]){--pb: 14}*:is([p~=sm-15],[pt~=sm-15]){--pt: 15}*:is([p~=sm-15],[pb~=sm-15]){--pb: 15}*:is([p~=sm-16],[pt~=sm-16]){--pt: 16}*:is([p~=sm-16],[pb~=sm-16]){--pb: 16}*:is([p~=sm-17],[pt~=sm-17]){--pt: 17}*:is([p~=sm-17],[pb~=sm-17]){--pb: 17}*:is([p~=sm-18],[pt~=sm-18]){--pt: 18}*:is([p~=sm-18],[pb~=sm-18]){--pb: 18}*:is([p~=sm-19],[pt~=sm-19]){--pt: 19}*:is([p~=sm-19],[pb~=sm-19]){--pb: 19}*:is([p~=sm-20],[pt~=sm-20]){--pt: 20}*:is([p~=sm-20],[pb~=sm-20]){--pb: 20}*:is([p~=sm-21],[pt~=sm-21]){--pt: 21}*:is([p~=sm-21],[pb~=sm-21]){--pb: 21}*:is([p~=sm-22],[pt~=sm-22]){--pt: 22}*:is([p~=sm-22],[pb~=sm-22]){--pb: 22}*:is([p~=sm-23],[pt~=sm-23]){--pt: 23}*:is([p~=sm-23],[pb~=sm-23]){--pb: 23}*:is([p~=sm-24],[pt~=sm-24]){--pt: 24}*:is([p~=sm-24],[pb~=sm-24]){--pb: 24}*:is([p~=sm-25],[pt~=sm-25]){--pt: 25}*:is([p~=sm-25],[pb~=sm-25]){--pb: 25}}@media(min-width: 768px){*:is([p~=md-0],[pt~=md-0]){--pt: 0}*:is([p~=md-0],[pb~=md-0]){--pb: 0}*:is([p~=md-1],[pt~=md-1]){--pt: 1}*:is([p~=md-1],[pb~=md-1]){--pb: 1}*:is([p~=md-2],[pt~=md-2]){--pt: 2}*:is([p~=md-2],[pb~=md-2]){--pb: 2}*:is([p~=md-3],[pt~=md-3]){--pt: 3}*:is([p~=md-3],[pb~=md-3]){--pb: 3}*:is([p~=md-4],[pt~=md-4]){--pt: 4}*:is([p~=md-4],[pb~=md-4]){--pb: 4}*:is([p~=md-5],[pt~=md-5]){--pt: 5}*:is([p~=md-5],[pb~=md-5]){--pb: 5}*:is([p~=md-6],[pt~=md-6]){--pt: 6}*:is([p~=md-6],[pb~=md-6]){--pb: 6}*:is([p~=md-7],[pt~=md-7]){--pt: 7}*:is([p~=md-7],[pb~=md-7]){--pb: 7}*:is([p~=md-8],[pt~=md-8]){--pt: 8}*:is([p~=md-8],[pb~=md-8]){--pb: 8}*:is([p~=md-9],[pt~=md-9]){--pt: 9}*:is([p~=md-9],[pb~=md-9]){--pb: 9}*:is([p~=md-10],[pt~=md-10]){--pt: 10}*:is([p~=md-10],[pb~=md-10]){--pb: 10}*:is([p~=md-11],[pt~=md-11]){--pt: 11}*:is([p~=md-11],[pb~=md-11]){--pb: 11}*:is([p~=md-12],[pt~=md-12]){--pt: 12}*:is([p~=md-12],[pb~=md-12]){--pb: 12}*:is([p~=md-13],[pt~=md-13]){--pt: 13}*:is([p~=md-13],[pb~=md-13]){--pb: 13}*:is([p~=md-14],[pt~=md-14]){--pt: 14}*:is([p~=md-14],[pb~=md-14]){--pb: 14}*:is([p~=md-15],[pt~=md-15]){--pt: 15}*:is([p~=md-15],[pb~=md-15]){--pb: 15}*:is([p~=md-16],[pt~=md-16]){--pt: 16}*:is([p~=md-16],[pb~=md-16]){--pb: 16}*:is([p~=md-17],[pt~=md-17]){--pt: 17}*:is([p~=md-17],[pb~=md-17]){--pb: 17}*:is([p~=md-18],[pt~=md-18]){--pt: 18}*:is([p~=md-18],[pb~=md-18]){--pb: 18}*:is([p~=md-19],[pt~=md-19]){--pt: 19}*:is([p~=md-19],[pb~=md-19]){--pb: 19}*:is([p~=md-20],[pt~=md-20]){--pt: 20}*:is([p~=md-20],[pb~=md-20]){--pb: 20}*:is([p~=md-21],[pt~=md-21]){--pt: 21}*:is([p~=md-21],[pb~=md-21]){--pb: 21}*:is([p~=md-22],[pt~=md-22]){--pt: 22}*:is([p~=md-22],[pb~=md-22]){--pb: 22}*:is([p~=md-23],[pt~=md-23]){--pt: 23}*:is([p~=md-23],[pb~=md-23]){--pb: 23}*:is([p~=md-24],[pt~=md-24]){--pt: 24}*:is([p~=md-24],[pb~=md-24]){--pb: 24}*:is([p~=md-25],[pt~=md-25]){--pt: 25}*:is([p~=md-25],[pb~=md-25]){--pb: 25}}@media(min-width: 1024px){*:is([p~=lp-0],[pt~=lp-0]){--pt: 0}*:is([p~=lp-0],[pb~=lp-0]){--pb: 0}*:is([p~=lp-1],[pt~=lp-1]){--pt: 1}*:is([p~=lp-1],[pb~=lp-1]){--pb: 1}*:is([p~=lp-2],[pt~=lp-2]){--pt: 2}*:is([p~=lp-2],[pb~=lp-2]){--pb: 2}*:is([p~=lp-3],[pt~=lp-3]){--pt: 3}*:is([p~=lp-3],[pb~=lp-3]){--pb: 3}*:is([p~=lp-4],[pt~=lp-4]){--pt: 4}*:is([p~=lp-4],[pb~=lp-4]){--pb: 4}*:is([p~=lp-5],[pt~=lp-5]){--pt: 5}*:is([p~=lp-5],[pb~=lp-5]){--pb: 5}*:is([p~=lp-6],[pt~=lp-6]){--pt: 6}*:is([p~=lp-6],[pb~=lp-6]){--pb: 6}*:is([p~=lp-7],[pt~=lp-7]){--pt: 7}*:is([p~=lp-7],[pb~=lp-7]){--pb: 7}*:is([p~=lp-8],[pt~=lp-8]){--pt: 8}*:is([p~=lp-8],[pb~=lp-8]){--pb: 8}*:is([p~=lp-9],[pt~=lp-9]){--pt: 9}*:is([p~=lp-9],[pb~=lp-9]){--pb: 9}*:is([p~=lp-10],[pt~=lp-10]){--pt: 10}*:is([p~=lp-10],[pb~=lp-10]){--pb: 10}*:is([p~=lp-11],[pt~=lp-11]){--pt: 11}*:is([p~=lp-11],[pb~=lp-11]){--pb: 11}*:is([p~=lp-12],[pt~=lp-12]){--pt: 12}*:is([p~=lp-12],[pb~=lp-12]){--pb: 12}*:is([p~=lp-13],[pt~=lp-13]){--pt: 13}*:is([p~=lp-13],[pb~=lp-13]){--pb: 13}*:is([p~=lp-14],[pt~=lp-14]){--pt: 14}*:is([p~=lp-14],[pb~=lp-14]){--pb: 14}*:is([p~=lp-15],[pt~=lp-15]){--pt: 15}*:is([p~=lp-15],[pb~=lp-15]){--pb: 15}*:is([p~=lp-16],[pt~=lp-16]){--pt: 16}*:is([p~=lp-16],[pb~=lp-16]){--pb: 16}*:is([p~=lp-17],[pt~=lp-17]){--pt: 17}*:is([p~=lp-17],[pb~=lp-17]){--pb: 17}*:is([p~=lp-18],[pt~=lp-18]){--pt: 18}*:is([p~=lp-18],[pb~=lp-18]){--pb: 18}*:is([p~=lp-19],[pt~=lp-19]){--pt: 19}*:is([p~=lp-19],[pb~=lp-19]){--pb: 19}*:is([p~=lp-20],[pt~=lp-20]){--pt: 20}*:is([p~=lp-20],[pb~=lp-20]){--pb: 20}*:is([p~=lp-21],[pt~=lp-21]){--pt: 21}*:is([p~=lp-21],[pb~=lp-21]){--pb: 21}*:is([p~=lp-22],[pt~=lp-22]){--pt: 22}*:is([p~=lp-22],[pb~=lp-22]){--pb: 22}*:is([p~=lp-23],[pt~=lp-23]){--pt: 23}*:is([p~=lp-23],[pb~=lp-23]){--pb: 23}*:is([p~=lp-24],[pt~=lp-24]){--pt: 24}*:is([p~=lp-24],[pb~=lp-24]){--pb: 24}*:is([p~=lp-25],[pt~=lp-25]){--pt: 25}*:is([p~=lp-25],[pb~=lp-25]){--pb: 25}}@media(min-width: 1280px){*:is([p~=lg-0],[pt~=lg-0]){--pt: 0}*:is([p~=lg-0],[pb~=lg-0]){--pb: 0}*:is([p~=lg-1],[pt~=lg-1]){--pt: 1}*:is([p~=lg-1],[pb~=lg-1]){--pb: 1}*:is([p~=lg-2],[pt~=lg-2]){--pt: 2}*:is([p~=lg-2],[pb~=lg-2]){--pb: 2}*:is([p~=lg-3],[pt~=lg-3]){--pt: 3}*:is([p~=lg-3],[pb~=lg-3]){--pb: 3}*:is([p~=lg-4],[pt~=lg-4]){--pt: 4}*:is([p~=lg-4],[pb~=lg-4]){--pb: 4}*:is([p~=lg-5],[pt~=lg-5]){--pt: 5}*:is([p~=lg-5],[pb~=lg-5]){--pb: 5}*:is([p~=lg-6],[pt~=lg-6]){--pt: 6}*:is([p~=lg-6],[pb~=lg-6]){--pb: 6}*:is([p~=lg-7],[pt~=lg-7]){--pt: 7}*:is([p~=lg-7],[pb~=lg-7]){--pb: 7}*:is([p~=lg-8],[pt~=lg-8]){--pt: 8}*:is([p~=lg-8],[pb~=lg-8]){--pb: 8}*:is([p~=lg-9],[pt~=lg-9]){--pt: 9}*:is([p~=lg-9],[pb~=lg-9]){--pb: 9}*:is([p~=lg-10],[pt~=lg-10]){--pt: 10}*:is([p~=lg-10],[pb~=lg-10]){--pb: 10}*:is([p~=lg-11],[pt~=lg-11]){--pt: 11}*:is([p~=lg-11],[pb~=lg-11]){--pb: 11}*:is([p~=lg-12],[pt~=lg-12]){--pt: 12}*:is([p~=lg-12],[pb~=lg-12]){--pb: 12}*:is([p~=lg-13],[pt~=lg-13]){--pt: 13}*:is([p~=lg-13],[pb~=lg-13]){--pb: 13}*:is([p~=lg-14],[pt~=lg-14]){--pt: 14}*:is([p~=lg-14],[pb~=lg-14]){--pb: 14}*:is([p~=lg-15],[pt~=lg-15]){--pt: 15}*:is([p~=lg-15],[pb~=lg-15]){--pb: 15}*:is([p~=lg-16],[pt~=lg-16]){--pt: 16}*:is([p~=lg-16],[pb~=lg-16]){--pb: 16}*:is([p~=lg-17],[pt~=lg-17]){--pt: 17}*:is([p~=lg-17],[pb~=lg-17]){--pb: 17}*:is([p~=lg-18],[pt~=lg-18]){--pt: 18}*:is([p~=lg-18],[pb~=lg-18]){--pb: 18}*:is([p~=lg-19],[pt~=lg-19]){--pt: 19}*:is([p~=lg-19],[pb~=lg-19]){--pb: 19}*:is([p~=lg-20],[pt~=lg-20]){--pt: 20}*:is([p~=lg-20],[pb~=lg-20]){--pb: 20}*:is([p~=lg-21],[pt~=lg-21]){--pt: 21}*:is([p~=lg-21],[pb~=lg-21]){--pb: 21}*:is([p~=lg-22],[pt~=lg-22]){--pt: 22}*:is([p~=lg-22],[pb~=lg-22]){--pb: 22}*:is([p~=lg-23],[pt~=lg-23]){--pt: 23}*:is([p~=lg-23],[pb~=lg-23]){--pb: 23}*:is([p~=lg-24],[pt~=lg-24]){--pt: 24}*:is([p~=lg-24],[pb~=lg-24]){--pb: 24}*:is([p~=lg-25],[pt~=lg-25]){--pt: 25}*:is([p~=lg-25],[pb~=lg-25]){--pb: 25}}@media(min-width: 1536px){*:is([p~=dt-0],[pt~=dt-0]){--pt: 0}*:is([p~=dt-0],[pb~=dt-0]){--pb: 0}*:is([p~=dt-1],[pt~=dt-1]){--pt: 1}*:is([p~=dt-1],[pb~=dt-1]){--pb: 1}*:is([p~=dt-2],[pt~=dt-2]){--pt: 2}*:is([p~=dt-2],[pb~=dt-2]){--pb: 2}*:is([p~=dt-3],[pt~=dt-3]){--pt: 3}*:is([p~=dt-3],[pb~=dt-3]){--pb: 3}*:is([p~=dt-4],[pt~=dt-4]){--pt: 4}*:is([p~=dt-4],[pb~=dt-4]){--pb: 4}*:is([p~=dt-5],[pt~=dt-5]){--pt: 5}*:is([p~=dt-5],[pb~=dt-5]){--pb: 5}*:is([p~=dt-6],[pt~=dt-6]){--pt: 6}*:is([p~=dt-6],[pb~=dt-6]){--pb: 6}*:is([p~=dt-7],[pt~=dt-7]){--pt: 7}*:is([p~=dt-7],[pb~=dt-7]){--pb: 7}*:is([p~=dt-8],[pt~=dt-8]){--pt: 8}*:is([p~=dt-8],[pb~=dt-8]){--pb: 8}*:is([p~=dt-9],[pt~=dt-9]){--pt: 9}*:is([p~=dt-9],[pb~=dt-9]){--pb: 9}*:is([p~=dt-10],[pt~=dt-10]){--pt: 10}*:is([p~=dt-10],[pb~=dt-10]){--pb: 10}*:is([p~=dt-11],[pt~=dt-11]){--pt: 11}*:is([p~=dt-11],[pb~=dt-11]){--pb: 11}*:is([p~=dt-12],[pt~=dt-12]){--pt: 12}*:is([p~=dt-12],[pb~=dt-12]){--pb: 12}*:is([p~=dt-13],[pt~=dt-13]){--pt: 13}*:is([p~=dt-13],[pb~=dt-13]){--pb: 13}*:is([p~=dt-14],[pt~=dt-14]){--pt: 14}*:is([p~=dt-14],[pb~=dt-14]){--pb: 14}*:is([p~=dt-15],[pt~=dt-15]){--pt: 15}*:is([p~=dt-15],[pb~=dt-15]){--pb: 15}*:is([p~=dt-16],[pt~=dt-16]){--pt: 16}*:is([p~=dt-16],[pb~=dt-16]){--pb: 16}*:is([p~=dt-17],[pt~=dt-17]){--pt: 17}*:is([p~=dt-17],[pb~=dt-17]){--pb: 17}*:is([p~=dt-18],[pt~=dt-18]){--pt: 18}*:is([p~=dt-18],[pb~=dt-18]){--pb: 18}*:is([p~=dt-19],[pt~=dt-19]){--pt: 19}*:is([p~=dt-19],[pb~=dt-19]){--pb: 19}*:is([p~=dt-20],[pt~=dt-20]){--pt: 20}*:is([p~=dt-20],[pb~=dt-20]){--pb: 20}*:is([p~=dt-21],[pt~=dt-21]){--pt: 21}*:is([p~=dt-21],[pb~=dt-21]){--pb: 21}*:is([p~=dt-22],[pt~=dt-22]){--pt: 22}*:is([p~=dt-22],[pb~=dt-22]){--pb: 22}*:is([p~=dt-23],[pt~=dt-23]){--pt: 23}*:is([p~=dt-23],[pb~=dt-23]){--pb: 23}*:is([p~=dt-24],[pt~=dt-24]){--pt: 24}*:is([p~=dt-24],[pb~=dt-24]){--pb: 24}*:is([p~=dt-25],[pt~=dt-25]){--pt: 25}*:is([p~=dt-25],[pb~=dt-25]){--pb: 25}}@media(min-width: 1920px){*:is([p~=xl-0],[pt~=xl-0]){--pt: 0}*:is([p~=xl-0],[pb~=xl-0]){--pb: 0}*:is([p~=xl-1],[pt~=xl-1]){--pt: 1}*:is([p~=xl-1],[pb~=xl-1]){--pb: 1}*:is([p~=xl-2],[pt~=xl-2]){--pt: 2}*:is([p~=xl-2],[pb~=xl-2]){--pb: 2}*:is([p~=xl-3],[pt~=xl-3]){--pt: 3}*:is([p~=xl-3],[pb~=xl-3]){--pb: 3}*:is([p~=xl-4],[pt~=xl-4]){--pt: 4}*:is([p~=xl-4],[pb~=xl-4]){--pb: 4}*:is([p~=xl-5],[pt~=xl-5]){--pt: 5}*:is([p~=xl-5],[pb~=xl-5]){--pb: 5}*:is([p~=xl-6],[pt~=xl-6]){--pt: 6}*:is([p~=xl-6],[pb~=xl-6]){--pb: 6}*:is([p~=xl-7],[pt~=xl-7]){--pt: 7}*:is([p~=xl-7],[pb~=xl-7]){--pb: 7}*:is([p~=xl-8],[pt~=xl-8]){--pt: 8}*:is([p~=xl-8],[pb~=xl-8]){--pb: 8}*:is([p~=xl-9],[pt~=xl-9]){--pt: 9}*:is([p~=xl-9],[pb~=xl-9]){--pb: 9}*:is([p~=xl-10],[pt~=xl-10]){--pt: 10}*:is([p~=xl-10],[pb~=xl-10]){--pb: 10}*:is([p~=xl-11],[pt~=xl-11]){--pt: 11}*:is([p~=xl-11],[pb~=xl-11]){--pb: 11}*:is([p~=xl-12],[pt~=xl-12]){--pt: 12}*:is([p~=xl-12],[pb~=xl-12]){--pb: 12}*:is([p~=xl-13],[pt~=xl-13]){--pt: 13}*:is([p~=xl-13],[pb~=xl-13]){--pb: 13}*:is([p~=xl-14],[pt~=xl-14]){--pt: 14}*:is([p~=xl-14],[pb~=xl-14]){--pb: 14}*:is([p~=xl-15],[pt~=xl-15]){--pt: 15}*:is([p~=xl-15],[pb~=xl-15]){--pb: 15}*:is([p~=xl-16],[pt~=xl-16]){--pt: 16}*:is([p~=xl-16],[pb~=xl-16]){--pb: 16}*:is([p~=xl-17],[pt~=xl-17]){--pt: 17}*:is([p~=xl-17],[pb~=xl-17]){--pb: 17}*:is([p~=xl-18],[pt~=xl-18]){--pt: 18}*:is([p~=xl-18],[pb~=xl-18]){--pb: 18}*:is([p~=xl-19],[pt~=xl-19]){--pt: 19}*:is([p~=xl-19],[pb~=xl-19]){--pb: 19}*:is([p~=xl-20],[pt~=xl-20]){--pt: 20}*:is([p~=xl-20],[pb~=xl-20]){--pb: 20}*:is([p~=xl-21],[pt~=xl-21]){--pt: 21}*:is([p~=xl-21],[pb~=xl-21]){--pb: 21}*:is([p~=xl-22],[pt~=xl-22]){--pt: 22}*:is([p~=xl-22],[pb~=xl-22]){--pb: 22}*:is([p~=xl-23],[pt~=xl-23]){--pt: 23}*:is([p~=xl-23],[pb~=xl-23]){--pb: 23}*:is([p~=xl-24],[pt~=xl-24]){--pt: 24}*:is([p~=xl-24],[pb~=xl-24]){--pb: 24}*:is([p~=xl-25],[pt~=xl-25]){--pt: 25}*:is([p~=xl-25],[pb~=xl-25]){--pb: 25}}:where(*:not(svg,svg *,img,video,canvas,iframe),*::before,*::after){all:unset;display:revert;box-sizing:border-box;vertical-align:middle}:where(svg,svg *,img,video,canvas,iframe){box-sizing:border-box;vertical-align:middle}:where(html){font-size:var(--font-size);width:100vw;overflow-x:hidden;scroll-behavior:smooth;-webkit-text-size-adjust:none;text-size-adjust:none}:where(body){user-select:none;width:100vw;overflow-x:hidden;font-size:var(--font-size);font-weight:var(--font-weight);line-height:1}:where(main,section,*[container]){position:relative;width:100%;margin-left:auto;margin-right:auto}:where(picture,video,canvas,svg){display:block;overflow:hidden;max-width:100%;height:auto;line-height:0}:where(img,iframe){width:100%;height:100%;object-fit:cover;object-position:center}:where(input,textarea,button){font-size:var(--fs-p)}:where(input::placeholder,textarea::placeholder){font-size:inherit;font-weight:inherit;line-height:inherit}:where(textarea:focus,input:focus,button:focus){outline:none}:where(input,textarea){-webkit-user-select:auto}:where(textarea){white-space:revert}::placeholder{color:unset}:where(label){position:relative;cursor:pointer}:where(label>input,label>textarea){width:100%;height:100%;resize:vertical}:where(label:has(>*[checkbox],*[radio]):has(>input[type=checkbox],input[type=radio])){position:relative}:where(label:has(>*[checkbox],*[radio]):has(>input[type=checkbox],input[type=radio])) input[type=checkbox],:where(label:has(>*[checkbox],*[radio]):has(>input[type=checkbox],input[type=radio])) input[type=radio]{position:absolute;opacity:0;width:1px;height:1px;bottom:0;left:0;pointer-events:none}:where(label:has(>*[checkbox],*[radio]):has(>input[type=checkbox],input[type=radio])) *[checkbox],:where(label:has(>*[checkbox],*[radio]):has(>input[type=checkbox],input[type=radio])) *[radio]{cursor:pointer;position:relative}:where(label:has(>*[checkbox],*[radio]):has(>input[type=checkbox],input[type=radio])) span[checkbox],:where(label:has(>*[checkbox],*[radio]):has(>input[type=checkbox],input[type=radio])) span[radio]{display:inline-block;vertical-align:middle;width:var(--fs-p);height:var(--fs-p)}:where(label:has(>*[checkbox],*[radio]):has(>input[type=checkbox],input[type=radio])) span[checkbox] svg,:where(label:has(>*[checkbox],*[radio]):has(>input[type=checkbox],input[type=radio])) span[radio] svg{width:100%;height:100%}:where(li){list-style:none}:where(table){border-collapse:collapse}:where(meter){-webkit-appearance:revert;appearance:revert}:where([contenteditable]:not([contenteditable=false])){-webkit-user-modify:read-write;-moz-user-modify:read-write;overflow-wrap:break-word;-webkit-user-select:auto}:where(dialog:modal){all:revert;box-sizing:border-box}:where(summary){list-style:none}::-webkit-details-marker{display:none}:where(hr){border:0;margin:0}*[fluid]{width:fit-content;height:fit-content}*[cover]{width:100%;height:100%}*[icon]{display:flex;justify-content:center;align-items:center;box-sizing:content-box;cursor:pointer;position:relative;width:max-content;height:max-content}*[icon~=square]{height:auto;aspect-ratio:1/1}*[icon~=inline]{display:inline-flex}*[icon]>*{flex:auto}*[icon]::after{content:"";position:absolute;top:-1em;left:-1em;right:-1em;bottom:-1em;pointer-events:all;background:rgba(0,0,0,0);z-index:10}*[mask]{--mask: '';--color: #000;mask:var(--mask) no-repeat center/contain;background-color:var(--color)}:where(a,button){cursor:pointer}:where(h1,h2,h3,h4,h5,h6,p){overflow-wrap:break-word}:where(h1){font-size:var(--fs-h1)}:where(h2){font-size:var(--fs-h2)}:where(h3){font-size:var(--fs-h3)}:where(h4){font-size:var(--fs-h4)}:where(h5){font-size:var(--fs-h5)}:where(h6){font-size:var(--fs-h6)}:where(p){font-size:var(--fs-p)}@media(min-width: 360px){:where(*[container]){max-width:340px}}@media(min-width: 576px){:where(*[container]){max-width:540px}}@media(min-width: 768px){:where(*[container]){max-width:720px}}@media(min-width: 1024px){:where(*[container]){max-width:960px}}@media(min-width: 1280px){:where(*[container]){max-width:1200px}}@media(min-width: 1536px){:where(*[container]){max-width:1320px}}@media(min-width: 1920px){:where(*[container]){max-width:1600px}}*[grid],*[grid~="12"]{--grid-columns: 12;display:grid;grid-template-columns:repeat(var(--grid-columns), 1fr)}*[grid~="10"]{--grid-columns: 10}*[col]{--col-span: var(--grid-columns);--col-start: auto;grid-column:var(--col-start)/span var(--col-span)}*[col~="1"]{--col-span: 1}*[col~="2"]{--col-span: 2}*[col~="3"]{--col-span: 3}*[col~="4"]{--col-span: 4}*[col~="5"]{--col-span: 5}*[col~="6"]{--col-span: 6}*[col~="7"]{--col-span: 7}*[col~="8"]{--col-span: 8}*[col~="9"]{--col-span: 9}*[col~="10"]{--col-span: 10}*[col~="11"]{--col-span: 11}*[col~="12"]{--col-span: 12}*[col~=start-1]{--col-start: 1}*[col~=start-2]{--col-start: 2}*[col~=start-3]{--col-start: 3}*[col~=start-4]{--col-start: 4}*[col~=start-5]{--col-start: 5}*[col~=start-6]{--col-start: 6}*[col~=start-7]{--col-start: 7}*[col~=start-8]{--col-start: 8}*[col~=start-9]{--col-start: 9}*[col~=start-10]{--col-start: 10}*[col~=start-11]{--col-start: 11}*[col~=start-12]{--col-start: 12}@media(min-width: 360px){*[col~=xs-1]{--col-span: 1}*[col~=xs-2]{--col-span: 2}*[col~=xs-3]{--col-span: 3}*[col~=xs-4]{--col-span: 4}*[col~=xs-5]{--col-span: 5}*[col~=xs-6]{--col-span: 6}*[col~=xs-7]{--col-span: 7}*[col~=xs-8]{--col-span: 8}*[col~=xs-9]{--col-span: 9}*[col~=xs-10]{--col-span: 10}*[col~=xs-11]{--col-span: 11}*[col~=xs-12]{--col-span: 12}*[col~=xs-start-1]{--col-start: 1}*[col~=xs-start-2]{--col-start: 2}*[col~=xs-start-3]{--col-start: 3}*[col~=xs-start-4]{--col-start: 4}*[col~=xs-start-5]{--col-start: 5}*[col~=xs-start-6]{--col-start: 6}*[col~=xs-start-7]{--col-start: 7}*[col~=xs-start-8]{--col-start: 8}*[col~=xs-start-9]{--col-start: 9}*[col~=xs-start-10]{--col-start: 10}*[col~=xs-start-11]{--col-start: 11}*[col~=xs-start-12]{--col-start: 12}}@media(min-width: 576px){*[col~=sm-1]{--col-span: 1}*[col~=sm-2]{--col-span: 2}*[col~=sm-3]{--col-span: 3}*[col~=sm-4]{--col-span: 4}*[col~=sm-5]{--col-span: 5}*[col~=sm-6]{--col-span: 6}*[col~=sm-7]{--col-span: 7}*[col~=sm-8]{--col-span: 8}*[col~=sm-9]{--col-span: 9}*[col~=sm-10]{--col-span: 10}*[col~=sm-11]{--col-span: 11}*[col~=sm-12]{--col-span: 12}*[col~=sm-start-1]{--col-start: 1}*[col~=sm-start-2]{--col-start: 2}*[col~=sm-start-3]{--col-start: 3}*[col~=sm-start-4]{--col-start: 4}*[col~=sm-start-5]{--col-start: 5}*[col~=sm-start-6]{--col-start: 6}*[col~=sm-start-7]{--col-start: 7}*[col~=sm-start-8]{--col-start: 8}*[col~=sm-start-9]{--col-start: 9}*[col~=sm-start-10]{--col-start: 10}*[col~=sm-start-11]{--col-start: 11}*[col~=sm-start-12]{--col-start: 12}}@media(min-width: 768px){*[col~=md-1]{--col-span: 1}*[col~=md-2]{--col-span: 2}*[col~=md-3]{--col-span: 3}*[col~=md-4]{--col-span: 4}*[col~=md-5]{--col-span: 5}*[col~=md-6]{--col-span: 6}*[col~=md-7]{--col-span: 7}*[col~=md-8]{--col-span: 8}*[col~=md-9]{--col-span: 9}*[col~=md-10]{--col-span: 10}*[col~=md-11]{--col-span: 11}*[col~=md-12]{--col-span: 12}*[col~=md-start-1]{--col-start: 1}*[col~=md-start-2]{--col-start: 2}*[col~=md-start-3]{--col-start: 3}*[col~=md-start-4]{--col-start: 4}*[col~=md-start-5]{--col-start: 5}*[col~=md-start-6]{--col-start: 6}*[col~=md-start-7]{--col-start: 7}*[col~=md-start-8]{--col-start: 8}*[col~=md-start-9]{--col-start: 9}*[col~=md-start-10]{--col-start: 10}*[col~=md-start-11]{--col-start: 11}*[col~=md-start-12]{--col-start: 12}}@media(min-width: 1024px){*[col~=lp-1]{--col-span: 1}*[col~=lp-2]{--col-span: 2}*[col~=lp-3]{--col-span: 3}*[col~=lp-4]{--col-span: 4}*[col~=lp-5]{--col-span: 5}*[col~=lp-6]{--col-span: 6}*[col~=lp-7]{--col-span: 7}*[col~=lp-8]{--col-span: 8}*[col~=lp-9]{--col-span: 9}*[col~=lp-10]{--col-span: 10}*[col~=lp-11]{--col-span: 11}*[col~=lp-12]{--col-span: 12}*[col~=lp-start-1]{--col-start: 1}*[col~=lp-start-2]{--col-start: 2}*[col~=lp-start-3]{--col-start: 3}*[col~=lp-start-4]{--col-start: 4}*[col~=lp-start-5]{--col-start: 5}*[col~=lp-start-6]{--col-start: 6}*[col~=lp-start-7]{--col-start: 7}*[col~=lp-start-8]{--col-start: 8}*[col~=lp-start-9]{--col-start: 9}*[col~=lp-start-10]{--col-start: 10}*[col~=lp-start-11]{--col-start: 11}*[col~=lp-start-12]{--col-start: 12}}@media(min-width: 1280px){*[col~=lg-1]{--col-span: 1}*[col~=lg-2]{--col-span: 2}*[col~=lg-3]{--col-span: 3}*[col~=lg-4]{--col-span: 4}*[col~=lg-5]{--col-span: 5}*[col~=lg-6]{--col-span: 6}*[col~=lg-7]{--col-span: 7}*[col~=lg-8]{--col-span: 8}*[col~=lg-9]{--col-span: 9}*[col~=lg-10]{--col-span: 10}*[col~=lg-11]{--col-span: 11}*[col~=lg-12]{--col-span: 12}*[col~=lg-start-1]{--col-start: 1}*[col~=lg-start-2]{--col-start: 2}*[col~=lg-start-3]{--col-start: 3}*[col~=lg-start-4]{--col-start: 4}*[col~=lg-start-5]{--col-start: 5}*[col~=lg-start-6]{--col-start: 6}*[col~=lg-start-7]{--col-start: 7}*[col~=lg-start-8]{--col-start: 8}*[col~=lg-start-9]{--col-start: 9}*[col~=lg-start-10]{--col-start: 10}*[col~=lg-start-11]{--col-start: 11}*[col~=lg-start-12]{--col-start: 12}}@media(min-width: 1536px){*[col~=dt-1]{--col-span: 1}*[col~=dt-2]{--col-span: 2}*[col~=dt-3]{--col-span: 3}*[col~=dt-4]{--col-span: 4}*[col~=dt-5]{--col-span: 5}*[col~=dt-6]{--col-span: 6}*[col~=dt-7]{--col-span: 7}*[col~=dt-8]{--col-span: 8}*[col~=dt-9]{--col-span: 9}*[col~=dt-10]{--col-span: 10}*[col~=dt-11]{--col-span: 11}*[col~=dt-12]{--col-span: 12}*[col~=dt-start-1]{--col-start: 1}*[col~=dt-start-2]{--col-start: 2}*[col~=dt-start-3]{--col-start: 3}*[col~=dt-start-4]{--col-start: 4}*[col~=dt-start-5]{--col-start: 5}*[col~=dt-start-6]{--col-start: 6}*[col~=dt-start-7]{--col-start: 7}*[col~=dt-start-8]{--col-start: 8}*[col~=dt-start-9]{--col-start: 9}*[col~=dt-start-10]{--col-start: 10}*[col~=dt-start-11]{--col-start: 11}*[col~=dt-start-12]{--col-start: 12}}@media(min-width: 1920px){*[col~=xl-1]{--col-span: 1}*[col~=xl-2]{--col-span: 2}*[col~=xl-3]{--col-span: 3}*[col~=xl-4]{--col-span: 4}*[col~=xl-5]{--col-span: 5}*[col~=xl-6]{--col-span: 6}*[col~=xl-7]{--col-span: 7}*[col~=xl-8]{--col-span: 8}*[col~=xl-9]{--col-span: 9}*[col~=xl-10]{--col-span: 10}*[col~=xl-11]{--col-span: 11}*[col~=xl-12]{--col-span: 12}*[col~=xl-start-1]{--col-start: 1}*[col~=xl-start-2]{--col-start: 2}*[col~=xl-start-3]{--col-start: 3}*[col~=xl-start-4]{--col-start: 4}*[col~=xl-start-5]{--col-start: 5}*[col~=xl-start-6]{--col-start: 6}*[col~=xl-start-7]{--col-start: 7}*[col~=xl-start-8]{--col-start: 8}*[col~=xl-start-9]{--col-start: 9}*[col~=xl-start-10]{--col-start: 10}*[col~=xl-start-11]{--col-start: 11}*[col~=xl-start-12]{--col-start: 12}}*[ps]{--position: relative;position:var(--position) !important}*[ps~=relative]{--position: relative }*[ps~=absolute]{--position: absolute }*[ps~=fixed]{--position: fixed }*[ps~=sticky]{--position: sticky }*[ps*=center]:is([ps~=absolute],[ps~=fixed],[ps~=sticky]){left:var(--position-left);top:var(--position-top);transform:translate(var(--position-translate-x), var(--position-translate-y))}*[ps~=center-x]{--position-top: 0;--position-translate-y: 0 }*[ps~=center-y]{--position-left: 0;--position-translate-x: 0 }*:is([ps~=center-x][ps~=center-y],[ps~=center]){--position-left: 50%;--position-top: 50%;--position-translate-x: -50%;--position-translate-y: -50% }*[ov]{--overflow-x: visible;--overflow-y: visible;overflow-x:var(--overflow-x) !important;overflow-y:var(--overflow-y) !important}*[ov=hidden]{--overflow-x: hidden;--overflow-y: hidden }*[ov~=scroll]{--overflow-x: auto;--overflow-y: auto }*[ov~=y]{--overflow-x: clip }*[ov~=x]{--overflow-y: clip }*[ds]{--display: initial;display:var(--display) !important}*[ds~=none]{--display: none}*[ds~=block]{--display: block}*[ds~=flex]{--display: flex}*[ds~=grid]{--display: grid}*[ds~=inline]{--display: inline}@media(min-width: 360px){*[ds~=xs-none]{--display: none}*[ds~=xs-block]{--display: block}*[ds~=xs-flex]{--display: flex}*[ds~=xs-grid]{--display: grid}*[ds~=xs-inline]{--display: inline}}@media(min-width: 576px){*[ds~=sm-none]{--display: none}*[ds~=sm-block]{--display: block}*[ds~=sm-flex]{--display: flex}*[ds~=sm-grid]{--display: grid}*[ds~=sm-inline]{--display: inline}}@media(min-width: 768px){*[ds~=md-none]{--display: none}*[ds~=md-block]{--display: block}*[ds~=md-flex]{--display: flex}*[ds~=md-grid]{--display: grid}*[ds~=md-inline]{--display: inline}}@media(min-width: 1024px){*[ds~=lp-none]{--display: none}*[ds~=lp-block]{--display: block}*[ds~=lp-flex]{--display: flex}*[ds~=lp-grid]{--display: grid}*[ds~=lp-inline]{--display: inline}}@media(min-width: 1280px){*[ds~=lg-none]{--display: none}*[ds~=lg-block]{--display: block}*[ds~=lg-flex]{--display: flex}*[ds~=lg-grid]{--display: grid}*[ds~=lg-inline]{--display: inline}}@media(min-width: 1536px){*[ds~=dt-none]{--display: none}*[ds~=dt-block]{--display: block}*[ds~=dt-flex]{--display: flex}*[ds~=dt-grid]{--display: grid}*[ds~=dt-inline]{--display: inline}}@media(min-width: 1920px){*[ds~=xl-none]{--display: none}*[ds~=xl-block]{--display: block}*[ds~=xl-flex]{--display: flex}*[ds~=xl-grid]{--display: grid}*[ds~=xl-inline]{--display: inline}}:where(*[ds*=gap]:is([ds*=flex],[ds*=grid]),*[grid*=gap]){--gap: 0;--gap-x: var(--gap);--gap-y: var(--gap);gap:calc(var(--gap-y)*var(--space-step)) calc(var(--gap-x)*var(--space-step))}*:is([ds~=gap-1],[grid~=gap-1]){--gap: 1}*:is([ds~=gap-2],[grid~=gap-2]){--gap: 2}*:is([ds~=gap-3],[grid~=gap-3]){--gap: 3}*:is([ds~=gap-4],[grid~=gap-4]){--gap: 4}*:is([ds~=gap-5],[grid~=gap-5]){--gap: 5}*:is([ds~=gap-6],[grid~=gap-6]){--gap: 6}*:is([ds~=gap-7],[grid~=gap-7]){--gap: 7}*:is([ds~=gap-8],[grid~=gap-8]){--gap: 8}*:is([ds~=gap-9],[grid~=gap-9]){--gap: 9}*:is([ds~=gap-10],[grid~=gap-10]){--gap: 10}*:is([ds~=gap-11],[grid~=gap-11]){--gap: 11}*:is([ds~=gap-12],[grid~=gap-12]){--gap: 12}*:is([ds~=gap-13],[grid~=gap-13]){--gap: 13}*:is([ds~=gap-14],[grid~=gap-14]){--gap: 14}*:is([ds~=gap-15],[grid~=gap-15]){--gap: 15}*:is([ds~=gap-x-1],[grid~=gap-x-1]){--gap-x: 1}*:is([ds~=gap-x-2],[grid~=gap-x-2]){--gap-x: 2}*:is([ds~=gap-x-3],[grid~=gap-x-3]){--gap-x: 3}*:is([ds~=gap-x-4],[grid~=gap-x-4]){--gap-x: 4}*:is([ds~=gap-x-5],[grid~=gap-x-5]){--gap-x: 5}*:is([ds~=gap-x-6],[grid~=gap-x-6]){--gap-x: 6}*:is([ds~=gap-x-7],[grid~=gap-x-7]){--gap-x: 7}*:is([ds~=gap-x-8],[grid~=gap-x-8]){--gap-x: 8}*:is([ds~=gap-x-9],[grid~=gap-x-9]){--gap-x: 9}*:is([ds~=gap-x-10],[grid~=gap-x-10]){--gap-x: 10}*:is([ds~=gap-x-11],[grid~=gap-x-11]){--gap-x: 11}*:is([ds~=gap-x-12],[grid~=gap-x-12]){--gap-x: 12}*:is([ds~=gap-x-13],[grid~=gap-x-13]){--gap-x: 13}*:is([ds~=gap-x-14],[grid~=gap-x-14]){--gap-x: 14}*:is([ds~=gap-x-15],[grid~=gap-x-15]){--gap-x: 15}*:is([ds~=gap-y-1],[grid~=gap-y-1]){--gap-y: 1}*:is([ds~=gap-y-2],[grid~=gap-y-2]){--gap-y: 2}*:is([ds~=gap-y-3],[grid~=gap-y-3]){--gap-y: 3}*:is([ds~=gap-y-4],[grid~=gap-y-4]){--gap-y: 4}*:is([ds~=gap-y-5],[grid~=gap-y-5]){--gap-y: 5}*:is([ds~=gap-y-6],[grid~=gap-y-6]){--gap-y: 6}*:is([ds~=gap-y-7],[grid~=gap-y-7]){--gap-y: 7}*:is([ds~=gap-y-8],[grid~=gap-y-8]){--gap-y: 8}*:is([ds~=gap-y-9],[grid~=gap-y-9]){--gap-y: 9}*:is([ds~=gap-y-10],[grid~=gap-y-10]){--gap-y: 10}*:is([ds~=gap-y-11],[grid~=gap-y-11]){--gap-y: 11}*:is([ds~=gap-y-12],[grid~=gap-y-12]){--gap-y: 12}*:is([ds~=gap-y-13],[grid~=gap-y-13]){--gap-y: 13}*:is([ds~=gap-y-14],[grid~=gap-y-14]){--gap-y: 14}*:is([ds~=gap-y-15],[grid~=gap-y-15]){--gap-y: 15}.editor{width:100%;max-width:100%;margin:0;padding:0;user-select:text;line-height:1.6}.editor *{all:revert}.editor h1{font-size:var(--fs-h1)}.editor h2{font-size:var(--fs-h2)}.editor h3{font-size:var(--fs-h3)}.editor h4{font-size:var(--fs-h4)}.editor h5{font-size:var(--fs-h5)}.editor h6{font-size:var(--fs-h6)}.editor h1,.editor h2,.editor h3,.editor h4,.editor h5,.editor h6{margin:1.6em 0 .8em}.editor p{margin:0 0 1em}.editor a{color:blue;text-decoration:underline}.editor ul,.editor ol{margin:0 0 1em 2em;list-style-position:inside}.editor li{margin-bottom:.5em}.editor blockquote{margin:0 0 1em;padding-left:1em}.editor hr{border:none;border-top:1px solid #ccc;margin:2em 0}.editor table{width:100%;border-collapse:collapse;margin-bottom:1em}.editor th,.editor td{padding:.5em 1em;border:1px solid #ccc;text-align:left}.editor img{height:auto;max-width:100%;object-fit:initial}.editor iframe{aspect-ratio:16/9;height:auto;object-fit:initial}.editor pre,.editor code{background:#f4f4f4;padding:.25em .5em;border-radius:.25em;overflow-x:auto}.editor pre{margin-bottom:1em}.editor sup,.editor sub{vertical-align:baseline;font-size:.8em}:where(*[container~=query]){container-type:inline-size;container-name:container query-ctx;--cq-step: 0.4cqw}:where(*[container~=query][container~=block]){container-type:size}:where(*[container~="1"]){--cq-step: 0.4cqw}:where(*[container~="2"]){--cq-step: 0.8cqw}:where(*[container~="3"]){--cq-step: 1.2cqw}:where(*[container~="4"]){--cq-step: 1.6cqw}:where(*[container~="5"]){--cq-step: 2cqw}:where(*[container~="6"]){--cq-step: 2.4cqw}:where(*[container~="7"]){--cq-step: 2.8cqw}:where(*[container~="8"]){--cq-step: 3.2cqw}:where(*[container~="9"]){--cq-step: 3.6cqw}:where(*[container~="10"]){--cq-step: 4cqw}:where(*[container~="11"]){--cq-step: 4.4cqw}:where(*[container~="12"]){--cq-step: 4.8cqw}:where(*[container~="13"]){--cq-step: 5.2cqw}:where(*[container~="14"]){--cq-step: 5.6cqw}:where(*[container~="15"]){--cq-step: 6cqw}:where(*[container~="16"]){--cq-step: 6.4cqw}:where(*[container~="17"]){--cq-step: 6.8cqw}:where(*[container~="18"]){--cq-step: 7.2cqw}:where(*[container~="19"]){--cq-step: 7.6cqw}:where(*[container~="20"]){--cq-step: 8cqw}:where(*[container~=static]){container-type:inline-size;container-name:container query-ctx;--cq-step: var(--cq-fixed)}@media(min-width: 360px){:where(*[container~=xs-query]){container-type:inline-size;container-name:container query-ctx;--cq-step: 0.4cqw}:where(*[container~=xs-query][container~=block]){container-type:size}:where(*[container~=xs-1]){--cq-step: 0.4cqw}:where(*[container~=xs-2]){--cq-step: 0.8cqw}:where(*[container~=xs-3]){--cq-step: 1.2cqw}:where(*[container~=xs-4]){--cq-step: 1.6cqw}:where(*[container~=xs-5]){--cq-step: 2cqw}:where(*[container~=xs-6]){--cq-step: 2.4cqw}:where(*[container~=xs-7]){--cq-step: 2.8cqw}:where(*[container~=xs-8]){--cq-step: 3.2cqw}:where(*[container~=xs-9]){--cq-step: 3.6cqw}:where(*[container~=xs-10]){--cq-step: 4cqw}:where(*[container~=xs-11]){--cq-step: 4.4cqw}:where(*[container~=xs-12]){--cq-step: 4.8cqw}:where(*[container~=xs-13]){--cq-step: 5.2cqw}:where(*[container~=xs-14]){--cq-step: 5.6cqw}:where(*[container~=xs-15]){--cq-step: 6cqw}:where(*[container~=xs-16]){--cq-step: 6.4cqw}:where(*[container~=xs-17]){--cq-step: 6.8cqw}:where(*[container~=xs-18]){--cq-step: 7.2cqw}:where(*[container~=xs-19]){--cq-step: 7.6cqw}:where(*[container~=xs-20]){--cq-step: 8cqw}:where(*[container~=xs-static]){container-type:inline-size;container-name:container query-ctx;--cq-step: var(--cq-fixed)}}@media(min-width: 576px){:where(*[container~=sm-query]){container-type:inline-size;container-name:container query-ctx;--cq-step: 0.4cqw}:where(*[container~=sm-query][container~=block]){container-type:size}:where(*[container~=sm-1]){--cq-step: 0.4cqw}:where(*[container~=sm-2]){--cq-step: 0.8cqw}:where(*[container~=sm-3]){--cq-step: 1.2cqw}:where(*[container~=sm-4]){--cq-step: 1.6cqw}:where(*[container~=sm-5]){--cq-step: 2cqw}:where(*[container~=sm-6]){--cq-step: 2.4cqw}:where(*[container~=sm-7]){--cq-step: 2.8cqw}:where(*[container~=sm-8]){--cq-step: 3.2cqw}:where(*[container~=sm-9]){--cq-step: 3.6cqw}:where(*[container~=sm-10]){--cq-step: 4cqw}:where(*[container~=sm-11]){--cq-step: 4.4cqw}:where(*[container~=sm-12]){--cq-step: 4.8cqw}:where(*[container~=sm-13]){--cq-step: 5.2cqw}:where(*[container~=sm-14]){--cq-step: 5.6cqw}:where(*[container~=sm-15]){--cq-step: 6cqw}:where(*[container~=sm-16]){--cq-step: 6.4cqw}:where(*[container~=sm-17]){--cq-step: 6.8cqw}:where(*[container~=sm-18]){--cq-step: 7.2cqw}:where(*[container~=sm-19]){--cq-step: 7.6cqw}:where(*[container~=sm-20]){--cq-step: 8cqw}:where(*[container~=sm-static]){container-type:inline-size;container-name:container query-ctx;--cq-step: var(--cq-fixed)}}@media(min-width: 768px){:where(*[container~=md-query]){container-type:inline-size;container-name:container query-ctx;--cq-step: 0.4cqw}:where(*[container~=md-query][container~=block]){container-type:size}:where(*[container~=md-1]){--cq-step: 0.4cqw}:where(*[container~=md-2]){--cq-step: 0.8cqw}:where(*[container~=md-3]){--cq-step: 1.2cqw}:where(*[container~=md-4]){--cq-step: 1.6cqw}:where(*[container~=md-5]){--cq-step: 2cqw}:where(*[container~=md-6]){--cq-step: 2.4cqw}:where(*[container~=md-7]){--cq-step: 2.8cqw}:where(*[container~=md-8]){--cq-step: 3.2cqw}:where(*[container~=md-9]){--cq-step: 3.6cqw}:where(*[container~=md-10]){--cq-step: 4cqw}:where(*[container~=md-11]){--cq-step: 4.4cqw}:where(*[container~=md-12]){--cq-step: 4.8cqw}:where(*[container~=md-13]){--cq-step: 5.2cqw}:where(*[container~=md-14]){--cq-step: 5.6cqw}:where(*[container~=md-15]){--cq-step: 6cqw}:where(*[container~=md-16]){--cq-step: 6.4cqw}:where(*[container~=md-17]){--cq-step: 6.8cqw}:where(*[container~=md-18]){--cq-step: 7.2cqw}:where(*[container~=md-19]){--cq-step: 7.6cqw}:where(*[container~=md-20]){--cq-step: 8cqw}:where(*[container~=md-static]){container-type:inline-size;container-name:container query-ctx;--cq-step: var(--cq-fixed)}}@media(min-width: 1024px){:where(*[container~=lp-query]){container-type:inline-size;container-name:container query-ctx;--cq-step: 0.4cqw}:where(*[container~=lp-query][container~=block]){container-type:size}:where(*[container~=lp-1]){--cq-step: 0.4cqw}:where(*[container~=lp-2]){--cq-step: 0.8cqw}:where(*[container~=lp-3]){--cq-step: 1.2cqw}:where(*[container~=lp-4]){--cq-step: 1.6cqw}:where(*[container~=lp-5]){--cq-step: 2cqw}:where(*[container~=lp-6]){--cq-step: 2.4cqw}:where(*[container~=lp-7]){--cq-step: 2.8cqw}:where(*[container~=lp-8]){--cq-step: 3.2cqw}:where(*[container~=lp-9]){--cq-step: 3.6cqw}:where(*[container~=lp-10]){--cq-step: 4cqw}:where(*[container~=lp-11]){--cq-step: 4.4cqw}:where(*[container~=lp-12]){--cq-step: 4.8cqw}:where(*[container~=lp-13]){--cq-step: 5.2cqw}:where(*[container~=lp-14]){--cq-step: 5.6cqw}:where(*[container~=lp-15]){--cq-step: 6cqw}:where(*[container~=lp-16]){--cq-step: 6.4cqw}:where(*[container~=lp-17]){--cq-step: 6.8cqw}:where(*[container~=lp-18]){--cq-step: 7.2cqw}:where(*[container~=lp-19]){--cq-step: 7.6cqw}:where(*[container~=lp-20]){--cq-step: 8cqw}:where(*[container~=lp-static]){container-type:inline-size;container-name:container query-ctx;--cq-step: var(--cq-fixed)}}@media(min-width: 1280px){:where(*[container~=lg-query]){container-type:inline-size;container-name:container query-ctx;--cq-step: 0.4cqw}:where(*[container~=lg-query][container~=block]){container-type:size}:where(*[container~=lg-1]){--cq-step: 0.4cqw}:where(*[container~=lg-2]){--cq-step: 0.8cqw}:where(*[container~=lg-3]){--cq-step: 1.2cqw}:where(*[container~=lg-4]){--cq-step: 1.6cqw}:where(*[container~=lg-5]){--cq-step: 2cqw}:where(*[container~=lg-6]){--cq-step: 2.4cqw}:where(*[container~=lg-7]){--cq-step: 2.8cqw}:where(*[container~=lg-8]){--cq-step: 3.2cqw}:where(*[container~=lg-9]){--cq-step: 3.6cqw}:where(*[container~=lg-10]){--cq-step: 4cqw}:where(*[container~=lg-11]){--cq-step: 4.4cqw}:where(*[container~=lg-12]){--cq-step: 4.8cqw}:where(*[container~=lg-13]){--cq-step: 5.2cqw}:where(*[container~=lg-14]){--cq-step: 5.6cqw}:where(*[container~=lg-15]){--cq-step: 6cqw}:where(*[container~=lg-16]){--cq-step: 6.4cqw}:where(*[container~=lg-17]){--cq-step: 6.8cqw}:where(*[container~=lg-18]){--cq-step: 7.2cqw}:where(*[container~=lg-19]){--cq-step: 7.6cqw}:where(*[container~=lg-20]){--cq-step: 8cqw}:where(*[container~=lg-static]){container-type:inline-size;container-name:container query-ctx;--cq-step: var(--cq-fixed)}}@media(min-width: 1536px){:where(*[container~=dt-query]){container-type:inline-size;container-name:container query-ctx;--cq-step: 0.4cqw}:where(*[container~=dt-query][container~=block]){container-type:size}:where(*[container~=dt-1]){--cq-step: 0.4cqw}:where(*[container~=dt-2]){--cq-step: 0.8cqw}:where(*[container~=dt-3]){--cq-step: 1.2cqw}:where(*[container~=dt-4]){--cq-step: 1.6cqw}:where(*[container~=dt-5]){--cq-step: 2cqw}:where(*[container~=dt-6]){--cq-step: 2.4cqw}:where(*[container~=dt-7]){--cq-step: 2.8cqw}:where(*[container~=dt-8]){--cq-step: 3.2cqw}:where(*[container~=dt-9]){--cq-step: 3.6cqw}:where(*[container~=dt-10]){--cq-step: 4cqw}:where(*[container~=dt-11]){--cq-step: 4.4cqw}:where(*[container~=dt-12]){--cq-step: 4.8cqw}:where(*[container~=dt-13]){--cq-step: 5.2cqw}:where(*[container~=dt-14]){--cq-step: 5.6cqw}:where(*[container~=dt-15]){--cq-step: 6cqw}:where(*[container~=dt-16]){--cq-step: 6.4cqw}:where(*[container~=dt-17]){--cq-step: 6.8cqw}:where(*[container~=dt-18]){--cq-step: 7.2cqw}:where(*[container~=dt-19]){--cq-step: 7.6cqw}:where(*[container~=dt-20]){--cq-step: 8cqw}:where(*[container~=dt-static]){container-type:inline-size;container-name:container query-ctx;--cq-step: var(--cq-fixed)}}@media(min-width: 1920px){:where(*[container~=xl-query]){container-type:inline-size;container-name:container query-ctx;--cq-step: 0.4cqw}:where(*[container~=xl-query][container~=block]){container-type:size}:where(*[container~=xl-1]){--cq-step: 0.4cqw}:where(*[container~=xl-2]){--cq-step: 0.8cqw}:where(*[container~=xl-3]){--cq-step: 1.2cqw}:where(*[container~=xl-4]){--cq-step: 1.6cqw}:where(*[container~=xl-5]){--cq-step: 2cqw}:where(*[container~=xl-6]){--cq-step: 2.4cqw}:where(*[container~=xl-7]){--cq-step: 2.8cqw}:where(*[container~=xl-8]){--cq-step: 3.2cqw}:where(*[container~=xl-9]){--cq-step: 3.6cqw}:where(*[container~=xl-10]){--cq-step: 4cqw}:where(*[container~=xl-11]){--cq-step: 4.4cqw}:where(*[container~=xl-12]){--cq-step: 4.8cqw}:where(*[container~=xl-13]){--cq-step: 5.2cqw}:where(*[container~=xl-14]){--cq-step: 5.6cqw}:where(*[container~=xl-15]){--cq-step: 6cqw}:where(*[container~=xl-16]){--cq-step: 6.4cqw}:where(*[container~=xl-17]){--cq-step: 6.8cqw}:where(*[container~=xl-18]){--cq-step: 7.2cqw}:where(*[container~=xl-19]){--cq-step: 7.6cqw}:where(*[container~=xl-20]){--cq-step: 8cqw}:where(*[container~=xl-static]){container-type:inline-size;container-name:container query-ctx;--cq-step: var(--cq-fixed)}}@container query-ctx (width >= 0px){*{--space-step: var(--cq-step)}}
|
package/package.json
ADDED
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@cat-of-summer/st-style",
|
|
3
|
+
"version": "1.0.3",
|
|
4
|
+
"description": "Attribute-driven CSS utility framework (SCSS source, compiled CSS).",
|
|
5
|
+
"type": "module",
|
|
6
|
+
"license": "MIT",
|
|
7
|
+
"repository": {
|
|
8
|
+
"type": "git",
|
|
9
|
+
"url": "git+https://github.com/cat-of-summer/ST-style---framework.git"
|
|
10
|
+
},
|
|
11
|
+
"files": [
|
|
12
|
+
"src",
|
|
13
|
+
"dist"
|
|
14
|
+
],
|
|
15
|
+
"main": "dist/main.min.css",
|
|
16
|
+
"style": "dist/main.min.css",
|
|
17
|
+
"sass": "src/main/index.scss",
|
|
18
|
+
"exports": {
|
|
19
|
+
"./main.css": "./dist/main.min.css",
|
|
20
|
+
"./effects.css": "./dist/effects.min.css",
|
|
21
|
+
"./scss/*": "./src/*"
|
|
22
|
+
},
|
|
23
|
+
"scripts": {
|
|
24
|
+
"build": "node scripts/build.mjs",
|
|
25
|
+
"watch": "node scripts/build.mjs --watch",
|
|
26
|
+
"prepare": "node scripts/build.mjs",
|
|
27
|
+
"prepack": "node scripts/build.mjs"
|
|
28
|
+
},
|
|
29
|
+
"publishConfig": {
|
|
30
|
+
"registry": "https://registry.npmjs.org",
|
|
31
|
+
"access": "public"
|
|
32
|
+
},
|
|
33
|
+
"devDependencies": {
|
|
34
|
+
"sass": "^1.77.0"
|
|
35
|
+
}
|
|
36
|
+
}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
@keyframes blink {
|
|
2
|
+
50% { opacity: 0 }
|
|
3
|
+
}
|
|
4
|
+
|
|
5
|
+
*[blink] {
|
|
6
|
+
--transition-duration: 1s;
|
|
7
|
+
--blink-duration: var(--transition-duration);
|
|
8
|
+
--blink-iteration-count: var(--iteration-count);
|
|
9
|
+
--blink-name: blink;
|
|
10
|
+
|
|
11
|
+
animation: var(--blink-name) var(--blink-duration) step-end var(--blink-iteration-count)
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
*[blink~="infinite"] { --blink-iteration-count: infinite }
|
|
15
|
+
*[blink~="hover"], *[blink~="active"], *[blink~="focus"] { --blink-name: none }
|
|
16
|
+
*[blink~="hover"]:hover, *[blink~="active"]:active, *[blink~="focus"]:focus { --blink-name: blink }
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
@keyframes bounce {
|
|
2
|
+
0%, 100% {
|
|
3
|
+
transform: translateY(0);
|
|
4
|
+
animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
|
|
5
|
+
}
|
|
6
|
+
50% {
|
|
7
|
+
transform: translateY(calc(-1 * var(--bounce-height)));
|
|
8
|
+
animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
|
|
9
|
+
}
|
|
10
|
+
}
|
|
11
|
+
|
|
12
|
+
*[bounce] {
|
|
13
|
+
--transition-duration: var(--td-medium);
|
|
14
|
+
--bounce-duration: var(--transition-duration);
|
|
15
|
+
--bounce-height: 30px;
|
|
16
|
+
--bounce-iteration-count: var(--iteration-count);
|
|
17
|
+
--bounce-name: bounce;
|
|
18
|
+
|
|
19
|
+
animation: var(--bounce-name) var(--bounce-duration) ease-in-out var(--bounce-iteration-count)
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
*[bounce~="infinite"] { --bounce-iteration-count: infinite }
|
|
23
|
+
*[bounce~="hover"], *[bounce~="active"], *[bounce~="focus"] { --bounce-name: none }
|
|
24
|
+
*[bounce~="hover"]:hover, *[bounce~="active"]:active, *[bounce~="focus"]:focus { --bounce-name: bounce }
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
// Build-time configuration for the `effects` bundle.
|
|
2
|
+
//
|
|
3
|
+
// Override before loading the bundle:
|
|
4
|
+
// @use '@cat-of-summer/st-style/scss/effects/config' with ($durations: (...));
|
|
5
|
+
// @use '@cat-of-summer/st-style/scss/effects';
|
|
6
|
+
|
|
7
|
+
// ── [td] transition durations ───────────────────────────────────────────────
|
|
8
|
+
// One associative map of every duration token. Each key is emitted as
|
|
9
|
+
// --td-<key> in :root (overridable at runtime) and exposed as the [td="<key>"]
|
|
10
|
+
// utility. Add/rename keys freely.
|
|
11
|
+
$durations: (
|
|
12
|
+
rapid: 0.1s,
|
|
13
|
+
fast: 0.325s,
|
|
14
|
+
medium: 0.55s,
|
|
15
|
+
slow: 0.775s,
|
|
16
|
+
'1s': 1s,
|
|
17
|
+
'2s': 2s,
|
|
18
|
+
'3s': 3s,
|
|
19
|
+
'5s': 5s,
|
|
20
|
+
'10s': 10s,
|
|
21
|
+
'15s': 15s,
|
|
22
|
+
) !default;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
@use 'config' as cfg;
|
|
2
|
+
|
|
3
|
+
// [td] — transition-duration override, [infinite] — iteration count.
|
|
4
|
+
*[td], *[td]::before, *[td]::after { transition-duration: var(--transition-duration) !important }
|
|
5
|
+
@each $name, $val in cfg.$durations {
|
|
6
|
+
*[td="#{$name}"] { --transition-duration: var(--td-#{$name}); }
|
|
7
|
+
}
|
|
8
|
+
*[td="none"] { --transition-duration: none }
|
|
9
|
+
|
|
10
|
+
*[infinite] { --iteration-count: infinite; }
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
@keyframes floatY {
|
|
2
|
+
0%, 100% { transform: translateY(0) }
|
|
3
|
+
25% { transform: translateY(var(--float-range)) }
|
|
4
|
+
75% { transform: translateY(calc(-1 * var(--float-range))) }
|
|
5
|
+
}
|
|
6
|
+
|
|
7
|
+
@keyframes floatX {
|
|
8
|
+
0%, 100% { transform: translateX(0) }
|
|
9
|
+
25% { transform: translateX(var(--float-range)) }
|
|
10
|
+
75% { transform: translateX(calc(-1 * var(--float-range))) }
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
*[float] {
|
|
14
|
+
--transition-duration: var(--td-slow);
|
|
15
|
+
--float-duration: var(--transition-duration);
|
|
16
|
+
--float-iteration-count: var(--iteration-count);
|
|
17
|
+
--float-range: 6px;
|
|
18
|
+
--float-name: floatY;
|
|
19
|
+
|
|
20
|
+
animation: var(--float-name) var(--float-duration) ease-in-out var(--float-iteration-count);
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
*[float~="horizontal"] { --float-name: floatX }
|
|
24
|
+
*[float~="infinite"] { --float-iteration-count: infinite; }
|
|
25
|
+
*[float~="hover"], *[float~="active"], *[float~="focus"] { --float-name: none }
|
|
26
|
+
*[float~="hover"]:hover, *[float~="active"]:active, *[float~="focus"]:focus { --float-name: floatY }
|
|
27
|
+
*[float~="horizontal"][float~="hover"]:hover, *[float~="horizontal"][float~="active"]:active, *[float~="horizontal"][float~="focus"]:focus { --float-name: floatX }
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
*[glow] {
|
|
2
|
+
--transition-duration: var(--td-medium);
|
|
3
|
+
--glow-duration: var(--transition-duration);
|
|
4
|
+
--glow-color: rgba(0, 150, 255, 0.7);
|
|
5
|
+
--glow-size: 16px;
|
|
6
|
+
|
|
7
|
+
transition-duration: var(--glow-duration);
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
*[glow~="hover"]:hover { box-shadow: 0 0 var(--glow-size) var(--glow-color) }
|
|
11
|
+
*[glow~="active"]:active { box-shadow: 0 0 var(--glow-size) var(--glow-color) }
|
|
12
|
+
*[glow~="focus"]:focus { box-shadow: 0 0 var(--glow-size) var(--glow-color) }
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
*[grayscale] {
|
|
2
|
+
--transition-duration: var(--td-medium);
|
|
3
|
+
--grayscale-duration: var(--transition-duration);
|
|
4
|
+
--grayscale-amount: 100%;
|
|
5
|
+
|
|
6
|
+
filter: grayscale(var(--grayscale-amount));
|
|
7
|
+
transition-duration: var(--grayscale-duration);
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
*[grayscale]:hover, *[grayscale]:active, *[grayscale]:focus {
|
|
11
|
+
filter: grayscale(0)
|
|
12
|
+
}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
@keyframes heartbeat {
|
|
2
|
+
0% { transform: scale(1) }
|
|
3
|
+
30% { transform: scale(var(--heartbeat-first-scale)) }
|
|
4
|
+
60% { transform: scale(var(--heartbeat-second-scale)) }
|
|
5
|
+
100% { transform: scale(1) }
|
|
6
|
+
}
|
|
7
|
+
|
|
8
|
+
*[heartbeat] {
|
|
9
|
+
--transition-duration: var(--td-slow);
|
|
10
|
+
--heartbeat-duration: var(--transition-duration);
|
|
11
|
+
--heartbeat-iteration-count: var(--iteration-count);
|
|
12
|
+
--heartbeat-first-scale: 1.10;
|
|
13
|
+
--heartbeat-second-scale: 0.95;
|
|
14
|
+
--heartbeat-name: heartbeat;
|
|
15
|
+
|
|
16
|
+
animation: var(--heartbeat-name) var(--heartbeat-duration) cubic-bezier(.4, .0, .2, 1) var(--heartbeat-iteration-count)
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
*[heartbeat~="infinite"] { --heartbeat-iteration-count: infinite }
|
|
20
|
+
*[heartbeat~="hover"], *[heartbeat~="active"], *[heartbeat~="focus"] { --heartbeat-name: none }
|
|
21
|
+
*[heartbeat~="hover"]:hover, *[heartbeat~="active"]:active, *[heartbeat~="focus"]:focus { --heartbeat-name: heartbeat }
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
@keyframes jello {
|
|
2
|
+
0% { transform: scale3d(1,1,1); }
|
|
3
|
+
30% { transform: scale3d(1.25,0.85,1); }
|
|
4
|
+
45% { transform: scale3d(0.9,1.05,1); }
|
|
5
|
+
60% { transform: scale3d(1.05,0.95,1); }
|
|
6
|
+
100% { transform: scale3d(1,1,1); }
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
*[jello] {
|
|
10
|
+
--transition-duration: var(--td-medium);
|
|
11
|
+
--jello-duration: var(--transition-duration);
|
|
12
|
+
--jello-iteration-count: var(--iteration-count);
|
|
13
|
+
--jello-name: jello;
|
|
14
|
+
|
|
15
|
+
animation: var(--jello-name) var(--jello-duration) cubic-bezier(.2,.7,.2,1) var(--jello-iteration-count);
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
*[jello~="infinite"] { --jello-iteration-count: infinite }
|
|
19
|
+
*[jello~="hover"], *[jello~="active"], *[jello~="focus"] { --jello-name: none }
|
|
20
|
+
*[jello~="hover"]:hover, *[jello~="active"]:active, *[jello~="focus"]:focus { --jello-name: jello }
|