|
#root { |
|
max-width: 1280px; |
|
width: 100%; |
|
margin: 0 auto; |
|
padding: 0; |
|
text-align: left; |
|
display: flex; |
|
justify-content: center; |
|
align-items: center; |
|
flex-direction: column; |
|
} |
|
*, |
|
:before, |
|
:after { |
|
--tw-border-spacing-x: 0; |
|
--tw-border-spacing-y: 0; |
|
--tw-translate-x: 0; |
|
--tw-translate-y: 0; |
|
--tw-rotate: 0; |
|
--tw-skew-x: 0; |
|
--tw-skew-y: 0; |
|
--tw-scale-x: 1; |
|
--tw-scale-y: 1; |
|
--tw-pan-x: ; |
|
--tw-pan-y: ; |
|
--tw-pinch-zoom: ; |
|
--tw-scroll-snap-strictness: proximity; |
|
--tw-gradient-from-position: ; |
|
--tw-gradient-via-position: ; |
|
--tw-gradient-to-position: ; |
|
--tw-ordinal: ; |
|
--tw-slashed-zero: ; |
|
--tw-numeric-figure: ; |
|
--tw-numeric-spacing: ; |
|
--tw-numeric-fraction: ; |
|
--tw-ring-inset: ; |
|
--tw-ring-offset-width: 0px; |
|
--tw-ring-offset-color: #fff; |
|
--tw-ring-color: rgb(59 130 246 / 0.5); |
|
--tw-ring-offset-shadow: 0 0 #0000; |
|
--tw-ring-shadow: 0 0 #0000; |
|
--tw-shadow: 0 0 #0000; |
|
--tw-shadow-colored: 0 0 #0000; |
|
--tw-blur: ; |
|
--tw-brightness: ; |
|
--tw-contrast: ; |
|
--tw-grayscale: ; |
|
--tw-hue-rotate: ; |
|
--tw-invert: ; |
|
--tw-saturate: ; |
|
--tw-sepia: ; |
|
--tw-drop-shadow: ; |
|
--tw-backdrop-blur: ; |
|
--tw-backdrop-brightness: ; |
|
--tw-backdrop-contrast: ; |
|
--tw-backdrop-grayscale: ; |
|
--tw-backdrop-hue-rotate: ; |
|
--tw-backdrop-invert: ; |
|
--tw-backdrop-opacity: ; |
|
--tw-backdrop-saturate: ; |
|
--tw-backdrop-sepia: ; |
|
--tw-contain-size: ; |
|
--tw-contain-layout: ; |
|
--tw-contain-paint: ; |
|
--tw-contain-style: ; |
|
} |
|
::backdrop { |
|
--tw-border-spacing-x: 0; |
|
--tw-border-spacing-y: 0; |
|
--tw-translate-x: 0; |
|
--tw-translate-y: 0; |
|
--tw-rotate: 0; |
|
--tw-skew-x: 0; |
|
--tw-skew-y: 0; |
|
--tw-scale-x: 1; |
|
--tw-scale-y: 1; |
|
--tw-pan-x: ; |
|
--tw-pan-y: ; |
|
--tw-pinch-zoom: ; |
|
--tw-scroll-snap-strictness: proximity; |
|
--tw-gradient-from-position: ; |
|
--tw-gradient-via-position: ; |
|
--tw-gradient-to-position: ; |
|
--tw-ordinal: ; |
|
--tw-slashed-zero: ; |
|
--tw-numeric-figure: ; |
|
--tw-numeric-spacing: ; |
|
--tw-numeric-fraction: ; |
|
--tw-ring-inset: ; |
|
--tw-ring-offset-width: 0px; |
|
--tw-ring-offset-color: #fff; |
|
--tw-ring-color: rgb(59 130 246 / 0.5); |
|
--tw-ring-offset-shadow: 0 0 #0000; |
|
--tw-ring-shadow: 0 0 #0000; |
|
--tw-shadow: 0 0 #0000; |
|
--tw-shadow-colored: 0 0 #0000; |
|
--tw-blur: ; |
|
--tw-brightness: ; |
|
--tw-contrast: ; |
|
--tw-grayscale: ; |
|
--tw-hue-rotate: ; |
|
--tw-invert: ; |
|
--tw-saturate: ; |
|
--tw-sepia: ; |
|
--tw-drop-shadow: ; |
|
--tw-backdrop-blur: ; |
|
--tw-backdrop-brightness: ; |
|
--tw-backdrop-contrast: ; |
|
--tw-backdrop-grayscale: ; |
|
--tw-backdrop-hue-rotate: ; |
|
--tw-backdrop-invert: ; |
|
--tw-backdrop-opacity: ; |
|
--tw-backdrop-saturate: ; |
|
--tw-backdrop-sepia: ; |
|
--tw-contain-size: ; |
|
--tw-contain-layout: ; |
|
--tw-contain-paint: ; |
|
--tw-contain-style: ; |
|
} |
|
*, |
|
:before, |
|
:after { |
|
box-sizing: border-box; |
|
border-width: 0; |
|
border-style: solid; |
|
border-color: #e5e7eb; |
|
} |
|
:before, |
|
:after { |
|
--tw-content: ""; |
|
} |
|
html, |
|
:host { |
|
line-height: 1.5; |
|
-webkit-text-size-adjust: 100%; |
|
-moz-tab-size: 4; |
|
-o-tab-size: 4; |
|
tab-size: 4; |
|
font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", |
|
"Segoe UI Emoji", Segoe UI Symbol, "Noto Color Emoji"; |
|
font-feature-settings: normal; |
|
font-variation-settings: normal; |
|
-webkit-tap-highlight-color: transparent; |
|
} |
|
body { |
|
margin: 0; |
|
line-height: inherit; |
|
} |
|
hr { |
|
height: 0; |
|
color: inherit; |
|
border-top-width: 1px; |
|
} |
|
abbr:where([title]) { |
|
-webkit-text-decoration: underline dotted; |
|
text-decoration: underline dotted; |
|
} |
|
h1, |
|
h2, |
|
h3, |
|
h4, |
|
h5, |
|
h6 { |
|
font-size: inherit; |
|
font-weight: inherit; |
|
} |
|
a { |
|
color: inherit; |
|
text-decoration: inherit; |
|
} |
|
b, |
|
strong { |
|
font-weight: bolder; |
|
} |
|
code, |
|
kbd, |
|
samp, |
|
pre { |
|
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, |
|
Liberation Mono, Courier New, monospace; |
|
font-feature-settings: normal; |
|
font-variation-settings: normal; |
|
font-size: 1em; |
|
} |
|
small { |
|
font-size: 80%; |
|
} |
|
sub, |
|
sup { |
|
font-size: 75%; |
|
line-height: 0; |
|
position: relative; |
|
vertical-align: baseline; |
|
} |
|
sub { |
|
bottom: -0.25em; |
|
} |
|
sup { |
|
top: -0.5em; |
|
} |
|
table { |
|
text-indent: 0; |
|
border-color: inherit; |
|
border-collapse: collapse; |
|
} |
|
button, |
|
input, |
|
optgroup, |
|
select, |
|
textarea { |
|
font-family: inherit; |
|
font-feature-settings: inherit; |
|
font-variation-settings: inherit; |
|
font-size: 100%; |
|
font-weight: inherit; |
|
line-height: inherit; |
|
letter-spacing: inherit; |
|
color: inherit; |
|
margin: 0; |
|
padding: 0; |
|
} |
|
button, |
|
select { |
|
text-transform: none; |
|
} |
|
button, |
|
input:where([type="button"]), |
|
input:where([type="reset"]), |
|
input:where([type="submit"]) { |
|
-webkit-appearance: button; |
|
background-color: transparent; |
|
background-image: none; |
|
} |
|
:-moz-focusring { |
|
outline: auto; |
|
} |
|
:-moz-ui-invalid { |
|
box-shadow: none; |
|
} |
|
progress { |
|
vertical-align: baseline; |
|
} |
|
::-webkit-inner-spin-button, |
|
::-webkit-outer-spin-button { |
|
height: auto; |
|
} |
|
[type="search"] { |
|
-webkit-appearance: textfield; |
|
outline-offset: -2px; |
|
} |
|
::-webkit-search-decoration { |
|
-webkit-appearance: none; |
|
} |
|
::-webkit-file-upload-button { |
|
-webkit-appearance: button; |
|
font: inherit; |
|
} |
|
summary { |
|
display: list-item; |
|
} |
|
blockquote, |
|
dl, |
|
dd, |
|
h1, |
|
h2, |
|
h3, |
|
h4, |
|
h5, |
|
h6, |
|
hr, |
|
figure, |
|
p, |
|
pre { |
|
margin: 0; |
|
} |
|
fieldset { |
|
margin: 0; |
|
padding: 0; |
|
} |
|
legend { |
|
padding: 0; |
|
} |
|
ol, |
|
ul, |
|
menu { |
|
list-style: none; |
|
margin: 0; |
|
padding: 0; |
|
} |
|
dialog { |
|
padding: 0; |
|
} |
|
textarea { |
|
resize: vertical; |
|
} |
|
input::-moz-placeholder, |
|
textarea::-moz-placeholder { |
|
opacity: 1; |
|
color: #9ca3af; |
|
} |
|
input::placeholder, |
|
textarea::placeholder { |
|
opacity: 1; |
|
color: #9ca3af; |
|
} |
|
button, |
|
[role="button"] { |
|
cursor: pointer; |
|
} |
|
:disabled { |
|
cursor: default; |
|
} |
|
img, |
|
svg, |
|
video, |
|
canvas, |
|
audio, |
|
iframe, |
|
embed, |
|
object { |
|
display: block; |
|
vertical-align: middle; |
|
} |
|
img, |
|
video { |
|
max-width: 100%; |
|
height: auto; |
|
} |
|
[hidden]:where(:not([hidden="until-found"])) { |
|
display: none; |
|
} |
|
.mb-2 { |
|
margin-bottom: 0.5rem; |
|
} |
|
.ml-1 { |
|
margin-left: 0.25rem; |
|
} |
|
.mt-1 { |
|
margin-top: 0.25rem; |
|
} |
|
.block { |
|
display: block; |
|
} |
|
.inline-block { |
|
display: inline-block; |
|
} |
|
.flex { |
|
display: flex; |
|
} |
|
.h-4 { |
|
height: 1rem; |
|
} |
|
.h-\[200px\] { |
|
height: 150px; |
|
} |
|
.w-4 { |
|
width: 1rem; |
|
} |
|
.w-full { |
|
width: 100%; |
|
} |
|
.max-w-\[720px\] { |
|
max-width: 720px; |
|
} |
|
.flex-col { |
|
flex-direction: column; |
|
} |
|
.items-center { |
|
align-items: center; |
|
} |
|
.justify-center { |
|
justify-content: center; |
|
} |
|
.gap-2 { |
|
gap: 0.5rem; |
|
} |
|
.gap-4 { |
|
gap: 1rem; |
|
} |
|
.gap-5 { |
|
gap: 1.25rem; |
|
} |
|
.self-end { |
|
align-self: flex-end; |
|
} |
|
.overflow-y-auto { |
|
overflow-y: auto; |
|
} |
|
.whitespace-pre-wrap { |
|
white-space: pre-wrap; |
|
} |
|
.rounded-lg { |
|
border-radius: 0.5rem; |
|
} |
|
.border { |
|
border-width: 1px; |
|
} |
|
.border-gray-200 { |
|
--tw-border-opacity: 1; |
|
border-color: rgb(229 231 235 / var(--tw-border-opacity)); |
|
} |
|
.border-gray-300 { |
|
--tw-border-opacity: 1; |
|
border-color: rgb(209 213 219 / var(--tw-border-opacity)); |
|
} |
|
.bg-blue-300 { |
|
--tw-bg-opacity: 1; |
|
background-color: rgb(147 197 253 / var(--tw-bg-opacity)); |
|
} |
|
.bg-gray-100 { |
|
--tw-bg-opacity: 1; |
|
background-color: rgb(243 244 246 / var(--tw-bg-opacity)); |
|
} |
|
.bg-gray-50 { |
|
--tw-bg-opacity: 1; |
|
background-color: rgb(249 250 251 / var(--tw-bg-opacity)); |
|
} |
|
.bg-green-300 { |
|
--tw-bg-opacity: 1; |
|
background-color: rgb(134 239 172 / var(--tw-bg-opacity)); |
|
} |
|
.bg-purple-300 { |
|
--tw-bg-opacity: 1; |
|
background-color: rgb(216 180 254 / var(--tw-bg-opacity)); |
|
} |
|
.bg-red-300 { |
|
--tw-bg-opacity: 1; |
|
background-color: rgb(252 165 165 / var(--tw-bg-opacity)); |
|
} |
|
.bg-white { |
|
--tw-bg-opacity: 1; |
|
background-color: rgb(255 255 255 / var(--tw-bg-opacity)); |
|
} |
|
.bg-yellow-300 { |
|
--tw-bg-opacity: 1; |
|
background-color: rgb(253 224 71 / var(--tw-bg-opacity)); |
|
} |
|
.p-2 { |
|
padding: 0.5rem; |
|
} |
|
.p-2\.5 { |
|
padding: 0.625rem; |
|
} |
|
.px-2 { |
|
padding-left: 0.5rem; |
|
padding-right: 0.5rem; |
|
} |
|
.py-1 { |
|
padding-top: 0.25rem; |
|
padding-bottom: 0.25rem; |
|
} |
|
.text-left { |
|
text-align: left; |
|
} |
|
.font-mono { |
|
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, |
|
Liberation Mono, Courier New, monospace; |
|
} |
|
.text-3xl { |
|
font-size: 1.875rem; |
|
line-height: 2.25rem; |
|
} |
|
.text-5xl { |
|
font-size: 3rem; |
|
line-height: 1; |
|
} |
|
.text-lg { |
|
font-size: 1.125rem; |
|
line-height: 1.75rem; |
|
} |
|
.text-sm { |
|
font-size: 0.875rem; |
|
line-height: 1.25rem; |
|
} |
|
.font-bold { |
|
font-weight: 700; |
|
} |
|
.font-medium { |
|
font-weight: 500; |
|
} |
|
.font-normal { |
|
font-weight: 400; |
|
} |
|
.font-semibold { |
|
font-weight: 600; |
|
} |
|
.uppercase { |
|
text-transform: uppercase; |
|
} |
|
.leading-4 { |
|
line-height: 1rem; |
|
} |
|
.leading-5 { |
|
line-height: 1.25rem; |
|
} |
|
.text-blue-600 { |
|
--tw-text-opacity: 1; |
|
color: rgb(37 99 235 / var(--tw-text-opacity)); |
|
} |
|
.text-gray-900 { |
|
--tw-text-opacity: 1; |
|
color: rgb(17 24 39 / var(--tw-text-opacity)); |
|
} |
|
.underline { |
|
text-decoration-line: underline; |
|
} |
|
:root { |
|
font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif; |
|
line-height: 1.5; |
|
font-weight: 400; |
|
color-scheme: light dark; |
|
color: rgb(54, 54, 54); |
|
background-color: white; |
|
font-synthesis: none; |
|
text-rendering: optimizeLegibility; |
|
-webkit-font-smoothing: antialiased; |
|
-moz-osx-font-smoothing: grayscale; |
|
-webkit-text-size-adjust: 100%; |
|
} |
|
body { |
|
margin: 0; |
|
display: flex; |
|
place-items: center; |
|
min-height: 100vh; |
|
} |
|
.focus\:border-blue-500:focus { |
|
--tw-border-opacity: 1; |
|
border-color: rgb(59 130 246 / var(--tw-border-opacity)); |
|
} |
|
.focus\:ring-blue-500:focus { |
|
--tw-ring-opacity: 1; |
|
--tw-ring-color: rgb(59 130 246 / var(--tw-ring-opacity)); |
|
} |
|
|