1118 lines
30 KiB
CSS
1118 lines
30 KiB
CSS
|
@font-face {
|
||
|
|
font-family: 'RT Alias Medium';
|
||
|
|
font-style: normal;
|
||
|
|
font-weight: 400;
|
||
|
|
src: local(''), url('/fonts/RTAliasMedium-Regular.woff2') format('woff2');
|
||
|
|
font-display: swap;
|
||
|
|
}
|
||
|
|
@font-face {
|
||
|
|
font-family: 'RT Alias Medium';
|
||
|
|
font-style: italic;
|
||
|
|
font-weight: 400;
|
||
|
|
src: local(''), url('/fonts/RTAliasMedium-RegularOblique.woff2') format('woff2');
|
||
|
|
font-display: swap;
|
||
|
|
}
|
||
|
|
@font-face {
|
||
|
|
font-family: 'RT Alias Medium';
|
||
|
|
font-style: normal;
|
||
|
|
font-weight: 700;
|
||
|
|
src: local(''), url('/fonts/RTAliasMedium-Bold.woff2') format('woff2');
|
||
|
|
font-display: swap;
|
||
|
|
}
|
||
|
|
@font-face {
|
||
|
|
font-family: 'RT Alias Medium';
|
||
|
|
font-style: italic;
|
||
|
|
font-weight: 700;
|
||
|
|
src: local(''), url('/fonts/RTAliasMedium-BoldOblique.woff2') format('woff2');
|
||
|
|
font-display: swap;
|
||
|
|
}
|
||
|
|
|
||
|
|
/** sanitize.css makes the line-height 1.5 globally, fix this for headers */
|
||
|
|
h1,h2,h3,h4,h5,h6 {
|
||
|
|
line-height: 1.11;
|
||
|
|
}
|
||
|
|
|
||
|
|
* {
|
||
|
|
box-sizing: border-box;
|
||
|
|
padding: 0;
|
||
|
|
margin: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
:focus:not(:focus-visible) {
|
||
|
|
outline: none
|
||
|
|
}
|
||
|
|
|
||
|
|
:focus-visible {
|
||
|
|
outline: 2px dashed var(--color-blue);
|
||
|
|
}
|
||
|
|
|
||
|
|
:root {
|
||
|
|
--color-tan: #f4efed;
|
||
|
|
--color-tan-rgb: 244, 239, 237;
|
||
|
|
--color-dawn: #f3e9fa;
|
||
|
|
--color-dusk: #514375;
|
||
|
|
--color-midnight: #31274a;
|
||
|
|
--color-midnight-rgb: 49, 39, 74;
|
||
|
|
--color-blue: #205eff;
|
||
|
|
--color-red: #ff5050;
|
||
|
|
--color-yellow: #ffd542;
|
||
|
|
--color-purple: #af43ff;
|
||
|
|
--color-pink: #FDB2B7;
|
||
|
|
|
||
|
|
--gradient-pop-1: linear-gradient(180deg, #205eff 0%, #c238bd 115%);
|
||
|
|
--gradient-pop-2: repeating-linear-gradient(
|
||
|
|
135deg,
|
||
|
|
#ff9776 0em,
|
||
|
|
#769cff 1em,
|
||
|
|
#c238bd 2em,
|
||
|
|
#ff9776 3em
|
||
|
|
);
|
||
|
|
--gradient-pop-3: linear-gradient(180deg, #ffb4b4 0%, #c487f0 100%);
|
||
|
|
--gradient-pop-4: linear-gradient(
|
||
|
|
0deg,
|
||
|
|
#632cca -33%,
|
||
|
|
#62289e 10%,
|
||
|
|
#30216b 50%,
|
||
|
|
#1f1638 100%
|
||
|
|
);
|
||
|
|
--gradient-pop-5: linear-gradient(
|
||
|
|
180deg,
|
||
|
|
#ffd542 0%,
|
||
|
|
#ff5050 25%,
|
||
|
|
#af43ff 100%
|
||
|
|
);
|
||
|
|
--gradient-mood: linear-gradient(
|
||
|
|
180deg,
|
||
|
|
#d8c5ef 0%,
|
||
|
|
rgba(225, 213, 238, 0) 100%
|
||
|
|
);
|
||
|
|
|
||
|
|
--shadow-sm: 0px 19px 53px 0px rgba(var(--color-midnight-rgb), 0.03),
|
||
|
|
0px 10px 28px 0px rgba(var(--color-midnight-rgb), 0.05),
|
||
|
|
0px 6px 16px 0px rgba(var(--color-midnight-rgb), 0.05),
|
||
|
|
0px 3px 9px 0px rgba(var(--color-midnight-rgb), 0.075),
|
||
|
|
0px 1px 4px 0px rgba(var(--color-midnight-rgb), 0.1);
|
||
|
|
--shadow-md: 0px 2px 2px 0px rgba(var(--color-midnight-rgb), 0.04),
|
||
|
|
0px 6px 5px 0px rgba(var(--color-midnight-rgb), 0.06),
|
||
|
|
0px 15px 14px 0px rgba(var(--color-midnight-rgb), 0.08),
|
||
|
|
0px 50px 46px 0px rgba(var(--color-midnight-rgb), 0.12);
|
||
|
|
--shadow-xl: 0px 3px 2px 0px rgba(var(--color-midnight-rgb), 0.02),
|
||
|
|
0px 6px 5px 0px rgba(var(--color-midnight-rgb), 0.03),
|
||
|
|
0px 12px 10px 0px rgba(var(--color-midnight-rgb), 0.04),
|
||
|
|
0px 22px 18px 0px rgba(var(--color-midnight-rgb), 0.04),
|
||
|
|
0px 42px 34px 0px rgba(var(--color-midnight-rgb), 0.05),
|
||
|
|
0px 100px 80px 0px rgba(var(--color-midnight-rgb), 0.07);
|
||
|
|
|
||
|
|
--blur-md: blur(10px);
|
||
|
|
--blur-xl: blur(128px);
|
||
|
|
|
||
|
|
--font-base: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
|
||
|
|
Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
|
||
|
|
--font-body: var(--font-base);
|
||
|
|
--font-display: "RT Alias Medium", var(--font-base);
|
||
|
|
--font-mono: Menlo,Monaco,Lucida Console,Liberation Mono,DejaVu Sans Mono,Bitstream Vera Sans Mono,Courier New,monospace;
|
||
|
|
|
||
|
|
--corner-md: 12px;
|
||
|
|
|
||
|
|
--size-300: clamp(0.7rem, 0.66rem + 0.2vw, 0.8rem);
|
||
|
|
--size-400: clamp(0.88rem, 0.83rem + 0.24vw, 1rem);
|
||
|
|
--size-500: clamp(1.09rem, 1rem + 0.47vw, 1.33rem);
|
||
|
|
--size-600: clamp(1.37rem, 1.21rem + 0.8vw, 1.78rem);
|
||
|
|
--size-700: clamp(1.71rem, 1.45rem + 1.29vw, 2.37rem);
|
||
|
|
--size-800: clamp(2.14rem, 1.74rem + 1.99vw, 3.16rem);
|
||
|
|
--size-900: clamp(2.67rem, 2.07rem + 3vw, 4.21rem);
|
||
|
|
--size-1000: clamp(3.34rem, 2.45rem + 4.43vw, 5.61rem);
|
||
|
|
|
||
|
|
/* @property fallbacks */
|
||
|
|
--border-radius: 4;
|
||
|
|
--pixel-size: 4;
|
||
|
|
--link-color-stop-a: #205eff;
|
||
|
|
--link-color-stop-b: #c238bd;
|
||
|
|
|
||
|
|
background: var(--color-tan);
|
||
|
|
}
|
||
|
|
|
||
|
|
body {
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
}
|
||
|
|
|
||
|
|
.transition #root {
|
||
|
|
opacity: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
@property --border-radius {
|
||
|
|
syntax: '<integer>';
|
||
|
|
inherits: true;
|
||
|
|
initial-value: 4;
|
||
|
|
}
|
||
|
|
@property --pixel-size {
|
||
|
|
syntax: '<integer>';
|
||
|
|
inherits: true;
|
||
|
|
initial-value: 4;
|
||
|
|
}
|
||
|
|
@property --link-color-stop-a {
|
||
|
|
syntax: '<color>';
|
||
|
|
inherits: false;
|
||
|
|
initial-value: #205eff;
|
||
|
|
}
|
||
|
|
@property --link-color-stop-b {
|
||
|
|
syntax: '<color>';
|
||
|
|
inherits: false;
|
||
|
|
initial-value: #c238bd;
|
||
|
|
}
|
||
|
|
|
||
|
|
a {
|
||
|
|
color: var(--color-blue);
|
||
|
|
text-decoration: none;
|
||
|
|
}
|
||
|
|
a:visited {
|
||
|
|
color: #7D4796;
|
||
|
|
}
|
||
|
|
a:is(:hover, :focus) {
|
||
|
|
text-decoration: underline;
|
||
|
|
}
|
||
|
|
a:active {
|
||
|
|
color: var(--color-purple);
|
||
|
|
}
|
||
|
|
|
||
|
|
.logo a {
|
||
|
|
color: var(--color-midnight);
|
||
|
|
}
|
||
|
|
|
||
|
|
small {
|
||
|
|
font-size: 0.75em;
|
||
|
|
}
|
||
|
|
|
||
|
|
.pixel {
|
||
|
|
--border-radius: 8;
|
||
|
|
--pixel-size: 4;
|
||
|
|
--background: var(--gradient-pop-1);
|
||
|
|
position: relative;
|
||
|
|
border-radius: calc(var(--border-radius) * 1px);
|
||
|
|
}
|
||
|
|
.pixel::before {
|
||
|
|
content: '';
|
||
|
|
position: absolute;
|
||
|
|
top: calc(var(--pixel-size) * 1px);
|
||
|
|
right: 0;
|
||
|
|
bottom: calc(var(--pixel-size) * 1px);
|
||
|
|
left: 0;
|
||
|
|
background: var(--background);
|
||
|
|
z-index: -1;
|
||
|
|
}
|
||
|
|
.pixel::after {
|
||
|
|
content: '';
|
||
|
|
position: absolute;
|
||
|
|
top: 0;
|
||
|
|
right: calc(var(--pixel-size) * 1px);
|
||
|
|
bottom: 0;
|
||
|
|
left: calc(var(--pixel-size) * 1px);
|
||
|
|
background: var(--background);
|
||
|
|
z-index: -1;
|
||
|
|
}
|
||
|
|
.pixel.variant-outline {
|
||
|
|
background: rgba(255, 255, 255, 0);
|
||
|
|
border-radius: 0;
|
||
|
|
}
|
||
|
|
.pixel.variant-outline::before {
|
||
|
|
background: rgba(255, 255, 255, 0);
|
||
|
|
border: calc(var(--pixel-size) * 1px) solid var(--background);
|
||
|
|
border-top: 0;
|
||
|
|
border-bottom: 0;
|
||
|
|
}
|
||
|
|
.pixel.variant-outline::after {
|
||
|
|
background: rgba(255, 255, 255, 0);
|
||
|
|
border: calc(var(--pixel-size) * 1px) solid var(--background);
|
||
|
|
border-right: 0;
|
||
|
|
border-left: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
@supports (background: paint(pixel)) {
|
||
|
|
.js .pixel {
|
||
|
|
background: none !important;
|
||
|
|
}
|
||
|
|
.js .pixel::before {
|
||
|
|
content: '';
|
||
|
|
position: absolute;
|
||
|
|
top: 0;
|
||
|
|
right: 0;
|
||
|
|
bottom: 0;
|
||
|
|
left: 0;
|
||
|
|
display: block;
|
||
|
|
z-index: -1;
|
||
|
|
overflow: hidden;
|
||
|
|
border-radius: 0;
|
||
|
|
background: var(--background);
|
||
|
|
-webkit-mask-image: paint(pixel);
|
||
|
|
mask-image: paint(pixel);
|
||
|
|
}
|
||
|
|
.js .pixel::after {
|
||
|
|
content: none;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
html {
|
||
|
|
font-family: var(--font-body);
|
||
|
|
color: var(--color-midnight);
|
||
|
|
min-height: 100vh;
|
||
|
|
overflow-y: auto;
|
||
|
|
overflow-x: hidden;
|
||
|
|
}
|
||
|
|
|
||
|
|
::selection {
|
||
|
|
background: var(--color-blue);
|
||
|
|
color: white;
|
||
|
|
}
|
||
|
|
|
||
|
|
.text-gradient::selection {
|
||
|
|
--fill: white;
|
||
|
|
color: var(--fill);
|
||
|
|
-webkit-background-clip: initial;
|
||
|
|
-webkit-text-fill-color: initial;
|
||
|
|
}
|
||
|
|
|
||
|
|
.text-gradient {
|
||
|
|
background: var(--fill, var(--gradient-pop-1));
|
||
|
|
-webkit-background-clip: text;
|
||
|
|
-webkit-text-fill-color: transparent;
|
||
|
|
}
|
||
|
|
|
||
|
|
.visually-hidden {
|
||
|
|
clip: rect(0 0 0 0);
|
||
|
|
clip-path: inset(50%);
|
||
|
|
height: 1px;
|
||
|
|
overflow: hidden;
|
||
|
|
position: absolute;
|
||
|
|
white-space: nowrap;
|
||
|
|
width: 1px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.container {
|
||
|
|
max-width: 40rem;
|
||
|
|
padding-left: 0.5em;
|
||
|
|
padding-right: 0.5em;
|
||
|
|
margin-left: auto;
|
||
|
|
margin-right: auto;
|
||
|
|
}
|
||
|
|
|
||
|
|
@media (min-width: 40rem) {
|
||
|
|
.container {
|
||
|
|
padding-left: 1em;
|
||
|
|
padding-right: 1em;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
@media (min-width: 52rem) {
|
||
|
|
.container {
|
||
|
|
max-width: 50rem;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
@media (min-width: 64rem) {
|
||
|
|
.container {
|
||
|
|
max-width: 62rem;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
@media (min-width: 82rem) {
|
||
|
|
.container {
|
||
|
|
max-width: 80rem;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
@media (min-width: 92rem) {
|
||
|
|
.container {
|
||
|
|
max-width: 90rem;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.head-sm {
|
||
|
|
font-family: var(--font-display);
|
||
|
|
font-size: var(--size-600);
|
||
|
|
letter-spacing: -0.5px;
|
||
|
|
line-height: 1.2;
|
||
|
|
}
|
||
|
|
|
||
|
|
.head-md {
|
||
|
|
font-family: var(--font-display);
|
||
|
|
font-size: var(--size-700);
|
||
|
|
letter-spacing: -0.5px;
|
||
|
|
line-height: 1.2;
|
||
|
|
}
|
||
|
|
|
||
|
|
p, .body-md {
|
||
|
|
font-family: var(--font-body);
|
||
|
|
font-size: var(--size-500);
|
||
|
|
line-height: 1.3;
|
||
|
|
}
|
||
|
|
|
||
|
|
.elevation-xl {
|
||
|
|
box-shadow: var(--shadow-xl);
|
||
|
|
}
|
||
|
|
|
||
|
|
.elevation-md {
|
||
|
|
box-shadow: var(--shadow-md);
|
||
|
|
}
|
||
|
|
|
||
|
|
.container {
|
||
|
|
width: 100%;
|
||
|
|
}
|
||
|
|
|
||
|
|
#article :is(h1, h2, h3, h4, h5, h6) {
|
||
|
|
font-family: var(--font-display);
|
||
|
|
line-height: 1.1;
|
||
|
|
margin-bottom: 1.25rem;
|
||
|
|
color: var(--color-dusk);
|
||
|
|
}
|
||
|
|
#article hr {
|
||
|
|
border: 0;
|
||
|
|
border-top: 1px solid var(--color-dawn);
|
||
|
|
margin-left: -2rem;
|
||
|
|
margin-right: -2rem;
|
||
|
|
margin-top: 1rem;
|
||
|
|
margin-bottom: 2rem;
|
||
|
|
}
|
||
|
|
#article h1 {
|
||
|
|
--fill: var(--gradient-pop-1);
|
||
|
|
font-size: 3rem;
|
||
|
|
font-size: var(--size-800);
|
||
|
|
|
||
|
|
}
|
||
|
|
#article h2 {
|
||
|
|
font-size: 2rem;
|
||
|
|
font-size: var(--size-600);
|
||
|
|
margin-top: 2em;
|
||
|
|
margin-bottom: -0.25em;
|
||
|
|
}
|
||
|
|
|
||
|
|
#article code {
|
||
|
|
font-family: var(--font-mono);
|
||
|
|
font-weight: 400;
|
||
|
|
white-space: pre-wrap;
|
||
|
|
word-break: break-word;
|
||
|
|
}
|
||
|
|
|
||
|
|
#article code:not([class]) {
|
||
|
|
font-size: 0.85em;
|
||
|
|
color: var(--color-purple);
|
||
|
|
}
|
||
|
|
|
||
|
|
#article code:not([class])::before {
|
||
|
|
content: '\`';
|
||
|
|
}
|
||
|
|
#article code:not([class])::after {
|
||
|
|
content: '\`';
|
||
|
|
}
|
||
|
|
|
||
|
|
.astro-code > code::before,
|
||
|
|
.astro-code > code::after {
|
||
|
|
content: none !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
#article img {
|
||
|
|
max-width: 100%;
|
||
|
|
}
|
||
|
|
|
||
|
|
#article :is(h2, h3, h4, h5, h6) a {
|
||
|
|
font: inherit;
|
||
|
|
color: inherit;
|
||
|
|
text-decoration: none !important;
|
||
|
|
display: flex;
|
||
|
|
}
|
||
|
|
|
||
|
|
#article :is(h2, h3, h4, h5, h6) a::before {
|
||
|
|
content: "#";
|
||
|
|
width: 1em;
|
||
|
|
margin-left: 0.25em;
|
||
|
|
color: inherit;
|
||
|
|
opacity: 0;
|
||
|
|
transition: opacity 200ms cubic-bezier(0.23, 1, 0.320, 1);
|
||
|
|
order: 999;
|
||
|
|
}
|
||
|
|
|
||
|
|
@media (min-width: 50rem) {
|
||
|
|
#content :is(h2, h3, h4, h5, h6) a::before {
|
||
|
|
order: initial;
|
||
|
|
margin-left: -1em;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
#article :is(h2, h3, h4, h5, h6) a:is(:active, :visited, :hover, :focus) {
|
||
|
|
color: var(--color-dusk);
|
||
|
|
}
|
||
|
|
|
||
|
|
#article :is(h2, h3, h4, h5, h6) a:active::before,
|
||
|
|
#article :is(h2, h3, h4, h5, h6) a:hover::before,
|
||
|
|
#article :is(h2, h3, h4, h5, h6) a:focus::before {
|
||
|
|
opacity: 0.6 !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
#article :is(strong, b) {
|
||
|
|
font-family: inherit;
|
||
|
|
font-weight: 600;
|
||
|
|
}
|
||
|
|
|
||
|
|
#article :is(em, i) {
|
||
|
|
font-weight: 400;
|
||
|
|
font-style: normal;
|
||
|
|
}
|
||
|
|
|
||
|
|
#article :is(ul:not([role="list"]), ol:not([role="list"])) {
|
||
|
|
padding-left: 1.5em;
|
||
|
|
}
|
||
|
|
|
||
|
|
#article :where(ul:not([role="list"])) {
|
||
|
|
list-style-type: square;
|
||
|
|
}
|
||
|
|
|
||
|
|
#article :where(ul:not([role="list"]) > li + li) {
|
||
|
|
margin-top: 0.25em;
|
||
|
|
}
|
||
|
|
|
||
|
|
#article ::marker {
|
||
|
|
color: rgba(var(--color-midnight-rgb), 0.5);
|
||
|
|
}
|
||
|
|
|
||
|
|
#article pre > code:not([class*='language']) {
|
||
|
|
background-color: transparent;
|
||
|
|
padding: 0;
|
||
|
|
margin: 0;
|
||
|
|
border-radius: 0;
|
||
|
|
color: inherit;
|
||
|
|
}
|
||
|
|
|
||
|
|
#article pre > code {
|
||
|
|
font-size: 1em;
|
||
|
|
}
|
||
|
|
|
||
|
|
#article pre {
|
||
|
|
position: relative;
|
||
|
|
--padding-block: 1rem;
|
||
|
|
--padding-inline: 2rem;
|
||
|
|
padding: var(--padding-block) var(--padding-inline);
|
||
|
|
padding-right: calc(var(--padding-inline) * 2);
|
||
|
|
margin-left: calc(var(--padding-inline) * -1);
|
||
|
|
margin-right: calc(var(--padding-inline) * -1);
|
||
|
|
font-family: var(--font-mono);
|
||
|
|
|
||
|
|
line-height: 1.5;
|
||
|
|
font-size: 0.85em;
|
||
|
|
overflow-y: hidden;
|
||
|
|
overflow-x: auto;
|
||
|
|
}
|
||
|
|
|
||
|
|
#article pre {
|
||
|
|
background: linear-gradient(to bottom, var(--color-midnight), #1F1638);
|
||
|
|
color: white;
|
||
|
|
}
|
||
|
|
|
||
|
|
#article table {
|
||
|
|
width: 100%;
|
||
|
|
padding: var(--padding-block) 0;
|
||
|
|
margin: 0;
|
||
|
|
border-collapse: collapse;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Zebra striping */
|
||
|
|
#article tr:nth-of-type(odd) {
|
||
|
|
background: var(--theme-bg-hover);
|
||
|
|
}
|
||
|
|
#article th {
|
||
|
|
background: var(--color-black);
|
||
|
|
color: var(--theme-color);
|
||
|
|
font-weight: bold;
|
||
|
|
}
|
||
|
|
#article td,
|
||
|
|
#article th {
|
||
|
|
padding: 6px;
|
||
|
|
text-align: left;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Code */
|
||
|
|
|
||
|
|
.language-css > code,
|
||
|
|
.language-sass > code,
|
||
|
|
.language-scss > code {
|
||
|
|
color: #fd9170;
|
||
|
|
}
|
||
|
|
|
||
|
|
.language-diff .token.prefix.deleted,
|
||
|
|
.language-diff .token.prefix.inserted {
|
||
|
|
user-select: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
[class*='language-'] .namespace {
|
||
|
|
opacity: 0.7;
|
||
|
|
}
|
||
|
|
|
||
|
|
.token.plain-text,
|
||
|
|
[class*='language-bash'] span.token,
|
||
|
|
[class*='language-shell'] span.token {
|
||
|
|
color: hsla(var(--color-gray-90), 1);
|
||
|
|
}
|
||
|
|
|
||
|
|
[class*='language-bash'] span.token,
|
||
|
|
[class*='language-shell'] span.token {
|
||
|
|
font-style: bold;
|
||
|
|
}
|
||
|
|
|
||
|
|
.token.prolog,
|
||
|
|
.token.comment,
|
||
|
|
[class*='language-bash'] span.token.comment,
|
||
|
|
[class*='language-shell'] span.token.comment {
|
||
|
|
color: rgba(255, 255, 255, 0.67);
|
||
|
|
}
|
||
|
|
|
||
|
|
.token.front-matter-block {
|
||
|
|
color: white;
|
||
|
|
opacity: 0.8;
|
||
|
|
}
|
||
|
|
|
||
|
|
.token.selector,
|
||
|
|
.token.tag,
|
||
|
|
.token.unit,
|
||
|
|
.token.url,
|
||
|
|
.token.variable,
|
||
|
|
.token.entity,
|
||
|
|
.token.deleted {
|
||
|
|
color: #fa5e5b;
|
||
|
|
}
|
||
|
|
|
||
|
|
.token.boolean,
|
||
|
|
.token.constant,
|
||
|
|
.token.doctype,
|
||
|
|
.token.number,
|
||
|
|
.token.regex,
|
||
|
|
.token.builtin,
|
||
|
|
.token.class,
|
||
|
|
.token.hexcode,
|
||
|
|
.token.class-name,
|
||
|
|
.token.attr-name {
|
||
|
|
color: hsla(var(--color-yellow), 1);
|
||
|
|
}
|
||
|
|
|
||
|
|
.token.atrule,
|
||
|
|
.token.attribute,
|
||
|
|
.token.attr-value .token.punctuation,
|
||
|
|
.token.attr-value,
|
||
|
|
.token.pseudo-class,
|
||
|
|
.token.pseudo-element,
|
||
|
|
.token.string {
|
||
|
|
color: hsla(var(--color-green), 1);
|
||
|
|
}
|
||
|
|
|
||
|
|
.token.symbol,
|
||
|
|
.token.function,
|
||
|
|
.token.id,
|
||
|
|
.token.important {
|
||
|
|
color: hsla(var(--color-blue), 1);
|
||
|
|
}
|
||
|
|
|
||
|
|
.token.important,
|
||
|
|
.token.id {
|
||
|
|
font-weight: bold;
|
||
|
|
}
|
||
|
|
|
||
|
|
.token.cdata,
|
||
|
|
.token.char,
|
||
|
|
.token.property {
|
||
|
|
color: #23b1af;
|
||
|
|
}
|
||
|
|
|
||
|
|
.token.inserted {
|
||
|
|
color: hsla(var(--color-green), 1);
|
||
|
|
}
|
||
|
|
|
||
|
|
.token.keyword {
|
||
|
|
color: #ff657c;
|
||
|
|
font-style: italic;
|
||
|
|
}
|
||
|
|
|
||
|
|
.token.operator {
|
||
|
|
color: hsla(var(--color-gray-70), 1);
|
||
|
|
}
|
||
|
|
|
||
|
|
.token.attr-value .token.attr-equals,
|
||
|
|
.token.punctuation {
|
||
|
|
color: hsla(var(--color-gray-80), 1);
|
||
|
|
}
|
||
|
|
|
||
|
|
#nav {
|
||
|
|
--offset-height: calc(var(--offset) * 1rem);
|
||
|
|
width: 100%;
|
||
|
|
position: sticky;
|
||
|
|
top: calc((var(--offset-height) * -1) - 1px);
|
||
|
|
margin-top: -2rem;
|
||
|
|
padding: 0.5rem 0;
|
||
|
|
background: linear-gradient(0deg, rgba(var(--color-tan-rgb), 0.7), rgba(var(--color-tan-rgb), 1));
|
||
|
|
-webkit-backdrop-filter: blur(10px);
|
||
|
|
backdrop-filter: blur(10px);
|
||
|
|
z-index: 2;
|
||
|
|
}
|
||
|
|
#nav.margin-bottom {
|
||
|
|
margin-bottom: -4.5rem;
|
||
|
|
}
|
||
|
|
#nav.invert {
|
||
|
|
background: transparent;
|
||
|
|
color: white;
|
||
|
|
-webkit-backdrop-filter: none;
|
||
|
|
backdrop-filter: none;
|
||
|
|
}
|
||
|
|
#nav.invert a {
|
||
|
|
color: white;
|
||
|
|
}
|
||
|
|
|
||
|
|
#nav::before {
|
||
|
|
content: '';
|
||
|
|
display: block;
|
||
|
|
width: 100%;
|
||
|
|
height: var(--offset-height);
|
||
|
|
z-index: -2;
|
||
|
|
}
|
||
|
|
#nav.invert::before {
|
||
|
|
background: #1f1638;
|
||
|
|
margin-top: -0.5rem;
|
||
|
|
}
|
||
|
|
|
||
|
|
#nav::after {
|
||
|
|
position: absolute;
|
||
|
|
content: '';
|
||
|
|
top: var(--offset-height);
|
||
|
|
right: 0;
|
||
|
|
bottom: 0;
|
||
|
|
left: 0;
|
||
|
|
display: flex;
|
||
|
|
box-shadow: var(--shadow-md);
|
||
|
|
opacity: 0;
|
||
|
|
transition-property: opacity;
|
||
|
|
transition-duration: 200ms;
|
||
|
|
transition-timing-function: cubic-bezier(0.23, 1, 0.320, 1);
|
||
|
|
z-index: -1;
|
||
|
|
}
|
||
|
|
|
||
|
|
#nav[stuck]::after {
|
||
|
|
opacity: 0.5;
|
||
|
|
transition-duration: 600ms;
|
||
|
|
}
|
||
|
|
|
||
|
|
#nav ul {
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: center;
|
||
|
|
font-size: 1.33rem;
|
||
|
|
padding: 0 0.5rem;
|
||
|
|
}
|
||
|
|
#nav li {
|
||
|
|
color: var(--color-dusk);
|
||
|
|
font-family: var(--font-display);
|
||
|
|
font-weight: 400;
|
||
|
|
font-size: var(--size-500);
|
||
|
|
}
|
||
|
|
#nav.invert li {
|
||
|
|
color: white;
|
||
|
|
}
|
||
|
|
#nav li + li {
|
||
|
|
margin-left: 0;
|
||
|
|
}
|
||
|
|
#nav [aria-current="page"] {
|
||
|
|
font-weight: 700;
|
||
|
|
}
|
||
|
|
#nav .logo {
|
||
|
|
font-size: 1rem;
|
||
|
|
margin-right: auto;
|
||
|
|
}
|
||
|
|
#nav .logo a {
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
color: var(--color-midnight);
|
||
|
|
}
|
||
|
|
#nav .logo a:hover,
|
||
|
|
#nav .logo a:focus {
|
||
|
|
color: var(--color-midnight);
|
||
|
|
}
|
||
|
|
#nav .logo a:active {
|
||
|
|
color: var(--color-midnight);
|
||
|
|
}
|
||
|
|
#nav .logo svg {
|
||
|
|
transform: scale(0.8);
|
||
|
|
}
|
||
|
|
#nav .logomark {
|
||
|
|
color: inherit;
|
||
|
|
}
|
||
|
|
#nav.invert .logo svg {
|
||
|
|
color: white;
|
||
|
|
fill: white;
|
||
|
|
}
|
||
|
|
#nav .wordmark {
|
||
|
|
display: none;
|
||
|
|
color: inherit;
|
||
|
|
margin-top: -0.5rem;
|
||
|
|
}
|
||
|
|
#nav .hidden-mobile {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
@media (min-width: 52rem) {
|
||
|
|
#nav {
|
||
|
|
/* height: calc(2px + 4.5rem); */
|
||
|
|
}
|
||
|
|
#nav .logo svg {
|
||
|
|
transform: scale(1);
|
||
|
|
}
|
||
|
|
#nav .wordmark {
|
||
|
|
display: block;
|
||
|
|
}
|
||
|
|
#nav .hidden-mobile {
|
||
|
|
display: block;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
#nav a {
|
||
|
|
display: flex;
|
||
|
|
height: 100%;
|
||
|
|
color: var(--color-midnight);
|
||
|
|
text-decoration: none;
|
||
|
|
transition: all 200ms cubic-bezier(0.165, 0.84, 0.44, 1);
|
||
|
|
transition-property: transform, color;
|
||
|
|
padding: 0 0.5rem;
|
||
|
|
}
|
||
|
|
#nav a:focus,
|
||
|
|
#nav a:hover {
|
||
|
|
color: var(--color-purple);
|
||
|
|
}
|
||
|
|
#nav a:active {
|
||
|
|
color: var(--color-blue);
|
||
|
|
}
|
||
|
|
|
||
|
|
#nav .icon a svg {
|
||
|
|
transform: scale(0.9);
|
||
|
|
}
|
||
|
|
|
||
|
|
#nav .icon a:focus svg,
|
||
|
|
#nav .icon a:hover svg {
|
||
|
|
transform: scale(1);
|
||
|
|
}
|
||
|
|
|
||
|
|
#nav [astro-icon="logo"] {
|
||
|
|
margin-right: 0.25em;
|
||
|
|
transform: translateY(0.5em);
|
||
|
|
}
|
||
|
|
|
||
|
|
.checklist {
|
||
|
|
font-size: var(--size-500);
|
||
|
|
--marker-size: 3rem;
|
||
|
|
display: grid;
|
||
|
|
gap: 0.75rem;
|
||
|
|
margin: 0 auto;
|
||
|
|
padding: 0;
|
||
|
|
list-style: none;
|
||
|
|
grid-template-columns: repeat(1, minmax(0, 1fr));
|
||
|
|
justify-content: center;
|
||
|
|
width: 100%;
|
||
|
|
max-width: 72rem;
|
||
|
|
list-style: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
@media (min-width: 24rem) {
|
||
|
|
.checklist {
|
||
|
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||
|
|
justify-content: flex-start;
|
||
|
|
}
|
||
|
|
.checklist-item {
|
||
|
|
margin-left: 2rem;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
@media (min-width: 40rem) {
|
||
|
|
.checklist {
|
||
|
|
padding: 0 1.5rem;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
@media (min-width: 52rem) {
|
||
|
|
.checklist {
|
||
|
|
grid-template-columns: repeat(var(--cols), minmax(0, 1fr));
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.checklist > li {
|
||
|
|
position: relative;
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
}
|
||
|
|
|
||
|
|
.checklist-marker {
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: center;
|
||
|
|
width: var(--marker-size);
|
||
|
|
height: var(--marker-size);
|
||
|
|
background: var(--color-dawn);
|
||
|
|
color: var(--color-midnight);
|
||
|
|
border-radius: 50%;
|
||
|
|
margin-right: 1rem;
|
||
|
|
}
|
||
|
|
|
||
|
|
.checklist-text {
|
||
|
|
font-size: var(--size-600);
|
||
|
|
}
|
||
|
|
|
||
|
|
.checklist > li > svg {
|
||
|
|
width: var(--marker-size);
|
||
|
|
height: var(--marker-size);
|
||
|
|
}
|
||
|
|
|
||
|
|
.egg {
|
||
|
|
position: fixed;
|
||
|
|
top: 0;
|
||
|
|
right: 0;
|
||
|
|
bottom: 0;
|
||
|
|
left: 0;
|
||
|
|
z-index: 10;
|
||
|
|
pointer-events: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
noscript {
|
||
|
|
order: -1;
|
||
|
|
height: 100vh;
|
||
|
|
width: 100vw;
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: center;
|
||
|
|
font-family: var(--font-display);
|
||
|
|
font-size: var(--size-600);
|
||
|
|
text-align: center;
|
||
|
|
color: var(--color-midnight);
|
||
|
|
background: linear-gradient(to bottom, var(--color-tan), white);
|
||
|
|
}
|
||
|
|
noscript::before {
|
||
|
|
--size: var(--size-1000);
|
||
|
|
padding-top: var(--size);
|
||
|
|
padding-left: 1rem;
|
||
|
|
padding-right: 1rem;
|
||
|
|
content: 'You need to enable JavaScript to view this site.';
|
||
|
|
background-size: var(--size);
|
||
|
|
background-position: center top;
|
||
|
|
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 140 140'%3E%3Cg fill='%23514375'%3E%3Cpath d='M129.7 100v20h-10v-20z'/%3E%3Cpath d='M119.69 100h20v10h-20zM10 100v20h10v-20z'/%3E%3Cpath d='M20 100H0v10h20zm0-90H0v10h20z'/%3E%3Cpath d='M20 20V0H10v20zm79.69 30h20v10h-20zm-39.21 0h20v10h-20zM29.73 20h80v10h-80zm-9.97 50h99.93v10H19.76zm10 10h79.93v10H29.76zm-.03 10h20v10h-20zm30.75 0h20v10h-20zm29.21 0h20v10h-20zM19.73 30h100v10h-100zm0 10h100v10h-100zm0 20h100v10h-100zm0-10h20v10h-20zM120 10h20v10h-20z'/%3E%3Cpath d='M120 20V0h10v20z'/%3E%3C/g%3E%3C/svg%3E%0A");
|
||
|
|
}
|
||
|
|
noscript::after {
|
||
|
|
--size: var(--size-1000);
|
||
|
|
content: 'Just kidding—you\'re going to love Astro!';
|
||
|
|
font-size: 0.75em;
|
||
|
|
padding-bottom: var(--size);
|
||
|
|
background-size: var(--size);
|
||
|
|
background-position: 50% 100%;
|
||
|
|
background-image: url("data:image/svg+xml,%3Csvg width='140' height='141' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23af43ff' d='M85 80.325v-20h10v20zM45 80.325v-20h10v20zM65 40.325h10v60H65z'/%3E%3Cpath fill='%23af43ff' d='M55 80.325h30v10H55z'/%3E%3C/svg%3E");
|
||
|
|
animation: bounce 1s steps(4) alternate-reverse infinite;
|
||
|
|
}
|
||
|
|
|
||
|
|
@keyframes bounce {
|
||
|
|
from {
|
||
|
|
background-position: 50% 100%;
|
||
|
|
}
|
||
|
|
to {
|
||
|
|
background-position: 50% calc(100% - 0.5em);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
not-marquee {
|
||
|
|
--color: var(--color-midnight);
|
||
|
|
--height: 2rem;
|
||
|
|
--speed: 25;
|
||
|
|
--gap: var(--size-1000);
|
||
|
|
display: flex;
|
||
|
|
position: relative;
|
||
|
|
width: 100vw;
|
||
|
|
height: var(--height);
|
||
|
|
overflow: hidden;
|
||
|
|
|
||
|
|
border-top: 1px solid var(--color);
|
||
|
|
margin-top: -1px;
|
||
|
|
border-bottom: 1px solid var(--color);
|
||
|
|
font-family: var(--font-display);
|
||
|
|
text-transform: uppercase;
|
||
|
|
font-size: 0.75em;
|
||
|
|
font-weight: 700;
|
||
|
|
letter-spacing: 1px;
|
||
|
|
background: white;
|
||
|
|
z-index: 3;
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
not-marquee::before,
|
||
|
|
not-marquee::after {
|
||
|
|
content: "";
|
||
|
|
width: var(--gap);
|
||
|
|
height: var(--height);
|
||
|
|
position: absolute;
|
||
|
|
top: 0;
|
||
|
|
right: var(--right, auto);
|
||
|
|
bottom: 0;
|
||
|
|
left: var(--left, auto);
|
||
|
|
background: linear-gradient(var(--dir, to right), white, white 5%, rgba(255, 255, 255, 0));
|
||
|
|
z-index: 2;
|
||
|
|
}
|
||
|
|
|
||
|
|
not-marquee::before {
|
||
|
|
--left: calc(var(--height) - 4px);
|
||
|
|
--dir: to right;
|
||
|
|
}
|
||
|
|
not-marquee::after {
|
||
|
|
--right: 0;
|
||
|
|
--dir: to left;
|
||
|
|
}
|
||
|
|
|
||
|
|
not-marquee input[type="checkbox"] {
|
||
|
|
--size: var(--height);
|
||
|
|
-webkit-appearance: none;
|
||
|
|
appearance: none;
|
||
|
|
width: var(--size);
|
||
|
|
height: var(--size);
|
||
|
|
border-radius: 0;
|
||
|
|
z-index: 2;
|
||
|
|
background: white;
|
||
|
|
margin-top: -1px;
|
||
|
|
margin-left: -1px;
|
||
|
|
border: 1px solid var(--color);
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: center;
|
||
|
|
}
|
||
|
|
|
||
|
|
not-marquee input[type="checkbox"]:hover,
|
||
|
|
not-marquee input[type="checkbox"]:focus {
|
||
|
|
background: var(--color-dusk);
|
||
|
|
}
|
||
|
|
|
||
|
|
not-marquee input[type="checkbox"]:active {
|
||
|
|
background: var(--color-purple);
|
||
|
|
}
|
||
|
|
|
||
|
|
not-marquee input[type="checkbox"]:hover::before,
|
||
|
|
not-marquee input[type="checkbox"]:focus::before,
|
||
|
|
not-marquee input[type="checkbox"]:active::before {
|
||
|
|
filter: saturate(0) brightness(0) invert(1);
|
||
|
|
}
|
||
|
|
|
||
|
|
not-marquee input[type="checkbox"]::before {
|
||
|
|
content: "";
|
||
|
|
width: calc(var(--size) * 0.75);
|
||
|
|
height: calc(var(--size) * 0.75);
|
||
|
|
}
|
||
|
|
|
||
|
|
not-marquee input[type="checkbox"]::before {
|
||
|
|
/* Pause */
|
||
|
|
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M14 19h4V5h-4M6 19h4V5H6v14z' fill='%2331274a'%3E%3C/path%3E%3C/svg%3E");
|
||
|
|
}
|
||
|
|
|
||
|
|
not-marquee input[type="checkbox"]:checked::before {
|
||
|
|
/* Play */
|
||
|
|
background-position: -1px center;
|
||
|
|
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M8 5.14v14l11-7l-11-7z' fill='%2331274a'%3E%3C/path%3E%3C/svg%3E");
|
||
|
|
}
|
||
|
|
|
||
|
|
not-marquee input[type="checkbox"]:checked ~ .track,
|
||
|
|
not-marquee .track:hover {
|
||
|
|
animation-play-state: paused;
|
||
|
|
}
|
||
|
|
|
||
|
|
not-marquee .track {
|
||
|
|
height: 100%;
|
||
|
|
width: 100%;
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
|
||
|
|
position: relative;
|
||
|
|
white-space: nowrap;
|
||
|
|
text-decoration: none;
|
||
|
|
color: var(--color);
|
||
|
|
transition: color 300ms cubic-bezier(0.23, 1, 0.320, 1);
|
||
|
|
}
|
||
|
|
|
||
|
|
not-marquee a.track:hover,
|
||
|
|
not-marquee a.track:focus {
|
||
|
|
color: var(--color-purple);
|
||
|
|
}
|
||
|
|
|
||
|
|
not-marquee a.track:active {
|
||
|
|
color: var(--color-blue);
|
||
|
|
}
|
||
|
|
|
||
|
|
not-marquee .group {
|
||
|
|
position: absolute;
|
||
|
|
display: block;
|
||
|
|
animation: marquee calc(var(--speed) * 1s) linear infinite;
|
||
|
|
animation-play-state: inherit;
|
||
|
|
user-select: none;
|
||
|
|
padding-left: var(--gap);
|
||
|
|
}
|
||
|
|
|
||
|
|
@media (prefers-reduced-motion: reduce) {
|
||
|
|
not-marquee .track {
|
||
|
|
animation-play-state: paused;
|
||
|
|
justify-content: flex-start;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
not-marquee .group > span + span {
|
||
|
|
padding-left: var(--gap);
|
||
|
|
}
|
||
|
|
|
||
|
|
@keyframes marquee {
|
||
|
|
from { transform: translateX(calc(100% * var(--i, 0))) }
|
||
|
|
to { transform: translateX(calc(100% * calc(var(--i, 0) - 1))) }
|
||
|
|
}
|
||
|
|
|
||
|
|
.skip-link {
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: center;
|
||
|
|
position: fixed;
|
||
|
|
top: 0;
|
||
|
|
right: 0;
|
||
|
|
left: 0;
|
||
|
|
overflow-x: hidden;
|
||
|
|
text-align: center;
|
||
|
|
|
||
|
|
background-color: white;
|
||
|
|
border-bottom: 1px solid transparent;
|
||
|
|
font-family: var(--font-display);
|
||
|
|
text-transform: uppercase;
|
||
|
|
font-size: 1em;
|
||
|
|
font-weight: 700;
|
||
|
|
letter-spacing: 1px;
|
||
|
|
background: white;
|
||
|
|
z-index: 5;
|
||
|
|
|
||
|
|
/* Visually hidden */
|
||
|
|
clip: rect(0 0 0 0);
|
||
|
|
clip-path: inset(50%);
|
||
|
|
height: 1px;
|
||
|
|
overflow: hidden;
|
||
|
|
position: absolute;
|
||
|
|
white-space: nowrap;
|
||
|
|
width: 1px;
|
||
|
|
}
|
||
|
|
.skip-link:focus {
|
||
|
|
width: 100vw;
|
||
|
|
height: 48px;
|
||
|
|
position: fixed;
|
||
|
|
clip: initial;
|
||
|
|
clip-path: initial;
|
||
|
|
|
||
|
|
background: var(--color-purple);
|
||
|
|
color: white;
|
||
|
|
}
|
||
|
|
|
||
|
|
.🥚 {
|
||
|
|
--cursor-default: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' fill='%2331274a' viewBox='0 0 128 128'%3E%3Cpath fill='%23fff' d='M3.37 0 .11.01C-.05 24.95.04 49.9 0 74.82c.05 13.23-.1 26.46.09 39.68 4.48 0 8.97.04 13.46 0 .12-1.92.15-3.86.15-5.8v-.88h.87c1.91.02 3.82 0 5.72-.01.04-1.96.18-3.92-.03-5.88l-.12-1.1 1.09.15c1.97.25 3.95.08 5.92.04.04-1.88.08-3.77.1-5.65v-.86h.87c1.49.02 2.98 0 4.47-.08l.99-.05-.08.98c-.3 4.12.39 8.24.16 12.36 1.95.06 3.89.09 5.83.1l.85.02.01.84c.04 4.18.03 8.35.1 12.52 1.92.04 3.84.06 5.76.07h.86l.01.85c.03 1.95.05 3.88.04 5.83 4.52.06 9.04.05 13.56.03.16-1.92.24-3.86.1-5.81l-.07-.96.96.03c1.91.05 3.84.03 5.73-.02.07-4.5.04-9 0-13.49-1.94-.05-3.87-.08-5.8-.1h-.84l-.01-.85c-.07-4.18-.04-8.35-.06-12.53-1.93-.07-3.88-.1-5.83-.06l-.92.03.03-.92c.07-1.62.1-3.22.09-4.82v-.87h.87c8.63-.01 17.27 0 25.91-.1.06-4.48.07-8.96-.01-13.44-1.94 0-3.88-.02-5.82-.05h-.85v-.85c-.03-1.94-.05-3.89-.04-5.83a252.3 252.3 0 0 0-5.8-.07h-.85l-.01-.85c-.03-1.93-.04-3.85-.08-5.78-1.93-.09-3.87-.14-5.82-.12l-.88.01v-.88a567 567 0 0 0-.03-5.84 226 226 0 0 1-5.83-.04l-.85-.02v-.85c0-1.9-.02-3.8-.07-5.71-1.92-.1-3.85-.12-5.78-.13h-.86v-.86c-.04-1.94-.06-3.88-.05-5.83-1.95 0-3.89-.02-5.83-.05l-.82-.01-.04-.83c-.07-1.94-.14-3.9-.15-5.84-1.9-.04-3.8-.05-5.7-.05h-.85l-.02-.85a170.8 170.8 0 0 1-.05-5.82c-1.95-.02-3.89-.03-5.83-.06l-.83-.01-.03-.83c-.07-1.94-.1-3.88-.1-5.84-1.94-.04-3.87-.05-5.8-.06h-.86l-.01-.86c-.01-1.93-.03-3.87-.07-5.8l-5.84-.03-.84-.01-.01-.85-.04-5.83c-1.94-.06-3.9-.04-5.86-.03h-.86v-.86A162 162 0 0 0 6.63.01L3.37 0Z'/%3E%3Cpath d='M.1.02C2.3-.01 4.48 0 6.66.02c.1 2.22.14 4.45.14 6.68 2.24-.02 4.48-.02 6.71.05 0 2.22.01 4.45.04 6.67-2.26-.02-4.51-.01-6.77 0-.01 31.42.07 62.83.04 94.25 2.23.02 4.46.03 6.68-.02-.02-2.22 0-4.44.01-6.66 2.23-.03 4.48-.23 6.69.17.36 2.2.16 4.44.1 6.65-2.18.03-4.37.05-6.56.02.02 2.23-.04 4.46-.18 6.68-4.48.03-8.97-.01-13.46 0-.18-13.23-.03-26.46-.08-39.69C.05 49.9-.05 24.96.11.03Z'/%3E%3Cpath d='m13.54 13.42 6.69.04c.05 2.21.06 4.43.08 6.65 2.22 0 4.44.02 6.66.07 0 2.22 0 4.45.11 6.67 2.23.04 4.45.05 6.68.07-.02 2.22 0 4.44.06 6.66 2.19 0 4.38.01 6.57.07 0 2.22.1 4.44.17 6.66 2.21.04 4.44.05 6.66.06-.01 2.22 0 4.44.04 6.66 2.22 0 4.44.03 6.65.15.07 2.2.09 4.38.09 6.58 2.22.06 4.44.07 6.66.06.02 2.22.04 4.45.04 6.68-2.25.12-4.5.1-6.75.04v-6.69c-2.25-.03-4.51-.02-6.77 0 .03-2.26.04-4.51 0-6.76h-6.7l.02-6.7c-2.26-.05-4.52-.04-6.77 0 0-2.26.01-4.52-.01-6.77h-6.7c-.03-2.24-.02-4.49-.04-6.73-2.25 0-4.49 0-6.73-.05.02-2.23.02-4.45 0-6.68-2.22-.02-4.44-.02-6.66 0-.07-2.25-.06-4.5-.05-6.74ZM60.7 60.5a93.2 93.2 0 0 1 6.69.14c.04 2.2.06 4.42.09 6.62 2.22 0 4.43.02 6.65.08-.01 2.22 0 4.45.04 6.68 2.22.03 4.45.05 6.67.05.08 4.48.07 8.95.02 13.43-8.93.1-17.86.1-26.78.12 0 2.2.02 4.4-.1 6.59-2.25.11-4.5.08-6.76.07-.06-4.5-.06-8.99 0-13.48 8.97-.05 17.95.03 26.92-.01.03-2.25.03-4.5 0-6.74-2.24-.02-4.5-.01-6.73-.05v-6.68a296.6 296.6 0 0 0-6.67 0c-.09-2.27-.09-4.54-.04-6.82ZM27 87.48c2.23-.02 4.46-.01 6.69 0 .08 2.3.18 4.62-.13 6.91-2.1.17-4.2.15-6.3.12 0 2.17-.05 4.34-.1 6.51-2.23.05-4.49.28-6.7-.14-.46-2.18-.24-4.44-.2-6.65l6.7-.01c0-2.25 0-4.5.04-6.74Zm6.56 6.92c2.3-.26 4.6-.18 6.9-.14.06 4.47.01 8.95.04 13.43 2.24 0 4.49 0 6.73.04.02 4.46-.04 8.92.03 13.38 4.5.07 9-.14 13.5.12.26 2.24.12 4.5-.07 6.75-4.52.02-9.03.04-13.55-.02 0-2.23-.01-4.45-.06-6.68-2.2 0-4.42-.03-6.63-.07-.07-4.46-.05-8.92-.1-13.37a270.1 270.1 0 0 1-6.67-.12c.24-4.45-.64-8.9-.12-13.33Z'/%3E%3Cpath d='M53.98 94.2a79.3 79.3 0 0 1 6.72.05c.02 4.45-.03 8.91.05 13.38 2.22.02 4.43.04 6.65.1.05 4.5.08 9 .01 13.5-2.21.05-4.44.1-6.65 0-.25-4.48-.04-8.97-.09-13.45-2.25-.05-4.5-.04-6.76-.06 0-4.5-.05-9.01.07-13.51Z'/%3E%3C/svg%3E%0A") 0 0, default;
|
||
|
|
--cursor-pointer: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' fill='%2331274a' viewBox='0 0 128 128'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath fill='%23fff' d='M29.14.42a426.8 426.8 0 0 0-.05 5.06l-.01.71-.7.03c-1.7.05-3.38.07-5.08.08-.09 17.14-.04 34.27-.04 51.4v.74l-.74.01c-1.42.02-2.86.03-4.29.07l-.77.01v-.77c.04-1.67.03-3.35-.01-5.01-5.81-.05-11.63-.08-17.44.02 0 5.79-.02 11.58 0 17.37 1.68.03 3.39.1 5.1-.01l.92-.07-.14.93c-.24 1.67-.08 3.36-.07 5.04 1.6.08 3.23.1 4.85.1h.7l.05.69c.27 3.58.14 7.17.2 10.77 1.67.07 3.35.1 5.03.11l.73.01v.73c.03 3.6.02 7.18.08 10.77 1.69.03 3.38.11 5.09.01l.86-.05-.07.85c-.28 3.6-.04 7.21-.07 10.81 1.65.03 3.29.06 4.93.07h.74v.73c.08 5.55.05 11.1.12 16.65 9.57.13 19.15.15 28.73.14 9.8-.02 19.6.06 29.41-.17-.15-5.53.34-11.06.11-16.59l-.02-.8.79.03c1.64.04 3.3.01 4.93-.04.06-5.5.07-11 .07-16.51v-.68l.67-.07c1.68-.16 3.36-.17 5.05-.16.04-6.16-.07-12.32.12-18.48v-.03c-.2-7.4-.06-14.81-.15-22.22-1.66.01-3.32 0-4.97-.03h-.72l-.02-.73a135.9 135.9 0 0 1-.02-4.91c-1.7-.05-3.4 0-5.1-.1l-.64-.03-.05-.66c-.12-1.7-.06-3.41-.09-5.13-3.6-.02-7.22.01-10.82-.04h-.73l-.01-.74c-.03-1.63-.05-3.26-.03-4.9-5.54-.29-11.1-.1-16.64-.16l-.71-.01-.03-.7c-.07-1.68-.1-3.37-.1-5.06-3.6-.02-7.2 0-10.8-.07l-.73-.02v-.72c-.08-7.46-.04-14.92-.06-22.38a371.76 371.76 0 0 0-5.03 0h-.77l.01-.76c.03-1.72.02-3.43-.14-5.13-3.81.01-7.62.02-11.43 0Z'/%3E%3Cpath d='M29.13.42c3.81.02 7.63.01 11.44 0 .18 1.92.17 3.84.14 5.75-3.88.04-7.75 0-11.63.04.02-1.93.02-3.86.05-5.79ZM23.3 6.3c1.93-.01 3.86 0 5.78-.09 0 21.32.04 42.63.02 63.95-1.94.04-3.88.04-5.83 0-.03-1.9-.03-3.82 0-5.73-1.94-.08-3.87-.07-5.8-.06a81.5 81.5 0 0 1 0-5.85c1.93-.07 3.86-.05 5.79-.08 0-17.38-.05-34.76.04-52.14Zm17.43 0c1.92-.02 3.84 0 5.77.01.02 7.7-.03 15.42.05 23.12 3.85.1 7.7.05 11.54.07 0 1.92 0 3.84.11 5.77 5.79.09 11.59-.14 17.37.16-.02 1.88-.01 3.76.03 5.64 3.85.07 7.71.02 11.57.04.02 1.93-.1 3.87.1 5.8 1.92.16 3.84.06 5.76.12-.03 1.88-.01 3.76.04 5.64 1.9.03 3.8.05 5.7.03.09 7.42-.06 14.83.15 22.23-.2 6.17-.08 12.34-.12 18.5a43.63 43.63 0 0 0-5.72.22c0 5.73-.01 11.47-.07 17.2-1.9.06-3.82.12-5.72.03-.21-5.83-.11-11.67-.06-17.51 1.92.02 3.84.02 5.76 0L93 52.72c-1.92-.03-3.83-.02-5.75 0-.1-1.89.02-3.78-.13-5.66-1.9-.37-3.85-.15-5.77-.15-.04 5.8.07 11.62-.04 17.44h-5.7c-.13-7.75 0-15.5-.04-23.26-3.89-.02-7.78 0-11.66 0 0 5.81.06 11.62 0 17.43-1.93.04-3.86.04-5.78 0-.04-7.75-.04-15.5.05-23.24-3.89-.02-7.78-.03-11.67.02-.04 7.74.03 15.48 0 23.22-1.94.05-3.9.06-5.84 0 0-17.4.02-34.8.05-52.21ZM0 52.76c5.82-.1 11.64-.06 17.45-.01.04 1.92.07 3.84.02 5.77-3.86.1-7.71.02-11.57.05-.14 3.84.2 7.7-.05 11.53-1.95.22-3.9.07-5.85.03V52.76Zm6 17.47c1.87-.3 3.77-.18 5.65-.13.04 1.94.04 3.88.02 5.82 1.95.01 3.88 0 5.82.03.05 3.87 0 7.73.03 11.6 1.91-.02 3.83-.01 5.75.01-.03 3.88.25 7.79-.14 11.64-1.9.17-3.79.04-5.67 0-.06-3.82-.05-7.65-.09-11.48-1.92-.01-3.84-.05-5.76-.13-.06-3.81.13-7.63-.22-11.44a115 115 0 0 1-5.57-.12c0-1.94-.26-3.9.18-5.8Z'/%3E%3Cpath d='M23.39 99.23c1.9-.15 3.8-.06 5.7-.05.06 3.86.01 7.71.02 11.57 1.94-.01 3.88-.01 5.82.06.03 3.85-.04 7.71.02 11.57 15.46.04 30.92.03 46.38.02.06-3.86-.01-7.72.03-11.58 1.98-.03 3.95-.05 5.93.06.32 5.78-.25 11.57-.09 17.37-9.8.23-19.6.15-29.4.16-9.59.01-19.16 0-28.73-.13-.08-5.8-.04-11.59-.13-17.37-1.89 0-3.78-.04-5.67-.07.03-3.87-.28-7.77.12-11.61Z'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23fff' d='M0 0h128v128H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E") 8 0, pointer;
|
||
|
|
|
||
|
|
cursor: var(--cursor-default);
|
||
|
|
}
|
||
|
|
|
||
|
|
.🥚 :is(a, button, input[type="checkbox"]) {
|
||
|
|
cursor: var(--cursor-pointer);
|
||
|
|
}
|