|
|
@@ -1,1554 +0,0 @@
|
|
|
-*, ::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: ;
|
|
|
-}
|
|
|
-
|
|
|
-/*
|
|
|
-! tailwindcss v3.4.14 | MIT License | https://tailwindcss.com
|
|
|
-*/
|
|
|
-
|
|
|
-/*
|
|
|
-1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
|
|
|
-2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
|
|
|
-*/
|
|
|
-
|
|
|
-*,
|
|
|
-::before,
|
|
|
-::after {
|
|
|
- box-sizing: border-box;
|
|
|
- /* 1 */
|
|
|
- border-width: 0;
|
|
|
- /* 2 */
|
|
|
- border-style: solid;
|
|
|
- /* 2 */
|
|
|
- border-color: #e5e7eb;
|
|
|
- /* 2 */
|
|
|
-}
|
|
|
-
|
|
|
-::before,
|
|
|
-::after {
|
|
|
- --tw-content: '';
|
|
|
-}
|
|
|
-
|
|
|
-/*
|
|
|
-1. Use a consistent sensible line-height in all browsers.
|
|
|
-2. Prevent adjustments of font size after orientation changes in iOS.
|
|
|
-3. Use a more readable tab size.
|
|
|
-4. Use the user's configured `sans` font-family by default.
|
|
|
-5. Use the user's configured `sans` font-feature-settings by default.
|
|
|
-6. Use the user's configured `sans` font-variation-settings by default.
|
|
|
-7. Disable tap highlights on iOS
|
|
|
-*/
|
|
|
-
|
|
|
-html,
|
|
|
-:host {
|
|
|
- line-height: 1.5;
|
|
|
- /* 1 */
|
|
|
- -webkit-text-size-adjust: 100%;
|
|
|
- /* 2 */
|
|
|
- -moz-tab-size: 4;
|
|
|
- /* 3 */
|
|
|
- -o-tab-size: 4;
|
|
|
- tab-size: 4;
|
|
|
- /* 3 */
|
|
|
- font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
|
|
|
- /* 4 */
|
|
|
- font-feature-settings: normal;
|
|
|
- /* 5 */
|
|
|
- font-variation-settings: normal;
|
|
|
- /* 6 */
|
|
|
- -webkit-tap-highlight-color: transparent;
|
|
|
- /* 7 */
|
|
|
-}
|
|
|
-
|
|
|
-/*
|
|
|
-1. Remove the margin in all browsers.
|
|
|
-2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.
|
|
|
-*/
|
|
|
-
|
|
|
-body {
|
|
|
- margin: 0;
|
|
|
- /* 1 */
|
|
|
- line-height: inherit;
|
|
|
- /* 2 */
|
|
|
-}
|
|
|
-
|
|
|
-/*
|
|
|
-1. Add the correct height in Firefox.
|
|
|
-2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
|
|
|
-3. Ensure horizontal rules are visible by default.
|
|
|
-*/
|
|
|
-
|
|
|
-hr {
|
|
|
- height: 0;
|
|
|
- /* 1 */
|
|
|
- color: inherit;
|
|
|
- /* 2 */
|
|
|
- border-top-width: 1px;
|
|
|
- /* 3 */
|
|
|
-}
|
|
|
-
|
|
|
-/*
|
|
|
-Add the correct text decoration in Chrome, Edge, and Safari.
|
|
|
-*/
|
|
|
-
|
|
|
-abbr:where([title]) {
|
|
|
- -webkit-text-decoration: underline dotted;
|
|
|
- text-decoration: underline dotted;
|
|
|
-}
|
|
|
-
|
|
|
-/*
|
|
|
-Remove the default font size and weight for headings.
|
|
|
-*/
|
|
|
-
|
|
|
-h1,
|
|
|
-h2,
|
|
|
-h3,
|
|
|
-h4,
|
|
|
-h5,
|
|
|
-h6 {
|
|
|
- font-size: inherit;
|
|
|
- font-weight: inherit;
|
|
|
-}
|
|
|
-
|
|
|
-/*
|
|
|
-Reset links to optimize for opt-in styling instead of opt-out.
|
|
|
-*/
|
|
|
-
|
|
|
-a {
|
|
|
- color: inherit;
|
|
|
- text-decoration: inherit;
|
|
|
-}
|
|
|
-
|
|
|
-/*
|
|
|
-Add the correct font weight in Edge and Safari.
|
|
|
-*/
|
|
|
-
|
|
|
-b,
|
|
|
-strong {
|
|
|
- font-weight: bolder;
|
|
|
-}
|
|
|
-
|
|
|
-/*
|
|
|
-1. Use the user's configured `mono` font-family by default.
|
|
|
-2. Use the user's configured `mono` font-feature-settings by default.
|
|
|
-3. Use the user's configured `mono` font-variation-settings by default.
|
|
|
-4. Correct the odd `em` font sizing in all browsers.
|
|
|
-*/
|
|
|
-
|
|
|
-code,
|
|
|
-kbd,
|
|
|
-samp,
|
|
|
-pre {
|
|
|
- font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
|
|
|
- /* 1 */
|
|
|
- font-feature-settings: normal;
|
|
|
- /* 2 */
|
|
|
- font-variation-settings: normal;
|
|
|
- /* 3 */
|
|
|
- font-size: 1em;
|
|
|
- /* 4 */
|
|
|
-}
|
|
|
-
|
|
|
-/*
|
|
|
-Add the correct font size in all browsers.
|
|
|
-*/
|
|
|
-
|
|
|
-small {
|
|
|
- font-size: 80%;
|
|
|
-}
|
|
|
-
|
|
|
-/*
|
|
|
-Prevent `sub` and `sup` elements from affecting the line height in all browsers.
|
|
|
-*/
|
|
|
-
|
|
|
-sub,
|
|
|
-sup {
|
|
|
- font-size: 75%;
|
|
|
- line-height: 0;
|
|
|
- position: relative;
|
|
|
- vertical-align: baseline;
|
|
|
-}
|
|
|
-
|
|
|
-sub {
|
|
|
- bottom: -0.25em;
|
|
|
-}
|
|
|
-
|
|
|
-sup {
|
|
|
- top: -0.5em;
|
|
|
-}
|
|
|
-
|
|
|
-/*
|
|
|
-1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
|
|
|
-2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
|
|
|
-3. Remove gaps between table borders by default.
|
|
|
-*/
|
|
|
-
|
|
|
-table {
|
|
|
- text-indent: 0;
|
|
|
- /* 1 */
|
|
|
- border-color: inherit;
|
|
|
- /* 2 */
|
|
|
- border-collapse: collapse;
|
|
|
- /* 3 */
|
|
|
-}
|
|
|
-
|
|
|
-/*
|
|
|
-1. Change the font styles in all browsers.
|
|
|
-2. Remove the margin in Firefox and Safari.
|
|
|
-3. Remove default padding in all browsers.
|
|
|
-*/
|
|
|
-
|
|
|
-button,
|
|
|
-input,
|
|
|
-optgroup,
|
|
|
-select,
|
|
|
-textarea {
|
|
|
- font-family: inherit;
|
|
|
- /* 1 */
|
|
|
- font-feature-settings: inherit;
|
|
|
- /* 1 */
|
|
|
- font-variation-settings: inherit;
|
|
|
- /* 1 */
|
|
|
- font-size: 100%;
|
|
|
- /* 1 */
|
|
|
- font-weight: inherit;
|
|
|
- /* 1 */
|
|
|
- line-height: inherit;
|
|
|
- /* 1 */
|
|
|
- letter-spacing: inherit;
|
|
|
- /* 1 */
|
|
|
- color: inherit;
|
|
|
- /* 1 */
|
|
|
- margin: 0;
|
|
|
- /* 2 */
|
|
|
- padding: 0;
|
|
|
- /* 3 */
|
|
|
-}
|
|
|
-
|
|
|
-/*
|
|
|
-Remove the inheritance of text transform in Edge and Firefox.
|
|
|
-*/
|
|
|
-
|
|
|
-button,
|
|
|
-select {
|
|
|
- text-transform: none;
|
|
|
-}
|
|
|
-
|
|
|
-/*
|
|
|
-1. Correct the inability to style clickable types in iOS and Safari.
|
|
|
-2. Remove default button styles.
|
|
|
-*/
|
|
|
-
|
|
|
-button,
|
|
|
-input:where([type='button']),
|
|
|
-input:where([type='reset']),
|
|
|
-input:where([type='submit']) {
|
|
|
- -webkit-appearance: button;
|
|
|
- /* 1 */
|
|
|
- background-color: transparent;
|
|
|
- /* 2 */
|
|
|
- background-image: none;
|
|
|
- /* 2 */
|
|
|
-}
|
|
|
-
|
|
|
-/*
|
|
|
-Use the modern Firefox focus style for all focusable elements.
|
|
|
-*/
|
|
|
-
|
|
|
-:-moz-focusring {
|
|
|
- outline: auto;
|
|
|
-}
|
|
|
-
|
|
|
-/*
|
|
|
-Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
|
|
|
-*/
|
|
|
-
|
|
|
-:-moz-ui-invalid {
|
|
|
- box-shadow: none;
|
|
|
-}
|
|
|
-
|
|
|
-/*
|
|
|
-Add the correct vertical alignment in Chrome and Firefox.
|
|
|
-*/
|
|
|
-
|
|
|
-progress {
|
|
|
- vertical-align: baseline;
|
|
|
-}
|
|
|
-
|
|
|
-/*
|
|
|
-Correct the cursor style of increment and decrement buttons in Safari.
|
|
|
-*/
|
|
|
-
|
|
|
-::-webkit-inner-spin-button,
|
|
|
-::-webkit-outer-spin-button {
|
|
|
- height: auto;
|
|
|
-}
|
|
|
-
|
|
|
-/*
|
|
|
-1. Correct the odd appearance in Chrome and Safari.
|
|
|
-2. Correct the outline style in Safari.
|
|
|
-*/
|
|
|
-
|
|
|
-[type='search'] {
|
|
|
- -webkit-appearance: textfield;
|
|
|
- /* 1 */
|
|
|
- outline-offset: -2px;
|
|
|
- /* 2 */
|
|
|
-}
|
|
|
-
|
|
|
-/*
|
|
|
-Remove the inner padding in Chrome and Safari on macOS.
|
|
|
-*/
|
|
|
-
|
|
|
-::-webkit-search-decoration {
|
|
|
- -webkit-appearance: none;
|
|
|
-}
|
|
|
-
|
|
|
-/*
|
|
|
-1. Correct the inability to style clickable types in iOS and Safari.
|
|
|
-2. Change font properties to `inherit` in Safari.
|
|
|
-*/
|
|
|
-
|
|
|
-::-webkit-file-upload-button {
|
|
|
- -webkit-appearance: button;
|
|
|
- /* 1 */
|
|
|
- font: inherit;
|
|
|
- /* 2 */
|
|
|
-}
|
|
|
-
|
|
|
-/*
|
|
|
-Add the correct display in Chrome and Safari.
|
|
|
-*/
|
|
|
-
|
|
|
-summary {
|
|
|
- display: list-item;
|
|
|
-}
|
|
|
-
|
|
|
-/*
|
|
|
-Removes the default spacing and border for appropriate elements.
|
|
|
-*/
|
|
|
-
|
|
|
-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;
|
|
|
-}
|
|
|
-
|
|
|
-/*
|
|
|
-Reset default styling for dialogs.
|
|
|
-*/
|
|
|
-
|
|
|
-dialog {
|
|
|
- padding: 0;
|
|
|
-}
|
|
|
-
|
|
|
-/*
|
|
|
-Prevent resizing textareas horizontally by default.
|
|
|
-*/
|
|
|
-
|
|
|
-textarea {
|
|
|
- resize: vertical;
|
|
|
-}
|
|
|
-
|
|
|
-/*
|
|
|
-1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
|
|
|
-2. Set the default placeholder color to the user's configured gray 400 color.
|
|
|
-*/
|
|
|
-
|
|
|
-input::-moz-placeholder, textarea::-moz-placeholder {
|
|
|
- opacity: 1;
|
|
|
- /* 1 */
|
|
|
- color: #9ca3af;
|
|
|
- /* 2 */
|
|
|
-}
|
|
|
-
|
|
|
-input::placeholder,
|
|
|
-textarea::placeholder {
|
|
|
- opacity: 1;
|
|
|
- /* 1 */
|
|
|
- color: #9ca3af;
|
|
|
- /* 2 */
|
|
|
-}
|
|
|
-
|
|
|
-/*
|
|
|
-Set the default cursor for buttons.
|
|
|
-*/
|
|
|
-
|
|
|
-button,
|
|
|
-[role="button"] {
|
|
|
- cursor: pointer;
|
|
|
-}
|
|
|
-
|
|
|
-/*
|
|
|
-Make sure disabled buttons don't get the pointer cursor.
|
|
|
-*/
|
|
|
-
|
|
|
-:disabled {
|
|
|
- cursor: default;
|
|
|
-}
|
|
|
-
|
|
|
-/*
|
|
|
-1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
|
|
|
-2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
|
|
|
- This can trigger a poorly considered lint error in some tools but is included by design.
|
|
|
-*/
|
|
|
-
|
|
|
-img,
|
|
|
-svg,
|
|
|
-video,
|
|
|
-canvas,
|
|
|
-audio,
|
|
|
-iframe,
|
|
|
-embed,
|
|
|
-object {
|
|
|
- display: block;
|
|
|
- /* 1 */
|
|
|
- vertical-align: middle;
|
|
|
- /* 2 */
|
|
|
-}
|
|
|
-
|
|
|
-/*
|
|
|
-Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
|
|
|
-*/
|
|
|
-
|
|
|
-img,
|
|
|
-video {
|
|
|
- max-width: 100%;
|
|
|
- height: auto;
|
|
|
-}
|
|
|
-
|
|
|
-/* Make elements with the HTML hidden attribute stay hidden by default */
|
|
|
-
|
|
|
-[hidden]:where(:not([hidden="until-found"])) {
|
|
|
- display: none;
|
|
|
-}
|
|
|
-
|
|
|
-.pointer-events-none {
|
|
|
- pointer-events: none;
|
|
|
-}
|
|
|
-
|
|
|
-.fixed {
|
|
|
- position: fixed;
|
|
|
-}
|
|
|
-
|
|
|
-.absolute {
|
|
|
- position: absolute;
|
|
|
-}
|
|
|
-
|
|
|
-.relative {
|
|
|
- position: relative;
|
|
|
-}
|
|
|
-
|
|
|
-.inset-x-0 {
|
|
|
- left: 0px;
|
|
|
- right: 0px;
|
|
|
-}
|
|
|
-
|
|
|
-.inset-x-3 {
|
|
|
- left: 0.75rem;
|
|
|
- right: 0.75rem;
|
|
|
-}
|
|
|
-
|
|
|
-.-bottom-1 {
|
|
|
- bottom: -0.25rem;
|
|
|
-}
|
|
|
-
|
|
|
-.-bottom-\[52px\] {
|
|
|
- bottom: -52px;
|
|
|
-}
|
|
|
-
|
|
|
-.-right-1 {
|
|
|
- right: -0.25rem;
|
|
|
-}
|
|
|
-
|
|
|
-.-right-2 {
|
|
|
- right: -0.5rem;
|
|
|
-}
|
|
|
-
|
|
|
-.-top-2\.5 {
|
|
|
- top: -0.625rem;
|
|
|
-}
|
|
|
-
|
|
|
-.-top-3 {
|
|
|
- top: -0.75rem;
|
|
|
-}
|
|
|
-
|
|
|
-.-top-4 {
|
|
|
- top: -1rem;
|
|
|
-}
|
|
|
-
|
|
|
-.-top-\[5px\] {
|
|
|
- top: -5px;
|
|
|
-}
|
|
|
-
|
|
|
-.bottom-0 {
|
|
|
- bottom: 0px;
|
|
|
-}
|
|
|
-
|
|
|
-.bottom-3 {
|
|
|
- bottom: 0.75rem;
|
|
|
-}
|
|
|
-
|
|
|
-.bottom-\[88px\] {
|
|
|
- bottom: 88px;
|
|
|
-}
|
|
|
-
|
|
|
-.left-5 {
|
|
|
- left: 1.25rem;
|
|
|
-}
|
|
|
-
|
|
|
-.left-\[26px\] {
|
|
|
- left: 26px;
|
|
|
-}
|
|
|
-
|
|
|
-.right-2 {
|
|
|
- right: 0.5rem;
|
|
|
-}
|
|
|
-
|
|
|
-.right-5 {
|
|
|
- right: 1.25rem;
|
|
|
-}
|
|
|
-
|
|
|
-.top-0 {
|
|
|
- top: 0px;
|
|
|
-}
|
|
|
-
|
|
|
-.top-1\/2 {
|
|
|
- top: 50%;
|
|
|
-}
|
|
|
-
|
|
|
-.top-\[56px\] {
|
|
|
- top: 56px;
|
|
|
-}
|
|
|
-
|
|
|
-.z-0 {
|
|
|
- z-index: 0;
|
|
|
-}
|
|
|
-
|
|
|
-.z-10 {
|
|
|
- z-index: 10;
|
|
|
-}
|
|
|
-
|
|
|
-.z-20 {
|
|
|
- z-index: 20;
|
|
|
-}
|
|
|
-
|
|
|
-.mx-auto {
|
|
|
- margin-left: auto;
|
|
|
- margin-right: auto;
|
|
|
-}
|
|
|
-
|
|
|
-.-mt-1 {
|
|
|
- margin-top: -0.25rem;
|
|
|
-}
|
|
|
-
|
|
|
-.-mt-5 {
|
|
|
- margin-top: -1.25rem;
|
|
|
-}
|
|
|
-
|
|
|
-.mb-1 {
|
|
|
- margin-bottom: 0.25rem;
|
|
|
-}
|
|
|
-
|
|
|
-.mb-2 {
|
|
|
- margin-bottom: 0.5rem;
|
|
|
-}
|
|
|
-
|
|
|
-.ml-1 {
|
|
|
- margin-left: 0.25rem;
|
|
|
-}
|
|
|
-
|
|
|
-.mt-1 {
|
|
|
- margin-top: 0.25rem;
|
|
|
-}
|
|
|
-
|
|
|
-.mt-2 {
|
|
|
- margin-top: 0.5rem;
|
|
|
-}
|
|
|
-
|
|
|
-.mt-20 {
|
|
|
- margin-top: 5rem;
|
|
|
-}
|
|
|
-
|
|
|
-.mt-6 {
|
|
|
- margin-top: 1.5rem;
|
|
|
-}
|
|
|
-
|
|
|
-.block {
|
|
|
- display: block;
|
|
|
-}
|
|
|
-
|
|
|
-.inline-block {
|
|
|
- display: inline-block;
|
|
|
-}
|
|
|
-
|
|
|
-.flex {
|
|
|
- display: flex;
|
|
|
-}
|
|
|
-
|
|
|
-.grid {
|
|
|
- display: grid;
|
|
|
-}
|
|
|
-
|
|
|
-.h-1 {
|
|
|
- height: 0.25rem;
|
|
|
-}
|
|
|
-
|
|
|
-.h-12 {
|
|
|
- height: 3rem;
|
|
|
-}
|
|
|
-
|
|
|
-.h-2 {
|
|
|
- height: 0.5rem;
|
|
|
-}
|
|
|
-
|
|
|
-.h-20 {
|
|
|
- height: 5rem;
|
|
|
-}
|
|
|
-
|
|
|
-.h-3 {
|
|
|
- height: 0.75rem;
|
|
|
-}
|
|
|
-
|
|
|
-.h-4 {
|
|
|
- height: 1rem;
|
|
|
-}
|
|
|
-
|
|
|
-.h-5 {
|
|
|
- height: 1.25rem;
|
|
|
-}
|
|
|
-
|
|
|
-.h-6 {
|
|
|
- height: 1.5rem;
|
|
|
-}
|
|
|
-
|
|
|
-.h-7 {
|
|
|
- height: 1.75rem;
|
|
|
-}
|
|
|
-
|
|
|
-.h-8 {
|
|
|
- height: 2rem;
|
|
|
-}
|
|
|
-
|
|
|
-.h-\[160px\] {
|
|
|
- height: 160px;
|
|
|
-}
|
|
|
-
|
|
|
-.h-\[34px\] {
|
|
|
- height: 34px;
|
|
|
-}
|
|
|
-
|
|
|
-.h-auto {
|
|
|
- height: auto;
|
|
|
-}
|
|
|
-
|
|
|
-.h-dvh {
|
|
|
- height: 100dvh;
|
|
|
-}
|
|
|
-
|
|
|
-.h-full {
|
|
|
- height: 100%;
|
|
|
-}
|
|
|
-
|
|
|
-.w-2 {
|
|
|
- width: 0.5rem;
|
|
|
-}
|
|
|
-
|
|
|
-.w-20 {
|
|
|
- width: 5rem;
|
|
|
-}
|
|
|
-
|
|
|
-.w-3 {
|
|
|
- width: 0.75rem;
|
|
|
-}
|
|
|
-
|
|
|
-.w-4 {
|
|
|
- width: 1rem;
|
|
|
-}
|
|
|
-
|
|
|
-.w-44 {
|
|
|
- width: 11rem;
|
|
|
-}
|
|
|
-
|
|
|
-.w-5 {
|
|
|
- width: 1.25rem;
|
|
|
-}
|
|
|
-
|
|
|
-.w-6 {
|
|
|
- width: 1.5rem;
|
|
|
-}
|
|
|
-
|
|
|
-.w-7 {
|
|
|
- width: 1.75rem;
|
|
|
-}
|
|
|
-
|
|
|
-.w-8 {
|
|
|
- width: 2rem;
|
|
|
-}
|
|
|
-
|
|
|
-.w-\[12px\] {
|
|
|
- width: 12px;
|
|
|
-}
|
|
|
-
|
|
|
-.w-\[17px\] {
|
|
|
- width: 17px;
|
|
|
-}
|
|
|
-
|
|
|
-.w-\[5px\] {
|
|
|
- width: 5px;
|
|
|
-}
|
|
|
-
|
|
|
-.w-full {
|
|
|
- width: 100%;
|
|
|
-}
|
|
|
-
|
|
|
-.w-px {
|
|
|
- width: 1px;
|
|
|
-}
|
|
|
-
|
|
|
-.min-w-0 {
|
|
|
- min-width: 0px;
|
|
|
-}
|
|
|
-
|
|
|
-.max-w-\[500px\] {
|
|
|
- max-width: 500px;
|
|
|
-}
|
|
|
-
|
|
|
-.flex-1 {
|
|
|
- flex: 1 1 0%;
|
|
|
-}
|
|
|
-
|
|
|
-.shrink-0 {
|
|
|
- flex-shrink: 0;
|
|
|
-}
|
|
|
-
|
|
|
-.-translate-y-1\/2 {
|
|
|
- --tw-translate-y: -50%;
|
|
|
- transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
|
|
-}
|
|
|
-
|
|
|
-.rotate-\[10deg\] {
|
|
|
- --tw-rotate: 10deg;
|
|
|
- transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
|
|
-}
|
|
|
-
|
|
|
-.rotate-\[15deg\] {
|
|
|
- --tw-rotate: 15deg;
|
|
|
- transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
|
|
-}
|
|
|
-
|
|
|
-.grid-cols-2 {
|
|
|
- grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
|
-}
|
|
|
-
|
|
|
-.grid-cols-3 {
|
|
|
- grid-template-columns: repeat(3, minmax(0, 1fr));
|
|
|
-}
|
|
|
-
|
|
|
-.flex-col {
|
|
|
- flex-direction: column;
|
|
|
-}
|
|
|
-
|
|
|
-.items-start {
|
|
|
- align-items: flex-start;
|
|
|
-}
|
|
|
-
|
|
|
-.items-center {
|
|
|
- align-items: center;
|
|
|
-}
|
|
|
-
|
|
|
-.justify-center {
|
|
|
- justify-content: center;
|
|
|
-}
|
|
|
-
|
|
|
-.justify-between {
|
|
|
- justify-content: space-between;
|
|
|
-}
|
|
|
-
|
|
|
-.gap-0\.5 {
|
|
|
- gap: 0.125rem;
|
|
|
-}
|
|
|
-
|
|
|
-.gap-1 {
|
|
|
- gap: 0.25rem;
|
|
|
-}
|
|
|
-
|
|
|
-.gap-2 {
|
|
|
- gap: 0.5rem;
|
|
|
-}
|
|
|
-
|
|
|
-.gap-3 {
|
|
|
- gap: 0.75rem;
|
|
|
-}
|
|
|
-
|
|
|
-.gap-5 {
|
|
|
- gap: 1.25rem;
|
|
|
-}
|
|
|
-
|
|
|
-.gap-x-1 {
|
|
|
- -moz-column-gap: 0.25rem;
|
|
|
- column-gap: 0.25rem;
|
|
|
-}
|
|
|
-
|
|
|
-.gap-y-1 {
|
|
|
- row-gap: 0.25rem;
|
|
|
-}
|
|
|
-
|
|
|
-.overflow-hidden {
|
|
|
- overflow: hidden;
|
|
|
-}
|
|
|
-
|
|
|
-.overflow-y-auto {
|
|
|
- overflow-y: auto;
|
|
|
-}
|
|
|
-
|
|
|
-.whitespace-nowrap {
|
|
|
- white-space: nowrap;
|
|
|
-}
|
|
|
-
|
|
|
-.rounded {
|
|
|
- border-radius: 0.25rem;
|
|
|
-}
|
|
|
-
|
|
|
-.rounded-2xl {
|
|
|
- border-radius: 1rem;
|
|
|
-}
|
|
|
-
|
|
|
-.rounded-\[12px\] {
|
|
|
- border-radius: 12px;
|
|
|
-}
|
|
|
-
|
|
|
-.rounded-\[20px\] {
|
|
|
- border-radius: 20px;
|
|
|
-}
|
|
|
-
|
|
|
-.rounded-\[32px\] {
|
|
|
- border-radius: 32px;
|
|
|
-}
|
|
|
-
|
|
|
-.rounded-full {
|
|
|
- border-radius: 9999px;
|
|
|
-}
|
|
|
-
|
|
|
-.rounded-lg {
|
|
|
- border-radius: 0.5rem;
|
|
|
-}
|
|
|
-
|
|
|
-.rounded-xl {
|
|
|
- border-radius: 0.75rem;
|
|
|
-}
|
|
|
-
|
|
|
-.rounded-b-\[40px\] {
|
|
|
- border-bottom-right-radius: 40px;
|
|
|
- border-bottom-left-radius: 40px;
|
|
|
-}
|
|
|
-
|
|
|
-.rounded-t-\[32px\] {
|
|
|
- border-top-left-radius: 32px;
|
|
|
- border-top-right-radius: 32px;
|
|
|
-}
|
|
|
-
|
|
|
-.border {
|
|
|
- border-width: 1px;
|
|
|
-}
|
|
|
-
|
|
|
-.border-2 {
|
|
|
- border-width: 2px;
|
|
|
-}
|
|
|
-
|
|
|
-.border-\[1\.8px\] {
|
|
|
- border-width: 1.8px;
|
|
|
-}
|
|
|
-
|
|
|
-.border-\[\#b9b9b9\] {
|
|
|
- --tw-border-opacity: 1;
|
|
|
- border-color: rgb(185 185 185 / var(--tw-border-opacity));
|
|
|
-}
|
|
|
-
|
|
|
-.border-\[\#c2c2c2\] {
|
|
|
- --tw-border-opacity: 1;
|
|
|
- border-color: rgb(194 194 194 / var(--tw-border-opacity));
|
|
|
-}
|
|
|
-
|
|
|
-.border-\[\#ccc\] {
|
|
|
- --tw-border-opacity: 1;
|
|
|
- border-color: rgb(204 204 204 / var(--tw-border-opacity));
|
|
|
-}
|
|
|
-
|
|
|
-.border-white {
|
|
|
- --tw-border-opacity: 1;
|
|
|
- border-color: rgb(255 255 255 / var(--tw-border-opacity));
|
|
|
-}
|
|
|
-
|
|
|
-.border-white\/70 {
|
|
|
- border-color: rgb(255 255 255 / 0.7);
|
|
|
-}
|
|
|
-
|
|
|
-.bg-\[\#0062ff\] {
|
|
|
- --tw-bg-opacity: 1;
|
|
|
- background-color: rgb(0 98 255 / var(--tw-bg-opacity));
|
|
|
-}
|
|
|
-
|
|
|
-.bg-\[\#e6f0ff\] {
|
|
|
- --tw-bg-opacity: 1;
|
|
|
- background-color: rgb(230 240 255 / var(--tw-bg-opacity));
|
|
|
-}
|
|
|
-
|
|
|
-.bg-\[\#ececec\] {
|
|
|
- --tw-bg-opacity: 1;
|
|
|
- background-color: rgb(236 236 236 / var(--tw-bg-opacity));
|
|
|
-}
|
|
|
-
|
|
|
-.bg-\[\#ecf3fd\] {
|
|
|
- --tw-bg-opacity: 1;
|
|
|
- background-color: rgb(236 243 253 / var(--tw-bg-opacity));
|
|
|
-}
|
|
|
-
|
|
|
-.bg-\[\#ee0033\] {
|
|
|
- --tw-bg-opacity: 1;
|
|
|
- background-color: rgb(238 0 51 / var(--tw-bg-opacity));
|
|
|
-}
|
|
|
-
|
|
|
-.bg-\[\#f5f7fb\] {
|
|
|
- --tw-bg-opacity: 1;
|
|
|
- background-color: rgb(245 247 251 / var(--tw-bg-opacity));
|
|
|
-}
|
|
|
-
|
|
|
-.bg-gray-200 {
|
|
|
- --tw-bg-opacity: 1;
|
|
|
- background-color: rgb(229 231 235 / var(--tw-bg-opacity));
|
|
|
-}
|
|
|
-
|
|
|
-.bg-white {
|
|
|
- --tw-bg-opacity: 1;
|
|
|
- background-color: rgb(255 255 255 / var(--tw-bg-opacity));
|
|
|
-}
|
|
|
-
|
|
|
-.bg-white\/15 {
|
|
|
- background-color: rgb(255 255 255 / 0.15);
|
|
|
-}
|
|
|
-
|
|
|
-.bg-white\/20 {
|
|
|
- background-color: rgb(255 255 255 / 0.2);
|
|
|
-}
|
|
|
-
|
|
|
-.object-contain {
|
|
|
- -o-object-fit: contain;
|
|
|
- object-fit: contain;
|
|
|
-}
|
|
|
-
|
|
|
-.object-cover {
|
|
|
- -o-object-fit: cover;
|
|
|
- object-fit: cover;
|
|
|
-}
|
|
|
-
|
|
|
-.px-1 {
|
|
|
- padding-left: 0.25rem;
|
|
|
- padding-right: 0.25rem;
|
|
|
-}
|
|
|
-
|
|
|
-.px-1\.5 {
|
|
|
- padding-left: 0.375rem;
|
|
|
- padding-right: 0.375rem;
|
|
|
-}
|
|
|
-
|
|
|
-.px-2 {
|
|
|
- padding-left: 0.5rem;
|
|
|
- padding-right: 0.5rem;
|
|
|
-}
|
|
|
-
|
|
|
-.px-3 {
|
|
|
- padding-left: 0.75rem;
|
|
|
- padding-right: 0.75rem;
|
|
|
-}
|
|
|
-
|
|
|
-.px-4 {
|
|
|
- padding-left: 1rem;
|
|
|
- padding-right: 1rem;
|
|
|
-}
|
|
|
-
|
|
|
-.px-5 {
|
|
|
- padding-left: 1.25rem;
|
|
|
- padding-right: 1.25rem;
|
|
|
-}
|
|
|
-
|
|
|
-.py-0\.5 {
|
|
|
- padding-top: 0.125rem;
|
|
|
- padding-bottom: 0.125rem;
|
|
|
-}
|
|
|
-
|
|
|
-.py-1 {
|
|
|
- padding-top: 0.25rem;
|
|
|
- padding-bottom: 0.25rem;
|
|
|
-}
|
|
|
-
|
|
|
-.py-1\.5 {
|
|
|
- padding-top: 0.375rem;
|
|
|
- padding-bottom: 0.375rem;
|
|
|
-}
|
|
|
-
|
|
|
-.py-2 {
|
|
|
- padding-top: 0.5rem;
|
|
|
- padding-bottom: 0.5rem;
|
|
|
-}
|
|
|
-
|
|
|
-.py-3 {
|
|
|
- padding-top: 0.75rem;
|
|
|
- padding-bottom: 0.75rem;
|
|
|
-}
|
|
|
-
|
|
|
-.pb-2 {
|
|
|
- padding-bottom: 0.5rem;
|
|
|
-}
|
|
|
-
|
|
|
-.pb-3 {
|
|
|
- padding-bottom: 0.75rem;
|
|
|
-}
|
|
|
-
|
|
|
-.pl-4 {
|
|
|
- padding-left: 1rem;
|
|
|
-}
|
|
|
-
|
|
|
-.pt-10 {
|
|
|
- padding-top: 2.5rem;
|
|
|
-}
|
|
|
-
|
|
|
-.pt-3 {
|
|
|
- padding-top: 0.75rem;
|
|
|
-}
|
|
|
-
|
|
|
-.pt-4 {
|
|
|
- padding-top: 1rem;
|
|
|
-}
|
|
|
-
|
|
|
-.text-center {
|
|
|
- text-align: center;
|
|
|
-}
|
|
|
-
|
|
|
-.align-top {
|
|
|
- vertical-align: top;
|
|
|
-}
|
|
|
-
|
|
|
-.text-2xl {
|
|
|
- font-size: 1.5rem;
|
|
|
- line-height: 2rem;
|
|
|
-}
|
|
|
-
|
|
|
-.text-3xl {
|
|
|
- font-size: 1.875rem;
|
|
|
- line-height: 2.25rem;
|
|
|
-}
|
|
|
-
|
|
|
-.text-\[10\.32px\] {
|
|
|
- font-size: 10.32px;
|
|
|
-}
|
|
|
-
|
|
|
-.text-\[10px\] {
|
|
|
- font-size: 10px;
|
|
|
-}
|
|
|
-
|
|
|
-.text-\[22px\] {
|
|
|
- font-size: 22px;
|
|
|
-}
|
|
|
-
|
|
|
-.text-\[28px\] {
|
|
|
- font-size: 28px;
|
|
|
-}
|
|
|
-
|
|
|
-.text-\[32px\] {
|
|
|
- font-size: 32px;
|
|
|
-}
|
|
|
-
|
|
|
-.text-\[40px\] {
|
|
|
- font-size: 40px;
|
|
|
-}
|
|
|
-
|
|
|
-.text-\[6px\] {
|
|
|
- font-size: 6px;
|
|
|
-}
|
|
|
-
|
|
|
-.text-\[8px\] {
|
|
|
- font-size: 8px;
|
|
|
-}
|
|
|
-
|
|
|
-.text-base {
|
|
|
- font-size: 1rem;
|
|
|
- line-height: 1.5rem;
|
|
|
-}
|
|
|
-
|
|
|
-.text-sm {
|
|
|
- font-size: 0.875rem;
|
|
|
- line-height: 1.25rem;
|
|
|
-}
|
|
|
-
|
|
|
-.text-xs {
|
|
|
- font-size: 0.75rem;
|
|
|
- line-height: 1rem;
|
|
|
-}
|
|
|
-
|
|
|
-.font-bold {
|
|
|
- font-weight: 700;
|
|
|
-}
|
|
|
-
|
|
|
-.font-extrabold {
|
|
|
- font-weight: 800;
|
|
|
-}
|
|
|
-
|
|
|
-.font-medium {
|
|
|
- font-weight: 500;
|
|
|
-}
|
|
|
-
|
|
|
-.font-semibold {
|
|
|
- font-weight: 600;
|
|
|
-}
|
|
|
-
|
|
|
-.uppercase {
|
|
|
- text-transform: uppercase;
|
|
|
-}
|
|
|
-
|
|
|
-.leading-none {
|
|
|
- line-height: 1;
|
|
|
-}
|
|
|
-
|
|
|
-.leading-tight {
|
|
|
- line-height: 1.25;
|
|
|
-}
|
|
|
-
|
|
|
-.tracking-tight {
|
|
|
- letter-spacing: -0.025em;
|
|
|
-}
|
|
|
-
|
|
|
-.text-\[\#002bff\] {
|
|
|
- --tw-text-opacity: 1;
|
|
|
- color: rgb(0 43 255 / var(--tw-text-opacity));
|
|
|
-}
|
|
|
-
|
|
|
-.text-\[\#0062ff\] {
|
|
|
- --tw-text-opacity: 1;
|
|
|
- color: rgb(0 98 255 / var(--tw-text-opacity));
|
|
|
-}
|
|
|
-
|
|
|
-.text-\[\#797979\] {
|
|
|
- --tw-text-opacity: 1;
|
|
|
- color: rgb(121 121 121 / var(--tw-text-opacity));
|
|
|
-}
|
|
|
-
|
|
|
-.text-\[\#8e8e93\] {
|
|
|
- --tw-text-opacity: 1;
|
|
|
- color: rgb(142 142 147 / var(--tw-text-opacity));
|
|
|
-}
|
|
|
-
|
|
|
-.text-black {
|
|
|
- --tw-text-opacity: 1;
|
|
|
- color: rgb(0 0 0 / var(--tw-text-opacity));
|
|
|
-}
|
|
|
-
|
|
|
-.text-gray-700 {
|
|
|
- --tw-text-opacity: 1;
|
|
|
- color: rgb(55 65 81 / var(--tw-text-opacity));
|
|
|
-}
|
|
|
-
|
|
|
-.text-white {
|
|
|
- --tw-text-opacity: 1;
|
|
|
- color: rgb(255 255 255 / var(--tw-text-opacity));
|
|
|
-}
|
|
|
-
|
|
|
-.text-white\/80 {
|
|
|
- color: rgb(255 255 255 / 0.8);
|
|
|
-}
|
|
|
-
|
|
|
-.shadow-md {
|
|
|
- --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
|
|
|
- --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
|
|
|
- box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
|
-}
|
|
|
-
|
|
|
-.filter {
|
|
|
- filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
|
|
|
-}
|
|
|
-
|
|
|
-:root {
|
|
|
- --main-color: #fff;
|
|
|
- --color-primary: #0062ff;
|
|
|
- --color-primary-dark: #001ec7;
|
|
|
- --color-red: #ee0033;
|
|
|
-}
|
|
|
-
|
|
|
-* {
|
|
|
- margin: 0;
|
|
|
- padding: 0;
|
|
|
- box-sizing: border-box;
|
|
|
-}
|
|
|
-
|
|
|
-body {
|
|
|
- background-color: #f5f7fb;
|
|
|
- font-family: 'Bricolage Grotesque', -apple-system, BlinkMacSystemFont, sans-serif;
|
|
|
-}
|
|
|
-
|
|
|
-.font-condensed {
|
|
|
- font-family: 'DIN Condensed', 'Barlow Condensed', 'Bricolage Grotesque', sans-serif;
|
|
|
- font-weight: 700;
|
|
|
- letter-spacing: 0.3px;
|
|
|
-}
|
|
|
-
|
|
|
-.font-futura {
|
|
|
- font-family: 'UTM Futura Extra', 'Futura', 'Helvetica Neue', sans-serif;
|
|
|
- font-weight: 800;
|
|
|
-}
|
|
|
-
|
|
|
-html {
|
|
|
- font-size: 16px;
|
|
|
-}
|
|
|
-
|
|
|
-.main-content {
|
|
|
- background: var(--main-color);
|
|
|
-}
|
|
|
-
|
|
|
-/* ===== Header ===== */
|
|
|
-
|
|
|
-.header-bg {
|
|
|
- background: linear-gradient(180deg, #001ec7 0%, #0062ff 100%);
|
|
|
-}
|
|
|
-
|
|
|
-.header-bg::after {
|
|
|
- content: "";
|
|
|
- position: absolute;
|
|
|
- inset: 0;
|
|
|
- background-image:
|
|
|
- radial-gradient(circle at 20% 30%, rgba(255, 255, 255, 0.08) 0, rgba(255, 255, 255, 0) 30%),
|
|
|
- radial-gradient(circle at 80% 70%, rgba(255, 255, 255, 0.06) 0, rgba(255, 255, 255, 0) 35%);
|
|
|
- pointer-events: none;
|
|
|
-}
|
|
|
-
|
|
|
-/* ===== Gold gradient text ===== */
|
|
|
-
|
|
|
-.text-gold-gradient {
|
|
|
- background: linear-gradient(178deg, #fff6eb 16%, #ffbb32 96%);
|
|
|
- -webkit-background-clip: text;
|
|
|
- background-clip: text;
|
|
|
- -webkit-text-fill-color: transparent;
|
|
|
- color: transparent;
|
|
|
-}
|
|
|
-
|
|
|
-/* ===== Number balls ===== */
|
|
|
-
|
|
|
-.ball {
|
|
|
- width: 44px;
|
|
|
- height: 44px;
|
|
|
- border-radius: 50%;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
- font-weight: 700;
|
|
|
- font-size: 18px;
|
|
|
- color: #fff;
|
|
|
- flex-shrink: 0;
|
|
|
- border: 1.5px solid rgba(0, 98, 255, 0.07);
|
|
|
- filter: drop-shadow(2px 2px 3px rgba(0, 0, 0, 0.45));
|
|
|
- position: relative;
|
|
|
-}
|
|
|
-
|
|
|
-.ball::before {
|
|
|
- content: "";
|
|
|
- position: absolute;
|
|
|
- top: 2.7px;
|
|
|
- right: 2.7px;
|
|
|
- width: 25.14px;
|
|
|
- height: 25.14px;
|
|
|
- border-radius: 50%;
|
|
|
- background: linear-gradient(225deg,
|
|
|
- rgba(255, 255, 255, 0.6) 0%,
|
|
|
- rgba(255, 255, 255, 0) 100%);
|
|
|
- pointer-events: none;
|
|
|
-}
|
|
|
-
|
|
|
-.ball-blue {
|
|
|
- background:
|
|
|
- radial-gradient(circle at 50% 50%,
|
|
|
- #fbfbfb 0%,
|
|
|
- #fbfbfb 50%,
|
|
|
- #c6c7e3 72%,
|
|
|
- #9293cb 90%);
|
|
|
- box-shadow:
|
|
|
- inset 0 0 0 1.5px rgba(30, 63, 232, 0.55),
|
|
|
- inset 0 0 6px 3px rgba(146, 147, 203, 0.6);
|
|
|
- color: #0062ff;
|
|
|
-}
|
|
|
-
|
|
|
-.ball-mini {
|
|
|
- width: 28px;
|
|
|
- height: 28px;
|
|
|
- font-size: 12px;
|
|
|
- border-width: 0.94px;
|
|
|
- filter: drop-shadow(1.31px 1.31px 1.97px rgba(0, 0, 0, 0.45));
|
|
|
-}
|
|
|
-
|
|
|
-.ball-mini::before {
|
|
|
- top: 1.7px;
|
|
|
- right: 1.7px;
|
|
|
- width: 16px;
|
|
|
- height: 16px;
|
|
|
-}
|
|
|
-
|
|
|
-.result-card {
|
|
|
- box-shadow: 0 3px 4px rgba(0, 0, 0, 0.15);
|
|
|
-}
|
|
|
-
|
|
|
-.ball-mb {
|
|
|
- background: radial-gradient(circle at 50% 50%,
|
|
|
- #0062ff 0%,
|
|
|
- #0062ff 60%,
|
|
|
- #0149f0 75%,
|
|
|
- #0231e0 85%,
|
|
|
- #0218d1 92%,
|
|
|
- #0300c2 100%);
|
|
|
- box-shadow: inset 0 0 8px 3px rgba(0, 24, 209, 0.5);
|
|
|
- color: #fff;
|
|
|
- border: 0;
|
|
|
-}
|
|
|
-
|
|
|
-/* ===== Result box ===== */
|
|
|
-
|
|
|
-.result-box {
|
|
|
- background: rgba(255, 255, 255, 0.3);
|
|
|
- backdrop-filter: blur(2px);
|
|
|
- -webkit-backdrop-filter: blur(2px);
|
|
|
- border: 1px solid #fff;
|
|
|
- box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
|
|
|
-}
|
|
|
-
|
|
|
-/* ===== Mega Jackpot banner ===== */
|
|
|
-
|
|
|
-.mega-banner {
|
|
|
- background: linear-gradient(-1.8deg, #050068 3.87%, #0062ff 96.13%);
|
|
|
-}
|
|
|
-
|
|
|
-.mega-amount {
|
|
|
- display: inline-block;
|
|
|
- transform: scaleY(1.35);
|
|
|
- transform-origin: top left;
|
|
|
- font-weight: 700;
|
|
|
-}
|
|
|
-
|
|
|
-.mega-title {
|
|
|
- font-family: 'UTM Futura Extra', 'Bricolage Grotesque', 'Futura', 'Helvetica Neue', sans-serif;
|
|
|
- font-weight: 800;
|
|
|
- font-style: italic;
|
|
|
- letter-spacing: -0.5px;
|
|
|
- text-shadow: 0 2px 4px rgba(0, 0, 0, 0.25);
|
|
|
- -webkit-text-stroke: 0.5px #fff;
|
|
|
-}
|
|
|
-
|
|
|
-.mega-banner::before {
|
|
|
- content: "";
|
|
|
- position: absolute;
|
|
|
- inset: 0;
|
|
|
- background-image:
|
|
|
- radial-gradient(circle at -5% -10%, rgba(255, 255, 255, 0.22) 0, rgba(255, 255, 255, 0) 30%),
|
|
|
- radial-gradient(circle at 105% 0%, rgba(255, 255, 255, 0.20) 0, rgba(255, 255, 255, 0) 28%),
|
|
|
- radial-gradient(circle at 105% 110%, rgba(255, 255, 255, 0.18) 0, rgba(255, 255, 255, 0) 35%),
|
|
|
- radial-gradient(circle at 60% 40%, rgba(255, 255, 255, 0.10) 0, rgba(255, 255, 255, 0) 25%);
|
|
|
- pointer-events: none;
|
|
|
-}
|
|
|
-
|
|
|
-.mega-glow {
|
|
|
- position: absolute;
|
|
|
- width: 193px;
|
|
|
- height: 193px;
|
|
|
- border-radius: 50%;
|
|
|
- background: linear-gradient(270deg, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0.2) 100%);
|
|
|
- pointer-events: none;
|
|
|
- z-index: 0;
|
|
|
-}
|
|
|
-
|
|
|
-.mega-banner::after {
|
|
|
- content: "";
|
|
|
- position: absolute;
|
|
|
- inset: 0;
|
|
|
- pointer-events: none;
|
|
|
- background-image:
|
|
|
- radial-gradient(circle at 62% 28%, #fff 0, #fff 5px, transparent 5.5px),
|
|
|
- radial-gradient(circle at 56% 50%, #fff 0, #fff 7px, transparent 7.5px),
|
|
|
- radial-gradient(circle at 68% 35%, #fff 0, #fff 3px, transparent 3.5px);
|
|
|
-}
|
|
|
-
|
|
|
-/* ===== Play now button ===== */
|
|
|
-
|
|
|
-.play-now-outer {
|
|
|
- border: 1.8px solid rgba(255, 255, 255, 0.5);
|
|
|
- box-shadow: 0 1.8px 8.1px rgba(0, 0, 0, 0.55);
|
|
|
- backdrop-filter: blur(2px);
|
|
|
- -webkit-backdrop-filter: blur(2px);
|
|
|
-}
|
|
|
-
|
|
|
-.play-now-outer::before {
|
|
|
- content: "";
|
|
|
- position: absolute;
|
|
|
- inset: 0;
|
|
|
- border-radius: inherit;
|
|
|
- background: linear-gradient(180deg, rgba(255, 255, 255, 0.61) 0%, rgba(246, 226, 130, 0.6) 100%);
|
|
|
- mix-blend-mode: screen;
|
|
|
- pointer-events: none;
|
|
|
-}
|
|
|
-
|
|
|
-.play-now-ring {
|
|
|
- background: linear-gradient(180deg, #0400ff 0%, #0300b2 100%);
|
|
|
- filter: drop-shadow(0 3.6px 3.6px rgba(0, 0, 0, 0.55));
|
|
|
-}
|
|
|
-
|
|
|
-.play-now-btn {
|
|
|
- background:
|
|
|
- radial-gradient(circle at 50% 50%,
|
|
|
- #0059ff 0%,
|
|
|
- #0443ee 25%,
|
|
|
- #082dde 50%,
|
|
|
- #0c16cd 75%,
|
|
|
- #1000bd 100%);
|
|
|
- box-shadow: inset 1.8px 1.8px 9px rgba(255, 255, 255, 0.55);
|
|
|
- text-align: center;
|
|
|
- font-style: italic;
|
|
|
- font-family: 'Bricolage Grotesque', sans-serif;
|
|
|
- text-shadow: 0 3.6px 3.6px rgba(0, 0, 0, 0.25);
|
|
|
-}
|
|
|
-
|
|
|
-/* ===== Bottom navigation ===== */
|
|
|
-
|
|
|
-.navigation {
|
|
|
- background: linear-gradient(180deg, #ffffff 0%, #f4f6fb 100%);
|
|
|
- box-shadow: 0 -6px 12px 0 rgba(0, 98, 255, 0.25);
|
|
|
-}
|
|
|
-
|
|
|
-.nav-item.active span {
|
|
|
- color: var(--color-primary);
|
|
|
-}
|